/*
 * Phi Beta Sigma state portal — design tokens.
 *
 * THE ONLY FILE where hex colors may be declared for new work.
 * scripts/check_brand.py fails CI on any other hex value that is not in the
 * legacy baseline (scripts/brand_baseline.json).
 *
 * Brand palette: Phi Beta Sigma Design & Brand Guidelines.
 *   Royal Blue  #164F90  (2020 Quick Guide lists #19468D / PMS 286 — pending
 *                         confirmation from branding@phibetasigma1914.org)
 *   Pure White  #FFFFFF
 *   Cool Gray 3 #C8C9C7  (secondary)
 *   Black       #1F1E1E  (secondary)
 * Functional status colors are NOT brand colors: system feedback only, always
 * paired with an icon and text, never in headers or identifiers.
 *
 * Contrast (WCAG 2.2): white on royal blue 8.2:1; royal blue on black 2.0:1
 * (FAIL — never use royal blue text or lone control edges in dark mode).
 */
:root {
  /* brand */
  --pbs-royal-blue: #164F90;
  --pbs-pure-white: #FFFFFF;
  --pbs-sigma-gray: #C8C9C7;
  --pbs-black: #1F1E1E;

  /* functional (pending branding-office approval) */
  --ui-error: #B3261E;
  --ui-warning: #8A5A00;
  --ui-success: #1E6B3A;

  /* semantic — light mode */
  --bg: var(--pbs-pure-white);
  --surface: var(--pbs-pure-white);
  --text: var(--pbs-black);
  --text-muted: rgb(31 30 30 / 0.7);
  --border: var(--pbs-sigma-gray);
  --link: var(--pbs-royal-blue);
  --header-bg: var(--pbs-royal-blue);
  --header-fg: var(--pbs-pure-white);
  --btn-primary-bg: var(--pbs-royal-blue);
  --btn-primary-fg: var(--pbs-pure-white);
  --btn-primary-border: var(--pbs-royal-blue);
  --btn-secondary-fg: var(--pbs-royal-blue);
  --btn-secondary-border: var(--pbs-royal-blue);
  --focus-ring: var(--pbs-royal-blue);
  --focus-offset: var(--pbs-pure-white);

  /* type — Arial is the fraternity's corporate typeface */
  --font: Arial, "Liberation Sans", "Helvetica Neue", Helvetica, sans-serif;
  --fs-display: 2rem;   --lh-display: 2.5rem;
  --fs-h1: 1.5rem;      --fs-h2: 1.25rem;  --fs-h3: 1.125rem; --fs-h4: 1rem;
  --fs-body: 1rem;      --lh-body: 1.5rem;
  --fs-small: 0.875rem; --lh-small: 1.25rem;
  --fs-monogram: 1.75rem;

  --header-height: 64px;
  --radius: 8px;

  /* full-bleed section bands (home page): mixes of the brand palette, no new colors */
  --band-gray-bg: var(--pbs-sigma-gray);
  --band-gray-fg: var(--pbs-black);
  --band-black-bg: var(--pbs-black);
  --band-deep-blue: color-mix(in srgb, var(--pbs-black) 22%, var(--pbs-royal-blue));
}

/* dark mode: follows the OS unless the user picked light */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --bg: var(--pbs-black);
    --surface: var(--pbs-black);
    --text: var(--pbs-pure-white);
    --text-muted: var(--pbs-sigma-gray);
    --border: rgb(200 201 199 / 0.4);
    --link: var(--pbs-pure-white);
    --btn-primary-border: var(--pbs-pure-white);   /* 3:1 non-text contrast on black */
    --btn-secondary-fg: var(--pbs-pure-white);
    --btn-secondary-border: var(--pbs-pure-white);
    --focus-ring: var(--pbs-pure-white);
    --focus-offset: var(--pbs-royal-blue);
    --band-gray-bg: color-mix(in srgb, var(--pbs-sigma-gray) 16%, var(--pbs-black));
    --band-gray-fg: var(--pbs-pure-white);
    --band-black-bg: color-mix(in srgb, var(--pbs-pure-white) 5%, var(--pbs-black));
    /* header stays Royal Blue with white marks in both modes */
  }
}
:root[data-theme="dark"] {
  --band-gray-bg: color-mix(in srgb, var(--pbs-sigma-gray) 16%, var(--pbs-black));
  --band-gray-fg: var(--pbs-pure-white);
  --band-black-bg: color-mix(in srgb, var(--pbs-pure-white) 5%, var(--pbs-black));
  --bg: var(--pbs-black);
  --surface: var(--pbs-black);
  --text: var(--pbs-pure-white);
  --text-muted: var(--pbs-sigma-gray);
  --border: rgb(200 201 199 / 0.4);
  --link: var(--pbs-pure-white);
  --btn-primary-border: var(--pbs-pure-white);
  --btn-secondary-fg: var(--pbs-pure-white);
  --btn-secondary-border: var(--pbs-pure-white);
  --focus-ring: var(--pbs-pure-white);
  --focus-offset: var(--pbs-royal-blue);
}

/* brand header (core/brand_header.html) */
.pbs-header {
  height: var(--header-height);
  background: var(--header-bg);
  color: var(--header-fg);
  display: flex;
  align-items: center;
  padding: 0 16px;
  font-family: var(--font);
}
.pbs-header a { color: var(--header-fg); text-decoration: none; }
.pbs-brand { display: flex; align-items: center; gap: 12px; padding: 16px 0; }
.pbs-monogram { font: bold var(--fs-monogram)/1 var(--font); letter-spacing: normal; }
.pbs-letters { display: block; height: 38px; width: auto; }   /* approved Greek letters artwork */
.pbs-orgname { font: var(--fs-small)/1.2 var(--font); }
@media (max-width: 640px) {
  .pbs-orgname { display: none; }
  .pbs-monogram { font-size: 1.25rem; }  /* 20px minimum */
  .pbs-letters { height: 29px; }
}
:focus-visible { outline: 2px solid var(--focus-ring); outline-offset: 2px; box-shadow: 0 0 0 4px var(--focus-offset); }

/* light/dark seal swap for the inherited chapter header (body.dark-mode) */
.brand-logo--dark { display: none; }
body.dark-mode .brand-logo--light { display: none; }
body.dark-mode .brand-logo--dark { display: inline-block; }

.visually-hidden {
  position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}