/* ═══════════════════════════════════════════════════════
   DevisVox v3 — css/tokens.css
   Source de vérité : tokens courts v3 + aliases production
   ═══════════════════════════════════════════════════════ */
:root {
  /* ── Couleur principale ──────────────────────────────── */
  --accent:#FF6B00; --accent-h:#FF8533; --accent-d:#D85500;
  --accent-tint:rgba(255,107,0,.12); --accent-wash:rgba(255,107,0,.06);
  --accent-light:#FFF5EB;
  /* ── États sémantiques ───────────────────────────────── */
  --ok:#10B981; --ok-d:#059669; --ok-bg:#D1FAE5; --ok-tx:#065F46;
  --wa:#D97706; --wa-bg:#FEF3C7; --wa-tx:#92400E;
  --er:#DC2626; --er-bg:#FEE2E2; --er-tx:#991B1B;
  --info-bg:#DBEAFE; --info-tx:#1D4ED8;
  /* ── Surfaces ────────────────────────────────────────── */
  --bg:#F8FAFC; --card:#FFFFFF; --dm-bg:#DDE3EA;
  /* ── Texte ───────────────────────────────────────────── */
  --text:#0F172A; --text2:#64748B; --text3:#94A3B8;
  /* ── Bordures ────────────────────────────────────────── */
  --b:#F1F5F9; --b2:#E2E8F0;
  /* ── Border-radius ───────────────────────────────────── */
  --r:14px; --r-sm:8px; --r-lg:20px; --r-xl:28px; --r-full:9999px;
  /* ── Ombres ──────────────────────────────────────────── */
  --sh:0 1px 3px rgba(0,0,0,.06),0 4px 12px rgba(0,0,0,.05);
  --sh2:0 8px 28px rgba(0,0,0,.14);
  /* ── Typographie ─────────────────────────────────────── */
  --font:-apple-system,BlinkMacSystemFont,'Segoe UI',system-ui,sans-serif;
  --fs-xs:12px; --fs-sm:14px; --fs-md:15px; --fs-lg:18px; --fs-xl:24px; --fs-xxl:32px;
  --fw-normal:400; --fw-semibold:600; --fw-bold:700; --fw-black:900;
  --lh-body:1.6; --lh-heading:1.2;
  /* ── Espacement ──────────────────────────────────────── */
  --sp-xs:4px; --sp-sm:8px; --sp-md:16px; --sp-lg:24px; --sp-xl:32px; --sp-xxl:48px;
  /* ── Transitions ─────────────────────────────────────── */
  --tr:.18s ease; --tr-slow:.30s ease;
  /* ── Layout ──────────────────────────────────────────── */
  --header-height:60px; --bottom-nav-height:79px; --sidebar-width:0px;

  /* ═══ ALIASES COMPATIBILITÉ PRODUCTION (long → court) ══ */
  --accent-orange:var(--accent);
  --accent-orange-hover:var(--accent-h);
  --accent-orange-shadow:#E65C00;
  --accent-blue:#1E3A5F;
  --accent-success:var(--ok);
  --accent-warning:var(--wa);
  --accent-danger:var(--er);
  --bg-primary:var(--bg);
  --bg-secondary:var(--card);
  --bg-card:var(--card);
  --text-primary:var(--text);
  --text-secondary:var(--text2);
  --text-tertiary:var(--text3);
  --border-color:var(--b2);
  --border-default:var(--b2);
  --border-radius-sm:var(--r-sm);
  --border-radius-md:var(--r);
  --border-radius-lg:var(--r-lg);
  --border-radius-xl:var(--r-xl);
  --border-radius-full:var(--r-full);
  --shadow-sm:var(--sh);
  --shadow-md:0 4px 12px rgba(0,0,0,.12);
  --shadow-lg:var(--sh2);
  --font-main:var(--font);
  --font-heading:var(--font);
  --font-size-xs:var(--fs-xs);
  --font-size-sm:var(--fs-sm);
  --font-size-md:15px;
  --font-size-lg:var(--fs-lg);
  --font-size-xl:var(--fs-xl);
  --font-size-xxl:var(--fs-xxl);
  --font-weight-normal:var(--fw-normal);
  --font-weight-semibold:var(--fw-semibold);
  --font-weight-bold:var(--fw-bold);
  --font-weight-black:var(--fw-black);
  --line-height-body:var(--lh-body);
  --spacing-xs:var(--sp-xs); --spacing-sm:var(--sp-sm); --spacing-md:var(--sp-md);
  --spacing-lg:var(--sp-lg); --spacing-xl:var(--sp-xl); --spacing-xxl:var(--sp-xxl);
  --primary-color:var(--accent);
  --hover-color:rgba(0,0,0,.04);
  --orange-wash-06:var(--accent-wash);
  --orange-wash-12:var(--accent-tint);
  --orange-tint-card:var(--accent-light);
  --status-paid-bg:var(--ok-bg); --status-paid-text:var(--ok-tx);
  --status-pending-bg:var(--wa-bg); --status-pending-text:var(--wa-tx);
  --status-inactive-bg:#F3F4F6; --status-inactive-text:#6B7280;
}

@media (min-width:769px) {
  :root { --header-height:70px; --bottom-nav-height:0px; --sidebar-width:250px; }
}

/* ── Dark mode ─────────────────────────────────────────── */
body.dark-mode {
  --bg:#0F172A; --card:#1E293B; --text:#F8FAFC; --text2:#94A3B8; --text3:#64748B;
  --b:#1E293B; --b2:#334155;
  --sh:0 1px 4px rgba(0,0,0,.35),0 4px 14px rgba(0,0,0,.28);
  --sh2:0 8px 32px rgba(0,0,0,.55);
  --accent-light:rgba(255,107,0,.14); --accent-tint:rgba(255,107,0,.16); --accent-wash:rgba(255,107,0,.08);
  --ok-bg:rgba(16,185,129,.16); --ok-tx:#34D399;
  --wa-bg:rgba(217,119,6,.16); --wa-tx:#FBBF24;
  --er-bg:rgba(220,38,38,.16); --er-tx:#F87171;
  --info-bg:rgba(59,130,246,.16); --info-tx:#60A5FA;
  --dm-bg:#0A0F1A;
  /* aliases dark */
  --bg-primary:var(--bg); --bg-card:var(--card); --text-primary:var(--text);
  --text-secondary:var(--text2); --text-tertiary:var(--text3); --border-color:var(--b2);
  --shadow-sm:var(--sh); --shadow-lg:var(--sh2);
}
@media (prefers-color-scheme:dark) {
  body:not(.light-mode):not(.dark-mode) {
    --bg:#0F172A; --card:#1E293B; --text:#F8FAFC; --text2:#94A3B8; --text3:#64748B;
    --b:#1E293B; --b2:#334155;
    --sh:0 1px 4px rgba(0,0,0,.35),0 4px 14px rgba(0,0,0,.28);
    --sh2:0 8px 32px rgba(0,0,0,.55);
    --accent-light:rgba(255,107,0,.14); --accent-tint:rgba(255,107,0,.16); --accent-wash:rgba(255,107,0,.08);
    --ok-bg:rgba(16,185,129,.16); --ok-tx:#34D399;
    --wa-bg:rgba(217,119,6,.16); --wa-tx:#FBBF24;
    --er-bg:rgba(220,38,38,.16); --er-tx:#F87171;
    --info-bg:rgba(59,130,246,.16); --info-tx:#60A5FA;
    --dm-bg:#0A0F1A;
  }
}

/* ── Utilitaire global ─────────────────────────────────── */
.hidden { display: none !important; }