:root {
  /* Green as an rgb triple is the single source of truth: Bootstrap's colour
     utilities need the raw numbers, so deriving the hex from it keeps the
     two from drifting apart. Change the triple and everything follows. */
  --uaa-green-rgb: 0, 86, 60;
  --uaa-green: rgb(var(--uaa-green-rgb));
  --uaa-green-dark: #003f2b;
  --uaa-green-darker: #002e1f;
  --uaa-gold: #ffc423;
  --uaa-medium-gray-rgb: 144, 142, 134;
  --uaa-medium-gray: rgb(var(--uaa-medium-gray-rgb));

  /* Hero black is deliberately separate from UAA's official Medium Gray.
     Every hero treatment that calls for black uses this exact neutral so
     overlays, panels, search bands, and menu backplates stay consistent. */
  --uaa-hero-black-rgb: 36, 35, 33;
  --uaa-hero-black: rgb(var(--uaa-hero-black-rgb));

  /* Neutral image overlay. This is intentionally separate from Bootstrap dark:
     UAA Medium Gray remains the official dark palette color, while photographs
     need a near-black wash to preserve white-text contrast without muddying the
     image as heavily as the official gray. */
  --uaa-image-overlay-rgb: var(--uaa-hero-black-rgb);
  --uaa-image-overlay-opacity: .85;
  --uaa-image-overlay: rgba(var(--uaa-image-overlay-rgb), var(--uaa-image-overlay-opacity));

  /* UAA's Bootstrap color slots. Components should consume the Bootstrap
     variables rather than introducing separate hero/header color values. */
  --bs-primary: var(--uaa-green);
  --bs-primary-rgb: var(--uaa-green-rgb);
  --bs-dark: var(--uaa-medium-gray);
  --bs-dark-rgb: var(--uaa-medium-gray-rgb);
  --bs-light: #fefefe;
  --bs-light-rgb: 254, 254, 254;
  --menu-font-size: 1.125rem;   /* 18pt from a 72ppi comp = 18px; use 1.5rem for a 96ppi comp */
  --topbar-font-size: .875rem;  /* 14pt from a 72ppi comp = 14px */
  --topbar-height: 50px;
  --mainbar-height: 85px;
  --anim-speed: .35s;           /* one speed for topbar, menu bar, and search button */
  --hero-overlay: var(--uaa-image-overlay); /* photograph overlay; Bootstrap dark remains the official palette color */

  /* Header theme bridge. These deliberately consume Bootstrap variables from
     the active theme while the layout, UAA brand colors, logo behavior,
     fixed positioning, and hero interaction remain ours. */
  --uaa-header-surface: rgba(var(--bs-body-bg-rgb, 255, 255, 255), .7);
  --uaa-header-color: var(--bs-body-color, #212529);
  --uaa-header-border: var(--bs-border-color-translucent, rgba(0, 0, 0, .175));
  --uaa-header-shadow: var(--bs-box-shadow, 0 .5rem 1rem rgba(0, 0, 0, .15));
  --uaa-header-shadow-lg: var(--bs-box-shadow-lg, var(--uaa-header-shadow));
  --uaa-header-radius: var(--bs-border-radius, .375rem);
  --uaa-header-radius-lg: var(--bs-border-radius-lg, .5rem);
  --uaa-header-hover: var(--bs-link-hover-color, var(--uaa-green));
}



/* ============================================================
   CAMPUS BRAND THEMES
   A campus page opts in through campusThemeClass in its front matter.
   These overrides come after the selected Bootstrap theme, so the active
   theme still controls typography, spacing, shape, and component style.
   ============================================================ */
.campus-theme-kpc {
  --uaa-green-rgb: 0, 70, 135;
  --uaa-green: #004687;
  --uaa-green-dark: #00386c;
  --uaa-green-darker: #002a51;
  --uaa-gold: #da3b1b;

  --bs-primary: #004687;
  --bs-primary-rgb: 0, 70, 135;
  --bs-secondary: #da3b1b;
  --bs-secondary-rgb: 218, 59, 27;
  --bs-link-color: #004687;
  --bs-link-color-rgb: 0, 70, 135;
  --bs-link-hover-color: #00386c;
  --bs-link-hover-color-rgb: 0, 56, 108;
  --uaa-header-hover: #004687;
}

/* Bootstrap's compiled button variants set their own component variables,
   so campus colors need explicit primary and secondary button bridges. */
.campus-theme-kpc .btn-secondary {
  --bs-btn-color: #fff;
  --bs-btn-bg: #da3b1b;
  --bs-btn-border-color: #da3b1b;
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: #ae2f16;
  --bs-btn-hover-border-color: #ae2f16;
  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: #832310;
  --bs-btn-active-border-color: #832310;
  --bs-btn-focus-shadow-rgb: 218, 59, 27;
}

.campus-theme-kpc .btn-outline-secondary {
  --bs-btn-color: #da3b1b;
  --bs-btn-border-color: #da3b1b;
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: #da3b1b;
  --bs-btn-hover-border-color: #da3b1b;
  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: #ae2f16;
  --bs-btn-active-border-color: #ae2f16;
  --bs-btn-focus-shadow-rgb: 218, 59, 27;
}

* { box-sizing: border-box; }

html { height: 100%; }

body {
  margin: 0;
  font-family: var(--bs-body-font-family);
  display: flex;
  flex-direction: column;
  /* min-height only, never height: 100%. A fixed body height makes every
     flex child with default flex-shrink collapse once content overflows. */
  min-height: 100vh;
}

a { text-decoration: none; }