/* ===================================================================
   tokens.css — design tokens (Rev 1)
   Active brand: L.A. Care default. ClariDynamics brand drop-in
   replaces the values in [data-brand="claridynamics"] block at bottom.
   =================================================================== */

:root {
  /* ---------- Surfaces ---------- */
  --color-bg:             #FFFFFF;
  --color-surface:        #F7F9FC;
  --color-surface-elev:   #FFFFFF;
  --color-surface-tinted: #EFF4FB;

  /* ---------- Ink ---------- */
  --color-ink:            #14223D;
  --color-ink-soft:       #4A5973;
  --color-ink-mute:       #7B879D;
  --color-ink-inverse:    #FFFFFF;

  /* ---------- Brand: L.A. Care default (extracted from live DOM) ---------- */
  --color-primary:        #024694;   /* lac-1st-blue */
  --color-primary-hover:  #013774;
  --color-primary-soft:   #EFF8FF;   /* lac-3rd-blue */
  --color-primary-strong: #002B5C;
  --color-secondary:      #0079AD;   /* lac-2nd-blue */
  --color-secondary-soft: #E1F2FA;

  --color-accent:         #F5A623;   /* sun orange from logo */
  --color-accent-hover:   #DC8E10;
  --color-accent-soft:    #FEF3DE;

  /* ---------- Status ---------- */
  --color-success:        #18794E;
  --color-success-soft:   #E6F4EC;
  --color-warn:           #B45309;
  --color-warn-soft:      #FDF1E1;
  --color-danger:         #B42318;
  --color-danger-soft:    #FDECEC;
  --color-info:           #0B6FC2;
  --color-info-soft:      #E2F0FB;

  /* ---------- Lines ---------- */
  --color-border:         #E2E8F0;
  --color-border-strong:  #C9D2E0;
  --color-focus-ring:     #003DA5;

  /* ---------- Department accents ---------- */
  --dept-giftcard:        #6E59A5;
  --dept-giftcard-soft:   #ECE7F6;
  --dept-healthy:         #2E7D5B;
  --dept-healthy-soft:    #E0F0E7;
  --dept-gifts:           #C2410C;
  --dept-gifts-soft:      #FDEDE3;

  /* ---------- Type ---------- */
  --font-display: 'Plus Jakarta Sans', 'Segoe UI', system-ui, -apple-system, sans-serif;
  --font-body:    'Inter', 'Segoe UI', system-ui, -apple-system, sans-serif;
  --font-mono:    ui-monospace, 'SFMono-Regular', Menlo, Consolas, monospace;

  --text-xs:    12px;
  --text-sm:    14px;
  --text-base:  16px;
  --text-lg:    18px;
  --text-xl:    20px;
  --text-2xl:   24px;
  --text-3xl:   30px;
  --text-4xl:   36px;
  --text-5xl:   48px;

  --lh-tight:   1.15;
  --lh-snug:    1.3;
  --lh-normal:  1.5;
  --lh-loose:   1.65;

  /* ---------- Radius ---------- */
  --radius-xs:    4px;
  --radius-sm:    6px;
  --radius-md:    10px;
  --radius-lg:    16px;
  --radius-xl:    24px;
  --radius-pill:  999px;

  /* ---------- Shadow ---------- */
  --shadow-xs:    0 1px 2px rgba(20,34,61,.05);
  --shadow-sm:    0 1px 3px rgba(20,34,61,.07);
  --shadow-md:    0 4px 12px rgba(20,34,61,.08);
  --shadow-lg:    0 12px 32px rgba(20,34,61,.12);
  --shadow-xl:    0 24px 64px rgba(20,34,61,.18);
  --shadow-ring:  0 0 0 3px rgba(0,61,165,.18);

  /* ---------- Spacing ---------- */
  --space-0:  0;
  --space-1:  4px;
  --space-2:  8px;
  --space-3:  12px;
  --space-4:  16px;
  --space-5:  20px;
  --space-6:  24px;
  --space-8:  32px;
  --space-10: 40px;
  --space-12: 48px;
  --space-16: 64px;
  --space-20: 80px;
  --space-24: 96px;

  /* ---------- Layout ---------- */
  --container-max:  1200px;
  --container-pad:  20px;
  --header-h:       72px;

  /* ---------- Motion ---------- */
  --ease-out:       cubic-bezier(.2,.8,.2,1);
  --ease-in-out:    cubic-bezier(.4,0,.2,1);
  --dur-instant:    100ms;
  --dur-fast:       180ms;
  --dur-base:       240ms;
  --dur-slow:       360ms;

  /* ---------- Z ---------- */
  --z-dropdown:   100;
  --z-sticky:     200;
  --z-modal:      900;
  --z-toast:      1000;
}

/* ClariDynamics brand drop-in (placeholder; will overwrite when brand assets arrive) */
[data-brand="claridynamics"] {
  --color-primary:        #1F4F8F;       /* placeholder navy */
  --color-primary-hover:  #163E72;
  --color-primary-soft:   #E6EDF6;
  --color-accent:         #00A88E;       /* placeholder teal */
  --color-accent-soft:    #DFF5F0;
}
