/*
Theme Name: Escuela Sindical
Theme URI: https://escuelasindical.cl
Author: Escuela Sindical - Facultad de Derecho, Universidad de Chile
Description: Tema a medida para la Escuela Sindical. Incluye noticias, cursos, boletines y repositorio de materiales, con una paleta acotada para que el diseño se mantenga parejo.
Version: 0.1.0
Requires at least: 6.5
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: escuela-sindical
*/

/* -------------------------------------------------------------
   Lo que theme.json no alcanza a expresar: el aire de afiche.
   Bordes rectos, filetes gruesos, sombras desplazadas.
   ------------------------------------------------------------- */

/* Franja tricolor bajo la cabecera y sobre el pie */
.es-franja {
	height: 8px;
	border-bottom: 2px solid var(--wp--preset--color--tinta);
	background: repeating-linear-gradient(
		90deg,
		var(--wp--preset--color--rojo) 0 56px,
		var(--wp--preset--color--ocre) 56px 112px,
		var(--wp--preset--color--arena) 112px 168px
	);
}

/* El emblema siempre sobre papel, como en el logo impreso */
.es-emblema {
	background: var(--wp--preset--color--papel);
	border: 3px solid var(--wp--preset--color--tinta);
	padding: clamp(18px, 3vw, 28px);
	box-shadow: 10px 10px 0 var(--wp--preset--color--rojo);
}

/* Tarjetas de noticia, curso y material */
.es-tarjeta {
	border: 2px solid var(--wp--preset--color--tinta);
	background: var(--wp--preset--color--blanco);
	transition: transform .12s ease, box-shadow .12s ease;
}
.es-tarjeta:hover {
	transform: translate(-2px, -2px);
	box-shadow: 6px 6px 0 var(--wp--preset--color--rojo);
}

/* Filete de dos tonos bajo los titulares de sección */
.es-filete::after {
	content: "";
	display: block;
	width: 132px;
	height: 10px;
	margin-top: 12px;
	border: 2px solid var(--wp--preset--color--tinta);
	background: linear-gradient(
		90deg,
		var(--wp--preset--color--rojo) 0 50%,
		var(--wp--preset--color--ocre) 50% 100%
	);
}

/* Distintivo de estado del curso */
.es-distintivo {
	display: inline-block;
	font-family: var(--wp--preset--font-family--utilitaria);
	font-weight: 800;
	font-size: .68rem;
	text-transform: uppercase;
	letter-spacing: .09em;
	padding: 5px 10px;
	border: 2px solid var(--wp--preset--color--tinta);
	background: var(--wp--preset--color--papel-suave);
	color: var(--wp--preset--color--tinta);
}
.es-distintivo--abierta { background: var(--wp--preset--color--rojo); color: var(--wp--preset--color--papel); }
.es-distintivo--pronto  { background: var(--wp--preset--color--arena); }
.es-distintivo--cerrada { background: var(--wp--preset--color--tinta); color: var(--wp--preset--color--papel); }

/* Ficha de datos de un curso */
.es-datos { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 5px; }
.es-datos li {
	font-family: var(--wp--preset--font-family--utilitaria);
	font-size: .84rem;
	display: flex;
	gap: 8px;
	align-items: baseline;
}
.es-datos b {
	font-size: .68rem;
	text-transform: uppercase;
	letter-spacing: .08em;
	color: var(--wp--preset--color--marron);
	min-width: 78px;
	flex: none;
}

/* Cuadro de formato en el repositorio */
.es-formato {
	font-family: var(--wp--preset--font-family--utilitaria);
	font-weight: 800;
	font-size: .66rem;
	letter-spacing: .05em;
	width: 60px;
	height: 60px;
	display: grid;
	place-items: center;
	flex: none;
	border: 2px solid var(--wp--preset--color--tinta);
	background: var(--wp--preset--color--rojo);
	color: var(--wp--preset--color--papel);
}

/* Botones con sombra desplazada */
.wp-block-button__link {
	border: 2px solid var(--wp--preset--color--tinta);
	box-shadow: 5px 5px 0 var(--wp--preset--color--tinta);
	transition: transform .12s ease, box-shadow .12s ease;
}
.wp-block-button__link:hover {
	transform: translate(2px, 2px);
	box-shadow: 3px 3px 0 var(--wp--preset--color--tinta);
}

/* Lectura cómoda en las notas */
.entry-content p { max-width: 65ch; }

@media (prefers-reduced-motion: reduce) {
	.es-tarjeta, .wp-block-button__link { transition: none; }
}