/*!*************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[14].oneOf[12].use[2]!./node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[14].oneOf[12].use[3]!./app/globals.css ***!
  \*************************************************************************************************************************************************************************************************************************************************************/
/* >>> PLAATS DIT BESTAND OP: /data_qms/sandbox/frontend/app/globals.css */
:root{
  /* ── Donker / navy (tekst, koppen, topbar) ─────────────────────────── */
  --navy:#16314d; --navy-2:#1d3e60; --navy-deep:#0f2438;
  --navy-top:#163252; --navy-top-2:#11293f;   /* topbar-gradiënt */
  --ink:#16314d; --ink-2:#1a2b3c;

  /* ── Merk / oranje ─────────────────────────────────────────────────── */
  --orange:#e2622f; --orange-soft:#ef7d4d; --orange-wash:#fbf4ef;

  /* ── Accenten (categorie-/rol-/statuskleuren) ──────────────────────── */
  --blue:#2f7fd1; --teal:#3f6f8a; --purple:#8e6bbf;
  --ok:#1f8a4c; --warn:#d9912a; --bad:#cf4b3f;

  /* ── Gedempte tinten (secundaire tekst, iconen) ────────────────────── */
  --muted:#5d7187; --slate:#6d8199; --faint:#93a1b2;

  /* ── Op donker (licht tekst/rand op de navy topbar) ────────────────── */
  --on-navy:#cdd9e5; --on-navy-soft:#9fb2c6;

  /* ── Oppervlakken / achtergronden ──────────────────────────────────── */
  --paper:#f4f2ee; --card:#ffffff; --white:#ffffff;
  --surface:#fbfaf8; --surface-2:#f7f6f3;

  /* ── Lijnen / randen ───────────────────────────────────────────────── */
  --line:#e6e3dc; --line-2:#eef0f3;

  /* ── Overig ────────────────────────────────────────────────────────── */
  --scroll:#d8d4cc;

  /* ══════════════════════════════════════════════════════════════════════
     LETTERTYPEN — ÉÉN centrale bron. Alle pagina's verwijzen hierheen;
     nergens zit nog een fontnaam los in een component ingebakken.
     Wil je een lettertype wijzigen? Pas hier één regel aan (en dezelfde
     regel in accounts/globals.css, zodat beide apps gelijk blijven).
     Laad je een ander font? Werk dan ook de <link> in app/layout.tsx bij.

       --font-body    : bodytekst, labels, formulieren, tabellen, navigatie
       --font-heading : titels/koppen (h1/h2, logo)
       --font-button  : knoppen (los instelbaar van de bodytekst)
       --font-mono    : codes, meta, kickers, tabelkoppen (.mono).
                        Het systeem kent bewust maar TWEE lettertypen, dus
                        deze volgt automatisch de bodytekst. Wil je codes
                        (PLAN-001 e.d.) toch weer monospace laten uitlijnen?
                        Zet deze regel dan op:
                          --font-mono:'IBM Plex Mono',ui-monospace,monospace;
                        en voeg IBM+Plex+Mono weer toe aan de <link> in
                        app/layout.tsx.
     ══════════════════════════════════════════════════════════════════════ */
  --font-body:'Roboto',system-ui,sans-serif;
  --font-heading:'Be Vietnam Pro',system-ui,sans-serif;
  --font-button:'Be Vietnam Pro',system-ui,sans-serif;
  --font-mono:var(--font-body);
}
*{box-sizing:border-box;margin:0;padding:0}
html,body{height:100%}
body{
  font-family:var(--font-body);color:var(--ink);background:var(--paper);
  -webkit-font-smoothing:antialiased;
}
/* Vangnet: elk <button>-element krijgt automatisch het knop-lettertype,
   ook zonder inline instelling. */
button{font-family:var(--font-button)}
a{color:inherit;text-decoration:none}
.mono{font-family:var(--font-mono)}
::-webkit-scrollbar{width:10px;height:10px}
::-webkit-scrollbar-thumb{background:var(--scroll);border-radius:9px;border:2px solid var(--paper)}

