/* ============================================================
   THEME OVERLAYS
   - default (Black/Gold) lives in deck.css :root
   - body[data-theme="parchment"] = old-money / scroll
   ============================================================ */

body[data-theme="parchment"] {
  --obsidian:      #f4ecd8;   /* parchment cream */
  --graphite:      #ece2c8;   /* aged paper panel */
  --ink:           #d8c89a;   /* light sepia border */
  --hairline:      #c7b58a;
  --bone:          #2b2419;   /* deep ink for text */
  --silk:          #3d3522;
  --silver:        #6f6346;
  --silver-dim:    #8a7d5a;
  --gold:          #7a1f1f;   /* oxblood / sealing-wax red as primary accent */
  --gold-bright:   #9a2828;
  --gold-dim:      #5a1818;
  --crimson:       #7a1f1f;
}

/* Replace the dark vignette+grain with parchment texture */
body[data-theme="parchment"]::before {
  background:
    radial-gradient(ellipse at top,    rgba(122,31,31,0.05),  transparent 60%),
    radial-gradient(ellipse at bottom, rgba(0,0,0,0.06),       transparent 70%);
}
body[data-theme="parchment"]::after {
  /* Heavier paper-fiber texture in sepia */
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='220' height='220'><filter id='p'><feTurbulence type='fractalNoise' baseFrequency='0.65' numOctaves='3' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 0.45  0 0 0 0 0.30  0 0 0 0 0.10  0 0 0 0.10 0'/></filter><rect width='100%' height='100%' filter='url(%23p)'/></svg>");
  opacity: 0.45;
  mix-blend-mode: multiply;
}

/* Force display serif to Cormorant in italic — already default — but heavier weight */
body[data-theme="parchment"] h1.display,
body[data-theme="parchment"] h2.headline {
  font-weight: 500;
}

/* Cover slide ditches the dark gradient, gets a subtle wax-seal vignette */
body[data-theme="parchment"] .slide.cover {
  background:
    radial-gradient(ellipse at 20% 30%, rgba(122,31,31,0.06), transparent 50%),
    var(--obsidian);
}

/* CC crest reads better with double border on parchment */
body[data-theme="parchment"] .cover .crest {
  box-shadow: inset 0 0 0 1px var(--gold);
  background: var(--graphite);
}

/* Stat/term/team cards benefit from a slight paper-shadow */
body[data-theme="parchment"] .stat,
body[data-theme="parchment"] .term-card,
body[data-theme="parchment"] .team-card {
  box-shadow: inset 0 0 0 1px var(--hairline);
}

/* Skyline silhouette swaps to oxblood */
body[data-theme="parchment"] .cover-skyline path,
body[data-theme="parchment"] .cover-skyline line,
body[data-theme="parchment"] .cover-skyline rect {
  stroke: var(--gold) !important;
}

/* ============================================================
   THEME TOGGLE BUTTON
   ============================================================ */
.theme-toggle {
  position: fixed;
  bottom: 20px; right: 20px;
  z-index: 100;
  display: flex;
  background: rgba(0,0,0,0.55);
  border: 1px solid var(--hairline);
  border-radius: 999px;
  padding: 4px;
  font-family: var(--font-mono);
  font-size: 10px; letter-spacing: 0.18em; text-transform: uppercase;
  backdrop-filter: blur(6px);
  box-shadow: 0 4px 24px rgba(0,0,0,0.4);
}
body[data-theme="parchment"] .theme-toggle {
  background: rgba(244,236,216,0.7);
  border-color: var(--hairline);
}
.theme-toggle button {
  background: transparent;
  border: none;
  color: var(--silver);
  cursor: pointer;
  padding: 6px 14px;
  border-radius: 999px;
  font: inherit;
  letter-spacing: inherit;
  text-transform: inherit;
  transition: all 0.2s ease;
}
.theme-toggle button:hover { color: var(--bone); }
.theme-toggle button.active {
  background: var(--gold);
  color: var(--obsidian);
}

/* ============================================================
   COVER SKYLINE — hairline SVG of multifamily silhouette
   ============================================================ */
.cover-skyline {
  position: absolute;
  left: 0; right: 0; bottom: 0;
  width: 100%; height: 220px;
  pointer-events: none;
  opacity: 0.7;
  z-index: 2;
}
.cover-skyline svg { width: 100%; height: 100%; display: block; }
.cover-skyline path,
.cover-skyline line,
.cover-skyline rect {
  fill: none;
  stroke: var(--gold);
  stroke-width: 1.5;
  vector-effect: non-scaling-stroke;
  stroke-linecap: square;
}