/* ============================================================================
   STAND TO - Design Tokens  ·  "AURA" warm theme (Mil Health design system)
   Warm, human, hopeful - "a calm flame." Coral/flame energy + lavender calm on
   peach-cream light, generous rounding, frosted glass, gradient icon badges.
   MUST feel warm and uplifting, NEVER sombre. Token NAMES are unchanged from the
   prior theme so the whole app re-skins; values map to the Aura palette.
   ============================================================================ */

:root {
  /* ---- Aura raw palette ---- */
  --coral-50:#FFF2EC; --coral-100:#FFE1D5; --coral-200:#FFC4AE; --coral-300:#FF9F7E;
  --coral-400:#FF7A4E; --coral-500:#FF5A36; --coral-600:#F4421E; --coral-700:#D63414; --coral-800:#A8280E;
  --lavender-50:#F6F1FB; --lavender-100:#ECE2F6; --lavender-200:#DBC9EE; --lavender-300:#C9ACE6;
  --lavender-400:#B891DC; --lavender-500:#A877CF; --lavender-600:#8E5DBA;
  --cream-50:#FFF8F4; --cream-100:#FFF1EA; --peach-100:#FDE9E2; --peach-200:#FBDDD3;
  --blush-100:#F9DCDA; --blush-200:#F3C9CC;
  --ink-900:#1C1419; --ink-800:#2A2230; --ink-700:#3D3340;
  --gray-600:#6B6068; --gray-500:#8A7F86; --gray-400:#A99FA5; --gray-300:#CFC6CB;
  --gray-200:#E7DFE3; --gray-100:#F2ECEF; --white:#FFFFFF;

  /* ---- Surfaces (warm peach-cream, never cold) ---- */
  --color-bg:            #FFF1EA;  /* app canvas (cream-100) */
  --color-bg-tint:       #FDE9E2;  /* peach-100 - deeper section bg */
  --color-surface:       #FFFFFF;  /* cards & sheets */
  --color-surface-raised:#FFFFFF;
  --color-surface-sunken:#FFF8F4;  /* cream-50 */
  --color-border:        rgba(28,20,25,0.07);  /* warm translucent hairline */
  --color-border-strong: #E7DFE3;

  /* ---- Primary: coral / flame ---- */
  --color-primary-50:  #FFF2EC;
  --color-primary-100: #FFE1D5;
  --color-primary-200: #FFC4AE;
  --color-primary-300: #FF9F7E;
  --color-primary-400: #FF7A4E;
  --color-primary:     #FF5A36;
  --color-primary-strong: #F4421E;  /* readable coral text on light */
  --color-primary-700: #D63414;
  --color-primary-900: #A8280E;

  /* ---- Accent: lavender (calm counterpoint) ---- */
  --color-accent-50:  #F6F1FB;
  --color-accent-100: #ECE2F6;
  --color-accent-200: #DBC9EE;
  --color-accent-300: #C9ACE6;
  --color-accent:     #A877CF;
  --color-accent-strong: #8E5DBA;

  --color-rose:  #F3C9CC;
  --color-sky:   #C9ACE6;          /* lavender accent for the leave-pass markers */

  /* ---- Text ramp (warm ink, never pure black/gray) ---- */
  --color-text:          #1C1419;  /* ink-900 */
  --color-text-secondary:#6B6068;  /* gray-600 */
  --color-text-tertiary: #8A7F86;  /* gray-500 */
  --color-on-primary:    #FFFFFF;
  --color-on-accent:     #FFFFFF;

  /* ---- Semantic ---- */
  --color-success:       #3FA776;
  --color-success-text:  #2E7E58;
  --color-info:          #5B8DD6;
  --color-warning:       #E8A23D;
  --color-warning-text:  #B97A1C;
  --color-danger:        #E04848;
  --color-danger-text:   #C13434;
  --color-danger-soft:   #FBE4E4;

  /* ---- RAG (case-handler status) ---- */
  --rag-green:    #3FA776;
  --rag-green-bg: #E3F3EB;
  --rag-amber:    #E8A23D;
  --rag-amber-bg: #FBEEDA;
  --rag-red:      #E04848;
  --rag-red-bg:   #FBE4E4;

  /* ---- Mood scale (lavender low -> coral great) ---- */
  --mood-1: #A877CF;  /* low - lavender */
  --mood-2: #B891DC;
  --mood-3: #8FB8C9;  /* neutral - soft teal */
  --mood-4: #FF7A4E;  /* good - warm coral */
  --mood-5: #F4421E;  /* great - flame */

  /* ---- Aura gradients (core, not decoration) ---- */
  --grad-flame:    linear-gradient(135deg, #FF8A4C 0%, #FF4D2E 100%);
  --grad-score:    linear-gradient(135deg, #FF6B3D 0%, #F4421E 100%);
  --grad-ember:    linear-gradient(160deg, #FF7A4E 0%, #F4421E 60%, #D63414 100%);
  --grad-lavender: linear-gradient(135deg, #C9ACE6 0%, #A877CF 100%);
  --grad-warm:     linear-gradient(160deg, #FFF1EA 0%, #FDE3DC 100%);
  --grad-app-bg:   linear-gradient(180deg, #FFF4ED 0%, #FBE6E6 55%, #F4DDE6 100%);
  --grad-dawn:     linear-gradient(180deg, #FFE7D8 0%, #F7DCE0 50%, #E9D6EF 100%);

  /* ---- Glass ---- */
  --glass-light:      rgba(255,255,255,0.55);
  --glass-border:     rgba(255,255,255,0.30);
  --glass-dark:       rgba(34,26,34,0.55);
  --glass-dark-strong:rgba(28,20,25,0.72);
  --blur-glass: 18px;

  /* ---- Typography ---- */
  --font-display: 'Hanken Grotesk', ui-sans-serif, system-ui, -apple-system, sans-serif;
  --font-body:    'Hanken Grotesk', ui-sans-serif, system-ui, -apple-system, sans-serif;
  --font-mono:    'Geist Mono', ui-monospace, 'SF Mono', Menlo, monospace;

  --fs-display: 3rem;
  --fs-h1:      2.0rem;
  --fs-h2:      1.55rem;
  --fs-h3:      1.25rem;
  --fs-title:   1.125rem;
  --fs-body-lg: 1.0625rem;
  --fs-body:    1rem;
  --fs-caption: 0.875rem;
  --fs-label:   0.75rem;

  /* ---- Radii (soft + large; pills for actions) ---- */
  --radius-xs:   8px;
  --radius-sm:   12px;
  --radius-md:   16px;
  --radius-lg:   22px;  /* default card */
  --radius-xl:   28px;  /* hero / large cards */
  --radius-2xl:  36px;
  --radius-pill: 999px;

  /* ---- Shadows (soft, warm-tinted; coral glow for primary) ---- */
  --shadow-xs:   0 1px 2px rgba(28,20,25,0.06);
  --shadow-sm:   0 2px 8px rgba(28,20,25,0.06);
  --shadow-md:   0 8px 24px rgba(28,20,25,0.10);
  --shadow-lg:   0 18px 44px rgba(28,20,25,0.14);
  --shadow-card: 0 4px 16px rgba(28,20,25,0.07);
  --shadow-glow:      0 12px 30px rgba(255,90,54,0.38);
  --shadow-glow-soft: 0 8px 22px rgba(255,90,54,0.22);
  --shadow-lavender:  0 12px 30px rgba(168,119,207,0.32);
  --shadow-glass:     0 16px 40px rgba(28,20,25,0.22);

  /* ---- Spacing (4pt base) ---- */
  --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;

  /* ---- Motion ---- */
  --ease-calm: cubic-bezier(.22,.61,.36,1);
  --ease-spring: cubic-bezier(0.34, 1.45, 0.5, 1);
  --dur:       320ms;
  --dur-fast:  200ms;

  /* ---- Accessibility ---- */
  --tap-min: 48px;
  --focus-ring: 0 0 0 3px rgba(255,90,54,0.45);
}

/* ---- Base reset ---- */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  font-family: var(--font-body);
  font-size: var(--fs-body);
  line-height: 1.5;
  color: var(--color-text);
  background: var(--color-bg);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
h1, h2, h3, h4 { font-family: var(--font-display); font-weight: 800; line-height: 1.08; margin: 0; color: var(--color-text); letter-spacing: -.02em; }
h1 { font-size: var(--fs-h1); }
h2 { font-size: var(--fs-h2); }
h3 { font-size: var(--fs-h3); font-weight: 700; }
p  { margin: 0 0 var(--space-3); }
a  { color: var(--color-primary-strong); text-decoration: none; }
button { font-family: inherit; border: none; background: none; color: inherit; }
img, svg { display: block; }
small { font-size: var(--fs-caption); }

:focus-visible { outline: none; box-shadow: var(--focus-ring); border-radius: var(--radius-sm); }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
    scroll-behavior: auto !important;
  }
}

/* ---- Utilities ---- */
.u-display { font-family: var(--font-display); }
.u-muted   { color: var(--color-text-secondary); }
.u-tertiary{ color: var(--color-text-tertiary); }
.u-center  { text-align: center; }
.u-bold    { font-weight: 700; }
.u-caption { font-size: var(--fs-caption); }
/* eyebrow: small uppercase wide-tracked label (Aura's only uppercase) */
.u-label   { font-size: var(--fs-label); font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--color-text-tertiary); }
.u-hidden  { display: none !important; }
.stack > * + * { margin-top: var(--space-3); }
.stack-lg > * + * { margin-top: var(--space-5); }
.row { display: flex; align-items: center; gap: var(--space-3); }
.row-between { display: flex; align-items: center; justify-content: space-between; gap: var(--space-3); }
.grow { flex: 1; }
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; border:0; }