/* ==========================================================================
   NEXTZHOP HUB MOBILE MENU (V42.6 - EDITORIAL GLASS / ZERO-LIGHT)
   Responsabilidad: Barra inferior responsiva aislada del chasis core.
   Arquitectura: Hereda colores del Motor de Temas (SSOT).
   ========================================================================== */

.nz-bottom-nav-base { 
    position: fixed; 
    bottom: 0; 
    left: 12px; 
    right: 12px; 
    width: auto; 
    z-index: 9900;
    padding-bottom: calc(env(safe-area-inset-bottom) * 0.5);
    
    /* 🚀 Recorte poligonal técnico para forzar la inclinación / \ */
    clip-path: polygon(4% 0%, 96% 0%, 100% 100%, 0% 100%);

    /* 🚀 Fondo heredado del Theme Engine */
    background-color: var(--hub-bg-app); 
    transform: translateZ(0);
    transition: background-color var(--hub-transition, 0.3s), border-color var(--hub-transition, 0.3s);
}

/* 🚀 EL CORTE DE BISTURÍ: Línea superior reflectante simulando cristal biselado */
.nz-bottom-nav-base::before {
    content: '';
    position: absolute;
    top: 0; left: 0; right: 0;
    height: 1px;
    background: linear-gradient(90deg, transparent 0%, rgba(255,255,255,0.15) 50%, transparent 100%);
    z-index: 20;
    pointer-events: none;
}

/* 🚀 PROTOCOLO EDITORIAL GLASS: Transparencia avanzada dictada por el tema */
body.theme-editorial .nz-bottom-nav-base,
.nz-bottom-nav-base {
    background-color: var(--hub-bg-glass, rgba(10, 10, 10, 0.85));
    backdrop-filter: var(--hub-backdrop-filter, blur(24px) saturate(180%));
    -webkit-backdrop-filter: var(--hub-backdrop-filter, blur(24px) saturate(180%));
}

/* Ocultar en pantallas de escritorio o tablets grandes */
@media (min-width: 768px) { 
    .nz-bottom-nav-base { display: none; } 
}

.nz-bottom-nav-inner {
    position: relative; 
    display: flex; 
    align-items: center; 
    justify-content: space-between; 
    width: 100%; 
    padding: 0 16px; 
    
    /* 🚀 ENCAPSULAMIENTO */
    overflow: hidden; 
    border-radius: 20px 20px 0 0;
    height: 55px; /* Altura ajustada para que respiren los vectores puros */
}

/* Botones de Navegación Pura */
.nz-nav-btn, .nz-nav-action-slot { 
    position: relative; 
    z-index: 10; 
    padding: 12px; 
    display: flex; 
    flex-direction: column; 
    align-items: center; 
    justify-content: center; 
    height: 100%; 
    flex: 1;
    transition: opacity 0.3s cubic-bezier(0.16, 1, 0.3, 1), transform 0.2s; 
}

/* Contraste Brutalista: Opacidad pura como indicador de estado */
.nz-nav-btn.is-active { opacity: 1; color: var(--hub-text-main); }
.nz-nav-btn.is-inactive { opacity: 0.3; color: var(--hub-text-main); }
.nz-nav-btn.is-inactive:hover { opacity: 0.8; transform: translateY(-2px); }

/* Contenedor del botón central */
.nz-nav-action-slot {
    padding: 0 8px; 
    display: flex; 
    justify-content: center;
}

/* 🚀 Botón de Cámara: Vector Puro, Inerte y Plano */
.nz-camera-trigger {
    background-color: transparent; 
    color: var(--hub-text-main);
    border: none; 
    padding: 0;
    display: inline-flex; 
    align-items: center; 
    justify-content: center;
    cursor: pointer; 
    opacity: 0.3; /* Igualado al estado inactivo del resto */
    transition: opacity 0.3s cubic-bezier(0.16, 1, 0.3, 1), transform 0.2s;
}
.nz-camera-trigger:hover { opacity: 1; transform: translateY(-2px); }
.nz-camera-trigger:active { transform: scale(0.9); }

/* 🚀 PURGA: Se han eliminado intencionalmente los bloques de animaciones Laser Scan, 
   texturas punteadas de fondo y los puntos indicadores (dots) para mantener la limpieza visual. */