/*
 * overrides.css — campaign-specific style customisations
 *
 * This file is loaded after the base gm-apprentice-publish stylesheet.
 * Add rules here to override colours, fonts, layout, or any other styles
 * without modifying the package's built-in CSS.
 *
 * Example:
 *   :root { --accent: #8b0000; }
 *   body  { font-family: 'Palatino Linotype', serif; }
 */

/*
 * CoC weapon-table header contrast.
 * The global `th` rule paints a dark card background (--bg-card #232830) behind
 * the folio's oxblood small-caps header, leaving dark-red-on-near-black and an
 * unreadable "WEAPON / SKILL% / DAMAGE ..." row. The folio design intends the
 * header to sit on the parchment with just a bottom rule, so clear the fill and
 * keep the oxblood text on paper.
 */
.coc-sheet-root table.weap th {
  background: transparent;
}

/* --- Calcutta Gazetteer landing banner (markup injected post-build by inject-gazetteer.js) --- */
.gazetteer-banner {
  display: flex;
  align-items: center;
  gap: 1.1rem;
  text-decoration: none;
  background: linear-gradient(155deg, #3b1f12, #24120a 85%);
  border: 1px solid rgba(201, 167, 92, 0.55);
  box-shadow: inset 0 0 0 3px rgba(201, 167, 92, 0.18), 0 6px 22px rgba(0, 0, 0, 0.35);
  border-radius: 6px;
  padding: 1.05rem 1.4rem;
  transition: transform 0.25s ease, box-shadow 0.25s ease;
}
.gazetteer-banner:hover {
  transform: translateY(-2px);
  box-shadow: inset 0 0 0 3px rgba(201, 167, 92, 0.28), 0 12px 30px rgba(0, 0, 0, 0.45);
}
.gazetteer-banner .gb-orn { color: #8f7133; font-size: 1.6rem; }
.gazetteer-banner h3 {
  margin: 0 0 0.2rem;
  color: #c9a75c;
  letter-spacing: 0.12em;
  font-variant: small-caps;
}
.gazetteer-banner p { margin: 0; color: rgba(232, 214, 175, 0.8); font-size: 0.92rem; font-style: italic; }
.gazetteer-banner .gb-cta { margin-left: auto; color: #c9a75c; white-space: nowrap; font-size: 0.9rem; }
@media (max-width: 640px) {
  .gazetteer-banner { flex-wrap: wrap; }
  .gazetteer-banner .gb-cta { margin-left: 0; }
}

/*
 * Long-line <pre> guard.
 * The base stylesheet has no rule for pre at all, so a code block whose single
 * line runs hundreds of characters (the vault's atomic image prompts did this
 * before "Image Prompt" joined excludeSections) stretches the entire page wide
 * and truncates every section's text at the viewport edge. Wrap instead: this
 * site's pre content is prose, not code, so wrapping reads better than a
 * horizontal scrollbar.
 */
pre {
  white-space: pre-wrap;
  overflow-wrap: anywhere;
}

/*
 * Lightbox click-through on hero images (2026-08-27).
 * The shipped js/lightbox.js binds .hero-banner-img / .hero-cinematic-img, but
 * the title overlay (.hero-*-overlay, z-index 1) covers the absolutely
 * positioned image and swallows every click, so the lightbox never opens on
 * location and entity pages. Let clicks pass through the overlay to the image;
 * keep any links inside the overlay clickable.
 */
.hero-banner-overlay,
.hero-cinematic-overlay {
  pointer-events: none;
}
.hero-banner-overlay a,
.hero-cinematic-overlay a {
  pointer-events: auto;
}