/*!
   IV InabVirtual — estilo unificado de artículos (custom/iv/iv-articulos.css)
   Referencia: artículo 427 "Nuevo PEMP del Centro Histórico de Cartagena" (julio 2026).
   Se aplica a todos los artículos: IvHelper envuelve el texto en <div class="iv-articulo">.
   También se ve en el editor (templates/g5_hydrogen/css/editor.css importa este archivo).
   Clases disponibles: ver custom/iv/plantilla-articulo.html.
   Usa los colores de marca definidos en custom/iv/iv.css (--iv-*); aquí solo hay valores de respaldo.
   ===================================================== */
:root{
  --iva-texto:#2b3440;
  --iva-suave:#5b6573;
  --iva-linea:#e2e8f0;
  --iva-titulo:var(--iv-azul-subido,#142d53);
  --iva-enlace:var(--iv-azul-bajito,#0082cc);
  --iva-enlace-hover:var(--iv-azul-contraste,#004aad);
  --iva-fuente:"roboto",-apple-system,"Segoe UI",Arial,sans-serif;
  --iva-fuente-titulos:"Abel","roboto",Arial,sans-serif;
  --iva-tamano:1.0625rem;      /* 17 px */
  --iva-interlineado:1.75;
  /* Cajas (colores del artículo de referencia) */
  --iva-dato-fondo:#fffbeb;   --iva-dato-borde:#f59e0b;
  --iva-alerta-fondo:#fff1f2; --iva-alerta-borde:#e11d48;
  --iva-consejo-fondo:#f0fdf4;--iva-consejo-borde:#86efac; --iva-consejo-titulo:#15803d;
  --iva-nota-fondo:#f0f6ff;   --iva-nota-borde:var(--iv-azul-bajito,#0082cc); --iva-nota-texto:#1e3a5f;
  --iva-tabla-cabecera:var(--iv-azul-subido,#142d53); --iva-tabla-cebra:#f8faff; --iva-tabla-th-fondo:#e8f0fb;
}

/* ---- Texto base ---- */
:is(.iv-articulo,.mce-content-body){font-family:var(--iva-fuente);font-size:var(--iva-tamano);line-height:var(--iva-interlineado);color:var(--iva-texto)}
:is(.iv-articulo,.mce-content-body) :is(p,li,td,th,dd,dt,blockquote,figcaption){font-family:inherit}
:is(.iv-articulo,.mce-content-body) p{margin:0 0 1.1rem}
:is(.iv-articulo,.mce-content-body) :is(ul,ol){margin:0 0 1.2rem;padding-left:1.4rem}
:is(.iv-articulo,.mce-content-body) li{margin-bottom:.4rem}
:is(.iv-articulo,.mce-content-body) strong,:is(.iv-articulo,.mce-content-body) b{color:inherit;font-weight:700}
:is(.iv-articulo,.mce-content-body) a{color:var(--iva-enlace);text-decoration:underline;text-underline-offset:2px}
:is(.iv-articulo,.mce-content-body) a:hover{color:var(--iva-enlace-hover)}

/* ---- Títulos (h1 dentro del texto se muestra como h2: el título del artículo ya es el h1) ---- */
:is(.iv-articulo,.mce-content-body) :is(h1,h2,h3,h4){font-family:var(--iva-fuente-titulos);color:var(--iva-titulo);font-weight:500;line-height:1.25;text-wrap:balance}
:is(.iv-articulo,.mce-content-body) :is(h1,h2){font-size:1.75rem;margin:2.2rem 0 .9rem}
:is(.iv-articulo,.mce-content-body) h3{font-size:1.35rem;margin:1.8rem 0 .7rem}
:is(.iv-articulo,.mce-content-body) h4{font-size:1.15rem;margin:1.5rem 0 .6rem}
:is(.iv-articulo,.mce-content-body) :is(h1,h2,h3,h4) *{font-size:inherit;color:inherit}

/* ---- Línea de autor / meta ---- */
:is(.iv-articulo,.mce-content-body) :is(.meta,.iv-meta){font-size:.875rem;color:var(--iva-suave);border-bottom:1px solid var(--iva-linea);padding-bottom:.8rem;margin-bottom:1.5rem}

/* ---- Imágenes ---- */
:is(.iv-articulo,.mce-content-body) img{max-width:100%;height:auto!important;border-radius:6px}
:is(.iv-articulo,.mce-content-body) figure{margin:0 0 1.5rem}
:is(.iv-articulo,.mce-content-body) figure img{display:block;width:100%}
:is(.iv-articulo,.mce-content-body) figcaption{font-size:.85rem;color:var(--iva-suave);margin-top:.4rem}
:is(.iv-articulo,.mce-content-body) iframe{max-width:100%}

/* ---- Portada del artículo (imagen completa de Joomla): centrada, sin flotar ---- */
.com-content-article figure.item-image{float:none;margin:0 auto 1.75rem;max-width:760px}
.com-content-article figure.item-image img{width:100%;height:auto;border-radius:10px;display:block}

/* ---- Imagen original del artículo, recolocada a mitad del texto ---- */
:is(.iv-articulo,.mce-content-body) figure.iv-figura{margin:2rem auto;max-width:640px;text-align:center}
:is(.iv-articulo,.mce-content-body) figure.iv-figura img{width:100%;height:auto;border-radius:8px}

/* ---- Cajas ---- */
:is(.iv-articulo,.mce-content-body) :is(.iv-dato,.iv-alerta,.iv-nota,.highlight-box){border-left:4px solid;padding:16px 20px;border-radius:0 6px 6px 0;margin:28px 0}
:is(.iv-articulo,.mce-content-body) :is(.iv-dato,.highlight-box){background:var(--iva-dato-fondo);border-left-color:var(--iva-dato-borde)}
:is(.iv-articulo,.mce-content-body) .iv-alerta{background:var(--iva-alerta-fondo);border-left-color:var(--iva-alerta-borde)}
:is(.iv-articulo,.mce-content-body) .iv-nota{background:var(--iva-nota-fondo);border-left-color:var(--iva-nota-borde);padding:20px 24px}
:is(.iv-articulo,.mce-content-body) :is(.iv-consejo,.tip-box){background:var(--iva-consejo-fondo);border:1px solid var(--iva-consejo-borde);border-radius:8px;padding:16px 20px;margin:28px 0}
:is(.iv-articulo,.mce-content-body) :is(.iv-consejo,.tip-box) strong{color:var(--iva-consejo-titulo)}
:is(.iv-articulo,.mce-content-body) :is(.iv-dato,.iv-alerta,.iv-nota,.iv-consejo,.highlight-box,.tip-box) p{font-size:.9375rem;margin:0 0 .5rem}
:is(.iv-articulo,.mce-content-body) :is(.iv-dato,.iv-alerta,.iv-nota,.iv-consejo,.highlight-box,.tip-box) p:last-child{margin-bottom:0}

/* ---- Cita ---- */
:is(.iv-articulo,.mce-content-body) :is(blockquote,.iv-cita){border-left:4px solid var(--iva-nota-borde);margin:24px 0;padding:12px 20px;background:var(--iva-nota-fondo);font-style:italic;color:var(--iva-nota-texto);border-radius:0 6px 6px 0}

/* ---- Tablas ---- */
:is(.iv-articulo,.mce-content-body) .iv-tabla{overflow-x:auto;margin:1.5rem 0}
:is(.iv-articulo,.mce-content-body) table{width:100%!important;border-collapse:collapse;font-size:.875rem;margin:12px 0 1.5rem;height:auto!important}
:is(.iv-articulo,.mce-content-body) :is(th,td){padding:8px 12px;border-bottom:1px solid var(--iva-linea);vertical-align:top}
/* Cabeceras: Hydrogen pone th{background:#f7f7f7}, que tapaba el azul y dejaba texto blanco sobre gris claro.
   Celdas th sueltas (encabezado de fila): fondo azul muy claro y texto azul subido.
   Filas de cabecera (thead, .iv-cabecera y las antiguas con fondo azul en línea): azul subido y texto blanco. */
:is(.iv-articulo,.mce-content-body) th{background:var(--iva-tabla-th-fondo);color:var(--iva-titulo);font-weight:600}
:is(.iv-articulo,.mce-content-body) :is(thead tr,tr.iv-cabecera,tr[style*="#0f3460"],tr[style*="#038cdc"],tr[style*="#038CDC"]){background:var(--iva-tabla-cabecera)!important;color:#fff!important}
:is(.iv-articulo,.mce-content-body) :is(thead tr,tr.iv-cabecera,tr[style*="#0f3460"],tr[style*="#038cdc"],tr[style*="#038CDC"]) :is(th,td){background:transparent!important;color:#fff!important;font-weight:600}
:is(.iv-articulo,.mce-content-body) :is(thead tr,tr.iv-cabecera,tr[style*="#0f3460"],tr[style*="#038cdc"],tr[style*="#038CDC"]) :is(th,td) *{color:#fff!important}
:is(.iv-articulo,.mce-content-body) :is(td,th)[style*="#90949c"]{color:#555b66!important}
:is(.iv-articulo,.mce-content-body) tbody tr:nth-child(even):not(.iv-cabecera){background:var(--iva-tabla-cebra)}
:is(.iv-articulo,.mce-content-body) th{text-align:left}
@media (max-width:640px){:is(.iv-articulo) table{display:block;overflow-x:auto}}

/* ---- Pasos numerados (clases de custom.css reutilizadas) ---- */
:is(.iv-articulo,.mce-content-body) .step-num{background:var(--iva-titulo)}

/* ---- Preguntas frecuentes ---- */
:is(.iv-articulo,.mce-content-body) :is(.iv-faq,.faq-item){border-bottom:1px solid #eee;padding:16px 0}
:is(.iv-articulo,.mce-content-body) :is(.iv-faq,.faq-item):last-child{border-bottom:none}
:is(.iv-articulo,.mce-content-body) :is(.iv-faq__pregunta,.faq-q){font-weight:700;color:var(--iva-titulo);margin-bottom:8px}

/* ---- Firma y fuentes al final ---- */
:is(.iv-articulo,.mce-content-body) .iv-fuentes{font-size:.8125rem;color:#999;text-align:center}

/* ---- Llamada a la acción escrita dentro del artículo (misma presentación que la CTA automática) ---- */
:is(.iv-articulo,.mce-content-body) .cta-box h3{color:#fff;margin-top:0;font-size:1.25rem}
:is(.iv-articulo,.mce-content-body) .cta-box p{color:#ccd9ee}

@media (max-width:600px){
  :is(.iv-articulo){font-size:1rem}
  :is(.iv-articulo) :is(h1,h2){font-size:1.5rem}
  :is(.iv-articulo) h3{font-size:1.25rem}
}
