/* ==========================================================================
   Noor Events Calendar — main-site theme (Oct 2026)
   Loaded AFTER calendar-events.css. Keeps every layout rule from that file
   and only re-skins it to match lancasterisoc.org (blue & gold, DM Sans +
   Playfair Display, light surfaces) — same tokens as the Ramadhan pages.
   ========================================================================== */
:root{
  --nb-blue:#0f6288; --nb-blue-dark:#0b4765; --nb-blue-light:#1f86b3; --nb-tint:#eaf6fb;
  --nb-gold:#c8a85b; --nb-gold-soft:#f6efdc; --nb-gold-ink:#6b5520;
  --nb-ink:#18252d; --nb-muted:#5f707b; --nb-paper:#f8fcfe; --nb-line:#dfeaf0;
  --nb-shadow:0 18px 50px rgba(15,98,136,.10);

  /* remap the old dark-theme variables so anything not overridden below still fits */
  --bg:var(--nb-paper); --panel:#fff; --card:#fff;
  --line:var(--nb-line); --line-strong:#c5dbe6;
  --txt:var(--nb-ink); --muted:var(--nb-muted);
  --accent:var(--nb-blue); --accent2:var(--nb-blue);
  --shadow:var(--nb-shadow);
}
body{
  font-family:"DM Sans",system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
  color:var(--nb-ink);
  background:linear-gradient(180deg,var(--nb-tint) 0,var(--nb-paper) 420px);
}
h1,h2,h3{ color:var(--nb-ink); }

/* ---- top bar → page header ---- */
.topbar{
  background:rgba(248,252,254,.94);
  border-bottom:1px solid var(--nb-line);
  backdrop-filter:blur(10px);
}
.brand img{ background:#fff; border-color:var(--nb-line); }
.brand h1{ font-family:"Playfair Display",Georgia,serif; color:var(--nb-blue); font-size:1.45rem; }
.brand .sub{ color:var(--nb-muted); }
.btn{ background:#fff; border-color:var(--nb-line); color:var(--nb-blue); font-weight:700; }
.btn:hover{ background:var(--nb-tint); border-color:var(--nb-blue-light); }
.dot{ background:#d93025; box-shadow:0 0 0 4px rgba(217,48,37,.15); }

/* ---- panels ---- */
.panel{ background:#fff; border-color:var(--nb-line); box-shadow:var(--nb-shadow); }
.panelHead h2,.panelTitle,.calendarToolbar h2,.dayModalHead h2{
  font-family:"Playfair Display",Georgia,serif; color:var(--nb-blue); font-weight:700;
}
.panelHint,.featuredDate{ color:var(--nb-muted); }
.featuredDate{ background:var(--nb-gold-soft); color:var(--nb-gold-ink); padding:3px 10px; border-radius:99px; font-weight:700; }

/* ---- live pills ---- */
.pillIcon{ background:var(--nb-paper); border-color:var(--nb-line); color:var(--nb-ink); }
.pillIcon:hover{ border-color:var(--nb-blue-light); }
.pillTitle{ color:var(--nb-ink); }
.pillStatus,.pillIcon.offline .pillStatus{ background:#fff; border-color:var(--nb-line); color:var(--nb-muted); }
.pillIcon.online{ border-color:#f3b4ae; background:#fff6f5; }
.pillIcon.online .pillStatus{ background:#d93025; border-color:#d93025; color:#fff; }
.pillIcon.online::after{ background:#d93025; animation-name:redPulse; }
@keyframes redPulse{
  0%{ box-shadow:0 0 0 0 rgba(217,48,37,.35) }
  55%{ box-shadow:0 0 0 10px rgba(217,48,37,.06) }
  100%{ box-shadow:0 0 0 16px rgba(217,48,37,0) }
}
.liveAction{ background:#fff; border-color:var(--nb-line); color:var(--nb-blue); box-shadow:none; }
.liveAction:hover{ border-color:var(--nb-blue-light); background:var(--nb-tint); }
.liveAction.whatsapp{ background:#1fa855; border-color:#1fa855; color:#fff; }

/* ---- featured event ---- */
.featuredPosterBox{ background:var(--nb-tint); border-color:var(--nb-line); }
.chip{ background:var(--nb-tint); border-color:var(--nb-line); color:var(--nb-blue); font-weight:700; }
.featuredCopy h3{ font-family:"Playfair Display",Georgia,serif; color:var(--nb-ink); font-weight:700; font-size:1.25rem; }
.featuredMeta{ color:var(--nb-muted); }
.featuredDesc{ color:var(--nb-ink); }
.smallBtn{ background:#fff; border-color:var(--nb-line); color:var(--nb-blue); font-weight:700; }
.smallBtn:hover{ background:var(--nb-tint); }
.smallBtn.primary{ background:var(--nb-blue); border-color:var(--nb-blue); color:#fff; }
.smallBtn.primary:hover{ background:var(--nb-blue-dark); }

/* ---- month grid ---- */
.monthBtn{ background:#fff; border-color:var(--nb-line); color:var(--nb-blue); }
.monthBtn:hover{ background:var(--nb-tint); border-color:var(--nb-blue-light); }
.weekdayRow div{ color:var(--nb-muted); text-transform:uppercase; letter-spacing:.06em; font-size:.78rem; }
.day{ background:#fff; border-color:var(--nb-line); }
.day:hover{ border-color:var(--nb-blue-light); box-shadow:0 6px 18px rgba(15,98,136,.08); }
.day.empty{ background:transparent; border-color:transparent; box-shadow:none; }
.day.has-events{ background:var(--nb-paper); }
.day.today{ background:#fbf0cf; border-color:var(--nb-gold); box-shadow:0 0 0 1px var(--nb-gold); }
.day.selected{ border-color:var(--nb-blue); box-shadow:0 0 0 2px rgba(15,98,136,.25); }
.dayNumber{ color:var(--nb-blue); }
.day.today .dayNumber{ color:var(--nb-gold-ink); }
.hijriDate{ color:var(--nb-muted); font-weight:600; }
.thumbStack .thumb{ border-color:var(--nb-line); background:var(--nb-tint); }
.eventBadge{ background:var(--nb-blue); border-color:var(--nb-blue); color:#fff; }
.moreEvents{ background:var(--nb-gold-soft); border-color:#eadfbf; color:var(--nb-gold-ink); }

/* ---- timeline ---- */
.timelineItem{ background:#fff; border-color:var(--nb-line); }
.timelineItem:hover{ border-color:var(--nb-blue-light); }
.timelinePoster{ border-color:var(--nb-line); background:var(--nb-tint); }
.timelineCopy h3 a{ color:var(--nb-ink); }
.timelineCopy h3 a:hover{ color:var(--nb-blue); }
.timelineDate{ color:var(--nb-gold-ink); }
.timelineMeta,.timelineDesc{ color:var(--nb-muted); }
.timelineLink{ color:var(--nb-blue); }
.noEvents{ background:var(--nb-paper); border-color:var(--nb-line); color:var(--nb-muted); }

/* ---- day pop-up ---- */
.dayModalBackdrop{ background:rgba(11,71,101,.45); }
.dayModalCard{ background:#fff; border-color:var(--nb-line); }
.dayModalHead{ background:#fff; border-bottom:1px solid var(--nb-line); }
.dayModalClose{ background:#fff; border:1px solid var(--nb-line); color:var(--nb-blue); }
.dayModalItem{ background:var(--nb-paper); border-color:var(--nb-line); }
.dayModalCopy h3 a{ color:var(--nb-ink); }
.dayModalMeta,.dayModalDesc{ color:var(--nb-muted); }
.dayModalLink{ color:var(--nb-blue); }

/* ---- previous events ---- */
.pastPanel[hidden]{ display:none; }
.pastPanel .panelHead a.panelHint{ color:var(--nb-blue); font-weight:700; text-decoration:none; }
.pastPanel .panelHead a.panelHint:hover{ text-decoration:underline; }
.pastItem{ background:var(--nb-paper); }
.pastItem .timelineDate{ color:var(--nb-muted); }
.recBadge{ display:inline-block; margin-left:6px; padding:1px 9px; border-radius:99px; background:#d93025; color:#fff;
  font-size:.75rem; font-weight:800; vertical-align:1px; }
.pastMoreWrap{ text-align:center; margin:14px 0 0; }
.pastMoreWrap .smallBtn{ font:inherit; font-weight:700; cursor:pointer; }