/*
 * Gastrototem · Pages · Plantillas genéricas
 *
 * page.php, single.php, archive.php, index.php, search.php: contexto de header
 * 'flat' (header sólido y fijo, sin banda). Compensa la altura del header fijo
 * (nada de contenido debajo de la barra) y da medida, gutter y tipografía al
 * bloque .gtt-template-entry. Cero hex, cero familias literales.
 */

/* --gtt-header-h vive en tokens.css y el scroll-padding en base.css: aquí
 * solo se consume. */
.gtt-header[data-gtt-context="flat"] ~ main {
	padding-top: calc(var(--gtt-header-h) + var(--gtt-space-12));
}

.gtt-template-entry,
.gtt-template-site-main > .gtt-booking-app,
.gtt-template-site-main > .gtt-portal {
	max-width: var(--gtt-container-content);
	margin-inline: auto;
	padding-inline: var(--gtt-space-6);
}

.gtt-template-entry-header {
	margin-bottom: var(--gtt-space-8);
}

.gtt-template-entry-title {
	font-size: var(--gtt-text-3xl);
	font-weight: 600;
	letter-spacing: -0.02em;
	color: var(--gtt-color-grafito-900);
	text-wrap: balance;
	margin: 0 0 var(--gtt-space-3);
}

.gtt-template-entry-meta {
	display: flex;
	gap: var(--gtt-space-4);
	font-family: var(--gtt-font-mono);
	font-size: var(--gtt-text-xs);
	letter-spacing: var(--gtt-tracking-wide);
	text-transform: uppercase;
	color: var(--gtt-color-grafito-400);
}

.gtt-template-entry-content {
	max-width: var(--gtt-container-prose);
	font-size: var(--gtt-text-prose);
	line-height: var(--gtt-leading-prose);
}

/* Páginas que alojan una aplicación del plugin de reservas (page.php marca el
 * modificador): interfaz, no prosa. Sin la medida de lectura ni el cuerpo de
 * prosa, para que el asistente respire y se centre dentro del artículo. */
.gtt-template-entry-content--app {
	max-width: none;
	font-size: var(--gtt-text-base);
	line-height: var(--gtt-leading-normal);
}

/* Ritmo de prosa. El :not() deja fuera las aplicaciones del plugin: sin él
 * este margen ganaba por especificidad a los ritmos propios del asistente de
 * reserva (p. ej. .gtt-step-desc, 44px) y los aplastaba todos a 24px, que es
 * lo que pegaba la hora elegida al botón «Continuar». */
.gtt-template-entry-content:not(.gtt-template-entry-content--app) p,
.gtt-template-entry-content:not(.gtt-template-entry-content--app) ul,
.gtt-template-entry-content:not(.gtt-template-entry-content--app) ol {
	margin: 0 0 var(--gtt-space-6);
}

/* Los botones del plugin (.gtt-btn) son enlaces con color propio: sin el
 * :not() este color de tinta ganaba por especificidad y dejaba «Ver mi
 * reserva» con el texto del mismo color que el fondo. */
.gtt-template-entry-content a:not(.gtt-btn) {
	color: var(--gtt-color-tinta-500);
	text-decoration: underline;
	text-underline-offset: 3px;
	text-decoration-thickness: 1px;
}

.gtt-template-entry-footer,
.gtt-template-page-links {
	margin-top: var(--gtt-space-12);
	font-size: var(--gtt-text-sm);
	color: var(--gtt-color-grafito-400);
}

.gtt-template-site-main > .gtt-template-entry:last-child,
.gtt-template-site-main > nav.post-navigation {
	margin-bottom: var(--gtt-space-24);
}