/**
 * Hide-UI System
 * Nasconde header e bottom navigation per specifiche view
 * e ottimizza lo spazio disponibile
 * 
 * Regole:
 * - Landing (inLanding) → Barre VISIBILI
 * - Storico (screenOut) → Barre VISIBILI
 * - Tutte le altre view → Barre NASCOSTE + spazio ottimizzato
 */

/* Stato di default: tutte le barre visibili */
body {
    --header-visible: 1;
    --bottom-nav-visible: 1;
}

/* ==========================================
   QUANDO BARRE NASCOSTE
   ========================================== */

/* Nascondi header e bottom nav con animazione */
body.hide-ui .fixed-header {
    transform: translateY(-100%);
    opacity: 0;
    pointer-events: none;
}

body.hide-ui .bottom-nav {
    transform: translateY(100%);
    opacity: 0;
    pointer-events: none;
}

/* Transizioni smooth */
.fixed-header,
.bottom-nav {
    transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1),
                opacity 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

/* ==========================================
   OTTIMIZZAZIONE SPAZIO
   ========================================== */

/* Main container usa TUTTO lo spazio quando UI nascosta */
body.hide-ui .main-container {
    top: 0 !important;
    bottom: 0 !important;
    height: 100vh !important; /* Forza altezza completa */
}

/* Screen usa tutto lo spazio disponibile */
body.hide-ui .screen {
    height: 100vh !important;
    min-height: 100vh !important;
    padding-top: 0 !important;
}

/* Screen content senza padding top quando UI nascosta */
body.hide-ui .screen-content {
    padding-top: 0 !important;
    min-height: 100vh;
}

/* Form header diventa sticky top 0 invece di sotto header */
body.hide-ui .form-header {
    position: sticky;
    top: 0;
    z-index: 100;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
}

/* Padding container ottimizzato per fullscreen */
body.hide-ui .landing-content,
body.hide-ui .entry-form,
body.hide-ui .archive-container,
body.hide-ui .cart-container,
body.hide-ui .select-container,
body.hide-ui .settings-container {
    padding-top: 0 !important;
    padding-bottom: 16px !important; /* Ridotto per minimizzare scroll */
}

/* View occupano tutto lo spazio verticale disponibile */
body.hide-ui .view {
    min-height: 100vh;
}

/* Form header senza margin quando UI nascosta */
body.hide-ui .form-header {
    margin-bottom: 0;
}

/* Summary content con più spazio verticale */
body.hide-ui .summary-header {
    padding-top: 32px;
}

body.hide-ui .summary-content,
body.hide-ui .summary-list {
    padding-bottom: 32px;
}

/* Success screen centrato verticalmente */
body.hide-ui .success-content {
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 40px 20px;
}

/* Archivio con padding top ridotto */
body.hide-ui #inArchivio .archive-container {
    padding-top: 0;
}

/* Lista articoli selezione con padding bottom maggiore */
body.hide-ui .articoli-list,
body.hide-ui .select-articoli-list {
    padding-bottom: 40px;
}

/* ==========================================
   ANIMAZIONI QUANDO TORNI CON BARRE
   ========================================== */

/* Animazione smooth quando torni alla landing */
body:not(.hide-ui) .fixed-header {
    transform: translateY(0);
    opacity: 1;
}

body:not(.hide-ui) .bottom-nav {
    transform: translateY(0);
    opacity: 1;
}

/* Ripristina padding normale */
body:not(.hide-ui) .main-container {
    top: var(--header-height);
    bottom: 0;
}

/* ==========================================
   SPECIFICHE PER SINGOLE VIEW
   ========================================== */

/* Riepilogo: ottimizzato per usare tutto lo spazio */
body.hide-ui #inSummary {
    display: flex !important;
    flex-direction: column;
    min-height: 100vh;
    justify-content: space-between;
}

/* Header riepilogo più compatto */
body.hide-ui #inSummary .summary-header {
    padding-top: 20px;
    padding-bottom: 16px;
}

/* Lista riepilogo compatta */
body.hide-ui #inSummary .summary-list {
    padding: 0 20px;
    margin-bottom: 16px;
}

/* Grand total compatto */
body.hide-ui #inSummary .summary-grand-total {
    margin: 0 20px 16px;
    padding: 16px;
}

body.hide-ui #inSummary .confirm-section {
    flex: 0 0 auto;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 20px;
}

/* Form articolo con scroll ottimizzato */
body.hide-ui #inArticoloForm .entry-form {
    min-height: calc(100vh - 80px);
}

/* Lista carrello ottimizzata */
body.hide-ui #inLista .cart-container {
    min-height: 100vh;
    padding-bottom: 100px;
}

/* ==========================================
   RESPONSIVE
   ========================================== */

@media (max-width: 380px) {
    body.hide-ui .summary-header {
        padding-top: 24px;
    }
    
    body.hide-ui .success-content {
        padding: 32px 20px;
    }
}

@media (min-height: 800px) {
    /* Su schermi alti, ancora più spazio per contenuto */
    body.hide-ui .confirm-section {
        padding: 60px 20px;
    }
}