/* Transiciones suaves para cambios de tema */
* {
    transition: background-color 0.2s ease-in-out, 
                color 0.2s ease-in-out, 
                border-color 0.2s ease-in-out;
}

/* Evitar transiciones en elementos críticos durante la carga inicial */
html[data-theme] * {
    transition: none;
}

/* Aplicar transiciones solo después de que la página esté completamente cargada */
html.theme-loaded * {
    transition: background-color 0.2s ease-in-out, 
                color 0.2s ease-in-out, 
                border-color 0.2s ease-in-out;
}

/* Clase para elementos que no deben tener transición */
.no-transition {
    transition: none !important;
}