/* Shared visual tokens for patient and staff pages. No layout or clinical status logic. */
:root {
  /* Approved Quindlee palette — all web routes share this one source. */
  --color-forest: #183E32;
  --color-orange: #FA835E;
  --color-orange-tint: #FFE6D7;
  --color-orange-deep: #E9633C;
  --color-orange-hover: #FF9070;
  --color-orange-press: #CE5230;
  --color-peach-line: #F6C9AE;
  --color-mint: #75B893;
  --color-mint-deep: #246C52;
  --color-mint-text: #246C52;
  --color-mint-tint: #EAF4ED;
  --color-mint-pale: #F4F8F3;
  --color-ink: #202923;
  --color-white: #FFFFFF;

  /* Semantic and surface colours */
  --color-success: #75B893;
  --color-success-bg: #EAF4ED;
  --color-success-text: #246C52;
  --color-warning: #EFB01A;
  --color-warning-bg: #FFF8E6;
  --color-warning-text: #906811;
  --color-warning-glyph: #EFB01A;
  --color-error: #E0553A;
  --color-error-bg: #FCEAE3;
  --color-error-text: #B23A24;
  --color-error-glyph: #C13E28;
  --color-info: #3B9EE5;
  --color-info-bg: #EFF8FF;
  --color-info-text: #1D6FB0;
  --color-surface-white: #FFFFFF;
  --color-surface-warm: #FCFBF8;
  --color-surface-mint: #EAF4ED;
  --color-surface-peach: #FFE6D7;
  --color-border: #DCE3DB;
  --color-border-strong: #B0C4BB;
  --color-text-primary: #202923;
  --color-text-secondary: #53645B;
  --color-text-tertiary: #64756B;
  --color-text-disabled: #748279;

  /* Type, spacing, shape and motion */
  --font-display: 'Poppins', system-ui, sans-serif;
  --font-body: 'Inter', system-ui, sans-serif;
  --space-1: .25rem;
  --space-2: .5rem;
  --space-3: .75rem;
  --space-4: 1rem;
  --space-5: 1.25rem;
  --space-6: 1.5rem;
  --space-8: 2rem;
  --space-10: 2.5rem;
  --space-12: 3rem;
  --space-16: 4rem;
  --space-20: 5rem;
  --space-24: 6rem;
  --text-xs: .75rem;
  --text-sm: .875rem;
  --text-base: 1rem;
  --text-md: 1.125rem;
  --text-lg: 1.25rem;
  --text-xl: 1.5rem;
  --text-2xl: 1.875rem;
  --text-3xl: 2.25rem;
  --text-4xl: 3rem;
  --leading-tight: 1.25;
  --leading-snug: 1.375;
  --leading-normal: 1.5;
  --leading-relaxed: 1.625;
  --leading-loose: 2;
  --font-weight-normal: 400;
  --font-weight-medium: 500;
  --font-weight-semibold: 600;
  --font-weight-bold: 700;
  /* V2 site radius scale: five values, with compatibility aliases below. */
  --site-radius-sm: 10px;
  --site-radius-md: 14px;
  --site-radius-lg: 18px;
  --site-radius-xl: 22px;
  --site-radius-pill: 999px;
  --site-radius-row: var(--site-radius-sm);
  --site-radius-card: var(--site-radius-md);
  --site-radius-float: var(--site-radius-lg);
  --radius-sm: .375rem;
  --radius-md: .75rem;
  --radius-lg: 1rem;
  --radius-xl: 1.5rem;
  --radius-full: 9999px;
  --shadow-xs: 0 1px 2px rgba(31, 36, 33, .05);
  --shadow-sm: 0 1px 3px rgba(31, 36, 33, .1), 0 1px 2px -1px rgba(31, 36, 33, .1);
  --shadow-md: 0 4px 6px -1px rgba(31, 36, 33, .1), 0 2px 4px -2px rgba(31, 36, 33, .1);
  --shadow-lg: 0 10px 15px -3px rgba(31, 36, 33, .1), 0 4px 6px -4px rgba(31, 36, 33, .1);
  --shadow-raised: 0 1px 4px rgba(31, 36, 33, .07);
  --shadow-card: 0 4px 18px rgba(31, 36, 33, .09);
  --shadow-float: 0 8px 28px rgba(31, 36, 33, .12);
  --shadow-dock: 0 -3px 14px rgba(31, 36, 33, .09);
  --shadow-focus: 0 0 0 3px rgba(36,108,82,.12);
  --site-shadow-raised: 0 2px 10px rgba(31, 36, 33, .05);
  --site-shadow-card: 0 8px 28px rgba(32,41,35,.05);
  --site-shadow-float: 0 16px 42px rgba(32,41,35,.09);
  --focus-lift: translateY(-1.5px);
  --transition-fast: 150ms ease;
  --transition-base: 200ms ease;
  --transition-slow: 300ms ease;
  --transition-spring: 300ms cubic-bezier(.34, 1.56, .64, 1);

  /* Website roles */
  --btn-primary-bg: var(--color-orange);
  --btn-primary-text: var(--color-ink);
  --btn-primary-border: var(--color-orange-deep);
  --btn-primary-bg-hover: var(--color-orange-hover);
  --btn-primary-bg-focus: var(--color-orange-deep);
  --btn-primary-bg-active: var(--color-orange-press);
  --btn-tertiary-bg: var(--color-white);
  --btn-tertiary-text: var(--color-ink);
  --btn-tertiary-border: var(--color-orange-deep);
  --btn-tertiary-bg-hover: #FFF7F3;
  --btn-tertiary-bg-focus: #FFF3EC;
  --btn-secondary-bg: var(--color-white);
  --btn-secondary-text: var(--color-mint-text);
  --btn-secondary-border: var(--color-border-strong);
  --btn-secondary-bg-hover: #CFEDE0;
  --btn-secondary-text-hover: var(--color-ink);
  --btn-secondary-bg-focus: #CFEDE0;
  --btn-secondary-border-focus: #0F5E44;
  --link-color: var(--color-mint-text);
  --link-color-hover: #183E32;
  --input-border: var(--color-border);
  --input-border-focus: var(--color-mint-text);
  --input-bg: var(--color-white);
  --input-text: var(--color-text-primary);
  --input-placeholder: var(--color-text-tertiary);
  --quinn-bubble-bg: var(--color-orange-tint);
  --quinn-bubble-text: var(--color-ink);
  --user-bubble-bg: var(--color-mint-tint);
  --user-bubble-text: var(--color-ink);
  --listrow-bg: var(--color-mint-pale);
  --listrow-glyph: var(--color-mint-text);
  --listrow-radius: var(--site-radius-sm);
  --row-bg: var(--listrow-bg);
  --row-glyph: var(--listrow-glyph);
  --row-text: var(--color-ink);
  --fit-online-bg: var(--color-orange-tint);
  --fit-online-glyph: var(--color-orange-deep);
  --fit-inperson-bg: var(--color-mint-tint);
  --fit-inperson-glyph: var(--color-mint-text);
  --chip-bg: var(--color-orange-tint);
  --chip-glyph: var(--color-orange-deep);
  --tab-underline: var(--color-orange);
  --search-bg: var(--color-white);
  --search-shadow: 0 3px 14px rgba(31, 36, 33, .10);
  --search-glyph: var(--color-mint-text);
  --search-clear-bg: var(--color-orange-tint);
  --search-clear-glyph: var(--color-orange-deep);
  --faq-toggle-bg: var(--color-orange-tint);
  --faq-toggle-glyph: var(--color-orange-deep);
  --site-ground-white: var(--color-surface-white);
  --site-ground-mint: var(--color-mint-tint);
  --site-ground-peach: var(--color-orange-tint);
  --site-hero-ground: radial-gradient(ellipse at 94% 36%, var(--color-orange-tint), transparent 60%), var(--color-surface-warm);
  --closing-ground: var(--color-orange-tint);
  --closing-card-bg: var(--color-surface-white);
  --footer-ground: var(--color-surface-warm);
  --claim-bg: var(--color-orange-tint);
  --claim-glyph: var(--color-orange-deep);
  --aside-border: var(--color-peach-line);
  --on-peach-label: var(--color-ink);
  --on-peach-body: var(--color-text-secondary);
  --carerow-bg: var(--color-surface-white);
  --carerow-border: var(--color-border);
  --carerow-bg-hover: var(--color-orange-tint);
  --carerow-arrow: var(--color-orange);
  --carerow-soon-title: var(--color-text-secondary);
  --carerow-soon-desc: var(--color-text-disabled);
  --soon-pill-bg: var(--color-mint-tint);
  --soon-pill-text: var(--color-mint-text);
  --soon-card-bg: var(--color-mint-tint);
  --site-title-tracking: -.04em;
  --site-section-tracking: -.028em;
  --site-h1: 40px;
  --site-h2: 24px;
  --site-h3: 17px;
  --site-body: 15px;
  --site-small: 14px;
  --site-fine: 13px;
  --site-eyebrow: 12px;
  --site-max: 1180px;
  --site-gutter: 52px;
  --site-measure: 40em;
  --site-section-y: 52px;
  --alert-bg: var(--color-error-bg);
  --alert-ring: var(--color-error);
  --alert-text: var(--color-error-text);
  --alert-glyph: var(--color-error-glyph);
  --caution-bg: var(--color-warning-bg);
  --caution-ring: var(--color-warning);
  --caution-text: var(--color-warning-text);
  --routine-bg: var(--color-mint-tint);
  --routine-ring: var(--color-mint);
  --routine-text: var(--color-mint-text);

  /* Existing component names keep their API; they resolve to this palette. */
  --sage: var(--color-mint-text);
  --sage-dark: #183E32;
  --sage-light: var(--color-mint-tint);
  --sage-pale: var(--color-mint-tint);
  --terracotta: var(--color-orange-deep);
  --terracotta-light: var(--color-orange-tint);
  --honey: var(--color-orange-deep);
  --honey-light: var(--color-orange-tint);
  --cream: var(--color-surface-warm);
  --cream-2: var(--color-mint-pale);
  --cream-3: var(--color-border);
  --white: var(--color-white);
  --ink: var(--color-ink);
  --ink-2: var(--color-text-secondary);
  --ink-3: var(--color-text-secondary);
  --ink-4: var(--color-text-tertiary);
  --red: var(--color-error);
  --red-light: var(--color-error-bg);
  --red-dark: var(--color-error-text);
  --amber: var(--color-warning);
  --amber-light: var(--color-warning-bg);
  --amber-dark: var(--color-warning-text);
  --success: var(--color-success);
  --info: var(--color-info);
  --info-light: var(--color-info-bg);
  --warn: var(--color-warning);
  --warn-light: var(--color-warning-bg);
  --danger: var(--color-error);
  --danger-light: var(--color-error-bg);
  --teal: var(--color-mint-text);
  --teal-light: var(--color-mint-tint);
  --teal-mid: var(--color-forest);
  --ink-soft: var(--color-text-secondary);
  --ink-faint: var(--color-text-secondary);
  --cream-dark: var(--color-border);
  --sans: var(--font-body);
  --serif: var(--font-display);
  --r: var(--site-radius-md);
  --r-lg: var(--site-radius-lg);
  --r-xl: var(--site-radius-xl);
  --sh: var(--site-shadow-raised);
  --sh-md: var(--site-shadow-card);
  --sh-lg: var(--site-shadow-float);
}