/**
 * Design Tokens - Intranet DTISI
 *
 * Source unique de verite pour les variables du design system.
 * Toutes les valeurs de couleurs, espacements, typographies et effets
 * doivent etre definies ici puis referencees via var(--dt-*) dans les
 * autres fichiers CSS.
 *
 * Convention de nommage : --dt-{categorie}-{variante}
 */

:root {
    /* ============================
       COULEURS DE BASE
       ============================ */
    --dt-bg-primary: #000060;
    --dt-bg-secondary: #000050;
    --dt-bg-tertiary: #000040;
    --dt-bg-card: rgba(0, 0, 80, 0.4);
    --dt-bg-card-hover: rgba(0, 0, 70, 0.5);
    --dt-bg-input: rgba(0, 0, 60, 0.5);
    --dt-bg-input-focus: rgba(0, 0, 60, 0.7);
    --dt-bg-header: rgba(0, 0, 70, 0.5);

    /* ============================
       TEXTE
       ============================ */
    --dt-text-primary: #f0f0f0;
    --dt-text-secondary: #b0b0b0;
    --dt-text-tertiary: #d0d0d0;
    --dt-text-white: #ffffff;

    /* ============================
       BORDURES
       ============================ */
    --dt-border-light: rgba(255, 255, 255, 0.1);
    --dt-border-medium: rgba(255, 255, 255, 0.2);
    --dt-border-strong: rgba(255, 255, 255, 0.3);

    /* ============================
       COULEUR ACCENT (primaire UI)
       ============================ */
    --dt-accent: #5dade2;
    --dt-accent-hover: #7ec8f0;

    /* ============================
       COULEURS SEMANTIQUES
       ============================ */
    /* Primary */
    --dt-primary: rgba(0, 123, 255, 0.3);
    --dt-primary-text: #5dade2;
    --dt-primary-border: rgba(93, 173, 226, 0.4);
    --dt-primary-hover: rgba(0, 123, 255, 0.5);

    /* Success */
    --dt-success: rgba(40, 167, 69, 0.3);
    --dt-success-text: #5fd68a;
    --dt-success-border: rgba(95, 214, 138, 0.4);
    --dt-success-hover: rgba(40, 167, 69, 0.5);

    /* Danger */
    --dt-danger: rgba(220, 53, 69, 0.3);
    --dt-danger-text: #f5989d;
    --dt-danger-border: rgba(245, 152, 157, 0.4);
    --dt-danger-hover: rgba(220, 53, 69, 0.5);

    /* Warning */
    --dt-warning: rgba(255, 193, 7, 0.3);
    --dt-warning-text: #ffc107;
    --dt-warning-border: rgba(255, 193, 7, 0.4);
    --dt-warning-hover: rgba(255, 193, 7, 0.5);

    /* Info */
    --dt-info: rgba(23, 162, 184, 0.3);
    --dt-info-text: #7dd5e8;
    --dt-info-border: rgba(125, 213, 232, 0.4);
    --dt-info-hover: rgba(23, 162, 184, 0.5);

    /* Secondary */
    --dt-secondary: rgba(108, 117, 125, 0.3);
    --dt-secondary-text: #b0b0b0;
    --dt-secondary-border: rgba(176, 176, 176, 0.4);
    --dt-secondary-hover: rgba(108, 117, 125, 0.5);

    /* Light */
    --dt-light: rgba(255, 255, 255, 0.1);
    --dt-light-text: #e0e0e0;
    --dt-light-border: rgba(255, 255, 255, 0.2);
    --dt-light-hover: rgba(255, 255, 255, 0.2);

    /* ============================
       TYPOGRAPHIE
       ============================ */
    --dt-font-family: 'Segoe UI', system-ui, -apple-system, sans-serif;
    --dt-font-mono: 'Cascadia Code', 'Fira Code', 'Consolas', monospace;
    --dt-font-size-xs: 0.75rem;
    --dt-font-size-sm: 0.875rem;
    --dt-font-size-base: 1rem;
    --dt-font-size-lg: 1.125rem;
    --dt-font-size-xl: 1.25rem;

    /* ============================
       ESPACEMENTS
       ============================ */
    --dt-space-xs: 0.25rem;
    --dt-space-sm: 0.5rem;
    --dt-space-md: 1rem;
    --dt-space-lg: 1.5rem;
    --dt-space-xl: 2rem;
    --dt-space-2xl: 3rem;

    /* ============================
       RAYONS DE BORDURE
       ============================ */
    --dt-radius-sm: 4px;
    --dt-radius-md: 8px;
    --dt-radius-lg: 12px;
    --dt-radius-pill: 50rem;

    /* ============================
       OMBRES
       ============================ */
    --dt-shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.3);
    --dt-shadow-md: 0 4px 12px rgba(0, 0, 0, 0.4);
    --dt-shadow-lg: 0 10px 40px rgba(0, 0, 0, 0.5);

    /* ============================
       TRANSITIONS
       ============================ */
    --dt-transition-fast: 0.15s ease;
    --dt-transition-normal: 0.2s ease;
    --dt-transition-slow: 0.3s ease;

    /* ============================
       FOCUS & ACCESSIBILITE
       ============================ */
    --dt-focus-ring: 0 0 0 0.2rem rgba(93, 173, 226, 0.25);

    /* ============================
       SCROLLBAR
       ============================ */
    --dt-scrollbar-thumb: rgba(93, 173, 226, 0.4);
    --dt-scrollbar-thumb-hover: rgba(93, 173, 226, 0.6);
    --dt-scrollbar-track: rgba(0, 0, 60, 0.3);

    /* ============================
       NAVIGATION & LAYOUT
       ============================ */
    --dt-nav-height: 56px;
    --dt-sidebar-width: 260px;
    --dt-sidebar-collapsed: 60px;

    /* ============================
       Z-INDEX SCALE
       ============================ */
    --dt-z-dropdown: 1000;
    --dt-z-sticky: 1020;
    --dt-z-navbar: 1030;
    --dt-z-sidebar: 1035;
    --dt-z-modal-backdrop: 1040;
    --dt-z-modal: 1050;
    --dt-z-tooltip: 1070;
    --dt-z-impersonation: 1080;

    /* ============================
       COMPATIBILITE avec les anciens noms
       (dark-theme.css utilisait --bg-*, --color-*, etc.)
       Ces alias permettent une migration progressive.
       ============================ */
    --bg-primary: var(--dt-bg-primary);
    --bg-secondary: var(--dt-bg-secondary);
    --bg-tertiary: var(--dt-bg-tertiary);
    --bg-card: var(--dt-bg-card);
    --bg-card-hover: var(--dt-bg-card-hover);
    --bg-input: var(--dt-bg-input);
    --bg-input-focus: var(--dt-bg-input-focus);

    --text-primary: var(--dt-text-primary);
    --text-secondary: var(--dt-text-secondary);
    --text-tertiary: var(--dt-text-tertiary);

    --border-light: var(--dt-border-light);
    --border-medium: var(--dt-border-medium);
    --border-strong: var(--dt-border-strong);

    --color-primary: var(--dt-primary);
    --color-primary-text: var(--dt-primary-text);
    --color-primary-border: var(--dt-primary-border);
    --color-primary-hover: var(--dt-primary-hover);

    --color-success: var(--dt-success);
    --color-success-text: var(--dt-success-text);
    --color-success-border: var(--dt-success-border);
    --color-success-hover: var(--dt-success-hover);

    --color-danger: var(--dt-danger);
    --color-danger-text: var(--dt-danger-text);
    --color-danger-border: var(--dt-danger-border);
    --color-danger-hover: var(--dt-danger-hover);

    --color-warning: var(--dt-warning);
    --color-warning-text: var(--dt-warning-text);
    --color-warning-border: var(--dt-warning-border);
    --color-warning-hover: var(--dt-warning-hover);

    --color-info: var(--dt-info);
    --color-info-text: var(--dt-info-text);
    --color-info-border: var(--dt-info-border);
    --color-info-hover: var(--dt-info-hover);

    --color-secondary: var(--dt-secondary);
    --color-secondary-text: var(--dt-secondary-text);
    --color-secondary-border: var(--dt-secondary-border);
    --color-secondary-hover: var(--dt-secondary-hover);

    --color-light: var(--dt-light);
    --color-light-text: var(--dt-light-text);
    --color-light-border: var(--dt-light-border);
    --color-light-hover: var(--dt-light-hover);
}