/* Design tokens et variables CSS */

/* SNIPER v2 - INTERFACE MODERNE & FLUIDE */

:root {
    /* Indique au navigateur de peindre les widgets natifs en sombre : liste
       déroulante des <select>, sélecteur de date, ascenseurs. Sans cette
       déclaration ils sortent en thème clair quel que soit le CSS de la page,
       d'où le menu blanc au milieu de l'interface sombre. */
    color-scheme: dark;

    /* Palette de couleurs principale */
    --primary: #6366f1;
    --primary-dark: #4f46e5;
    --primary-light: #a5b4fc;
    --secondary: #06b6d4;
    --accent: #f59e0b;
    --accent-light: #fef3c7;
    --accent-medium: #fbbf24;
    --accent-dark: #b45309;
    --success: #10b981;
    --success-dark: #059669;
    --success-bg: #f0fdf4;
    --warning: #fb923c;
    --danger: #ef4444;
    --danger-dark: #dc2626;
    --danger-bg: #fef2f2;
    --info: #3b82f6;
    --purple: #a855f7;
    --light: #ffffff;

    /* Neutres - Thème sombre */
    --gray-50: #0f172a;
    --gray-100: #1e293b;
    --gray-200: #334155;
    --gray-300: #475569;
    --gray-400: #64748b;
    --gray-500: #94a3b8;
    --gray-600: #cbd5e1;
    --gray-700: #e2e8f0;
    --gray-800: #f1f5f9;
    --gray-900: #f8fafc;

    /* Statuts flux réel */
    --status-achat: #3b82f6;
    --status-achat-light: #93c5fd;
    --status-achat-bg: rgba(59, 130, 246, 0.18);
    --status-reparation: #f59e0b;
    --status-reparation-light: #fcd34d;
    --status-reparation-bg: rgba(245, 158, 11, 0.18);
    --status-vente: #a855f7;
    --status-vente-light: #d8b4fe;
    --status-vente-bg: rgba(168, 85, 247, 0.18);
    --status-vendu: #10b981;
    --status-vendu-light: #6ee7b7;
    --status-vendu-bg: rgba(16, 185, 129, 0.18);
    --status-cloture: #94a3b8;
    --status-cloture-light: #cbd5e1;
    --status-cloture-bg: rgba(148, 163, 184, 0.15);
    --status-abandonne: #ef4444;
    --status-abandonne-light: #fca5a5;
    --status-abandonne-bg: rgba(239, 68, 68, 0.18);

    /* Surfaces et bordures alpha */
    --surface-alpha-subtle: rgba(255, 255, 255, 0.04);
    --surface-alpha-light: rgba(255, 255, 255, 0.08);
    --surface-alpha-medium: rgba(255, 255, 255, 0.12);
    --surface-alpha-strong: rgba(255, 255, 255, 0.18);
    --border-alpha-subtle: rgba(255, 255, 255, 0.06);
    --border-alpha-light: rgba(255, 255, 255, 0.10);
    --border-alpha-medium: rgba(255, 255, 255, 0.15);
    --border-alpha-strong: rgba(255, 255, 255, 0.22);

    /* Typographie — échelle normalisée */
    --text-3xs: 0.65rem;
    --text-2xs: 0.72rem;
    --text-xs: 0.78rem;
    --text-sm: 0.875rem;
    --text-base: 1rem;
    --text-lg: 1.25rem;
    --text-xl: 1.5rem;
    --text-2xl: 1.8rem;
    --font-normal: 400;
    --font-medium: 500;
    --font-semibold: 600;
    --font-bold: 700;
    --font-extrabold: 800;

    /* Espacement — échelle complète */
    --spacing-3xs: 0.125rem;
    --spacing-2xs: 0.25rem;
    --spacing-xs: 0.5rem;
    --spacing-sm: 0.75rem;
    --spacing-md: 1rem;
    --spacing-lg: 1.5rem;
    --spacing-xl: 2rem;
    --spacing-2xl: 3rem;

    /* Bordures et effets */
    --border-radius-xs: 4px;
    --border-radius-sm: 8px;
    --border-radius-md: 12px;
    --border-radius-lg: 16px;
    --border-radius-xl: 24px;
    --border-radius-pill: 999px;
    --border-radius-bar: 6px;

    /* Élévation */
    --shadow-sm: 0 1px 2px 0 rgb(0 0 0 / 0.05);
    --shadow-md: 0 4px 6px -1px rgb(0 0 0 / 0.1);
    --shadow-lg: 0 10px 15px -3px rgb(0 0 0 / 0.1);
    --shadow-xl: 0 20px 25px -5px rgb(0 0 0 / 0.1);
    --elevation-1: 0 1px 3px rgba(0, 0, 0, 0.12);
    --elevation-2: 0 4px 12px rgba(0, 0, 0, 0.15);
    --elevation-3: 0 10px 24px rgba(0, 0, 0, 0.20);
    --elevation-4: 0 20px 40px rgba(0, 0, 0, 0.25);
    --elevation-primary: 0 8px 20px rgba(99, 102, 241, 0.25);
    --elevation-danger: 0 8px 20px rgba(239, 68, 68, 0.25);
    --elevation-success: 0 8px 20px rgba(16, 185, 129, 0.25);
    --elevation-badge-soft: 0 6px 16px rgba(15, 23, 42, 0.18);
    --elevation-surface-rank: 0 10px 20px rgba(15, 23, 42, 0.22);
    --elevation-surface-soft: 0 10px 22px rgba(15, 23, 42, 0.24);
    --elevation-surface-subtle: 0 10px 24px rgb(15 23 42 / 0.12);
    --elevation-surface-medium: 0 10px 24px rgb(15 23 42 / 0.18);
    --elevation-primary-soft: 0 12px 24px rgba(79, 70, 229, 0.24);
    --elevation-primary-strong: 0 16px 28px rgba(79, 70, 229, 0.32);
    --elevation-primary-glow: 0 14px 28px rgba(79, 70, 229, 0.18);
    --elevation-primary-panel: 0 16px 32px rgba(79, 70, 229, 0.14);
    --elevation-primary-tint: 0 10px 22px rgb(99 102 241 / 0.18);
    --elevation-secondary-soft: 0 10px 24px rgba(14, 116, 144, 0.18);
    --elevation-secondary-strong: 0 14px 30px rgba(14, 116, 144, 0.24);
    --elevation-danger-soft: 0 12px 24px rgba(153, 27, 27, 0.28);
    --elevation-danger-strong: 0 16px 28px rgba(153, 27, 27, 0.36);
    --elevation-accent-soft: 0 10px 20px rgba(245, 158, 11, 0.14);
    --elevation-overlay-strong: 0 24px 80px rgba(15, 23, 42, 0.4);
    --elevation-cta-hover: 0 12px 20px rgba(15, 23, 42, 0.18);
    --elevation-chip-hover: 0 8px 18px rgba(2, 6, 23, 0.28);
    --glow-status-dot: 0 0 10px currentColor;
    --ring-primary-strong: 0 0 0 3px rgba(99, 102, 241, 0.22);
    --ring-primary-soft: 0 0 0 3px rgb(99 102 241 / 0.1);
    --ring-operational-active: inset 0 0 0 1px rgba(37, 99, 235, 0.18);
    --ring-operational-focus: 0 0 0 2px rgba(37, 99, 235, 0.15);
    --inset-highlight-subtle: inset 0 1px 0 rgba(255, 255, 255, 0.03);
    --inset-highlight-soft: inset 0 1px 0 rgba(255, 255, 255, 0.04);

    /* Gradients réutilisables */
    --gradient-primary: linear-gradient(135deg, var(--primary), var(--primary-dark));
    --gradient-danger: linear-gradient(135deg, var(--danger), var(--danger-dark));
    --gradient-success: linear-gradient(135deg, var(--success), var(--success-dark));
    --gradient-surface: linear-gradient(135deg, rgba(30, 41, 59, 0.8), rgba(15, 23, 42, 0.72));
    --gradient-surface-soft: linear-gradient(135deg, rgba(15, 23, 42, 0.62), rgba(15, 23, 42, 0.38));
    --gradient-surface-soft-muted: linear-gradient(135deg, rgba(15, 23, 42, 0.42), rgba(30, 41, 59, 0.22));
    --gradient-panel-premium: linear-gradient(135deg, rgba(15, 23, 42, 0.92), rgba(30, 41, 59, 0.78));
    --gradient-operational-background: linear-gradient(135deg, rgba(15, 23, 42, 0.96), rgba(30, 41, 59, 0.90));
    --gradient-operational-header: linear-gradient(135deg, rgba(30, 41, 59, 0.98), rgba(15, 23, 42, 0.96));
    --gradient-operational-panel: linear-gradient(180deg, rgba(15, 23, 42, 0.64), rgba(15, 23, 42, 0.42));
    --gradient-operational-card: linear-gradient(180deg, rgba(15, 23, 42, 0.38), rgba(15, 23, 42, 0.20));
    --gradient-operational-icon: linear-gradient(135deg, rgba(99, 102, 241, 0.24), rgba(14, 165, 233, 0.14));
    --gradient-operational-accent-line: linear-gradient(90deg, rgba(99, 102, 241, 0.52), rgba(14, 165, 233, 0.30));
    --gradient-accent-soft: linear-gradient(135deg, rgba(245, 158, 11, 0.16), rgba(99, 102, 241, 0.22));
    --gradient-info-soft: linear-gradient(135deg, rgba(59, 130, 246, 0.16), rgba(14, 165, 233, 0.14));
    --gradient-primary-soft: linear-gradient(135deg, rgba(99, 102, 241, 0.34), rgba(79, 70, 229, 0.28));
    --gradient-primary-soft-muted: linear-gradient(135deg, rgba(99, 102, 241, 0.24), rgba(79, 70, 229, 0.18));
    --gradient-success-strong: linear-gradient(135deg, rgba(5, 150, 105, 0.94) 0%, rgba(4, 120, 87, 0.98) 100%);
    --gradient-neutral-strong: linear-gradient(135deg, rgba(71, 85, 105, 0.92) 0%, rgba(51, 65, 85, 0.96) 100%);
    --gradient-info-strong: linear-gradient(135deg, rgba(14, 165, 233, 0.94) 0%, rgba(3, 105, 161, 0.98) 100%);
    --gradient-warning-strong: linear-gradient(135deg, rgba(180, 83, 9, 0.92) 0%, rgba(120, 53, 15, 0.96) 100%);
    --gradient-primary-strong: linear-gradient(135deg, rgba(99, 102, 241, 0.92) 0%, rgba(79, 70, 229, 0.96) 100%);
    --gradient-danger-strong: linear-gradient(135deg, rgba(220, 38, 38, 0.94) 0%, rgba(153, 27, 27, 0.98) 100%);
    --gradient-danger-panel: linear-gradient(135deg, rgba(127, 29, 29, 0.28) 0%, rgba(69, 10, 10, 0.22) 100%);

    /* Animations */
    --transition-fast: 150ms cubic-bezier(0.4, 0, 0.2, 1);
    --transition-normal: 250ms cubic-bezier(0.4, 0, 0.2, 1);
    --transition-slow: 350ms cubic-bezier(0.4, 0, 0.2, 1);
}