/* ==========================================================================
   V8017 — Paleta editorial suave
   Inspirada en referencia: papel cálido + carbón + coral apagado.
   Objetivo: bajar fatiga visual sin tocar lógica, SEO ni scrapers.
   ========================================================================== */

:root {
  --brand-primary: #494949;
  --brand-primary-2: #3F4141;
  --brand-primary-3: #5A5A57;

  --brand-bg: #E8DDD2;
  --brand-surface: #F4EEE5;
  --brand-surface-2: #F8F2EA;

  --brand-accent: #E85B56;
  --brand-accent-2: #D9655F;
  --brand-danger: #C94E49;
  --brand-info: #494949;

  --brand-text: #2F2F2F;
  --brand-text-2: #494949;
  --brand-text-3: #6E6963;
  --brand-muted: #7D746C;
  --brand-muted-2: #A39A91;

  --brand-border: rgba(73, 73, 73, .16);
  --brand-border-strong: rgba(73, 73, 73, .24);
  --brand-button-hover: #494949;
  --brand-button-hover-text: #F4EEE5;

  --brand-shadow-sm: 0 1px 4px rgba(73, 73, 73, .06);
  --brand-shadow-md: 0 6px 16px rgba(73, 73, 73, .08);
  --brand-shadow-lg: 0 14px 30px rgba(73, 73, 73, .10);

  --theme-ink: var(--brand-text);
  --theme-ink-2: var(--brand-primary);
  --theme-ink-3: var(--brand-primary-2);
  --theme-navy: var(--brand-primary);
  --theme-navy-2: var(--brand-primary-2);
  --theme-blue: var(--brand-primary-3);
  --theme-accent: var(--brand-accent);
  --theme-accent-2: var(--brand-accent-2);
  --theme-bg-soft: var(--brand-bg);
  --theme-surface: var(--brand-surface);
  --theme-white: var(--brand-surface-2);
  --theme-muted: var(--brand-muted);
  --theme-muted-2: var(--brand-muted-2);
  --theme-line: var(--brand-border);
  --theme-line-strong: var(--brand-border-strong);
  --theme-shadow-sm: var(--brand-shadow-sm);
  --theme-shadow-md: var(--brand-shadow-md);
  --theme-shadow-lg: var(--brand-shadow-lg);

  --color-marino: var(--brand-primary);
  --color-azul: var(--brand-primary-2);
  --color-rojo: var(--brand-accent);
  --color-rojo-hover: var(--brand-accent-2);
  --color-crema: var(--brand-bg);
  --color-crema-2: #D8CBBF;
  --color-carbon: var(--brand-primary);
  --color-carbon-2: var(--brand-primary-2);
  --color-coral: var(--brand-accent);
  --color-coral-2: var(--brand-accent-2);
  --color-gris-claro: var(--brand-bg);
  --color-gris: var(--brand-muted);
  --color-borde: var(--brand-border);

  --nev-charcoal: var(--brand-primary);
  --nev-charcoal-2: var(--brand-primary-2);
  --nev-graphite: var(--brand-primary);
  --nev-ink: var(--brand-text);
  --nev-coral: var(--brand-accent);
  --nev-coral-2: var(--brand-accent-2);
  --nev-coral-soft: rgba(232, 91, 86, .14);
  --nev-cream: var(--brand-bg);
  --nev-cream-2: var(--brand-surface);
  --nev-surface: var(--brand-surface);
  --nev-paper: var(--brand-surface);
  --nev-paper-2: var(--brand-surface-2);
  --nev-line: var(--brand-border);
}

html,
body {
  background: var(--brand-bg) !important;
  color: var(--brand-text);
}

body {
  background-image:
    radial-gradient(circle at 14% 10%, rgba(232, 91, 86, .09) 0 78px, transparent 80px),
    radial-gradient(circle at 92% 24%, rgba(73, 73, 73, .045) 0 120px, transparent 122px),
    linear-gradient(180deg, var(--brand-bg) 0%, #E4D8CC 100%) !important;
  background-attachment: fixed;
}

/* Shell global */
.header,
.nev-header,
.footer,
.footer-main {
  background: rgba(232, 221, 210, .96) !important;
  color: var(--brand-text) !important;
  box-shadow: none !important;
}

.header,
.nev-header {
  border-bottom: 1px solid rgba(73, 73, 73, .16) !important;
}

.nav-link,
.nav-dropdown-btn,
.nev-search-toggle {
  color: var(--brand-text) !important;
}

.nav-link:hover,
.nav-link.activo,
.nav-dropdown-btn:hover,
.nav-dropdown.open > .nav-dropdown-btn,
.nev-search-toggle:hover {
  background: rgba(232, 91, 86, .12) !important;
  color: var(--brand-text) !important;
  box-shadow: none !important;
}

.mobile-menu-toggle,
.menu-toggle,
.nev-menu-button,
button[aria-label*="Menú"],
button[aria-label*="menu"],
.header .menu-btn,
.nev-header .menu-btn {
  background: var(--brand-primary) !important;
  color: var(--brand-surface) !important;
  border-color: var(--brand-primary) !important;
  box-shadow: none !important;
}

.nav-dropdown-menu,
.nev-search-form,
.nev-search-suggestions {
  background: var(--brand-surface-2) !important;
  border-color: var(--brand-border) !important;
  box-shadow: var(--brand-shadow-md) !important;
}

.nav-dropdown-item,
.nev-search-input,
.nev-search-submit,
.nev-search-option {
  color: var(--brand-text) !important;
}

.nav-dropdown-item:hover,
.nev-search-option:hover,
.nev-search-option.is-active {
  background: rgba(232, 91, 86, .12) !important;
}

/* Hero y controles */
.hero,
body #hero.hero {
  background: linear-gradient(180deg, #F4EEE5 0%, #E8DDD2 100%) !important;
  color: var(--brand-text) !important;
  border-bottom: 1px solid var(--brand-border) !important;
  box-shadow: none !important;
}

.fecha-selector::before,
body #hero .fecha-selector::before,
.fecha-selector:before,
body #hero .fecha-selector:before {
  color: rgba(73, 73, 73, .62) !important;
  text-shadow: none !important;
}

.fecha-actual,
.fecha-nav,
.sorteo-banner,
.sorteobanner--simple,
.estado-update,
body #hero .fecha-actual,
body #hero .fecha-nav,
body #hero .sorteobanner--simple,
body #hero .estado-update {
  background: rgba(244, 238, 229, .92) !important;
  color: var(--brand-text) !important;
  border-color: var(--brand-border) !important;
  box-shadow: none !important;
}

.fecha-nav:hover:not(:disabled),
.fecha-actual:hover,
body #hero .fecha-nav:hover:not(:disabled),
body #hero .fecha-actual:hover {
  background: var(--brand-surface-2) !important;
  border-color: var(--brand-border-strong) !important;
}

.estado-punto,
.tabla-clasica-live span {
  background: var(--brand-accent) !important;
}

/* Tiras de accesos */
.stats-quick-strip,
.home-games-strip,
body .stats-quick-strip,
body .home-games-strip {
  background: rgba(244, 238, 229, .84) !important;
  border: 1px solid var(--brand-border) !important;
  box-shadow: none !important;
}

.stats-quick-link,
.games-quick-strip--same .stats-quick-link,
body .stats-quick-link {
  background: rgba(248, 242, 234, .78) !important;
  border-color: var(--brand-border) !important;
  color: var(--brand-text) !important;
  box-shadow: none !important;
}

.stats-quick-link:hover,
.games-quick-strip--same .stats-quick-link:hover,
body .stats-quick-link:hover {
  background: rgba(232, 91, 86, .12) !important;
  color: var(--brand-text) !important;
  border-color: rgba(232, 91, 86, .30) !important;
  transform: none !important;
}

.stats-quick-link svg {
  color: var(--brand-primary) !important;
}

/* Pizarra de resultados */
.tabla-clasica-head h2,
body .tabla-clasica-head h2,
.nev-h1-after-results h1 {
  color: var(--brand-text) !important;
}

.tabla-clasica-head p,
body .tabla-clasica-head p {
  color: rgba(47, 47, 47, .68) !important;
}

.tabla-clasica-live,
body .tabla-clasica-live {
  background: var(--brand-primary) !important;
  color: var(--brand-surface) !important;
  box-shadow: none !important;
}

.tabla-prov-row,
body .tabla-prov-row,
body .quiniela-clasica .tabla-prov-row {
  background: rgba(244, 238, 229, .88) !important;
  border: 1px solid var(--brand-border) !important;
  box-shadow: none !important;
}

.tabla-prov-nombre,
.tabla-pizarra-btn,
body .tabla-prov-nombre,
body .tabla-pizarra-btn {
  background: rgba(248, 242, 234, .82) !important;
  color: var(--brand-text) !important;
  border-color: var(--brand-border) !important;
  box-shadow: none !important;
}

.tabla-pizarra-btn:not(:disabled):hover,
.tabla-pizarra-btn:not(:disabled):focus-visible,
html body .quiniela-clasica .tabla-prov-row .tabla-prov-head .tabla-pizarra-btn:not(:disabled):hover,
html body .quiniela-clasica .tabla-prov-row .tabla-prov-head .tabla-pizarra-btn:not(:disabled):focus-visible {
  background: var(--brand-primary) !important;
  border-color: var(--brand-primary) !important;
  color: var(--brand-surface) !important;
  box-shadow: none !important;
  transform: none !important;
}

.tabla-turno,
.tabla-turno.con-dato:not(.activo),
.tabla-turno.sin-dato:not(.activo),
.tabla-turno.en-vivo:not(.activo),
body .tabla-clasica-list .tabla-prov-row .tabla-turnos-grid .tabla-turno,
body .tabla-clasica-list .tabla-prov-row .tabla-turnos-grid .tabla-turno.con-dato,
body .tabla-clasica-list .tabla-prov-row .tabla-turnos-grid .tabla-turno.en-vivo,
body .tabla-clasica-list .tabla-prov-row .tabla-turnos-grid .tabla-turno.sin-dato {
  background: var(--brand-primary) !important;
  color: var(--brand-surface) !important;
  box-shadow: none !important;
}

.tabla-turno.activo,
body .tabla-clasica-list .tabla-prov-row .tabla-turnos-grid .tabla-turno.activo {
  background: var(--brand-accent) !important;
  color: var(--brand-surface) !important;
  box-shadow: none !important;
}

.tabla-turno-label,
body .tabla-turno-label,
body .tabla-clasica-list .tabla-prov-row .tabla-turnos-grid .tabla-turno .tabla-turno-label {
  color: rgba(244, 238, 229, .76) !important;
}

.tabla-turno-num,
body .tabla-turno-num,
body .tabla-clasica-list .tabla-prov-row .tabla-turnos-grid .tabla-turno .tabla-turno-num {
  color: var(--brand-surface) !important;
}

/* Resumen del día anterior */
.resumen-ayer-head,
.resumen-ayer-body,
.resumen-ayer-prov,
body .resumen-ayer-head,
body .resumen-ayer-body,
body .resumen-ayer-prov {
  background: rgba(244, 238, 229, .88) !important;
  border-color: var(--brand-border) !important;
  box-shadow: none !important;
}

.resumen-ayer-head {
  background-image: none !important;
}

.resumen-ayer-kicker,
body .resumen-ayer-kicker {
  background: rgba(232, 91, 86, .14) !important;
  border-color: rgba(232, 91, 86, .22) !important;
  color: var(--brand-primary) !important;
}

.resumen-ayer-head h2,
.resumen-ayer-head p strong,
body .resumen-ayer-head h2,
body .resumen-ayer-head p strong {
  color: var(--brand-text) !important;
}

.resumen-ayer-head p,
body .resumen-ayer-head p {
  color: rgba(47, 47, 47, .68) !important;
}

.resumen-ayer-btn,
body .resumen-ayer-btn {
  background: var(--brand-accent) !important;
  color: var(--brand-surface) !important;
  box-shadow: none !important;
}

.resumen-ayer-prov h3,
body .resumen-ayer-prov h3 {
  background: var(--brand-primary) !important;
  color: var(--brand-surface) !important;
}

.resumen-ayer-chip,
body .resumen-ayer-chip {
  background: rgba(248, 242, 234, .78) !important;
  border-color: var(--brand-border) !important;
}

.resumen-ayer-chip span,
body .resumen-ayer-chip span {
  color: var(--brand-accent) !important;
}

.resumen-ayer-chip strong,
body .resumen-ayer-chip strong {
  color: var(--brand-text) !important;
}

/* Modal de premios */
.modal-contenido,
.modal-content,
#modal .modal-contenido {
  background: var(--brand-surface) !important;
  color: var(--brand-text) !important;
  box-shadow: var(--brand-shadow-lg) !important;
}

.modal-header,
html body .modal-header {
  background: var(--brand-primary) !important;
  color: var(--brand-surface) !important;
}

.modal-cerrar,
html body .modal-cerrar {
  background: rgba(248, 242, 234, .14) !important;
  color: var(--brand-surface) !important;
}

.modal-cerrar:hover,
html body .modal-cerrar:hover,
html body .modal-cerrar:focus-visible {
  background: rgba(232, 91, 86, .82) !important;
  color: var(--brand-surface) !important;
}

.numero-item,
#modal .modal-grid .numero-item {
  background: rgba(248, 242, 234, .88) !important;
  color: var(--brand-text) !important;
  box-shadow: none !important;
}

.numero-item.destacado,
#modal .modal-grid .numero-item.destacado {
  background: var(--brand-primary) !important;
  color: var(--brand-surface) !important;
  border-color: var(--brand-accent) !important;
}

.numero-posicion,
.numero-valor,
html body #modal .modal-grid .numero-item .numero-posicion,
html body #modal .modal-grid .numero-item .numero-valor {
  color: inherit !important;
}

/* Juegos y bloques secundarios */
.quini6-card,
.game-card,
.juego-card,
.provincia-card,
article.provincia-card,
.nev-tools-head,
.nev-tools-grid,
.home-geo-answer,
.info-seo,
.faq-section,
.app-install-section,
.nev-trust-card {
  background: rgba(244, 238, 229, .88) !important;
  border-color: var(--brand-border) !important;
  box-shadow: none !important;
  color: var(--brand-text) !important;
}

.quini6-card__header,
.quini6-sorteo-head,
.juego-card__header {
  background: var(--brand-primary) !important;
  color: var(--brand-surface) !important;
}

.quini6-bola,
.bola,
.numero-bola {
  background: var(--brand-primary) !important;
  color: var(--brand-surface) !important;
  box-shadow: none !important;
}

/* Footer */
.footer,
.footer-main {
  background: var(--brand-primary) !important;
  color: rgba(244, 238, 229, .82) !important;
  border-top: 1px solid rgba(244, 238, 229, .14) !important;
}

.footer a,
.footer-col-title,
.footer-logo,
.footer-meta,
.footer-tagline {
  color: var(--brand-surface) !important;
}

.footer-logo--oficial {
  background: rgba(244, 238, 229, .94) !important;
  border-color: rgba(244, 238, 229, .22) !important;
}

.volver-arriba,
button.volver-arriba {
  background: var(--brand-primary) !important;
  color: var(--brand-surface) !important;
  border-color: var(--brand-primary) !important;
  box-shadow: none !important;
}

.volver-arriba:hover,
button.volver-arriba:hover {
  background: var(--brand-accent) !important;
  border-color: var(--brand-accent) !important;
}

/* v8018 — Menú del header en carbón oscuro, sin volver al coral claro. */
html body .nev-menu-button,
html body .header .nev-menu-button,
html body .nev-header .nev-menu-button,
html body button.nev-menu-button {
  background: #2F2F2F !important;
  border-color: #2F2F2F !important;
  color: #F4EEE5 !important;
  box-shadow: none !important;
}

html body .nev-menu-button:hover,
html body .nev-menu-button:focus-visible,
html body .nev-menu-button[aria-expanded="true"],
html body .header .nev-menu-button:hover,
html body .header .nev-menu-button:focus-visible,
html body .header .nev-menu-button[aria-expanded="true"] {
  background: #2F2F2F !important;
  border-color: #2F2F2F !important;
  color: #F4EEE5 !important;
  box-shadow: none !important;
  transform: none !important;
}

/* v8021 — Header claro: textos oscuros, menú principal negro. */
html body .header,
html body .header.nev-header,
html body header.header,
html body header.nev-header {
  background: rgba(232, 221, 210, .96) !important;
  color: #2F2F2F !important;
  border-bottom-color: rgba(73, 73, 73, .16) !important;
}

html body .header .nav-link,
html body .header .nav-dropdown-btn,
html body .header .nev-primary-link,
html body .header .nev-primary-dropdown-btn,
html body .nev-header .nav-link,
html body .nev-header .nav-dropdown-btn,
html body .nev-header .nev-primary-link,
html body .nev-header .nev-primary-dropdown-btn {
  color: #2F2F2F !important;
  background: transparent !important;
  border-color: rgba(73, 73, 73, .22) !important;
  box-shadow: none !important;
  text-shadow: none !important;
}

html body .header .nav-link:hover,
html body .header .nav-link:focus-visible,
html body .header .nav-link.activo,
html body .header .nav-link.is-active,
html body .header .nav-dropdown-btn:hover,
html body .header .nav-dropdown-btn:focus-visible,
html body .header .nev-primary-link:hover,
html body .header .nev-primary-link:focus-visible,
html body .header .nev-primary-link.is-active,
html body .header .nev-primary-dropdown.is-open .nev-primary-dropdown-btn,
html body .header .nev-primary-dropdown-btn:hover,
html body .header .nev-primary-dropdown-btn:focus-visible,
html body .nev-header .nav-link:hover,
html body .nev-header .nav-link:focus-visible,
html body .nev-header .nav-link.activo,
html body .nev-header .nav-link.is-active,
html body .nev-header .nav-dropdown-btn:hover,
html body .nev-header .nav-dropdown-btn:focus-visible,
html body .nev-header .nev-primary-link:hover,
html body .nev-header .nev-primary-link:focus-visible,
html body .nev-header .nev-primary-link.is-active,
html body .nev-header .nev-primary-dropdown.is-open .nev-primary-dropdown-btn,
html body .nev-header .nev-primary-dropdown-btn:hover,
html body .nev-header .nev-primary-dropdown-btn:focus-visible {
  color: #2F2F2F !important;
  background: rgba(73, 73, 73, .08) !important;
  border-color: rgba(73, 73, 73, .32) !important;
  box-shadow: none !important;
}

html body .header .nav-dropdown-menu,
html body .header .stats-nav-menu,
html body .header .nev-primary-dropdown-menu,
html body .nev-header .nav-dropdown-menu,
html body .nev-header .stats-nav-menu,
html body .nev-header .nev-primary-dropdown-menu {
  background: #F4EEE5 !important;
  border-color: rgba(73, 73, 73, .18) !important;
  box-shadow: none !important;
}

html body .header .nav-dropdown-item,
html body .header .stats-nav-menu .nav-dropdown-item,
html body .header .nev-primary-dropdown-item,
html body .nev-header .nav-dropdown-item,
html body .nev-header .stats-nav-menu .nav-dropdown-item,
html body .nev-header .nev-primary-dropdown-item {
  color: #2F2F2F !important;
  background: transparent !important;
  text-shadow: none !important;
}

html body .header .nav-dropdown-item:hover,
html body .header .nav-dropdown-item:focus-visible,
html body .header .nav-dropdown-item.is-active,
html body .header .stats-nav-menu .nav-dropdown-item:hover,
html body .header .nev-primary-dropdown-item:hover,
html body .header .nev-primary-dropdown-item:focus-visible,
html body .header .nev-primary-dropdown-item.is-active,
html body .nev-header .nav-dropdown-item:hover,
html body .nev-header .nav-dropdown-item:focus-visible,
html body .nev-header .nav-dropdown-item.is-active,
html body .nev-header .stats-nav-menu .nav-dropdown-item:hover,
html body .nev-header .nev-primary-dropdown-item:hover,
html body .nev-header .nev-primary-dropdown-item:focus-visible,
html body .nev-header .nev-primary-dropdown-item.is-active {
  color: #2F2F2F !important;
  background: rgba(232, 91, 86, .12) !important;
  box-shadow: none !important;
}

html body .header .nev-menu-button,
html body .nev-header .nev-menu-button,
html body button.nev-menu-button {
  background: #2F2F2F !important;
  border-color: #2F2F2F !important;
  color: #F4EEE5 !important;
  box-shadow: none !important;
}

html body .header .nev-menu-button:hover,
html body .header .nev-menu-button:focus-visible,
html body .header .nev-menu-button[aria-expanded="true"],
html body .nev-header .nev-menu-button:hover,
html body .nev-header .nev-menu-button:focus-visible,
html body .nev-header .nev-menu-button[aria-expanded="true"],
html body button.nev-menu-button:hover,
html body button.nev-menu-button:focus-visible,
html body button.nev-menu-button[aria-expanded="true"] {
  background: #2F2F2F !important;
  border-color: #2F2F2F !important;
  color: #F4EEE5 !important;
  box-shadow: none !important;
  transform: none !important;
}

/* ==========================================================================
   V8023 — Modal premios: cabecera centrada y posición 01 visible
   ========================================================================== */
#modal .modal-header,
html body #modal .modal-header {
  display: grid !important;
  grid-template-columns: 40px minmax(0, 1fr) 40px !important;
  align-items: center !important;
  gap: 10px !important;
  text-align: center !important;
}

#modal .modal-header > div:first-child,
html body #modal .modal-header > div:first-child {
  grid-column: 2 !important;
  min-width: 0 !important;
  text-align: center !important;
}

#modal .modal-titulo,
#modal #modalTitulo,
html body #modal .modal-header #modalTitulo {
  width: 100% !important;
  justify-content: center !important;
  text-align: center !important;
  color: var(--brand-surface, #F4EEE5) !important;
}

#modal .modal-subtitulo,
#modal #modalSubtitulo,
html body #modal .modal-header #modalSubtitulo {
  display: block !important;
  width: 100% !important;
  text-align: center !important;
  color: rgba(244, 238, 229, .88) !important;
  opacity: 1 !important;
}

#modal .modal-cerrar,
html body #modal .modal-cerrar {
  grid-column: 3 !important;
  justify-self: end !important;
}

#modal .numero-item.destacado .numero-posicion,
html body #modal .modal-grid .numero-item.destacado .numero-posicion {
  color: var(--brand-primary, #494949) !important;
  background: var(--brand-surface, #F4EEE5) !important;
}

#modal .numero-item.destacado .numero-valor,
html body #modal .modal-grid .numero-item.destacado .numero-valor {
  color: var(--brand-surface, #F4EEE5) !important;
}

/* SEO refresh v8031: bloques long-tail suaves */
.info-seo-longtail .seo-link-grid a {
  text-decoration: none;
}

.numero-longtail-grid {
  margin-top: 0;
}