/*
 * Unify Events
 *
 * Styling reads the theme's --unify-* variables with neutral fallbacks, so
 * events pick up each site's colours and fonts. To tune a site, set any
 * --ue-* variable on .ue in the theme:
 *   --ue-text, --ue-muted, --ue-border, --ue-bg, --ue-card-bg, --ue-accent,
 *   --ue-badge-bg, --ue-badge-text, --ue-focus, --ue-radius, --ue-max,
 *   --ue-gutter, --ue-font-heading, --ue-font-body, --ue-columns
 * Buttons also carry .unify-btn, so they look like the theme's own buttons.
 * Defaults sit in :where() so a theme's plain .ue { --ue-…: … } always wins.
 */

:where(.ue, .ue-banner) {
    --ue-text: var(--unify-text, #1f2124);
    --ue-muted: var(--unify-text-muted, #5e6476);
    --ue-border: var(--unify-border, #d9dce2);
    --ue-bg: var(--unify-bg, #fff);
    --ue-card-bg: var(--unify-bg-alt, #f7f7f7);
    --ue-accent: var(--unify-accent, #1f2a44);
    --ue-badge-bg: var(--unify-primary, #1f2124);
    --ue-badge-text: var(--unify-white, #fff);
    --ue-focus: var(--gh-accent, var(--unify-accent, #2a7bb3));
    --ue-radius: var(--unify-radius-md, 6px);
    --ue-max: var(--unify-max-width, 1200px);
    --ue-gutter: var(--unify-gutter, clamp(1rem, 4vw, 2.5rem));
    --ue-font-heading: var(--unify-font-heading, inherit);
    --ue-font-body: var(--unify-font-body, inherit);
    --ue-space: var(--unify-space-lg, 1.5rem);
    --ue-columns: 3;
}

.ue { color: var(--ue-text); font-family: var(--ue-font-body); }
.ue *, .ue *::before, .ue *::after { box-sizing: border-box; }
.ue [hidden] { display: none !important; }

.ue-inner {
    width: 100%;
    max-width: calc(var(--ue-max, 1200px) + 2 * var(--ue-gutter, 1.25rem));
    margin-inline: auto;
    padding-inline: var(--ue-gutter, 1.25rem);
}

.screen-reader-text:not(:focus) {
    position: absolute !important;
    width: 1px; height: 1px; overflow: hidden;
    clip: rect(1px, 1px, 1px, 1px); white-space: nowrap;
}

/* Fallback banner, used only when the theme has no parts/banner.php */
.ue-banner { padding: 3rem 0 2rem; background: var(--ue-card-bg, #f7f7f7); }
.ue-banner__title { margin: 0; font-family: var(--ue-font-heading); }
.ue-banner__intro { margin-top: .75rem; max-width: 46rem; }

/* Buttons, for themes without .unify-btn */
:where(.ue-button) {
    display: inline-block;
    padding: 14px 28px;
    border: 1.5px solid var(--ue-accent);
    border-radius: 50px;
    background: var(--ue-accent);
    color: #fff;
    font: inherit;
    font-weight: 600;
    line-height: 1;
    text-decoration: none;
    cursor: pointer;
}
:where(.ue-button--outline) { background: transparent; color: inherit; border-color: currentColor; }
.ue-button[disabled] { opacity: .6; cursor: progress; }

.ue :focus-visible { outline: 3px solid var(--ue-focus); outline-offset: 2px; }

.ue-badge {
    display: inline-block;
    padding: .2em .6em;
    border-radius: 50px;
    background: var(--ue-badge-bg);
    color: var(--ue-badge-text);
    font-size: .8125rem;
    font-weight: 600;
    line-height: 1.4;
    white-space: nowrap;
}

.ue-notice {
    margin: 0 0 var(--ue-space);
    padding: 1rem 1.25rem;
    border-left: 4px solid var(--ue-accent);
    background: var(--ue-card-bg);
}
.ue-notice--error { border-left-color: #b3261e; }
.ue-empty { color: var(--ue-muted); }

/* ── Listing ─────────────────────────────────────────────────────────── */

.ue-archive { padding-block: var(--unify-space-2xl, 3rem) var(--unify-space-4xl, 5rem); }

.ue-filters { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem; margin-bottom: var(--unify-space-2xl, 3rem); }
.ue-filters__label { margin-left: .75rem; color: var(--ue-muted); font-size: .875rem; }
.ue-pill {
    display: inline-block;
    padding: .45em 1em;
    border: 1.5px solid var(--ue-border);
    border-radius: 50px;
    color: inherit;
    font-size: .9375rem;
    text-decoration: none;
}
.ue-pill:hover { border-color: currentColor; }
.ue-pill.is-current { background: var(--ue-text); border-color: var(--ue-text); color: var(--ue-bg); }

.ue-month + .ue-month { margin-top: var(--unify-space-2xl, 3rem); }
.ue-month__title {
    margin: 0 0 var(--ue-space);
    padding-bottom: .5rem;
    border-bottom: 1px solid var(--ue-border);
    font-family: var(--ue-font-heading);
    font-size: var(--unify-size-2xl, 2rem);
}

.ue-grid {
    display: grid;
    grid-template-columns: repeat(var(--ue-columns), minmax(0, 1fr));
    gap: var(--unify-space-xl, 2rem);
}
@media (max-width: 960px) { .ue-grid { --ue-columns: 2; } }
@media (max-width: 600px) { .ue-grid { --ue-columns: 1; } }

.ue-listing__more { margin-top: var(--unify-space-2xl, 3rem); text-align: center; }

/* ── Card ────────────────────────────────────────────────────────────── */

.ue-card {
    position: relative;
    display: flex;
    flex-direction: column;
    background: var(--ue-card-bg);
    color: var(--ue-text);
    transition: box-shadow .15s ease;
}
.ue-card:hover { box-shadow: var(--unify-shadow-md, 0 6px 20px rgba(0, 0, 0, .1)); }
.ue-card:focus-within { outline: 3px solid var(--ue-focus); outline-offset: 3px; }

.ue-card__image { position: relative; aspect-ratio: 8 / 5; background: var(--ue-border); }
.ue-card__image img { display: block; width: 100%; height: 100%; object-fit: cover; }
.ue-card--no-image .ue-card__image { aspect-ratio: auto; min-height: 5.5rem; background: transparent; }

.ue-card__date {
    position: absolute;
    left: 1rem;
    bottom: -1.25rem;
    display: grid;
    place-items: center;
    width: 3.75rem;
    padding: .4rem 0;
    background: var(--ue-bg);
    color: var(--ue-text);
    line-height: 1.1;
    text-align: center;
    box-shadow: 0 2px 6px rgba(0, 0, 0, .08);
}
.ue-card--no-image .ue-card__date { top: 1rem; bottom: auto; }
.ue-card__day { font-family: var(--ue-font-heading); font-size: 1.625rem; font-weight: 700; }
.ue-card__month { font-size: .8125rem; text-transform: uppercase; letter-spacing: .06em; }

.ue-card__body { flex: 1; display: flex; flex-direction: column; padding: 2rem var(--ue-space) var(--unify-space-xl, 2rem); }
.ue-card--no-image .ue-card__body { padding-top: .75rem; }
.ue-card__cats { margin: 0 0 .35rem; color: var(--ue-muted); font-size: .8125rem; font-weight: 600; letter-spacing: .04em; text-transform: uppercase; }
.ue-card__title { margin: 0 0 .5rem; font-family: var(--ue-font-body); font-size: var(--unify-size-xl, 1.5rem); font-weight: 400; line-height: 1.35; }
.ue-card__title a { color: inherit; text-decoration: none; }
.ue-card__title a::after { content: ''; position: absolute; inset: 0; }
.ue-card:hover .ue-card__title a { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 4px; }
.ue-card__when, .ue-card__repeat { margin: 0 0 .25rem; font-size: .9375rem; }
.ue-card__repeat { color: var(--ue-muted); }
.ue-card__meta { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem; margin: auto 0 0; padding-top: .75rem; font-weight: 600; }
.ue-card__button { align-self: flex-start; margin-top: 1rem; }

/* ── Carousel: scroll-snap, arrows scroll one card ───────────────────── */

.ue-carousel__track {
    display: grid;
    grid-auto-flow: column;
    grid-auto-columns: calc((100% - 2 * var(--unify-space-xl, 2rem)) / 3);
    gap: var(--unify-space-xl, 2rem);
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    scrollbar-width: thin;
    padding-bottom: .75rem;
}
.ue-carousel__track > .ue-card { scroll-snap-align: start; }
@media (max-width: 960px) { .ue-carousel__track { grid-auto-columns: calc((100% - var(--unify-space-xl, 2rem)) / 2); } }
@media (max-width: 600px) { .ue-carousel__track { grid-auto-columns: 85%; } }
.ue-carousel__nav { display: flex; justify-content: flex-end; gap: .5rem; margin-top: 1rem; }
.ue-carousel__btn {
    width: 2.75rem; height: 2.75rem;
    border: 1.5px solid currentColor;
    border-radius: 50%;
    background: transparent;
    color: inherit;
    font-size: 1.25rem;
    cursor: pointer;
}
.ue-carousel__btn:hover { background: var(--ue-text); color: var(--ue-bg); }

/* ── Single event ────────────────────────────────────────────────────── */

.ue-single { padding-block: var(--unify-space-2xl, 3rem) var(--unify-space-4xl, 5rem); }
.ue-single__layout { display: grid; grid-template-columns: minmax(0, 2fr) minmax(260px, 1fr); gap: var(--unify-space-2xl, 3rem); align-items: start; }
@media (max-width: 900px) { .ue-single__layout { grid-template-columns: 1fr; } }
.ue-content { font-size: var(--unify-size-md, 1.125rem); line-height: var(--unify-line-height, 1.6); }
.ue-content > :first-child { margin-top: 0; }

.ue-details { padding: var(--ue-space); background: var(--ue-card-bg); }
.ue-details__title { margin: 0 0 1rem; font-family: var(--ue-font-heading); font-size: var(--unify-size-xl, 1.5rem); }
.ue-details__list { margin: 0; }
.ue-details__list dt { margin-top: 1rem; color: var(--ue-muted); font-size: .8125rem; font-weight: 600; letter-spacing: .04em; text-transform: uppercase; }
.ue-details__list dt:first-child { margin-top: 0; }
.ue-details__list dd { margin: .25rem 0 0; }
.ue-details__list a { color: inherit; }
.ue-details__dates { margin: .25rem 0 0; padding: 0; list-style: none; }
.ue-details__dates li { padding: .3rem 0; border-bottom: 1px solid var(--ue-border); font-size: .9375rem; }
.ue-details__repeat { display: block; }
.ue-details__more { margin: .4rem 0 0; color: var(--ue-muted); font-size: .9375rem; }
.ue-details__cta { margin-top: var(--ue-space); width: 100%; text-align: center; }

/* ── Booking form ────────────────────────────────────────────────────── */

.ue-single__book { margin-top: var(--unify-space-3xl, 4rem); scroll-margin-top: calc(var(--unify-nav-height, 0px) + 1rem); }
.ue-book__title { margin: 0 0 var(--ue-space); font-family: var(--ue-font-heading); }

.ue-form { max-width: 46rem; }
.ue-form__group { margin: 0 0 var(--unify-space-xl, 2rem); padding: 0; border: 0; }
.ue-form__group > legend { margin-bottom: .75rem; padding: 0; font-size: var(--unify-size-lg, 1.25rem); font-weight: 700; }
.ue-form label { font-weight: 600; }
.ue-form input[type="text"], .ue-form input[type="email"], .ue-form input[type="tel"], .ue-form select, .ue-form textarea {
    width: 100%;
    max-width: 100%;
    padding: .7rem .8rem;
    border: 1.5px solid var(--ue-border);
    border-radius: var(--ue-radius);
    background: var(--ue-bg);
    color: var(--ue-text);
    font: inherit;
}
.ue-form select { width: auto; min-width: 4.5rem; }
.ue-form #ue-date { width: 100%; }
.ue-form input:focus, .ue-form select:focus, .ue-form textarea:focus { border-color: var(--ue-text); }
.ue-form__date { margin: 0; font-size: var(--unify-size-md, 1.125rem); }

.ue-tickets { border-top: 1px solid var(--ue-border); }
.ue-ticket { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; align-items: center; gap: .5rem 1.25rem; padding: .9rem 0; border-bottom: 1px solid var(--ue-border); }
.ue-ticket__name { display: block; }
.ue-ticket__desc { display: block; color: var(--ue-muted); font-size: .9375rem; }
.ue-ticket__price { font-weight: 600; }
.ue-ticket__qty { display: flex; align-items: center; gap: .5rem; }
.ue-ticket__soldout { color: var(--ue-muted); font-size: .875rem; }
.ue-form__total { margin: 1rem 0 0; font-size: var(--unify-size-md, 1.125rem); text-align: right; }

.ue-form__fields { display: grid; grid-template-columns: 1fr 1fr; gap: 0 1.25rem; }
.ue-field { margin: 0 0 1rem; }
.ue-field label { display: block; margin-bottom: .3rem; }
.ue-field--wide { grid-column: 1 / -1; }
.ue-field__hint { color: var(--ue-muted); font-weight: 400; }
@media (max-width: 600px) { .ue-form__fields { grid-template-columns: 1fr; } }

.ue-check { display: flex; gap: .6rem; align-items: flex-start; }
.ue-check input { width: 1.2rem; height: 1.2rem; margin-top: .2rem; flex: none; }
.ue-check label { font-weight: 400; }
.ue-hp { position: absolute !important; left: -9999px; }
.ue-form__terms { color: var(--ue-muted); font-size: .9375rem; }
.ue-form__submit { display: flex; flex-wrap: wrap; align-items: center; gap: 1rem; }
.ue-form__secure { color: var(--ue-muted); font-size: .9375rem; }

/* ── Ticket page ─────────────────────────────────────────────────────── */

.ue-ticket-wrap { padding-block: var(--unify-space-2xl, 3rem) var(--unify-space-4xl, 5rem); }
.ue-lead { font-size: var(--unify-size-md, 1.125rem); }
.ue-ticket-card {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 12rem;
    max-width: 46rem;
    border: 2px solid var(--ue-text);
    border-radius: 12px;
    background: var(--ue-bg);
}
.ue-ticket-card.is-void { opacity: .55; }
.ue-ticket-card__main { padding: 1.5rem; }
.ue-ticket-card__stub { display: flex; flex-direction: column; justify-content: center; padding: 1.5rem; border-left: 2px dashed var(--ue-text); text-align: center; }
.ue-ticket-card__label { margin: 0; color: var(--ue-muted); font-size: .75rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.ue-ticket-card__title { margin: .25rem 0; font-family: var(--ue-font-heading); font-size: var(--unify-size-2xl, 2rem); }
.ue-ticket-card__title a { color: inherit; text-decoration: none; }
.ue-ticket-card__when { margin: 0; font-weight: 600; }
.ue-ticket-card__where { margin: .25rem 0 0; color: var(--ue-muted); }
.ue-ticket-card__items { margin: 1rem 0; padding: 0; list-style: none; border-top: 1px solid var(--ue-border); }
.ue-ticket-card__items li { display: flex; justify-content: space-between; gap: 1rem; padding: .45rem 0; border-bottom: 1px solid var(--ue-border); }
.ue-ticket-card__total { font-weight: 700; }
.ue-ticket-card__name { margin: 0; font-weight: 600; }
.ue-ticket-card__ref { margin: .25rem 0 0; font-size: 1.375rem; font-weight: 700; letter-spacing: .04em; white-space: nowrap; }
@media (max-width: 600px) {
    .ue-ticket-card { grid-template-columns: 1fr; }
    .ue-ticket-card__stub { border-left: 0; border-top: 2px dashed var(--ue-text); }
}
.ue-ticket-message { max-width: 46rem; margin-top: var(--ue-space); }
.ue-ticket-actions { display: flex; flex-wrap: wrap; gap: .75rem; margin-top: var(--ue-space); }

@media print {
    .ue-ticket-page header, .ue-ticket-page footer, .ue-ticket-page .gh-banner, .ue-ticket-page .ue-banner, .ue-ticket-actions, .ue-lead { display: none !important; }
    .ue-ticket-card { break-inside: avoid; }
}
