/*
Theme Name: Fe y Política
Theme URI: https://feypolitica.com/
Author: Equipo ACN
Author URI: https://mediosacn.com/
Description: Tema propio de Fe y Política, construido desde la maqueta aprobada por el periódico: cabecera con fecha en vivo y modo oscuro, cinta Al Minuto, portada con noticia principal y secundarias, Tribuna, Fe y Sociedad, Ética Pública, Lo más reciente, boletín, sondeo y Multimedia.
Version: 1.12
License: GNU General Public License v2 or later
Text Domain: feypolitica
*/

/* Estilos editoriales de la maqueta */
.fyp-drop-cap::first-letter {
  float: left;
  font-size: 3.5rem;
  line-height: 0.8;
  padding-top: 4px;
  padding-right: 8px;
  padding-left: 3px;
  font-family: 'Playfair Display', Georgia, serif;
  font-weight: 700;
  color: #881337;
}
.custom-scrollbar::-webkit-scrollbar {
  height: 4px;
  width: 4px;
}
.custom-scrollbar::-webkit-scrollbar-thumb {
  background: #cbd5e1;
  border-radius: 4px;
}

/* Contenido del artículo: el HTML importado ya viene con text-align:left
   y sin colores forzados; solo se asegura lectura cómoda y foto a todo ancho. */
.fyp-contenido p {
  margin-bottom: 1.1em;
  line-height: 1.75;
}
.fyp-contenido > p:first-of-type::first-letter {
  float: left;
  font-size: 3.2rem;
  line-height: 0.85;
  padding-top: 4px;
  padding-right: 8px;
  font-family: 'Playfair Display', Georgia, serif;
  font-weight: 700;
  color: #881337;
}
.fyp-contenido img {
  max-width: 100%;
  height: auto;
  border-radius: 0.5rem;
}
.fyp-contenido h2, .fyp-contenido h3 {
  font-family: 'Playfair Display', Georgia, serif;
  font-weight: 700;
  margin: 1.2em 0 0.5em;
}
.fyp-contenido ul, .fyp-contenido ol {
  margin: 0 0 1.1em 1.4em;
}

/* Paginación de archivos */
.fyp-paginacion .nav-links {
  display: flex;
  gap: 0.5rem;
  justify-content: center;
  flex-wrap: wrap;
}
.fyp-paginacion .page-numbers {
  padding: 0.4rem 0.9rem;
  border: 1px solid #e2e8f0;
  border-radius: 0.375rem;
  font-size: 0.85rem;
}
.fyp-paginacion .page-numbers.current {
  background: #881337;
  color: #fff;
  border-color: #881337;
}

/* Formulario de comentarios: campos legibles en claro y oscuro */
.fyp-comentarios input[type="text"],
.fyp-comentarios input[type="email"],
.fyp-comentarios input[type="url"],
.fyp-comentarios textarea {
  width: 100%;
  border: 1px solid #e2e8f0;
  border-radius: 0.5rem;
  padding: 0.6rem 0.8rem;
  font-size: 0.9rem;
  background: #fff;
  color: #1e293b;
}
.dark .fyp-comentarios input[type="text"],
.dark .fyp-comentarios input[type="email"],
.dark .fyp-comentarios input[type="url"],
.dark .fyp-comentarios textarea {
  background: #1e293b;
  border-color: #334155;
  color: #f1f5f9;
}
.fyp-comentarios .comment-form-author label,
.fyp-comentarios .comment-form-email label,
.fyp-comentarios .comment-form-url label,
.fyp-comentarios .comment-form-comment label {
  display: block;
  font-size: 0.8rem;
  font-weight: 600;
  margin-bottom: 0.3rem;
}
.fyp-comentarios .comment-body {
  border: 1px solid #e2e8f0;
  border-radius: 0.5rem;
  padding: 1rem;
}
.dark .fyp-comentarios .comment-body {
  border-color: #334155;
}

/* Publicidad lateral fija 160x600: dos rascacielos pegados al cuerpo,
   fijos en pantalla al hacer scroll. Solo PC de pantalla ancha
   (>=1640px) para no tapar el contenido; en pantallas menores
   y en móvil quedan ocultos. */
.acn-sky { display: none; }
@media (min-width: 1640px) {
  .acn-sky {
    display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px;
    position: fixed; top: 50%; transform: translateY(-50%);
    width: 160px; height: 600px; z-index: 30;
    border: 2px dashed #cbd5e1; background: #f8fafc;
  }
  .acn-sky-left { left: auto; right: calc(50% + 640px + 12px); }
  .acn-sky-right { left: calc(50% + 640px + 12px); right: auto; }
  .acn-sky-label { font-family: monospace; font-size: 11px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: #94a3b8; text-align: center; }
  .acn-sky-size { font-family: monospace; font-size: 12px; color: #94a3b8; }
}

/* Ajuste de ancho en móvil (2026-11-03): ninguna columna, foto ni anuncio
   puede salirse del cuadro de la pantalla; la página no se mueve a los lados. */
html, body { overflow-x: clip; }
.grid > * { min-width: 0; }
article, aside, main { min-width: 0; }
img, video, iframe, table, figure { max-width: 100%; }
