/*
 * DJC TheaterMap -- DJC skin
 *
 * The base stylesheet ships the Reach the World Day palette as the component's own
 * look. This skin re-themes it onto the DJM heritage palette (navy / cream / gold) by
 * redeclaring tokens only -- no structure, no specificity bump. It loads after the base
 * stylesheet as its own file (registry `styles` list, or the component's self-inject).
 *
 * Opt in with class="djc" on the map root or any ancestor:
 *   <div class="djc"><djc-theater-map event-year="2026">&nbsp;</djc-theater-map></div>
 */

.djc.djc-theatermap,
.djc .djc-theatermap {
  --tmw-bkg: #15315e;
  --tmw-ink: #f7f3e9;
  --tmw-ink-soft: rgba(247, 243, 233, 0.82);
  --tmw-cta: #dbb763;
  --tmw-cta-ink: #15315e;
  --tmw-panel: rgba(0, 0, 0, 0.18);
  --tmw-panel-hover: rgba(0, 0, 0, 0.28);
  --tmw-line: rgba(247, 243, 233, 0.24);
  --tmw-map-bg: #10274b;
  --tmw-card-accent: #15315e;
  --tmw-loader: #dbb763;

  --tmw-cat-tickets: #dbb763;
  --tmw-cat-tickets-ink: #15315e;

  /* the base sheet's action buttons are mint and its band a gradient; this skin keeps gold */
  --tmw-btn: #dbb763;
  --tmw-btn-hover: #e6c77f;
  --tmw-btn-ink: #15315e;
  --tmw-btn-edge: #15315e;
  --tmw-focus-glow: rgba(219, 183, 99, 0.45);

  --tmw-font-1: 'proxima-nova', system-ui, sans-serif;
  --tmw-font-header: 'Georgia', 'Times New Roman', serif;
}