.background-effects,
.orb {
  pointer-events: none;
  position: absolute;
}
.brand__name,
.drawer-link {
  font-family: "Clash Display", Arial, sans-serif;
}
#concertsTrack .event-card,
#concertsTrack .event-card:hover,
#eventsTrack .event-card,
#sportsTrack .sports-card {
  box-shadow: none !important;
  transform: none !important;
}
:root {
  --ink: #14142b;
  --grey: #5a5a72;
  --muted: #8e8e9f;
  --line: #ededf2;
  --canvas: #faf9f6;
  --pink-soft: #fff0f6;
  --magenta: #ff2e86;
  --orange: #ff8a00;
  --gradient: linear-gradient(110deg, var(--magenta), var(--orange));
  --ease: cubic-bezier(0.76, 0, 0.24, 1);
  --shadow: 0 8px 32px rgba(20, 20, 43, 0.06);
  --shadow-scrolled: 0 14px 44px rgba(20, 20, 43, 0.11);
}
*,
.mela-footer *,
.mela-footer-bottom * {
  box-sizing: border-box;
}
html {
  scroll-behavior: smooth;
}
body {
  margin: 0;
  min-width: 320px;
  color: var(--ink);
  font-family: Arial, sans-serif;
  overflow-x: hidden;
}
body.drawer-open {
  overflow: hidden;
  height: 100dvh;
}
a,
button {
  color: inherit;
  font: inherit;
  -webkit-tap-highlight-color: transparent;
}
button {
  padding: 0;
}
a {
  text-decoration: none;
}
a:focus-visible,
button:focus-visible {
  outline: rgba(255, 46, 134, 0.25) solid 3px;
  outline-offset: 3px;
}
.background-effects {
  z-index: -3;
  inset: 0;
  overflow: hidden;
}
.orb {
  border-radius: 50%;
}
.orb--peach {
  top: -80px;
  right: -80px;
  width: 460px;
  height: 460px;
  background: rgba(255, 187, 139, 0.34);
  filter: blur(65px);
}
.orb--blush {
  top: 300px;
  left: -130px;
  width: 470px;
  height: 470px;
  background: rgba(255, 180, 210, 0.28);
  filter: blur(75px);
}
.orb--cream {
  top: 720px;
  right: 14%;
  width: 390px;
  height: 390px;
  background: rgba(255, 229, 178, 0.28);
  filter: blur(75px);
}
.ajrak-watermark {
  position: absolute;
  inset: 0;
  opacity: 0.025;
  background-image: linear-gradient(
      30deg,
      var(--ink) 12%,
      transparent 12.5%,
      transparent 87%,
      var(--ink) 87.5%
    ),
    linear-gradient(
      150deg,
      var(--ink) 12%,
      transparent 12.5%,
      transparent 87%,
      var(--ink) 87.5%
    ),
    linear-gradient(
      30deg,
      var(--ink) 12%,
      transparent 12.5%,
      transparent 87%,
      var(--ink) 87.5%
    ),
    linear-gradient(
      150deg,
      var(--ink) 12%,
      transparent 12.5%,
      transparent 87%,
      var(--ink) 87.5%
    );
  background-position: 0 0, 0 0, 24px 42px, 24px 42px;
  background-size: 48px 84px;
  mask-image: linear-gradient(
    to bottom,
    transparent 5%,
    #000 30%,
    transparent 90%
  );
  -webkit-mask-image: linear-gradient(
    to bottom,
    transparent 5%,
    #000 30%,
    transparent 90%
  );
}
.brand {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  gap: 12px;
  min-width: max-content;
}
.brand__mark {
  display: grid;
  width: 44px;
  height: 44px;
  flex: 0 0 auto;
  place-items: center;
  border-radius: 14px;
  color: #fff;
  background: var(--gradient);
  box-shadow: 0 8px 20px rgba(255, 46, 134, 0.2);
}
.brand__mark svg {
  width: 25px;
  height: 25px;
}
.brand__copy {
  display: grid;
  line-height: 1;
}
.brand__name {
  font-size: 24px;
  font-weight: 700;
  letter-spacing: 0.02em;
}
.brand__tagline {
  margin-top: 4px;
  color: var(--muted);
  font-size: 10px;
  font-weight: 500;
}
.site-header {
  position: sticky;
  top: 20px;
  z-index: 999;
  width: 100%;
  max-width: 1325px;
  height: 76px;
  margin: 20px auto 0;
  transition: height 320ms var(--ease);
}
.icon-button,
.nav-link,
.navbar {
  position: relative;
}
.navbar {
  display: grid;
  grid-template-columns: minmax(200px, 1fr) auto minmax(0, 1fr);
  align-items: center;
  width: 100%;
  height: 100%;
  padding: 0 16px 0 20px;
  border: 1px solid rgba(237, 237, 242, 0.95);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.72);
  box-shadow: var(--shadow);
  backdrop-filter: blur(24px) saturate(145%);
  -webkit-backdrop-filter: blur(24px) saturate(145%);
  transition: background 320ms var(--ease), box-shadow 320ms var(--ease);
}
.desktop-nav {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
}
.nav-link {
  display: inline-flex;
  height: 44px;
  align-items: center;
  gap: 6px;
  padding: 0 16px;
  border-radius: 999px;
  color: var(--grey);
  font-size: 16px;
  font-weight: 500;
  white-space: nowrap;
  transition: color 180ms, background 180ms;
}
.nav-link.active,
.nav-link:hover {
  color: var(--ink) !important;
}
.nav-link.active::after {
  transform: scaleX(1) !important;
}
.desktop-nav .nav-link:hover::after,
.nav-link.active::after,
.nav-link:hover::after {
  transform: scaleX(1);
}
.nav-link::after {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 4px;
  border-radius: 999px;
  background: var(--gradient);
  content: "";
  transform: scaleX(0);
  transform-origin: center;
  transition: transform 280ms var(--ease);
}
.nav-link:hover {
  color: var(--ink);
}
.socials a:hover,
.text-button:hover {
  color: var(--magenta);
}
.nav-link__chevron {
  width: 14px;
  height: 14px;
  transition: transform 180ms;
}
.nav-link:hover .nav-link__chevron {
  transform: translateY(2px);
}
.navbar__actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 14px;
  min-width: 0;
}
.cart-badge,
.icon-button {
  display: grid;
  place-items: center;
}
.icon-button {
  width: 44px;
  height: 44px;
  flex: 0 0 auto;
  cursor: pointer;
  border: 1px solid var(--line);
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.44);
  transition: background 180ms, border-color 180ms, transform 180ms;
}
.icon-button:hover {
  border-color: rgba(255, 46, 134, 0.18);
  background: var(--pink-soft);
  transform: translateY(-1px);
}
.icon-button svg {
  width: 20px;
  height: 20px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.cart-badge {
  position: absolute;
  top: -3px;
  right: -2px;
  min-width: 19px;
  height: 19px;
  padding: 0 5px;
  border: 2px solid #fff;
  border-radius: 999px;
  color: #fff;
  background: var(--gradient);
  font-size: 10px;
  font-weight: 700;
  line-height: 1;
  box-shadow: 0 4px 10px rgba(255, 46, 134, 0.22);
}
.primary-button,
.text-button {
  border: 0;
  white-space: nowrap;
  cursor: pointer;
}
.cart-badge.is-popping,
.drawer-cart__count.is-popping {
  animation: badge-pop 0.4s var(--ease);
}
@keyframes badge-pop {
  0% {
    transform: scale(0);
  }
  65% {
    transform: scale(1.2);
  }
  100% {
    transform: scale(1);
  }
}
.actions-divider {
  width: 1px;
  height: 28px;
  background: var(--line);
}
.text-button {
  background: 0 0;
  font-weight: 600;
}
.primary-button {
  display: inline-flex;
  height: 44px;
  align-items: center;
  justify-content: center;
  padding: 0 24px;
  border-radius: 999px;
  color: #fff;
  background: var(--gradient);
  box-shadow: 0 10px 24px rgba(255, 46, 134, 0.21);
  font-weight: 700;
  transition: box-shadow 180ms, transform 180ms;
}
.drawer-layer[hidden],
.js-premium-select,
.menu-button {
  display: none;
}
.primary-button:hover {
  box-shadow: 0 14px 30px rgba(255, 46, 134, 0.28);
  transform: translateY(-2px);
}
.compact-actions {
  display: none;
  align-items: center;
  gap: 10px;
}
.menu-button {
  position: relative;
  width: 38px;
  height: 41px;
  flex: 0 0 auto;
  cursor: pointer;
  border: 1px solid var(--line);
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.62);
}
.menu-button span {
  position: absolute;
  left: 12px;
  display: block;
  width: 18px;
  height: 2px;
  border-radius: 999px;
  background: var(--ink);
  transition: top 0.4s var(--ease), opacity 240ms ease,
    transform 0.4s var(--ease), width 0.4s var(--ease),
    background 0.4s var(--ease);
}
.menu-button span:first-child {
  top: 14px;
}
.menu-button span:nth-child(2) {
  top: 20px;
  width: 14px;
}
.menu-button span:nth-child(3) {
  top: 26px;
}
.menu-button[aria-expanded="true"] span {
  top: 20px;
  width: 18px;
  background: var(--magenta);
}
.drawer-close::before,
.menu-button[aria-expanded="true"] span:first-child {
  transform: rotate(45deg);
}
.menu-button[aria-expanded="true"] span:nth-child(2) {
  opacity: 0;
  transform: scaleX(0);
}
.drawer-close::after,
.menu-button[aria-expanded="true"] span:nth-child(3) {
  transform: rotate(-45deg);
}
.drawer-layer {
  position: fixed;
  z-index: 1000;
  inset: 0;
}
.drawer-backdrop {
  position: absolute;
  inset: 0;
  width: 100%;
  border: 0;
  background: rgba(20, 20, 43, 0);
  backdrop-filter: blur(0);
  -webkit-backdrop-filter: blur(0);
  cursor: pointer;
  transition: background 0.4s var(--ease), backdrop-filter 0.4s var(--ease);
}
.mobile-drawer {
  position: absolute;
  top: 0;
  right: 0;
  display: flex;
  width: min(75vw, 380px);
  height: 100vh;
  height: 100dvh;
  flex-direction: column;
  overflow-x: hidden;
  overflow-y: auto;
  padding: max(20px, env(safe-area-inset-top)) 20px
    max(22px, env(safe-area-inset-bottom));
  border-radius: 32px 0 0 32px;
  background: #fff;
  box-shadow: -28px 0 70px rgba(20, 20, 43, 0.2);
  transform: translateX(100%);
  transition: transform 0.4s var(--ease);
  -webkit-overflow-scrolling: touch;
  scrollbar-width: thin;
}
.mobile-drawer::-webkit-scrollbar {
  width: 4px;
}
.mobile-drawer::-webkit-scrollbar-track {
  background: 0 0;
}
.mobile-drawer::-webkit-scrollbar-thumb {
  background: #dedee7;
  border-radius: 999px;
}
.drawer-layer.is-open .drawer-backdrop {
  background: rgba(20, 20, 43, 0.35);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
}
.drawer-layer.is-open .mobile-drawer {
  transform: translateX(0);
}
.drawer__top {
  display: flex;
  flex: 0 0 auto;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 30px;
}
.drawer__top .brand {
  gap: 9px;
}
.drawer__top .brand__mark {
  width: 36px;
  height: 36px;
  border-radius: 12px;
}
.drawer__top .brand__mark svg {
  width: 21px;
}
.drawer__top .brand__name {
  font-size: 21px;
}
.drawer-close {
  position: relative;
  display: grid;
  width: 42px;
  height: 42px;
  flex: 0 0 auto;
  cursor: pointer;
  place-items: center;
  border: 0;
  border-radius: 50%;
  background: var(--pink-soft);
}
.drawer-close::after,
.drawer-close::before {
  position: absolute;
  width: 18px;
  height: 2px;
  border-radius: 999px;
  background: var(--gradient);
  content: "";
}
.page-shell {
  justify-content: center;
  display: flex;
}
.drawer-menu {
  display: grid;
  flex: 0 0 auto;
}
.drawer-cart,
.drawer-link {
  --delay: 0ms;
  position: relative;
  display: flex;
  min-height: 70px;
  align-items: center;
  justify-content: space-between;
  padding: 0 8px 0 16px;
  border: 0;
  border-bottom: 1px solid var(--line);
  color: var(--grey);
  background: 0 0;
  cursor: pointer;
  opacity: 0;
  text-align: left;
  transform: translateX(20px);
  transition: opacity 360ms ease var(--delay),
    transform 0.4s var(--ease) var(--delay), background 180ms ease;
}
.drawer-link {
  font-size: clamp(22px, 6vw, 28px);
  font-weight: 600;
}
.drawer-link:first-child {
  --delay: 60ms;
}
.drawer-link:nth-child(2) {
  --delay: 120ms;
}
.drawer-link:nth-child(3) {
  --delay: 180ms;
}
.drawer-cart {
  --delay: 240ms;
  min-height: 74px;
  color: var(--ink);
  font-size: 17px;
  font-weight: 600;
}
.drawer-layer.is-open .drawer-cart,
.drawer-layer.is-open .drawer-link {
  opacity: 1;
  transform: translateX(0);
}
.drawer-cart__label {
  display: flex;
  align-items: center;
  gap: 12px;
}
.drawer-cart svg {
  width: 22px;
  height: 22px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
}
.drawer-cart__count {
  display: grid;
  width: 24px;
  height: 24px;
  place-items: center;
  border-radius: 50%;
  color: #fff;
  background: var(--gradient);
  font-size: 11px;
  font-weight: 700;
}
.ticket-divider {
  height: 1px;
  flex: 0 0 auto;
  margin: 18px 0;
  background: repeating-linear-gradient(
    90deg,
    var(--line) 0 6px,
    transparent 6px 12px
  );
}
.drawer__bottom {
  position: relative;
  display: grid;
  gap: 10px;
  margin-top: auto;
  isolation: isolate;
}
.drawer__bottom::after {
  position: absolute;
  z-index: -1;
  right: -20px;
  bottom: -22px;
  width: 170px;
  height: 170px;
  opacity: 0.035;
  background: repeating-conic-gradient(
    from 45deg,
    var(--ink) 0 10deg,
    transparent 10deg 20deg
  );
  content: "";
  mask-image: radial-gradient(circle at bottom right, #000, transparent 70%);
  -webkit-mask-image: radial-gradient(
    circle at bottom right,
    #000,
    transparent 70%
  );
}
.drawer-sign-in,
.drawer-sign-up {
  width: 100%;
  height: 48px;
  border-radius: 999px;
  cursor: pointer;
  font-weight: 700;
}
.drawer-sign-in,
.socials a {
  border: 1px solid var(--line);
}
.premium-select-btn,
.premium-select-option {
  font-weight: 500;
  text-align: left;
  cursor: pointer;
}
.drawer-sign-in {
  background: #fff;
}
.drawer-sign-up {
  border: 0;
  color: #fff;
  background: var(--gradient);
  box-shadow: 0 12px 26px rgba(255, 46, 134, 0.23);
}
.drawer-location {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  margin-top: 8px;
  color: var(--grey);
  font-size: 13px;
}
.socials {
  display: flex;
  justify-content: center;
  gap: 10px;
  margin-top: 4px;
  padding-bottom: 4px;
}
.socials a {
  display: grid;
  width: 36px;
  height: 36px;
  place-items: center;
  border-radius: 50%;
  color: var(--grey);
  background: #f6f6f8;
  transition: color 180ms, border-color 180ms, background 180ms, transform 180ms;
}
.socials svg {
  width: 17px;
  height: 17px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.socials .icon-dot,
.socials .icon-fill {
  fill: currentColor;
  stroke: none;
}
.socials a:hover {
  border-color: rgba(255, 46, 134, 0.18);
  background: var(--pink-soft);
  transform: translateY(-2px);
}
@media (min-width: 768px) and (max-width: 1023px) {
  .navbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 14px 0 18px;
  }
  .desktop-nav,
  .navbar__actions {
    display: none !important;
  }
  .compact-actions {
    display: flex !important;
    align-items: center;
    gap: 8px;
  }
  .compact-actions .icon-button,
  .menu-button {
    display: grid !important;
    width: 42px;
    height: 42px;
  }
  .mobile-drawer {
    width: min(75vw, 380px);
    min-width: 280px;
  }
}
@media (max-width: 767px) {
  .mobile-drawer,
  body {
    overflow-y: auto;
  }
  body,
  html {
    width: 100%;
    max-width: 100%;
    overflow-x: hidden;
  }
  .site-header {
    top: 12px;
    height: 64px;
    margin-top: 12px;
  }
  .site-header.is-scrolled {
    height: 60px;
  }
  .navbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 9px 0 12px;
  }
  .navbar .brand {
    gap: 9px;
    min-width: 0;
  }
  .navbar .brand__mark {
    width: 38px;
    height: 38px;
    min-width: 38px;
    border-radius: 12px;
  }
  .navbar .brand__mark svg {
    width: 21px;
    height: 21px;
  }
  .navbar .brand__name {
    font-size: 21px;
  }
  .navbar .brand__tagline {
    display: none;
  }
  .compact-actions .search-compact,
  .desktop-nav,
  .navbar__actions {
    display: none !important;
  }
  .compact-actions {
    display: flex !important;
    align-items: center;
    justify-content: flex-end;
    gap: 7px;
    margin-left: auto;
  }
  .compact-actions .cart-trigger {
    display: grid !important;
    width: 40px;
    height: 40px;
    flex: 0 0 40px;
  }
  .compact-actions .cart-trigger svg {
    width: 18px;
    height: 18px;
  }
  .menu-button {
    display: block !important;
    flex: 0 0 40px;
  }
  .mobile-drawer {
    width: 78vw;
    max-width: 380px;
    min-width: 270px;
    height: 100dvh;
    max-height: 100dvh;
    overflow-x: hidden;
    padding: max(18px, env(safe-area-inset-top)) 18px
      max(22px, env(safe-area-inset-bottom));
    border-radius: 28px 0 0 28px;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior: contain;
  }
  .drawer__top {
    margin-bottom: 22px;
  }
  .drawer__top .brand__mark {
    width: 36px;
    height: 36px;
    min-width: 36px;
  }
  .drawer__top .brand__name {
    font-size: 20px;
  }
  .drawer-close {
    width: 40px;
    height: 40px;
    min-width: 40px;
  }
  .drawer-menu {
    flex-shrink: 0;
  }
  .drawer-link {
    min-height: 62px;
    height: 62px;
    padding-left: 14px;
    padding-right: 8px;
    font-size: clamp(21px, 6vw, 25px);
  }
  .drawer-link::after {
    font-size: 22px;
  }
  .drawer-link.is-active {
    margin-block: 5px;
  }
  .drawer-link.is-active::before {
    top: 13px;
    bottom: 13px;
  }
  .drawer-cart {
    min-height: 68px;
    padding-left: 6px;
    padding-right: 6px;
    font-size: 16px;
  }
  .ticket-divider {
    flex-shrink: 0;
    margin: 14px 0 18px;
  }
  .drawer__bottom {
    margin-top: 0;
    padding-bottom: 4px;
    flex-shrink: 0;
  }
  .drawer-sign-in,
  .drawer-sign-up {
    height: 46px;
    min-height: 46px;
  }
  .drawer-location {
    margin-top: 14px;
    font-size: 12px;
  }
  .socials {
    margin-top: 10px;
    padding-bottom: 8px;
  }
  .mela-footer-content {
    padding-top: 45px !important;
    padding-bottom: 40px !important;
  }
  .mela-footer-bottom-inner {
    padding-top: 18px !important;
    padding-bottom: 18px !important;
  }
}
@media (max-width: 380px) {
  .site-header {
    left: 8px;
    margin-left: 0;
    margin-right: 0;
  }

  .navbar {
    padding-left: 9px;
    padding-right: 7px;
  }

  .navbar .brand__mark {
    width: 35px;
    height: 35px;
    min-width: 35px;
  }

  .navbar .brand__name {
    font-size: 18px;
  }

  .compact-actions {
    gap: 5px;
  }

  .compact-actions .cart-trigger,
  .menu-button {
    width: 37px;
    height: 42px;
  }

  .mobile-drawer {
    width: 82vw;
    min-width: 255px;
    padding-left: 15px;
    padding-right: 15px;
  }

  .drawer__top {
    margin-bottom: 18px;
  }

  .drawer-link {
    min-height: 59px;
    height: 59px;
    font-size: 21px;
  }

  .drawer-cart {
    min-height: 64px;
  }

  .drawer-sign-in,
  .drawer-sign-up {
    height: 44px;
    min-height: 44px;
    font-size: 14px;
  }
}

@media (max-width: 767px) and (orientation: landscape) {
  .mobile-drawer {
    overflow-y: auto;
  }
  .drawer__top {
    margin-bottom: 10px;
  }
  .drawer-link {
    min-height: 50px;
    height: 50px;
  }
  .drawer-cart {
    min-height: 58px;
  }
  .ticket-divider {
    margin: 10px 0;
  }
  .drawer-location,
  .socials {
    margin-top: 6px;
  }
}
.instagram-icon {
  background: linear-gradient(
    45deg,
    #fdf497 0,
    #fd5949 45%,
    #d6249f 60%,
    #285aeb 90%
  );
  transition: filter 0.3s;
}
.instagram-icon:hover {
  filter: brightness(0.85);
}
#concertsCarousel {
  overflow: hidden;
  width: 100%;
}
#concertsTrack,
#sportsTrack {
  display: flex;
  gap: 20px;
  transition: transform 0.45s;
  will-change: transform;
}
#concertsTrack .event-card {
  flex: 0 0 calc((100% - 60px) / 4);
  min-width: 0;
}
#concertsTrack .event-card img,
#eventsTrack .event-card-image,
#sportsTrack .sports-card-image {
  transform: scale(1);
  transition: transform 0.5s;
}
#concertsTrack .event-card:hover img {
  transform: scale(1.06);
}
#concertsNext:hover,
#concertsPrev:hover {
  transform: none !important;
}
#sportsCarousel {
  width: 100%;
  overflow: hidden;
}
#sportsTrack .sports-card {
  flex: 0 0 calc((100% - 60px) / 4);
  min-width: 0;
}
@media (max-width: 1023px) {
  #concertsTrack .event-card,
  #sportsTrack .sports-card {
    flex: 0 0 calc((100% - 20px) / 2);
  }
}
@media (max-width: 639px) {
  #concertsTrack,
  #sportsTrack {
    gap: 15px;
  }
  #concertsTrack .event-card,
  #sportsTrack .sports-card {
    flex: 0 0 100%;
  }
}
#eventsTrack .event-card:hover .event-card-image,
#sportsTrack .sports-card:hover .sports-card-image {
  transform: scale(1.05);
}
.concertsCarousel,
.eventsCarousel,
.sportsCarousel {
  height: 350px !important;
}
.desktop-nav .nav-link {
  position: relative;
}
.desktop-nav .nav-link::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 3px;
  background: linear-gradient(110deg, var(--magenta), var(--orange));
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 0.4s;
}
.premium-select-wrap {
  position: relative;
  width: 100%;
}
.premium-select-btn {
  width: 100%;
  padding: 0 18px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  background: #f9fafb;
  color: #374151;
  font-size: 16px;
  transition: 0.25s;
}
.date:hover,
.drop:hover {
  border-color: #ff6592;
  background: #fff;
}
.drop:hover .premium-select-btn {
  background-color: #fff;
}
.premium-select-btn .select-chevron {
  width: 18px;
  height: 18px;
  flex-shrink: 0;
  transition: transform 0.25s;
}
.premium-select-wrap.is-open .select-chevron {
  transform: rotate(180deg);
}
.premium-select-menu {
  position: absolute;
  top: calc(100% + 12px);
  left: 0;
  width: 100%;
  padding: 8px;
  background: #fff;
  border: 1px solid #f0e5e9;
  border-radius: 20px;
  box-shadow: 0 16px 45px rgba(24, 24, 40, 0.14);
  z-index: 9999;
  opacity: 0;
  visibility: hidden;
  transform: translateY(-8px) scale(0.98);
  transform-origin: top;
  transition: 0.2s;
  max-height: 280px;
  overflow-y: auto;
}
.premium-select-wrap.is-open .premium-select-menu {
  opacity: 1;
  visibility: visible;
  transform: translateY(0) scale(1);
}
.premium-select-option {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 12px 14px;
  border-radius: 12px;
  color: black;
  font-size: 15px;
  background: 0 0;
  border: none;
  transition: 0.2s;
}
.premium-select-option:hover {
  color: #f5265c !important;
  background: #FFF5E8 !important;
}
.premium-select-option.is-selected {
  color: #f5265c;
  background: linear-gradient(
    110deg,
    rgba(245, 38, 92, 0.09),
    rgba(250, 120, 15, 0.09)
  );
  font-weight: 600;
}
.premium-select-option .option-check {
  color: #f5265c;
  font-weight: 700;
}
.premium-select-menu::-webkit-scrollbar {
  width: 5px;
}
.premium-select-menu::-webkit-scrollbar-thumb {
  background: #f5b3c6;
  border-radius: 10px;
}
.premium-date {
  padding: 0 18px;
  font-size: 16px;
}
.custom-date {
  color-scheme: light;
  color: #14142b !important;
  background: #fff !important;
  border: 1px solid #e5e7eb !important;
}
.custom-date:hover {
  border-color: rgba(255, 46, 134, 0.5) !important;
}
.custom-date:focus {
  border-color: #ff2e86 !important;
  outline: 0 !important;
  box-shadow: 0 0 0 4px rgba(255, 46, 134, 0.1) !important;
}
.custom-date::-webkit-calendar-picker-indicator {
  opacity: 0;
  cursor: pointer;
  position: absolute;
  right: 0;
  width: 47px;
  height: 47px;
}
.custom-date:valid {
  color: #14142b !important;
}
.custom-date:invalid {
  color: #9ca3af !important;
}
.mela-footer,
.mela-footer-bottom {
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
}
.mela-footer {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}
@keyframes footerGlow {
  0%,
  100% {
    transform: translate(0, 0) scale(1);
  }
  50% {
    transform: translate(35px, 20px) scale(1.08);
  }
}
@keyframes footerGlow2 {
  0%,
  100% {
    transform: translate(0, 0) scale(1);
  }
  50% {
    transform: translate(-25px, -25px) scale(1.1);
  }
}
@keyframes footerOrb {
  0%,
  100% {
    transform: translate(0, 0);
    opacity: 0.7;
  }
  50% {
    transform: translate(35px, -25px);
    opacity: 1;
  }
}
@keyframes footerOrb2 {
  0%,
  100% {
    transform: translate(0, 0);
    opacity: 0.6;
  }
  50% {
    transform: translate(-35px, 25px);
    opacity: 1;
  }
}
.animate-footerGlow {
  animation: 9s ease-in-out infinite footerGlow;
}
.animate-footerGlow2 {
  animation: 11s ease-in-out infinite footerGlow2;
}
.animate-footerOrb {
  animation: 5s ease-in-out infinite footerOrb;
}
.animate-footerOrb2 {
  animation: 6s ease-in-out infinite footerOrb2;
}
@media (max-width: 767.98px) {
  #drawerLayer .mobile-drawer,
  #drawerLayer.drawer-layer {
    min-height: 0 !important;
    box-sizing: border-box !important;
  }
  #drawerLayer.drawer-layer {
    position: fixed !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100vh !important;
    height: 100dvh !important;
    max-height: 100dvh !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
    z-index: 99999 !important;
  }
  #drawerLayer .drawer-backdrop {
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
  }
  #drawerLayer .mobile-drawer {
    position: absolute !important;
    top: 0 !important;
    bottom: 0 !important;
    height: auto !important;
    max-height: 100% !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    overscroll-behavior: contain !important;
    -webkit-overflow-scrolling: touch;
    padding-bottom: calc(16px + env(safe-area-inset-bottom)) !important;
  }
  #drawerLayer[hidden] {
    display: none !important;
  }
}
body {
  width: 100%;
  max-width: 100%;
  overflow-x: clip;
}
#heroSlider {
  width: 100%;
  max-width: 100%;
}
@media (min-width: 320px) and (max-width: 1023px) {
  .search-bar {
    margin-top: -40px !important;
    z-index: 0 !important;
    position: relative !important;
  }
}
[role="button"]:focus-visible,
[role="dialog"] button:focus-visible,
a:focus-visible,
button:focus-visible {
  outline: #ff2e86 solid 3px;
  outline-offset: 3px;
}
#page-loader {
  position: fixed;
  inset: 0;
  z-index: 999999;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-height: 100vh;
  min-height: 100dvh;
  box-sizing: border-box;
  overflow: hidden;
  /* background: linear-gr
  adient(135deg, #fff1f7 0, #fff 50%, #fff3e8 100%); */
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transition: opacity 0.7s, visibility 0.7s;
}
#page-loader > div {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
}
#page-loader h2 {
  margin-top: 1.5rem;
  color: #14142b;
  font-size: 1rem;
  font-weight: 800;
  letter-spacing: 0.15em;
  text-transform: uppercase;
}
#page-loader p {
  margin-top: 0.25rem;
  color: #6b7280;
  font-size: 0.75rem;
  font-weight: 500;
}
body,
html {
  background-color: #fff8fb;
}
@media (max-width: 767px) {
  #page-loader {
    padding: 20px;
    min-height: 100vh;
    min-height: 100dvh;
  }
}
@media (prefers-reduced-motion: reduce) {
  #page-loader {
    transition: none;
  }
}

/* ==========================================
   MELA PREMIUM BLACK DARK MODE
   Reference Image Matching
========================================== */

html.dark {
  color-scheme: dark;

  /* ==========================================
       MAIN BACKGROUND
    ========================================== */

  body {
    background: #07070c !important;
    color: #ffffff !important;
  }

  main {
    background: #07070c !important;
  }

  section {
    background-color: transparent;
  }
/* ==========================================
   EVENT DAY SELECT - BLACK MODE
========================================== */

.select-3d-wrapper:has(#event_day_select) .event-day-trigger {
  background: transparent;
  border: 1px solid #333;
  color: #fff;
  box-shadow: none;
}

.select-3d-wrapper:has(#event_day_select) .event-day-trigger:hover,
.select-3d-wrapper:has(#event_day_select) .event-day-trigger.active {
  background: transparent;
  border-color: #FF2E86;
  box-shadow: 0 4px 16px rgba(255,46,134,.10);
}

.select-3d-wrapper:has(#event_day_select) .event-day-trigger i {
  color: #FF2E86;
}

.select-3d-wrapper:has(#event_day_select) .event-day-menu {
  background: #171717;
  border: 1px solid #303030;
  box-shadow: 0 15px 40px rgba(0,0,0,.45);
}

.select-3d-wrapper:has(#event_day_select) .event-day-option {
  background: #171717;
  color: #eee;
}

.select-3d-wrapper:has(#event_day_select) .event-day-option:hover {
  background: #292323;
  color: #FF2E86;
}

.select-3d-wrapper:has(#event_day_select) .event-day-option.selected {
  background: linear-gradient(110deg, #302027, #30251f);
  color: #FF2E86;
  font-weight: 700;
}

.select-3d-wrapper:has(#event_day_select) .event-day-option i {
  color: #FF2E86;
}

.select-3d-wrapper:has(#event_day_select) .event-day-menu::-webkit-scrollbar-thumb {
  background: #71364e;
}
  /* ==========================================
       PAGE LOADER
    ========================================== */

  #page-loader {
    background: #07070c !important;
    color: #ffffff !important;
  }

  #page-loader h2,
  #page-loader p {
    color: #ffffff !important;
  }

  /* ==========================================
       NAVBAR
    ========================================== */

  .navbar,
  .navbar__container,
  .navbar__wrapper {
    background: rgba(15, 15, 22, 0.9) !important;

    border-color: rgba(255, 255, 255, 0.12) !important;

    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
  }

  .brand__name {
    color: #ffffff !important;
  }

  .navbar__actions {
    color: #ffffff !important;
  }

  .navbar a {
    color: #ffffff !important;
  }

  .navbar a.active {
    color: #ffffff !important;

    border-color: #ff2e86 !important;
  }

  .icon-button{
    background-color: rgba(255, 255, 255, 0.08) !important;
    border: 1px solid rgba(255, 255, 255, 0.12) !important;

  }
  #heroPrev, #heroNext{
    background-color: black !important;
    color: white !important;
  }
  #heroPrev:hover{
    background-color: #ff2e86 !important;
    }
  #heroNext:hover{
  background-color: #ff2e86 !important;
  }
  .icon-button:hover{
    border: 1px solid rgba(255, 255, 255, 0.12) !important;
    /* background-color: rgba(255, 255, 255, 0.14) !important; */
  }
  /* ==========================================
       NAVBAR TOGGLE BACKGROUND
    ========================================== */

  .navbar__actions button,
  .navbar__actions .theme-toggle,
  .theme-toggle,
  #themeToggle,
  #darkModeToggle {
    /* background: rgba(255, 255, 255, 0.08) !important; */

    color: #ffffff !important;

    border-color: rgba(255, 255, 255, 0.12) !important;
  }



  /* ==========================================
       HERO SLIDER
    ========================================== */

  #heroSlider {
    background: #07070c !important;
  }

  .heroPrev,
  .heroNext {
    background: rgba(15, 15, 22, 0.85) !important;

    color: #ffffff !important;

    border-color: rgba(255, 255, 255, 0.15) !important;
  }

  .heroPrev:hover,
  .heroNext:hover {
    background: linear-gradient(135deg, #ff1685, #ff8a00) !important;

    color: #ffffff !important;
  }

  /* ==========================================
       SEARCH BAR
    ========================================== */

  .search-bar form {
    background: #101016 !important;

    border-color: rgba(255, 255, 255, 0.12) !important;
  }

  .search-bar form > div {
    background: #19191f !important;

    border-color: rgba(255, 255, 255, 0.1) !important;
  }

  .search-bar form > div:focus-within {
    background: #202026 !important;

    border-color: rgba(255, 46, 134, 0.45) !important;
  }

  .search-bar input,
  .search-bar select {
    background: transparent !important;

    color: #ffffff !important;
  }

  .search-bar input::placeholder {
    color: #a1a1aa !important;
  }

  .search-bar select option {
    background: #111116 !important;

    color: #ffffff !important;
  }

  /* ==========================================
       EVENT CARDS
    ========================================== */

  .my-card {
    background: #111116 !important;

    border-color: #29292f !important;

    color: #ffffff !important;
  }

  .my-card:hover {
    background: #17171d !important;

    border-color: rgba(255, 46, 134, 0.3) !important;
  }

  #eventsGridContainer > div > div {
    background: #111116 !important;

    border-color: #29292f !important;

    color: #ffffff !important;
  }

  #eventsGridContainer > div > div:hover {
    background: #17171d !important;

    border-color: rgba(255, 46, 134, 0.3) !important;
  }

  #eventsGridContainer .bg-gray-50,
  #eventsGridContainer .bg-gray-100,
  #eventsGridContainer .from-gray-50 {
    background: #19191f !important;
  }

  #eventsGridContainer .border-gray-200 {
    border-color: #29292f !important;
  }

  /* ==========================================
       VENUE SPOTLIGHT
    ========================================== */

  .rounded-\[16px\] {
    background: #111116 !important;

    border-color: #29292f !important;

    color: #ffffff !important;
  }

  .rounded-\[16px\]:hover {
    /* background: #17171d !important; */

    border-color: rgba(255, 46, 134, 0.3) !important;
  }

  /* ==========================================
       HEADINGS & TEXT
    ========================================== */

  .my-heading,
  h1,
  h2,
  h3,
  h4,
  h5,
  h6 {
    color: #ffffff !important;
  }

  /* p {
    color: #c4c4cc;
  } */

  .text-black,
  .text-gray-900,
  .text-gray-800,
  .text-gray-700 {
    color: #ffffff !important;
    /* background-color: black !important; */
  }

  .text-gray-600,
  .text-gray-500,
  .text-gray-400 {
    color: #a1a1aa !important;
  }

  /* ==========================================
       BUTTONS
    ========================================== */

  .my-button,
  .flash-btn {
    background: linear-gradient(
      110deg,
      #ff1685,
      #ff2e86 45%,
      #ff8a00
    ) !important;

    color: #ffffff !important;

    border-color: transparent !important;
  }

  .my-button:hover,
  .flash-btn:hover {
    background: linear-gradient(110deg, #f50072, #ff7800) !important;

    color: #ffffff !important;
  }

  /* ==========================================
       FOOTER
    ========================================== */

  footer {
    background: radial-gradient(
        ellipse at 0% 100%,
        rgba(255, 46, 134, 0.18),
        transparent 40%
      ),
      radial-gradient(
        ellipse at 100% 100%,
        rgba(255, 138, 0, 0.15),
        transparent 40%
      ),
      #09090f !important;

    border-top-color: rgba(255, 46, 134, 0.3) !important;

    color: #ffffff !important;
  }

  footer .bg-white,
  footer .bg-gray-50,
  footer .bg-gray-100 {
    background: transparent !important;
  }

  footer h1,
  footer h2,
  footer h3,
  footer h4 {
    color: #ffffff !important;
  }

  footer p,
  footer span,
  footer a {
    color: #c4c4cc !important;
  }

  footer a:hover {
    color: #ff2e86 !important;
  }

  /* ==========================================
       INPUTS & DROPDOWNS
    ========================================== */

  input,
  textarea,
  select {
    background-color: #111116 !important;

    color: #ffffff !important;

    border-color: #29292f !important;
  }

  input::placeholder,
  textarea::placeholder {
    color: #a1a1aa !important;
  }

  select option {
    background: #111116 !important;

    color: #ffffff !important;
  }

  /* ==========================================
       MODALS & POPUPS
    ========================================== */

  .modal,
  .popup,
  .dropdown-menu,
  [role="dialog"] {
    background: #111116 !important;

    color: #ffffff !important;

    border-color: #29292f !important;
  }

  /* ==========================================
       GENERAL BACKGROUNDS
    ========================================== */

  .bg-white {
    background-color: #111116 !important;
  }

  .bg-gray-50 {
    background-color: #101016 !important;
  }

  .bg-gray-100 {
    background-color: #19191f !important;
  }

  .bg-gray-200 {
    background-color: #222228 !important;
  }

  /* ==========================================
       BORDERS
    ========================================== */

  .border,
  .border-gray-100,
  .border-gray-200,
  .border-gray-300,
  .border-t,
  .border-b {
    border-color: rgba(255, 255, 255, 0.1) !important;
  }

  /* ==========================================
       SCROLLBAR
    ========================================== */


  ::-webkit-scrollbar-track {
    background: #07070c;
  }

  ::-webkit-scrollbar-thumb {
    background: #29292f;

    border-radius: 20px;
  }

  ::-webkit-scrollbar-thumb:hover {
    background: #ff2e86;
  }

  /* ==========================================
   INPUTS - PREMIUM BLACK
========================================== */

  input,
  textarea,
  select,
  input[type="date"],
  input[type="text"],
  input[type="email"],
  input[type="number"],
  input[type="search"] {
    background-color: #19191f !important;
    color: #ffffff !important;
    border-color: #303038 !important;
    color-scheme: dark !important;
    caret-color: #ff2e86;
  }

  input::placeholder,
  textarea::placeholder {
    color: #a1a1aa !important;
    opacity: 1;
  }

  input:focus,
  textarea:focus,
  select:focus {
    background-color: #1d1d24 !important;
    border-color: rgba(255, 46, 134, 0.55) !important;
    color: #ffffff !important;
    outline: none !important;
    box-shadow: 0 0 0 3px rgba(255, 46, 134, 0.08) !important;
  }

  /* ==========================================
   DATE PICKER / CALENDAR
========================================== */

  input[type="date"],
  input[type="datetime-local"],
  input[type="time"] {
    background: #19191f !important;
    color: #ffffff !important;
    color-scheme: dark !important;
    border-color: #303038 !important;
  }

  input[type="date"]::-webkit-calendar-picker-indicator,
  input[type="datetime-local"]::-webkit-calendar-picker-indicator {
    filter: invert(1);
    opacity: 0.85;
    cursor: pointer;
  }

  /* Flatpickr Calendar */

  .flatpickr-calendar {
    background: #111116 !important;
    border: 1px solid #303038 !important;
    box-shadow: 0 15px 40px rgba(0, 0, 0, 0.5) !important;
  }

  .flatpickr-calendar .flatpickr-months,
  .flatpickr-calendar .flatpickr-weekdays {
    background: #111116 !important;
  }

  .flatpickr-calendar .flatpickr-month,
  .flatpickr-calendar .flatpickr-current-month,
  .flatpickr-calendar .flatpickr-weekday {
    color: #ffffff !important;
    fill: #ffffff !important;
  }

  .flatpickr-calendar .flatpickr-day {
    color: #e5e5e5 !important;
  }

  .flatpickr-calendar .flatpickr-day:hover {
    background: #29292f !important;
    border-color: #29292f !important;
  }

  .flatpickr-calendar .flatpickr-day.selected {
    background: linear-gradient(135deg, #ff2e86, #ff8a00) !important;
    border-color: transparent !important;
    color: #ffffff !important;
  }

  .flatpickr-calendar .flatpickr-innerContainer,
  .flatpickr-calendar .flatpickr-rContainer {
    background: #111116 !important;
  }

  .flatpickr-calendar .flatpickr-time {
    background: #111116 !important;
    border-color: #303038 !important;
  }

  .flatpickr-calendar .flatpickr-time input,
  .flatpickr-calendar .flatpickr-time .flatpickr-am-pm {
    color: #ffffff !important;
    background: #19191f !important;
  }

  /* ==========================================
   SELECT OPTIONS / DROPDOWNS
========================================== */

  select,
  select option,
  optgroup {
    background-color: #19191f !important;
    color: #ffffff !important;
  }

  select {
    appearance: auto;
    -webkit-appearance: auto;
  }

  select option:checked {
    background: #303038 !important;
    color: #ffffff !important;
  }

  select option:hover {
    background: #29292f !important;
  }

  /* ==========================================
   CART BUTTON
========================================== */

  .cart-btn,
  #cartBtn,
  .cart-button,
  .navbar__cart {
    background: rgba(255, 255, 255, 0.08) !important;
    color: #ffffff !important;
    border-color: rgba(255, 255, 255, 0.12) !important;
  }

  .cart-btn:hover,
  #cartBtn:hover,
  .cart-button:hover,
  .navbar__cart:hover {
    background: linear-gradient(135deg, #ff2e86, #ff8a00) !important;
    color: #000000 !important;
    border-color: transparent !important;
  }

  .cart-btn:hover i,
  #cartBtn:hover i,
  .cart-button:hover i,
  .navbar__cart:hover i {
    color: #000000 !important;
  }

  /* ==========================================
   TOGGLE BUTTON
========================================== */

  .theme-toggle,
  #themeToggle,
  #darkModeToggle {
    /* background: rgba(128, 128, 128, 0.55) !important; */
    box-shadow: none !important;
    color: #ffffff !important;
    border: 1px solid rgba(255, 255, 255, 0.12) !important;
  }

  /* ==========================================
   PREMIUM EVENT CARDS
========================================== */

  .my-card,
  #eventsGridContainer > div > div {
    background: linear-gradient(145deg, #17171d 0%, #101015 100%) !important;

    border: 1px solid rgba(255, 255, 255, 0.13) !important;

    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.35),
      0 0 18px rgba(255, 255, 255, 0.035),
      inset 0 1px 0 rgba(255, 255, 255, 0.06) !important;

    color: #ffffff !important;
  }

  .my-card:hover,
  #eventsGridContainer > div > div:hover {
    background: linear-gradient(145deg, #1d1d25 0%, #141419 100%) !important;

    border-color: rgba(255, 255, 255, 0.24) !important;

    box-shadow: 0 15px 40px rgba(0, 0, 0, 0.45),
      0 0 25px rgba(255, 255, 255, 0.075),
      inset 0 1px 0 rgba(255, 255, 255, 0.09) !important;
  }

  /* ==========================================
   VENUE CARDS
========================================== */

  .rounded-\[16px\] {
    background: linear-gradient(145deg, #17171d, #101015) !important;

    border-color: rgba(255, 255, 255, 0.13) !important;

    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.3),
      0 0 15px rgba(255, 255, 255, 0.035) !important;
  }

  /* ==========================================
   FOOTER - PREMIUM DARK GLOW
========================================== */

  footer {
    background: radial-gradient(
        ellipse at 5% 100%,
        rgba(255, 46, 134, 0.2),
        transparent 38%
      ),
      radial-gradient(
        ellipse at 95% 100%,
        rgba(255, 138, 0, 0.16),
        transparent 38%
      ),
      linear-gradient(180deg, #101015 0%, #09090e 100%) !important;

    border-top: 1px solid rgba(255, 255, 255, 0.15) !important;
    color: #ffffff !important;
  }

  footer .bg-white,
  footer .bg-gray-50,
  footer .bg-gray-100 {
    background: transparent !important;
  }

  footer h1,
  footer h2,
  footer h3,
  footer h4 {
    color: #ffffff !important;
  }

  footer p,
  footer span,
  footer a {
    color: #bdbdc7 !important;
  }

  footer a:hover {
    color: #ff2e86 !important;
  }

  footer .border-t,
  footer .border-b {
    border-color: rgba(255, 255, 255, 0.12) !important;
  }
  /* SIGN IN */
.dark .navbar__actions .text-button {
  background: transparent !important;
  border-color: transparent !important;
}

.dark .navbar__actions .text-button a {
  color: #ffffff !important;
}

/* SIGN UP - ORIGINAL GRADIENT */
.dark .navbar__actions .primary-button {
  background: linear-gradient(
      110deg,
      #ff1685,
      #ff2e86 45%,
      #ff8a00
  ) !important;
  color: #ffffff !important;
  border-color: transparent !important;
}

.dark .navbar__actions .primary-button a {
  color: #ffffff !important;
}

/* MOBILE SIGN IN */
.dark .drawer__bottom .text-button {
  background: transparent !important;
}

.dark .drawer__bottom .text-button a {
  color: #ffffff !important;
}
.premium-select-btn{
  background-color: transparent !important;
  color: white !important;
}
/* ==========================================
   SEARCH FILTER
========================================== */

#filterForm {
  background: #111116 !important;
  border-color: rgba(255, 255, 255, 0.12) !important;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.35) !important;
}

#filterForm > div {
  background: #19191f !important;
  border-color: #303038 !important;
  transition: all 0.2s ease;
}

#filterForm > div:hover {
  background: #1d1d24 !important;
  border-color: rgba(255, 46, 134, 0.3) !important;
}

#filterForm > div:focus-within {
  background: #1d1d24 !important;
  border-color: rgba(255, 46, 134, 0.55) !important;
  box-shadow: 0 0 0 3px rgba(255, 46, 134, 0.08) !important;
}

#filterForm > div > i {
  color: #ff2e86 !important;
}

/* SELECT DROPDOWNS */

#filterForm select,
#filterForm .premium-select-wrap select {
  background: transparent !important;
  color: #ffffff !important;
  border-color: transparent !important;
  color-scheme: dark !important;
}

#filterForm select option {
  background: #19191f !important;
  color: #ffffff !important;
}

#filterForm select option:checked {
  background: #303038 !important;
  color: #ffffff !important;
}

/* DATE INPUT */

#filterForm input[type="text"],
#filterForm #premium-date-filter {
  background: transparent !important;
  color: #ffffff !important;
  border-color: transparent !important;
  caret-color: #ff2e86;
}

#filterForm #premium-date-filter::placeholder {
  color: #a1a1aa !important;
}

/* FLATPICKR CALENDAR */

.flatpickr-calendar {
  background: #111116 !important;
  border: 1px solid #303038 !important;
  box-shadow: 0 15px 40px rgba(0, 0, 0, 0.5) !important;
}

.flatpickr-calendar .flatpickr-months,
.flatpickr-calendar .flatpickr-weekdays,
.flatpickr-calendar .flatpickr-innerContainer,
.flatpickr-calendar .flatpickr-rContainer {
  background: #111116 !important;
}

.flatpickr-calendar .flatpickr-month,
.flatpickr-calendar .flatpickr-current-month,
.flatpickr-calendar .flatpickr-weekday {
  color: #ffffff !important;
  fill: #ffffff !important;
}

.flatpickr-calendar .flatpickr-day {
  color: #e5e5e5 !important;
  border-color: transparent !important;
}

.flatpickr-calendar .flatpickr-day:hover {
  background: #29292f !important;
  border-color: #29292f !important;
}

.flatpickr-calendar .flatpickr-day.selected,
.flatpickr-calendar .flatpickr-day.startRange,
.flatpickr-calendar .flatpickr-day.endRange {
  background: linear-gradient(135deg, #ff2e86, #ff8a00) !important;
  border-color: transparent !important;
  color: #ffffff !important;
}

.flatpickr-calendar .flatpickr-day.today {
  border-color: #ff2e86 !important;
}

.flatpickr-calendar .flatpickr-day.prevMonthDay,
.flatpickr-calendar .flatpickr-day.nextMonthDay,
.flatpickr-calendar .flatpickr-day.flatpickr-disabled {
  color: #60606b !important;
}

.flatpickr-calendar .flatpickr-prev-month svg,
.flatpickr-calendar .flatpickr-next-month svg {
  fill: #ffffff !important;
}

/* SEARCH BUTTON */

#filterForm button[type="submit"] {
  background: linear-gradient(
      110deg,
      #ff1685,
      #ff2e86 45%,
      #ff8a00
  ) !important;
  color: #ffffff !important;
  border-color: transparent !important;
}
  /* ==========================================
     SEARCH FILTER - PREMIUM DARK THEME
  ========================================== */

  .search-bar form#filterForm {
    background: #111116 !important;
    border: 1px solid rgba(255, 255, 255, 0.12) !important;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.35) !important;
  }

  /* Location, Category & Date Fields */

  .search-bar #filterForm > div {
    background: #19191f !important;
    border: 1px solid #303038 !important;
    transition: all 0.2s ease;
  }

  .search-bar #filterForm > div:hover {
    background: #1d1d24 !important;
    border-color: rgba(255, 46, 134, 0.3) !important;
  }

  .search-bar #filterForm > div:focus-within {
    background: #202026 !important;
    border-color: rgba(255, 46, 134, 0.55) !important;
    box-shadow: 0 0 0 3px rgba(255, 46, 134, 0.08) !important;
  }

  /* Filter Icons */

  .search-bar #filterForm > div > i {
    color: #ff2e86 !important;
  }

  /* ==========================================
     PREMIUM SELECT - CLOSED DROPDOWN
  ========================================== */

  .search-bar .premium-select-wrap,
  .search-bar .js-premium-select {
    background: transparent !important;
    color: #ffffff !important;
  }

  .search-bar .premium-select-btn {
    background: transparent !important;
    color: #ffffff !important;
    border-color: transparent !important;
  }

  .search-bar .premium-select-btn:hover {
    background: transparent !important;
    color: #ffffff !important;
  }

  .search-bar .premium-select-btn i,
  .search-bar .premium-select-btn svg {
    color: #a1a1aa !important;
    fill: #a1a1aa !important;
  }

  /* ==========================================
     PREMIUM SELECT - OPEN DROPDOWN
  ========================================== */

  .premium-select-dropdown,
  .premium-select-options,
  .premium-select-menu,
  .premium-select-list {
    background: #111116 !important;
    border: 1px solid #303038 !important;
    color: #ffffff !important;
    box-shadow: 0 15px 40px rgba(0, 0, 0, 0.5) !important;
  }

  /* .premium-select-dropdown *,
  .premium-select-options *,
  .premium-select-menu *,
  .premium-select-list * {
    /* color: #e5e5e5; */
  /* } */

  .premium-select-dropdown [data-value]:hover,
  .premium-select-options [data-value]:hover,
  .premium-select-menu [data-value]:hover,
  .premium-select-list [data-value]:hover {
    background: #29292f !important;
    color: #ffffff !important;
  }

  .premium-select-dropdown .selected,
  .premium-select-options .selected,
  .premium-select-menu .selected,
  .premium-select-list .selected,
  .premium-select-dropdown [aria-selected="true"],
  .premium-select-options [aria-selected="true"] {
    background: rgba(255, 46, 134, 0.15) !important;
    color: #ff2e86 !important;
  }

  /* Native Select Fallback */

  .search-bar select,
  .search-bar select option,
  .search-bar optgroup {
    background-color: #19191f !important;
    color: #ffffff !important;
    color-scheme: dark !important;
  }

  .search-bar select option:checked {
    background: #303038 !important;
    color: #ffffff !important;
  }

  /* ==========================================
     DATE INPUT
  ========================================== */

  .search-bar #premium-date-filter {
    background: transparent !important;
    color: #ffffff !important;
    border-color: transparent !important;
    caret-color: #ff2e86;
    color-scheme: dark !important;
  }

  .search-bar #premium-date-filter::placeholder {
    color: #a1a1aa !important;
    opacity: 1;
  }

  /* ==========================================
     FLATPICKR - CALENDAR MAIN
  ========================================== */

  .flatpickr-calendar {
    background: #111116 !important;
    border: 1px solid #303038 !important;
    box-shadow: 0 15px 40px rgba(0, 0, 0, 0.5) !important;
    color: #ffffff !important;
  }

  .flatpickr-calendar:before,
  .flatpickr-calendar:after {
    border-bottom-color: #111116 !important;
    border-top-color: #111116 !important;
  }

  /* Month Header */

  .flatpickr-calendar .flatpickr-months,
  .flatpickr-calendar .flatpickr-month,
  .flatpickr-calendar .flatpickr-current-month {
    background: #111116 !important;
    color: #ffffff !important;
    fill: #ffffff !important;
  }

  .flatpickr-calendar .flatpickr-current-month input,
  .flatpickr-calendar .flatpickr-current-month select {
    background: transparent !important;
    color: #ffffff !important;
  }

  .flatpickr-calendar .flatpickr-current-month select option {
    background: #19191f !important;
    color: #ffffff !important;
  }

  /* Previous / Next Month */

  .flatpickr-calendar .flatpickr-prev-month,
  .flatpickr-calendar .flatpickr-next-month {
    color: #ffffff !important;
    fill: #ffffff !important;
  }

  .flatpickr-calendar .flatpickr-prev-month:hover,
  .flatpickr-calendar .flatpickr-next-month:hover {
    color: #ff2e86 !important;
  }

  .flatpickr-calendar .flatpickr-prev-month svg,
  .flatpickr-calendar .flatpickr-next-month svg {
    fill: #ffffff !important;
  }

  /* Weekdays */

  .flatpickr-calendar .flatpickr-weekdays,
  .flatpickr-calendar span.flatpickr-weekday {
    background: #111116 !important;
    color: #a1a1aa !important;
  }

  /* Calendar Background */

  .flatpickr-calendar .flatpickr-innerContainer,
  .flatpickr-calendar .flatpickr-rContainer,
  .flatpickr-calendar .flatpickr-days,
  .flatpickr-calendar .dayContainer {
    background: #111116 !important;
  }

  /* Normal Dates */

  .flatpickr-calendar .flatpickr-day {
    color: #e5e5e5 !important;
    border-color: transparent !important;
  }

  .flatpickr-calendar .flatpickr-day:hover {
    background: #29292f !important;
    border-color: #29292f !important;
    color: #ffffff !important;
  }

  /* Today */

  .flatpickr-calendar .flatpickr-day.today {
    border-color: #ff2e86 !important;
    color: #ff2e86 !important;
  }

  /* Selected Date */

  .flatpickr-calendar .flatpickr-day.selected,
  .flatpickr-calendar .flatpickr-day.startRange,
  .flatpickr-calendar .flatpickr-day.endRange,
  .flatpickr-calendar .flatpickr-day.selected:hover {
    background: linear-gradient(135deg, #ff2e86, #ff8a00) !important;
    border-color: transparent !important;
    color: #ffffff !important;
  }

  /* Disabled / Previous / Next Dates */

  .flatpickr-calendar .flatpickr-day.prevMonthDay,
  .flatpickr-calendar .flatpickr-day.nextMonthDay,
  .flatpickr-calendar .flatpickr-day.flatpickr-disabled {
    color: #60606b !important;
  }

  /* Time Picker */

  .flatpickr-calendar .flatpickr-time {
    background: #111116 !important;
    border-color: #303038 !important;
  }

  .flatpickr-calendar .flatpickr-time input,
  .flatpickr-calendar .flatpickr-time .flatpickr-am-pm {
    background: #19191f !important;
    color: #ffffff !important;
  }

  /* ==========================================
     SEARCH BUTTON
  ========================================== */

  /* .search-bar #filterForm button[type="submit"] {
    background: linear-gradient(
      110deg,
      #ff1685,
      #ff2e86 45%,
      #ff8a00
    ) !important;

    color: #ffffff !important;
    border-color: transparent !important;
  } */
.tex{
  color: white !important;
}
.hyd,.spot{
  color: #FF2E86;
}

  .search-bar #filterForm button[type="submit"]:hover {
    background: linear-gradient(
      110deg,
      #f50072,
      #ff7800
    ) !important;
  }
  .colum a{
    color: white !important;
  }
  .colum a:hover{
    color: #ff2e86 !important;
    transition: all;
    transition-duration: 200ms;
  }
  .colum {
    color: white !important;
  }
  .event-card {
    box-shadow: 0 0 20px rgba(255, 255, 255, 0.20);
    border: 1px solid rgba(255, 255, 255, 0.35);
    transition: all 0.3s ease;
}

.event-card:hover {
    box-shadow: 0 0 30px rgba(255, 255, 255, 0.35);
}
.mel{
  background: none !important;
}
/* Made for Hyderabad Badge */
.mad {
  background: rgba(28, 28, 36, 0.92) !important;
  border: 1px solid rgba(255, 255, 255, 0.14);
  box-shadow: 0 5px 20px rgba(255, 255, 255, 0.08);
  backdrop-filter: blur(12px);
}

/* Badge Text */
.mad span:last-child {
  color: #ffffff !important;
}

/* Pink Dot */
.mad span:first-child {
  background-color: #ff2e86 !important;
  box-shadow: 0 0 8px rgba(255, 46, 134, 0.6);
}
/* Feature Cards Only */
#featureCards > .group {
  background: linear-gradient(135deg, #1c1c24, #14141b) !important;
  border: 1px solid rgba(255, 255, 255, 0.10) !important;
  box-shadow: 0 4px 20px rgba(255, 255, 255, 0.025);
  transition: all 0.3s ease;
}

#featureCards > .group:hover {
  border-color: rgba(255, 255, 255, 0.20) !important;
  box-shadow: 0 10px 30px rgba(255, 255, 255, 0.07);
  transform: translateY(-4px);
}

#featureCards > .group h3 {
  color: #fff !important;
}

#featureCards > .group p {
  color: #a1a1aa !important;
}

/* Pink Icon */
#featureCards > .group:nth-child(1) > div:first-child {
  background: rgba(245, 38, 92, 0.13) !important;
  color: #ff4d91 !important;
}

/* Purple Icon */
#featureCards > .group:nth-child(2) > div:first-child {
  background: rgba(139, 92, 246, 0.13) !important;
  color: #a78bfa !important;
}

/* Orange Icon */
#featureCards > .group:nth-child(3) > div:first-child {
  background: rgba(249, 115, 22, 0.13) !important;
  color: #fb923c !important;
}

/* Main Trust Bar */
#trustBarSection > div > div {
  background: linear-gradient(110deg, #1c1c24, #17171f, #201a20) !important;
  border: 1px solid rgba(255, 255, 255, 0.12) !important;
  box-shadow: 0 5px 25px rgba(255, 255, 255, 0.05) !important;
}

/* Dividers */
#trustBarSection > div > div > div {
  border-color: rgba(255, 255, 255, 0.12) !important;
}

/* Text */
#trustBarSection > div > div > div > span {
  color: #e5e7eb !important;
}

/* All Icon Circles - Base */
#trustBarSection > div > div > div > div {
  border: 1px solid rgba(255, 255, 255, 0.08) !important;
}

/* Lock Icon */
#trustBarSection > div > div > div:nth-child(1) > div {
  background: rgba(249, 115, 22, 0.15) !important;
  color: #fb923c !important;
}

/* Bank Icon */
#trustBarSection > div > div > div:nth-child(2) > div {
  background: rgba(156, 163, 175, 0.15) !important;
  color: #d1d5db !important;
}

/* Ticket Icon */
#trustBarSection > div > div > div:nth-child(3) > div {
  background: rgba(245, 38, 92, 0.15) !important;
  color: #ff4d91 !important;
}

/* Support Icon */
#trustBarSection > div > div > div:nth-child(4) > div {
  background: rgba(139, 92, 246, 0.15) !important;
  color: #a78bfa !important;
}
/* Review Cards */
#reviewCards > div {
  background: linear-gradient(135deg, #1c1c24, #15151c) !important;
  border: 1px solid rgba(255, 255, 255, 0.09) !important;
  box-shadow: 0 4px 18px rgba(255, 255, 255, 0.025);
  transition: all 0.3s ease;
}

/* Hover Effect */
#reviewCards > div:hover {
  transform: translateY(-4px);
  border-color: rgba(255, 255, 255, 0.18) !important;
  box-shadow: 0 10px 25px rgba(255, 255, 255, 0.07);
}

/* Reviewer Names */
#reviewCards h3 {
  color: #ffffff !important;
}

/* Review Text */
#reviewCards p {
  color: #a1a1aa !important;
}

/* Profile Images */
#reviewCards img {
  border-color: #292933 !important;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
}

/* Star Rating */
#reviewCards .text-yellow-400 {
  color: #fbbf24 !important;
}
/* Organizer Banner */
#organizerBanner .relative.overflow-hidden {
  background: linear-gradient(110deg, #241722, #1c1c24, #241b17) !important;
  border: 1px solid rgba(255, 255, 255, 0.12) !important;
  box-shadow: 0 6px 25px rgba(255, 255, 255, 0.04);
}

/* Heading */
#organizerBanner h3 {
  color: #ffffff !important;
}

/* Bullhorn Icon */
#organizerBanner .rounded-full {
  background: rgba(245, 38, 92, 0.14) !important;
  color: #ff4d91 !important;
  border-color: rgba(245, 38, 92, 0.20) !important;
}

/* Contact Us Button */
#organizerBanner a[href="./Contact-us.php"] {
  background: #252530 !important;
  color: #e5e7eb !important;
  border: 1px solid rgba(255, 255, 255, 0.18) !important;
}

#organizerBanner a[href="./Contact-us.php"]:hover {
  background: #333340 !important;
  border-color: rgba(255, 255, 255, 0.35) !important;
}

/* Organizer Button */
#organizerBanner a[href="mailto:hr@webow.co"] {
  color: #ffffff !important;
  box-shadow: 0 5px 18px rgba(245, 38, 92, 0.18);
}
/* Stats Counter - Dark Mode */
#statsCounterSection .stats-counter {
  background: linear-gradient(110deg, #211b24, #1c1c25, #241d1a) !important;
  border: 1px solid rgba(255, 255, 255, 0.12) !important;
  box-shadow: 0 5px 25px rgba(255, 255, 255, 0.04) !important;
}

/* Counter Numbers */
#statsCounterSection .counter {
  color: #ffffff !important;
}

/* Labels */
#statsCounterSection .stats-counter span:not(:has(+ .counter)) {
  color: #b9b9c3;
}

/* Vertical Dividers */
#statsCounterSection .bg-\[\#e7e7e7\] {
  background: rgba(255, 255, 255, 0.15) !important;
}

/* Rating Star */
#statsCounterSection .text-\[\#f59e0b\] {
  color: #ffb52e !important;
}
/* Event Cards - White Glow Shadow */
.event-card {
  position: relative;
  isolation: isolate;
  background: #1d1d27 !important;
  border: 1px solid rgba(255, 255, 255, 0.12) !important;
  box-shadow:
      0 0 18px rgba(255, 255, 255, 0.10),
      0 0 35px rgba(255, 255, 255, 0.06) !important;
  transition: all 0.3s ease;
}

.event-card:hover {
  box-shadow:
      0 0 22px rgba(255, 255, 255, 0.16),
      0 0 45px rgba(255, 255, 255, 0.10) !important;
  border-color: rgba(255, 255, 255, 0.25) !important;
}
/* Contact Form - Dark Mode Labels */
#contactForm label {
  color: #f1f1f5 !important;
}
/* Login - Both Inputs Same Dark Background */
form[action="login.php"] input:not([type="hidden"]) {
  background: rgba(15, 15, 22, 0.9) !important;
  /* border: none !important; */
}

form[action="login.php"] input::placeholder {
  color: #9999a8 !important;
}
form[action="register.php"] input:not([type="hidden"]):not([type="checkbox"]),
form[action="register.php"] select {
  background: rgba(15, 15, 22, 0.9) !important;
}
/* User Menu Dropdown - Dark Mode */
#user-menu-dropdown {
  background: #22222d !important;
  border-color: rgba(255, 255, 255, 0.12) !important;
  box-shadow: 0 8px 25px rgba(0, 0, 0, 0.3) !important;
}

/* Menu Links */
#user-menu-dropdown a {
  color: #e5e5ed !important;
}

/* Icons */
#user-menu-dropdown a i {
  color: #ff3983 !important;
}

/* Hover */
#user-menu-dropdown a:hover {
  background: rgba(255, 255, 255, 0.08) !important;
  color: #ff3983 !important;
}

/* Logout */
#user-menu-dropdown a[href*="logout"] {
  color: #ff6b78 !important;
}

#user-menu-dropdown a[href*="logout"] i {
  color: #ff6b78 !important;
}

/* Divider */
#user-menu-dropdown .border-t {
  border-color: rgba(255, 255, 255, 0.12) !important;
}
/* Welcome User Button - Dark Mode */
#user-menu-button {
  background: rgba(255, 255, 255, 0.1) !important;
  border-color: rgba(255, 255, 255, 0.15) !important;
  transition: all 0.3s ease;
}

/* Welcome Name */
#user-menu-button span.text-gray-700 {
  color: #ffffff !important;
}

/* Button Hover */
#user-menu-button:hover {
  background: rgba(255, 255, 255, 0.17) !important;
  border-color: rgba(255, 255, 255, 0.25) !important;
}

/* Chevron */
#user-menu-chevron {
  color: #ff3983 !important;
}
/* ========================================
   PRIVACY POLICY PAGE - DARK THEME ONLY
======================================== */

#privacyPolicyPage {
  /* background: #17171f !important; */
  color: #f1f1f5 !important;
}



/* Headings */
#privacyPolicyPage h1,
#privacyPolicyPage h2,
#privacyPolicyPage h3,
#privacyPolicyPage h4 {
  color: #ffffff !important;
}

/* Paragraphs */
#privacyPolicyPage p {
  color: #b5b5c2 !important;
}
#privacyPolicyPage .bg-white\/40 {
  background: rgba(255, 255, 255, 0.06) !important;
  border-color: rgba(255, 255, 255, 0.15) !important;
  box-shadow: 0 15px 50px rgba(0, 0, 0, 0.25) !important;
}

/* =========================================
   EVENT DETAILS PAGE - DARK THEME
========================================= */

#eventDetailsPage {
  /* background: #17171f !important; */
  color: #f1f1f5 !important;
}

/* Main Cards */
#eventDetailsPage #eventGrid .bg-white {
  /* background: #20202a !important; */
  border-color: rgba(255,255,255,0.10) !important;
  color: #f1f1f5 !important;
  box-shadow: 0 5px 22px rgba(0,0,0,0.20) !important;
}

/* Headings */
#eventDetailsPage h1,
#eventDetailsPage h3,
#eventDetailsPage h4 {
  color: #f5f5fa !important;
}

/* Text */
#eventDetailsPage .text-\[\#14142B\] {
  color: #f1f1f5 !important;
}

#eventDetailsPage .text-gray-600,
#eventDetailsPage .text-gray-500 {
  color: #b5b5c2 !important;
}

#eventDetailsPage .text-gray-400 {
  color: #9292a3 !important;
}

/* Breadcrumb */
#eventDetailsPage nav {
  color: #9292a3 !important;
}

#eventDetailsPage nav span {
  color: #f1f1f5 !important;
}

/* Event Duration */
#eventDetailsPage .bg-pink-50 {
  background: rgba(245,38,92,0.10) !important;
  border-color: rgba(245,38,92,0.22) !important;
}

/* Duration Badge */
#eventDetailsPage .bg-pink-50 .bg-white {
  background: rgba(255,255,255,0.07) !important;
  border-color: rgba(245,38,92,0.25) !important;
}

/* Orange Badges */
#eventDetailsPage .bg-orange-50 {
  background: rgba(250,120,15,0.12) !important;
}

/* Information Boxes */
#eventDetailsPage .bg-gray-50,
#eventDetailsPage .bg-gray-50\/80 {
 background-color: transparent !important;
  border: 1px solid #ffffff1a
  !important;
  /* border-color: rgba(255,255,255,0.10) !important; */
}

/* Gray Badges */
#eventDetailsPage .bg-gray-100 {
  background: #30303c !important;
  color: #d1d1dc !important;
}

/* Borders */
#eventDetailsPage .border-gray-100,
#eventDetailsPage .border-gray-200,
#eventDetailsPage .border-gray-200\/60 {
  border-color: rgba(255,255,255,0.10) !important;
}

/* Artist Cards */
#eventDetailsPage #lineupBox .group {
  /* background: #292934 !important; */
  border-color: rgba(255,255,255,0.10) !important;
}

#eventDetailsPage #lineupBox .group:hover {
  border-color: rgba(245,38,92,0.4) !important;
  box-shadow: 0 8px 24px rgba(245,38,92,0.10) !important;
}

/* Ticket Cards */
#eventDetailsPage #ticketSidebar .bg-gray-50 {
  /* background: #292934 !important; */
  border-color: rgba(255,255,255,0.10) !important;
}

/* Quantity Controls */
#eventDetailsPage #ticketSidebar .bg-white {
  /* background: #343440 !important; */
  border-color: rgba(255,255,255,0.12) !important;
}

/* Coupon Inputs */
#eventDetailsPage #ticketSidebar input[type="text"] {
  background: #17171f !important;
  color: #ffffff !important;
  border-color: rgba(255,255,255,0.15) !important;
}

#eventDetailsPage #ticketSidebar input::placeholder {
  color: #9292a3 !important;
}

/* Directions Button */
#eventDetailsPage a.bg-pink-50 {
  background: rgba(245,38,92,0.12) !important;
  color: #ff5796 !important;
}

/* Map */
#eventDetailsPage #eventMap {
  border: 1px solid rgba(255,255,255,0.10);
}

/* Secure Checkout */
#eventDetailsPage #ticketSidebar .text-gray-400 {
  color: #a5a5b5 !important;
}

/* Disabled Button */
#eventDetailsPage #ticketSidebar button:disabled {
  background: #3a3a46 !important;
  color: #9292a3 !important;
}

/* Artist Lightbox */
#artistLightboxModal > div {
  background: #20202a !important;
  border: 1px solid rgba(255,255,255,0.10);
}
.passbor{
  border: 1px solid rgba(255,255,255,0.10);

}
#artistLightboxName {
  color: #ffffff !important;
}

#artistLightboxModal button {
  background: #343440 !important;
  color: #ffffff !important;
}


/* Hero Badges */
#privacyPolicyPage .bg-white\/80 {
  background: rgba(255, 255, 255, 0.07) !important;
  border-color: rgba(255, 255, 255, 0.12) !important;
   color: white !important;
}

/* Security Features Box */
#privacyPolicyPage .shadow-\[0_3px_15px_rgba\(33\,21\,28\,0\.06\)\] {
  background: #20202a !important;
  border-color: rgba(255, 255, 255, 0.10) !important;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.2) !important;
}

/* Security Feature Dividers */
#privacyPolicyPage .border-\[\#21151c\]\/\[0\.06\] {
  border-color: rgba(255, 255, 255, 0.10) !important;
}

/* Your Rights Cards */
#privacyPolicyPage .group.bg-white {
  background: #22222d !important;
  border-color: rgba(255, 255, 255, 0.08) !important;
  box-shadow: 0 3px 12px rgba(0, 0, 0, 0.2) !important;
}

#privacyPolicyPage .group.bg-white:hover {
  background: #292934 !important;
  border-color: rgba(245, 38, 92, 0.35) !important;
  box-shadow: 0 8px 22px rgba(245, 38, 92, 0.10) !important;
}

/* Refund Policy Box */
#privacyPolicyPage .rounded-\[18px\].bg-white {
  background: #20202a !important;
  border-color: rgba(255, 255, 255, 0.12) !important;
  box-shadow: 0 5px 25px rgba(0, 0, 0, 0.2) !important;
}

/* Refund Text */
#privacyPolicyPage .rounded-\[18px\] p {
  color: #b5b5c2 !important;
}

#privacyPolicyPage .rounded-\[18px\] p span {
  color: #ffffff !important;
}

/* Support CTA */
#privacyPolicyPage .bg-gradient-to-r.from-\[\#F5265C\]\/\[0\.07\] {
  background: linear-gradient(110deg, #29202b, #22222d, #29231f) !important;
  border-color: rgba(245, 38, 92, 0.22) !important;
}

/* Support Icon Circle */
#privacyPolicyPage .bg-white.border-\[\#F5265C\]\/15 {
  background: rgba(255, 255, 255, 0.08) !important;
}

/* CHECKOUT PAGE DARK THEME */

#checkoutPage {
  /* background: #17171f !important; */
  color: #f1f1f5 !important;
}

/* Main Cards */
#checkoutPage main #checkoutForm > div > .bg-white {
  /* background: #20202a !important; */
  border-color: #343440 !important;
  color: #f1f1f5 !important;
  box-shadow: 0 5px 22px rgba(0,0,0,.2) !important;
}

/* Section Headings */
#checkoutPage #checkoutForm h2,
#checkoutPage #checkoutForm h3,
#checkoutPage #checkoutForm h4,
#checkoutPage #checkoutForm h5 {
  color: #f1f1f5 !important;
}

/* Ticket & Attendee Boxes */
#checkoutPage .ticket-item-row,
#checkoutPage #attendee-names-container > div,
#checkoutPage #checkoutForm label.bg-gray-50 {
  
  border-color: #3a3a46 !important;
}

/* Ticket Icon */
#checkoutPage .bg-orange-100 {
  background: rgba(250,120,15,.15) !important;
}

/* Quantity Box */
#checkoutPage .ticket-item-row .bg-white {
  background: #343440 !important;
  border-color: #454552 !important;
}

/* Inputs */
#checkoutPage #checkoutForm input[type="text"],
#checkoutPage #checkoutForm input[type="email"] {
  background: #17171f !important;
  color: #f1f1f5 !important;
  border-color: #41414e !important;
}

#checkoutPage #checkoutForm input::placeholder {
  color: #9292a3 !important;
}

/* Labels & Paragraphs */
#checkoutPage #checkoutForm p,
#checkoutPage #checkoutForm label {
  color: #b5b5c2;
}

#checkoutPage #checkoutForm .text-gray-500,
#checkoutPage #checkoutForm .text-gray-600,
#checkoutPage #checkoutForm .text-gray-400 {
  color: #a5a5b5 !important;
}


/* Order Summary */
#checkoutPage #summary-items-list > div {
  color: #c5c5d0 !important;
}

#checkoutPage #summary-subtotal,
#checkoutPage #summary-service-fee,
#checkoutPage #summary-total {
  color: #f1f1f5 !important;
}

/* Coupon Apply Button */
#checkoutPage .ticket-item-row button.bg-\[\#14142B\] {
  background: linear-gradient(135deg, #FF2E86, #FF8A00) !important;
  color: #fff !important;
}

/* Payment Radio */
#checkoutPage input[type="radio"] {
  accent-color: #FF2E86;
}

/* Checkout Steps */
#checkoutPage .checkout-row .item-3,
#checkoutPage .checkout-row .text-gray-400 {
  color: #9292a3 !important;
}

#checkoutPage .checkout-row .bg-gray-100 {
  background: #343440 !important;
}

/* Checkout Progress Lines */
#checkoutPage .checkout-line.bg-gray-200 {
  background: #41414e !important;
}

/* Disabled Continue Button */
#checkoutPage #proceedButton:disabled {
  background: #343440 !important;
  color: #9292a3 !important;
}

/* Active Continue Button */
#checkoutPage #proceedButton:not(:disabled) {
  color: #fff !important;
}

/* Checkout Limit Message */
#checkoutPage #checkout_limit_msg {
  color: #ff7777 !important;
}
.tot{
  color: #e5e7eb !important;
}
.eay,.jaz,.ban,.co{
  color: white !important;
}
.top{
  background-color: transparent !important;
}
.trans{
  color: white !important;
}
.melor{
  color: black !important;
}
.borpass{
  border: 1px solid #303039 !important;
}
.mobile-drawer .drawer__bottom > a[href="/profile.php"] span:nth-child(2) {
  color: #252536 !important;
  -webkit-text-fill-color: #252536 !important;
}
/* Mobile Drawer Navigation Links */
.mobile-drawer .drawer-menu .drawer-link,
.mobile-drawer .drawer-menu .drawer-link:hover,
.mobile-drawer .drawer-menu .drawer-link:active,
.mobile-drawer .drawer-menu .drawer-link:focus,
.mobile-drawer .drawer-menu .drawer-link:visited {
    color: inherit !important;
    -webkit-text-fill-color: currentColor !important;
    opacity: 1 !important;
    text-decoration: none !important;
    transition: color 0.2s ease !important;
    -webkit-tap-highlight-color: transparent !important;
}
.drawer-cart__label{
  color: white !important;
}
/* =========================================
   PROFILE PAGE - DARK MODE
   Only applies to #profilePage
========================================= */

#profilePage > section:not(.bac) {
  background: #111116 !important;
  color: #f5f5f5 !important;
}

/* Copyright background always white */
#profilePage > section.bac {
  background: #ffffff !important;
  background-color: #ffffff !important;
}

/* Main sidebar and content cards */
#profilePage > section .bg-white {
  /* background: #1b1b22 !important; */
  color: #f5f5f5 !important;
  border-color: #303039 !important;
}

/* Sidebar user information */
#profilePage .text-center h3,
#profilePage #profileContent h2,
#profilePage #purchaseContent h2,
#profilePage #purchaseContent h3,
#profilePage #purchaseContent h4 {
  color: #ffffff !important;
}

#profilePage .text-center p {
  color: #b5b5c2 !important;
}

#profilePage .text-center.border-b {
  border-color: #303039 !important;
}

/* Avatar */
#profilePage .text-center .rounded-full {
  background: linear-gradient(135deg, #351522, #4a192e) !important;
  color: #ff5796 !important;
}

/* Sidebar navigation */
#profilePage #purchaseTab {
  color: #e5e5eb !important;
}

#profilePage #purchaseTab:hover {
  background: #29202a !important;
}

#profilePage #profileTab,
#profilePage #purchaseTab.bg-gradient-to-r {
  color: #ffffff !important;
}

/* Form labels */
#profilePage #profileContent label {
  color: #e5e5eb !important;
}

/* Form input containers */
#profilePage #profileContent form .h-\[31px\] {
  background: #111116 !important;
  border-color: #383842 !important;
  color: #f1f1f5 !important;
}

/* Inputs and select */
#profilePage #profileContent input,
#profilePage #profileContent select {
  color: #ffffff !important;
  background-color: transparent !important;
  color-scheme: dark;
}

#profilePage #profileContent input:disabled {
  color: #a5a5b5 !important;
  opacity: 1 !important;
}

/* Input icons */
#profilePage #profileContent .h-\[31px\] i {
  color: #a5a5b5 !important;
}

/* Helper text */
#profilePage #profileContent p {
  color: #a5a5b5 !important;
}

/* Change password link */
#profilePage #changePasswordBtn {
  color: #ff5796 !important;
}

/* Cancel button */
#profilePage #profileContent button[type="button"]:not(#changePasswordBtn) {
  background: #22222b !important;
  color: #e5e5eb !important;
  border-color: #383842 !important;
}

/* Purchase history counter */
#profilePage #purchaseContent .border {
  border-color: #34343e !important;
}

#profilePage #purchaseContent .border > div p {
  color: #c5c5d0 !important;
}

/* Purchase history event cards */
#profilePage #purchaseContent .bg-\[\#fff9fb\] {
  background: transparent !important;
  border-color: #383842 !important;
}

#profilePage #purchaseContent .bg-\[\#fff9fb\]:hover {
  border-color: #ff2e86 !important;
}

/* Ticket category */
#profilePage #purchaseContent .bg-\[\#ffe4ee\] {
  background: #391a2a !important;
  color: #ff70a7 !important;
}

/* Purchase history text */
#profilePage #purchaseContent .text-\[\#101b36\],
#profilePage #purchaseContent .text-\[\#17213b\],
#profilePage #purchaseContent .text-\[\#34415a\],
#profilePage #purchaseContent .text-\[\#687083\],
#profilePage #purchaseContent .text-\[\#7c8494\] {
  color: #c5c5d0 !important;
}

/* Purchase card separators */
#profilePage #purchaseContent .border-gray-100 {
  border-color: #383842 !important;
}

/* Empty image placeholder */
#profilePage #purchaseContent .bg-gray-200 {
  background: #292934 !important;
}

#profilePage #purchaseContent .text-gray-400 {
  color: #a5a5b5 !important;
}

/* Event detail modal */
#profilePage #eventDetailModal > div,
#profilePage #passwordModal > div {
  background: #1b1b22 !important;
  border: 1px solid #383842 !important;
  color: #f5f5f5 !important;
}

#profilePage #eventDetailModal h3,
#profilePage #eventDetailModal h4,
#profilePage #passwordModal h3 {
  color: #ffffff !important;
}

#profilePage #eventDetailModal p,
#profilePage #passwordModal p {
  color: #b5b5c2 !important;
}

/* Modal description */
#profilePage #modalEventDesc {
  background: #111116 !important;
  color: #d5d5df !important;
}

/* Modal artists */
#profilePage #modalArtistsContainer > div {
  background: #22222b !important;
  border-color: #383842 !important;
  color: #f1f1f5 !important;
}

/* Modal artist placeholder */
#profilePage #modalArtistsContainer .bg-gray-200 {
  background: #292934 !important;
}

#profilePage #modalArtistsContainer .text-gray-500 {
  color: #b5b5c2 !important;
}

/* Modal gallery */
#profilePage #modalGalleryContainer img {
  border-color: #383842 !important;
}

/* Modal buttons */
#profilePage #eventDetailModal button {
  color: #b5b5c2 !important;
}

#profilePage #passwordModal button:first-of-type {
  background: #22222b !important;
  border-color: #383842 !important;
  color: #eeeeee !important;
}

/* Modal message */
#profilePage #modalMsg {
  color: #ff70a7;
}

/* Success and error messages */
#profilePage > section .bg-emerald-50 {
  background: #10291f !important;
  color: #86efac !important;
}

#profilePage > section .bg-red-50 {
  background: #301719 !important;
  color: #fca5a5 !important;
}

/* Borders */
#profilePage #profileContent .border-b,
#profilePage #purchaseContent .border-t {
  border-color: #303039 !important;
}




#profilePage #eventDetailModal > div::-webkit-scrollbar-thumb {
  background: #454552;
  border-radius: 10px;
}


 

  

/* Fix duplicate dropdown arrow */
#profilePage #profileContent select {
  appearance: none !important;
  -webkit-appearance: none !important;
  background-image: none !important;
}

/* Keep only the existing custom dropdown icon */
#profilePage #profileContent select + i {
  color: #b5b5c2 !important;
}

/* Fix date calendar icon in dark mode */
#profilePage #profileContent input[type="date"] {
  color-scheme: dark !important;
  color: #ffffff !important;
}

#profilePage #profileContent input[type="date"]::-webkit-calendar-picker-indicator {
  filter: invert(1);
  opacity: 1;
  cursor: pointer;
}




/* Date input calendar icon - white in dark mode */
#profilePage input[type="date"] {
  color-scheme: dark !important;
  color: #ffffff !important;
}

#profilePage input[type="date"]::-webkit-calendar-picker-indicator {
  filter: brightness(0) invert(1) !important;
  opacity: 1 !important;
  cursor: pointer;
}
.bac{
  background-color: white !important;
}

/* Event Details Page - Dark Mode Text Fixes Only */

/* VIP 1, VIP 2, VIP ticket names */
body:has(#eventGrid) #ticketSidebar .font-bold.text-xs {
  color: #ffffff !important;
}

/* Event Specifications values e.g. Food Stalls */
body:has(#eventGrid) #eventGrid .grid > div > span.font-extrabold {
  color: #ffffff !important;
}

/* Headliner artist name */
body:has(#eventGrid) #eventGrid .font-black.text-sm {
  color: #ffffff !important;
}

/* Lineup artist names */
body:has(#lineupBox) #lineupBox .font-extrabold.text-xs {
  color: #ffffff !important;
}

/* Subtotal, platform fee and total prices */
body:has(#ticketSidebar) #ticketSidebar #subtotal_display,
body:has(#ticketSidebar) #ticketSidebar #service_fee_display,
body:has(#ticketSidebar) #ticketSidebar #total_display {
  color: #ffffff !important;
}

/* Food Festival breadcrumb / event category text */
body:has(#eventGrid) #eventGrid nav span {
  color: #ffffff !important;
}

.bread{
  color: white !important;
}

.cloud{
  background-color: transparent !important;
  border: 1px solid #ffffff1a
  ;
}
.cloud-text{
  color: white !important;
}
.evedate{
  color: white !important;
}
.code{
  color: white !important;
}
/* Booking Confirmation Page - Keep Main Content Light */
#bookingConfirmationPage main {
  background: #FAF9F6 !important;
  color: #14142B !important;
}
/* Ticket Pass - Original Light Mode Colors */
#bookingConfirmationPage main .bg-white {
  background: #ffffff !important;
}

#bookingConfirmationPage main .text-black {
  color: #000000 !important;
  -webkit-text-fill-color: #000000 !important;
}

#bookingConfirmationPage main .text-gray-900 {
  color: #111827 !important;
  -webkit-text-fill-color: #111827 !important;
}

#bookingConfirmationPage main .text-gray-800 {
  color: #1f2937 !important;
  -webkit-text-fill-color: #1f2937 !important;
}

#bookingConfirmationPage main .text-gray-600 {
  color: #4b5563 !important;
  -webkit-text-fill-color: #4b5563 !important;
}

#bookingConfirmationPage main .text-gray-500 {
  color: #6b7280 !important;
  -webkit-text-fill-color: #6b7280 !important;
}

/* Ticket borders */
#bookingConfirmationPage main .border-gray-300 {
  border-color: #d1d5db !important;
}

/* Keep confirmation cards white */
#bookingConfirmationPage main .bg-white {
  background-color: #ffffff !important;
}

/* Keep event banner fallback gradient text white */
#bookingConfirmationPage main .mela-gradient {
  color: #ffffff !important;
}

/* Keep confirmation heading dark */
#bookingConfirmationPage main h1,
#bookingConfirmationPage main h3 {
  color: #14142B !important;
}

/* Keep ticket pass content readable */
#bookingConfirmationPage main .text-gray-900 {
  color: #111827 !important;
}

#bookingConfirmationPage main .text-gray-800 {
  color: #1f2937 !important;
}

#bookingConfirmationPage main .text-gray-600 {
  color: #4b5563 !important;
}

#bookingConfirmationPage main .text-gray-500 {
  color: #6b7280 !important;
}
/* Confirmation Page Background - Always White */
html:has(#bookingConfirmationPage),
html:has(#bookingConfirmationPage) body,
#bookingConfirmationPage {
    background: #faf9f6 !important;
    background-color: #faf9f6 !important;
}

/* Main content background */
#bookingConfirmationPage main {
    background: #faf9f6 !important;
    background-color: #faf9f6 !important;
}
/* MOBILE DRAWER APPEARANCE ROW */

.mobile-drawer .drawer-theme-row {
  width: 100% !important;
  min-height: 76px !important;
  padding: 12px 15px !important;
  margin: 14px 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px !important;
  box-sizing: border-box !important;
  border: 1px solid #393944 !important;
  border-radius: 16px !important;
  background: #1c1c25 !important;
}

.mobile-drawer .drawer-theme-info {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  min-width: 0 !important;
}

.mobile-drawer .drawer-theme-icon {
  width: 40px !important;
  height: 40px !important;
  min-width: 40px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  border-radius: 12px !important;
  background: linear-gradient(135deg, #FF2E86, #FF8A00) !important;
  color: #ffffff !important;
  font-size: 16px !important;
}

.mobile-drawer .drawer-theme-icon i {
  color: #ffffff !important;
  font-size: 16px !important;
}

.mobile-drawer .drawer-theme-info > div {
  display: flex !important;
  flex-direction: column !important;
  gap: 4px !important;
}

.mobile-drawer .drawer-theme-title {
  display: block !important;
  color: #ffffff !important;
  font-size: 13px !important;
  font-weight: 800 !important;
  line-height: 1.3 !important;
}

.mobile-drawer .drawer-theme-subtitle {
  display: block !important;
  color: #aaaab8 !important;
  font-size: 11px !important;
  line-height: 1.3 !important;
}

.mobile-drawer .drawer-theme-switch {
  width: 46px !important;
  min-width: 46px !important;
  height: 25px !important;
  padding: 3px !important;
  display: flex !important;
  align-items: center !important;
  border: none !important;
  border-radius: 30px !important;
  background: linear-gradient(135deg, #FF2E86, #FF8A00) !important;
  cursor: pointer !important;
}

.mobile-drawer .drawer-theme-switch-circle {
  width: 19px !important;
  height: 19px !important;
  display: block !important;
  border-radius: 50% !important;
  background: #ffffff !important;
  transform: translateX(0) !important;
  transition: transform 0.25s ease !important;
  box-shadow: 0 1px 4px rgba(0,0,0,0.2) !important;
}
input[type="date"]::-webkit-calendar-picker-indicator {
  filter: brightness(0) invert(1);
  opacity: 1;
  cursor: pointer;
}


 #page-loader,
 #page-loader * {
  color: #ffffff;
}

.premium-select-option{
  color: white !important;
}

.premium-select-option:hover{
  color: #f5265c !important;
}

/* ==========================================
   GOOGLE DETAILS MODAL - DARK STYLING
========================================== */

/* Modal Background */
#googleDetailsModal > div {
  background-color: #181824 !important;
  border-color: rgba(255, 255, 255, 0.09) !important;
  box-shadow: 0 25px 80px rgba(0, 0, 0, 0.55) !important;
}

/* Modal Heading */
#googleDetailsModal h3 {
  color: #ffffff !important;
}

/* Description */
#googleDetailsModal p {
  color: #aaaab8 !important;
}

/* Labels */
#googleDetailsModal label {
  color: #d1d1dc !important;
}

/* Text Inputs */
#googleDetailsModal input:not([type="hidden"]) {
  background-color: #222231 !important;
  color: #ffffff !important;
  border-color: rgba(255, 255, 255, 0.10) !important;
}

/* Placeholder */
#googleDetailsModal input::placeholder {
  color: #9292a3 !important;
  opacity: 1 !important;
}

/* Gender Select */
#googleDetailsModal select {
  background-color: #222231 !important;
  color: #ffffff !important;
  border-color: rgba(255, 255, 255, 0.10) !important;
}

/* Dropdown Options */
#googleDetailsModal select option {
  background-color: #222231 !important;
  color: #ffffff !important;
}

/* Input Focus */
#googleDetailsModal input:focus,
#googleDetailsModal select:focus {
  border-color: #FF2E86 !important;
  outline: none !important;
}

/* Date Picker */
#googleDetailsModal input[type="date"] {
  color-scheme: dark;
  color: #ffffff !important;
}

/* Calendar Indicator */
#googleDetailsModal input[type="date"]::-webkit-calendar-picker-indicator {
  filter: brightness(0) invert(1);
  opacity: 1;
  cursor: pointer;
}

/* Autofill */
#googleDetailsModal input:-webkit-autofill,
#googleDetailsModal input:-webkit-autofill:hover,
#googleDetailsModal input:-webkit-autofill:focus {
  -webkit-text-fill-color: #ffffff !important;
  -webkit-box-shadow: 0 0 0 1000px #222231 inset !important;
  caret-color: #ffffff !important;
}

/* Text Selection */
#googleDetailsModal input::selection {
  background: rgba(255, 46, 134, 0.35);
  color: #ffffff;
}
#profilePage .gender-field .gender-select{
  color: white !important;
}
.noti{
  color: white  !important;
}
.peer:checked ~ .peer-checked\:bg-\[\#FF2E86\] {
  background-color: #ff2e86 !important;
}
.bac{
  background-color: black !important;
}
.agen{
  color: white !important;
}
.calen {
  background: #1C1119;
  border: 1px solid rgba(255, 46, 134, 0.18);
  color: #FF2E86;
  box-shadow: 0 4px 15px rgba(255, 46, 134, 0.08);
}
.clock {
  background: #1C1710;
  border: 1px solid rgba(255, 138, 0, 0.20);
  color: #FF8A00;
  box-shadow: 0 4px 15px rgba(255, 138, 0, 0.08);
}
.locate {
  background: #171321;
  border: 1px solid rgba(147, 51, 234, 0.22);
  color: #A855F7;
  box-shadow: 0 4px 15px rgba(147, 51, 234, 0.08);
}
.pri{
  color: white !important;
}
.cate{
  color: white !important;
}
.earl{
  color: white !important;
}

/* Privacy Policy Dark Mode */

.w-full.rounded-\[18px\].border.border-\[\#21151c\]\/\[0\.06\].bg-white\/90.backdrop-blur-sm.shadow-\[0_5px_25px_rgba\(33\,21\,28\,0\.05\)\] {
  background: #141414 !important;
  border-color: rgba(255,255,255,0.07) !important;
  box-shadow: 0 8px 30px rgba(0,0,0,0.25) !important;
  color: #b8b8b8 !important;
}

.w-full.rounded-\[18px\].border.border-\[\#21151c\]\/\[0\.06\].bg-white\/90.backdrop-blur-sm.shadow-\[0_5px_25px_rgba\(33\,21\,28\,0\.05\)\] h2 {
  color: #f5f5f5 !important;
}

.w-full.rounded-\[18px\].border.border-\[\#21151c\]\/\[0\.06\].bg-white\/90.backdrop-blur-sm.shadow-\[0_5px_25px_rgba\(33\,21\,28\,0\.05\)\] p,
.w-full.rounded-\[18px\].border.border.border-\[\#21151c\]\/\[0\.06\].bg-white\/90.backdrop-blur-sm.shadow-\[0_5px_25px_rgba\(33\,21\,28\,0\.05\)\] li {
  color: #b8b8b8 !important;
}

.w-full.rounded-\[18px\].border.border-\[\#21151c\]\/\[0\.06\].bg-white\/90.backdrop-blur-sm.shadow-\[0_5px_25px_rgba\(33\,21\,28\,0\.05\)\] strong {
  color: #ffffff !important;
}

.w-full.rounded-\[18px\].border.border-\[\#21151c\]\/\[0\.06\].bg-white\/90.backdrop-blur-sm.shadow-\[0_5px_25px_rgba\(33\,21\,28\,0\.05\)\] a {
  color: #ff527e !important;
}
.organi{
  background: linear-gradient(110deg, #29202b, #22222d, #29231f) !important;
}
/* EVENT DAY DROPDOWN - DARK MODE */

.select-3d-wrapper:has(#event_day) .event-day-trigger {
  background: #171717;
  border: 1px solid #333;
  color: #fff;
  box-shadow: none;
}

.select-3d-wrapper:has(#event_day) .event-day-trigger:hover,
.select-3d-wrapper:has(#event_day) .event-day-trigger.active {
  background: #1e1e1e;
  border-color: #FF2E86;
  box-shadow: 0 4px 16px rgba(255,46,134,.10);
}

.select-3d-wrapper:has(#event_day) .event-day-trigger i {
  color: #FF2E86;
}

.select-3d-wrapper:has(#event_day) .event-day-menu {
  background: #171717;
  border: 1px solid #303030;
  box-shadow: 0 15px 40px rgba(0,0,0,.45);
}

.select-3d-wrapper:has(#event_day) .event-day-option {
  background: #171717;
  color: #eeeeee;
}

.select-3d-wrapper:has(#event_day) .event-day-option:hover {
  background: #292323;
  color: #FF2E86;
}

.select-3d-wrapper:has(#event_day) .event-day-option.selected {
  background: linear-gradient(110deg, #302027, #30251f);
  color: #FF2E86;
  font-weight: 700;
}

.select-3d-wrapper:has(#event_day) .event-day-option i {
  color: #FF2E86;
}

.select-3d-wrapper:has(#event_day) .event-day-menu::-webkit-scrollbar-thumb {
  background: #71364e;
}
}
.agen{
  color: black !important;
}

/* Appearance Row - Light Mode */

.mobile-drawer .drawer-theme-row {
  width: 100% !important;
  min-height: 76px !important;
  padding: 12px 15px !important;
  margin: 14px 0 !important;
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px !important;
  box-sizing: border-box !important;
  background: #fff8fb !important;
  border: 1px solid #ffdce8 !important;
  border-radius: 16px !important;
}
/* Page Loader */
#page-loader {
  position: fixed !important;
  inset: 0 !important;
  z-index: 999999 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  opacity: 1;
  visibility: visible;
  background: linear-gradient(
      45deg,
      #fdf2f8,
      #ffffff,
      #fff7ed
  ) !important;
  
/* MELA Privacy Policy - Only This Section */

div.w-full.privacy-policy-dark.rounded-\[18px\] {
  padding: 40px !important;
  background: #101010 !important;
  border: 1px solid rgba(255,255,255,0.07) !important;
  border-radius: 18px !important;
  color: #bdbdbd !important;
  font-size: 14px !important;
  line-height: 1.8 !important;
  box-shadow: 0 5px 25px rgba(0,0,0,0.2) !important;
  display: flex;
  flex-direction: column;
  gap: 28px !important;
  box-sizing: border-box;
}

div.w-full.privacy-policy-dark.rounded-\[18px\] h2 {
  color: #f5f5f5 !important;
  font-size: 19px !important;
  font-weight: 700 !important;
  margin-bottom: 12px !important;
}

div.w-full.privacy-policy-dark.rounded-\[18px\] p {
  color: #bdbdbd !important;
  font-size: 14px !important;
  line-height: 1.85 !important;
}

div.w-full.privacy-policy-dark.rounded-\[18px\] strong {
  color: #ffffff !important;
}

div.w-full.privacy-policy-dark.rounded-\[18px\] ul {
  padding-left: 22px !important;
}

div.w-full.privacy-policy-dark.rounded-\[18px\] li {
  color: #bdbdbd !important;
  margin-bottom: 7px;
}

div.w-full.privacy-policy-dark.rounded-\[18px\] li::marker {
  color: #FF2E86;
}

div.w-full.privacy-policy-dark.rounded-\[18px\] a {
  color: #FF2E86 !important;
  text-decoration: none;
}

div.w-full.privacy-policy-dark.rounded-\[18px\] a:hover {
  color: #ff75a5 !important;
  text-decoration: underline;
}

@media (max-width: 768px) {
  div.w-full.privacy-policy-dark.rounded-\[18px\] {
      padding: 30px 24px !important;
  }
}

@media (max-width: 480px) {
  div.w-full.privacy-policy-dark.rounded-\[18px\] {
      padding: 22px 18px !important;
      border-radius: 14px !important;
      gap: 23px !important;
  }

  div.w-full.privacy-policy-dark.rounded-\[18px\] h2 {
      font-size: 17px !important;
  }

  div.w-full.privacy-policy-dark.rounded-\[18px\] p,
  div.w-full.privacy-policy-dark.rounded-\[18px\] li {
      font-size: 13px !important;
  }
}



}

/* Hide Default Gender Dropdown Arrow */
#googleDetailsModal select {
  appearance: none !important;
  -webkit-appearance: none !important;
  -moz-appearance: none !important;

  background-image: none !important;
}
/* ONLY Mobile Event Filter Checkboxes */
.event-filter-form input[type="checkbox"] {
  background-color: transparent !important;
  background: transparent !important;
}
/* Hide Default Calendar Icon */
#googleDetailsModal input[type="date"]::-webkit-calendar-picker-indicator {
  opacity: 0 !important;
  display: block !important;
  width: 47px !important;
  height: 47px !important;
  cursor: pointer;
}

/* Hide Default Date Decorations */
#googleDetailsModal input[type="date"]::-webkit-inner-spin-button {
  display: none !important;
}
.gender-select{
  color: black !important;
}

#page-loader .animate-cross-1,
#page-loader .animate-cross-2 {
  will-change: transform;
}

#page-loader .mela-gradient {
  background: linear-gradient(135deg, #FF2E86, #FF8A00) !important;
}

#page-loader .animate-pulse {
  animation: loaderPulse 1.5s ease-in-out infinite !important;
}

@keyframes loaderPulse {
  0%, 100% { opacity: 1; }
  50% { opacity: .5; }
}

@keyframes cross1 {
  0% {
      transform: translate(-55px, -55px) scale(0.8);
      opacity: 0.7;
  }
  50% {
      transform: translate(55px, 55px) scale(1.1);
      opacity: 1;
      box-shadow: 0 0 20px rgba(255, 46, 134, 0.4);
  }
  100% {
      transform: translate(-55px, -55px) scale(0.8);
      opacity: 0.7;
  }
}

@keyframes cross2 {
  0% {
      transform: translate(55px, -55px) scale(0.8);
      opacity: 0.7;
  }
  50% {
      transform: translate(-55px, 55px) scale(1.1);
      opacity: 1;
      box-shadow: 0 0 20px rgba(255, 138, 0, 0.4);
  }
  100% {
      transform: translate(55px, -55px) scale(0.8);
      opacity: 0.7;
  }
}

.animate-cross-1 {
  animation: cross1 1.8s ease-in-out infinite;
}

.animate-cross-2 {
  animation: cross2 1.8s ease-in-out infinite;
}

.search-bar {
  margin-top: -120px;
  z-index: 10 !important;
  position: relative;
}
.mobile-drawer .drawer-theme-info {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  gap: 12px !important;
  flex: 1 !important;
  min-width: 0 !important;
}

.mobile-drawer .drawer-theme-icon {
  width: 40px !important;
  height: 40px !important;
  min-width: 40px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  border-radius: 12px !important;
  background: #fff0f6 !important;
  color: #ff3983 !important;
  font-size: 17px !important;
}

.mobile-drawer .drawer-theme-info > div {
  display: flex !important;
  flex-direction: column !important;
  gap: 4px !important;
}

.mobile-drawer .drawer-theme-title {
  color: #191923 !important;
  font-size: 13px !important;
  font-weight: 800 !important;
  line-height: 1.3 !important;
}

.mobile-drawer .drawer-theme-subtitle {
  color: #88838b !important;
  font-size: 11px !important;
  line-height: 1.3 !important;
}

.mobile-drawer .drawer-theme-switch {
  width: 46px !important;
  min-width: 46px !important;
  height: 25px !important;
  padding: 3px !important;
  display: flex !important;
  flex-shrink: 0 !important;
  align-items: center !important;
  border: none !important;
  border-radius: 30px !important;
  background: #d5d5dc !important;
  cursor: pointer !important;
  transition: background 0.25s ease !important;
}

.mobile-drawer .drawer-theme-switch-circle {
  width: 19px !important;
  height: 19px !important;
  display: block !important;
  border-radius: 50% !important;
  background: #ffffff !important;
  transform: translateX(0) !important;
  transition: transform 0.25s ease !important;
  box-shadow: 0 1px 4px rgba(0,0,0,0.2) !important;
}

/* Switch Open */
.mobile-drawer .drawer-theme-switch.is-active {
  background: linear-gradient(135deg, #FF2E86, #FF8A00) !important;
}

.mobile-drawer .drawer-theme-switch.is-active .drawer-theme-switch-circle {
  transform: translateX(21px) !important;
}
/* Toggle Button */

.theme-toggle {
  cursor: pointer;
  border: none;
  padding: 8px 12px;
  border-radius: 8px;
  font-size: 22px;
}

/* Gender dropdown field */
#profilePage .gender-field {
  position: relative !important;
  cursor: pointer !important;
  background: transparent !important;
  border-color: #383842 !important;
}

/* Select covers complete field */
#profilePage .gender-field .gender-select {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  padding: 0 32px 0 38px !important;
  margin: 0 !important;

  border: none !important;
  outline: none !important;
  box-shadow: none !important;

  appearance: none !important;
  -webkit-appearance: none !important;
  -moz-appearance: none !important;

  background: transparent !important;
  background-image: none !important;


  color-scheme: dark !important;
  font-size: 11px !important;
  cursor: pointer !important;
  z-index: 2 !important;
}

/* Left and right icons */
#profilePage .gender-field .gender-icon,
#profilePage .gender-field .gender-arrow {
  position: relative !important;
  z-index: 3 !important;
  flex-shrink: 0 !important;
  color: #b5b5c2 !important;
  pointer-events: none !important;
}

/* Right arrow */
#profilePage .gender-field .gender-arrow {
  margin-left: auto !important;
}

/* Dropdown options */
#profilePage .gender-field .gender-select option {
  background: #1b1b22 !important;
  color: #ffffff !important;
}

/* Focus */
#profilePage .gender-field .gender-select:focus {
  outline: none !important;
  box-shadow: none !important;
}
section.bac {
  background: #ffffff !important;
  background-color: #ffffff !important;
  background-image: none !important;
}
@media (max-width: 767.98px) {
  #drawerLayer.drawer-layer {
    position: fixed !important;
    /* inset: 0 !important; */
    width: 100vw !important;
    height: 100dvh !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
  }

  #drawerLayer .mobile-drawer {
    position: absolute !important;
    top: 0 !important;
    right: 0 !important;
    left: auto !important;
    bottom: 0 !important;

    width: 82vw !important;
    max-width: 380px !important;
    min-width: 0 !important;

    transform: translateX(100%);
    transition: transform 0.4s ease !important;
  }

  #drawerLayer.is-open .mobile-drawer {
    transform: translateX(0) !important;
  }
}
.tex{
  color: black !important;
}
/* CUSTOM EVENT DAY DROPDOWN */
.select-3d-wrapper:has(#event_day) {
  position: relative;
  width: 100%;
}

/* Original select remains functional */
.select-3d-wrapper #event_day {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

/* Custom trigger */
.select-3d-wrapper .event-day-trigger {
  width: 100%;
  min-height: 44px;
  padding: 12px 16px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  background: #fff;
  border: 1px solid #eee5e8;
  border-radius: 14px;
  color: #14142B;
  font-size: 13px;
  font-weight: 700;
  cursor: pointer;
  transition: all .25s ease;
  text-align: left;
}

.select-3d-wrapper .event-day-trigger:hover,
.select-3d-wrapper .event-day-trigger.active {
  border-color: #FF2E86;
  background: #fffaf8;
  box-shadow: 0 4px 16px rgba(255,46,134,.07);
}

.select-3d-wrapper .event-day-trigger i {
  color: #FF2E86;
  font-size: 12px;
  transition: transform .25s ease;
}

.select-3d-wrapper .event-day-trigger.active i {
  transform: rotate(180deg);
}

/* Dropdown panel */
.select-3d-wrapper .event-day-menu {
  position: absolute;
  top: calc(100% + 9px);
  left: 0;
  width: 100%;
  z-index: 9999;
  padding: 8px;
  background: #fff;
  border: 1px solid #f2e9e9;
  border-radius: 19px;
  box-shadow: 0 15px 40px rgba(20,20,43,.12);
  opacity: 0;
  visibility: hidden;
  transform: translateY(-8px) scale(.98);
  transform-origin: top;
  transition: .22s ease;
  max-height: 250px;
  overflow-y: auto;
}

.select-3d-wrapper .event-day-menu.open {
  opacity: 1;
  visibility: visible;
  transform: translateY(0) scale(1);
}

/* Individual dropdown items */
.select-3d-wrapper .event-day-option {
  min-height: 48px;
  padding: 12px 7px;
  margin-bottom: 5px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  border-radius: 15px;
  color: #151515;
  background: #fff;
  font-size: 14px;
  font-weight: 500;
  cursor: pointer;
  transition: background .2s ease, color .2s ease;
}

.select-3d-wrapper .event-day-option:last-child {
  margin-bottom: 0;
}

.select-3d-wrapper .event-day-option:hover {
  background: #fff3e9;
  color: #FF2E86;
}

.select-3d-wrapper .event-day-option.selected {
  background: linear-gradient(110deg, #fff0f1, #fff4e9);
  color: #FF2E86;
  font-weight: 700;
}

.select-3d-wrapper .event-day-option i {
  color: #FF2E86;
  font-size: 15px;
}

/* Scrollbar */
.select-3d-wrapper .event-day-menu::-webkit-scrollbar {
  width: 4px;
}

.select-3d-wrapper .event-day-menu::-webkit-scrollbar-thumb {
  background: #ffd1df;
  border-radius: 10px;
}
/* ==========================================
   EVENT DAY SELECT - WHITE MODE
========================================== */

.select-3d-wrapper:has(#event_day_select) {
  position: relative;
  width: 100%;
}

.select-3d-wrapper #event_day_select {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

.select-3d-wrapper .event-day-trigger {
  width: 100%;
  min-height: 46px;
  padding: 12px 16px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  background: #fff;
  border: 1px solid #eee5e8;
  border-radius: 14px;
  color: #14142B;
  font-size: 13px;
  font-weight: 700;
  cursor: pointer;
  transition: all .25s ease;
  text-align: left;
}

.select-3d-wrapper .event-day-trigger:hover,
.select-3d-wrapper .event-day-trigger.active {
  border-color: #FF2E86;
  background: #fffaf8;
  box-shadow: 0 4px 16px rgba(255,46,134,.07);
}

.select-3d-wrapper .event-day-trigger i {
  color: #FF2E86;
  font-size: 12px;
  transition: transform .25s ease;
}

.select-3d-wrapper .event-day-trigger.active i {
  transform: rotate(180deg);
}

.select-3d-wrapper .event-day-menu {
  position: absolute;
  top: calc(100% + 9px);
  left: 0;
  width: 100%;
  z-index: 9999;
  padding: 8px;
  background: #fff;
  border: 1px solid #f2e9e9;
  border-radius: 19px;
  box-shadow: 0 15px 40px rgba(20,20,43,.12);
  opacity: 0;
  visibility: hidden;
  transform: translateY(-8px) scale(.98);
  transform-origin: top;
  transition: .22s ease;
  max-height: 250px;
  overflow-y: auto;
}

.select-3d-wrapper .event-day-menu.open {
  opacity: 1;
  visibility: visible;
  transform: translateY(0) scale(1);
}

.select-3d-wrapper .event-day-option {
  min-height: 48px;
  padding: 12px 16px;
  margin-bottom: 5px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  border-radius: 15px;
  color: #151515;
  background: #fff;
  font-size: 14px;
  font-weight: 500;
  cursor: pointer;
  transition: background .2s ease, color .2s ease;
}

.select-3d-wrapper .event-day-option:last-child {
  margin-bottom: 0;
}

.select-3d-wrapper .event-day-option:hover {
  background: #fff3e9;
  color: #FF2E86;
}

.select-3d-wrapper .event-day-option.selected {
  background: linear-gradient(110deg, #fff0f1, #fff4e9);
  color: #FF2E86;
  font-weight: 700;
}

.select-3d-wrapper .event-day-option i {
  color: #FF2E86;
  font-size: 15px;
}

.select-3d-wrapper .event-day-menu::-webkit-scrollbar {
  width: 4px;
}

.select-3d-wrapper .event-day-menu::-webkit-scrollbar-thumb {
  background: #ffd1df;
  border-radius: 10px;
}