/* Pulsante condividi nascosto su desktop */
.share-btn {
    display: none;
}

/**
 * Stili mobile specifici per la pagina evento
 * Modifiche solo per dispositivi mobile (max-width: 767px)
 */

@media screen and (max-width: 767px) {

    /* 1. Logo più piccolo - dimensione standard */
    .logo-custom {
        width: 100px !important;
        max-width: 100px !important;
    }

    /* 2. Icona menu hamburger più piccola */
    .hamburger-circle {
        width: 60px !important;
        height: 60px !important;
    }

    .hamburger-circle .rotate-image.menu-text {
        width: 60px !important;
    }

    .menu-square {
        transform: scale(0.7);
    }

    /* 3. Rimuovere lo sfondo sfumato con immagine - sfondo nero */
    .section-blurred-image::before {
        display: none !important;
        background: none !important;
    }

    .section-image {
        display: none !important;
    }

    .page-wrapper.section-blurred-image {
        background: #000000 !important;
    }

    .page-content.dark {
        background: #000000 !important;
    }

    /* 4. Pulsante "Acquista Ora" con sfondo bianco e testo nero */
    .sticky-footer {
        background: #ffffff !important;
        -webkit-backdrop-filter: none !important;
        backdrop-filter: none !important;
    }

    .sticky-footer .small-font {
        color: #000000 !important;
    }

    .sticky-footer .container {
        color: #000000 !important;
    }

    .info-flex {
        background-color: transparent !important;
    }

    /* 5. Riduzione spazi verticali tra header, immagine e titolo */
    .section.for-inner {
        padding-top: 80px !important;
    }

    .margin-50px {
        margin-top: 15px !important;
    }

    .project-grid-main {
        grid-row-gap: 10px !important;
    }

    .info-flex {
        padding: 10px 8px !important;
    }

    .display-2#nome_evento {
        margin-bottom: 10px !important;
        font-size: 26px !important;
        line-height: 1.25 !important;
    }

    /* 7. Info compatte - più tight */
    .event-info-compact {
        gap: 4px !important;
        margin-bottom: 8px !important;
    }

    /* Pulsante condividi su immagine */
    .event-image-wrapper {
        position: relative;
    }

    .share-btn {
        position: absolute;
        bottom: 12px;
        right: 12px;
        width: 42px;
        height: 42px;
        border-radius: 50%;
        background: rgba(0, 0, 0, 0.55);
        -webkit-backdrop-filter: blur(10px);
        backdrop-filter: blur(10px);
        border: 1px solid rgba(255, 255, 255, 0.15);
        color: #fff;
        font-size: 20px;
        display: flex;
        align-items: center;
        justify-content: center;
        cursor: pointer;
        transition: all 0.2s ease;
        z-index: 5;
        padding: 0;
    }

    .share-btn:active {
        transform: scale(0.9);
        background: rgba(0, 0, 0, 0.7);
    }

    .event-info-compact span {
        font-size: 12px !important;
    }

    /* 8. Pulsanti biglietto - più moderni */
    .ticket-button {
        border-color: rgba(255, 255, 255, 0.2) !important;
        padding: 14px 16px !important;
        margin-bottom: 10px !important;
    }

    .ticket-label {
        font-size: 14px !important;
    }

    .prezzo-ticket {
        font-size: 13px !important;
        opacity: 0.7;
    }

    .minus-button,
    .plus-button {
        width: 34px !important;
        height: 34px !important;
        font-size: 18px !important;
    }

    /* 9. CTA Acquista - più prominente */
    .apri-acquisto {
        padding: 16px !important;
        font-size: 16px !important;
        font-weight: 600 !important;
    }

    /* 10. Testo massimo biglietti - meno invadente */
    .margin-30px .copyright {
        font-size: 11px !important;
        opacity: 0.6;
    }

    /* 11. Soldout e esaurito badge */
    .soldout-ticket {
        margin-bottom: 10px !important;
    }

    /* 12. Footer sticky - più compatto */
    .sticky-footer {
        padding: 14px !important;
    }

    .sticky-footer .small-font {
        font-size: 15px !important;
        font-weight: 600 !important;
    }


    /* 6. Sezione mappa migliorata */
    .venue-section-divider {
        width: 40px;
        height: 3px;
        background: rgba(255, 255, 255, 0.15);
        border-radius: 2px;
        margin: 30px auto 0;
    }

    .venue-header {
        display: flex;
        align-items: center;
        gap: 12px;
        margin-bottom: 16px;
    }

    .venue-header-icon {
        font-size: 22px;
        color: #fff;
        opacity: 0.8;
        flex-shrink: 0;
    }

    .venue-header-text {
        display: flex;
        flex-direction: column;
        gap: 2px;
    }

    .venue-header-name {
        color: #fff;
        font-size: 15px;
        font-weight: 600;
        line-height: 1.3;
    }

    .venue-header-address {
        color: rgba(255, 255, 255, 0.5);
        font-size: 12px;
        font-weight: 400;
        line-height: 1.3;
    }

    .venue-actions {
        display: flex;
        gap: 10px;
        margin-top: 14px;
    }

    .venue-action-btn {
        flex: 1;
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 8px;
        padding: 12px 16px;
        background: rgba(255, 255, 255, 0.1);
        border: 1px solid rgba(255, 255, 255, 0.12);
        border-radius: 10px;
        color: #fff;
        font-size: 13px;
        font-weight: 500;
        text-decoration: none;
        transition: background 0.2s ease;
    }

    .venue-action-btn:hover,
    .venue-action-btn:active {
        background: rgba(255, 255, 255, 0.18);
    }

    .venue-action-btn i {
        font-size: 18px;
        opacity: 0.9;
    }

}