/* ==========================================================================
   Portail Agent — Design Tokens
   ==========================================================================
   Palette ancree dans l'identite de la plateforme Personnel existante
   (vert institutionnel #2e7d32, marine #25476a, bleu ciel #03a9f4 —
   cf. personnel/assets/css/{custom,nifty}.css) mais organisee en un
   veritable systeme de tokens, avec variante sombre complete.
   ========================================================================== */

:root {
  /* -- Marque -- */
  --color-primary-h: 123 40% 34%;           /* #2e7d32 */
  --color-primary: #2e7d32;
  --color-primary-rgb: 46, 125, 50;
  --color-primary-dark: #1b5e20;
  --color-primary-light: #4caf50;
  --color-primary-50: #e8f5e9;

  --color-secondary: #25476a;
  --color-secondary-rgb: 37, 71, 106;
  --color-secondary-light: #3a6491;
  --color-secondary-50: #e9eef3;

  --color-accent: #03a9f4;
  --color-accent-rgb: 3, 169, 244;

  /* -- Etats -- */
  --color-success: var(--color-primary);
  --color-success-rgb: var(--color-primary-rgb);
  --color-success-bg: #e8f5e9;

  --color-danger: #dc3545;
  --color-danger-rgb: 220, 53, 69;
  --color-danger-bg: #fdecea;

  --color-warning: #f59e0b;
  --color-warning-rgb: 245, 158, 11;
  --color-warning-bg: #fff4e0;

  --color-info: var(--color-accent);
  --color-info-rgb: var(--color-accent-rgb);
  --color-info-bg: #e6f7fe;

  /* -- Neutres / surfaces (mode clair) -- */
  --color-bg: #edf1f6;
  --color-surface: #ffffff;
  --color-surface-alt: #f8fafc;
  --color-surface-rgb: 255, 255, 255;
  --color-text: #373c43;
  --color-text-muted: #75868f;
  --color-text-subtle: #a5b1b8;
  --color-border: rgba(0, 0, 0, 0.08);
  --color-overlay: rgba(15, 23, 42, 0.55);

  /* -- Typographie -- */
  --font-display: 'Poppins', 'Segoe UI', system-ui, -apple-system, sans-serif;
  --font-body: 'Inter', 'Segoe UI', system-ui, -apple-system, sans-serif;

  --fs-xs: 0.75rem;
  --fs-sm: 0.8125rem;
  --fs-base: 0.9375rem;
  --fs-lg: 1.0625rem;
  --fs-xl: 1.25rem;
  --fs-2xl: 1.625rem;
  --fs-3xl: 2.125rem;

  /* -- Rayons -- */
  --radius-sm: 0.375rem;
  --radius-md: 0.625rem;
  --radius-lg: 1rem;
  --radius-xl: 1.5rem;
  --radius-pill: 50rem;

  /* -- Ombres (elevation) -- */
  --shadow-sm: 0 1px 2px rgba(16, 24, 40, 0.06);
  --shadow-md: 0 4px 12px rgba(16, 24, 40, 0.08);
  --shadow-lg: 0 12px 32px rgba(16, 24, 40, 0.12);
  --shadow-focus: 0 0 0 0.2rem rgba(var(--color-primary-rgb), 0.25);

  /* -- Transitions -- */
  --transition-fast: 120ms ease;
  --transition-base: 220ms ease;
  --transition-slow: 400ms cubic-bezier(0.22, 1, 0.36, 1);

  /* -- Mise en page -- */
  --sidebar-width: 264px;
  --sidebar-width-collapsed: 84px;
  --topbar-height: 68px;
}

/* -- Mode sombre : prefs systeme (pas de choix explicite) -- */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --color-bg: #0f172a;
    --color-surface: #1a2436;
    --color-surface-alt: #141d2c;
    --color-surface-rgb: 26, 36, 54;
    --color-text: #e7ecf3;
    --color-text-muted: #97a6b8;
    --color-text-subtle: #64748b;
    --color-border: rgba(255, 255, 255, 0.09);
    --color-overlay: rgba(0, 0, 0, 0.65);

    --color-primary-light: #57c15c;
    --color-primary-50: rgba(76, 175, 80, 0.16);
    --color-secondary-50: rgba(58, 100, 145, 0.2);
    --color-success-bg: rgba(76, 175, 80, 0.16);
    --color-danger-bg: rgba(220, 53, 69, 0.18);
    --color-warning-bg: rgba(245, 158, 11, 0.18);
    --color-info-bg: rgba(3, 169, 244, 0.18);

    --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.3);
    --shadow-md: 0 4px 14px rgba(0, 0, 0, 0.35);
    --shadow-lg: 0 16px 40px rgba(0, 0, 0, 0.45);
  }
}

/* -- Mode sombre : choix explicite de l'utilisateur (persist localStorage) -- */
:root[data-theme="dark"] {
  --color-bg: #0f172a;
  --color-surface: #1a2436;
  --color-surface-alt: #141d2c;
  --color-surface-rgb: 26, 36, 54;
  --color-text: #e7ecf3;
  --color-text-muted: #97a6b8;
  --color-text-subtle: #64748b;
  --color-border: rgba(255, 255, 255, 0.09);
  --color-overlay: rgba(0, 0, 0, 0.65);

  --color-primary-light: #57c15c;
  --color-primary-50: rgba(76, 175, 80, 0.16);
  --color-secondary-50: rgba(58, 100, 145, 0.2);
  --color-success-bg: rgba(76, 175, 80, 0.16);
  --color-danger-bg: rgba(220, 53, 69, 0.18);
  --color-warning-bg: rgba(245, 158, 11, 0.18);
  --color-info-bg: rgba(3, 169, 244, 0.18);

  --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.3);
  --shadow-md: 0 4px 14px rgba(0, 0, 0, 0.35);
  --shadow-lg: 0 16px 40px rgba(0, 0, 0, 0.45);
}