/* =====================================================================
   AVANT Social · Estilos comunes de las entradas del blog (Gutenberg)
   Tokens de marca + clases avs-tabla, avs-tabla--compacta, avs-aviso, avs-cta.
   Lo carga functions.php en todas las entradas. La calculadora usa los mismos tokens.
   Revisado: 02/11/2026
   ===================================================================== */

/* --- Tokens de marca (una sola fuente para tablas, avisos, CTA y calculadora) --- */
:root {
  --avs-azul: #00183D;          /* cabeceras de tabla, botones, bordes de aviso */
  --avs-azul-hover: #0B2C66;
  --avs-verde: #76B82A;         /* solo acentos (bordes); nunca fondo de texto blanco */
  --avs-verde-claro: #EEF8D9;   /* fondo de CTA y resultados positivos */
  --avs-texto: #142341;
  --avs-texto-suave: #4A5568;
  --avs-borde: #D9E1EA;         /* bordes neutros de tablas, paneles y campos */
  --avs-fondo-neutro: #F4F6F9;  /* fondo de avisos */
  --avs-fila-par: #F7F9FB;      /* filas alternas de tablas */
  --avs-radio: 10px;
  --avs-radio-boton: 8px;
}

/* --- Tabla: bloque Tabla con la clase avs-tabla (activar «Sección de cabecera») --- */
.wp-block-table.avs-tabla {
  display: block !important;           /* pixfort pone las figure del artículo en inline-block e impide centrarlas */
  margin: 1.75em 0;
  overflow-x: auto;                    /* en móvil se desplaza, no se aplasta */
  -webkit-overflow-scrolling: touch;
  border-radius: var(--avs-radio);
  border: 1px solid var(--avs-borde);
}
.wp-block-table.avs-tabla table {
  width: 100%;
  min-width: 560px;
  margin: 0;
  border: 0;
  border-collapse: separate;           /* «collapse» anula el radio de las celdas */
  border-spacing: 0;
  font-size: 0.95em;
  line-height: 1.45;
  color: var(--avs-texto);
}
.wp-block-table.avs-tabla th,
.wp-block-table.avs-tabla td {
  padding: 0.75em 1em;
  border: 0;
  border-bottom: 1px solid var(--avs-borde);
  text-align: left;
  vertical-align: top;
}
.wp-block-table.avs-tabla thead th {
  background: var(--avs-azul);
  color: #ffffff;
  font-weight: 600;
  border-bottom: 0;
}
.wp-block-table.avs-tabla tbody tr:nth-child(even) td {
  background: var(--avs-fila-par);
}
.wp-block-table.avs-tabla tbody tr:last-child td {
  border-bottom: 0;
}
.wp-block-table.avs-tabla figcaption {
  font-size: 0.85em;
  color: var(--avs-texto-suave);
  margin: 0.5em 1em;
}
/* Esquinas superiores redondeadas también en la cabecera (refuerzo por si el
   navegador no recorta el fondo de las celdas con el radio del contenedor) */
.wp-block-table.avs-tabla thead th:first-child { border-top-left-radius: calc(var(--avs-radio) - 1px); }
.wp-block-table.avs-tabla thead th:last-child  { border-top-right-radius: calc(var(--avs-radio) - 1px); }
/* Tablas de 2 columnas cortas: centradas y con el mismo ancho máximo que la
   calculadora (680px), para que no queden estiradas; sin ancho mínimo en móvil */
.wp-block-table.avs-tabla.avs-tabla--compacta {
  max-width: 680px;
  margin-left: auto;
  margin-right: auto;
}
.wp-block-table.avs-tabla.avs-tabla--compacta table {
  min-width: 0;
}

/* --- Aviso: bloque Grupo o Párrafo con la clase avs-aviso --- */
.avs-aviso {
  background: var(--avs-fondo-neutro);
  border-left: 4px solid var(--avs-azul);
  border-radius: var(--avs-radio);
  padding: 1em 1.25em;
  margin: 1.5em 0;
  font-size: 0.95em;
  color: var(--avs-texto);
}
.avs-aviso > *:last-child { margin-bottom: 0; }

/* --- CTA final: bloque Grupo con la clase avs-cta --- */
.avs-cta {
  background: var(--avs-verde-claro);
  border-left: 5px solid var(--avs-verde);
  border-radius: var(--avs-radio);
  padding: 1.5em 1.75em;
  margin: 2.5em 0 1em;
  color: var(--avs-texto);
}
.avs-cta > *:first-child { margin-top: 0; }
.avs-cta > *:last-child { margin-bottom: 0; }

/* --- Botones del blog: mismo estilo que los de la calculadora ---
   !important solo donde pixfort impone sus propios colores y radios */
.avs-cta .wp-block-buttons { gap: 12px; margin-top: 1.25em; }
.avs-cta .wp-block-button__link,
.avs-cta .wp-block-button__link:visited {
  display: inline-block;
  background: var(--avs-azul) !important;
  color: #ffffff !important;
  border: 2px solid var(--avs-azul) !important;
  border-radius: var(--avs-radio-boton) !important;
  padding: 0.7em 1.4em !important;
  font-size: 1rem;
  font-weight: 600;
  line-height: 1.3;
  text-decoration: none !important;
}
.avs-cta .wp-block-button__link:hover {
  background: var(--avs-azul-hover) !important;
  border-color: var(--avs-azul-hover) !important;
}
/* Segundo botón con estilo «Contorno» */
.avs-cta .wp-block-button.is-style-outline .wp-block-button__link {
  background: transparent !important;
  color: var(--avs-azul) !important;
}
.avs-cta .wp-block-button.is-style-outline .wp-block-button__link:hover {
  background: var(--avs-azul) !important;
  color: #ffffff !important;
}
.avs-cta .wp-block-button__link:focus-visible {
  outline: 3px solid var(--avs-verde);
  outline-offset: 2px;
}