/*
Theme Name: La Data Diaria (child)
Theme URI: https://ladatadiaria.com
Description: Child theme de ColorMag Pro que aplica la identidad de marca de La Data Diaria (ladatadiaria.com). Todos los cambios de marca viven aquí para sobrevivir las actualizaciones del tema padre. Ver README.md.
Author: La Data Diaria
Template: colormag-pro
Version: 1.3.0
Requires PHP: 7.4
Text Domain: ladatadiaria-child
*/

/* =========================================================================
   LA DATA DIARIA — CHILD THEME
   Estructura del archivo:
     0. Tokens (variables de marca)
     1. Base (fondo papel, tipografías, links)
     2. Topbar (fecha / dólar / clima / suscribite)
     3. Ticker MOTOR (breaking news del tema -> coral)
     4. Header + wordmark
     5. Navegación principal (MOTOR en coral)
     6. Cards de notas (sin sombras / sin radio, badges Archivo Black)
     7. Página de nota (titular Archivo Black, cuerpo Source Serif)
     8. Botones / inputs / buscador
     9. Footer
    10. El Pantallazo de Hoy (shortcode [pantallazo])
    11. Reglas duras de marca (kill de sombras / degradados / radios)
    12. Responsive
   Las variables de color/tipografía se definen una sola vez en :root y NO
   se repiten literales hex por el resto del archivo.
   ========================================================================= */

/* ---- 0. TOKENS ---------------------------------------------------------- */
:root {
  --tinta:    #0D1B2A;   /* primario: texto y fondos oscuros */
  --papel:    #FAF8F5;   /* fondo */
  --senal:    #00D4FF;   /* acento / punto de data — único elemento gráfico */
  --pizarra:  #5C6B7A;   /* secundario: metadatos */
  --coral:    #FF5A5F;   /* SOLO Motor / urgente / badges */
  --hairline: #E3E0DA;   /* bordes suaves */

  --ff-black: 'Archivo Black', 'Arial Black', sans-serif;
  --ff-serif: 'Source Serif 4', Georgia, 'Times New Roman', serif;
  --ff-sans:  'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;

  --wrap: 64px; /* padding horizontal de referencia del diseño */
}

/* ---- 1. BASE ------------------------------------------------------------ */
body,
body.colormag-pro,
.cm-normal-container {
  background-color: var(--papel) !important;
  color: var(--tinta);
  font-family: var(--ff-sans);
}

a { color: var(--tinta); text-decoration: none; }
a:hover, a:focus { color: var(--senal); }

/* Punto de data reutilizable (bullet / señal de vivo / acento) */
.ldd-dot {
  display: inline-block;
  width: .52em; height: .52em;
  border-radius: 50%;
  background: var(--senal);
  margin-left: .15em;
  flex: none;
  vertical-align: baseline;
}

h1, h2, h3, h4,
.cm-entry-title,
.cm-entry-title a,
.widget-title,
.cm-featured-posts .cm-entry-title {
  font-family: var(--ff-black);
  letter-spacing: -0.01em;
  color: var(--tinta);
}
.cm-entry-title a:hover { color: var(--senal); }

/* Labels/uppercase de UI en Inter con tracking amplio */
.cm-date, .date-in-header,
.cm-below-entry-meta,
.cm-entry-header-meta,
.cm-author, .cm-posted-on {
  font-family: var(--ff-sans);
}

/* ---- 2. TOPBAR ---------------------------------------------------------- */
.cm-top-bar {
  background: var(--tinta) !important;
  color: var(--papel);
  border: 0;
}
.cm-top-bar .cm-container { }
.cm-top-bar,
.cm-top-bar a,
.cm-top-bar .date-in-header {
  font-family: var(--ff-sans);
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.12em;
  color: var(--papel);
  text-transform: uppercase;
}
.cm-top-bar .date-in-header { color: var(--papel); }
.cm-top-bar a { color: var(--senal) !important; }         /* SUSCRIBITE GRATIS */
.cm-top-bar a:hover { color: var(--papel) !important; }
.cm-top-bar .cm-top-search .cm-icon,
.cm-top-bar .social-links a { color: var(--pizarra) !important; }

/* ---- 3. TICKER MOTOR (breaking news del tema) --------------------------- */
/* El label "Lo Último" del Customizer se renombra a "MOTOR" (ver README) y se
   estiliza como badge coral en Archivo Black. */
.cm-top-bar .breaking-news {
  border-bottom: 1px solid var(--hairline);
}
.breaking-news-latest {
  font-family: var(--ff-black) !important;
  font-size: 12px !important;
  font-weight: 400 !important;
  letter-spacing: 0.08em;
  background: var(--coral) !important;
  color: var(--papel) !important;
  padding: 5px 10px 4px !important;
  border-radius: 0 !important;
  text-transform: uppercase;
}
.breaking-news-latest::before,
.breaking-news-latest::after { display: none !important; } /* quita flechitas/triángulos del tema */
.newsticker li a {
  font-family: var(--ff-sans);
  font-size: 14px;
  font-weight: 500;
  color: var(--tinta);
}
.newsticker li a:hover { color: var(--senal); }

/* ---- 4. HEADER + WORDMARK ----------------------------------------------- */
.cm-header .cm-header-1 { background: var(--papel); }
.cm-header-1 .cm-row {
  border-bottom: 3px solid var(--tinta);
  padding-bottom: 8px;
}

/* Oculta cualquier logo rasterizado remanente del tema */
.cm-site-branding img.custom-logo,
.cm-site-branding .custom-logo-link img { display: none !important; }

/* Wordmark tipográfico "la data diaria" + punto de data (inyectado por PHP) */
.ldd-wordmark {
  font-family: var(--ff-black);
  font-size: 44px;
  line-height: 1;
  letter-spacing: -0.015em;
  color: var(--tinta);
  white-space: nowrap;
  display: inline-flex;
  align-items: baseline;
  text-transform: lowercase;
}
.ldd-wordmark:hover { color: var(--tinta); }
.ldd-wordmark:hover .ldd-dot { background: var(--senal); }
.ldd-wordmark .ldd-dot { align-self: flex-end; margin-bottom: .06em; }
/* variante para fondos tinta (footer oscuro, etc.) */
.ldd-wordmark--light { color: var(--papel); }

/* ---- 5. NAVEGACIÓN PRINCIPAL -------------------------------------------- */
.cm-primary-nav { background: var(--papel); }
.cm-primary-nav ul li a {
  font-family: var(--ff-sans);
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 0.1em;
  color: var(--tinta);
  text-transform: uppercase;
}
/* Acento: reemplaza el amarillo del tema por señal cian */
.cm-primary-nav ul li a:hover,
.cm-primary-nav ul li.current-menu-item > a,
.cm-primary-nav ul li.current_page_item > a,
.cm-primary-nav ul li.current-menu-ancestor > a,
.cm-primary-nav ul li:hover > a { color: var(--senal) !important; }

.cm-primary-nav ul li.current-menu-item,
.cm-primary-nav ul li:hover,
.cm-home-icon.front_page_on { background: transparent !important; }
.cm-home-icon .cm-icon { fill: var(--tinta); color: var(--tinta); }

/* MOTOR siempre en coral (item de la categoría Motor, id 296 -> menu-item-1245) */
.cm-primary-nav .menu-item-1245 > a,
.cm-primary-nav li a[href*="/motor/"] { color: var(--coral) !important; }
.cm-primary-nav .menu-item-1245:hover > a,
.cm-primary-nav li a[href*="/motor/"]:hover { color: var(--coral) !important; opacity: .8; }

/* ---- 6. CARDS DE NOTAS -------------------------------------------------- */
.cm-first-post, article, .cm-content article,
.cm-featured-posts, .cm-highlighted-post-no-slide,
.hentry, .cm-post-content {
  background: transparent;
  box-shadow: none !important;
  border-radius: 0 !important;
}
.cm-featured-image img, .cm-post-thumbnail img, .wp-post-image {
  border-radius: 0 !important;
  box-shadow: none !important;
}

/* Badge de categoría rectangular en Archivo Black */
.cm-post-categories a,
a.category.tag,
.cm-above-title-cat a,
.cm-cat-links a {
  font-family: var(--ff-black) !important;
  font-size: 12px;
  font-weight: 400;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  background: var(--tinta) !important;
  color: var(--papel) !important;
  padding: 5px 10px 4px !important;
  border-radius: 0 !important;
  display: inline-block;
  line-height: 1;
}
.cm-post-categories a:hover,
a.category.tag:hover { color: var(--papel) !important; opacity: .85; }

/* MOTOR siempre coral, en cualquier badge/enlace de categoría */
.cm-post-categories a[href*="/motor/"],
a.category.tag[href*="/motor/"] {
  background: var(--coral) !important;
  color: var(--papel) !important;
}

.cm-entry-title { line-height: 1.15; }
.cm-entry-title a { letter-spacing: -0.005em; }
.cm-entry-summary, .cm-entry-summary p {
  font-family: var(--ff-serif);
  font-size: 15px;
  line-height: 1.5;
  color: var(--pizarra);
}
.cm-below-entry-meta,
.cm-below-entry-meta a,
.cm-posted-on, .cm-author {
  font-family: var(--ff-sans);
  font-size: 13px;
  color: var(--pizarra);
}
.cm-below-entry-meta a:hover { color: var(--senal); }

/* Hover en cards: sin translate ni sombra — solo el titular reacciona */
.cm-first-post:hover, article:hover, .hentry:hover {
  transform: none !important;
  box-shadow: none !important;
}

/* ---- 7. PÁGINA DE NOTA -------------------------------------------------- */
.single .cm-entry-title,
.single-post .entry-title,
.single .entry-title {
  font-family: var(--ff-black);
  letter-spacing: -0.01em;
  line-height: 1.06;
  color: var(--tinta);
}
.single .entry-content,
.single .cm-entry-content,
.single .entry-content p,
.single .cm-entry-content p {
  font-family: var(--ff-serif);
  font-size: 19px;
  line-height: 1.6;
  color: var(--tinta);
}
.single .entry-content a { color: var(--tinta); text-decoration: underline; text-decoration-color: var(--senal); }
.single .entry-content a:hover { color: var(--senal); }

/* Byline con punto de data */
.single .cm-entry-header-meta,
.single .cm-below-entry-meta {
  font-family: var(--ff-sans);
  font-size: 13px;
  color: var(--pizarra);
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
}
.single .cm-author { font-weight: 700; color: var(--tinta); }
.single .cm-author::after {
  content: "";
  display: inline-block;
  width: 8px; height: 8px;
  border-radius: 50%;
  background: var(--senal);
  margin-left: 12px;
  vertical-align: middle;
}

/* Badge de sección grande en el single */
.single .cm-post-categories a {
  font-size: 13px;
  padding: 6px 12px 5px !important;
}

/* ---- 8. BOTONES / INPUTS / BUSCADOR ------------------------------------- */
button, input[type="submit"], input[type="button"], .btn, .cm-button,
.wpcf7-submit, .mc4wp-form input[type="submit"] {
  font-family: var(--ff-black) !important;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  background: var(--senal) !important;
  color: var(--tinta) !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}
button:hover, input[type="submit"]:hover, .cm-button:hover,
.wpcf7-submit:hover, .mc4wp-form input[type="submit"]:hover {
  background: var(--tinta) !important;
  color: var(--papel) !important;
}
input[type="text"], input[type="email"], input[type="search"], textarea {
  font-family: var(--ff-sans);
  border: 1px solid var(--hairline) !important;
  border-radius: 0 !important;
  background: var(--papel);
  color: var(--tinta);
}
.cm-top-search .cm-icon, .cm-search-icon { color: var(--tinta); }

/* ---- 9. FOOTER ---------------------------------------------------------- */
.cm-footer, .colormag-footer--classic {
  background: var(--papel) !important;
  border-top: 3px solid var(--tinta);
  color: var(--tinta);
}
.cm-footer .widget-title { font-family: var(--ff-black); color: var(--tinta); }
.cm-footer a { color: var(--tinta); }
.cm-footer a:hover { color: var(--senal); }
.cm-footer-menu a[href*="/motor/"] { color: var(--coral); }
.cm-footer-bar, .cm-footer-bar-style-3 {
  background: var(--tinta) !important;
  color: var(--papel);
  border: 0;
}
.cm-footer-bar a, .cm-footer-bar { color: var(--papel); }
.cm-footer-bar a:hover { color: var(--senal); }
.cm-footer .social-links a, .cm-footer-bar .social-links a { color: var(--pizarra); }
.cm-footer .social-links a:hover, .cm-footer-bar .social-links a:hover { color: var(--senal); }

/* ---- 10. EL PANTALLAZO DE HOY (shortcode) ------------------------------- */
.ldd-pantallazo {
  background: var(--tinta);
  color: var(--papel);
  padding: 56px var(--wrap);
  display: grid;
  grid-template-columns: 1fr 380px;
  gap: 64px;
  margin: 0;
}
.ldd-pantallazo__head {
  display: flex; align-items: baseline; gap: 18px;
  margin: 0 0 26px;
}
.ldd-pantallazo__title {
  font-family: var(--ff-black);
  font-size: 34px;
  letter-spacing: -0.01em;
  margin: 0;
  color: var(--papel);
  text-transform: uppercase;
}
.ldd-pantallazo__date {
  font-family: var(--ff-sans);
  font-size: 12px; font-weight: 600;
  letter-spacing: 0.14em;
  color: var(--senal);
  text-transform: uppercase;
}
.ldd-pantallazo__list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 18px; }
.ldd-pantallazo__item { display: flex; gap: 16px; align-items: baseline; }
.ldd-pantallazo__item::before {
  content: "";
  flex: none;
  width: 12px; height: 12px;
  border-radius: 50%;
  background: var(--senal);
  position: relative; top: 3px;
}
.ldd-pantallazo__item span, .ldd-pantallazo__item a {
  font-family: var(--ff-serif);
  font-size: 19px;
  line-height: 1.4;
  color: var(--papel);
}
.ldd-pantallazo__item a:hover { color: var(--senal); }

.ldd-pantallazo__news {
  display: flex; flex-direction: column; gap: 16px; justify-content: center;
  border-left: 1px solid rgba(92,107,122,0.4);
  padding-left: 48px;
}
.ldd-pantallazo__news-title { font-family: var(--ff-black); font-size: 22px; line-height: 1.2; color: var(--papel); }
.ldd-pantallazo__news-sub { font-family: var(--ff-sans); font-size: 14px; color: var(--pizarra); line-height: 1.5; }
.ldd-pantallazo__form { display: flex; gap: 0; }
.ldd-pantallazo__form input[type="email"] {
  flex: 1; background: var(--papel) !important; color: var(--pizarra);
  font-size: 13px; padding: 13px 14px; border: 0 !important;
}
.ldd-pantallazo__form button, .ldd-pantallazo__form input[type="submit"] {
  background: var(--senal) !important; color: var(--tinta) !important;
  font-family: var(--ff-black) !important; font-size: 13px; letter-spacing: 0.06em;
  padding: 13px 20px; border: 0 !important;
}

/* ---- 11. REGLAS DURAS DE MARCA ------------------------------------------ */
/* Sin degradados / sombras / border-radius decorativo en componentes del tema */
.cm-header, .cm-footer, .widget, .cm-first-post, .cm-featured-posts,
.cm-post-content, .cm-content, .sidebar .widget, .cm-button, .pagination a,
.cm-page-builder, .cm-slider-area, .cm-thumbnail-slider-news li {
  background-image: none !important;
  box-shadow: none !important;
}
.widget, .cm-first-post, .cm-featured-image, .wp-post-image,
.cm-button, .pagination a, .pagination span, .cm-post-thumbnail img {
  border-radius: 0 !important;
}
/* El único círculo permitido es el punto de data / avatares isotipo */
.ldd-dot, .ldd-pantallazo__item::before, .single .cm-author::after,
.avatar, .cm-author img { border-radius: 50% !important; }

/* Paginación / widgets: acento cian */
.pagination .current, .pagination a:hover,
.widget_categories a:hover, .widget a:hover { color: var(--senal); }
.widget-title::after, .cm-section-title::after { background: var(--senal) !important; }

/* ---- 12. RESPONSIVE ----------------------------------------------------- */
@media (max-width: 991px) {
  .ldd-pantallazo { grid-template-columns: 1fr; gap: 32px; padding: 40px 24px; }
  .ldd-pantallazo__news { border-left: 0; padding-left: 0; border-top: 1px solid rgba(92,107,122,0.4); padding-top: 28px; }
  .ldd-wordmark { font-size: 34px; }
  .cm-top-bar { text-align: center; }
}
@media (max-width: 600px) {
  .ldd-wordmark { font-size: 30px; }
  .single .entry-content, .single .entry-content p { font-size: 18px; }
}

/* =========================================================================
   13. CORRECCIONES POST-REVISIÓN EN VIVO (v1.2.0)
   Overrides verificados sobre el render real de ColorMag Pro en el sitio.
   Van al final para ganar por orden de fuente a las reglas del tema (que usan
   selectores de ID / colores del Customizer).
   ========================================================================= */

/* 13a. Barra de navegación: el tema la deja oscura (#27272a) con #cm-primary-nav
   (ID). Se fuerza a papel para que los links tinta se lean. */
#cm-primary-nav, .cm-primary-nav, .cm-header-2 { background: var(--papel) !important; border-top: 0 !important; }
.cm-header-2 { border-top: 3px solid var(--tinta) !important; }
#cm-primary-nav a, .cm-primary-nav ul li a { color: var(--tinta) !important; }
#cm-primary-nav a[href*="/motor/"] { color: var(--coral) !important; }             /* MOTOR coral */
#cm-primary-nav a:hover,
.cm-primary-nav ul li:hover > a,
.cm-primary-nav ul li.current-menu-item > a { color: var(--senal) !important; }    /* hover cian */
#cm-primary-nav .cm-icon path, .cm-home-icon .cm-icon path { fill: var(--tinta) !important; }
.cm-home-icon.front_page_on { background: transparent !important; }

/* 13b. Header: ocultar el site-title + tagline del tema (duplican el wordmark). */
.cm-site-title, .site-title, #cm-site-branding .site-title,
.site-description, #cm-site-branding .site-description, .cm-site-description { display: none !important; }

/* 13c. Home: quitar el loop de notas de abajo + su paginación.
   Se conservan los bloques de categorías (Economía, Deportes, Recetas, Motor). */
.home #cm-primary > .cm-posts,
.home #cm-primary > .default-wp-page { display: none !important; }

/* 13d. Cards sin bordes/sombras (algunos widgets del tema los traían). */
.cm-featured-posts article, .cm-posts article, .cm-highlighted-post,
.cm-featured-posts--style-4 article, .cm-featured-posts--style-5 .cm-highlighted-post {
  box-shadow: none !important; border-radius: 0 !important; border: 0 !important;
}

/* 13e. Footer: el tema lo renderiza oscuro-sucio (#3f3f46/#27272a) con links tinta
   (dark-on-dark). Se normaliza a Tinta de marca con texto Papel. */
#cm-footer, .cm-footer, .cm-footer-cols { background: var(--tinta) !important; }
#cm-footer .widget, #cm-footer .cm-upper-footer-col, #cm-footer .widget_text { background: transparent !important; }
.cm-footer-cols, .cm-footer-cols *, .cm-footer .widget, .cm-footer .widget * { color: var(--papel) !important; }
.cm-footer-cols a:hover, .cm-footer .widget a:hover { color: var(--senal) !important; }
.cm-footer-menu a[href*="/motor/"], .cm-footer-cols a[href*="/motor/"] { color: var(--coral) !important; }
/* Títulos de widget del footer: Archivo Black, sin la placa azul del tema (va en el <span>). */
#cm-footer .cm-widget-title {
  background: transparent !important; color: var(--papel) !important;
  border-bottom: 1px solid rgba(92,107,122,0.5) !important;
  padding: 0 0 8px 0 !important;
  font-family: var(--ff-black) !important; font-size: 14px !important;
  letter-spacing: 0.02em !important; text-transform: uppercase !important;
}
#cm-footer .cm-widget-title span { background: transparent !important; color: var(--papel) !important; padding: 0 !important; box-shadow: none !important; }
/* Wordmark del footer (inyectado por ldd.js en reemplazo del logo RG). */
.cm-footer .ldd-wordmark { font-size: 30px; }

/* 13f. Página de nota: ColorMag envuelve TODO el cuerpo en .cm-entry-summary,
   que en las cards va a 15px/Pizarra. En el single se sube a 19px/Tinta/1.6
   (spec 18–20px) y se ordena la jerarquía de subtítulos. */
.single .cm-entry-summary,
.single .cm-entry-summary p,
.single .cm-entry-summary li {
  font-family: var(--ff-serif) !important;
  font-size: 19px !important;
  line-height: 1.6 !important;
  color: var(--tinta) !important;
}
.single .cm-entry-summary a { color: var(--tinta) !important; text-decoration: underline; text-decoration-color: var(--senal); }
.single .cm-entry-summary a:hover { color: var(--senal) !important; }
.single .cm-entry-summary h2 { font-size: 26px !important; line-height: 1.15 !important; margin: 1.4em 0 .5em; }
.single .cm-entry-summary h3 { font-size: 22px !important; line-height: 1.2 !important; margin: 1.2em 0 .4em; }

/* 13g. Mobile: el toggle (hamburguesa) del tema es blanco y vive dentro del nav
   (ahora Papel) -> quedaría invisible. Se fuerza a Tinta. El panel del menú
   hereda el fondo Papel del nav, así que sus links Tinta se leen bien. */
.cm-menu-toggle, .cm-menu-toggle .cm-icon, .cm-menu-toggle .cm-icon--bars { color: var(--tinta) !important; fill: var(--tinta) !important; }
.cm-menu-primary-container a[href*="/motor/"] { color: var(--coral) !important; }

/* =========================================================================
   14. REDES SOCIALES, CRÉDITO Y PUBLICIDAD (v1.3.0)
   ========================================================================= */

/* 14a. Íconos de redes (inyectados por ldd.js en topbar y footer). */
.ldd-social { display: inline-flex; gap: 14px; align-items: center; }
.ldd-social a { color: var(--papel); display: inline-flex; transition: color .15s; }
.ldd-social a:hover { color: var(--senal) !important; }
.cm-top-bar__2 .ldd-social { margin-left: 4px; }
.cm-footer .ldd-social { margin-top: 16px; }
.cm-footer .ldd-social a { color: var(--papel) !important; }
.cm-footer .ldd-social a:hover { color: var(--senal) !important; }

/* 14b. Crédito "Powered by Yellow Pulse Digital" (amarillo de marca YP). */
.ldd-credit { font-family: var(--ff-sans); font-size: 12px; color: var(--pizarra); margin-top: 6px; }
.ldd-credit a { color: #FFD400 !important; font-weight: 700; text-decoration: none; }
.ldd-credit a:hover { color: #FFD400 !important; text-decoration: underline; }

/* 14c. Contenedores de publicidad (reubicados por ldd.js desde el pool).
   Los anuncios son de terceros: quedan exentos del sistema de 5 colores. */
.ldd-ad { margin: 30px auto; text-align: center; max-width: 100%; overflow: hidden; }
.ldd-ad--header { margin: 12px auto 4px; }
.ldd-ad--inline { margin: 34px auto; }
.ldd-ad::before {
  content: "PUBLICIDAD";
  display: block;
  font-family: var(--ff-sans);
  font-size: 9px; letter-spacing: 0.14em;
  color: var(--pizarra); text-transform: uppercase;
  margin-bottom: 6px;
}
.ldd-adwidget { display: inline-block; max-width: 100%; }
.ldd-adwidget img, .ldd-adwidget ins, .ldd-adwidget iframe { max-width: 100%; height: auto; }
#ldd-ad-pool { display: none !important; }