/**
 * Emaús — estilos del frontend.
 *
 * No se declara ninguna familia tipográfica: todo hereda la del tema, de modo
 * que el Camino se integra visualmente con la web sin imponer nada. Fondo
 * blanco, sin cajas de color, y el color de marca reservado a la tipografía y
 * a los elementos interactivos.
 *
 * Las filas del listado son <button> por accesibilidad (se pueden usar con el
 * teclado). Eso hace que los temas les apliquen sus estilos de botón: fondos de
 * color, mayúsculas, espaciado entre letras, sombras… Por eso las reglas de
 * .emaus-jornada__fila neutralizan explícitamente esa herencia. Se usa la
 * especificidad de .emaus-camino como prefijo en lugar de !important, para que
 * el administrador pueda seguir personalizando desde Elementor.
 */

.emaus-camino {
	--emaus-color: #3F63DF;
	--emaus-apagado: #b9b9b9;
	--emaus-linea: #ececec;
	--emaus-aviso: #c0392b;
	background: #fff;
	max-width: 100%;
}

.emaus-camino * {
	box-sizing: border-box;
}

/* Aviso sobre el progreso local. */
.emaus-camino .emaus-aviso {
	color: var(--emaus-aviso);
	font-size: 0.9em;
	margin: 0 0 1.5rem;
	text-align: center;
}

/* Bloque de comienzo. */
.emaus-camino .emaus-start {
	margin: 0 0 2rem;
	text-align: center;
}

.emaus-camino .emaus-start__text {
	color: inherit;
	margin: 0 0 1rem;
}

.emaus-camino .emaus-button {
	background: var(--emaus-color);
	border: 0;
	border-radius: 6px;
	color: #fff;
	cursor: pointer;
	display: inline-block;
	font: inherit;
	line-height: 1.2;
	padding: 0.9em 2.4em;
	text-transform: none;
}

.emaus-camino .emaus-button:hover,
.emaus-camino .emaus-button:focus-visible {
	background: var(--emaus-color);
	color: #fff;
	filter: brightness(0.92);
}

/* Listado de Jornadas. */
.emaus-camino .emaus-lista {
	list-style: none;
	margin: 0;
	padding: 0;
}

.emaus-camino .emaus-jornada {
	border-bottom: 1px solid var(--emaus-linea);
}

.emaus-camino .emaus-jornada:last-child {
	border-bottom: 0;
}

/*
 * Reinicio de los estilos de botón del tema.
 */
.emaus-camino .emaus-jornada__fila,
.emaus-camino .emaus-jornada__fila:hover,
.emaus-camino .emaus-jornada__fila:focus,
.emaus-camino .emaus-jornada__fila:active {
	align-items: center;
	background: #fff;
	background-image: none;
	border: 0;
	border-radius: 0;
	box-shadow: none;
	color: inherit;
	display: flex;
	font: inherit;
	gap: 1rem;
	letter-spacing: normal;
	line-height: inherit;
	margin: 0;
	min-height: 0;
	outline: none;
	padding: 1.1em 0.5em;
	text-align: left;
	text-decoration: none;
	text-transform: none;
	width: 100%;
}

.emaus-camino .emaus-jornada__fila {
	cursor: pointer;
	transition: color 0.15s ease;
}

.emaus-camino .emaus-jornada__fila:focus-visible {
	outline: 2px solid var(--emaus-color);
	outline-offset: -2px;
}

.emaus-camino .emaus-jornada__fila:hover .emaus-jornada__titulo {
	color: var(--emaus-color);
}

/* Icono: triángulo de reproducción; candado si está bloqueada. */
.emaus-camino .emaus-jornada__icono {
	border-color: transparent transparent transparent currentColor;
	border-style: solid;
	border-width: 0.42em 0 0.42em 0.65em;
	color: var(--emaus-apagado);
	flex: 0 0 auto;
	height: 0;
	width: 0;
}

.emaus-camino .emaus-jornada__numero {
	color: #9a9a9a;
	flex: 0 0 auto;
	font-size: 0.85em;
	font-variant-numeric: tabular-nums;
	letter-spacing: normal;
	min-width: 1.8em;
}

.emaus-camino .emaus-jornada__titulo {
	flex: 1 1 auto;
}

/* Sub-Jornada: mismo día que su Jornada principal, con sangría. */
.emaus-camino .emaus-jornada--hija .emaus-jornada__fila {
	padding-left: 2.4em;
}

.emaus-camino .emaus-jornada--hija .emaus-jornada__titulo,
.emaus-camino .emaus-jornada--hija .emaus-jornada__numero {
	font-size: 0.95em;
}

.emaus-camino .emaus-jornada__duracion {
	color: #9a9a9a;
	flex: 0 0 auto;
	font-size: 0.9em;
	letter-spacing: normal;
}

.emaus-camino .emaus-jornada__estado {
	color: var(--emaus-color);
	flex: 0 0 auto;
	font-size: 0.8em;
	letter-spacing: normal;
	text-transform: none;
}

/* Jornada del día. */
.emaus-camino .emaus-jornada.is-hoy .emaus-jornada__titulo,
.emaus-camino .emaus-jornada.is-hoy .emaus-jornada__numero,
.emaus-camino .emaus-jornada.is-hoy .emaus-jornada__icono {
	color: var(--emaus-color);
}

/* Jornada bloqueada. */
.emaus-camino .emaus-jornada.is-bloqueada .emaus-jornada__fila {
	cursor: not-allowed;
}

.emaus-camino .emaus-jornada.is-bloqueada .emaus-jornada__titulo,
.emaus-camino .emaus-jornada.is-bloqueada .emaus-jornada__numero,
.emaus-camino .emaus-jornada.is-bloqueada .emaus-jornada__duracion,
.emaus-camino .emaus-jornada.is-bloqueada .emaus-jornada__fila:hover .emaus-jornada__titulo {
	color: var(--emaus-apagado);
}

/* Candado dibujado con CSS, sin imágenes ni librerías de iconos. */
.emaus-camino .emaus-jornada.is-bloqueada .emaus-jornada__icono {
	border: 1px solid var(--emaus-apagado);
	border-radius: 2px;
	height: 0.72em;
	position: relative;
	width: 0.85em;
}

.emaus-camino .emaus-jornada.is-bloqueada .emaus-jornada__icono::before {
	border: 1px solid var(--emaus-apagado);
	border-bottom: 0;
	border-radius: 3px 3px 0 0;
	content: "";
	height: 0.32em;
	left: 50%;
	position: absolute;
	top: -0.34em;
	transform: translateX(-50%);
	width: 0.45em;
}

/* Aviso que aparece bajo la Jornada bloqueada que se ha pulsado. */
.emaus-camino .emaus-jornada__aviso {
	color: var(--emaus-aviso);
	font-size: 0.9em;
	margin: 0;
	padding: 0 0.5em 1.1em 2.15em;
}

/* Contenido de la Jornada (vídeo, audio, texto…). */
.emaus-camino .emaus-jornada__contenido {
	padding: 0.5em 0.5em 2em;
}

.emaus-camino .emaus-jornada__contenido iframe,
.emaus-camino .emaus-jornada__contenido video {
	aspect-ratio: 16 / 9;
	height: auto;
	max-width: 100%;
	width: 100%;
}

/* Pie del Camino. */
.emaus-camino .emaus-pie {
	margin: 1.5rem 0 0;
	text-align: center;
}

.emaus-camino .emaus-estado-camino {
	color: inherit;
	margin: 0 0 0.75rem;
}

.emaus-camino .emaus-estado-camino:empty {
	display: none;
}

/* Etiqueta «Disponible mañana» sobre la próxima Jornada. */
.emaus-camino .emaus-jornada__estado.is-proxima {
	color: #9a9a9a;
	font-style: italic;
}

.emaus-camino .emaus-reiniciar {
	background: none;
	border: 0;
	color: #9a9a9a;
	cursor: pointer;
	font: inherit;
	font-size: 0.85em;
	padding: 0;
	text-decoration: underline;
	text-transform: none;
}

.emaus-camino .emaus-reiniciar:hover {
	background: none;
	color: var(--emaus-aviso);
}

/* Camino aún no abierto. */
.emaus-camino .emaus-proximamente {
	color: inherit;
	text-align: center;
}
