/**
 * Maqueta "Cómo se vería en Prensa Libre" (HU-2).
 *
 * Recrea la composición de docs-local/resources/edictos-reales-calendario/*.png y
 * docs-local/resources/visual/*.pdf: masthead + etiqueta "VARIOS" + encabezado
 * "LEGALES/EDICTOS" + columna con el recuadro, sin las marcas de referencia.
 *
 * Colores confirmados con muestreo de píxeles directo sobre
 * docs-local/resources/visual/EDIC CONV SAB 04-07-2026.pdf (renderizado a alta resolución
 * con PyMuPDF) y contra el sitio real https://www.prensalibre.com/ (color computado del
 * título de sección "Comunitario", que coincide con el de la palabra "Prensa Libre" del PDF):
 * - Fondo de página: rgb(252,243,198) = #fcf3c6
 * - "Prensa Libre" (wordmark): rgb(0,185,242) = #00b9f2 (mismo azul que usa
 *   prensalibre.com para sus títulos de sección)
 * - Fondo de la etiqueta "VARIOS": rgb(247,143,182) = #f78fb6
 * - "LEGALES/" y la línea junto a "VARIOS": rgb(240,53,110) = #f0356e
 * No hay logo/asset de marca oficial en el repo — el wordmark se recrea con tipografía,
 * no un logo real (reemplazable si la clienta provee uno).
 */

.edictos-hoja-prensa {
	background: #fcf3c6;
	border: 1px solid #e2d9bd;
	border-radius: 6px;
	padding: 1rem 1.1rem 1.4rem;
	font-family: 'Acto-Small-Medium', Calibri, 'Segoe UI', Arial, sans-serif;
}

.edictos-hoja-prensa__masthead {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 0.75rem;
	padding-bottom: 0.4rem;
	margin-bottom: 0.9rem;
	flex-wrap: wrap;
}

.edictos-hoja-prensa__nameplate {
	display: flex;
	align-items: baseline;
	gap: 0.5rem;
}

.edictos-hoja-prensa__brand {
	font-weight: 800;
	font-style: italic;
	font-size: 1rem;
	letter-spacing: 0.01em;
	color: #00b9f2;
	white-space: nowrap;
}

.edictos-hoja-prensa__meta {
	font-size: 0.65rem;
	color: #2b2b2b;
	white-space: nowrap;
}

.edictos-hoja-prensa__tagline {
	font-size: 0.62rem;
	font-style: italic;
	color: #4a4a4a;
	white-space: nowrap;
}

.edictos-hoja-prensa__column {
	max-width: 260px;
}

.edictos-hoja-prensa__column--full {
	max-width: 420px;
}

.edictos-hoja-prensa__section-label-row {
	display: flex;
	align-items: flex-end;
	margin-bottom: 0.15rem;
}

.edictos-hoja-prensa__section-label {
	display: inline-block;
	background-color: #f78fb6;
	color: #1a1a1a;
	font-weight: 700;
	font-size: 0.85rem;
	letter-spacing: 0.02em;
	padding: 0.2rem 0.65rem;
	white-space: nowrap;
}

.edictos-hoja-prensa__section-label-rule {
	flex: 1;
	height: 2px;
	background-color: #f0356e;
	margin-bottom: 0.4rem;
}

.edictos-hoja-prensa__section-heading {
	line-height: 1.15;
	margin-bottom: 0.6rem;
}

.edictos-hoja-prensa__section-heading-pre {
	display: block;
	color: #f0356e;
	font-size: 0.7rem;
	font-weight: 600;
}

.edictos-hoja-prensa__section-heading-main {
	display: block;
	color: #1a1a1a;
	font-size: 1rem;
	font-weight: 800;
}

.edictos-hoja-prensa__content {
	/* El recuadro (.edictos-preview-box) trae su propio estilo calibrado desde
	   preview.css — aquí solo se ajusta el ancho máximo al de la columna simulada. */
	max-width: 100%;
}

.edictos-hoja-prensa__content .edictos-preview-box {
	max-width: 100%;
}

/* El label "Vista previa · 2x1 (hasta 25 caracteres)" es una ayuda de nuestra UI, no algo
   que aparezca en el periódico real — se oculta solo dentro de esta maqueta. */
.edictos-hoja-prensa__content .edictos-preview-box__label {
	display: none;
}

.edictos-hoja-prensa__content--fill {
	min-height: 320px;
}

@media (max-width: 480px) {
	.edictos-hoja-prensa__masthead {
		flex-direction: column;
		align-items: flex-start;
		gap: 0.25rem;
	}

	.edictos-hoja-prensa__column,
	.edictos-hoja-prensa__column--full {
		max-width: 100%;
	}
}

/**
 * Maqueta basada en imagen real (assets/img/hoja-prensa-base.png, 900×1041 — misma
 * proporción que el PDF real: 778.5×900.7 puntos = 10.81×12.51 pulgadas), compartida por
 * 2x1/2x2/cuarto_pagina. Pedido explícito del usuario: la maqueta de 2x1/2x2 recreada en
 * CSS no se parecía a la real (el recuadro ni se veía) — ahora usan la misma imagen de
 * fondo que cuarto_pagina (misma columna VARIOS/LEGALES-EDICTOS), solo cambia el tamaño
 * del recuadro superpuesto según el tamaño contratado, tal como en el papel real.
 *
 * Posición del recuadro (left/top) medida en % sobre esa imagen con muestreo de píxeles
 * (PyMuPDF+PIL): el punto de anclaje bajo el encabezado VARIOS/LEGALES está en 48.37%
 * desde la izquierda y 8.51% desde arriba (usado por 2x1/2x2/cuarto_pagina; media_pagina
 * usa un anclaje distinto por ocupar casi toda la página, ver más abajo).
 *
 * El tamaño (width/height) de cada recuadro NO sale de esta imagen sino de la ficha de
 * tarifas oficial del periódico en pulgadas — ver bloque "Medidas DEFINITIVAS
 * (2026-08-01)" más abajo, que reemplaza las aproximaciones anteriores basadas en
 * capturas de pantalla anotadas a mano.
 *
 * OJO al convertir pulgadas a % sobre esta imagen: el % de "height" es relativo al ALTO
 * de hoja-prensa-base.png (1041px / 12.51") y el % de "width" es relativo a su ANCHO
 * (900px / 10.81"); como la imagen NO es cuadrada, "width% / height%" no es igual a la
 * proporción física real en pulgadas — hay que convertir cada dimensión por separado
 * contra su propio eje, no aplicar el ratio ancho/alto directo sobre un % ya fijado.
 */
.edictos-hoja-prensa-real {
	position: relative;
	width: 100%;
}

.edictos-hoja-prensa-real__bg {
	display: block;
	width: 100%;
	height: auto;
}

.edictos-hoja-prensa-real__overlay {
	position: absolute;
	box-sizing: border-box;
}

/* OJO: el hueco borrado del fondo mide 50.51% × 49.57% (era el aviso de la edición del
   4 de julio, que resultó NO ser un 1/4 estándar). El valor correcto (ver bloque
   "Medidas DEFINITIVAS 2026-08-01" más abajo) sale de la ficha de tarifas oficial:
   5.20" × 6.08" → 48.10% × 48.60%.
   left corregido 2026-08-04: reporte de que el recuadro se veía corrido a la izquierda
   respecto al encabezado "VARIOS"/"LEGALES-EDICTOS" — medido en píxeles reales sobre
   hoja-prensa-base.png (muestreo del bloque rosado #f78fb6 de "VARIOS"): empieza en
   49.53% del ancho de la imagen, no en 48.37%. */
.edictos-hoja-prensa-real--cuarto_pagina .edictos-hoja-prensa-real__overlay {
	left: 49.53%;
	top: 8.51%;
	width: 48.10%;
	height: 48.60%;
}

/* Medidas DEFINITIVAS (2026-08-01): tomadas de la ficha de tarifas oficial del periódico
   (medida en pulgadas), convertidas a % de hoja-prensa-base.png usando el tamaño de
   página documentado arriba (10.81" × 12.51") — reemplazan las mediciones anteriores por
   píxel sobre PDFs de ejemplo (2026-07-13), que no coincidían con la tarifa real:
   - 2x1  = 2.02" × 0.75" → 18.69% × 6.00% de la página (ratio 2.693)
   - 2x2  = 2.02" × 1.64" → 18.69% × 13.11% (ratio 1.232)
   - 1/4  = 5.20" × 6.08" → 48.10% × 48.60% (ratio 0.855)
   - 1/2  = 10.49" × 6.08" → 96.47% × 48.60% (ratio 1.725) — prácticamente el ancho
     completo de la página a media altura, MISMO alto que 1/4 página (ambos 6.08" reales).
   2x1/2x2/1-4 se anclan bajo el encabezado VARIOS/LEGALES (left 48.37%, top 8.51%, mismo
   punto que antes) porque su ancho cabe dentro de la columna derecha. 1/2 página, al
   ocupar casi toda la página, se ancla desde el margen izquierdo (left 0%) manteniendo el
   MISMO borde derecho que 1/4 página (0% + 96.47% = 96.47%, igual que 48.37% + 48.10% de
   1/4) — el margen izquierdo exacto de la página no está medido en px, es una estimación
   por consistencia con el margen derecho ya validado; revisar visualmente. */
.edictos-hoja-prensa-real--2x1 .edictos-hoja-prensa-real__overlay {
	left: 49.53%;
	top: 8.51%;
	width: 18.69%;
	height: 6.00%;
}

.edictos-hoja-prensa-real--2x2 .edictos-hoja-prensa-real__overlay {
	left: 49.53%;
	top: 8.51%;
	width: 18.69%;
	height: 13.11%;
}

.edictos-hoja-prensa-real--media_pagina .edictos-hoja-prensa-real__overlay {
	left: 0%;
	top: 8.51%;
	width: 96.47%;
	height: 48.60%;
}

/* Pedido explícito: la fecha del masthead debe ser la "Fecha de Publicación Edicto #1"
   real que llenó el cliente, no la fecha fija que traía el PDF de referencia. Esa fecha
   fija ("Guatemala, sábado 4 de julio de 2026") estaba impresa en los píxeles de la imagen
   de fondo (no era texto real) — se borró con PIL (rellenada con el color de fondo
   #fcf3c6) dejando el hueco libre para superponer esta fecha dinámica en su lugar. Medido
   sobre hoja-prensa-base.png (900×1041): el hueco borrado va de x=70 a x=430, y=0 a y=20. */
.edictos-hoja-prensa-real__fecha {
	position: absolute;
	left: 7.78%;
	top: 0.2%;
	font-size: 0.62rem;
	line-height: 1;
	color: #2b2b2b;
	white-space: nowrap;
}

.edictos-hoja-prensa-real__overlay .edictos-preview-box {
	width: 100%;
	/* Igual que en "Mi edicto" (pedido 2026-07-21): el recuadro se ajusta al alto del
	   texto — un anuncio real no se imprime con un vacío grande — con tope en el espacio
	   del tamaño contratado dentro de la página. */
	height: auto;
	max-height: 100%;
	overflow: auto;
}

.edictos-hoja-prensa-real__overlay .edictos-preview-box__label {
	display: none;
}