/* =========================================================
   NEON NIGHT THEME — visual layer only (loaded last).
   Dark (default): deep rich black with glowing neon accents.
   Light: pure white with rich, saturated glossy accents.
   Body text stays plain, large and high-contrast in both.
   ========================================================= */

/* ---------- DARK (default) ---------- */
:root,
[data-theme="oscuro"] {
  --neon-cyan: #00E5FF;
  --neon-green: #39FF7A;
  --neon-pink: #FF2E88;
  --neon-red: #FF3B4E;
  --neon-orange: #FF9500;
  --neon-gold: #FFD60A;
  --neon-blue: #2F8CFF;

  /* soft "tube core" tints: readable text that still looks lit */
  --neon-cyan-core: #C9FBFF;
  --neon-green-core: #D2FFDF;
  --neon-pink-core: #FFD3E7;
  --neon-orange-core: #FFE2BD;
  --neon-gold-core: #FFF3B8;

  --neon-glow-strength: 1;

  --bg: #020203;
  --superficie: #07070B;
  --superficie-2: #0C0C12;
  --primario: var(--neon-cyan);
  --primary-hover: #6BF2FF;
  --primary-active: #A6F7FF;
  --button-top: #7DF4FF;
  --button-bottom: #00B8E6;
  --button-ink: #020203;
  --link: #3DEBFF;
  --link-hover: #A6F7FF;
  --acento: var(--neon-gold);
  --acento-flotación: #FFE45C;
  --gold-text: var(--neon-gold);
  --crimson: var(--neon-red);
  --purple: var(--neon-pink);
  --purple-text: #FF6FAE;
  --heading: #FFFFFF;
  --texto: #FFFFFF;
  --apagado: #D2D2DC;
  --borde: #2A2A36;
  --éxito: var(--neon-green);
  --error-ink: #FF8C98;
  --on-primary: var(--button-ink);
}

/* ---------- LIGHT / WHITE ---------- */
[data-theme="claro"] {
  --neon-cyan: #0090C8;
  --neon-green: #00A33B;
  --neon-pink: #E0006F;
  --neon-red: #E3132F;
  --neon-orange: #F06400;
  --neon-gold: #E0A100;
  --neon-blue: #0060F0;

  /* on white the heading "core" is the saturated tone itself */
  --neon-cyan-core: #0075B8;
  --neon-green-core: #008A32;
  --neon-pink-core: #D10067;
  --neon-orange-core: #D95500;
  --neon-gold-core: #A86E00;

  --neon-glow-strength: .55;

  --bg: #FFFFFF;
  --superficie: #F7F9FD;
  --superficie-2: #FFFFFF;
  --primario: var(--neon-blue);
  --primary-hover: #0050CC;
  --primary-active: #003FA3;
  --button-top: #2E8BFF;
  --button-bottom: #0052D6;
  --button-ink: #FFFFFF;
  --link: #0057D9;
  --link-hover: #C2005F;
  --acento: var(--neon-gold);
  --acento-flotación: #C58C00;
  --gold-text: #9A6500;
  --crimson: var(--neon-red);
  --purple: var(--neon-pink);
  --purple-text: #C10062;
  --heading: #0B0B1A;
  --texto: #15151F;
  --apagado: #4A4A58;
  --borde: #DCE3F0;
  --éxito: #00852F;
  --error-ink: #B3001F;
}

/* ---------- Section accent rotation (sign colors) ---------- */
.sanctuary-home { --neon: var(--neon-cyan); --neon-core: var(--neon-cyan-core); }
.sanctuary-home :is(#services, #photos, #contact) { --neon: var(--neon-pink); --neon-core: var(--neon-pink-core); }
.sanctuary-home :is(#benefits, #booking, #share) { --neon: var(--neon-green); --neon-core: var(--neon-green-core); }
.sanctuary-home :is(#quote, #testimonials, .offer) { --neon: var(--neon-orange); --neon-core: var(--neon-orange-core); }
.sanctuary-home :is(#club, #google-reviews, #sanctuary-faq) { --neon: var(--neon-gold); --neon-core: var(--neon-gold-core); }
.sanctuary-home :is(#advisor, #chat-section, #our-story) { --neon: var(--neon-cyan); --neon-core: var(--neon-cyan-core); }

/* Section frames: neon tube border + halo */
.sanctuary-home section.container[style*="border"],
.sanctuary-home section.section[style*="border"],
.sanctuary-home :is(.club-section, .booking-section, .brand-film, .google-review-card, .website-share-qr) {
  border-color: var(--neon) !important;
  box-shadow:
    0 0 0 1px color-mix(in srgb, var(--neon) 35%, transparent),
    0 0 calc(18px * var(--neon-glow-strength)) color-mix(in srgb, var(--neon) 45%, transparent),
    0 0 calc(48px * var(--neon-glow-strength)) color-mix(in srgb, var(--neon) 18%, transparent),
    inset 0 0 calc(30px * var(--neon-glow-strength)) color-mix(in srgb, var(--neon) 8%, transparent) !important;
}
[data-theme="claro"] .sanctuary-home section.container[style*="border"],
[data-theme="claro"] .sanctuary-home section.section[style*="border"],
[data-theme="claro"] .sanctuary-home :is(.club-section, .booking-section, .brand-film, .google-review-card, .website-share-qr) {
  background: linear-gradient(180deg, color-mix(in srgb, var(--neon) 5%, #FFFFFF), #FFFFFF 40%) !important;
}

/* ---------- Headings: lit neon lettering ---------- */
.sanctuary-home :is(h1, h2) {
  color: var(--neon-core) !important;
  text-shadow:
    0 0 2px color-mix(in srgb, var(--neon) 90%, transparent),
    0 0 10px color-mix(in srgb, var(--neon) calc(75% * var(--neon-glow-strength)), transparent),
    0 0 26px color-mix(in srgb, var(--neon) calc(55% * var(--neon-glow-strength)), transparent),
    0 0 52px color-mix(in srgb, var(--neon) calc(30% * var(--neon-glow-strength)), transparent) !important;
}
.sanctuary-home :is(h3, h4) {
  color: var(--neon-core) !important;
  text-shadow:
    0 0 1px color-mix(in srgb, var(--neon) 80%, transparent),
    0 0 12px color-mix(in srgb, var(--neon) calc(45% * var(--neon-glow-strength)), transparent) !important;
}
/* Light theme: crisp saturated letters with a soft colored halo */
[data-theme="claro"] .sanctuary-home :is(h1, h2) {
  text-shadow:
    0 1px 0 #FFFFFF,
    0 2px 6px color-mix(in srgb, var(--neon) 28%, transparent),
    0 0 22px color-mix(in srgb, var(--neon) 22%, transparent) !important;
}
[data-theme="claro"] .sanctuary-home :is(h3, h4) {
  text-shadow: 0 0 14px color-mix(in srgb, var(--neon) 20%, transparent) !important;
}

/* Hero: white-hot headline with cyan glow + hot-pink highlight */
.sanctuary-home .hero {
  background:
    radial-gradient(ellipse 60% 45% at 20% 0%, color-mix(in srgb, var(--neon-pink) 16%, transparent), transparent 70%),
    radial-gradient(ellipse 60% 45% at 80% 0%, color-mix(in srgb, var(--neon-cyan) 16%, transparent), transparent 70%),
    var(--bg) !important;
}
.sanctuary-home .hero h1 { color: #FFFFFF !important; }
[data-theme="claro"] .sanctuary-home .hero h1 { color: #0B0B1A !important; }
.sanctuary-home .hero h1 .highlight-text,
[data-theme="claro"] .sanctuary-home .hero h1 .highlight-text {
  background: none !important;
  -webkit-background-clip: border-box !important;
  background-clip: border-box !important;
  color: var(--neon-pink-core) !important;
  -webkit-text-fill-color: currentColor;
  text-shadow:
    0 0 2px var(--neon-pink),
    0 0 12px color-mix(in srgb, var(--neon-pink) calc(80% * var(--neon-glow-strength)), transparent),
    0 0 30px color-mix(in srgb, var(--neon-pink) calc(55% * var(--neon-glow-strength)), transparent),
    0 0 60px color-mix(in srgb, var(--neon-red) calc(30% * var(--neon-glow-strength)), transparent) !important;
}
.sanctuary-home .brand-title .brand-accent {
  color: var(--neon-pink-core) !important;
  text-shadow: 0 0 10px color-mix(in srgb, var(--neon-pink) calc(70% * var(--neon-glow-strength)), transparent);
}
.sanctuary-home .brand-title {
  text-shadow: 0 0 10px color-mix(in srgb, var(--neon-cyan) calc(45% * var(--neon-glow-strength)), transparent);
}

/* Body copy stays plain and readable — never glowing */
.sanctuary-home :is(p, li, label, td, dd, small, input, select, textarea, .hero-content > p) { text-shadow: none; }

/* Pills, badges, eyebrows */
.sanctuary-home :is(.hero-pill, .services-badge, .booking-eyebrow, .club-eyebrow, .brand-film__kicker, .benefit-badge) {
  border-color: var(--neon) !important;
  box-shadow: 0 0 calc(14px * var(--neon-glow-strength)) color-mix(in srgb, var(--neon) 40%, transparent), inset 0 0 10px color-mix(in srgb, var(--neon) 12%, transparent) !important;
}

/* Prices glow gold */
.sanctuary-home :is(.service-price-amount, .booking-price, #calculator-total) {
  color: var(--neon-gold-core) !important;
  text-shadow: 0 0 2px var(--neon-gold), 0 0 14px color-mix(in srgb, var(--neon-gold) calc(60% * var(--neon-glow-strength)), transparent) !important;
}
.sanctuary-home .service-price-original { text-shadow: none !important; }
.sanctuary-home .service-price-wrap {
  border-color: color-mix(in srgb, var(--neon-gold) 60%, transparent) !important;
  box-shadow: 0 0 calc(16px * var(--neon-glow-strength)) color-mix(in srgb, var(--neon-gold) 30%, transparent);
}
.sanctuary-home :is(.rating-stars-gold, .hero-proof-stars, .club-saving > strong) {
  color: var(--neon-gold) !important;
  text-shadow: 0 0 10px color-mix(in srgb, var(--neon-gold) calc(70% * var(--neon-glow-strength)), transparent);
}

/* ---------- Cards ---------- */
.sanctuary-home :is(.card, .service-card-new, .benefit-card, .testimonial-card, .contact-info-card, .info-item, #booking .booking-plan, .hero-card, .hero-tag) {
  border-color: color-mix(in srgb, var(--neon) 55%, var(--borde)) !important;
  box-shadow: 0 0 calc(14px * var(--neon-glow-strength)) color-mix(in srgb, var(--neon) 22%, transparent), inset 0 1px 0 #FFFFFF10 !important;
}
.sanctuary-home :is(.card, .service-card-new, .benefit-card, .testimonial-card, .contact-info-card, .info-item, #booking .booking-plan):is(:hover, :focus-within) {
  border-color: var(--neon) !important;
  box-shadow: 0 0 calc(24px * var(--neon-glow-strength)) color-mix(in srgb, var(--neon) 45%, transparent), 0 0 calc(60px * var(--neon-glow-strength)) color-mix(in srgb, var(--neon) 15%, transparent), inset 0 0 22px color-mix(in srgb, var(--neon) 10%, transparent) !important;
}
.sanctuary-home .service-card-new { --service-accent: var(--neon-pink); border-top-color: var(--neon-pink) !important; }
.sanctuary-home .service-card-new.featured { --service-accent: var(--neon-cyan); --neon: var(--neon-cyan); --neon-core: var(--neon-cyan-core); border-top-color: var(--neon-cyan) !important; }
.sanctuary-home .service-card-new:nth-child(3) { --service-accent: var(--neon-orange); --neon: var(--neon-orange); --neon-core: var(--neon-orange-core); border-top-color: var(--neon-orange) !important; }
.sanctuary-home :is(.service-icon-box, .hero-checklist-icon, .hero-status-badge) {
  color: var(--neon) !important;
  filter: drop-shadow(0 0 calc(6px * var(--neon-glow-strength)) color-mix(in srgb, var(--neon) 70%, transparent));
}
.sanctuary-home .service-card-new:not(.featured) .service-icon-box { color: var(--neon) !important; background: color-mix(in srgb, var(--neon) 12%, var(--superficie)) !important; }

/* Neon divider lines above sections */
.sanctuary-home :is(#services, #club, #share)::before {
  height: 2px !important;
  background: linear-gradient(90deg, transparent, var(--neon-cyan), var(--neon-green), var(--neon-gold), var(--neon-orange), var(--neon-pink), transparent) !important;
  opacity: 1 !important;
  box-shadow: 0 0 12px color-mix(in srgb, var(--neon-pink) 60%, transparent);
}

/* ---------- Buttons: glossy lit glass ---------- */
.sanctuary-home :is(.btn, .cta-btn, .nav-cta-btn, .service-cta-btn, .sanctuary-calculator-cta, .google-review-primary, .google-review-secondary, .website-share-qr__primary, .website-share-qr__secondary, .brand-film__book, .brand-film__close a, .chat-widget-send-btn, #chat-send-btn-embedded, .app-install-btn),
.sanctuary-home #booking :is(.booking-submit, .booking-plan button) {
  background:
    linear-gradient(180deg, #FFFFFF55 0%, #FFFFFF14 46%, transparent 52%),
    linear-gradient(180deg, var(--button-top), var(--button-bottom)) !important;
  color: var(--button-ink) !important;
  font-weight: 800 !important;
  border: 1px solid color-mix(in srgb, var(--primario) 70%, #FFFFFF) !important;
  text-shadow: none !important;
  box-shadow:
    0 0 calc(10px * var(--neon-glow-strength)) color-mix(in srgb, var(--primario) 70%, transparent),
    0 0 calc(28px * var(--neon-glow-strength)) color-mix(in srgb, var(--primario) 40%, transparent),
    0 6px 18px #00000040,
    inset 0 1px 0 #FFFFFF80,
    inset 0 -2px 6px #00000030 !important;
}
.sanctuary-home :is(.btn, .cta-btn, .nav-cta-btn, .service-cta-btn, .sanctuary-calculator-cta, .google-review-primary, .google-review-secondary, .website-share-qr__primary, .website-share-qr__secondary, .brand-film__book, .brand-film__close a, .chat-widget-send-btn, #chat-send-btn-embedded, .app-install-btn):is(:hover, :focus-visible),
.sanctuary-home #booking :is(.booking-submit, .booking-plan button):not(:disabled):is(:hover, :focus-visible) {
  background:
    linear-gradient(180deg, #FFFFFF66 0%, #FFFFFF1F 46%, transparent 52%),
    linear-gradient(180deg, var(--primary-hover), var(--button-top)) !important;
  color: var(--button-ink) !important;
  box-shadow:
    0 0 calc(16px * var(--neon-glow-strength)) color-mix(in srgb, var(--primario) 85%, transparent),
    0 0 calc(44px * var(--neon-glow-strength)) color-mix(in srgb, var(--primario) 50%, transparent),
    inset 0 1px 0 #FFFFFF99 !important;
}
[data-theme="claro"] .sanctuary-home :is(.btn, .cta-btn, .nav-cta-btn, .service-cta-btn, .sanctuary-calculator-cta, .google-review-primary, .google-review-secondary, .website-share-qr__primary, .website-share-qr__secondary, .brand-film__book, .brand-film__close a, .chat-widget-send-btn, #chat-send-btn-embedded, .app-install-btn):is(:hover, :focus-visible),
[data-theme="claro"] .sanctuary-home #booking :is(.booking-submit, .booking-plan button):not(:disabled):is(:hover, :focus-visible) {
  background:
    linear-gradient(180deg, #FFFFFF40 0%, #FFFFFF10 46%, transparent 52%),
    linear-gradient(180deg, var(--button-bottom), var(--primary-active)) !important;
}

/* Booking / book-now actions shine green; service CTAs pink; calculator orange */
.sanctuary-home #booking :is(.booking-submit, .booking-plan button),
.sanctuary-home .brand-film__book {
  --primario: var(--neon-green);
  --button-top: #8DFFB2;
  --button-bottom: #12D85A;
  --primary-hover: #B5FFCC;
}
.sanctuary-home .service-cta-btn {
  --primario: var(--neon-pink);
  --button-top: #FF7DB6;
  --button-bottom: #F0136F;
  --primary-hover: #FFA3CC;
}
.sanctuary-home .sanctuary-calculator-cta {
  --primario: var(--neon-orange);
  --button-top: #FFC064;
  --button-bottom: #FF8A00;
  --primary-hover: #FFD699;
}
[data-theme="claro"] .sanctuary-home #booking :is(.booking-submit, .booking-plan button),
[data-theme="claro"] .sanctuary-home .brand-film__book {
  --button-top: #1ECB5C; --button-bottom: #008A32; --primary-hover: #00B342; --primary-active: #006E28; --button-ink: #FFFFFF;
}
[data-theme="claro"] .sanctuary-home .service-cta-btn {
  --button-top: #FF3D93; --button-bottom: #CC0062; --primary-hover: #E0006F; --primary-active: #A3004E; --button-ink: #FFFFFF;
}
[data-theme="claro"] .sanctuary-home .sanctuary-calculator-cta {
  --button-top: #FF8A1F; --button-bottom: #D94F00; --primary-hover: #F06400; --primary-active: #B34000; --button-ink: #FFFFFF;
}

/* Social buttons keep their brand color, now lit */
.sanctuary-home :is(a.btn[href*="facebook.com"], #whatsapp-float, a.btn[href*="wa.me"]) {
  background:
    linear-gradient(180deg, #FFFFFF55 0%, #FFFFFF14 46%, transparent 52%),
    linear-gradient(180deg, var(--social-top), var(--social-color)) !important;
  box-shadow:
    0 0 calc(12px * var(--neon-glow-strength)) color-mix(in srgb, var(--social-color) 75%, transparent),
    0 0 calc(30px * var(--neon-glow-strength)) color-mix(in srgb, var(--social-color) 40%, transparent),
    inset 0 1px 0 #FFFFFF80 !important;
}

/* Floating help/chat button: hot pink → red glossy */
.sanctuary-home #chat-widget-toggle-btn {
  background:
    linear-gradient(180deg, #FFFFFF40 0%, #FFFFFF10 46%, transparent 52%),
    linear-gradient(135deg, #E0006F, #C4122B) !important;
  color: #FFFFFF !important;
  border: 1px solid #FF8CC0 !important;
  box-shadow: 0 0 14px #FF2E88AA, 0 0 36px #FF2E8855, inset 0 1px 0 #FFFFFF66 !important;
}
.sanctuary-home #chat-widget-toggle-btn::before { box-shadow: 0 0 18px 4px #FF2E8888, 0 0 34px 10px #FF3B4E55 !important; }
.sanctuary-home #chat-widget-toggle-btn:is(:hover, :focus-visible) {
  background:
    linear-gradient(180deg, #FFFFFF55 0%, #FFFFFF14 46%, transparent 52%),
    linear-gradient(135deg, #FF1A85, #E0203A) !important;
}

/* Generic buttons hover (non-CTA) */
.sanctuary-home :is(button:not(:disabled), summary):not(.theme-toggle):not(.booking-submit):is(:hover, :focus-visible) {
  box-shadow: 0 0 calc(14px * var(--neon-glow-strength)) color-mix(in srgb, var(--neon) 45%, transparent);
}

/* Theme toggle: lit ring */
.theme-toggle {
  color: var(--neon-gold) !important;
  border-color: var(--neon-gold) !important;
  box-shadow: 0 0 calc(10px * var(--neon-glow-strength)) color-mix(in srgb, var(--neon-gold) 60%, transparent), inset 0 0 8px color-mix(in srgb, var(--neon-gold) 20%, transparent);
}
.theme-toggle svg { filter: drop-shadow(0 0 4px color-mix(in srgb, var(--neon-gold) 80%, transparent)); }
[data-theme="claro"] .theme-toggle { color: #0057D9 !important; border-color: #0057D9 !important; box-shadow: 0 0 10px #0060F040; }
[data-theme="claro"] .theme-toggle svg { filter: none; }

/* ---------- Icons ---------- */
.sanctuary-home .icon-badge {
  --badge-start: #00B8E6; --badge-end: #0060F0; --badge-glow: #00E5FFAA;
  border-color: #FFFFFF66 !important;
  background: radial-gradient(circle at 30% 18%, #FFFFFF77, transparent 46%), linear-gradient(135deg, var(--badge-start), var(--badge-end)) !important;
  box-shadow: inset 0 1px 1px #FFFFFF80, 0 0 10px var(--badge-glow), 0 0 26px color-mix(in srgb, var(--badge-glow) 50%, transparent) !important;
}
.sanctuary-home .icon-badge--violet { --badge-start: #FF3D93; --badge-end: #C4005A; --badge-glow: #FF2E88AA; }
.sanctuary-home .icon-badge--gold { --badge-start: #FFB800; --badge-end: #E06A00; --badge-glow: #FFB000AA; }
.sanctuary-home .icon-badge--wine { --badge-start: #24D964; --badge-end: #00863A; --badge-glow: #39FF7A99; }
[data-theme="claro"] .sanctuary-home .icon-badge { box-shadow: inset 0 1px 1px #FFFFFF80, 0 3px 8px #00000022, 0 0 14px color-mix(in srgb, var(--badge-glow) 55%, transparent) !important; }
.sanctuary-home :is(.top-bar-item > .contact-icon, .contact-label > .contact-icon, .savings-details > summary .contact-icon) {
  filter: drop-shadow(0 0 calc(5px * var(--neon-glow-strength)) color-mix(in srgb, var(--link) 80%, transparent));
}

/* ---------- Chrome: header, nav, footer, inputs ---------- */
.sanctuary-home header {
  border-bottom: 1px solid color-mix(in srgb, var(--neon-cyan) 50%, transparent) !important;
  box-shadow: 0 0 calc(18px * var(--neon-glow-strength)) color-mix(in srgb, var(--neon-cyan) 30%, transparent) !important;
}
.sanctuary-home .sanctuary-announcement strong {
  color: var(--neon-gold-core) !important;
  border: 1px solid var(--neon-gold);
  box-shadow: 0 0 calc(10px * var(--neon-glow-strength)) color-mix(in srgb, var(--neon-gold) 55%, transparent);
}
.sanctuary-home nav a:not(.nav-cta-btn):is(:hover, :focus-visible, :active, .is-pressed) {
  text-shadow: 0 0 10px color-mix(in srgb, var(--link) calc(70% * var(--neon-glow-strength)), transparent);
}
.sanctuary-home footer {
  border-top: 2px solid var(--neon-pink) !important;
  box-shadow: 0 0 calc(24px * var(--neon-glow-strength)) color-mix(in srgb, var(--neon-pink) 40%, transparent);
}
[data-theme="oscuro"] .sanctuary-home footer .footer-social-cta { background: linear-gradient(180deg, #3A9BFF, #1877F2) !important; box-shadow: 0 0 14px #1877F2AA; }
.sanctuary-home :is(input, select, textarea) { border-color: color-mix(in srgb, var(--neon) 60%, var(--borde)) !important; }
.sanctuary-home :is(input, select, textarea):focus {
  border-color: var(--neon) !important;
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--neon) 30%, transparent), 0 0 18px color-mix(in srgb, var(--neon) 40%, transparent) !important;
}
.sanctuary-home #chat-widget-window {
  border-color: var(--neon-pink) !important;
  box-shadow: 0 0 22px #FF2E8866, 0 20px 50px #00000080 !important;
}
.sanctuary-home .addon-chip { border-color: var(--neon-gold) !important; }

/* QR panels stay white for scanning */
.sanctuary-home :is(.google-review-qr-wrap, .website-share-qr__code) { box-shadow: 0 0 calc(18px * var(--neon-glow-strength)) color-mix(in srgb, var(--neon) 50%, transparent); }

@media (prefers-reduced-motion: reduce) {
  .sanctuary-home #chat-widget-toggle-btn::before { animation: none; }
}