/**
 * Tokens de design Agenla — source unique pour tous les modules.
 * Mappe vers les variables legacy (--bg-color, --menu-bg, etc.)
 */

/* ── Défaut sûr (clair) — évite le flash bleu avant data-theme ── */
:root {
  color-scheme: light;

  --agenla-bg: #ffffff;
  --agenla-surface: #f8f9fa;
  --agenla-surface-2: #eef1f5;
  --agenla-text: #333333;
  --agenla-text-muted: #6c757d;
  --agenla-primary: #475569;
  --agenla-primary-dark: #334155;
  --agenla-accent: #64748b;
  --agenla-border: #dee2e6;
  --agenla-nav-bg: #ffffff;
  --agenla-nav-text: #333333;
  --agenla-nav-hover: rgba(71, 85, 105, 0.08);
  --agenla-submenu-bg: #f8f9fa;
  --agenla-shadow: rgba(0, 0, 0, 0.1);
  --agenla-success: #28a745;
  --agenla-warning: #ffc107;
  --agenla-danger: #dc3545;
  --agenla-info: #17a2b8;

  /* Legacy header.css */
  --bg-color: var(--agenla-nav-bg);
  --text-color: var(--agenla-text);
  --primary-color: var(--agenla-primary);
  --hover-color: var(--agenla-nav-hover);
  --border-color: var(--agenla-border);
  --nav-text-color: var(--agenla-nav-text);
  --nav-hover-color: var(--agenla-primary);
  --icon-color: var(--agenla-text);
  --menu-bg: var(--agenla-nav-bg);
  --menu-text: var(--agenla-nav-text);
  --submenu-bg: var(--agenla-submenu-bg);
  --secondary-color: var(--agenla-accent);
  --accent-color: var(--agenla-primary-dark);
  --menu-hover: var(--agenla-surface-2);
  --shadow-color: var(--agenla-shadow);
  --view-button-bg: #f0f0f0;
  --view-button-text: #333333;
  --view-button-hover: #e6e6e6;
  --view-button-active-bg: var(--agenla-primary);
  --view-button-active-text: #ffffff;
  --logo-primary: var(--agenla-primary);
  --logo-secondary: var(--agenla-primary-dark);
  --logo-accent: #ffd700;
  --logo-text: #333333;

  /* Legacy config.css */
  --bg-primary: var(--agenla-bg);
  --bg-secondary: var(--agenla-surface);
  --bg-tertiary: var(--agenla-surface-2);
  --text-primary: var(--agenla-text);
  --text-secondary: var(--agenla-text-muted);
  --success-color: var(--agenla-success);
  --warning-color: var(--agenla-warning);
  --danger-color: var(--agenla-danger);
  --info-color: var(--agenla-info);
  --shadow: 0 2px 10px var(--agenla-shadow);
  --shadow-hover: 0 4px 20px var(--agenla-shadow);
}

/* ── Clair explicite ── */
[data-theme="light"] {
  color-scheme: light;

  --agenla-bg: #ffffff;
  --agenla-surface: #f8f9fa;
  --agenla-surface-2: #eef1f5;
  --agenla-text: #333333;
  --agenla-text-muted: #6c757d;
  --agenla-primary: #0066cc;
  --agenla-primary-dark: #004499;
  --agenla-accent: #3d85c6;
  --agenla-border: #dee2e6;
  --agenla-nav-bg: #ffffff;
  --agenla-nav-text: #333333;
  --agenla-nav-hover: rgba(0, 102, 204, 0.1);
  --agenla-submenu-bg: #f8f9fa;
  --agenla-shadow: rgba(0, 0, 0, 0.1);

  --bg-color: #ffffff;
  --text-color: #333333;
  --primary-color: #0066cc;
  --hover-color: rgba(0, 102, 204, 0.1);
  --border-color: #dee2e6;
  --nav-text-color: #333333;
  --nav-hover-color: #0066cc;
  --icon-color: #333333;
  --menu-bg: #ffffff;
  --menu-text: #333333;
  --submenu-bg: #f8f9fa;

  --bg-primary: #ffffff;
  --bg-secondary: #f8f9fa;
  --bg-tertiary: #e9ecef;
  --text-primary: #212529;
  --text-secondary: #6c757d;
  --shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
  --shadow-hover: 0 4px 20px rgba(0, 0, 0, 0.15);
}

/* ── Sombre ── */
[data-theme="dark"] {
  color-scheme: dark;

  --agenla-bg: #0f172a;
  --agenla-surface: #1e293b;
  --agenla-surface-2: #334155;
  --agenla-text: #ffffff;
  --agenla-text-muted: #94a3b8;
  --agenla-primary: #3b82f6;
  --agenla-primary-dark: #1e3a8a;
  --agenla-accent: #1d4ed8;
  --agenla-border: #1e40af;
  --agenla-nav-bg: #1e3a8a;
  --agenla-nav-text: #ffffff;
  --agenla-nav-hover: #1e40af;
  --agenla-submenu-bg: #1e293b;
  --agenla-shadow: rgba(0, 0, 0, 0.3);

  --primary-color: #1e3a8a;
  --secondary-color: #1e40af;
  --accent-color: #1d4ed8;
  --text-color: #ffffff;
  --bg-color: #0f172a;
  --hover-color: #1e40af;
  --border-color: #1e40af;
  --menu-bg: #1e3a8a;
  --menu-hover: #1e40af;
  --menu-text: #ffffff;
  --view-button-bg: #1e3a8a;
  --view-button-text: #ffffff;
  --view-button-hover: #1e40af;
  --view-button-active-bg: #1d4ed8;
  --view-button-active-text: #ffffff;

  --bg-primary: #0f172a;
  --bg-secondary: #1e293b;
  --bg-tertiary: #334155;
  --text-primary: #e0e6ed;
  --text-secondary: #94a3b8;
  --border-color: #334155;
  --icon-color: #e2e8f0;
  --logo-text: #f1f5f9;
  --nav-text-color: #ffffff;
  --submenu-bg: #1e293b;
  --shadow: 0 4px 20px rgba(0, 0, 0, 0.3);
  --shadow-hover: 0 8px 30px rgba(0, 0, 0, 0.4);
}

/* ── Informaticien (cyber) ── */
[data-theme="informaticien"] {
  color-scheme: dark;

  --agenla-bg: #0a0e27;
  --agenla-surface: #141b2d;
  --agenla-surface-2: #1e2742;
  --agenla-text: #e0e6ed;
  --agenla-text-muted: #a0aec0;
  --agenla-primary: #00d4ff;
  --agenla-primary-dark: #0099cc;
  --agenla-accent: #00ff88;
  --agenla-border: #2d3748;
  --agenla-nav-bg: #0a0e27;
  --agenla-nav-text: #e0e6ed;
  --agenla-nav-hover: rgba(0, 212, 255, 0.15);
  --agenla-submenu-bg: #141b2d;
  --agenla-shadow: rgba(0, 212, 255, 0.1);

  --primary-color: #00d4ff;
  --primary-dark: #0099cc;
  --secondary-color: #00ff88;
  --accent-color: #ff6b6b;
  --text-color: #e0e6ed;
  --bg-color: #0a0e27;
  --hover-color: rgba(0, 212, 255, 0.15);
  --border-color: #2d3748;
  --menu-bg: #0a0e27;
  --menu-text: #e0e6ed;
  --submenu-bg: #141b2d;
  --nav-text-color: #e0e6ed;
  --nav-hover-color: #00d4ff;
  --icon-color: #00d4ff;

  --bg-primary: #0a0e27;
  --bg-secondary: #141b2d;
  --bg-tertiary: #1e2742;
  --text-primary: #e0e6ed;
  --text-secondary: #a0aec0;
  --success-color: #00ff88;
  --warning-color: #ffd700;
  --danger-color: #ff6b6b;
  --info-color: #00d4ff;
  --shadow: 0 4px 20px rgba(0, 212, 255, 0.1);
  --shadow-hover: 0 8px 30px rgba(0, 212, 255, 0.2);
}

/* Corps global */
html {
  background-color: var(--agenla-bg);
}

body {
  background-color: var(--agenla-bg);
  color: var(--agenla-text);
}

@media (prefers-reduced-motion: no-preference) {
  html.theme-transitioning,
  html.theme-transitioning body,
  html.theme-transitioning .eltmntHead {
    transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
  }
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    transition-duration: 0.01ms !important;
  }
}