/* ================================================================================
   ATB COCKPIT - DESIGN TOKENS
   Source unique de vérité pour toutes les couleurs et variables
   ================================================================================ */

:root {
    /* =========================================================================
       BRAND COLORS (Charte graphique ATB)
       ========================================================================= */
    --cp-brand-rouge: #cd2c24;
    --cp-brand-rouge-light: #e04039;
    --cp-brand-rouge-dark: #a82319;
    --cp-brand-noir: #0d0d0f;
    --cp-brand-gris: #dfdbda;
    --cp-brand-beige: #f9f7f2;

    /* =========================================================================
       DARK THEME - Surfaces (du plus sombre au plus clair)
       ========================================================================= */
    --cp-surface-base: #0a0a0c;         /* Fond de page */
    --cp-surface-raised: #111114;        /* Header, footer */
    --cp-surface-overlay: #1a1a1f;       /* Modales, dropdowns */
    --cp-surface-card: #1c1c22;          /* Cartes, conteneurs */
    --cp-surface-elevated: #25252b;      /* Éléments surélevés dans les cartes */
    --cp-surface-input: #0d0d10;         /* Champs de formulaire */

    /* =========================================================================
       DARK THEME - Borders
       ========================================================================= */
    --cp-border-subtle: #1f1f24;         /* Bordures très discrètes */
    --cp-border-default: #2a2a30;        /* Bordures standard */
    --cp-border-strong: #35353d;         /* Bordures accentuées */
    --cp-border-accent: var(--cp-brand-rouge);

    /* =========================================================================
       DARK THEME - Text
       ========================================================================= */
    --cp-text-primary: #e8eaed;          /* Texte principal (titres, contenu important) */
    --cp-text-secondary: #9ca3af;        /* Texte secondaire (descriptions) */
    --cp-text-muted: #6b7280;            /* Texte discret (hints, placeholders) */
    --cp-text-disabled: #4b5563;         /* Texte désactivé */
    --cp-text-inverse: #0d0d0f;          /* Texte sur fond clair */
    --cp-text-accent: var(--cp-brand-rouge);

    /* =========================================================================
       SEMANTIC COLORS
       ========================================================================= */
    /* Success (Vert) */
    --cp-success: #22c55e;
    --cp-success-light: #4ade80;
    --cp-success-dark: #16a34a;
    --cp-success-bg: rgba(34, 197, 94, 0.15);
    --cp-success-border: rgba(34, 197, 94, 0.3);

    /* Warning (Orange/Ambre) */
    --cp-warning: #f59e0b;
    --cp-warning-light: #fbbf24;
    --cp-warning-dark: #d97706;
    --cp-warning-bg: rgba(245, 158, 11, 0.15);
    --cp-warning-border: rgba(245, 158, 11, 0.3);

    /* Error (Rouge) */
    --cp-error: #ef4444;
    --cp-error-light: #f87171;
    --cp-error-dark: #dc2626;
    --cp-error-bg: rgba(239, 68, 68, 0.15);
    --cp-error-border: rgba(239, 68, 68, 0.3);

    /* Info (Bleu) */
    --cp-info: #3b82f6;
    --cp-info-light: #60a5fa;
    --cp-info-dark: #2563eb;
    --cp-info-bg: rgba(59, 130, 246, 0.15);
    --cp-info-border: rgba(59, 130, 246, 0.3);

    /* =========================================================================
       CATEGORY/TAG COLORS (pour badges sur fond sombre)
       ========================================================================= */
    --cp-cat-emerald: #10b981;
    --cp-cat-emerald-bg: rgba(16, 185, 129, 0.15);
    --cp-cat-emerald-border: rgba(16, 185, 129, 0.4);

    --cp-cat-blue: #3b82f6;
    --cp-cat-blue-bg: rgba(59, 130, 246, 0.15);
    --cp-cat-blue-border: rgba(59, 130, 246, 0.4);

    --cp-cat-purple: #8b5cf6;
    --cp-cat-purple-bg: rgba(139, 92, 246, 0.15);
    --cp-cat-purple-border: rgba(139, 92, 246, 0.4);

    --cp-cat-amber: #f59e0b;
    --cp-cat-amber-bg: rgba(245, 158, 11, 0.15);
    --cp-cat-amber-border: rgba(245, 158, 11, 0.4);

    --cp-cat-cyan: #06b6d4;
    --cp-cat-cyan-bg: rgba(6, 182, 212, 0.15);
    --cp-cat-cyan-border: rgba(6, 182, 212, 0.4);

    /* =========================================================================
       EFFECTS
       ========================================================================= */
    --cp-shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.3);
    --cp-shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.3), 0 2px 4px -1px rgba(0, 0, 0, 0.2);
    --cp-shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.4), 0 4px 6px -2px rgba(0, 0, 0, 0.2);
    --cp-shadow-glow: 0 0 20px rgba(205, 44, 36, 0.4);
    --cp-shadow-glow-success: 0 0 20px rgba(34, 197, 94, 0.3);

    /* =========================================================================
       TYPOGRAPHY
       ========================================================================= */
    --cp-font-sans: 'Lexend', system-ui, -apple-system, sans-serif;
    --cp-font-mono: 'JetBrains Mono', 'Fira Code', ui-monospace, monospace;

    /* =========================================================================
       SPACING (rem based)
       ========================================================================= */
    --cp-space-1: 0.25rem;   /* 4px */
    --cp-space-2: 0.5rem;    /* 8px */
    --cp-space-3: 0.75rem;   /* 12px */
    --cp-space-4: 1rem;      /* 16px */
    --cp-space-5: 1.25rem;   /* 20px */
    --cp-space-6: 1.5rem;    /* 24px */
    --cp-space-8: 2rem;      /* 32px */
    --cp-space-10: 2.5rem;   /* 40px */
    --cp-space-12: 3rem;     /* 48px */

    /* =========================================================================
       BORDER RADIUS
       ========================================================================= */
    --cp-radius-sm: 4px;
    --cp-radius-md: 6px;
    --cp-radius-lg: 8px;
    --cp-radius-xl: 12px;
    --cp-radius-full: 9999px;

    /* =========================================================================
       TRANSITIONS
       ========================================================================= */
    --cp-transition-fast: 150ms cubic-bezier(0.4, 0, 0.2, 1);
    --cp-transition-normal: 250ms cubic-bezier(0.4, 0, 0.2, 1);
    --cp-transition-slow: 400ms cubic-bezier(0.4, 0, 0.2, 1);

    /* =========================================================================
       Z-INDEX SCALE
       ========================================================================= */
    --cp-z-dropdown: 100;
    --cp-z-sticky: 200;
    --cp-z-overlay: 300;
    --cp-z-modal: 400;
    --cp-z-toast: 500;
}