/* Base palette — taken verbatim from the NetStudy brand sheets. */
:root{
  /* Brand primaries */
  --ns-blue:#275A9C;          /* NetStudy primary */
  --ns-blue-light:#BDD0E1;    /* NetStudy secondary / tint */
  --ns-navy:#012A5E;          /* deep support base */
  --ns-green:#597D4F;         /* InsuranceStudy primary / LTCConnection secondary */
  --ns-gold:#DB9E33;          /* InsuranceStudy secondary, accent */
  --ns-paper:#F7F4EF;         /* shared warm base */
  --ns-black:#000000;
  --ns-white:#FFFFFF;

  /* Blue ramp (derived from --ns-blue / --ns-navy) */
  --blue-50:#F1F5FA;
  --blue-100:#DEE8F3;
  --blue-200:#BDD0E1;
  --blue-300:#8EAFD0;
  --blue-400:#5581B8;
  --blue-500:#275A9C;
  --blue-600:#1F4B85;
  --blue-700:#173A69;
  --blue-800:#012A5E;
  --blue-900:#011C3F;

  /* Green ramp */
  --green-50:#F2F5F0;
  --green-100:#DEE7DA;
  --green-200:#BCCDB4;
  --green-300:#93AC88;
  --green-400:#6F8F63;
  --green-500:#597D4F;
  --green-600:#496741;
  --green-700:#3A5334;

  /* Gold ramp */
  --gold-50:#FDF7EB;
  --gold-100:#FAEBCD;
  --gold-200:#F3D699;
  --gold-300:#EBBE63;
  --gold-400:#DB9E33;
  --gold-500:#C08822;
  --gold-600:#98691A;

  /* Warm neutral ramp — anchored on --ns-paper */
  --neutral-0:#FFFFFF;
  --neutral-25:#FBFAF8;
  --neutral-50:#F7F4EF;
  --neutral-100:#EFEBE4;
  --neutral-200:#DFDAD1;
  --neutral-300:#C6C0B5;
  --neutral-400:#A29C91;
  --neutral-500:#7C776E;
  --neutral-600:#5B5750;
  --neutral-700:#403D38;
  --neutral-800:#2A2825;
  --neutral-900:#141311;

  /* Semantic status — status colors reuse brand hues wherever possible */
  --status-success:#597D4F;
  --status-success-bg:#E9F0E5;
  --status-success-border:#BCCDB4;
  --status-success-text:#3F5A37;
  --status-warning:#C08822;
  --status-warning-bg:#FBEFD6;
  --status-warning-border:#F3D699;
  --status-warning-text:#6E4A11;
  --status-danger:#A32B22;
  --status-danger-bg:#F8E3E1;
  --status-danger-border:#EBC4C1;
  --status-danger-text:#8C231C;
  --status-info:#275A9C;
  --status-info-bg:#E7EFF8;
  --status-info-border:#BDD0E1;
  --status-info-text:#1C4272;
  --status-neutral:#5B5750;
  --status-neutral-bg:#EFEBE4;
  --status-neutral-border:#DFDAD1;
  --status-neutral-text:#443F39;
}

/* Semantic aliases — always author UI against these, not the base ramps. */
:root{
  --text-heading:var(--neutral-900);
  --text-body:var(--neutral-800);
  --text-muted:var(--neutral-500);
  --text-subtle:var(--neutral-400);
  --text-inverse:var(--ns-white);
  --text-link:var(--blue-500);
  --text-link-hover:var(--blue-700);
  --text-on-brand:var(--ns-white);

  --surface-page:var(--neutral-50);    /* app screens: paper. Content lives in white cards on top of it. */
  --surface-page-alt:var(--ns-white);  /* plain white: print, auth, focused single-column reading */
  --surface-card:var(--ns-white);
  --surface-raised:var(--ns-white);
  --surface-sunken:var(--neutral-100); /* inset wells and empty states only. Never a table header. */
  --surface-subtle:var(--neutral-25);   /* #FBFAF8 — the faintest tint: card and
                                           modal footers, empty calendar cells */
  --surface-hover:var(--blue-50);       /* rows/list items — cool tint, clearly not the page */
  --surface-selected:var(--blue-100);
  /* The card header band — warm sand, one step darker than the paper page, so the
     band still reads as chrome rather than as the page showing through the card.
     It used to be blue. Blue is a meaning colour in this app: it marks what is
     clickable. Spending it on structure as well left neither job legible, so the
     band moved into the warm neutral family the rest of the palette is built on. */
  --surface-card-header:var(--neutral-200);        /* #DFDAD1 */
  --border-card-header:var(--neutral-300);         /* #C6C0B5 */
  --text-on-card-header:var(--neutral-900);        /* #141311 */
  --text-on-card-header-muted:var(--neutral-600);  /* #5B5750 */
  /* A table head sits on the card's own white. It carries its rule, not a tint —
     the card header above it owns the colour. Never tint both, never tint
     neither. */
  --surface-table-header:var(--ns-white);
  --surface-brand:var(--blue-500);
  --surface-brand-deep:var(--blue-800);
  --surface-brand-tint:var(--blue-100);
  --surface-accent:var(--gold-400);
  --surface-inverse:var(--neutral-900);

  --border-subtle:var(--neutral-200);
  --border-default:var(--neutral-300);
  --border-strong:var(--neutral-400);
  --border-brand:var(--blue-500);
  --border-focus:var(--blue-400);

  --focus-ring:0 0 0 3px rgba(39,90,156,.28);
  --focus-ring-danger:0 0 0 3px rgba(163,43,34,.25);

  --chart-1:var(--blue-500);
  --chart-2:var(--green-500);
  --chart-3:var(--gold-400);
  --chart-4:var(--blue-200);
  --chart-5:var(--blue-800);
  --chart-6:var(--neutral-300);
}

/* Sibling-brand scopes. Same components, different primary/secondary.
   Apply to a wrapper: <div class="brand-insurancestudy">…</div> */
.brand-insurancestudy{
  --surface-brand:var(--green-500);
  --surface-brand-deep:var(--green-700);
  --surface-brand-tint:var(--green-100);
  --surface-accent:var(--gold-400);
  --surface-selected:var(--green-50);
  --border-brand:var(--green-500);
  --border-focus:var(--green-400);
  --text-link:var(--green-600);
  --text-link-hover:var(--green-700);
  --focus-ring:0 0 0 3px rgba(89,125,79,.28);
}
.brand-ltcconnection{
  --surface-brand:var(--blue-500);
  --surface-brand-deep:var(--blue-800);
  --surface-brand-tint:var(--blue-100);
  --surface-accent:var(--green-500);
  --border-brand:var(--blue-500);
}