/* =========================================================================
   Revotio — gedeelde app-thema-laag. Eén look over alle pagina's (cockpit-stijl),
   met een accentkleur per sectie via <html data-section="finance|admin|beheer|home">.
   Laadt ná de inline <style> van elke pagina en overschrijft de palette-variabelen
   (beide naamconventies: --bg/--panel/--txt én --surface/--text). Charts/logica blijven.
   ========================================================================= */
@import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;500;600;700&display=swap');

/* ---------- neutrale palette (licht) — cockpit-tinten ---------- */
:root{
  --bg:#f3f5f8; --panel:#ffffff; --panel2:#f7f9fb; --line:#e6eaf0; --line2:#eef1f5;
  --txt:#17202e; --muted:#5c6776; --hint:#8a94a3;
  --surface:#ffffff; --surface-2:#f7f9fb; --text:#17202e; --border:#e6eaf0; --border-strong:#d7dde6;
  --good:#1a7f37; --warn:#b47400; --warn-soft:rgba(180,116,0,.10); --bad:#cf222e; --danger:#cf222e; --strc:#0e8a93;
}
/* ---------- neutrale palette (donker) ---------- */
:root[data-theme="dark"]{
  --bg:#0e1116; --panel:#171b22; --panel2:#1b212b; --line:#2a313c; --line2:#232a34;
  --txt:#e6edf3; --muted:#9aa5b4; --hint:#6e7781;
  --surface:#171b22; --surface-2:#1b212b; --text:#e6edf3; --border:#2a313c; --border-strong:#3a4350;
  --good:#3fb950; --warn:#d29922; --warn-soft:rgba(210,153,34,.16); --bad:#f85149; --danger:#f85149; --strc:#39c5cf;
}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]){
    --bg:#0e1116; --panel:#171b22; --panel2:#1b212b; --line:#2a313c; --line2:#232a34;
    --txt:#e6edf3; --muted:#9aa5b4; --hint:#6e7781;
    --surface:#171b22; --surface-2:#1b212b; --text:#e6edf3; --border:#2a313c; --border-strong:#3a4350;
    --good:#3fb950; --warn:#d29922; --warn-soft:rgba(210,153,34,.16); --bad:#f85149; --danger:#f85149; --strc:#39c5cf;
  }
}

/* ---------- accent per sectie (licht) — hogere specificiteit dan :root ---------- */
:root,:root[data-section="finance"],:root[data-section="home"]{ --accent:#ea5a1e; --accent-soft:#fdeee7; --accent-text:#c9430f; }
:root[data-section="admin"]{ --accent:#0e8a93; --accent-soft:#e2f1f2; --accent-text:#0a6b72; }
:root[data-section="beheer"]{ --accent:#2f6fed; --accent-soft:#e4edff; --accent-text:#2257c9; }
/* ---------- accent per sectie (donker) ---------- */
:root[data-theme="dark"],:root[data-theme="dark"][data-section="finance"],:root[data-theme="dark"][data-section="home"]{ --accent:#f0703a; --accent-soft:#3a231a; --accent-text:#ff8a5c; }
:root[data-theme="dark"][data-section="admin"]{ --accent:#39c5cf; --accent-soft:#163336; --accent-text:#7fe3ea; }
:root[data-theme="dark"][data-section="beheer"]{ --accent:#4f9cff; --accent-soft:#1d2c45; --accent-text:#9ec5ff; }

/* ---------- typografie: cockpit-koppen/getallen (Space Grotesk) ---------- */
h1,h2,h3,.kpi .v,.kpi .val,.val,.num,.hero,.big-num{
  font-family:'Space Grotesk',-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif;
  font-variant-numeric:tabular-nums;letter-spacing:-.3px;
}

/* ---------- kaart-afronding iets ruimer, zachte lift (cockpit-gevoel) ---------- */
.card{border-radius:16px}

/* ---------- laad-skeleton (app-breed) ---------- */
.sk{display:inline-block;background:linear-gradient(90deg,var(--panel2,#eef1f5) 25%,var(--line,#e6eaf0) 37%,var(--panel2,#eef1f5) 63%);background-size:400% 100%;animation:revskl 1.4s ease infinite;border-radius:8px}
@keyframes revskl{0%{background-position:100% 0}100%{background-position:-100% 0}}
@media (prefers-reduced-motion:reduce){.sk{animation:none}}
.sk-card{position:relative;overflow:hidden}
.sk-card>.sk{display:block;width:100%;border-radius:16px}

/* ---------- gedeeld menu (nav.js): accent volgt de sectie ---------- */
:root[data-section="admin"] .rev-side{--n-acc:#0e8a93;--n-accbg:#e2f1f2}
:root[data-section="beheer"] .rev-side{--n-acc:#2f6fed;--n-accbg:#e4edff}
:root[data-theme="dark"][data-section="admin"] .rev-side{--n-acc:#39c5cf;--n-accbg:#163336}
:root[data-theme="dark"][data-section="beheer"] .rev-side{--n-acc:#4f9cff;--n-accbg:#1d2c45}
