/* =====================================================
   LUXURY THEME — Dark Prestige (Global)
   Black · Gold · Cream — applied to all frontend pages
   ===================================================== */

/* ─── Design Tokens ─────────────────────────────────── */
:root {
  --lux-bg:        #07070f;
  --lux-bg-2:      #0d0d1a;
  --lux-bg-3:      #111128;
  --lux-gold:      #D4AF37;
  --lux-gold-lt:   #F5D060;
  --lux-gold-dk:   #B8960C;
  --lux-border:    rgba(212, 175, 55, 0.18);
  --lux-border-h:  rgba(212, 175, 55, 0.45);
  --lux-cream:     #F5F0E8;
  --lux-text:      #c8c8d8;
  --lux-muted:     #7a7a96;
  --lux-grad:      linear-gradient(135deg, #B8960C 0%, #D4AF37 40%, #F5D060 70%, #D4AF37 100%);
}

/* ─── Keyframes ─────────────────────────────────────── */
@keyframes lux-shimmer {
  0%   { background-position: -200% center; }
  100% { background-position:  200% center; }
}
@keyframes lux-pulse-border {
  0%, 100% { border-color: rgba(212,175,55,0.18); }
  50%       { border-color: rgba(212,175,55,0.50); }
}
@keyframes lux-float {
  0%, 100% { transform: translateY(0);    }
  50%       { transform: translateY(-14px); }
}
@keyframes lux-grid-drift {
  0%   { transform: translateY(0);   }
  100% { transform: translateY(60px); }
}
@keyframes lux-scan {
  0%   { transform: translateY(-5%);  opacity: 0;   }
  5%   {                              opacity: 0.35; }
  95%  {                              opacity: 0.35; }
  100% { transform: translateY(105%); opacity: 0;   }
}
@keyframes lux-badge-in {
  from { opacity: 0; transform: translateY(-10px) scale(0.96); }
  to   { opacity: 1; transform: translateY(0)     scale(1);    }
}
@keyframes lux-hero-title {
  from { opacity: 0; transform: translateY(28px) skewY(1.5deg); }
  to   { opacity: 1; transform: translateY(0)    skewY(0);      }
}
@keyframes lux-fade-up {
  from { opacity: 0; transform: translateY(28px); }
  to   { opacity: 1; transform: translateY(0);    }
}
@keyframes lux-fade-right {
  from { opacity: 0; transform: translateX(36px); }
  to   { opacity: 1; transform: translateX(0);    }
}
@keyframes lux-dot-blink {
  0%, 100% { opacity: 1;   }
  50%       { opacity: 0.3; }
}

/* ─── Scroll-reveal helpers ─────────────────────────── */
.lux-reveal {
  opacity: 0;
  transform: translateY(32px);
  transition: opacity 0.65s cubic-bezier(.22,1,.36,1),
              transform 0.65s cubic-bezier(.22,1,.36,1);
}
.lux-reveal.--left  { transform: translateX(-32px); }
.lux-reveal.--right { transform: translateX(32px);  }
.lux-reveal.--scale { transform: scale(0.92);       }
.lux-reveal.is-visible { opacity: 1; transform: none; }

.lux-stagger .lux-reveal:nth-child(1) { transition-delay: 0.00s; }
.lux-stagger .lux-reveal:nth-child(2) { transition-delay: 0.08s; }
.lux-stagger .lux-reveal:nth-child(3) { transition-delay: 0.16s; }
.lux-stagger .lux-reveal:nth-child(4) { transition-delay: 0.24s; }
.lux-stagger .lux-reveal:nth-child(5) { transition-delay: 0.32s; }
.lux-stagger .lux-reveal:nth-child(6) { transition-delay: 0.40s; }
.lux-stagger .lux-reveal:nth-child(7) { transition-delay: 0.48s; }
.lux-stagger .lux-reveal:nth-child(8) { transition-delay: 0.56s; }

/* ─── Global page overrides ─────────────────────────── */
body.lux-page {
  background: var(--lux-bg);
  color: var(--lux-text);
}
body.lux-page main   { background: var(--lux-bg); }
body.lux-page .section-bg { background: var(--lux-bg-2) !important; }
body.lux-page section { padding: 88px 0; }
@media (max-width: 768px) {
  body.lux-page section { padding: 60px 0; }
}

/* ─── Gold text utility ─────────────────────────────── */
.lux-gold-text {
  background: var(--lux-grad);
  background-size: 200% auto;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  animation: lux-shimmer 5s linear infinite;
}

/* ─── Section header ─────────────────────────────────── */
.lux-sh {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  margin-bottom: 48px;
  gap: 20px;
  flex-wrap: wrap;
}
.lux-sh__eyebrow {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 8px;
}
.lux-sh__eyebrow-line {
  display: block;
  width: 28px;
  height: 1px;
  background: var(--lux-gold);
  flex-shrink: 0;
}
.lux-sh__eyebrow-label {
  font-size: 11px;
  letter-spacing: 3px;
  text-transform: uppercase;
  color: var(--lux-gold);
  margin: 0;
}
.lux-sh__title {
  font-size: clamp(24px, 3vw, 38px);
  font-weight: 800;
  color: var(--lux-cream);
  margin: 0;
  line-height: 1.15;
}
.lux-sh__link {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 12px;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: var(--lux-gold);
  text-decoration: none;
  border-bottom: 1px solid rgba(212,175,55,0.3);
  padding-bottom: 3px;
  transition: color 0.25s, letter-spacing 0.3s, border-color 0.25s;
  white-space: nowrap;
  align-self: flex-end;
}
.lux-sh__link:hover {
  color: var(--lux-gold-lt);
  border-color: var(--lux-gold);
  letter-spacing: 3px;
}

/* =====================================================
   HERO — Video / Slider Background
   ===================================================== */

/* ── Keyframes for Ken Burns slides ── */
@keyframes lux-kb-1 {
  from { transform: scale(1)    translate(0, 0);   }
  to   { transform: scale(1.12) translate(-2%, 1%); }
}
@keyframes lux-kb-2 {
  from { transform: scale(1.1) translate(-1%, -1%); }
  to   { transform: scale(1)   translate(2%, 0);    }
}
@keyframes lux-kb-3 {
  from { transform: scale(1)    translate(2%, 2%);  }
  to   { transform: scale(1.08) translate(-1%,-2%); }
}

/* ── Section shell ── */
.lux-hero {
  position: relative;
  min-height: 100vh;
  display: flex;
  align-items: center;
  background: var(--lux-bg);
  overflow: hidden;
  padding: 0 !important;
}

/* ── Background layer (holds slider or video) ── */
.lux-hero__bg-layer {
  position: absolute;
  inset: 0;
  z-index: 0;
}

/* ── Video background ── */
.lux-hero__video-wrap {
  position: absolute;
  inset: 0;
  overflow: hidden;
}
.lux-hero__video {
  position: absolute;
  top: 50%; left: 50%;
  transform: translate(-50%, -50%);
  min-width: 100%; min-height: 100%;
  width: auto; height: auto;
  object-fit: cover;
  opacity: 0;
  transition: opacity 1.6s ease;
}
.lux-hero__video.lux-video-ready { opacity: 1; }

/* Desktop / mobile video switch */
.lux-hero__video--mobile { display: none; }
@media (max-width: 767px) {
  .lux-hero__video--desktop { display: none; }
  .lux-hero__video--mobile  { display: block; }
}

/* ── Swiper image slider ── */
.lux-hero-bg-swiper {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
}
.lux-hero__slide {
  background-size: cover;
  background-position: center;
  transform-origin: center center;
  will-change: transform;
}
/* Ken Burns – activated via JS class */
.lux-hero__slide--1.kb-active { animation: lux-kb-1 8s ease forwards; }
.lux-hero__slide--2.kb-active { animation: lux-kb-2 8s ease forwards; }
.lux-hero__slide--3.kb-active { animation: lux-kb-3 8s ease forwards; }

/* ── Dark cinematic overlay ── */
.lux-hero__overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(
    135deg,
    rgba(7,7,15,0.90) 0%,
    rgba(7,7,15,0.72) 50%,
    rgba(7,7,15,0.88) 100%
  );
  z-index: 1;
}

/* ── Gold grid texture (above overlay) ── */
.lux-hero__grid-bg {
  position: absolute;
  inset: 0;
  z-index: 2;
  background-image:
    linear-gradient(rgba(212,175,55,0.03) 1px, transparent 1px),
    linear-gradient(90deg, rgba(212,175,55,0.03) 1px, transparent 1px);
  background-size: 64px 64px;
  animation: lux-grid-drift 30s linear infinite alternate;
}

/* ── Scan line ── */
.lux-hero__scan {
  position: absolute;
  inset: 0;
  z-index: 3;
  overflow: hidden;
  pointer-events: none;
}
.lux-hero__scan::after {
  content: '';
  position: absolute;
  left: 0; right: 0;
  height: 100px;
  background: linear-gradient(to bottom, transparent, rgba(212,175,55,0.04), transparent);
  animation: lux-scan 9s linear infinite;
}

/* ── Bottom fade into next section ── */
.lux-hero__fade {
  position: absolute;
  bottom: 0; left: 0; right: 0;
  height: 280px;
  background: linear-gradient(to bottom, transparent, var(--lux-bg));
  pointer-events: none;
  z-index: 4;
}

/* ── Ambient gold glow (above bg-layer) ── */
.lux-hero__glow {
  position: absolute;
  top: 50%; left: 50%;
  transform: translate(-50%, -50%);
  width: min(920px, 90vw);
  height: min(920px, 90vw);
  background: radial-gradient(circle, rgba(212,175,55,0.055) 0%, transparent 65%);
  pointer-events: none;
  z-index: 5;
}

/* ── Slide indicator dots ── */
.lux-hero__dots {
  position: absolute;
  bottom: 36px;
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  gap: 8px;
  z-index: 10;
}
.lux-hero__dot {
  width: 6px; height: 6px;
  border-radius: 50%;
  background: rgba(212,175,55,0.3);
  transition: background 0.4s, transform 0.4s;
  cursor: pointer;
}
.lux-hero__dot--active {
  background: var(--lux-gold);
  transform: scale(1.5);
}

/* ── Container above everything ── */
.lux-hero__container { position: relative; z-index: 10; }

/* ── Content grid ── */
.lux-hero__inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  padding: 130px 0 110px;
  width: 100%;
}
@media (max-width: 991px) {
  .lux-hero__inner { padding: 110px 0 100px; }
}

/* Badge */
.lux-hero__badge {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 7px 18px;
  border: 1px solid var(--lux-border);
  border-radius: 100px;
  font-size: 11px;
  letter-spacing: 2.5px;
  text-transform: uppercase;
  color: var(--lux-gold);
  background: rgba(212,175,55,0.07);
  backdrop-filter: blur(8px);
  margin-bottom: 24px;
  animation: lux-badge-in 0.7s ease both;
}
.lux-hero__badge-dot {
  width: 6px; height: 6px;
  border-radius: 50%;
  background: var(--lux-gold);
  animation: lux-dot-blink 2s ease infinite;
}
@media (max-width: 991px) {
  .lux-hero__badge { display: inline-flex; }
}

/* Title */
.lux-hero__title {
  font-size: clamp(40px, 6.5vw, 82px);
  font-weight: 900;
  line-height: 1.02;
  color: var(--lux-cream);
  margin: 0 0 20px;
  animation: lux-hero-title 0.9s cubic-bezier(.22,1,.36,1) 0.1s both;
}
.lux-hero__title .highlight-color { color: var(--lux-gold) !important; }

/* Description */
.lux-hero__desc {
  font-size: 17px;
  line-height: 1.75;
  color: var(--lux-muted);
  max-width: 490px;
  margin: 0 auto 36px;
  animation: lux-fade-up 0.8s ease 0.25s both;
}

/* Search */
.lux-hero__search {
  display: flex;
  max-width: 540px;
  margin-left: auto;
  margin-right: auto;
  border: 1px solid var(--lux-border);
  border-radius: 10px;
  background: rgba(13,13,26,0.85);
  backdrop-filter: blur(14px);
  overflow: hidden;
  margin-bottom: 36px;
  animation: lux-fade-up 0.8s ease 0.35s both;
  transition: border-color 0.3s;
}
.lux-hero__search:focus-within { border-color: var(--lux-gold); }
@media (max-width: 991px) {
  .lux-hero__search { margin-left: auto; margin-right: auto; }
}
.lux-hero__search input {
  flex: 1;
  min-width: 0;
  background: transparent;
  border: none;
  outline: none;
  padding: 15px 18px;
  color: var(--lux-cream);
  font-size: 15px;
}
.lux-hero__search input::placeholder { color: var(--lux-muted); }
.lux-hero__search button {
  background: var(--lux-grad);
  border: none;
  padding: 14px 26px;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 1px;
  color: #0a0a0f;
  cursor: pointer;
  white-space: nowrap;
  transition: opacity 0.2s;
  flex-shrink: 0;
}
.lux-hero__search button:hover { opacity: 0.85; }

/* Stat chips */
.lux-hero__chips {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
  animation: lux-fade-up 0.8s ease 0.45s both;
}
@media (max-width: 991px) {
  .lux-hero__chips { justify-content: center; }
}
.lux-hero__chip {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 9px 16px;
  background: rgba(212,175,55,0.05);
  border: 1px solid var(--lux-border);
  border-radius: 8px;
  font-size: 13px;
  color: var(--lux-muted);
}
.lux-hero__chip strong {
  color: var(--lux-cream);
  font-weight: 700;
}

/* Right visual */
.lux-hero__visual {
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
}
@media (max-width: 991px) { .lux-hero__visual { display: none; } }

.lux-hero__rings {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  pointer-events: none;
}
.lux-hero__ring {
  position: absolute;
  border-radius: 50%;
  border: 1px solid var(--lux-border);
}
.lux-hero__ring:nth-child(1) { width: 300px; height: 300px; animation: lux-pulse-border 4s ease infinite; }
.lux-hero__ring:nth-child(2) { width: 440px; height: 440px; animation: lux-pulse-border 4s ease 1.2s infinite; opacity: 0.6; }
.lux-hero__ring:nth-child(3) { width: 580px; height: 580px; animation: lux-pulse-border 4s ease 2.4s infinite; opacity: 0.3; }

.lux-hero__img {
  position: relative;
  z-index: 2;
  animation: lux-float 6s ease-in-out infinite, lux-fade-right 0.9s ease 0.2s both;
}
.lux-hero__img img {
  max-width: 100%;
  width: 440px;
  filter: drop-shadow(0 24px 60px rgba(212,175,55,0.2));
}

/* =====================================================
   STATS
   ===================================================== */
.lux-stats {
  background: var(--lux-bg-2) !important;
  border-top: 1px solid var(--lux-border);
  border-bottom: 1px solid var(--lux-border);
  padding: 0 !important;
}
.lux-stats__grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
}
@media (max-width: 767px) {
  .lux-stats__grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 400px) {
  .lux-stats__grid { grid-template-columns: 1fr; }
}
.lux-stats__item {
  padding: 48px 28px;
  border-right: 1px solid var(--lux-border);
  text-align: center;
  position: relative;
  overflow: hidden;
  transition: background 0.3s;
}
.lux-stats__item:last-child { border-right: none; }
.lux-stats__item::after {
  content: '';
  position: absolute;
  bottom: 0; left: 50%;
  transform: translateX(-50%) scaleX(0);
  transform-origin: center;
  width: 80%;
  height: 2px;
  background: var(--lux-grad);
  transition: transform 0.5s ease;
}
.lux-stats__item:hover { background: rgba(212,175,55,0.03); }
.lux-stats__item:hover::after { transform: translateX(-50%) scaleX(1); }

@media (max-width: 767px) {
  .lux-stats__item:nth-child(2) { border-right: none; }
  .lux-stats__item:nth-child(1),
  .lux-stats__item:nth-child(2) { border-bottom: 1px solid var(--lux-border); }
  .lux-stats__item { padding: 36px 20px; }
}
@media (max-width: 400px) {
  .lux-stats__item { border-right: none; border-bottom: 1px solid var(--lux-border); }
  .lux-stats__item:last-child { border-bottom: none; }
}

.lux-stats__icon {
  width: 44px; height: 44px;
  background: rgba(212,175,55,0.06);
  border: 1px solid var(--lux-border);
  border-radius: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto 16px;
}
.lux-stats__icon img {
  width: 22px; height: 22px;
  filter: brightness(0) saturate(100%) invert(75%) sepia(50%) saturate(600%) hue-rotate(10deg);
}
.lux-stats__num {
  font-size: clamp(30px, 4vw, 46px);
  font-weight: 900;
  line-height: 1;
  margin: 0 0 8px;
  background: var(--lux-grad);
  background-size: 200% auto;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  animation: lux-shimmer 6s linear infinite;
}
.lux-stats__label {
  font-size: 11px;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: var(--lux-muted);
  margin: 0;
}

/* =====================================================
   CATEGORIES
   ===================================================== */
.lux-cats {
  background: var(--lux-bg) !important;
}
.lux-cats__grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 14px;
}
@media (max-width: 1024px) { .lux-cats__grid { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 640px)  { .lux-cats__grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 380px)  { .lux-cats__grid { grid-template-columns: 1fr; } }

.lux-cat-card {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 16px 18px;
  background: var(--lux-bg-2);
  border: 1px solid var(--lux-border);
  border-radius: 12px;
  text-decoration: none;
  color: var(--lux-text);
  position: relative;
  overflow: hidden;
  transition: border-color 0.3s, background 0.3s, transform 0.3s, box-shadow 0.3s;
}
.lux-cat-card::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 1px;
  background: var(--lux-grad);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 0.4s ease;
}
.lux-cat-card:hover {
  border-color: rgba(212,175,55,0.38);
  background: rgba(212,175,55,0.04);
  transform: translateY(-3px);
  box-shadow: 0 12px 36px rgba(0,0,0,0.35);
  color: var(--lux-cream);
  text-decoration: none;
}
.lux-cat-card:hover::before { transform: scaleX(1); }

.lux-cat-card__icon {
  flex-shrink: 0;
  width: 46px; height: 46px;
  border-radius: 10px;
  background: rgba(212,175,55,0.06);
  border: 1px solid var(--lux-border);
  overflow: hidden;
}
.lux-cat-card__icon img {
  width: 100%; height: 100%;
  object-fit: cover;
}
.lux-cat-card__name {
  font-size: 14px;
  font-weight: 600;
  color: var(--lux-cream);
  margin: 0 0 3px;
  transition: color 0.3s;
  line-height: 1.3;
}
.lux-cat-card:hover .lux-cat-card__name { color: var(--lux-gold-lt); }
.lux-cat-card__count {
  font-size: 12px;
  color: var(--lux-muted);
  margin: 0;
}

/* =====================================================
   LISTINGS (games-card CSS overrides)
   ===================================================== */
body.lux-page .all-games-area { background: var(--lux-bg-2) !important; }

body.lux-page .games-card {
  background: var(--lux-bg-3) !important;
  border: 1px solid var(--lux-border) !important;
  border-radius: 14px !important;
  overflow: hidden !important;
  transition: border-color 0.3s, transform 0.3s, box-shadow 0.3s !important;
}
body.lux-page .games-card:hover {
  border-color: rgba(212,175,55,0.4) !important;
  transform: translateY(-5px) !important;
  box-shadow: 0 20px 56px rgba(0,0,0,0.5), 0 0 0 1px rgba(212,175,55,0.08) !important;
}
body.lux-page .games-card .game-content {
  background: var(--lux-bg-3) !important;
}
body.lux-page .games-card .title a {
  color: var(--lux-cream) !important;
  font-weight: 600;
}
body.lux-page .games-card .title a:hover { color: var(--lux-gold-lt) !important; }
body.lux-page .games-card .author,
body.lux-page .games-card .author a { color: var(--lux-muted) !important; }
body.lux-page .games-card .author a:hover { color: var(--lux-gold) !important; }
body.lux-page .games-card .pricing h6 { color: var(--lux-cream) !important; }
body.lux-page .games-card .pricing .has-discount {
  color: var(--lux-muted) !important;
  text-decoration: line-through;
}
body.lux-page .games-card .pricing .right p { color: var(--lux-muted) !important; }
body.lux-page .games-card .fav-button {
  background: rgba(7,7,15,0.75) !important;
  border: 1px solid var(--lux-border) !important;
  backdrop-filter: blur(8px) !important;
  color: var(--lux-muted) !important;
  transition: color 0.25s, border-color 0.25s !important;
}
body.lux-page .games-card .fav-button:hover,
body.lux-page .games-card .fav-button.active {
  color: var(--lux-gold) !important;
  border-color: rgba(212,175,55,0.4) !important;
}
body.lux-page .games-card .has-trending {
  background: rgba(212,175,55,0.12) !important;
  border: 1px solid rgba(212,175,55,0.3) !important;
}

/* =====================================================
   HOW IT WORKS / FEATURES
   ===================================================== */
.lux-features {
  background: var(--lux-bg) !important;
}
.lux-features__grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
}
@media (max-width: 1024px) { .lux-features__grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 560px)  { .lux-features__grid { grid-template-columns: 1fr; } }

.lux-feat-card {
  background: var(--lux-bg-2);
  border: 1px solid var(--lux-border);
  border-radius: 16px;
  padding: 32px 24px;
  position: relative;
  overflow: hidden;
  transition: border-color 0.3s, transform 0.3s, box-shadow 0.3s;
}
.lux-feat-card::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 2px;
  background: var(--lux-grad);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 0.4s ease;
}
.lux-feat-card:hover {
  border-color: rgba(212,175,55,0.35);
  transform: translateY(-5px);
  box-shadow: 0 20px 60px rgba(0,0,0,0.4);
}
.lux-feat-card:hover::before { transform: scaleX(1); }

.lux-feat-card__step {
  font-size: 10px;
  letter-spacing: 3px;
  text-transform: uppercase;
  color: var(--lux-gold);
  display: block;
  margin: 0 0 14px;
}
.lux-feat-card__icon {
  width: 54px; height: 54px;
  background: rgba(212,175,55,0.06);
  border: 1px solid var(--lux-border);
  border-radius: 14px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 20px;
}
.lux-feat-card__icon img {
  width: 26px; height: 26px;
  filter: brightness(0) saturate(100%) invert(75%) sepia(50%) saturate(600%) hue-rotate(10deg);
}
.lux-feat-card__title {
  font-size: 16px;
  font-weight: 700;
  color: var(--lux-cream);
  margin: 0 0 10px;
}
.lux-feat-card__desc {
  font-size: 14px;
  color: var(--lux-muted);
  line-height: 1.7;
  margin: 0;
}

/* =====================================================
   SELLERS (swiper + seller-card overrides)
   ===================================================== */
body.lux-page .popular-seller-area { background: var(--lux-bg-2) !important; }

body.lux-page .seller-card {
  background: var(--lux-bg-3) !important;
  border: 1px solid var(--lux-border) !important;
  border-radius: 14px !important;
  overflow: hidden !important;
  transition: border-color 0.3s, transform 0.3s, box-shadow 0.3s !important;
}
body.lux-page .seller-card:hover {
  border-color: rgba(212,175,55,0.4) !important;
  transform: translateY(-4px) !important;
  box-shadow: 0 16px 50px rgba(0,0,0,0.4) !important;
}
body.lux-page .seller-card .seller-content h5 { color: var(--lux-cream) !important; }
body.lux-page .seller-card .seller-content p   { color: var(--lux-muted) !important; }
body.lux-page .seller-card .seller-content p span { color: var(--lux-gold) !important; font-weight: 700; }
body.lux-page .seller-card .seller-content .conutry p { color: var(--lux-muted) !important; }
body.lux-page .seller-card .success-rate.success { color: var(--lux-gold-lt) !important; }
body.lux-page .seller-card .success-rate.warning { color: #e8b84b !important; }
body.lux-page .seller-card .success-rate.error   { color: #c94b4b !important; }
body.lux-page .seller-card .primary-button {
  background: transparent !important;
  border: 1px solid var(--lux-border) !important;
  color: var(--lux-gold) !important;
  transition: background 0.25s, border-color 0.25s, color 0.25s !important;
}
body.lux-page .seller-card .primary-button:hover {
  background: rgba(212,175,55,0.1) !important;
  border-color: var(--lux-gold) !important;
  color: var(--lux-gold-lt) !important;
}
body.lux-page .seller-card .fav-button {
  background: rgba(212,175,55,0.06) !important;
  border: 1px solid var(--lux-border) !important;
  color: var(--lux-muted) !important;
  transition: color 0.25s, border-color 0.25s, background 0.25s !important;
}
body.lux-page .seller-card .fav-button.active,
body.lux-page .seller-card .fav-button:hover {
  color: var(--lux-gold) !important;
  border-color: rgba(212,175,55,0.4) !important;
  background: rgba(212,175,55,0.1) !important;
}

/* Swiper nav buttons */
body.lux-page .popular-seller-area .swiper-btn,
body.lux-page .swiper-arrows .swiper-btn {
  background: var(--lux-bg-2) !important;
  border: 1px solid var(--lux-border) !important;
  color: var(--lux-gold) !important;
  transition: background 0.25s, border-color 0.25s !important;
}
body.lux-page .popular-seller-area .swiper-btn:hover,
body.lux-page .swiper-arrows .swiper-btn:hover {
  background: rgba(212,175,55,0.08) !important;
  border-color: var(--lux-gold) !important;
}
body.lux-page .swiper-custom-buttons-2 .swiper-cusrom-btn i {
  color: var(--lux-gold) !important;
}

/* =====================================================
   BLOG (card overrides)
   ===================================================== */
body.lux-page .blogs-area { background: var(--lux-bg) !important; }

body.lux-page .blog-card {
  background: var(--lux-bg-2) !important;
  border: 1px solid var(--lux-border) !important;
  border-radius: 14px !important;
  overflow: hidden !important;
  transition: border-color 0.3s, transform 0.3s, box-shadow 0.3s !important;
}
body.lux-page .blog-card:hover {
  border-color: rgba(212,175,55,0.4) !important;
  transform: translateY(-4px) !important;
  box-shadow: 0 16px 50px rgba(0,0,0,0.4) !important;
}
body.lux-page .blog-card .full-card { background: transparent !important; }
body.lux-page .blog-card .blog-content { padding: 20px !important; background: transparent !important; }
body.lux-page .blog-card .blog-content .category {
  color: var(--lux-gold) !important;
  font-size: 10px;
  letter-spacing: 2.5px;
  text-transform: uppercase;
}
body.lux-page .blog-card .blog-content h3 a {
  color: var(--lux-cream) !important;
  transition: color 0.25s;
}
body.lux-page .blog-card .blog-content h3 a:hover { color: var(--lux-gold-lt) !important; }
body.lux-page .blog-card .blog-content .des { color: var(--lux-muted) !important; font-size: 14px; }
body.lux-page .blog-card .blog-content .date-text {
  color: rgba(212,175,55,0.45) !important;
  font-size: 12px !important;
  letter-spacing: 1px;
}

/* =====================================================
   Existing section-title overrides (listings, sellers, blog)
   ===================================================== */
body.lux-page .section-title .title-text h2 { color: var(--lux-cream) !important; }
body.lux-page .section-title .view-all {
  color: var(--lux-gold) !important;
  border-color: rgba(212,175,55,0.3) !important;
}
body.lux-page .section-title .view-all:hover {
  color: var(--lux-gold-lt) !important;
  border-color: var(--lux-gold) !important;
}

/* No-data message */
body.lux-page .no-data-found { color: var(--lux-muted) !important; }

/* =====================================================
   Scroll-to-top button
   ===================================================== */
body.lux-page .progress-wrap {
  background: var(--lux-bg-2) !important;
  border: 1px solid var(--lux-border) !important;
}
body.lux-page .progress-wrap .progress-circle path { stroke: var(--lux-gold) !important; }
body.lux-page .progress-wrap .progress-icon svg path { stroke: var(--lux-cream) !important; }

/* =====================================================
   Mobile fine-tuning (homepage sections)
   ===================================================== */
@media (max-width: 480px) {
  .lux-hero__title { font-size: 34px; }
  .lux-hero__search { border-radius: 8px; }
  .lux-hero__search button { padding: 14px 14px; font-size: 12px; }
  .lux-sh { margin-bottom: 32px; }
  .lux-sh__title { font-size: 22px; }
  .lux-stats__num { font-size: 28px; }
}

/* =====================================================
   PRELOADER
   ===================================================== */
body.lux-page #preloader {
  background: var(--lux-bg) !important;
}
body.lux-page #preloader circle {
  stroke: var(--lux-gold) !important;
}

/* =====================================================
   HEADER
   ===================================================== */
body.lux-page .header {
  background: rgba(7,7,15,0.94) !important;
  backdrop-filter: blur(22px) !important;
  border-bottom: 1px solid var(--lux-border) !important;
}
body.lux-page .sticky-header.sticky {
  background: rgba(7,7,15,0.97) !important;
}

/* Nav links */
body.lux-page .header .navigation-menu ul li a {
  color: var(--lux-muted) !important;
  transition: color 0.25s !important;
}
body.lux-page .header .navigation-menu ul li a:hover,
body.lux-page .header .navigation-menu ul li a.active {
  color: var(--lux-gold) !important;
}

/* Header icon buttons (search, notification, chat) */
body.lux-page .mobile-search-button svg path {
  stroke: var(--lux-muted) !important;
}
body.lux-page .notification-btn svg path,
body.lux-page .chat-btn svg path {
  fill: var(--lux-muted) !important;
}
body.lux-page .notification-btn.active svg path,
body.lux-page .chat-btn.active svg path {
  fill: var(--lux-gold) !important;
}

/* Notification & chat dropdown boxes */
body.lux-page .notification-box,
body.lux-page .chat-box {
  background: var(--lux-bg-2) !important;
  border: 1px solid var(--lux-border) !important;
}
body.lux-page .notification-box h4,
body.lux-page .chat-box h4 {
  color: var(--lux-cream) !important;
  border-bottom: 1px solid var(--lux-border) !important;
}
body.lux-page .notification-box .mark-all-read { color: var(--lux-gold) !important; }
body.lux-page .notification-navigation { border-bottom: 1px solid var(--lux-border) !important; }
body.lux-page .notification-item,
body.lux-page .chat-item {
  border-bottom: 1px solid var(--lux-border) !important;
}
body.lux-page .notification-item p,
body.lux-page .chat-item p { color: var(--lux-muted) !important; }
body.lux-page .notification-item .time,
body.lux-page .chat-item  .time { color: rgba(212,175,55,0.45) !important; }
body.lux-page .chat-box .action-btn a { color: var(--lux-gold) !important; }

/* User avatar ring */
body.lux-page .header .user-box .user img {
  border: 2px solid var(--lux-border);
  transition: border-color 0.3s;
}
body.lux-page .header .user-box:hover .user img {
  border-color: var(--lux-gold);
}

/* User dropdown content */
body.lux-page .user-content {
  background: var(--lux-bg-2) !important;
  border: 1px solid var(--lux-border) !important;
}
body.lux-page .user-content .user-name { color: var(--lux-cream) !important; }
body.lux-page .user-content .user-email { color: var(--lux-muted) !important; }
body.lux-page .user-content ul li a {
  color: var(--lux-muted) !important;
  transition: color 0.25s, background 0.25s !important;
}
body.lux-page .user-content ul li a:hover {
  color: var(--lux-gold) !important;
  background: rgba(212,175,55,0.05) !important;
}
body.lux-page .user-content .logout-modal { color: var(--lux-muted) !important; }

/* Language switcher */
body.lux-page .language-button .lang-select,
body.lux-page .lang-select {
  background: transparent !important;
  color: var(--lux-muted) !important;
  border-color: var(--lux-border) !important;
}
body.lux-page .language-dropdown,
body.lux-page .lang-dropdown {
  background: var(--lux-bg-2) !important;
  border: 1px solid var(--lux-border) !important;
}

/* Header primary button */
body.lux-page .header .primary-button,
body.lux-page .header .auth-btn {
  background: var(--lux-grad) !important;
  color: #0a0a0f !important;
  font-weight: 700 !important;
  border: none !important;
}
body.lux-page .header .primary-button:hover,
body.lux-page .header .auth-btn:hover {
  opacity: 0.85 !important;
  color: #0a0a0f !important;
}

/* Hamburger bars */
body.lux-page .bar-button .td-offcanvas-toggle span {
  background: var(--lux-muted) !important;
}

/* =====================================================
   MOBILE SEARCH POPUP
   ===================================================== */
body.lux-page .mobile-search-popup {
  background: var(--lux-bg-2) !important;
  border-bottom: 1px solid var(--lux-border) !important;
}
body.lux-page .mobile-search-popup .close svg path { fill: var(--lux-muted); }
body.lux-page .mobile-search-popup .close:hover svg path { fill: var(--lux-gold); }

/* =====================================================
   OFFCANVAS / MOBILE MENU
   ===================================================== */
body.lux-page .td-offcanvas {
  background: var(--lux-bg-2) !important;
  border-right: 1px solid var(--lux-border) !important;
}
body.lux-page .td-offcanvas-overlay { background: rgba(0,0,0,0.75) !important; }
body.lux-page .td-offcanvas-header {
  border-bottom: 1px solid var(--lux-border) !important;
}
body.lux-page .offcanvas-nav ul li {
  border-bottom: 1px solid var(--lux-border) !important;
}
body.lux-page .offcanvas-nav ul li a {
  color: var(--lux-muted) !important;
  transition: color 0.25s !important;
}
body.lux-page .offcanvas-nav ul li a:hover,
body.lux-page .offcanvas-nav ul li a.active { color: var(--lux-gold) !important; }
body.lux-page .start-selling-mobile-btn .primary-button {
  background: var(--lux-grad) !important;
  color: #0a0a0f !important;
}

/* =====================================================
   HEADER SEARCH FORM
   ===================================================== */
body.lux-page .search {
  background: rgba(13,13,26,0.8) !important;
  border: 1px solid var(--lux-border) !important;
  backdrop-filter: blur(12px) !important;
  transition: border-color 0.3s !important;
}
body.lux-page .search:focus-within { border-color: var(--lux-gold) !important; }
body.lux-page .search input {
  color: var(--lux-cream) !important;
  background: transparent !important;
}
body.lux-page .search input::placeholder { color: var(--lux-muted) !important; }
body.lux-page .search .search-dropdown {
  color: var(--lux-muted) !important;
  background: transparent !important;
  border-right: 1px solid var(--lux-border) !important;
}
body.lux-page .search .search-dropdown .arrow svg path { stroke: var(--lux-muted) !important; }
body.lux-page .search .search-button {
  background: var(--lux-grad) !important;
  color: #0a0a0f !important;
}
body.lux-page .search-suggestion-box {
  background: var(--lux-bg-2) !important;
  border: 1px solid var(--lux-border) !important;
}
body.lux-page .search-suggestion-box h6 { color: var(--lux-cream) !important; }
body.lux-page .top-search-button {
  background: rgba(212,175,55,0.06) !important;
  border: 1px solid var(--lux-border) !important;
  color: var(--lux-muted) !important;
  transition: border-color 0.25s, color 0.25s !important;
}
body.lux-page .top-search-button:hover {
  border-color: var(--lux-gold) !important;
  color: var(--lux-gold) !important;
}
body.lux-page .search-dropdown-lists {
  background: var(--lux-bg-2) !important;
  border: 1px solid var(--lux-border) !important;
}

/* =====================================================
   FOOTER
   ===================================================== */
body.lux-page .footer-1 {
  background: var(--lux-bg-2) !important;
  background-image: none !important;
  border-top: 1px solid var(--lux-border) !important;
}
body.lux-page .footer-1 p { color: var(--lux-muted) !important; }
body.lux-page .footer-link-title {
  color: var(--lux-cream) !important;
  font-size: 14px;
  letter-spacing: 1px;
}
body.lux-page .footer-menu ul li a {
  color: var(--lux-muted) !important;
  transition: color 0.25s !important;
}
body.lux-page .footer-menu ul li a:hover { color: var(--lux-gold) !important; }
body.lux-page .footer-top { border-bottom: 1px solid var(--lux-border) !important; }
body.lux-page .footer-bottom p { color: var(--lux-muted) !important; }
body.lux-page .footer-bottom { border-top: 1px solid var(--lux-border) !important; }
body.lux-page .footer-bottom .right ul li a {
  color: var(--lux-muted) !important;
  letter-spacing: 1px;
  transition: color 0.25s !important;
}
body.lux-page .footer-bottom .right ul li a:hover { color: var(--lux-gold) !important; }
body.lux-page .social-icons a {
  color: var(--lux-muted) !important;
  transition: color 0.25s, transform 0.25s !important;
}
body.lux-page .social-icons a:hover {
  color: var(--lux-gold) !important;
  transform: translateY(-2px) !important;
}
body.lux-page .footer-1 .email a {
  color: var(--lux-gold) !important;
  transition: color 0.25s !important;
}
body.lux-page .footer-1 .email a:hover { color: var(--lux-gold-lt) !important; }

/* =====================================================
   INNER PAGE HEADER (breadcrumb banner)
   ===================================================== */
body.lux-page .common-page-header {
  background: var(--lux-bg-2) !important;
  background-image: none !important;
  border-bottom: 1px solid var(--lux-border);
  position: relative;
  overflow: hidden;
  padding: 60px 0 !important;
}
body.lux-page .common-page-header::before {
  content: '';
  position: absolute;
  inset: 0;
  background-image:
    linear-gradient(rgba(212,175,55,0.03) 1px, transparent 1px),
    linear-gradient(90deg, rgba(212,175,55,0.03) 1px, transparent 1px);
  background-size: 48px 48px;
  pointer-events: none;
}
body.lux-page .common-page-header .content h2 {
  color: var(--lux-cream) !important;
  position: relative;
  z-index: 1;
}

/* =====================================================
   GLOBAL BUTTONS
   ===================================================== */
body.lux-page .primary-button {
  background: var(--lux-grad) !important;
  background-size: 200% auto !important;
  color: #0a0a0f !important;
  font-weight: 700 !important;
  border: none !important;
  transition: opacity 0.25s, transform 0.25s, background-position 0.4s !important;
}
body.lux-page .primary-button:hover {
  opacity: 0.88 !important;
  transform: translateY(-1px) !important;
  background-position: right center !important;
  color: #0a0a0f !important;
}
body.lux-page .primary-button:active { transform: translateY(0) !important; }

body.lux-page .border-btn,
body.lux-page .primary-button.border-btn,
body.lux-page .primary-button.border-btn-secondary {
  background: transparent !important;
  border: 1px solid var(--lux-border) !important;
  color: var(--lux-gold) !important;
}
body.lux-page .border-btn:hover,
body.lux-page .primary-button.border-btn:hover {
  background: rgba(212,175,55,0.08) !important;
  border-color: var(--lux-gold) !important;
  transform: translateY(-1px) !important;
}

/* =====================================================
   FORMS, INPUTS, SELECTS
   ===================================================== */
body.lux-page .form-control,
body.lux-page input[type="text"],
body.lux-page input[type="email"],
body.lux-page input[type="password"],
body.lux-page input[type="number"],
body.lux-page input[type="tel"],
body.lux-page input[type="url"],
body.lux-page textarea,
body.lux-page select {
  background: var(--lux-bg-2) !important;
  border-color: var(--lux-border) !important;
  color: var(--lux-cream) !important;
}
body.lux-page .form-control::placeholder,
body.lux-page input::placeholder,
body.lux-page textarea::placeholder { color: var(--lux-muted) !important; }
body.lux-page .form-control:focus,
body.lux-page input[type="text"]:focus,
body.lux-page input[type="email"]:focus,
body.lux-page input[type="password"]:focus,
body.lux-page textarea:focus {
  border-color: var(--lux-gold) !important;
  box-shadow: 0 0 0 3px rgba(212,175,55,0.1) !important;
  background: var(--lux-bg-2) !important;
  color: var(--lux-cream) !important;
}
body.lux-page .form-label,
body.lux-page label { color: var(--lux-text) !important; }

/* Nice-select */
body.lux-page .nice-select {
  background: var(--lux-bg-2) !important;
  border-color: var(--lux-border) !important;
  color: var(--lux-cream) !important;
}
body.lux-page .nice-select::after { border-color: var(--lux-muted) !important; }
body.lux-page .nice-select .list {
  background: var(--lux-bg-2) !important;
  border: 1px solid var(--lux-border) !important;
}
body.lux-page .nice-select .option { color: var(--lux-muted) !important; }
body.lux-page .nice-select .option.selected { color: var(--lux-gold) !important; }
body.lux-page .nice-select .option:hover {
  color: var(--lux-gold) !important;
  background: rgba(212,175,55,0.06) !important;
}

/* Select2 */
body.lux-page .select2-container--default .select2-selection--single {
  background: var(--lux-bg-2) !important;
  border-color: var(--lux-border) !important;
  color: var(--lux-cream) !important;
}
body.lux-page .select2-container--default .select2-selection--single .select2-selection__rendered {
  color: var(--lux-cream) !important;
}
body.lux-page .select2-dropdown {
  background: var(--lux-bg-2) !important;
  border-color: var(--lux-border) !important;
}
body.lux-page .select2-container--default .select2-results__option {
  color: var(--lux-muted) !important;
}
body.lux-page .select2-container--default .select2-results__option--highlighted {
  background: rgba(212,175,55,0.1) !important;
  color: var(--lux-gold) !important;
}
body.lux-page .select2-search--dropdown .select2-search__field {
  background: var(--lux-bg-3) !important;
  border-color: var(--lux-border) !important;
  color: var(--lux-cream) !important;
}

/* Form check (checkboxes/radios) */
body.lux-page .form-check-input {
  background-color: var(--lux-bg-3) !important;
  border-color: var(--lux-border) !important;
}
body.lux-page .form-check-input:checked {
  background-color: var(--lux-gold) !important;
  border-color: var(--lux-gold) !important;
}
body.lux-page .form-check-label { color: var(--lux-muted) !important; }

/* =====================================================
   PAGINATION
   ===================================================== */
body.lux-page .pagination .page-link {
  background: var(--lux-bg-2) !important;
  border-color: var(--lux-border) !important;
  color: var(--lux-muted) !important;
  transition: background 0.25s, border-color 0.25s, color 0.25s !important;
}
body.lux-page .pagination .page-link:hover {
  background: rgba(212,175,55,0.08) !important;
  border-color: var(--lux-gold) !important;
  color: var(--lux-gold) !important;
}
body.lux-page .pagination .page-item.active .page-link {
  background: var(--lux-grad) !important;
  border-color: var(--lux-gold) !important;
  color: #0a0a0f !important;
  font-weight: 700;
}
body.lux-page .pagination .page-item.disabled .page-link {
  background: var(--lux-bg-3) !important;
  color: rgba(122,122,150,0.4) !important;
  border-color: var(--lux-border) !important;
}

/* =====================================================
   CARDS (Bootstrap + custom)
   ===================================================== */
body.lux-page .card {
  background: var(--lux-bg-2) !important;
  border-color: var(--lux-border) !important;
  color: var(--lux-text) !important;
}
body.lux-page .card-header {
  background: var(--lux-bg-3) !important;
  border-color: var(--lux-border) !important;
  color: var(--lux-cream) !important;
}
body.lux-page .card-body { color: var(--lux-text) !important; }
body.lux-page .card-footer {
  background: var(--lux-bg-3) !important;
  border-color: var(--lux-border) !important;
}

/* =====================================================
   ALERTS & BADGES
   ===================================================== */
body.lux-page .badge,
body.lux-page .badge-2 {
  font-size: 11px !important;
  letter-spacing: 0.5px !important;
}
body.lux-page .badge.success,
body.lux-page .badge-2.success {
  background: rgba(212,175,55,0.15) !important;
  color: var(--lux-gold-lt) !important;
}
body.lux-page .badge.danger,
body.lux-page .badge-2.danger {
  background: rgba(201,75,75,0.15) !important;
  color: #e86b6b !important;
}
body.lux-page .badge.warning,
body.lux-page .badge-2.warning {
  background: rgba(232,184,75,0.15) !important;
  color: #e8b84b !important;
}
body.lux-page .badge.info,
body.lux-page .badge-2.info {
  background: rgba(38,180,251,0.15) !important;
  color: #26b4fb !important;
}

/* =====================================================
   TABS
   ===================================================== */
body.lux-page .nav-tabs {
  border-color: var(--lux-border) !important;
}
body.lux-page .nav-tabs .nav-link {
  color: var(--lux-muted) !important;
  background: transparent !important;
  border-color: transparent !important;
  transition: color 0.25s !important;
}
body.lux-page .nav-tabs .nav-link:hover { color: var(--lux-gold) !important; }
body.lux-page .nav-tabs .nav-link.active {
  color: var(--lux-gold) !important;
  background: var(--lux-bg-2) !important;
  border-color: var(--lux-border) var(--lux-border) transparent !important;
}
body.lux-page .tab-content { color: var(--lux-text); }

/* =====================================================
   ACCORDION / FAQ
   ===================================================== */
body.lux-page .accordion-item {
  background: var(--lux-bg-2) !important;
  border-color: var(--lux-border) !important;
  margin-bottom: 8px;
  border-radius: 10px !important;
  overflow: hidden;
}
body.lux-page .accordion-button {
  background: var(--lux-bg-2) !important;
  color: var(--lux-cream) !important;
  box-shadow: none !important;
}
body.lux-page .accordion-button::after {
  filter: brightness(0) saturate(100%) invert(75%) sepia(50%) saturate(600%) hue-rotate(10deg);
}
body.lux-page .accordion-button:not(.collapsed) {
  color: var(--lux-gold) !important;
  background: rgba(212,175,55,0.04) !important;
}
body.lux-page .accordion-body {
  color: var(--lux-muted) !important;
  background: var(--lux-bg-2) !important;
  border-top: 1px solid var(--lux-border) !important;
}

/* =====================================================
   MODALS
   ===================================================== */
body.lux-page .modal-content {
  background: var(--lux-bg-2) !important;
  border-color: var(--lux-border) !important;
}
body.lux-page .modal-header {
  border-color: var(--lux-border) !important;
}
body.lux-page .modal-title { color: var(--lux-cream) !important; }
body.lux-page .modal-body  { color: var(--lux-text)  !important; }
body.lux-page .modal-footer {
  border-color: var(--lux-border) !important;
  background: var(--lux-bg-3) !important;
}
body.lux-page .btn-close { filter: invert(1) brightness(0.7); }

/* Logout modal */
body.lux-page .log-out-modal .common-modal-box {
  background: var(--lux-bg-2) !important;
  border: 1px solid var(--lux-border) !important;
}
body.lux-page .log-out-modal .common-modal-box::before {
  display: none !important;
}
body.lux-page .log-out-modal h3 { color: var(--lux-cream) !important; }
body.lux-page .log-out-modal .logout-content { background: transparent !important; }

/* =====================================================
   STARS / RATINGS
   ===================================================== */
body.lux-page .star-icon,
body.lux-page .star .star-icon { color: var(--lux-gold) !important; }
body.lux-page .star p         { color: var(--lux-muted) !important; }
body.lux-page .star p span    { color: var(--lux-muted) !important; }

/* =====================================================
   PRODUCT DETAIL PAGE
   ===================================================== */
body.lux-page .product-details-area {
  background: var(--lux-bg) !important;
  color: var(--lux-text);
}

/* Breadcrumb */
body.lux-page .product-breadcrumb h4 { color: var(--lux-cream) !important; font-weight: 700; }
body.lux-page .product-breadcrumb ul li a {
  color: var(--lux-muted) !important;
  transition: color 0.25s !important;
}
body.lux-page .product-breadcrumb ul li a:hover { color: var(--lux-gold) !important; }
body.lux-page .product-breadcrumb .icon { color: var(--lux-border); }

/* Price */
body.lux-page .price-share h3 {
  color: var(--lux-gold) !important;
  font-weight: 800;
}
body.lux-page .price-share h3 del { color: var(--lux-muted) !important; font-size: 0.65em; }

/* Wishlist & share */
body.lux-page .wish svg path { fill: var(--lux-muted) !important; transition: fill 0.25s; }
body.lux-page .wish.active svg path,
body.lux-page .wish:hover svg path  { fill: var(--lux-gold) !important; }
body.lux-page .wish .wishlist-text  { color: var(--lux-muted) !important; }

/* Product content panels */
body.lux-page .common-product-design {
  background: var(--lux-bg-2) !important;
  border: 1px solid var(--lux-border) !important;
  border-radius: 14px !important;
}
body.lux-page .product-details h5,
body.lux-page .product-details h4,
body.lux-page .product-details h3,
body.lux-page .product-details h2 { color: var(--lux-cream) !important; }
body.lux-page .product-details p  { color: var(--lux-muted) !important; }

/* Sidebar / order box */
body.lux-page .order-box,
body.lux-page .sidebar-box {
  background: var(--lux-bg-2) !important;
  border: 1px solid var(--lux-border) !important;
  border-radius: 14px !important;
}
body.lux-page .order-box h5,
body.lux-page .sidebar-box h5 { color: var(--lux-cream) !important; }

/* Seller info panel */
body.lux-page .seller-info-box {
  background: var(--lux-bg-2) !important;
  border: 1px solid var(--lux-border) !important;
  border-radius: 14px !important;
}

/* Reviews section */
body.lux-page .reviews-area { background: var(--lux-bg) !important; }
body.lux-page .review-card {
  background: var(--lux-bg-2) !important;
  border: 1px solid var(--lux-border) !important;
  border-radius: 12px !important;
}
body.lux-page .review-card .reviewer-name { color: var(--lux-cream) !important; }
body.lux-page .review-card .review-text   { color: var(--lux-muted) !important; }
body.lux-page .review-card .review-date   { color: rgba(212,175,55,0.45) !important; }

/* =====================================================
   ALL-ITEMS / CATEGORY LISTING PAGE
   ===================================================== */
body.lux-page .all-items-area,
body.lux-page .category-listing-area { background: var(--lux-bg) !important; }

/* Filter sidebar */
body.lux-page .filter-area {
  background: var(--lux-bg-2) !important;
  border: 1px solid var(--lux-border) !important;
  border-radius: 14px !important;
}
body.lux-page .filter-title,
body.lux-page .filter-area h5,
body.lux-page .filter-area h4 { color: var(--lux-cream) !important; }
body.lux-page .filter-area .form-check-label { color: var(--lux-muted) !important; }

/* Filter buttons (category filter bar) */
body.lux-page .filter-button {
  background: var(--lux-bg-2) !important;
  border: 1px solid var(--lux-border) !important;
  color: var(--lux-muted) !important;
  transition: border-color 0.25s, color 0.25s, background 0.25s !important;
}
body.lux-page .filter-button:hover {
  border-color: var(--lux-gold) !important;
  color: var(--lux-gold) !important;
}
body.lux-page .filter-button.active,
body.lux-page .filter-button.is-checked {
  background: rgba(212,175,55,0.1) !important;
  border-color: var(--lux-gold) !important;
  color: var(--lux-gold) !important;
}
body.lux-page .filter-button img {
  filter: brightness(0) saturate(100%) invert(75%) sepia(50%) saturate(600%) hue-rotate(10deg) !important;
}

/* Price range slider */
body.lux-page .price-range-slider .noUi-connect { background: var(--lux-grad) !important; }
body.lux-page .price-range-slider .noUi-handle {
  background: var(--lux-gold) !important;
  border: 2px solid #0a0a0f !important;
  box-shadow: 0 0 6px rgba(212,175,55,0.5) !important;
}

/* =====================================================
   BLOG & BLOG DETAIL PAGES
   ===================================================== */
body.lux-page .blogs-area,
body.lux-page .blog-details-area { background: var(--lux-bg) !important; }

/* Blog detail article */
body.lux-page .blog-content-details h1,
body.lux-page .blog-content-details h2,
body.lux-page .blog-content-details h3,
body.lux-page .blog-content-details h4 { color: var(--lux-cream) !important; }
body.lux-page .blog-content-details p   { color: var(--lux-muted) !important; }
body.lux-page .blog-content-details a   { color: var(--lux-gold) !important; }
body.lux-page .blog-details-area .blog-info { color: rgba(212,175,55,0.5) !important; }

/* Blog sidebar */
body.lux-page .blog-sidebar .widget {
  background: var(--lux-bg-2) !important;
  border: 1px solid var(--lux-border) !important;
  border-radius: 12px !important;
}
body.lux-page .blog-sidebar .widget-title { color: var(--lux-cream) !important; }
body.lux-page .blog-sidebar a { color: var(--lux-muted) !important; }
body.lux-page .blog-sidebar a:hover { color: var(--lux-gold) !important; }

/* =====================================================
   AUTH PAGES (login / register)
   ===================================================== */
body.lux-page .auth-area {
  background: var(--lux-bg) !important;
  min-height: 100vh;
}
body.lux-page .auth-area .auth-img img {
  filter: drop-shadow(0 20px 60px rgba(212,175,55,0.15));
}
body.lux-page .auth-content-box {
  background: var(--lux-bg-2) !important;
  border: 1px solid var(--lux-border) !important;
  border-radius: 16px !important;
}
body.lux-page .auth-content-box h2,
body.lux-page .auth-content-box h3 { color: var(--lux-cream) !important; }
body.lux-page .auth-content-box p,
body.lux-page .auth-content-box .hint { color: var(--lux-muted) !important; }
body.lux-page .auth-content-box a:not(.primary-button) { color: var(--lux-gold) !important; }
body.lux-page .auth-element { display: none !important; }

/* Social login buttons */
body.lux-page .social-login a {
  background: var(--lux-bg-3) !important;
  border: 1px solid var(--lux-border) !important;
  color: var(--lux-cream) !important;
  transition: border-color 0.25s !important;
}
body.lux-page .social-login a:hover { border-color: var(--lux-gold) !important; }

/* =====================================================
   CONTACT / STATIC PAGES
   ===================================================== */
body.lux-page .contact-area { background: var(--lux-bg) !important; }
body.lux-page .contact-info-box {
  background: var(--lux-bg-2) !important;
  border: 1px solid var(--lux-border) !important;
  border-radius: 14px !important;
}
body.lux-page .contact-info-box h5 { color: var(--lux-cream) !important; }
body.lux-page .contact-info-box p   { color: var(--lux-muted) !important; }
body.lux-page .contact-info-box a   { color: var(--lux-gold)  !important; }
body.lux-page .contact-form {
  background: var(--lux-bg-2) !important;
  border: 1px solid var(--lux-border) !important;
  border-radius: 14px !important;
}

/* About / static pages */
body.lux-page .about-area,
body.lux-page .terms-area,
body.lux-page .privacy-area,
body.lux-page .faq-area { background: var(--lux-bg) !important; }
body.lux-page .about-area h2,
body.lux-page .terms-area h2,
body.lux-page .privacy-area h2,
body.lux-page .faq-area h2,
body.lux-page .about-area h3,
body.lux-page .terms-area h3 { color: var(--lux-cream) !important; }
body.lux-page .about-area p,
body.lux-page .terms-area p,
body.lux-page .privacy-area p { color: var(--lux-muted) !important; }

/* =====================================================
   GDPR COOKIE BANNER
   ===================================================== */
body.lux-page .cookie.gdpr .cookie-box {
  background: var(--lux-bg-2) !important;
  border: 1px solid var(--lux-border) !important;
}
body.lux-page .cookie.gdpr .cookie-text p { color: var(--lux-muted) !important; }
body.lux-page .cookie.gdpr .cookie-text a { color: var(--lux-gold) !important; }
body.lux-page .cookie.gdpr .reject-btn {
  background: transparent !important;
  border: 1px solid var(--lux-border) !important;
  color: var(--lux-muted) !important;
}

/* =====================================================
   NEWSLETTER POPUP
   ===================================================== */
body.lux-page .popup-overlay { background: rgba(0,0,0,0.7) !important; }
body.lux-page .promo-popup-main {
  background: var(--lux-bg-2) !important;
  border: 1px solid var(--lux-border) !important;
  border-radius: 16px !important;
}
body.lux-page .promo-popup-main .heading   { color: var(--lux-cream) !important; }
body.lux-page .promo-popup-main .discount  { color: var(--lux-gold)  !important; }
body.lux-page .promo-popup-main .description { color: var(--lux-muted) !important; }

/* =====================================================
   FULL-PAGE OVERLAY
   ===================================================== */
body.lux-page .full-page-overlay { background: rgba(0,0,0,0.6) !important; }

/* =====================================================
   HELPER OVERRIDES (general text)
   ===================================================== */
body.lux-page h1,
body.lux-page h2,
body.lux-page h3,
body.lux-page h4,
body.lux-page h5,
body.lux-page h6 { color: var(--lux-cream); }
body.lux-page p   { color: var(--lux-muted); }
body.lux-page a   { color: inherit; }
body.lux-page a:hover { color: var(--lux-gold); }

/* Horizontal rules */
body.lux-page hr { border-color: var(--lux-border) !important; }

/* Scrollbar (Webkit) */
body.lux-page ::-webkit-scrollbar       { width: 6px; height: 6px; }
body.lux-page ::-webkit-scrollbar-track { background: var(--lux-bg-2); }
body.lux-page ::-webkit-scrollbar-thumb {
  background: rgba(212,175,55,0.3);
  border-radius: 3px;
}
body.lux-page ::-webkit-scrollbar-thumb:hover { background: var(--lux-gold); }

/* Text selection */
body.lux-page ::selection {
  background: rgba(212,175,55,0.25);
  color: var(--lux-cream);
}

/* =====================================================
   Mobile fine-tuning (homepage sections)
   ===================================================== */
@media (max-width: 480px) {
  .lux-hero__title { font-size: 34px; }
  .lux-hero__search { border-radius: 8px; }
  .lux-hero__search button { padding: 14px 14px; font-size: 12px; }
  .lux-sh { margin-bottom: 32px; }
  .lux-sh__title { font-size: 22px; }
  .lux-stats__num { font-size: 28px; }
}
@media (max-width: 768px) {
  body.lux-page .common-page-header { padding: 40px 0 !important; }
  body.lux-page .auth-content-box { border-radius: 12px !important; padding: 24px !important; }
  body.lux-page .lux-cats__grid { gap: 10px; }
}

/* =====================================================
   Manual Payment — details box & image upload fix
   (global — not scoped to lux-page, needed on user layout too)
   ===================================================== */

/* Payment instructions box */
.manual-payment-info-box {
  padding: 14px 16px;
  border-radius: 10px;
  border: 1px solid rgba(128,128,128,0.25);
  background: rgba(0,0,0,0.03);
  margin-bottom: 12px;
  width: 100%;
}
.manual-payment-info-box .frontend-editor-data {
  white-space: normal;
  word-break: break-word;
  overflow-wrap: break-word;
  font-size: 14px;
  line-height: 1.65;
  color: #1a1a1a !important;
}
.manual-payment-info-box .frontend-editor-data * {
  max-width: 100%;
  color: #1a1a1a !important;
}
.manual-payment-info-box .frontend-editor-data img {
  display: block;
  max-width: 100%;
  height: auto;
  border-radius: 8px;
  margin: 8px 0;
}

/* Upload image preview — responsive height */
.upload-custom-file {
  height: auto !important;
  min-height: 155px;
}
.upload-custom-file label {
  position: relative !important;
  display: flex !important;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  min-height: 155px;
  width: 100%;
}
.upload-custom-file label.file-ok {
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  min-height: 200px;
}
.upload-custom-file label.file-ok span {
  position: static !important;
  display: block;
  margin-top: 8px;
  font-size: 12px;
  word-break: break-all;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
@media (max-width: 576px) {
  .upload-custom-file label.file-ok { min-height: 160px; }
}

/* =====================================================
   Contact page — info cards
   ===================================================== */
body.lux-page .info-card {
  background: var(--lux-bg-2) !important;
  border: 1px solid var(--lux-border);
  border-radius: 18px;
  padding: 40px 28px 36px;
  height: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  position: relative;
  overflow: hidden;
  transition: border-color 0.35s ease, transform 0.35s ease, box-shadow 0.35s ease;
}
body.lux-page .info-card::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 2px;
  background: var(--lux-grad);
  opacity: 0;
  transition: opacity 0.35s ease;
}
body.lux-page .info-card:hover {
  border-color: rgba(212,175,55,0.45);
  transform: translateY(-6px);
  box-shadow: 0 16px 48px rgba(212,175,55,0.10);
}
body.lux-page .info-card:hover::before { opacity: 1; }

/* Solid flat backgrounds — no gradients */
body.lux-page .info-card.one,
body.lux-page .info-card.two,
body.lux-page .info-card.three { background: var(--lux-bg-2) !important; }

/* Icon circle */
body.lux-page .info-card .info-card-icon {
  width: 72px;
  height: 72px;
  border-radius: 50%;
  background: rgba(212,175,55,0.08);
  border: 1px solid var(--lux-border);
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 18px;
  transition: background 0.35s, border-color 0.35s;
  flex-shrink: 0;
}
body.lux-page .info-card:hover .info-card-icon {
  background: rgba(212,175,55,0.16);
  border-color: rgba(212,175,55,0.5);
}
body.lux-page .info-card .info-card-icon .info-email-icon,
body.lux-page .info-card .info-card-icon .info-phone-icon,
body.lux-page .info-card .info-card-icon .info-location-icon {
  font-size: 28px;
  color: var(--lux-gold);
}

/* Label */
body.lux-page .info-card .info-card-label {
  display: block;
  font-size: 11px;
  letter-spacing: 2.5px;
  text-transform: uppercase;
  color: var(--lux-gold);
  margin-bottom: 10px;
}

/* Value text */
body.lux-page .info-card p {
  color: var(--lux-text);
  font-size: 15px;
  font-weight: 500;
  margin: 0;
  word-break: break-word;
}
body.lux-page .info-card p a {
  color: var(--lux-text);
  text-decoration: none;
  transition: color 0.25s;
}
body.lux-page .info-card p a:hover { color: var(--lux-gold); }

/* =====================================================
   LUX AUTH — Split-Panel Redesign
   ===================================================== */

/* Page shell */
html:has(body.lux-auth-page),
body.lux-auth-page {
  overflow-x: hidden;
  max-width: 100%;
}
body.lux-auth-page {
  background: #07070f;
  min-height: 100vh;
}

.lux-auth-wrap {
  display: flex;
  min-height: 100vh;
  max-width: 100vw;
  overflow-x: hidden;
}

/* ── Brand Panel (left) ───────────────────────────── */
.lux-auth-brand {
  position: relative;
  width: 42%;
  flex-shrink: 0;
  background: #050510;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* Fine gold grid */
.lux-auth-brand::before {
  content: '';
  position: absolute;
  inset: 0;
  background-image:
    linear-gradient(rgba(212,175,55,0.05) 1px, transparent 1px),
    linear-gradient(90deg, rgba(212,175,55,0.05) 1px, transparent 1px);
  background-size: 52px 52px;
  pointer-events: none;
}

/* Gold bar along top */
.lux-auth-brand::after {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 2px;
  background: linear-gradient(90deg, #D4AF37 0%, transparent 100%);
}

/* Floating particle dots */
.lux-auth-brand__particles {
  position: absolute;
  inset: 0;
  pointer-events: none;
}

.lux-ap {
  position: absolute;
  border-radius: 50%;
  background: rgba(212,175,55,0.5);
  animation: lux-ap-float linear infinite;
}

.lux-ap:nth-child(1)  { width:4px;  height:4px;  top:12%; left:18%; animation-duration:7s;  animation-delay:0s; }
.lux-ap:nth-child(2)  { width:3px;  height:3px;  top:28%; left:78%; animation-duration:5s;  animation-delay:1.2s; }
.lux-ap:nth-child(3)  { width:5px;  height:5px;  top:58%; left:12%; animation-duration:8s;  animation-delay:2s; background: rgba(212,175,55,0.25); }
.lux-ap:nth-child(4)  { width:3px;  height:3px;  top:72%; left:68%; animation-duration:6s;  animation-delay:0.5s; }
.lux-ap:nth-child(5)  { width:6px;  height:6px;  top:40%; left:88%; animation-duration:9s;  animation-delay:1.8s; background: rgba(212,175,55,0.15); }
.lux-ap:nth-child(6)  { width:3px;  height:3px;  top:85%; left:32%; animation-duration:7.5s;animation-delay:3s; }
.lux-ap:nth-child(7)  { width:4px;  height:4px;  top:8%;  left:52%; animation-duration:5.5s;animation-delay:2.5s; }
.lux-ap:nth-child(8)  { width:3px;  height:3px;  top:52%; left:42%; animation-duration:6.5s;animation-delay:4s; }
.lux-ap:nth-child(9)  { width:5px;  height:5px;  top:92%; left:80%; animation-duration:8.5s;animation-delay:1s; background: rgba(212,175,55,0.2); }

@keyframes lux-ap-float {
  0%   { transform: translateY(0)     scale(1);   opacity: 0.3; }
  40%  { opacity: 0.9; }
  50%  { transform: translateY(-22px) scale(1.3); opacity: 1; }
  100% { transform: translateY(0)     scale(1);   opacity: 0.3; }
}

/* Concentric decorative rings */
.lux-auth-ring {
  position: absolute;
  border-radius: 50%;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  border: 1px solid rgba(212,175,55,0.1);
  animation: lux-ring-breathe 5s ease-in-out infinite;
  pointer-events: none;
}
.lux-auth-ring--1 { width: 360px; height: 360px; animation-delay: 0s; }
.lux-auth-ring--2 { width: 240px; height: 240px; animation-delay: 1.7s; border-color: rgba(212,175,55,0.16); }
.lux-auth-ring--3 { width: 140px; height: 140px; animation-delay: 3.4s; border-color: rgba(212,175,55,0.24); }

@keyframes lux-ring-breathe {
  0%, 100% { opacity: 0.4; transform: translate(-50%, -50%) scale(1); }
  50%       { opacity: 1;   transform: translate(-50%, -50%) scale(1.04); }
}

/* Brand content */
.lux-auth-brand__inner {
  position: relative;
  z-index: 2;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 36px;
  padding: 48px 36px;
}

.lux-auth-brand__logo-link {
  display: block;
  filter: drop-shadow(0 0 24px rgba(212,175,55,0.35));
  transition: filter 0.3s;
}
.lux-auth-brand__logo-link:hover {
  filter: drop-shadow(0 0 36px rgba(212,175,55,0.6));
}

.lux-auth-brand__headline-wrap { display: flex; flex-direction: column; gap: 10px; }

.lux-auth-brand__headline {
  font-size: 30px;
  font-weight: 800;
  line-height: 1.25;
  color: var(--lux-cream);
  letter-spacing: -0.5px;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.lux-auth-brand__headline-gold {
  background: var(--lux-grad);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  font-size: 28px;
}

.lux-auth-brand__sub {
  color: var(--lux-muted);
  font-size: 13.5px;
  line-height: 1.65;
  letter-spacing: 0.2px;
  margin: 0;
  max-width: 280px;
}

/* Trust badges list */
.lux-auth-brand__badges {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 10px;
  width: 100%;
  max-width: 280px;
}

.lux-auth-badge {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 11px 16px;
  background: rgba(212,175,55,0.04);
  border: 1px solid rgba(212,175,55,0.12);
  border-radius: 10px;
  color: var(--lux-muted);
  font-size: 13px;
  letter-spacing: 0.3px;
  transition: border-color 0.3s, background 0.3s;
}
.lux-auth-badge:hover {
  border-color: rgba(212,175,55,0.28);
  background: rgba(212,175,55,0.07);
}

.lux-auth-badge__icon {
  color: var(--lux-gold);
  font-size: 18px;
  flex-shrink: 0;
}

/* ── Form Panel (right) ───────────────────────────── */
.lux-auth-form-panel {
  flex: 1;
  min-width: 0;          /* prevent flex child from overflowing */
  background: #0a0a14;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  justify-content: flex-start; /* nav bar always at the very top */
  overflow-x: hidden;    /* clip the glow pseudo-elements */
  overflow-y: auto;
  min-height: 100vh;
  position: relative;
  border-left: 1px solid rgba(212,175,55,0.07);
}

/* Subtle corner glow — kept INSIDE the panel via overflow:hidden above */
.lux-auth-form-panel::before {
  content: '';
  position: absolute;
  top: 0;
  right: 0;
  width: 280px;
  height: 280px;
  background: radial-gradient(circle at top right, rgba(212,175,55,0.07) 0%, transparent 70%);
  pointer-events: none;
}
.lux-auth-form-panel::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  width: 220px;
  height: 220px;
  background: radial-gradient(circle at bottom left, rgba(212,175,55,0.04) 0%, transparent 70%);
  pointer-events: none;
}

.lux-auth-form-scroll {
  width: 100%;
  max-width: 500px;
  padding: 52px 40px;
  margin: auto;          /* centres vertically on desktop (no nav bar) */
  position: relative;
  z-index: 1;
  box-sizing: border-box;
  overflow-x: hidden;    /* contain Bootstrap row negative margins */
}

/* ── Neutralise old auth wrappers inside the scroll ── */
.lux-auth-form-scroll .auth-content,
.lux-auth-form-scroll .auth-content-2,
.lux-auth-form-scroll .auth-content-inside {
  padding: 0 !important;
  background: none !important;
  border: none !important;
  box-shadow: none !important;
  max-width: none !important;
  width: 100% !important;
}

/* Hide logo (shown in brand panel) */
.lux-auth-form-scroll .logo-container { display: none !important; }

/* ── Auth header with gold left-rule ─────────────── */
.lux-auth-form-scroll .auth-header {
  position: relative;
  padding-left: 18px;
  margin-bottom: 32px;
}
.lux-auth-form-scroll .auth-header::before {
  content: '';
  position: absolute;
  left: 0;
  top: 3px;
  bottom: 3px;
  width: 3px;
  background: var(--lux-grad);
  border-radius: 2px;
}
.lux-auth-form-scroll .auth-header h3 {
  font-size: 28px !important;
  font-weight: 800 !important;
  color: var(--lux-cream) !important;
  letter-spacing: -0.4px;
  margin: 0;
  line-height: 1.2;
}

/* ── Inputs ───────────────────────────────────────── */
.lux-auth-form-scroll .form-control,
.lux-auth-form-scroll input.form-control {
  background: #111122 !important;
  border: 1px solid rgba(212,175,55,0.16) !important;
  border-radius: 9px !important;
  color: var(--lux-cream) !important;
  padding: 13px 16px !important;
  font-size: 14px !important;
  transition: border-color 0.3s ease, box-shadow 0.3s ease, background 0.3s ease !important;
  width: 100%;
}
.lux-auth-form-scroll .form-control:focus {
  background: #151528 !important;
  border-color: rgba(212,175,55,0.5) !important;
  box-shadow: 0 0 0 3px rgba(212,175,55,0.08) !important;
  outline: none !important;
}
.lux-auth-form-scroll .form-control::placeholder { color: #3a3a5a !important; }

/* Password field with icon */
.lux-auth-form-scroll .input-field { position: relative; }
.lux-auth-form-scroll .input-field.input-field-icon .form-control { padding-right: 44px !important; }
.lux-auth-form-scroll .input-icon {
  position: absolute;
  right: 14px;
  top: 50%;
  transform: translateY(-50%);
  color: var(--lux-muted);
  font-size: 15px;
  cursor: pointer;
  transition: color 0.25s;
  z-index: 2;
}
.lux-auth-form-scroll .input-icon:hover { color: var(--lux-gold); }

/* Phone flag code */
.lux-auth-form-scroll .input-field-phone .country-code {
  position: absolute;
  left: 14px;
  top: 50%;
  transform: translateY(-50%);
  color: var(--lux-gold);
  font-size: 13px;
  font-weight: 600;
  pointer-events: none;
}
.lux-auth-form-scroll .input-field-phone .form-control { padding-left: 52px !important; }

/* Labels */
.lux-auth-form-scroll .input-label {
  display: block;
  color: #6a6a8a !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  letter-spacing: 1px !important;
  text-transform: uppercase !important;
  margin-bottom: 7px !important;
}
.lux-auth-form-scroll .input-label span { color: var(--lux-gold) !important; }

/* ── Submit button ────────────────────────────────── */
.lux-auth-form-scroll .primary-button.xl-btn,
.lux-auth-form-scroll .auth-action .primary-button {
  background: var(--lux-grad) !important;
  border: none !important;
  color: #07070f !important;
  font-weight: 800 !important;
  font-size: 13px !important;
  letter-spacing: 1.2px !important;
  text-transform: uppercase !important;
  padding: 15px 28px !important;
  border-radius: 9px !important;
  width: 100%;
  box-shadow: 0 4px 20px rgba(212,175,55,0.2) !important;
  transition: box-shadow 0.3s ease, transform 0.2s ease !important;
  cursor: pointer;
}
.lux-auth-form-scroll .primary-button.xl-btn:hover,
.lux-auth-form-scroll .auth-action .primary-button:hover {
  box-shadow: 0 8px 32px rgba(212,175,55,0.42) !important;
  transform: translateY(-2px) !important;
}
.lux-auth-form-scroll .primary-button.xl-btn:active,
.lux-auth-form-scroll .auth-action .primary-button:active {
  transform: translateY(0) !important;
}

/* ── Remember me + Forgot password row ───────────── */
.lux-auth-form-scroll .auth-checking {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
}
.lux-auth-form-scroll .forgot-btn {
  color: var(--lux-gold) !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  text-decoration: none !important;
  transition: color 0.25s !important;
}
.lux-auth-form-scroll .forgot-btn:hover { color: var(--lux-gold-lt) !important; }

/* ── Checkbox ─────────────────────────────────────── */
.lux-auth-form-scroll .cbx span:first-child {
  border-color: rgba(212,175,55,0.3) !important;
  background: #111122 !important;
  border-radius: 5px !important;
}
.lux-auth-form-scroll .inp-cbx:checked + .cbx span:first-child {
  background: var(--lux-gold) !important;
  border-color: var(--lux-gold) !important;
}
.lux-auth-form-scroll .cbx span:last-child { color: var(--lux-muted) !important; font-size: 13px !important; }
.lux-auth-form-scroll .terms-link { color: var(--lux-gold) !important; }

/* ── Buyer / Seller tabs ──────────────────────────── */
.lux-auth-form-scroll .auth-tab { margin-bottom: 28px; }

.lux-auth-form-scroll .auth-tab-area {
  display: flex;
  background: #111122;
  border: 1px solid rgba(212,175,55,0.12);
  border-radius: 11px;
  padding: 5px;
  gap: 5px;
}

.lux-auth-form-scroll .auth-tab-btn {
  flex: 1;
  background: transparent;
  border: none;
  color: #4a4a6a;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 1px;
  text-transform: uppercase;
  padding: 10px 16px;
  border-radius: 8px;
  cursor: pointer;
  transition: background 0.25s, color 0.25s, box-shadow 0.25s;
}
.lux-auth-form-scroll .auth-tab-btn.active {
  background: var(--lux-grad) !important;
  color: #07070f !important;
  box-shadow: 0 2px 14px rgba(212,175,55,0.28);
}
.lux-auth-form-scroll .auth-tab-btn:not(.active):hover {
  color: var(--lux-muted);
  background: rgba(212,175,55,0.06);
}

/* ── Section separator heading ────────────────────── */
.lux-auth-form-scroll .content-separation {
  width: 100%;
  grid-column: 1 / -1;
}
.lux-auth-form-scroll .content-separation p {
  color: var(--lux-gold) !important;
  font-size: 10.5px !important;
  font-weight: 700 !important;
  letter-spacing: 1.8px !important;
  text-transform: uppercase !important;
  margin: 0 0 4px !important;
}
.lux-auth-form-scroll .content-separation p::after {
  content: '';
  display: block;
  height: 1px;
  background: rgba(212,175,55,0.12);
  margin-top: 8px;
}

/* ── OR divider ───────────────────────────────────── */
.lux-auth-form-scroll .or-divider {
  display: flex;
  align-items: center;
  gap: 14px;
  margin: 6px 0;
}
.lux-auth-form-scroll .or-divider::before,
.lux-auth-form-scroll .or-divider::after {
  content: '';
  flex: 1;
  height: 1px;
  background: rgba(212,175,55,0.1);
}
.lux-auth-form-scroll .or-divider .text {
  color: #3a3a5a;
  font-size: 12px;
  letter-spacing: 1px;
  text-transform: uppercase;
}

/* ── Social login buttons ─────────────────────────── */
.lux-auth-form-scroll .social-btn {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  padding: 11px 16px !important;
  background: #111122 !important;
  border: 1px solid rgba(212,175,55,0.12) !important;
  border-radius: 9px !important;
  color: var(--lux-muted) !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  text-decoration: none !important;
  transition: border-color 0.25s, background 0.25s, color 0.25s !important;
  width: 100%;
}
.lux-auth-form-scroll .social-btn:hover {
  border-color: rgba(212,175,55,0.35) !important;
  background: #161630 !important;
  color: var(--lux-cream) !important;
}

/* ── "Already have account?" link row ────────────── */
.lux-auth-form-scroll .switch-page { margin-top: 28px; }
.lux-auth-form-scroll .switch-page p {
  text-align: center;
  font-size: 13px !important;
  color: #3a3a5a !important;
  margin: 0;
}
.lux-auth-form-scroll .switch-page a {
  color: var(--lux-gold) !important;
  font-weight: 700 !important;
  text-decoration: none !important;
}
.lux-auth-form-scroll .switch-page a:hover { color: var(--lux-gold-lt) !important; }

/* ── Select dropdowns (country / gender) ─────────── */
.lux-auth-form-scroll .auth-nice-select select,
.lux-auth-form-scroll .auth-nice-select-2 select {
  background: #111122 !important;
  border: 1px solid rgba(212,175,55,0.16) !important;
  border-radius: 9px !important;
  color: var(--lux-cream) !important;
  padding: 13px 16px !important;
  font-size: 14px !important;
  width: 100%;
  appearance: auto;
}
.lux-auth-form-scroll .auth-nice-select select:focus,
.lux-auth-form-scroll .auth-nice-select-2 select:focus {
  border-color: rgba(212,175,55,0.5) !important;
  outline: none !important;
}
.lux-auth-form-scroll .auth-nice-select select option,
.lux-auth-form-scroll .auth-nice-select-2 select option {
  background: #0d0d1a;
  color: var(--lux-cream);
}

/* ── Validation error message ─────────────────────── */
.lux-auth-form-scroll .feedback-invalid {
  color: #e05252 !important;
  font-size: 11.5px !important;
  margin-top: 5px !important;
  letter-spacing: 0.2px;
}

/* ── Mobile top nav bar (hidden on desktop) ──────── */
.lux-auth-mobile-nav {
  display: none; /* shown via media query below */
  align-items: center;
  justify-content: space-between;
  padding: 14px 20px;
  border-bottom: 1px solid rgba(212,175,55,0.1);
  background: #07070f;
  position: sticky;
  top: 0;
  z-index: 100;
  flex-shrink: 0;
}

.lux-auth-mobile-nav__home {
  display: flex;
  align-items: center;
  gap: 6px;
  color: var(--lux-muted) !important;
  text-decoration: none !important;
  font-size: 13px;
  font-weight: 500;
  letter-spacing: 0.3px;
  transition: color 0.25s;
  min-width: 70px;
}
.lux-auth-mobile-nav__home:hover { color: var(--lux-gold) !important; }

.lux-auth-mobile-nav__arrow { font-size: 18px; }

.lux-auth-mobile-nav__logo {
  display: flex;
  align-items: center;
  filter: drop-shadow(0 0 12px rgba(212,175,55,0.3));
}

.lux-auth-mobile-nav__spacer { min-width: 70px; }

/* ── Responsive ───────────────────────────────────── */
@media (max-width: 960px) {
  .lux-auth-brand { display: none !important; }

  .lux-auth-form-panel {
    border-left: none;
    background: #07070f;
    flex-direction: column;
    align-items: stretch;
  }

  /* Show mobile nav bar */
  .lux-auth-mobile-nav { display: flex; }

  .lux-auth-form-scroll {
    max-width: 100%;
    padding: 32px 24px 48px;
    display: flex;
    flex-direction: column;
  }

  /* On tablet (600-960px) — constrain form width and centre it */
  @media (min-width: 600px) {
    .lux-auth-form-scroll {
      max-width: 560px;
      margin: 0 auto;
      width: 100%;
    }
  }
}

@media (max-width: 599px) {
  /* Full-width form with safe horizontal padding */
  .lux-auth-form-scroll { padding: 24px 18px 52px; }

  .lux-auth-form-scroll .auth-header { margin-bottom: 24px; }
  .lux-auth-form-scroll .auth-header h3 { font-size: 24px !important; }

  /* Inputs and buttons — comfortable touch targets */
  .lux-auth-form-scroll .form-control,
  .lux-auth-form-scroll input.form-control {
    padding: 14px 16px !important;
    font-size: 16px !important; /* prevents iOS zoom on focus */
    border-radius: 10px !important;
  }
  .lux-auth-form-scroll .input-field.input-field-icon .form-control {
    padding-right: 48px !important;
  }

  .lux-auth-form-scroll .primary-button.xl-btn,
  .lux-auth-form-scroll .auth-action .primary-button {
    padding: 16px 24px !important;
    font-size: 14px !important;
    border-radius: 10px !important;
  }

  /* Tabs */
  .lux-auth-form-scroll .auth-tab-btn { padding: 11px 12px; font-size: 11px; }

  /* Make two-column register rows go single column */
  .lux-auth-form-scroll .col-md-6 {
    flex: 0 0 100% !important;
    max-width: 100% !important;
  }

  /* Social buttons — stack vertically */
  .lux-auth-form-scroll .social-logins .col-sm-6 {
    flex: 0 0 100% !important;
    max-width: 100% !important;
  }

  /* Checkbox row and checking row */
  .lux-auth-form-scroll .auth-checking { flex-direction: column; align-items: flex-start; gap: 10px; }

  /* Select dropdowns */
  .lux-auth-form-scroll .auth-nice-select select,
  .lux-auth-form-scroll .auth-nice-select-2 select {
    padding: 14px 16px !important;
    font-size: 16px !important;
  }

  /* Labels */
  .lux-auth-form-scroll .input-label { font-size: 11px !important; }

  /* Switch page */
  .lux-auth-form-scroll .switch-page { margin-top: 32px; }

  /* Row gap on register form */
  .lux-auth-form-scroll .row.gy-3 { --bs-gutter-y: 0.85rem; }
  .lux-auth-form-scroll .row.gy-4 { --bs-gutter-y: 1rem; }
}

/* Safe-area bottom padding for notched phones */
@supports (padding-bottom: env(safe-area-inset-bottom)) {
  .lux-auth-form-scroll { padding-bottom: calc(52px + env(safe-area-inset-bottom)); }
  @media (max-width: 599px) {
    .lux-auth-form-scroll { padding-bottom: calc(40px + env(safe-area-inset-bottom)); }
  }
}

/* =====================================================
   LUX NFT PRODUCT CARD
   ===================================================== */

.lux-nft-card {
  background: #0d0d1a;
  border: 1px solid rgba(212,175,55,0.1);
  border-radius: 16px 4px 16px 16px;   /* notched top-right */
  overflow: hidden;
  display: flex;
  flex-direction: column;
  height: 100%;
  position: relative;
  transition: border-color .35s ease, transform .35s ease, box-shadow .35s ease;
}
.lux-nft-card:hover {
  border-color: rgba(212,175,55,0.45);
  transform: translateY(-7px);
  box-shadow: 0 20px 52px rgba(212,175,55,0.13), 0 6px 18px rgba(0,0,0,0.5);
}

/* Gold triangle in notched corner */
.lux-nft-card::after {
  content: '';
  position: absolute;
  top: 0; right: 0;
  width: 28px; height: 28px;
  background: var(--lux-grad);
  clip-path: polygon(0 0, 100% 0, 100% 100%);
  z-index: 6;
  opacity: .65;
  transition: opacity .3s;
  pointer-events: none;
}
.lux-nft-card:hover::after { opacity: 1; }

/* ── Image ──────────────────────────────────────── */
.lux-nft-card__media {
  position: relative;
  width: 100%;
  aspect-ratio: 4 / 3;
  overflow: hidden;
  flex-shrink: 0;
}
.lux-nft-card__img-link {
  display: block;
  width: 100%; height: 100%;
}
.lux-nft-card__img {
  width: 100%; height: 100%;
  object-fit: cover;
  transition: transform .55s ease;
  display: block;
}
.lux-nft-card:hover .lux-nft-card__img { transform: scale(1.07); }

/* ── Category pill (top-left) ───────────────────── */
.lux-nft-card__cat {
  position: absolute;
  top: 10px; left: 10px;
  background: rgba(7,7,15,.75);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  border: 1px solid rgba(212,175,55,.25);
  color: var(--lux-gold) !important;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .8px;
  text-transform: uppercase;
  padding: 4px 10px;
  border-radius: 20px;
  text-decoration: none !important;
  z-index: 3;
  transition: background .25s, border-color .25s;
}
.lux-nft-card__cat:hover {
  background: rgba(212,175,55,.15);
  border-color: rgba(212,175,55,.55);
}

/* ── Wishlist heart (top-right) ─────────────────── */
.lux-nft-card__wish {
  position: absolute;
  top: 10px; right: 10px;
  width: 34px; height: 34px;
  background: rgba(7,7,15,.72);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  border: 1px solid rgba(255,255,255,.1);
  border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  cursor: pointer;
  z-index: 3;
  transition: background .25s, border-color .25s, color .25s;
  color: rgba(255,255,255,.5);
  padding: 0;
}
.lux-nft-card__wish svg {
  width: 16px; height: 16px;
  stroke: currentColor;
  fill: none;
  transition: fill .25s, stroke .25s;
}
.lux-nft-card__wish:hover {
  background: rgba(212,175,55,.12);
  border-color: rgba(212,175,55,.4);
  color: var(--lux-gold);
}
.lux-nft-card__wish.active {
  background: rgba(224,82,82,.12);
  border-color: rgba(224,82,82,.4);
  color: #e05252;
}
.lux-nft-card__wish.active svg { fill: #e05252; stroke: #e05252; }

/* ── Hot badge (bottom-left) ────────────────────── */
.lux-nft-card__hot {
  position: absolute;
  bottom: 10px; left: 10px;
  background: var(--lux-grad);
  color: #07070f;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .7px;
  text-transform: uppercase;
  padding: 3px 10px 3px 7px;
  border-radius: 20px;
  display: flex; align-items: center; gap: 3px;
  z-index: 3;
  line-height: 1.6;
}
.lux-nft-card__hot iconify-icon { font-size: 12px; }

/* ── Hover overlay ──────────────────────────────── */
.lux-nft-card__overlay {
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,.5);
  display: flex; align-items: center; justify-content: center;
  opacity: 0;
  transition: opacity .35s ease;
  z-index: 4;
  text-decoration: none !important;
}
.lux-nft-card:hover .lux-nft-card__overlay { opacity: 1; }

.lux-nft-card__view-pill {
  background: var(--lux-grad);
  color: #07070f;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 1px;
  text-transform: uppercase;
  padding: 9px 22px;
  border-radius: 24px;
  transform: translateY(10px);
  transition: transform .35s ease;
  display: inline-block;
}
.lux-nft-card:hover .lux-nft-card__view-pill { transform: translateY(0); }

/* ── Card body ──────────────────────────────────── */
.lux-nft-card__body {
  padding: 14px 16px 16px;
  display: flex;
  flex-direction: column;
  gap: 5px;
  flex: 1;
}

.lux-nft-card__title {
  font-size: 15px;
  font-weight: 700;
  line-height: 1.35;
  margin: 0;
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
}
.lux-nft-card__title a {
  color: var(--lux-cream) !important;
  text-decoration: none !important;
  transition: color .25s;
}
.lux-nft-card__title a:hover { color: var(--lux-gold) !important; }

.lux-nft-card__author {
  font-size: 12px;
  color: var(--lux-muted) !important;
  margin: 0;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.lux-nft-card__author a {
  color: var(--lux-gold) !important;
  font-weight: 600;
  text-decoration: none !important;
}
.lux-nft-card__author a:hover { color: var(--lux-gold-lt) !important; }

.lux-nft-card__rating {
  display: flex;
  align-items: center;
  gap: 4px;
}
.lux-nft-card__star-icon { color: var(--lux-gold); font-size: 13px; }
.lux-nft-card__rating-val { color: var(--lux-cream); font-size: 12px; font-weight: 700; }
.lux-nft-card__rating-ct  { color: var(--lux-muted); font-size: 11px; }

.lux-nft-card__footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: auto;
  padding-top: 10px;
  border-top: 1px solid rgba(212,175,55,.08);
}

.lux-nft-card__price {
  display: flex;
  align-items: baseline;
  gap: 6px;
  flex-wrap: wrap;
}
.lux-nft-card__price-was {
  font-size: 11px;
  color: var(--lux-muted);
  text-decoration: line-through;
}
.lux-nft-card__price-now {
  font-size: 16px;
  font-weight: 800;
  background: var(--lux-grad);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  line-height: 1;
}
.lux-nft-card__offers {
  font-size: 11px;
  color: var(--lux-muted);
  text-align: right;
  white-space: nowrap;
}
.lux-nft-card__offers-num {
  color: var(--lux-cream);
  font-weight: 700;
}

/* ── Mobile tweaks ──────────────────────────────── */
@media (max-width: 575px) {
  .lux-nft-card__title { font-size: 14px; }
  .lux-nft-card__price-now { font-size: 14px; }
  .lux-nft-card__body { padding: 12px 12px 14px; }
}

/* =====================================================
   LUX SELLER CARD
   ===================================================== */

.lux-seller-card {
  background: #0d0d1a;
  border: 1px solid rgba(212,175,55,.1);
  border-radius: 18px;
  padding: 30px 20px 20px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 14px;
  text-align: center;
  position: relative;
  overflow: hidden;
  transition: border-color .35s ease, transform .35s ease, box-shadow .35s ease;
  height: 100%;
}
/* Gold top bar on hover */
.lux-seller-card::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 2px;
  background: var(--lux-grad);
  opacity: 0;
  transition: opacity .35s;
}
/* Background grid pattern */
.lux-seller-card::after {
  content: '';
  position: absolute;
  inset: 0;
  background-image:
    linear-gradient(rgba(212,175,55,.03) 1px, transparent 1px),
    linear-gradient(90deg, rgba(212,175,55,.03) 1px, transparent 1px);
  background-size: 30px 30px;
  pointer-events: none;
  z-index: 0;
}
.lux-seller-card:hover {
  border-color: rgba(212,175,55,.38);
  transform: translateY(-6px);
  box-shadow: 0 14px 44px rgba(212,175,55,.1), 0 4px 14px rgba(0,0,0,.45);
}
.lux-seller-card:hover::before { opacity: 1; }

/* All direct children above the grid pattern */
.lux-seller-card > * { position: relative; z-index: 1; }

/* ── Avatar ─────────────────────────────────────── */
.lux-seller-card__avatar-wrap {
  position: relative;
  width: 88px; height: 88px;
  flex-shrink: 0;
}
.lux-seller-card__avatar-ring {
  position: absolute;
  inset: -3px;
  border-radius: 50%;
  background: var(--lux-grad);
  opacity: .5;
  transition: opacity .35s, inset .35s;
  z-index: 0;
}
.lux-seller-card:hover .lux-seller-card__avatar-ring {
  opacity: 1;
  inset: -4px;
}
.lux-seller-card__avatar {
  width: 88px; height: 88px;
  border-radius: 50%;
  object-fit: cover;
  display: block;
  position: relative;
  z-index: 1;
  border: 3px solid #0d0d1a;
  transition: border-color .35s;
}

/* Portfolio badge */
.lux-seller-card__badge {
  position: absolute;
  bottom: 1px; right: 1px;
  width: 26px; height: 26px;
  background: var(--lux-grad);
  border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  z-index: 2;
  border: 2px solid #0d0d1a;
}
.lux-seller-card__badge img { width: 13px; height: 13px; object-fit: contain; }

/* ── Info ───────────────────────────────────────── */
.lux-seller-card__info {
  display: flex; flex-direction: column; gap: 4px;
  width: 100%;
}
.lux-seller-card__name {
  font-size: 15px;
  font-weight: 700;
  color: var(--lux-cream) !important;
  margin: 0;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.lux-seller-card__country {
  font-size: 11px;
  color: var(--lux-muted) !important;
  display: flex; align-items: center; justify-content: center; gap: 3px;
  margin: 0;
}
.lux-seller-card__country iconify-icon { color: var(--lux-gold); font-size: 13px; }

/* ── Stats row ──────────────────────────────────── */
.lux-seller-card__stats {
  display: flex;
  align-items: center;
  width: 100%;
  background: rgba(212,175,55,.04);
  border: 1px solid rgba(212,175,55,.08);
  border-radius: 12px;
  overflow: hidden;
}
.lux-seller-card__stat {
  flex: 1;
  display: flex; flex-direction: column; align-items: center;
  padding: 10px 8px;
  gap: 3px;
}
.lux-seller-card__stat-sep {
  width: 1px; height: 34px;
  background: rgba(212,175,55,.1);
  flex-shrink: 0;
}
.lux-seller-card__stat-val {
  font-size: 18px;
  font-weight: 800;
  line-height: 1;
  background: var(--lux-grad);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}
.lux-seller-card__stat-val.lux-sc-warn {
  background: linear-gradient(135deg,#c8960b,#f5c518);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}
.lux-seller-card__stat-val.lux-sc-low {
  background: none !important;
  -webkit-text-fill-color: var(--lux-muted);
  color: var(--lux-muted);
}
.lux-seller-card__stat-label {
  font-size: 10px;
  font-weight: 700;
  color: var(--lux-muted);
  letter-spacing: .8px;
  text-transform: uppercase;
}

/* ── Action row ─────────────────────────────────── */
.lux-seller-card__actions {
  display: flex;
  gap: 8px;
  width: 100%;
  align-items: center;
}
.lux-seller-card__btn {
  flex: 1;
  display: flex; align-items: center; justify-content: center;
  padding: 10px 14px;
  background: transparent;
  border: 1px solid rgba(212,175,55,.3);
  border-radius: 10px;
  color: var(--lux-gold) !important;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .6px;
  text-transform: uppercase;
  text-decoration: none !important;
  transition: background .25s, border-color .25s, color .25s;
  white-space: nowrap;
}
.lux-seller-card__btn:hover {
  background: var(--lux-grad);
  border-color: transparent;
  color: #07070f !important;
}
.lux-seller-card__follow {
  width: 38px; height: 38px;
  flex-shrink: 0;
  background: rgba(212,175,55,.05);
  border: 1px solid rgba(212,175,55,.15);
  border-radius: 10px;
  display: flex; align-items: center; justify-content: center;
  cursor: pointer;
  color: var(--lux-muted);
  transition: background .25s, border-color .25s, color .25s;
  padding: 0;
}
.lux-seller-card__follow:hover,
.lux-seller-card__follow.active {
  background: rgba(224,82,82,.1);
  border-color: rgba(224,82,82,.35);
  color: #e05252;
}
.lux-seller-card__follow iconify-icon { font-size: 16px; }
/* =====================================================
   MOBILE OVERFLOW FIXES + PERFORMANCE OPTIMISATIONS
   ===================================================== */

/* ── Global overflow guard ──────────────────────────── */
body.lux-page,
body.lux-page * { box-sizing: border-box; }

body.lux-page {
  overflow-x: hidden !important;
}

/* ── Header: collapse gaps & min-widths on tablet/mobile */
@media (max-width: 1199px) {
  body.lux-page .header-full { gap: 10px !important; }
  body.lux-page .header-full .left { gap: 12px !important; }
  body.lux-page .header .search {
    min-width: 0 !important;
    max-width: 220px !important;
  }
  /* Kill separator line that would still take padding space */
  body.lux-page .header-full .left .search { padding-left: 12px !important; }
}

@media (max-width: 991px) {
  body.lux-page .has-container-fluid { padding: 0 16px !important; }
  body.lux-page .header-full { gap: 6px !important; }
  body.lux-page .header-full .left { gap: 8px !important; }
  body.lux-page .header-full .left .search { border-left: none !important; padding-left: 0 !important; }
  /* Hide the sign-in / language pill entirely on mobile — both accessible in drawer */
  body.lux-page .header .auth-language-cta-inside { display: none !important; }
}

@media (max-width: 767px) {
  body.lux-page .has-container-fluid { padding: 0 12px !important; }
  body.lux-page .header-full { gap: 4px !important; }
  body.lux-page .header-full .right { gap: 3px !important; flex-shrink: 0; min-width: 0; }
  /* Smaller icon buttons on phones */
  body.lux-page .notification-btn,
  body.lux-page .chat-btn,
  body.lux-page .mobile-search-button,
  body.lux-page .td-offcanvas-toggle {
    width: 34px !important;
    height: 34px !important;
  }
}

/* ── Performance: remove backdrop-filter on mobile ──── */
/* backdrop-filter triggers GPU compositing — kills mobile FPS */
@media (max-width: 991px) {
  body.lux-page .td-offcanvas {
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
  }
  body.lux-page .td-offcanvas-overlay {
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
  }
  body.lux-page .mobile-search-popup {
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
  }
}

/* ── Performance: reduce transitions on mobile ──────── */
@media (max-width: 767px) {
  body.lux-page .lux-nft-card,
  body.lux-page .lux-nft-card__img,
  body.lux-page .lux-nft-card__overlay,
  body.lux-page .lux-seller-card,
  body.lux-page .lux-seller-card__avatar-ring {
    transition: none !important;
    will-change: auto !important;
  }
  body.lux-page .header .notification-btn,
  body.lux-page .header .chat-btn,
  body.lux-page .header .mobile-search-button,
  body.lux-page .td-offcanvas-toggle {
    transition: none !important;
  }
}

/* ── Performance: contain layout paint for card grids ─ */
body.lux-page .lux-nft-card { contain: layout style; }
body.lux-page .lux-seller-card { contain: layout style; }

/* ── Offcanvas mobile overflow guard ───────────────── */
body.lux-page .td-offcanvas { max-width: 90vw !important; overflow-x: hidden !important; }
body.lux-page .td-offcanvas-wrapper { overflow-x: hidden !important; }
body.lux-page .offcanvas-nav ul li a { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

/* ── Auth page mobile overflow guard ───────────────── */
@media (max-width: 960px) {
  body.lux-auth-page .lux-auth-form-scroll { overflow-x: hidden !important; }
  body.lux-auth-page .lux-auth-form-panel { overflow-x: hidden !important; }
}

/* ── Fix: hide empty .middle below desktop width ─────
   Base theme hides .navigation-menu inside .middle at < 1200px but not
   .middle itself; our higher-specificity display:flex keeps it as a
   space-stealing ghost that pushes the hamburger off-screen.            */
@media (max-width: 1199px) {
  body.lux-page .header-full .middle { display: none !important; }
}

/* ── Overflow containment (mobile) ─────────────────────
   overflow-x:clip on main cuts off content overflow without
   creating a scroll container, so position:fixed elements
   (offcanvas, sticky header) are never affected.            */
@media (max-width: 1199px) {
  body.lux-page main,
  body.lux-page .td-header-section,
  body.lux-page section { overflow-x: clip; }

  /* Clip only horizontal overflow on header — keep overflow-y visible for dropdowns */
  body.lux-page .header { overflow-x: clip; }
}

/* =====================================================
   LUX DASHBOARD — Dark Theme for User / Seller Pages
   ===================================================== */

/* ── Page background ────────────────────────────────── */
body.lux-dash-page {
  background: #07070f !important;
  color: var(--lux-cream) !important;
}
body.lux-dash-page .full-user-dashboard,
body.lux-dash-page .page-wrapper,
body.lux-dash-page .app-page-body-wrapper,
body.lux-dash-page .app-page-full-body,
body.lux-dash-page main { background: #07070f !important; }

/* ── User horizontal nav bar (buyer) ───────────────── */
body.lux-dash-page .user-header {
  background: rgba(7,7,15,0.97) !important;
  border-bottom: 1px solid rgba(212,175,55,0.12) !important;
  box-shadow: 0 2px 20px rgba(0,0,0,0.4) !important;
}
body.lux-dash-page .all-user-navbar { gap: 4px; }
body.lux-dash-page .user-header-link {
  color: #7a7a96 !important;
  background: transparent !important;
  border: none !important;
  border-radius: 10px !important;
  padding: 8px 14px !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  transition: color .2s, background .2s !important;
  display: flex !important;
  align-items: center !important;
  gap: 7px !important;
  white-space: nowrap !important;
  cursor: pointer !important;
  text-decoration: none !important;
}
body.lux-dash-page .user-header-link:hover {
  color: var(--lux-cream) !important;
  background: rgba(212,175,55,0.07) !important;
}
body.lux-dash-page .user-header-link.active {
  color: var(--lux-gold) !important;
  background: rgba(212,175,55,0.1) !important;
}
body.lux-dash-page .user-header-icon { font-size: 16px !important; }
body.lux-dash-page .user-header-dropdown-icon { font-size: 18px !important; }
body.lux-dash-page .scrollbar-button {
  background: rgba(212,175,55,0.08) !important;
  border: 1px solid rgba(212,175,55,0.12) !important;
  color: var(--lux-muted) !important;
}
body.lux-dash-page .scrollbar-arrow { color: var(--lux-muted) !important; }

/* Sub-menu dropdown */
body.lux-dash-page .sub-menu {
  background: #0d0d1a !important;
  border: 1px solid rgba(212,175,55,0.12) !important;
  border-radius: 10px !important;
  box-shadow: 0 8px 32px rgba(0,0,0,0.5) !important;
}
body.lux-dash-page .sub-menu li a {
  color: var(--lux-muted) !important;
  font-size: 13px !important;
  padding: 8px 16px !important;
}
body.lux-dash-page .sub-menu li a:hover,
body.lux-dash-page .sub-menu li a.active {
  color: var(--lux-gold) !important;
  background: rgba(212,175,55,0.07) !important;
}

/* ── Seller sidebar ─────────────────────────────────── */
body.lux-dash-page .app-sidebar-wrapper,
body.lux-dash-page .app-sidebar {
  background: #09090f !important;
  border-right: 1px solid rgba(212,175,55,0.08) !important;
}
body.lux-dash-page .main-sidebar-header {
  background: #09090f !important;
  border-bottom: 1px solid rgba(212,175,55,0.08) !important;
}
body.lux-dash-page .toggle-sidebar {
  background: rgba(212,175,55,0.08) !important;
  border: 1px solid rgba(212,175,55,0.15) !important;
  border-radius: 8px !important;
}
body.lux-dash-page .main-menu .sidebar-menu-item > a,
body.lux-dash-page .main-menu .sidebar-menu-item > button {
  color: #7a7a96 !important;
  border-radius: 10px !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  transition: color .2s, background .2s !important;
}
body.lux-dash-page .main-menu .sidebar-menu-item > a:hover,
body.lux-dash-page .main-menu .sidebar-menu-item > button:hover,
body.lux-dash-page .main-menu .sidebar-menu-item.open > a,
body.lux-dash-page .main-menu .sidebar-menu-item.active > a {
  color: var(--lux-gold) !important;
  background: rgba(212,175,55,0.08) !important;
}
body.lux-dash-page .main-menu .sidebar-menu-item .sidebar-icon { color: inherit !important; }
body.lux-dash-page .has-submenu-slide { background: rgba(0,0,0,0.2) !important; border-radius: 10px !important; }
body.lux-dash-page .has-submenu-slide a {
  color: var(--lux-muted) !important;
  font-size: 13px !important;
}
body.lux-dash-page .has-submenu-slide a:hover,
body.lux-dash-page .has-submenu-slide a.active { color: var(--lux-gold) !important; }

/* ── Dashboard content cards ────────────────────────── */
body.lux-dash-page .user-dashboard,
body.lux-dash-page .dashboard-content { background: transparent !important; }

body.lux-dash-page .card,
body.lux-dash-page .dashboard-card,
body.lux-dash-page .info-card,
body.lux-dash-page .widget-card {
  background: #0d0d1a !important;
  border: 1px solid rgba(212,175,55,0.1) !important;
  border-radius: 14px !important;
  color: var(--lux-cream) !important;
}
body.lux-dash-page .card-header,
body.lux-dash-page .card-title { color: var(--lux-cream) !important; }
body.lux-dash-page .card-body { color: var(--lux-muted) !important; }
body.lux-dash-page .card-footer {
  background: rgba(0,0,0,0.2) !important;
  border-top: 1px solid rgba(212,175,55,0.08) !important;
}

/* ── Stats / overview boxes ─────────────────────────── */
body.lux-dash-page .overview-item,
body.lux-dash-page .stat-card,
body.lux-dash-page .balance-card {
  background: #0d0d1a !important;
  border: 1px solid rgba(212,175,55,0.1) !important;
  border-radius: 14px !important;
}
body.lux-dash-page .overview-item h3,
body.lux-dash-page .stat-card h3,
body.lux-dash-page .overview-item .count,
body.lux-dash-page .stat-card .count {
  background: var(--lux-grad);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}
body.lux-dash-page .overview-item p,
body.lux-dash-page .stat-card p { color: var(--lux-muted) !important; }
body.lux-dash-page .overview-item .icon-box,
body.lux-dash-page .stat-card .icon-box {
  background: rgba(212,175,55,0.1) !important;
  border: 1px solid rgba(212,175,55,0.15) !important;
  color: var(--lux-gold) !important;
  border-radius: 10px !important;
}

/* ── Tables ─────────────────────────────────────────── */
body.lux-dash-page .table-responsive { border-radius: 12px; overflow: hidden; }
body.lux-dash-page table,
body.lux-dash-page .table {
  background: #0d0d1a !important;
  color: var(--lux-muted) !important;
  border-color: rgba(212,175,55,0.08) !important;
}
body.lux-dash-page .table thead th,
body.lux-dash-page table thead th {
  background: rgba(212,175,55,0.05) !important;
  color: rgba(212,175,55,0.6) !important;
  border-bottom: 1px solid rgba(212,175,55,0.12) !important;
  font-size: 11px !important;
  letter-spacing: .8px !important;
  text-transform: uppercase !important;
  font-weight: 700 !important;
}
body.lux-dash-page .table tbody td,
body.lux-dash-page table tbody td {
  color: var(--lux-muted) !important;
  border-bottom: 1px solid rgba(212,175,55,0.05) !important;
  vertical-align: middle !important;
}
body.lux-dash-page .table tbody tr:hover td { background: rgba(212,175,55,0.03) !important; }

/* ── Forms ──────────────────────────────────────────── */
body.lux-dash-page .form-label,
body.lux-dash-page label { color: var(--lux-cream) !important; font-size: 13px !important; font-weight: 600 !important; }
body.lux-dash-page .form-control,
body.lux-dash-page input[type="text"],
body.lux-dash-page input[type="email"],
body.lux-dash-page input[type="password"],
body.lux-dash-page input[type="number"],
body.lux-dash-page input[type="url"],
body.lux-dash-page textarea,
body.lux-dash-page select {
  background: rgba(255,255,255,0.04) !important;
  border: 1px solid rgba(212,175,55,0.15) !important;
  border-radius: 10px !important;
  color: var(--lux-cream) !important;
  font-size: 14px !important;
}
body.lux-dash-page .form-control:focus,
body.lux-dash-page input:focus,
body.lux-dash-page textarea:focus,
body.lux-dash-page select:focus {
  background: rgba(255,255,255,0.06) !important;
  border-color: rgba(212,175,55,0.4) !important;
  box-shadow: 0 0 0 3px rgba(212,175,55,0.08) !important;
  color: var(--lux-cream) !important;
}
body.lux-dash-page .form-control::placeholder,
body.lux-dash-page input::placeholder,
body.lux-dash-page textarea::placeholder { color: #4a4a6a !important; }
body.lux-dash-page .input-group-text {
  background: rgba(212,175,55,0.06) !important;
  border-color: rgba(212,175,55,0.15) !important;
  color: var(--lux-muted) !important;
}

/* nice-select on dashboard */
body.lux-dash-page .nice-select {
  background: rgba(255,255,255,0.04) !important;
  border-color: rgba(212,175,55,0.15) !important;
  color: var(--lux-cream) !important;
  border-radius: 10px !important;
}
body.lux-dash-page .nice-select .list {
  background: #0d0d1a !important;
  border: 1px solid rgba(212,175,55,0.14) !important;
  border-radius: 10px !important;
}
body.lux-dash-page .nice-select .option { color: var(--lux-muted) !important; }
body.lux-dash-page .nice-select .option:hover,
body.lux-dash-page .nice-select .option.selected { color: var(--lux-gold) !important; background: rgba(212,175,55,0.07) !important; }

/* select2 */
body.lux-dash-page .select2-container--default .select2-selection--single,
body.lux-dash-page .select2-container--default .select2-selection--multiple {
  background: rgba(255,255,255,0.04) !important;
  border-color: rgba(212,175,55,0.15) !important;
  border-radius: 10px !important;
}
body.lux-dash-page .select2-container--default .select2-selection--single .select2-selection__rendered { color: var(--lux-cream) !important; }
body.lux-dash-page .select2-dropdown {
  background: #0d0d1a !important;
  border-color: rgba(212,175,55,0.14) !important;
  border-radius: 10px !important;
}
body.lux-dash-page .select2-results__option { color: var(--lux-muted) !important; }
body.lux-dash-page .select2-results__option--highlighted { background: rgba(212,175,55,0.1) !important; color: var(--lux-gold) !important; }

/* ── Buttons ─────────────────────────────────────────── */
body.lux-dash-page .primary-button,
body.lux-dash-page .btn-primary {
  background: var(--lux-grad) !important;
  color: #07070f !important;
  border: none !important;
  font-weight: 700 !important;
  border-radius: 10px !important;
}
body.lux-dash-page .primary-button:hover,
body.lux-dash-page .btn-primary:hover { box-shadow: 0 4px 18px rgba(212,175,55,0.3) !important; }
body.lux-dash-page .border-btn,
body.lux-dash-page .btn-outline-primary {
  background: transparent !important;
  border: 1px solid rgba(212,175,55,0.35) !important;
  color: var(--lux-gold) !important;
  border-radius: 10px !important;
}
body.lux-dash-page .btn-danger,
body.lux-dash-page .delete-btn {
  background: rgba(220,53,69,0.15) !important;
  border: 1px solid rgba(220,53,69,0.3) !important;
  color: #ff6b6b !important;
  border-radius: 10px !important;
}

/* ── Badges & status pills ──────────────────────────── */
body.lux-dash-page .badge { border-radius: 6px !important; font-weight: 600 !important; font-size: 11px !important; }
body.lux-dash-page .badge-success,
body.lux-dash-page .badge.bg-success { background: rgba(34,197,94,0.15) !important; color: #4ade80 !important; }
body.lux-dash-page .badge-danger,
body.lux-dash-page .badge.bg-danger { background: rgba(239,68,68,0.15) !important; color: #f87171 !important; }
body.lux-dash-page .badge-warning,
body.lux-dash-page .badge.bg-warning { background: rgba(212,175,55,0.15) !important; color: var(--lux-gold) !important; }
body.lux-dash-page .badge-info,
body.lux-dash-page .badge.bg-info { background: rgba(99,179,237,0.15) !important; color: #63b3ed !important; }

/* ── Page headings ──────────────────────────────────── */
body.lux-dash-page h1,
body.lux-dash-page h2,
body.lux-dash-page h3,
body.lux-dash-page h4,
body.lux-dash-page h5,
body.lux-dash-page h6 { color: var(--lux-cream) !important; }
body.lux-dash-page p { color: var(--lux-muted) !important; }
body.lux-dash-page a { color: var(--lux-gold) !important; }
body.lux-dash-page a:hover { color: var(--lux-gold-lt) !important; }

/* ── Breadcrumb ─────────────────────────────────────── */
body.lux-dash-page .breadcrumb { background: transparent !important; }
body.lux-dash-page .breadcrumb-item,
body.lux-dash-page .breadcrumb-item a { color: var(--lux-muted) !important; font-size: 13px !important; }
body.lux-dash-page .breadcrumb-item.active { color: var(--lux-gold) !important; }
body.lux-dash-page .breadcrumb-item + .breadcrumb-item::before { color: rgba(212,175,55,0.3) !important; }

/* ── Pagination ─────────────────────────────────────── */
body.lux-dash-page .pagination .page-link {
  background: rgba(255,255,255,0.04) !important;
  border-color: rgba(212,175,55,0.12) !important;
  color: var(--lux-muted) !important;
  border-radius: 8px !important;
}
body.lux-dash-page .pagination .page-item.active .page-link {
  background: var(--lux-grad) !important;
  border-color: transparent !important;
  color: #07070f !important;
}
body.lux-dash-page .pagination .page-link:hover { background: rgba(212,175,55,0.1) !important; color: var(--lux-gold) !important; }

/* ── Alert / notice boxes ───────────────────────────── */
body.lux-dash-page .alert {
  border-radius: 10px !important;
  border: 1px solid !important;
  font-size: 13px !important;
}
body.lux-dash-page .alert-success { background: rgba(34,197,94,0.08) !important; border-color: rgba(34,197,94,0.2) !important; color: #4ade80 !important; }
body.lux-dash-page .alert-danger  { background: rgba(239,68,68,0.08) !important; border-color: rgba(239,68,68,0.2) !important; color: #f87171 !important; }
body.lux-dash-page .alert-warning { background: rgba(212,175,55,0.08) !important; border-color: rgba(212,175,55,0.2) !important; color: var(--lux-gold) !important; }
body.lux-dash-page .alert-info    { background: rgba(99,179,237,0.08) !important; border-color: rgba(99,179,237,0.2) !important; color: #63b3ed !important; }

/* ── Profile / settings page ────────────────────────── */
body.lux-dash-page .user-profile-wrap,
body.lux-dash-page .profile-card {
  background: #0d0d1a !important;
  border: 1px solid rgba(212,175,55,0.1) !important;
  border-radius: 14px !important;
}
body.lux-dash-page .profile-avatar-wrap img {
  border: 3px solid rgba(212,175,55,0.3) !important;
  border-radius: 50% !important;
}
body.lux-dash-page .user-profile-info h4 { color: var(--lux-cream) !important; }
body.lux-dash-page .user-profile-info p  { color: var(--lux-muted) !important; }

/* ── Section/box wrappers commonly used in dashboard ── */
body.lux-dash-page .section-wrapper,
body.lux-dash-page .box,
body.lux-dash-page .content-box,
body.lux-dash-page .custom-card {
  background: #0d0d1a !important;
  border: 1px solid rgba(212,175,55,0.1) !important;
  border-radius: 14px !important;
}
body.lux-dash-page .section-title,
body.lux-dash-page .box-title { color: var(--lux-cream) !important; }
body.lux-dash-page .section-title span,
body.lux-dash-page .box-title span { color: var(--lux-gold) !important; }

/* ── Scrollbar (webkit) ─────────────────────────────── */
body.lux-dash-page ::-webkit-scrollbar { width: 5px; height: 5px; }
body.lux-dash-page ::-webkit-scrollbar-track { background: #07070f; }
body.lux-dash-page ::-webkit-scrollbar-thumb { background: rgba(212,175,55,0.2); border-radius: 4px; }
body.lux-dash-page ::-webkit-scrollbar-thumb:hover { background: rgba(212,175,55,0.4); }

/* ── Performance: dashboard JS is already conditional ──
   Add defer to dashboard-script via inline attr in layout  */

/* =====================================================
   LUX DASHBOARD — Targeted White-Box Fixes + Nav Text
   ===================================================== */

/* ── User header nav text — make it clearly readable ── */
body.lux-dash-page .user-header-link {
  color: #c0c0d8 !important;
}
body.lux-dash-page .user-header-link:hover {
  color: #f5f0e8 !important;
  background: rgba(212,175,55,0.08) !important;
}
body.lux-dash-page .user-header-link.active {
  color: var(--lux-gold) !important;
  background: rgba(212,175,55,0.12) !important;
}
body.lux-dash-page .user-header-link .text { color: inherit !important; }

/* ── Stat / overview cards ──────────────────────────── */
body.lux-dash-page .seller-overview-card,
body.lux-dash-page .seller-overview-card-2 {
  background: #0d0d1a !important;
  border-color: rgba(212,175,55,0.12) !important;
}
body.lux-dash-page .seller-overview-card .text p,
body.lux-dash-page .seller-overview-card-2 .text p { color: var(--lux-muted) !important; }
body.lux-dash-page .seller-overview-card .text h3,
body.lux-dash-page .seller-overview-card-2 .text h3 { color: var(--lux-gold) !important; }
body.lux-dash-page .seller-overview-card.active {
  background: rgba(212,175,55,0.08) !important;
  border-color: rgba(212,175,55,0.25) !important;
}
body.lux-dash-page .seller-overview .title h4 { color: var(--lux-cream) !important; }

/* ── Sort title / breadcrumb row ────────────────────── */
body.lux-dash-page .sort-title h4,
body.lux-dash-page .sold-orders-box .sort-title h4,
body.lux-dash-page .transactions-history-box .sort-title h4 { color: var(--lux-cream) !important; }
body.lux-dash-page .sort-title .table-sort .left p { color: var(--lux-muted) !important; }

/* ── Table containers ───────────────────────────────── */
body.lux-dash-page .common-table .common-table-full {
  background: #0d0d1a !important;
  border-color: rgba(212,175,55,0.1) !important;
}
body.lux-dash-page .common-table .common-table-full table {
  background: #0d0d1a !important;
  color: var(--lux-muted) !important;
}

/* Bootstrap .table-light thead — override all its CSS vars */
body.lux-dash-page .table-light,
body.lux-dash-page .table .table-light,
body.lux-dash-page .common-table-full .table-light {
  --bs-table-color: rgba(212,175,55,0.7) !important;
  --bs-table-bg: rgba(212,175,55,0.05) !important;
  --bs-table-border-color: rgba(212,175,55,0.1) !important;
  --bs-table-striped-bg: rgba(212,175,55,0.05) !important;
  --bs-table-hover-bg: rgba(212,175,55,0.08) !important;
  background-color: rgba(212,175,55,0.05) !important;
  color: rgba(212,175,55,0.7) !important;
}
body.lux-dash-page .table-light th {
  color: rgba(212,175,55,0.7) !important;
  background-color: rgba(212,175,55,0.05) !important;
  border-color: rgba(212,175,55,0.1) !important;
  font-size: 11px !important;
  letter-spacing: .7px !important;
  text-transform: uppercase !important;
}
body.lux-dash-page table tbody td,
body.lux-dash-page table tbody th {
  background-color: transparent !important;
  color: var(--lux-muted) !important;
  border-color: rgba(212,175,55,0.06) !important;
}
body.lux-dash-page table tbody tr:hover td,
body.lux-dash-page table tbody tr:hover th {
  background-color: rgba(212,175,55,0.03) !important;
}

/* ── Common table card (used as a wrapper) ──────────── */
body.lux-dash-page .common-table-card {
  background: #0d0d1a !important;
  border: 1px solid rgba(212,175,55,0.1) !important;
  border-radius: 12px !important;
}
body.lux-dash-page .common-table-card h4 { color: var(--lux-cream) !important; }

/* ── Overview / section wrappers ────────────────────── */
body.lux-dash-page .overview-box,
body.lux-dash-page .seller-overview,
body.lux-dash-page .transactions-history-box,
body.lux-dash-page .sold-orders-box,
body.lux-dash-page .full-user-dashboard { background: transparent !important; }

/* ── Activity chart area ────────────────────────────── */
body.lux-dash-page .activity,
body.lux-dash-page .activity-header,
body.lux-dash-page #chart-container {
  background: #0d0d1a !important;
  border-radius: 12px !important;
  border: 1px solid rgba(212,175,55,0.1) !important;
}

/* ── Referral / link boxes ──────────────────────────── */
body.lux-dash-page .referral-link-box,
body.lux-dash-page .referral-card {
  background: #0d0d1a !important;
  border: 1px solid rgba(212,175,55,0.1) !important;
  border-radius: 12px !important;
  color: var(--lux-muted) !important;
}

/* ── Tooltip action buttons ─────────────────────────── */
body.lux-dash-page .tooltip-btn {
  background: rgba(212,175,55,0.08) !important;
  border: 1px solid rgba(212,175,55,0.15) !important;
  color: var(--lux-gold) !important;
  border-radius: 8px !important;
}
body.lux-dash-page .tooltip-btn:hover {
  background: rgba(212,175,55,0.15) !important;
}
body.lux-dash-page .view-btn { color: var(--lux-gold) !important; }

/* ── Status badges from $order->status_badge ────────── */
body.lux-dash-page .badge.text-bg-success,
body.lux-dash-page .badge.bg-success { background: rgba(34,197,94,0.15) !important; color: #4ade80 !important; }
body.lux-dash-page .badge.text-bg-danger,
body.lux-dash-page .badge.bg-danger  { background: rgba(239,68,68,0.15) !important; color: #f87171 !important; }
body.lux-dash-page .badge.text-bg-warning,
body.lux-dash-page .badge.bg-warning { background: rgba(212,175,55,0.15) !important; color: var(--lux-gold) !important; }
body.lux-dash-page .badge.text-bg-info,
body.lux-dash-page .badge.bg-info    { background: rgba(99,179,237,0.15) !important; color: #63b3ed !important; }
body.lux-dash-page .badge.text-bg-primary,
body.lux-dash-page .badge.bg-primary { background: rgba(212,175,55,0.15) !important; color: var(--lux-gold) !important; }
body.lux-dash-page .badge.text-bg-secondary,
body.lux-dash-page .badge.bg-secondary { background: rgba(122,122,150,0.15) !important; color: #9090b0 !important; }

/* ── Link colours inside tables ─────────────────────── */
body.lux-dash-page .common-table a.link,
body.lux-dash-page table a { color: var(--lux-gold) !important; text-decoration: none !important; }
body.lux-dash-page .common-table a.link:hover,
body.lux-dash-page table a:hover { color: var(--lux-gold-lt) !important; }

/* ── Nice-select inside sort filter ─────────────────── */
body.lux-dash-page .sort-filter .nice-select,
body.lux-dash-page .common-filter .nice-select {
  background: rgba(255,255,255,0.04) !important;
  border-color: rgba(212,175,55,0.15) !important;
  color: var(--lux-cream) !important;
  border-radius: 8px !important;
}

/* ── Bootstrap default white card if used anywhere ──── */
body.lux-dash-page .card {
  background: #0d0d1a !important;
  border-color: rgba(212,175,55,0.1) !important;
  color: var(--lux-muted) !important;
}
body.lux-dash-page .card-header {
  background: rgba(212,175,55,0.04) !important;
  border-color: rgba(212,175,55,0.08) !important;
  color: var(--lux-cream) !important;
}

/* =====================================================
   LUX DASHBOARD — Comprehensive White-Box Elimination
   ===================================================== */

/* ── Global heading/text colours in dash scope ─────── */
body.lux-dash-page h1,
body.lux-dash-page h2,
body.lux-dash-page h3,
body.lux-dash-page h4,
body.lux-dash-page h5,
body.lux-dash-page h6 { color: var(--lux-cream) !important; }
body.lux-dash-page p { color: var(--lux-muted) !important; }
body.lux-dash-page a { color: var(--lux-gold) !important; }
body.lux-dash-page .text-black,
body.lux-dash-page .black-color { color: var(--lux-cream) !important; }
body.lux-dash-page .green-color { color: #4ade80 !important; }
body.lux-dash-page .red-color   { color: #f87171 !important; }

/* ── PAYOUT / PAYMENT pages ────────────────────────── */
body.lux-dash-page .payment-form .full-payment-form {
  background: #0d0d1a !important;
  border-color: rgba(212,175,55,0.12) !important;
}
body.lux-dash-page .payment-form .full-payment-form .inside .payment-box {
  background: rgba(212,175,55,0.06) !important;
  border-radius: 10px !important;
}
body.lux-dash-page .payment-form .full-payment-form .inside .withdraw-form {
  border-color: rgba(212,175,55,0.1) !important;
}
body.lux-dash-page .payment-form .full-payment-form .inside .withdraw-form .title {
  border-bottom-color: rgba(212,175,55,0.1) !important;
}
body.lux-dash-page .payment-form h4 { color: var(--lux-cream) !important; }
body.lux-dash-page .withdraw-box p  { color: var(--lux-muted) !important; }
body.lux-dash-page .withdraw-box h3 { color: var(--lux-gold)  !important; }

/* Withdraw history table (uses .common-full-table, NOT .common-table-full) */
body.lux-dash-page .withdrawl-history h3 { color: var(--lux-cream) !important; }
body.lux-dash-page .withdrawl-history-table .common-full-table {
  background: #0d0d1a !important;
  border: 1px solid rgba(212,175,55,0.1) !important;
  border-radius: 10px !important;
  overflow: hidden !important;
}

/* Topup / checkout area */
body.lux-dash-page .checkout-area-content .checkout-box .right .checkout-card-box .title {
  background: #111124 !important;
  border-color: rgba(212,175,55,0.1) !important;
}
body.lux-dash-page .checkout-area-content .checkout-box .right .checkout-card-box .title h4 {
  color: var(--lux-cream) !important;
}
body.lux-dash-page .checkout-area-content .checkout-box .right .checkout-card-box .full-box {
  background: #0d0d1a !important;
  border-color: rgba(212,175,55,0.1) !important;
}
body.lux-dash-page .checkout-area-content .checkout-box .left .payment-method-box .header-box {
  border-bottom: 1px solid rgba(212,175,55,0.1) !important;
}
body.lux-dash-page .checkout-area-content .checkout-box .left .payment-method-box .header-box h4 {
  color: var(--lux-cream) !important;
}
body.lux-dash-page .checkout-area-content .checkout-box .left .payment-method-box .method-item .method-button {
  background: rgba(255,255,255,0.03) !important;
  border-color: rgba(212,175,55,0.1) !important;
  color: var(--lux-cream) !important;
}
body.lux-dash-page .checkout-area-content .checkout-box .left .payment-method-box .method-item .method-button.open {
  background: rgba(212,175,55,0.06) !important;
}
body.lux-dash-page .checkout-payment .payment-point .left p,
body.lux-dash-page .checkout-payment .payment-point-bold .left p { color: var(--lux-muted) !important; }
body.lux-dash-page .checkout-payment .payment-point .right p,
body.lux-dash-page .checkout-payment .payment-point-bold .right p,
body.lux-dash-page .checkout-payment .payable-amount { color: var(--lux-gold) !important; }
body.lux-dash-page .checkout-payment .payment-line { border-color: rgba(212,175,55,0.1) !important; }

/* ── REFERRAL page ──────────────────────────────────── */
body.lux-dash-page .referral-program .referral-program-box {
  background: #0a0a18 !important;
  border-color: rgba(212,175,55,0.1) !important;
}
body.lux-dash-page .referral-program .referral-program-box .account-balance h5,
body.lux-dash-page .referral-program .referral-program-box .successful-referrals h5 {
  color: var(--lux-cream) !important;
}
body.lux-dash-page .referral-program .referral-program-box .account-balance .card-box,
body.lux-dash-page .referral-program .referral-program-box .account-balance.active .card-box,
body.lux-dash-page .referral-program .referral-program-box .successful-referrals .card-box {
  background: #0d0d1a !important;
  border-color: rgba(212,175,55,0.12) !important;
}
body.lux-dash-page .referral-program .referral-program-box .account-balance .card-box p,
body.lux-dash-page .referral-program .referral-program-box .successful-referrals .card-box p {
  color: var(--lux-muted) !important;
}
body.lux-dash-page .referral-program .referral-program-box .account-balance .card-box h2,
body.lux-dash-page .referral-program .referral-program-box .successful-referrals .card-box h2 {
  color: var(--lux-gold) !important;
}
body.lux-dash-page .referral-program .referral-program-box .link-share-box .referral-link-content {
  background: #0d0d1a !important;
  border-color: rgba(212,175,55,0.12) !important;
}
body.lux-dash-page .referral-program .referral-program-box .link-share-box .referral-link-content p { color: var(--lux-muted) !important; }
body.lux-dash-page .referral-program .referral-program-box .link-share-box .referral-link-content .referral-link-input input {
  background: rgba(255,255,255,0.04) !important;
  border-color: rgba(212,175,55,0.15) !important;
  color: var(--lux-cream) !important;
}
body.lux-dash-page .referral-program .referral-program-box .link-share-box .referral-link-content .share-link h5 { color: var(--lux-cream) !important; }
body.lux-dash-page .referral-program .referral-program-box .how-to-earn h4 { color: var(--lux-cream) !important; }
body.lux-dash-page .referral-program .referral-program-box .how-to-earn .earn-box {
  border-color: rgba(212,175,55,0.08) !important;
}
body.lux-dash-page .referral-program .referral-program-box .how-to-earn .earn-box .earn-list {
  border-bottom-color: rgba(212,175,55,0.07) !important;
}
body.lux-dash-page .referral-program .referral-program-box .how-to-earn .earn-box .earn-list h6 { color: var(--lux-cream) !important; }
body.lux-dash-page .referral-program .referral-program-box .how-to-earn .earn-box .earn-list p  { color: var(--lux-muted) !important; }

/* referral-content (alternate referral widget) */
body.lux-dash-page .referral-content {
  background: #0d0d1a !important;
  border-color: rgba(212,175,55,0.1) !important;
  box-shadow: none !important;
}
body.lux-dash-page .referral-content .referral-link-content {
  background: #111124 !important;
  border-color: rgba(212,175,55,0.1) !important;
}
body.lux-dash-page .referral-content .referral-link-content input {
  background: rgba(255,255,255,0.04) !important;
  border-color: rgba(212,175,55,0.15) !important;
  color: var(--lux-cream) !important;
}

/* Referral tree */
body.lux-dash-page .td-referral-tree-card {
  background: #0d0d1a !important;
  border: 1px solid rgba(212,175,55,0.12) !important;
}
body.lux-dash-page .td-referral-tree-card * { color: var(--lux-cream) !important; }

/* ── MODALS (all types) ──────────────────────────────── */
body.lux-dash-page .common-modal-full .common-modal-box,
body.lux-dash-page .custom-modal    .common-modal-box,
body.lux-dash-page .log-out-modal   .common-modal-box,
body.lux-dash-page .common-modal    .common-modal-box {
  background: #0d0d1a !important;
  border: 1px solid rgba(212,175,55,0.14) !important;
}
body.lux-dash-page .common-modal-full .common-modal-box h4,
body.lux-dash-page .custom-modal    .common-modal-box h4,
body.lux-dash-page .log-out-modal   .common-modal-box h4 { color: var(--lux-cream) !important; }
body.lux-dash-page .common-modal-full .common-modal-box p,
body.lux-dash-page .log-out-modal   .common-modal-box p { color: var(--lux-muted) !important; }
body.lux-dash-page .common-modal-full .common-modal-overlay,
body.lux-dash-page .custom-modal    .common-modal-overlay,
body.lux-dash-page .log-out-modal   .common-modal-overlay {
  background: rgba(0,0,0,0.7) !important;
  backdrop-filter: blur(4px) !important;
}
/* Modal close / cross button */
body.lux-dash-page .common-modal-full .cross,
body.lux-dash-page .custom-modal    .cross,
body.lux-dash-page .log-out-modal   .cross {
  color: var(--lux-muted) !important;
}
body.lux-dash-page .common-modal-full .cross:hover,
body.lux-dash-page .log-out-modal   .cross:hover { color: var(--lux-gold) !important; }
/* Modal action buttons already covered by .primary-button rule */
body.lux-dash-page .modal-action-btn .close,
body.lux-dash-page .withdraw-close { color: var(--lux-muted) !important; }

/* upload thumb inside modals */
body.lux-dash-page .upload-thumb {
  background: rgba(212,175,55,0.03) !important;
  border-color: rgba(212,175,55,0.15) !important;
}
body.lux-dash-page .upload-thumb-content h4 { color: var(--lux-cream) !important; }
body.lux-dash-page .upload-thumb-content p  { color: var(--lux-muted) !important; }

/* ── CHAT (user-to-seller chat + support tickets) ──── */
body.lux-dash-page .support-chat-box {
  background: #0a0a18 !important;
  border-color: rgba(212,175,55,0.1) !important;
}
body.lux-dash-page .support-chat-box .user-name {
  background: rgba(212,175,55,0.06) !important;
  border-color: rgba(212,175,55,0.2) !important;
}
body.lux-dash-page .support-chat-box .user-name p,
body.lux-dash-page .support-chat-box .user-name a { color: var(--lux-cream) !important; }
body.lux-dash-page .chat-body { border-color: rgba(212,175,55,0.06) !important; }

/* User's own message bubble */
body.lux-dash-page .chat-body .user-message .contents {
  background: rgba(212,175,55,0.08) !important;
  border-color: rgba(212,175,55,0.15) !important;
}
/* Admin/other reply bubble */
body.lux-dash-page .chat-body .reply-message .contents {
  background: #111124 !important;
  border-color: rgba(212,175,55,0.08) !important;
}
body.lux-dash-page .chat-body .message .contents p { color: var(--lux-cream) !important; }
body.lux-dash-page .chat-body .message .avatar-thumb .user-info h4 { color: var(--lux-cream) !important; }
body.lux-dash-page .chat-body .message .avatar-thumb .user-info p  { color: var(--lux-muted) !important; }

/* Chat footer input */
body.lux-dash-page .td-chat-footer { border-top: 1px solid rgba(212,175,55,0.08) !important; }
body.lux-dash-page .td-form-group-message .input-field .form-control {
  background: rgba(255,255,255,0.04) !important;
  border-color: rgba(212,175,55,0.15) !important;
  color: var(--lux-cream) !important;
}
body.lux-dash-page .td-form-group-message .file-input .file-clip { color: var(--lux-muted) !important; }
body.lux-dash-page .td-form-group-message .send-button {
  background: var(--lux-grad) !important;
  color: #07070f !important;
  border: none !important;
}

/* Preview file chips (attachment thumbnails) */
body.lux-dash-page .preview-file-box .preview-file {
  background: #111124 !important;
  border-color: rgba(212,175,55,0.12) !important;
  color: var(--lux-muted) !important;
}

/* Recent chat sidebar */
body.lux-dash-page .recent-chat-box {
  background: #0d0d1a !important;
  border-color: rgba(212,175,55,0.1) !important;
}
body.lux-dash-page .chatting-system .recent-chat-box * { color: var(--lux-muted) !important; }
body.lux-dash-page .chatting-system .recent-chat-box a:hover { color: var(--lux-gold) !important; }
body.lux-dash-page .chatting-system .recent-chat-box .active-user { color: var(--lux-cream) !important; }

/* ── SETTINGS page ──────────────────────────────────── */
body.lux-dash-page .account-overview h3 { color: var(--lux-cream) !important; }
body.lux-dash-page .account-overview .account-overview-box {
  background: #0d0d1a !important;
  border-color: rgba(212,175,55,0.1) !important;
}
body.lux-dash-page .account-overview .account-overview-box .overview-full {
  background: #0a0a18 !important;
  box-shadow: 0 4px 30px rgba(0,0,0,0.4) !important;
}
body.lux-dash-page .upload-custom-file label {
  background: rgba(212,175,55,0.04) !important;
  border: 1px dashed rgba(212,175,55,0.2) !important;
  color: var(--lux-muted) !important;
}
body.lux-dash-page .upload-custom-file label .upload-icon { color: var(--lux-gold) !important; }

/* ── NOTIFICATIONS page ─────────────────────────────── */
body.lux-dash-page .notifications-area .notifications-item {
  border-bottom: 1px solid rgba(212,175,55,0.06) !important;
}
body.lux-dash-page .notifications-area .notifications-item .notification-list .content h4.title { color: var(--lux-cream) !important; }
body.lux-dash-page .notifications-area .notifications-item .notification-list .icon { color: var(--lux-gold) !important; }

/* ── SUBSCRIPTIONS / PRICING page ──────────────────── */
body.lux-dash-page .pricing-item {
  background: #0d0d1a !important;
  border: 1px solid rgba(212,175,55,0.1) !important;
  border-radius: 12px !important;
}
body.lux-dash-page .pricing-item.popular-plan {
  background: linear-gradient(135deg, rgba(212,175,55,0.1) 0%, rgba(248,208,96,0.06) 100%) !important;
  border-color: rgba(212,175,55,0.3) !important;
}
body.lux-dash-page .pricing-item .item-title  { color: var(--lux-cream) !important; }
body.lux-dash-page .pricing-item .description { color: var(--lux-muted) !important; }
body.lux-dash-page .pricing-item .price-value strong { color: var(--lux-gold) !important; }
body.lux-dash-page .pricing-item .price-value sub     { color: var(--lux-muted) !important; }
body.lux-dash-page .pricing-item .price-list .list-item-text { color: var(--lux-muted) !important; }

/* ── SELLER SIDEBAR (seller-scoped but lux-dash-page) ── */
body.lux-dash-page .has-submenu-slide.open {
  background: #0d0d1a !important;
  border-color: rgba(212,175,55,0.1) !important;
}
body.lux-dash-page .package-overview .package-overview-card {
  background: #0d0d1a !important;
  border-color: rgba(212,175,55,0.1) !important;
  box-shadow: 0 4px 20px rgba(0,0,0,0.3) !important;
}
body.lux-dash-page .all-portfolios-box .portfolio-box {
  background: #0d0d1a !important;
  border-color: rgba(212,175,55,0.1) !important;
}

/* Activity / Report boxes */
body.lux-dash-page .activity-and-referral-link .report-box .report-box-chart-content {
  background: #0d0d1a !important;
  border-color: rgba(212,175,55,0.1) !important;
  box-shadow: none !important;
}
body.lux-dash-page .activity-and-referral-link .total-referrals .total-referrals-card {
  background: #0d0d1a !important;
  border-color: rgba(212,175,55,0.1) !important;
  box-shadow: none !important;
}
/* Month/year selects inside activity chart */
body.lux-dash-page .month-year-select select {
  background: rgba(255,255,255,0.05) !important;
  border-color: rgba(212,175,55,0.15) !important;
  color: var(--lux-cream) !important;
}

/* ── TABLE account icon cell ─────────────────────────── */
body.lux-dash-page .common-table-full table tbody .account-name .icon {
  background: rgba(212,175,55,0.08) !important;
  border-color: rgba(212,175,55,0.1) !important;
}

/* ── KYC / verification boxes ───────────────────────── */
body.lux-dash-page .all-verification-box .verification-box {
  background: #0d0d1a !important;
  border: 1px solid rgba(212,175,55,0.1) !important;
  border-radius: 10px !important;
  padding: 20px !important;
}
body.lux-dash-page .all-verification-box .verification-box h4 { color: var(--lux-cream) !important; }

/* ── date-range picker (withdrawal log page) ────────── */
body.lux-dash-page .daterangepicker {
  background: #0d0d1a !important;
  border: 1px solid rgba(212,175,55,0.14) !important;
  color: var(--lux-cream) !important;
}
body.lux-dash-page .daterangepicker td.active,
body.lux-dash-page .daterangepicker td.active:hover { background: var(--lux-gold) !important; color: #07070f !important; }
body.lux-dash-page .daterangepicker td.available:hover { background: rgba(212,175,55,0.1) !important; }
body.lux-dash-page .daterangepicker .calendar-table { background: #0d0d1a !important; border-color: rgba(212,175,55,0.1) !important; }
body.lux-dash-page .daterangepicker select.monthselect,
body.lux-dash-page .daterangepicker select.yearselect {
  background: #111124 !important;
  border-color: rgba(212,175,55,0.15) !important;
  color: var(--lux-cream) !important;
}

/* ── Flatpickr calendar (transaction filter) ────────── */
body.lux-dash-page .flatpickr-calendar {
  background: #0d0d1a !important;
  border: 1px solid rgba(212,175,55,0.14) !important;
  box-shadow: 0 4px 30px rgba(0,0,0,0.5) !important;
}
body.lux-dash-page .flatpickr-day { color: var(--lux-muted) !important; }
body.lux-dash-page .flatpickr-day.selected,
body.lux-dash-page .flatpickr-day.selected:hover { background: var(--lux-gold) !important; border-color: var(--lux-gold) !important; color: #07070f !important; }
body.lux-dash-page .flatpickr-day:hover { background: rgba(212,175,55,0.1) !important; }
body.lux-dash-page .flatpickr-months .flatpickr-month,
body.lux-dash-page .flatpickr-weekdays,
body.lux-dash-page span.flatpickr-weekday { background: #0d0d1a !important; color: var(--lux-cream) !important; fill: var(--lux-cream) !important; }
body.lux-dash-page .flatpickr-current-month select,
body.lux-dash-page .flatpickr-current-month input.cur-year {
  background: transparent !important;
  color: var(--lux-cream) !important;
}
body.lux-dash-page .numInputWrapper:hover { background: rgba(212,175,55,0.05) !important; }

/* ── fund-transfer history (withdraw log page) ──────── */
body.lux-dash-page .fund-transfer-history-area,
body.lux-dash-page .fund-transfer-inner,
body.lux-dash-page .my-ads-fields { background: transparent !important; }
body.lux-dash-page .fund-transfer-history-field .box-input,
body.lux-dash-page .fund-transfer-history-field input[type="text"] {
  background: rgba(255,255,255,0.04) !important;
  border: 1px solid rgba(212,175,55,0.15) !important;
  border-radius: 8px !important;
  color: var(--lux-cream) !important;
}
/* Site-card wrapper (notification + withdraw-log pages) */
body.lux-dash-page .site-card {
  background: #0d0d1a !important;
  border: 1px solid rgba(212,175,55,0.1) !important;
  border-radius: 12px !important;
  padding: 24px !important;
}
body.lux-dash-page .site-card-title { color: var(--lux-cream) !important; }

/* Site-custom-table (seller/user withdraw log table) */
body.lux-dash-page .site-custom-table-wrapper { background: transparent !important; }
body.lux-dash-page .site-table-list.site-table-head {
  background: rgba(212,175,55,0.04) !important;
  border-bottom: 1px solid rgba(212,175,55,0.08) !important;
}
body.lux-dash-page .site-table-list.site-table-head .site-table-col { color: rgba(212,175,55,0.7) !important; font-size: 11px !important; text-transform: uppercase !important; letter-spacing: .6px !important; }
body.lux-dash-page .site-table-list .site-table-col { color: var(--lux-muted) !important; border-bottom-color: rgba(212,175,55,0.05) !important; }
body.lux-dash-page .site-table-list:hover { background: rgba(212,175,55,0.02) !important; }

/* Site-badge (custom badge in seller pages) */
body.lux-dash-page .site-badge.badge-pending  { background: rgba(212,175,55,0.12) !important; color: var(--lux-gold)  !important; }
body.lux-dash-page .site-badge.badge-success  { background: rgba(34,197,94,0.12)  !important; color: #4ade80 !important; }
body.lux-dash-page .site-badge.badge-failed   { background: rgba(239,68,68,0.12)  !important; color: #f87171 !important; }
body.lux-dash-page .site-badge.badge-primary  { background: rgba(212,175,55,0.12) !important; color: var(--lux-gold)  !important; }

/* =====================================================
   LUX DASHBOARD — ApexCharts Dark Theme Override
   ===================================================== */

/* ── Activity chart container ───────────────────────── */
body.lux-dash-page .activity-and-referral-link .activity {
  background: #0d0d1a !important;
  border: 1px solid rgba(212,175,55,0.1) !important;
  border-radius: 12px !important;
  padding: 24px !important;
}
body.lux-dash-page .activity-and-referral-link .activity .activity-header h4 { color: var(--lux-cream) !important; }

/* ── ApexCharts tooltip (the white hover box) ────────── */
body.lux-dash-page .apexcharts-tooltip {
  background: #0d0d1a !important;
  border: 1px solid rgba(212,175,55,0.25) !important;
  box-shadow: 0 4px 24px rgba(0,0,0,0.5) !important;
  color: var(--lux-cream) !important;
  border-radius: 8px !important;
}
body.lux-dash-page .apexcharts-tooltip.apexcharts-theme-light {
  background: #0d0d1a !important;
  border: 1px solid rgba(212,175,55,0.25) !important;
  color: var(--lux-cream) !important;
}
body.lux-dash-page .apexcharts-tooltip-title {
  background: rgba(212,175,55,0.07) !important;
  border-bottom: 1px solid rgba(212,175,55,0.12) !important;
  color: rgba(212,175,55,0.8) !important;
  font-size: 11px !important;
  letter-spacing: .5px !important;
}
body.lux-dash-page .apexcharts-tooltip-series-group {
  background: transparent !important;
}
body.lux-dash-page .apexcharts-tooltip-text-y-label { color: var(--lux-muted) !important; }
body.lux-dash-page .apexcharts-tooltip-text-y-value { color: var(--lux-cream) !important; }
body.lux-dash-page .apexcharts-tooltip-text-z-value { color: var(--lux-muted) !important; }

/* x-axis crosshair tooltip */
body.lux-dash-page .apexcharts-xaxistooltip {
  background: #0d0d1a !important;
  border: 1px solid rgba(212,175,55,0.2) !important;
  color: var(--lux-cream) !important;
  border-radius: 6px !important;
}
body.lux-dash-page .apexcharts-xaxistooltip::before { border-bottom-color: rgba(212,175,55,0.2) !important; }
body.lux-dash-page .apexcharts-xaxistooltip::after  { border-bottom-color: #0d0d1a !important; }
body.lux-dash-page .apexcharts-xaxistooltip-text   { color: var(--lux-cream) !important; }

/* ── ApexCharts axis labels (hardcoded #303030 in JS) ── */
body.lux-dash-page .apexcharts-xaxis-label tspan,
body.lux-dash-page .apexcharts-yaxis-label tspan,
body.lux-dash-page .apexcharts-xaxis-label text,
body.lux-dash-page .apexcharts-yaxis-label text { fill: var(--lux-muted) !important; }

/* Grid lines */
body.lux-dash-page .apexcharts-grid line { stroke: rgba(212,175,55,0.06) !important; }
body.lux-dash-page .apexcharts-gridline    { stroke: rgba(212,175,55,0.06) !important; }

/* ── ApexCharts legend (seller pie/donut chart) ────────── */
body.lux-dash-page .apexcharts-legend-text { color: var(--lux-muted) !important; }

/* ── Chart toggle buttons ───────────────────────────── */
body.lux-dash-page .chart-btn {
  color: var(--lux-muted) !important;
  background: rgba(255,255,255,0.03) !important;
  border: 1px solid rgba(212,175,55,0.1) !important;
  border-radius: 8px !important;
}
body.lux-dash-page .chart-btn.active,
body.lux-dash-page .chart-btn:hover {
  color: var(--lux-gold) !important;
  background: rgba(212,175,55,0.08) !important;
  border-color: rgba(212,175,55,0.25) !important;
}
body.lux-dash-page .chart-btn .circle-toggle {
  border-color: rgba(212,175,55,0.3) !important;
}
body.lux-dash-page .chart-btn.active .circle-toggle {
  border-color: var(--lux-gold) !important;
  background: rgba(212,175,55,0.1) !important;
}
body.lux-dash-page .chart-btn .circle-toggle .inner-circle {
  background: rgba(212,175,55,0.4) !important;
}
body.lux-dash-page .chart-btn.active .circle-toggle .inner-circle {
  background: var(--lux-gold) !important;
}

/* date h6 labels above selects */
body.lux-dash-page .date-year h6 { color: var(--lux-muted) !important; }

/* =====================================================
   LUX — Notification & Chat Dropdown Inner Elements
   ===================================================== */

/* ── Notification dropdown header bar ──────────────── */
body.lux-page .notification .notification-box .notification-navigation {
  background: rgba(212,175,55,0.06) !important;
  border-bottom: 1px solid rgba(212,175,55,0.12) !important;
}
body.lux-page .notification .notification-box .notification-navigation h4 {
  color: var(--lux-cream) !important;
}
body.lux-page .notification .notification-box .notification-navigation .mark-all-read {
  color: var(--lux-gold) !important;
}

/* Notification list items */
body.lux-page .notification-box .all-notification-list .notification-list .list {
  border-bottom: 1px solid rgba(212,175,55,0.06) !important;
}
body.lux-page .notification-box .all-notification-list .notification-list .list:hover,
body.lux-page .notification-box .all-notification-list .notification-list .list.active {
  background: rgba(212,175,55,0.05) !important;
}
body.lux-page .notification-box .all-notification-list .notification-list .list .list-item .texts h3 {
  color: var(--lux-cream) !important;
}
body.lux-page .notification-box .all-notification-list .notification-list .list .list-item .texts p {
  color: var(--lux-muted) !important;
}
body.lux-page .notification-box .all-notification-list .notification-list .list > p {
  color: rgba(212,175,55,0.5) !important;
}

/* Notification action footer */
body.lux-page .notification-box .all-notification-list .action-btn {
  border-top: 1px solid rgba(212,175,55,0.08) !important;
}
body.lux-page .notification-box .all-notification-list .action-btn a {
  color: var(--lux-gold) !important;
}

/* ── Chat dropdown header bar ───────────────────────── */
body.lux-page .chat-box .chat-navigation {
  background: rgba(212,175,55,0.06) !important;
  border-bottom: 1px solid rgba(212,175,55,0.12) !important;
}
body.lux-page .chat-box .chat-navigation h4 {
  color: var(--lux-cream) !important;
}

/* Chat list items */
body.lux-page .chat-box .chat-list .chat {
  border-bottom-color: rgba(212,175,55,0.06) !important;
}
body.lux-page .chat-box .chat-list .chat:hover,
body.lux-page .chat-box .chat-list .chat.unread {
  background: rgba(212,175,55,0.05) !important;
}
body.lux-page .chat-box .chat-list .chat .texts h6 {
  color: var(--lux-cream) !important;
}
body.lux-page .chat-box .chat-list .chat .texts p {
  color: var(--lux-muted) !important;
}
body.lux-page .chat-box .chat-list .chat .right p {
  color: rgba(212,175,55,0.45) !important;
}
body.lux-page .chat-box .chat-list .chat .user {
  border-color: rgba(212,175,55,0.12) !important;
}

/* Chat list scrollbar */
body.lux-page .chat-box .chat-list::-webkit-scrollbar-track { background: rgba(212,175,55,0.04) !important; }
body.lux-page .chat-box .chat-list::-webkit-scrollbar-thumb { background: rgba(212,175,55,0.2) !important; }
body.lux-page .chat-box .chat-list::-webkit-scrollbar-thumb:hover { background: rgba(212,175,55,0.35) !important; }

/* Chat view-all footer */
body.lux-page .chat-box .action-btn {
  border-top: 1px solid rgba(212,175,55,0.08) !important;
}

/* ── User-header sub-menu also on lux-page (not just dash) */
body.lux-page .user-header .sub-menu {
  background: #0d0d1a !important;
  border: 1px solid rgba(212,175,55,0.14) !important;
  box-shadow: 0 8px 32px rgba(0,0,0,0.5) !important;
}
body.lux-page .user-header .sub-menu li a {
  color: var(--lux-muted) !important;
}
body.lux-page .user-header .sub-menu li a:hover,
body.lux-page .user-header .sub-menu li a.active {
  color: var(--lux-gold) !important;
  background: rgba(212,175,55,0.07) !important;
}