/* v1.0.24 What's On page (page-whats-on.hbs only). Built 16 Oct 2026 from previews F/F-v2. */

/* --- grid.css --- */
/* v1.0.24 stories row: wraps in rows of 3; lone/short last row is centred; 1-2 cards keep 1/3 width (not stretched, not tiny) */
.woi-wop{max-width:1100px;margin:24px auto 8px;padding:0 16px;box-sizing:border-box}html body .woi-wop-h{font-size:22px;margin:0 0 12px;color:#0b1960;border-left:5px solid #0b1960;padding-left:10px}html body .woi-wop-grid{display:flex;flex-wrap:wrap;justify-content:center;gap:16px}html body .woi-wop-card{flex:0 1 calc((100% - 32px)/3);min-width:0;display:flex;flex-direction:column;text-decoration:none;color:#1c2333;background:#fff;border-radius:8px;overflow:hidden;box-shadow:0 1px 3px rgba(0,0,0,.12)}html body .woi-wop-card img{width:100%;aspect-ratio:16/9;object-fit:cover}html body .woi-wop-meta{font-size:12px;color:#5a6270;padding:8px 10px 0}html body .woi-wop-t{font-weight:700;font-size:15px;line-height:1.3;padding:4px 10px 12px}
@media(max-width:767px){.woi-wop{margin-top:14px}html body .woi-wop-grid{flex-wrap:nowrap;justify-content:flex-start;overflow-x:auto;scroll-snap-type:x mandatory;gap:12px;padding-bottom:4px}html body .woi-wop-card{flex:0 0 72%;scroll-snap-align:start}}

/* --- base-v2.css --- */
/* v2 common (D and E): no heading box, no navy line. H1 kept for SEO/screen readers but visually hidden. Tight top spacing. */
.post-heading{position:absolute!important;width:1px!important;height:1px!important;overflow:hidden!important;clip:rect(0 0 0 0)!important;clip-path:inset(50%)!important;white-space:nowrap!important;padding:0!important;margin:0!important;border:0!important}
.post-hero-text-content,article:has(.woi-intro) .post-hero-text-content{padding:0!important;margin:0!important;min-height:0!important;border:0!important}
.post-hero-text-content::before,.post-hero-text-content::after{display:none!important;content:none!important}
header.hero{padding:0!important;margin:0!important;min-height:0!important;border:0!important}
.post-content,article:has(.woi-intro) .post-content{margin-top:12px!important}html body .woi-wop{margin-top:12px!important}
/* mobile: the theme header is position:fixed (0-64px) so the current 24px top margin hides the top ~40px of the stories row. 72px puts the row 8px under the header. */
@media(max-width:767px){.woi-wop{margin-top:72px!important}.post-content,article:has(.woi-intro) .post-content{margin-top:8px!important}}

/* --- intro-compact.css --- */
/* shared D/E: compact intro card + the tidy "powered by" line with a Submit button */
.woi-intro .woi-intro-title{display:none!important}html body .woi-intro{padding:8px 12px!important;margin:0 0 10px!important;border-left-width:4px!important}
.gh-content .woi-intro p.woi-intro-lead{margin:0 0 6px!important;font-size:14px!important;line-height:1.4!important}
.gh-content .woi-intro .woi-intro-meta{padding:6px 0 0!important;gap:4px!important;grid-template-columns:1fr!important}
.gh-content .woi-intro .woi-intro-meta p{font-size:13px!important}
.gh-content .woi-intro .woi-intro-src{display:flex;flex-wrap:wrap;align-items:center;gap:6px 10px}
.gh-content .woi-intro a.woi-intro-btn{display:inline-block;padding:3px 10px;border-radius:999px;background:#2a74b8;color:#fff!important;text-decoration:none!important;font:700 12.5px/1.4 "Roboto Condensed",Arial,sans-serif}

/* --- option-F.css --- */
/* Option F (all widths, no media-query hiding): short intro line, no advertising line, "What's On" label above the event cards. */
/* Fallback if the advertising <p> is still in the card: hide every meta line except the new powered-by/Submit line. */
.gh-content .woi-intro .woi-intro-meta p:not(.woi-intro-src){display:none!important}
/* Section label above the events (filters + cards), styled like .woi-wop-h ("What's On stories"). Theme CSS only, so snippet.html/cron are untouched. */
html body .woi-ev::before{content:"What's On";display:block;font:400 22px/1.2 "Open Sans",system-ui,Arial,sans-serif;color:#0b1960;border-left:5px solid #0b1960;padding-left:10px;margin:14px 0 12px}

/* --- option-F-v2.css --- */
/* F-v2 additions (all widths) */
/* Revive banner above the stories row: same treatment as the news load-more banner (combined.css .woi-lm-ad) */
.woi-lm-ad{grid-column:1/-1;text-align:center;margin:8px auto 4px;max-width:100%;overflow:hidden;box-sizing:border-box;padding:0 16px}html body .woi-lm-ad ins{display:block;max-width:100%}html body .woi-lm-ad iframe,.woi-lm-ad img{max-width:100%!important;display:block;margin:0 auto}html body .woi-lm-ad img{height:auto}
html body .woi-wa-top{max-width:1100px}
/* Row gaps: same values as combined news (28px desktop, 20px <=999px) */
html body .woi-wop-grid{row-gap:28px!important}
html body .woi-ev-grid{row-gap:28px!important}
@media(max-width:999px){html body .woi-wop-grid{row-gap:20px!important}html body .woi-ev-grid{row-gap:20px!important}}

/* --- adlink.css --- */
html body .woi-ad-link{display:block;text-align:right;font-size:12px;line-height:1.3;color:#5a6270!important;text-decoration:underline;text-underline-offset:2px;margin:4px 2px 0}

/* banner sits above the stories row: on mobile it must clear the fixed 64px header; the stories row then follows closely */
html body .woi-wa-top{margin-top:12px!important;margin-bottom:0!important}
html body .woi-wa-top + .woi-wop{margin-top:10px!important}
@media(max-width:767px){html body .woi-wa-top{margin-top:72px!important}html body .woi-wa-top + .woi-wop{margin-top:8px!important}}

/* v1.0.25: tablet banner clearance. The theme header is position:fixed up to 991px (74px tall at 768), so clear it there too. */
@media(max-width:991px){html body .woi-wa-top{margin-top:82px!important}}
@media(max-width:767px){html body .woi-wa-top{margin-top:72px!important}}