/*
 * toscpiu — stili BASE/condivisi (incl. :not(variante) e @media base).
 * Split per-variante (Fase 8) dal monolite toscpiu.css.
 */
    /* Critical TOSC Overrides */
    dw-gen-toolbar,
    .page__toolbar,
    .toolbar,
    .toolbar__logo-wrapper,
    .toolbar__logo {
        display: none !important;
        visibility: hidden !important;
        height: 0 !important;
        overflow: hidden !important;
    }

    /* Bottom nav: centrata anche nella pagina TOSC */
    .bottom-nav {
        left: 50% !important;
        right: auto !important;
        bottom: 2rem !important;
        transform: translateX(-50%) !important;
        z-index: 9999 !important;
        width: auto !important;
    }

    /* Nav item: layout orizzontale compatto */
    .nav-item {
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: center;
        gap: 0.90rem;
        padding: 0.5rem 0.5rem;
        border-radius: 4rem;
        transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
        color: rgba(255,255,255,0.4);
        text-decoration: none;
        position: relative;
        min-width: 50px;
    }

    /* ── BORDER STREAK ANIMATION ──────────────────────────────────────────────
       Tecnica: conic-gradient in rotazione su ::before.
       ::after maschera il centro con il bg originale, lasciando
       visibile solo 1px di bordo → appare come una linea che scorre.
    */
    .bottom-nav-inner {
        position: relative;
        overflow: visible;
        isolation: isolate;
        background: #050505 !important;
        border-color: rgba(255, 255, 255, 0.08) !important;
        box-shadow: 0 42px 100px -20px rgba(0, 0, 0, 0.62) !important;
    }

    /* Il "laser" rotante — striscia larga con lunga coda sfumata */
    .bottom-nav-inner::before {
        content: '';
        position: absolute;
        width: 250%;   /* più grande per coprire le estremità pill */
        height: 250%;
        top: -75%;
        left: -75%;
        background: conic-gradient(
            from 0deg,
            transparent                0%,
            transparent               5%,
            rgba(255,255,255,0.02)   10%,
            rgba(255,255,255,0.25)   25%,
            rgba(255,255,255,0.7)    42%,
            rgba(255,255,255,1.0)    50%,   /* picco luminoso */
            rgba(255,255,255,0.7)    58%,
            rgba(255,255,255,0.25)   75%,
            rgba(255,255,255,0.02)   90%,
            transparent               95%,
            transparent              100%
        );
        animation: border-streak 2.2s linear infinite;
        z-index: 0;
        pointer-events: none;
    }

    /* Maschera centrale — stessa tinta del nav */
    .bottom-nav-inner::after {
        content: '';
        position: absolute;
        inset: 1px;          /* lascia 1px di bordo visibile */
        background: #4b5772; /* colore bg della nav bar (dal design) */
        border-radius: inherit;
        z-index: 1;
        pointer-events: none;
    }

    .bottom-nav-inner::before,
    .bottom-nav-inner::after {
        display: none !important;
    }

    /* Tutto il contenuto va sopra i due pseudo-elementi */
    .bottom-nav-inner > * {
        position: relative;
        z-index: 2;
    }

    @keyframes border-streak {
        from { transform: rotate(0deg); }
        to   { transform: rotate(360deg); }
    }


    /* Nascondi logo Bondisnar in alto a sx (panel-logo) */
    .panel-logo {
        display: none !important;
    }

    /* Tab links: reset stile anchor */
    a.tosc-tab {
        text-decoration: none !important;
        display: inline-block;
    }

    /* Area Badge */
    .area-badge {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 0.45rem;
        padding: 0.56rem 0.95rem;
        background: #dc2626;
        color: white;
        border-radius: 9999px;
        font-size: 0.72rem;
        font-weight: 900;
        text-transform: uppercase;
        letter-spacing: 0.085em;
        line-height: 1;
        white-space: nowrap;
        min-width: 0;
    }
    .area-badge svg {
        width: 0.95rem;
        height: 0.95rem;
        flex: 0 0 auto;
    }
    .area-badge-close {
        margin-left: 0.25rem;
        opacity: 0.7;
        cursor: pointer;
        transition: opacity 0.2s;
    }
    .area-badge-close:hover { opacity: 1; }

    #tosc-main {
        padding-bottom: 14rem !important;
    }

    /* ── TOSC Widget isolation ── */
    #tosc_alloggi, #tosc_ristoranti, #tosc_eventi, #tosc_punti_interesse,
    #tosc_alloggi *, #tosc_ristoranti *, #tosc_eventi *, #tosc_punti_interesse * {
        color-scheme: light !important;
    }
    #tosc_alloggi dw-gen-product-list, #tosc_ristoranti dw-gen-product-list,
    #tosc_eventi dw-gen-product-list, #tosc_punti_interesse dw-gen-product-list,
    #tosc_alloggi dw-gen-search-result, #tosc_ristoranti dw-gen-search-result,
    #tosc_eventi dw-gen-search-result, #tosc_punti_interesse dw-gen-search-result {
        background: #ffffff !important;
        color: #1e293b !important;
        border-radius: 1rem;
        overflow: hidden;
    }
    .tosc-view { background: #ffffff; overflow: visible; }

    .tosc-local-shell {
        color: #0f172a;
        font-family: 'Lato', system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
    }
    .tosc-local-toolbar {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 0.75rem;
        margin: 0 auto 1.05rem;
        width: min(860px, 100%);
    }
    .tosc-local-search-form {
        width: min(680px, 100%);
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 0.58rem;
    }
    .tosc-local-search {
        flex: 1 1 360px;
        min-width: 0;
        display: flex;
        align-items: center;
        gap: 0.55rem;
        border: 1px solid rgba(15, 23, 42, 0.12);
        border-radius: 999px;
        background: #ffffff;
        padding: 0.68rem 0.95rem;
        box-shadow: 0 8px 24px rgba(15, 23, 42, 0.08);
    }
    .tosc-local-search svg {
        width: 18px;
        height: 18px;
        color: #64748b;
        flex: 0 0 auto;
    }
    .tosc-local-search input {
        width: 100%;
        border: 0;
        outline: 0;
        background: transparent;
        color: #0f172a;
        font: 800 0.92rem/1.2 'Lato', sans-serif;
    }
    .tosc-local-search input::placeholder { color: #94a3b8; }
    .tosc-local-filter-button {
        flex: 0 0 auto;
        min-height: 44px;
        border: 0;
        border-radius: 999px;
        padding: 0 1.18rem;
        background: #dc2626;
        color: #ffffff;
        font: 900 0.76rem/1 'Lato', sans-serif;
        letter-spacing: 0.075em;
        text-transform: uppercase;
        cursor: pointer;
        box-shadow: 0 12px 28px rgba(220, 38, 38, 0.2);
    }
    .tosc-local-filter-button:hover,
    .tosc-local-filter-button:focus-visible {
        background: #b91c1c;
        outline: none;
    }
    .tosc-local-count {
        color: #64748b;
        font-size: 0.78rem;
        font-weight: 900;
        letter-spacing: 0.08em;
        text-transform: uppercase;
        white-space: nowrap;
    }
    .tosc-selection-stack {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 0.55rem;
        width: min(680px, calc(100% - 2rem));
        margin: 0 auto 1.25rem;
    }
    .tosc-selection-values {
        display: flex;
        align-items: center;
        justify-content: center;
        flex-wrap: wrap;
        gap: 0.45rem;
        min-width: 0;
    }
    .tosc-selection-reopen {
        width: 2rem;
        height: 2rem;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        flex: 0 0 auto;
        border: 0;
        border-radius: 999px;
        background: rgba(15, 23, 42, 0.08);
        color: #0f172a;
        cursor: pointer;
    }
    .tosc-mobile-category-badge {
        display: none;
    }
    .tosc-local-grid {
        display: grid;
        grid-template-columns: repeat(4, minmax(0, 1fr));
        gap: 1rem;
        align-items: stretch;
    }
    .tosc-local-card {
        appearance: none;
        border: 1px solid rgba(15, 23, 42, 0.08);
        background: #ffffff;
        padding: 0;
        margin: 0;
        border-radius: 1rem;
        overflow: hidden;
        text-align: left;
        display: flex;
        flex-direction: column;
        min-height: 100%;
        cursor: pointer;
        box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08);
        transition: transform 0.22s ease, box-shadow 0.22s ease, border-color 0.22s ease;
    }
    .tosc-local-card:hover,
    .tosc-local-card:focus-visible {
        transform: translateY(-4px);
        box-shadow: 0 12px 32px rgba(0, 0, 0, 0.12);
        border-color: rgba(220, 38, 38, 0.28);
        outline: none;
    }
    .tosc-local-card-media {
        position: relative;
        aspect-ratio: 16 / 10;
        background: #e2e8f0;
        overflow: hidden;
    }
    .tosc-local-card-media img,
    .tosc-local-detail-hero img {
        width: auto;
        max-width: 100%;
        height: 100%;
        object-fit: contain;
        display: block;
        margin: 0 auto;
    }
    .tosc-local-card-placeholder,
    .tosc-local-detail-placeholder {
        width: 100%;
        height: 100%;
        display: grid;
        place-items: center;
        background: linear-gradient(135deg, #f8fafc, #e2e8f0);
        color: #64748b;
        font-weight: 900;
        letter-spacing: 0.08em;
        text-transform: uppercase;
        font-size: 0.72rem;
    }
    .tosc-local-card-body {
        flex: 1 1 auto;
        padding: 1rem;
        display: flex;
        flex-direction: column;
        gap: 0.58rem;
    }
    .tosc-local-card-kicker,
    .tosc-local-detail-kicker {
        color: #dc2626;
        font-size: 0.68rem;
        font-weight: 900;
        letter-spacing: 0.14em;
        text-transform: uppercase;
    }
    .tosc-local-card h3 {
        margin: 0;
        color: #0f172a;
        font-size: var(--bon-card-title-size, 1rem);
        font-weight: var(--bon-card-title-weight, 900);
        letter-spacing: var(--bon-card-title-tracking, 0);
        line-height: var(--bon-card-title-line, 1.1);
        text-transform: uppercase;
    }
    .tosc-local-card p {
        margin: 0;
        color: #475569;
        font-size: 0.9rem;
        line-height: 1.45;
        display: -webkit-box;
        -webkit-line-clamp: 3;
        -webkit-box-orient: vertical;
        overflow: hidden;
    }
    .tosc-local-card-meta {
        margin-top: auto;
        display: flex;
        flex-wrap: wrap;
        gap: 0.42rem;
    }
    .tosc-local-event-date {
        margin: 0.1rem 0 0.45rem;
        color: #0f172a;
        font-size: 0.86rem;
        line-height: 1.15;
        font-weight: 950;
        letter-spacing: 0.02em;
        text-transform: uppercase;
    }
    .tosc-local-pill {
        display: inline-flex;
        align-items: center;
        gap: 0.32rem;
        border-radius: 999px;
        background: #f1f5f9;
        color: #334155;
        padding: 0.35rem 0.55rem;
        font-size: 0.72rem;
        font-weight: 900;
    }
    .tosc-local-pill--event-date {
        background: #fff7ed;
        color: #c2410c;
    }
    .tosc-local-detail {
        width: min(1180px, calc(100% - 2rem));
        max-width: 1180px;
        margin-left: auto;
        margin-right: auto;
        min-height: 100%;
        background: #f8fafc;
        color: #0f172a;
        border-radius: 1.15rem;
        overflow: hidden;
        box-shadow: 0 18px 46px rgba(15, 23, 42, 0.16);
        border: 1px solid rgba(15, 23, 42, 0.08);
        overscroll-behavior: contain;
        touch-action: pan-y;
    }
    .is-iframe-mode .tosc-local-detail {
        width: min(1170px, 100%);
        border-radius: 0;
        box-shadow: none;
        border: 0;
    }
    .tosc-local-detail-hero {
        position: relative;
        height: clamp(230px, 36vh, 430px);
        background:
            radial-gradient(circle at 20% 12%, rgba(220, 38, 38, 0.16), transparent 30%),
            linear-gradient(135deg, #f8fafc, #e2e8f0);
        border-bottom: 1px solid rgba(15, 23, 42, 0.08);
    }
    .tosc-local-detail-close {
        position: absolute;
        top: 1rem;
        right: 1rem;
        z-index: 2;
        width: 44px;
        height: 44px;
        border-radius: 999px;
        border: 0;
        background: rgba(15, 23, 42, 0.82);
        color: #ffffff;
        display: inline-grid;
        place-items: center;
        cursor: pointer;
        box-shadow: 0 12px 26px rgba(0, 0, 0, 0.22);
    }
    .tosc-local-detail-body {
        padding: clamp(1.1rem, 3vw, 2.15rem);
        display: grid;
        grid-template-columns: minmax(0, 1fr) minmax(300px, 360px);
        gap: clamp(1rem, 3.2vw, 2.25rem);
        align-items: start;
    }
    .tosc-local-detail-main {
        min-width: 0;
        display: grid;
        gap: 1rem;
    }
    .tosc-local-detail h1 {
        margin: 0.18rem 0 0;
        color: #0f172a;
        max-width: none;
        font-size: clamp(1.45rem, 3vw, 2rem);
        line-height: 1.08;
        font-weight: 950;
        letter-spacing: 0;
        text-transform: none;
        overflow-wrap: anywhere;
        white-space: normal;
    }
    .tosc-local-detail-facts {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 0.7rem;
        margin-top: 0.1rem;
    }
    .tosc-local-detail-fact {
        min-width: 0;
        display: grid;
        grid-template-columns: 34px minmax(0, 1fr);
        grid-template-areas:
            "icon label"
            "icon value";
        column-gap: 0.72rem;
        align-items: center;
        padding: 0.72rem 0.82rem;
        border: 1px solid rgba(15, 23, 42, 0.08);
        border-radius: 0.85rem;
        background: #ffffff;
        box-shadow: 0 8px 22px rgba(15, 23, 42, 0.06);
    }
    .tosc-local-detail-fact svg {
        grid-area: icon;
        width: 34px;
        height: 34px;
        padding: 0.48rem;
        border-radius: 0.72rem;
        color: #dc2626;
        background: #fef2f2;
        fill: none;
        stroke: currentColor;
        stroke-width: 2;
        stroke-linecap: round;
        stroke-linejoin: round;
    }
    .tosc-local-detail-fact span {
        grid-area: label;
        color: #64748b;
        font-size: 0.68rem;
        font-weight: 900;
        letter-spacing: 0.08em;
        text-transform: uppercase;
    }
    .tosc-local-detail-fact strong {
        grid-area: value;
        min-width: 0;
        color: #0f172a;
        font-size: 0.9rem;
        font-weight: 950;
        line-height: 1.18;
        overflow-wrap: anywhere;
    }
    .tosc-local-detail-fact--date svg {
        color: #c2410c;
        background: #fff7ed;
    }
    .tosc-local-detail-section {
        display: grid;
        gap: 0.62rem;
        margin-top: 0.2rem;
    }
    .tosc-local-detail-section h2 {
        margin: 0;
        color: #0f172a;
        font-size: 0.82rem;
        font-weight: 950;
        letter-spacing: 0.12em;
        text-transform: uppercase;
    }
    .tosc-local-detail-desc {
        margin: 0;
        color: #334155;
        max-width: 74ch;
        font-size: clamp(0.98rem, 1.1vw, 1.06rem);
        line-height: 1.72;
        text-align: left;
        hyphens: auto;
    }
    /* Event dates */
    .tosc-local-date-list {
        list-style: none;
        margin: 0;
        padding: 0;
        display: grid;
        grid-template-columns: repeat(auto-fill, minmax(190px, 1fr));
        gap: 0.55rem;
    }
    .tosc-local-date {
        display: flex;
        align-items: baseline;
        justify-content: space-between;
        gap: 0.6rem;
        padding: 0.6rem 0.78rem;
        border: 1px solid rgba(15, 23, 42, 0.08);
        border-radius: 0.72rem;
        background: #fff7ed;
    }
    .tosc-local-date-day {
        color: #0f172a;
        font-size: 0.86rem;
        font-weight: 900;
        text-transform: capitalize;
        line-height: 1.2;
    }
    .tosc-local-date-time {
        color: #c2410c;
        font-size: 0.82rem;
        font-weight: 950;
        white-space: nowrap;
    }
    .tosc-local-date--more {
        background: #f8fafc;
        color: #64748b;
        font-weight: 850;
        font-style: italic;
        justify-content: center;
    }
    /* Opening hours schedule */
    .tosc-local-hours-list {
        list-style: none;
        margin: 0;
        padding: 0;
        border: 1px solid rgba(15, 23, 42, 0.08);
        border-radius: 0.78rem;
        overflow: hidden;
    }
    .tosc-local-hours-row {
        display: flex;
        align-items: baseline;
        justify-content: space-between;
        gap: 1rem;
        padding: 0.62rem 0.85rem;
    }
    .tosc-local-hours-row:nth-child(odd) {
        background: #f8fafc;
    }
    .tosc-local-hours-day {
        color: #0f172a;
        font-size: 0.86rem;
        font-weight: 900;
    }
    .tosc-local-hours-val {
        color: #334155;
        font-size: 0.86rem;
        font-weight: 850;
        font-variant-numeric: tabular-nums;
        text-align: right;
    }
    .tosc-local-contact-panel {
        align-self: start;
        display: grid;
        gap: 0.78rem;
        position: sticky;
        top: 1rem;
        background: #ffffff;
        border: 1px solid rgba(15, 23, 42, 0.08);
        border-radius: 0.95rem;
        padding: 1rem;
        box-shadow: 0 12px 30px rgba(15, 23, 42, 0.08);
    }
    .tosc-local-contact-panel-head {
        display: grid;
        gap: 0.28rem;
    }
    .tosc-local-contact-panel h2 {
        margin: 0;
        color: #0f172a;
        font-size: 0.585rem;
        font-weight: 950;
        letter-spacing: 0.12em;
        text-transform: uppercase;
    }
    .tosc-local-contact-panel p {
        margin: 0;
        color: #475569;
        font-size: 0.612rem;
        line-height: 1.35;
        font-weight: 850;
    }
    .tosc-local-contact-row {
        display: grid;
        gap: 0.18rem;
        padding: 0.72rem 0;
        border-top: 1px solid rgba(15, 23, 42, 0.08);
        width: 100%;
        text-align: left;
    }
    .tosc-local-contact-row > span:first-child {
        color: #64748b;
        font-size: 0.462rem;
        font-weight: 950;
        letter-spacing: 0.08em;
        text-transform: uppercase;
    }
    .tosc-local-contact-row--qr {
        appearance: none;
        border: 0;
        border-radius: 0.72rem;
        background: #15803d;
        color: #ffffff;
        padding: 0.7rem 0.78rem;
        margin-top: 0.5rem;
        cursor: pointer;
        font: inherit;
        box-shadow: 0 10px 24px rgba(21, 128, 61, 0.22);
        transition: transform 0.18s ease, background-color 0.18s ease, box-shadow 0.18s ease;
    }
    .tosc-local-contact-row--qr + .tosc-local-contact-row--qr {
        margin-top: 0.46rem;
    }
    .tosc-local-contact-row--qr > span:first-child {
        color: rgba(255, 255, 255, 0.68);
    }
    .tosc-local-contact-row--qr:hover,
    .tosc-local-contact-row--qr:focus-visible {
        background: #166534;
        box-shadow: 0 12px 26px rgba(21, 128, 61, 0.28);
        outline: none;
        transform: translateY(-1px);
    }
    .tosc-local-contact-row--qr:focus-visible {
        box-shadow: 0 0 0 3px rgba(34, 197, 94, 0.28), 0 12px 26px rgba(21, 128, 61, 0.28);
    }
    .tosc-local-contact-row--link {
        border: 0;
        border-radius: 0.72rem;
        background: #15803d;
        color: #ffffff;
        padding: 0.7rem 0.78rem;
        margin-top: 0.5rem;
        text-decoration: none;
        box-shadow: 0 10px 24px rgba(21, 128, 61, 0.22);
        transition: transform 0.18s ease, background-color 0.18s ease, box-shadow 0.18s ease;
    }
    .tosc-local-contact-row--link + .tosc-local-contact-row--link {
        margin-top: 0.46rem;
    }
    .tosc-local-contact-row--link > span:first-child {
        color: rgba(255, 255, 255, 0.68);
    }
    .tosc-local-contact-row--link:hover,
    .tosc-local-contact-row--link:focus-visible {
        background: #166534;
        box-shadow: 0 12px 26px rgba(21, 128, 61, 0.28);
        outline: none;
        transform: translateY(-1px);
    }
    .tosc-local-contact-row--link:focus-visible {
        box-shadow: 0 0 0 3px rgba(34, 197, 94, 0.28), 0 12px 26px rgba(21, 128, 61, 0.28);
    }
    .tosc-local-contact {
        color: #0f172a;
        font-size: 0.68rem;
        text-decoration: none;
        font-weight: 850;
        line-height: 1.35;
        overflow-wrap: anywhere;
    }
    .tosc-local-contact-row--qr .tosc-local-contact {
        display: inline-flex;
        align-items: baseline;
        flex-wrap: wrap;
        gap: 0.34rem;
        color: #ffffff;
        width: 100%;
        max-width: 100%;
    }
    .tosc-local-contact-row--link .tosc-local-contact {
        color: #ffffff;
        width: 100%;
        max-width: 100%;
    }
    .tosc-local-contact-row--qr .tosc-local-contact::after {
        content: "QR";
        flex: 0 0 auto;
        border-radius: 999px;
        background: rgba(255, 255, 255, 0.16);
        color: #ffffff;
        padding: 0.08rem 0.26rem;
        font-size: 0.408rem;
        font-weight: 950;
        letter-spacing: 0.08em;
        line-height: 1.3;
    }
    .tosc-local-contact:hover { color: #dc2626; }
    .tosc-local-contact-row--link .tosc-local-contact:hover { color: #ffffff; }
    .tosc-local-contact-row--qr .tosc-local-contact:hover { color: #ffffff; }
    .tosc-local-qr-btn,
    .tosc-local-load-more {
        border: 0;
        border-radius: 0.82rem;
        background: #dc2626;
        color: #ffffff;
        min-height: 44px;
        padding: 0.82rem 1rem;
        font: 950 0.84rem/1 'Lato', sans-serif;
        letter-spacing: 0.08em;
        text-transform: uppercase;
        cursor: pointer;
        box-shadow: 0 10px 24px rgba(220, 38, 38, 0.22);
    }
    .tosc-local-qr-btn {
        display: inline-flex;
        align-items: center;
        justify-content: space-between;
        gap: 0.75rem;
        width: 100%;
        text-align: left;
    }
    .tosc-local-qr-btn svg {
        flex: 0 0 auto;
        width: 18px;
        height: 18px;
        fill: none;
        stroke: currentColor;
        stroke-width: 2.4;
        stroke-linecap: round;
        stroke-linejoin: round;
    }
    .tosc-local-qr-btn:hover,
    .tosc-local-qr-btn:focus-visible {
        background: #b91c1c;
        outline: none;
    }
    .tosc-local-load-more {
        display: block;
        margin: 1.25rem auto 0;
        min-width: 190px;
        border-radius: 999px;
    }
    .tosc-local-state {
        min-height: 220px;
        display: grid;
        place-items: center;
        color: #64748b;
        text-align: center;
        font-weight: 850;
    }
    @media (max-width: 1100px) {
        .tosc-local-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

    @media (max-width: 780px) {
        .tosc-local-toolbar { align-items: stretch; flex-direction: column; }
        .tosc-local-search-form { width: 100%; }
        .tosc-local-count { white-space: normal; }
        .tosc-local-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
        .tosc-local-detail-body { grid-template-columns: 1fr; }
        .tosc-local-contact-panel { position: static; }
}

    @media (max-width: 520px) {
        .tosc-local-grid {
            grid-template-columns: repeat(2, minmax(0, 1fr));
            gap: 0.72rem;
            padding-inline: 0.75rem;
        }
        .tosc-local-toolbar {
            padding-inline: 0.75rem;
        }
        .tosc-local-detail {
            width: 100%;
            max-width: 100%;
            border-radius: 0;
        }
        .tosc-local-search-form {
            gap: 0.45rem;
        }
        .tosc-local-filter-button {
            min-height: 42px;
            padding: 0 0.95rem;
            font-size: 0.7rem;
        }
        .tosc-local-card {
            border-radius: 0.9rem;
        }
        .tosc-local-card-media {
            aspect-ratio: 4 / 3;
        }
        .tosc-local-card-body {
            padding: 0.72rem;
            gap: 0.42rem;
        }
        .tosc-local-card-kicker {
            font-size: 0.55rem;
            letter-spacing: 0.1em;
        }
        .tosc-local-card h3 {
            font-size: 0.78rem;
            line-height: 1.05;
            display: -webkit-box;
            -webkit-line-clamp: 2;
            -webkit-box-orient: vertical;
            overflow: hidden;
        }
        .tosc-local-card p {
            display: none;
        }
        .tosc-local-pill {
            max-width: 100%;
            padding: 0.28rem 0.45rem;
            font-size: 0.62rem;
        }
        .tosc-local-detail-hero { height: 220px; }
        .tosc-local-detail-body {
            padding: 1rem;
            gap: 1rem;
        }
        .tosc-local-detail-facts {
            grid-template-columns: 1fr;
            gap: 0.56rem;
        }
        .tosc-local-detail-fact {
            padding: 0.62rem 0.68rem;
        }
        .tosc-local-detail-section h2,
        .tosc-local-contact-panel h2 {
            font-size: 0.76rem;
        }
        .tosc-local-detail-desc {
            font-size: 0.96rem;
            line-height: 1.65;
        }
}


    /* ───────────────────────────────────────── */
    /* TOP BAR                                   */
    /* ───────────────────────────────────────── */
    #tosc-topbar {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        justify-content: center;
        align-content: center;
        gap: 0.52rem;
        row-gap: 0.55rem;
        padding: 0.62rem 0.72rem;
        background: rgba(255, 255, 255, 0.18);
        backdrop-filter: blur(2px);
        -webkit-backdrop-filter: blur(2px);
        border: 1px solid rgba(255,255,255,0.24);
        border-bottom-color: rgba(255,255,255,0.28);
        border-radius: 2.25rem;
        box-shadow: 0 22px 70px -20px rgba(0, 0, 0, 0.18);
        overflow: visible;
        scrollbar-width: none;
        position: fixed;
        left: var(--bon-panel-safe-center, 50%);
        top: auto;
        bottom: var(--bon-panel-safe-bottom, calc(8.65rem + 10px));
        transform: translateX(-50%);
        z-index: 10010;
        width: min(calc(var(--bon-panel-safe-width, calc(100vw - 3rem)) - 4px), 100%);
        max-width: calc(var(--bon-panel-safe-width, calc(100vw - 3rem)) - 4px);
    }
    body.bon-has-dpad #tosc-topbar {
        left: var(--bon-panel-safe-center, 50%);
        width: calc(var(--bon-panel-safe-width, calc(100vw - 3rem)) - 4px);
        max-width: calc(var(--bon-panel-safe-width, calc(100vw - 3rem)) - 4px);
    }
    #tosc-topbar::-webkit-scrollbar { display: none; }
    .tosc-detail-active #tosc-topbar {
        opacity: 0;
        pointer-events: none;
        transform: translateX(-50%) translateY(1rem) scale(0.96);
    }

    /* Category tabs in top bar */
    .tosc-tab {
        flex: 0 0 auto;
        padding: 0.74rem 1.08rem;
        border-radius: 5rem;
        font-size: 0.7rem;
        font-weight: 900;
        text-transform: uppercase;
        letter-spacing: 0.085em;
        color: #050505;
        background: transparent;
        border: 1px solid transparent;
        cursor: pointer;
        transition: all 0.2s;
        white-space: nowrap;
    }
    .tosc-tab:hover { color: #050505; background: rgba(255,255,255,0.22); }
    .tosc-tab.active {
        color: #fff;
        background: rgba(220,38,38,0.22);
        border-color: rgba(220,38,38,0.58);
        box-shadow: inset 0 0 0 1px rgba(255,255,255,0.04);
    }

    /* Toggle button — dentro l'isola di selezione */
    #sidebar-toggle {
        position: static !important;
        top: auto !important;
        left: auto !important;
        z-index: auto;
        width: 3rem;
        height: 3rem;
        flex: 0 0 auto;
        display: flex;
        align-items: center;
        justify-content: center;
        background: rgba(255,255,255,0.22);
        border: 1px solid rgba(0,0,0,0.12);
        border-radius: 50%;
        color: #050505;
        cursor: pointer;
        transition: background 0.2s, color 0.2s;
    }
    #sidebar-toggle:hover { background: #dc2626; color: #fff; border-color: #dc2626; }
    #sidebar-toggle.active { background: rgba(220,38,38,0.15); color: #f87171; border-color: rgba(220,38,38,0.3); }

    /* Nasconde il genie-cat-menu globale su toscpiu — la navigazione avviene via topbar + wizard proprio */
    #genie-cat-menu { display: none !important; }

    @media (max-width: 900px) {
        #tosc-topbar {
            bottom: var(--bon-panel-safe-bottom, calc(7.8rem + 10px));
            max-width: calc(var(--bon-panel-safe-width, calc(100vw - 0.85rem)) - 4px);
            padding: 0.5rem;
            gap: 0.42rem;
            row-gap: 0.45rem;
        }
        .tosc-tab {
            padding: 0.64rem 0.78rem;
            font-size: 0.62rem;
            letter-spacing: 0.06em;
        }
        .area-badge {
            padding: 0.52rem 0.72rem;
            font-size: 0.62rem;
            letter-spacing: 0.055em;
        }
        #sidebar-toggle {
            width: 2.6rem;
            height: 2.6rem;
        }
        #tosc-main {
            padding-bottom: 13rem !important;
        }
}


    /* ── PANNELLO FILTRI PROPRIETARIO (Opzione B) ── */

    /* Backdrop */
    #tosc-filter-backdrop {
        display: none;
        position: fixed;
        inset: 0;
        background: rgba(0,0,0,0.28);
        z-index: 10000;
        backdrop-filter: blur(1px);
        -webkit-backdrop-filter: blur(1px);
        opacity: 0;
        transition: opacity 0.3s;
    }
    #tosc-filter-backdrop.open {
        display: block;
        opacity: 1;
    }

    /* Pannello centrale sopra la selezione */
    #tosc-filter-panel {
        position: fixed;
        left: var(--bon-panel-safe-center, 50%);
        bottom: calc(var(--bon-panel-safe-bottom, 8.65rem) + 84px);
        width: min(1008px, calc(var(--bon-panel-safe-width, calc(100vw - 3rem)) - 4px));
        max-height: min(36vh, calc(var(--bon-panel-safe-height, 50vh) * 0.8));
        background: rgba(255, 255, 255, 0.18);
        background-color: rgba(255, 255, 255, 0.18);
        backdrop-filter: blur(2px);
        -webkit-backdrop-filter: blur(2px);
        color: #050505;
        border: 1px solid rgba(255,255,255,0.24);
        border-radius: 1.8rem;
        z-index: 10020;
        transform: translateX(-50%) translateY(1rem) scale(0.97);
        opacity: 0;
        pointer-events: none;
        transition: opacity 0.25s ease, transform 0.32s cubic-bezier(.34,1.56,.64,1);
        overflow-y: auto;
        overflow-x: hidden;
        display: flex;
        flex-direction: column;
        box-shadow: 0 27px 72px -22px rgba(0,0,0,0.18);
    }
    body.bon-has-dpad #tosc-filter-panel {
        left: var(--bon-panel-safe-center, 50%);
        width: min(1008px, calc(var(--bon-panel-safe-width, calc(100vw - 3rem)) - 4px));
    }
    #tosc-filter-panel.open {
        opacity: 1;
        pointer-events: auto;
        transform: translateX(-50%) translateY(0) scale(1);
    }

    /* Header */
    .filter-panel-header {
        display: flex;
        align-items: center;
        justify-content: center;
        padding: 0.92rem 2.8rem 0.72rem;
        border-bottom: 1px solid rgba(0,0,0,0.08);
        position: sticky;
        top: 0;
        background: rgba(255, 255, 255, 0.24);
        backdrop-filter: blur(2px);
        -webkit-backdrop-filter: blur(2px);
        color: #050505;
        z-index: 2;
    }
    .filter-panel-title {
        font-size: 0.64rem;
        font-weight: 900;
        letter-spacing: 0.24em;
        text-transform: uppercase;
        color: #050505;
        text-align: center;
    }
    .filter-panel-close {
        position: absolute;
        right: 1rem;
        top: 50%;
        transform: translateY(-50%);
        background: none;
        border: none;
        color: #050505;
        cursor: pointer;
        padding: 0.2rem;
        border-radius: 0.3rem;
        transition: color 0.2s, background 0.2s;
    }
    .filter-panel-close:hover { color: #050505; background: rgba(255,255,255,0.28); }

    /* Sezioni */
    .filter-section {
        padding: 0.84rem 1.12rem 0.64rem;
        border-bottom: 1px solid rgba(0,0,0,0.08);
        text-align: center;
    }
    .filter-section:last-child { border-bottom: none; }
    .filter-section-label {
        font-size: 0.48rem;
        font-weight: 700;
        letter-spacing: 0.15em;
        text-transform: uppercase;
        color: #050505;
        margin-bottom: 0.6rem;
        text-align: center;
    }

    /* Chips (usate per Area e Comune) */
    .filter-chips {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        align-items: center;
        gap: 0.4rem;
        padding-bottom: 0.28rem;
    }
    .filter-chip {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 0.32rem;
        padding: 0.46rem 0.84rem;
        border-radius: 9999px;
        font-size: 0.59rem;
        font-weight: 800;
        background: rgba(255,255,255,0.22);
        color: #050505;
        border: 1px solid rgba(0,0,0,0.12);
        text-decoration: none !important;
        transition: background 0.2s, color 0.2s, border-color 0.2s;
        cursor: pointer;
        white-space: nowrap;
    }
    .filter-chip:hover {
        background: rgba(220,38,38,0.15);
        color: #050505;
        border-color: rgba(220,38,38,0.3);
    }
    .filter-chip.active {
        background: #dc2626;
        color: #fff;
        border-color: #dc2626;
        font-weight: 900;
    }

    /* Pulsanti categoria — blocchi full-width */
    .filter-cat-btn {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 0.44rem;
        width: auto;
        padding: 0.6rem 1.52rem;
        border-radius: 9999px;
        font-size: 0.74rem;
        font-weight: 900;
        letter-spacing: 0.09em;
        text-transform: uppercase;
        background: rgba(220,38,38,0.08);
        color: #dc2626;
        border: 2px solid #dc2626;
        text-decoration: none !important;
        transition: background 0.2s, color 0.2s, border-color 0.2s, transform 0.15s;
        cursor: pointer;
        margin-bottom: 0.24rem;
    }
    .filter-cat-btn:last-child { margin-bottom: 0; }
    .filter-cat-btn .cat-icon {
        width: 1.6rem;
        height: 1.6rem;
        display: flex;
        align-items: center;
        justify-content: center;
        border-radius: 0.4rem;
        background: rgba(255,255,255,0.06);
        flex-shrink: 0;
        transition: background 0.2s;
    }
    .filter-cat-btn .cat-icon svg { width: 13px; height: 13px; }
    .filter-cat-btn:hover {
        background: rgba(220,38,38,0.12);
        color: #fca5a5;
        border-color: rgba(220,38,38,0.25);
        transform: translateY(-1px);
    }
    .filter-cat-btn:hover .cat-icon { background: rgba(220,38,38,0.2); }
    .filter-cat-btn.active {
        background: rgba(220,38,38,0.18);
        color: #fff;
        border-color: rgba(220,38,38,0.5);
    }
    .filter-cat-btn.active .cat-icon {
        background: #dc2626;
    }

    @media (max-width: 900px) {
        #tosc-topbar {
            background: #ffffff !important;
            background-color: #ffffff !important;
            border-color: #e2e8f0 !important;
            box-shadow: 0 -18px 48px rgba(15,23,42,0.18) !important;
            backdrop-filter: none !important;
            -webkit-backdrop-filter: none !important;
        }
        #tosc-topbar .tosc-tab {
            color: #0f172a !important;
            background: transparent !important;
            border-color: transparent !important;
            text-shadow: none !important;
        }
        #tosc-topbar .tosc-tab.active {
            color: #ffffff !important;
            background: #dc2626 !important;
            border-color: #dc2626 !important;
            box-shadow: 0 10px 26px rgba(220,38,38,0.2) !important;
        }
        #tosc-topbar #sidebar-toggle {
            background: #f8fafc !important;
            border-color: #e2e8f0 !important;
            color: #0f172a !important;
            box-shadow: 0 8px 22px rgba(15,23,42,0.08) !important;
        }
        #tosc-filter-panel {
            left: 12px;
            right: 12px;
            bottom: calc(118px + env(safe-area-inset-bottom, 0px));
            width: auto;
            max-height: min(58dvh, 460px);
            border-radius: 26px;
            background: #ffffff;
            background-color: #ffffff;
            border: 1px solid rgba(15,23,42,0.12);
            box-shadow: 0 -18px 48px rgba(15,23,42,0.22);
            backdrop-filter: none;
            -webkit-backdrop-filter: none;
            transform: translateY(calc(100% + 120px));
            overflow-x: hidden;
            overflow-y: auto;
            overscroll-behavior: contain;
            -webkit-overflow-scrolling: touch;
            touch-action: pan-y;
            z-index: 10118;
        }
        #tosc-filter-panel.open {
            transform: translateY(0);
        }
        #tosc-filter-panel.is-dragging {
            transition: none !important;
        }
        #tosc-filter-panel::before {
            content: "";
            display: block;
            width: 44px;
            height: 5px;
            margin: 10px auto 4px;
            border-radius: 999px;
            background: rgba(15,23,42,0.22);
            flex: 0 0 auto;
        }
        body.bon-place-sheet-open #tosc-topbar {
            opacity: 0;
            pointer-events: none;
            transform: translateY(12px);
        }
        #tosc-filter-backdrop.open {
            background: transparent;
            backdrop-filter: none;
            -webkit-backdrop-filter: none;
        }
        .filter-panel-header {
            position: relative;
            justify-content: flex-start;
            padding: 0.42rem 3.2rem 0.36rem 1rem;
            border-bottom: 0;
            background: transparent;
            backdrop-filter: none;
            -webkit-backdrop-filter: none;
        }
        .filter-panel-title {
            color: #050505;
            font-size: 1.06rem;
            line-height: 1;
            letter-spacing: 0;
            text-align: left;
            text-transform: none;
        }
        .filter-panel-close {
            right: 0.72rem;
            top: 50%;
            width: 38px;
            height: 38px;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            border-radius: 999px;
            background: #f1f5f9;
            border: 1px solid #e2e8f0;
            color: #0f172a;
            box-shadow: none;
        }
        .filter-panel-close:hover {
            background: #e2e8f0;
            color: #050505;
        }
        .filter-section {
            padding: 0.54rem 1rem 0.9rem;
            border-bottom: 0;
            text-align: left;
            overflow: visible;
            flex: 0 0 auto;
        }
        .filter-section + .filter-section {
            border-top: 1px solid #e2e8f0;
        }
        .filter-section-label {
            color: #475569;
            font-size: 0.78rem;
            line-height: 1.2;
            font-weight: 800;
            letter-spacing: 0;
            text-align: left;
            text-transform: none;
            margin-bottom: 0.72rem;
        }
        .filter-chips {
            display: grid;
            grid-template-columns: repeat(2, minmax(0, 1fr));
            gap: 0.55rem;
            justify-content: stretch;
            align-items: stretch;
            padding-bottom: 0;
        }
        .filter-chip {
            width: 100%;
            min-height: 48px;
            padding: 0.64rem 0.7rem;
            border-radius: 999px;
            background: #f8fafc;
            border-color: #e2e8f0;
            color: #0f172a;
            box-shadow: 0 10px 24px rgba(15,23,42,0.08);
            font-size: 0.76rem;
            line-height: 1.05;
            text-align: center;
            white-space: normal;
            touch-action: manipulation;
            pointer-events: auto;
            position: relative;
            z-index: 1;
        }
        .filter-chip.active {
            background: #dc2626;
            color: #fff;
            border-color: #dc2626;
            box-shadow: 0 12px 30px rgba(220,38,38,0.24);
        }
        .filter-cat-btn {
            padding: 0.65rem 1.25rem;
            font-size: 0.76rem;
        }
}


    /* Phase 4 UX theme pass: TOSC shell and proprietary controls use shared tokens. */
    body.is-toscpiu,
    body.is-toscpiu .bon-tosc-shell,
    body.is-toscpiu #tosc-main,
    body.is-toscpiu .tosc-view,
    body.is-toscpiu #tosc_alloggi,
    body.is-toscpiu #tosc_ristoranti,
    body.is-toscpiu #tosc_eventi,
    body.is-toscpiu #tosc_punti_interesse {
        background: var(--bon-bg) !important;
        background-color: #ffffff !important;
        color: var(--bon-text) !important;
    }

    body.is-toscpiu .tosc-view {
        height: auto !important;
        overflow: visible !important;
    }

    body.is-toscpiu .bon-site-header {
        background: var(--bon-surface-strong) !important;
        color: var(--bon-text) !important;
        border-bottom-color: var(--bon-border) !important;
    }

    #tosc-topbar,
    #tosc-filter-panel {
        background: var(--bon-surface-strong) !important;
        background-color: var(--bon-surface-strong) !important;
        color: var(--bon-text) !important;
        border-color: var(--bon-border) !important;
        box-shadow: var(--bon-shadow-panel) !important;
    }

    #tosc-filter-panel::before {
        background: var(--bon-border-strong) !important;
    }

    .filter-panel-header {
        background: var(--bon-surface-strong) !important;
        color: var(--bon-text) !important;
        border-bottom-color: var(--bon-border) !important;
    }

    .filter-panel-title,
    .filter-section-label,
    .filter-chip,
    .tosc-tab,
    #sidebar-toggle,
    .filter-panel-close {
        color: var(--bon-text) !important;
    }

    .filter-chip,
    #sidebar-toggle,
    .filter-panel-close {
        background: var(--bon-surface-soft) !important;
        border-color: var(--bon-border) !important;
        box-shadow: var(--bon-shadow-card) !important;
    }

    .filter-section + .filter-section,
    .filter-section {
        border-color: var(--bon-border) !important;
    }

    .filter-chip:hover,
    .tosc-tab:hover,
    #sidebar-toggle:hover,
    .filter-panel-close:hover {
        background: var(--bon-surface) !important;
        color: var(--bon-text) !important;
        border-color: var(--bon-border-strong) !important;
    }

    .filter-chip.active,
    .tosc-tab.active,
    .filter-cat-btn.active,
    .area-badge {
        background: var(--bon-brand) !important;
        color: var(--bon-on-brand) !important;
        border-color: var(--bon-brand) !important;
    }

    .filter-cat-btn {
        background: var(--bon-surface-soft) !important;
        color: var(--bon-brand) !important;
        border-color: var(--bon-brand) !important;
    }

    @media (max-width: 980px) {
        body.is-toscpiu:not(.bon-kiosk-navigation) #tosc-topbar,
        body.is-toscpiu:not(.bon-kiosk-navigation) .bon-site-categorybar {
            display: none !important;
            visibility: hidden !important;
            pointer-events: none !important;
        }

        body.is-toscpiu:not(.bon-kiosk-navigation) .tosc-mobile-category-badge {
            position: fixed !important;
            left: 50% !important;
            bottom: calc(var(--bon-nav-bottom-h, 80px) + env(safe-area-inset-bottom, 0px) + 10px) !important;
            z-index: 10012 !important;
            transform: translateX(-50%) !important;
            display: flex !important;
            align-items: center !important;
            justify-content: space-between !important;
            gap: 0.58rem !important;
            width: min(548px, calc(100vw - 24px)) !important;
            min-height: 52px !important;
            box-sizing: border-box !important;
            padding: 0.52rem 0.72rem !important;
            border: 1px solid rgba(203, 213, 225, 0.86) !important;
            border-radius: 24px !important;
            background: rgba(248, 250, 252, 0.96) !important;
            box-shadow: 0 -10px 30px rgba(15, 23, 42, 0.14), inset 0 0 0 1px rgba(255, 255, 255, 0.8) !important;
            backdrop-filter: blur(14px) !important;
            -webkit-backdrop-filter: blur(14px) !important;
        }

        body.is-toscpiu:not(.bon-kiosk-navigation) .tosc-mobile-category-place {
            appearance: none !important;
            border: 0 !important;
            background: transparent !important;
            color: #0f172a !important;
            max-width: min(35vw, 11rem) !important;
            min-width: 0 !important;
            padding: 0 !important;
            display: inline-flex !important;
            align-items: center !important;
            gap: 0.38rem !important;
            overflow: hidden !important;
            text-align: left !important;
            text-overflow: ellipsis !important;
            white-space: nowrap !important;
            font: 950 0.96rem/1.1 'Lato', system-ui, sans-serif !important;
        }

        body.is-toscpiu:not(.bon-kiosk-navigation) .tosc-mobile-category-place svg {
            width: 1.25rem !important;
            height: 1.25rem !important;
            flex: 0 0 auto !important;
            color: #2563eb !important;
            stroke: currentColor !important;
        }

        body.is-toscpiu:not(.bon-kiosk-navigation) .tosc-mobile-category-place-label {
            min-width: 0 !important;
            overflow: hidden !important;
            text-overflow: ellipsis !important;
            white-space: nowrap !important;
        }

        body.is-toscpiu:not(.bon-kiosk-navigation) .tosc-mobile-category-actions {
            display: inline-flex !important;
            align-items: center !important;
            justify-content: flex-end !important;
            gap: 0.48rem !important;
            min-width: 0 !important;
            flex: 0 0 auto !important;
        }

        body.is-toscpiu:not(.bon-kiosk-navigation) .tosc-mobile-category-link {
            --tosc-badge-color: #0f172a;
            display: inline-flex !important;
            align-items: center !important;
            justify-content: center !important;
            gap: 0.22rem !important;
            min-height: 2.25rem !important;
            padding: 0 0.16rem !important;
            border: 0 !important;
            border-radius: 999px !important;
            color: var(--tosc-badge-color) !important;
            text-decoration: none !important;
            font: 950 0.98rem/1 'Lato', system-ui, sans-serif !important;
            white-space: nowrap !important;
            -webkit-tap-highlight-color: transparent !important;
        }

        body.is-toscpiu:not(.bon-kiosk-navigation) .tosc-mobile-category-link svg {
            width: 1.55rem !important;
            height: 1.55rem !important;
            flex: 0 0 auto !important;
            color: var(--tosc-badge-color) !important;
            stroke: currentColor !important;
        }

        body.is-toscpiu:not(.bon-kiosk-navigation) .tosc-mobile-category-link[data-section="alloggi"] {
            --tosc-badge-color: #2563eb;
        }

        body.is-toscpiu:not(.bon-kiosk-navigation) .tosc-mobile-category-link[data-section="ristoranti"] {
            --tosc-badge-color: #dc2626;
        }

        body.is-toscpiu:not(.bon-kiosk-navigation) .tosc-mobile-category-link[data-section="punti-interesse"] {
            --tosc-badge-color: #92400e;
        }

        body.is-toscpiu:not(.bon-kiosk-navigation) .tosc-mobile-category-link[data-section="eventi"] {
            --tosc-badge-color: #ea580c;
        }

        body.is-toscpiu:not(.bon-kiosk-navigation) .tosc-mobile-category-link.is-active {
            padding: 0 0.42rem !important;
            background: rgba(15, 23, 42, 0.06) !important;
            box-shadow: inset 0 0 0 1px rgba(15, 23, 42, 0.08) !important;
        }

        body.is-toscpiu:not(.bon-kiosk-navigation) .tosc-mobile-category-count:empty {
            display: none !important;
        }

        body.is-toscpiu:not(.bon-kiosk-navigation) .tosc-local-grid {
            grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
            width: 100% !important;
            max-width: 100% !important;
            padding-left: 0.75rem !important;
            padding-right: 0.75rem !important;
        }

        html.dark body.is-toscpiu:not(.bon-kiosk-navigation) .tosc-mobile-category-badge,
        html[data-bon-theme="dark"] body.is-toscpiu:not(.bon-kiosk-navigation) .tosc-mobile-category-badge {
            background: rgba(15, 23, 42, 0.94) !important;
            background-color: rgba(15, 23, 42, 0.94) !important;
            border-color: rgba(226, 232, 240, 0.2) !important;
            box-shadow: 0 -10px 30px rgba(0, 0, 0, 0.32) !important;
        }

        html.dark body.is-toscpiu:not(.bon-kiosk-navigation) .tosc-mobile-category-place,
        html.dark body.is-toscpiu:not(.bon-kiosk-navigation) .tosc-mobile-category-count,
        html[data-bon-theme="dark"] body.is-toscpiu:not(.bon-kiosk-navigation) .tosc-mobile-category-place,
        html[data-bon-theme="dark"] body.is-toscpiu:not(.bon-kiosk-navigation) .tosc-mobile-category-count {
            color: #f8fafc !important;
            -webkit-text-fill-color: #f8fafc !important;
        }

        @media (max-width: 420px) {
            body.is-toscpiu:not(.bon-kiosk-navigation) .tosc-mobile-category-badge,
            body.bon-mobile-navigation:not(.bon-kiosk-navigation) .tosc-mobile-category-badge {
                width: min(548px, calc(100vw - 18px)) !important;
                padding-left: 0.48rem !important;
                padding-right: 0.48rem !important;
                gap: 0.32rem !important;
            }

            body.is-toscpiu:not(.bon-kiosk-navigation) .tosc-mobile-category-place,
            body.bon-mobile-navigation:not(.bon-kiosk-navigation) .tosc-mobile-category-place {
                max-width: 30vw !important;
                font-size: 0.84rem !important;
            }

            body.is-toscpiu:not(.bon-kiosk-navigation) .tosc-mobile-category-link,
            body.bon-mobile-navigation:not(.bon-kiosk-navigation) .tosc-mobile-category-link {
                font-size: 0.86rem !important;
            }

            body.is-toscpiu:not(.bon-kiosk-navigation) .tosc-mobile-category-link svg,
            body.bon-mobile-navigation:not(.bon-kiosk-navigation) .tosc-mobile-category-link svg {
                width: 1.22rem !important;
                height: 1.22rem !important;
            }
        }
}


    #tosc-filter-backdrop.open {
        background: rgba(15, 23, 42, 0.22) !important;
    }
@keyframes spin { to { transform: rotate(360deg); } }
    /* ── Wizard Overlay ── */
    #tosc-wizard-overlay {
        position: fixed;
        inset: 0;
        z-index: 1500;
        background: #050505;
        backdrop-filter: blur(20px);
        -webkit-backdrop-filter: blur(20px);
        display: flex;
        align-items: center;
        justify-content: center;
        box-sizing: border-box;
        opacity: 0;
        pointer-events: none;
        transition: opacity 0.35s ease;
    }
    body.bon-has-dpad #tosc-wizard-overlay {
        padding-left: var(--bon-panel-safe-left, var(--bon-dpad-avoid-left, 0px));
        padding-right: calc(100vw - var(--bon-panel-safe-right, 100vw));
        padding-bottom: calc(var(--bon-nav-bottom-h, 90px) + 32px);
    }
    #tosc-wizard-overlay.open {
        opacity: 1;
        pointer-events: auto;
    }
    #tosc-wizard-box {
        width: min(680px, 94vw);
        background: #050505;
        border: 1px solid rgba(255,255,255,0.1);
        border-radius: 2rem;
        padding: 2.5rem 2rem 2rem;
        box-shadow: 0 40px 100px rgba(0,0,0,0.5);
        font-family: var(--bon-font);
        color: white;
        position: relative;
        max-height: 90vh;
        overflow-y: auto;
    }
    body.bon-has-dpad #tosc-wizard-box {
        width: min(680px, var(--bon-panel-safe-width, calc(100vw - 3rem)));
        max-height: calc(100vh - var(--bon-nav-bottom-h, 90px) - 64px);
    }
    #tosc-wizard-box::-webkit-scrollbar { display: none; }
    .twiz-close-btn {
        position: absolute;
        top: 1rem; right: 1rem;
        background: rgba(255,255,255,0.08);
        border: none;
        border-radius: 50%;
        width: 2.25rem; height: 2.25rem;
        color: #94a3b8;
        cursor: pointer;
        display: flex; align-items: center; justify-content: center;
        transition: background 0.2s;
    }
    .twiz-close-btn:hover { background: rgba(220,38,38,0.3); color: white; }

    /* Steps */
    .twiz-step { display: none; }
    .twiz-step.active { display: block; animation: twiz-in 0.3s ease; }
    @keyframes twiz-in {
        from { opacity:0; transform: translateY(16px); }
        to   { opacity:1; transform: translateY(0); }
    }

    .twiz-title {
        font-size: clamp(1.4rem, 4vw, 2rem);
        font-weight: 900;
        text-align: center;
        margin-bottom: 0.4rem;
    }
    .twiz-subtitle {
        text-align: center;
        color: #94a3b8;
        font-size: 0.9rem;
        margin-bottom: 1.5rem;
    }

    /* Grid buttons */
    .twiz-grid {
        display: grid;
        grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
        gap: 0.75rem;
    }
    .twiz-grid-comuni {
        display: flex;
        flex-wrap: wrap;
        gap: 0.6rem;
        justify-content: center;
    }
    .twiz-btn {
        background: rgba(255,255,255,0.07);
        border: 1px solid rgba(255,255,255,0.1);
        border-radius: 1rem;
        color: white;
        font-family: var(--bon-font);
        font-weight: 700;
        font-size: 0.95rem;
        padding: 1rem 0.75rem;
        cursor: pointer;
        transition: background 0.2s, transform 0.2s, border-color 0.2s;
        text-align: center;
    }
    .twiz-btn:hover {
        background: rgba(255,255,255,0.14);
        transform: translateY(-3px);
        border-color: rgba(255,255,255,0.25);
    }
    .twiz-btn-comune {
        background: rgba(255,255,255,0.07);
        border: 1px solid rgba(255,255,255,0.1);
        border-radius: 999px;
        color: white;
        font-family: var(--bon-font);
        font-weight: 700;
        font-size: 0.85rem;
        padding: 0.55rem 1.2rem;
        cursor: pointer;
        transition: background 0.2s, transform 0.15s;
    }
    .twiz-btn-comune:hover { background: rgba(255,255,255,0.15); transform: scale(1.05); }

    /* Category buttons */
    .twiz-grid-cat {
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        gap: 0.75rem;
        margin-bottom: 1.5rem;
    }
    @media (max-width: 480px) {
 .twiz-grid-cat { grid-template-columns: repeat(2, 1fr); }
}

    .twiz-btn-cat {
        position: relative;
        background: rgba(255,255,255,0.07);
        border: 1px solid rgba(255,255,255,0.1);
        border-radius: 1rem;
        color: white;
        font-family: var(--bon-font);
        font-weight: 700;
        font-size: 0.85rem;
        padding: 1.1rem 0.5rem 0.8rem;
        cursor: pointer;
        display: flex; flex-direction: column; align-items: center; gap: 0.5rem;
        transition: background 0.2s, transform 0.2s;
    }
    .twiz-btn-cat:hover { background: rgba(255,255,255,0.14); transform: translateY(-4px); }
    .twiz-btn-cat svg {
        width: 2.75rem; height: 2.75rem;
        background: white;
        border-radius: 50%;
        padding: 0.7rem;
        box-shadow: 0 6px 18px rgba(0,0,0,0.3);
    }
    .twiz-btn-cat[data-cat="ristoranti"] svg { color: #dc2626; border: 2px solid #dc2626; }
    .twiz-btn-cat[data-cat="alloggi"] svg { color: #2563eb; border: 2px solid #2563eb; }
    .twiz-btn-cat[data-cat="punti-interesse"] svg { color: #92400e; border: 2px solid #92400e; }
    .twiz-btn-cat[data-cat="eventi"] svg { color: #ea580c; border: 2px solid #ea580c; }

    /* Badge conteggio POI */
    .twiz-count {
        position: absolute;
        top: 0.5rem;
        right: 0.5rem;
        background: rgba(0,0,0,0.45);
        color: white;
        font-size: 0.7rem;
        font-weight: 800;
        padding: 0.15rem 0.5rem;
        border-radius: 999px;
        line-height: 1.4;
        pointer-events: none;
    }

    /* Nav controls */
    .twiz-nav {
        display: flex;
        justify-content: space-between;
        align-items: center;
        margin-top: 1.5rem;
    }
    .twiz-back-btn {
        background: transparent;
        border: none;
        color: #94a3b8;
        cursor: pointer;
        font-family: var(--bon-font);
        font-size: 0.9rem;
        font-weight: 600;
        padding: 0.5rem 0;
    }
    .twiz-back-btn:hover { color: white; }
    .twiz-all-btn {
        background: #3b82f6;
        border: none;
        color: white;
        padding: 0.7rem 1.5rem;
        border-radius: 999px;
        font-family: var(--bon-font);
        font-weight: 700;
        font-size: 0.9rem;
        cursor: pointer;
        box-shadow: 0 4px 15px rgba(59,130,246,0.4);
        transition: transform 0.2s;
    }
    .twiz-all-btn:hover { transform: scale(1.05); }

    /* Phase 4 UX theme pass: fullscreen TOSC wizard follows the shared panel grammar. */
    #tosc-wizard-overlay {
        background: rgba(15, 23, 42, 0.34) !important;
    }

    #tosc-wizard-box {
        background: var(--bon-surface-strong) !important;
        color: var(--bon-text) !important;
        border-color: var(--bon-border) !important;
        box-shadow: var(--bon-shadow-panel) !important;
    }

    .twiz-title,
    .twiz-btn,
    .twiz-btn-comune,
    .twiz-btn-cat,
    .twiz-back-btn,
    #twiz-lbl-town {
        color: var(--bon-text) !important;
    }

    .twiz-subtitle {
        color: var(--bon-text-muted) !important;
    }

    .twiz-btn,
    .twiz-btn-comune,
    .twiz-btn-cat,
    .twiz-close-btn {
        background: var(--bon-surface-soft) !important;
        border-color: var(--bon-border) !important;
        color: var(--bon-text) !important;
        box-shadow: var(--bon-shadow-card) !important;
    }

    .twiz-btn:hover,
    .twiz-btn-comune:hover,
    .twiz-btn-cat:hover,
    .twiz-close-btn:hover {
        background: var(--bon-surface) !important;
        border-color: var(--bon-border-strong) !important;
        color: var(--bon-text) !important;
    }

    .twiz-count {
        background: var(--bon-text) !important;
        color: var(--bon-surface) !important;
    }

    .twiz-all-btn {
        background: var(--bon-brand) !important;
        color: var(--bon-on-brand) !important;
        box-shadow: 0 12px 28px rgba(229, 37, 40, 0.24) !important;
    }

/* ─────────────────────────────────────────────────────────────
 * KIOSK EVENT CALENDAR STYLES (toscpiu & unpli)
 * ───────────────────────────────────────────────────────────── */

.tosc-kiosk-events-layout {
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
}

@media (min-width: 960px) {
    .tosc-kiosk-events-layout {
        display: grid;
        grid-template-columns: 360px minmax(0, 1fr);
        align-items: start;
        gap: 1.5rem;
    }
}

.tosc-kiosk-calendar-sidebar {
    width: 100%;
    position: relative;
    box-sizing: border-box;
}

@media (min-width: 960px) {
    .tosc-kiosk-calendar-sidebar {
        position: sticky;
        top: 1rem;
        z-index: 10;
    }
}

.tosc-kiosk-calendar-card {
    background: #ffffff;
    border-radius: 1.75rem;
    border: 1px solid rgba(226, 232, 240, 0.85);
    box-shadow: 0 12px 36px -8px rgba(15, 23, 42, 0.08), 0 4px 12px -2px rgba(15, 23, 42, 0.04);
    padding: 1.25rem;
    display: flex;
    flex-direction: column;
    gap: 1.15rem;
    user-select: none;
    touch-action: manipulation;
}

.tosc-kiosk-calendar-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-bottom: 0.25rem;
}

.tosc-kiosk-calendar-title-wrap {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    color: #0f172a;
    font-size: 1.1rem;
    font-weight: 800;
    letter-spacing: -0.02em;
}

.tosc-kiosk-calendar-icon {
    color: #e11d48;
}

.tosc-kiosk-calendar-reset-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.25rem;
    height: 2.25rem;
    border-radius: 50%;
    background: #f1f5f9;
    color: #475569;
    border: 1px solid #e2e8f0;
    cursor: pointer;
    transition: all 0.18s cubic-bezier(0.4, 0, 0.2, 1);
}

.tosc-kiosk-calendar-reset-btn:hover,
.tosc-kiosk-calendar-reset-btn:active {
    background: #fee2e2;
    color: #dc2626;
    border-color: #fca5a5;
    transform: rotate(-45deg);
}

/* Presets grid */
.tosc-kiosk-presets-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.55rem;
}

.tosc-kiosk-preset-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 2.85rem;
    padding: 0.45rem 0.65rem;
    border-radius: 1rem;
    background: #f8fafc;
    border: 1.5px solid #e2e8f0;
    color: #334155;
    font-size: 0.84rem;
    font-weight: 700;
    cursor: pointer;
    transition: all 0.15s ease;
    text-align: center;
    touch-action: manipulation;
}

.tosc-kiosk-preset-btn:hover {
    background: #f1f5f9;
    border-color: #cbd5e1;
    color: #0f172a;
}

.tosc-kiosk-preset-btn.active {
    background: #0f172a;
    border-color: #0f172a;
    color: #ffffff;
    box-shadow: 0 4px 14px rgba(15, 23, 42, 0.25);
}

/* Month widget */
.tosc-kiosk-month-widget {
    background: #f8fafc;
    border-radius: 1.35rem;
    border: 1px solid #e2e8f0;
    padding: 0.85rem 0.75rem 1rem;
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.tosc-kiosk-month-nav {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 0.25rem;
}

.tosc-kiosk-month-heading {
    font-size: 0.98rem;
    font-weight: 800;
    color: #0f172a;
    letter-spacing: -0.01em;
}

.tosc-kiosk-month-nav-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.35rem;
    height: 2.35rem;
    border-radius: 50%;
    background: #ffffff;
    color: #1e293b;
    border: 1px solid #cbd5e1;
    cursor: pointer;
    transition: all 0.15s ease;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.04);
}

.tosc-kiosk-month-nav-btn:hover,
.tosc-kiosk-month-nav-btn:active {
    background: #f1f5f9;
    color: #0f172a;
    border-color: #94a3b8;
}

.tosc-kiosk-weekdays-row {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    text-align: center;
}

.tosc-kiosk-weekday-label {
    font-size: 0.72rem;
    font-weight: 800;
    color: #94a3b8;
    text-transform: uppercase;
}

.tosc-kiosk-days-grid {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    gap: 0.35rem;
}

.tosc-kiosk-day-cell {
    aspect-ratio: 1 / 1;
    min-height: 2.45rem;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    position: relative;
    border-radius: 50%;
    background: transparent;
    border: 1.5px solid transparent;
    color: #1e293b;
    font-size: 0.88rem;
    font-weight: 700;
    cursor: pointer;
    transition: all 0.12s ease;
    padding: 0;
    margin: 0;
    touch-action: manipulation;
}

.tosc-kiosk-day-cell:hover:not(:disabled) {
    background: #e2e8f0;
    color: #0f172a;
}

.tosc-kiosk-day-cell.is-other-month {
    color: #cbd5e1;
    opacity: 0.55;
}

.tosc-kiosk-day-cell.is-past:disabled {
    color: #cbd5e1;
    opacity: 0.35;
    cursor: not-allowed;
}

.tosc-kiosk-day-cell.is-today {
    border-color: #0f172a;
    font-weight: 800;
}

.tosc-kiosk-day-cell.is-selected {
    background: #e11d48 !important;
    border-color: #e11d48 !important;
    color: #ffffff !important;
    box-shadow: 0 4px 12px rgba(225, 29, 72, 0.35);
    font-weight: 800;
}

.tosc-kiosk-day-dot {
    position: absolute;
    bottom: 3px;
    left: 50%;
    transform: translateX(-50%);
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background: #059669;
}

.tosc-kiosk-day-cell.is-selected .tosc-kiosk-day-dot {
    background: #ffffff;
}

/* Active filter pill tag in toolbar */
.tosc-kiosk-active-date-badge {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    padding: 0.35rem 0.85rem;
    border-radius: 2rem;
    background: #fee2e2;
    color: #991b1b;
    border: 1px solid #fecaca;
    font-size: 0.8rem;
    font-weight: 800;
    letter-spacing: 0.01em;
}

.tosc-kiosk-events-main {
    display: flex;
    flex-direction: column;
    gap: 0.85rem;
    min-width: 0;
}
