/* Public Events page (page-events.php / cbco-events-page.php), 2026-09-30.
 * Loads on top of cbco-location.css: the hero, facts strip, cards, buttons and
 * sections are the location page's; this file adds what is specific to events —
 * the "Don't miss" photo cards with a date badge, the per-taproom weekly groups,
 * and the month-grouped upcoming list restyled in the same vocabulary. */

.cbco-evp h4 { font-family: 'Oswald', 'Arial Narrow', Arial, sans-serif; text-transform: uppercase; letter-spacing: .01em; line-height: 1.05; margin: 0; padding: 0; color: inherit; font-size: 21px; font-weight: 600; text-wrap: balance; }
.cbco-loc h1.cbco-evp__h1 { max-width: 14ch; }
.cbco-evp img.cbco-loc__hero-img { object-position: 55% 45%; }
/* room above the eyebrow and below the buttons (Joanna, 2026-09-30): Salient's container rule zeroes the template padding */
.cbco-evp .cbco-loc__hero-in, body .container-wrap.cbco-evp .cbco-loc__hero-in { padding-top: 96px !important; padding-bottom: 96px !important; min-height: 600px; }
@media (max-width: 760px) { .cbco-evp .cbco-loc__hero-in, body .container-wrap.cbco-evp .cbco-loc__hero-in { padding-top: 64px !important; padding-bottom: 56px !important; } }
@media (max-width: 760px) { .cbco-evp img.cbco-loc__hero-img { object-position: 45% 40%; } }
.cbco-loc__fact small { display: block; font-size: 13px; color: var(--lp-muted); }
.cbco-loc__fact small a { text-decoration: underline; }

/* ---------- Don't miss: the location card with the photo doing the work ---------- */
.cbco-evp__picks { grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); }
.cbco-loc a.cbco-evp__pick { text-decoration: none; color: var(--lp-ink); }
.cbco-loc a.cbco-evp__pick:hover { color: var(--lp-ink); }
.cbco-evp__pick-ph { position: relative; aspect-ratio: 4 / 3; background: var(--acc, var(--lp-navy)) center / cover no-repeat; }
.cbco-evp__pick-ph::after { content: ""; position: absolute; inset: 0; background: linear-gradient(to top, color-mix(in srgb, var(--acc, var(--lp-navy)) 55%, transparent) 0%, transparent 55%); }
/* the ash C on photo-less cards, in the card's tag colour */
.cbco-evp__pick-ph:not([style])::before { content: ""; position: absolute; left: 50%; bottom: -30%; height: 150%; aspect-ratio: 1655 / 3199; transform: translateX(-50%); background: #fff; opacity: .18; -webkit-mask: url(../img/cbco-c-mark-v2.png) center / contain no-repeat; mask: url(../img/cbco-c-mark-v2.png) center / contain no-repeat; }
.cbco-evp__date { position: absolute; left: 14px; top: 14px; z-index: 1; display: inline-flex; flex-direction: column; align-items: center; background: #fff; color: var(--lp-navy); border-radius: 8px; padding: 7px 10px 6px; line-height: 1; font-family: 'Oswald', Arial, sans-serif; box-shadow: 0 6px 16px rgba(0, 0, 0, .18); }
.cbco-evp__date b { font-weight: 700; font-size: 26px; letter-spacing: -.5px; }
.cbco-evp__date i { font-style: normal; font-weight: 600; font-size: 11px; letter-spacing: 1.5px; text-transform: uppercase; margin-top: 3px; }
.cbco-evp__pick h3 { font-size: 22px; }
.cbco-evp__venue { font-size: 14px; font-weight: 500; color: var(--lp-muted); }
.cbco-evp__cta { margin-top: auto; padding-top: 10px; font-family: 'Oswald', Arial, sans-serif; text-transform: uppercase; letter-spacing: .1em; font-size: 13px; font-weight: 600; color: var(--lp-ember-deep); }
.cbco-loc a.cbco-evp__pick:hover .cbco-evp__cta { color: var(--lp-navy); }

/* ---------- Every week: one group per taproom ---------- */
.cbco-evp__loc + .cbco-evp__loc { margin-top: 44px; padding-top: 36px; border-top: 1px solid var(--lp-line); }
.cbco-evp__loc-head { display: flex; align-items: baseline; justify-content: space-between; gap: 16px; flex-wrap: wrap; margin-bottom: 18px; }
.cbco-evp__loc-head h3 { font-size: 26px; color: var(--lp-navy); }
.cbco-loc a.cbco-evp__loc-link { font-family: 'Oswald', Arial, sans-serif; text-transform: uppercase; letter-spacing: .1em; font-size: 13px; font-weight: 500; color: var(--lp-ember-deep); text-decoration: none; }
.cbco-loc a.cbco-evp__loc-link:hover { color: var(--lp-navy); text-decoration: underline; text-underline-offset: 3px; }
.cbco-evp__week { grid-template-columns: repeat(auto-fit, minmax(196px, 1fr)); }
#weekly-wexford .cbco-evp__week { grid-template-columns: repeat(auto-fit, minmax(196px, 300px)); }
@media (max-width: 700px) { #weekly-wexford .cbco-evp__week { grid-template-columns: 1fr; } } /* one column on phones: full width like the Warehouse cards above (2026-10-05) */

/* ---------- the full list: [cbco_upcoming_events group="month"] in this vocabulary ---------- */
.cbco-evp .cbco-evf { background: #fff; border: 1px solid var(--lp-line); border-radius: 12px; padding: 18px 20px; margin-bottom: 26px; gap: 12px 20px; }
.cbco-evp .cbco-evf__field > span, .cbco-evp .cbco-evf__check { font-weight: 500; letter-spacing: .12em; color: var(--lp-muted); }
.cbco-evp .cbco-evf select { border-color: var(--lp-navy); color: var(--lp-navy); font-weight: 500; border-radius: 999px; }
.cbco-evp .cbco-evf__apply { background: var(--lp-navy); border-color: var(--lp-navy); font-weight: 500; }
.cbco-evp .cbco-evf__reset { color: var(--lp-navy); font-weight: 500; }
.cbco-evp .cbco-evf__count { color: var(--lp-muted); font-family: 'Open Sans', Arial, sans-serif; letter-spacing: 0; }
.cbco-evp ul.cbco-ev-list { display: flex; flex-direction: column; gap: 10px; margin: 0; }
/* months as fold-outs, like the menu drop-downs on the location pages */
.cbco-evp li.cbco-ev-month { list-style: none; margin: 0; padding: 0; background: #fff; border: 1px solid var(--lp-line); border-radius: 12px; overflow: hidden; transition: border-color .15s, box-shadow .15s; }
.cbco-evp li.cbco-ev-month.is-open { border-color: var(--lp-navy); box-shadow: 0 10px 26px rgba(0, 0, 0, .06); }
.cbco-evp li.cbco-ev-month[hidden] { display: none; }
.cbco-evp button.cbco-ev-month__btn { width: 100%; display: flex; align-items: center; gap: 14px; background: none; border: 0; margin: 0; padding: 18px 22px; cursor: pointer; text-align: left; color: var(--lp-ink); }
.cbco-evp button.cbco-ev-month__btn:hover h3 { color: var(--lp-navy); }
.cbco-evp li.cbco-ev-month h3 { font-size: 24px; color: var(--lp-navy); margin: 0; }
.cbco-evp .cbco-ev-month__count { margin-left: auto; font-family: 'Oswald', Arial, sans-serif; text-transform: uppercase; letter-spacing: .1em; font-size: 12px; font-weight: 500; color: var(--lp-muted); white-space: nowrap; }
.cbco-evp .cbco-ev-month__btn i { flex: 0 0 auto; width: 34px; height: 34px; border-radius: 50%; background: var(--lp-ember); position: relative; transition: background .15s; }
.cbco-evp .cbco-ev-month__btn i::before, .cbco-evp .cbco-ev-month__btn i::after { content: ""; position: absolute; left: 50%; top: 50%; width: 12px; height: 2px; background: #fff; transform: translate(-50%, -50%); }
.cbco-evp .cbco-ev-month__btn i::after { transform: translate(-50%, -50%) rotate(90deg); transition: transform .2s; }
.cbco-evp li.cbco-ev-month.is-open .cbco-ev-month__btn i::after { transform: translate(-50%, -50%) rotate(0deg); }
.cbco-evp ul.cbco-ev-month__rows { list-style: none; margin: 0; padding: 10px 14px 14px; border-top: 1px solid var(--lp-line); background: var(--lp-paper); display: flex; flex-direction: column; gap: 10px; }
/* closed months hide their rows only when the script is running; without it every month is open */
.cbco-evp ul.cbco-ev-list.is-js li.cbco-ev-month:not(.is-open) ul.cbco-ev-month__rows { display: none; }
.cbco-evp .cbco-ev { position: relative; background: #fff; border: 1px solid var(--lp-line); border-left: 6px solid var(--acc, var(--lp-navy)); border-radius: 10px; padding: 12px 16px 12px 14px; gap: 16px; transition: transform .15s ease, box-shadow .15s ease; }
.cbco-evp .cbco-ev:hover { transform: translateY(-2px); box-shadow: 0 10px 24px rgba(1, 32, 127, .1); }
.cbco-evp .cbco-ev__img { border-radius: 8px; background: var(--lp-cream); }
.cbco-evp .cbco-ev__date { color: var(--lp-navy); }
.cbco-evp .cbco-ev__mon { color: var(--lp-muted); }
.cbco-evp .cbco-ev h3.cbco-ev__title { font-weight: 600; letter-spacing: .01em; font-size: 21px !important; line-height: 1.15 !important; }
.cbco-evp .cbco-ev__title a { color: var(--lp-ink); }
.cbco-evp .cbco-ev__title a:hover { color: var(--lp-navy); }
.cbco-evp .cbco-ev__title a::after { content: ""; position: absolute; inset: 0; } /* whole card clicks through */
.cbco-evp .cbco-ev__meta, .cbco-evp .cbco-ev__sub { font-family: 'Open Sans', Arial, sans-serif; font-size: 14px; line-height: 1.5; color: var(--lp-muted); }
.cbco-evp .cbco-ev__badge { position: relative; z-index: 1; border-color: var(--lp-navy); color: var(--lp-navy); font-weight: 500; }
.cbco-evp a.cbco-ev__badge:hover { background: var(--lp-navy); color: #fff; }
.cbco-evp .cbco-ev__badge--off { border-color: #b3261e; color: #b3261e; }
.cbco-evp .cbco-ev-list__empty, .cbco-evp .cbco-upcoming-none { font-size: 16px; color: var(--lp-muted); }
.cbco-evp .cbco-ev-list__empty a { color: var(--lp-navy); }
@media (max-width: 690px) {
	.cbco-evp .cbco-ev { padding: 10px 12px 10px 10px; gap: 12px; }
	.cbco-evp li.cbco-ev-month h3 { font-size: 20px; }
	.cbco-evp button.cbco-ev-month__btn { padding: 14px 14px; gap: 10px; }
	.cbco-evp ul.cbco-ev-month__rows { padding: 8px 8px 10px; }
}

/* ---------- closing duo: the off-site card in navy (the ember one is the taprooms' ordering card) ---------- */
.cbco-loc .cbco-evp__offsite { background: var(--lp-navy); }
.cbco-loc .cbco-evp__offsite p { color: var(--lp-on-dark-text); }
.cbco-loc .cbco-evp__offsite .cbco-loc__eyebrow { color: var(--lp-on-dark-accent); }
.cbco-loc .cbco-evp__offsite a.cbco-loc__btn--white { color: var(--lp-navy); }
.cbco-loc .cbco-evp__offsite a.cbco-loc__btn--ghostw:hover { color: var(--lp-navy); }

/* fixes seen on the first render (2026-09-30): Salient's 30px form-label rule hit the
   checkbox label; the hidden full-date span still triggered a leading separator dot;
   the badge pill carried its separator inside its own padding */
.cbco-evp label.cbco-evf__check, .cbco-evp .cbco-evf__check { font-size: 12px !important; line-height: 16px !important; font-weight: 500 !important; letter-spacing: .12em !important; text-transform: uppercase; color: var(--lp-muted) !important; margin: 0 !important; }
.cbco-evp .cbco-evf__field > span { font-size: 12px !important; line-height: 16px !important; }
.cbco-evp .cbco-ev__meta > * + *::before { content: "\00b7"; margin: 0 8px; color: #b9b3a4; }
.cbco-evp .cbco-ev__meta > .cbco-ev__fulldate + *::before, .cbco-evp .cbco-ev__meta > .cbco-ev__badge::before { content: none; margin: 0; }
.cbco-evp .cbco-ev__badge { margin-left: 10px; vertical-align: 1px; }
