/**
 * Design Tokens - Système de couleurs et variables de design
 *
 * Ce fichier définit toutes les variables CSS (tokens) pour l'application NUKUNTCHE.
 * Ces tokens assurent la cohérence visuelle à travers toute l'application.
 *
 * Utilisation : var(--brand-primary), var(--color-success), etc.
 *
 * @see https://symfony.com/doc/current/frontend/asset_mapper.html
 */

:root {
  /* ========================================
     BRAND COLORS - Couleurs de marque
     ======================================== */

  --brand-primary: #3B82F6;           /* Bleu principal - Boutons, liens, icônes */
  --brand-primary-hover: #2563EB;     /* Bleu hover - État survol */
  --brand-primary-light: #DBEAFE;     /* Bleu clair - Backgrounds légers */
  --brand-primary-dark: #1E40AF;      /* Bleu foncé - Texte sur fond clair */
  --brand-primary-rgb: 59, 130, 246;  /* RGB pour opacité */

  /* Gradient pour logo et éléments premium */
  --brand-gradient: linear-gradient(135deg, #6366F1 0%, #8B5CF6 100%);
  --brand-gradient-hover: linear-gradient(135deg, #4F46E5 0%, #7C3AED 100%);


  /* ========================================
     SEMANTIC COLORS - Couleurs sémantiques
     ======================================== */

  /* Success - Vert pour succès, validation, statuts positifs */
  --color-success: #10B981;
  --color-success-hover: #059669;
  --color-success-light: #D1FAE5;
  --color-success-dark: #047857;
  --color-success-rgb: 16, 185, 129;

  /* Warning - Orange pour avertissements, alertes non critiques */
  --color-warning: #F59E0B;
  --color-warning-hover: #D97706;
  --color-warning-light: #FEF3C7;
  --color-warning-dark: #B45309;
  --color-warning-rgb: 245, 158, 11;

  /* Danger - Rouge pour erreurs, suppressions, actions destructives */
  --color-danger: #EF4444;
  --color-danger-hover: #DC2626;
  --color-danger-light: #FEE2E2;
  --color-danger-dark: #B91C1C;
  --color-danger-rgb: 239, 68, 68;

  /* Info - Cyan pour informations, tooltips, messages informatifs */
  --color-info: #06B6D4;
  --color-info-hover: #0891B2;
  --color-info-light: #CFFAFE;
  --color-info-dark: #0E7490;
  --color-info-rgb: 6, 182, 212;


  /* ========================================
     TEXT COLORS - Couleurs de texte
     ======================================== */

  --color-text-primary: #1E293B;      /* Texte principal - titres, contenu important */
  --color-text-secondary: #64748B;    /* Texte secondaire - descriptions, labels */
  --color-text-muted: #94A3B8;        /* Texte désactivé - placeholders, texte inactif */
  --color-text-inverse: #FFFFFF;      /* Texte sur fond foncé */


  /* ========================================
     BACKGROUND COLORS - Couleurs de fond
     ======================================== */

  --color-bg-primary: #FFFFFF;        /* Fond principal - cards, modales */
  --color-bg-secondary: #F8FAFC;      /* Fond de page - arrière-plan général */
  --color-bg-tertiary: #F1F5F9;       /* Fond alternatif - sections, zones distinctes */
  --color-bg-hover: #F8FAFC;          /* Fond au survol */


  /* ========================================
     BORDER COLORS - Couleurs de bordure
     ======================================== */

  --color-border: #E2E8F0;            /* Bordure par défaut */
  --color-border-light: #F1F5F9;      /* Bordure légère */
  --color-border-dark: #CBD5E1;       /* Bordure accentuée */
  --color-border-focus: var(--brand-primary); /* Bordure au focus */


  /* ========================================
     SHADOWS - Ombres
     ======================================== */

  --shadow-xs: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
  --shadow-sm: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px -1px rgba(0, 0, 0, 0.1);
  --shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -2px rgba(0, 0, 0, 0.1);
  --shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -4px rgba(0, 0, 0, 0.1);
  --shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 8px 10px -6px rgba(0, 0, 0, 0.1);
  --shadow-2xl: 0 25px 50px -12px rgba(0, 0, 0, 0.25);

  /* Ombres colorées */
  --shadow-primary: 0 4px 6px -1px rgba(59, 130, 246, 0.1), 0 2px 4px -2px rgba(59, 130, 246, 0.1);
  --shadow-success: 0 4px 6px -1px rgba(16, 185, 129, 0.1), 0 2px 4px -2px rgba(16, 185, 129, 0.1);
  --shadow-danger: 0 4px 6px -1px rgba(239, 68, 68, 0.1), 0 2px 4px -2px rgba(239, 68, 68, 0.1);


  /* ========================================
     BORDER RADIUS - Coins arrondis
     ======================================== */

  --radius-none: 0;
  --radius-sm: 6px;
  --radius-md: 8px;
  --radius-lg: 12px;
  --radius-xl: 16px;
  --radius-2xl: 24px;
  --radius-full: 9999px;


  /* ========================================
     SPACING - Espacements
     ======================================== */

  --spacing-0: 0;
  --spacing-1: 4px;
  --spacing-2: 8px;
  --spacing-3: 12px;
  --spacing-4: 16px;
  --spacing-5: 20px;
  --spacing-6: 24px;
  --spacing-8: 32px;
  --spacing-10: 40px;
  --spacing-12: 48px;
  --spacing-16: 64px;
  --spacing-20: 80px;
  --spacing-24: 96px;


  /* ========================================
     TYPOGRAPHY - Typographie
     ======================================== */

  --font-family-base: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
  --font-family-heading: 'Plus Jakarta Sans', var(--font-family-base);
  --font-family-mono: 'Courier New', Courier, monospace;

  --font-size-xs: 0.75rem;     /* 12px */
  --font-size-sm: 0.875rem;    /* 14px */
  --font-size-base: 1rem;      /* 16px */
  --font-size-lg: 1.125rem;    /* 18px */
  --font-size-xl: 1.25rem;     /* 20px */
  --font-size-2xl: 1.5rem;     /* 24px */
  --font-size-3xl: 1.875rem;   /* 30px */
  --font-size-4xl: 2.25rem;    /* 36px */

  --font-weight-normal: 400;
  --font-weight-medium: 500;
  --font-weight-semibold: 600;
  --font-weight-bold: 700;

  --line-height-tight: 1.25;
  --line-height-normal: 1.5;
  --line-height-relaxed: 1.75;


  /* ========================================
     TRANSITIONS - Transitions
     ======================================== */

  --transition-fast: 150ms cubic-bezier(0.4, 0, 0.2, 1);
  --transition-base: 200ms cubic-bezier(0.4, 0, 0.2, 1);
  --transition-slow: 300ms cubic-bezier(0.4, 0, 0.2, 1);


  /* ========================================
     Z-INDEX - Empilement
     ======================================== */

  --z-index-dropdown: 1000;
  --z-index-sticky: 1020;
  --z-index-fixed: 1030;
  --z-index-modal-backdrop: 1040;
  --z-index-modal: 1050;
  --z-index-popover: 1060;
  --z-index-tooltip: 1070;
}

/* ========================================
   OVERRIDE THÈME DE BASE
   Le thème (style.css) applique #FE9F43 (orange) sur tous les
   boutons actifs/checked. On force la charte bleue à la place.
   ======================================== */

.btn-check:checked + .btn,
.btn.active,
.btn.show,
.btn:first-child:active,
:not(.btn-check) + .btn:active {
    background-color: var(--brand-primary) !important;
    border-color: var(--brand-primary) !important;
    color: #fff !important;
}

/* ========================================
   OVERRIDE CHECKBOXES
   Les checkboxes Bootstrap par défaut sont trop petits
   et l'état checked est orange (thème de base).
   ======================================== */

.form-check-input {
    width: 1.1em !important;
    height: 1.1em !important;
    border: none !important;
    box-shadow: none !important;
    outline: none !important;
    cursor: pointer;
    accent-color: var(--brand-primary);
    -webkit-appearance: auto;
    appearance: auto;
}

.form-check-input:checked {
    background-color: var(--brand-primary) !important;
    border-color: var(--brand-primary) !important;
}

.form-check-input:focus {
    box-shadow: none !important;
    outline: none !important;
}

/* Supprimer toute bordure sur les conteneurs de checkbox */
.form-check,
.form-check-input,
.form-check label {
    border: none !important;
    outline: none !important;
}

/* Labels de radio/checkbox lisibles en dark mode */
[data-theme=dark] .form-check-label,
[data-theme=dark] .type-vente-card,
[data-theme=dark] .type-vente-content,
[data-theme=dark] .type-vente-label,
[data-theme=dark] label {
    color: #F1F5F9 !important;
}

/* Toggle switch (AIB) en dark mode */
[data-theme=dark] .form-switch .form-check-input {
    background-color: #334155 !important;
    border-color: #475569 !important;
}

[data-theme=dark] .form-switch .form-check-input:checked {
    background-color: var(--brand-primary) !important;
    border-color: var(--brand-primary) !important;
}

/* Checkbox dans les tableaux — alignement */
.table .form-check-input {
    margin-top: 0;
    vertical-align: middle;
}

.btn-check:checked + .btn-outline-secondary,
.btn-outline-secondary.active,
.btn-outline-secondary:active {
    background-color: var(--brand-primary) !important;
    border-color: var(--brand-primary) !important;
    color: #fff !important;
    box-shadow: 0 2px 6px rgba(var(--brand-primary-rgb), 0.25) !important;
    text-decoration: none !important;
}

/* Fix table-borderless : le thème met un fond gris sur les th */
.table-borderless th,
.table-borderless td {
    background: transparent !important;
}

/* Fix card-title : le thème force capitalize */
.card .card-title {
    text-transform: none !important;
}

/* Fix btn-primary : le thème force l'orange #FE9F43, on force le bleu */
.btn-primary,
.btn.btn-primary {
    background-color: var(--brand-primary) !important;
    background: var(--brand-primary) !important;
    border-color: var(--brand-primary) !important;
    color: #fff !important;
    box-shadow: 0 4px 12px rgba(var(--brand-primary-rgb), 0.2) !important;
}

.btn-primary:hover,
.btn.btn-primary:hover,
.btn-primary:focus,
.btn.btn-primary:focus {
    background-color: var(--brand-primary-hover) !important;
    background: var(--brand-primary-hover) !important;
    border-color: var(--brand-primary-hover) !important;
    color: #fff !important;
    box-shadow: 0 6px 16px rgba(var(--brand-primary-rgb), 0.3) !important;
}

/* Fix border-start colorées : le thème force l'orange via border-primary */
.border-primary,
.border-start.border-primary {
    border-color: var(--brand-primary) !important;
}

.border-success,
.border-start.border-success {
    border-color: var(--color-success) !important;
}

.border-info,
.border-start.border-info {
    border-color: var(--color-info) !important;
}

.border-warning,
.border-start.border-warning {
    border-color: var(--color-warning) !important;
}

.border-danger,
.border-start.border-danger {
    border-color: var(--color-danger) !important;
}

/* Fix text-primary : le thème peut forcer l'orange */
.text-primary {
    color: var(--brand-primary) !important;
}

/* Fix bg-primary */
.bg-primary {
    background-color: var(--brand-primary) !important;
}

/* Fix btn-warning : utiliser notre bleu outline au lieu du jaune */
.btn-warning,
.btn.btn-warning {
    background-color: var(--brand-primary) !important;
    background: var(--brand-primary) !important;
    border-color: var(--brand-primary) !important;
    border: 1px solid var(--brand-primary) !important;
    color: #fff !important;
    box-shadow: 0 4px 12px rgba(var(--brand-primary-rgb), 0.2) !important;
}

.btn-warning:hover,
.btn.btn-warning:hover,
.btn-warning:focus,
.btn.btn-warning:focus {
    background-color: var(--brand-primary-hover) !important;
    background: var(--brand-primary-hover) !important;
    border-color: var(--brand-primary-hover) !important;
    color: #fff !important;
}

/* Fix btn-outline-primary : le thème force l'orange */
.btn-outline-primary {
    border-color: var(--brand-primary) !important;
    color: var(--brand-primary) !important;
}

.btn-outline-primary:hover,
.btn-outline-primary:focus,
.btn-outline-primary:active,
.btn-outline-primary.active {
    background-color: var(--brand-primary) !important;
    border-color: var(--brand-primary) !important;
    color: #fff !important;
    box-shadow: 0 2px 6px rgba(var(--brand-primary-rgb), 0.25) !important;
}

/* Supprimer le soulignement sur TOUS les boutons */
.btn,
.btn:hover,
.btn:focus,
.btn:active,
a.btn,
a.btn:hover,
a.btn:focus,
a.btn:active {
    text-decoration: none !important;
}


/* ========================================
   APP FOOTER — Premium SaaS footer
   ======================================== */

.app-footer {
    border-top: 1px solid var(--color-border-light);
    background: linear-gradient(180deg, var(--color-bg-secondary) 0%, #FFFFFF 100%);
    padding: 14px 24px;
}

.app-footer-inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 8px;
}

.app-footer-left,
.app-footer-right {
    display: flex;
    align-items: center;
    gap: 10px;
}

/* Logo-dot : petit carré bleu gradient comme rappel du logo */
.app-footer-logo-dot {
    display: inline-block;
    width: 8px;
    height: 8px;
    border-radius: 2px;
    background: linear-gradient(135deg, var(--brand-primary) 0%, #2563EB 100%);
    margin-right: 2px;
    vertical-align: middle;
}

.app-footer-brand {
    font-size: 12px;
    font-weight: 700;
    color: var(--color-text-primary);
    letter-spacing: 1.5px;
}

.app-footer-sep {
    width: 1px;
    height: 14px;
    background: var(--color-border);
}

.app-footer-copy {
    font-size: 11.5px;
    color: var(--color-text-muted);
    font-weight: 400;
}

/* Status indicator : pastille verte + texte */
.app-footer-status {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 11px;
    color: var(--color-success);
    font-weight: 500;
}

.app-footer-status-dot {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: var(--color-success);
    box-shadow: 0 0 6px rgba(16, 185, 129, 0.4);
    animation: footer-pulse 2s ease-in-out infinite;
}

@keyframes footer-pulse {
    0%, 100% { opacity: 1; box-shadow: 0 0 6px rgba(16, 185, 129, 0.4); }
    50% { opacity: 0.6; box-shadow: 0 0 2px rgba(16, 185, 129, 0.2); }
}

.app-footer-version {
    font-size: 10.5px;
    color: var(--color-text-muted);
    background: var(--color-bg-tertiary);
    padding: 2px 10px;
    border-radius: var(--radius-full);
    font-weight: 600;
    letter-spacing: 0.5px;
    border: 1px solid var(--color-border-light);
}

/* ========================================
   GLOBAL SEARCH — Trigger button + Modal
   ======================================== */

/* Trigger dans la navbar */
.global-search-trigger {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 7px 14px;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
    background: var(--color-bg-secondary);
    color: var(--color-text-muted);
    font-size: 13px;
    cursor: pointer;
    transition: all var(--transition-base);
    min-width: 240px;
}

.global-search-trigger:hover {
    border-color: var(--brand-primary);
    background: #fff;
    box-shadow: 0 0 0 3px rgba(var(--brand-primary-rgb), 0.08);
}

.global-search-trigger i {
    font-size: 16px;
    color: var(--color-text-muted);
}

.global-search-text {
    flex: 1;
    text-align: left;
}

.global-search-kbd {
    font-size: 10px;
    font-family: inherit;
    padding: 2px 6px;
    background: #fff;
    border: 1px solid var(--color-border);
    border-radius: 4px;
    color: var(--color-text-muted);
    font-weight: 600;
    line-height: 1;
}

/* Modal */
.global-search-modal {
    border: none !important;
    border-radius: var(--radius-xl) !important;
    overflow: hidden;
    box-shadow: var(--shadow-2xl) !important;
}

.global-search-input-wrap {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 16px 20px;
    border-bottom: 1px solid var(--color-border-light);
}

.global-search-icon {
    font-size: 20px;
    color: var(--brand-primary);
    flex-shrink: 0;
}

.global-search-input {
    flex: 1;
    border: none;
    outline: none;
    font-size: 16px;
    font-weight: 500;
    color: var(--color-text-primary);
    background: transparent;
}

.global-search-input::placeholder {
    color: var(--color-text-muted);
    font-weight: 400;
}

.global-search-kbd-inside {
    font-size: 10px;
    padding: 2px 6px;
    background: var(--color-bg-tertiary);
    border: 1px solid var(--color-border);
    border-radius: 4px;
    color: var(--color-text-muted);
    font-weight: 600;
}

/* Body résultats */
.global-search-body {
    max-height: 380px;
    overflow-y: auto;
    padding: 8px;
}

.global-search-section-title {
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: var(--color-text-muted);
    padding: 8px 12px 4px;
    margin: 0;
}

.global-search-item {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px 12px;
    border-radius: var(--radius-md);
    color: var(--color-text-primary);
    text-decoration: none;
    transition: background var(--transition-fast);
}

/* Loader / état vide / erreur du serveur */
.global-search-status {
    padding: 18px 16px;
    text-align: center;
    font-size: 13px;
    color: var(--color-text-secondary, #6B7280);
}
.global-search-status .ti {
    margin-right: 4px;
    vertical-align: middle;
}
.global-search-status .ti-loader {
    animation: gs-spin 1s linear infinite;
}
@keyframes gs-spin {
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); }
}

.global-search-item:hover,
.global-search-item-active {
    background: rgba(var(--brand-primary-rgb), 0.06);
    color: var(--brand-primary);
    text-decoration: none;
}

.global-search-item-icon {
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: var(--radius-md);
    background: var(--color-bg-tertiary);
    color: var(--color-text-secondary);
    font-size: 16px;
    flex-shrink: 0;
}

.global-search-item:hover .global-search-item-icon,
.global-search-item-active .global-search-item-icon {
    background: rgba(var(--brand-primary-rgb), 0.1);
    color: var(--brand-primary);
}

.global-search-item-label {
    flex: 1;
    font-size: 14px;
    font-weight: 500;
}

.global-search-item-hint {
    font-size: 12px;
    color: var(--color-text-muted);
    font-weight: 400;
}

/* Footer avec raccourcis clavier */
.global-search-footer {
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 10px 20px;
    border-top: 1px solid var(--color-border-light);
    background: var(--color-bg-secondary);
    font-size: 11px;
    color: var(--color-text-muted);
}

.global-search-footer kbd {
    font-size: 10px;
    padding: 1px 5px;
    background: #fff;
    border: 1px solid var(--color-border);
    border-radius: 3px;
    font-weight: 600;
    margin-right: 2px;
}

/* ========================================
   LOCALE SWITCHER — Sélecteur de langue
   ======================================== */

.locale-trigger {
    font-size: 18px;
    line-height: 1;
}

.locale-flag {
    font-size: 18px;
}

.locale-dropdown {
    min-width: 160px !important;
    padding: 6px !important;
    border-radius: var(--radius-lg) !important;
    border: 1px solid var(--color-border-light) !important;
    box-shadow: var(--shadow-lg) !important;
}

.locale-item {
    display: flex !important;
    align-items: center !important;
    padding: 8px 12px !important;
    border-radius: var(--radius-md) !important;
    font-size: 13px !important;
    font-weight: 500 !important;
}

.locale-item:hover {
    background: rgba(var(--brand-primary-rgb), 0.06) !important;
}

.locale-check {
    font-size: 16px;
    color: var(--brand-primary);
}

/* ========================================
   HEADER — Avatar initiales + harmonisation
   ======================================== */

.header-avatar-initials {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--brand-primary) 0%, #2563EB 100%);
    color: white;
    font-weight: 700;
    font-size: 14px;
    letter-spacing: -0.5px;
    flex-shrink: 0;
}

.header-avatar-initials-lg {
    width: 42px;
    height: 42px;
    font-size: 16px;
}

/* Forcer le badge de notification en bleu */
.nav-item-box .badge.rounded-pill {
    background-color: var(--brand-primary) !important;
}

/* Override hover orange du thème → bleu */
.user-menu .nav-item-box > a:hover {
    color: var(--brand-primary) !important;
}

/* Forcer le header-left à ne pas afficher de logo sur desktop (le sidebar gère ça) */
@media (min-width: 992px) {
    .header-left .logo-normal,
    .header-left .logo-small {
        display: none !important;
    }

    /* Cacher le bouton hamburger mobile sur desktop — le sidebar a son propre toggle */
    .mobile_btn,
    a.mobile_btn {
        display: none !important;
    }
}

/* Fix: stat-card-primary (fond bleu gradient) — forcer le texte blanc sur TOUS les enfants */
.stat-card-primary .card-body h1,
.stat-card-primary .card-body h2,
.stat-card-primary .card-body h3,
.stat-card-primary .card-body h4,
.stat-card-primary .card-body p {
    color: white !important;
}

/* ========================================
   DARK MODE - Mode sombre
   Cible .dark-mode (notre classe) ET [data-theme=dark] (le thème)
   ======================================== */

.dark-mode,
[data-theme=dark] {
  --color-text-primary: #F1F5F9;
  --color-text-secondary: #94A3B8;
  --color-text-muted: #64748B;
  --color-text-inverse: #1E293B;

  --color-bg-primary: #1E293B;
  --color-bg-secondary: #0F172A;
  --color-bg-tertiary: #334155;
  --color-bg-hover: #334155;

  --color-border: #334155;
  --color-border-light: #1E293B;
  --color-border-dark: #64748B;

  --shadow-sm: 0 1px 3px 0 rgba(0, 0, 0, 0.4);
  --shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.4);
  --shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.4);
}

/* --- Cards & conteneurs (sauf stat-card-primary qui garde son gradient) --- */
[data-theme=dark] .card:not(.stat-card-primary) {
    background: #1E293B !important;
    border-color: #334155 !important;
}

[data-theme=dark] .card .card-header {
    background: #1E293B !important;
    border-bottom-color: #334155 !important;
}

[data-theme=dark] .card .card-title {
    color: #F1F5F9 !important;
}

[data-theme=dark] .card-body {
    color: #CBD5E1;
}

/* Texte muted plus lisible en dark */
[data-theme=dark] .text-muted {
    color: #94A3B8 !important;
}

/* --- Tables --- */
[data-theme=dark] .table {
    color: #CBD5E1;
}

[data-theme=dark] .table-light,
[data-theme=dark] .table-light th,
[data-theme=dark] .table-light td {
    background: #334155 !important;
    color: #F1F5F9 !important;
}

[data-theme=dark] .table-hover tbody tr:hover {
    background: rgba(59, 130, 246, 0.06) !important;
}

/* --- Badges --- */
[data-theme=dark] .badge.bg-primary {
    background: rgba(59, 130, 246, 0.25) !important;
    color: #60A5FA !important;
}

[data-theme=dark] .badge.bg-success {
    background: rgba(34, 197, 94, 0.25) !important;
    color: #4ADE80 !important;
}

[data-theme=dark] .badge.bg-secondary {
    background: rgba(100, 116, 139, 0.3) !important;
    color: #94A3B8 !important;
}

/* --- Formulaires --- */
[data-theme=dark] .form-control,
[data-theme=dark] .form-select {
    background: #0F172A !important;
    border-color: #334155 !important;
    color: #F1F5F9 !important;
}

[data-theme=dark] .form-control:focus,
[data-theme=dark] .form-select:focus {
    border-color: var(--brand-primary) !important;
    box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.15) !important;
}

/* --- Boutons outline --- */
[data-theme=dark] .btn-outline-secondary {
    border-color: #475569 !important;
    color: #CBD5E1 !important;
}

[data-theme=dark] .btn-outline-secondary:hover {
    background: #334155 !important;
    border-color: #64748B !important;
    color: #F1F5F9 !important;
}

[data-theme=dark] .btn-outline-primary {
    border-color: rgba(59, 130, 246, 0.4) !important;
    color: #60A5FA !important;
}

[data-theme=dark] .btn-outline-primary:hover {
    background: rgba(59, 130, 246, 0.15) !important;
    color: #93C5FD !important;
}

/* --- Alerts --- */
[data-theme=dark] .alert-warning {
    background: rgba(245, 158, 11, 0.1) !important;
    border-color: rgba(245, 158, 11, 0.2) !important;
    color: #FCD34D !important;
}

[data-theme=dark] .alert-info {
    background: rgba(59, 130, 246, 0.1) !important;
    border-color: rgba(59, 130, 246, 0.2) !important;
    color: #93C5FD !important;
}

/* --- App Footer --- */
[data-theme=dark] .app-footer {
    background: #0F172A !important;
    border-top-color: #1E293B !important;
}

[data-theme=dark] .app-footer-brand {
    color: #F1F5F9;
}

[data-theme=dark] .app-footer-version {
    background: #334155;
    border-color: #475569;
    color: #94A3B8;
}

/* --- Global Search --- */
[data-theme=dark] .global-search-trigger {
    background: #1E293B !important;
    border-color: #334155 !important;
    color: #94A3B8 !important;
}

[data-theme=dark] .global-search-trigger:hover {
    border-color: var(--brand-primary) !important;
    background: #0F172A !important;
}

[data-theme=dark] .global-search-modal {
    background: #1E293B !important;
}

[data-theme=dark] .global-search-input-wrap {
    border-bottom-color: #334155 !important;
}

[data-theme=dark] .global-search-input {
    color: #F1F5F9 !important;
}

[data-theme=dark] .global-search-item {
    color: #CBD5E1;
}

[data-theme=dark] .global-search-item:hover,
[data-theme=dark] .global-search-item-active {
    background: rgba(59, 130, 246, 0.1);
}

[data-theme=dark] .global-search-item-icon {
    background: #334155;
    color: #94A3B8;
}

[data-theme=dark] .global-search-footer {
    background: #0F172A !important;
    border-top-color: #334155 !important;
}

[data-theme=dark] .global-search-footer kbd,
[data-theme=dark] .global-search-kbd,
[data-theme=dark] .global-search-kbd-inside {
    background: #334155 !important;
    border-color: #475569 !important;
    color: #94A3B8 !important;
}

/* --- Dropdown menus --- */
[data-theme=dark] .dropdown-menu {
    background: #1E293B !important;
    border-color: #334155 !important;
}

[data-theme=dark] .dropdown-item {
    color: #CBD5E1 !important;
}

[data-theme=dark] .dropdown-item:hover {
    background: rgba(59, 130, 246, 0.1) !important;
    color: #60A5FA !important;
}

[data-theme=dark] .dropdown-header {
    color: #64748B !important;
}

[data-theme=dark] .dropdown-divider {
    border-color: #334155 !important;
}

/* --- Page wrapper & content background --- */
[data-theme=dark] .page-wrapper,
[data-theme=dark] .page-wrapper .content {
    background: #0F172A !important;
}


/* ========================================
   PRINT MODE - Mode impression
   ======================================== */

@media print {
  :root {
    --shadow-sm: none;
    --shadow-md: none;
    --shadow-lg: none;
    --shadow-xl: none;

    --color-bg-primary: #FFFFFF;
    --color-bg-secondary: #FFFFFF;
    --color-text-primary: #000000;
  }
}