/* Amara CRM — designtokens.
   Eerste laag van de opschoning: nieuwe schermen gebruiken alleen deze variabelen.
   Monochroom: antraciet, wit en koele grijstinten (geen beige/zand, keuze Prescilla).
   De --am-sand*-namen blijven bestaan als neutrale accentkleur zodat bestaande schermen niet breken. */
:root{
  --am-font:'Poppins',system-ui,-apple-system,'Segoe UI',sans-serif;

  --am-ink:#383838;
  --am-ink-strong:#1F1F20;
  --am-muted:#6B6B70;
  --am-line:#E6E6E9;
  --am-line-soft:#F0F0F2;
  --am-line-dashed:#C9C9CE;
  --am-surface:#FFFFFF;
  --am-surface-2:#F4F4F5;
  --am-hover:#FAFAFB;
  --am-track:#EDEDEF;

  --am-sand:#8E8E93;
  --am-sand-deep:#5C5C61;
  --am-sand-tint:#F1F1F3;
  --am-canvas:#FFFFFF;
  --am-night:#232325;
  --am-night-2:#3A3A3D;
  --am-night-text:#EDEDEF;
  --am-night-muted:#9D9DA3;
  --am-desa:#B4B4B9;
  --am-late:#B3402A;
  --am-warn:#C9772E;

  --am-text-xs:12px;
  --am-text-sm:13px;
  --am-text-md:14px;
  --am-text-lg:20px;
  --am-text-xl:26px;

  --am-r-sm:6px;
  --am-r-md:8px;
  --am-r-lg:10px;
  --am-r-xl:12px;
  --am-r-2xl:14px;

  --am-control:40px;
  --am-control-sm:34px;
  --am-touch:44px;

  /* Beweging: korte feedback, iets langere binnenkomst; uitgaan sneller dan binnenkomen */
  --am-ease:cubic-bezier(.2,.7,.2,1);
  --am-ease-out:cubic-bezier(.16,.84,.3,1);
  --am-ease-in:cubic-bezier(.4,0,1,1);
  --am-fast:140ms;
  --am-dur-press:110ms;
  --am-dur-enter:260ms;
  --am-dur-exit:170ms;
  --am-shadow-card:0 1px 2px rgba(24,24,27,.04),0 4px 14px rgba(24,24,27,.06);
  --am-shadow-bar:0 1px 0 rgba(24,24,27,.06),0 6px 18px rgba(24,24,27,.06);
}

/* Desktop-designsysteem (aanvulling, november 2026).
   Nieuwe tokens naast de bestaande; bestaande waarden blijven gelijk zodat mobiel niet verschuift.
   Kleur: wit canvas, antraciet voor tekst en acties, zand alleen als accent (Amara-reeks, focus op data). */
:root{
  --am-ink-2:#4A4A4F;
  --am-amara:#8B7358;          /* Amara in grafieken, stippen en vlakken */
  --am-amara-text:#6F5B44;     /* Amara als tekstkleur (contrast ≥ 4.5:1 op wit en op --am-amara-soft) */
  --am-amara-soft:#F5F0E9;     /* achtergrond van Amara-labels */
  --am-amara-line:#E6DCCD;
  --am-desa-fill:#D8CBBB;      /* Desa in grafieken */
  --am-ok:#2F7A4F;
  --am-ok-soft:#ECF6F0;
  --am-ok-line:#CFE6D8;
  --am-late-soft:#FBEFEC;
  --am-late-line:#F0CFC7;
  --am-warn-soft:#FBF3E8;
  --am-warn-line:#EED9BC;

  --am-text-2xs:11px;
  --am-text-base:15px;
  --am-text-2xl:28px;

  --am-space-1:4px;--am-space-2:8px;--am-space-3:12px;--am-space-4:16px;--am-space-5:20px;--am-space-6:24px;--am-space-8:32px;

  --am-ds-shadow-sm:0 1px 2px rgba(24,24,27,.04);
  --am-ds-shadow-md:0 1px 2px rgba(24,24,27,.04),0 8px 24px rgba(24,24,27,.07);
  --am-ds-shadow-lg:0 2px 4px rgba(24,24,27,.04),0 18px 40px rgba(24,24,27,.10);
  --am-focus:0 0 0 3px rgba(56,56,56,.18);
}
