/*
Theme Name: Solo en calma
Theme URI: https://soloencalma.com
Description: Tema hijo de Divi para soloencalma.com. Aloja el sistema de diseño, el panel del tutor y el aula. El constructor solo interviene en las páginas públicas; el panel, el aula, el carrito, el pago y mi cuenta se maquetan aquí.
Author: MUX Studio
Author URI: https://muxstudio.com
Template: Divi
Version: 0.1.0
Requires PHP: 8.1
Text Domain: solo-child
*/

/* Las hojas reales se encolan desde inc/assets.php. Este archivo existe porque
   WordPress lo exige para identificar el tema; no se escribe estilo aquí. */

/*
 * Foco visible por teclado, en TODAS las pantallas.
 *
 * POR QUE ESTA AQUI Y NO EN base.css:
 * base.css solo se encola en las pantallas de aplicacion (panel, aula, carrito, pago,
 * mi cuenta). En las paginas publicas, que van con Divi, no se carga — asi que su regla
 * de foco no existia ahi. Medido antes de esto: 0 de 41 elementos focalizables de la
 * portada tenian indicador de foco.
 *
 * POR QUE LLEVA !important:
 * Divi anula el contorno con su propio reset y mas especificidad. Sin esto no hay foco
 * visible, y navegar con teclado se vuelve imposible. Es accesibilidad, no gusto.
 *
 * POR QUE NO USA :where():
 * :where() tiene especificidad cero, que es justo lo que hace que Divi gane.
 */
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
summary:focus-visible,
[tabindex]:focus-visible,
[contenteditable]:focus-visible,
.et_pb_button:focus-visible,
#main-header a:focus-visible,
#top-menu a:focus-visible,
.et_pb_menu a:focus-visible,
#main-footer a:focus-visible {
	/* Las tres propiedades por separado, no el atajo: el reinicio de Divi fija
	   outline-width a 0 aparte, y con el atajo el ancho se quedaba en 0px aunque
	   el estilo y el color sí llegaran. */
	outline-style: solid !important;
	outline-width: 2px !important;
	outline-color: var(--sc-divi-foco, var(--sc-acento-500)) !important;
	outline-offset: 2px !important;
	/* Respaldo para lo que recorte el contorno con overflow. */
	box-shadow: 0 0 0 2px var(--sc-divi-foco, var(--sc-acento-500)) !important;
	/* El anillo aparece de inmediato. Divi pone `transition: all .4s` en los
	   enlaces del menu y el contorno transitaba con todo lo demas: medido el
	   2026-08-25, a mitad de camino el indicador era de 1px y de un tono mas
	   apagado, y solo a los 400 ms llegaba a 2px y al color de foco. Quien
	   navega rapido con el teclado veia un anillo a medias en cada salto. */
	transition: none !important;
}

/* El raton no arrastra el anillo: solo aparece en navegacion por teclado. */
:focus:not(:focus-visible) {
	outline: none;
}

/* En modo de alto contraste el color del sistema manda sobre el de marca. */
@media (forced-colors: active) {
	a:focus-visible,
	button:focus-visible,
	.et_pb_button:focus-visible {
		outline-color: Highlight !important;
	}
}