/**
 * ECONATOURS: UI MODAL SYSTEM v6.2 🚀
 * Fix: Scroll Infinito, Header Fijo y Estructura Mobile-First.
 */

/* 1. OVERLAY (CRISTAL ESMERILADO) */
.eco-modal-admin-overlay {
    position: fixed;
    top: 0; left: 0;
    width: 100vw; 
    height: 100vh;
    background: rgba(15, 23, 42, 0.7);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    display: none; /* Se activa con flex vía JS */
    align-items: center;
    justify-content: center;
    z-index: 9999999 !important;
    padding: 0; /* Quitamos padding para evitar saltos */
}

/* 2. VENTANA PRINCIPAL (AERO-STYLE) */
.eco-modal-admin-window {
    background: #ffffff;
    width: 100%;
    max-width: 600px;
    height: auto;
    max-height: 90vh; /* Evita que se salga de la pantalla */
    border-radius: 28px;
    box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.5);
    display: flex;
    flex-direction: column; /* CRÍTICO: Mantiene Header y Footer fijos */
    overflow: hidden; /* Evita scroll doble */
    position: relative;
    animation: ecoModalPop 0.35s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

/* 3. CABECERA FIJA */
.eco-modal-header {
    padding: 22px 28px;
    border-bottom: 1.5px solid #f1f5f9;
    display: flex;
    justify-content: space-between;
    align-items: center;
    background: #fff;
    flex-shrink: 0; /* Evita que el header se aplaste */
    z-index: 10;
}

/* 4. CUERPO CON SCROLL ACTIVO (Aquí estaba el congelamiento) */
.eco-modal-body {
    padding: 28px;
    overflow-y: auto !important; /* Habilita scroll interno */
    flex: 1 1 auto; /* Ocupa todo el espacio entre header y footer */
    -webkit-overflow-scrolling: touch; /* Scroll suave en iOS */
    scrollbar-width: thin; /* Scroll estético en Firefox */
    scrollbar-color: #cbd5e1 #ffffff;
}

/* 5. FOOTER FIJO (Si lo usas para botones de acción) */
.eco-modal-footer {
    padding: 18px 28px;
    background: #f8fafc;
    border-top: 1px solid #f1f5f9;
    flex-shrink: 0;
    display: flex;
    justify-content: flex-end;
}

/* 6. ADAPTACIÓN MÓVIL (TIPO SHEET) */
@media (max-width: 480px) {
    .eco-modal-admin-window {
        max-height: 95vh; /* Casi toda la pantalla */
        border-radius: 30px 30px 0 0;
        position: absolute; /* Cambiado a absolute para mejor control */
        bottom: 0;
        width: 100%;
    }

    .eco-modal-body {
        padding: 20px;
        /* Padding extra al fondo para que el último input no quede tras el dock de iOS/Android */
        padding-bottom: 80px; 
    }
}

/* Scrollbar para Chrome/Safari */
.eco-modal-body::-webkit-scrollbar { width: 6px; }
.eco-modal-body::-webkit-scrollbar-thumb { background: #cbd5e1; border-radius: 10px; }