/* Toggle button día/noche - Estilos compartidos */
#day-night-toggle {
    position: fixed;
    top: 16px;
    right: 16px;
    z-index: 1050;
    width: 48px;
    height: 48px;
    border-radius: 12px;
    background: rgba(255, 255, 255, 0.9);
    border: none;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s ease;
}

#day-night-toggle:hover {
    transform: scale(1.05);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
}

#day-night-toggle img {
    width: 24px;
    height: 24px;
}

body.night-mode #day-night-toggle {
    background: rgba(0, 0, 0, 0.8);
}

/* Ajustes para móviles - evitar que tape el menú */
@media (max-width: 991.98px) {
    #day-night-toggle {
        top: 70px; /* Debajo del navbar en móviles */
        right: 60px; /* Más a la izquierda para no tapar el botón del menú hamburguesa */
        width: 40px;
        height: 40px;
    }
    
    #day-night-toggle img {
        width: 20px;
        height: 20px;
    }
}

/* Ajustes adicionales para pantallas muy pequeñas (como Samsung S8) */
@media (max-width: 576px) {
    #day-night-toggle {
        top: 70px;
        right: 70px; /* Aún más a la izquierda en pantallas pequeñas */
        width: 36px;
        height: 36px;
    }
    
    #day-night-toggle img {
        width: 18px;
        height: 18px;
    }
}