/*
 * Colores: este archivo no lleva colores propios de ninguna web. Usa los
 * huecos de la paleta del tema (--wp--preset--color--titulo, fondo, borde…)
 * y las variables de acento de Kommad Base (--kmd-acento-texto,
 * --kmd-acento-oscuro, --kmd-acento-claro), que cambian solas en la zona
 * turística. Cada uno lleva un color de respaldo por si el tema activo no es
 * Kommad Base.
 *
 * Excepción a propósito, en mapa.css: las marcas del mapa (salida en verde,
 * llegada en negro, bordes blancos) y el aviso amarillo. Son símbolos del
 * mapa y avisos, no color de marca: tienen que verse igual en todas las webs.
 */

/* Texto solo para lectores de pantalla (igual que en listado.css, que no
   siempre se carga en la página de la agenda). */
.kmd-oculto {
	position: absolute;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip-path: inset(50%);
	white-space: nowrap;
}

/* Agenda: fecha en un cuadro a la izquierda, nombre y detalle a la derecha. */
.kmd-agenda {
	display: grid;
	gap: 1rem;
	margin: 1rem 0;
	padding: 0;
	list-style: none;
}

.kmd-agenda-evento {
	display: flex;
	gap: 1rem;
	align-items: flex-start;
}

.kmd-agenda-evento[hidden],
.kmd-agenda[hidden] {
	display: none;
}

.kmd-agenda-dia {
	display: flex;
	flex: none;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	width: 4rem;
	height: 4rem;
	border-radius: var(--kmd-radio-pequeno, 4px);
	background: var(--kmd-acento-texto, #1a1a1a);
	color: var(--wp--preset--color--fondo, #fff);
	line-height: 1;
}

.kmd-agenda-num {
	font-size: 1.5rem;
	font-weight: 700;
}

.kmd-agenda-mes {
	margin-top: 0.25rem;
	font-size: 0.8125rem;
	text-transform: uppercase;
}

.kmd-agenda-nombre {
	margin: 0 0 0.25rem;
	font-size: 1.125rem;
	line-height: 1.3;
}

.kmd-agenda-detalle {
	margin: 0;
	font-size: 0.9375rem;
}

.kmd-evento-calendario a {
	display: inline-flex;
	align-items: center;
	min-height: 44px;
	font-weight: 600;
}

/* Foto del evento en la lista: vertical (3:4), porque casi siempre es un
   cartel, y a la misma altura que el cuadro de la fecha (decisión de David,
   01/10/2026). */
.kmd-agenda-foto {
	flex: none;
	width: 4rem;
	height: 4rem;
	object-fit: cover;
	object-position: center top;
	border-radius: var(--kmd-radio-pequeno, 4px);
}

/* En la noticia-evento, el cartel entero, sin recortar ni ocupar más de la
   pantalla. */
.kmd-noticia-evento .wp-block-post-featured-image img {
	width: auto;
	max-width: 100%;
	max-height: 80vh;
	margin-inline: auto;
	object-fit: contain;
}

/* Calendario del mes, compacto en todos los tamaños. */
.kmd-agenda-mesvista {
	max-width: 28rem;
	margin-bottom: 1.5rem;
}

.kmd-agenda-mesnav {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	margin-bottom: 0.5rem;
}

.kmd-agenda-mesnav a {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	border-radius: 50%;
	color: inherit;
	font-size: 1.25rem;
	text-decoration: none;
}

.kmd-agenda-mesnav a:hover {
	background: var(--kmd-acento-claro, #f0ece4);
}

.kmd-agenda-mestitulo {
	margin: 0;
	font-size: 1.125rem;
}

/* Solo la primera letra: «Octubre de 2026», no «Octubre De 2026». */
.kmd-agenda-mestitulo::first-letter {
	text-transform: uppercase;
}

.kmd-agenda-cuadricula {
	width: 100%;
	border-collapse: collapse;
	table-layout: fixed;
	text-align: center;
}

.kmd-agenda-cuadricula th {
	padding: 0.25rem 0;
	font-size: 0.8125rem;
	font-weight: 600;
	text-transform: capitalize;
}

.kmd-agenda-cuadricula abbr {
	text-decoration: none;
}

.kmd-agenda-cuadricula td {
	padding: 2px 0;
}

.kmd-agenda-celdadia {
	position: relative;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	max-width: 100%;
	height: 44px;
	border-radius: 50%;
	color: inherit;
	text-decoration: none;
}

/* Día con eventos: fondo y una marca debajo del número. */
.kmd-agenda-con .kmd-agenda-celdadia {
	background: var(--kmd-acento-claro, #f0ece4);
	font-weight: 700;
}

.kmd-agenda-con .kmd-agenda-celdadia::after {
	content: "";
	position: absolute;
	bottom: 6px;
	width: 5px;
	height: 5px;
	border-radius: 50%;
	background: currentColor;
}

.kmd-agenda-con a.kmd-agenda-celdadia {
	text-decoration: underline;
	text-underline-offset: 3px;
}

.kmd-agenda-con a.kmd-agenda-celdadia:hover {
	background: var(--kmd-acento-texto, #1a1a1a);
	color: var(--wp--preset--color--fondo, #fff);
}

.kmd-agenda-hoy .kmd-agenda-celdadia {
	outline: 2px solid var(--wp--preset--color--titulo, #1a1a1a);
	outline-offset: -2px;
}

.kmd-agenda-celdadia:focus-visible {
	outline: 3px solid var(--wp--preset--color--titulo, #1a1a1a);
	outline-offset: 2px;
}

.kmd-agenda-listatitulo {
	margin: 1rem 0 0;
	font-size: 1.125rem;
}

/* El evento al que lleva un día del calendario, resaltado un momento. */
.kmd-agenda-evento:target {
	outline: 3px solid var(--wp--preset--color--titulo, #1a1a1a);
	outline-offset: 4px;
	border-radius: var(--kmd-radio-medio, 4px);
}