/*
 * content-fix.css
 * Mejora la legibilidad del texto en inner pages con fondo oscuro.
 * Se aplica SOLO a los contenedores de contenido del artículo.
 * No afecta bloques con fondo blanco/claro (has-white-background-color, etc.)
 */

/* ============================================================
   TÍTULOS H1 — Color dorado brillante
   ============================================================ */
.elementor-widget-container h1,
.wd-text-block h1,
.entry-content h1,
#my-post h1,
.elementor-widget-theme-post-content h1,
.elementor-post__text h1 {
  color: #FFD700 !important;
  text-shadow: 0 1px 3px rgba(0,0,0,0.5);
}

/* Título principal del post (widget heading) */
.elementor-widget-heading .elementor-heading-title,
.elementor-page-title .elementor-heading-title {
  color: #FFD700 !important;
  text-shadow: 0 1px 3px rgba(0,0,0,0.5);
}

/* ============================================================
   TÍTULOS H2 — Azul celeste claro
   ============================================================ */
.elementor-widget-container h2,
.wd-text-block h2,
.entry-content h2,
#my-post h2,
.elementor-widget-theme-post-content h2 {
  color: #4FC3F7 !important;
  text-shadow: 0 1px 2px rgba(0,0,0,0.4);
}

/* ============================================================
   TÍTULOS H3 — Verde claro
   ============================================================ */
.elementor-widget-container h3,
.wd-text-block h3,
.entry-content h3,
#my-post h3,
.elementor-widget-theme-post-content h3,
.elementor-post__title a,
.elementor-post__title {
  color: #81C784 !important;
  text-shadow: 0 1px 2px rgba(0,0,0,0.4);
}

/* ============================================================
   TÍTULOS H4 / H5 / H6 — Naranja suave
   ============================================================ */
.elementor-widget-container h4,
.elementor-widget-container h5,
.elementor-widget-container h6,
.wd-text-block h4,
.wd-text-block h5,
.wd-text-block h6,
.entry-content h4,
.entry-content h5,
.entry-content h6,
#my-post h4,
#my-post h5,
#my-post h6,
.elementor-toc__header-title {
  color: #FFB74D !important;
}

/* ============================================================
   PÁRRAFOS — Gris claro casi blanco
   ============================================================ */
.wd-text-block p,
.elementor-widget-theme-post-content p,
.elementor-widget-theme-post-excerpt p,
.elementor-widget-theme-post-excerpt,
.elementor-post__excerpt p,
#my-post p {
  color: #E0E0E0 !important;
}

/* ============================================================
   LISTAS (ul, ol, li) — Gris claro
   ============================================================ */
.wd-text-block ul,
.wd-text-block ol,
.wd-text-block li,
.elementor-widget-theme-post-content ul,
.elementor-widget-theme-post-content ol,
.elementor-widget-theme-post-content li,
#my-post ul,
#my-post ol,
#my-post li,
#my-post li p {
  color: #D6D6D6 !important;
}

/* ============================================================
   TABLAS — Texto claro sobre fondo oscuro
   ============================================================ */
.wd-text-block table th,
.elementor-widget-theme-post-content table th,
#my-post table th {
  color: #FFD700 !important;
  background-color: rgba(255, 215, 0, 0.12) !important;
}

.wd-text-block table td,
.elementor-widget-theme-post-content table td,
#my-post table td {
  color: #E0E0E0 !important;
}

/* ============================================================
   STRONG / BOLD — Ligeramente más brillante
   ============================================================ */
.wd-text-block strong,
.elementor-widget-theme-post-content strong,
#my-post strong {
  color: #FFFFFF !important;
}

/* ============================================================
   EXTRACTO / EXCERPT en la grilla de posts
   ============================================================ */
.elementor-post__excerpt,
.elementor-post__excerpt p {
  color: #BDBDBD !important;
}

.elementor-post__meta-data,
.elementor-post-date,
.elementor-post-info__item {
  color: #9E9E9E !important;
}

/* ============================================================
   TABLE OF CONTENTS — legible
   ============================================================ */
.elementor-toc__list-item a,
.elementor-toc__list-item-text {
  color: #90CAF9 !important;
}
.elementor-toc__list-item a:hover {
  color: #FFD700 !important;
}

/* ============================================================
   EXCEPCIÓN: Bloques con fondo blanco/claro → NO tocar
   Los textos dentro de .has-white-background-color y similares
   ya son legibles, así que revertimos el color al default oscuro.
   ============================================================ */
.has-white-background-color,
.has-white-background-color *,
.has-pale-pink-background-color,
.has-pale-pink-background-color *,
.has-cyan-bluish-gray-background-color,
.has-cyan-bluish-gray-background-color * {
  /* Se preservan los colores originales — sin override */
  color: revert !important;
  text-shadow: none !important;
}

/* ============================================================
   EXCEPCIÓN: Elementos con color inline explícito de texto claro
   (ej. texto azul/dorado/verde inline en el editor)
   Respetamos colores inline que el editor puso conscientemente.
   ============================================================ */

/* Nota: los estilos inline style="color:..." tienen mayor especificidad
   en combinación con !important desde el HTML. Para respetar colores
   de enlace explícitos (azul #0000ff, etc.) NO sobreescribimos <a>
   que ya tienen color inline. */

/* ============================================================
   GRILLA ARCHIVE — Fecha y meta-info
   ============================================================ */
.elementor-heading-title {
  color: #E0E0E0 !important;
}
/* Pero el H2 de fecha en archive page lo hacemos dorado */
.elementor-element .elementor-widget-heading .elementor-heading-title {
  color: #FFD700 !important;
}