/* =====================================================================
   Diet Solution BD — design tokens
   Palette "Emerald & Onyx": a bright emerald as the single action colour
   (onyx ink on it), cool porcelain→onyx neutrals, a soft iris accent for
   rare brand moments, and a true-neutral graphite dark mode.
   Clinical status: colour = severity, never alone.
   Every text pair below is WCAG AA or better (see docs/DESIGN.md).
   ===================================================================== */
:root{
  color-scheme:light;

  /* ---- raw scales ---- */
  --p-50:#EBFDF1;--p-100:#D5FAE2;--p-200:#ADF5C7;--p-300:#77EAA4;--p-400:#3BD079;
  --p-500:#0AA655;--p-600:#049149;--p-700:#097940;--p-800:#016337;--p-900:#034A2C;--p-950:#081E14;
  --a-50:#F5F6FF;--a-100:#EBEDFF;--a-200:#DADDFE;--a-300:#C2C5FE;--a-400:#A0A2F6;
  --a-500:#8888EB;--a-600:#6C66D9;--a-700:#564AC1;--a-800:#4439A0;--a-900:#332B7B;--a-950:#1D184B;
  --n-0:#FFFFFF;--n-25:#FBFCFE;--n-50:#F9FAFC;--n-75:#F5F7F9;--n-100:#F1F4F7;--n-150:#EAEDF1;--n-200:#E3E7EB;
  --n-300:#D0D5DA;--n-400:#A5ACB2;--n-500:#6E757C;--n-600:#5A6169;--n-700:#444B53;
  --n-800:#2D343B;--n-900:#191F25;--n-950:#0B1015;

  /* ---- surfaces ---- */
  --bg:#F8FAFB;               /* app canvas: cool porcelain */
  --bg-sunken:#F0F3F6;        /* wells, sidebar hover rails */
  --surface:#FFFFFF;          /* cards, inputs */
  --surface-2:#F5F8FA;        /* table header, subtle fills */
  --surface-3:#EBEFF2;        /* pressed, segmented track */
  --overlay:rgba(11,16,21,0.42);
  --hover:rgba(25,31,37,0.045);
  --pressed:rgba(25,31,37,0.08);

  /* ---- lines ---- */
  --border:#E0E4E8;
  --border-subtle:#EAEDF1;
  --border-input:#C4CACF;
  --border-input-hover:#A5ACB2;
  --border-strong:#868D95;

  /* ---- text ---- */
  --text:#0B1015;             /* ink: 18.2:1 on the canvas */
  --text-2:#31373F;           /* secondary copy */
  --text-3:#545C64;           /* muted: 6.8:1 */
  --text-4:#656D74;           /* placeholder / min small text: 5.3:1 on white, 5.0 on --bg, 4.7 on --bg-sunken, 4.5 on --surface-3 */
  --text-inverse:#F9FAFC;

  /* ---- brand / action ---- */
  --primary:#0AA655;          /* bright emerald; its text is onyx (--on-primary): 5.5:1 */
  --primary-hover:#26B864;
  --primary-active:#029D50;
  --on-primary:#081E14;
  --primary-soft:#E7FCEF;     /* selected rows, active nav */
  --primary-soft-2:#CFF8DD;
  --primary-soft-border:#A3EBBD;
  --primary-text:#016337;     /* green text on soft bg (6.9:1) */
  --link:#097940;
  --ring:#049149;
  --ring-soft:rgba(10,166,85,0.26);

  --accent:#8888EB;           /* iris — brand moments only, never status */
  --accent-strong:#564AC1;    /* accent as text (6.7:1) */
  --accent-soft:#F5F6FF;
  --accent-soft-border:#DADDFE;

  /* ---- clinical / system status (bg · border · text · signal) ---- */
  --ok-bg:#EDFAF5;--ok-bd:#BCEBDC;--ok-tx:#01574B;--ok-sig:#19B097;       /* normal / success: teal, not brand green */
  --warn-bg:#FFF8E6;--warn-bd:#FADF9E;--warn-tx:#784903;--warn-sig:#E0A20F; /* borderline / pending */
  --high-bg:#FFF5F1;--high-bd:#FBD3C3;--high-tx:#8A2400;--high-sig:#C6400A; /* high risk / error */
  --crit-bg:#FFF4F4;--crit-bd:#F8CFD0;--crit-tx:#850327;--crit-sig:#A10230; /* critical / destructive */
  --info-bg:#F2F8FE;--info-bd:#C9E0F8;--info-tx:#02477D;--info-sig:#0671C2; /* informational, non-clinical */
  --danger:#B42318;--danger-hover:#912018;--on-danger:#FFFFFF;

  /* ---- macros & charts ---- */
  --mac-protein:#00542F;--mac-carb:#F2B347;--mac-fat:#D87248;--mac-fiber:#6885C3;--mac-kcal:#191F25;
  /* paper constants: the same in every theme, for always-light surfaces (printed-sheet previews); see .mac-paper */
  --mac-protein-paper:#00542F;--mac-carb-paper:#F2B347;--mac-fat-paper:#D87248;--mac-fiber-paper:#6885C3;--mac-kcal-paper:#191F25;
  --chart-1:#049149;--chart-2:#D87248;--chart-3:#6885C3;--chart-4:#E0A20F;
  --chart-grid:#E8EBEF;--chart-axis:#868D95;--chart-label:#545C64;--chart-bar:#0AA655;--chart-bar-2:#D5FAE2;
  --chart-band:#EBFDF1;--chart-band-warn:#FFF6E0;--chart-band-high:#FFF1EB;

  /* ---- logo ---- */
  --logo-arc:#097940;--logo-heart:#081E14;--logo-leaf-l:#097940;--logo-leaf-r:#0AA655;

  /* ---- elevation (ink-tinted, layered) ---- */
  --shadow-xs:0 1px 1px rgba(11,16,21,.04);
  --shadow-sm:0 1px 2px rgba(11,16,21,.05),0 1px 1px rgba(11,16,21,.03);
  --shadow-md:0 1px 2px rgba(11,16,21,.04),0 6px 16px -6px rgba(11,16,21,.10);
  --shadow-pop:0 0 0 1px rgba(11,16,21,.06),0 4px 8px -2px rgba(11,16,21,.08),0 16px 32px -8px rgba(11,16,21,.14);
  --shadow-modal:0 0 0 1px rgba(11,16,21,.06),0 12px 24px -6px rgba(11,16,21,.14),0 32px 64px -12px rgba(11,16,21,.22);
  --shadow-up:0 -8px 24px -12px rgba(11,16,21,.12);   /* bars docked to the bottom edge */
  --btn-highlight:inset 0 1px 0 rgba(255,255,255,.14);

  /* ---- text selection ---- */
  --selection-bg:var(--p-200);--selection-tx:var(--p-950);

  /* ---- shape ---- */
  --r-xs:4px;--r-sm:6px;--r-md:8px;--r-lg:10px;--r-xl:14px;--r-pill:999px;

  /* ---- type ---- */
  --font-sans:"Onest","Hind Siliguri","Segoe UI",system-ui,-apple-system,"Noto Sans Bengali",sans-serif;
  --font-bn:"Hind Siliguri","Onest","Noto Sans Bengali","Segoe UI",system-ui,sans-serif;
  --font-display:"Newsreader","Hind Siliguri",Georgia,"Times New Roman",serif;
  --font-mono:ui-monospace,"Cascadia Mono","SF Mono",Consolas,"Liberation Mono",monospace;
  --fs-2xs:11px;--fs-xs:12px;--fs-sm:13px;--fs-base:14px;--fs-md:15px;--fs-lg:16px;--fs-xl:18px;--fs-2xl:22px;--fs-3xl:28px;--fs-4xl:36px;

  /* ---- motion ---- */
  --ease-out:cubic-bezier(.23,1,.32,1);--ease-drawer:cubic-bezier(.32,.72,0,1);
  --dur-1:120ms;--dur-2:160ms;--dur-3:200ms;--dur-4:260ms;

  /* ---- layout ---- */
  --sidebar-w:252px;--topbar-h:56px;--content-max:1320px;--gutter:32px;

  /* ---- form controls (theme-aware chevron) ---- */
  --chevron:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%236E757C' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m7 15 5 5 5-5'/%3E%3Cpath d='m7 9 5-5 5 5'/%3E%3C/svg%3E");
  --search-glyph:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%236E757C' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='m20 20-3.5-3.5'/%3E%3C/svg%3E");

  /* ---- legacy aliases (older markup / inline styles keep working) ---- */
  --green:var(--primary);--green-dark:var(--primary-hover);--green-light:var(--primary-soft-2);--green-soft:var(--primary-soft);
  --amber:var(--accent-strong);--amber-soft:var(--accent-soft);--red:var(--danger);--red-soft:var(--high-bg);--sky:var(--info-sig);
  --gray:var(--text-3);--gray-light:var(--surface-2);--line:var(--border);--white:var(--surface);
  --radius:var(--r-lg);--radius-sm:var(--r-sm);--radius-lg:var(--r-xl);
}

/* ---------------- dark theme ----------------
   Applied when the OS prefers dark (unless the user forced light),
   or when the user picked dark. Print documents force light. */
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]){
    color-scheme:dark;
    --bg:#0B0C0D;--bg-sunken:#070708;--surface:#121315;--surface-2:#171819;--surface-3:#1E1F22;
    --overlay:rgba(0,0,0,.6);--hover:rgba(237,238,240,.05);--pressed:rgba(237,238,240,.09);
    --border:#242628;--border-subtle:#1B1C1E;--border-input:#37393C;--border-input-hover:#525458;--border-strong:#6A6D72;
    --text:#EFF0F1;--text-2:#D3D4D7;--text-3:#A7A9AD;--text-4:#8E9195;--text-inverse:#0B1015;
    --primary:#40CA74;--primary-hover:#5DD786;--primary-active:#2CBB67;--on-primary:#081E14; /* onyx text 8.2 / 9.6 / 7.0:1 */
    --primary-soft:rgba(64,202,116,0.11);--primary-soft-2:rgba(64,202,116,0.17);--primary-soft-border:rgba(64,202,116,0.3);
    --primary-text:#7CE0A2;--link:#63D990;--ring:#40CA74;--ring-soft:rgba(64,202,116,0.3);
    --accent:#A5A8F8;--accent-strong:#BEC1FE;--accent-soft:rgba(165,168,248,0.12);--accent-soft-border:rgba(165,168,248,0.3);
    --ok-bg:rgba(25,176,151,.12);--ok-bd:rgba(25,176,151,.30);--ok-tx:#7FE0C6;--ok-sig:#2FC4A8;
    --warn-bg:rgba(236,165,18,.12);--warn-bd:rgba(236,165,18,.30);--warn-tx:#F8CF72;--warn-sig:#F0B21E;
    --high-bg:rgba(233,84,23,.12);--high-bd:rgba(233,84,23,.32);--high-tx:#FDA886;--high-sig:#F2703A;
    --crit-bg:rgba(244,74,97,.12);--crit-bd:rgba(244,74,97,.32);--crit-tx:#FEA3AE;--crit-sig:#F4566C;
    --info-bg:rgba(60,149,232,.12);--info-bd:rgba(60,149,232,.30);--info-tx:#9CCBFA;--info-sig:#5AA8F0;
    --danger:#D9362B;--danger-hover:#C22F25;
    --mac-protein:#40C786;--mac-carb:#F2B347;--mac-fat:#E4875F;--mac-fiber:#8AA3D6;--mac-kcal:#EFF0F1;
    --chart-1:#40CA74;--chart-2:#E4875F;--chart-3:#8AA3D6;--chart-4:#F0B21E;
    --chart-grid:#1D1E20;--chart-axis:#6A6D72;--chart-label:#A7A9AD;--chart-bar:#2CBB67;--chart-bar-2:#1A2E21;
    --chart-band:rgba(64,202,116,0.07);--chart-band-warn:rgba(236,165,18,.08);--chart-band-high:rgba(233,84,23,.08);
    --logo-arc:#40CA74;--logo-heart:#F9FAFC;--logo-leaf-l:#40CA74;--logo-leaf-r:#77EAA4;
    --shadow-xs:0 1px 1px rgba(0,0,0,.3);--shadow-sm:0 1px 2px rgba(0,0,0,.35);
    --shadow-md:0 1px 2px rgba(0,0,0,.3),0 8px 20px -8px rgba(0,0,0,.5);
    --shadow-pop:0 0 0 1px rgba(255,255,255,.06),0 8px 16px -4px rgba(0,0,0,.5),0 20px 40px -12px rgba(0,0,0,.6);
    --shadow-modal:0 0 0 1px rgba(255,255,255,.07),0 24px 64px -12px rgba(0,0,0,.7);
    --shadow-up:0 -8px 24px -12px rgba(0,0,0,.55);
    --btn-highlight:inset 0 1px 0 rgba(255,255,255,.10);
    --selection-bg:#105C31;--selection-tx:#FFFFFF;
    --chevron:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23A7A9AD' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m7 15 5 5 5-5'/%3E%3Cpath d='m7 9 5-5 5 5'/%3E%3C/svg%3E");
    --search-glyph:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23A7A9AD' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='m20 20-3.5-3.5'/%3E%3C/svg%3E");
  }
}
:root[data-theme="dark"]{
  color-scheme:dark;
  --bg:#0B0C0D;--bg-sunken:#070708;--surface:#121315;--surface-2:#171819;--surface-3:#1E1F22;
  --overlay:rgba(0,0,0,.6);--hover:rgba(237,238,240,.05);--pressed:rgba(237,238,240,.09);
  --border:#242628;--border-subtle:#1B1C1E;--border-input:#37393C;--border-input-hover:#525458;--border-strong:#6A6D72;
  --text:#EFF0F1;--text-2:#D3D4D7;--text-3:#A7A9AD;--text-4:#8E9195;--text-inverse:#0B1015;
  --primary:#40CA74;--primary-hover:#5DD786;--primary-active:#2CBB67;--on-primary:#081E14; /* onyx text 8.2 / 9.6 / 7.0:1 */
  --primary-soft:rgba(64,202,116,0.11);--primary-soft-2:rgba(64,202,116,0.17);--primary-soft-border:rgba(64,202,116,0.3);
  --primary-text:#7CE0A2;--link:#63D990;--ring:#40CA74;--ring-soft:rgba(64,202,116,0.3);
  --accent:#A5A8F8;--accent-strong:#BEC1FE;--accent-soft:rgba(165,168,248,0.12);--accent-soft-border:rgba(165,168,248,0.3);
  --ok-bg:rgba(25,176,151,.12);--ok-bd:rgba(25,176,151,.30);--ok-tx:#7FE0C6;--ok-sig:#2FC4A8;
  --warn-bg:rgba(236,165,18,.12);--warn-bd:rgba(236,165,18,.30);--warn-tx:#F8CF72;--warn-sig:#F0B21E;
  --high-bg:rgba(233,84,23,.12);--high-bd:rgba(233,84,23,.32);--high-tx:#FDA886;--high-sig:#F2703A;
  --crit-bg:rgba(244,74,97,.12);--crit-bd:rgba(244,74,97,.32);--crit-tx:#FEA3AE;--crit-sig:#F4566C;
  --info-bg:rgba(60,149,232,.12);--info-bd:rgba(60,149,232,.30);--info-tx:#9CCBFA;--info-sig:#5AA8F0;
  --danger:#D9362B;--danger-hover:#C22F25;
  --mac-protein:#40C786;--mac-carb:#F2B347;--mac-fat:#E4875F;--mac-fiber:#8AA3D6;--mac-kcal:#EFF0F1;
  --chart-1:#40CA74;--chart-2:#E4875F;--chart-3:#8AA3D6;--chart-4:#F0B21E;
  --chart-grid:#1D1E20;--chart-axis:#6A6D72;--chart-label:#A7A9AD;--chart-bar:#2CBB67;--chart-bar-2:#1A2E21;
  --chart-band:rgba(64,202,116,0.07);--chart-band-warn:rgba(236,165,18,.08);--chart-band-high:rgba(233,84,23,.08);
  --logo-arc:#40CA74;--logo-heart:#F9FAFC;--logo-leaf-l:#40CA74;--logo-leaf-r:#77EAA4;
  --shadow-xs:0 1px 1px rgba(0,0,0,.3);--shadow-sm:0 1px 2px rgba(0,0,0,.35);
  --shadow-md:0 1px 2px rgba(0,0,0,.3),0 8px 20px -8px rgba(0,0,0,.5);
  --shadow-pop:0 0 0 1px rgba(255,255,255,.06),0 8px 16px -4px rgba(0,0,0,.5),0 20px 40px -12px rgba(0,0,0,.6);
  --shadow-modal:0 0 0 1px rgba(255,255,255,.07),0 24px 64px -12px rgba(0,0,0,.7);
  --shadow-up:0 -8px 24px -12px rgba(0,0,0,.55);
  --btn-highlight:inset 0 1px 0 rgba(255,255,255,.10);
  --selection-bg:#105C31;--selection-tx:#FFFFFF;
  --chevron:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23A7A9AD' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m7 15 5 5 5-5'/%3E%3Cpath d='m7 9 5-5 5 5'/%3E%3C/svg%3E");
  --search-glyph:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23A7A9AD' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='m20 20-3.5-3.5'/%3E%3C/svg%3E");
}