/*
 * Puentazo · estilos de las páginas de texto (CLAUDE.md §5): calendario laboral de España, de cada comunidad
 * y de cada municipio, calendario escolar, guías y páginas legales.
 *
 * Van aparte de styles.css porque la portada (la herramienta) no los necesita y su primera carga tiene que
 * quedar por debajo de 150 KB. Las páginas que lo necesitan lo enlazan después del común.
 */

/* ---------- Página de texto ---------- */
.pagina { padding-block: 1.25rem 2rem; }
.pagina > * { max-width: 820px; }
.pagina h2 { margin-top: 1.75rem; font-size: clamp(1.25rem, 1.05rem + 1vw, 1.65rem); scroll-margin-top: calc(var(--header-h) + 12px); }
.pagina h3 { margin-top: 1.25rem; font-size: 1.15rem; }
.pagina p, .pagina ul, .pagina ol { line-height: 1.6; }
.pagina > p + p { margin-top: 0.75rem; }
.pagina > ul:not([class]), .pagina > ol:not([class]), .pagina section > ul:not([class]), .pagina section > ol:not([class]) { padding-left: 1.3rem; display: grid; gap: 0.4rem; }
.pagina .ad-slot { max-width: 820px; margin-block: 1.5rem; }
.pagina .tabla-scroll { margin-top: 0.75rem; }
.tabla-plan td:last-child { font-weight: 800; color: var(--c-primary); text-align: right; }
.tabla-plan th:last-child { text-align: right; }
.llamada-fila { margin-top: 1rem; }

.aviso-datos {
  padding: 0.7rem 0.9rem; border-radius: var(--radius); border: 1px dashed var(--c-border-strong);
  background: var(--c-surface-2); font-size: 0.95rem;
}

/* ---------- Fiestas locales de una provincia: buscador y tabla larga ---------- */
.filtro { margin-top: 0.75rem; display: grid; gap: 0.35rem; max-width: 420px; }
.filtro label { font-weight: 700; }
.filtro input {
  width: 100%; min-height: 48px; padding: 0.6rem 0.85rem; border: 1.5px solid var(--c-border-strong);
  border-radius: 12px; background: var(--c-surface); color: var(--c-ink); font: inherit; font-weight: 600;
}
.filtro-vacio { margin-top: 0.5rem; color: var(--c-soft); }
.tabla-locales th[scope="row"] { font-weight: 700; min-width: 9rem; }
.tabla-locales td { overflow-wrap: anywhere; }
.tabla-locales details { margin-top: 0.3rem; }
.tabla-locales details:first-child { margin-top: 0; }
.tabla-locales summary { cursor: pointer; color: var(--c-link); font-weight: 600; }
.tabla-locales details ul { margin: 0.35rem 0 0; padding-left: 1.1rem; display: grid; gap: 0.25rem; font-size: 0.9rem; }
.tabla-locales small { display: block; margin-top: 0.2rem; color: var(--c-soft); }
.sin-dato { color: var(--c-soft); }

/* ---------- Compartir una página ---------- */
.compartir { margin-top: 2rem; padding-top: 1.25rem; border-top: 1px solid var(--c-border); }
.compartir h2 { margin-top: 0; font-size: 1.2rem; }
.compartir__botones { margin-top: 0.6rem; display: flex; flex-wrap: wrap; gap: 0.6rem; }
.compartir__aviso { margin-top: 0.5rem; min-height: 1.5em; font-size: 0.92rem; color: var(--c-soft); overflow-wrap: anywhere; }

/* ---------- Tarjetas de lugares (comunidades, municipios) ---------- */
.tarjetas-lugar { list-style: none; padding: 0; margin-top: 0.75rem; display: grid; gap: 0.6rem; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); }
.tarjeta-lugar {
  display: grid; gap: 0.15rem; height: 100%; padding: 0.75rem 0.9rem; border: 1px solid var(--c-border);
  border-radius: var(--radius); background: var(--c-surface); color: var(--c-ink); text-decoration: none;
}
.tarjeta-lugar:hover { border-color: var(--c-primary); }
.tarjeta-lugar span { font-weight: 800; color: var(--c-link); }
.tarjeta-lugar small { font-size: 0.82rem; color: var(--c-soft); }

/* ---------- Guías ---------- */
.guia-meta { margin-top: 0.25rem; font-size: 0.9rem; color: var(--c-soft); }
.indice { margin-top: 1.25rem; padding: 0.9rem 1.1rem; border: 1px solid var(--c-border); border-radius: var(--radius); background: var(--c-surface); }
.indice h2 { margin-top: 0; font-size: 1rem; }
.indice ol { margin-top: 0.35rem; padding-left: 1.2rem; display: grid; gap: 0.2rem; }
.cita { margin-top: 0.75rem; padding: 0.6rem 0.9rem; border-left: 4px solid var(--c-sun); background: var(--c-surface-2); border-radius: 0 var(--radius) var(--radius) 0; }
.cita footer { margin-top: 0.3rem; font-size: 0.85rem; color: var(--c-soft); }
.plantilla { margin-top: 0.75rem; padding: 0.9rem 1rem; border: 1px solid var(--c-border); border-radius: var(--radius); background: var(--c-surface); white-space: pre-wrap; font-size: 0.95rem; }
.lista-guias { list-style: none; padding: 0; margin-top: 1rem; display: grid; gap: 0.75rem; }
.guia-tarjeta { padding: 0.9rem 1.1rem; border: 1px solid var(--c-border); border-radius: var(--radius); background: var(--c-surface); }
.guia-tarjeta h2 { margin-top: 0; font-size: 1.1rem; }
.guia-tarjeta p { margin-top: 0.3rem; color: var(--c-soft); }
.fuentes-guia { margin-top: 2rem; font-size: 0.92rem; color: var(--c-soft); }
.fuentes-guia h2 { font-size: 1.1rem; }
.fuentes-guia ul { margin-top: 0.4rem; }

/* ---------- Páginas legales ---------- */
.datos-legales { margin-top: 0.75rem; display: grid; grid-template-columns: max-content 1fr; gap: 0.35rem 1rem; }
.datos-legales dt { font-weight: 700; }
.datos-legales dd { margin: 0; }
@media (max-width: 520px) { .datos-legales { grid-template-columns: 1fr; } .datos-legales dd { margin-bottom: 0.4rem; } }
