/* ============================================
   U-EVENTS — theme.css
   Light mode tokens + component overrides
   ============================================ */

[data-theme="light"] {
  /* Brand */
  --color-primary: #c47f0f;
  --color-primary-light: #d4921a;
  --color-primary-dark: #a56a0c;
  --color-primary-bg: rgba(196, 127, 15, 0.1);
  --color-card-bg: #ffffff;

  /* Backgrounds */
  --color-bg: #f7f6f3;
  --color-bg-surface: #ffffff;
  --color-bg-elevated: #f0efeb;
  --color-bg-overlay: rgba(15, 15, 15, 0.35);

  /* Input / Search */
  --color-bg-input: #ffffff;
  --color-bg-filter: #f3f2ef;

  /* Borders */
  --color-border: #e4e2dc;
  --color-border-subtle: #eceae4;

  /* Text */
  --color-text-primary: #141414;
  --color-text-secondary: #5c5c5c;
  --color-text-muted: #8a8a8a;
  --color-text-inverse: #ffffff;

  /* Tag / Pill */
  --color-tag-bg: #f0efeb;
  --color-tag-active-bg: var(--color-primary);
  --color-tag-active-text: #ffffff;

  /* Shadows */
  --shadow-sm: 0 1px 4px rgba(15, 15, 15, 0.06);
  --shadow-md: 0 4px 16px rgba(15, 15, 15, 0.08);
  --shadow-lg: 0 8px 32px rgba(15, 15, 15, 0.1);
  --shadow-card: 0 4px 20px rgba(15, 15, 15, 0.07);
  --shadow-glow: 0 0 20px rgba(196, 127, 15, 0.18);
  --shadow-glow-strong: 0 0 32px rgba(196, 127, 15, 0.28);

  /* Navbar */
  --navbar-bg: rgba(255, 255, 255, 0.92);
  --navbar-border: rgba(15, 15, 15, 0.08);

  /* Search / pills / FAQ */
  --search-bar-bg: #ffffff;
  --search-input-bg: #f7f6f3;
  --pill-bg: #ffffff;
  --pill-border: #e4e2dc;
  --pill-active-color: #ffffff;
  --faq-bg: #ffffff;
  --faq-border: #e4e2dc;

  /* Semantic surfaces & interactions */
  --color-hover-subtle: rgba(15, 15, 15, 0.04);
  --color-hover-medium: rgba(15, 15, 15, 0.06);
  --color-hover-strong: rgba(15, 15, 15, 0.08);
  --color-border-faint: rgba(15, 15, 15, 0.08);
  --color-border-muted: rgba(15, 15, 15, 0.06);
  --color-surface-strong: #ffffff;
  --color-surface-deep: #f7f6f3;
  --color-surface-input-focus: #ffffff;
  --color-surface-dropdown: #ffffff;
  --color-surface-panel: rgba(255, 255, 255, 0.96);
  --color-surface-panel-strong: #f3f2ef;
  --color-overlay-backdrop: rgba(15, 15, 15, 0.45);
  --color-overlay-soft: rgba(15, 15, 15, 0.35);
  --color-overlay-vignette: #f7f6f3;
  --color-on-gold: #0d0d0d;
  --color-star-empty: #d4d4d4;
  --color-text-faint: rgba(20, 20, 20, 0.65);
  --color-text-soft: rgba(20, 20, 20, 0.72);
  --color-text-dim: rgba(20, 20, 20, 0.5);
  --color-border-open: var(--color-primary);
  --shadow-dropdown: 0 12px 32px rgba(15, 15, 15, 0.1);
  --shadow-modal: 0 18px 45px rgba(15, 15, 15, 0.12);
  --shadow-panel: 0 10px 30px rgba(15, 15, 15, 0.1);
  --shadow-card-hover: 0 8px 20px rgba(15, 15, 15, 0.08);
  --shadow-inset-card: 0 4px 8px rgba(15, 15, 15, 0.06);
  --policy-bar-bg: rgba(255, 255, 255, 0.95);
  --policy-bar-shadow: 0 -4px 20px rgba(15, 15, 15, 0.06);
}

/* ── Theme toggle button ── */
.theme-toggle {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 38px;
  height: 38px;
  border-radius: 50%;
  border: 1px solid var(--color-border, #2a2a2a);
  background: var(--color-bg-surface, #121212);
  color: var(--color-text-secondary, #bdbdbd);
  cursor: pointer;
  transition:
    color var(--transition-fast, 150ms ease),
    border-color var(--transition-fast, 150ms ease),
    background var(--transition-fast, 150ms ease),
    box-shadow var(--transition-fast, 150ms ease);
}

.theme-toggle:hover,
.theme-toggle:focus-visible {
  color: var(--color-primary, #d4921a);
  border-color: var(--color-primary, #d4921a);
}

.theme-toggle__icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.theme-toggle__icon svg {
  width: 18px;
  height: 18px;
}

.theme-toggle--website {
  flex-shrink: 0;
}

.theme-toggle--dashboard {
  width: 35px;
  height: 35px;
  border-radius: 8px;
  background: var(--card, #191919);
  border-color: var(--border, #252525);
  color: var(--info, #b3b3b3);
}

.theme-toggle--dashboard:hover,
.theme-toggle--dashboard:focus-visible {
  border-color: var(--gold-dim, #7a6030);
  color: var(--gold, #d78800);
}

.theme-toggle--dashboard .theme-toggle__icon svg,
.theme-toggle--dashboard .theme-toggle__icon i {
  width: 15px;
  height: 15px;
}

.theme-toggle--auth {
  position: fixed;
  top: 20px;
  inset-inline-end: 20px;
  z-index: 10000;
  box-shadow: var(--shadow-sm);
}

[data-theme="light"] .theme-toggle--dashboard {
  background: var(--card, #ffffff);
  border-color: var(--border, #e8e8e8);
  color: var(--info, #666666);
}

/* ── Navbar light overrides ── */
[data-theme="light"] .navbar {
  background-color: rgba(255, 255, 255, 0.82);
  border-bottom-color: var(--color-border-subtle);
}

[data-theme="light"] .navbar__lang-menu,
[data-theme="light"] .navbar__menu {
  border-color: rgba(15, 15, 15, 0.08);
  box-shadow: 0 1rem 2rem rgba(15, 15, 15, 0.08);
}

[data-theme="light"] .navbar__lang-item:hover,
[data-theme="light"] .navbar__lang-item:focus-visible,
[data-theme="light"] .navbar__menu-item:hover,
[data-theme="light"] .navbar__notif:hover {
  background: rgba(15, 15, 15, 0.04);
}

[data-theme="light"] .navbar__btn--notification:hover,
[data-theme="light"] .navbar__dropdown.is-open .navbar__btn--notification {
  background: rgba(15, 15, 15, 0.05);
  color: var(--color-text-primary);
}

[data-theme="light"] .navbar__profile {
  border-color: rgba(15, 15, 15, 0.1);
}

[data-theme="light"] .navbar__menu-head,
[data-theme="light"] .navbar__menu-user,
[data-theme="light"] .navbar__menu-foot,
[data-theme="light"] .navbar__menu-logout {
  border-color: rgba(15, 15, 15, 0.08);
}

[data-theme="light"] .navbar__notif-icon {
  background: rgba(15, 15, 15, 0.05);
}

[data-theme="light"] .navbar__notif--unread {
  background: rgba(196, 127, 15, 0.08);
}

/* ── Home / hero light overrides ── */
[data-theme="light"] .hero__overlay-bottom {
  background: linear-gradient(to top, var(--color-bg) 0%, rgba(247, 246, 243, 0) 100%);
}

[data-theme="light"] .about-hero__overlay-bottom,
[data-theme="light"] .contact-hero__overlay-bottom {
  background: linear-gradient(to top, var(--color-bg, #f7f6f3) 0%, rgba(247, 246, 243, 0) 100%);
}

[data-theme="light"] .hero__search-card {
  background: rgba(255, 255, 255, 0.92);
  box-shadow: var(--shadow-md);
}

[data-theme="light"] .hero__tab.is-active {
  background: rgba(196, 127, 15, 0.08);
}

[data-theme="light"] .hero__tab:hover {
  color: var(--color-text-primary);
}

/* ── Auth pages ── */
[data-theme="light"] html {
  background: var(--color-bg);
}

[data-theme="light"] body:has(.login-page) {
  background:
    url("../assets/auth/stars.png") top center / auto no-repeat,
    linear-gradient(180deg, rgba(255, 255, 255, 0.92) 0%, var(--color-bg) 45%),
    var(--color-bg);
}

[data-theme="light"] .login-card,
[data-theme="light"] .auth-card,
[data-theme="light"] .signup-card {
  background: var(--color-bg-surface);
  border-color: var(--color-border);
  box-shadow: var(--shadow-md);
}

[data-theme="light"] .auth-input,
[data-theme="light"] .login-input,
[data-theme="light"] .signup-input,
[data-theme="light"] .otp-input,
[data-theme="light"] .phone-input-wrap {
  background: var(--color-bg-input);
  border-color: var(--color-border);
  color: var(--color-text-primary);
}

[data-theme="light"] .auth-divider span,
[data-theme="light"] .login-divider span {
  background: var(--color-bg-surface);
}

[data-theme="light"] .social-btn {
  background: var(--color-bg-surface);
  border-color: var(--color-border);
  color: var(--color-text-primary);
}

[data-theme="light"] .social-btn:hover {
  background: var(--color-bg-elevated);
}

/* ── Dashboard light overrides ── */
[data-theme="light"] {
  --bg: #f3f3f4;
  --surface: #ffffff;
  --card: #ffffff;
  --card2: #f7f7f8;
  --border: #e5e5e7;
  --border2: #d8d8dc;
  --gold: #c47f0f;
  --gold-dim: #a56a0c;
  --gold-glow: rgba(196, 127, 15, 0.12);
  --value: #666666;
  --white: #141414;
  --sub: #888888;
  --muted: #888888;
  --info: #666666;
  --btn: #f0f0f2;
  --green-fg: #2e7d32;
  --green-bg: rgba(46, 125, 50, 0.1);
  --red-fg: #c62828;
  --red-bg: rgba(198, 40, 40, 0.08);
  --amber-fg: #b45309;
  --amber-bg: rgba(180, 83, 9, 0.1);
  --dash-hover: #f0f0f2;
  --dash-hover-strong: #e8e8eb;
  --dash-overlay: rgba(15, 15, 15, 0.35);
  --dash-shadow-menu: 0 10px 24px rgba(15, 15, 15, 0.08);
}

[data-theme="light"] .nav-link:hover {
  background: var(--dash-hover);
}

[data-theme="light"] .sidebar.collapsed .nav-link.active,
[data-theme="light"] .nav-link.active {
  background: linear-gradient(to right, rgba(196, 127, 15, 0.1) 0%, transparent 100%);
}

[data-theme="light"] .tb-icon svg {
  color: var(--info);
}

[data-theme="light"] .topbar-menu,
[data-theme="light"] .notif-dropdown__menu {
  box-shadow: 0 12px 32px rgba(15, 15, 15, 0.1);
}

[data-theme="light"] .topbar-menu-item:hover,
[data-theme="light"] .notif-item:hover {
  background: rgba(15, 15, 15, 0.04);
}

[data-theme="light"] .stat-card,
[data-theme="light"] .ticket-card,
[data-theme="light"] .profile-card,
[data-theme="light"] .settings-card,
[data-theme="light"] .payment-card {
  box-shadow: var(--shadow-sm);
}

[data-theme="light"] .sidebar-overlay {
  background: rgba(15, 15, 15, 0.35);
}

[data-theme="light"] .cal-nav-btn:hover,
[data-theme="light"] .pi-btn-discard:hover {
  background: var(--dash-hover);
}