/**
 * TixKart light aurora theme — Stitch light variant.
 * Tokens in tokens.css section 13; shared components in main.css + light-surface.css.
 */
@import url('./tokens.css');

html:has(body.tk-light),
html:has(body.hp-preview-light) {
  background: var(--light-aurora-lavender) !important;
  background-image: none !important;
  scroll-behavior: smooth;
}

:is(body.tk-light, body.hp-preview-light) {
  color: var(--text-primary);
  background: transparent !important;
}

:is(body.tk-light, body.hp-preview-light) .bg-orbs {
  display: none !important;
}

:is(body.tk-light, body.hp-preview-light) .hp-holo-grid,
:is(body.tk-light, body.hp-preview-light) .hp-holo-prism,
:is(body.tk-light, body.hp-preview-light) .hp-holo-scan {
  display: none !important;
}

/* ── Fixed light aurora ── */
:is(body.tk-light, body.hp-preview-light) .hp-aurora {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  height: 100dvh;
  z-index: 0;
  pointer-events: none;
  overflow: hidden;
  background: radial-gradient(
    ellipse 110% 85% at 50% -8%,
    var(--light-aurora-pink) 0%,
    var(--light-aurora-lavender) 42%,
    #f5f3ff 68%,
    var(--light-aurora-cream) 100%
  );
}

:is(body.tk-light, body.hp-preview-light) .hp-aurora-mesh {
  position: absolute;
  inset: -25%;
  background:
    radial-gradient(ellipse 52% 42% at 18% 28%, rgba(236, 72, 153, 0.28), transparent 58%),
    radial-gradient(ellipse 48% 38% at 78% 22%, rgba(139, 92, 246, 0.22), transparent 55%),
    radial-gradient(ellipse 42% 46% at 62% 68%, rgba(251, 191, 36, 0.18), transparent 52%),
    radial-gradient(ellipse 36% 32% at 28% 72%, rgba(244, 114, 182, 0.16), transparent 50%);
  animation: tk-aurora-drift 22s ease-in-out infinite;
}

:is(body.tk-light, body.hp-preview-light) .hp-aurora-streak {
  position: absolute;
  top: 8%;
  left: -20%;
  width: 140%;
  height: 48%;
  background: linear-gradient(
    115deg,
    transparent 5%,
    rgba(236, 72, 153, 0.22) 25%,
    rgba(167, 139, 250, 0.16) 42%,
    rgba(251, 191, 36, 0.12) 52%,
    transparent 85%
  );
  transform: rotate(-7deg);
  filter: blur(36px);
  animation: tk-streak-pulse 12s ease-in-out infinite;
}

:is(body.tk-light, body.hp-preview-light) .hp-aurora-streak--2 {
  top: 24%;
  height: 32%;
  opacity: 0.85;
  transform: rotate(-4deg);
  animation-delay: -5s;
  background: linear-gradient(
    120deg,
    transparent 10%,
    rgba(124, 58, 237, 0.16) 40%,
    rgba(236, 72, 153, 0.12) 55%,
    transparent 78%
  );
}

:is(body.tk-light, body.hp-preview-light) .hp-aurora-beam {
  position: absolute;
  top: 0;
  right: -10%;
  width: 55%;
  height: 65%;
  background: conic-gradient(
    from 200deg,
    transparent,
    rgba(236, 72, 153, 0.1),
    rgba(251, 191, 36, 0.08),
    transparent
  );
  filter: blur(52px);
  animation: tk-beam-sweep 18s ease-in-out infinite;
}

:is(body.tk-light, body.hp-preview-light) .hp-aurora-grain {
  position: absolute;
  inset: 0;
  opacity: 0.035;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  mix-blend-mode: multiply;
}

:is(body.tk-light, body.hp-preview-light) .hp-scroll-surface {
  position: relative;
  z-index: 1;
}

@keyframes tk-aurora-drift {
  0%, 100% { transform: translate(0, 0) scale(1); }
  50% { transform: translate(1.5%, -1%) scale(1.03); }
}
@keyframes tk-streak-pulse {
  0%, 100% { opacity: 0.75; }
  50% { opacity: 1; }
}
@keyframes tk-beam-sweep {
  0%, 100% { transform: rotate(0deg); opacity: 0.7; }
  50% { transform: rotate(4deg); opacity: 1; }
}

/* ── Header & nav ── */
:is(body.tk-light, body.hp-preview-light) .site-header {
  top: env(safe-area-inset-top, 0);
  z-index: 200;
  isolation: isolate;
  width: 100%;
  max-width: none;
  margin: 0;
  border-radius: var(--header-border-radius);
  border-left: none;
  border-right: none;
  border-top: none;
  background: var(--header-light-bg);
  backdrop-filter: blur(16px);
  border-bottom: 1px solid var(--header-light-border);
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.8);
}

:is(body.tk-light, body.hp-preview-light) .nav-links a:hover {
  color: var(--nav-link-hover);
}

:is(body.tk-light, body.hp-preview-light) .nav-ghost {
  color: var(--text-primary) !important;
  border-color: rgba(15, 23, 42, 0.12) !important;
  background: rgba(255, 255, 255, 0.65) !important;
}

:is(body.tk-light, body.hp-preview-light) .nav-btn {
  background: var(--light-gradient-btn) !important;
  color: var(--color-white) !important;
  border: none !important;
  box-shadow: var(--btn-primary-shadow);
}

:is(body.tk-light, body.hp-preview-light) .nav-menu-bar {
  background: var(--nav-menu-light-bg);
  border-top-color: var(--header-light-border);
  backdrop-filter: blur(12px);
}

:is(body.tk-light, body.hp-preview-light) .nav-menu-list a:hover,
:is(body.tk-light, body.hp-preview-light) .nav-menu-list a.active {
  color: var(--color-magenta-dark);
  background: var(--surface-accent);
}

:is(body.tk-light, body.hp-preview-light) .nav-toggle-bar {
  background: var(--text-primary);
}

/* ── Typography ── */
:is(body.tk-light, body.hp-preview-light) .section-title,
:is(body.tk-light, body.hp-preview-light) .center-title,
:is(body.tk-light, body.hp-preview-light) .hero-copy h1 {
  color: var(--text-heading);
}

:is(body.tk-light, body.hp-preview-light) .hero-lead,
:is(body.tk-light, body.hp-preview-light) .section-sub,
:is(body.tk-light, body.hp-preview-light) .hero-badge {
  color: var(--text-secondary);
}

:is(body.tk-light, body.hp-preview-light) .gradient-text {
  background: var(--light-gradient-hero-text);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}

/* ── Search ── */
:is(body.tk-light, body.hp-preview-light) .search-box {
  background: var(--search-light-bg) !important;
  border-color: var(--search-light-border) !important;
  box-shadow: var(--search-light-glow);
}

:is(body.tk-light, body.hp-preview-light) .search-box input {
  color: var(--text-primary);
}

:is(body.tk-light, body.hp-preview-light) .search-box input::placeholder {
  color: var(--text-muted);
}

:is(body.tk-light, body.hp-preview-light) .search-btn {
  background: var(--light-gradient-btn);
  color: var(--color-white);
  box-shadow: var(--btn-primary-shadow);
}

/* ── Cards & sections ── */
:is(body.tk-light, body.hp-preview-light) .event-card-v2,
:is(body.tk-light, body.hp-preview-light) .browse-tile,
:is(body.tk-light, body.hp-preview-light) .step-card,
:is(body.tk-light, body.hp-preview-light) .card,
:is(body.tk-light, body.hp-preview-light) .testimonial {
  background: var(--glass-strong);
  border-color: var(--glass-border);
  box-shadow: var(--glass-shadow);
}

:is(body.tk-light, body.hp-preview-light) .price {
  color: var(--color-magenta-dark);
}

:is(body.tk-light, body.hp-preview-light) .stats-bar {
  background: var(--glass);
  border-color: var(--glass-border);
  backdrop-filter: blur(12px);
  box-shadow: var(--glass-shadow);
}

:is(body.tk-light, body.hp-preview-light) .cat-pill,
:is(body.tk-light, body.hp-preview-light) .cat-pill.music,
:is(body.tk-light, body.hp-preview-light) .cat-pill.comedy,
:is(body.tk-light, body.hp-preview-light) .cat-pill.sports,
:is(body.tk-light, body.hp-preview-light) .cat-pill.cultural,
:is(body.tk-light, body.hp-preview-light) .cat-pill.food,
:is(body.tk-light, body.hp-preview-light) .cat-pill.puja,
:is(body.tk-light, body.hp-preview-light) .cat-pill.garba,
:is(body.tk-light, body.hp-preview-light) .cat-pill.wedding,
:is(body.tk-light, body.hp-preview-light) .cat-pill.party {
  background: rgba(255, 255, 255, 0.88);
  border-color: var(--glass-border);
  color: var(--text-primary);
}

:is(body.tk-light, body.hp-preview-light) .cat-pill.active,
:is(body.tk-light, body.hp-preview-light) .cat-pill:hover {
  background: var(--light-gradient-btn);
  border-color: transparent;
  color: var(--color-white);
  box-shadow: var(--btn-primary-shadow);
}

/* ── Footer ── */
:is(body.tk-light, body.hp-preview-light) .footer {
  background: var(--footer-light-bg);
  border-top: 1px solid var(--footer-light-border);
  color: var(--text-secondary);
  backdrop-filter: blur(12px);
}

:is(body.tk-light, body.hp-preview-light) .footer-col strong {
  color: var(--text-heading);
}

:is(body.tk-light, body.hp-preview-light) .footer-col a:hover,
:is(body.tk-light, body.hp-preview-light) .footer-legal-inline a:hover {
  color: var(--color-magenta);
}

:is(body.tk-light, body.hp-preview-light) .footer-bottom {
  border-top-color: var(--footer-light-border);
}

/* ── Dev preview banner ── */
body.hp-preview-light .dev-preview-banner {
  position: relative;
  z-index: 301;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: 0.75rem;
  padding: 0.45rem 1rem;
  font-size: var(--dev-banner-font-size);
  font-weight: 600;
  color: var(--dev-banner-text);
  background: var(--dev-banner-bg);
  border-bottom: 1px solid var(--dev-banner-border);
  backdrop-filter: blur(12px);
}

body.hp-preview-light .dev-preview-banner a {
  color: var(--dev-banner-link);
  text-decoration: underline;
}

/* ── Company / About / Contact ── */
:is(body.tk-light, body.hp-preview-light) .company-hero h1,
:is(body.tk-light, body.hp-preview-light) .legal-doc h1,
:is(body.tk-light, body.hp-preview-light) .legal-doc h2,
:is(body.tk-light, body.hp-preview-light) .legal-doc h3 {
  color: var(--text-heading);
}

:is(body.tk-light, body.hp-preview-light) .company-lead,
:is(body.tk-light, body.hp-preview-light) .legal-doc,
:is(body.tk-light, body.hp-preview-light) .center-sub {
  color: var(--text-secondary);
}

:is(body.tk-light, body.hp-preview-light) .company-card,
:is(body.tk-light, body.hp-preview-light) .contact-card,
:is(body.tk-light, body.hp-preview-light) .company-panel,
:is(body.tk-light, body.hp-preview-light) .about-card,
:is(body.tk-light, body.hp-preview-light) .faq-item,
:is(body.tk-light, body.hp-preview-light) .contact-form-panel,
:is(body.tk-light, body.hp-preview-light) .legal-doc {
  background: var(--glass-strong);
  border-color: var(--glass-border);
  box-shadow: var(--glass-shadow);
}

:is(body.tk-light, body.hp-preview-light) .company-eyebrow,
:is(body.tk-light, body.hp-preview-light) .legal-eyebrow {
  color: var(--accent-eyebrow);
}

:is(body.tk-light, body.hp-preview-light) .company-lead a,
:is(body.tk-light, body.hp-preview-light) .legal-doc a {
  color: var(--link-color);
}

:is(body.tk-light, body.hp-preview-light) .company-stat strong {
  color: var(--text-heading);
}

:is(body.tk-light, body.hp-preview-light) .company-stat span,
:is(body.tk-light, body.hp-preview-light) .stat span {
  color: var(--text-secondary);
}

:is(body.tk-light, body.hp-preview-light) .contact-form label,
:is(body.tk-light, body.hp-preview-light) .form-field label {
  color: var(--text-secondary);
}

:is(body.tk-light, body.hp-preview-light) .contact-form input,
:is(body.tk-light, body.hp-preview-light) .contact-form textarea,
:is(body.tk-light, body.hp-preview-light) .contact-form select,
:is(body.tk-light, body.hp-preview-light) .form-field input,
:is(body.tk-light, body.hp-preview-light) .form-field select,
:is(body.tk-light, body.hp-preview-light) .form-field textarea {
  background: var(--panel-bg-input);
  border-color: var(--glass-border);
  color: var(--text-primary);
}

:is(body.tk-light, body.hp-preview-light) .legal-hero {
  border-bottom-color: var(--header-light-border);
}

:is(body.tk-light, body.hp-preview-light) .company-nav-links a.active,
:is(body.tk-light, body.hp-preview-light) .legal-nav-links a.active {
  color: var(--accent-eyebrow);
}

/* ── Checkout / Tickets ── */
body.tk-light.checkout-page,
body.tk-light .checkout-page {
  background: transparent !important;
}

body.tk-light.checkout-page .checkout-header,
body.tk-light .checkout-header {
  background: var(--header-light-bg);
  border-bottom-color: var(--header-light-border);
  backdrop-filter: blur(16px);
}

body.tk-light.checkout-page .checkout-panel,
body.tk-light.checkout-page .checkout-event,
body.tk-light.checkout-page .success-card,
body.tk-light .ticket-card {
  background: var(--glass-strong);
  border-color: var(--glass-border);
  box-shadow: var(--glass-shadow);
  color: var(--text-primary);
}

body.tk-light.checkout-page .checkout-form label {
  color: var(--text-secondary);
}

body.tk-light.checkout-page .checkout-meta,
body.tk-light.checkout-page #event-title {
  color: var(--text-primary);
}

body.tk-light.checkout-page .ticket-line input[type='number'],
body.tk-light.checkout-page .checkout-form input {
  background: var(--panel-bg-input);
  border-color: var(--glass-border);
  color: var(--text-primary);
}

body.tk-light.checkout-page .checkout-pay-btn,
body.tk-light.checkout-page .btn-magenta {
  background: var(--btn-primary-gradient);
  box-shadow: var(--btn-primary-shadow);
}

body.tk-light .tickets-header h1 {
  color: var(--text-heading);
}

/* ── Search ── */
body.tk-light.search-page {
  background: transparent !important;
}

body.tk-light.search-page .search-topbar {
  position: sticky;
  top: env(safe-area-inset-top, 0);
  z-index: 200;
}

/* ── Event preview modal ── */
:is(body.tk-light, body.hp-preview-light) .event-preview-backdrop {
  background: rgba(15, 23, 42, 0.35);
}

:is(body.tk-light, body.hp-preview-light) .event-preview-dialog {
  background: var(--glass-strong);
  border-color: var(--glass-border);
  box-shadow: var(--glass-shadow);
  color: var(--text-primary);
}

:is(body.tk-light, body.hp-preview-light) .event-preview-title,
:is(body.tk-light, body.hp-preview-light) .preview-value {
  color: var(--text-heading);
}

:is(body.tk-light, body.hp-preview-light) .event-preview-meta dt,
:is(body.tk-light, body.hp-preview-light) .preview-key {
  color: var(--text-muted);
}

:is(body.tk-light, body.hp-preview-light) .event-preview-close {
  background: var(--surface-muted);
  border-color: var(--glass-border);
  color: var(--text-primary);
}

:is(body.tk-light, body.hp-preview-light) .preview-totals {
  background: var(--surface-muted);
}

:is(body.tk-light, body.hp-preview-light) .preview-booking-form input,
:is(body.tk-light, body.hp-preview-light) .booking-ticket-line input {
  background: var(--panel-bg-input);
  border-color: var(--glass-border);
  color: var(--text-primary);
}

:is(body.tk-light, body.hp-preview-light) .stat strong {
  color: var(--text-heading);
}

/* ── Mobile nav ── */
:is(body.tk-light, body.hp-preview-light) .nav-auth-quick {
  gap: 8px;
}

:is(body.tk-light, body.hp-preview-light) .nav-ghost--compact {
  padding: 8px 12px;
  border: 1px solid rgba(15, 23, 42, 0.12);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.65);
}

:is(body.tk-light, body.hp-preview-light) .nav-btn--compact {
  padding: 8px 14px;
  border-radius: 999px;
  font-size: 0.8125rem;
}

@media (max-width: 900px) {
  :is(body.tk-light, body.hp-preview-light) .site-header {
    top: env(safe-area-inset-top, 0);
    left: 0;
    right: 0;
    width: 100%;
    margin: 0;
  }

  :is(body.tk-light, body.hp-preview-light) .nav-links.is-open {
    background: rgba(255, 255, 255, 0.98);
    border-color: var(--header-light-border);
  }

  :is(body.tk-light, body.hp-preview-light) .brand-tagline {
    display: none;
  }
}