/* =====================================================================
   Design tokens — sursa unică de adevăr pentru culori și dimensiuni.
   Identice cu variabilele din Figma. Schimbi aici, se schimbă peste tot.
   ===================================================================== */

:root {
  /* --- primitive: nu se folosesc direct în ecrane --- */
  --teal-50:#E8F4F5;  --teal-100:#C6E5E8; --teal-200:#9BD2D8; --teal-300:#6BBCC4;
  --teal-400:#3AA0AB; --teal-500:#17919B; --teal-600:#0F7780; --teal-700:#0B5F67;
  --teal-800:#08464C; --teal-900:#052F33;

  --n-0:#FFFFFF;  --n-25:#FBFCFD; --n-50:#F6F8F9;  --n-100:#EDF1F3; --n-200:#DDE4E8;
  --n-300:#C4CFD5; --n-400:#98A7B0; --n-500:#6E7E88; --n-600:#52616A; --n-700:#3A464D;
  --n-800:#242E33; --n-900:#131A1E;

  --red-50:#FDECEA;  --red-100:#FAD3CE; --red-300:#F09284; --red-500:#D92D20;
  --red-600:#B42318; --red-700:#8F1D13;
  --amber-50:#FFF6E6; --amber-100:#FCE7BE; --amber-300:#F5C25B; --amber-500:#DC6803; --amber-600:#B54708;
  --green-50:#E8F6EE; --green-100:#C7EBD6; --green-300:#71C99B; --green-500:#12855A; --green-600:#0C6B48;
  --blue-50:#E8F1FC;  --blue-100:#CBDDF7; --blue-500:#1570CF; --blue-600:#1059A8;
  --violet-100:#E0D8FA; --violet-500:#6741D9;

  /* --- semantic: ASTA se folosește în ecrane --- */
  --bg-canvas: var(--n-50);
  --bg-surface: var(--n-0);
  --bg-subtle: var(--n-100);
  --bg-inverse: var(--n-900);

  --border-default: var(--n-200);
  --border-strong: var(--n-300);
  --border-focus: var(--teal-500);
  --border-critical: var(--red-500);

  --text-primary: var(--n-900);
  --text-secondary: var(--n-600);
  --text-muted: var(--n-500);
  --text-inverse: var(--n-0);
  --text-link: var(--teal-700);
  --text-critical: var(--red-600);

  --action-primary: var(--teal-600);
  --action-primary-hover: var(--teal-700);
  --action-primary-text: var(--n-0);
  --action-secondary-bg: var(--n-0);
  --action-secondary-border: var(--n-300);
  --action-danger: var(--red-600);
  --action-disabled: var(--n-200);

  --status-normal: var(--green-500);      --status-normal-bg: var(--green-50);
  --status-warning: var(--amber-500);     --status-warning-bg: var(--amber-50);
  --status-critical: var(--red-600);      --status-critical-bg: var(--red-50);
  --status-info: var(--blue-500);         --status-info-bg: var(--blue-50);

  --rol-pacient: #1971C2;
  --rol-teren: #2F9E44;
  --rol-medic: #6741D9;

  /* --- spațiere --- */
  --space-1:4px;  --space-2:8px;  --space-3:12px; --space-4:16px; --space-5:20px;
  --space-6:24px; --space-7:32px; --space-8:40px; --space-9:48px; --space-10:64px;

  /* --- raze --- */
  --radius-sm:8px; --radius-md:12px; --radius-lg:16px; --radius-xl:24px; --radius-pill:999px;

  /* --- ținte de atingere: nenegociabile pe tabletă --- */
  --touch-min:56px; --touch-comfort:64px; --touch-sos:72px;

  /* --- tipografie --- */
  --font: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;

  --fs-display:40px;  --lh-display:48px;
  --fs-h1:32px;       --lh-h1:40px;
  --fs-h2:26px;       --lh-h2:34px;
  --fs-h3:21px;       --lh-h3:28px;
  --fs-body-l:18px;   --lh-body-l:28px;   /* implicit pe tabletă */
  --fs-body-m:16px;   --lh-body-m:24px;
  --fs-body-s:14px;   --lh-body-s:20px;
  --fs-label-l:18px;  --lh-label-l:24px;
  --fs-label-m:15px;  --lh-label-m:20px;
  --fs-label-s:13px;  --lh-label-s:16px;
  --fs-caption:12px;  --lh-caption:16px;
  --fs-num-xl:44px;   --lh-num-xl:48px;
  --fs-num-l:30px;    --lh-num-l:36px;
  --fs-num-m:20px;    --lh-num-m:24px;
}
