/* ==========================================================================
   Design: "carta e inchiostro" — fondo carta calda, blu inchiostro, accento terracotta.
   Nessun font o risorsa esterna (CSP): stack di sistema + serif di sistema per i titoli.
   ========================================================================== */
:root {
    --ink: #172f5c;
    --ink-deep: #0f2145;
    --ink-rgb: 23, 47, 92;
    --accent-hover: #bf511f;
    --accent-active: #a8461a;
    --accent-light: #ffd2bb;
    --accent-glow: rgba(217, 98, 43, .38);
    --blue-focus: rgba(35, 75, 143, .18);
    --paper-soft: #faf6ea;
    --blue: #234b8f;
    --blue-soft: #e4ecf8;
    --accent: #d9622b;
    --accent-soft: #fbe9df;
    --paper: #f6f3ec;
    --card-border: #e7e1d3;
    --muted: #667085;
    --serif: "Iowan Old Style", "Palatino Linotype", Palatino, "Book Antiqua", Georgia, serif;

    --bs-primary: #234b8f;
    --bs-primary-rgb: 35, 75, 143;
    --bs-link-color: #234b8f;
    --bs-link-color-rgb: 35, 75, 143;
    --bs-link-hover-color: #172f5c;
    --bs-link-hover-color-rgb: 23, 47, 92;
    --bs-body-bg: var(--paper);
    --bs-body-color: #1d2433;
    --bs-body-font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
    --bs-border-radius: .7rem;
    --bs-border-radius-lg: 1rem;
    --bs-border-color: var(--card-border);
}

body { -webkit-font-smoothing: antialiased; }
h1, h2, h3, .h1, .h2, .h3 { letter-spacing: -.01em; }
.serif, .hero-title, .event-title, .page-title { font-family: var(--serif); font-weight: 700; }
:focus-visible { outline: 3px solid var(--accent); outline-offset: 2px; border-radius: 4px; }

/* ---- Bottoni ------------------------------------------------------------ */
.btn { font-weight: 600; border-radius: .6rem; }
.btn-primary { --bs-btn-bg: var(--blue); --bs-btn-border-color: var(--blue); --bs-btn-hover-bg: var(--ink); --bs-btn-hover-border-color: var(--ink); --bs-btn-active-bg: var(--ink-deep); --bs-btn-active-border-color: var(--ink-deep); --bs-btn-disabled-bg: var(--blue); --bs-btn-disabled-border-color: var(--blue); }
.btn-outline-primary { --bs-btn-color: var(--blue); --bs-btn-border-color: var(--blue); --bs-btn-hover-bg: var(--blue); --bs-btn-hover-border-color: var(--blue); --bs-btn-active-bg: var(--ink); --bs-btn-active-border-color: var(--ink); }
.btn-accent { --bs-btn-color: #fff; --bs-btn-bg: var(--accent); --bs-btn-border-color: var(--accent); --bs-btn-hover-color: #fff; --bs-btn-hover-bg: var(--accent-hover); --bs-btn-hover-border-color: var(--accent-hover); --bs-btn-active-bg: var(--accent-active); --bs-btn-active-border-color: var(--accent-active); }
.form-control, .form-select { border-color: #d6d0c0; padding: .6rem .8rem; }
.form-control:focus, .form-select:focus { border-color: var(--blue); box-shadow: 0 0 0 .25rem var(--blue-focus); }
.form-label { font-weight: 600; font-size: .9rem; }
.text-bg-primary { background-color: var(--blue) !important; }

/* ---- Struttura ---------------------------------------------------------- */
.app-navbar { background: var(--ink); --bs-navbar-color: rgba(255,255,255,.78); --bs-navbar-hover-color: #fff; --bs-navbar-active-color: #fff; --bs-navbar-brand-color: #fff; --bs-navbar-brand-hover-color: #fff; --bs-navbar-toggler-border-color: rgba(255,255,255,.4); padding-block: .6rem; }
.app-navbar .navbar-toggler-icon { filter: invert(1); }
.app-navbar .nav-link.active { box-shadow: inset 0 -2px 0 var(--accent); }
.brand-mark { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border-radius: .55rem; background: var(--accent); color: #fff; margin-right: .6rem; font-size: 1.05rem; }
.brand-logo { width: 2.5rem; height: 2.5rem; object-fit: contain; border-radius: .55rem; background: #fff; padding: 3px; margin-right: .85rem; vertical-align: middle; }
.brand-logo-lg { width: 4rem; height: 4rem; padding: 3px; border: 1px solid var(--card-border); background: var(--ink); }
.navbar-brand { font-family: var(--serif); font-weight: 700; letter-spacing: 0; }
.app-footer { color: var(--muted); border-top: 1px solid var(--card-border); background: #fffdf8; }

.card { border-color: var(--card-border); box-shadow: 0 1px 2px rgba(23, 47, 92, .05); background: #fff; }
.card-header { background: #fffdf8; border-bottom-color: var(--card-border); }
.page-title { font-size: calc(1.35rem + .6vw); }

/* ---- Hero (home) -------------------------------------------------------- */
.hero { position: relative; overflow: hidden; color: #fff; padding: 3rem 0 5.2rem;
    background:
        radial-gradient(circle at 12% 18%, var(--accent-glow) 0, transparent 38%),
        radial-gradient(circle at 92% 8%, rgba(255, 255, 255, .12) 0, transparent 34%),
        linear-gradient(135deg, var(--ink-deep), var(--blue)); }
.hero::after { content: ""; position: absolute; inset: 0; opacity: .07;
    background-image: linear-gradient(rgba(255,255,255,.9) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.9) 1px, transparent 1px);
    background-size: 36px 36px; pointer-events: none; }
.hero .container { position: relative; z-index: 1; }
.hero-kicker { text-transform: uppercase; letter-spacing: .14em; font-size: .78rem; font-weight: 700; color: var(--accent-light); margin-bottom: .6rem; }
.hero-title { font-size: clamp(2rem, 5vw, 3rem); line-height: 1.1; margin-bottom: .8rem; }
.hero-lead { max-width: 38rem; color: rgba(255,255,255,.86); font-size: 1.08rem; margin-bottom: 1.2rem; }
.hero-steps { display: flex; flex-wrap: wrap; gap: .5rem; padding: 0; margin: 0; list-style: none; counter-reset: s; }
.hero-steps li { counter-increment: s; background: rgba(255,255,255,.12); border: 1px solid rgba(255,255,255,.22); padding: .3rem .8rem .3rem .4rem; border-radius: 99px; font-size: .88rem; display: inline-flex; align-items: center; gap: .5rem; }
.hero-steps li::before { content: counter(s); display: inline-flex; align-items: center; justify-content: center; width: 1.4rem; height: 1.4rem; border-radius: 50%; background: var(--accent); font-weight: 700; font-size: .78rem; }
main.with-hero { margin-top: -3rem; position: relative; z-index: 2; }
main.with-hero > .alert { box-shadow: 0 6px 20px rgba(15, 33, 69, .18); }

/* Testata con immagine personalizzata */
.hero-image { background: var(--ink); }
.hero-image .hero-bg { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.hero-image::after { opacity: 1; background-image: linear-gradient(100deg, rgba(var(--ink-rgb), .92) 0%, rgba(var(--ink-rgb), .72) 45%, rgba(var(--ink-rgb), .35) 100%); background-size: auto; }
.hero-image .hero-title, .hero-image .hero-lead { text-shadow: 0 2px 14px rgba(0, 0, 0, .35); }

/* ---- Card evento -------------------------------------------------------- */
.event-card { overflow: hidden; border: 1px solid var(--card-border); transition: transform .15s ease, box-shadow .15s ease; }
.event-card:hover { transform: translateY(-3px); box-shadow: 0 14px 30px rgba(23, 47, 92, .14); }
.event-media { position: relative; }
.event-thumb { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; display: block; }
.event-thumb-empty { display: flex; align-items: center; justify-content: center; background: linear-gradient(135deg, var(--blue-soft), #f3ede0); color: var(--blue); font-size: 3rem; }
.event-media .date-chip { position: absolute; left: .8rem; top: .8rem; }
.event-media .status-pill { position: absolute; right: .8rem; top: .8rem; }
.date-chip { display: inline-flex; flex-direction: column; align-items: center; min-width: 3.4rem; padding: .3rem .5rem .35rem; background: #fff; border-radius: .6rem; box-shadow: 0 2px 8px rgba(15, 33, 69, .22); line-height: 1; border-top: 4px solid var(--accent); }
.date-chip .d { font-family: var(--serif); font-size: 1.55rem; font-weight: 700; color: var(--ink); margin-top: .2rem; }
.date-chip .m { text-transform: uppercase; font-size: .68rem; letter-spacing: .1em; font-weight: 700; color: var(--accent); margin-top: .1rem; }
.status-pill { display: inline-flex; align-items: center; gap: .4rem; padding: .22rem .65rem; border-radius: 99px; font-size: .78rem; font-weight: 600; background: #fff; color: #1d2433; box-shadow: 0 1px 4px rgba(15, 33, 69, .18); white-space: nowrap; }
.status-pill::before { content: ""; width: .5rem; height: .5rem; border-radius: 50%; background: var(--muted); }
.status-pill.s-success::before { background: #2f9e62; }
.status-pill.s-warning::before { background: #e0a100; }
.status-pill.s-danger::before { background: #d64545; }
.status-pill.s-secondary::before { background: #98a2b3; }
.event-card h2 { font-family: var(--serif); font-size: 1.28rem; line-height: 1.25; }
.meta-line { display: flex; gap: .55rem; align-items: baseline; color: #3a4357; font-size: .95rem; margin-bottom: .25rem; }
.meta-line .bi { color: var(--accent); flex: none; }
.series-tag { display: inline-flex; align-items: center; gap: .35rem; font-size: .76rem; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; color: var(--blue); background: var(--blue-soft); padding: .15rem .55rem; border-radius: 99px; }

progress.seats { appearance: none; -webkit-appearance: none; width: 100%; height: .45rem; border: 0; border-radius: 99px; background: #ece6d8; overflow: hidden; display: block; }
progress.seats::-webkit-progress-bar { background: #ece6d8; border-radius: 99px; }
progress.seats::-webkit-progress-value { background: var(--blue); border-radius: 99px; }
progress.seats::-moz-progress-bar { background: var(--blue); border-radius: 99px; }
progress.seats.is-full::-webkit-progress-value { background: #d64545; }
progress.seats.is-full::-moz-progress-bar { background: #d64545; }
.seats-label { font-size: .82rem; color: var(--muted); }

/* ---- Pagina evento ------------------------------------------------------ */
.event-banner { position: relative; border-radius: var(--bs-border-radius-lg); overflow: hidden; color: #fff; min-height: 15rem; display: flex; align-items: flex-end;
    background: linear-gradient(135deg, var(--ink-deep), var(--blue)); box-shadow: 0 8px 24px rgba(15, 33, 69, .18); }
.event-banner-img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.event-banner::before { content: ""; position: absolute; inset: 0; z-index: 1; background: linear-gradient(180deg, rgba(15, 33, 69, .05) 0%, rgba(15, 33, 69, .55) 55%, rgba(15, 33, 69, .92) 100%); }
.event-banner-noimg::before { background: radial-gradient(circle at 15% 20%, var(--accent-glow), transparent 45%); }
.event-banner-body { position: relative; z-index: 2; padding: 4rem 1.5rem 1.4rem; width: 100%; }
.event-title { font-size: clamp(1.7rem, 4.2vw, 2.5rem); line-height: 1.12; margin: .5rem 0 0; text-shadow: 0 2px 12px rgba(0,0,0,.35); }
.info-tiles { display: grid; grid-template-columns: repeat(auto-fit, minmax(13rem, 1fr)); gap: .75rem; margin: 1rem 0 1.5rem; }
.info-tile { display: flex; gap: .75rem; align-items: flex-start; background: #fff; border: 1px solid var(--card-border); border-radius: var(--bs-border-radius); padding: .8rem .9rem; }
.info-tile .bi { font-size: 1.25rem; color: var(--accent); }
.info-tile .k { display: block; font-size: .72rem; text-transform: uppercase; letter-spacing: .08em; color: var(--muted); font-weight: 700; }
.info-tile .v { font-weight: 600; line-height: 1.3; }
.event-description { font-size: 1.06rem; line-height: 1.7; color: #2b3447; }
.booking-card { top: 1rem; border: 0; box-shadow: 0 10px 30px rgba(15, 33, 69, .14); overflow: hidden; }
.booking-card .card-header { background: var(--ink); color: #fff; border: 0; padding: .85rem 1rem; }
.booking-card .status-pill { box-shadow: none; }
.declaration { background: var(--accent-soft); border: 1px solid var(--accent-light); border-radius: var(--bs-border-radius); padding: .8rem; }
.declaration-text { max-height: 9rem; overflow: auto; }
.series-list .list-group-item { border-color: var(--card-border); }

/* ---- Passi (verifica / conferma) --------------------------------------- */
.steps { display: flex; gap: .5rem; list-style: none; padding: 0; margin: 0 0 1.4rem; counter-reset: st; justify-content: center; flex-wrap: wrap; }
.steps li { counter-increment: st; display: inline-flex; align-items: center; gap: .5rem; font-size: .88rem; color: var(--muted); font-weight: 600; }
.steps li::before { content: counter(st); display: inline-flex; align-items: center; justify-content: center; width: 1.7rem; height: 1.7rem; border-radius: 50%; background: #ece6d8; color: var(--muted); font-size: .82rem; }
.steps li + li::after { content: none; }
.steps li.done { color: #2f7a52; } .steps li.done::before { content: "\2713"; background: #2f9e62; color: #fff; }
.steps li.now { color: var(--ink); } .steps li.now::before { background: var(--accent); color: #fff; }
.steps li:not(:last-child)::after { content: ""; width: 1.6rem; height: 2px; background: #d9d2c0; margin-left: .35rem; }
.otp-input { letter-spacing: .6rem; font-variant-numeric: tabular-nums; font-size: 1.9rem; font-weight: 700; color: var(--ink); }
.ticket { position: relative; background: #fff; border: 1px solid var(--card-border); border-radius: var(--bs-border-radius-lg); box-shadow: 0 10px 30px rgba(15, 33, 69, .1); overflow: hidden; }
.ticket-head { padding: 1.2rem 1.5rem; color: #fff; background: linear-gradient(135deg, var(--ink-deep), var(--blue)); }
.ticket-head.waiting { background: linear-gradient(135deg, #7a5200, #c68a00); }
.ticket-body { padding: 1.4rem 1.5rem; border-bottom: 2px dashed #ddd6c4; }
.ticket-foot { padding: 1.1rem 1.5rem; background: #fffdf8; }
.ticket dt { font-size: .72rem; text-transform: uppercase; letter-spacing: .08em; color: var(--muted); font-weight: 700; }
.ticket dd { font-weight: 600; margin-bottom: .6rem; }

/* ---- Area riservata ----------------------------------------------------- */
.stat { border: 0; border-left: 4px solid var(--blue); }
.stat.s-accent { border-left-color: var(--accent); }
.stat.s-green { border-left-color: #2f9e62; }
.stat.s-gray { border-left-color: #98a2b3; }
.stat-value { font-family: var(--serif); font-size: 2rem; font-weight: 700; line-height: 1.1; color: var(--ink); }
.stat-label { color: var(--muted); font-size: .8rem; text-transform: uppercase; letter-spacing: .07em; font-weight: 700; }
.table { --bs-table-bg: transparent; }
.table thead th { font-size: .74rem; text-transform: uppercase; letter-spacing: .07em; color: var(--muted); font-weight: 700; border-bottom-width: 1px; background: #fffdf8; white-space: nowrap; }
.table-hover > tbody > tr:hover > * { --bs-table-hover-bg: var(--paper-soft); }
.row-title { font-weight: 700; color: var(--ink); text-decoration: none; }
.row-title:hover { text-decoration: underline; }
.table progress.seats { min-width: 5rem; margin-top: .3rem; }
.col-seats { min-width: 9rem; }
.admin-header { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: .75rem; margin-bottom: 1.2rem; }
.login-card { max-width: 26rem; margin-inline: auto; }
.login-mark { width: 4rem; height: 4rem; border-radius: 1.1rem; background: var(--accent); color: #fff; display: inline-flex; align-items: center; justify-content: center; font-size: 1.9rem; box-shadow: 0 8px 20px var(--accent-glow); }
.policy-text { line-height: 1.7; }
.event-preview { max-height: 120px; }

/* honeypot anti-bot: fuori schermo ma non display:none */
.hp { position: absolute; left: -10000px; top: auto; width: 1px; height: 1px; overflow: hidden; }

@media (max-width: 575.98px) {
    .hero { padding: 2.2rem 0 4.5rem; }
    .event-banner { min-height: 12rem; }
    .event-banner-body { padding: 3rem 1rem 1rem; }
    .otp-input { font-size: 1.5rem; letter-spacing: .4rem; }
    .ticket-body, .ticket-head, .ticket-foot { padding-inline: 1.1rem; }
}
@media (prefers-reduced-motion: reduce) { .event-card { transition: none; } .event-card:hover { transform: none; } }

/* Selettori colore (Impostazioni → Aspetto) */
.theme-swatch { width: 3rem; height: 2.4rem; padding: .15rem; cursor: pointer; }
.theme-swatch:disabled { cursor: default; opacity: 1; }