/* 
 * HEADERS CLAIRS ET TEXTES SOMBRES - RDCONNECT
 * En-têtes transparentes/claires avec textes gris foncé/noir
 * Boutons gardent les couleurs thème
 */

/* ========================================
   EN-TÊTES DE CARTES CLAIRS
   ======================================== */

/* Headers de cartes avec fond clair et transparent */
.card-header {
    background: linear-gradient(135deg, rgba(248, 249, 250, 0.9), rgba(255, 255, 255, 0.7)) !important;
    color: #1f2937 !important; /* Texte gris foncé/noir */
    border-bottom: 1px solid rgba(0, 0, 0, 0.08) !important;
    backdrop-filter: blur(8px) !important;
    -webkit-backdrop-filter: blur(8px) !important;
}

/* Titres dans les en-têtes */
.card-header h1,
.card-header h2,
.card-header h3,
.card-header h4,
.card-header h5,
.card-header h6 {
    color: #111827 !important; /* Noir pour les titres */
    font-weight: 600 !important;
}

/* Sous-titres et textes secondaires */
.card-header .text-muted,
.card-header .small,
.card-header small {
    color: #6b7280 !important; /* Gris moyen pour les sous-textes */
}

/* ========================================
   SECTIONS ET HEADERS DE DASHBOARD
   ======================================== */

/* Headers de sections principales */
.section-header,
.dashboard-header,
.page-header {
    background: linear-gradient(135deg, rgba(248, 249, 250, 0.9), rgba(255, 255, 255, 0.7)) !important;
    color: #1f2937 !important;
    padding: 1.5rem !important;
    border-radius: 0.75rem !important;
    border: 1px solid rgba(0, 0, 0, 0.05) !important;
    backdrop-filter: blur(8px) !important;
    -webkit-backdrop-filter: blur(8px) !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1) !important;
}

/* Titres des sections */
.section-title,
.dashboard-title {
    color: #111827 !important;
    font-weight: 700 !important;
    margin-bottom: 0.5rem !important;
}

/* Breadcrumbs et navigation */
.breadcrumb {
    background: transparent !important;
}

.breadcrumb-item {
    color: #6b7280 !important;
}

.breadcrumb-item.active {
    color: #111827 !important;
    font-weight: 500 !important;
}

.breadcrumb-item + .breadcrumb-item::before {
    color: #9ca3af !important;
}

/* ========================================
   STATISTIQUES ET WIDGETS HEADERS
   ======================================== */

/* Headers de widgets/stats */
.widget-header,
.stats-header,
.card .card-title {
    color: #1f2937 !important;
    font-weight: 600 !important;
}

/* Nombres/statistiques */
.stat-number,
.widget-value,
.counter {
    color: #111827 !important;
    font-weight: 700 !important;
}

/* Labels des statistiques */
.stat-label,
.widget-label {
    color: #6b7280 !important;
    font-size: 0.875rem !important;
    font-weight: 500 !important;
}

/* ========================================
   TABLES HEADERS
   ======================================== */

/* En-têtes de tableaux */
.table thead th {
    background: linear-gradient(135deg, rgba(248, 249, 250, 0.9), rgba(255, 255, 255, 0.7)) !important;
    color: #1f2937 !important;
    font-weight: 600 !important;
    border-bottom: 2px solid rgba(0, 0, 0, 0.1) !important;
}

/* DataTables headers */
.dataTables_wrapper .dataTables_length,
.dataTables_wrapper .dataTables_filter,
.dataTables_wrapper .dataTables_info,
.dataTables_wrapper .dataTables_paginate {
    color: #1f2937 !important;
}

/* ========================================
   BOUTONS - GARDENT LES COULEURS THÈME
   ======================================== */

/* Les boutons gardent leurs couleurs d'origine */
.btn-primary {
    background-color: #0891b2 !important;
    border-color: #0891b2 !important;
    color: #ffffff !important;
}

.btn-primary:hover {
    background-color: #0e7490 !important;
    border-color: #0e7490 !important;
    color: #ffffff !important;
}

.btn-outline-primary {
    color: #0891b2 !important;
    border-color: #0891b2 !important;
    background-color: rgba(8, 145, 178, 0.1) !important;
}

.btn-outline-primary:hover {
    color: #ffffff !important;
    background-color: #0891b2 !important;
    border-color: #0891b2 !important;
}

/* Boutons secondaires */
.btn-secondary {
    background-color: #64748b !important;
    border-color: #64748b !important;
    color: #ffffff !important;
}

.btn-secondary:hover {
    background-color: #475569 !important;
    border-color: #475569 !important;
    color: #ffffff !important;
}

/* ========================================
   SIDEBAR - GARDE SON THÈME SOMBRE
   ======================================== */

/* Sidebar reste sombre (pas d'override) */
.main-sidebar {
    /* Garde ses couleurs d'origine */
}

/* Zone du logo garde sa couleur spéciale */
.app-sidebar .main-sidebar-header {
    background: #c5cce5 !important; /* Garde la couleur demandée */
}

/* ========================================
   EFFETS SPÉCIAUX POUR HEADERS
   ======================================== */

/* Effet de survol subtil pour les card headers */
.card-header:hover {
    background: linear-gradient(135deg, rgba(248, 249, 250, 1), rgba(255, 255, 255, 0.9)) !important;
    transition: all 0.3s ease !important;
}

/* Séparateurs subtils */
.header-separator {
    height: 1px !important;
    background: linear-gradient(90deg, transparent, rgba(0, 0, 0, 0.1), transparent) !important;
    margin: 1rem 0 !important;
}

/* ========================================
   RESPONSIVE
   ======================================== */

@media (max-width: 768px) {
    .card-header,
    .section-header,
    .dashboard-header {
        padding: 1rem !important;
        font-size: 0.9rem !important;
    }
    
    .section-title,
    .dashboard-title {
        font-size: 1.25rem !important;
    }
}

/* Mode sombre - ajustements */
@media (prefers-color-scheme: dark) {
    .card-header,
    .section-header,
    .dashboard-header {
        background: linear-gradient(135deg, rgba(55, 65, 81, 0.9), rgba(75, 85, 99, 0.7)) !important;
        color: #e5e7eb !important;
    }
    
    .card-header h1, .card-header h2, .card-header h3, 
    .card-header h4, .card-header h5, .card-header h6 {
        color: #f9fafb !important;
    }
}