/* ========================================
   SOLO BOTÓN INICIAR SESIÓN EN MÓVILES
   Sin menú hamburguesa
   ======================================== */

@media (max-width: 768px) {
    /* Ocultar menú hamburguesa completamente */
    .nav-toggle {
        display: none !important;
    }
    
    /* Ocultar todos los enlaces del menú en móviles */
    .nav-menu {
        position: static !important;
        display: flex !important;
        flex-direction: row !important;
        align-items: center !important;
        justify-content: flex-end !important;
        gap: 0 !important;
        padding: 0 !important;
        background: transparent !important;
        box-shadow: none !important;
        height: auto !important;
        width: auto !important;
        flex-shrink: 0;
    }
    
    /* Ocultar todos los enlaces excepto el botón de login */
    .nav-menu .nav-link {
        display: none !important;
    }
    
    /* Mostrar SOLO el botón de Iniciar Sesión */
    .nav-menu .nav-btn {
        display: inline-flex !important;
        align-items: center;
        gap: 8px;
        padding: 10px 20px;
        font-size: 14px;
        border-radius: 25px;
        background: linear-gradient(135deg, #7B4397 0%, #1E9A8A 100%);
        color: white;
        text-decoration: none;
        font-weight: 600;
        box-shadow: 0 4px 12px rgba(123, 67, 151, 0.3);
        transition: all 0.3s ease;
        white-space: nowrap;
        flex-shrink: 0;
    }
    
    .nav-menu .nav-btn:hover,
    .nav-menu .nav-btn:active {
        transform: translateY(-2px);
        box-shadow: 0 6px 16px rgba(123, 67, 151, 0.4);
    }
    
    /* Navbar con mejor espaciado */
    .navbar {
        padding: 0;
        box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
    }
    
    .nav-container {
        padding: 12px 15px;
        display: flex;
        justify-content: space-between;
        align-items: center;
        gap: 15px;
    }
    
    /* Logo con mejor manejo de espacio */
    .nav-logo {
        font-size: 1.2rem;
        gap: 8px;
        flex-shrink: 1;
        min-width: 0;
        display: flex;
        align-items: center;
    }
    
    .nav-logo img {
        height: 35px;
        width: auto;
        flex-shrink: 0;
    }
    
    .nav-logo span {
        font-size: 1.1rem;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
}

/* ========================================
   AJUSTES PARA iPhone 15 (390px)
   Más espacio entre logo y botón
   ======================================== */
@media (max-width: 430px) {
    .nav-container {
        padding: 10px 12px;
        gap: 12px;
    }
    
    .nav-logo {
        font-size: 1rem;
        gap: 6px;
    }
    
    .nav-logo img {
        height: 30px;
    }
    
    .nav-logo span {
        font-size: 1rem;
    }
    
    .nav-menu .nav-btn {
        padding: 8px 16px;
        font-size: 13px;
        gap: 6px;
    }
}

/* ========================================
   AJUSTES PARA PANTALLAS MUY PEQUEÑAS
   iPhone SE, etc. (375px y menos)
   ======================================== */
@media (max-width: 375px) {
    .nav-container {
        padding: 10px 10px;
        gap: 10px;
    }
    
    .nav-logo {
        font-size: 0.95rem;
        gap: 5px;
    }
    
    .nav-logo img {
        height: 28px;
    }
    
    .nav-logo span {
        font-size: 0.95rem;
    }
    
    .nav-menu .nav-btn {
        padding: 8px 14px;
        font-size: 12px;
        gap: 5px;
    }
    
    .nav-menu .nav-btn i {
        font-size: 12px;
    }
}

/* ========================================
   FIN DEL ARCHIVO
   ======================================== */
