/* =========================================================================
   CineMare Puglia — design system (giallo / nero / bianco · mood cinema)
   Font: Fraunces (display serif) + Hanken Grotesk (body).
   I token --ink/--yellow/... arrivano da config/config.php via header.php.
   ========================================================================= */

/* ---------- Reset leggero ---------- */
*,
*::before,
*::after { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; }

/* L'attributo [hidden] deve sempre vincere su display:flex/grid degli autori. */
[hidden] { display: none !important; }

body {
    margin: 0;
    background: var(--ink);
    color: var(--paper);
    font-family: "Hanken Grotesk", system-ui, sans-serif;
    font-size: 16px;
    line-height: 1.6;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
}

h1, h2, h3, h4 {
    font-family: "Fraunces", Georgia, serif;
    font-weight: 600;
    line-height: 1.08;
    margin: 0;
}

a { color: inherit; text-decoration: none; }
img { max-width: 100%; display: block; }
.muted { color: var(--muted); }

/* ---------- Layout ---------- */
.container {
    width: 100%;
    max-width: 1200px;
    margin-inline: auto;
    padding-inline: clamp(1rem, 4vw, 2.5rem);
}

.site-main { display: block; }

/* ---------- Brand ---------- */
.brand {
    font-family: "Fraunces", Georgia, serif;
    font-weight: 700;
    font-size: 1.6rem;
    letter-spacing: -0.01em;
}
.brand__cine { color: var(--paper); }
.brand__mare { color: var(--yellow); }
/* Icona ciak nel marchio */
.ciak { width: .92em; height: .92em; color: var(--yellow); vertical-align: -.14em; margin-right: .4em; }
/* Logo immagine nell'header (sostituisce il wordmark testuale) */
.brand { display: flex; align-items: center; }
.brand-mark { height: 42px; width: auto; display: block; }

/* Cornice "pellicola" fissa sui lati (decorativa, riprende le perforazioni delle card).
   Nascosta su mobile per non rubare larghezza. */
.site-body::before, .site-body::after {
    content: "";
    position: fixed;
    top: 0; bottom: 0;
    width: 16px;
    z-index: 60;
    pointer-events: none;
    background-image: repeating-linear-gradient(
        to bottom,
        color-mix(in srgb, var(--paper) 16%, transparent) 0 8px,
        transparent 8px 18px
    );
    background-size: 7px 100%;
    background-position: center top;
    background-repeat: no-repeat;
}
.site-body::before { left: 0; }
.site-body::after  { right: 0; }
@media (max-width: 880px) {
    .site-body::before, .site-body::after { display: none; }
}

/* ---------- Header / nav ---------- */
.site-header {
    position: sticky;
    top: 0;
    z-index: 50;
    background: color-mix(in srgb, var(--ink) 88%, transparent);
    backdrop-filter: saturate(140%) blur(10px);
    border-bottom: 1px solid var(--line);
}
.site-header__inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.5rem;
    min-height: 72px;
}
.site-nav {
    display: flex;
    align-items: center;
    gap: clamp(1rem, 2.5vw, 2rem);
    font-weight: 500;
}
.site-nav a { color: var(--paper); transition: color .15s ease; }
.site-nav a:hover { color: var(--yellow); }

/* ---------- Buttons ---------- */
.btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .5rem;
    font-family: inherit;
    font-weight: 700;
    font-size: .95rem;
    line-height: 1;
    padding: .85rem 1.4rem;
    border-radius: 999px;
    border: 1.5px solid transparent;
    cursor: pointer;
    transition: transform .12s ease, background .15s ease, color .15s ease, border-color .15s ease;
    white-space: nowrap;
}
.btn:hover { transform: translateY(-1px); }
.btn--sm { padding: .55rem 1.05rem; font-size: .85rem; }

.btn--primary {
    background: var(--yellow);
    color: var(--ink);
}
.btn--primary:hover { background: var(--yellow-deep); }

.btn--ghost {
    background: transparent;
    color: var(--paper);
    border-color: var(--yellow);
}
.btn--ghost:hover { background: var(--yellow); color: var(--ink); }

/* ---------- Badges ---------- */
.badge {
    display: inline-flex;
    align-items: center;
    font-size: .72rem;
    font-weight: 700;
    letter-spacing: .02em;
    padding: .3rem .65rem;
    border-radius: 999px;
    text-transform: uppercase;
}
.badge--genre {
    background: color-mix(in srgb, var(--ink) 70%, transparent);
    color: var(--paper);
    border: 1px solid color-mix(in srgb, var(--paper) 45%, transparent);
    backdrop-filter: blur(4px);
}
.badge--date {
    background: var(--yellow);
    color: var(--ink);
}

/* ---------- Flash ---------- */
.flash {
    margin-top: 1rem;
    padding: .9rem 1.2rem;
    border-radius: 12px;
    font-weight: 600;
}
.flash--success { background: color-mix(in srgb, var(--yellow) 22%, var(--ink)); color: var(--paper); border: 1px solid var(--yellow); }
.flash--error   { background: #2a1414; color: #ffd7d7; border: 1px solid #b54a4a; }

/* =========================================================================
   HERO
   ========================================================================= */
.hero {
    position: relative;
    padding: clamp(3rem, 9vw, 6.5rem) 0 clamp(2rem, 5vw, 3.5rem);
    overflow: hidden;
}
.hero::after {
    /* alone giallo soffuso in alto a destra, come una luna/proiettore */
    content: "";
    position: absolute;
    top: -30%;
    right: -10%;
    width: 55vw;
    height: 55vw;
    max-width: 640px;
    max-height: 640px;
    background: radial-gradient(circle, color-mix(in srgb, var(--yellow) 16%, transparent) 0%, transparent 62%);
    pointer-events: none;
}
.hero__inner { position: relative; z-index: 1; max-width: 760px; }
.hero__eyebrow {
    color: var(--yellow);
    font-weight: 700;
    font-size: .82rem;
    letter-spacing: .22em;
    text-transform: uppercase;
    margin: 0 0 1.1rem;
}
.hero__title {
    font-size: clamp(2.8rem, 8.5vw, 5.4rem);
    font-weight: 600;
    letter-spacing: -0.02em;
}
.hero__title em {
    font-style: italic;
    color: var(--yellow);
}
.hero__sub {
    margin: 1.4rem 0 0;
    font-size: clamp(1.05rem, 2.4vw, 1.3rem);
    color: color-mix(in srgb, var(--paper) 82%, transparent);
    max-width: 46ch;
}

/* =========================================================================
   SEZIONE EVENTI
   ========================================================================= */
.section { padding-block: clamp(1.5rem, 4vw, 2.5rem); }

.section__head {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 1.6rem;
}
.section__title { font-size: clamp(1.4rem, 3.5vw, 2rem); }
.section__link {
    color: var(--yellow);
    font-weight: 700;
    font-size: .95rem;
    transition: opacity .15s ease;
}
.section__link:hover { opacity: .7; }

/* Griglia card */
.event-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: clamp(1rem, 2vw, 1.5rem);
}

/* Card evento */
.event-card {
    background: var(--ink-soft);
    border: 1px solid var(--line);
    border-radius: 18px;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    transition: transform .18s ease, border-color .18s ease;
}
.event-card:hover {
    transform: translateY(-4px);
    border-color: color-mix(in srgb, var(--yellow) 55%, var(--line));
}

.event-card__poster {
    position: relative;
    display: block;
    aspect-ratio: 2 / 3;            /* manifesto cinema verticale */
    background:
        linear-gradient(160deg, #161616 0%, #060606 100%);
    padding: .85rem;
}
.event-card__img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}
/* perforazioni stile pellicola sul lato sinistro */
.event-card__strip {
    position: absolute;
    inset: 0 auto 0 0;
    width: 16px;
    background-image: repeating-linear-gradient(
        to bottom,
        color-mix(in srgb, var(--paper) 14%, transparent) 0 8px,
        transparent 8px 18px
    );
    background-position: center;
    background-size: 7px 100%;
    background-repeat: no-repeat;
}
.event-card__poster .badge--genre { position: absolute; top: .85rem; left: 1.6rem; }
.event-card__poster .badge--date  { position: absolute; bottom: .85rem; left: 1.6rem; }

.event-card__body { padding: 1.1rem 1.2rem 1.3rem; }
.event-card__title { font-size: 1.35rem; margin-bottom: .3rem; }
.event-card__venue { margin: 0 0 .45rem; color: var(--paper); font-size: 1rem; font-weight: 700; letter-spacing: .01em; }
.event-card--featured .event-card__venue { color: var(--ink); }
.event-card__meta { margin: 0 0 1rem; color: var(--muted); font-size: .92rem; }
.event-card__cta {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .75rem;
}
.event-card__price {
    color: var(--yellow);
    font-family: "Fraunces", Georgia, serif;
    font-weight: 600;
    font-size: 1.45rem;
}

/* Variante in evidenza: card gialla, testo nero */
.event-card--featured {
    background: var(--yellow);
    border-color: var(--yellow);
}
.event-card--featured .event-card__poster {
    background: linear-gradient(160deg, #1a1a1a 0%, #000 100%);
}
.event-card--featured .event-card__title,
.event-card--featured .event-card__price { color: var(--ink); }
.event-card--featured .event-card__price { color: var(--ink); }
.event-card--featured .event-card__meta { color: color-mix(in srgb, var(--ink) 65%, transparent); }
.event-card--featured .btn--primary {
    background: var(--ink);
    color: var(--yellow);
}
.event-card--featured .btn--primary:hover { background: #000; }

/* Serate concluse: card inerte, sbiadita, non cliccabile */
.section__head--past { margin-top: clamp(2.5rem, 6vw, 4rem); }
.section__note {
    font-size: .82rem;
    letter-spacing: .04em;
    text-transform: uppercase;
    color: var(--muted);
    font-weight: 600;
}
.event-card--past { opacity: .5; }
.event-card--past:hover { transform: none; border-color: var(--line); }
.event-card--past .event-card__poster { cursor: default; }
.event-card--past .event-card__img { filter: grayscale(.75); }
.event-card__done {
    font-size: .8rem;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--muted);
    font-weight: 600;
}
.badge--past {
    background: color-mix(in srgb, var(--paper) 16%, transparent);
    color: var(--paper);
    border: 1px solid color-mix(in srgb, var(--paper) 32%, transparent);
    backdrop-filter: blur(4px);
}
.event-card__poster .badge--past { position: absolute; bottom: .85rem; left: 1.6rem; }

/* Serata annullata / rinviata — badge listing, pill admin, banner pagina evento */
.badge--cancelled {
    background: #c0392b;
    color: #fff;
    border: 1px solid color-mix(in srgb, #c0392b 60%, #000);
}
.event-card__poster .badge--cancelled { position: absolute; bottom: .85rem; left: 1.6rem; }
.pill--cancelled { background: #fbe4e1; color: #b3271a; }

/* Serata "data da definire" — Prossimamente (tono info, non allarme) */
.badge--tbd {
    background: #2c6fb3;
    color: #fff;
    border: 1px solid color-mix(in srgb, #2c6fb3 60%, #000);
}
.event-card__poster .badge--tbd { position: absolute; bottom: .85rem; left: 1.6rem; }
.pill--tbd { background: #e1ecf7; color: #1d5285; }

/* Serata esaurita — badge nero/giallo (tono "tutto esaurito" da cinema) */
.badge--soldout {
    background: var(--ink);
    color: var(--yellow);
    border: 1px solid color-mix(in srgb, var(--yellow) 55%, transparent);
    font-weight: 700;
}
.event-card__poster .badge--soldout { position: absolute; bottom: .85rem; left: 1.6rem; }
.pill--soldout { background: #2b2b2b; color: var(--yellow); }

/* Ultimi posti — pill gialla in alto a destra (coesiste col badge data) */
.badge--fewleft {
    background: var(--yellow);
    color: var(--ink);
    border: 1px solid color-mix(in srgb, var(--ink) 25%, transparent);
    font-weight: 700;
}
.event-card__poster .badge--fewleft { position: absolute; top: .85rem; right: 1.6rem; bottom: auto; left: auto; }

/* Disponibilità posti (social proof) — testo + barra di riempimento gialla */
.seats-left__txt { margin: 0 0 .4rem; font-size: .9rem; color: var(--muted); }
.seats-left__txt strong { color: var(--paper); font-weight: 700; }
.seats-left__bar {
    height: 7px;
    border-radius: 999px;
    overflow: hidden;
    background: color-mix(in srgb, var(--paper) 13%, transparent);
}
.seats-left__fill { display: block; height: 100%; border-radius: 999px; background: var(--yellow); }
.seats-left--card { margin: -.4rem 0 1rem; }
.event-card--featured .seats-left__txt { color: color-mix(in srgb, var(--ink) 65%, transparent); }
.event-card--featured .seats-left__txt strong { color: var(--ink); }
.event-card--featured .seats-left__bar { background: color-mix(in srgb, var(--ink) 18%, transparent); }
.event-card--featured .seats-left__fill { background: var(--ink); }
/* Variante pagina evento: riquadro bordato sopra la mappa */
.seats-left--page {
    margin: 1.2rem 0;
    padding: .95rem 1.2rem;
    border: 1px solid var(--line);
    border-radius: 14px;
    background: color-mix(in srgb, var(--paper) 5%, transparent);
}
.seats-left--page .seats-left__txt { font-size: .98rem; }

.event-banner {
    display: flex; flex-wrap: wrap; align-items: baseline; gap: .5rem .9rem;
    margin: 1.2rem 0; padding: 1rem 1.2rem; border-radius: 14px;
    font-size: .95rem; line-height: 1.5;
}
.event-banner strong { font-size: 1.02rem; }
.event-banner--cancelled {
    background: color-mix(in srgb, #c0392b 16%, transparent);
    border: 1px solid color-mix(in srgb, #c0392b 55%, transparent);
    color: var(--paper);
}
.event-banner--info {
    background: color-mix(in srgb, var(--yellow) 14%, transparent);
    border: 1px solid color-mix(in srgb, var(--yellow) 45%, transparent);
    color: var(--paper);
}
.event-banner--soldout {
    background: color-mix(in srgb, var(--ink) 14%, transparent);
    border: 1px solid color-mix(in srgb, var(--paper) 35%, transparent);
    color: var(--paper);
}
.event-banner--few {
    background: color-mix(in srgb, var(--yellow) 18%, transparent);
    border: 1px solid color-mix(in srgb, var(--yellow) 55%, transparent);
    color: var(--paper);
}
.event-banner__hint { flex-basis: 100%; font-size: .85rem; color: color-mix(in srgb, var(--paper) 75%, transparent); }

.cancelled-detail { display: flex; flex-wrap: wrap; gap: 1.5rem; margin-top: 1.5rem; }
.cancelled-detail__poster { width: 180px; max-width: 40vw; border-radius: 12px; align-self: flex-start; filter: grayscale(.4) brightness(.85); }
.cancelled-detail__info { flex: 1; min-width: 240px; }
.cancelled-detail__synopsis { margin-top: .8rem; color: color-mix(in srgb, var(--paper) 80%, transparent); line-height: 1.6; }

/* =========================================================================
   BANDA SPONSOR
   ========================================================================= */
/* Fascia sponsor (carosello in programmazione + patron sugli eventi). Loghi in
   chip bianchi così leggibili su qualsiasi sfondo. */
.sponsors-band { margin-top: clamp(2rem, 5vw, 3.2rem); padding-top: 2rem; border-top: 1px solid var(--line); text-align: center; }
/* Banner patron sulla pagina evento: staccalo dalla scheda film che segue. */
.booking .sponsors-band { margin-top: 1.4rem; margin-bottom: clamp(1.8rem, 4vw, 2.8rem); }
.sponsors-band__title { font-size: .8rem; letter-spacing: .12em; text-transform: uppercase; color: var(--muted); font-weight: 700; margin: 0 0 1.1rem; }
.sponsors { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 1.2rem; }
/* Banner "striscione" che riempie il riquadro (object-fit:cover). Stessa forma per tutti. */
.sponsors__item {
    position: relative; display: block; overflow: hidden;
    width: min(960px, 94vw); aspect-ratio: 2.9 / 1;
    border-radius: 14px; box-shadow: 0 6px 20px rgba(0,0,0,.25);
    background: var(--ink-soft);
}
.sponsors__logo { width: 100%; height: 100%; object-fit: cover; display: block; }
.sponsors__name {
    position: absolute; inset: 0; display: grid; place-items: center;
    font-weight: 700; font-size: clamp(1.1rem, 4vw, 1.6rem); color: var(--yellow);
    background: var(--ink-soft); text-align: center; padding: 0 1rem;
}
/* Variante carosello: un banner alla volta, in dissolvenza */
.sponsors--rotate { position: relative; width: min(960px, 94vw); margin: 0 auto; aspect-ratio: 2.9 / 1; }
.sponsors--rotate .sponsors__item {
    position: absolute; inset: 0; width: 100%; aspect-ratio: auto;
    opacity: 0; transition: opacity .6s ease; pointer-events: none;
}
.sponsors--rotate .sponsors__item.is-active { opacity: 1; pointer-events: auto; }
/* Thumb logo nel backoffice */
.sponsor-thumb { max-height: 40px; max-width: 120px; width: auto; border-radius: 6px; background: #fff; padding: 4px 8px; box-sizing: content-box; }

/* Evento patrocinato: nota "ingresso gratuito" sulla pagina evento */
.sponsored-note {
    display: inline-block; margin: .6rem 0 0; padding: .45rem .95rem; border-radius: 8px;
    background: color-mix(in srgb, var(--yellow) 16%, transparent); color: var(--yellow);
    font-weight: 700; font-size: .92rem;
}
/* Donazione libera al checkout (card scura) */
.donation { margin-top: 1rem; padding: 1rem 1.1rem; border: 1px solid var(--line); border-radius: 12px; background: color-mix(in srgb, var(--yellow) 7%, transparent); }
.donation__copy { margin: 0 0 .8rem; font-size: .9rem; color: var(--paper); line-height: 1.5; }
.donation__chips { display: flex; flex-wrap: wrap; gap: .5rem; align-items: center; }
.donation__chip { border: 1px solid var(--line); background: transparent; color: var(--paper); border-radius: 999px; padding: .45rem 1.05rem; font-weight: 700; cursor: pointer; transition: background .15s, border-color .15s; }
.donation__chip:hover { border-color: var(--yellow); }
.donation__chip.is-active { background: var(--yellow); color: var(--ink); border-color: var(--yellow); }
.donation__custom { display: inline-flex; align-items: center; gap: .3rem; color: var(--paper); border: 1px solid var(--line); border-radius: 999px; padding: .25rem .7rem; }
.donation__custom input { width: 72px; background: transparent; border: 0; color: var(--paper); font-weight: 700; padding: .2rem 0; }
/* Selezione patron nei form evento (backoffice) */
.patron-grid { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: .3rem; }
.patron-chip { display: inline-flex; align-items: center; gap: .45rem; border: 1px solid var(--line); border-radius: 10px; padding: .45rem .75rem; cursor: pointer; font-size: .92rem; }
.patron-chip input { margin: 0; }

/* =========================================================================
   FOOTER
   ========================================================================= */
.site-footer {
    margin-top: clamp(3rem, 7vw, 5rem);
    border-top: 1px solid var(--line);
    padding-block: 2.5rem;
}
.site-footer__inner {
    display: grid;
    grid-template-columns: 1.4fr 1fr 1fr;
    gap: 2rem;
    align-items: start;
}
.site-footer__tag { color: var(--muted); margin: .8rem 0 0; font-size: .92rem; }
.site-footer__nav { display: flex; flex-direction: column; gap: .6rem; }
.site-footer__nav a { color: var(--paper); transition: color .15s ease; }
.site-footer__nav a:hover { color: var(--yellow); }
.site-footer__legal p { margin: 0 0 .35rem; font-size: .9rem; }

/* =========================================================================
   DETTAGLIO EVENTO + SCELTA SDRAIO
   ========================================================================= */
.back-link {
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    color: var(--muted);
    font-weight: 600;
    font-size: .92rem;
    margin-bottom: 1.5rem;
    transition: color .15s ease, transform .15s ease;
}
.back-link:hover { color: var(--yellow); transform: translateX(-2px); }

/* ---- Intestazione prenotazione ---- */
.booking__head {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 1.5rem;
    flex-wrap: wrap;
    margin-bottom: 1.2rem;
}
.booking__film { display: flex; gap: 1.3rem; align-items: flex-start; }
.booking__film .badge--genre { display: inline-block; }
.booking__filminfo { flex: 1; min-width: 0; }
.maps-btn { margin-top: .9rem; }

/* Condivisione social sul dettaglio evento */
.share { display: flex; align-items: center; flex-wrap: wrap; gap: .5rem; margin-top: 1rem; }
.share__label {
    font-size: .8rem; font-weight: 700; text-transform: uppercase; letter-spacing: .08em;
    color: var(--muted); margin-right: .15rem;
}
.share__btn {
    display: inline-flex; align-items: center; gap: .35rem;
    font: inherit; font-size: .85rem; font-weight: 600; line-height: 1; cursor: pointer;
    text-decoration: none; color: var(--paper);
    background: var(--ink-soft); border: 1px solid var(--line);
    padding: .5rem .85rem; border-radius: 100px;
    transition: transform .15s ease, border-color .15s ease, background .15s ease;
}
.share__btn:hover { transform: translateY(-2px); border-color: color-mix(in srgb, var(--yellow) 55%, var(--line)); }
.share__btn--wa:hover { border-color: #25D366; }
.share__btn--fb:hover { border-color: #1877F2; }
.share__btn--native { background: var(--yellow); color: var(--ink); border-color: var(--yellow); }
.share__btn--native:hover { background: var(--yellow-deep); border-color: var(--yellow-deep); }
.share__toast { font-size: .82rem; font-weight: 600; color: var(--yellow); }
.booking__poster {
    flex: none;
    width: 130px;
    aspect-ratio: 2 / 3;
    object-fit: cover;
    border-radius: 12px;
    border: 1px solid var(--line);
}
@media (max-width: 560px) {
    .booking__poster { width: 92px; }
}
.booking__title { font-size: clamp(1.8rem, 4vw, 2.8rem); margin: .6rem 0 .4rem; }
.booking__meta { color: var(--muted); font-weight: 600; font-size: .95rem; margin: 0; }
.booking__status { display: flex; flex-direction: column; align-items: flex-end; gap: .6rem; }
.booking__count { font-weight: 700; color: var(--muted); font-size: .92rem; }
.booking__count .js-count { color: var(--yellow); }

/* ---- Trailer (anteprima + play) sull'header del dettaglio evento ---- */
.trailer { width: 300px; max-width: 100%; aspect-ratio: 16 / 9; border-radius: 12px; overflow: hidden; border: 1px solid var(--line); background: #000; }
.trailer__play { position: relative; display: block; width: 100%; height: 100%; padding: 0; margin: 0; border: 0; cursor: pointer; background: #000; }
.trailer__thumb { width: 100%; height: 100%; object-fit: cover; display: block; opacity: .82; transition: opacity .2s ease; }
.trailer__play:hover .trailer__thumb,
.trailer__play:focus-visible .trailer__thumb { opacity: 1; }
.trailer__icon {
    position: absolute; inset: 0; margin: auto;
    width: 54px; height: 54px; display: grid; place-items: center;
    border-radius: 50%; background: var(--yellow); color: #0D0D0D;
    font-size: 1.15rem; padding-left: .12em; box-shadow: 0 4px 16px rgba(0,0,0,.4);
    transition: transform .2s ease;
}
.trailer__play:hover .trailer__icon { transform: scale(1.08); }
.trailer__label {
    position: absolute; left: .55rem; bottom: .5rem;
    background: rgba(0,0,0,.7); color: #fff; font-size: .72rem; font-weight: 700;
    text-transform: uppercase; letter-spacing: .06em; padding: .2rem .5rem; border-radius: 6px;
}
.trailer__iframe { width: 100%; height: 100%; border: 0; display: block; }
@media (max-width: 720px) { .trailer { width: 100%; } }

/* ---- Dettagli film sotto la mappa ---- */
.booking__about { margin-top: 2rem; }
.event-detail__synopsis {
    color: color-mix(in srgb, var(--paper) 78%, transparent);
    margin: 0 0 1.6rem;
    max-width: 60ch;
}
.perks { list-style: none; margin: 0; padding: 0; display: grid; gap: .7rem; }
.perks li { display: flex; align-items: center; gap: .6rem; color: color-mix(in srgb, var(--paper) 86%, transparent); }
.perks__check {
    flex: none;
    display: inline-grid;
    place-items: center;
    width: 22px; height: 22px;
    border-radius: 50%;
    background: color-mix(in srgb, var(--yellow) 18%, transparent);
    color: var(--yellow);
    font-size: .8rem;
    font-weight: 700;
}

/* ---- Legenda ---- */
.seatmap__legend { display: flex; flex-wrap: wrap; gap: 1rem; font-size: .8rem; color: var(--muted); }
.legend { display: inline-flex; align-items: center; gap: .45rem; }
.legend__chip { width: 16px; height: 12px; border-radius: 4px; display: inline-block; }
.legend__chip--free { background: #FBF6EA; border: 1.4px solid #CBB073; }
.legend__chip--sel  { background: #F5C518; border: 1.4px solid #BE8A07; }
.legend__chip--occ  { background: #B9AE96; border: 1.4px solid #988D75; }

/* =========================================================================
   MAPPA SDRAIO — VISTA SPIAGGIA (toni sabbia caldi, scoped a .beachmap)
   ========================================================================= */
.beachmap {
    border-radius: 18px;
    overflow: hidden;
    border: 1px solid #2a2620;
    overflow-x: auto;            /* scroll orizzontale su schermi stretti */
}
/* Affordance scroll mappa: sfumatura "peek" + freccia cliccabile sul bordo destro.
   Compaiono SOLO quando la mappa è scrollabile (classe .is-scrollable aggiunta dal
   JS se scrollWidth > clientWidth) e svaniscono arrivati in fondo a destra (.is-end).
   Così su desktop / mappe già intere non si vede nulla. */
.beachmap-wrap { position: relative; }
/* Velo sfumato sul bordo destro: segnala il contenuto tagliato. */
.beachmap-wrap::after {
    content: "";
    position: absolute; top: 0; right: 0; bottom: 0;
    width: 56px; border-radius: 0 18px 18px 0;
    background: linear-gradient(to right, rgba(12,11,10,0), rgba(12,11,10,.55));
    opacity: 0; pointer-events: none; transition: opacity .25s ease;
}
.beachmap-wrap.is-scrollable::after { opacity: 1; }
.beachmap-wrap.is-scrollable.is-end::after { opacity: 0; }
/* Freccia cliccabile "scorri a destra". */
.beachmap-nudge {
    position: absolute; top: 50%; right: 8px; transform: translateY(-50%);
    z-index: 3; display: none; align-items: center; gap: .15rem;
    padding: .42rem .6rem .42rem .5rem; border: none; border-radius: 999px; cursor: pointer;
    background: var(--yellow); color: #1a1813;
    box-shadow: 0 4px 14px rgba(0,0,0,.4);
    font-weight: 800; font-size: .78rem; line-height: 1;
    animation: cm-nudge 1.5s ease-in-out infinite;
}
.beachmap-wrap.is-scrollable .beachmap-nudge { display: inline-flex; }
.beachmap-wrap.is-scrollable.is-end .beachmap-nudge { display: none; }
.beachmap-nudge__chev { font-size: 1.25rem; line-height: 1; margin-top: -1px; }
.beachmap-nudge__txt { letter-spacing: .02em; }
@keyframes cm-nudge {
    0%, 100% { transform: translateY(-50%) translateX(0); }
    50%      { transform: translateY(-50%) translateX(4px); }
}
@media (prefers-reduced-motion: reduce) { .beachmap-nudge { animation: none; } }
.beachmap__sky {
    position: relative;
    height: 92px;
    background: linear-gradient(#0C0B0A, #17140F);
}
.beachmap__star {
    position: absolute;
    width: 2px; height: 2px;
    border-radius: 50%;
    background: #F6F2E8;
    opacity: .6;
}
.beachmap__moon {
    position: absolute;
    right: 7%; top: 26%;
    width: 32px; height: 32px;
    border-radius: 50%;
    background: #F6F2E8;
    box-shadow: inset -10px 3px 0 0 #17140F;  /* falce di luna */
}

.beachmap__body { display: flex; min-width: 660px; }
/* Mare a sinistra (per location con sea_side=left): scambia il lato della striscia mare.
   Sdraio/schermo/proiettore restano invariati. */
.beachmap--sea-left .beachmap__body { flex-direction: row-reverse; }

.beachmap__sand {
    position: relative;
    flex: 1 1 auto;
    /* 66px in fondo = ingombro reale del proiettore (icona + scritta + offset 8px)
       più un margine di sicurezza: con i 46px di prima si sovrapponeva all'ultima
       fila su OGNI layout, anche su quelli a griglia singola. */
    padding: 6px 0 66px;
    background: linear-gradient(#F3E8CC, #ECDCB4 55%, #E2CE9E); /* sabbia: giallino tenue */
}
.beachmap__sea {
    position: relative;
    flex: 0 0 11%;
    min-width: 72px;
    background: #16181A;
}
.beachmap__waves { position: absolute; inset: 0; width: 100%; height: 100%; }
.beachmap__sea-label {
    position: absolute; top: 16px; left: 0; right: 0;
    text-align: center;
    font-size: .58rem; letter-spacing: .15em;
    color: #9aa6ad;
}

/* Schermo + fascio di proiezione */
.beachmap__screen { position: relative; width: 72%; margin: 2px auto 12px; text-align: center; }
.beachmap__screen-label { display: block; font-size: .6rem; letter-spacing: .45em; color: #897650; margin-bottom: 6px; }
.beachmap__screen-bar {
    display: block; height: 8px; border-radius: 3px;
    background: #FBF7EC; border: 1px solid #CDB98E;
    box-shadow: 0 0 30px 8px rgba(246, 242, 232, .35);
}
.beachmap__beam {
    position: absolute;
    left: 0; right: 0; top: 34px; bottom: 46px;
    width: 70%; margin: auto;
    background: radial-gradient(ellipse at top, rgba(245, 197, 24, .12), transparent 68%);
    clip-path: polygon(30% 0, 70% 0, 56% 100%, 44% 100%);
    pointer-events: none;
}

/* Righe di sdraio con corridoio centrale */
.beachmap__rows { position: relative; z-index: 1; display: flex; flex-direction: column; gap: .4rem; padding: 4px 16px 0; }
/* Settori della mappa: ogni blocco ha il suo corridoio centrale. I blocchi più
   corti sono ristretti in proporzione (max-width inline, calcolato in seatMap)
   e centrati, così le sdraio hanno la stessa misura in tutti i settori. */
.beachmap__block { display: flex; flex-direction: column; gap: .4rem; }
.beachmap__block--next { margin-top: 1.6rem; }
/* Slot vuoto: tiene il posto nella griglia comune (stessa larghezza di una seduta)
   così i settori corti restano centrati sul corridoio e in colonna con quelli lunghi. */
.beachmap .seat-pad { flex: 1 1 0; min-width: 16px; height: 0;
    /* stesso bordo laterale della seduta (trasparente): con flex-basis:0 il bordo
       entra nella ripartizione dello spazio, senza sfaserebbe le colonne di ~2px */
    border-left: 1.4px solid transparent; border-right: 1.4px solid transparent; }
.seatrow { display: flex; align-items: center; gap: .4rem; }
.seatrow__label { flex: 0 0 16px; text-align: center; font-size: .6rem; font-weight: 700; color: #897650; }
.seatrow__block { display: flex; gap: .4rem; flex: 1 1 0; }
.seatrow__aisle { flex: 0 0 26px; }

/* Sdraio-lettino */
.beachmap .seat {
    flex: 1 1 0;
    min-width: 16px;
    height: 22px;
    padding: 0;
    position: relative;
    border-radius: 6px;
    border: 1.4px solid #CBB073;   /* sdraio LIBERO: crema su sabbia */
    background: #FBF6EA;
    cursor: pointer;
    transition: background .12s ease, border-color .12s ease, transform .08s ease;
}
.beachmap .seat::before {       /* cuscino */
    content: "";
    position: absolute;
    top: 3px; left: 4px; right: 4px; height: 5px;
    border-radius: 3px;
    background: #ECE0C0;
}
.beachmap .seat:hover { transform: translateY(-1px); border-color: #D69E1A; }
/* Sedute diverse dalla sdraio (settori aggiunti per esigenze di serata):
   forma più squadrata/compatta e tinta fredda, senza il cuscino disegnato.
   Stanno PRIMA degli stati, così selezionato/occupato continuano a vincere. */
.beachmap .seat--sedia { height: 18px; border-radius: 4px; border-color: #9FB4C7; background: #EAF1F7; }
.beachmap .seat--sedia::before { display: none; }
.beachmap .seat--panca { height: 14px; border-radius: 3px; border-color: #B9A88C; background: #F2EADC; }
.beachmap .seat--panca::before { display: none; }
/* LETTINO: è un letto, non una sedia → più lungo della sdraio, sabbia più calda,
   cuscino marcato in cima e riga del materasso. Serve che si distingua a colpo
   d'occhio anche a 20px su un telefono: altezza + tinta + segno interno insieme. */
.beachmap .seat--lettino { height: 32px; border-radius: 8px 8px 5px 5px; border-color: #B99358; background: #F7E9C9; }
.beachmap .seat--lettino::before { top: 3px; left: 3px; right: 3px; height: 7px; border-radius: 4px; background: #E3CDA0; }
.beachmap .seat--lettino::after {
    content: "";
    position: absolute;
    left: 5px; right: 5px; bottom: 6px; height: 2px;
    border-radius: 2px;
    background: #E3CDA0;
}

/* Nota sulle file spezzate (disposizione fisica diversa dal codice del posto). */
.beachmap-note { margin: .6rem 0 0; font-size: .8rem; line-height: 1.5; color: var(--muted);
    text-align: center; max-width: 100%; }

/* Legenda tipi di seduta: compare solo se la mappa ne mescola più d'uno. */
.beachmap-legend { max-width: 100%; display: flex; flex-wrap: wrap; gap: .9rem; justify-content: center;
    margin: .7rem 0 0; font-size: .82rem; color: var(--muted); }
.beachmap-legend__item { display: inline-flex; align-items: center; gap: .38rem; }
/* Le pastiglie sono MINIATURE delle sedute vere: stesse proporzioni, stessi
   colori, stesso cuscino. Con forme astratte (e proporzioni invertite) da
   telefono non si collegavano a quello che si vede sulla mappa. */
.legend-chip { position: relative; width: 28px; height: 20px; border-radius: 5px;
    border: 1.4px solid #CBB073; background: #FBF6EA; display: inline-block; flex: 0 0 auto; }
.legend-chip::before { content: ""; position: absolute;   /* cuscino, come .seat::before */
    top: 3px; left: 4px; right: 4px; height: 4px; border-radius: 3px; background: #ECE0C0; }

.legend-chip--sedia { width: 24px; height: 16px; border-radius: 3px; border-color: #9FB4C7; background: #EAF1F7; }
.legend-chip--sedia::before { display: none; }

.legend-chip--panca { width: 24px; height: 12px; border-radius: 3px; border-color: #B9A88C; background: #F2EADC; }
.legend-chip--panca::before { display: none; }

/* il lettino ha colore proprio: senza, ereditava quello della sdraio */
.legend-chip--lettino { width: 28px; height: 28px; border-radius: 6px 6px 4px 4px;
    border-color: #B99358; background: #F7E9C9; }
.legend-chip--lettino::before { top: 3px; left: 3px; right: 3px; height: 6px; background: #E3CDA0; }
.legend-chip--lettino::after { content: ""; position: absolute;   /* riga del materasso */
    left: 4px; right: 4px; bottom: 5px; height: 2px; border-radius: 2px; background: #E3CDA0; }

/* Telefoni stretti (360px e sotto sono comunissimi): legenda compatta, se no la
   terza voce finisce fuori schermo. Proporzioni fra i tipi invariate. */
@media (max-width: 420px) {
    /* Resta centrata (la mappa scorre dentro .beachmap, il contenitore è largo
       quanto lo schermo): qui si riducono solo ingombri e testo, così su un
       telefono stretto le voci ci stanno tutte senza andare a capo. */
    .beachmap-legend { gap: .45rem .8rem; font-size: .75rem; }
    .legend-chip { width: 22px; height: 16px; }
    .legend-chip::before { top: 2px; left: 3px; right: 3px; height: 3px; }
    .legend-chip--lettino { width: 22px; height: 22px; }
    .legend-chip--lettino::before { top: 2px; left: 3px; right: 3px; height: 5px; }
    .legend-chip--lettino::after { bottom: 4px; left: 3px; right: 3px; }
    .legend-chip--sedia { width: 19px; height: 13px; }
    .legend-chip--panca { width: 22px; height: 10px; }
}

.beachmap .seat--selected { background: #F5C518; border-color: #BE8A07; } /* SELEZIONATO: giallo */
.beachmap .seat--selected::before, .beachmap .seat--selected::after { background: #FFE57A; }
.beachmap .seat--occupied { background: #B9AE96; border-color: #988D75; cursor: not-allowed; } /* OCCUPATO: greige spento */
.beachmap .seat--occupied::before, .beachmap .seat--occupied::after { background: #A69B83; }

/* Proiettore */
.beachmap__projector { position: absolute; left: 50%; bottom: 8px; transform: translateX(-50%); text-align: center; }
.beachmap__projector-icon {
    display: block; width: 34px; height: 20px; margin: 0 auto 4px;
    border-radius: 5px; background: #26231D; border: 1px solid #3A352B;
    position: relative;
}
.beachmap__projector-icon::before {
    content: ""; position: absolute; left: 7px; top: 50%; transform: translateY(-50%);
    width: 10px; height: 10px; border-radius: 50%; border: 2px solid #F5C518;
}
.beachmap__projector-label { font-size: .55rem; letter-spacing: .2em; color: #897650; }

/* ---- Toggle F&B ---- */
.fb-toggle {
    display: flex;
    align-items: center;
    gap: .9rem;
    margin: 1.3rem 0;
    padding: .9rem 1rem;
    border: 1px solid var(--line);
    border-radius: 14px;
    cursor: pointer;
    transition: border-color .15s ease;
}
.fb-toggle:hover { border-color: color-mix(in srgb, var(--yellow) 50%, var(--line)); }
.fb-toggle__icon {
    flex: none;
    display: inline-grid;
    place-items: center;
    width: 34px; height: 34px;
    border-radius: 10px;
    background: var(--yellow);
    color: var(--ink);
    font-size: 1.3rem;
    font-weight: 700;
    line-height: 1;
}
.fb-toggle__text { flex: 1; display: flex; flex-direction: column; }
.fb-toggle__text strong { font-size: .98rem; }
.fb-toggle__text small { color: var(--muted); font-size: .82rem; }
.fb-toggle__switch {
    flex: none;
    position: relative;
    width: 46px; height: 26px;
    border-radius: 999px;
    background: color-mix(in srgb, var(--paper) 18%, transparent);
    transition: background .15s ease;
}
.fb-toggle__switch::after {
    content: "";
    position: absolute;
    top: 3px; left: 3px;
    width: 20px; height: 20px;
    border-radius: 50%;
    background: var(--paper);
    transition: transform .15s ease;
}
.js-fb-toggle:checked + .fb-toggle__switch { background: var(--yellow); }
.js-fb-toggle:checked + .fb-toggle__switch::after { transform: translateX(20px); background: var(--ink); }

/* ---- Barra riepilogo ---- */
.summary-bar {
    display: flex;
    align-items: center;
    gap: 1.5rem 2rem;
    flex-wrap: wrap;
    margin-top: 1.3rem;
    padding: 1rem 1.4rem;
    background: var(--ink-soft);
    border: 1px solid var(--line);
    border-radius: 16px;
}
.summary-bar__cell { display: flex; flex-direction: column; gap: .2rem; }
.summary-bar__label { font-size: .66rem; letter-spacing: .12em; text-transform: uppercase; color: var(--muted); }
.summary-bar__value { font-weight: 700; font-size: 1rem; }
.summary-bar__cell--total { margin-left: auto; }
.summary-bar__cell--total .summary-bar__value {
    font-family: "Fraunces", Georgia, serif;
    font-size: 1.5rem;
    color: var(--yellow);
}
.summary-bar__pay { flex: none; }
.summary-bar__pay:disabled { opacity: .45; cursor: not-allowed; transform: none; }

.booking__hint { margin: .8rem 0 0; font-size: .85rem; text-align: center; }
.booking__hint.is-warning { color: var(--yellow); font-weight: 700; }

/* Acquisto a POSTO LIBERO (service): card "biglietto" con testata gialla e bordo
   perforato; dentro, due card Interi/Bambini + barra totale gialla. Niente mappa:
   il cliente sceglie solo quanti ingressi. */
.ga-pick { max-width: 500px; margin: 1.5rem auto; background: var(--ink-soft); border: 1px solid var(--line); border-radius: 16px; overflow: hidden; }
.ga-pick__head { display: flex; align-items: center; gap: .75rem; background: var(--yellow); color: var(--ink); padding: .95rem 1.25rem; }
.ga-pick__head strong { display: block; font-family: "Fraunces", Georgia, serif; font-size: 1.12rem; line-height: 1.2; }
.ga-pick__head small { display: block; font-size: .8rem; opacity: .78; margin-top: .1rem; }
.ga-pick__icon { font-size: 1.5rem; line-height: 1; }
.ga-pick__body { border-top: 2px dashed color-mix(in srgb, var(--paper) 28%, transparent); padding: 1rem; }
.ga-pick__cards { display: flex; gap: .8rem; }
.ga-card { flex: 1; background: var(--ink); border: 1px solid var(--line); border-radius: 14px; padding: 1rem .9rem 1.1rem; text-align: center; }
.ga-card__icon { font-size: 1.45rem; line-height: 1; display: block; }
.ga-card__name { display: block; font-family: "Fraunces", Georgia, serif; font-size: 1rem; color: var(--paper); margin-top: .25rem; }
.ga-card__price { display: block; font-size: .8rem; color: var(--muted); margin: .1rem 0 .7rem; }
.ga-card__step { display: flex; align-items: center; justify-content: center; gap: .7rem; }
.ga-card__btn { width: 42px; height: 42px; border-radius: 11px; border: 1px solid var(--line); background: transparent; color: var(--paper); font-size: 1.3rem; line-height: 1; cursor: pointer; transition: transform .1s ease; flex: none; }
.ga-card__btn--plus { background: var(--yellow); border-color: var(--yellow); color: var(--ink); }
.ga-card__btn:active { transform: scale(.93); }
.ga-card__n { min-width: 2ch; font-family: "Fraunces", Georgia, serif; font-size: 1.6rem; color: var(--paper); }
@media (max-width: 480px) {
    .ga-pick__cards { flex-direction: column; }
}

/* =========================================================================
   CHECKOUT
   ========================================================================= */
.card-dark {
    background: var(--ink-soft);
    border: 1px solid var(--line);
    border-radius: 18px;
    padding: clamp(1.2rem, 3vw, 1.8rem);
}
.checkout__title { font-size: clamp(1.8rem, 4vw, 2.6rem); margin: .4rem 0 1.6rem; }
.checkout__grid {
    display: grid;
    grid-template-columns: 1fr .8fr;
    gap: clamp(1.2rem, 3vw, 2rem);
    align-items: start;
}
.field { display: flex; flex-direction: column; gap: .4rem; margin-bottom: 1rem; min-width: 0; }
.field__label { font-size: .72rem; letter-spacing: .1em; text-transform: uppercase; color: var(--muted); font-weight: 700; }
.field input, .field select, .field textarea { width: 100%; min-width: 0; box-sizing: border-box; }
/* Campo di sola lettura + bottone Copia (link biglietto nel recupero d'emergenza) */
.copy-row { display: flex; gap: .4rem; align-items: center; }
.copy-row input { flex: 1 1 auto; }
.copy-row .btn { flex: 0 0 auto; white-space: nowrap; }
.field input {
    font-family: inherit; font-size: 1rem;
    padding: .8rem 1rem; border-radius: 12px;
    border: 1.5px solid var(--line); background: #0F0F0F; color: var(--paper);
    transition: border-color .15s ease;
}
.field input:focus { outline: none; border-color: var(--yellow); }
.field-row { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }

/* Riquadro "Noleggio coperta": stesso layout di .fb-toggle ma con stepper a quantità. */
.fb-toggle--qty { cursor: default; }
.addon-stepper__ctrl { display: flex; align-items: center; gap: .5rem; flex: none; }
.addon-stepper__btn {
    width: 36px; height: 36px; border-radius: 9px; cursor: pointer;
    border: 1px solid var(--line); background: transparent; color: var(--paper);
    font-size: 1.25rem; line-height: 1; display: grid; place-items: center;
    transition: background .15s, border-color .15s;
}
.addon-stepper__btn:hover { background: color-mix(in srgb, var(--yellow) 14%, transparent); border-color: var(--yellow); }
.addon-stepper__qty {
    width: 44px; text-align: center; font-weight: 700; font-size: 1.05rem;
    color: var(--paper); background: transparent; border: 0; padding: 0;
}
.tickets__blanket { margin: .6rem 0 0; color: var(--muted); font-size: .92rem; }

/* Tipo biglietto per posto (adulto/bambino) sulla pagina selezione posto */
.seat-types { margin: 1.3rem 0; padding: 1rem 1.1rem; border: 1px solid var(--line); border-radius: 14px; }
.seat-types__title { margin: 0 0 .7rem; font-size: .8rem; letter-spacing: .08em; text-transform: uppercase; color: var(--muted); font-weight: 700; }
.seat-type-row { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: .5rem 0; border-top: 1px solid color-mix(in srgb, var(--paper) 8%, transparent); }
.seat-type-row:first-child { border-top: 0; }
.seat-type-row__seat { font-weight: 600; font-size: .95rem; }
.seat-type-row__toggle { display: inline-flex; flex: none; border: 1px solid var(--line); border-radius: 999px; overflow: hidden; }
.seat-type-btn {
    border: 0; background: transparent; color: var(--paper); cursor: pointer;
    padding: .4rem .9rem; font-size: .85rem; font-weight: 600; transition: background .15s, color .15s;
}
.seat-type-btn + .seat-type-btn { border-left: 1px solid var(--line); }
.seat-type-btn.is-active { background: var(--yellow); color: var(--ink); }
.seat-types__note { display: block; margin-top: .7rem; color: var(--muted); font-size: .82rem; }
.order__line--seats { color: var(--muted); }

/* Pacchetti F&B in prenotazione (menu completi della categoria pacchetto) */
.fb-packages { margin: 1.3rem 0; padding: 1.1rem 1.2rem; border: 1px solid var(--line); border-radius: 16px; background: color-mix(in srgb, var(--yellow) 5%, transparent); }
.fb-packages__title { margin: 0 0 1rem; font-weight: 700; }
.fb-packages__list { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 1rem; }
.fb-pkg { display: flex; flex-direction: column; border: 1px solid var(--line); border-radius: 14px; overflow: hidden; background: var(--ink-soft); transition: transform .2s ease, border-color .2s ease, box-shadow .2s ease; }
.fb-pkg:hover { transform: translateY(-4px); border-color: color-mix(in srgb, var(--yellow) 55%, var(--line)); box-shadow: 0 10px 26px rgba(0,0,0,.3); }
.fb-pkg__media { position: relative; display: block; width: 100%; aspect-ratio: 4 / 3; border: 0; padding: 0; cursor: zoom-in; background: color-mix(in srgb, var(--yellow) 12%, var(--ink-soft)); overflow: hidden; }
.fb-pkg__media--empty { display: flex; align-items: center; justify-content: center; font-size: 2.4rem; cursor: default; }
.fb-pkg__img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .4s ease; }
.fb-pkg:hover .fb-pkg__img { transform: scale(1.06); }
.fb-pkg__zoom { position: absolute; right: .5rem; bottom: .5rem; width: 30px; height: 30px; display: flex; align-items: center; justify-content: center; border-radius: 50%; background: rgba(13,13,13,.7); font-size: .85rem; opacity: 0; transition: opacity .2s ease; }
.fb-pkg__media:hover .fb-pkg__zoom, .fb-pkg__media:focus-visible .fb-pkg__zoom { opacity: 1; }
.fb-pkg__body { display: flex; flex-direction: column; gap: .3rem; padding: .8rem .9rem 1rem; }
.fb-pkg__row { display: flex; align-items: baseline; justify-content: space-between; gap: .5rem; }
.fb-pkg__name { font-size: 1rem; }
.fb-pkg__price { font-family: "Fraunces", Georgia, serif; font-weight: 700; color: var(--yellow); white-space: nowrap; }
.fb-pkg__desc { font-size: .85rem; line-height: 1.45; }
/* Su mobile 2 card per riga: foto dimezzate, striscia compatta */
@media (max-width: 720px) {
    .fb-packages { padding: .9rem .8rem; }
    .fb-packages__list { grid-template-columns: repeat(2, 1fr); gap: .7rem; }
    .fb-pkg__body { padding: .55rem .65rem .75rem; }
    .fb-pkg__name { font-size: .9rem; }
    .fb-pkg__desc { font-size: .78rem; }
    .fb-pkg__media--empty { font-size: 1.8rem; }
}

/* Lightbox anteprima pacchetto */
.pkg-lightbox { position: fixed; inset: 0; z-index: 120; display: flex; align-items: center; justify-content: center; padding: 1.2rem; }
.pkg-lightbox[hidden] { display: none; }
.pkg-lightbox__backdrop { position: absolute; inset: 0; background: rgba(0,0,0,.78); }
.pkg-lightbox__box { position: relative; z-index: 1; max-width: 460px; width: 100%; margin: 0; background: var(--ink-soft); border: 1px solid var(--line); border-radius: 18px; overflow: hidden; box-shadow: 0 24px 60px rgba(0,0,0,.5); }
.pkg-lightbox__img { width: 100%; max-height: 60vh; object-fit: cover; display: block; }
.pkg-lightbox__cap { display: flex; flex-direction: column; gap: .35rem; padding: 1rem 1.2rem 1.3rem; }
.pkg-lightbox__name { font-family: "Fraunces", Georgia, serif; font-size: 1.3rem; font-weight: 700; }
.pkg-lightbox__desc { font-size: .92rem; line-height: 1.5; }
.pkg-lightbox__price { font-family: "Fraunces", Georgia, serif; font-weight: 700; color: var(--yellow); font-size: 1.15rem; }
.pkg-lightbox__close { position: absolute; top: .5rem; right: .5rem; z-index: 2; width: 38px; height: 38px; border-radius: 50%; border: 0; background: rgba(13,13,13,.65); color: var(--paper); font-size: 1.5rem; line-height: 1; cursor: pointer; }
.pkg-lightbox__close:hover { background: rgba(13,13,13,.9); }

/* Admin F&B: prodotti per categoria a fisarmonica + righe cliccabili */
.fb-cat { border: 1px solid var(--line); border-radius: 10px; margin-bottom: .6rem; overflow: hidden; background: #fff; }
.fb-cat__sum { cursor: pointer; padding: .7rem .9rem; font-weight: 700; display: flex; align-items: center; gap: .55rem; list-style: none; }
.fb-cat__sum::-webkit-details-marker { display: none; }
.fb-cat__sum::before { content: "\25B8"; color: var(--muted); transition: transform .15s ease; }
.fb-cat[open] .fb-cat__sum::before { transform: rotate(90deg); }
.fb-cat__count { margin-left: auto; color: var(--muted); font-weight: 600; font-size: .85rem; background: color-mix(in srgb, var(--ink) 8%, transparent); border-radius: 999px; padding: .05rem .55rem; }
.fb-cat__items { border-top: 1px solid var(--line); }
.fb-prod-row { display: flex; align-items: center; gap: .7rem; padding: .55rem .9rem; border-top: 1px solid color-mix(in srgb, var(--ink) 7%, transparent); color: inherit; text-decoration: none; cursor: pointer; transition: background .12s ease; }
.fb-prod-row:first-child { border-top: 0; }
.fb-prod-row:hover { background: color-mix(in srgb, var(--yellow) 14%, transparent); }
.fb-prod-row.is-selected { background: color-mix(in srgb, var(--yellow) 24%, transparent); box-shadow: inset 3px 0 0 var(--yellow); }
.fb-prod-row.row-off { opacity: .55; }
.fb-prod-row__name { flex: 1; min-width: 0; }
.fb-prod-row__price { font-weight: 700; white-space: nowrap; }
/* Riga per-posto: controlli (tipo biglietto + pacchetto) — vanno a capo su mobile */
.seat-type-row__controls { display: inline-flex; align-items: center; gap: .6rem; flex-wrap: wrap; justify-content: flex-end; }
.seat-pkg { font: inherit; padding: .4rem .6rem; border: 1px solid var(--line); border-radius: 10px; background: var(--ink-soft); color: var(--paper); max-width: 220px; }
/* Componenti (slot) del pacchetto scelto per un posto: una select per slot, sotto la riga posto */
.seat-pkg-slots { display: flex; flex-wrap: wrap; gap: .6rem; padding: 0 0 .8rem; }
.seat-pkg-slot-label { display: flex; flex-direction: column; gap: .25rem; font-size: .78rem; color: var(--muted); font-weight: 600; }
.seat-pkg-slot-label.is-empty { color: var(--yellow); }
.seat-pkg-slot { font: inherit; padding: .35rem .55rem; border: 1px solid var(--line); border-radius: 8px; background: var(--ink-soft); color: var(--paper); }
.seat-pkg-slot-label.is-empty .seat-pkg-slot { border-color: var(--yellow); }
.ticket__type--pkg { background: color-mix(in srgb, var(--yellow) 16%, transparent); }
.ticket__pkg-choices { margin: .3rem 0 0; padding-left: 1.1rem; font-size: .85rem; color: var(--muted); }
@media (max-width: 560px) {
    .seat-type-row { flex-wrap: wrap; align-items: flex-start; }
    .seat-type-row__controls { width: 100%; justify-content: flex-start; }
    .seat-pkg { max-width: none; flex: 1; }
    .seat-pkg-slots { width: 100%; }
    .seat-pkg-slot-label { flex: 1; min-width: 130px; }
}
.ticket__type {
    display: inline-block; margin-top: .5rem; padding: .2rem .6rem; border-radius: 7px;
    background: color-mix(in srgb, var(--yellow) 16%, transparent);
    color: var(--yellow); font-size: .78rem; font-weight: 700;
}
.pay-note { margin-top: .6rem; font-size: .9rem; color: color-mix(in srgb, var(--paper) 80%, transparent); }
.consent { display: flex; align-items: flex-start; gap: .55rem; margin: .9rem 0 .2rem; font-size: .85rem; line-height: 1.45; cursor: pointer; }
.consent input { margin-top: .2em; width: 1.05em; height: 1.05em; accent-color: var(--yellow); flex: none; cursor: pointer; }
.consent a { color: var(--yellow); text-decoration: underline; }
.pay-mock {
    margin-top: .6rem; font-size: .82rem; color: var(--muted);
    background: color-mix(in srgb, var(--yellow) 8%, transparent);
    border: 1px dashed color-mix(in srgb, var(--yellow) 35%, transparent);
    border-radius: 10px; padding: .6rem .8rem;
}
.pay-redirect {
    margin-top: .6rem; font-size: .82rem; line-height: 1.5; color: var(--muted);
    background: color-mix(in srgb, var(--paper) 5%, transparent);
    border: 1px solid var(--line);
    border-radius: 10px; padding: .6rem .8rem;
}
.checkout__pay { width: 100%; margin-top: 1.2rem; }

.order__title { font-size: 1.3rem; margin: 0 0 1rem; }
.order__event { display: flex; flex-direction: column; gap: .2rem; padding-bottom: 1rem; margin-bottom: .6rem; border-bottom: 1px solid var(--line); }
.order__line { display: flex; justify-content: space-between; gap: 1rem; padding: .4rem 0; color: color-mix(in srgb, var(--paper) 82%, transparent); }
.order__line--total {
    margin-top: .5rem; padding-top: .8rem; border-top: 1px solid var(--line);
    font-family: "Fraunces", Georgia, serif; font-size: 1.4rem; color: var(--paper);
}
.order__line--total span:last-child { color: var(--yellow); }

/* =========================================================================
   BIGLIETTI QR
   ========================================================================= */
.tickets__head { margin-bottom: 1.6rem; }
.tickets__title { font-size: clamp(1.8rem, 4vw, 2.6rem); }
.tickets__grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(330px, 1fr)); gap: 1.3rem; }
.ticket { background: var(--ink-soft); border: 1px solid var(--line); border-radius: 18px; overflow: hidden; }
.ticket__stub { padding: 1.2rem 1.3rem; border-bottom: 2px dashed var(--line); }
.ticket__film { font-size: 1.5rem; margin: .5rem 0 .2rem; }
.ticket__sub { color: var(--muted); margin: 0; font-size: .9rem; }
.ticket__body { display: flex; gap: 1.2rem; padding: 1.2rem 1.3rem; align-items: center; }
.ticket__facts { display: grid; grid-template-columns: 1fr 1fr; gap: .8rem 1rem; margin: 0; flex: 1; }
.ticket__facts dt { font-size: .66rem; letter-spacing: .1em; text-transform: uppercase; color: var(--muted); }
.ticket__facts dd { margin: .15rem 0 0; font-weight: 700; }
.ticket__qrwrap { display: flex; flex-direction: column; align-items: center; gap: .45rem; flex: none; }
.ticket__qr {
    width: 132px; height: 132px;
    background: #FFFFFF; border-radius: 10px; padding: 6px;
    display: grid; place-items: center;
}
.ticket__qr img, .ticket__qr canvas { display: block; width: 100% !important; height: 100% !important; }
.ticket__scan { font-size: .6rem; letter-spacing: .08em; text-transform: uppercase; color: var(--muted); }
.tickets__foot { margin-top: 1.6rem; }

/* =========================================================================
   BACKOFFICE ADMIN (tema chiaro crema + sidebar navy)
   ========================================================================= */
.admin-body {
    margin: 0;
    background: var(--cream);
    color: var(--ink);
    font-family: "Hanken Grotesk", system-ui, sans-serif;
    font-size: 17px;
    line-height: 1.6;
}
.admin-shell { display: flex; min-height: 100vh; align-items: stretch; }

/* Sidebar */
.admin-sidebar {
    flex: 0 0 230px;
    background: var(--ink);
    color: var(--paper);
    padding: 1.6rem 1rem;
    position: sticky; top: 0; align-self: flex-start; height: 100vh;
}
.admin-sidebar .brand { font-size: 1.5rem; }
.admin-sidebar__tag { color: var(--muted); font-size: .75rem; letter-spacing: .15em; text-transform: uppercase; margin: .2rem 0 1.6rem; }
.admin-nav { display: flex; flex-direction: column; gap: .25rem; }
.admin-nav a {
    display: block; padding: .7rem .85rem; border-radius: 10px;
    color: color-mix(in srgb, var(--paper) 82%, transparent);
    font-weight: 600; font-size: 1.05rem; transition: background .15s ease, color .15s ease;
}
.admin-nav a:hover { background: rgba(255,255,255,.06); color: var(--paper); }
.admin-nav a.active { background: color-mix(in srgb, var(--yellow) 18%, transparent); color: var(--yellow); }
.admin-nav__soon { display: block; padding: .65rem .8rem; color: color-mix(in srgb, var(--paper) 35%, transparent); font-size: .95rem; }
.admin-nav__soon em { font-style: normal; font-size: .65rem; text-transform: uppercase; letter-spacing: .08em; opacity: .7; }

/* Main */
.admin-main { flex: 1; min-width: 0; padding: 1.8rem clamp(1rem, 3vw, 2.5rem) 3rem; }
.admin-topbar { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-bottom: 1.6rem; }
.admin-topbar__title { font-size: clamp(1.9rem, 4vw, 2.6rem); }
.admin-topbar__user { display: flex; align-items: center; gap: 1rem; font-size: 1rem; font-weight: 600; }
.btn--dark { color: var(--ink); border-color: var(--ink); background: transparent; }
.btn--dark:hover { background: var(--ink); color: var(--paper); }

.admin-actions { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-bottom: 1rem; }

/* Card chiara + tabella */
.admin-card { background: var(--paper); border: 1px solid #E7E1D3; border-radius: 14px; padding: 1.4rem; box-shadow: 0 1px 2px rgba(0,0,0,.03); }
.admin-card__title { font-size: 1.4rem; margin: 0 0 1.1rem; }
.admin-grid2 { display: grid; grid-template-columns: 1.3fr 1fr; gap: 1.3rem; align-items: start; }
.admin-form { max-width: 580px; }
.admin-form code { background: #f0ebde; padding: .1rem .4rem; border-radius: 5px; font-size: .9em; }

.admin-table { width: 100%; border-collapse: collapse; font-size: 1.02rem; }
.admin-table th { text-align: left; font-size: .76rem; letter-spacing: .08em; text-transform: uppercase; color: #9a937f; padding: .5rem .7rem; border-bottom: 2px solid #ece7da; }
.admin-table td { padding: .9rem .7rem; border-bottom: 1px solid #f0ebde; vertical-align: middle; }
.admin-table tr:last-child td { border-bottom: none; }
.admin-genre { display: inline-block; margin-left: .5rem; font-size: .72rem; color: #9a937f; }
.admin-table__actions { display: flex; gap: .8rem; justify-content: flex-end; white-space: nowrap; }

.link-btn { background: none; border: none; padding: 0; cursor: pointer; font: inherit; font-weight: 700; font-size: .95rem; color: #7a6f50; }
.link-btn:hover { color: var(--ink); text-decoration: underline; }
.link-btn--danger { color: #b4452f; }
.link-btn--danger:hover { color: #8a2f1d; }

.pill { display: inline-block; font-size: .8rem; font-weight: 700; padding: .3rem .7rem; border-radius: 999px; }
.pill--published { background: #e4f3ea; color: #1f7a48; }
.pill--draft { background: #f3ede0; color: #8a7c54; }

/* Campi su tema chiaro */
.admin-body .field input,
.admin-body .field select,
.admin-body .field textarea,
.admin-login .field input {
    font-family: inherit; font-size: 1.05rem;
    padding: .8rem 1rem; border-radius: 10px;
    border: 1.5px solid #ddd6c8; background: #fff; color: var(--ink);
    transition: border-color .15s ease;
}
.admin-body .field__label { font-size: .8rem; }
.admin-body .field textarea { resize: vertical; }
.admin-body .field input:focus,
.admin-body .field select:focus,
.admin-body .field textarea:focus,
.admin-login .field input:focus { outline: none; border-color: var(--ink); }
.field--check { flex-direction: row; align-items: center; gap: .6rem; }
.field--check input { width: 18px; height: 18px; accent-color: var(--ink); }
.radio { display: inline-flex; align-items: center; gap: .45rem; margin-right: 1.3rem; font-weight: 600; }

.back-link--dark { color: #8a7f63; }
.back-link--dark:hover { color: var(--ink); }
.flash--light { color: var(--ink); }
.flash--light.flash--error { background: #fbe7e3; border-color: #d98a7a; color: #7a2a1a; }
.flash--light.flash--success { background: #e4f3ea; border-color: #5bbd82; color: #1f7a48; }

/* Wizard */
.wizard { display: flex; flex-direction: column; gap: 0; }
.wizard__step { display: flex; gap: 1.1rem; padding: 1.3rem 0; border-bottom: 1px solid #f0ebde; }
.wizard__step:last-of-type { border-bottom: none; }
.wizard__num { flex: none; display: grid; place-items: center; width: 34px; height: 34px; border-radius: 50%; background: var(--ink); color: var(--yellow); font-weight: 700; font-size: 1rem; }
.wizard__body { flex: 1; min-width: 0; }
.wizard__body h2 { font-size: 1.3rem; margin: .2rem 0 .8rem; }
.wizard__body .field, .wizard__body select { max-width: 520px; }
.wizard__body > select { width: 100%; max-width: 520px; font-family: inherit; font-size: 1rem; padding: .7rem .9rem; border-radius: 10px; border: 1.5px solid #ddd6c8; background: #fff; color: var(--ink); }
.wizard__publish { margin-bottom: 1rem; }
.film-preview { display: flex; gap: 1rem; margin-top: .9rem; padding: .9rem 1.1rem; background: #faf7ef; border: 1px solid #ece4d2; border-radius: 10px; max-width: 520px; }
.film-preview__poster { flex: none; width: 84px; aspect-ratio: 2 / 3; object-fit: cover; border-radius: 8px; border: 1px solid #e2d9c3; }
.film-preview__txt { flex: 1; min-width: 0; }
.film-preview__meta { font-weight: 700; margin: 0 0 .3rem; }
.film-preview__syn { margin: 0 0 .5rem; font-size: .9rem; }
.film-preview__note { font-size: .72rem; color: #1f7a48; font-weight: 700; }

/* Thumbnail locandina nel catalogo film */
.poster-thumb { width: 46px; height: 69px; object-fit: cover; border-radius: 6px; display: block; border: 1px solid #e2d9c3; }
.poster-thumb--empty { display: grid; place-items: center; background: #f0ebde; color: #b3a98c; font-weight: 700; }
.admin-table--films td { vertical-align: middle; }
.poster-form .link-btn { cursor: pointer; display: inline-block; }
.poster-form input[type="file"] { position: absolute; width: 1px; height: 1px; opacity: 0; pointer-events: none; }

/* Login */
.admin-login { margin: 0; min-height: 100vh; display: grid; place-items: center; background: var(--cream); color: var(--ink); font-family: "Hanken Grotesk", system-ui, sans-serif; }
.admin-login__card { width: 100%; max-width: 380px; background: #fff; border: 1px solid #E7E1D3; border-radius: 16px; padding: 2rem; box-shadow: 0 8px 30px rgba(0,0,0,.06); }
.admin-login__card .brand { font-size: 1.7rem; }
.admin-login__sub { color: #9a937f; margin: .2rem 0 1.4rem; font-size: .9rem; }

/* Dashboard super admin */
.dash-filter { margin-bottom: 1.3rem; }
.metric-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1.1rem; }
.metric-card { background: var(--paper); border: 1px solid #E7E1D3; border-radius: 14px; padding: 1.3rem 1.4rem; }
.metric-card__lbl { display: block; font-size: .72rem; letter-spacing: .08em; text-transform: uppercase; color: #9a937f; font-weight: 700; }
.metric-card__num { display: block; font-family: "Fraunces", Georgia, serif; font-size: 2.1rem; font-weight: 600; margin: .35rem 0 .25rem; }
.metric-card__sub { font-size: .85rem; color: #9a937f; }
.metric-card__sub--ok { color: #1f7a48; font-weight: 700; }
.metric-card__sub--warn { color: #b4452f; font-weight: 700; }

/* Assegnazioni PR (backoffice) */
.assign-checks { display: flex; flex-wrap: wrap; gap: .6rem; margin-bottom: 1rem; }
.assign-check { display: inline-flex; align-items: center; gap: .45rem; background: #faf7ef; border: 1px solid #ece4d2; border-radius: 999px; padding: .4rem .85rem; font-size: .85rem; cursor: pointer; }
.assign-check em { font-style: normal; color: #9a937f; margin-left: .2rem; }

/* =========================================================================
   APP PR (mobile, tema scuro)
   ========================================================================= */
.pr-body { margin: 0; background: #050505; color: var(--paper); font-family: "Hanken Grotesk", system-ui, sans-serif; }
.pr-app { max-width: 460px; margin: 0 auto; min-height: 100vh; background: var(--ink); display: flex; flex-direction: column; }
.pr-top { display: flex; align-items: center; gap: .8rem; padding: 1rem 1.1rem; border-bottom: 1px solid var(--line); position: sticky; top: 0; background: var(--ink); z-index: 5; }
.pr-top__back { font-size: 1.4rem; color: var(--paper); width: 28px; }
.brand--sm { font-size: 1.15rem; }
.pr-top__title { flex: 1; font-weight: 700; }
.pr-top__user { flex: none; width: 36px; height: 36px; border-radius: 50%; background: var(--yellow); color: var(--ink); display: grid; place-items: center; font-weight: 800; }
.pr-main { padding: 1.1rem; flex: 1; }
.pr-flash { margin: 1rem 1.1rem 0; padding: .8rem 1rem; border-radius: 10px; font-weight: 600; font-size: .9rem; }
.pr-flash--success { background: color-mix(in srgb, var(--yellow) 20%, var(--ink)); border: 1px solid var(--yellow); }
.pr-flash--error { background: #2a1414; border: 1px solid #b54a4a; color: #ffd7d7; }

.pr-stats { display: grid; grid-template-columns: 1fr 1fr; gap: .8rem; margin-bottom: 1.5rem; }
.pr-stat { background: var(--ink-soft); border: 1px solid var(--line); border-radius: 14px; padding: 1rem; }
.pr-stat__num { display: block; font-family: "Fraunces", serif; font-size: 1.55rem; font-weight: 600; }
.pr-stat__lbl { font-size: .74rem; color: var(--muted); }
.pr-stat--accent .pr-stat__num { color: var(--yellow); }

.pr-h2 { font-size: 1.1rem; margin: 0 0 .9rem; }
.pr-empty { color: var(--muted); }
.pr-scan-cta { display: flex; align-items: center; gap: .9rem; background: var(--yellow); color: var(--ink); border-radius: 16px; padding: 1rem 1.1rem; margin-bottom: 1.4rem; text-decoration: none; }
.pr-scan-cta:active { transform: translateY(1px); }
.pr-scan-cta__icon { font-size: 1.7rem; flex: none; }
.pr-scan-cta__txt { display: flex; flex-direction: column; line-height: 1.25; min-width: 0; }
.pr-scan-cta__txt strong { font-size: 1.05rem; }
.pr-scan-cta__txt small { font-size: .82rem; opacity: .8; }
.pr-scan-cta__go { margin-left: auto; font-size: 1.6rem; font-weight: 700; flex: none; }
.pr-event { display: flex; align-items: center; justify-content: space-between; gap: 1rem; background: var(--ink-soft); border: 1px solid var(--line); border-radius: 14px; padding: 1rem; margin-bottom: .8rem; color: var(--paper); }
.pr-event:hover { border-color: color-mix(in srgb, var(--yellow) 50%, var(--line)); }
.pr-event__info { display: flex; flex-direction: column; gap: .2rem; min-width: 0; }
.pr-event__meta { font-size: .8rem; color: var(--muted); }
.pr-event__free { font-size: .8rem; color: var(--yellow); font-weight: 700; }
.pr-event__cta { flex: none; background: var(--yellow); color: var(--ink); font-weight: 700; padding: .5rem 1.1rem; border-radius: 999px; }

.pr-sell__meta { color: var(--muted); font-size: .85rem; margin: 0 0 1.2rem; }
.pr-qty { text-align: center; margin-bottom: 1.2rem; }
.pr-qty__label { display: block; font-size: .8rem; letter-spacing: .1em; text-transform: uppercase; color: var(--muted); margin-bottom: .9rem; }
.pr-qty__stepper { display: flex; align-items: center; justify-content: center; gap: 1.5rem; }
.pr-qty__btn { width: 52px; height: 52px; border-radius: 50%; border: 1.5px solid var(--line); background: var(--ink-soft); color: var(--paper); font-size: 1.6rem; cursor: pointer; }
.pr-qty__btn:hover { border-color: var(--yellow); }
.pr-qty__n { font-family: "Fraunces", serif; font-size: 2.4rem; min-width: 48px; }
.pr-qty__best { margin: .9rem 0 0; font-size: .85rem; color: var(--muted); font-weight: 600; }

.pr-link { display: block; width: 100%; background: none; border: 1px solid var(--line); color: var(--paper); border-radius: 12px; padding: .8rem; font-weight: 600; cursor: pointer; margin-bottom: 1.2rem; }
.pr-link:hover { border-color: var(--yellow); }

.pr-map { display: flex; flex-direction: column; gap: .3rem; margin-bottom: 1.2rem; }
.pr-map__row { display: flex; align-items: center; gap: .25rem; }
.pr-map__lbl { flex: 0 0 14px; font-size: .6rem; color: var(--muted); text-align: center; }
.pr-seat { flex: 1 1 0; min-width: 14px; aspect-ratio: 1; border-radius: 4px; border: 1.4px solid color-mix(in srgb, var(--paper) 22%, transparent); background: transparent; cursor: pointer; padding: 0; }
.pr-seat--sel { background: var(--yellow); border-color: var(--yellow); }
.pr-seat--occ { background: color-mix(in srgb, var(--paper) 9%, transparent); border-color: transparent; cursor: not-allowed; }

.pr-confirm { width: 100%; }
.pr-confirm:disabled { opacity: .4; cursor: not-allowed; }

.pr-cash { text-align: center; padding: 1.5rem 0 1rem; }
.pr-cash__seats { font-weight: 700; font-size: 1.1rem; margin: 0; }
.pr-cash__sub { color: var(--muted); font-size: .85rem; margin: .3rem 0 1rem; }
.pr-cash__total { font-family: "Fraunces", serif; font-size: 3rem; color: var(--yellow); margin: 0; }
.pr-childbox { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-bottom: 1rem; padding: .8rem 1rem; border: 1px solid var(--line); border-radius: 12px; }
.pr-childbox__lbl { font-weight: 600; font-size: .95rem; }
.pr-childbox__lbl small { color: var(--muted); font-weight: 400; }
.pr-paybtn { width: 100%; border: none; border-radius: 14px; padding: 1.1rem; font-size: 1.05rem; font-weight: 700; cursor: pointer; margin-bottom: .8rem; }
.pr-paybtn--cash { background: var(--ink-soft); color: var(--paper); border: 1.5px solid var(--line); }
.pr-paybtn--tap { background: var(--yellow); color: var(--ink); }

/* =========================================================================
   FOOD & BEVERAGE — prodotti (admin), regia (dark), menù cliente
   ========================================================================= */
.prod-thumb { width: 44px; height: 44px; object-fit: cover; border-radius: 8px; display: block; border: 1px solid #e2d9c3; }
.prod-thumb--empty { display: grid; place-items: center; background: #f0ebde; color: #b3a98c; font-weight: 700; }
.row-off { opacity: .5; }
.cat-move { white-space: nowrap; }
.cat-move .link-btn { font-size: 1.1rem; padding: 0 .25rem; color: var(--ink); }

/* Regia (console scura, tutta larghezza) */
.fb-body { margin: 0; background: #060606; color: var(--paper); font-family: "Hanken Grotesk", system-ui, sans-serif; min-height: 100vh; }
.fb-top { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: 1rem clamp(1rem, 3vw, 2rem); border-bottom: 1px solid var(--line); background: var(--ink); position: sticky; top: 0; z-index: 5; }
.fb-top__left, .fb-top__right { display: flex; align-items: center; gap: 1rem; }
.fb-top__title { font-weight: 700; }
.fb-main { padding: clamp(1rem, 3vw, 2rem); }
.fb-board { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1rem; align-items: start; }
.fb-col { background: var(--ink-soft); border: 1px solid var(--line); border-radius: 14px; padding: 1rem; }
.fb-col__title { font-size: 1rem; margin: 0 0 .8rem; display: flex; align-items: center; gap: .5rem; }
.fb-col__count { background: var(--yellow); color: var(--ink); font-size: .75rem; font-weight: 700; border-radius: 999px; padding: .1rem .55rem; }
.fb-col--delivered { opacity: .7; }
.fb-col__empty { color: var(--muted); text-align: center; padding: 1rem 0; }
.fbo { background: #0f0f0f; border: 1px solid var(--line); border-radius: 12px; padding: .9rem; margin-bottom: .7rem; }
.fbo__head { display: flex; justify-content: space-between; align-items: baseline; }
.fbo__seat { font-weight: 700; font-size: 1.05rem; }
.fbo__time { color: var(--muted); font-size: .8rem; }
.fbo__event { color: var(--muted); font-size: .78rem; margin: .1rem 0 .6rem; }
.fbo__event em { color: var(--yellow); font-style: normal; }
.fbo__items { list-style: none; margin: 0 0 .7rem; padding: 0; display: grid; gap: .25rem; font-size: .92rem; }
.fbo__qty { color: var(--yellow); font-weight: 700; }
/* Spunta consegna per singola riga (regia). */
.fbo__item { display: flex; align-items: center; gap: .5rem; }
.fbo__tickform { margin: 0; display: inline-flex; flex: 0 0 auto; }
.fbo__tick {
    width: 22px; height: 22px; flex: 0 0 auto; padding: 0;
    border: 1.6px solid var(--line); border-radius: 6px; cursor: pointer;
    background: transparent; color: #1a1813; font-weight: 800; font-size: .85rem; line-height: 1;
    display: inline-flex; align-items: center; justify-content: center; transition: background .15s, border-color .15s;
}
.fbo__tick:hover { border-color: var(--yellow); }
.fbo__item.is-done .fbo__tick { background: #16803d; border-color: #16803d; color: #fff; }
.fbo__item.is-done { color: var(--muted); text-decoration: line-through; text-decoration-color: rgba(255,255,255,.25); }
.fbo__item.is-done .fbo__qty { color: var(--muted); }
.fbo__actions { display: flex; gap: .6rem; align-items: center; }
.fbo__cancel { background: none; border: none; color: #d9745f; font-weight: 700; cursor: pointer; font-size: .85rem; }
/* F&B modello A: totale + pagamento alla consegna */
.fbo__total { display: flex; justify-content: space-between; align-items: baseline; border-top: 1px dashed var(--line); margin: .2rem 0 .6rem; padding-top: .5rem; font-size: .9rem; color: var(--muted); }
.fbo__total strong { color: var(--paper); font-size: 1.05rem; }
.fbo__payq { font-size: .8rem; color: var(--muted); margin: 0 0 .4rem; }
.fbo__actions--pay { flex-wrap: wrap; }
.fbo__paid { margin: 0; font-weight: 700; color: #2fbf71; font-size: .9rem; }
.fb-rev { display: flex; flex-wrap: wrap; align-items: baseline; gap: .4rem 1rem; background: var(--ink-soft); border: 1px solid var(--line); border-radius: 12px; padding: .7rem 1rem; margin-bottom: 1.1rem; }
.fb-rev__main { font-size: 1rem; }
.fb-rev__main strong { color: var(--yellow); font-size: 1.15rem; }
.fb-rev__split { color: var(--muted); font-size: .85rem; }
.fb-order__paynote { color: var(--muted); font-size: .9rem; margin: .4rem 0 .8rem; }
.fb-pay { font-size: .72rem; font-weight: 700; letter-spacing: .03em; text-transform: uppercase; padding: .12rem .5rem; border-radius: 999px; }
.fb-pay--ok  { color: #2fbf71; background: color-mix(in srgb, #2fbf71 18%, transparent); }
.fb-pay--due { color: var(--yellow-deep); background: color-mix(in srgb, var(--yellow) 18%, transparent); }
.fb-refresh { text-align: center; color: var(--muted); font-size: .78rem; margin-top: 1.2rem; }
.fb-eventbar { margin-bottom: 1.1rem; }

/* Campi su contesti scuri (regia/PR) */
.fb-body .field select, .pr-body .field select {
    font-family: inherit; font-size: 1rem; padding: .8rem 1rem; border-radius: 12px;
    border: 1.5px solid var(--line); background: #0F0F0F; color: var(--paper);
}
.fb-neworder { max-width: 560px; }
.fb-neworder__head { display: grid; grid-template-columns: 1fr 150px; gap: 1rem; margin-bottom: .5rem; }
.fb-line { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: .6rem 0; border-bottom: 1px solid var(--line); }
.fb-line__info { display: flex; flex-direction: column; }
.fb-line__qty { width: 70px; padding: .5rem; border-radius: 8px; border: 1.5px solid var(--line); background: #0f0f0f; color: var(--paper); text-align: center; font-size: 1rem; }

/* Menù cliente al posto (tema sito scuro) */
.container--narrow { max-width: 640px; }
.fb-order__title { font-size: clamp(1.6rem, 4vw, 2.2rem); margin: .5rem 0 .2rem; }
.fb-order__sub { color: var(--muted); margin: 0 0 1.5rem; }
.fb-menu__cat { font-size: .85rem; color: var(--yellow); text-transform: uppercase; letter-spacing: .1em; margin: 1.4rem 0 .6rem; }
.fb-item { display: flex; align-items: center; gap: 1rem; padding: .7rem 0; border-bottom: 1px solid var(--line); }
.fb-item__img { width: 56px; height: 56px; border-radius: 10px; object-fit: cover; flex: none; }
.fb-item__img--empty { display: grid; place-items: center; background: var(--ink-soft); font-size: 1.4rem; }
.fb-item__info { flex: 1; display: flex; flex-direction: column; gap: .1rem; min-width: 0; }
.fb-item__desc { font-size: .82rem; }
.fb-item__price { color: var(--yellow); font-weight: 700; }
.fb-step { display: flex; align-items: center; gap: .4rem; flex: none; }
.fb-step__btn { width: 34px; height: 34px; border-radius: 50%; border: 1.5px solid var(--line); background: var(--ink-soft); color: var(--paper); font-size: 1.1rem; cursor: pointer; }
.fb-step__btn:hover { border-color: var(--yellow); }
.fb-step__n { width: 38px; text-align: center; background: none; border: none; color: var(--paper); font-size: 1.1rem; font-weight: 700; }
.fb-order__bar { position: sticky; bottom: 0; display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: 1rem 0; background: var(--ink); margin-top: 1rem; border-top: 1px solid var(--line); }
.fb-order__total { font-family: "Fraunces", serif; font-size: 1.6rem; color: var(--yellow); }
.ticket__fb { display: block; text-align: center; padding: .8rem; border-top: 1px dashed var(--line); color: var(--yellow); font-weight: 700; font-size: .92rem; }
.ticket__fb:hover { background: color-mix(in srgb, var(--yellow) 8%, transparent); }

/* =========================================================================
   RESPONSIVE
   ========================================================================= */
@media (max-width: 980px) {
    .event-grid { grid-template-columns: repeat(2, 1fr); }
    .site-footer__inner { grid-template-columns: 1fr 1fr; }
    .admin-grid2 { grid-template-columns: 1fr; }
    .metric-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 760px) {
    .fb-board { grid-template-columns: 1fr; }
}
@media (max-width: 520px) {
    .metric-grid { grid-template-columns: 1fr; }
}
@media (max-width: 760px) {
    .checkout__grid { grid-template-columns: 1fr; }
    .admin-sidebar { display: none; }
    .admin-table { font-size: .82rem; }
}
@media (max-width: 640px) {
    .summary-bar__cell--total { margin-left: 0; }
    .summary-bar__pay { width: 100%; }
}
@media (max-width: 720px) {
    .site-nav { gap: 1rem; font-size: .9rem; }
    .site-nav a:not(.btn) { display: none; } /* su mobile lasciamo solo Accedi */
}
@media (max-width: 560px) {
    .event-grid { grid-template-columns: 1fr; }
    .site-footer__inner { grid-template-columns: 1fr; }
    .field-row, .fb-neworder__head { grid-template-columns: 1fr; }
}

/* ---------------------------------------------------------------------------
   Accesso (porta unica) + Area cliente + Check-in  (tema scuro pubblico)
   --------------------------------------------------------------------------- */
.field__hint { font-size: .8rem; color: var(--muted); line-height: 1.4; }
.btn--block { display: block; width: 100%; text-align: center; }

/* --- Accedi --- */
.auth-card {
    margin-top: 1.25rem;
    background: var(--ink-soft);
    border: 1px solid var(--line);
    border-radius: 18px;
    padding: clamp(1.4rem, 4vw, 2rem);
}
.auth__title { font-family: 'Fraunces', serif; font-size: clamp(1.6rem, 4vw, 2.2rem); margin-bottom: .5rem; }
.auth__lead { color: var(--muted); line-height: 1.55; margin-bottom: 1.4rem; }
.auth-form .field { margin-bottom: 1.2rem; }
.auth-form .btn--block { margin-top: .4rem; }

/* --- Area cliente --- */
.area__head {
    display: flex; align-items: flex-start; justify-content: space-between;
    gap: 1rem; margin-bottom: 1.4rem; flex-wrap: wrap;
}
.area__title { font-family: 'Fraunces', serif; font-size: clamp(1.6rem, 4vw, 2.2rem); }
.area-booking {
    background: var(--ink-soft);
    border: 1px solid var(--line);
    border-radius: 18px;
    padding: clamp(1.1rem, 3vw, 1.5rem);
    margin-bottom: 1.1rem;
}
.area-booking__head {
    display: flex; align-items: flex-start; justify-content: space-between;
    gap: 1rem; flex-wrap: wrap; margin-bottom: .9rem;
}
.area-booking__film { font-family: 'Fraunces', serif; font-size: 1.25rem; line-height: 1.2; }
.area-booking__code { font-size: .85rem; color: var(--muted); white-space: nowrap; }
.area-booking__code strong { color: var(--yellow); letter-spacing: .03em; }
.area-booking__seats { display: flex; flex-wrap: wrap; gap: .45rem; margin-bottom: 1rem; }
.seat-chip {
    font-size: .8rem; font-weight: 600;
    padding: .25rem .6rem; border-radius: 999px;
    background: color-mix(in srgb, var(--yellow) 16%, var(--ink));
    border: 1px solid color-mix(in srgb, var(--yellow) 40%, transparent);
    color: var(--paper);
}
.area-booking__actions { display: flex; flex-wrap: wrap; gap: .6rem; }

.area-fb { margin-top: 1rem; border-top: 1px solid var(--line); padding-top: .8rem; }
.area-fb__summary { cursor: pointer; font-weight: 600; font-size: .92rem; color: var(--paper); }
.area-fb__summary::-webkit-details-marker { color: var(--yellow); }
.area-fb__list { list-style: none; margin: .8rem 0 0; padding: 0; display: flex; flex-direction: column; gap: .7rem; }
.area-fb__order { background: var(--ink); border: 1px solid var(--line); border-radius: 12px; padding: .7rem .85rem; }
.area-fb__meta { display: flex; align-items: center; gap: .6rem; flex-wrap: wrap; }
.area-fb__tot { margin-left: auto; font-weight: 700; color: var(--yellow); }
.area-fb__items { display: block; margin-top: .35rem; font-size: .85rem; }
.area__foot { margin-top: 1.2rem; }

.fb-status {
    font-size: .72rem; font-weight: 700; text-transform: uppercase; letter-spacing: .05em;
    padding: .18rem .5rem; border-radius: 999px;
    border: 1px solid var(--line); color: var(--paper);
}
.fb-status--received  { background: color-mix(in srgb, var(--yellow) 22%, var(--ink)); border-color: var(--yellow); }
.fb-status--preparing { background: color-mix(in srgb, #4aa3ff 22%, var(--ink)); border-color: #4aa3ff; }
.fb-status--delivered { background: color-mix(in srgb, #2fbf71 22%, var(--ink)); border-color: #2fbf71; }
.fb-status--cancelled { background: var(--ink); color: var(--muted); }

/* --- Check-in (staff) --- */
.checkin-card {
    margin-top: 1.5rem; text-align: center;
    border-radius: 20px; padding: clamp(1.8rem, 6vw, 2.8rem);
    background: var(--ink-soft); border: 1px solid var(--line);
}
.checkin-card__icon {
    width: 78px; height: 78px; margin: 0 auto 1rem;
    display: flex; align-items: center; justify-content: center;
    font-size: 2.4rem; font-weight: 700; border-radius: 50%;
    background: rgba(255,255,255,.08);
}
.checkin-card__title { font-family: 'Fraunces', serif; font-size: clamp(1.5rem, 5vw, 2rem); }
.checkin-card__seat { font-size: 1.5rem; font-weight: 700; margin-top: .5rem; }
.checkin-card__meta { color: var(--muted); margin-top: .5rem; }
.checkin-card--ok   { border-color: #2fbf71; background: color-mix(in srgb, #2fbf71 14%, var(--ink-soft)); }
.checkin-card--ok   .checkin-card__icon { background: #2fbf71; color: var(--ink); }
.checkin-card--used { border-color: var(--yellow); background: color-mix(in srgb, var(--yellow) 14%, var(--ink-soft)); }
.checkin-card--used .checkin-card__icon { background: var(--yellow); color: var(--ink); }
.checkin-card--bad  { border-color: #e5484d; background: color-mix(in srgb, #e5484d 14%, var(--ink-soft)); }
.checkin-card--bad  .checkin-card__icon { background: #e5484d; color: var(--paper); }
.checkin__hint { text-align: center; color: var(--muted); margin-top: 1.2rem; font-size: .9rem; }

/* =========================================================================
   NOLEGGIO PROIETTORE — catalogo + calendario (pubblico scuro) + richieste (admin)
   ========================================================================= */
.rental-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 1.2rem; margin-top: 1.6rem; }
.rental-card { display: flex; flex-direction: column; border: 1px solid var(--line); border-radius: 16px; overflow: hidden; background: var(--ink-soft); }
.rental-card__media { aspect-ratio: 4 / 3; background: color-mix(in srgb, var(--yellow) 10%, var(--ink-soft)); }
.rental-card__media img { width: 100%; height: 100%; object-fit: cover; display: block; }
.rental-card__media--empty { display: flex; align-items: center; justify-content: center; font-size: 2.6rem; }
.rental-card__body { display: flex; flex-direction: column; gap: .4rem; padding: 1rem 1.1rem 1.1rem; flex: 1; }
.rental-card__name { font-size: 1.1rem; }
.rental-card__desc { font-size: .88rem; color: var(--muted); line-height: 1.45; flex: 1; }
.rental-card__foot { display: flex; align-items: center; justify-content: space-between; gap: .6rem; margin-top: .4rem; }
.rental-card__price { font-family: "Fraunces", Georgia, serif; font-weight: 700; color: var(--yellow); }

.rental-req { margin-top: 1.8rem; padding: clamp(1.2rem, 4vw, 1.8rem); }
.rental-req__title { font-family: "Fraunces", serif; font-size: 1.4rem; margin: 0 0 1.2rem; }
.rental-req__cal { margin-bottom: 1.4rem; }
.rent-cal { display: flex; flex-wrap: wrap; gap: 1.4rem; margin: .6rem 0 .4rem; }
.rent-mon { flex: 1 1 240px; }
.rent-mon__head { font-weight: 700; text-transform: capitalize; margin-bottom: .5rem; }
.rent-mon__grid { display: grid; grid-template-columns: repeat(7, 1fr); gap: 4px; }
.rent-cal__dow { text-align: center; font-size: .7rem; color: var(--muted); padding-bottom: .2rem; }
.rent-day { aspect-ratio: 1; border: 1px solid var(--line); border-radius: 8px; background: transparent; color: var(--paper); font-size: .85rem; cursor: pointer; padding: 0; }
.rent-day--empty { border: 0; cursor: default; }
.rent-day--past { opacity: .25; cursor: not-allowed; }
.rent-day--busy { background: color-mix(in srgb, #e5484d 26%, var(--ink)); border-color: color-mix(in srgb, #e5484d 50%, transparent); color: color-mix(in srgb, var(--paper) 60%, transparent); cursor: not-allowed; text-decoration: line-through; }
.rent-day--free:hover { border-color: var(--yellow); }
.rent-day--sel { background: var(--yellow); border-color: var(--yellow); color: var(--ink); font-weight: 700; }
.rent-cal__legend { display: flex; flex-wrap: wrap; gap: 1rem; font-size: .8rem; color: var(--muted); margin: .4rem 0; }
.rent-dot { display: inline-block; width: .8rem; height: .8rem; border-radius: 3px; vertical-align: -.1em; margin-right: .25rem; }
.rent-dot--free { border: 1px solid var(--line); }
.rent-dot--busy { background: color-mix(in srgb, #e5484d 40%, var(--ink)); }
.rent-dot--sel { background: var(--yellow); }
.rent-cal__chosen { font-size: .92rem; }
.rent-cal__chosen strong { color: var(--yellow); }

/* Calendario disponibilità in admin (tema chiaro) */
.rent-cal--admin .rent-mon { flex: 0 1 300px; }
.rent-cal--admin .rent-day { color: var(--ink); border-color: #d9cfb6; }
.rent-cal--admin .rent-day--free:hover { border-color: var(--ink); background: #faf7f0; }
.rent-cal--admin .rent-day--past { opacity: .3; }
.rent-cal--admin .rent-day--busy { background: color-mix(in srgb, #e5484d 22%, #fff); border-color: #e5484d; color: #b3271a; text-decoration: none; }
.rent-cal--admin .rent-cal__dow { color: #9a8f72; }

/* Admin — richieste (tema chiaro) */
.rent-reqs { display: flex; flex-direction: column; gap: .9rem; }
.rent-req-row { display: flex; flex-wrap: wrap; gap: 1rem; justify-content: space-between; border: 1px solid #e2d9c3; border-radius: 14px; padding: 1rem 1.1rem; }
.rent-req-row--confirmed { border-color: #9ccdb0; background: color-mix(in srgb, #2fbf71 8%, transparent); }
.rent-req-row--rejected { opacity: .6; }
.rent-req-row__main { flex: 1 1 300px; min-width: 0; }
.rent-req-row__head { display: flex; align-items: center; flex-wrap: wrap; gap: .6rem; margin-bottom: .35rem; }
.rent-req-row__date { color: var(--ink); font-size: .9rem; }
.rent-req-row__cust { font-size: .9rem; color: #6b6453; }
.rent-req-row__cust a { color: var(--ink); }
.rent-req-row__notes { font-size: .88rem; margin: .5rem 0 0; padding: .5rem .7rem; background: #faf7f0; border-radius: 8px; }
.rent-req-row__actions { display: flex; flex-direction: column; gap: .6rem; align-items: flex-end; }
.rent-quote { display: flex; align-items: flex-end; gap: .5rem; }
.rent-req-row__status { display: flex; flex-wrap: wrap; gap: .8rem; justify-content: flex-end; }
@media (max-width: 560px) {
    .rent-req-row__actions { align-items: stretch; width: 100%; }
    .rent-req-row__status { justify-content: flex-start; }
}

/* --- Recupero biglietto/QR (dashboard super admin, tema chiaro) --- */
.lookup-form { display: flex; flex-wrap: wrap; gap: 1rem; align-items: flex-end; }
.lookup-form .field { min-width: 180px; }
.lookup-result {
    display: flex; gap: 1.4rem; flex-wrap: wrap; align-items: flex-start;
    margin-top: 1.2rem; padding-top: 1.2rem; border-top: 1px solid rgba(0,0,0,.1);
}
.lookup-result__qr {
    flex: 0 0 auto; width: 150px; height: 150px; padding: 8px;
    background: #fff; border: 1px solid rgba(0,0,0,.12); border-radius: 12px;
}
.lookup-result__info { flex: 1 1 280px; min-width: 0; }
.lookup-result__info p { margin: .25rem 0; }
.lookup-result__seat { font-size: 1.05rem; }
.lookup-result__info input[readonly] { font-family: monospace; font-size: .82rem; cursor: pointer; }

.dash-topbar { display: flex; align-items: flex-end; justify-content: space-between; gap: 1rem; flex-wrap: wrap; margin-bottom: 1.3rem; }
.dash-topbar .dash-filter { margin-bottom: 0; }
.dash-fb-link { display: inline-flex; align-items: center; gap: .5rem; }
.dash-fb-link__badge {
    font-size: .72rem; font-weight: 700; padding: .12rem .5rem; border-radius: 999px;
    background: var(--yellow); color: var(--ink); border: 1px solid var(--ink);
}

/* --- Report serata (admin) --- */
.report-head { margin-bottom: 1.2rem; }
.report-head h2 { font-family: 'Fraunces', serif; font-size: 1.5rem; line-height: 1.15; }
.occ-bar { height: 24px; border-radius: 999px; background: rgba(0,0,0,.08); overflow: hidden; margin: .5rem 0 .8rem; }
.occ-bar__fill { display: block; height: 100%; background: var(--yellow); border-radius: 999px; transition: width .3s; }
.occ-legend { margin: 0 0 .4rem; font-size: 1.05rem; }
.admin-table tr.report-total td { font-weight: 700; border-top: 2px solid rgba(0,0,0,.18); }

/* --- Gestione team: form cambio ruolo inline --- */
.role-form { display: inline-flex; gap: .35rem; align-items: center; margin-right: .5rem; }
.role-form select {
    font: inherit; padding: .25rem .4rem; border: 1.5px solid var(--line); border-radius: 8px;
    background: var(--paper); color: var(--ink);
}
/* Righe cliccabili (clic → modifica nel pannello a destra): team + catalogo film */
.staff-row, .film-row { cursor: pointer; transition: background .12s ease; }
.staff-row:hover, .film-row:hover { background: color-mix(in srgb, var(--yellow) 12%, transparent); }
.staff-row.is-selected, .film-row.is-selected { background: color-mix(in srgb, var(--yellow) 22%, transparent); box-shadow: inset 3px 0 0 var(--yellow); }
.staff-row__link, .film-row__link { color: inherit; text-decoration: none; display: block; }

/* ====================================================================== */
/* Pagine contenuti pubbliche (FAQ / Termini / Chi siamo / Contatti)       */
/* ====================================================================== */
.content-page { padding: clamp(2rem, 6vw, 4rem) 0 clamp(3rem, 8vw, 5rem); max-width: 820px; }
.content-page__eyebrow {
    font-size: .8rem; letter-spacing: .24em; text-transform: uppercase;
    color: var(--yellow); font-weight: 600; margin: 0 0 .5rem;
}
.content-page__title { font-size: clamp(2rem, 5vw, 3rem); margin: 0 0 1.2rem; }
.content-page__lead { color: var(--muted); font-size: 1.1rem; max-width: 60ch; }
.content-page__body { color: color-mix(in srgb, var(--paper) 86%, transparent); font-size: 1.05rem; line-height: 1.75; }
.content-page__more { margin-top: 2rem; color: var(--muted); }
.content-page__more a { color: var(--yellow); font-weight: 600; }

/* FAQ accordion */
.faq-list { display: flex; flex-direction: column; gap: .8rem; }
.faq-item {
    border: 1px solid var(--line); border-radius: 14px;
    background: var(--ink-soft); overflow: hidden;
}
.faq-item__q {
    list-style: none; cursor: pointer; padding: 1.1rem 1.3rem;
    font-family: "Fraunces", Georgia, serif; font-size: 1.12rem; font-weight: 600;
    display: flex; align-items: center; justify-content: space-between; gap: 1rem;
}
.faq-item__q::-webkit-details-marker { display: none; }
.faq-item__q::after { content: "+"; color: var(--yellow); font-size: 1.5rem; line-height: 1; transition: transform .2s; }
.faq-item[open] .faq-item__q::after { transform: rotate(45deg); }
.faq-item__a { padding: 0 1.3rem 1.2rem; color: color-mix(in srgb, var(--paper) 82%, transparent); line-height: 1.7; }

/* Contatti */
.contact-grid {
    display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 1rem; margin-top: 2rem;
}
.contact-card {
    display: flex; flex-direction: column; gap: .25rem;
    padding: 1.3rem; border: 1px solid var(--line); border-radius: 16px;
    background: var(--ink-soft); transition: transform .2s, border-color .2s;
}
a.contact-card:hover { transform: translateY(-3px); border-color: color-mix(in srgb, var(--yellow) 55%, transparent); }
.contact-card--wa:hover { border-color: #25D366; }
.contact-card__ico { font-size: 1.6rem; }
.contact-card__k { font-size: .78rem; letter-spacing: .12em; text-transform: uppercase; color: var(--muted); }
.contact-card__v { font-size: 1.05rem; font-weight: 600; word-break: break-word; }

/* WhatsApp flottante (pagine pubbliche non-home; la home ne ha copia inline) */
.wa-fab {
    position: fixed; right: 20px; bottom: 20px; z-index: 80;
    width: 58px; height: 58px; border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    background: #25D366; color: #fff;
    box-shadow: 0 8px 24px rgba(0,0,0,.28); transition: transform .25s, box-shadow .25s;
}
.wa-fab:hover { transform: scale(1.08); box-shadow: 0 12px 30px rgba(37,211,102,.5); }
.wa-fab svg { width: 32px; height: 32px; display: block; }
@media (max-width: 560px) { .wa-fab { right: 14px; bottom: 14px; width: 52px; height: 52px; } }

/* ===========================================================================
   SHOP — vetrina, carrello, checkout, stato ordine, banco vendite
   =========================================================================== */
.btn--lg { padding: .9rem 1.6rem; font-size: 1.02rem; }
.btn.is-disabled { opacity: .45; pointer-events: none; cursor: default; }

.shop-head { display: flex; align-items: center; justify-content: space-between; gap: 1rem; flex-wrap: wrap; }
.shop-cart-link { white-space: nowrap; }
.shop-cart-badge { display: inline-block; min-width: 1.3em; padding: 0 .35em; margin-left: .3em; border-radius: 999px; background: var(--yellow); color: var(--ink); font-weight: 700; font-size: .8rem; text-align: center; }
.shop-freebar { margin: .8rem 0 0; font-size: .92rem; color: var(--muted); }
.shop-freebar strong { color: var(--yellow); }

/* Chip filtro categorie */
.shop-cats { display: flex; flex-wrap: wrap; gap: .5rem; margin: 1.4rem 0 .2rem; }
.shop-cat-chip { font: inherit; cursor: pointer; padding: .4rem .9rem; border-radius: 999px; border: 1px solid var(--line); background: transparent; color: var(--paper); transition: background .15s, color .15s, border-color .15s; }
.shop-cat-chip:hover { border-color: var(--yellow); }
.shop-cat-chip.is-active { background: var(--yellow); color: var(--ink); border-color: var(--yellow); font-weight: 600; }

/* Personalizzazione: testo nel carrello/righe */
.shop-card__custom { margin: 0; }
.shop-cart__custom { font-size: .82rem; color: var(--yellow); }
.shop-order__custom { color: var(--yellow); }

.shop-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 1.2rem; margin-top: 1.6rem; }
.shop-card { display: flex; flex-direction: column; border: 1px solid var(--line); border-radius: 16px; overflow: hidden; background: var(--ink-soft); }
.shop-card.is-soldout { opacity: .72; }
.shop-card__media { position: relative; aspect-ratio: 1 / 1; background: color-mix(in srgb, var(--yellow) 10%, var(--ink-soft)); }
.shop-card__media img { width: 100%; height: 100%; object-fit: cover; display: block; }
.shop-card__media--empty { display: flex; align-items: center; justify-content: center; font-size: 2.6rem; }
.shop-card__soldout { position: absolute; top: .6rem; left: .6rem; background: var(--ink); color: var(--paper); border: 1px solid var(--line); font-size: .78rem; padding: .15rem .55rem; border-radius: 999px; }
.shop-card__body { display: flex; flex-direction: column; gap: .45rem; padding: 1rem 1.1rem 1.1rem; flex: 1; }
.shop-card__name { font-size: 1.08rem; }
.shop-card__desc { font-size: .86rem; color: var(--muted); line-height: 1.45; }
.shop-card__price { font-family: "Fraunces", Georgia, serif; font-weight: 700; color: var(--yellow); font-size: 1.15rem; }
.shop-card__add { display: flex; flex-direction: column; gap: .5rem; margin-top: auto; }
.shop-card__size { margin: 0; }

/* Carrello */
.shop-cart { margin-top: 1.4rem; display: flex; flex-direction: column; gap: .2rem; }
.shop-cart__row { display: grid; grid-template-columns: 56px 1fr auto auto auto; align-items: center; gap: .8rem; padding: .7rem 0; border-bottom: 1px solid var(--line); }
.shop-cart__media { width: 56px; height: 56px; border-radius: 10px; overflow: hidden; background: color-mix(in srgb, var(--yellow) 10%, var(--ink-soft)); display: flex; align-items: center; justify-content: center; }
.shop-cart__media img { width: 100%; height: 100%; object-fit: cover; }
.shop-cart__info { display: flex; flex-direction: column; gap: .1rem; min-width: 0; }
.shop-cart__variant { font-size: .82rem; color: var(--muted); }
.shop-cart__unit { font-size: .82rem; color: var(--muted); }
.shop-cart__qty { display: flex; align-items: center; gap: .3rem; }
.shop-cart__qty input { width: 56px; padding: .35rem; text-align: center; background: var(--ink-soft); border: 1px solid var(--line); border-radius: 8px; color: var(--paper); }
.shop-cart__line { font-weight: 700; white-space: nowrap; }
@media (max-width: 560px) {
    .shop-cart__row { grid-template-columns: 48px 1fr auto; grid-template-areas: "media info line" "media qty rm"; }
    .shop-cart__media { grid-area: media; } .shop-cart__info { grid-area: info; }
    .shop-cart__line { grid-area: line; text-align: right; } .shop-cart__qty { grid-area: qty; }
    .shop-cart__rm { grid-area: rm; justify-self: end; }
}

.shop-summary { margin: 1.2rem 0; padding: 1rem 1.2rem; background: var(--ink-soft); border: 1px solid var(--line); border-radius: 14px; }
.shop-summary__row { display: flex; justify-content: space-between; padding: .25rem 0; }
.shop-summary__row--total { border-top: 1px solid var(--line); margin-top: .4rem; padding-top: .6rem; font-weight: 700; font-size: 1.1rem; }
.shop-summary__hint { font-size: .82rem; margin: .2rem 0 0; }

.shop-checkout { margin-top: 1rem; padding: clamp(1.2rem, 4vw, 1.8rem); }
.shop-checkout__title { font-size: 1.15rem; margin: 0 0 1rem; }
.shop-checkout__terms { display: flex; gap: .55rem; align-items: flex-start; margin: 1rem 0; font-size: .9rem; color: var(--muted); }
.shop-checkout__terms a { color: var(--yellow); }

/* Stato ordine */
.shop-track { list-style: none; display: flex; gap: .4rem; padding: 0; margin: 1.2rem 0; flex-wrap: wrap; }
.shop-track__step { display: flex; align-items: center; gap: .4rem; padding: .35rem .8rem; border: 1px solid var(--line); border-radius: 999px; color: var(--muted); font-size: .9rem; }
.shop-track__step.is-done { color: var(--ink); background: var(--yellow); border-color: var(--yellow); font-weight: 600; }
.shop-track__dot { width: .55rem; height: .55rem; border-radius: 50%; background: currentColor; }
.shop-status { color: var(--muted); }
.shop-status--cancelled { color: #e0795f; }
.shop-receipt { margin-top: 1rem; padding: 1.2rem 1.4rem; }
.shop-receipt__row { display: flex; justify-content: space-between; gap: 1rem; padding: .3rem 0; }
.shop-receipt__row--total { border-top: 1px solid var(--line); margin-top: .4rem; padding-top: .6rem; font-weight: 700; }

/* Banco vendite (app shop) */
.shop-sell__prod { padding: .8rem 0; border-bottom: 1px solid var(--line); }
.shop-sell__head { display: flex; justify-content: space-between; align-items: baseline; gap: .6rem; }
.shop-sell__out { margin: .3rem 0 0; }
.shop-sell__vars { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: .5rem; }
.shop-sell__var { display: flex; flex-direction: column; gap: .25rem; font-size: .85rem; }
.shop-sell__var.is-out { opacity: .5; }
.shop-sell__var input { width: 70px; padding: .4rem; text-align: center; border-radius: 8px; }
.shop-sell__pay { margin-top: 1.2rem; }
.shop-sell__methods { display: flex; flex-direction: column; gap: .5rem; margin-top: .5rem; }
.shop-sell__methods label { display: flex; align-items: center; gap: .5rem; }
.shop-pay { text-align: center; padding: 1rem 0; }
.shop-pay__amount { font-size: 2rem; font-weight: 700; margin: 0 0 1rem; }
.shop-pay__qr { display: inline-block; padding: 12px; background: #fff; border-radius: 12px; margin: .6rem auto; }
.shop-pay__ok { font-size: 1.6rem; color: var(--yellow); font-weight: 700; margin: 0 0 .4rem; }
.shop-pay__cancel { display: inline-block; margin-top: 1.4rem; }

/* Backoffice ordini */
.shop-filter { display: inline-flex; gap: .3rem; }
.shop-filter a { padding: .25rem .7rem; border-radius: 999px; border: 1px solid var(--line); font-size: .85rem; text-decoration: none; color: inherit; }
.shop-filter a.is-active { background: var(--ink); color: #fff; border-color: var(--ink); }
.shop-orders { display: flex; flex-direction: column; gap: .9rem; }
.shop-order__top { display: flex; justify-content: space-between; align-items: center; gap: 1rem; flex-wrap: wrap; }
.shop-order__total { font-weight: 700; white-space: nowrap; }
.shop-order__items { display: flex; flex-wrap: wrap; gap: .2rem .8rem; margin: .6rem 0; font-size: .9rem; }
.shop-order__ship { font-size: .9rem; line-height: 1.5; margin: .4rem 0; }
.shop-order__actions { display: flex; flex-wrap: wrap; align-items: center; gap: .8rem; margin-top: .6rem; padding-top: .6rem; border-top: 1px solid var(--line); }
.shop-order__actions .shipform { display: flex; gap: .4rem; align-items: center; flex-wrap: wrap; }
.shop-order__actions input[type=text] { padding: .4rem .6rem; border: 1px solid var(--line); border-radius: 8px; }