/* ================================================================
   EDESSA Design Tokens
   Variables CSS : couleurs, ombres, radius, typo
   Extraites de BASE_TEMPLATE — ne pas modifier en inline
   ================================================================ */

:root {
    color-scheme: dark;
    /* Couleurs principales - Fond noir uni (identique OVH) */
    --bg-primary: #111111;
    --bg-secondary: #111111;
    --bg-card: transparent;
    --bg-card-hover: transparent;
    --bg-sidebar: #111111;
    --bg-input: #1A1A1A;

    /* Bordures - Tres subtiles */
    --border-color: transparent;
    --border-light: rgba(255,255,255,0.05);

    /* Textes */
    --text-primary: #FFFFFF;
    --text-secondary: #B0B0B0;
    --text-muted: #888888;
    --text-dark: #666666;

    /* Couleurs d'accent - SEULEMENT vert et gris */
    --accent-green: #A0D468;
    --accent-green-light: #B8E086;
    --accent-green-dark: #8BC34A;
    --accent-blue: #888888;
    --accent-purple: #999999;
    --accent-orange: #888888;
    --accent-red: #888888;
    --accent-cyan: #999999;
    --accent-gold: #888888;
    --accent-gold-bg: rgba(160, 212, 104, 0.08);

    /* Ombres - Desactivees */
    --shadow-sm: none;
    --shadow-md: none;
    --shadow-lg: none;
    --shadow-glow: none;

    /* Rayons - Desactives */
    --radius-sm: 0;
    --radius-md: 0;
    --radius-lg: 0;
    --radius-xl: 0;
    --radius-full: 0;

    /* Transitions */
    --transition-fast: 0.15s ease;
    --transition-normal: 0.2s ease;
    --transition-slow: 0.3s ease;

    /* Composants - couleurs dark concretes */
    --bg-card-solid: #1a1a1a;
    --bg-table: #0D0D0D;
    --bg-table-header: #000000;
    --bg-hover: #2a2a2a;
    --bg-hover-subtle: rgba(255,255,255,0.05);
    --bg-darker: #0a0a0a;
    --border-subtle: #333333;
    --border-hover: #444444;
    --border-medium: #2a2a2a;
    --text-on-accent: #000000;
    --text-label: #888888;
    --text-placeholder: #555555;
    --text-white: #FFFFFF;
    --svg-fill-muted: %23888888;
    --chart-grid: #222222;
    --chart-tick: #666666;

    /* Sidebar (maquette Option 1 - Noir) */
    --sidebar-bg: #0a0a0a;
    --sidebar-text: #888888;
    --sidebar-text-hover: #ffffff;
    --sidebar-text-active: #1a5c3a;
    --sidebar-hover-bg: rgba(255,255,255,0.05);
    --sidebar-border: transparent;
    --sidebar-separator: rgba(255,255,255,0.04);
    --sidebar-subtext: #666666;
    --sidebar-dot: #666666;
    --sidebar-collapse-bg: #222222;
    --sidebar-collapse-border: #333333;
    --sidebar-flyout-bg: #111111;
    --sidebar-flyout-border: #333333;
    --sidebar-dropdown-bg: #1a1a1a;
    --sidebar-dropdown-border: #333333;
    --sidebar-dropdown-hover: #2a2a2a;
    --sidebar-dropdown-active: #333333;
    --sidebar-tooltip-bg: #1a1a1a;
    --sidebar-tooltip-border: #333333;
    --sidebar-active-bg: transparent;
    --sidebar-scrollbar: #333333;
}

/* ================================================================
   THEME LIGHT - Surcharge des variables
   ================================================================ */
html.light-theme {
    color-scheme: light;
    --bg-primary: #f5f5f3;
    --bg-secondary: #f5f5f3;
    --bg-card: #ffffff;
    --bg-card-hover: #e8f5ee;
    --bg-sidebar: #0f2e1f;
    --bg-input: #ffffff;
    --border-color: #e2e5ea;
    --border-light: #d1d5db;
    --text-primary: #0d0d0d;
    --text-secondary: #6b7280;
    --text-muted: #9ca3af;
    --text-dark: #6b7280;
    --accent-green: #1a5c3a;
    --accent-green-light: #4db87a;
    --accent-green-dark: #154a2f;
    --accent-green-bg: #e8f5ee;
    --accent-pale: #e8f5ee;
    --accent-emerald: #2d9a5f;
    --accent-blue: #2563EB;
    --accent-purple: #7C3AED;
    --accent-orange: #D97706;
    --accent-red: #DC2626;
    --accent-cyan: #0891B2;
    --accent-gold: #B8860B;
    --accent-gold-bg: rgba(184, 134, 11, 0.08);
    --shadow-sm: 0 1px 2px rgba(0,0,0,0.05);
    --shadow-md: 0 4px 12px rgba(0,0,0,0.08);
    --shadow-lg: 0 8px 24px rgba(0,0,0,0.1);
    --shadow-glow: 0 0 20px rgba(26, 92, 58, 0.1);
    --radius-sm: 6px;
    --radius-md: 10px;
    --radius-lg: 14px;
    --radius-xl: 20px;
    --radius-full: 50%;

    /* Composants - couleurs light */
    --bg-card-solid: #ffffff;
    --bg-table: #ffffff;
    --bg-table-header: #f9fafb;
    --bg-hover: #f5f5f3;
    --bg-hover-subtle: rgba(26,92,58,0.06);
    --bg-darker: #f5f5f3;
    --border-subtle: #d1d5db;
    --border-hover: #9ca3af;
    --border-medium: #e2e5ea;
    --text-on-accent: #ffffff;
    --text-label: #6b7280;
    --text-placeholder: #9ca3af;
    --text-white: #0d0d0d;
    --svg-fill-muted: %236b7280;
    --chart-grid: #e2e5ea;
    --chart-tick: #6b7280;

    /* Sidebar VERT PROFOND (identique preview Option 3) */
    --sidebar-bg: #0f2e1f;
    --sidebar-text: rgba(255,255,255,0.5);
    --sidebar-text-hover: rgba(255,255,255,0.85);
    --sidebar-text-active: #4db87a;
    --sidebar-active-bg: rgba(77,184,122,0.12);
    --sidebar-hover-bg: rgba(77,184,122,0.08);
    --sidebar-border: rgba(77,184,122,0.1);
    --sidebar-separator: rgba(77,184,122,0.08);
    --sidebar-subtext: rgba(255,255,255,0.3);
    --sidebar-dot: rgba(255,255,255,0.3);
    --sidebar-collapse-bg: rgba(77,184,122,0.1);
    --sidebar-collapse-border: rgba(77,184,122,0.2);
    --sidebar-flyout-bg: #0f2e1f;
    --sidebar-flyout-border: rgba(77,184,122,0.2);
    --sidebar-dropdown-bg: #0f2e1f;
    --sidebar-dropdown-border: rgba(77,184,122,0.25);
    --sidebar-dropdown-hover: rgba(77,184,122,0.15);
    --sidebar-dropdown-active: rgba(77,184,122,0.2);
    --sidebar-tooltip-bg: #0f2e1f;
    --sidebar-tooltip-border: rgba(77,184,122,0.2);
    --sidebar-scrollbar: rgba(255,255,255,0.15);
}