/* ===========================================================================
   Harmonic Melodies — shared brand theme (used by both the public website
   and the staff portal). Palette derived from the logo.
   =========================================================================== */
:root {
  /* Brand palette */
  --red: #9d1c20;          /* deep red — sampled from the "Melodies" wordmark */
  --red-dark: #7c1518;
  --black: #050505;
  --charcoal: #191919;
  --blush: #f3dfde;        /* soft blush — warm section backgrounds */
  --white: #ffffff;

  /* Semantic tokens used across the apps */
  --bg: #faf7f7;
  --card: #ffffff;
  --ink: #191919;
  --muted: #6b6b70;
  --line: #ece6e6;
  --brand: var(--red);
  --brand-dark: var(--red-dark);
  --danger: #cc2b32;
  --ok: #1c9e6b;
  --shadow: 0 1px 3px rgba(0,0,0,.08), 0 1px 2px rgba(0,0,0,.04);
  --shadow-md: 0 6px 18px rgba(28,12,12,.08), 0 2px 6px rgba(28,12,12,.05);
  --shadow-lg: 0 18px 50px rgba(20,10,10,.16);

  /* Staff sidebar rail colour. Burgundy mirrors the logo's red undertones for a
     warm, premium conservatory feel. Swap for one of:
     graphite #202226 · navy #1b2430 · charcoal #191919 · cream #f7f5f0 (light). */
  --sidebar: #3a0a12;

  /* Premium accents — used sparingly for highlights only. */
  --gold: #b08534;         /* muted antique gold */
  --gold-soft: #f3e7cf;
  --rose: #c98b8d;         /* muted rose */

  /* Radii */
  --r-sm: 8px;
  --r-md: 12px;
  --r-lg: 16px;

  /* Typography — elegant display serif + clean humanist sans. Falls back to
     system fonts if the web fonts can't load (e.g. offline). */
  --font-body: "Lora", Georgia, "Times New Roman", serif;
  --font-display: "Playfair Display", Georgia, "Times New Roman", serif;
}

/* Shared utility used by both the website and the staff portal. */
.hidden { display: none !important; }