/* =====================================================================
 * MARQUEE — classic movie-palace skin for GeekPress
 * Source of truth for ALL --geekui-* variables.
 * Declared on body AND [id^="geekui-root"] in BOTH modes.
 * ===================================================================== */

@import url("https://fonts.googleapis.com/css2?family=Bebas+Neue&family=Inter:wght@400;500;600;700&family=IBM+Plex+Mono:wght@400;500;600&display=swap");

/* DARK — "after-hours auditorium" */
body,
[id^="geekui-root"] {
  --geekui-bg:               #1a0a0e;
  --geekui-bg-2:             #241015;
  --geekui-text:             #f5ead0;
  --geekui-text-dim:         #c4a880;
  --geekui-text-mute:        #8a7058;

  --geekui-accent:           #e6b450;
  --geekui-accent-2:         #fdd180;
  --geekui-accent-d:         #a87420;

  /* Poster-less catalog placeholders — per type, on-brand marquee trio */
  --geekui-noposter-movie:   #e6b450;
  --geekui-noposter-tv:      #6fa8dc;
  --geekui-noposter-game:    #d77ba6;
  --geekui-noposter-person:  #e6b450;
  --geekui-noposter-char:    #b88bd4;

  --geekui-font-base:        "Inter", system-ui, -apple-system, sans-serif;
  --geekui-font-title:       "Bebas Neue", "Oswald", "Anton", "Inter Tight", system-ui, sans-serif;
  --geekui-font-mono:        "IBM Plex Mono", "JetBrains Mono", ui-monospace, monospace;

  --geekui-surface:          #2a141a;
  --geekui-surface-2:        rgba(230, 180, 80, 0.10);
  --geekui-border:           rgba(230, 180, 80, 0.22);
  --geekui-border-strong:    rgba(230, 180, 80, 0.55);
  --geekui-modal-bg:         #241015;
  --geekui-modal-text:       #f5ead0;

  --geekui-card-radius:      2px;
  --geekui-card-shadow:      0 10px 24px rgba(0, 0, 0, 0.6);
  --geekui-card-hover-shadow: 0 18px 36px rgba(0, 0, 0, 0.7), 0 0 28px rgba(230, 180, 80, 0.20);
  --geekui-glow:             0 0 0 1px rgba(230, 180, 80, 0.55), 0 0 22px rgba(230, 180, 80, 0.30);

  --geekui-hero-fade:        linear-gradient(180deg, rgba(26, 10, 14, 0.15) 0%, rgba(26, 10, 14, 0.45) 55%, rgba(26, 10, 14, 0.85) 100%);
  --geekui-hero-tint:        linear-gradient(110deg, rgba(122, 24, 48, 0.10) 0%, transparent 40%, rgba(230, 180, 80, 0.06) 100%);
  --geekui-hero-text-shadow: 0 2px 18px rgba(0, 0, 0, 0.85), 0 0 6px rgba(230, 180, 80, 0.20);

  --geekui-tone-exceptional: #fdd180;
  --geekui-tone-great:       #e6b450;
  --geekui-tone-good:        #c4ba60;
  --geekui-tone-mixed:       #c4a888;
  --geekui-tone-poor:        #b85a4a;
  --geekui-tone-muted:       #5a4a3a;

  /* Private skin extras */
  --mq-wine:                 #7a1830;
  --mq-wine-2:               #a02845;
  --mq-bulb:                 rgba(230, 180, 80, 0.85);
}

/* LIGHT — "matinee paper" */
body[data-theme="light"],
body[data-theme="light"] [id^="geekui-root"] {
  --geekui-bg:               #f7efdc;
  --geekui-bg-2:             #ebe1c8;
  --geekui-text:             #1a0a0e;
  --geekui-text-dim:         #5a3a30;
  --geekui-text-mute:        #8a6a5c;

  --geekui-accent:           #7a1830;
  --geekui-accent-2:         #a02845;
  --geekui-accent-d:         #56101f;

  --geekui-surface:          #fffaf0;
  --geekui-surface-2:        rgba(122, 24, 48, 0.08);
  --geekui-border:           rgba(122, 24, 48, 0.22);
  --geekui-border-strong:    rgba(122, 24, 48, 0.55);
  --geekui-modal-bg:         #fffaf0;
  --geekui-modal-text:       #1a0a0e;

  --geekui-card-shadow:      0 6px 18px rgba(26, 10, 14, 0.10);
  --geekui-card-hover-shadow: 0 14px 32px rgba(26, 10, 14, 0.16), 0 0 18px rgba(122, 24, 48, 0.16);
  --geekui-glow:             0 0 0 1px rgba(122, 24, 48, 0.55), 0 0 18px rgba(122, 24, 48, 0.22);

  --geekui-hero-fade:        linear-gradient(180deg, rgba(247, 239, 220, 0.45) 0%, rgba(247, 239, 220, 0.72) 55%, rgba(247, 239, 220, 0.92) 100%);
  --geekui-hero-tint:        linear-gradient(110deg, rgba(122, 24, 48, 0.04) 0%, transparent 40%, rgba(247, 239, 220, 0.22) 100%);
  --geekui-hero-text-shadow: 0 0 12px rgba(255, 250, 240, 0.95), 0 0 2px rgba(255, 250, 240, 1);

  --geekui-tone-exceptional: #56101f;
  --geekui-tone-great:       #7a1830;
  --geekui-tone-good:        #6a5a14;
  --geekui-tone-mixed:       #8a6a3a;
  --geekui-tone-poor:        #a04020;
  --geekui-tone-muted:       #8a826e;

  --mq-wine:                 #7a1830;
  --mq-wine-2:               #56101f;
  --mq-bulb:                 rgba(168, 116, 32, 0.85);
}

/* =====================================================================
 * Movie loader — bulb-gold cinema ring via ::after.
 *
 * Loader.jsx mounts <div class="geekfp-spinner"> with an inner React
 * Icons <RiLoader3Fill class="geekfp-spinner geekfp-rotating"/>. The
 * default teal RiLoader3Fill is hidden (opacity:0) and replaced by a
 * ::after gold ring that always renders.
 *
 * Rules MUST NOT be scoped to `.geekui-container`: Loader renders
 * once at the app root before <Movie>/.geekui-container mounts and
 * again inside it for tab/pagination — a scoped selector would let
 * the raw teal icon leak on first paint.
 * ===================================================================== */
.geekfp-spinner {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 200px;
  position: relative;
  color: var(--geekui-accent);
}
.geekfp-spinner .geekfp-rotating {
  opacity: 0 !important;
  width: 0 !important;
  height: 0 !important;
  position: absolute !important;
}
.geekfp-spinner::after {
  content: '';
  width: 42px;
  height: 42px;
  border: 3px solid transparent;
  border-top-color: var(--geekui-accent);
  border-right-color: var(--geekui-accent-2);
  border-radius: 50%;
  box-shadow: 0 0 22px var(--geekui-accent, transparent);
  animation: mq-cine-spin 0.9s linear infinite;
}
@keyframes mq-cine-spin {
  to { transform: rotate(360deg); }
}

/* =====================================================================
 * Bridge aliases — movie-theme token names → marquee --geekui-*
 *
 * homepage-widgets.css was ported from the movie-theme verbatim and
 * uses short tokens like --bg, --surface, --gold, --cream, --border,
 * --serif, --sans, --mono. Marquee's own contract is --geekui-*, so
 * those identifiers resolve to nothing here and the widget chrome
 * (poster boxes, review cards, hero rail) renders unsized.
 *
 * Map each short token onto the matching --geekui-* so every rule
 * lights up + automatically flips when the user toggles light/dark
 * (since --geekui-* themselves are defined for both modes above).
 * Scoped to body + [id^="geekui-root"] so it doesn't leak to other
 * companion themes that ship the same short names with different
 * intent (chroma / loadout / geekpress-gamer).
 * ===================================================================== */
body,
[id^="geekui-root"] {
  --bg:          var(--geekui-bg);
  --bg-2:        var(--geekui-bg-2);
  --surface:     var(--geekui-surface);
  --elev:        var(--geekui-bg-2);
  --gold:        var(--geekui-accent);
  --gold-soft:   var(--geekui-accent-2);
  --cream:       var(--geekui-text);
  --muted:       var(--geekui-text-mute);
  --border:      var(--geekui-border);
  --border-soft: var(--geekui-border);
  --serif:       var(--geekui-font-title);
  --sans:        var(--geekui-font-base);
  --mono:        var(--geekui-font-mono);
}

/* ════════════════════════════════════════════════════════════════════
   GLOBAL LINK COLOUR (2026-06-11) — the plugin base ships
   `.geekui a { color:#619184 !important }` (teal). Re-bind every
   GeekPress-page link to the marquee accent instead. Loaded with the
   vars on EVERY skin context, so it covers movie/name/catalog/… alike.
   Exceptions: `.geekui-btn` anchors (skins own their button colours)
   and `.geekp-link-style-ignore` (must inherit the surrounding text).
   Tokens re-bind in light mode → links turn burgundy automatically.
   ════════════════════════════════════════════════════════════════════ */
/* NB: real DOM is `.geekui > #geekui-root-*` (the plugin single templates
   wrap the mount), so scope ON the root id itself — (0,3,1) beats the
   plugin's (0,1,1) either way. */
[id^="geekui-root"] a:not(.geekui-btn):not(.geekp-link-style-ignore) {
  color: var(--geekui-accent) !important;
}
[id^="geekui-root"] a:not(.geekui-btn):not(.geekp-link-style-ignore):hover {
  color: var(--geekui-accent-2) !important;
}
[id^="geekui-root"] a.geekp-link-style-ignore {
  color: inherit !important;
}
