@import url('https://fonts.googleapis.com/css2?family=Jost:wght@300;400;500;600;700&family=Hanken+Grotesk:wght@400;500;600;700;800&display=swap');

/* ============================================================
 * v2.2.4 — Broadcast · Monochrome Glass redesign overlay
 * Rethemes the broadcast page (amber accent -> ink) with dark mode
 * and motion. Scoped to .eos-bc-page. Loaded AFTER broadcast.css.
 * ============================================================ */

.eos-bc-page {
  --r: 18px; --r2: 12px; --blur: blur(26px) saturate(150%);
  --page:#EFEEEA; --surf:rgba(20,20,22,0.035); --surf2:rgba(20,20,22,0.065);
  --glass:rgba(255,255,255,0.72); --glassBrd:rgba(20,20,22,0.08); --hair:rgba(20,20,22,0.10);
  --fg:#141416; --fg2:rgba(20,20,22,0.6); --fg3:rgba(20,20,22,0.4);
  --ink:#141416; --inkFg:#FFFFFF; --live:#E5342B;
  --shadow:0 34px 70px -28px rgba(20,20,30,0.24); --shadowSm:0 12px 32px -14px rgba(20,20,30,0.14);
  font-family:'Hanken Grotesk',system-ui,sans-serif;
}
[data-theme="dark"] .eos-bc-page {
  --page:#202124; --surf:rgba(255,255,255,0.055); --surf2:rgba(255,255,255,0.10);
  --glass:rgba(41,42,45,0.82); --glassBrd:rgba(255,255,255,0.11); --hair:rgba(255,255,255,0.10);
  --fg:#E3E3E3; --fg2:#9AA0A6; --fg3:rgba(154,160,166,0.55);
  --ink:#E8EAED; --inkFg:#202124; --live:#FF453A;
  --shadow:0 34px 80px -24px rgba(0,0,0,0.8); --shadowSm:0 10px 34px -14px rgba(0,0,0,0.6);
}

/* ---- Hero: neutral, no amber wash -------------------------- */
.eos-bc-page-v2 .eos-bc-hero,
[data-theme="dark"] .eos-bc-page-v2 .eos-bc-hero {
  background:
    radial-gradient(120% 100% at 50% 0%, var(--surf) 0%, transparent 62%),
    var(--page) !important;
  border-bottom: 1px solid var(--hair) !important;
}
.eos-bc-page .eos-bc-hero h1 { font-family:'Jost',sans-serif; color:var(--fg) !important; letter-spacing:-.02em; }
.eos-bc-page .eos-bc-hero .eos-page-lead { color:var(--fg2) !important; }
.eos-bc-page .eos-bc-hero .eos-eyebrow { color:var(--fg2) !important; }
.eos-bc-page .eos-bc-hero-live { color:var(--live) !important; }
.eos-bc-page .eos-bc-hero-live .eos-live-dot { background:var(--live) !important; }

/* ---- Tabs: ink underline ----------------------------------- */
.eos-bc-page-v2 .eos-bc-tabs .eos-container { justify-content: center; }
.eos-bc-page-v2 .eos-bc-tabs,
[data-theme="dark"] .eos-bc-page-v2 .eos-bc-tabs {
  background: color-mix(in srgb, var(--page) 88%, transparent) !important;
  -webkit-backdrop-filter: var(--blur); backdrop-filter: var(--blur);
  border-bottom: 1px solid var(--hair) !important;
}
.eos-bc-page .eos-bc-tab { color: var(--fg2) !important; transition: color .18s ease, border-color .18s ease; }
.eos-bc-page .eos-bc-tab:hover { color: var(--fg) !important; }
.eos-bc-page .eos-bc-tab.is-active { color: var(--fg) !important; border-bottom-color: var(--fg) !important; }
.eos-bc-page .eos-bc-tab-pill { background: var(--live) !important; color: #fff !important; }

/* ---- Panels + featured ------------------------------------- */
.eos-bc-page .eos-bc-panels { background: var(--page) !important; }
.eos-bc-page .eos-bc-featured,
.eos-bc-page .eos-bc-countdown {
  background: var(--glass) !important;
  -webkit-backdrop-filter: var(--blur); backdrop-filter: var(--blur);
  border: 1px solid var(--glassBrd) !important; border-radius: var(--r) !important;
}
.eos-bc-page .eos-bc-player, .eos-bc-page .eos-bc-player-frame, .eos-bc-page .eos-bc-poster { border-radius: var(--r) !important; overflow: hidden; box-shadow: var(--shadow); }
.eos-bc-page .eos-bc-featured-body h2 { font-family:'Jost',sans-serif; color:var(--fg) !important; }
.eos-bc-page .eos-bc-featured-sub { color:var(--fg2) !important; }
.eos-bc-page .eos-bc-featured-meta li { color:var(--fg) !important; }
.eos-bc-page .eos-bc-featured-meta .lbl { color:var(--fg2) !important; }
.eos-bc-page .eos-bc-countdown-inner h2 { font-family:'Jost',sans-serif; color:var(--fg) !important; }
.eos-bc-page .eos-bc-countdown-inner .eos-eyebrow { color:var(--fg2) !important; }
.eos-bc-page .eos-countdown-unit {
  background: var(--surf) !important; border: 1px solid var(--hair) !important;
  border-radius: var(--r2) !important; color: var(--fg) !important;
}
.eos-bc-page .eos-countdown-unit .num { color: var(--fg) !important; }
.eos-bc-page .eos-countdown-unit .lbl { color: var(--fg2) !important; }

/* ---- Library section + cards ------------------------------- */
.eos-bc-page .eos-bc-lib-title { font-family:'Jost',sans-serif; color:var(--fg) !important; }
.eos-bc-page .eos-bc-card {
  background: var(--glass) !important;
  -webkit-backdrop-filter: var(--blur); backdrop-filter: var(--blur);
  border: 1px solid var(--glassBrd) !important; border-radius: var(--r) !important;
  overflow: hidden;
  transition: transform .26s cubic-bezier(.16,.84,.44,1), box-shadow .26s ease, border-color .26s ease;
}
.eos-bc-page .eos-bc-card:hover { transform: translateY(-5px); box-shadow: var(--shadow); border-color: var(--hair) !important; }
.eos-bc-page .eos-bc-card-media { background: var(--surf2) !important; overflow: hidden; }
.eos-bc-page .eos-bc-card-media img { transition: transform .5s cubic-bezier(.16,.84,.44,1); }
.eos-bc-page .eos-bc-card:hover .eos-bc-card-media img { transform: scale(1.05); }
.eos-bc-page .eos-bc-card-play { background: var(--ink) !important; color: var(--inkFg) !important; transition: transform .25s cubic-bezier(.34,1.56,.64,1); }
.eos-bc-page .eos-bc-card:hover .eos-bc-card-play { transform: scale(1.12); }
.eos-bc-page .eos-bc-card-dur { background: rgba(10,10,12,.7) !important; color:#fff !important; }
.eos-bc-page .eos-bc-card-body h4 { font-family:'Jost',sans-serif; color:var(--fg) !important; }
.eos-bc-page .eos-bc-card-body span { color:var(--fg2) !important; }

/* ---- Audio rows -------------------------------------------- */
.eos-bc-page .eos-bc-audio-row {
  background: var(--glass) !important;
  -webkit-backdrop-filter: var(--blur); backdrop-filter: var(--blur);
  border: 1px solid var(--glassBrd) !important; border-radius: var(--r2) !important;
  transition: transform .2s ease, box-shadow .2s ease;
}
.eos-bc-page .eos-bc-audio-row:hover { transform: translateY(-2px); box-shadow: var(--shadowSm); }
.eos-bc-page .eos-bc-audio-row-body strong { color:var(--fg) !important; }
.eos-bc-page .eos-bc-audio-row-body span { color:var(--fg2) !important; }

/* ---- Radio: monochrome glow -------------------------------- */
.eos-bc-page .eos-bc-radio,
[data-theme="dark"] .eos-bc-page .eos-bc-radio {
  background:
    radial-gradient(60% 50% at 50% 38%, var(--surf2) 0%, transparent 70%),
    var(--page) !important;
  border-radius: var(--r) !important;
}
.eos-bc-page .eos-bc-radio-glow { background: radial-gradient(circle, var(--fg) 0%, transparent 60%) !important; opacity: .05 !important; }
.eos-bc-page .eos-bc-radio h2 { font-family:'Jost',sans-serif; color:var(--fg) !important; }
.eos-bc-page .eos-bc-radio p { color:var(--fg2) !important; }
.eos-bc-page .eos-bc-radio-pulse { background: color-mix(in srgb, var(--live) 14%, transparent) !important; color: var(--live) !important; }
.eos-bc-page .eos-bc-radio-pulse .eos-live-dot { background: var(--live) !important; }
.eos-bc-page .eos-bc-radio-note { color:var(--fg2) !important; }

/* ---- Schedule ---------------------------------------------- */
.eos-bc-page .eos-bc-schedule-tabs button { color:var(--fg2) !important; border:1px solid var(--hair) !important; background:var(--surf) !important; border-radius:999px !important; transition: background .18s, color .18s; }
.eos-bc-page .eos-bc-schedule-tabs button.is-active { background: var(--ink) !important; color: var(--inkFg) !important; border-color: var(--ink) !important; }
.eos-bc-page .eos-bc-schedule-row {
  background: var(--glass) !important;
  -webkit-backdrop-filter: var(--blur); backdrop-filter: var(--blur);
  border: 1px solid var(--glassBrd) !important; border-radius: var(--r) !important;
  transition: transform .24s cubic-bezier(.16,.84,.44,1), box-shadow .24s ease, border-color .24s ease;
}
.eos-bc-page .eos-bc-schedule-row:hover { transform: translateY(-3px); box-shadow: var(--shadow); border-color: var(--hair) !important; }
.eos-bc-page .eos-bc-schedule-date .day { font-family:'Jost',sans-serif; color:var(--fg) !important; }
.eos-bc-page .eos-bc-schedule-date .month { color: var(--live) !important; }
.eos-bc-page .eos-bc-schedule-date .year { color: var(--fg2) !important; }
.eos-bc-page .eos-bc-schedule-body strong { font-family:'Jost',sans-serif; color:var(--fg) !important; }
.eos-bc-page .eos-bc-schedule-sub, .eos-bc-page .eos-bc-schedule-meta { color:var(--fg2) !important; }
.eos-bc-page .eos-bc-tag.is-live { background:var(--live) !important; color:#fff !important; }
.eos-bc-page .eos-bc-schedule-count .eos-countdown-unit { background:var(--surf) !important; border:1px solid var(--hair) !important; }

/* ---- Empty state ------------------------------------------- */
.eos-bc-page .eos-empty h2 { font-family:'Jost',sans-serif; color:var(--fg) !important; }
.eos-bc-page .eos-empty p { color:var(--fg2) !important; }

/* ---- Buttons ----------------------------------------------- */
.eos-bc-page .eos-btn-primary { background:var(--ink) !important; color:var(--inkFg) !important; border-color:var(--ink) !important; border-radius:999px !important; }

/* ---- Motion: entrances ------------------------------------- */
@media (prefers-reduced-motion: no-preference) {
  .eos-bc-page .eos-bc-hero > .eos-container > * { animation: bc-rise .6s cubic-bezier(.16,.84,.44,1) both; }
  .eos-bc-page .eos-bc-hero > .eos-container > *:nth-child(2) { animation-delay:.07s; }
  .eos-bc-page .eos-bc-hero > .eos-container > *:nth-child(3) { animation-delay:.14s; }
  .eos-bc-page .eos-bc-panel.is-active .eos-bc-featured,
  .eos-bc-page .eos-bc-panel.is-active .eos-bc-countdown,
  .eos-bc-page .eos-bc-panel.is-active .eos-bc-radio { animation: bc-rise .6s cubic-bezier(.16,.84,.44,1) .05s both; }
  .eos-bc-page .reveal { opacity:0; transform:translateY(20px); transition:opacity .65s cubic-bezier(.16,.84,.44,1), transform .65s cubic-bezier(.16,.84,.44,1); }
  .eos-bc-page .reveal.is-in { opacity:1; transform:none; }
  @keyframes bc-rise { from { opacity:0; transform:translateY(20px); } to { opacity:1; transform:none; } }
  .eos-bc-page .eos-bc-radio-pulse .eos-live-dot,
  .eos-bc-page .eos-bc-hero-live .eos-live-dot { animation: bc-pulse 1.6s ease-in-out infinite; }
  @keyframes bc-pulse { 0%,100%{ box-shadow:0 0 0 0 rgba(229,52,43,.5);} 50%{ box-shadow:0 0 0 6px rgba(229,52,43,0);} }
}