/*
Theme Name: Noticias SIM
Theme URI: https://noticiassim.com/
Author: Equipo ACN
Author URI: https://noticiassim.com/
Description: Tema propio de NoticiasSIM.com: Servicio Informativo Mundial — Seguridad, Integridad y Movimiento. Portada dinámica con héroe y radar, secciones por categoría, artículo con orientación ciudadana, buscador real, modo nocturno y Open Graph.
Version: 1.15
License: GNU General Public License v2 or later
Text Domain: noticiassim
*/

/* El cuerpo del artículo toma su color del tema (claro u oscuro);
   nunca se fuerza color en línea en el HTML del artículo. */
.sim-contenido {
  line-height: 1.8;
}
.sim-contenido p {
  margin-bottom: 1.1em;
}
.sim-contenido img {
  max-width: 100%;
  height: auto;
}
.sim-contenido h2, .sim-contenido h3 {
  font-family: 'Montserrat', sans-serif;
  font-weight: 800;
  margin: 1.2em 0 0.5em;
}
.sim-contenido ul, .sim-contenido ol {
  margin: 0 0 1.1em 1.4em;
}

/* Logo de cabecera: tamaño explícito en CSS + atributos width/height
   reales en el <img>, sin depender solo de utilidades de Tailwind
   (lección MediosACN v1.4/v1.5: con solo h-12/w-auto la caja quedaba
   en 0 px). Sin display:block que anule un hidden: el logo es único
   y fijo en ambos modos, no hay dos versiones que alternar. */
.sim-logo img {
  height: 72px;
  width: auto;
  max-width: none;
}
@media (min-width: 640px) {
  .sim-logo img {
    height: 96px;
  }
}
@media (min-width: 1024px) {
  .sim-logo img {
    height: 140px;
  }
}

/* Cortes diagonales cinéticos del demo */
.sim-skew {
  transform: skewX(-10deg);
}
.sim-unskew {
  transform: skewX(10deg);
}

/* Borde lateral doble (azul + rojo) del demo */
.sim-dual-border-l {
  border-left: 6px solid #1D2F5D;
  box-shadow: inset 4px 0 0 0 #9E1B18;
}

/* Paginación */
.sim-paginacion .nav-links {
  display: flex;
  gap: 0.5rem;
  justify-content: center;
  flex-wrap: wrap;
}
.sim-paginacion .page-numbers {
  padding: 0.6rem 1rem;
  border: 1px solid #e2e8f0;
  font-size: 0.75rem;
  font-weight: 700;
  background: #fff;
}
.dark .sim-paginacion .page-numbers {
  background: #111c3b;
  border-color: #334155;
}
.sim-paginacion .page-numbers.current {
  background: #9e1b18;
  color: #fff;
  border-color: #9e1b18;
}

/* Formularios de comentarios: legibles en claro y oscuro */
.sim-comentarios input[type="text"], .sim-comentarios input[type="email"],
.sim-comentarios input[type="url"], .sim-comentarios textarea {
  width: 100%;
  border: 1px solid #e2e8f0;
  padding: 0.6rem 0.8rem;
  font-size: 0.9rem;
  background: #fff;
  color: #0f172a;
}
.dark .sim-comentarios input[type="text"], .sim-comentarios input[type="email"],
.dark .sim-comentarios input[type="url"], .sim-comentarios textarea {
  background: #111c3b;
  border-color: #334155;
  color: #f1f4f9;
}
.sim-comentarios .comment-body {
  border: 1px solid #e2e8f0;
  padding: 1rem;
}
.dark .sim-comentarios .comment-body {
  border-color: #334155;
}

/* Publicidad lateral fija 160x600 en Noticias SIM (v1.7):
   dos rascacielos, uno a cada lado, fijos en pantalla al hacer scroll.
   Solo se muestran en PC de pantalla ancha (>=1640px) para no tapar
   el contenido; en pantallas menores y en móvil quedan ocultos. */
.sim-sky { display: none; }
@media (min-width: 1640px) {
  .sim-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;
  }
  .sim-sky-left { left: auto; right: calc(50% + 640px + 12px); }
  .sim-sky-right { left: calc(50% + 640px + 12px); right: auto; }
  .sim-sky-label { font-family: monospace; font-size: 11px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: #94a3b8; text-align: center; }
  .sim-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%; }
