/* ============================================================================
   TEMA HALLOWEEN — "Calabaza & Medianoche" · paleta Arena (octubre 2026)
   Piel que se monta SOBRE las plantillas existentes, sin tocar su HTML ni su JS.
   Todo va scopeado a body.tema-halloween: quitar la clase o el include del partial
   partials/_tema_halloween.html devuelve el diseño original.
   Respeta los colores con significado: rojo (peligro / escaneando), morado (QR dev),
   verde de WhatsApp/éxito y los estados de máquina (disponible/ocupada/mant./apagada).
   ============================================================================ */

body.tema-halloween{
  --ha-pump-900:#5E2306; --ha-pump-700:#9A3A0A; --ha-pump-600:#C2560F; --ha-pump-500:#E06A14;
  --ha-pump-400:#F28A3A; --ha-pump-300:#F7AE6B; --ha-pump-200:#FBD3AE;
  --ha-night-950:#07050D; --ha-night-900:#0F0A1A; --ha-night-800:#181028; --ha-night-700:#251A3B;
  --ha-display:'Fraunces',Georgia,serif;
  --ha-ui:'Inter',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;
  --ha-fire:linear-gradient(180deg,#E8772A 0%,#B4470C 100%);
  --ha-grain:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='160' height='160'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 1  0 0 0 0 1  0 0 0 0 1  0 0 0 .55 0'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>");
  /* Paleta Arena */
  --ha-page-bg:radial-gradient(1100px 520px at 105% -10%,rgba(224,106,20,.16),transparent 60%),radial-gradient(900px 500px at -10% 115%,rgba(91,74,122,.14),transparent 60%),#D8C6AC;
  --ha-surface:#EEE2D0; --ha-surface-2:#E6D6C0; --ha-input:#F5ECDF; --ha-line:#CDB596; --ha-line-soft:#DCC8AD;
  --ha-chip:#E9D2B6; --ha-tint:rgba(224,106,20,.10);
  --ha-ink:#22180F; --ha-ink-2:#4A3B2E; --ha-muted:#66574A; --ha-muted-2:#7F6E5F;
  --ha-shadow:0 1px 0 rgba(255,255,255,.35) inset,0 10px 26px rgba(70,40,10,.12);

  background:var(--ha-page-bg) !important; background-attachment:fixed !important; color:var(--ha-ink) !important;
}
body.tema-halloween, body.tema-halloween.font-sans{ font-family:var(--ha-ui) !important; -webkit-font-smoothing:antialiased; }
body.tema-halloween #particles-js{ display:none !important; }                 /* reemplazadas por murciélagos */
body.tema-halloween ::selection{ background:var(--ha-pump-200); color:var(--ha-ink); }
body.tema-halloween :focus-visible{ outline:2px solid var(--ha-pump-500) !important; outline-offset:2px; }

/* ── Íconos: una sola familia de línea (Lucide) pintada sobre los <i class="fa-…"> ──
   El JS asigna --ha-ico a cada ícono con equivalente; el resto sigue con Font Awesome. */
body.tema-halloween i.ha-ico::before{
  content:"" !important; display:inline-block; width:1.08em; height:1.08em; vertical-align:-.17em;
  background-color:currentColor; -webkit-mask:var(--ha-ico) center/contain no-repeat; mask:var(--ha-ico) center/contain no-repeat;
}

/* ── Barras de desplazamiento ── */
body.tema-halloween *{ scrollbar-width:thin; scrollbar-color:var(--ha-pump-400) transparent; }
body.tema-halloween *::-webkit-scrollbar{ width:8px; height:8px; }
body.tema-halloween *::-webkit-scrollbar-track{ background:transparent !important; }
body.tema-halloween *::-webkit-scrollbar-thumb{ background:var(--ha-pump-400) !important; border-radius:10px; }

/* ── Fondo animado (canvas de murciélagos) + bandadas: detrás del contenido ── */
.ha-field, .ha-bats{ position:fixed; inset:0; width:100%; height:100%; z-index:-1; pointer-events:none; }

/* ── Brillo que sigue al cursor + onda al tocar ── */
body.tema-halloween main .ha-lit{ background:radial-gradient(420px circle at var(--ha-mx,50%) var(--ha-my,50%),rgba(242,138,58,.14),transparent 45%),var(--ha-surface) !important; }
.ha-ripple{ position:absolute; border-radius:50%; pointer-events:none; background:radial-gradient(circle,rgba(255,200,140,.55) 0%,rgba(242,138,58,.25) 40%,transparent 70%); transform:scale(0); animation:ha-ripple .6s ease-out forwards; }
@keyframes ha-ripple{ to{ transform:scale(1); opacity:0; } }

/* ═════════════════════════ SIDEBAR (cajero: #app-sidebar · admin: _sidebar.html · reportes: aside propio) ═════════════════════════ */
body.tema-halloween :is(#app-sidebar, aside.bg-gray-900){
  position:relative; overflow:hidden;
  background:radial-gradient(140% 45% at 90% 0%,#2D1F4D 0%,transparent 55%),linear-gradient(180deg,var(--ha-night-800),var(--ha-night-900) 60%,var(--ha-night-950)) !important;
  box-shadow:4px 0 30px rgba(10,5,20,.25) !important; border-right:1px solid rgba(255,255,255,.05);
}
body.tema-halloween :is(#app-sidebar, aside.bg-gray-900) nav{ overflow-x:hidden; }
@media (min-width:1024px){ body.tema-halloween :is(#app-sidebar, aside.bg-gray-900):has(.sidebar-nav){ justify-content:flex-start !important; } }
body.tema-halloween :is(#app-sidebar, aside.bg-gray-900)::after{ content:""; position:absolute; inset:0; background:var(--ha-grain); opacity:.06; mix-blend-mode:overlay; pointer-events:none; }
body.tema-halloween :is(#app-sidebar, aside.bg-gray-900) :is(.border-b, .border-t, .border-gray-700, .border-gray-200){ border-color:rgba(255,255,255,.08) !important; }
body.tema-halloween :is(#app-sidebar, aside.bg-gray-900) > div:first-child > div:first-child > i.fa-gamepad{ color:var(--ha-pump-400); filter:drop-shadow(0 0 10px rgba(242,138,58,.45)); }
body.tema-halloween :is(#app-sidebar, aside.bg-gray-900) img.rounded-full{ box-shadow:0 0 0 2px rgba(242,138,58,.45),0 0 18px rgba(242,138,58,.25); }
body.tema-halloween :is(#app-sidebar, aside.bg-gray-900) nav{ position:relative; }
body.tema-halloween :is(#app-sidebar, aside.bg-gray-900) nav .text-gray-500{ color:#8E80A3 !important; }
body.tema-halloween :is(#app-sidebar, aside.bg-gray-900) .text-gray-400{ color:#A597B8 !important; }
body.tema-halloween :is(#app-sidebar, aside.bg-gray-900) .nav-link{ color:#CDC1DD !important; border-radius:12px !important; position:relative; z-index:1; }
@media (min-width:1024px){ body.tema-halloween :is(#app-sidebar, aside.bg-gray-900) .sidebar-nav .nav-link{ justify-content:flex-start !important; padding-left:1rem !important; } }
body.tema-halloween :is(#app-sidebar, aside.bg-gray-900) .nav-link i{ width:1.25rem; text-align:center; opacity:.9; }
body.tema-halloween :is(#app-sidebar, aside.bg-gray-900) .nav-link:hover:not(.active){ background:rgba(255,255,255,.06) !important; color:#fff !important; transform:none !important; }
body.tema-halloween :is(#app-sidebar, aside.bg-gray-900) .nav-link.active{
  background:linear-gradient(90deg,rgba(224,106,20,.95),rgba(154,58,10,.88)) !important; color:#fff !important;
  box-shadow:0 10px 24px rgba(224,106,20,.32),inset 0 1px 0 rgba(255,255,255,.2) !important; border:0 !important; padding-left:.75rem;
}
body.tema-halloween :is(#app-sidebar, aside.bg-gray-900) .sidebar-nav .nav-link.active{ padding-left:1rem !important; }
/* Menús que marcan el activo con bg-blue-600 directo (p. ej. reportes) */
body.tema-halloween aside.bg-gray-900 nav a.bg-blue-600{
  background:linear-gradient(90deg,rgba(224,106,20,.95),rgba(154,58,10,.88)) !important; color:#fff !important;
  box-shadow:0 10px 24px rgba(224,106,20,.32),inset 0 1px 0 rgba(255,255,255,.2) !important; border-radius:12px !important; }
body.tema-halloween aside.bg-gray-900 nav a:not(.bg-blue-600):not(.nav-link){ color:#CDC1DD !important; border-radius:12px !important; }
body.tema-halloween aside.bg-gray-900 nav a:not(.bg-blue-600):not(.nav-link):hover{ background:rgba(255,255,255,.06) !important; color:#fff !important; }
body.tema-halloween :is(#app-sidebar, aside.bg-gray-900) .nav-link.active::after{ display:none !important; }
/* Píldora deslizante (la crea el JS en escritorio) */
body.tema-halloween .ha-pill{ position:absolute; left:0; top:0; height:0; border-radius:12px; z-index:0; pointer-events:none;
  background:linear-gradient(90deg,rgba(224,106,20,.95),rgba(154,58,10,.88)); box-shadow:0 10px 24px rgba(224,106,20,.32),inset 0 1px 0 rgba(255,255,255,.2); }
body.tema-halloween .ha-pill::before{ content:""; position:absolute; left:-8px; top:11px; bottom:11px; width:3px; border-radius:3px; background:var(--ha-pump-200); box-shadow:0 0 14px 2px var(--ha-pump-400); }
body.tema-halloween .ha-pill-on .nav-link.active{ background:transparent !important; box-shadow:none !important; }
body.tema-halloween .ha-pill-on .nav-link:hover:not(.active){ background:transparent !important; }
/* Soporte y textos azules del sidebar */
body.tema-halloween :is(#app-sidebar, aside.bg-gray-900) :is(a.text-blue-400, .text-blue-400){ color:var(--ha-pump-300) !important; }
/* Escena luna + colinas (solo menú de cajero, escritorio) */
.ha-side-scene{ position:relative; height:140px; margin-top:auto; pointer-events:none; flex-shrink:0; }
.ha-side-scene .ha-moon{ position:absolute; right:28px; top:16px; width:50px; height:50px; border-radius:50%; background:radial-gradient(circle at 35% 30%,#FFF7E2,#EAD6AE 60%,#B89C6C); box-shadow:0 0 40px 8px rgba(246,231,200,.18); }
.ha-side-scene svg{ position:absolute; left:0; right:0; bottom:0; width:100%; height:78px; }
.ha-side-scene svg.ha-side-bats{ top:0; bottom:auto; height:100%; }
@media (max-width:1023px), (max-height:700px){ .ha-side-scene{ display:none; } }
/* Pie de usuario */
body.tema-halloween :is(#app-sidebar, aside.bg-gray-900) :is(.user-info-desktop, .bg-gray-800){ background:rgba(0,0,0,.24) !important; border-color:rgba(255,255,255,.07) !important; position:relative; z-index:1; }
body.tema-halloween #rolBadge{ background:rgba(255,255,255,.07) !important; box-shadow:inset 0 0 0 1px rgba(255,255,255,.1); }
body.tema-halloween #rolBadge:hover{ background:rgba(255,255,255,.12) !important; }
body.tema-halloween #panelPermisos{ background:rgba(255,255,255,.05) !important; box-shadow:inset 0 0 0 1px rgba(255,255,255,.08); border-radius:12px !important; }
/* Barra superior móvil (drawer) */
body.tema-halloween #sidebar-topbar{ background:linear-gradient(90deg,var(--ha-night-800),var(--ha-night-900)) !important; }

/* ═════════════════════════ HERO (/local: lo arma el JS con el h1 + p existentes) ═════════════════════════ */
.ha-hero{ position:relative; isolation:isolate; overflow:hidden; border-radius:22px; margin-bottom:1.5rem; color:#F3ECF8;
  background:radial-gradient(55% 95% at 80% 35%,rgba(224,106,20,.24) 0%,transparent 60%),radial-gradient(70% 80% at 12% 0%,#2B1D49 0%,transparent 65%),linear-gradient(180deg,#140D22,#0B0714);
  box-shadow:0 18px 44px rgba(20,10,30,.24); display:grid; grid-template-columns:minmax(0,1fr) 240px; align-items:center; min-height:150px; }
.ha-hero::before{ content:""; position:absolute; inset:0; background:var(--ha-grain); opacity:.08; mix-blend-mode:overlay; pointer-events:none; z-index:3; }
.ha-hero-copy{ position:relative; z-index:2; padding:20px 30px; }
.ha-eyebrow{ display:inline-flex; align-items:center; gap:10px; font:600 11.5px var(--ha-ui); letter-spacing:.18em; text-transform:uppercase; color:var(--ha-pump-300); }
.ha-eyebrow::before{ content:""; width:26px; height:1.5px; background:currentColor; }
body.tema-halloween .ha-hero h1{ font:400 36px/1.06 var(--ha-display) !important; letter-spacing:-.02em; margin:8px 0 6px !important; color:#FBF6FF !important; }
body.tema-halloween .ha-hero h1 em{ font-style:italic; font-weight:600; padding-right:.06em; background:linear-gradient(180deg,#FFC98A 0%,#F28A3A 55%,#D4621A 100%); -webkit-background-clip:text; background-clip:text; color:transparent; }
body.tema-halloween .ha-hero p{ margin:0 !important; color:#BDB0CF !important; font-size:14.5px !important; }
body.tema-halloween .ha-hero p strong{ color:#fff; font-weight:600; }
body.tema-halloween .ha-hero p i{ color:var(--ha-pump-300); }
.ha-stage{ position:relative; z-index:2; height:150px; }
.ha-stage canvas{ display:block; width:100% !important; height:100% !important; cursor:grab; touch-action:pan-y; }
.ha-stage canvas:active{ cursor:grabbing; }
.ha-stage .ha-static{ position:absolute; inset:0; display:grid; place-items:center; }
.ha-stage .ha-static svg{ width:120px; height:auto; filter:drop-shadow(0 0 24px rgba(255,150,50,.45)); }
.ha-hint{ position:absolute; left:50%; bottom:4px; transform:translateX(-50%); padding:5px 10px; border-radius:999px; font:500 11px var(--ha-ui); color:#E9DFF5;
  background:rgba(15,10,26,.55); box-shadow:inset 0 0 0 1px rgba(255,255,255,.12); backdrop-filter:blur(6px); pointer-events:none; white-space:nowrap; transition:opacity .4s; }
.ha-hero .ha-bats-hero{ position:absolute; inset:0; width:100%; height:100%; z-index:1; pointer-events:none; }
@media (max-width:900px){ .ha-hero{ grid-template-columns:minmax(0,1fr) 120px; min-height:120px; } .ha-stage{ height:120px; } body.tema-halloween .ha-hero h1{ font-size:28px !important; } .ha-hero-copy{ padding:16px 18px; } .ha-hint{ display:none; } }

/* ═════════════════════════ CONTENIDO (cajero y admin) ═════════════════════════ */
body.tema-halloween main :is(h1, h2){ font-family:var(--ha-display) !important; font-weight:600 !important; letter-spacing:-.01em; color:var(--ha-ink); }
body.tema-halloween main h2{ white-space:nowrap; }
body.tema-halloween main .fixed h2{ white-space:normal; }
@media (max-width:640px){ body.tema-halloween main h2{ white-space:normal; } }
body.tema-halloween main .bg-white:has(#estadoMaquinasGrid) > div:first-child{ flex-wrap:nowrap !important; }
body.tema-halloween main .bg-white:has(#estadoMaquinasGrid) h2{ font-size:18px !important; min-width:0; overflow:hidden; text-overflow:ellipsis; }
/* Ícono de cada título de sección: mismo "chip" en todas */
body.tema-halloween main :is(h1, h2, h3) > i:first-child{ color:var(--ha-pump-600) !important; }
body.tema-halloween main .bg-white > div > h2 > i:first-child, body.tema-halloween main .bg-white > h2 > i:first-child{
  width:32px; height:32px; display:inline-grid; place-items:center; border-radius:10px; background:var(--ha-chip);
  font-size:16px; margin-right:10px !important; vertical-align:-6px; box-shadow:inset 0 0 0 1px rgba(224,106,20,.18);
}
body.tema-halloween main label > i, body.tema-halloween main p.text-sm > i:first-child{ color:var(--ha-pump-600) !important; }

/* Tarjetas y superficies */
body.tema-halloween main .bg-white{ background-color:var(--ha-surface) !important; }
body.tema-halloween main .bg-white:is(.rounded-lg, .rounded-xl, .rounded-2xl):is(.shadow, .shadow-sm, .shadow-md, .shadow-lg, .shadow-xl){
  border:1px solid var(--ha-line); border-radius:18px !important; box-shadow:var(--ha-shadow) !important;
}
body.tema-halloween main :is(.bg-gray-50, .bg-gray-100){ background-color:var(--ha-surface-2) !important; }
/* Tarjeta propia del admin (.glass-card, blanca al 95%) usada en 18 páginas → superficie Arena */
body.tema-halloween main .glass-card{
  background:var(--ha-surface) !important; border-color:var(--ha-line) !important; border-top-width:1px; border-right-width:1px; border-bottom-width:1px; border-style:solid;
  border-radius:18px !important; box-shadow:var(--ha-shadow) !important; backdrop-filter:none !important;
}
body.tema-halloween main :is(.border-gray-100, .border-gray-200, .border-gray-300){ border-color:var(--ha-line-soft) !important; }
body.tema-halloween main :is(.divide-gray-100, .divide-gray-200) > * + *{ border-color:var(--ha-line-soft) !important; }
body.tema-halloween main :is(.text-gray-800, .text-gray-900){ color:var(--ha-ink) !important; }
body.tema-halloween main :is(.text-gray-600, .text-gray-700){ color:var(--ha-ink-2) !important; }
body.tema-halloween main .text-gray-500{ color:var(--ha-muted) !important; }
body.tema-halloween main .text-gray-400{ color:var(--ha-muted-2) !important; }
body.tema-halloween main button[title^="Actualizar"]{ color:var(--ha-muted-2) !important; }
body.tema-halloween main button[title^="Actualizar"]:hover{ color:var(--ha-pump-600) !important; background:var(--ha-tint) !important; }
/* Acentos azules decorativos → calabaza */
body.tema-halloween main :is(i.text-blue-500, i.text-blue-600, i.text-indigo-500, i.text-indigo-600){ color:var(--ha-pump-600) !important; }
body.tema-halloween main :is(a.text-blue-600, a.text-blue-500, button.text-blue-600.underline){ color:var(--ha-pump-700) !important; }

/* Aviso de promociones activas */
body.tema-halloween #promosActivasBanner{ background:var(--ha-surface) !important; border:1px solid var(--ha-line) !important; border-left:4px solid var(--ha-pump-500) !important; border-radius:16px !important; box-shadow:var(--ha-shadow) !important; }
body.tema-halloween #promosActivasBanner .bg-amber-100{ background:var(--ha-fire) !important; box-shadow:0 6px 16px rgba(224,106,20,.3); }
body.tema-halloween #promosActivasBanner .bg-amber-100 i{ color:#fff !important; }
body.tema-halloween #promosActivasTitulo{ color:var(--ha-pump-900) !important; }
body.tema-halloween #promosActivasBanner .text-amber-600{ color:var(--ha-pump-700) !important; }
body.tema-halloween #promosActivasLista > span{ background:var(--ha-input) !important; border-color:var(--ha-line) !important; color:var(--ha-pump-900) !important; }
body.tema-halloween #promosActivasLista :is(.text-amber-500, .text-amber-600){ color:var(--ha-pump-600) !important; }

/* Resumen del Día — tile 1 (paquetes) */
body.tema-halloween main .bg-gradient-to-br.from-green-50{ background:linear-gradient(160deg,rgba(242,138,58,.16),rgba(242,138,58,.06)),var(--ha-surface-2) !important; border:1px solid var(--ha-line) !important; border-radius:16px !important; }
body.tema-halloween main .bg-gradient-to-br.from-green-50 :is(.text-green-700, .text-green-600){ color:var(--ha-pump-700) !important; }
body.tema-halloween main .bg-gradient-to-br.from-green-50 .bg-green-100{ background:var(--ha-input) !important; color:var(--ha-pump-700) !important; box-shadow:inset 0 0 0 1px var(--ha-line); }
body.tema-halloween #ventasDia{ font:600 46px/1.05 var(--ha-display) !important; letter-spacing:-.02em; color:var(--ha-pump-600) !important; }
body.tema-halloween #ventasDia.text-gray-400{ color:var(--ha-muted-2) !important; }
/* Resumen del Día — tile 2 (ingresos): medianoche con cifra dorada */
body.tema-halloween main .bg-gradient-to-br.from-purple-50{ background:radial-gradient(90% 120% at 100% 0%,rgba(224,106,20,.24),transparent 60%),linear-gradient(180deg,#1B1230,#0F0A1A) !important; border:1px solid #2C2142 !important; border-radius:16px !important; position:relative; overflow:hidden; }
body.tema-halloween main .bg-gradient-to-br.from-purple-50::after{ content:""; position:absolute; inset:0; background:var(--ha-grain); opacity:.08; mix-blend-mode:overlay; pointer-events:none; }
body.tema-halloween main .bg-gradient-to-br.from-purple-50 .text-purple-700{ color:var(--ha-pump-300) !important; }
body.tema-halloween main .bg-gradient-to-br.from-purple-50 .text-purple-600{ color:#BDB0CF !important; }
body.tema-halloween main .bg-gradient-to-br.from-purple-50 .bg-purple-100{ background:rgba(255,255,255,.08) !important; color:#F3ECF8 !important; }
body.tema-halloween #valorTotalVentas{ font:600 40px/1.05 var(--ha-display) !important; letter-spacing:-.02em; background:linear-gradient(180deg,#FFD9AC,#F28A3A) !important; -webkit-background-clip:text !important; background-clip:text !important; -webkit-text-fill-color:transparent !important; }
/* Caja por método y promos */
body.tema-halloween #resumenMetodosDia > div{ background:var(--ha-surface-2) !important; border-color:var(--ha-line) !important; border-radius:14px !important; }
body.tema-halloween #resumenMetodosDia .text-lg{ font-family:var(--ha-display) !important; font-weight:600 !important; font-size:22px !important; color:var(--ha-ink) !important; }
body.tema-halloween #promosNoEfectivo > div{ border-radius:14px !important; }
body.tema-halloween #promosNoEfectivo .bg-pink-50{ background:rgba(236,72,153,.10) !important; border-color:rgba(236,72,153,.30) !important; }
body.tema-halloween #promosNoEfectivo .bg-indigo-50{ background:rgba(99,102,241,.10) !important; border-color:rgba(99,102,241,.30) !important; }

/* Campos y selects */
body.tema-halloween :is(main, .fixed) :is(input[type="text"], input[type="number"], input[type="email"], input[type="password"], input[type="date"], input[type="datetime-local"], input[type="time"], input[type="search"], input[type="tel"], input:not([type]), textarea, select){
  background:var(--ha-input) !important; border:1px solid var(--ha-line) !important; border-radius:12px !important; color:var(--ha-ink) !important; transition:border-color .2s, box-shadow .2s;
}
body.tema-halloween :is(main, .fixed) :is(input, textarea)::placeholder{ color:var(--ha-muted-2) !important; }
body.tema-halloween :is(main, .fixed) :is(input, textarea, select):focus{ outline:none !important; border-color:var(--ha-pump-500) !important; box-shadow:0 0 0 4px rgba(224,106,20,.18) !important; }
body.tema-halloween main input[readonly]{ background:var(--ha-surface-2) !important; }
body.tema-halloween select option{ background:#F5ECDF; color:#22180F; }
body.tema-halloween :is(main, .fixed) input[type="checkbox"], body.tema-halloween :is(main, .fixed) input[type="radio"]{ accent-color:var(--ha-pump-500); }

/* Botón principal "fuego": Escanear QR, Generar Venta y acciones primarias azules */
body.tema-halloween #btnEscanearQR:not(.scanning),
body.tema-halloween main button[onclick*="mostrarModalGenerador"],
body.tema-halloween main :is(button, a):is(.bg-blue-600, .bg-blue-500, .bg-purple-600, .bg-purple-500, .bg-indigo-600, .bg-indigo-500, .btn-primary):not(.ha-keep),
body.tema-halloween .ha-fire{
  position:relative; overflow:hidden; color:#fff !important; border:0 !important; background:var(--ha-fire) !important;
  box-shadow:0 1px 0 rgba(255,255,255,.3) inset,0 0 0 1px rgba(255,180,110,.25),0 10px 24px rgba(224,106,20,.28) !important;
  font-family:var(--ha-display) !important; font-weight:600 !important; letter-spacing:.005em;
}
body.tema-halloween #btnEscanearQR:not(.scanning), body.tema-halloween main button[onclick*="mostrarModalGenerador"]{ border-radius:13px !important; font-size:17px !important; }
body.tema-halloween #btnEscanearQR:not(.scanning):hover, body.tema-halloween main button[onclick*="mostrarModalGenerador"]:hover,
body.tema-halloween main :is(button, a):is(.bg-blue-600, .bg-blue-500, .bg-purple-600, .bg-purple-500, .bg-indigo-600, .bg-indigo-500, .btn-primary):hover, body.tema-halloween .ha-fire:hover{ filter:brightness(1.07); color:#fff !important; }
body.tema-halloween main :is(button, a).btn-secondary{ background:var(--ha-surface-2) !important; color:var(--ha-ink) !important; border:1px solid var(--ha-line) !important; }
body.tema-halloween main button[onclick*="mostrarModalGenerador"]::after, body.tema-halloween #btnEscanearQR:not(.scanning)::before{
  content:""; position:absolute; inset:0; background:linear-gradient(110deg,transparent 35%,rgba(255,255,255,.28) 50%,transparent 65%); transform:translateX(-130%); animation:ha-sheen 5s ease-in-out infinite 1.5s; pointer-events:none; }
@keyframes ha-sheen{ 0%,72%{ transform:translateX(-130%); } 100%{ transform:translateX(130%); } }
body.tema-halloween #btnEscanearQR.scanning{ border-radius:13px !important; }

/* Sección "Generar Códigos QR" de /local: panel de acción (mismos elementos, nuevo acomodo) */
body.tema-halloween main .bg-white:has(> button[onclick*="mostrarModalGenerador"]){
  display:grid; grid-template-columns:minmax(0,1fr) minmax(260px,340px); grid-template-areas:"t cta" "p cta" "d d"; column-gap:28px; row-gap:10px; align-items:center;
  position:relative; overflow:hidden; padding:26px 28px !important;
  background:radial-gradient(120% 140% at 100% 50%,rgba(224,106,20,.16),transparent 55%),var(--ha-surface) !important;
}
body.tema-halloween main .bg-white:has(> button[onclick*="mostrarModalGenerador"]) > h2{ grid-area:t; margin:0 !important; font-size:24px !important; }
body.tema-halloween main .bg-white > button[onclick*="mostrarModalGenerador"]{ grid-area:cta; width:100% !important; min-height:64px; font-size:19px !important; border-radius:16px !important; }
body.tema-halloween main .bg-white > button[onclick*="mostrarModalGenerador"] i{ font-size:20px; margin-right:12px !important; }
body.tema-halloween main .bg-white:has(> button[onclick*="mostrarModalGenerador"]) > div:not([class*="border-dashed"]){
  grid-area:p; margin:0 !important; justify-self:start; display:inline-flex !important; align-items:center; gap:8px; padding:7px 14px; border-radius:999px;
  background:var(--ha-input); box-shadow:inset 0 0 0 1px var(--ha-line); color:var(--ha-ink-2) !important; font-size:12.5px !important; }
body.tema-halloween main .bg-white:has(> button[onclick*="mostrarModalGenerador"]) > div:not([class*="border-dashed"]) > i{ color:var(--ha-pump-600) !important; }
body.tema-halloween main .bg-white:has(> button[onclick*="mostrarModalGenerador"]) > div:not([class*="border-dashed"]) button{ text-decoration:none !important; font-weight:600; padding:2px 10px; border-radius:999px; background:var(--ha-tint); color:var(--ha-pump-700) !important; }
body.tema-halloween main .bg-white:has(> button[onclick*="mostrarModalGenerador"]) > div[class*="border-dashed"]{
  grid-area:d; display:flex; align-items:center; gap:14px; flex-wrap:wrap; margin-top:8px !important; padding-top:16px !important; border-color:rgba(124,77,179,.35) !important; }
body.tema-halloween main .bg-white > div[class*="border-dashed"] > button.bg-purple-700{
  width:auto !important; background:transparent !important; color:#5B2E91 !important; border:1.5px dashed rgba(124,77,179,.65) !important; box-shadow:none !important; padding:8px 16px !important; min-height:40px; }
body.tema-halloween main .bg-white > div[class*="border-dashed"] > button.bg-purple-700:hover{ background:rgba(124,77,179,.10) !important; }
body.tema-halloween main .bg-white > div[class*="border-dashed"] > p{ margin:0 !important; flex:1; min-width:220px; color:#5B2E91 !important; }
@media (max-width:860px){ body.tema-halloween main .bg-white:has(> button[onclick*="mostrarModalGenerador"]){ grid-template-columns:1fr; grid-template-areas:"t" "cta" "p" "d"; } }

/* Estado de máquinas: se CONSERVAN los colores de estado, integrados a la paleta */
body.tema-halloween #maquinasResumen{ color:var(--ha-muted) !important; }
body.tema-halloween #estadoMaquinasGrid > div{ border-radius:14px !important; transition:box-shadow .2s ease; box-shadow:0 1px 2px rgba(0,0,0,.05); transform-style:preserve-3d; }
body.tema-halloween #estadoMaquinasGrid > div:hover{ box-shadow:0 12px 24px rgba(70,40,10,.16); }
body.tema-halloween #estadoMaquinasGrid > .bg-green-50{ background:rgba(34,197,94,.13) !important; border-color:rgba(22,163,74,.45) !important; }
body.tema-halloween #estadoMaquinasGrid > .bg-blue-50{ background:rgba(59,130,246,.14) !important; border-color:rgba(37,99,235,.45) !important; }
body.tema-halloween #estadoMaquinasGrid > .bg-amber-50{ background:rgba(245,158,11,.16) !important; border-color:rgba(217,119,6,.45) !important; }
body.tema-halloween #estadoMaquinasGrid > .bg-yellow-50{ background:rgba(234,179,8,.16) !important; border-color:rgba(202,138,4,.45) !important; }
body.tema-halloween #estadoMaquinasGrid > .bg-gray-50{ background:rgba(120,110,100,.12) !important; border-color:rgba(120,110,100,.30) !important; }
body.tema-halloween #estadoMaquinasGrid i.fa-gamepad{ color:var(--ha-pump-600) !important; opacity:.7; }

/* Tablas */
body.tema-halloween .registros-counter{ background:var(--ha-chip) !important; color:var(--ha-pump-900) !important; box-shadow:inset 0 0 0 1px var(--ha-line); }
body.tema-halloween .registros-counter i{ color:var(--ha-pump-600) !important; }
body.tema-halloween .historial-container{ border:1px solid var(--ha-line); border-radius:14px !important; }
body.tema-halloween main table thead, body.tema-halloween main table thead tr, body.tema-halloween main table thead th{ background:#1B1230 !important; }
body.tema-halloween main table thead{ background:linear-gradient(180deg,#1B1230,#140D22) !important; }
/* :not(.ha-x) sube la especificidad para ganarle a las reglas de color de texto gris (text-gray-700…),
   que si no pintan el título oscuro sobre el encabezado oscuro */
body.tema-halloween main table thead :is(th, th *):not(.ha-x){ color:#D6CBE6 !important; }
body.tema-halloween main table thead th:not(.ha-x){ font-family:var(--ha-ui) !important; font-weight:600 !important; letter-spacing:.1em; text-transform:uppercase; font-size:11px !important; border-color:transparent !important; }
body.tema-halloween main table thead tr:not(.ha-x){ background:transparent !important; }
body.tema-halloween main table tbody tr{ border-color:var(--ha-line-soft) !important; }
body.tema-halloween main table tbody tr:nth-child(even){ background-color:rgba(120,80,40,.05); }
body.tema-halloween main table tbody tr:hover, body.tema-halloween .history-row:hover{ background-color:var(--ha-tint) !important; }
body.tema-halloween main table .font-mono{ color:var(--ha-pump-900); font-weight:600; }
/* Botones de acción dentro de tablas (Detalles, Reimprimir, Ver página, WhatsApp, Borrar…):
   un mismo estilo neutro Arena; el color va SOLO en el ícono según su función.
   "Borrar/Eliminar" conserva el rojo en texto (es peligro). */
body.tema-halloween main table tbody :is(button, a)[class*="bg-"][class*="-50"]{
  background:var(--ha-input) !important; color:var(--ha-ink-2) !important; border:1px solid var(--ha-line) !important; border-radius:10px !important;
  font-weight:500 !important; transition:background-color .15s, border-color .15s, color .15s, box-shadow .15s;
}
body.tema-halloween main table tbody :is(button, a)[class*="bg-"][class*="-50"]:hover{
  background:#fff !important; border-color:var(--ha-pump-400) !important; color:var(--ha-ink) !important; box-shadow:0 4px 12px rgba(94,35,6,.10);
}
body.tema-halloween main table tbody :is(button, a)[class*="bg-"][class*="-50"] i{ color:var(--ha-pump-600) !important; }
body.tema-halloween main table tbody :is(button, a)[class*="bg-"][class*="-50"]:is([class*="text-green"], [class*="text-emerald"]) i{ color:#15803D !important; }
body.tema-halloween main table tbody :is(button, a)[class*="bg-"][class*="-50"]:is([class*="text-sky"], [class*="text-cyan"], [class*="text-blue-5"]) i{ color:#0369A1 !important; }
body.tema-halloween main table tbody :is(button, a)[class*="bg-"][class*="-50"][class*="bg-red-50"]{ color:#B91C1C !important; }
body.tema-halloween main table tbody :is(button, a)[class*="bg-"][class*="-50"][class*="bg-red-50"] i{ color:#DC2626 !important; }
body.tema-halloween main table tbody :is(button, a)[class*="bg-"][class*="-50"][class*="bg-red-50"]:hover{ background:#FEF2F2 !important; border-color:#FCA5A5 !important; }
/* Íconos sueltos de acción en tablas (Editar/Historial/Estaciones/Eliminar sin fondo): mismo trato de "chip" */
body.tema-halloween main table tbody td :is(button, a):not([class*="bg-"]):has(> i:first-child){ border-radius:10px; transition:background-color .15s; }
body.tema-halloween main table tbody td :is(button, a):not([class*="bg-"]):has(> i:first-child):hover{ background:var(--ha-tint) !important; }

/* Pestañas y paginación azules → calabaza */
body.tema-halloween main :is(.border-blue-500, .border-blue-600){ border-color:var(--ha-pump-500) !important; }
body.tema-halloween main :is(.bg-blue-50, .bg-blue-100):not([class*="rounded-full"]){ background-color:var(--ha-tint) !important; }

/* Modales: fondo nocturno difuminado + tarjeta Arena */
body.tema-halloween .fixed.inset-0:is(.bg-black, .bg-gray-900, .bg-gray-800){ background:rgba(12,8,22,.62) !important; backdrop-filter:blur(5px); }
body.tema-halloween .fixed.inset-0 > .bg-white, body.tema-halloween .fixed .bg-white.rounded-xl, body.tema-halloween .fixed .bg-white.rounded-lg{ background-color:var(--ha-surface) !important; border:1px solid var(--ha-line); border-radius:20px !important; box-shadow:0 40px 90px rgba(10,6,20,.45) !important; }
body.tema-halloween .fixed :is(h2, h3){ font-family:var(--ha-display) !important; font-weight:600 !important; letter-spacing:-.01em; }
body.tema-halloween .fixed :is(.text-gray-600, .text-gray-700){ color:var(--ha-ink-2) !important; }
body.tema-halloween .fixed :is(.text-gray-800, .text-gray-900){ color:var(--ha-ink) !important; }
body.tema-halloween .fixed :is(button, a):is(.bg-blue-500, .bg-blue-600, .bg-purple-500, .bg-purple-600, .bg-indigo-500, .bg-indigo-600){ background:var(--ha-fire) !important; border-color:transparent !important; color:#fff !important; }
body.tema-halloween .fixed :is(.bg-gray-50, .bg-gray-100, .bg-gray-200):not(button){ background-color:var(--ha-surface-2) !important; }
body.tema-halloween .fixed :is(h2, h3) > i{ color:var(--ha-pump-600) !important; }
body.tema-halloween .btnPaquete{ background:var(--ha-surface-2) !important; border:1px solid var(--ha-line) !important; border-radius:16px !important; color:var(--ha-ink) !important; }
body.tema-halloween .btnPaquete:hover, body.tema-halloween .btnPaquete:active{ background:var(--ha-tint) !important; border-color:var(--ha-pump-400) !important; box-shadow:0 10px 24px rgba(194,86,15,.16); }
body.tema-halloween .btnPaquete.disabled{ opacity:.55; }
body.tema-halloween .loading{ border-top-color:var(--ha-pump-400) !important; }

/* ═════════════════════════ LOGIN ═════════════════════════ */
body.tema-halloween:has(.login-container){
  background:radial-gradient(60% 50% at 82% 10%,rgba(246,231,200,.10),transparent 60%),radial-gradient(70% 60% at 20% 100%,rgba(224,106,20,.16),transparent 60%),linear-gradient(180deg,#120B20,#06040B) !important;
  background-attachment:fixed !important;
}
body.tema-halloween:has(.login-container)::before{ content:""; position:fixed; right:9%; top:8%; width:110px; height:110px; border-radius:50%; z-index:-1;
  background:radial-gradient(circle at 35% 30%,#FFF7E2,#EAD6AE 58%,#A88C5C); box-shadow:0 0 90px 20px rgba(246,231,200,.15); }
body.tema-halloween .login-container{ background:var(--ha-surface) !important; border-top:3px solid var(--ha-pump-500); border-radius:22px !important; box-shadow:0 30px 80px rgba(0,0,0,.5) !important; }
body.tema-halloween .login-container h1{ font-family:var(--ha-display) !important; font-weight:600 !important; font-size:28px !important; letter-spacing:-.01em; color:var(--ha-ink) !important; }
body.tema-halloween .login-container label{ color:var(--ha-ink-2) !important; }
body.tema-halloween .login-container input{ background:var(--ha-input) !important; border:1px solid var(--ha-line) !important; border-radius:12px !important; color:var(--ha-ink) !important; }
body.tema-halloween .login-container input:focus{ border-color:var(--ha-pump-500) !important; box-shadow:0 0 0 4px rgba(224,106,20,.18) !important; }
body.tema-halloween .login-container button.bg-blue-600{ background:var(--ha-fire) !important; font-family:var(--ha-display) !important; font-weight:600 !important; border-radius:13px !important;
  box-shadow:0 1px 0 rgba(255,255,255,.3) inset,0 10px 24px rgba(224,106,20,.30) !important; }
body.tema-halloween .login-container button.bg-blue-600:hover{ filter:brightness(1.07); }
body.tema-halloween .login-container :is(a.text-blue-600, .text-blue-600){ color:var(--ha-pump-700) !important; }
body.tema-halloween .login-container img{ border-radius:50%; box-shadow:0 0 0 3px rgba(242,138,58,.35),0 0 30px rgba(242,138,58,.25); }

/* ═════════════════════════ PORTAL INVERSOR (socios.html): conserva su noche, acentos calabaza ═════════════════════════ */
body.tema-halloween:has(main.page){
  --blue:#E06A14; --blue-lo:rgba(224,106,20,.14); --violet:#B57BEA; --violet-lo:rgba(181,123,234,.14);
  --bg:#0B0714; --s1:#140D22; --s2:#1B1230; --s3:#251A3B; --bd:#2C2142; --bd2:#3B2D57;
  background:radial-gradient(60% 50% at 85% 0%,rgba(224,106,20,.16),transparent 60%),radial-gradient(70% 60% at 0% 100%,#2B1D49,transparent 60%),#0B0714 !important;
  color:var(--text) !important;
}
body.tema-halloween:has(main.page) :is(.hero-name, .hero-cap-value){ font-family:var(--ha-display) !important; font-weight:600 !important; letter-spacing:-.02em; }
body.tema-halloween:has(main.page) .hero-cap-value{ background:linear-gradient(180deg,#FFD9AC,#F28A3A); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; }
body.tema-halloween:has(main.page) .topbar{ background:rgba(11,7,20,.88) !important; }

/* Modo SUAVE ("reducir movimiento"): solo se quitan los movimientos rápidos */
body.tema-halloween.ha-soft main button[onclick*="mostrarModalGenerador"]::after, body.tema-halloween.ha-soft #btnEscanearQR::before{ animation:none !important; }