/* ==========================================================================
   MEDLINE DESIGN SYSTEM — LAYER 1: PRIMITIVES
   Raw values only. No component ever reads from this file directly.
   Admin theme settings overwrite a subset of these via an inline :root block.
   ========================================================================== */

:root {

  /* --- Brand -------------------------------------------------------------
     Primary is the Medline logo blue (#006CC0), not the kit's #0757c9.
     Danger is the logo red (#E4222B) — reserved for emergency / destructive.
     It is never used as a decorative accent.                              */

  --c-blue-50:  #eaf4ff;
  --c-blue-100: #cfe6ff;
  --c-blue-200: #9ecdff;
  --c-blue-300: #5faeff;
  --c-blue-400: #2189e8;
  --c-blue-500: #006cc0;   /* brand */
  --c-blue-600: #0059a0;
  --c-blue-700: #01467e;
  --c-blue-800: #06355e;
  --c-blue-900: #072741;

  --c-red-50:   #ffeced;
  --c-red-400:  #f0454d;
  --c-red-500:  #e4222b;   /* brand — emergency / destructive only */
  --c-red-600:  #c2151d;
  --c-red-700:  #981117;

  --c-green-50:  #e8faf2;
  --c-green-400: #2fbd88;
  --c-green-500: #19a875;  /* success */
  --c-green-600: #128560;
  --c-whatsapp:  #20c56a;
  --c-whatsapp-ink: #128c48;

  --c-amber-50:  #fff5e6;
  --c-amber-500: #e08600;
  --c-amber-600: #b56a00;

  /* --- Neutrals --------------------------------------------------------- */

  --c-n-0:   #ffffff;
  --c-n-25:  #fbfcfe;
  --c-n-50:  #fbf9f6;  /* warm paper — the cold grey read as unfinished */
  --c-n-100: #eef2f7;
  --c-n-200: #e1e7ef;
  --c-n-300: #cbd4e0;
  --c-n-400: #7c8da2;
  --c-n-500: #5d6d80;
  --c-n-600: #4d5c6e;
  --c-n-700: #33404f;
  --c-n-800: #1c2734;
  --c-n-850: #131e2a;
  --c-n-900: #0b1728;
  --c-n-950: #07111d;

  /* --- Department tints -------------------------------------------------
     The kit's signature. Kept verbatim; dark variants added in layer 2.   */

  --c-tint-blue:  #e9f3ff;
  --c-tint-mint:  #e8faf2;
  --c-tint-peach: #fff0e7;
  --c-tint-lav:   #f0edff;
  --c-tint-sand:  #fdf4e3;
  --c-tint-rose:  #ffedf1;

  /* --- Typography -------------------------------------------------------
     One family, self-hosted. Urdu stack is separate: the tight negative
     tracking below must never be applied to Nastaliq.                     */

  --font-sans: "Plus Jakarta Sans", -apple-system, BlinkMacSystemFont,
               "Segoe UI", Roboto, sans-serif;
  --font-urdu: "Noto Nastaliq Urdu", "Noto Naskh Arabic", serif;
  --font-mono: ui-monospace, SFMono-Regular, Menlo, monospace;

  /* Body floor raised to 15px — the kit's 13px body and 9–10px meta text
     are unreadable and fail the brief's own legibility requirement.       */

  --fs-display: clamp(2.75rem, 5.2vw, 4.5rem);  /* 44 → 72 */
  --fs-h1:      clamp(2.25rem, 4.2vw, 3.5rem);  /* 36 → 56 */
  --fs-h2:      clamp(1.875rem, 3.2vw, 2.75rem);/* 30 → 44 */
  --fs-h3:      clamp(1.375rem, 2vw, 1.75rem);  /* 22 → 28 */
  --fs-h4:      1.25rem;   /* 20 */
  --fs-lead:    1.125rem;  /* 18 */
  --fs-body:    0.9375rem; /* 15 — floor */
  --fs-sm:      0.875rem;  /* 14 */
  --fs-label:   0.8125rem; /* 13 */
  --fs-caption: 0.75rem;   /* 12 — hard floor */
  --fs-eyebrow: 0.6875rem; /* 11 — uppercase, tracked, short strings only */

  --fw-regular: 400;
  --fw-medium:  500;
  --fw-semi:    600;
  --fw-bold:    700;
  --fw-black:   800;

  --lh-tight:   1.02;
  --lh-heading: 1.14;
  --lh-snug:    1.35;
  --lh-body:    1.6;

  --ls-display: -0.045em;
  --ls-heading: -0.025em;
  --ls-body:    0;
  --ls-eyebrow: 0.16em;

  /* --- Space — 4px base -------------------------------------------------- */

  --sp-1:  0.25rem;  /*  4 */
  --sp-2:  0.5rem;   /*  8 */
  --sp-3:  0.75rem;  /* 12 */
  --sp-4:  1rem;     /* 16 */
  --sp-6:  1.5rem;   /* 24 */
  --sp-8:  2rem;     /* 32 */
  --sp-12: 3rem;     /* 48 */
  --sp-16: 4rem;     /* 64 */
  --sp-5:  1.25rem;  /* 20 */
  --sp-7:  1.75rem;  /* 28 */
  --sp-10: 2.5rem;   /* 40 */
  --sp-14: 3.5rem;   /* 56 */
  --sp-20: 5rem;     /* 80 */
  --sp-22: 5.5rem;   /* 88 */
  --sp-24: 6rem;     /* 96 */
  --sp-30: 7.5rem;   /* 120 */
  --sp-40: 10rem;    /* 160 */

  /* --- Radius — 5 steps. The kit's 16 ad-hoc values all map into these. -- */

  --r-xs:   4px;
  --r-sm:   12px;
  --r-md:   20px;
  --r-lg:   28px;
  --r-full: 999px;

  /* --- Layout ------------------------------------------------------------ */

  --container:      1180px;
  --w-container:    1180px;   /* alias — several layers reference this name */
  --container-wide: 1360px;
  --container-text: 720px;
  --gutter:         1rem;
  --tap-min:        44px;   /* minimum touch target, enforced on all controls */

  /* --- Elevation --------------------------------------------------------- */

  --sh-rest:    0 1px 2px rgba(11, 41, 64, 0.05);
  --sh-raised:  0 8px 24px rgba(11, 41, 64, 0.08);
  --sh-overlay: 0 24px 70px rgba(3, 16, 27, 0.22);
  --sh-glass:   0 14px 45px rgba(11, 41, 64, 0.09);
  --sh-primary: 0 8px 22px rgba(0, 108, 192, 0.28);

  /* --- Motion ------------------------------------------------------------ */

  --ease-out:    cubic-bezier(0.22, 0.61, 0.36, 1);
  --ease-spring: cubic-bezier(0.34, 1.32, 0.64, 1);
  --dur-fast:    120ms;
  --dur-base:    180ms;
  --dur-slow:    320ms;

  /* --- Z index ----------------------------------------------------------- */

  --z-sticky:  100;
  --z-drawer:  200;
  --z-float:   300;
  --z-modal:   400;
  --z-toast:   500;
}

/* Breakpoints (documented — CSS custom properties can't be used in @media):
   sm 600px · md 900px · lg 1200px · xl 1440px
   QA widths: 360 375 390 414 768 1024 1280 1440                            */