/*
 * theme.css — ESTILOS BASE DEL TEMA.
 *
 * Tipografía, enlaces, contenedor de lectura y el aspecto de las plantillas de
 * reserva (blog, entrada, archivo, búsqueda, 404 y comentarios). En este sitio
 * el diseño lo pone Elementor; esto son solo cimientos limpios para lo que
 * Elementor no cubra. Código original de White Hat Management.
 *
 * Los colores concretos de la marca están en brand.css, que se carga
 * después y puede ajustar estos valores.
 */

:root {
	--wh-text: #1a2340;          /* Color del texto principal. */
	--wh-muted: #5b647a;         /* Texto secundario (fechas, metadatos). */
	--wh-link: #f00909;          /* Enlaces (rojo Empleos Ahora). */
	--wh-link-hover: #c40707;    /* Enlace al pasar el ratón (rojo oscuro). */
	--wh-bg: #ffffff;            /* Fondo. */
	--wh-border: #e7e2d6;        /* Líneas y separadores. */
	--wh-container: 820px;       /* Ancho de la columna de lectura. */
	--wh-container-wide: 1200px; /* Ancho "amplio". */
	--wh-font: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
	--wh-space: 1.5rem;          /* Separación vertical estándar. */
}

body {
	font-family: var(--wh-font);
	color: var(--wh-text);
	background: var(--wh-bg);
	font-size: 1rem;
}

/* Contenedor centrado que limita el ancho de lectura. */
.wh-container {
	width: 100%;
	max-width: var(--wh-container);
	margin-inline: auto;
	padding-inline: 1.25rem;
}

.site-content {
	padding-block: 2.5rem;
}

/* --- Tipografía --- */
h1, h2, h3, h4, h5, h6 {
	line-height: 1.25;
	margin-block: 0 0.6em;
	font-weight: 700;
}

h1 { font-size: 2rem; }
h2 { font-size: 1.6rem; }
h3 { font-size: 1.3rem; }

p,
ul,
ol,
blockquote,
figure {
	margin-block: 0 var(--wh-space);
}

a {
	color: var(--wh-link);
	text-decoration: underline;
	text-underline-offset: 2px;
}

a:hover,
a:focus {
	color: var(--wh-link-hover);
}

blockquote {
	padding-inline-start: 1rem;
	border-inline-start: 3px solid var(--wh-border);
	color: var(--wh-muted);
}

/* --- Listado de entradas --- */
.wh-entry {
	padding-block-end: 2rem;
	margin-block-end: 2rem;
	border-block-end: 1px solid var(--wh-border);
}

.wh-entry__title { margin: 0 0 0.3em; }
.wh-entry__title a { text-decoration: none; }
.wh-entry__title a:hover { text-decoration: underline; }

.wh-entry__meta,
.wh-single__meta {
	color: var(--wh-muted);
	font-size: 0.9rem;
	margin-block: 0 1rem;
}

.wh-entry__thumb { display: block; margin-block-end: 1rem; }
.wh-entry__more { font-weight: 600; }

/* --- Entrada/página única --- */
.wh-single__title { margin-block-end: 0.3em; }
.wh-single__thumb { margin-block-end: var(--wh-space); }
.wh-single__body { font-size: 1.05rem; }

/* Los bloques "amplios" y "a todo lo ancho" del editor. */
.wh-single__body .alignwide {
	max-width: var(--wh-container-wide);
	margin-inline: auto;
}
.wh-single__body .alignfull {
	max-width: none;
}

/* --- Archivo, búsqueda, 404 --- */
.wh-archive__header { margin-block-end: 2rem; }
.wh-error404 { text-align: center; padding-block: 3rem; }
.wh-error404__code { font-size: 4rem; margin: 0; color: var(--wh-muted); }
.wh-noresults { padding-block: 2rem; }

/* --- Paginación --- */
.pagination,
.wh-pagelinks {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem;
	margin-block-start: 2rem;
}
.pagination .page-numbers {
	padding: 0.4rem 0.75rem;
	border: 1px solid var(--wh-border);
	border-radius: 4px;
	text-decoration: none;
}
.pagination .page-numbers.current {
	background: var(--wh-text);
	color: #fff;
	border-color: var(--wh-text);
}

/* --- Comentarios --- */
.wh-comments { margin-block-start: 3rem; }
.wh-comments__list { list-style: none; padding: 0; }
.wh-comments__list ol { list-style: none; }

/* --- Accesibilidad: enlace "saltar al contenido" y texto solo para lectores --- */
.screen-reader-text {
	position: absolute !important;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

.skip-link.screen-reader-text:focus {
	position: fixed !important;
	top: 0.5rem;
	left: 0.5rem;
	width: auto;
	height: auto;
	clip: auto;
	z-index: 100000;
	padding: 0.75rem 1rem;
	background: var(--wh-text);
	color: #fff;
	border-radius: 4px;
}