/* ──────────────────────────────────────────────────────────────────────────
 * theme.css — the colour tokens every CourseCat surface is drawn from.
 *
 * Shared verbatim by both portals: the full app at index.html and the
 * Portal-only portal at lite.html. It carries no layout, only variables, so
 * a page can adopt CourseCat's palette without inheriting its chrome.
 *
 * Dark mode is a class on <html>, not a media query — the user's saved choice
 * has to win over the OS, and the setting is read before first paint.
 * ────────────────────────────────────────────────────────────────────────── */

:root {
  /* nav — light mode */
  --nav-bg:     #faf8ff;
  --nav-bg-2:   #ede8ff;
  --nav-border: #d8ccf8;
  --nav-text:   #1a1033;
  --nav-text-2: #7c6ab0;
  /* content — light mode */
  --bg:        #f0eeff;
  --bg-2:      #e4d9ff;
  --surface:   rgba(255,255,255,0.55);
  --surface-2: rgba(246,242,255,0.44);
  --border:    rgba(140,110,210,0.16);
  --border-2:  rgba(255,255,255,0.60);
  --surface-solid: #ffffff;
  --text:      #1a1033;
  --text-2:    #6b6088;
  --text-3:    #a89ec4;
  --accent:    #7c3aed;
  --accent-2:  #6d28d9;
  --accent-3:  #ede9fe;
  --accent-4:  #f5f3ff;
  --radius:    18px;
  --radius-sm: 12px;
  --cal-cell-min: 96px;   /* shortest a calendar week row may get before the grid scrolls */
  --gd-cols: minmax(0, 2.2fr) minmax(90px, 0.5fr) minmax(110px, 0.75fr) minmax(70px, 0.45fr);
  --radius-lg: 24px;
  --shadow:    0 2px 16px rgba(100,80,200,0.10);
  --shadow-lg: 0 8px 40px rgba(80,40,180,0.18);
  --transition: 0.15s ease;
  /* liquid glass */
  --glass-bg:     rgba(255,255,255,0.42);
  --glass-bg-2:   rgba(255,255,255,0.58);
  --glass-border: rgba(255,255,255,0.70);
  --glass-edge:   rgba(255,255,255,0.95);
  --glass-shade:  rgba(90,60,170,0.07);
  --glass-sheen:  rgba(255,255,255,0.42);
  --glass-blur:   20px;
  --glass-sat:    1.7;
  --glass-shadow: 0 8px 32px rgba(80,40,180,0.10);
  --glass-divider: rgba(120,90,190,0.16);
  --glass-field:   rgba(255,255,255,0.40);
}
html.dark {
  --nav-bg:     #1a1535;
  --nav-bg-2:   #0f0c22;
  --nav-border: #2e2758;
  --nav-text:   #e8e2f8;
  --nav-text-2: #9b8ec4;
  --bg:        #0d0b1e;
  --bg-2:      #160f30;
  --surface:   rgba(30,24,66,0.44);
  --surface-2: rgba(42,34,84,0.38);
  --border:    rgba(160,124,255,0.18);
  --border-2:  rgba(160,124,255,0.13);
  --surface-solid: #151130;
  --text:      #e8e2f8;
  --text-2:    #9b8ec4;
  --text-3:    #6b5f98;
  --accent:    #a07cff;
  --accent-2:  #7c3aed;
  --accent-3:  #1e1640;
  --accent-4:  #17132e;
  --shadow:    0 2px 16px rgba(0,0,0,0.4);
  --shadow-lg: 0 8px 40px rgba(0,0,0,0.55);
  --glass-bg:     rgba(26,20,58,0.38);
  --glass-bg-2:   rgba(26,20,58,0.55);
  --glass-border: rgba(160,124,255,0.20);
  --glass-edge:   rgba(255,255,255,0.14);
  --glass-shade:  rgba(0,0,0,0.30);
  --glass-sheen:  rgba(160,124,255,0.10);
  --glass-blur:   22px;
  --glass-sat:    1.4;
  --glass-shadow: 0 8px 32px rgba(0,0,0,0.45);
  --glass-divider: rgba(160,124,255,0.20);
  --glass-field:   rgba(10,7,26,0.22);
}