/**
 * CookiesToo - Mobile slide visibility fixes
 * Obiettivo: mantenere sempre visibili i bottoni azione (OK/Salva) su mobile
 * senza toccare i CSS esistenti: sovrascrivo soltanto dove serve.
 */

/* Migliora l'area scorrevole e considera le safe-area dei device moderni */
.cookiestoo-banner-container {
    -webkit-overflow-scrolling: touch;
    max-height: 92vh; /* fallback sicuro */
}

@supports (height: 100dvh) {
    .cookiestoo-banner-container {
        max-height: 100dvh; /* usa il viewport dinamico su iOS/Android moderni */
    }
}

/* Riduce lo spazio prima delle azioni per recuperare verticalità */
.cookiestoo-categories {
    margin-bottom: 16px !important;
}

/* Aggiunge padding inferiore per non far coprire i contenuti dalla barra del browser */
.cookiestoo-banner-content {
    padding-bottom: calc(24px + env(safe-area-inset-bottom)) !important;
    padding-bottom: calc(24px + constant(safe-area-inset-bottom)) !important; /* fallback Safari vecchio */
}

/* Barra azioni sticky: resta ancorata in fondo all'area scorrevole */
.cookiestoo-banner-actions {
    position: sticky;
    bottom: 0;
    background: #ffffff;
    padding-top: 12px;
    padding-bottom: calc(12px + env(safe-area-inset-bottom));
    padding-bottom: calc(12px + constant(safe-area-inset-bottom));
    margin-bottom: 0 !important;
    box-shadow: 0 -8px 16px rgba(0, 0, 0, 0.06);
    z-index: 5;
}

/* Migliora l'usabilità su schermi stretti */
@media (max-width: 768px) {
    /* Mobile button layout: first 2 buttons side-by-side, third button full-width */
    .cookiestoo-banner-actions {
        display: flex;
        flex-wrap: wrap;
        gap: 12px;
    }

    /* First two buttons: 50% width each (side by side) */
    .cookiestoo-btn:nth-child(1),
    .cookiestoo-btn:nth-child(2) {
        flex: 1 1 calc(50% - 6px);
        min-width: 0;
    }

    /* Third button: full width */
    .cookiestoo-btn:nth-child(3) {
        flex: 1 1 100%;
        width: 100%;
    }
}