/* Super Rifas en producción (5-nov-2026): el modelo 2 pasado a azul oscuro con botones
   naranja, como la referencia que mandó Juan. Va después de styles.css y solo pisa colores. */

body.tema-noche {
  --naranja: #F39C12;
  --naranja-hover: #FFB12E;
  --naranja-t: #0E1B48;
  --celeste: #4DB8FF;
  --color-bg: #0E1B48;
  --color-bg-alt: #12225A;
  --color-surface: #182C6B;
  --color-text: #F3F5FF;
  --color-text-muted: #BAC3E8;
  --color-primary: var(--naranja);
  --color-primary-hover: var(--naranja-hover);
  --color-secondary: var(--naranja);
  --color-cta: var(--naranja);
  --color-cta-hover: var(--naranja-hover);
  --color-cta-text: var(--naranja-t);
  --azul-claro: rgba(243, 156, 18, .16);
  --azul-luz: #FFC25C;
  --noche: #0A1438;
  --noche-2: #12225A;
  --niebla: #EEF0F8;
  --niebla-muted: #BAC3E8;
  --linea: rgba(255, 255, 255, .12);
  --linea-fuerte: rgba(255, 255, 255, .28);
  --shadow-lg: 0 26px 64px rgba(0, 0, 0, .4);
  background: var(--color-bg);
  scrollbar-color: rgba(243, 156, 18, .55) var(--color-bg-alt);
}
html:has(body.tema-noche) { background: #0E1B48; }

/* "Papel": el boleto y los campos se leen sobre blanco, como un talón de rifa de verdad. */
.tema-noche .ticket,
.tema-noche .lupa__caja {
  --color-surface: #FFFFFF;
  --color-bg-alt: #EEF0F6;
  --color-text: #12173F;
  --color-text-muted: #4E5677;
  --linea: rgba(18, 23, 63, .12);
  --linea-fuerte: rgba(18, 23, 63, .24);
  --color-primary: #C46A00;
  --azul-claro: #FFF0D9;
  color: var(--color-text);
}
.tema-noche .ticket .btn--cta { background: var(--naranja); color: var(--naranja-t); }
.tema-noche .ticket .btn--cta:hover { background: var(--naranja-hover); }
.tema-noche .ticket__talon,
.tema-noche .ticket--hero .ticket__talon { background: var(--naranja); color: var(--naranja-t); border-color: rgba(14, 27, 72, .35); }
.tema-noche .ticket__talon .wm__a { color: var(--naranja-t); }
.tema-noche .ticket__talon .wm__b,
.tema-noche .ticket--hero .wm__b { background: var(--naranja-t); color: var(--naranja); }
.tema-noche .ticket__label,
.tema-noche .ticket__vacio,
.tema-noche .ticket__premio,
.tema-noche .ticket__total,
.tema-noche .ticket--hero .ticket__talon .ticket__label,
.tema-noche .ticket--hero .ticket__valor { color: rgba(14, 27, 72, .78); }
.tema-noche .ticket__total { border-top-color: rgba(14, 27, 72, .3); }
.tema-noche .ticket__total b,
.tema-noche .ticket__rango,
.tema-noche .ticket__valor b { color: var(--naranja-t); }
.tema-noche .ticket--compra .ticket__talon { border-bottom-color: rgba(14, 27, 72, .35); }
.tema-noche .ticket--hero .ticket__valor { border-color: rgba(14, 27, 72, .3); }
.tema-noche .ticket__info .ticket__label { color: var(--color-text-muted); }
.tema-noche .chip-num { background: var(--naranja-t); color: #fff; }
.tema-noche .compra-ok__nums .chip-num { background: var(--res-bg); color: var(--res-t); }
.tema-noche .compra-ok__nums .chip-num--vendido { background: var(--vendido); color: #fff; }

/* Encabezado y botones */
.tema-noche .site-header--m2 { background: rgba(10, 20, 56, .92); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); }
.tema-noche .wm__b { color: var(--naranja-t); }
.tema-noche .site-header--m2 .header-cta { background: var(--naranja); color: var(--naranja-t); }
.tema-noche .site-header--m2 .header-cta .ico { color: var(--naranja-t); }
.tema-noche .site-header--m2 .main-nav a:hover { color: var(--naranja); }
.tema-noche .btn--cta { font-weight: 800; box-shadow: 0 10px 26px rgba(243, 156, 18, .22); }
.tema-noche .btn--claro { background: var(--naranja); color: var(--naranja-t); }
.tema-noche .btn--claro .ico { color: var(--naranja-t); }
.tema-noche .btn--claro:hover { background: var(--naranja-hover); }
.tema-noche .btn--azar { background: rgba(243, 156, 18, .14); color: #FFC25C; }
.tema-noche .btn--azar:hover { background: rgba(243, 156, 18, .24); }
.tema-noche .btn--tinta { background: #25D366; color: #06331A; }
.tema-noche .btn--tinta:hover { background: #3BE07A; }
.tema-noche .chip { background: transparent; border-color: var(--linea-fuerte); color: var(--color-text); }
.tema-noche .chip[aria-pressed="true"] { background: var(--naranja); border-color: var(--naranja); color: var(--naranja-t); }
@media (max-width: 1200px) {
  .tema-noche .main-nav { background: #12225A; color: var(--color-text); }
  .tema-noche .main-nav a { color: var(--color-text); }
}

/* Hero */
.tema-noche .hero--m2 {
  background:
    radial-gradient(55% 60% at 12% 0%, rgba(44, 86, 214, .5), transparent 70%),
    radial-gradient(40% 50% at 92% 18%, rgba(243, 156, 18, .2), transparent 72%),
    #0E1B48;
}
.ganador {
  display: inline-flex; align-items: center; gap: .6rem; margin-bottom: 1.1rem; padding: .7rem 1.1rem;
  border-radius: 14px; background: var(--naranja); color: var(--naranja-t); font-weight: 600;
}
.ganador b { font: 800 1.15rem/1 var(--font-display); }
.ganador .ico { width: 22px; height: 22px; }

/* Tablero */
.tema-noche .numeros2 { background: var(--color-bg-alt); }
.tema-noche .tablero { background: var(--color-surface); border-color: var(--linea); }
.tema-noche .buscar { background: #fff; border-color: transparent; color: #4E5677; }
.tema-noche .buscar input { color: #12173F; }
.tema-noche .buscar input::placeholder { color: #7A819F; }
.tema-noche .num.is-sel { background: var(--celeste); border-color: var(--celeste); color: #06204A; box-shadow: 0 8px 22px rgba(77, 184, 255, .35); }
.tema-noche .dot--tuyo { background: var(--celeste); }
.tema-noche .num.ruleta { background: #fff; border-color: #fff; color: #0E1B48; }
.tema-noche .num--libre:not(:disabled):hover { border-color: var(--celeste); }
.tema-noche .tablero__vacio { background: rgba(255, 255, 255, .06); }
.tema-noche .eleccion { background: var(--naranja); color: var(--naranja-t); }
.tema-noche .eleccion .btn--cta { background: var(--naranja-t); color: #fff; box-shadow: none; }
.tema-noche .avance__barra { background: #CFEBD8; }

/* Formulario (dentro del boleto blanco) */
.tema-noche .campo__error { color: #A3261C; }
.campo--trampa { position: absolute !important; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.compra-ok__mp { margin-top: .45rem; font-size: .82rem; color: var(--color-text-muted); }
.compra-ok__transf { margin-top: .35rem; padding: .7rem .85rem; border-radius: 10px; background: var(--color-bg-alt); white-space: pre-line; font-size: .92rem; }
.compra-ok__pasos .btn { margin-top: .55rem; }

/* Pasos y bases */
.tema-noche .paso__n { background: #1F3889; }
.tema-noche .paso:nth-child(3) .paso__n { background: var(--naranja); color: var(--naranja-t); }
.tema-noche .bases__acepto { color: #FFC25C; }

/* Características del premio */
.caracts { margin-top: clamp(18px, 2.6vw, 28px); padding: clamp(18px, 2.4vw, 24px); border-radius: var(--radius-lg); background: var(--color-surface); border: 1px solid var(--linea); }
.caracts__titulo { font: 800 var(--fs-h3)/1.2 var(--font-display); margin-bottom: .8rem; }
.caracts__lista { display: grid; gap: .55rem; }
.caracts__lista li { display: flex; align-items: flex-start; gap: .6rem; line-height: 1.45; }
.caracts__ok { flex: none; font-size: 1.05rem; line-height: 1.3; }
.caracts__lista b { font-weight: 600; color: #fff; }

/* Rifa solidaria */
.solidaria { background: linear-gradient(180deg, #12225A, #0E1B48); }
.solidaria__grid { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: clamp(24px, 4vw, 56px); align-items: center; }
.solidaria__txt { display: grid; gap: 1rem; justify-items: start; padding: clamp(22px, 3.4vw, 40px); border-radius: var(--radius-lg); background: var(--naranja); color: var(--naranja-t); }
.solidaria__txt h2 { font: 800 var(--fs-h2)/1.12 var(--font-display); letter-spacing: -.02em; text-wrap: balance; }
.solidaria__txt p { font-size: 1.05rem; max-width: 52ch; }
.solidaria__txt .btn--cta { background: var(--naranja-t); color: #fff; box-shadow: none; }
.solidaria__txt .btn--cta:hover { background: #1F3889; }
.solidaria__fotos { display: grid; gap: 12px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.solidaria__fotos--1 { grid-template-columns: minmax(0, 1fr); }
.solidaria__fotos--3 li:first-child { grid-column: 1 / -1; }
.solidaria__fotos figure { margin: 0; display: grid; gap: .45rem; }
.solidaria__ver { display: block; width: 100%; padding: 0; border: 0; border-radius: 16px; overflow: hidden; background: #fff; cursor: zoom-in; }
.solidaria__ver img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; transition: scale .5s var(--ease); }
.solidaria__fotos--1 .solidaria__ver img { aspect-ratio: auto; max-height: 520px; object-fit: contain; }
.solidaria__ver:hover img { scale: 1.03; }
.solidaria__fotos figcaption { font-size: .88rem; color: var(--color-text-muted); }
/* Sin imágenes todavía: el texto solo, centrado. */
.solidaria__grid--solo { grid-template-columns: minmax(0, 1fr); max-width: 820px; }
.solidaria__grid--solo .solidaria__txt { justify-items: center; text-align: center; }
@media (max-width: 860px) {
  .solidaria__grid { grid-template-columns: minmax(0, 1fr); }
}

/* Foto ampliada */
.lupa { position: fixed; inset: 0; z-index: 200; display: grid; place-items: center; padding: 20px; }
.lupa__fondo { position: absolute; inset: 0; background: rgba(5, 10, 30, .82); }
.lupa__caja { position: relative; margin: 0; max-width: min(960px, 100%); max-height: 100%; display: grid; gap: .5rem; background: none; }
.lupa__caja img { max-width: 100%; max-height: calc(100dvh - 110px); width: auto; height: auto; border-radius: 14px; background: #fff; }
.lupa__caja figcaption { color: #fff; text-align: center; font-size: .95rem; }
.lupa__cerrar { position: absolute; top: 14px; right: 14px; width: 48px; height: 48px; display: grid; place-items: center; border: 0; border-radius: 50%; background: #fff; color: #0E1B48; }

/* Extras, cierre y pie */
.tema-noche .extras { background: var(--color-bg); }
.tema-noche .extra:hover { border-color: rgba(243, 156, 18, .6); }
.tema-noche .proxima__kicker { background: var(--naranja); color: var(--naranja-t); }
.tema-noche .cierre--m2 { background: var(--color-bg-alt); }
.tema-noche .cierre__caja { background: var(--color-surface); box-shadow: 0 24px 60px rgba(0, 0, 0, .3); border: 1px solid var(--linea); }
.tema-noche .site-footer { background: #091233; }
.footer-mp img { width: 120px; height: auto; background: #fff; padding: 6px 10px; border-radius: 8px; box-sizing: content-box; }
.tema-noche .toast { background: #fff; color: #0E1B48; }
.tema-noche .toast svg { color: #1B8A4C; }
.tema-noche .eleccion b, .tema-noche .eleccion__txt { color: var(--naranja-t); }
.tablero__pag-info { white-space: nowrap; font-size: .85rem; }
.tablero__pager .btn { padding-inline: .8rem; }
