:root {
      --gold: #c9a84c;
      --gold-dim: rgba(201,168,76,0.35);
      --gold-glow: rgba(201,168,76,0.18);
    }

    /* ── Memphis Salón — tema plata/acero ─────────────────────── */
    .tenant-memphis {
      --gold: #D9DCE1;
      --gold-dim: rgba(217,220,225,0.35);
      --gold-glow: rgba(217,220,225,0.16);
    }
    .tenant-memphis .tier-badge.gold     { color: #D9DCE1; border-color: rgba(217,220,225,0.35); }
    .tenant-memphis .tier-badge.platinum { color: #f1f3f6; border-color: rgba(241,243,246,0.35); }

    /* ── Gitana Nails & Studio — tema fuchsia ─────────────────── */
    .tenant-gitana {
      --gold: #f472b6;
      --gold-dim: rgba(244,114,182,0.35);
      --gold-glow: rgba(244,114,182,0.18);
    }
    html.tenant-gitana body { background-color: #080508; }

    /* Hero: sin imagen de barbero */
    .tenant-gitana .hero-bg {
      background-image: none;
      background: linear-gradient(135deg, #0f0a12 0%, #190d1e 55%, #0a080e 100%);
    }
    .tenant-gitana .hero-overlay {
      background: linear-gradient(160deg,
        rgba(5,3,8,0.15) 0%,
        rgba(12,6,18,0.45) 40%,
        rgba(5,3,8,0.85) 100%);
    }
    .tenant-gitana .hero-glow-spot {
      background: radial-gradient(circle, rgba(244,114,182,0.12) 0%, transparent 65%) !important;
    }
    .tenant-gitana .hero-cta {
      border-color: rgba(244,114,182,0.35) !important;
      box-shadow: 0 0 20px rgba(244,114,182,0.08) !important;
    }

    /* Sellos */
    .tenant-gitana .stamp-cell.filled {
      background: #f472b6 !important;
      border: 1px solid #f472b6 !important;
      box-shadow: 0 0 10px rgba(244,114,182,0.4) !important;
    }
    .tenant-gitana .stamp-cell.filled i { color: #fff !important; }
    .tenant-gitana #stampsBar {
      background: #f472b6 !important;
      box-shadow: 0 0 8px rgba(244,114,182,0.5) !important;
    }

    /* Membership card */
    .tenant-gitana .membership-pattern::before {
      background-image: repeating-linear-gradient(
        -45deg, transparent, transparent 18px,
        rgba(244,114,182,0.025) 18px, rgba(244,114,182,0.025) 19px
      );
    }
    .tenant-gitana .membership-glow {
      background: radial-gradient(circle, rgba(244,114,182,0.08) 0%, transparent 70%) !important;
    }
    .tenant-gitana #membershipWatermark { color: rgba(244,114,182,0.05) !important; }

    /* Bottom nav */
    .tenant-gitana .nav-tab.active .nav-icon {
      color: var(--gold);
      filter: drop-shadow(0 0 6px rgba(244,114,182,0.3));
    }
    .tenant-gitana .nav-tab.active .nav-label { color: var(--gold); }

    /* Tier badges */
    .tenant-gitana .tier-badge.gold {
      color: var(--gold);
      border-color: rgba(244,114,182,0.35);
    }
    .tenant-gitana .tier-badge.platinum {
      color: #f9a8d4;
      border-color: rgba(244,114,182,0.3);
    }

    /* PWA banners */
    .tenant-gitana #pwaBigInstallCard {
      background: linear-gradient(to right, rgba(244,114,182,0.1), rgba(244,114,182,0.03)) !important;
      border-color: rgba(244,114,182,0.28) !important;
      box-shadow: 0 0 20px rgba(244,114,182,0.07) !important;
    }
    .tenant-gitana .pwa-icon-bg {
      background: rgba(244,114,182,0.12) !important;
      border-color: rgba(244,114,182,0.28) !important;
      box-shadow: 0 0 15px rgba(244,114,182,0.15) !important;
    }
    .tenant-gitana #pwaBanner {
      border-color: rgba(244,114,182,0.3) !important;
    }
    .tenant-gitana #pwaModalIOS > div {
      border-color: rgba(244,114,182,0.22) !important;
    }
    .tenant-gitana .pwa-step-badge {
      background: var(--gold) !important;
    }

    /* Botones primarios en dashboard */
    .tenant-gitana .btn-accion-primary {
      background: var(--gold) !important;
      color: #160712 !important;
    }
    .tenant-gitana a.btn-reservar {
      background: var(--gold) !important;
      color: #160712 !important;
    }
    /* ────────────────────────────────────────────────────────── */

    /* ── Barbería Ferraza — Premium Dark monocromático ────────── */
    .tenant-ferraza {
      --gold:      #e2e8f0;
      --gold-dim:  rgba(226,232,240,0.20);
      --gold-glow: rgba(226,232,240,0.05);
    }
    /* Navegación inferior: sin halo */
    .tenant-ferraza .nav-tab.active .nav-icon { filter: none !important; }
    /* Hero headline: serif, sin sombra */
    .tenant-ferraza #heroLine2 {
      font-family: 'Playfair Display', Georgia, serif !important;
      text-shadow: none !important;
    }
    /* Barra de sellos: sin resplandor dorado */
    .tenant-ferraza #stampsBar { box-shadow: none !important; }
    /* Ícono de premio: plateado */
    .tenant-ferraza .premio-icon { color: rgba(226,232,240,0.65) !important; }
    /* Chips de estado en historial */
    .tenant-ferraza .cita-estado-cancelada { color: #6b7280 !important; }
    .tenant-ferraza .cita-estado-pendiente  { color: #9ca3af !important; }
    /* Chip estado próxima cita */
    .tenant-ferraza .proxima-estado-chip {
      background: rgba(226,232,240,0.08) !important;
      border-radius: 0.375rem !important;
    }
    /* Botón reagendar en próxima cita */
    .reagendar-proxima-btn {
      border-color: rgba(201,168,76,0.3);
      background: rgba(201,168,76,0.07);
    }
    .tenant-ferraza .reagendar-proxima-btn {
      border-color: rgba(226,232,240,0.18) !important;
      background: rgba(226,232,240,0.04) !important;
    }
    /* Botón reagendar en historial */
    .reagendar-hist-btn { color: rgba(201,168,76,0.6); }
    .reagendar-hist-btn:hover { background: rgba(201,168,76,0.12); }
    .tenant-ferraza .reagendar-hist-btn { color: rgba(226,232,240,0.5) !important; }
    .tenant-ferraza .reagendar-hist-btn:hover { background: rgba(226,232,240,0.08) !important; }
    /* Clases globales: quitar glow para tono monocromático */
    .tenant-ferraza .text-gold   { text-shadow: none !important; }
    .tenant-ferraza .border-gold { box-shadow: none !important; }
    /* Hero glow spot y membership → plateado ultrasuave */
    .tenant-ferraza .hero-glow-spot {
      background: radial-gradient(circle, rgba(226,232,240,0.04) 0%, transparent 65%) !important;
    }
    .tenant-ferraza .membership-glow {
      background: radial-gradient(circle, rgba(226,232,240,0.03) 0%, transparent 70%) !important;
    }
    .tenant-ferraza #membershipWatermark { color: rgba(226,232,240,0.04) !important; }
    /* PWA install card → silver */
    .tenant-ferraza #pwaBigInstallCard {
      background: linear-gradient(to right, rgba(226,232,240,0.05), rgba(226,232,240,0.02)) !important;
      border-color: rgba(226,232,240,0.18) !important;
      box-shadow: none !important;
    }
    .tenant-ferraza .pwa-icon-bg {
      background: rgba(226,232,240,0.08) !important;
      border-color: rgba(226,232,240,0.18) !important;
      box-shadow: none !important;
    }
    .tenant-ferraza .hero-bg {
      background-image: url('/ferraza1.webp');
      background-size: cover;
      background-position: center 30%;
    }
    /* ────────────────────────────────────────────────────────── */

    /* ── STUDIO DIECISÉIS — Club · Premium Dark Monocromático (B&N) ── */
    .tenant-sionbarberia {
      --gold:      #E5E7EB;
      --gold-dim:  rgba(229,231,235,0.20);
      --gold-glow: rgba(229,231,235,0.06);
    }
    html.tenant-sionbarberia body { background-color: #0a0a0a; }
    .tenant-sionbarberia header {
      background-color: rgba(10,10,10,0.96) !important;
      border-bottom: 1px solid rgba(255,255,255,0.08) !important;
    }
    .tenant-sionbarberia #authGuard { background: #0a0a0a !important; }
    /* Hero: fondo oscuro limpio (el banner trae texto y chocaría con el saludo) */
    .tenant-sionbarberia .hero-bg {
      background-color: #0a0a0a;
      background-image: linear-gradient(160deg, #161616 0%, #0d0d0d 55%, #070707 100%);
    }
    .tenant-sionbarberia .hero-overlay {
      background: linear-gradient(160deg, rgba(5,5,5,0.20) 0%, rgba(8,8,8,0.45) 40%, rgba(5,5,5,0.85) 100%) !important;
    }
    .tenant-sionbarberia .hero-glow-spot {
      background: radial-gradient(circle, rgba(229,231,235,0.05) 0%, transparent 65%) !important;
    }
    .tenant-sionbarberia #heroLine2 { text-shadow: none !important; }
    .tenant-sionbarberia .hero-cta {
      border-color: rgba(229,231,235,0.30) !important;
      box-shadow: 0 0 20px rgba(229,231,235,0.06) !important;
    }
    /* Sellos: relleno platino, ícono negro */
    .tenant-sionbarberia #stampsBar { box-shadow: none !important; }
    .tenant-sionbarberia .stamp-cell.filled {
      background: #E5E7EB !important;
      border: 1px solid #E5E7EB !important;
      box-shadow: none !important;
    }
    .tenant-sionbarberia .stamp-cell.filled i { color: #0a0a0a !important; }
    .tenant-sionbarberia .premio-icon { color: rgba(229,231,235,0.65) !important; }
    .tenant-sionbarberia .text-gold   { text-shadow: none !important; }
    .tenant-sionbarberia .border-gold { box-shadow: none !important; }
    .tenant-sionbarberia .membership-glow {
      background: radial-gradient(circle, rgba(229,231,235,0.03) 0%, transparent 70%) !important;
    }
    .tenant-sionbarberia #membershipWatermark { color: rgba(229,231,235,0.04) !important; }
    .tenant-sionbarberia .reagendar-proxima-btn {
      border-color: rgba(229,231,235,0.18) !important;
      background: rgba(229,231,235,0.04) !important;
    }
    .tenant-sionbarberia .reagendar-hist-btn { color: rgba(229,231,235,0.5) !important; }
    .tenant-sionbarberia .reagendar-hist-btn:hover { background: rgba(229,231,235,0.08) !important; }
    .tenant-sionbarberia #pwaBigInstallCard {
      background: linear-gradient(to right, rgba(229,231,235,0.05), rgba(229,231,235,0.02)) !important;
      border-color: rgba(229,231,235,0.18) !important;
      box-shadow: none !important;
    }
    .tenant-sionbarberia .pwa-icon-bg {
      background: rgba(229,231,235,0.08) !important;
      border-color: rgba(229,231,235,0.18) !important;
      box-shadow: none !important;
    }
    /* ────────────────────────────────────────────────────────── */

    /* ── EL BARBERO MODERNO — Club · Silver & Pure Dark (independiente) ── */
    .tenant-elbarberomoderno {
      --gold:      #E0E0E0;
      --gold-dim:  rgba(224,224,224,0.22);
      --gold-glow: rgba(224,224,224,0.08);
    }
    html.tenant-elbarberomoderno body { background-color: #080808; }
    .tenant-elbarberomoderno header {
      background-color: rgba(8,8,8,0.96) !important;
      border-bottom: 1px solid rgba(255,255,255,0.06) !important;
    }
    .tenant-elbarberomoderno #authGuard { background: #080808 !important; }
    /* Hero: foto real de la estación con overlay negro elegante */
    .tenant-elbarberomoderno .hero-bg {
      background-image: url('/elbarberomoderno/barbero1.png') !important;
      background-size: cover !important;
      background-position: center 35% !important;
      background-color: #080808;
    }
    .tenant-elbarberomoderno .hero-overlay {
      background: linear-gradient(160deg, rgba(0,0,0,0.55) 0%, rgba(0,0,0,0.65) 45%, rgba(0,0,0,0.92) 100%) !important;
    }
    .tenant-elbarberomoderno .hero-glow-spot {
      background: radial-gradient(circle, rgba(224,224,224,0.08) 0%, transparent 65%) !important;
    }
    .tenant-elbarberomoderno #heroLine1 {
      text-transform: uppercase !important;
      letter-spacing: 0.08em !important;
      color: #ffffff !important;
      font-style: normal !important;
      text-shadow: 0 2px 24px rgba(0,0,0,0.7) !important;
    }
    .tenant-elbarberomoderno #heroLine2 {
      text-transform: uppercase !important;
      letter-spacing: 0.08em !important;
      color: #E0E0E0 !important;
      font-style: normal !important;
      text-shadow: 0 2px 20px rgba(0,0,0,0.6) !important;
    }
    .tenant-elbarberomoderno .hero-cta {
      background: rgba(0,0,0,0.55) !important;
      border-color: rgba(224,224,224,0.35) !important;
      box-shadow: 0 0 20px rgba(224,224,224,0.10) !important;
    }
    .tenant-elbarberomoderno .hero-cta i,
    .tenant-elbarberomoderno .hero-cta span { color: #E0E0E0 !important; }
    /* Sellos: relleno plata, ícono negro */
    .tenant-elbarberomoderno #stampsBar { box-shadow: 0 0 10px rgba(192,192,192,0.30) !important; background: linear-gradient(90deg, #8A8A8A, #C0C0C0, #E0E0E0) !important; }
    .tenant-elbarberomoderno .stamp-cell.filled {
      background: #E0E0E0 !important;
      border: 1px solid #E0E0E0 !important;
      box-shadow: none !important;
    }
    .tenant-elbarberomoderno .stamp-cell.filled i { color: #080808 !important; }
    .tenant-elbarberomoderno .premio-icon { color: rgba(224,224,224,0.7) !important; }
    .tenant-elbarberomoderno .text-gold   { color: #E0E0E0 !important; text-shadow: none !important; }
    .tenant-elbarberomoderno .border-gold { border-color: rgba(224,224,224,0.35) !important; box-shadow: none !important; }
    .tenant-elbarberomoderno .membership-glow {
      background: radial-gradient(circle, rgba(224,224,224,0.04) 0%, transparent 70%) !important;
    }
    .tenant-elbarberomoderno #membershipWatermark { color: rgba(224,224,224,0.05) !important; }
    /* Aviso "Completa tu telefono..." — plata sutil en vez de ámbar */
    .tenant-elbarberomoderno #perfilIncompletoAviso {
      background: rgba(224,224,224,0.06) !important;
      border-color: rgba(224,224,224,0.28) !important;
    }
    .tenant-elbarberomoderno #perfilIncompletoAviso i,
    .tenant-elbarberomoderno #perfilIncompletoMsg { color: rgba(224,224,224,0.90) !important; }
    /* Inputs de perfil — focus plata en vez de dorado */
    .tenant-elbarberomoderno input:focus {
      border-color: #C0C0C0 !important;
      --tw-ring-color: rgba(192,192,192,0.35) !important;
      box-shadow: 0 0 0 1px rgba(192,192,192,0.35) !important;
    }
    .tenant-elbarberomoderno #pwaBigInstallCard {
      background: linear-gradient(to right, rgba(224,224,224,0.05), rgba(224,224,224,0.02)) !important;
      border-color: rgba(224,224,224,0.18) !important;
      box-shadow: none !important;
    }
    .tenant-elbarberomoderno .pwa-icon-bg {
      background: rgba(224,224,224,0.08) !important;
      border-color: rgba(224,224,224,0.20) !important;
      box-shadow: none !important;
    }
    /* ────────────────────────────────────────────────────────── */

    /* ── Chameleon Barber Studio — Dark Premium ─────────────────── */
    .tenant-chameleon {
      --gold:      #DAA520;
      --gold-dim:  rgba(218,165,32,0.35);
      --gold-glow: rgba(218,165,32,0.18);
    }
    html.tenant-chameleon body { background-color: #000000; }
    /* Header */
    .tenant-chameleon header {
      background-color: rgba(0,0,0,0.97) !important;
    }
    .tenant-chameleon #authGuard { background: #000000 !important; }
    /* Hero */
    .tenant-chameleon .hero-bg {
      background-image: url('/fondolocal3.png');
      background-size: cover;
      background-position: center 30%;
    }
    .tenant-chameleon .hero-overlay {
      background: linear-gradient(160deg,
        rgba(0,0,0,0.40) 0%, rgba(0,0,0,0.28) 40%, rgba(0,0,0,0.92) 100%);
    }
    .tenant-chameleon .hero-glow-spot {
      background: radial-gradient(circle, rgba(218,165,32,0.12) 0%, transparent 65%) !important;
    }
    /* Hero CTA: oro metálico sólido */
    .tenant-chameleon .hero-cta {
      background: #DAA520 !important;
      border-color: #B8860B !important;
      color: #0a0800 !important;
      box-shadow: 0 4px 20px rgba(218,165,32,0.45) !important;
      backdrop-filter: none !important;
      -webkit-backdrop-filter: none !important;
    }
    .tenant-chameleon .hero-cta i  { color: #0a0800 !important; }
    .tenant-chameleon .hero-cta span { color: #0a0800 !important; }
    .tenant-chameleon #heroLine2 { color: #ffffff !important; font-style: normal !important; }
    /* Cards: carbón oscuro */
    .tenant-chameleon .membership-pattern {
      background: #121212 !important;
      border-color: rgba(255,255,255,0.06) !important;
    }
    /* Sellos vacíos: gris oscuro */
    .tenant-chameleon .stamp-cell {
      background: #1e1e1e !important;
      border-color: rgba(255,255,255,0.07) !important;
    }
    .tenant-chameleon .stamp-cell.filled {
      background: #000000 !important;
      border: 1px solid rgba(255,255,255,0.15) !important;
      box-shadow: none !important;
    }
    .tenant-chameleon .stamp-cell.filled i { color: #fff !important; }
    /* Barra de progreso: gradiente oro */
    .tenant-chameleon #stampsBar {
      background: linear-gradient(90deg, #B8860B, #DAA520) !important;
      box-shadow: 0 0 10px rgba(218,165,32,0.50) !important;
    }
    /* Grid de sellos */
    .tenant-chameleon #stampsGrid {
      background: #0a0a0a !important;
      border-color: rgba(255,255,255,0.05) !important;
    }
    /* Contador sellos: esmeralda */
    .tenant-chameleon #stampsCount { color: #00C98C !important; }
    .tenant-chameleon #stampsCount > span { color: rgba(218,165,32,0.55) !important; }
    /* Membership glow y watermark */
    .tenant-chameleon .membership-pattern::before {
      background-image: repeating-linear-gradient(
        -45deg, transparent, transparent 18px,
        rgba(218,165,32,0.02) 18px, rgba(218,165,32,0.02) 19px
      );
    }
    .tenant-chameleon .membership-glow {
      background: radial-gradient(circle, rgba(218,165,32,0.07) 0%, transparent 70%) !important;
    }
    .tenant-chameleon #membershipWatermark { color: rgba(218,165,32,0.04) !important; }
    /* Tarjetas secundarias: carbón */
    .tenant-chameleon #tabLoyalty .bg-\[#111115\],
    .tenant-chameleon #tabProfile .bg-\[#111115\] {
      background-color: #121212 !important;
      border-color: rgba(255,255,255,0.06) !important;
    }
    /* "Ver premios" → esmeralda */
    .tenant-chameleon button[onclick*="togglePremios"] {
      background: #00A36C !important;
      color: #ffffff !important;
      box-shadow: 0 2px 14px rgba(0,163,108,0.30) !important;
    }
    /* Icono de premio */
    .tenant-chameleon .premio-icon { color: #DAA520 !important; }
    /* Nav activo */
    .tenant-chameleon .nav-tab.active .nav-icon {
      color: #DAA520;
      filter: drop-shadow(0 0 6px rgba(218,165,32,0.35));
    }
    .tenant-chameleon .nav-tab.active .nav-label { color: #DAA520; }
    /* Tier badges */
    .tenant-chameleon .tier-badge.gold {
      color: #DAA520;
      border-color: rgba(218,165,32,0.35);
    }
    .tenant-chameleon .tier-badge.platinum {
      color: #f0d87a;
      border-color: rgba(218,165,32,0.30);
    }
    /* PWA */
    .tenant-chameleon #pwaBigInstallCard {
      background: linear-gradient(to right, rgba(218,165,32,0.09), rgba(218,165,32,0.03)) !important;
      border-color: rgba(218,165,32,0.22) !important;
      box-shadow: 0 0 20px rgba(218,165,32,0.06) !important;
    }
    .tenant-chameleon .pwa-icon-bg {
      background: rgba(218,165,32,0.10) !important;
      border-color: rgba(218,165,32,0.22) !important;
      box-shadow: 0 0 15px rgba(218,165,32,0.12) !important;
    }
    .tenant-chameleon #pwaBanner { border-color: rgba(218,165,32,0.28) !important; }
    .tenant-chameleon #pwaModalIOS > div { border-color: rgba(218,165,32,0.18) !important; }
    .tenant-chameleon .pwa-step-badge { background: #DAA520 !important; }
    /* Botones de acción: esmeralda */
    .tenant-chameleon .btn-accion-primary {
      background: #00A36C !important;
      color: #ffffff !important;
      box-shadow: 0 4px 18px rgba(0,163,108,0.35) !important;
    }
    .tenant-chameleon a.btn-reservar {
      background: #00A36C !important;
      color: #ffffff !important;
      box-shadow: 0 4px 18px rgba(0,163,108,0.35) !important;
    }
    /* ────────────────────────────────────────────────────────── */

    /* ── Barbers Club — Premium Dark Re-skin (neutral-900 + yellow-500 + orange-600) ─── */
    .tenant-barbersclub {
      --gold:      #eab308;
      --gold-dim:  rgba(234,179,8,0.35);
      --gold-glow: rgba(234,179,8,0.18);
      --primary:   #ea580c;
      --primary-h: #c2410c;
      --card-bg:   #27272a;
      --card-brd:  #404040;
    }
    html.tenant-barbersclub body { background-color: #18181b; color: #e5e5e5; }
    .tenant-barbersclub header {
      background-color: rgba(24,24,27,0.97) !important;
      border-bottom-color: #404040 !important;
    }
    .tenant-barbersclub #authGuard { background: #18181b !important; }
    /* Hero: banner propio del local (reemplaza /elegance.png) */
    .tenant-barbersclub .hero-bg {
      background-image: url('/barbersclub/hero-bg.png') !important;
      background-position: center 35% !important;
      background-color: #18181b !important;
    }
    /* ── STUDIO LUXURY — hereda el tema de Barbers Club (alias) pero usa el
       banner REAL del local en el hero del dashboard, no la foto de barbersclub.
       Va después para ganar por orden (misma especificidad). ── */
    .tenant-estudioluxury .hero-bg {
      background-image: url('/luxury/banner.png') !important;
      background-position: center 42% !important;
      background-color: #0b0a09 !important;
    }
    .tenant-barbersclub .hero-overlay {
      background: linear-gradient(160deg,
        rgba(24,24,27,0.40) 0%, rgba(24,24,27,0.28) 40%, rgba(24,24,27,0.92) 100%);
    }
    .tenant-barbersclub .hero-glow-spot {
      background: radial-gradient(circle, rgba(234,179,8,0.12) 0%, transparent 65%) !important;
    }
    /* CTA principal del hero → NARANJA (antes dorado) */
    .tenant-barbersclub .hero-cta {
      background: #ea580c !important;
      border-color: #c2410c !important;
      color: #ffffff !important;
      box-shadow: 0 4px 20px rgba(234,88,12,0.35) !important;
      backdrop-filter: none !important;
      -webkit-backdrop-filter: none !important;
    }
    .tenant-barbersclub .hero-cta:hover { background: #c2410c !important; }
    .tenant-barbersclub .hero-cta i  { color: #ffffff !important; }
    .tenant-barbersclub .hero-cta span { color: #ffffff !important; }
    .tenant-barbersclub #heroLine2 { color: #ffffff !important; font-style: normal !important; }
    /* Sellos (fidelidad) */
    .tenant-barbersclub .membership-pattern {
      background: #27272a !important;
      border-color: #404040 !important;
    }
    .tenant-barbersclub .stamp-cell {
      background: #18181b !important;
      border-color: #404040 !important;
    }
    .tenant-barbersclub .stamp-cell.filled {
      background: #eab308 !important;
      border: 1px solid #eab308 !important;
      box-shadow: 0 0 12px rgba(234,179,8,0.28) !important;
    }
    .tenant-barbersclub .stamp-cell.filled i { color: #18181b !important; }
    .tenant-barbersclub #stampsBar {
      background: linear-gradient(90deg, #ca8a04, #eab308) !important;
      box-shadow: 0 0 10px rgba(234,179,8,0.45) !important;
    }
    .tenant-barbersclub #stampsGrid {
      background: #18181b !important;
      border-color: #404040 !important;
    }
    /* Contador de sellos DORADO (antes verde #00C98C) */
    .tenant-barbersclub #stampsCount { color: #eab308 !important; }
    .tenant-barbersclub #stampsCount > span { color: #a3a3a3 !important; }
    .tenant-barbersclub .membership-pattern::before {
      background-image: repeating-linear-gradient(
        -45deg, transparent, transparent 18px,
        rgba(234,179,8,0.025) 18px, rgba(234,179,8,0.025) 19px
      );
    }
    .tenant-barbersclub .membership-glow {
      background: radial-gradient(circle, rgba(234,179,8,0.07) 0%, transparent 70%) !important;
    }
    .tenant-barbersclub #membershipWatermark { color: rgba(234,179,8,0.05) !important; }
    /* Contenedores/tarjetas del tab loyalty y profile → neutral-800 */
    .tenant-barbersclub #tabLoyalty .bg-\[#111115\],
    .tenant-barbersclub #tabProfile .bg-\[#111115\] {
      background-color: #27272a !important;
      border-color: #404040 !important;
    }
    /* Botón "Ver premios" → NARANJA (antes verde #00A36C) */
    .tenant-barbersclub button[onclick*="togglePremios"] {
      background: #ea580c !important;
      color: #ffffff !important;
      box-shadow: 0 2px 14px rgba(234,88,12,0.30) !important;
    }
    .tenant-barbersclub button[onclick*="togglePremios"]:hover {
      background: #c2410c !important;
    }
    .tenant-barbersclub .premio-icon { color: #eab308 !important; }
    /* Nav bar inferior — tab activa DORADA */
    .tenant-barbersclub .nav-tab.active .nav-icon {
      color: #eab308;
      filter: drop-shadow(0 0 6px rgba(234,179,8,0.35));
    }
    .tenant-barbersclub .nav-tab.active .nav-label { color: #eab308; }
    /* Rangos de fidelidad */
    .tenant-barbersclub .tier-badge.gold {
      color: #eab308;
      border-color: rgba(234,179,8,0.35);
    }
    .tenant-barbersclub .tier-badge.silver,
    .tenant-barbersclub .tier-badge.plateado {
      color: #a3a3a3;
      border-color: #525252;
    }
    .tenant-barbersclub .tier-badge.platinum {
      color: #f0d87a;
      border-color: rgba(234,179,8,0.30);
    }
    /* Instala la App — card dorada */
    .tenant-barbersclub #pwaBigInstallCard {
      background: linear-gradient(to right, rgba(234,179,8,0.10), rgba(234,179,8,0.03)) !important;
      border-color: rgba(234,179,8,0.28) !important;
      box-shadow: 0 0 20px rgba(234,179,8,0.06) !important;
    }
    .tenant-barbersclub .pwa-icon-bg {
      background: rgba(234,179,8,0.10) !important;
      border-color: rgba(234,179,8,0.30) !important;
      box-shadow: 0 0 15px rgba(234,179,8,0.12) !important;
    }
    .tenant-barbersclub #pwaBanner { border-color: rgba(234,179,8,0.28) !important; }
    .tenant-barbersclub #pwaModalIOS > div { border-color: rgba(234,179,8,0.22) !important; }
    .tenant-barbersclub .pwa-step-badge { background: #eab308 !important; color: #18181b !important; }
    /* CTAs primarios (btn-accion-primary, Reservar ahora) → NARANJA */
    .tenant-barbersclub .btn-accion-primary {
      background: #ea580c !important;
      color: #ffffff !important;
      box-shadow: 0 4px 18px rgba(234,88,12,0.32) !important;
    }
    .tenant-barbersclub .btn-accion-primary:hover { background: #c2410c !important; }
    .tenant-barbersclub a.btn-reservar {
      background: #ea580c !important;
      color: #ffffff !important;
      box-shadow: 0 4px 18px rgba(234,88,12,0.32) !important;
    }
    .tenant-barbersclub a.btn-reservar:hover { background: #c2410c !important; }
    /* ── PERFIL: inputs + botones ── */
    .tenant-barbersclub #tabProfile input,
    .tenant-barbersclub #tabProfile textarea {
      background-color: #18181b !important;
      border: 1px solid #404040 !important;
      color: #e5e5e5 !important;
      transition: border-color 0.2s, box-shadow 0.2s !important;
    }
    .tenant-barbersclub #tabProfile input:focus,
    .tenant-barbersclub #tabProfile textarea:focus {
      border-color: #eab308 !important;
      box-shadow: 0 0 0 2px rgba(234,179,8,0.18) !important;
      outline: none !important;
    }
    .tenant-barbersclub #tabProfile input::placeholder,
    .tenant-barbersclub #tabProfile textarea::placeholder {
      color: #737373 !important;
    }
    .tenant-barbersclub #tabProfile label { color: #d4d4d4 !important; }
    /* Guardar cambios → NARANJA */
    .tenant-barbersclub #tabProfile button[type="submit"],
    .tenant-barbersclub #btnGuardarPerfil,
    .tenant-barbersclub button[onclick*="guardarPerfil"] {
      background: #ea580c !important;
      color: #ffffff !important;
      box-shadow: 0 4px 18px rgba(234,88,12,0.32) !important;
      border: none !important;
    }
    .tenant-barbersclub #tabProfile button[type="submit"]:hover,
    .tenant-barbersclub #btnGuardarPerfil:hover,
    .tenant-barbersclub button[onclick*="guardarPerfil"]:hover {
      background: #c2410c !important;
    }
    /* Cerrar sesión: outline oscuro elegante */
    .tenant-barbersclub button[onclick*="cerrarSesion"],
    .tenant-barbersclub #btnCerrarSesion {
      background: #27272a !important;
      color: #e5e5e5 !important;
      border: 1px solid #404040 !important;
    }
    .tenant-barbersclub button[onclick*="cerrarSesion"]:hover,
    .tenant-barbersclub #btnCerrarSesion:hover {
      border-color: #525252 !important;
      background: #303033 !important;
    }
    /* Eliminar cuenta: rojo sutil elegante que ADVIERTE */
    .tenant-barbersclub button[onclick*="eliminarCuenta"],
    .tenant-barbersclub #btnEliminarCuenta {
      background: rgba(127,29,29,0.28) !important;
      color: #ef4444 !important;
      border: 1px solid #7f1d1d !important;
    }
    .tenant-barbersclub button[onclick*="eliminarCuenta"]:hover,
    .tenant-barbersclub #btnEliminarCuenta:hover {
      background: rgba(127,29,29,0.42) !important;
      border-color: #991b1b !important;
    }

    /* ══════════════════════════════════════════════════════════════════
       Barbers Club — Fit & Finish: Fidelización + Perfil unificados
       Naranja primario, gris sutil secundario, tarjetas neutral-800,
       punch card con espacios discontinuos, avatar dark elegante,
       stats con acento dorado superior, chat FAB con clearance.
       ══════════════════════════════════════════════════════════════════ */

    /* ── 1. Unificación CTAs primarios → naranja rounded-full ────────── */
    .tenant-barbersclub #notifBannerActivar,
    .tenant-barbersclub #pwaBanner button,
    .tenant-barbersclub button[onclick*="togglePremios"],
    .tenant-barbersclub .btn-accion-primary,
    .tenant-barbersclub a.btn-reservar {
      background: #ea580c !important;
      color: #ffffff !important;
      border-radius: 9999px !important;
      font-weight: 600 !important;
      box-shadow: 0 4px 18px rgba(234,88,12,0.30) !important;
      border: none !important;
    }
    .tenant-barbersclub #notifBannerActivar:hover,
    .tenant-barbersclub #pwaBanner button:hover,
    .tenant-barbersclub button[onclick*="togglePremios"]:hover,
    .tenant-barbersclub .btn-accion-primary:hover,
    .tenant-barbersclub a.btn-reservar:hover {
      background: #c2410c !important;
    }
    /* pwaBigInstallCard: tarjeta clickeable → radio 2xl + fondo neutro */
    .tenant-barbersclub #pwaBigInstallCard {
      background: #262626 !important;
      border: 1px solid rgba(234,179,8,0.28) !important;
      border-radius: 1rem !important;
      box-shadow: 0 4px 20px rgba(0,0,0,0.35) !important;
    }
    /* Botón secundario "Ahora no" → texto gris sutil */
    .tenant-barbersclub #notifBanner button[onclick*="posponerNotifBanner"] {
      color: #a3a3a3 !important;
      background: transparent !important;
      border: none !important;
      box-shadow: none !important;
    }
    .tenant-barbersclub #notifBanner button[onclick*="posponerNotifBanner"]:hover {
      color: #ffffff !important;
    }
    .tenant-barbersclub button[onclick*="cerrarFeedbackCard"] {
      color: #a3a3a3 !important;
      background: transparent !important;
      border: 1px solid #404040 !important;
    }
    .tenant-barbersclub button[onclick*="cerrarFeedbackCard"]:hover {
      color: #ffffff !important;
      border-color: #525252 !important;
    }

    /* ── 2. Punch card: sellos como "espacios para sellar" ───────────── */
    .tenant-barbersclub .stamp-cell {
      background: #171717 !important;
      border: 2px dashed #404040 !important;
      border-radius: 1rem !important;
      transition: all 0.35s cubic-bezier(0.34,1.56,0.64,1) !important;
    }
    /* Sello ganado: gradiente dorado sólido + check/logo oscuro visible */
    .tenant-barbersclub .stamp-cell.filled {
      background: linear-gradient(135deg, #f5c518 0%, #eab308 55%, #ca8a04 100%) !important;
      border: 1px solid #eab308 !important;
      box-shadow: 0 4px 14px rgba(234,179,8,0.35),
                  inset 0 1px 0 rgba(255,255,255,0.35) !important;
    }
    .tenant-barbersclub .stamp-cell.filled i { color: #18181b !important; }
    /* El 6º espacio (premio final) destaca desde el inicio */
    .tenant-barbersclub .stamp-cell.prize-empty {
      border: 2px dashed rgba(234,179,8,0.35) !important;
      background: rgba(234,179,8,0.04) !important;
    }
    .tenant-barbersclub .stamp-cell.prize-empty i {
      color: rgba(234,179,8,0.55) !important;
    }

    /* ── 3. Perfil: Avatar por defecto dark + stats con borde dorado ── */
    /* Avatar header (círculo pequeño en top-right) */
    .tenant-barbersclub #avatarContainer {
      background: #262626 !important;
      border: 1px solid #404040 !important;
    }
    .tenant-barbersclub #avatarContainer i { color: #d4d4d4 !important; }
    /* Avatar perfil (círculo grande) — sin glow blanco, borde neutro elegante */
    .tenant-barbersclub #profileAvatar {
      background: #262626 !important;
      border: 1px solid #404040 !important;
      box-shadow: 0 4px 20px rgba(0,0,0,0.4) !important;
    }
    .tenant-barbersclub #profileAvatar i {
      color: #eab308 !important;
      opacity: 0.85 !important;
    }
    /* Stats "Visitas" y "Sellos": borde superior dorado sutil */
    .tenant-barbersclub #profileVisitsCount,
    .tenant-barbersclub #profileStamps { color: #ffffff !important; }
    .tenant-barbersclub #tabProfile div.bg-zinc-900 {
      background: #1a1a1a !important;
      border-top: 1px solid #eab308 !important;
      box-shadow: inset 0 1px 0 rgba(234,179,8,0.10),
                  0 2px 10px rgba(0,0,0,0.35) !important;
    }

    /* ── 4. Consistencia de tarjetas + chat FAB clearance ──────────── */
    /* notifBanner y feedback card compartiendo bg + radio */
    .tenant-barbersclub #notifBanner {
      background: #262626 !important;
      border: 1px solid #404040 !important;
      border-radius: 1rem !important;
    }
    .tenant-barbersclub #interactiveFeedbackContainer > div {
      background: #262626 !important;
      border: 1px solid rgba(234,179,8,0.22) !important;
      border-radius: 1rem !important;
    }
    /* Chat FAB — subir para no tapar pwaBanner ni #btnCitaActiva */
    .tenant-barbersclub #chatWidget {
      bottom: calc(8.5rem + env(safe-area-inset-bottom)) !important;
    }
    .tenant-barbersclub #chatToggleBtn {
      box-shadow: 0 6px 20px rgba(0,0,0,0.5),
                  0 0 0 4px rgba(24,24,27,0.6) !important;
    }
    /* ────────────────────────────────────────────────────────── */

    /* ── Mapu Barber Shop — Classic Barbershop ────────────────── */
    .tenant-mapubarbershop {
      --gold:     #BFA37E;
      --gold-dim: rgba(191,163,126,0.28);
      --gold-glow: rgba(191,163,126,0.06);
    }

    /* Fondo burdeo oscuro mate */
    html.tenant-mapubarbershop body { background-color: #2A1E22; }

    /* Header sticky */
    .tenant-mapubarbershop header {
      background-color: rgba(42,30,34,0.97) !important;
    }

    /* Auth guard bg */
    .tenant-mapubarbershop #authGuard {
      background: #2A1E22 !important;
    }

    /* Hero: título principal — serif regular sin italic */
    .tenant-mapubarbershop #heroLine1 {
      font-family: 'Playfair Display', Georgia, serif !important;
      font-weight: 700 !important;
      font-style: normal !important;
      color: #F0EBE1 !important;
      text-shadow: 0 2px 20px rgba(0,0,0,0.5) !important;
    }
    .tenant-mapubarbershop #heroLine2 {
      font-family: 'Playfair Display', Georgia, serif !important;
      font-weight: 600 !important;
      font-style: normal !important;
      color: #BFA37E !important;
      text-shadow: none !important;
    }

    /* Botón "Reservar mi cita" — sólido dorado mate */
    .tenant-mapubarbershop .hero-cta {
      background: #BFA37E !important;
      color: #2A1E22 !important;
      border: none !important;
      box-shadow: none !important;
      backdrop-filter: none !important;
      font-weight: 700 !important;
    }
    .tenant-mapubarbershop .hero-cta i { color: #2A1E22 !important; }

    /* PWA Install card — plano, sin resplandor */
    .tenant-mapubarbershop #pwaBigInstallCard {
      background: #352529 !important;
      border: 1px solid rgba(191,163,126,0.25) !important;
      box-shadow: none !important;
    }
    .tenant-mapubarbershop #pwaBigInstallCard .absolute { display: none !important; }
    .tenant-mapubarbershop .pwa-icon-bg {
      background: rgba(191,163,126,0.10) !important;
      border-color: rgba(191,163,126,0.22) !important;
      box-shadow: none !important;
    }

    /* Membership card — burdeo ligeramente más claro */
    .tenant-mapubarbershop .membership-pattern {
      background: #2E2226 !important;
      border-color: rgba(191,163,126,0.12) !important;
    }
    .tenant-mapubarbershop .membership-glow {
      background: radial-gradient(circle, rgba(191,163,126,0.05) 0%, transparent 70%) !important;
    }
    .tenant-mapubarbershop #membershipWatermark {
      color: rgba(191,163,126,0.04) !important;
    }

    /* Descripción membresía — crema, no gris */
    .tenant-mapubarbershop #membershipDesc {
      color: rgba(240,235,225,0.55) !important;
    }

    /* Cuadrícula de sellos — fondo oscuro con borde sutil */
    .tenant-mapubarbershop #stampsGrid {
      background: rgba(42,30,34,0.7) !important;
      border-color: rgba(191,163,126,0.10) !important;
    }

    /* Sellos vacíos — borde discontinuo tipo tarjeta física */
    .tenant-mapubarbershop .stamp-cell.empty {
      border: 1px dashed rgba(191,163,126,0.32) !important;
      background: transparent !important;
    }

    /* Sellos llenos — dorado mate sólido */
    .tenant-mapubarbershop .stamp-cell.filled {
      background: #BFA37E !important;
      border: 1px solid #BFA37E !important;
      box-shadow: none !important;
    }
    .tenant-mapubarbershop .stamp-cell.filled i { color: #2A1E22 !important; }

    /* Barra de progreso de sellos */
    .tenant-mapubarbershop #stampsBar {
      background: #BFA37E !important;
      box-shadow: none !important;
    }

    /* Cards secundarias (próximo premio, perfil, historial) */
    .tenant-mapubarbershop .bg-\[#111115\] {
      background: #352529 !important;
    }
    .tenant-mapubarbershop .border-white\/8 {
      border-color: rgba(191,163,126,0.10) !important;
    }

    /* Bottom navigation */
    .tenant-mapubarbershop nav {
      background-color: rgba(42,30,34,0.97) !important;
      border-top-color: rgba(191,163,126,0.12) !important;
    }
    .tenant-mapubarbershop .nav-tab.active .nav-icon {
      color: #BFA37E !important;
      filter: none !important;
    }
    .tenant-mapubarbershop .nav-tab.active .nav-label {
      color: #BFA37E !important;
    }
    /* ────────────────────────────────────────────────────────── */

    body {
      background-color: #050505;
      color: #f8fafc;
      overscroll-behavior-y: none;
      -webkit-tap-highlight-color: transparent;
    }

    /* Gold accent */
    .text-gold  { color: var(--gold); text-shadow: 0 0 12px var(--gold-glow), 0 0 24px rgba(201,168,76,0.08); }
    .border-gold { border-color: var(--gold-dim); box-shadow: 0 0 8px var(--gold-glow), inset 0 0 8px rgba(201,168,76,0.04); }

    /* Legacy white neon (kept for profile/misc) */
    .text-neon   { color: #fff; text-shadow: 0 0 5px rgba(255,255,255,0.4), 0 0 10px rgba(255,255,255,0.2); }
    .border-neon { border-color: #fff; box-shadow: 0 0 6px rgba(255,255,255,0.2), inset 0 0 6px rgba(255,255,255,0.05); }

    .no-scrollbar::-webkit-scrollbar { display: none; }
    .no-scrollbar { -ms-overflow-style: none; scrollbar-width: none; }

    /* Feedback & Tips premium styling */
    .review-chip.active-chip {
      border-color: var(--gold) !important;
      color: var(--gold) !important;
      background: rgba(201, 168, 76, 0.08) !important;
    }
    :is(.tenant-aura,.tenant-latincaribe) .review-chip.active-chip {
      border-color: #111827 !important;
      color: #111827 !important;
      background: rgba(17, 24, 39, 0.06) !important;
    }


    /* Masonry grid para Lookbook */
    .masonry-grid { columns: 2; column-gap: 0.75rem; }
    .masonry-item { break-inside: avoid; margin-bottom: 0.75rem; }

    /* Bottom nav */
    .nav-tab { transition: all 0.2s; }
    .nav-tab.active .nav-icon  { color: var(--gold); filter: drop-shadow(0 0 6px var(--gold-glow)); }
    .nav-tab.active .nav-label { color: var(--gold); }
    .nav-tab .nav-icon  { color: #4b5563; }
    .nav-tab .nav-label { color: #4b5563; }

    /* Stamp cell — physical card style */
    .font-display { font-family: 'Playfair Display', Georgia, serif; }

    .stamp-cell {
      border-radius: 6px;
      display: flex;
      align-items: center;
      justify-content: center;
      aspect-ratio: 1;
      position: relative;
      transition: all 0.3s cubic-bezier(0.34,1.56,0.64,1);
    }
    .stamp-cell.filled {
      background: #D4AF37;
      box-shadow: 0 0 10px rgba(212,175,55,0.4);
      border: 1px solid #D4AF37;
    }
    /* Ferraza: sellos plateados */
    .tenant-ferraza .stamp-cell.filled {
      background: #e2e8f0 !important;
      border: 1px solid #e2e8f0 !important;
      box-shadow: none !important;
    }
    .tenant-ferraza .stamp-cell.filled i { color: #0a0a0a !important; }
    .stamp-cell.empty {
      border: 1px solid #374151;
      background: rgba(31,41,55,0.5);
    }

    /* Service card hover */
    .service-card {
      transition: transform 0.2s, border-color 0.2s;
      border: 1px solid #27272a;
    }
    .service-card:hover { border-color: var(--gold-dim); }
    .service-card:active { transform: scale(0.95); }

    /* Hero */
    .hero-bg {
      background-color: #0d0b09;
      background-image: url('/elegance.png');
      background-size: cover;
      background-position: center 20%;
    }
    .hero-overlay {
      background: linear-gradient(160deg,
        rgba(5,5,5,0.30) 0%,
        rgba(10,8,5,0.55) 40%,
        rgba(5,5,5,0.90) 100%);
    }

    /* ══ KRONNOS — Club de Fidelidad por sede (banner + acento) ══ */
    .tenant-kronnos_penablanca { --gold:#e11d2a; --gold-dim:rgba(225,29,42,0.25); --gold-glow:rgba(225,29,42,0.10); }
    .tenant-kronnos_penablanca .hero-bg { background-image:url('/kronnos/kronospena.png'); background-position:center 30%; }
    .tenant-kronnos_limache    { --gold:#f97316; --gold-dim:rgba(249,115,22,0.25); --gold-glow:rgba(249,115,22,0.10); }
    .tenant-kronnos_limache .hero-bg { background-image:url('/kronnos/kronoslima.png'); background-position:center 30%; }
    .tenant-kronnos_woman      { --gold:#ec4899; --gold-dim:rgba(236,72,153,0.25); --gold-glow:rgba(236,72,153,0.10); }
    .tenant-kronnos_woman .hero-bg { background-image:url('/kronnos/kronoswoman.png'); background-position:center 30%; }

    /* ══════════════════════════════════════════════════════════════════
     * KRONNOS · DASHBOARD CLIENTE — editorial refinado, sin neones
     * ──────────────────────────────────────────────────────────────────
     * Mismo lenguaje que /registro y /step-servicios: Inter en TODO lo
     * funcional (nombres, numeros, textos), Playfair solo en el saludo
     * del hero (grande, decorativo). Cards con hairline blanco @6%.
     * Radios 12-14px. Glows del acento eliminados de botones y cards.
     * ══════════════════════════════════════════════════════════════════ */

    /* Hero overlay más denso para separar el nombre de la foto del local */
    [class*="tenant-kronnos_"] .hero-overlay {
      background: linear-gradient(180deg,
        rgba(0,0,0,0.45) 0%,
        rgba(0,0,0,0.32) 40%,
        rgba(0,0,0,0.48) 65%,
        rgba(10,9,8,0.98) 100%) !important;
    }
    /* Hero glow spot mucho mas sutil */
    [class*="tenant-kronnos_"] .hero-glow-spot {
      background: radial-gradient(circle, var(--gold-glow) 0%, transparent 60%) !important;
      opacity: 0.5;
    }

    /* Hero saludo — Line 1 (eyebrow) + Line 2 (nombre grande) */
    [class*="tenant-kronnos_"] #heroLine1 {
      font-family: 'Inter', system-ui, sans-serif !important;
      font-weight: 500 !important;
      font-size: 0.7rem !important;
      letter-spacing: 0.22em !important;
      text-transform: uppercase !important;
      color: rgba(255, 255, 255, 0.55) !important;
    }
    [class*="tenant-kronnos_"] #heroLine2 {
      font-family: 'Playfair Display', 'Cormorant Garamond', serif !important;
      font-weight: 500 !important;
      font-style: normal !important;
      letter-spacing: -0.018em !important;
      color: #faf8f4 !important;
      text-shadow:
        0 1px 2px rgba(0,0,0,0.9),
        0 3px 12px rgba(0,0,0,0.5) !important;
      line-height: 1.05 !important;
    }

    /* Hero CTA — solido plano, sin glow del color */
    [class*="tenant-kronnos_"] .hero-cta {
      background: var(--gold) !important;
      border-color: var(--gold) !important;
      color: #ffffff !important;
      border-radius: 12px !important;
      font-family: 'Inter', system-ui, sans-serif !important;
      font-weight: 600 !important;
      letter-spacing: 0.10em !important;
      text-transform: uppercase !important;
      box-shadow:
        0 1px 2px rgba(0,0,0,0.3),
        0 4px 14px -4px rgba(0,0,0,0.4) !important;
      transition: filter 0.15s ease, transform 0.15s ease !important;
    }
    [class*="tenant-kronnos_"] .hero-cta:hover {
      filter: brightness(1.08) !important;
      transform: translateY(-1px);
    }
    [class*="tenant-kronnos_"] .hero-cta i,
    [class*="tenant-kronnos_"] .hero-cta span { color: #ffffff !important; }

    /* Perfil: nombre + email */
    [class*="tenant-kronnos_"] #profileName {
      font-family: 'Playfair Display', 'Cormorant Garamond', serif !important;
      font-weight: 500 !important;
      letter-spacing: -0.014em !important;
      color: #faf8f4 !important;
    }
    [class*="tenant-kronnos_"] #profileEmail {
      font-family: 'Inter', system-ui, sans-serif !important;
      color: rgba(255, 255, 255, 0.45) !important;
      letter-spacing: 0 !important;
    }

    /* Stats del perfil: rango · visitas · sellos */
    [class*="tenant-kronnos_"] #profileTierBadge {
      font-family: 'Inter', system-ui, sans-serif !important;
      font-weight: 700 !important;
      font-size: 0.78rem !important;
      letter-spacing: 0.14em !important;
      color: var(--gold) !important;
      text-shadow: none !important;
    }
    [class*="tenant-kronnos_"] #profileVisitsCount,
    [class*="tenant-kronnos_"] #profileStamps {
      font-family: 'Inter', system-ui, sans-serif !important;
      font-weight: 700 !important;
      font-variant-numeric: tabular-nums !important;
      letter-spacing: -0.02em !important;
      color: #ffffff !important;
    }

    /* Cards del perfil (rango, visitas, sellos) — hairline neutro */
    [class*="tenant-kronnos_"] #profileTierBadge + span,
    [class*="tenant-kronnos_"] #profileVisitsCount + span,
    [class*="tenant-kronnos_"] #profileStamps + span {
      font-family: 'Inter', system-ui, sans-serif !important;
      letter-spacing: 0.16em !important;
      color: rgba(255, 255, 255, 0.4) !important;
    }

    /* Cards de premios (lista) — refinadas */
    [class*="tenant-kronnos_"] #premiosList > div,
    [class*="tenant-kronnos_"] #premiosList button {
      background: rgba(18, 14, 10, 0.55) !important;
      border: 1px solid rgba(255, 255, 255, 0.06) !important;
      border-radius: 14px !important;
      transition: transform 0.2s ease, border-color 0.2s ease, background 0.2s ease !important;
    }
    [class*="tenant-kronnos_"] #premiosList > div:hover,
    [class*="tenant-kronnos_"] #premiosList button:hover {
      border-color: rgba(var(--gold-r, 249), var(--gold-g, 115), var(--gold-b, 22), 0.28) !important;
      background: rgba(24, 18, 14, 0.7) !important;
      transform: translateY(-1px);
    }

    /* Tipografia en cards de premios — Playfair para el nombre */
    [class*="tenant-kronnos_"] #premiosList p.text-sm {
      font-family: 'Playfair Display', 'Cormorant Garamond', serif !important;
      font-weight: 500 !important;
      letter-spacing: -0.008em !important;
      color: #faf8f4 !important;
    }
    [class*="tenant-kronnos_"] #premiosList .text-\[10px\],
    [class*="tenant-kronnos_"] #premiosList .text-\[11px\] {
      font-family: 'Inter', system-ui, sans-serif !important;
      letter-spacing: 0.12em !important;
    }

    /* Numeros grandes en premios (costoSellos) — Inter tabular */
    [class*="tenant-kronnos_"] #premiosList .text-xl {
      font-family: 'Inter', system-ui, sans-serif !important;
      font-weight: 800 !important;
      font-variant-numeric: tabular-nums !important;
      letter-spacing: -0.02em !important;
      color: var(--gold) !important;
    }

    /* Nav labels del bottom bar (Perfil, Premios, Reservas...) */
    [class*="tenant-kronnos_"] .nav-label {
      font-family: 'Inter', system-ui, sans-serif !important;
      letter-spacing: 0.14em !important;
      text-transform: uppercase !important;
    }

    /* Botones secundarios (Editar perfil, Cerrar sesion, etc.) */
    [class*="tenant-kronnos_"] button.btn-secondary,
    [class*="tenant-kronnos_"] .btn-outline {
      font-family: 'Inter', system-ui, sans-serif !important;
      font-weight: 600 !important;
      letter-spacing: 0.08em !important;
    }

    /* Section headers ("Premios", "Reservas", etc.) — versalitas Inter */
    [class*="tenant-kronnos_"] h2.text-\[10px\],
    [class*="tenant-kronnos_"] h3.text-\[10px\] {
      font-family: 'Inter', system-ui, sans-serif !important;
      letter-spacing: 0.20em !important;
      color: rgba(255, 255, 255, 0.5) !important;
    }

    /* Toggle "Recibir novedades y promos" — refinado */
    [class*="tenant-kronnos_"] #anuncioOptOutRow {
      background: rgba(15, 12, 9, 0.5) !important;
      border-color: rgba(255, 255, 255, 0.06) !important;
      border-radius: 14px !important;
    }
    [class*="tenant-kronnos_"] #anuncioOptOutRow p:first-child {
      font-family: 'Inter', system-ui, sans-serif !important;
      font-weight: 600 !important;
      letter-spacing: -0.005em !important;
      color: #faf8f4 !important;
    }
    [class*="tenant-kronnos_"] #anuncioOptOutRow p:nth-child(2) {
      font-family: 'Inter', system-ui, sans-serif !important;
      color: rgba(255, 255, 255, 0.4) !important;
    }

    /* ══════════════════════════════════════════════════════════════════
     * KRONNOS DASHBOARD · Animaciones editoriales sutiles
     * ──────────────────────────────────────────────────────────────────
     * Movimiento con intencion. Nada de bouncing SaaS. Curvas de easing
     * inspiradas en iOS: cubic-bezier(0.16, 1, 0.3, 1) para entradas
     * suaves, y spring apenas notable en hovers.
     *
     * Respeta prefers-reduced-motion: si el usuario tiene la preferencia
     * activada, todo se desactiva (accesibilidad WCAG 2.3.3).
     * ══════════════════════════════════════════════════════════════════ */

    /* ── Entrance: fade + slide desde abajo (los elementos del hero y
     *    el cuerpo aparecen escalonados al cargar). ── */
    @keyframes kronnosFadeUp {
      from { opacity: 0; transform: translateY(14px); }
      to   { opacity: 1; transform: translateY(0);   }
    }
    @keyframes kronnosFadeInOnly {
      from { opacity: 0; }
      to   { opacity: 1; }
    }

    [class*="tenant-kronnos_"] .hero-bg,
    [class*="tenant-kronnos_"] header,
    [class*="tenant-kronnos_"] #profileCard,
    [class*="tenant-kronnos_"] #profileTierProgress,
    [class*="tenant-kronnos_"] #premiosList,
    [class*="tenant-kronnos_"] #anuncioOptOutRow,
    [class*="tenant-kronnos_"] section {
      animation: kronnosFadeUp 0.65s cubic-bezier(0.16, 1, 0.3, 1) both;
    }
    [class*="tenant-kronnos_"] .hero-bg           { animation-delay: 0.00s; }
    [class*="tenant-kronnos_"] header             { animation-delay: 0.02s; }
    [class*="tenant-kronnos_"] #profileCard       { animation-delay: 0.10s; }
    [class*="tenant-kronnos_"] #profileTierProgress { animation-delay: 0.18s; }
    [class*="tenant-kronnos_"] #anuncioOptOutRow  { animation-delay: 0.24s; }
    [class*="tenant-kronnos_"] #premiosList       { animation-delay: 0.30s; }

    /* ── Cards de premios: aparecen escalonadas por :nth-child ── */
    [class*="tenant-kronnos_"] #premiosList > div,
    [class*="tenant-kronnos_"] #premiosList > button {
      animation: kronnosFadeUp 0.55s cubic-bezier(0.16, 1, 0.3, 1) both;
    }
    [class*="tenant-kronnos_"] #premiosList > *:nth-child(1) { animation-delay: 0.35s; }
    [class*="tenant-kronnos_"] #premiosList > *:nth-child(2) { animation-delay: 0.42s; }
    [class*="tenant-kronnos_"] #premiosList > *:nth-child(3) { animation-delay: 0.49s; }
    [class*="tenant-kronnos_"] #premiosList > *:nth-child(4) { animation-delay: 0.56s; }
    [class*="tenant-kronnos_"] #premiosList > *:nth-child(5) { animation-delay: 0.63s; }
    [class*="tenant-kronnos_"] #premiosList > *:nth-child(n+6) { animation-delay: 0.70s; }

    /* ── Hover con spring apenas notable (0.28s cubic bez suave) ── */
    [class*="tenant-kronnos_"] #premiosList > div,
    [class*="tenant-kronnos_"] #premiosList > button {
      transition:
        transform 0.28s cubic-bezier(0.34, 1.28, 0.64, 1),
        border-color 0.24s ease,
        background 0.24s ease !important;
    }

    /* ── Badge del rango: shimmer periódico muy tenue (cada 6s) ── */
    @keyframes kronnosBadgeShimmer {
      0%, 88%, 100% { background-position: -200% 0; opacity: 1; }
      93%           { background-position: 200% 0; opacity: 1; }
    }
    [class*="tenant-kronnos_"] #profileTierBadge {
      background-image: linear-gradient(
        100deg,
        transparent 40%,
        rgba(255, 255, 255, 0.18) 50%,
        transparent 60%
      );
      background-size: 200% 100%;
      background-repeat: no-repeat;
      background-clip: text;
      -webkit-background-clip: text;
      /* El shimmer solo se ve en el "recorrido" corto del 88%->93%.
       * El resto del tiempo el gradient esta fuera del texto. */
      animation: kronnosBadgeShimmer 6s ease-in-out infinite;
    }

    /* ── Hero CTA: shine sweep al hover (línea de luz que cruza) ── */
    [class*="tenant-kronnos_"] .hero-cta {
      position: relative;
      overflow: hidden;
    }
    [class*="tenant-kronnos_"] .hero-cta::after {
      content: '';
      position: absolute;
      top: 0; left: -100%;
      width: 50%; height: 100%;
      background: linear-gradient(
        100deg,
        transparent 0%,
        rgba(255, 255, 255, 0.22) 50%,
        transparent 100%
      );
      transition: left 0.6s cubic-bezier(0.4, 0, 0.2, 1);
      pointer-events: none;
    }
    [class*="tenant-kronnos_"] .hero-cta:hover::after { left: 150%; }

    /* ── Numeros de stats: pulso muy sutil al actualizar (JS los toca) ── */
    @keyframes kronnosStatPulse {
      0%   { transform: scale(1);    }
      35%  { transform: scale(1.08); color: var(--gold); }
      100% { transform: scale(1);    }
    }
    [class*="tenant-kronnos_"] #profileVisitsCount.stat-updated,
    [class*="tenant-kronnos_"] #profileStamps.stat-updated {
      animation: kronnosStatPulse 0.5s ease-out;
    }

    /* ── Ambient glow del hero: respira muy lento (12s ciclo) ── */
    @keyframes kronnosAmbientBreathe {
      0%, 100% { opacity: 0.4; transform: scale(1);    }
      50%      { opacity: 0.6; transform: scale(1.05); }
    }
    [class*="tenant-kronnos_"] .hero-glow-spot {
      animation: kronnosAmbientBreathe 12s ease-in-out infinite;
    }

    /* ── Tap feedback en cards (mobile-first) ── */
    [class*="tenant-kronnos_"] #premiosList > div:active,
    [class*="tenant-kronnos_"] #premiosList > button:active {
      transform: translateY(0) scale(0.985) !important;
      transition: transform 0.08s ease-out !important;
    }

    /* ── Reduced motion: TODO off (accesibilidad) ── */
    @media (prefers-reduced-motion: reduce) {
      [class*="tenant-kronnos_"] * {
        animation: none !important;
        transition: none !important;
      }
    }

    /* ══════════ YŪGEN STUDIO — Dark zen · marfil monocromático ══════════ */
    .tenant-yugen {
      --gold:      #f5f3ef;            /* marfil (como el logo) */
      --gold-dim:  rgba(245,243,239,0.28);
      --gold-glow: rgba(245,243,239,0.10);
    }
    .tenant-yugen body      { background-color: #0b0a09; }
    .tenant-yugen header    { background-color: rgba(11,10,9,0.96) !important; }
    .tenant-yugen #authGuard { background: #0b0a09 !important; }

    /* Tipografía de marca: serif Playfair en títulos + tracking amplio */
    .tenant-yugen h1,
    .tenant-yugen h2,
    .tenant-yugen #heroLine2 {
      font-family: 'Playfair Display', Georgia, serif !important;
      letter-spacing: 0.03em !important;
      text-shadow: none !important;
      font-style: normal !important;
    }
    .tenant-yugen #heroLine1 {
      text-transform: uppercase;
      letter-spacing: 0.34em !important;
      color: rgba(245,243,239,0.55) !important;
      font-weight: 500 !important;
    }
    .tenant-yugen #heroLine2 { color: #f5f3ef !important; font-weight: 600 !important; }
    /* Sello ritual 幽玄 (幽 blanco · 玄 rojo) bajo el nombre del hero — alineado a la izquierda */
    .tenant-yugen #heroLine2::after {
      content: '幽玄';
      display: block;
      width: fit-content;
      margin: 12px auto 0 0;
      font-family: 'Yu Mincho','Hiragino Mincho ProN','Noto Serif JP',serif;
      font-size: 18px;
      line-height: 1;
      letter-spacing: 0.18em;
      background: linear-gradient(90deg, #ffffff 0 50%, #c0392b 50% 100%);
      -webkit-background-clip: text;
      background-clip: text;
      color: transparent;
      -webkit-text-fill-color: transparent;
    }
    /* ── Toda la tipografía del dashboard de Yūgen en la fuente de "Yūgen
       Experience" (Playfair Display). Se excluyen los íconos (Phosphor) y los
       kanji/marca de agua conservan su serif japonés por su mayor especificidad. ── */
    .tenant-yugen :is(h1,h2,h3,h4,h5,h6,p,span,a,button,div,label,input,textarea,select,li,strong,b,em,small,td,th,figcaption):not([class*="ph-"]) {
      font-family: 'Playfair Display', Georgia, serif !important;
    }
    /* Marca "YŪGEN STUDIO" en la misma fuente */
    .tenant-yugen #shopHeaderName,
    .tenant-yugen #shopHeaderSub {
      font-family: 'Playfair Display', Georgia, serif !important;
    }
    /* Los kanji (sello + marca de agua) conservan el serif japonés */
    .tenant-yugen #membershipWatermark {
      font-family: 'Yu Mincho','Hiragino Mincho ProN','Noto Serif JP',serif !important;
    }
    .tenant-yugen .nav-label { letter-spacing: 0.16em !important; text-transform: uppercase; }

    /* Hero: banner del bonsái */
    .tenant-yugen .hero-bg {
      background-image: url('/yugen/yugen2.png');
      background-size: cover;
      background-position: center 30%;
      background-color: #0b0a09;
    }
    .tenant-yugen .hero-overlay {
      background: linear-gradient(160deg,
        rgba(8,7,6,0.40) 0%, rgba(8,7,6,0.30) 40%, rgba(11,10,9,0.94) 100%) !important;
    }
    .tenant-yugen .hero-glow-spot {
      background: radial-gradient(circle, rgba(245,243,239,0.05) 0%, transparent 65%) !important;
    }
    .tenant-yugen .hero-cta {
      background: #f5f3ef !important;
      border-color: #f5f3ef !important;
      color: #0b0a09 !important;
      box-shadow: none !important;
      backdrop-filter: none !important; -webkit-backdrop-filter: none !important;
    }
    .tenant-yugen .hero-cta i, .tenant-yugen .hero-cta span { color: #0b0a09 !important; }

    /* Tarjeta de membresía: carbón + ondas op-art como marca de agua */
    .tenant-yugen .membership-pattern {
      background: #15120e !important;
      border-color: rgba(245,243,239,0.08) !important;
    }
    .tenant-yugen .membership-pattern::before {
      background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='54'%3E%3Cpath d='M0,27 C37,6 73,48 110,27 C147,6 183,48 220,27' fill='none' stroke='%23f5f3ef' stroke-width='1.1'/%3E%3C/svg%3E");
      background-repeat: repeat;
      background-size: 220px 54px;
      opacity: 0.06;
    }
    .tenant-yugen #membershipWatermark {
      color: rgba(245,243,239,0.05) !important;
      font-style: normal !important;
      font-family: 'Yu Mincho','Hiragino Mincho ProN','Noto Serif JP',serif !important;
      font-size: 4.6rem !important;
      letter-spacing: 0.1em !important;
    }
    .tenant-yugen .membership-glow { background: radial-gradient(circle, rgba(245,243,239,0.07) 0%, transparent 70%) !important; }
    .tenant-yugen #stampsGrid { background: #0a0807 !important; border-color: rgba(245,243,239,0.08) !important; }
    .tenant-yugen .tier-badge { border-color: rgba(245,243,239,0.25) !important; color: #cdc8bf !important; }
    .tenant-yugen #stampsBar { background: #f5f3ef !important; }

    /* Sellos en marfil */
    .tenant-yugen .stamp-cell.filled {
      background: #f5f3ef !important;
      border: 1px solid #f5f3ef !important;
      box-shadow: 0 0 10px rgba(245,243,239,0.16) !important;
    }
    .tenant-yugen .stamp-cell.filled i { color: #0b0a09 !important; }
    .tenant-yugen .stamp-cell.empty {
      border: 1px solid rgba(245,243,239,0.12) !important;
      background: rgba(245,243,239,0.03) !important;
    }
    .tenant-yugen #stampsBar { box-shadow: none !important; }

    /* Sin glow dorado en clases globales */
    .tenant-yugen .text-gold   { text-shadow: none !important; }
    .tenant-yugen .border-gold { box-shadow: none !important; }
    .tenant-yugen .nav-tab.active .nav-icon { filter: none !important; }
    .tenant-yugen .premio-icon { color: rgba(245,243,239,0.7) !important; }

    /* Botones reagendar → marfil */
    .tenant-yugen .reagendar-proxima-btn {
      border-color: rgba(245,243,239,0.18) !important;
      background: rgba(245,243,239,0.04) !important;
    }
    .tenant-yugen .reagendar-hist-btn { color: rgba(245,243,239,0.55) !important; }
    .tenant-yugen .reagendar-hist-btn:hover { background: rgba(245,243,239,0.08) !important; }
    /* ══════════════════════════════════════════════════════════════════ */

    /* Service card image */
    .service-img {
      position: absolute;
      inset: 0;
      width: 100%;
      height: 100%;
      object-fit: cover;
      object-position: center top;
      transition: transform 0.4s ease;
    }
    .service-card:active .service-img { transform: scale(1.04); }

    /* Membership card — subtle diagonal lines watermark */
    .membership-pattern::before {
      content: '';
      position: absolute;
      inset: 0;
      background-image: repeating-linear-gradient(
        -45deg,
        transparent,
        transparent 18px,
        rgba(201,168,76,0.025) 18px,
        rgba(201,168,76,0.025) 19px
      );
      pointer-events: none;
      border-radius: inherit;
    }

    /* Tier badge */
    .tier-badge {
      font-size: 9px;
      font-weight: 800;
      letter-spacing: 0.1em;
      color: #888;
      border: 1px solid rgba(255,255,255,0.18);
      border-radius: 4px;
      padding: 2px 7px;
    }
    .tier-badge.silver { color: #aaa; border-color: rgba(180,180,180,0.3); }
    .tier-badge.gold   { color: var(--gold); border-color: var(--gold-dim); }
    .tier-badge.platinum { color: #e8d5ff; border-color: rgba(220,200,255,0.35); }

    /* ── D'JONES BARBER — Pirate & Vintage Theme ─────────────── */
    .tenant-lumen {
      --gold:      #D4AF37;
      --gold-dim:  rgba(212,175,55,0.35);
      --gold-glow: rgba(212,175,55,0.18);
      --accent:    #D4AF37;
      --accent-r:  212; --accent-g:  175; --accent-b:  55;
    }
    html.tenant-lumen body {
      background-color: #0d0a08 !important;
      background-image:
        linear-gradient(rgba(212,175,55,0.015) 1px, transparent 1px),
        linear-gradient(90deg, rgba(212,175,55,0.015) 1px, transparent 1px) !important;
      background-size: 24px 24px !important;
    }
    .tenant-lumen header {
      background-color: rgba(24,18,16,0.96) !important;
      border-bottom: 1px solid rgba(212,175,55,0.15) !important;
    }
    .tenant-lumen #authGuard { background: #0d0a08 !important; }

    /* Animations */
    @keyframes pirate-float {
      0%, 100% { transform: translateY(0px) rotate(0deg); }
      50% { transform: translateY(-5px) rotate(0.4deg); }
    }
    @keyframes doubloon-shimmer {
      0% { background-position: -200% 0; }
      100% { background-position: 200% 0; }
    }

    /* Hero */
    .tenant-lumen .hero-bg {
      background-image: url('/djones1.png');
      background-size: cover;
      background-position: center 30%;
    }
    .tenant-lumen .hero-overlay {
      background: radial-gradient(circle at 50% 30%, rgba(212,175,55,0.08) 0%, rgba(13,10,8,0.72) 45%, rgba(13,10,8,0.98) 100%) !important;
    }
    .tenant-lumen .hero-glow-spot {
      background: radial-gradient(circle, rgba(212,175,55,0.12) 0%, transparent 65%) !important;
    }

    /* Hero CTA — Gold Outline to Solid gold shimmer */
    .tenant-lumen .hero-cta {
      background: transparent !important;
      border: 2px solid #D4AF37 !important;
      color: #D4AF37 !important;
      box-shadow: 0 0 15px rgba(212,175,55,0.25) !important;
      backdrop-filter: none !important;
      font-family: 'Playfair Display', Georgia, serif !important;
      font-weight: 700 !important;
      transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1) !important;
    }
    .tenant-lumen .hero-cta:hover {
      background: linear-gradient(90deg, #8B6508, #D4AF37, #8B6508) !important;
      background-size: 200% 100% !important;
      animation: doubloon-shimmer 6s linear infinite !important;
      color: #0d0a08 !important;
      box-shadow: 0 0 25px rgba(212,175,55,0.5) !important;
      transform: scale(1.02) !important;
    }
    .tenant-lumen .hero-cta i    { color: inherit !important; }
    .tenant-lumen .hero-cta span { color: inherit !important; }

    /* Sellos */
    .tenant-lumen .stamp-cell.empty {
      background: rgba(24,18,16,0.65) !important;
      border: 1px solid rgba(212,175,55,0.15) !important;
      box-shadow: inset 0 0 8px rgba(0,0,0,0.6) !important;
    }
    .tenant-lumen .stamp-cell.filled {
      background: radial-gradient(circle, #f5ead6 0%, #D4AF37 40%, #8B6508 100%) !important;
      border: 2px double #D4AF37 !important;
      box-shadow:
        0 0 0 1px rgba(212,175,55,0.2),
        0 0 12px rgba(212,175,55,0.5),
        inset 0 1px 1px rgba(255,255,255,0.4) !important;
      animation: pirate-float 3s ease-in-out infinite !important;
    }
    .tenant-lumen .stamp-cell.filled i {
      color: #0d0a08 !important;
      filter: drop-shadow(0 1px 1px rgba(255,255,255,0.3)) !important;
    }
    .tenant-lumen #stampsBar {
      background: linear-gradient(90deg, #8B6508, #D4AF37, #8B6508) !important;
      background-size: 200% 100% !important;
      animation: doubloon-shimmer 6s linear infinite !important;
      box-shadow: 0 0 12px rgba(212,175,55,0.7), 0 0 20px rgba(212,175,55,0.3) !important;
    }

    /* Membership */
    .tenant-lumen .membership-pattern {
      background-color: #181210 !important;
      border: 2px double #D4AF37 !important;
      outline: 1px solid rgba(212,175,55,0.18) !important;
      outline-offset: 3px !important;
      box-shadow: 0 10px 30px rgba(0,0,0,0.6) !important;
    }
    .tenant-lumen .membership-pattern::before {
      background-image: repeating-linear-gradient(
        -45deg, transparent, transparent 18px,
        rgba(212,175,55,0.02) 18px, rgba(212,175,55,0.02) 19px
      ) !important;
    }
    .tenant-lumen .membership-glow {
      background: radial-gradient(circle, rgba(212,175,55,0.1) 0%, transparent 70%) !important;
    }
    .tenant-lumen #membershipWatermark {
      color: rgba(212,175,55,0.03) !important;
      font-size: 8rem !important;
      font-weight: 900 !important;
    }

    /* Nav activo */
    .tenant-lumen .nav-tab.active .nav-icon {
      color: #D4AF37 !important;
      filter: drop-shadow(0 0 6px rgba(212,175,55,0.5)) !important;
    }
    .tenant-lumen .nav-tab.active .nav-label { color: #D4AF37 !important; }

    /* Tier badges */
    .tenant-lumen .tier-badge.gold {
      color: #D4AF37 !important;
      border: 1px solid #D4AF37 !important;
      background: rgba(212,175,55,0.08) !important;
      text-shadow: 0 0 4px rgba(212,175,55,0.3) !important;
    }
    .tenant-lumen .tier-badge.platinum {
      color: #e5c158 !important;
      border: 1px solid rgba(212,175,55,0.4) !important;
      background: rgba(212,175,55,0.05) !important;
    }

    /* PWA */
    .tenant-lumen #pwaBigInstallCard {
      background: rgba(24,18,16,0.8) !important;
      border: 1px solid rgba(212,175,55,0.15) !important;
    }
    .tenant-lumen .pwa-icon-bg {
      background: rgba(212,175,55,0.08) !important;
      border-color: rgba(212,175,55,0.15) !important;
    }
    .tenant-lumen #pwaBanner {
      border-color: rgba(212,175,55,0.2) !important;
      background: rgba(24,18,16,0.96) !important;
    }
    .tenant-lumen .pwa-step-badge {
      background: #D4AF37 !important;
      color: #0d0a08 !important;
      font-weight: 800 !important;
    }

    /* Botones de acción */
    .tenant-lumen .btn-accion-primary,
    .tenant-lumen a.btn-reservar {
      background: transparent !important;
      border: 2.5px double #D4AF37 !important;
      color: #D4AF37 !important;
      box-shadow: 0 0 12px rgba(212,175,55,0.2) !important;
      font-family: 'Playfair Display', Georgia, serif !important;
      font-weight: 700 !important;
      letter-spacing: 0.05em !important;
      transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1) !important;
    }
    .tenant-lumen .btn-accion-primary:hover,
    .tenant-lumen a.btn-reservar:hover {
      background: linear-gradient(90deg, #8B6508, #D4AF37, #8B6508) !important;
      background-size: 200% 100% !important;
      animation: doubloon-shimmer 6s linear infinite !important;
      color: #0d0a08 !important;
      box-shadow: 0 0 22px rgba(212,175,55,0.45) !important;
      transform: scale(1.02) !important;
    }

    /* Tarjeta central de instalación PWA — oculta (redundante con banner flotante) */
    .tenant-lumen #pwaBigInstallCard { display: none !important; }

    /* Botón de chat — color primario dorado */
    .tenant-lumen #chatToggleBtn {
      background: linear-gradient(135deg, #8B6508 0%, #D4AF37 100%) !important;
      box-shadow: 0 4px 15px rgba(212,175,55,0.4) !important;
    }
    .tenant-lumen #chatToggleBtn svg path { fill: #0d0a08 !important; }

    /* Tipografía clásica — títulos en Playfair Display */
    .tenant-lumen h1,
    .tenant-lumen h2,
    .tenant-lumen h3,
    .tenant-lumen .shop-name,
    .tenant-lumen .membership-name {
      font-family: 'Playfair Display', Georgia, serif !important;
      letter-spacing: 0.02em !important;
      color: #f5ead6 !important;
    }
    /* ────────────────────────────────────────────────────────────── */

    /* ══ DEL NERO BARBER — Verde Neón / Negro Profundo / Crema Serif ══
       Paleta: Verde neón (#39ff14) · Negro (#050505) · Crema (#f0ead6)
       ═══════════════════════════════════════════════════════════════ */
    .tenant-delnero {
      --gold:      #39ff14;
      --gold-dim:  rgba(57,255,20,0.35);
      --gold-glow: rgba(57,255,20,0.18);
    }
    html.tenant-delnero body { background-color: #050505; }
    .tenant-delnero header { background-color: rgba(5,5,5,0.97) !important; }
    .tenant-delnero #authGuard { background: #050505 !important; }

    /* Hero: imagen del local con overlay oscuro fuerte */
    .tenant-delnero .hero-bg {
      background-image: url('/nero.jpg');
      background-size: cover;
      background-position: center 30%;
    }
    .tenant-delnero .hero-overlay {
      background: linear-gradient(160deg,
        rgba(0,0,0,0.70) 0%, rgba(0,0,0,0.55) 40%, rgba(0,0,0,0.94) 100%);
    }
    .tenant-delnero .hero-glow-spot {
      background: radial-gradient(circle, rgba(57,255,20,0.10) 0%, transparent 65%) !important;
    }
    /* Titular hero: serif crema, sin superposición de logo */
    .tenant-delnero #heroLine1 {
      font-family: 'Playfair Display', Georgia, serif !important;
      color: #f0ead6 !important;
      font-style: normal !important;
      text-shadow: 0 2px 20px rgba(0,0,0,0.7) !important;
    }
    .tenant-delnero #heroLine2 {
      font-family: 'Playfair Display', Georgia, serif !important;
      color: #39ff14 !important;
      font-style: normal !important;
      text-shadow: 0 0 20px rgba(57,255,20,0.40) !important;
    }
    /* Hero CTA: ghost outline verde neón */
    .tenant-delnero .hero-cta {
      background: transparent !important;
      border-color: #39ff14 !important;
      color: #39ff14 !important;
      box-shadow: 0 0 15px rgba(57,255,20,0.25) !important;
      backdrop-filter: none !important;
      -webkit-backdrop-filter: none !important;
    }
    .tenant-delnero .hero-cta i    { color: #39ff14 !important; }
    .tenant-delnero .hero-cta span { color: #39ff14 !important; }
    .tenant-delnero .hero-cta:hover { background: rgba(57,255,20,0.08) !important; }

    /* Tarjeta central PWA — oculta (usamos solo el banner flotante) */
    .tenant-delnero #pwaBigInstallCard { display: none !important; }

    /* ══ DEL NERO — Tarjeta VIP Pass ══════════════════════════════════ */

    /* Contenedor principal: gradiente profundo + sombra premium */
    .tenant-delnero .membership-pattern {
      background: linear-gradient(145deg, #0e0f0d 0%, #060706 60%, #050505 100%) !important;
      border-color: rgba(57,255,20,0.14) !important;
      box-shadow: 0 25px 50px rgba(0,0,0,0.85),
                  0 0 0 1px rgba(57,255,20,0.06),
                  inset 0 1px 0 rgba(57,255,20,0.04) !important;
    }

    /* Grid: sin fondo plano, gap más ajustado */
    .tenant-delnero #stampsGrid {
      background: transparent !important;
      border: none !important;
      padding: 0 !important;
      gap: 6px !important;
    }

    /* Sellos vacíos: ranura con profundidad (shadow-inner) */
    .tenant-delnero .stamp-cell.empty {
      background: #070708 !important;
      border: 1px solid rgba(57,255,20,0.10) !important;
      border-radius: 10px !important;
      box-shadow: inset 0 2px 8px rgba(0,0,0,0.85),
                  inset 0 1px 2px rgba(0,0,0,0.6) !important;
    }

    /* Sellos llenos: neón encendido */
    .tenant-delnero .stamp-cell.filled {
      background: rgba(57,255,20,0.07) !important;
      border: 2px solid #39ff14 !important;
      border-radius: 10px !important;
      box-shadow: 0 0 14px rgba(57,255,20,0.30),
                  0 0 5px  rgba(57,255,20,0.18),
                  inset 0 0 8px rgba(57,255,20,0.04) !important;
    }
    .tenant-delnero .stamp-cell.filled i {
      color: #39ff14 !important;
      animation: stamp-breathe 2.6s ease-in-out infinite;
    }

    /* Décimo sello vacío: gran premio con borde dashed */
    .tenant-delnero .stamp-cell.prize-empty {
      background: #080808 !important;
      border: 2px dashed rgba(57,255,20,0.35) !important;
      border-radius: 10px !important;
      box-shadow: inset 0 2px 8px rgba(0,0,0,0.8),
                  0 0 8px rgba(57,255,20,0.06) !important;
    }
    .tenant-delnero .stamp-cell.prize-filled {
      background: rgba(57,255,20,0.12) !important;
      border: 2px solid #39ff14 !important;
      border-radius: 10px !important;
      box-shadow: 0 0 22px rgba(57,255,20,0.50),
                  0 0 8px  rgba(57,255,20,0.30),
                  inset 0 0 12px rgba(57,255,20,0.06) !important;
    }
    .tenant-delnero .stamp-cell.prize-filled i {
      color: #39ff14 !important;
      animation: stamp-breathe 1.8s ease-in-out infinite;
    }

    /* Barra de progreso: neón más intenso */
    .tenant-delnero #stampsBar {
      background: linear-gradient(90deg, #1a8c00 0%, #39ff14 100%) !important;
      box-shadow: 0 0 12px rgba(57,255,20,0.65),
                  0 0 4px  rgba(57,255,20,0.40) !important;
    }
    /* ══════════════════════════════════════════════════════════════ */
    /* Membership card */
    .tenant-delnero .membership-pattern::before {
      background-image: repeating-linear-gradient(
        -45deg, transparent, transparent 18px,
        rgba(57,255,20,0.015) 18px, rgba(57,255,20,0.015) 19px
      );
    }
    .tenant-delnero .membership-glow {
      background: radial-gradient(circle, rgba(57,255,20,0.07) 0%, transparent 70%) !important;
    }
    .tenant-delnero #membershipWatermark { color: rgba(57,255,20,0.04) !important; }
    /* Tarjetas secundarias */
    .tenant-delnero #tabLoyalty .bg-\[#111115\],
    .tenant-delnero #tabProfile .bg-\[#111115\] {
      background-color: #0d0d0d !important;
      border-color: rgba(255,255,255,0.05) !important;
    }

    /* Nav activo: verde neón */
    .tenant-delnero .nav-tab.active .nav-icon {
      color: #39ff14;
      filter: drop-shadow(0 0 6px rgba(57,255,20,0.40));
    }
    .tenant-delnero .nav-tab.active .nav-label { color: #39ff14; }

    /* Tier badges */
    .tenant-delnero .tier-badge.gold     { color: #39ff14; border-color: rgba(57,255,20,0.35); }
    .tenant-delnero .tier-badge.platinum { color: #a3e635; border-color: rgba(57,255,20,0.30); }

    /* PWA */
    .tenant-delnero #pwaBanner { border-color: rgba(57,255,20,0.28) !important; }
    .tenant-delnero #pwaModalIOS > div { border-color: rgba(57,255,20,0.18) !important; }
    .tenant-delnero .pwa-step-badge { background: #39ff14 !important; color: #050505 !important; }

    /* Botón chat y notificaciones: verde neón */
    .tenant-delnero #chatToggleBtn {
      background: #39ff14 !important;
      box-shadow: 0 0 16px rgba(57,255,20,0.40) !important;
    }
    .tenant-delnero #chatToggleBtn svg path { fill: #050505 !important; }

    /* Botones de acción primarios */
    .tenant-delnero .btn-accion-primary,
    .tenant-delnero a.btn-reservar {
      background: transparent !important;
      border: 1.5px solid #39ff14 !important;
      color: #39ff14 !important;
      box-shadow: 0 0 12px rgba(57,255,20,0.20) !important;
    }


    /* ══ BARBERÍA FERRAZA (marcelo_hairdressing) ══
       Aesthetic: Premium Dark Minimalist (Deep Dark background, Pure White/Light Grey text & borders, transparent/glassy cards)
       ═══════════════════════════════════════════════════════════════ */
    .tenant-marcelo_hairdressing {
      --gold:      #ffffff;
      --gold-dim:  rgba(255,255,255,0.3);
      --gold-glow: rgba(255,255,255,0.1);
    }
    html.tenant-marcelo_hairdressing body { background-color: #0F0F0F; }
    .tenant-marcelo_hairdressing header { background-color: rgba(15,15,15,0.97) !important; border-bottom: 1px solid rgba(255,255,255,0.06) !important; }
    .tenant-marcelo_hairdressing #authGuard { background: #0F0F0F !important; }

    /* Hero: photo background with dark fade */
    .tenant-marcelo_hairdressing .hero-bg {
      background-image: url('/marcelo.png') !important;
      background-size: cover !important;
      background-position: center 20% !important;
    }
    .tenant-marcelo_hairdressing .hero-overlay {
      background: linear-gradient(180deg, rgba(15,15,15,0.28) 0%, rgba(15,15,15,0.60) 55%, #0F0F0F 100%) !important;
    }
    .tenant-marcelo_hairdressing .hero-glow-spot {
      background: none !important;
    }
    /* Titular hero */
    .tenant-marcelo_hairdressing #heroLine1 {
      font-family: inherit !important;
      color: #ffffff !important;
      font-style: normal !important;
      text-shadow: none !important;
    }
    .tenant-marcelo_hairdressing #heroLine2 {
      font-family: inherit !important;
      color: #ffffff !important;
      font-style: normal !important;
      text-shadow: none !important;
    }
    /* Hero CTA */
    .tenant-marcelo_hairdressing .hero-cta {
      background: transparent !important;
      border: 1px solid #ffffff !important;
      color: #ffffff !important;
      box-shadow: none !important;
      backdrop-filter: none !important;
      -webkit-backdrop-filter: none !important;
    }
    .tenant-marcelo_hairdressing .hero-cta i    { color: #ffffff !important; }
    .tenant-marcelo_hairdressing .hero-cta span { color: #ffffff !important; }
    .tenant-marcelo_hairdressing .hero-cta:hover { background: rgba(255,255,255,0.1) !important; }

    .tenant-marcelo_hairdressing #pwaBigInstallCard {
      background: linear-gradient(to right, rgba(255,255,255,0.05), rgba(255,255,255,0.02)) !important;
      border-color: rgba(255,255,255,0.12) !important;
      box-shadow: none !important;
    }
    .tenant-marcelo_hairdressing .pwa-icon-bg {
      background: rgba(255,255,255,0.06) !important;
      border-color: rgba(255,255,255,0.12) !important;
      box-shadow: none !important;
    }

    /* VIP Pass */
    .tenant-marcelo_hairdressing .membership-pattern {
      background: linear-gradient(145deg, #161616 0%, #0f0f0f 100%) !important;
      border: 1px solid rgba(255,255,255,0.1) !important;
      box-shadow: 0 20px 40px rgba(0,0,0,0.6), inset 0 1px 0 rgba(255,255,255,0.05) !important;
    }

    .tenant-marcelo_hairdressing #stampsGrid {
      background: transparent !important;
      border: none !important;
      padding: 0 !important;
      gap: 6px !important;
    }

    /* Sellos vacíos */
    .tenant-marcelo_hairdressing .stamp-cell.empty {
      background: rgba(255,255,255,0.02) !important;
      border: 1px solid rgba(255,255,255,0.08) !important;
      border-radius: 10px !important;
      box-shadow: none !important;
    }

    /* Sellos llenos */
    .tenant-marcelo_hairdressing .stamp-cell.filled {
      background: rgba(255,255,255,0.08) !important;
      border: 1.5px solid #ffffff !important;
      border-radius: 10px !important;
      box-shadow: 0 0 10px rgba(255,255,255,0.2) !important;
    }
    .tenant-marcelo_hairdressing .stamp-cell.filled i {
      color: #ffffff !important;
      animation: none !important;
    }

    /* Décimo sello vacío */
    .tenant-marcelo_hairdressing .stamp-cell.prize-empty {
      background: transparent !important;
      border: 1.5px dashed rgba(255,255,255,0.3) !important;
      border-radius: 10px !important;
      box-shadow: none !important;
    }
    .tenant-marcelo_hairdressing .stamp-cell.prize-filled {
      background: rgba(255,255,255,0.12) !important;
      border: 2px solid #ffffff !important;
      border-radius: 10px !important;
      box-shadow: 0 0 15px rgba(255,255,255,0.3) !important;
    }
    .tenant-marcelo_hairdressing .stamp-cell.prize-filled i {
      color: #ffffff !important;
      animation: none !important;
    }

    /* Barra de progreso */
    .tenant-marcelo_hairdressing #stampsBar {
      background: #ffffff !important;
      box-shadow: 0 0 10px rgba(255,255,255,0.3) !important;
    }

    /* Membership pattern and watermark */
    .tenant-marcelo_hairdressing .membership-pattern::before {
      background-image: repeating-linear-gradient(
        -45deg, transparent, transparent 18px,
        rgba(255,255,255,0.01) 18px, rgba(255,255,255,0.01) 19px
      ) !important;
    }
    .tenant-marcelo_hairdressing .membership-glow {
      background: radial-gradient(circle, rgba(255,255,255,0.02) 0%, transparent 70%) !important;
    }
    .tenant-marcelo_hairdressing #membershipWatermark {
      color: rgba(255,255,255,0.02) !important;
    }

    /* Tarjetas secundarias */
    .tenant-marcelo_hairdressing #tabLoyalty .bg-\[#111115\],
    .tenant-marcelo_hairdressing #tabProfile .bg-\[#111115\] {
      background-color: #161616 !important;
      border: 1px solid rgba(255,255,255,0.05) !important;
    }

    /* Nav activo */
    .tenant-marcelo_hairdressing .nav-tab.active .nav-icon {
      color: #ffffff;
      filter: drop-shadow(0 0 5px rgba(255,255,255,0.3));
    }
    .tenant-marcelo_hairdressing .nav-tab.active .nav-label {
      color: #ffffff;
    }

    /* Tier badges */
    .tenant-marcelo_hairdressing .tier-badge.gold {
      color: #ffffff;
      border-color: rgba(255,255,255,0.35);
    }
    .tenant-marcelo_hairdressing .tier-badge.platinum {
      color: #e4e4e7;
      border-color: rgba(255,255,255,0.25);
    }

    /* PWA */
    .tenant-marcelo_hairdressing #pwaBanner {
      border: 1px solid rgba(255,255,255,0.1) !important;
    }
    .tenant-marcelo_hairdressing #pwaModalIOS > div {
      border: 1px solid rgba(255,255,255,0.1) !important;
    }
    .tenant-marcelo_hairdressing .pwa-step-badge {
      background: #ffffff !important;
      color: #0f0f0f !important;
    }

    /* Botón chat y notificaciones */
    .tenant-marcelo_hairdressing #chatToggleBtn {
      background: #ffffff !important;
      box-shadow: 0 0 12px rgba(255,255,255,0.3) !important;
    }
    .tenant-marcelo_hairdressing #chatToggleBtn svg path {
      fill: #0f0f0f !important;
    }

    /* Botones de acción */
    .tenant-marcelo_hairdressing .btn-accion-primary,
    .tenant-marcelo_hairdressing a.btn-reservar {
      background: transparent !important;
      border: 1px solid #ffffff !important;
      color: #ffffff !important;
      box-shadow: none !important;
      transition: all 0.3s ease !important;
    }
    /* ────────────────────────────────────────────────────────────── */

    /* ══ AURA SALON & MALE GROOMING — Light Mode ═══════════════════
       Paleta: Azul acero (#9CA3AF) · Navy (#00285E) · Blanco/Gris claro
       ═══════════════════════════════════════════════════════════════ */
    :is(.tenant-aura,.tenant-latincaribe) {
      --gold:      #00285E;
      --gold-dim:  rgba(0,40,94,0.08);
      --gold-glow: rgba(0,40,94,0.12);
    }
    html:is(.tenant-aura,.tenant-latincaribe) body { background-color: #F9FAFB; color: #18181B; }

    /* Header */
    :is(.tenant-aura,.tenant-latincaribe) header {
      background-color: rgba(249,250,251,0.97) !important;
      border-bottom: 1px solid #E4E4E7 !important;
    }
    :is(.tenant-aura,.tenant-latincaribe) #authGuard { background: #F9FAFB !important; }
    :is(.tenant-aura,.tenant-latincaribe) #shopHeaderName { color: #00285E !important; }
    :is(.tenant-aura,.tenant-latincaribe) #shopHeaderSub  { color: rgba(0,40,94,0.45) !important; }
    :is(.tenant-aura,.tenant-latincaribe) #btnNotifBell {
      background: #FFFFFF !important;
      border-color: #D4D4D8 !important;
    }
    :is(.tenant-aura,.tenant-latincaribe) #bellIcon { color: #52525B !important; }
    :is(.tenant-aura,.tenant-latincaribe) #avatarContainer {
      background: #FFFFFF !important;
      border-color: #D4D4D8 !important;
    }

    /* Hero */
    :is(.tenant-aura,.tenant-latincaribe) .hero-bg {
      background-image: url('/auralogin.png');
      background-color: #00285E;
      background-size: cover;
      background-position: center 30%;
    }
    :is(.tenant-aura,.tenant-latincaribe) .hero-overlay {
      background: linear-gradient(160deg,
        rgba(0,40,94,0.40) 0%, rgba(0,40,94,0.28) 40%, rgba(0,40,94,0.90) 100%);
    }
    :is(.tenant-aura,.tenant-latincaribe) .hero-glow-spot {
      background: radial-gradient(circle, rgba(156,163,175,0.18) 0%, transparent 65%) !important;
    }
    :is(.tenant-aura,.tenant-latincaribe) #heroLine1 {
      color: #ffffff !important;
      text-shadow: 0 2px 20px rgba(0,0,0,0.35) !important;
    }
    :is(.tenant-aura,.tenant-latincaribe) #heroLine2 {
      color: #9CA3AF !important;
      font-style: normal !important;
      text-shadow: none !important;
    }
    :is(.tenant-aura,.tenant-latincaribe) .hero-cta {
      background: #9CA3AF !important;
      border-color: #9CA3AF !important;
      color: #ffffff !important;
      box-shadow: 0 4px 20px rgba(156,163,175,0.40) !important;
      backdrop-filter: none !important;
      -webkit-backdrop-filter: none !important;
    }
    :is(.tenant-aura,.tenant-latincaribe) .hero-cta i    { color: #ffffff !important; }
    :is(.tenant-aura,.tenant-latincaribe) .hero-cta span { color: #ffffff !important; }
    :is(.tenant-aura,.tenant-latincaribe) .hero-cta:hover {
      background: #00285E !important;
      border-color: #00285E !important;
    }

    /* PWA Install Card */
    :is(.tenant-aura,.tenant-latincaribe) #pwaBigInstallCard {
      background: linear-gradient(to right, rgba(156,163,175,0.10), rgba(156,163,175,0.04)) !important;
      border: 1px solid rgba(156,163,175,0.25) !important;
      box-shadow: 0 1px 8px rgba(156,163,175,0.08) !important;
    }
    :is(.tenant-aura,.tenant-latincaribe) #pwaBigInstallCard h3 { color: #18181B !important; }
    :is(.tenant-aura,.tenant-latincaribe) #pwaBigInstallCard p  { color: #8E9399 !important; }
    :is(.tenant-aura,.tenant-latincaribe) .pwa-icon-bg {
      background: rgba(156,163,175,0.12) !important;
      border-color: rgba(156,163,175,0.28) !important;
      box-shadow: none !important;
    }
    :is(.tenant-aura,.tenant-latincaribe) #pwaBanner { border-color: rgba(156,163,175,0.28) !important; }
    :is(.tenant-aura,.tenant-latincaribe) #pwaModalIOS > div { border-color: rgba(156,163,175,0.18) !important; }
    :is(.tenant-aura,.tenant-latincaribe) .pwa-step-badge { background: #9CA3AF !important; }

    /* Membership card */
    :is(.tenant-aura,.tenant-latincaribe) .membership-pattern {
      background: #FFFFFF !important;
      border-color: #D4D4D8 !important;
      box-shadow: 0 1px 4px rgba(0,0,0,0.06) !important;
    }
    :is(.tenant-aura,.tenant-latincaribe) .membership-pattern::before {
      background-image: repeating-linear-gradient(
        -45deg, transparent, transparent 18px,
        rgba(156,163,175,0.04) 18px, rgba(156,163,175,0.04) 19px
      );
    }
    :is(.tenant-aura,.tenant-latincaribe) .membership-glow {
      background: radial-gradient(circle, rgba(156,163,175,0.08) 0%, transparent 70%) !important;
    }
    :is(.tenant-aura,.tenant-latincaribe) #membershipWatermark { color: rgba(156,163,175,0.07) !important; }
    :is(.tenant-aura,.tenant-latincaribe) #shopClubName { color: #00285E !important; }
    :is(.tenant-aura,.tenant-latincaribe) #membershipDesc { color: #8E9399 !important; }

    /* Stamps grid */
    :is(.tenant-aura,.tenant-latincaribe) #stampsGrid {
      background: #EFF4F8 !important;
      border-color: #D4D4D8 !important;
    }
    :is(.tenant-aura,.tenant-latincaribe) .stamp-cell.empty {
      border: 1px solid #D4D4D8 !important;
      background: #FFFFFF !important;
    }
    :is(.tenant-aura,.tenant-latincaribe) .stamp-cell.filled {
      background: #9CA3AF !important;
      border: 1px solid #9CA3AF !important;
      box-shadow: 0 0 8px rgba(156,163,175,0.35) !important;
    }
    :is(.tenant-aura,.tenant-latincaribe) .stamp-cell.filled i { color: #ffffff !important; }
    :is(.tenant-aura,.tenant-latincaribe) #stampsBar {
      background: #9CA3AF !important;
      box-shadow: none !important;
    }

    /* Cards secundarias */
    :is(.tenant-aura,.tenant-latincaribe) #tabLoyalty .bg-\[#111115\],
    :is(.tenant-aura,.tenant-latincaribe) #tabProfile .bg-\[#111115\] {
      background-color: #FFFFFF !important;
      border-color: #D4D4D8 !important;
    }
    :is(.tenant-aura,.tenant-latincaribe) .border-white\/8 { border-color: #D4D4D8 !important; }
    :is(.tenant-aura,.tenant-latincaribe) .border-white\/12 { border-color: #D4D4D8 !important; }

    /* Hardcoded dark backgrounds */
    :is(.tenant-aura,.tenant-latincaribe) .bg-\[#111115\],
    :is(.tenant-aura,.tenant-latincaribe) .bg-\[#0a0a0e\],
    :is(.tenant-aura,.tenant-latincaribe) .bg-\[#1a1a1a\],
    :is(.tenant-aura,.tenant-latincaribe) .bg-\[#0d0d10\],
    :is(.tenant-aura,.tenant-latincaribe) .bg-\[#050505\] {
      background-color: #FFFFFF !important;
    }
    :is(.tenant-aura,.tenant-latincaribe) .bg-white\/5 { background-color: rgba(156,163,175,0.06) !important; }

    /* Generic text overrides */
    :is(.tenant-aura,.tenant-latincaribe) .text-white         { color: #18181B !important; }
    :is(.tenant-aura,.tenant-latincaribe) .text-white\/30     { color: rgba(24,24,27,0.40) !important; }
    :is(.tenant-aura,.tenant-latincaribe) .text-white\/60     { color: rgba(24,24,27,0.60) !important; }
    /* ── Variantes tenues que faltaban: invisibles sobre las cards claras de Aura.
       Se scopean a #tabProfile (Mi Perfil, todo claro) + #notifBanner, para NO
       afectar cards oscuras (hero, modal de Story con bg-black, etc.). ── */
    :is(.tenant-aura,.tenant-latincaribe) :is(#tabProfile,#notifBanner) .text-white\/20 { color: rgba(24,24,27,0.32) !important; }
    :is(.tenant-aura,.tenant-latincaribe) :is(#tabProfile,#notifBanner) .text-white\/40 { color: rgba(24,24,27,0.55) !important; }
    :is(.tenant-aura,.tenant-latincaribe) :is(#tabProfile,#notifBanner) .text-white\/50 { color: rgba(24,24,27,0.60) !important; }
    :is(.tenant-aura,.tenant-latincaribe) :is(#tabProfile,#notifBanner) .text-white\/55 { color: rgba(24,24,27,0.62) !important; }
    :is(.tenant-aura,.tenant-latincaribe) :is(#tabProfile,#notifBanner) .text-white\/70 { color: rgba(24,24,27,0.82) !important; }

    /* Onboarding de sellos (membership card) — usa estilos inline → !important */
    :is(.tenant-aura,.tenant-latincaribe) #sellosOnboarding { background: rgba(0,40,94,0.05) !important; border-color: rgba(0,40,94,0.12) !important; }
    :is(.tenant-aura,.tenant-latincaribe) #sellosOnboarding p { color: #52525B !important; }
    :is(.tenant-aura,.tenant-latincaribe) #sellosOnboarding #onboardingMeta { color: #18181B !important; }
    :is(.tenant-aura,.tenant-latincaribe) #sellosOnboarding i { color: #00285E !important; opacity: 0.7 !important; }

    /* Banner "Activa tus recordatorios" — card y CTA sobre fondo claro */
    :is(.tenant-aura,.tenant-latincaribe) #notifBanner { background: rgba(0,40,94,0.05) !important; border-color: rgba(0,40,94,0.12) !important; }
    :is(.tenant-aura,.tenant-latincaribe) #notifBannerActivar { background: #00285E !important; color: #FFFFFF !important; }
    :is(.tenant-aura,.tenant-latincaribe) .text-gray-300      { color: #6B7280 !important; }
    :is(.tenant-aura,.tenant-latincaribe) .text-gray-400      { color: #71717A !important; }
    :is(.tenant-aura,.tenant-latincaribe) .text-gray-500      { color: #8E9399 !important; }
    :is(.tenant-aura,.tenant-latincaribe) .text-gray-600      { color: #71717A !important; }
    :is(.tenant-aura,.tenant-latincaribe) .text-zinc-400      { color: #71717A !important; }
    :is(.tenant-aura,.tenant-latincaribe) .text-zinc-500      { color: #8E9399 !important; }
    :is(.tenant-aura,.tenant-latincaribe) .text-zinc-600      { color: #8E9399 !important; }

    /* "Conoce al equipo" button card */
    :is(.tenant-aura,.tenant-latincaribe) .bg-zinc-900\/80 { background: #FFFFFF !important; }
    :is(.tenant-aura,.tenant-latincaribe) .border-zinc-800 { border-color: #D4D4D8 !important; }
    :is(.tenant-aura,.tenant-latincaribe) .text-zinc-500   { color: #8E9399 !important; }

    /* Lookbook & Productos section titles */
    :is(.tenant-aura,.tenant-latincaribe) #tabLookbook h2,
    :is(.tenant-aura,.tenant-latincaribe) #tabProductos h2 { color: #00285E !important; }

    /* Bottom navigation */
    :is(.tenant-aura,.tenant-latincaribe) nav {
      background-color: rgba(249,250,251,0.97) !important;
      border-top-color: #E4E4E7 !important;
    }
    :is(.tenant-aura,.tenant-latincaribe) .nav-tab .nav-icon  { color: #A1A1AA !important; filter: none !important; }
    :is(.tenant-aura,.tenant-latincaribe) .nav-tab .nav-label { color: #A1A1AA !important; }
    :is(.tenant-aura,.tenant-latincaribe) .nav-tab.active .nav-icon {
      color: #00285E !important;
      filter: none !important;
    }
    :is(.tenant-aura,.tenant-latincaribe) .nav-tab.active .nav-label { color: #00285E !important; }

    /* Tier badges */
    :is(.tenant-aura,.tenant-latincaribe) .tier-badge.gold     { color: #00285E; border-color: rgba(0,40,94,0.30); }
    :is(.tenant-aura,.tenant-latincaribe) .tier-badge.platinum { color: #00285E; border-color: rgba(0,40,94,0.28); }

    /* Botones de acción */
    :is(.tenant-aura,.tenant-latincaribe) .btn-accion-primary {
      background: linear-gradient(135deg, #00285E 0%, #1e3a8a 100%) !important;
      color: #FFFFFF !important;
      box-shadow: 0 4px 18px rgba(0,40,94,0.22) !important;
      border: none !important;
    }
    :is(.tenant-aura,.tenant-latincaribe) a.btn-reservar {
      background: linear-gradient(135deg, #00285E 0%, #1e3a8a 100%) !important;
      color: #FFFFFF !important;
      box-shadow: 0 4px 18px rgba(0,40,94,0.22) !important;
    }

    /* Autofill en edición de perfil */
    :is(.tenant-aura,.tenant-latincaribe) input:-webkit-autofill,
    :is(.tenant-aura,.tenant-latincaribe) input:-webkit-autofill:focus {
      -webkit-box-shadow: 0 0 0 1000px #FFFFFF inset !important;
      -webkit-text-fill-color: #18181B !important;
    }
    /* Quitar glows de neón sobre fondo blanco */
    :is(.tenant-aura,.tenant-latincaribe) .text-gold  { text-shadow: none !important; }
    :is(.tenant-aura,.tenant-latincaribe) .border-gold { box-shadow: none !important; }
    /* border-neon (usado en avatar de perfil y otros) → sky blue */
    :is(.tenant-aura,.tenant-latincaribe) .border-neon {
      border-color: #9CA3AF !important;
      box-shadow: 0 0 0 3px rgba(156,163,175,0.12) !important;
    }
    /* Avatar de perfil */
    :is(.tenant-aura,.tenant-latincaribe) #profileAvatar {
      border-color: #9CA3AF !important;
      box-shadow: 0 0 0 3px rgba(156,163,175,0.12) !important;
    }
    /* Contador de sellos → navy prominente */
    :is(.tenant-aura,.tenant-latincaribe) #stampsCount { color: #00285E !important; }
    :is(.tenant-aura,.tenant-latincaribe) #stampsCount span { color: #8E9399 !important; }
    /* Heading "Tabla de Premios" (tiene inline style) */
    :is(.tenant-aura,.tenant-latincaribe) #premiosSection h3 { color: #8E9399 !important; }
    /* Hint text "Solo la verás tú" en sfNoPhoto (inline style blanco) */
    :is(.tenant-aura,.tenant-latincaribe) #sfNoPhoto p:last-child { color: rgba(24,24,27,0.30) !important; }
    /* Tipografía moderna para headings del dashboard */
    :is(.tenant-aura,.tenant-latincaribe) #shopClubName,
    :is(.tenant-aura,.tenant-latincaribe) #tabLookbook h2,
    :is(.tenant-aura,.tenant-latincaribe) #tabProductos h2 {
      font-family: 'Plus Jakarta Sans', sans-serif !important;
    }
    /* Progress track de la membership card (inline bg blanco invisible) */
    :is(.tenant-aura,.tenant-latincaribe) .membership-pattern .rounded-full.overflow-hidden.mb-3 {
      background: #D4D4D8 !important;
    }
    /* "Ver premios" — pastilla blanca con borde y texto navy (look claro de Aura) */
    :is(.tenant-aura,.tenant-latincaribe) button[onclick*="togglePremios"] {
      background: #FFFFFF !important;
      color: #00285E !important;
      border: 1.5px solid #00285E !important;
      box-shadow: 0 2px 8px rgba(0,40,94,0.12) !important;
    }
    /* Botones reagendar (CSS base hardcodeado en dorado) */
    :is(.tenant-aura,.tenant-latincaribe) .reagendar-proxima-btn {
      border-color: rgba(156,163,175,0.30) !important;
      background: rgba(156,163,175,0.06) !important;
    }
    :is(.tenant-aura,.tenant-latincaribe) .reagendar-hist-btn { color: rgba(156,163,175,0.65) !important; }
    :is(.tenant-aura,.tenant-latincaribe) .reagendar-hist-btn:hover { background: rgba(156,163,175,0.08) !important; }
    /* Chip de estado próxima cita (generado por JS con inline gold) */
    :is(.tenant-aura,.tenant-latincaribe) .proxima-estado-chip {
      background: rgba(156,163,175,0.12) !important;
      color: #00285E !important;
    }
    /* ── Citas section: fondos oscuros ── */
    :is(.tenant-aura,.tenant-latincaribe) .bg-zinc-900 {
      background-color: #FFFFFF !important;
    }
    /* Próxima cita card — gradiente dorado inline → gris suave */
    :is(.tenant-aura,.tenant-latincaribe) #profileCitasContent [style*="linear-gradient(135deg,rgba(201,168,76"] {
      background: linear-gradient(135deg, rgba(156,163,175,0.08), rgba(156,163,175,0.03)) !important;
      border-color: rgba(156,163,175,0.30) !important;
    }
    /* Textos "var(--gold)" generados por JS en la sección de citas */
    :is(.tenant-aura,.tenant-latincaribe) #profileCitasContent [style*="color:var(--gold)"] {
      color: #9CA3AF !important;
    }
    /* Icono de estado completada inline */
    :is(.tenant-aura,.tenant-latincaribe) #profileCitasContent i[style*="color:var(--gold)"] {
      color: #9CA3AF !important;
    }
    /* Badge estado Completada (inline gold-glow + gold) */
    :is(.tenant-aura,.tenant-latincaribe) .cita-estado-completada[style] {
      background: rgba(156,163,175,0.10) !important;
      color: #9CA3AF !important;
    }
    /* Cross-selling banner fondo oscuro inline */
    :is(.tenant-aura,.tenant-latincaribe) #profileCitasContent [style*="linear-gradient(to right,#111115"] {
      background: rgba(156,163,175,0.05) !important;
      border-color: rgba(156,163,175,0.22) !important;
    }
    :is(.tenant-aura,.tenant-latincaribe) #profileCitasContent [style*="color:rgba(212,175,55"] {
      color: #9CA3AF !important;
    }
    :is(.tenant-aura,.tenant-latincaribe) #profileCitasContent button[style*="background:#D4AF37"] {
      background: #9CA3AF !important;
      color: #ffffff !important;
    }
    /* Dark-navy cards: restore white text overridden by the global .text-white rule */
    :is(.tenant-aura,.tenant-latincaribe) #auraMembresiaPromoCard .text-white,
    :is(.tenant-aura,.tenant-latincaribe) #heroProximaCitaCard .text-white {
      color: #FFFFFF !important;
    }
    /* ────────────────────────────────────────────────────────────── */

    /* ══ AURA — Animaciones Premium ════════════════════════════════

       1. Ken Burns  — hero bg zoom lento 14s
       2. Shimmer    — destello tipo tarjeta física en membership card
       3. Pulse ring — CTA button latido sutil cada 2.2s
       4. Stagger    — secciones principales entran escalonadas post-auth
       5. Counter-up — contador de sellos sube de 0 → N con easing

       ══════════════════════════════════════════════════════════════ */

    /* 1. Ken Burns ─────────────────────────────────────────────── */
    @keyframes aura-ken-burns {
      from { transform: scale(1.00) translate(0, 0); }
      to   { transform: scale(1.07) translate(-0.8%, 0.5%); }
    }
    /* Quitamos bg-image del elemento y lo movemos al ::before animable */
    :is(.tenant-aura,.tenant-latincaribe) .hero-bg { background-image: none !important; }
    :is(.tenant-aura,.tenant-latincaribe) .hero-bg::before {
      content: '';
      position: absolute;
      inset: 0;
      background-image: url('/auralogin.png');
      background-size: cover;
      background-position: center 30%;
      transform-origin: center center;
      animation: aura-ken-burns 14s ease-in-out infinite alternate;
      z-index: 1;
    }

    /* 2. Shimmer en membership card ────────────────────────────── */
    @keyframes aura-shimmer {
      0%   { transform: translateX(-130%) skewX(-12deg); }
      100% { transform: translateX(230%) skewX(-12deg); }
    }
    :is(.tenant-aura,.tenant-latincaribe) .membership-pattern::after {
      content: '';
      position: absolute;
      top: -10%;
      left: 0;
      width: 45%;
      height: 120%;
      background: linear-gradient(
        90deg,
        transparent 0%,
        rgba(255,255,255,0.22) 50%,
        transparent 100%
      );
      animation: aura-shimmer 5.5s ease-in-out 2s infinite;
      pointer-events: none;
    }

    /* 3. Pulse ring en CTA del hero ────────────────────────────── */
    @keyframes aura-pulse-ring {
      0%   { transform: scale(1);    opacity: 0.55; }
      100% { transform: scale(1.32); opacity: 0; }
    }
    :is(.tenant-aura,.tenant-latincaribe) .hero-cta { position: relative; }
    :is(.tenant-aura,.tenant-latincaribe) .hero-cta::before {
      content: '';
      position: absolute;
      inset: -5px;
      border-radius: inherit;
      border: 2px solid rgba(156,163,175,0.60);
      animation: aura-pulse-ring 2.2s ease-out 1.5s infinite;
      pointer-events: none;
    }

    /* 4. Stagger entrance ──────────────────────────────────────── */
    @keyframes aura-fade-up {
      from { opacity: 0; transform: translateY(20px); }
      to   { opacity: 1; transform: translateY(0); }
    }
    /* Ocultamos inicialmente solo en Aura */
    :is(.tenant-aura,.tenant-latincaribe) [data-aura-stagger] { opacity: 0; }
    /* Clases aplicadas por JS post-auth */
    .aura-animate { animation: aura-fade-up 0.6s cubic-bezier(0.16,1,0.3,1) forwards; }
    .aura-d0 { animation-delay: 0.00s; }
    .aura-d1 { animation-delay: 0.10s; }
    .aura-d2 { animation-delay: 0.20s; }
    .aura-d3 { animation-delay: 0.32s; }
    .aura-d4 { animation-delay: 0.44s; }
    /* ══════════════════════════════════════════════════════════════ */

    @keyframes stampPop {
      0%   { transform: scale(0.5); opacity: 0; }
      70%  { transform: scale(1.15); }
      100% { transform: scale(1); opacity: 1; }
    }
    @keyframes stamp-breathe {
      0%, 100% { transform: scale(1);    filter: drop-shadow(0 0 3px rgba(57,255,20,0.55)); }
      50%       { transform: scale(1.20); filter: drop-shadow(0 0 9px rgba(57,255,20,1.00)); }
    }
    @keyframes fadeIn {
      from { opacity: 0; }
      to   { opacity: 1; }
    }
    @keyframes fadeSlideUp {
      from { opacity: 0; transform: translateY(14px); }
      to   { opacity: 1; transform: translateY(0); }
    }
    #premiosSection {
      transition: max-height 0.4s cubic-bezier(0.16, 1, 0.3, 1), opacity 0.3s ease, transform 0.4s cubic-bezier(0.16, 1, 0.3, 1);
      max-height: 0;
      opacity: 0;
      transform: translateY(-10px);
      overflow: hidden;
    }
    #premiosSection.visible {
      max-height: 1000px;
      opacity: 1;
      transform: translateY(0);
    }
    #editEmail:-webkit-autofill:-webkit-autofill,
    #editEmail:-webkit-autofill:hover,
    #editEmail:-webkit-autofill:focus {
      -webkit-box-shadow: 0 0 0 1000px #0a0a0a inset !important;
      -webkit-text-fill-color: #6b7280 !important;
    }

    /* ═══════════════════════════════════════════════════════════════
       AURA SALÓN & MALE GROOMING - DASHBOARD
       Paleta: Urbano-Industrial Light Mode (Cultura Deportiva)
       ═══════════════════════════════════════════════════════════════ */
    :is(.tenant-aura,.tenant-latincaribe) {
      --gold: #00285E;
      --gold-dim: rgba(0,40,94,0.08);
      --gold-glow: rgba(0,40,94,0.12);
    }
    :is(.tenant-aura,.tenant-latincaribe) body {
      background-color: #F9FAFB !important;
      color: #18181B !important;
    }
    
    /* Global Overrides de utilidades oscuras */
    :is(.tenant-aura,.tenant-latincaribe) .text-white { color: #18181B !important; }
    :is(.tenant-aura,.tenant-latincaribe) .text-gray-500 { color: #8E9399 !important; }
    :is(.tenant-aura,.tenant-latincaribe) .text-gray-400 { color: #52525B !important; }
    :is(.tenant-aura,.tenant-latincaribe) .text-gray-300 { color: #3F3F46 !important; }
    :is(.tenant-aura,.tenant-latincaribe) .bg-\[\#111115\] { background-color: #FFFFFF !important; }
    :is(.tenant-aura,.tenant-latincaribe) .bg-\[\#050505\] { background-color: #F9FAFB !important; }
    :is(.tenant-aura,.tenant-latincaribe) .bg-\[\#0a0a0d\] { background-color: #FFFFFF !important; }
    :is(.tenant-aura,.tenant-latincaribe) .bg-\[\#1a1a1f\] { background-color: #F4F4F5 !important; }
    :is(.tenant-aura,.tenant-latincaribe) .bg-zinc-900 { background-color: #F4F4F5 !important; }
    :is(.tenant-aura,.tenant-latincaribe) .bg-white\/5 { background-color: rgba(156,163,175,0.06) !important; }
    :is(.tenant-aura,.tenant-latincaribe) .border-white\/8,
    :is(.tenant-aura,.tenant-latincaribe) .border-white\/10,
    :is(.tenant-aura,.tenant-latincaribe) .border-white\/6,
    :is(.tenant-aura,.tenant-latincaribe) .border-zinc-800,
    :is(.tenant-aura,.tenant-latincaribe) .border-zinc-800\/80 { border-color: #D4D4D8 !important; }
    
    /* Auth Guard */
    :is(.tenant-aura,.tenant-latincaribe) #authGuard { background-color: #F9FAFB !important; }
    :is(.tenant-aura,.tenant-latincaribe) #authGuard .border-t-white { border-top-color: #9CA3AF !important; }
    :is(.tenant-aura,.tenant-latincaribe) #authGuard .border-white\/20 { border-color: rgba(156,163,175,0.2) !important; }
    
    /* Header */
    :is(.tenant-aura,.tenant-latincaribe) header {
      background-color: rgba(249, 250, 251, 0.96) !important;
      border-bottom: 1px solid #E4E4E7;
    }
    :is(.tenant-aura,.tenant-latincaribe) #shopHeaderName { color: #18181B !important; }
    :is(.tenant-aura,.tenant-latincaribe) #shopHeaderSub { color: #8E9399 !important; }
    :is(.tenant-aura,.tenant-latincaribe) #btnNotifBell, :is(.tenant-aura,.tenant-latincaribe) #avatarContainer {
      background-color: #FFFFFF !important;
      border-color: #D4D4D8 !important;
    }
    :is(.tenant-aura,.tenant-latincaribe) #btnNotifBell i, :is(.tenant-aura,.tenant-latincaribe) #avatarContainer i { color: #8E9399 !important; }
    
    /* Hero Section - Forzar overlay y colores sobre la imagen */
    :is(.tenant-aura,.tenant-latincaribe) .hero-bg {
      background-image: url('auralogin.png') !important;
    }
    :is(.tenant-aura,.tenant-latincaribe) .hero-overlay {
      background: linear-gradient(to top, #00285E 0%, rgba(0,40,94,0.4) 100%) !important;
    }
    :is(.tenant-aura,.tenant-latincaribe) .hero-glow-spot {
      background: radial-gradient(circle, rgba(156,163,175,0.25) 0%, transparent 65%) !important;
    }
    :is(.tenant-aura,.tenant-latincaribe) #heroLine1 { color: #FFFFFF !important; text-shadow: none !important; }
    :is(.tenant-aura,.tenant-latincaribe) #heroLine2 { color: rgba(255,255,255,0.72) !important; text-shadow: none !important; }
    :is(.tenant-aura,.tenant-latincaribe) .hero-cta {
      background: #FFFFFF !important;
      border: 1px solid rgba(255,255,255,0.85) !important;
      color: #00285E !important;
      box-shadow: 0 4px 20px rgba(0,0,0,0.18) !important;
    }
    :is(.tenant-aura,.tenant-latincaribe) .hero-cta i { color: #00285E !important; }
    :is(.tenant-aura,.tenant-latincaribe) .hero-cta span { color: #00285E !important; }
    
    /* Instalar App Banner */
    :is(.tenant-aura,.tenant-latincaribe) #pwaBigInstallCard {
      background: #FFFFFF !important;
      border-color: #D4D4D8 !important;
      box-shadow: 0 4px 12px rgba(0,0,0,0.03) !important;
    }
    :is(.tenant-aura,.tenant-latincaribe) .pwa-icon-bg {
      background: rgba(156,163,175,0.1) !important;
      border-color: rgba(156,163,175,0.2) !important;
    }
    :is(.tenant-aura,.tenant-latincaribe) #pwaBigInstallCard h3 { color: #18181B !important; }
    :is(.tenant-aura,.tenant-latincaribe) #pwaBigInstallCard p { color: #8E9399 !important; }
    :is(.tenant-aura,.tenant-latincaribe) #pwaBigInstallCard i.ph-caret-right { color: #9CA3AF !important; }
    
    /* Membership Card */
    :is(.tenant-aura,.tenant-latincaribe) .membership-pattern { background-color: #FFFFFF !important; border-color: #D4D4D8 !important; }
    :is(.tenant-aura,.tenant-latincaribe) .membership-glow { background: radial-gradient(circle, rgba(156,163,175,0.15) 0%, transparent 70%) !important; }
    :is(.tenant-aura,.tenant-latincaribe) #membershipWatermark { color: rgba(156,163,175,0.06) !important; }
    :is(.tenant-aura,.tenant-latincaribe) #stampsCount { color: #18181B !important; }
    :is(.tenant-aura,.tenant-latincaribe) #stampsCount span { color: #8E9399 !important; }
    :is(.tenant-aura,.tenant-latincaribe) #shopClubName { color: #18181B !important; }
    :is(.tenant-aura,.tenant-latincaribe) #nextRewardName { color: #18181B !important; }
    
    /* Stamps Grid */
    :is(.tenant-aura,.tenant-latincaribe) #stampsGrid { background-color: #F4F4F5 !important; border-color: #E4E4E7 !important; }
    :is(.tenant-aura,.tenant-latincaribe) .stamp-cell { background: #FFFFFF !important; border-color: #D4D4D8 !important; }
    :is(.tenant-aura,.tenant-latincaribe) .stamp-cell.prize-filled {
      background: rgba(156,163,175,0.1) !important;
      border-color: #9CA3AF !important;
      box-shadow: none !important;
    }
    :is(.tenant-aura,.tenant-latincaribe) .stamp-cell.prize-filled i { color: #00285E !important; filter: none !important; }
    :is(.tenant-aura,.tenant-latincaribe) #stampsBar { background: linear-gradient(90deg, #00285E, #1e3a8a) !important; box-shadow: none !important; }

    /* Próximo Premio */
    :is(.tenant-aura,.tenant-latincaribe) .premio-icon { color: #00285E !important; }
    :is(.tenant-aura,.tenant-latincaribe) #nextRewardText { color: #18181B !important; }
    :is(.tenant-aura,.tenant-latincaribe) button[onclick="togglePremios()"] { background: #FFFFFF !important; color: #00285E !important; border: 1.5px solid #00285E !important; }

    /* Fix Aura: la copa del Próximo Premio debe verse sobre la card clara */
    :is(.tenant-aura,.tenant-latincaribe) .next-reward-card > .rounded-full {
      background: rgba(0,40,94,0.06) !important;
      border-color: rgba(0,40,94,0.15) !important;
    }
    :is(.tenant-aura,.tenant-latincaribe) .next-reward-card .premio-icon { color: #C8A24B !important; }

    /* Fix Aura: la tarjeta de reseña Google tiene fondo oscuro propio,
       su título no debe heredar el negro genérico de .text-white */
    :is(.tenant-aura,.tenant-latincaribe) #googleReviewCard .text-white { color: #FFFFFF !important; }
    
    /* Perfil Visitas */
    :is(.tenant-aura,.tenant-latincaribe) #perfilVisitasCard { background-color: #FFFFFF !important; border-color: #D4D4D8 !important; }
    :is(.tenant-aura,.tenant-latincaribe) #perfilServicio, :is(.tenant-aura,.tenant-latincaribe) #perfilBarbero { color: #18181B !important; }
    :is(.tenant-aura,.tenant-latincaribe) .h-px.bg-white\\/5 { background-color: #E4E4E7 !important; }
    
    /* Servicios Destacados */
    :is(.tenant-aura,.tenant-latincaribe) .service-card {
      background: #FFFFFF !important;
      border: 1px solid #E4E4E7 !important;
      box-shadow: 0 2px 10px rgba(0,40,94,0.06) !important;
    }
    :is(.tenant-aura,.tenant-latincaribe) .service-card:hover {
      border-color: rgba(0,40,94,0.25) !important;
      box-shadow: 0 6px 18px rgba(0,40,94,0.10) !important;
    }
    /* El overlay oscuro (pensado para tema dark) embarra la tarjeta blanca:
       lo reemplazamos por un velo claro de abajo hacia arriba para que el
       texto navy se lea nítido sobre cualquier imagen. */
    :is(.tenant-aura,.tenant-latincaribe) .service-card div[style*="linear-gradient(to top"] {
      background: linear-gradient(to top, #FFFFFF 0%, rgba(255,255,255,0.92) 38%, rgba(255,255,255,0.55) 62%, rgba(255,255,255,0) 100%) !important;
    }
    :is(.tenant-aura,.tenant-latincaribe) .service-card img { opacity: 1 !important; }
    :is(.tenant-aura,.tenant-latincaribe) .service-card [style*="color:var(--gold)"] { color: #00285E !important; }

    /* Productos Tab — product cards (Lightwork) */
    :is(.tenant-aura,.tenant-latincaribe) #productosGrid > div {
      background: #FFFFFF !important;
      border-color: #E4E4E7 !important;
      box-shadow: 0 2px 8px rgba(0,0,0,0.04) !important;
    }
    :is(.tenant-aura,.tenant-latincaribe) #productosGrid > div:hover {
      box-shadow: 0 4px 16px rgba(0,40,94,0.08) !important;
      border-color: rgba(0,40,94,0.2) !important;
    }
    /* Precio dorado → navy */
    :is(.tenant-aura,.tenant-latincaribe) #productosGrid [style*="color:#D4AF37"] { color: #00285E !important; }
    /* "Ver detalle" badge */
    :is(.tenant-aura,.tenant-latincaribe) #productosGrid .border-\[\#D4AF37\]\/60 {
      border-color: rgba(0,40,94,0.22) !important;
      color: #00285E !important;
    }
    :is(.tenant-aura,.tenant-latincaribe) #productosGrid .text-\[\#D4AF37\] { color: #00285E !important; }
    
    /* Conoce al equipo btn */
    :is(.tenant-aura,.tenant-latincaribe) button[onclick="abrirEquipoModal()"] {
      background: #FFFFFF !important;
      border-color: #D4D4D8 !important;
    }
    :is(.tenant-aura,.tenant-latincaribe) button[onclick="abrirEquipoModal()"] .text-white { color: #18181B !important; }
    
    /* Mi Perfil Tab */
    :is(.tenant-aura,.tenant-latincaribe) #profileAvatar {
      background: #FFFFFF !important;
      border-color: #9CA3AF !important;
      box-shadow: 0 4px 12px rgba(156,163,175,0.2) !important;
    }
    :is(.tenant-aura,.tenant-latincaribe) #profileName { color: #18181B !important; }
    :is(.tenant-aura,.tenant-latincaribe) #profileVisitsCount, :is(.tenant-aura,.tenant-latincaribe) #profileStamps { color: #18181B !important; }
    
    /* Edit Fields */
    :is(.tenant-aura,.tenant-latincaribe) input.w-full {
      background: #FFFFFF !important;
      border-color: #D4D4D8 !important;
      color: #18181B !important;
    }
    :is(.tenant-aura,.tenant-latincaribe) input.w-full::placeholder { color: #A1A1AA !important; }
    :is(.tenant-aura,.tenant-latincaribe) input.w-full:focus {
      border-color: #9CA3AF !important;
      box-shadow: 0 0 0 1px #9CA3AF !important;
    }
    :is(.tenant-aura,.tenant-latincaribe) input[type="date"] { color-scheme: light !important; }
    :is(.tenant-aura,.tenant-latincaribe) input#editEmail { background: #F4F4F5 !important; color: #52525B !important; }
    
    /* Autofill overrides */
    :is(.tenant-aura,.tenant-latincaribe) input:-webkit-autofill,
    :is(.tenant-aura,.tenant-latincaribe) input:-webkit-autofill:hover,
    :is(.tenant-aura,.tenant-latincaribe) input:-webkit-autofill:focus {
      -webkit-box-shadow: 0 0 0 100px #FFFFFF inset !important;
      -webkit-text-fill-color: #18181B !important;
      caret-color: #18181B !important;
    }
    
    /* Guardar / Logout / Eliminar */
    :is(.tenant-aura,.tenant-latincaribe) #btnGuardarPerfil {
      background: linear-gradient(135deg, #00285E 0%, #1e3a8a 100%) !important;
      color: #FFFFFF !important;
      border: none !important;
      border-radius: 14px !important;
      font-weight: 700 !important;
      font-size: 14px !important;
      padding: 14px 20px !important;
      box-shadow: 0 4px 18px rgba(0,40,94,0.2) !important;
      transition: all 0.3s ease !important;
    }
    :is(.tenant-aura,.tenant-latincaribe) #btnGuardarPerfil:hover {
      transform: translateY(-1px) !important;
      box-shadow: 0 6px 22px rgba(0,40,94,0.28) !important;
    }
    :is(.tenant-aura,.tenant-latincaribe) #btnGuardarPerfil i {
      color: #FFFFFF !important;
    }
    :is(.tenant-aura,.tenant-latincaribe) button[onclick="signOut()"] {
      background: #FFFFFF !important;
      border: 1px solid #D4D4D8 !important;
      color: #18181B !important;
      border-radius: 14px !important;
      font-weight: 700 !important;
      transition: all 0.2s ease !important;
      box-shadow: 0 2px 8px rgba(0,0,0,0.02) !important;
    }
    :is(.tenant-aura,.tenant-latincaribe) button[onclick="signOut()"]:hover {
      border-color: #00285E !important;
      color: #00285E !important;
      box-shadow: 0 4px 12px rgba(0,40,94,0.05) !important;
      transform: translateY(-1px) !important;
    }
    :is(.tenant-aura,.tenant-latincaribe) button[onclick="confirmDeleteAccount()"] {
      background: #FEF2F2 !important;
      border: 1px solid #FECACA !important;
      color: #DC2626 !important;
      border-radius: 14px !important;
      font-weight: 700 !important;
      transition: all 0.2s ease !important;
    }
    :is(.tenant-aura,.tenant-latincaribe) button[onclick="confirmDeleteAccount()"]:hover {
      background: #FEE2E2 !important;
      border-color: #FCA5A5 !important;
      transform: translateY(-1px) !important;
    }
    
    /* Bottom Nav */
    :is(.tenant-aura,.tenant-latincaribe) nav {
      background-color: rgba(255, 255, 255, 0.98) !important;
      border-top-color: #E4E4E7 !important;
    }
    :is(.tenant-aura,.tenant-latincaribe) .nav-tab .nav-icon, :is(.tenant-aura,.tenant-latincaribe) .nav-tab .nav-label { color: #8E9399 !important; }
    :is(.tenant-aura,.tenant-latincaribe) .nav-tab.active .nav-icon, :is(.tenant-aura,.tenant-latincaribe) .nav-tab.active .nav-label {
      color: #9CA3AF !important;
      filter: none !important;
    }
    
    /* FAB */
    :is(.tenant-aura,.tenant-latincaribe) a[aria-label="Agendar Hora"] {
      background: #9CA3AF !important;
      box-shadow: 0 4px 16px rgba(156,163,175,0.4) !important;
    }
    :is(.tenant-aura,.tenant-latincaribe) a[aria-label="Agendar Hora"] i { color: #FFFFFF !important; }
    
    /* Modals */
    :is(.tenant-aura,.tenant-latincaribe) #reagendarCitaModal > div,
    :is(.tenant-aura,.tenant-latincaribe) #cancelCitaModal > div,
    :is(.tenant-aura,.tenant-latincaribe) #deleteModal > div,
    :is(.tenant-aura,.tenant-latincaribe) #canjeModal > div {
      background-color: #FFFFFF !important;
      border-color: #D4D4D8 !important;
    }
    :is(.tenant-aura,.tenant-latincaribe) .bg-\\[\\#1a1a1f\\] { background-color: #F4F4F5 !important; border-color: #E4E4E7 !important; }
    :is(.tenant-aura,.tenant-latincaribe) #btnConfirmarReagendamiento,
    :is(.tenant-aura,.tenant-latincaribe) button[onclick="cerrarModalCanje()"] {
      background: #9CA3AF !important;
      color: #FFFFFF !important;
      box-shadow: none !important;
    }
    :is(.tenant-aura,.tenant-latincaribe) button[onclick="cerrarModalReagendar()"],
    :is(.tenant-aura,.tenant-latincaribe) button[onclick="cerrarModalCancelar()"],
    :is(.tenant-aura,.tenant-latincaribe) button[onclick="closeDeleteModal()"] {
      background: #FFFFFF !important;
      border-color: #D4D4D8 !important;
      color: #52525B !important;
    }
    
    /* Equipo Modal */
    :is(.tenant-aura,.tenant-latincaribe) #equipoModal > div:nth-child(2) {
      background-color: #FFFFFF !important;
      border-top-color: #D4D4D8 !important;
    }
    :is(.tenant-aura,.tenant-latincaribe) #equipoModal h3.text-white { color: #18181B !important; }
    :is(.tenant-aura,.tenant-latincaribe) #equipoModal .bg-white\\/15 { background-color: #D4D4D8 !important; }
    :is(.tenant-aura,.tenant-latincaribe) #equipoModal .border-white\\/6 { border-color: #E4E4E7 !important; }
    :is(.tenant-aura,.tenant-latincaribe) button[onclick="cerrarEquipoModal()"] { background: #F4F4F5 !important; border-color: #D4D4D8 !important; }
    :is(.tenant-aura,.tenant-latincaribe) button[onclick="cerrarEquipoModal()"] i { color: #18181B !important; }

    /* Canje modal — inline gold → sky blue */
    :is(.tenant-aura,.tenant-latincaribe) #canjeModal [style*="rgba(212,175,55"] {
      background: rgba(156,163,175,0.10) !important;
      border-color: rgba(156,163,175,0.30) !important;
    }
    :is(.tenant-aura,.tenant-latincaribe) #canjeModal [style*="color:#D4AF37"] { color: #00285E !important; }
    :is(.tenant-aura,.tenant-latincaribe) #canjeModal #canjeModalTitle { color: #18181B !important; }
    
    /* Cuadro de instrucciones de canje de premios (Aura) */
    :is(.tenant-aura,.tenant-latincaribe) #canjeModal .space-y-3 {
      background-color: #F4F4F5 !important;
      border: 1px solid #E4E4E7 !important;
    }
    :is(.tenant-aura,.tenant-latincaribe) #canjeModal .space-y-3 p {
      color: #18181B !important;
    }
    :is(.tenant-aura,.tenant-latincaribe) #canjeModal .space-y-3 i {
      color: #00285E !important;
    }
    
    /* Botón "Entendido" en modal de canje (Aura Navy Premium) */
    :is(.tenant-aura,.tenant-latincaribe) #canjeModal button[onclick="cerrarModalCanje()"] {
      background: linear-gradient(135deg, #00285E 0%, #1e3a8a 100%) !important;
      color: #FFFFFF !important;
      font-weight: 700 !important;
      box-shadow: 0 4px 14px rgba(0,40,94,0.2) !important;
    }

    /* Asegurar texto blanco de alto contraste en el Banner de Anuncio Navy */
    :is(.tenant-aura,.tenant-latincaribe) #heroBanner h3,
    :is(.tenant-aura,.tenant-latincaribe) #heroBanner span,
    :is(.tenant-aura,.tenant-latincaribe) #heroBanner p,
    :is(.tenant-aura,.tenant-latincaribe) #heroBanner i {
      color: #FFFFFF !important;
    }
    :is(.tenant-aura,.tenant-latincaribe) #heroBanner a {
      color: #001a40 !important;
    }
    :is(.tenant-aura,.tenant-latincaribe) #heroBanner a i {
      color: #001a40 !important;
    }

    /* Asegurar legibilidad extrema en la tarjeta de Próxima Cita (Aura) */
    :is(.tenant-aura,.tenant-latincaribe) #heroProximaCitaCard span {
      color: rgba(255, 255, 255, 0.95) !important;
    }
    :is(.tenant-aura,.tenant-latincaribe) #heroProximaCitaCard i {
      color: rgba(255, 255, 255, 0.8) !important;
    }
    /* Restaurar colores acentuados del diseño original para los estados e iconos */
    :is(.tenant-aura,.tenant-latincaribe) #heroProximaCitaCard .proxima-cita-chip {
      color: #86efac !important;
      background: rgba(34, 197, 94, 0.15) !important;
      border-color: rgba(34, 197, 94, 0.28) !important;
    }
    :is(.tenant-aura,.tenant-latincaribe) #heroProximaCitaCard .ph-calendar-check,
    :is(.tenant-aura,.tenant-latincaribe) #heroProximaCitaCard .ph-calendar-blank,
    :is(.tenant-aura,.tenant-latincaribe) #heroProximaCitaCard .ph-calendar-dots {
      color: #93c5fd !important;
    }
    :is(.tenant-aura,.tenant-latincaribe) #heroProximaCitaCard .ph-map-pin {
      color: #a7f3d0 !important;
    }
    :is(.tenant-aura,.tenant-latincaribe) #heroProximaCitaCard .ph-x-circle {
      color: #f87171 !important;
    }
    :is(.tenant-aura,.tenant-latincaribe) #heroProximaCitaCard button[onclick*="abrirModalCancelar"] span {
      color: #f87171 !important;
    }

    /* ── Aura: Premios + Legal ───────────────────────────────────── */

    /* Próximo Premio card */
    :is(.tenant-aura,.tenant-latincaribe) [data-aura-stagger].mx-4.mb-5.rounded-2xl {
      background: #FFFFFF !important;
      border-color: #D4D4D8 !important;
    }
    /* Trophy icon bg inside próximo premio */
    :is(.tenant-aura,.tenant-latincaribe) .mx-4.mb-5.rounded-2xl .rounded-full.bg-\[#1a1a1a\] {
      background: rgba(156,163,175,0.08) !important;
      border-color: rgba(156,163,175,0.20) !important;
    }

    /* premiosList rows (JS-generated, bg-[#111115]) */
    :is(.tenant-aura,.tenant-latincaribe) #premiosList > div {
      background: #FFFFFF !important;
      border-color: #D4D4D8 !important;
    }
    :is(.tenant-aura,.tenant-latincaribe) #premiosList > div:hover { border-color: rgba(156,163,175,0.40) !important; }
    /* Separador w-px bg-white/10 */
    :is(.tenant-aura,.tenant-latincaribe) #premiosList .w-px { background-color: #D4D4D8 !important; }
    /* Número de sellos */
    :is(.tenant-aura,.tenant-latincaribe) #premiosList span.text-white { color: #00285E !important; }
    /* "Sellos" label text-white/30 */
    :is(.tenant-aura,.tenant-latincaribe) #premiosList .text-white\/30 { color: #8E9399 !important; }
    /* Nombre premio */
    :is(.tenant-aura,.tenant-latincaribe) #premiosList p.text-white { color: #18181B !important; }
    /* Flecha text-white/20 */
    :is(.tenant-aura,.tenant-latincaribe) #premiosList .text-white\/20 { color: #D4D4D8 !important; }
    /* Spinner skeleton */
    :is(.tenant-aura,.tenant-latincaribe) #premiosSection .animate-spin {
      border-color: #D4D4D8 !important;
      border-top-color: #9CA3AF !important;
    }

    /* Legal heading */
    :is(.tenant-aura,.tenant-latincaribe) #tabProfile h3.text-white\/30 { color: #8E9399 !important; }
    /* Legal links */
    :is(.tenant-aura,.tenant-latincaribe) #tabProfile a[href="privacidad.html"] {
      background: #FFFFFF !important;
      border: 1px solid #E4E4E7 !important;
      border-radius: 16px !important;
      padding: 14px 20px !important;
      box-shadow: 0 2px 8px rgba(0,0,0,0.02) !important;
      transition: all 0.2s ease !important;
    }
    :is(.tenant-aura,.tenant-latincaribe) #tabProfile a[href="privacidad.html"]:hover {
      border-color: rgba(0,40,94,0.18) !important;
      box-shadow: 0 4px 14px rgba(0,40,94,0.05) !important;
      transform: translateY(-1px) !important;
    }
    :is(.tenant-aura,.tenant-latincaribe) #tabProfile a[href="privacidad.html"] span {
      color: #18181B !important;
      font-weight: 700 !important;
    }
    :is(.tenant-aura,.tenant-latincaribe) #tabProfile a[href="privacidad.html"] i.ph-fill {
      color: #00285E !important;
      font-size: 18px !important;
    }
    :is(.tenant-aura,.tenant-latincaribe) #tabProfile a[href="privacidad.html"] i.ph-bold {
      color: #9CA3AF !important;
    }

    /* Global missing utility overrides */
    :is(.tenant-aura,.tenant-latincaribe) .bg-white\/10  { background-color: rgba(156,163,175,0.08) !important; }
    :is(.tenant-aura,.tenant-latincaribe) .text-white\/20 { color: rgba(24,24,27,0.25) !important; }

    /* ── Aura: remaining dark artifact fixes ─────────────────────── */

    /* bg-gray-900 (productoModal) */
    :is(.tenant-aura,.tenant-latincaribe) .bg-gray-900 { background-color: #FFFFFF !important; }

    /* bg-[#0d0d10] (product cards, googleReviewModal content) */
    :is(.tenant-aura,.tenant-latincaribe) .bg-\[#0d0d10\] { background-color: #FFFFFF !important; }

    /* bg-gray-800 / bg-gray-700 (camera upload button) */
    :is(.tenant-aura,.tenant-latincaribe) .bg-gray-800 { background-color: #FFFFFF !important; }
    :is(.tenant-aura,.tenant-latincaribe) .bg-gray-700 { background-color: #F4F4F5 !important; }
    :is(.tenant-aura,.tenant-latincaribe) .border-gray-600 { border-color: #D4D4D8 !important; }
    :is(.tenant-aura,.tenant-latincaribe) .border-gray-700 { border-color: #D4D4D8 !important; }

    /* Profile — Rango stat card (inline dark gradient) */
    :is(.tenant-aura,.tenant-latincaribe) [style*="#18181b"] {
      background: #F4F4F5 !important;
    }

    /* Modal backdrops — bg-[#050505]/85 etc. are distinct Tailwind classes; target by ID */
    :is(.tenant-aura,.tenant-latincaribe) #reagendarCitaModal,
    :is(.tenant-aura,.tenant-latincaribe) #cancelCitaModal,
    :is(.tenant-aura,.tenant-latincaribe) #deleteModal,
    :is(.tenant-aura,.tenant-latincaribe) #canjeModal {
      background: rgba(0,40,94,0.45) !important;
      backdrop-filter: blur(6px) !important;
    }
    :is(.tenant-aura,.tenant-latincaribe) #equipoModal > div:first-child {
      background: rgba(0,40,94,0.45) !important;
    }

    /* Lookbook viewer */
    :is(.tenant-aura,.tenant-latincaribe) #lookbookViewer {
      background: rgba(0,40,94,0.88) !important;
    }

    /* Lookbook close button (bg-black/70) */
    :is(.tenant-aura,.tenant-latincaribe) #lookbookViewer > button {
      background: rgba(255,255,255,0.15) !important;
      color: #FFFFFF !important;
    }

    /* Cross-sell banner in history tab (JS inline dark gradient) */
    :is(.tenant-aura,.tenant-latincaribe) [style*="linear-gradient(to right,#111115"] {
      background: linear-gradient(to right, rgba(156,163,175,0.08), rgba(156,163,175,0.03)) !important;
      border-color: rgba(156,163,175,0.28) !important;
    }
    :is(.tenant-aura,.tenant-latincaribe) [style*="linear-gradient(to right,#111115"] p[style*="rgba(212,175,55"] {
      color: #9CA3AF !important;
    }
    :is(.tenant-aura,.tenant-latincaribe) [style*="linear-gradient(to right,#111115"] p.text-gray-300 { color: #52525B !important; }
    :is(.tenant-aura,.tenant-latincaribe) [style*="linear-gradient(to right,#111115"] button[style*="background:#D4AF37"] {
      background: #9CA3AF !important;
      color: #FFFFFF !important;
    }

    /* PWA Banner (inline style on element itself) */
    :is(.tenant-aura,.tenant-latincaribe) #pwaBanner {
      background: #FFFFFF !important;
      box-shadow: 0 4px 20px rgba(156,163,175,0.15) !important;
    }
    :is(.tenant-aura,.tenant-latincaribe) #pwaBanner p { color: #18181B !important; }
    :is(.tenant-aura,.tenant-latincaribe) #pwaBanner button[style*="rgba(255,255,255,0.05)"] {
      background: rgba(156,163,175,0.08) !important;
    }

    /* Chat toggle button */
    :is(.tenant-aura,.tenant-latincaribe) #chatToggleBtn { background: linear-gradient(135deg, #00285E 0%, #1e3a8a 100%) !important; }
    :is(.tenant-aura,.tenant-latincaribe) #chatToggleBtn svg { fill: #FFFFFF !important; }

    /* Chat popover */
    :is(.tenant-aura,.tenant-latincaribe) #chatPopover {
      background: #FFFFFF !important;
      border-color: #D4D4D8 !important;
    }
    :is(.tenant-aura,.tenant-latincaribe) #chatPopover [style*="background:#000"] {
      background: #F4F4F5 !important;
      border-color: #E4E4E7 !important;
    }
    :is(.tenant-aura,.tenant-latincaribe) #chatHeaderNombre { color: #18181B !important; }
    :is(.tenant-aura,.tenant-latincaribe) #chatMessages [style*="background:#1f2937"] {
      background: #EFF4F8 !important;
      color: #18181B !important;
    }
    :is(.tenant-aura,.tenant-latincaribe) #chatMessages [style*="background:#D4AF37"] {
      background: #9CA3AF !important;
      color: #FFFFFF !important;
    }
    :is(.tenant-aura,.tenant-latincaribe) #chatInput {
      background: #FFFFFF !important;
      border-color: #D4D4D8 !important;
      color: #18181B !important;
    }
    :is(.tenant-aura,.tenant-latincaribe) #chatInput::placeholder { color: #A1A1AA !important; }
    :is(.tenant-aura,.tenant-latincaribe) button[onclick="sendChatMessage()"] { background: linear-gradient(135deg, #00285E 0%, #1e3a8a 100%) !important; }
    :is(.tenant-aura,.tenant-latincaribe) button[onclick="sendChatMessage()"] svg { fill: #FFFFFF !important; }

    /* Producto modal */
    :is(.tenant-aura,.tenant-latincaribe) #productoModal { background: rgba(0,28,68,0.55) !important; }
    :is(.tenant-aura,.tenant-latincaribe) #productoModal > div {
      background: #FFFFFF !important;
      border: 1px solid #E4E4E7 !important;
      box-shadow: 0 24px 48px rgba(0,0,0,0.12) !important;
    }
    :is(.tenant-aura,.tenant-latincaribe) #productoModal button.bg-black\/60 {
      background: rgba(24,24,27,0.07) !important;
      border: 1px solid #E4E4E7 !important;
    }
    :is(.tenant-aura,.tenant-latincaribe) #productoModal button.bg-black\/60 i { color: #52525B !important; }
    :is(.tenant-aura,.tenant-latincaribe) #productoModalNombre { color: #18181B !important; }
    :is(.tenant-aura,.tenant-latincaribe) #productoModalDesc { color: #52525B !important; }
    :is(.tenant-aura,.tenant-latincaribe) #productoModalPrecio { color: #00285E !important; }
    /* Botón agregar al carrito en modal de producto */
    :is(.tenant-aura,.tenant-latincaribe) #productoModal .bg-\[\#D4AF37\],
    :is(.tenant-aura,.tenant-latincaribe) #productoModal [style*="background:#D4AF37"],
    :is(.tenant-aura,.tenant-latincaribe) #productoModal [style*="background: #D4AF37"] {
      background: linear-gradient(135deg, #00285E 0%, #1e3a8a 100%) !important;
      color: #FFFFFF !important;   /* el texto base era text-black → ilegible sobre navy */
      box-shadow: 0 4px 14px rgba(0,40,94,0.25) !important;
    }

    /* PWA iOS modal */
    :is(.tenant-aura,.tenant-latincaribe) #pwaModalIOS { background: rgba(0,40,94,0.50) !important; }
    :is(.tenant-aura,.tenant-latincaribe) #pwaModalIOS > div {
      background: #FFFFFF !important;
      border-color: rgba(156,163,175,0.25) !important;
    }
    :is(.tenant-aura,.tenant-latincaribe) #pwaModalIOS h3 { color: #18181B !important; }
    :is(.tenant-aura,.tenant-latincaribe) #pwaModalIOS p  { color: #52525B !important; }
    :is(.tenant-aura,.tenant-latincaribe) #pwaModalIOS strong { color: #18181B !important; }
    :is(.tenant-aura,.tenant-latincaribe) #pwaModalIOS [style*="rgba(255,255,255,0.05)"] {
      background: rgba(156,163,175,0.06) !important;
    }
    :is(.tenant-aura,.tenant-latincaribe) #pwaModalIOS > div > button {
      color: #8E9399 !important;
      border-color: #D4D4D8 !important;
    }

    /* Google Review modal */
    :is(.tenant-aura,.tenant-latincaribe) #googleReviewModal { background: rgba(0,40,94,0.50) !important; }
    :is(.tenant-aura,.tenant-latincaribe) #googleReviewModal > div {
      background: #FFFFFF !important;
      border-color: #D4D4D8 !important;
    }
    :is(.tenant-aura,.tenant-latincaribe) #googleReviewModal [style*="rgba(201,168,76"] { background: rgba(156,163,175,0.05) !important; }
    :is(.tenant-aura,.tenant-latincaribe) #googleReviewModal .text-white { color: #18181B !important; }
    :is(.tenant-aura,.tenant-latincaribe) #googleReviewModal p { color: #52525B !important; }

    /* ── AURA PROFILE TAB ("MI PERFIL") PREMIUM REDESIGN ── */
    
    /* Stats Cards: Rango, Visitas, Sellos en Mi Perfil */
    :is(.tenant-aura,.tenant-latincaribe) #tabProfile .flex-1.bg-zinc-900,
    :is(.tenant-aura,.tenant-latincaribe) #tabProfile [style*="#18181b"] {
      background: #FFFFFF !important;
      border: 1px solid #E4E4E7 !important;
      border-radius: 16px !important;
      box-shadow: 0 4px 14px rgba(0,40,94,0.03) !important;
      transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1) !important;
    }
    :is(.tenant-aura,.tenant-latincaribe) #tabProfile .flex-1.bg-zinc-900:hover,
    :is(.tenant-aura,.tenant-latincaribe) #tabProfile [style*="#18181b"]:hover {
      transform: translateY(-2px) !important;
      box-shadow: 0 8px 24px rgba(0,40,94,0.07) !important;
      border-color: rgba(0,40,94,0.18) !important;
    }
    :is(.tenant-aura,.tenant-latincaribe) #profileTierBadge {
      color: #00285E !important;
      font-weight: 900 !important;
    }
    :is(.tenant-aura,.tenant-latincaribe) #profileVisitsCount {
      color: #00285E !important;
      font-weight: 900 !important;
    }
    :is(.tenant-aura,.tenant-latincaribe) #profileStamps {
      color: #8E9399 !important;
      font-weight: 900 !important;
    }
    :is(.tenant-aura,.tenant-latincaribe) #tabProfile .text-zinc-500 {
      color: #9CA3AF !important;
      font-size: 8px !important;
      font-weight: 800 !important;
      letter-spacing: 0.12em !important;
    }
    
    /* Encabezados de Sección del Perfil (Mis Citas, Mi Cuenta, etc.) */
    :is(.tenant-aura,.tenant-latincaribe) #tabProfile h3 {
      color: #00285E !important;
      font-size: 11px !important;
      font-weight: 800 !important;
      letter-spacing: 0.15em !important;
      margin-top: 24px !important;
      margin-bottom: 14px !important;
      border-bottom: 2px solid rgba(0,40,94,0.08) !important;
      padding-bottom: 6px !important;
    }
    
    /* Inputs y Campos de Texto de Cuenta */
    :is(.tenant-aura,.tenant-latincaribe) #tabProfile label {
      color: #52525B !important;
      font-weight: 700 !important;
      font-size: 9px !important;
      letter-spacing: 0.08em !important;
    }
    :is(.tenant-aura,.tenant-latincaribe) #tabProfile input {
      background: #FFFFFF !important;
      border: 1px solid #D4D4D8 !important;
      border-radius: 12px !important;
      color: #18181B !important;
      padding: 12px 16px !important;
      font-size: 14px !important;
      transition: all 0.2s ease !important;
    }
    :is(.tenant-aura,.tenant-latincaribe) #tabProfile input:focus {
      border-color: #00285E !important;
      box-shadow: 0 0 0 3px rgba(0,40,94,0.08) !important;
    }
    :is(.tenant-aura,.tenant-latincaribe) #tabProfile input[readonly] {
      background: #F4F4F5 !important;
      color: #71717A !important;
      border-color: #E4E4E7 !important;
    }
    :is(.tenant-aura,.tenant-latincaribe) #nacimientoLockMsg {
      color: #9CA3AF !important;
      font-size: 10px !important;
      font-weight: 600 !important;
    }

    /* Tarjeta de Próxima Cita Activa en Mi Perfil (Gris → Navy Oscuro Premium) */
    :is(.tenant-aura,.tenant-latincaribe) #profileCitasContent [style*="linear-gradient(135deg,rgba(201,168,76"] {
      background: linear-gradient(150deg, #0a1628 0%, #0d1f3c 60%, #001433 100%) !important;
      border: 1px solid rgba(255,255,255,0.08) !important;
      border-radius: 24px !important;
      box-shadow: 0 16px 36px rgba(0,20,60,0.2) !important;
    }
    :is(.tenant-aura,.tenant-latincaribe) #profileCitasContent [style*="linear-gradient(135deg,rgba(201,168,76"] p[style*="color:var(--gold)"] {
      color: #93c5fd !important;
      font-weight: 800 !important;
    }
    :is(.tenant-aura,.tenant-latincaribe) #profileCitasContent [style*="linear-gradient(135deg,rgba(201,168,76"] .text-white {
      color: #FFFFFF !important;
    }
    :is(.tenant-aura,.tenant-latincaribe) #profileCitasContent [style*="linear-gradient(135deg,rgba(201,168,76"] p {
      color: rgba(255, 255, 255, 0.7) !important;
    }
    :is(.tenant-aura,.tenant-latincaribe) #profileCitasContent [style*="linear-gradient(135deg,rgba(201,168,76"] .text-sm {
      color: #FFFFFF !important;
      font-weight: 900 !important;
    }
    :is(.tenant-aura,.tenant-latincaribe) #profileCitasContent [style*="linear-gradient(135deg,rgba(201,168,76"] .proxima-estado-chip {
      background: rgba(34, 197, 94, 0.15) !important;
      color: #86efac !important;
      border: 1px solid rgba(34, 197, 94, 0.28) !important;
      border-radius: 100px !important;
      padding: 3px 10px !important;
      font-weight: 700 !important;
    }
    :is(.tenant-aura,.tenant-latincaribe) #profileCitasContent .reagendar-proxima-btn {
      background: rgba(255, 255, 255, 0.06) !important;
      border: 1px solid rgba(255, 255, 255, 0.1) !important;
      color: #93c5fd !important;
      border-radius: 12px !important;
    }
    :is(.tenant-aura,.tenant-latincaribe) #profileCitasContent .reagendar-proxima-btn:hover {
      background: rgba(255, 255, 255, 0.12) !important;
    }
    :is(.tenant-aura,.tenant-latincaribe) #profileCitasContent button[onclick*="abrirModalCancelar"] {
      background: rgba(239, 68, 68, 0.08) !important;
      border: 1px solid rgba(239, 68, 68, 0.2) !important;
      color: #f87171 !important;
      border-radius: 12px !important;
    }
    :is(.tenant-aura,.tenant-latincaribe) #profileCitasContent button[onclick*="abrirModalCancelar"]:hover {
      background: rgba(239, 68, 68, 0.15) !important;
    }

    /* Grid de Estadísticas de Citas (Total, Próximas, Completadas) */
    :is(.tenant-aura,.tenant-latincaribe) #profileCitasContent .grid-cols-3 > div {
      background: #FFFFFF !important;
      border: 1px solid #E4E4E7 !important;
      border-radius: 16px !important;
      box-shadow: 0 4px 12px rgba(0,40,94,0.03) !important;
      transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1) !important;
    }
    :is(.tenant-aura,.tenant-latincaribe) #profileCitasContent .grid-cols-3 > div:hover {
      transform: translateY(-2px) !important;
      box-shadow: 0 8px 20px rgba(0,40,94,0.06) !important;
      border-color: rgba(0,40,94,0.15) !important;
    }
    :is(.tenant-aura,.tenant-latincaribe) #profileCitasContent .grid-cols-3 p.text-2xl {
      color: #00285E !important;
      font-weight: 900 !important;
    }
    :is(.tenant-aura,.tenant-latincaribe) #profileCitasContent .grid-cols-3 p.text-\[9px\] {
      color: #9CA3AF !important;
      font-weight: 800 !important;
      font-size: 8px !important;
      letter-spacing: 0.1em !important;
    }

    /* Filas del Historial de Citas Pasadas */
    :is(.tenant-aura,.tenant-latincaribe) #profileCitasContent .space-y-2 > div {
      background: #FFFFFF !important;
      border: 1px solid #E4E4E7 !important;
      border-radius: 14px !important;
      box-shadow: 0 2px 8px rgba(0,0,0,0.02) !important;
      padding: 12px 16px !important;
      transition: all 0.2s ease !important;
    }
    :is(.tenant-aura,.tenant-latincaribe) #profileCitasContent .space-y-2 > div:hover {
      border-color: rgba(0,40,94,0.18) !important;
      box-shadow: 0 4px 12px rgba(0,40,94,0.05) !important;
    }
    :is(.tenant-aura,.tenant-latincaribe) #profileCitasContent .space-y-2 p.text-sm {
      color: #18181B !important;
      font-weight: 700 !important;
    }
    :is(.tenant-aura,.tenant-latincaribe) #profileCitasContent .space-y-2 p.text-xs {
      color: #8E9399 !important;
    }
    :is(.tenant-aura,.tenant-latincaribe) #profileCitasContent .space-y-2 i.ph-fill {
      font-size: 20px !important;
    }
    :is(.tenant-aura,.tenant-latincaribe) #profileCitasContent .space-y-2 .cita-estado-completada {
      background: rgba(34, 197, 94, 0.1) !important;
      color: #22c55e !important;
      border-radius: 8px !important;
      font-weight: 700 !important;
    }
    :is(.tenant-aura,.tenant-latincaribe) #profileCitasContent .space-y-2 .cita-estado-cancelada {
      background: rgba(239, 68, 68, 0.1) !important;
      color: #ef4444 !important;
      border-radius: 8px !important;
      font-weight: 700 !important;
    }
    :is(.tenant-aura,.tenant-latincaribe) #profileCitasContent .space-y-2 .cita-estado-pendiente {
      background: rgba(59, 130, 246, 0.1) !important;
      color: #3b82f6 !important;
      border-radius: 8px !important;
      font-weight: 700 !important;
    }
    :is(.tenant-aura,.tenant-latincaribe) #profileCitasContent .space-y-2 .reagendar-hist-btn {
      color: #00285E !important;
      background: rgba(0, 40, 94, 0.05) !important;
      border-radius: 8px !important;
    }
    :is(.tenant-aura,.tenant-latincaribe) #profileCitasContent .space-y-2 .reagendar-hist-btn:hover {
      background: rgba(0, 40, 94, 0.1) !important;
    }
    :is(.tenant-aura,.tenant-latincaribe) #profileCitasContent .space-y-2 button[onclick*="abrirModalCancelar"] {
      color: #ef4444 !important;
      background: rgba(239, 68, 68, 0.05) !important;
      border-radius: 8px !important;
    }
    :is(.tenant-aura,.tenant-latincaribe) #profileCitasContent .space-y-2 button[onclick*="abrirModalCancelar"]:hover {
      background: rgba(239, 68, 68, 0.1) !important;
    }

    /* ═══════════════════════════════════════════════════════════════
       INFINITY STUDIO - DASHBOARD (Luminous White & Glassmorphism Theme)
       ═══════════════════════════════════════════════════════════════ */
    .tenant-infinity {
      --accent:   #111827;
      --accent-r: 17; --accent-g: 24; --accent-b: 39;
      --neon-clr: #111827;
      --neon-r:   17; --neon-g:   24; --neon-b:   39;
      --body-bg:  #ffffff;

      --gold:      #111827;
      --gold-dim:  rgba(17, 24, 39, 0.15);
      --gold-glow: rgba(17, 24, 39, 0.04);

      --brand-bg: #ffffff;
      --brand-surface: rgba(255, 255, 255, 0.75);
      --brand-surface-alt: rgba(255, 255, 255, 0.88);
      --brand-primary: #111827;
      --brand-accent: #4b5563;
      --brand-text: #1f2937;
      --brand-muted: #9ca3af;
      --brand-border: rgba(17, 24, 39, 0.06);
      --brand-glow: rgba(255, 255, 255, 0.8);
      --brand-button-text: #111827;
      --brand-progress-track: rgba(17, 24, 39, 0.04);
    }
    html.tenant-infinity body {
      background-color: #ffffff !important;
      background-image:
        radial-gradient(circle at 50% 0%, rgba(255, 255, 255, 1) 0%, rgba(243, 244, 246, 0.4) 100%),
        radial-gradient(circle at 10% 40%, rgba(255, 255, 255, 1) 0%, rgba(249, 250, 251, 0.7) 50%, transparent 100%),
        radial-gradient(circle at 90% 80%, rgba(255, 255, 255, 1) 0%, rgba(243, 244, 246, 0.6) 50%, transparent 100%) !important;
      background-attachment: fixed !important;
      color: #111827 !important;
    }

    .tenant-infinity::before {
      content: "∞" !important;
      position: fixed !important;
      top: 12% !important;
      left: -8% !important;
      font-size: 22rem !important;
      color: rgba(17, 24, 39, 0.015) !important;
      font-weight: 300 !important;
      z-index: 0 !important;
      pointer-events: none !important;
      will-change: transform !important;
      animation: float-infinity-slow 22s ease-in-out infinite alternate !important;
    }
    .tenant-infinity::after {
      content: "∞" !important;
      position: fixed !important;
      bottom: 8% !important;
      right: -10% !important;
      font-size: 28rem !important;
      color: rgba(17, 24, 39, 0.018) !important;
      font-weight: 300 !important;
      z-index: 0 !important;
      pointer-events: none !important;
      will-change: transform !important;
      animation: float-infinity-fast 28s ease-in-out infinite alternate !important;
    }

    /* Intercepción de Utilidades Oscuras de Tailwind */
    .tenant-infinity .text-white { color: #111827 !important; }
    .tenant-infinity .text-white\/30 { color: rgba(17, 24, 39, 0.3) !important; }
    .tenant-infinity .text-white\/40 { color: rgba(17, 24, 39, 0.4) !important; }
    .tenant-infinity .text-white\/50 { color: rgba(17, 24, 39, 0.5) !important; }
    .tenant-infinity .text-white\/60 { color: rgba(17, 24, 39, 0.6) !important; }
    .tenant-infinity .text-white\/70 { color: rgba(17, 24, 39, 0.7) !important; }
    .tenant-infinity .text-white\/80 { color: rgba(17, 24, 39, 0.8) !important; }
    .tenant-infinity .text-white\/90 { color: rgba(17, 24, 39, 0.9) !important; }

    /* ── Rellenos de contraste (agregados 2026-07) ─────────────────
       El bloque original cubría solo /30 → /90 en tramos de 10. Las
       opacidades intermedias, spinners con border-white, gray-600/700
       y placeholders quedaban invisibles sobre el fondo blanco. */
    .tenant-infinity .text-white\/5   { color: rgba(17, 24, 39, 0.05) !important; }
    .tenant-infinity .text-white\/15  { color: rgba(17, 24, 39, 0.15) !important; }
    .tenant-infinity .text-white\/25  { color: rgba(17, 24, 39, 0.25) !important; }
    .tenant-infinity .text-white\/35  { color: rgba(17, 24, 39, 0.35) !important; }
    .tenant-infinity .text-white\/45  { color: rgba(17, 24, 39, 0.45) !important; }
    .tenant-infinity .text-white\/55  { color: rgba(17, 24, 39, 0.55) !important; }
    .tenant-infinity .text-white\/65  { color: rgba(17, 24, 39, 0.65) !important; }
    .tenant-infinity .text-white\/75  { color: rgba(17, 24, 39, 0.75) !important; }
    .tenant-infinity .text-white\/85  { color: rgba(17, 24, 39, 0.85) !important; }
    .tenant-infinity .text-white\/95  { color: rgba(17, 24, 39, 0.95) !important; }

    /* Backgrounds translúcidos blancos → tinte navy suave (evita cards
       "invisibles" sobre el fondo blanco). */
    .tenant-infinity .bg-white\/5   { background-color: rgba(17, 24, 39, 0.04) !important; }
    .tenant-infinity .bg-white\/8   { background-color: rgba(17, 24, 39, 0.06) !important; }
    .tenant-infinity .bg-white\/20  { background-color: rgba(17, 24, 39, 0.10) !important; }
    .tenant-infinity .bg-white\/25  { background-color: rgba(17, 24, 39, 0.12) !important; }
    .tenant-infinity .bg-white\/30  { background-color: rgba(17, 24, 39, 0.14) !important; }
    .tenant-infinity .bg-white\/40  { background-color: rgba(17, 24, 39, 0.18) !important; }
    .tenant-infinity .bg-white\/50  { background-color: rgba(17, 24, 39, 0.22) !important; }

    /* Borders translúcidos blancos — mismos criterios que backgrounds. */
    .tenant-infinity .border-white\/5,
    .tenant-infinity .border-white\/15,
    .tenant-infinity .border-white\/20,
    .tenant-infinity .border-white\/25,
    .tenant-infinity .border-white\/30,
    .tenant-infinity .border-white\/40 { border-color: rgba(17, 24, 39, 0.12) !important; }

    /* Spinners globales — antes solo el spinner de #authGuard se veía;
       los que se renderizaban en otras pantallas (cargando historial,
       liquidaciones, etc.) usaban border-white/border-t-white y quedaban
       invisibles blanco-sobre-blanco. */
    .tenant-infinity .border-white   { border-color: rgba(17, 24, 39, 0.15) !important; }
    .tenant-infinity .border-t-white { border-top-color: #111827 !important; }

    /* Textos secundarios en labels de formularios y empty states. */
    .tenant-infinity .text-gray-300 { color: #374151 !important; }
    .tenant-infinity .text-gray-400 { color: #4B5563 !important; }
    .tenant-infinity .text-gray-500 { color: #6B7280 !important; }
    .tenant-infinity .text-gray-600 { color: #4B5563 !important; }
    .tenant-infinity .text-gray-700 { color: #374151 !important; }
    .tenant-infinity .text-gray-800 { color: #1F2937 !important; }
    .tenant-infinity .text-zinc-400 { color: #4B5563 !important; }
    .tenant-infinity .text-zinc-500 { color: #6B7280 !important; }
    .tenant-infinity .text-zinc-600 { color: #4B5563 !important; }
    .tenant-infinity .text-zinc-700 { color: #374151 !important; }

    /* Placeholders en inputs y textareas — el gris por default se pierde
       sobre inputs claros. Este selector es global para el tenant. */
    .tenant-infinity ::placeholder                    { color: #9CA3AF !important; opacity: 1 !important; }
    .tenant-infinity ::-webkit-input-placeholder      { color: #9CA3AF !important; opacity: 1 !important; }
    .tenant-infinity :-ms-input-placeholder           { color: #9CA3AF !important; opacity: 1 !important; }

    .tenant-infinity .bg-\\[\\#111115\\] {
      background-color: rgba(255, 255, 255, 0.8) !important;
      backdrop-filter: blur(16px) saturate(140%) !important;
      -webkit-backdrop-filter: blur(16px) saturate(140%) !important;
    }
    .tenant-infinity .bg-\\[\\#050505\\] { background-color: #ffffff !important; }
    .tenant-infinity .bg-\\[\\#0a0a0d\\] {
      background-color: rgba(255, 255, 255, 0.85) !important;
      backdrop-filter: blur(12px) !important;
      -webkit-backdrop-filter: blur(12px) !important;
    }
    .tenant-infinity .bg-\\[\\#1a1a1f\\] { background-color: rgba(244, 244, 245, 0.9) !important; }
    .tenant-infinity .bg-zinc-900 { background-color: rgba(244, 244, 245, 0.8) !important; }
    .tenant-infinity .bg-white\\/5 { background-color: rgba(17, 24, 39, 0.04) !important; }

    .tenant-infinity .border-white\\/8,
    .tenant-infinity .border-white\\/10,
    .tenant-infinity .border-white\\/12,
    .tenant-infinity .border-white\\/6,
    .tenant-infinity .border-zinc-800,
    .tenant-infinity .border-zinc-800\\/80 { border-color: rgba(17, 24, 39, 0.08) !important; }

    /* Auth Guard */
    .tenant-infinity #authGuard {
      background-color: #ffffff !important;
      background-image: radial-gradient(circle at center, #ffffff 0%, #f3f4f6 100%) !important;
    }
    .tenant-infinity #authGuard .border-t-white { border-top-color: #111827 !important; }
    .tenant-infinity #authGuard .border-white\\/20 { border-color: rgba(17, 24, 39, 0.1) !important; }

    /* Header */
    .tenant-infinity header {
      background-color: rgba(255, 255, 255, 0.85) !important;
      backdrop-filter: blur(12px) !important;
      -webkit-backdrop-filter: blur(12px) !important;
      border-bottom: 1px solid rgba(17, 24, 39, 0.06) !important;
    }
    .tenant-infinity #shopHeaderName { color: #111827 !important; }
    .tenant-infinity #shopHeaderSub { color: #4B5563 !important; }
    .tenant-infinity #btnNotifBell, .tenant-infinity #avatarContainer {
      background-color: rgba(255, 255, 255, 0.9) !important;
      border-color: rgba(17, 24, 39, 0.08) !important;
    }
    .tenant-infinity #btnNotifBell i, .tenant-infinity #avatarContainer i { color: #4B5563 !important; }

    /* Hero Section — bordes sólidos + doble ring en sombra para que la
       imagen infinit.png se integre limpia sin verse "flotante" sobre el
       fondo blanco. Border 1.5px navy 15% + sombra profunda con anillo. */
    .tenant-infinity .hero-bg {
      background-image: url('/infinity_bg.png') !important;
      background-size: cover !important;
      background-position: center !important;
      border: 1.5px solid rgba(17, 24, 39, 0.18) !important;
      box-shadow: 0 0 0 1px rgba(17, 24, 39, 0.06),
                  0 12px 32px rgba(17, 24, 39, 0.14),
                  0 2px 8px rgba(17, 24, 39, 0.06) !important;
    }
    .tenant-infinity .hero-overlay {
      background: linear-gradient(135deg, rgba(255, 255, 255, 0.75) 0%, rgba(255, 255, 255, 0.95) 100%) !important;
    }
    .tenant-infinity .hero-glow-spot {
      background: radial-gradient(circle, rgba(17, 24, 39, 0.03) 0%, transparent 65%) !important;
    }
    .tenant-infinity #heroLine1 {
      color: #111827 !important;
      text-shadow: none !important;
      font-weight: 800 !important;
    }
    .tenant-infinity #heroLine2 {
      color: #4B5563 !important;
      text-shadow: none !important;
    }
    /* Próxima cita card — chip y contenedor de ícono usan var(--gold) que en infinity
       es #111827 (muy oscuro), generando bajo contraste sobre fondo blanco */
    .tenant-infinity .proxima-cita-chip {
      background: rgba(17,24,39,0.07) !important;
      color: #374151 !important;
      border-color: rgba(17,24,39,0.14) !important;
    }
    .tenant-infinity .proxima-cita-icon-wrap {
      background: rgba(17,24,39,0.05) !important;
      border-color: rgba(17,24,39,0.10) !important;
    }
    .tenant-infinity .proxima-cita-icon-wrap i { color: #4B5563 !important; }
    .tenant-infinity .hero-cta {
      background: #111827 !important;
      border-color: #111827 !important;
      color: #ffffff !important;
      box-shadow: 0 4px 14px rgba(17, 24, 39, 0.2) !important;
    }
    .tenant-infinity .hero-cta i { color: #ffffff !important; }
    .tenant-infinity .hero-cta span { color: #ffffff !important; }
    .tenant-infinity .hero-cta:hover {
      background: #374151 !important;
      border-color: #374151 !important;
    }

    /* PWA Card */
    .tenant-infinity #pwaBigInstallCard {
      background: rgba(255, 255, 255, 0.8) !important;
      backdrop-filter: blur(12px) !important;
      -webkit-backdrop-filter: blur(12px) !important;
      border: 1px solid rgba(17, 24, 39, 0.06) !important;
      box-shadow: 0 4px 20px rgba(0, 0, 0, 0.02) !important;
    }
    .tenant-infinity .pwa-icon-bg {
      background: rgba(17, 24, 39, 0.03) !important;
      border-color: rgba(17, 24, 39, 0.06) !important;
    }
    .tenant-infinity #pwaBigInstallCard h3 { color: #111827 !important; }
    .tenant-infinity #pwaBigInstallCard p { color: #4B5563 !important; }
    .tenant-infinity #pwaBigInstallCard i.ph-caret-right { color: #4B5563 !important; }

    /* Membership Card (Loyalty) */
    .tenant-infinity .membership-pattern {
      background-color: rgba(255, 255, 255, 0.8) !important;
      backdrop-filter: blur(16px) saturate(140%) !important;
      -webkit-backdrop-filter: blur(16px) saturate(140%) !important;
      border: 1px solid rgba(17, 24, 39, 0.08) !important;
      box-shadow: 0 12px 32px 0 rgba(0, 0, 0, 0.03), inset 0 1px 0 0 rgba(255,255,255,0.8) !important;
    }
    .tenant-infinity .membership-pattern::before {
      background-image: repeating-linear-gradient(
        -45deg, transparent, transparent 18px,
        rgba(17, 24, 39, 0.015) 18px, rgba(17, 24, 39, 0.015) 19px
      ) !important;
    }
    .tenant-infinity .membership-glow {
      background: radial-gradient(circle, rgba(17, 24, 39, 0.04) 0%, transparent 70%) !important;
    }
    .tenant-infinity #membershipWatermark {
      color: rgba(17, 24, 39, 0.02) !important;
      font-size: 8rem !important;
      right: 5% !important;
      bottom: -10% !important;
      font-family: system-ui, -apple-system, sans-serif !important;
    }

    /* Hero del club — imagen infinit.png sólida detrás del texto
       "Estilo & Confianza" / "Reservar mi cita". Sobre el overlay (z:10)
       y debajo del contenido (z:20). Con opacity:1 se ve nítida; el
       text-shadow sutil de los headings preserva legibilidad. */
    .tenant-infinity .hero-bg::after {
      content: '';
      position: absolute;
      inset: 0;
      background: url('/infinit.png') center/contain no-repeat;
      opacity: 1;
      z-index: 15;
      pointer-events: none;
    }
    /* Text-shadow suave sobre los headings para que el texto se lea
       sobre la imagen sin depender del overlay claro. */
    .tenant-infinity #heroLine1,
    .tenant-infinity #heroLine2 {
      text-shadow: 0 1px 3px rgba(255, 255, 255, 0.8),
                   0 2px 12px rgba(255, 255, 255, 0.6) !important;
    }
    .tenant-infinity #stampsCount { color: #111827 !important; }
    .tenant-infinity #stampsCount span { color: #4B5563 !important; }
    .tenant-infinity #shopClubName { color: #111827 !important; }
    .tenant-infinity #nextRewardName { color: #111827 !important; }

    .tenant-infinity .membership-pattern .rounded-full.overflow-hidden.mb-3 {
      background: rgba(17, 24, 39, 0.08) !important;
    }

    /* Stamps Grid */
    .tenant-infinity #stampsGrid {
      background-color: rgba(17, 24, 39, 0.02) !important;
      border-color: rgba(17, 24, 39, 0.05) !important;
    }
    .tenant-infinity .stamp-cell {
      background: rgba(255, 255, 255, 0.9) !important;
      border-color: rgba(17, 24, 39, 0.08) !important;
      box-shadow: 0 2px 8px rgba(0, 0, 0, 0.02) !important;
    }
    .tenant-infinity .stamp-cell.empty {
      background: rgba(255, 255, 255, 0.5) !important;
      border-color: rgba(17, 24, 39, 0.06) !important;
    }
    .tenant-infinity .stamp-cell.filled {
      background: #111827 !important;
      border-color: #111827 !important;
      box-shadow: 0 4px 10px rgba(17, 24, 39, 0.2) !important;
    }
    .tenant-infinity .stamp-cell.filled i {
      color: #ffffff !important;
    }
    .tenant-infinity .stamp-cell.prize-filled {
      background: rgba(17, 24, 39, 0.04) !important;
      border-color: #111827 !important;
      box-shadow: none !important;
    }
    .tenant-infinity .stamp-cell.prize-filled i {
      color: #111827 !important;
      filter: none !important;
    }
    .tenant-infinity #stampsBar {
      background: #111827 !important;
      box-shadow: 0 2px 8px rgba(17, 24, 39, 0.15) !important;
    }

    /* Next Reward & Premios */
    .tenant-infinity .premio-icon { color: #111827 !important; }
    .tenant-infinity #nextRewardText { color: #111827 !important; }
    .tenant-infinity button[onclick="togglePremios()"] {
      background: #111827 !important;
      color: #FFFFFF !important;
      border: 1px solid #111827 !important;
      box-shadow: 0 4px 12px rgba(17, 24, 39, 0.15) !important;
    }
    .tenant-infinity button[onclick="togglePremios()"]:hover {
      background: #374151 !important;
      border-color: #374151 !important;
    }

    /* Perfil Visitas Card */
    .tenant-infinity #perfilVisitasCard {
      background-color: rgba(255, 255, 255, 0.8) !important;
      backdrop-filter: blur(12px) !important;
      -webkit-backdrop-filter: blur(12px) !important;
      border-color: rgba(17, 24, 39, 0.06) !important;
      box-shadow: 0 4px 20px rgba(0, 0, 0, 0.02) !important;
    }
    .tenant-infinity #perfilServicio, .tenant-infinity #perfilBarbero { color: #111827 !important; }
    .tenant-infinity .h-px.bg-white\\/5 { background-color: rgba(17, 24, 39, 0.06) !important; }

    /* Featured Services & Products */
    .tenant-infinity .service-card {
      background: rgba(255, 255, 255, 0.8) !important;
      backdrop-filter: blur(12px) !important;
      -webkit-backdrop-filter: blur(12px) !important;
      border: 1px solid rgba(17, 24, 39, 0.06) !important;
      box-shadow: 0 4px 20px rgba(0, 0, 0, 0.02) !important;
    }
    .tenant-infinity .service-card h4 { color: #111827 !important; }
    .tenant-infinity .service-card p { color: #4B5563 !important; }

    .tenant-infinity .bg-\\[\\#0d0d10\\] {
      background-color: rgba(255, 255, 255, 0.8) !important;
      backdrop-filter: blur(12px) !important;
      -webkit-backdrop-filter: blur(12px) !important;
      border-color: rgba(17, 24, 39, 0.08) !important;
    }
    .tenant-infinity .bg-\\[\\#1a1a1a\\] {
      background-color: rgba(17, 24, 39, 0.04) !important;
      border-color: rgba(17, 24, 39, 0.08) !important;
    }

    /* "Conoce al equipo" button */
    .tenant-infinity button[onclick="abrirEquipoModal()"] {
      background: rgba(255, 255, 255, 0.8) !important;
      backdrop-filter: blur(12px) !important;
      -webkit-backdrop-filter: blur(12px) !important;
      border-color: rgba(17, 24, 39, 0.08) !important;
      box-shadow: 0 2px 10px rgba(0, 0, 0, 0.01) !important;
    }
    .tenant-infinity button[onclick="abrirEquipoModal()"] .text-white { color: #111827 !important; }

    /* Profile Tab & Forms */
    .tenant-infinity #profileAvatar {
      background: rgba(255, 255, 255, 0.9) !important;
      border-color: #111827 !important;
      box-shadow: 0 4px 14px rgba(17, 24, 39, 0.1) !important;
    }
    .tenant-infinity #profileName { color: #111827 !important; }
    .tenant-infinity #profileVisitsCount, .tenant-infinity #profileStamps { color: #111827 !important; }

    .tenant-infinity input.w-full {
      background: rgba(255, 255, 255, 0.95) !important;
      border-color: rgba(17, 24, 39, 0.12) !important;
      color: #111827 !important;
      box-shadow: inset 0 1px 2px rgba(0,0,0,0.02) !important;
    }
    .tenant-infinity input.w-full::placeholder { color: #9CA3AF !important; }
    .tenant-infinity input.w-full:focus {
      border-color: #111827 !important;
      box-shadow: 0 0 0 1px #111827 !important;
    }
    .tenant-infinity input[type="date"] { color-scheme: light !important; }
    .tenant-infinity input#editEmail {
      background: rgba(17, 24, 39, 0.03) !important;
      color: #4B5563 !important;
      border-color: rgba(17, 24, 39, 0.05) !important;
    }

    .tenant-infinity input:-webkit-autofill,
    .tenant-infinity input:-webkit-autofill:hover,
    .tenant-infinity input:-webkit-autofill:focus {
      -webkit-box-shadow: 0 0 0 100px #FFFFFF inset !important;
      -webkit-text-fill-color: #111827 !important;
      caret-color: #111827 !important;
    }

    /* Action Buttons & FAB */
    .tenant-infinity #btnGuardarPerfil {
      background: #111827 !important;
      color: #FFFFFF !important;
      border-color: #111827 !important;
      box-shadow: 0 4px 12px rgba(17, 24, 39, 0.15) !important;
    }
    .tenant-infinity #btnGuardarPerfil:hover {
      background: #374151 !important;
      border-color: #374151 !important;
    }
    .tenant-infinity button[onclick="signOut()"] {
      background: rgba(255, 255, 255, 0.8) !important;
      backdrop-filter: blur(8px) !important;
      -webkit-backdrop-filter: blur(8px) !important;
      border-color: rgba(17, 24, 39, 0.1) !important;
      color: #4B5563 !important;
    }
    .tenant-infinity button[onclick="confirmDeleteAccount()"] {
      background: #FEF2F2 !important;
      border-color: #FECACA !important;
      color: #DC2626 !important;
    }

    .tenant-infinity a[aria-label="Agendar Hora"] {
      background: #111827 !important;
      box-shadow: 0 6px 20px rgba(17, 24, 39, 0.25) !important;
    }
    .tenant-infinity a[aria-label="Agendar Hora"] i { color: #FFFFFF !important; }

    /* Bottom Navigation Bar */
    .tenant-infinity nav {
      background-color: rgba(255, 255, 255, 0.85) !important;
      backdrop-filter: blur(16px) !important;
      -webkit-backdrop-filter: blur(16px) !important;
      border-top-color: rgba(17, 24, 39, 0.06) !important;
    }
    .tenant-infinity .nav-tab .nav-icon, .tenant-infinity .nav-tab .nav-label { color: #6B7280 !important; }
    .tenant-infinity .nav-tab.active .nav-icon, .tenant-infinity .nav-tab.active .nav-label {
      color: #111827 !important;
      filter: none !important;
    }

    /* Reagendar / Cancelar / Delete / Canje Modals */
    .tenant-infinity #reagendarCitaModal > div,
    .tenant-infinity #cancelCitaModal > div,
    .tenant-infinity #deleteModal > div,
    .tenant-infinity #canjeModal > div {
      background-color: rgba(255, 255, 255, 0.95) !important;
      backdrop-filter: blur(16px) !important;
      -webkit-backdrop-filter: blur(16px) !important;
      border-color: rgba(17, 24, 39, 0.08) !important;
      box-shadow: 0 20px 50px rgba(0, 0, 0, 0.08) !important;
    }
    .tenant-infinity #btnConfirmarReagendamiento,
    .tenant-infinity button[onclick="cerrarModalCanje()"] {
      background: #111827 !important;
      color: #FFFFFF !important;
      box-shadow: none !important;
    }
    .tenant-infinity button[onclick="cerrarModalReagendar()"],
    .tenant-infinity button[onclick="cerrarModalCancelar()"],
    .tenant-infinity button[onclick="closeDeleteModal()"] {
      background: rgba(255, 255, 255, 0.8) !important;
      border-color: rgba(17, 24, 39, 0.1) !important;
      color: #4B5563 !important;
    }

    .tenant-infinity .reagendar-proxima-btn {
      border-color: rgba(17, 24, 39, 0.15) !important;
      background: rgba(17, 24, 39, 0.03) !important;
      color: #111827 !important;
    }
    .tenant-infinity .reagendar-hist-btn { color: rgba(17, 24, 39, 0.6) !important; }
    .tenant-infinity .reagendar-hist-btn:hover { background: rgba(17, 24, 39, 0.04) !important; }
    .tenant-infinity .proxima-estado-chip {
      background: rgba(17, 24, 39, 0.06) !important;
      color: #111827 !important;
    }

    /* Lookbook & Product Title Fonts */
    .tenant-infinity #tabLookbook h2,
    .tenant-infinity #tabProductos h2 {
      color: #111827 !important;
      font-family: system-ui, -apple-system, sans-serif !important;
    }

    /* Support Chat Widget & Popover */
    .tenant-infinity #chatPopover {
      background: rgba(255, 255, 255, 0.95) !important;
      backdrop-filter: blur(16px) !important;
      -webkit-backdrop-filter: blur(16px) !important;
      border-color: rgba(17, 24, 39, 0.08) !important;
      box-shadow: 0 12px 30px rgba(0, 0, 0, 0.1) !important;
    }
    .tenant-infinity #chatPopover [style*="background:#000"] {
      background: #F4F4F5 !important;
      border-color: rgba(17, 24, 39, 0.06) !important;
    }
    .tenant-infinity #chatHeaderNombre { color: #111827 !important; }
    .tenant-infinity #chatMessages [style*="background:#1f2937"] {
      background: #EFF4F8 !important;
      color: #111827 !important;
    }
    .tenant-infinity #chatMessages [style*="background:#D4AF37"] {
      background: #111827 !important;
      color: #FFFFFF !important;
    }
    .tenant-infinity #chatInput {
      background: #FFFFFF !important;
      border-color: rgba(17, 24, 39, 0.1) !important;
      color: #111827 !important;
    }
    .tenant-infinity #chatInput::placeholder { color: #9CA3AF !important; }
    .tenant-infinity button[onclick="sendChatMessage()"] { background: #111827 !important; }
    .tenant-infinity button[onclick="sendChatMessage()"] svg { fill: #FFFFFF !important; }

    /* Modals (Producto, PWA iOS, Google Review) */
    .tenant-infinity #productoModal { background: rgba(17, 24, 39, 0.4) !important; }
    .tenant-infinity #productoModal > div {
      background: rgba(255, 255, 255, 0.98) !important;
      backdrop-filter: blur(16px) !important;
      -webkit-backdrop-filter: blur(16px) !important;
      border: 1px solid rgba(17, 24, 39, 0.08) !important;
    }
    .tenant-infinity #productoModal button.bg-black\/60 {
      background: rgba(17, 24, 39, 0.06) !important;
    }
    .tenant-infinity #productoModal button.bg-black\/60 i { color: #111827 !important; }

    .tenant-infinity #pwaModalIOS { background: rgba(17, 24, 39, 0.4) !important; }
    .tenant-infinity #pwaModalIOS > div {
      background: rgba(255, 255, 255, 0.98) !important;
      backdrop-filter: blur(16px) !important;
      -webkit-backdrop-filter: blur(16px) !important;
      border-color: rgba(17, 24, 39, 0.08) !important;
    }
    .tenant-infinity #pwaModalIOS h3 { color: #111827 !important; }
    .tenant-infinity #pwaModalIOS p  { color: #4B5563 !important; }
    .tenant-infinity #pwaModalIOS strong { color: #111827 !important; }
    .tenant-infinity #pwaModalIOS [style*="rgba(255,255,255,0.05)"] {
      background: rgba(17, 24, 39, 0.03) !important;
    }
    .tenant-infinity #pwaModalIOS > div > button {
      color: #4B5563 !important;
      border-color: rgba(17, 24, 39, 0.08) !important;
    }

    .tenant-infinity #googleReviewModal { background: rgba(17, 24, 39, 0.4) !important; }
    .tenant-infinity #googleReviewModal > div {
      background: rgba(255, 255, 255, 0.98) !important;
      backdrop-filter: blur(16px) !important;
      -webkit-backdrop-filter: blur(16px) !important;
      border-color: rgba(17, 24, 39, 0.08) !important;
    }
    .tenant-infinity #googleReviewModal [style*="rgba(201,168,76"] { background: rgba(17, 24, 39, 0.03) !important; }
    .tenant-infinity #googleReviewModal .text-white { color: #111827 !important; }
    .tenant-infinity #googleReviewModal p { color: #4B5563 !important; }

    /* Other specific UI Overrides */
    .tenant-infinity .border-neon {
      border-color: #111827 !important;
      box-shadow: 0 0 0 3px rgba(17, 24, 39, 0.05) !important;
    }
    .tenant-infinity #premiosSection h3 { color: #4B5563 !important; }
    .tenant-infinity #sfNoPhoto p:last-child { color: rgba(17, 24, 39, 0.3) !important; }

    /* Modal backdrops overrides to white glassmorphism / luminous overlays */
    .tenant-infinity #reagendarCitaModal,
    .tenant-infinity #cancelCitaModal,
    .tenant-infinity #deleteModal,
    .tenant-infinity #canjeModal {
      background: rgba(17, 24, 39, 0.25) !important;
      backdrop-filter: blur(8px) !important;
      -webkit-backdrop-filter: blur(8px) !important;
    }
    /* Overlay del modal Equipo — dark backdrop navy con blur */
    .tenant-infinity #equipoModal > div:first-child {
      background: rgba(17, 24, 39, 0.25) !important;
      backdrop-filter: blur(8px) !important;
      -webkit-backdrop-filter: blur(8px) !important;
    }
    /* Panel principal — el fix anterior solo tocaba el overlay; el
       panel (bg-[#111115] border-white/10) seguía negro. Ahora blanco. */
    .tenant-infinity #equipoModal > div:nth-child(2) {
      background: #ffffff !important;
      border-top-color: rgba(17,24,39,0.08) !important;
    }
    .tenant-infinity button[onclick="cerrarEquipoModal()"] {
      background: rgba(17, 24, 39, 0.05) !important;
      border-color: rgba(17, 24, 39, 0.08) !important;
    }
    .tenant-infinity button[onclick="cerrarEquipoModal()"] i {
      color: #111827 !important;
    }
    .tenant-infinity #equipoModal .bg-white\/15 {
      background-color: rgba(17, 24, 39, 0.15) !important;
    }
    /* Borde separador del header del modal (border-white/6) */
    .tenant-infinity #equipoModal .border-white\/6 {
      border-color: rgba(17,24,39,0.08) !important;
    }

    /* Chat Toggle overrides */
    .tenant-infinity #chatToggleBtn {
      background: #111827 !important;
      box-shadow: 0 4px 14px rgba(17, 24, 39, 0.2) !important;
    }
    .tenant-infinity #chatToggleBtn svg {
      fill: #FFFFFF !important;
    }
    .tenant-infinity #chatToggleBtn svg path {
      fill: #FFFFFF !important;
    }
    .tenant-infinity #chatUnreadDot {
      border-color: #ffffff !important;
    }

    /* GPU-Accelerated Shimmer & Floating Animations specifically for Infinity Dashboard */
    @keyframes infinity-shimmer {
      0%   { transform: translate3d(-130%, 0, 0) skewX(-12deg); }
      100% { transform: translate3d(230%, 0, 0) skewX(-12deg); }
    }
    @keyframes float-infinity-slow {
      0% { transform: translate3d(0, 0, 0) rotate(0deg) scale(1); }
      100% { transform: translate3d(40px, -60px, 0) rotate(15deg) scale(1.15); }
    }
    @keyframes float-infinity-fast {
      0% { transform: translate3d(0, 0, 0) rotate(0deg) scale(1); }
      100% { transform: translate3d(-50px, -80px, 0) rotate(-25deg) scale(0.9); }
    }
    .tenant-infinity .membership-pattern::after {
      content: '';
      position: absolute;
      top: -10%;
      left: 0;
      width: 45%;
      height: 120%;
      background: linear-gradient(
        90deg,
        transparent 0%,
        rgba(255,255,255,0.4) 50%,
        transparent 100%
      );
      animation: infinity-shimmer 6s ease-in-out 1s infinite;
      pointer-events: none;
      will-change: transform;
    }

    /* ─────────────────────────────────────────────────────────────── */

    /* ========================================== */
    /*      PREMIUM AESTHETICS & MICRO-INTERACTIONS  */
    /* ========================================== */

    /* 1. Glassmorphism Upgrades for Loyalty and Next Reward Cards */
    .membership-pattern, .next-reward-card {
      backdrop-filter: blur(16px) saturate(140%) !important;
      background-color: rgba(17, 17, 21, 0.75) !important;
      border: 1.5px solid rgba(255, 255, 255, 0.12) !important;
      box-shadow: 0 12px 40px 0 rgba(0, 0, 0, 0.4), inset 0 1px 0 0 rgba(255,255,255,0.05) !important;
      position: relative;
      overflow: hidden;
      transition: border-color 0.4s ease, box-shadow 0.4s ease;
    }

    /* Aura Glassmorphism light mode override */
    :is(.tenant-aura,.tenant-latincaribe) .membership-pattern, :is(.tenant-aura,.tenant-latincaribe) .next-reward-card {
      backdrop-filter: blur(16px) saturate(140%) !important;
      background-color: rgba(255, 255, 255, 0.8) !important;
      border: 1.5px solid rgba(0, 0, 0, 0.08) !important;
      box-shadow: 0 12px 32px 0 rgba(0, 0, 0, 0.05), inset 0 1px 0 0 rgba(255,255,255,0.8) !important;
    }

    /* 2. Premium Shimmer Reflection Animation on Membership Card */
    .membership-pattern::after {
      content: '';
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      background: linear-gradient(
        115deg,
        rgba(255, 255, 255, 0) 0%,
        rgba(255, 255, 255, 0) 35%,
        rgba(255, 255, 255, 0.08) 48%,
        rgba(255, 255, 255, 0.18) 50%,
        rgba(255, 255, 255, 0.08) 52%,
        rgba(255, 255, 255, 0) 65%,
        rgba(255, 255, 255, 0) 100%
      );
      background-size: 300% 100%;
      background-position: 150% 0%;
      pointer-events: none;
      z-index: 5;
      animation: premium-shimmer 7s infinite ease-in-out;
    }

    /* Light mode shimmer correction */
    :is(.tenant-aura,.tenant-latincaribe) .membership-pattern::after {
      background: linear-gradient(
        115deg,
        rgba(255, 255, 255, 0) 0%,
        rgba(255, 255, 255, 0) 35%,
        rgba(255, 255, 255, 0.15) 48%,
        rgba(255, 255, 255, 0.35) 50%,
        rgba(255, 255, 255, 0.15) 52%,
        rgba(255, 255, 255, 0) 65%,
        rgba(255, 255, 255, 0) 100%
      );
      background-size: 300% 100%;
      background-position: 150% 0%;
      animation: premium-shimmer 7s infinite ease-in-out;
    }

    @keyframes premium-shimmer {
      0% { background-position: 150% 0%; }
      30% { background-position: -50% 0%; }
      100% { background-position: -50% 0%; }
    }

    /* 3. Gently Pulsing Glow Animations */
    .hero-glow-spot, .membership-glow {
      animation: gentle-glow-pulse 6s infinite ease-in-out alternate;
    }
    @keyframes gentle-glow-pulse {
      0% {
        opacity: 0.65;
        transform: scale(0.92);
      }
      100% {
        opacity: 1.15;
        transform: scale(1.08);
      }
    }

    /* 4. Tactile Spring Scaling on Stamp cells and buttons */
    .stamp-cell {
      transition: transform 0.4s cubic-bezier(0.34, 1.56, 0.64, 1), box-shadow 0.4s ease, border-color 0.4s ease !important;
    }
    .stamp-cell:hover {
      transform: scale(1.12) rotate(2deg);
      z-index: 10;
      box-shadow: 0 8px 16px rgba(0, 0, 0, 0.45);
      border-color: var(--gold) !important;
    }
    .stamp-cell:active {
      transform: scale(0.92) rotate(-2deg);
    }
    :is(.tenant-aura,.tenant-latincaribe) .stamp-cell:hover {
      box-shadow: 0 8px 16px rgba(0, 0, 0, 0.12);
    }

    /* 5. Enhanced Premium Tier Badges */
    .tier-badge {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      text-transform: uppercase;
      font-size: 9px;
      font-weight: 900;
      letter-spacing: 0.08em;
      border-radius: 6px;
      padding: 3px 8px;
      transition: all 0.3s ease;
      box-shadow: 0 2px 8px rgba(0,0,0,0.2);
    }
    .tier-badge.silver {
      color: #e2e8f0;
      border-color: rgba(226, 232, 240, 0.25) !important;
      background: linear-gradient(135deg, rgba(226, 232, 240, 0.08) 0%, rgba(226, 232, 240, 0.02) 100%) !important;
    }
    .tier-badge.gold {
      color: #ffd700;
      border-color: rgba(255, 215, 0, 0.3) !important;
      background: linear-gradient(135deg, rgba(255, 215, 0, 0.12) 0%, rgba(255, 215, 0, 0.03) 100%) !important;
      box-shadow: 0 2px 10px rgba(255, 215, 0, 0.1);
    }
    .tier-badge.platinum {
      color: #d8b4fe;
      border-color: rgba(216, 180, 254, 0.4) !important;
      background: linear-gradient(135deg, rgba(216, 180, 254, 0.15) 0%, rgba(216, 180, 254, 0.03) 100%) !important;
      box-shadow: 0 2px 12px rgba(216, 180, 254, 0.15);
    }

    /* Beneficios por rango (Mi Perfil) */
    .tier-row { transition: border-color .25s, box-shadow .25s; }
    .tier-row.is-current {
      border-color: var(--gold) !important;
      box-shadow: 0 0 0 1px var(--gold), 0 6px 18px rgba(0,0,0,0.18);
    }
    :is(.tenant-aura,.tenant-latincaribe) #profileBenefits .tier-row { background: #FFFFFF !important; border-color: #E4E4E7 !important; }

    /* ── Explainer "¿Cómo funciona el club?" — sólo Aura ── */
    .tenant-aura #rangosExplainerAura { display: block !important; }
    .tenant-aura #rangosExplainerAura > h3 { color: rgba(24,24,27,0.45) !important; }
    .tenant-aura #rangosExplainerAura .rangos-explainer-row {
      background: #FFFFFF !important;
      border-color: #E4E4E7 !important;
    }
    .tenant-aura #rangosExplainerAura .rangos-explainer-row p.text-white { color: #18181B !important; }
    .tenant-aura #rangosExplainerAura .rangos-explainer-row p.text-white\/70 { color: #52525B !important; }

    /* ── Bloque "Planes anuales" — sólo Aura ── */
    .tenant-aura #planesAnualesAura { display: block !important; }
    .tenant-aura #planesAnualesAura > div > h3,
    .tenant-aura #planesAnualesAuraSubtitle { color: rgba(24,24,27,0.45) !important; }
    .tenant-aura #planesAnualesAura .plan-anual-row {
      background: #FFFFFF !important;
      border-color: #E4E4E7 !important;
    }
    .tenant-aura #planesAnualesAura .plan-anual-row p.text-white { color: #18181B !important; }
    .tenant-aura #planesAnualesAura .plan-anual-row p.text-white\/55,
    .tenant-aura #planesAnualesAura .plan-anual-row p.text-white\/45 { color: #6B7280 !important; }
    .tenant-aura #planesAnualesAura .plan-anual-row .text-white\/70 { color: #52525B !important; }
    :is(.tenant-aura,.tenant-latincaribe) .tier-badge.silver {
      color: #475569 !important;
      border-color: rgba(71,85,105,0.25) !important;
      background: linear-gradient(135deg, rgba(71,85,105,0.10) 0%, rgba(71,85,105,0.02) 100%) !important;
    }

    /* =============================================================== */
    /*   INFINITY DASHBOARD OUT-OF-PLACE DARK ELEMENT & GOLD OVERRIDES   */
    /* =============================================================== */

    /* Global Utility overrides */
    .tenant-infinity .bg-gray-900 { background-color: rgba(255, 255, 255, 0.95) !important; }
    .tenant-infinity .bg-gray-800 { background-color: #ffffff !important; }
    .tenant-infinity .bg-gray-700 { background-color: #F4F4F5 !important; }
    .tenant-infinity .bg-white\\/10 { background-color: rgba(17, 24, 39, 0.08) !important; }
    .tenant-infinity .bg-white\\/15 { background-color: rgba(17, 24, 39, 0.15) !important; }
    .tenant-infinity .text-white\\/20 { color: rgba(17, 24, 39, 0.25) !important; }
    .tenant-infinity .text-white\\/10 { color: rgba(17, 24, 39, 0.15) !important; }
    .tenant-infinity .border-gray-600,
    .tenant-infinity .border-gray-700,
    .tenant-infinity .border-gray-800 { border-color: rgba(17, 24, 39, 0.08) !important; }

    /* PWA Install Banner overrides */
    .tenant-infinity #pwaBanner {
      background: rgba(255, 255, 255, 0.95) !important;
      backdrop-filter: blur(16px) !important;
      -webkit-backdrop-filter: blur(16px) !important;
      border-color: rgba(17, 24, 39, 0.08) !important;
      box-shadow: 0 10px 30px rgba(0, 0, 0, 0.05), 0 0 0 1px rgba(17, 24, 39, 0.02) !important;
    }
    .tenant-infinity #pwaBanner p { color: #111827 !important; }
    .tenant-infinity #pwaBanner p.text-white\\/50 { color: #4B5563 !important; }
    .tenant-infinity #pwaBtnInstall {
      background: #111827 !important;
      color: #FFFFFF !important;
    }
    .tenant-infinity #pwaBanner button[onclick="cerrarBannerPWA()"] {
      background-color: rgba(17, 24, 39, 0.04) !important;
      color: #4B5563 !important;
    }

    /* Product Modal overrides */
    .tenant-infinity #productoModalPrecio { color: #111827 !important; }
    .tenant-infinity #btnReservarProducto {
      background: #111827 !important;
      color: #FFFFFF !important;
    }
    .tenant-infinity #btnReservarProducto:hover { background: #374151 !important; }

    /* Cross-Sell Banners overrides */
    .tenant-infinity [style*="linear-gradient(to right,#111115"] {
      background: linear-gradient(to right, rgba(17, 24, 39, 0.04), rgba(17, 24, 39, 0.01)) !important;
      border-color: rgba(17, 24, 39, 0.08) !important;
    }
    .tenant-infinity [style*="linear-gradient(to right,#111115"] p[style*="rgba(212,175,55"] { color: #4B5563 !important; }
    .tenant-infinity [style*="linear-gradient(to right,#111115"] p.text-gray-300 { color: #4B5563 !important; }
    .tenant-infinity [style*="linear-gradient(to right,#111115"] button[style*="background:#D4AF37"] {
      background: #111827 !important;
      color: #FFFFFF !important;
    }

    /* Google Review Modal overrides */
    .tenant-infinity #googleReviewBtn {
      background: #111827 !important;
      color: #FFFFFF !important;
    }
    .tenant-infinity button[onclick="cerrarGoogleReviewModal(false)"] {
      border-color: rgba(17, 24, 39, 0.08) !important;
      color: #4B5563 !important;
    }

    /* Canje Modal overrides */
    .tenant-infinity #canjeModal [style*="rgba(212,175,55"] {
      background: rgba(17, 24, 39, 0.04) !important;
      border-color: rgba(17, 24, 39, 0.08) !important;
    }
    .tenant-infinity #canjeModal [style*="color:#D4AF37"] { color: #111827 !important; }
    .tenant-infinity #canjeModal #canjeModalTitle { color: #111827 !important; }
    .tenant-infinity #canjeModal .bg-\\[\\#1a1a1f\\] {
      background: #F4F4F5 !important;
      border-color: rgba(17, 24, 39, 0.08) !important;
    }
    .tenant-infinity #canjeModal p.text-gray-300 { color: #4B5563 !important; }
    .tenant-infinity #canjeModal button[style*="background:#D4AF37"] {
      background: #111827 !important;
      color: #FFFFFF !important;
    }

    /* ══════════════════════════════════════════════════════════
       INFINITY — refinamientos de contraste (agregados 2026-07)
       Bloques específicos que quedaban ilegibles/feos en el tema
       blanco por usar inline styles con paleta dark hardcoded.
    ══════════════════════════════════════════════════════════ */

    /* ── Backgrounds con opacidad no cubiertos por el bloque original ──
       El bloque de línea 3122 mapeaba solo .bg-zinc-900 (sin opacidad),
       pero Tailwind trata cada variante /XX como selector independiente.
       Cuando un botón (ej. "Compartir agenda") usaba bg-zinc-900/80 con
       hijos text-white, el fondo quedaba oscuro (sin override) pero el
       texto se volvía navy (override activo) → caja negra + letras
       negras ilegibles. Este bloque cierra todas las variantes. */
    .tenant-infinity .bg-zinc-900\/40,
    .tenant-infinity .bg-zinc-900\/60,
    .tenant-infinity .bg-zinc-900\/80,
    .tenant-infinity .bg-zinc-950\/20,
    .tenant-infinity .bg-zinc-950\/60,
    .tenant-infinity .bg-black\/30,
    .tenant-infinity .bg-\[\#0a0a0a\],
    .tenant-infinity .bg-\[\#0a0a0e\],
    .tenant-infinity .bg-\[\#111113\] {
      background-color: rgba(255, 255, 255, 0.85) !important;
      backdrop-filter: blur(12px) !important;
      -webkit-backdrop-filter: blur(12px) !important;
    }
    /* Nota: bg-black/55, /70, /80, /95 son overlays intencionales
       (scrims de modal y lookbook viewer). NO los intervenimos. */

    /* Borders con opacidad y arbitrary values de zinc/black — mismo criterio. */
    .tenant-infinity .border-zinc-800\/80,
    .tenant-infinity .border-black\/20,
    .tenant-infinity .border-black\/40 { border-color: rgba(17, 24, 39, 0.10) !important; }

    /* Chip / pill con background:var(--gold-glow) en inline style.
       En Infinity var(--gold-glow) = rgba(255,255,255,0.8) → blanco
       casi opaco sobre blanco = invisible. Cualquier elemento con ese
       inline lo forzamos a tinte navy suave y le damos borde. */
    .tenant-infinity [style*="background:var(--gold-glow)"],
    .tenant-infinity [style*="background: var(--gold-glow)"] {
      background: rgba(17, 24, 39, 0.06) !important;
      border-color: rgba(17, 24, 39, 0.15) !important;
    }


    /* ── Rangos: badge "Tu rango" + tier-badge Silver/Platinum ──
       El chip "Tu rango" usa background:var(--gold-glow) que en
       Infinity es rgba(255,255,255,0.8) (blanco casi opaco) →
       invisible sobre fondo blanco. Lo repintamos como pill
       navy sólido con texto blanco.
       Silver #aaa y Platinum #e8d5ff quedaban imperceptibles;
       les damos bordes navy con fill sutil. */
    .tenant-infinity .tier-current-label {
      background: #111827 !important;
      color: #ffffff !important;
      border: 1px solid #111827 !important;
      box-shadow: 0 2px 6px rgba(17, 24, 39, 0.20) !important;
    }
    .tenant-infinity .tier-badge {
      background: rgba(17, 24, 39, 0.04) !important;
    }
    .tenant-infinity .tier-badge.silver {
      color: #475569 !important;
      border-color: rgba(17, 24, 39, 0.20) !important;
    }
    .tenant-infinity .tier-badge.gold {
      color: #111827 !important;
      border-color: rgba(17, 24, 39, 0.30) !important;
      background: rgba(17, 24, 39, 0.06) !important;
    }
    .tenant-infinity .tier-badge.platinum {
      color: #6b21a8 !important;
      border-color: rgba(107, 33, 168, 0.35) !important;
      background: rgba(107, 33, 168, 0.06) !important;
    }
    /* Highlight de la fila del rango activo — subir contraste del contenedor */
    .tenant-infinity .tier-row[data-tier].tier-active,
    .tenant-infinity .tier-row:has(.tier-current-label:not(.hidden)) {
      background: rgba(17, 24, 39, 0.06) !important;
      border-color: rgba(17, 24, 39, 0.15) !important;
    }

    /* ── Aviso "Completa tu fecha de nacimiento" ──
       Fondo amarillo amber (rgba(234,179,8,0.08)) queda estridente
       sobre blanco. Lo convertimos a soft alert navy/slate. */
    .tenant-infinity #perfilIncompletoAviso {
      background: rgba(17, 24, 39, 0.04) !important;
      border-color: rgba(17, 24, 39, 0.12) !important;
    }
    .tenant-infinity #perfilIncompletoAviso i { color: #6b7280 !important; }
    .tenant-infinity #perfilIncompletoMsg { color: #374151 !important; }

    /* ── Input "Nombre o correo del amigo" (buscador de amigo) ──
       El inline style forzaba background:#111118 + color:#ffffff
       (caja negra con texto blanco). En Infinity queda un boquete
       oscuro que rompe la estética minimalista. */
    .tenant-infinity #amigoEmailInput {
      background: #ffffff !important;
      border: 1px solid rgba(17, 24, 39, 0.12) !important;
      color: #111827 !important;
      caret-color: #111827 !important;
      box-shadow: inset 0 1px 2px rgba(0,0,0,0.02) !important;
    }
    .tenant-infinity #amigoEmailInput::placeholder { color: #9CA3AF !important; }
    .tenant-infinity #amigoEmailInput:focus {
      border-color: #111827 !important;
      box-shadow: 0 0 0 1px #111827 !important;
    }
    /* Botón "Buscar" — inline usa var(--gold-glow) (blanco/80) sobre
       blanco = invisible. Lo pasamos a solid navy con texto blanco. */
    .tenant-infinity button[onclick="buscarAmigo()"] {
      background: #111827 !important;
      color: #ffffff !important;
      border-color: #111827 !important;
      box-shadow: 0 4px 12px rgba(17, 24, 39, 0.15) !important;
    }
    .tenant-infinity button[onclick="buscarAmigo()"]:hover {
      background: #374151 !important;
      border-color: #374151 !important;
    }

    /* ── Tarjeta "Comparar con un amigo" — mismo patrón que otros
       cards de sección: subir un pelo el borde para separarla
       visualmente del fondo blanco. */
    .tenant-infinity #profileCompareSection > .rounded-2xl {
      background: rgba(17, 24, 39, 0.03) !important;
      border-color: rgba(17, 24, 39, 0.08) !important;
    }

    /* ── Calificanos en Google (googleReviewCard) ──────────────────
       Fondo original: linear-gradient(145deg,#0d1b3e,#0a1a10,#2a1200)
       (dark navy/verde/rojo). Con text-white override quedaba caja
       oscura + navy encima = ilegible. */
    .tenant-infinity #googleReviewCardBtn {
      background: #ffffff !important;
      border-color: rgba(66,133,244,0.30) !important;
      box-shadow: 0 0 0 1px rgba(52,168,83,0.10),
                  0 6px 20px rgba(66,133,244,0.10),
                  0 2px 6px rgba(0,0,0,0.03) !important;
    }
    .tenant-infinity #googleReviewCardBtn .text-white {
      color: #111827 !important;
    }
    /* Subtexto inline color:rgba(255,255,255,0.50) */
    .tenant-infinity #googleReviewCardBtn p[style*="rgba(255,255,255,0.50)"] {
      color: #4B5563 !important;
    }
    /* Ícono arrow-square-out (Google blue original 0.7) */
    .tenant-infinity #googleReviewCardBtn i.ph-arrow-square-out {
      color: rgba(66,133,244,0.85) !important;
    }
    /* Separador tricolor Google — bajarle la intensidad para light */
    .tenant-infinity #googleReviewCardBtn div[style*="linear-gradient(90deg,rgba(66,133,244"] {
      background: linear-gradient(90deg,
        rgba(66,133,244,0.35),
        rgba(52,168,83,0.35),
        rgba(251,188,4,0.55),
        rgba(234,67,53,0.35)) !important;
    }

    /* ── Próximo Premio card + botón "Ver premios" ────────────────
       .next-reward-card usa bg-[#111115] border-white/8. Ya cubierto
       parcialmente por overrides genéricos, pero el border/8 y el
       botón blanco (bg-white text-[#050505]) sobre bg blanco quedaba
       invisible. */
    .tenant-infinity .next-reward-card {
      background: #ffffff !important;
      border-color: rgba(17,24,39,0.08) !important;
      box-shadow: 0 1px 2px rgba(0,0,0,0.03) !important;
    }
    /* Ícono trophy dentro del avatar */
    .tenant-infinity .next-reward-card .rounded-full.bg-\[\#1a1a1a\] {
      background: rgba(17,24,39,0.04) !important;
      border-color: rgba(17,24,39,0.10) !important;
    }
    .tenant-infinity .next-reward-card .premio-icon {
      color: #b45309 !important; /* amber-700, se lee sobre blanco */
    }
    /* Botón "Ver premios": era bg-white text-[#050505] → sobre bg
       blanco quedaba invisible. Lo pasamos a navy sólido con texto blanco. */
    .tenant-infinity button[onclick="togglePremios()"].bg-white,
    .tenant-infinity .next-reward-card button {
      background: #111827 !important;
      color: #ffffff !important;
      border: none !important;
      box-shadow: 0 2px 8px rgba(17,24,39,0.15) !important;
    }
    .tenant-infinity button[onclick="togglePremios()"]:hover,
    .tenant-infinity .next-reward-card button:hover {
      background: #374151 !important;
    }

    /* ── Tabla de Premios (heading) ────────────────────────────────
       Inline color:rgba(255,255,255,0.3) sobre bg blanco = invisible. */
    .tenant-infinity #premiosSection h3 {
      color: rgba(17,24,39,0.55) !important;
    }
    /* Spinner de carga dentro de premiosList */
    .tenant-infinity #premiosList .border-white\/20 {
      border-color: rgba(17,24,39,0.15) !important;
    }
    .tenant-infinity #premiosList .border-t-white {
      border-top-color: #111827 !important;
    }

    /* ── "Rango" card (dentro de #profileVisitasCard / Mi Perfil) ──
       Fondo linear-gradient dark con badge y label ilegibles. */
    .tenant-infinity div[style*="background:linear-gradient(135deg,var(--gold-glow)"] {
      background: rgba(17,24,39,0.04) !important;
      border: 1px solid rgba(17,24,39,0.08) !important;
    }
    .tenant-infinity #profileTierBadge {
      color: #111827 !important;
    }
    /* Cards de Visitas y Sellos (bg-zinc-900) — el override genérico
       bg-zinc-900 ya los pinta claros, pero el text-white/50 del contador
       de Sellos quedaba muy tenue sobre blanco. */
    .tenant-infinity #profileStamps {
      color: rgba(17,24,39,0.65) !important;
    }
    .tenant-infinity #profileVisitsCount {
      color: #111827 !important;
    }

    /* ── "Tu foto favorita" — CARD PADRE (#servicioFavoritoCard) ──
       El card wrapper usa bg-[#111115] border-white/8 → quedaba
       negro absoluto. El fix anterior sólo pintaba el hijo #sfNoPhoto.
       Ahora arreglamos el card completo. */
    .tenant-infinity #servicioFavoritoCard {
      background: #ffffff !important;
      border-color: rgba(17,24,39,0.08) !important;
      box-shadow: 0 1px 2px rgba(0,0,0,0.03) !important;
    }
    /* Botón "Cambiar foto" con text-white/30 → invisible sobre blanco */
    .tenant-infinity #btnSfCambiar {
      color: rgba(17,24,39,0.55) !important;
    }
    .tenant-infinity #btnSfCambiar:hover {
      color: #111827 !important;
    }
    /* Placeholder de subir foto (sfNoPhoto): dashed border + ícono cámara */
    .tenant-infinity #sfNoPhoto div[style*="border-color:var(--gold-dim)"] {
      border-color: rgba(17,24,39,0.20) !important;
    }
    .tenant-infinity #sfNoPhoto i.ph-camera {
      color: rgba(17,24,39,0.55) !important;
      opacity: 1 !important;
    }
    .tenant-infinity #sfNoPhoto p[style*="color:var(--gold)"] {
      color: #111827 !important;
      opacity: 1 !important;
    }
    /* Botones Encuadre / Compartir Story (bg-white/5 border-white/10) */
    .tenant-infinity #sfWithPhoto button {
      background: rgba(17,24,39,0.04) !important;
      border-color: rgba(17,24,39,0.10) !important;
    }
    .tenant-infinity #sfWithPhoto button:hover {
      border-color: rgba(17,24,39,0.25) !important;
    }

    /* ── Premios individuales (renderizados dinámicos en #premiosList) ──
       Cada item usa bg-[#111115] border-white/8. Al ser generado por JS,
       el bloque anterior sólo cubría el spinner; los premios reales
       quedaban negros con texto navy encima. */
    .tenant-infinity #premiosList > div {
      background: #ffffff !important;
      border-color: rgba(17,24,39,0.08) !important;
      box-shadow: 0 1px 2px rgba(0,0,0,0.03) !important;
    }
    .tenant-infinity #premiosList > div:hover {
      border-color: rgba(17,24,39,0.20) !important;
    }
    .tenant-infinity #premiosList > div .bg-white\/10 {
      background: rgba(17,24,39,0.10) !important;
    }
    /* Contador de sellos (número grande) */
    .tenant-infinity #premiosList > div span.text-white {
      color: #111827 !important;
    }
    .tenant-infinity #premiosList > div p.text-white {
      color: #111827 !important;
    }
    .tenant-infinity #premiosList > div .text-white\/30 {
      color: rgba(17,24,39,0.55) !important;
    }
    .tenant-infinity #premiosList > div .text-white\/20 {
      color: rgba(17,24,39,0.35) !important;
    }

    /* ── Empty state de "Mis Citas" (Aún no tienes citas registradas...) ──
       Card bg-zinc-900 ya mapea a bg claro via override genérico. Faltaba:
       ícono text-white/10 (invisible), texto text-zinc-500 (OK) y botón
       .btn-reservar con inline background:var(--gold);color:#050505; que
       en Infinity da navy sobre navy (ilegible). */
    .tenant-infinity #profileCitasContent i.ph-calendar-x {
      color: rgba(17,24,39,0.20) !important;
      opacity: 1 !important;
    }
    .tenant-infinity #profileCitasContent .text-zinc-500 {
      color: #4B5563 !important;
    }
    .tenant-infinity .btn-reservar,
    .tenant-infinity #profileCitasContent a[href="index.html"] {
      background: #111827 !important;
      color: #FFFFFF !important;
      box-shadow: 0 2px 8px rgba(17,24,39,0.15) !important;
    }
    .tenant-infinity .btn-reservar:hover,
    .tenant-infinity #profileCitasContent a[href="index.html"]:hover {
      background: #374151 !important;
    }

    /* ── Legal: Política de Privacidad + Términos y Condiciones ───
       El fix anterior scopeaba a #profileTab que NO EXISTE. Los <a>
       viven directo en el DOM sin ancestor con ID. Los targeteamos
       por href (solo hay 2 links en la página). */
    .tenant-infinity a[href="privacidad.html"] {
      background: #ffffff !important;
      border-color: rgba(17,24,39,0.08) !important;
      box-shadow: 0 1px 2px rgba(0,0,0,0.03) !important;
    }
    .tenant-infinity a[href="privacidad.html"]:hover {
      border-color: rgba(17,24,39,0.20) !important;
    }
    .tenant-infinity a[href="privacidad.html"] .text-gray-500 {
      color: #6b7280 !important;
    }
    .tenant-infinity a[href="privacidad.html"] .text-white {
      color: #111827 !important;
    }
    .tenant-infinity a[href="privacidad.html"] .text-gray-600 {
      color: #9ca3af !important;
    }

    /* ── Canje Modal — bloque INTERIOR de instrucciones (bg-[#1a1a1f]) ──
       Fondo negro con íconos dorados #D4AF37 y textos text-gray-300.
       El card externo ya estaba mapeado; faltaba el pill de instrucciones. */
    .tenant-infinity #canjeInfoState .bg-\[\#1a1a1f\] {
      background: rgba(17,24,39,0.03) !important;
      border-color: rgba(17,24,39,0.10) !important;
    }
    /* Ícono redondo (trophy/gift) del header del canje modal — usa inline
       background:rgba(212,175,55,0.12); border rgba(212,175,55,0.3) */
    .tenant-infinity #canjeCategoryIcon {
      background: rgba(17,24,39,0.06) !important;
      border-color: rgba(17,24,39,0.15) !important;
    }
    .tenant-infinity #canjeCategoryIcon i,
    .tenant-infinity #canjeModalSubtitle,
    .tenant-infinity #canjeInfoState i[style*="color:#D4AF37"] {
      color: #111827 !important;
    }
    /* Textos "Vamos a generarte...", "Muéstraselo al barbero...",
       "Los sellos solo se descuentan..." (text-gray-300) */
    .tenant-infinity #canjeInfoState .text-gray-300 {
      color: #374151 !important;
    }
    .tenant-infinity #canjeInfoState strong {
      color: #111827 !important;
    }
    /* Aviso "canje asistido" — inline background rgba(212,175,55,0.06) */
    .tenant-infinity #canjeAutoAviso {
      background: rgba(17,24,39,0.04) !important;
      border-color: rgba(17,24,39,0.15) !important;
    }
    .tenant-infinity #canjeAutoAviso i {
      color: #111827 !important;
    }
    .tenant-infinity #canjeAutoAviso .text-white {
      color: #111827 !important;
    }
    .tenant-infinity #canjeAutoAviso .text-white\/60 {
      color: #4B5563 !important;
    }

    /* ── Onboarding hint "Cada visita a la barbería suma un sello..." ──
       Inline: bg rgba(255,255,255,0.03), border rgba(255,255,255,0.07),
       texto color:rgba(255,255,255,0.4), <span> font-bold text-white/70.
       Todo blanco → invisible sobre fondo blanco. */
    .tenant-infinity #sellosOnboarding {
      background: rgba(17,24,39,0.04) !important;
      border-color: rgba(17,24,39,0.10) !important;
    }
    .tenant-infinity #sellosOnboarding i {
      color: #111827 !important;
      opacity: 1 !important;
    }
    .tenant-infinity #sellosOnboarding p[style*="rgba(255,255,255,0.4)"] {
      color: #374151 !important;
    }
    .tenant-infinity #sellosOnboarding #onboardingMeta {
      color: #111827 !important;
    }

    /* ── Modal Equipo (#equipoModal) — cards de barberos ──
       Skeleton bg-zinc-900 ya se traduce a claro por override genérico
       (línea 3122). El header + subtitle usan text-white/25 y color:
       var(--gold). */
    .tenant-infinity #equipoModal h3,
    .tenant-infinity #equipoModal p[style*="color:var(--gold)"] {
      color: #111827 !important;
    }
    .tenant-infinity #equipoModal .text-white\/25 {
      color: rgba(17,24,39,0.45) !important;
    }
    .tenant-infinity #equipoModal .bg-white\/6 {
      background: rgba(17,24,39,0.06) !important;
    }
    .tenant-infinity #equipoModal .bg-white\/15 {
      background: rgba(17,24,39,0.20) !important;
    }
    /* Cards internas de barberos generadas por JS — el bg claro
       ya está cubierto por bg-zinc-900 genérico. Aseguramos que
       el texto y los avatars queden legibles. */
    .tenant-infinity #equipoGrid > div {
      background: #ffffff !important;
      border: 1px solid rgba(17,24,39,0.08) !important;
      box-shadow: 0 1px 2px rgba(0,0,0,0.03) !important;
    }
    .tenant-infinity #equipoGrid > div .text-white {
      color: #111827 !important;
    }
    .tenant-infinity #equipoGrid > div p,
    .tenant-infinity #equipoGrid > div span {
      color: #4B5563 !important;
    }
    /* Botón de cerrar el modal — inline bg-white/6 border-white/10 */
    .tenant-infinity button[onclick="cerrarEquipoModal()"] {
      background: rgba(17,24,39,0.06) !important;
      border-color: rgba(17,24,39,0.12) !important;
    }
    .tenant-infinity button[onclick="cerrarEquipoModal()"] i {
      color: #111827 !important;
    }

    /* ══════════════════════════════════════════════════════════
       OMEGA STUDIO — tenant-omegastudio
       Champán #d4a96a sobre fondo oscuro #0c0c0e
    ══════════════════════════════════════════════════════════ */

    /* ── Variables & fondo ── */
    .tenant-omegastudio {
      --gold:      #d4a96a;
      --gold-dim:  rgba(212,169,106,0.30);
      --gold-glow: rgba(212,169,106,0.14);
      --accent:    #d4a96a;
      --accent-r:  212; --accent-g: 169; --accent-b: 106;
    }
    html.tenant-omegastudio body { background-color: #0c0c0e !important; }

    /* ── Hero banner: interior de Omega Studio ── */
    .tenant-omegastudio .hero-bg {
      background-image: url('/omega2.avif');
      background-size: cover;
      background-position: center;
    }
    .tenant-omegastudio .hero-overlay {
      background: linear-gradient(160deg,
        rgba(0,0,0,0.25) 0%,
        rgba(0,0,0,0.60) 45%,
        rgba(0,0,0,0.88) 100%);
    }
    .tenant-omegastudio .hero-glow-spot {
      background: radial-gradient(circle, rgba(212,169,106,0.10) 0%, transparent 65%) !important;
    }
    .tenant-omegastudio #heroLine2 { color: #d4a96a !important; font-style: normal !important; }

    /* ── Sello lleno: champán ── */
    .tenant-omegastudio .stamp-cell.filled {
      background: #d4a96a !important;
      border: 1px solid #d4a96a !important;
      box-shadow: 0 0 10px rgba(212,169,106,0.35) !important;
    }
    .tenant-omegastudio .stamp-cell.filled i { color: #0c0c0e !important; }

    /* ── Sello vacío: hendidura con relieve interior ── */
    .tenant-omegastudio .stamp-cell.empty {
      background: rgba(255,255,255,0.03) !important;
      border: 1px solid rgba(255,255,255,0.06) !important;
      box-shadow: inset 0 2px 4px rgba(0,0,0,0.55), inset 0 0 0 1px rgba(0,0,0,0.30) !important;
    }

    /* ── Próximo sello: resplandor champán para incentivar ── */
    .tenant-omegastudio .stamp-cell.stamp-next {
      border: 1.5px solid rgba(212,169,106,0.55) !important;
      box-shadow:
        inset 0 2px 4px rgba(0,0,0,0.40),
        0 0 10px rgba(212,169,106,0.28),
        0 0 20px rgba(212,169,106,0.12) !important;
      background: rgba(212,169,106,0.06) !important;
      animation: omega-next-pulse 2.4s ease-in-out infinite !important;
    }
    @keyframes omega-next-pulse {
      0%, 100% { box-shadow: inset 0 2px 4px rgba(0,0,0,0.40), 0 0 8px rgba(212,169,106,0.22), 0 0 18px rgba(212,169,106,0.08); }
      50%       { box-shadow: inset 0 2px 4px rgba(0,0,0,0.40), 0 0 14px rgba(212,169,106,0.42), 0 0 28px rgba(212,169,106,0.18); }
    }

    /* ── Premio vacío: icono atenuado ── */
    .tenant-omegastudio .stamp-cell.prize-empty i { opacity: 0.35 !important; }
    .tenant-omegastudio .stamp-cell.prize-filled {
      background: #d4a96a !important;
      border: 1px solid #d4a96a !important;
      box-shadow: 0 0 14px rgba(212,169,106,0.45) !important;
    }
    .tenant-omegastudio .stamp-cell.prize-filled i { color: #0c0c0e !important; opacity: 1 !important; }

    /* ── Barra de sellos ── */
    .tenant-omegastudio #stampsBar {
      background: linear-gradient(90deg, #d4a96a, #c08040) !important;
      box-shadow: 0 0 8px rgba(212,169,106,0.35) !important;
    }

    /* ── PWA install card: peso reducido (sin borde dorado prominente) ── */
    .tenant-omegastudio #pwaBigInstallCard {
      background: linear-gradient(to right, rgba(212,169,106,0.07), rgba(212,169,106,0.02)) !important;
      border: 1px solid rgba(212,169,106,0.18) !important;
      box-shadow: none !important;
    }
    .tenant-omegastudio .pwa-icon-bg {
      background: rgba(212,169,106,0.08) !important;
      border: 1px solid rgba(212,169,106,0.18) !important;
      box-shadow: none !important;
    }
    .tenant-omegastudio #pwaBanner { border-color: rgba(212,169,106,0.22) !important; }

    /* ── Próximo premio: texto sin corte ── */
    .tenant-omegastudio #nextRewardText {
      white-space: normal !important;
      overflow: visible !important;
      text-overflow: unset !important;
      font-size: 0.75rem !important;
      line-height: 1.4 !important;
    }

    /* ── Inputs del perfil: borde visible + focus champán ── */
    .tenant-omegastudio #editNombre,
    .tenant-omegastudio #editTelefono,
    .tenant-omegastudio #editFechaNacimiento {
      border-color: rgba(212,169,106,0.20) !important;
    }
    .tenant-omegastudio #editNombre:focus,
    .tenant-omegastudio #editTelefono:focus,
    .tenant-omegastudio #editFechaNacimiento:focus {
      border-color: #d4a96a !important;
      box-shadow: 0 0 0 2px rgba(212,169,106,0.18) !important;
    }

    /* ── Tier badge Silver: gradiente metálico ── */
    .tenant-omegastudio .tier-badge.silver {
      color: #d4d4d4 !important;
      border-color: rgba(200,200,200,0.28) !important;
      background: linear-gradient(135deg,
        rgba(220,220,230,0.14) 0%,
        rgba(180,180,195,0.06) 50%,
        rgba(220,220,230,0.10) 100%) !important;
      box-shadow: inset 0 1px 0 rgba(255,255,255,0.08) !important;
    }
    .tenant-omegastudio .tier-badge.gold {
      color: #d4a96a !important;
      border-color: rgba(212,169,106,0.30) !important;
      background: linear-gradient(135deg, rgba(212,169,106,0.14) 0%, rgba(212,169,106,0.04) 100%) !important;
      box-shadow: 0 2px 8px rgba(212,169,106,0.12) !important;
    }
    .tenant-omegastudio .tier-badge.platinum {
      color: #e8d5ff !important;
      border-color: rgba(216,180,254,0.35) !important;
    }

    /* ═══ THE LATIN CARIBE — dashboard: banner propio + paleta del logo ═══ */
    /* Acento de marca (cian) en vez del navy heredado de Aura */
    .tenant-latincaribe {
      --gold:      #0FA0A8;
      --gold-dim:  rgba(15,160,168,0.12);
      --gold-glow: rgba(53,221,230,0.18);
    }
    /* Banner: la imagen se pinta en ::before (Ken Burns) → ahí va la foto del local */
    .tenant-latincaribe .hero-bg::before {
      background-image: url('/thelatin/image.webp') !important;
      background-position: center !important;
    }
    /* Overlay oscuro neutro (en vez del azul marino de Aura) */
    .tenant-latincaribe .hero-overlay {
      background: linear-gradient(to top, rgba(10,10,12,0.92) 0%, rgba(10,10,12,0.30) 100%) !important;
    }
    .tenant-latincaribe .hero-glow-spot {
      background: radial-gradient(circle, rgba(53,221,230,0.22) 0%, transparent 65%) !important;
    }
    /* Segunda línea de la frase en cian de marca */
    .tenant-latincaribe #heroLine2 { color: #35DDE6 !important; }
    /* CTA "Reservar mi cita": texto/ícono y borde en cian de marca */
    .tenant-latincaribe .hero-cta { border-color: rgba(15,160,168,0.45) !important; }
    .tenant-latincaribe .hero-cta i,
    .tenant-latincaribe .hero-cta span { color: #0B8A91 !important; }
    /* Acentos navy → cian de marca */
    .tenant-latincaribe #shopClubName  { color: #0B8A91 !important; }
    .tenant-latincaribe #shopHeaderSub { color: rgba(11,138,145,0.6) !important; }
    /* Sellos: celda llena oscura para lucir la bola de billar + barra cian→rosa */
    .tenant-latincaribe .stamp-cell.filled {
      background: #0a0a0e !important; border-color: #0a0a0e !important;
      box-shadow: 0 0 8px rgba(53,221,230,0.40) !important;
    }
    .tenant-latincaribe #stampsBar {
      background: linear-gradient(90deg, #35DDE6, #F35BA6) !important;
    }

    /* ══════════════════════════════════════════════════════════════════
     * RENACER — pulido visual del /dashboard (Obsidian & Warm Amber)
     * ──────────────────────────────────────────────────────────────────
     * Renacer hereda el tema Elegance vía _themeAlias, por lo que sin
     * este bloque el hero muestra /elegance.png (leak) y los acentos
     * quedan en dorado antiguo. Aquí SOLO tocamos color, fondo, bordes
     * y tipografía — NUNCA layout, orden o posicionamiento.
     * ══════════════════════════════════════════════════════════════════ */

    /* Paleta base — acento ámbar cálido (amber-500 de Tailwind) */
    .tenant-renacer {
      --gold:      #F59E0B;
      --gold-dim:  rgba(245,158,11,0.30);
      --gold-glow: rgba(245,158,11,0.10);
    }
    html.tenant-renacer body      { background-color: #0a0806; }
    .tenant-renacer #authGuard    { background: #0a0806 !important; }
    .tenant-renacer header {
      background-color: rgba(10,8,6,0.96) !important;
      border-bottom: 1px solid rgba(255,255,255,0.06) !important;
    }

    /* 1) Fondo del hero: piso /elegance.png con banner propio del local.
       Selectores defensivos por si alguna vista usa otras clases. */
    .tenant-renacer .hero-bg,
    .tenant-renacer .club-hero,
    .tenant-renacer .dashboard-promo-banner,
    .tenant-renacer .booking-hero {
      background-image: url('/renacer/banner.webp') !important;
      background-size: cover !important;
      background-position: center !important;
      background-color: #0a0806 !important;
    }
    .tenant-renacer .hero-overlay {
      background: linear-gradient(160deg,
        rgba(0,0,0,0.35) 0%,
        rgba(10,8,6,0.60) 45%,
        rgba(10,8,6,0.92) 100%) !important;
    }
    .tenant-renacer .hero-glow-spot {
      background: radial-gradient(circle, rgba(245,158,11,0.10) 0%, transparent 65%) !important;
    }
    .tenant-renacer .hero-cta {
      background: rgba(10,8,6,0.65) !important;
      border-color: rgba(245,158,11,0.42) !important;
      box-shadow: 0 0 18px rgba(245,158,11,0.10) !important;
    }
    .tenant-renacer .hero-cta i,
    .tenant-renacer .hero-cta span { color: #F59E0B !important; }

    /* 2) Botones/bloques de información — obsidiana con hover ámbar,
       reemplazando el azul estándar heredado y el dorado antiguo. */
    .tenant-renacer #sellosOnboarding,
    .tenant-renacer #canjeAutoAviso,
    .tenant-renacer .info-btn {
      background: rgba(18,14,12,0.90) !important;
      border: 1px solid rgba(115,115,115,0.28) !important;   /* neutral-700/70 */
      color: #d4d4d4 !important;                              /* neutral-300 */
      transition: color .2s ease, border-color .2s ease;
    }
    .tenant-renacer #sellosOnboarding i,
    .tenant-renacer #canjeAutoAviso i,
    .tenant-renacer .info-btn i { color: #d4d4d4 !important; }
    .tenant-renacer .info-btn:hover {
      color: #F59E0B !important;
      border-color: rgba(245,158,11,0.50) !important;
    }

    /* 3) Tarjetas / superficies — obsidiana premium con borde sutil,
       sin sombras pesadas. Aplica a recordatorios, PWA card e íconos. */
    .tenant-renacer #notifBanner,
    .tenant-renacer #pwaBigInstallCard,
    .tenant-renacer #perfilIncompletoAviso {
      background: rgba(18,14,12,0.90) !important;
      border-color: rgba(38,38,38,0.85) !important;          /* neutral-800/80 */
      box-shadow: none !important;
    }
    .tenant-renacer .pwa-icon-bg {
      background: rgba(245,158,11,0.08) !important;
      border-color: rgba(245,158,11,0.22) !important;
      box-shadow: none !important;
    }
    .tenant-renacer #perfilIncompletoAviso i,
    .tenant-renacer #perfilIncompletoMsg { color: rgba(245,158,11,0.90) !important; }

    /* 4) Acentos ámbar en fidelización — sellos, barra de progreso y
       textos destacados heredan el warm amber de la marca. */
    .tenant-renacer #stampsBar {
      background: #F59E0B !important;
      box-shadow: 0 0 10px rgba(245,158,11,0.45) !important;
    }
    .tenant-renacer .stamp-cell.filled {
      background: #F59E0B !important;
      border: 1px solid #F59E0B !important;
      box-shadow: 0 0 6px rgba(245,158,11,0.35) !important;
    }
    .tenant-renacer .stamp-cell.filled i { color: #0a0806 !important; }
    .tenant-renacer .premio-icon { color: #F59E0B !important; }
    .tenant-renacer .text-gold   { color: #F59E0B !important; text-shadow: none !important; }
    .tenant-renacer .border-gold { border-color: rgba(245,158,11,0.35) !important; box-shadow: none !important; }
    .tenant-renacer .membership-glow {
      background: radial-gradient(circle, rgba(245,158,11,0.05) 0%, transparent 70%) !important;
    }
    .tenant-renacer #membershipWatermark { color: rgba(245,158,11,0.05) !important; }
    .tenant-renacer input:focus {
      border-color: #F59E0B !important;
      --tw-ring-color: rgba(245,158,11,0.35) !important;
      box-shadow: 0 0 0 1px rgba(245,158,11,0.35) !important;
    }

    /* 5) Tipografía — títulos principales nítidos en blanco puro,
       secundarios en gris neutro no fatigante. */
    .tenant-renacer #shopClubName,
    .tenant-renacer #stampsCount,
    .tenant-renacer #heroLine1 {
      color: #ffffff !important;
      font-weight: 800 !important;
    }
    .tenant-renacer #heroLine2  { color: #F59E0B !important; font-weight: 700 !important; }
    .tenant-renacer #membershipDesc,
    .tenant-renacer #notifBannerText,
    .tenant-renacer #shopHeaderSub { color: #a3a3a3 !important; }  /* neutral-400 */

    /* 6) Badge SILVER como insignia metálica elegante. Se mantienen
       gold/platinum del sistema por si el cliente escala rangos. */
    .tenant-renacer .tier-badge.silver {
      background: #262626 !important;                        /* neutral-800 */
      color: #d4d4d4 !important;                             /* neutral-300 */
      border: 1px solid rgba(115,115,115,0.55) !important;   /* neutral-600/55 */
      font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace !important;
      font-size: 10px !important;
      letter-spacing: 0.14em !important;
      padding: 2px 8px !important;
      border-radius: 4px !important;
    }
    .tenant-renacer .tier-badge.gold {
      color: #F59E0B !important;
      border-color: rgba(245,158,11,0.40) !important;
    }
    .tenant-renacer .tier-badge.platinum {
      color: #e5e5e5 !important;
      border-color: rgba(229,229,229,0.45) !important;
    }