/* Cadena Pirenaica Custom Theme - Subtle Branding */

/* Brand color - Red (used sparingly for warnings/risks) */
:root {
    --cp-red: #DC143C;        /* Cadena Pirenaica red */
    --cp-red-dark: #B01030;   /* Darker red for hover */
    --cp-red-light: #FF6B7A;  /* Lighter red for accents */
}

/* Sidebar - Lighter background for black logo */
.sidebar {
    background-color: #ecf0f1 !important;  /* Light gray background */
    color: #2c3e50 !important;
    border-right: 1px solid #d5d8dc;
}

.sidebar .nav-link {
    color: #5a6c7d !important;
}

.sidebar .nav-link:hover {
    background-color: #dce1e5 !important;
    color: #2c3e50 !important;
}

.sidebar .nav-link.active {
    background-color: #3498db !important;  /* Keep blue for active items */
    color: #fff !important;
    border-left: 4px solid #2980b9;
}

.sidebar .nav-link i {
    color: inherit;
}

.sidebar-brand img {
    /* Logo displays naturally with black text */
    filter: none !important;
}

/* Section headers in sidebar */
.sidebar small {
    color: #7f8c8d !important;
}

/* Primary buttons - Keep blue for standard actions */
.btn-primary {
    background-color: #3498db;
    border-color: #3498db;
}

.btn-primary:hover,
.btn-primary:focus {
    background-color: #2980b9;
    border-color: #2980b9;
}

.btn-outline-primary {
    color: #3498db;
    border-color: #3498db;
}

.btn-outline-primary:hover {
    background-color: #3498db;
    border-color: #3498db;
    color: white;
}

/* Danger buttons - Use RED for risky operations */
.btn-danger {
    background-color: var(--cp-red) !important;
    border-color: var(--cp-red) !important;
}

.btn-danger:hover,
.btn-danger:focus {
    background-color: var(--cp-red-dark) !important;
    border-color: var(--cp-red-dark) !important;
}

.btn-outline-danger {
    color: var(--cp-red);
    border-color: var(--cp-red);
}

.btn-outline-danger:hover {
    background-color: var(--cp-red);
    border-color: var(--cp-red);
    color: white;
}

/* Alert danger - Red for warnings/errors */
.alert-danger {
    border-left: 4px solid var(--cp-red);
    background-color: #fee;
}

/* Danger badges - Red for critical status */
.badge.bg-danger {
    background-color: var(--cp-red) !important;
}

/* Keep logical colors for CRM clarity */
.btn-success,
.badge.bg-success {
    /* Green for success/completed - keep Bootstrap default */
}

.btn-warning,
.badge.bg-warning {
    /* Yellow/orange for warnings - keep Bootstrap default */
}

.btn-info,
.badge.bg-info {
    /* Blue for informational - keep Bootstrap default */
}

.card-header.bg-primary {
    /* Keep blue for primary card headers */
    background-color: #3498db !important;
    border-color: #3498db !important;
}

.badge.bg-primary {
    /* Keep blue for primary badges */
    background-color: #3498db !important;
}

/* Progress bars - Keep blue */
.progress-bar {
    background-color: #3498db;
}

/* Links - Keep blue for standard links */
a {
    color: #3498db;
}

a:hover {
    color: #2980b9;
}

/* Login page styling */
.login-container {
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, #f8f9fa 0%, #ffffff 100%);
}

.login-card {
    max-width: 450px;
    width: 100%;
    border: none;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.1);
    border-radius: 12px;
    overflow: hidden;
}

.login-header {
    background: linear-gradient(135deg, #f8f9fa 0%, #ffffff 100%);
    color: #2c3e50;
    padding: 2rem;
    text-align: center;
    border-bottom: 3px solid var(--cp-red);
}

.login-logo {
    max-width: 280px;
    height: auto;
    margin-bottom: 1rem;
    /* Logo displays naturally with black text and red symbol */
}

.login-body {
    padding: 2rem;
    background-color: white;
}

.login-btn {
    background-color: #3498db;  /* Blue for login action */
    border-color: #3498db;
    color: white;
    padding: 0.75rem;
    font-weight: 600;
    font-size: 1.1rem;
    width: 100%;
    border-radius: 8px;
    transition: all 0.3s ease;
}

.login-btn:hover {
    background-color: #2980b9;
    border-color: #2980b9;
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(52, 152, 219, 0.3);
}

/* Form focus state - Blue accent */
.form-control:focus,
.form-select:focus {
    border-color: #3498db;
    box-shadow: 0 0 0 0.25rem rgba(52, 152, 219, 0.15);
}

/* Red accent only on danger inputs */
.form-control.is-invalid:focus,
.form-select.is-invalid:focus {
    border-color: var(--cp-red);
    box-shadow: 0 0 0 0.25rem rgba(220, 20, 60, 0.15);
}

/* Alert styling - Keep standard colors for clarity */
.alert-info {
    border-left: 4px solid #0dcaf0;
}

.alert-success {
    border-left: 4px solid #198754;
}

.alert-warning {
    border-left: 4px solid #ffc107;
}

/* Content header - neutral styling */
.content-header h2 {
    color: #2c3e50;
}

/* Subtle hover effects on cards */
.card:hover {
    border-color: rgba(0, 0, 0, 0.1);
    transition: border-color 0.3s ease;
}

/* Table header - neutral */
.table thead th {
    border-bottom: 2px solid #dee2e6;
}

/* Red text for dangerous actions */
.text-danger {
    color: var(--cp-red) !important;
}

/* Over-allocation warnings - use red */
.text-warning {
    /* Keep Bootstrap yellow for standard warnings */
}

/* Specific red usage for risky operations */
.btn-danger,
.badge-danger,
.alert-danger {
    /* Red reserved for delete, cancel, errors, over-limits */
}

/* Navbar (if any top navbar exists) */
.navbar {
    background-color: #f8f9fa !important;
    border-bottom: 1px solid #dee2e6;
}

.navbar-brand {
    color: #2c3e50 !important;
}

.navbar .nav-link {
    color: #5a6c7d !important;
}

.navbar .nav-link:hover {
    color: #2c3e50 !important;
}

/* Cadena Pirenaica branding - subtle footer/corner logo */
.cp-brand-footer {
    color: #7f8c8d;
    font-size: 0.85rem;
}

.cp-brand-footer .cp-logo-small {
    height: 20px;
    vertical-align: middle;
    margin-right: 5px;
}

/* Red only for:
   - Delete buttons
   - Cancel operations
   - Error alerts
   - Over-allocation warnings
   - Failed status
   - Validation errors
*/