/* ============================================================
   WINNGOO REELS v2 — GLOBAL STYLESHEET
   Theme: Dark Cinematic / High-Energy Creator Platform
   Font: Clash Display (display) + Satoshi (body)
============================================================ */
@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;500;700;900&family=Bebas+Neue&family=Roboto+Condensed:wght@400;700&display=swap');

@import url('https://api.fontshare.com/v2/css?f[]=clash-display@400,500,600,700&f[]=satoshi@300,400,500,700&display=swap');

:root {
  --red:         #FF3D5A;
  --red-dark:    #D4162F;
  --red-glow:    rgba(255,61,90,0.25);
  --gold:        #FFB703;
  --gold-dark:   #D4930A;
  --green:       #00E5A0;
  --green-dark:  #00B87F;
  --blue:        #3D9EFF;
  --purple:      #9B5CFF;
  --teal:        #00D4E8;

  /* Dark theme base */
  --bg:          #080A0F;
  --bg2:         #0D0F18;
  --bg3:         #131623;
  --surface:     #1A1D2E;
  --surface2:    #222540;
  --border:      rgba(255,255,255,0.08);
  --border2:     rgba(255,255,255,0.14);
  --text:        #F0F2FF;
  --text2:       rgba(240,242,255,0.65);
  --text3:       rgba(240,242,255,0.35);
  --white:       #FFFFFF;
  --dark:        #080A0F;

  --radius:      14px;
  --radius-lg:   22px;
  --radius-xl:   32px;
  --shadow:      0 4px 30px rgba(0,0,0,0.4);
  --shadow-lg:   0 16px 60px rgba(0,0,0,0.5);
  --glow-red:    0 0 40px rgba(255,61,90,0.3);
  --glow-gold:   0 0 40px rgba(255,183,3,0.3);
}

* { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; }
html {
	overflow-x:hidden;
}
body {
  font-family: 'Roboto', sans-serif;
  color: var(--text);
  background: var(--bg);
  overflow-x: hidden;
  font-size: 15px;
  line-height: 1.65;
  top:0 !important;
}

/* TYPOGRAPHY */
h1, h2, h3, .display-font {
  font-family: 'Bebas Neue', sans-serif;
  letter-spacing: -0.5px;
}
h4, h5, h6 { font-family: 'Roboto', sans-serif; font-weight: 700; }
p { font-family: 'Roboto', sans-serif; font-weight: 400; text-align: justify;}
.cs-desc {
  text-align: justify;
}

/* ============================================================
   AOS ANIMATIONS
============================================================ */
[data-aos] {
  opacity: 0;
  transition: opacity 0.7s ease, transform 0.7s ease;
}
[data-aos="fade-up"]    { transform: translateY(40px); }
[data-aos="fade-left"]  { transform: translateX(40px); }
[data-aos="fade-right"] { transform: translateX(-40px); }
[data-aos="fade-in"]    { transform: none; }
[data-aos="zoom-in"]    { transform: scale(0.9); }

[data-aos].aos-animate {
  opacity: 1;
  transform: none;
}
[data-aos-delay="100"] { transition-delay: 0.1s; }
[data-aos-delay="200"] { transition-delay: 0.2s; }
[data-aos-delay="300"] { transition-delay: 0.3s; }
[data-aos-delay="400"] { transition-delay: 0.4s; }
[data-aos-delay="500"] { transition-delay: 0.5s; }
[data-aos-delay="600"] { transition-delay: 0.6s; }

/* ============================================================
   NAVBAR
============================================================ */
.rs-navbar {
  background: rgba(8,10,15,0.8);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  border-bottom: 1px solid var(--border);
  padding: 0;
  position: sticky;
  top: 0;
  z-index: 1000;
  transition: background 0.3s, box-shadow 0.3s;
}
.rs-navbar.scrolled {
  background: rgba(8,10,15,0.97);
  box-shadow: 0 4px 30px rgba(0,0,0,0.5);
}
.rs-navbar .container { max-width: 1320px; }

.navbar-brand-text {
  font-family: 'Bebas Neue', sans-serif;
  font-size: 1.7rem;
  letter-spacing: 1px;
  color: var(--white) !important;
  text-decoration: none;
  line-height: 1;
}
.navbar-brand-text span { color: var(--red); }

.rs-nav-link {
  font-family: 'Roboto', sans-serif;
  font-weight: 500;
  font-size: 0.88rem;
  color: var(--text2) !important;
  padding: 8px 16px !important;
  border-radius: 8px;
  transition: 0.2s;
  text-decoration: none;
  letter-spacing: 0.2px;
}
.rs-nav-link:hover, .rs-nav-link.active {
  color: var(--white) !important;
  background: var(--surface);
}
.rs-nav-link.active { color: var(--red) !important; }

.btn-nav-login {
  border: 1.5px solid var(--border2);
  color: var(--text) !important;
  border-radius: 8px;
  padding: 7px 20px;
  font-weight: 600;
  font-size: 0.85rem;
  background: transparent;
  cursor: pointer;
  transition: 0.2s;
  text-decoration: none;
  letter-spacing: 0.2px;
}
.btn-nav-login:hover { border-color: var(--red); color: var(--red) !important; }

.btn-nav-signup {
  background: var(--red);
  color: #fff !important;
  border: 1.5px solid var(--red);
  border-radius: 8px;
  padding: 7px 22px;
  font-weight: 700;
  font-size: 0.85rem;
  cursor: pointer;
  transition: 0.2s;
  text-decoration: none;
}
.btn-nav-signup:hover {
  background: var(--red-dark);
  border-color: var(--red-dark);
  box-shadow: 0 4px 20px rgba(255,61,90,0.4);
}

.navbar-toggler { color: var(--text) !important; }
.navbar-toggler-icon { filter: invert(1); }

/* ============================================================
   BUTTONS
============================================================ */
.btn-primary-rs {
  background: var(--red);
  color: #fff;
  border: none;
  border-radius: 12px;
  padding: 14px 32px;
  font-family: 'Roboto', sans-serif;
  font-weight: 700;
  font-size: 0.95rem;
  cursor: pointer;
  transition: 0.25s;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  text-decoration: none;
  letter-spacing: 0.2px;
}
.btn-primary-rs:hover {
  background: var(--red-dark);
  transform: translateY(-2px);
  box-shadow: 0 8px 28px rgba(255,61,90,0.45);
  color: #fff;
}

.btn-outline-rs {
  background: transparent;
  color: var(--text);
  border: 1.5px solid var(--border2);
  border-radius: 12px;
  padding: 13px 28px;
  font-family: 'Roboto', sans-serif;
  font-weight: 700;
  font-size: 0.95rem;
  cursor: pointer;
  transition: 0.2s;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  text-decoration: none;
}
.btn-outline-rs:hover { border-color: var(--red); color: var(--red); }

.btn-white-rs {
  background: rgba(255,255,255,0.12);
  color: #fff;
  border: 1.5px solid rgba(255,255,255,0.25);
  border-radius: 12px;
  padding: 14px 32px;
  font-family: 'Roboto', sans-serif;
  font-weight: 700;
  font-size: 0.95rem;
  cursor: pointer;
  transition: 0.2s;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  text-decoration: none;
  backdrop-filter: blur(8px);
}
.btn-white-rs:hover { background: rgba(255,255,255,0.22); color: #fff; transform: translateY(-2px); }

/* ============================================================
   SECTION LABELS & TITLES
============================================================ */
.section-label {
  font-family: 'Roboto', sans-serif;
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 3px;
  text-transform: uppercase;
  color: var(--red);
  margin-bottom: 10px;
  display: block;
}

.section-title {
  font-family: 'Bebas Neue', sans-serif;
  font-size: clamp(2.2rem, 4.5vw, 3.8rem);
  color: var(--text);
  line-height: 1.05;
  margin-bottom: 14px;
  letter-spacing: -0.5px;
}

.section-sub {
  font-size: 0.95rem;
  color: var(--text2);
  max-width: 560px;
  line-height: 1.75;
}

/* Gradient text utility */
.text-gradient {
  background: linear-gradient(135deg, var(--red), var(--gold));
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

/* ============================================================
   COMPETITION CARDS
============================================================ */
.rs-card {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  transition: 0.3s;
  overflow: hidden;
  position: relative;
}
.rs-card:hover {
  box-shadow: 0 20px 60px rgba(0,0,0,0.5), 0 0 30px rgba(255,61,90,0.12);
  transform: translateY(-6px);
  border-color: rgba(255,61,90,0.3);
}

.comp-thumb {
  height: 200px;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}
.comp-thumb img {
  width: 100%; height: 100%;
  object-fit: cover;
  transition: transform 0.5s;
}
.rs-card:hover .comp-thumb img { transform: scale(1.08); }
.comp-thumb-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(0deg, rgba(8,10,15,0.85) 0%, rgba(8,10,15,0.2) 60%, transparent 100%);
}

.badge-status {
  position: absolute;
  top: 14px; right: 14px;
  padding: 5px 14px;
  border-radius: 50px;
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.5px;
  text-transform: uppercase;
}
.badge-fee {
  position: absolute;
  top: 14px; left: 14px;
  background: rgba(8,10,15,0.75);
  color: var(--gold);
  padding: 5px 14px;
  border-radius: 50px;
  font-size: 0.68rem;
  font-weight: 700;
  backdrop-filter: blur(8px);
  border: 1px solid rgba(255,183,3,0.3);
}

.comp-body { padding: 20px; }
.comp-cat {
  font-size: 0.66rem;
  font-weight: 700;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: var(--red);
  margin-bottom: 8px;
}
.comp-title {
  font-family: 'Bebas Neue', sans-serif;
  font-weight: 500;
  font-size: 1.1rem;
  color: var(--text);
  margin-bottom: 8px;
  line-height: 1.3;
  letter-spacing: 1px;
}
.comp-desc {
  font-size: 0.82rem;
  color: var(--text2);
  margin-bottom: 14px;
  line-height: 1.6;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.comp-meta { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 16px; }
.comp-meta-item {
  font-size: 0.72rem;
  color: var(--text3);
  display: flex;
  align-items: center;
  gap: 5px;
}

.btn-comp-reg {
  flex: 1;
  background: var(--red);
  color: #fff;
  border: none;
  border-radius: 10px;
  padding: 10px;
  font-family: 'Roboto', sans-serif;
  font-weight: 700;
  font-size: 0.85rem;
  cursor: pointer;
  transition: 0.2s;
}
.btn-comp-reg:hover { background: var(--red-dark); }

.btn-comp-view {
  flex: 1;
  background: transparent;
  color: var(--text2);
  border: 1.5px solid var(--border2);
  border-radius: 10px;
  padding: 9px;
  font-family: 'Roboto', sans-serif;
  font-weight: 700;
  font-size: 0.85rem;
  cursor: pointer;
  transition: 0.2s;
  text-decoration: none;
  display: block;
  text-align: center;
}
.btn-comp-view:hover { border-color: var(--red); color: var(--red); }

/* ============================================================
   FORMS
============================================================ */
.rs-form .form-label {
  font-family: 'Roboto', sans-serif;
  font-weight: 600;
  font-size: 0.82rem;
  color: var(--text2);
  margin-bottom: 7px;
  letter-spacing: 0.2px;
}
.rs-form .form-control,
.rs-form .form-select {
  background: var(--surface);
  border: 1.5px solid var(--border2);
  border-radius: 12px;
  padding: 12px 16px;
  font-family: 'Roboto', sans-serif;
  font-size: 0.9rem;
  color: var(--text);
  height: auto;
  transition: 0.2s;
}
.rs-form .form-control::placeholder { color: var(--text3); }
.rs-form .form-control:focus,
.rs-form .form-select:focus {
  border-color: var(--red);
  box-shadow: 0 0 0 3px rgba(255,61,90,0.12);
  outline: none;
  background: var(--surface2);
}
.rs-form .form-select { background-color: var(--surface); color: var(--text); }
.rs-form .form-select option { background: var(--surface2); }

.rs-form .input-group .form-control { border-right: none; border-radius: 12px 0 0 12px; }
.rs-form .input-group-text {
  background: var(--surface);
  border: 1.5px solid var(--border2);
  border-left: none;
  border-radius: 0 12px 12px 0;
  cursor: pointer;
  color: var(--text3);
  transition: 0.2s;
}
.rs-form .input-group-text:hover { color: var(--red); }
.rs-form .input-group:focus-within .form-control,
.rs-form .input-group:focus-within .input-group-text {
  border-color: var(--red);
}

.btn-auth-full {
  width: 100%;
  background: var(--red);
  color: #fff;
  border: none;
  border-radius: 12px;
  padding: 14px;
  font-family: 'Roboto', sans-serif;
  font-weight: 700;
  font-size: 0.95rem;
  cursor: pointer;
  transition: 0.25s;
  margin-top: 6px;
  letter-spacing: 0.2px;
}
.btn-auth-full:hover {
  background: var(--red-dark);
  box-shadow: 0 8px 28px rgba(255,61,90,0.45);
}

.auth-link {
  color: var(--red);
  font-weight: 700;
  cursor: pointer;
  text-decoration: none;
}
.auth-link:hover { text-decoration: underline; }

.auth-divider {
  display: flex;
  align-items: center;
  gap: 12px;
  margin: 22px 0;
  color: var(--text3);
  font-size: 0.8rem;
}
.auth-divider::before, .auth-divider::after {
  content: '';
  flex: 1;
  height: 1px;
  background: var(--border);
}

/* ============================================================
   FOOTER
============================================================ */
.rs-footer {
  background: #060810;
  color: var(--text);
  padding: 64px 0 10px;
  border-top: 1px solid var(--border);
}
.footer-brand {
  font-family: 'Bebas Neue', sans-serif;
  font-size: 2rem;
  letter-spacing: 1px;
  color: var(--white);
  margin-bottom: 6px;
}
.footer-brand span { color: var(--red); }
.footer-tagline { font-size: 0.82rem; color: var(--text3); margin-bottom: 18px; }

.footer-contact { list-style: none; padding: 0; }
.footer-contact li {
  font-size: 0.85rem;
  color: var(--text2);
  margin-bottom: 12px;
  display: flex;
  align-items: flex-start;
  gap: 10px;
}
.footer-contact li i { color: var(--red); margin-top: 2px; flex-shrink: 0; }

.footer-heading {
  font-family: 'Roboto', sans-serif;
  font-weight: 700;
  font-size: 0.78rem;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: var(--text3);
  margin-bottom: 18px;
}
.footer-link {
  font-size: 0.85rem;
  color: var(--text2);
  display: block;
  margin-bottom: 12px;
  text-decoration: none;
  transition: 0.2s;
}
.footer-link:hover { color: var(--red); transform: translateX(4px); display: block; }

.footer-social-btn {
  width: 40px; height: 40px;
  background: var(--surface);
  border-radius: 10px;
  display: flex; align-items: center; justify-content: center;
  color: var(--text2);
  text-decoration: none;
  font-size: 1rem;
  transition: 0.2s;
  border: 1px solid var(--border);
}
.footer-social-btn:hover { background: var(--red); border-color: var(--red); color: #fff; }
.footer-divider { border-color: var(--border); margin: 28px 0 20px; }
.footer-copy { font-size: 0.78rem; color: var(--text3); }

/* Footer glow bar */
.footer-glow-bar {
  height: 2px;
  background: linear-gradient(90deg, transparent, var(--red), var(--gold), var(--red), transparent);
  margin-bottom: 0;
  opacity: 0.6;
}

/* ============================================================
   TOAST
============================================================ */
.rs-toast {
  position: fixed;
  top: 80px; right: 20px;
  z-index: 9999;
  background: var(--surface2);
  border: 1px solid var(--border2);
  border-radius: 14px;
  padding: 14px 22px;
  box-shadow: var(--shadow-lg);
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 0.88rem;
  font-weight: 600;
  font-family: 'Roboto', sans-serif;
  color: var(--text);
  transform: translateX(130%);
  transition: 0.35s cubic-bezier(0.34, 1.56, 0.64, 1);
  min-width: 260px;
}
.rs-toast.show { transform: translateX(0); }
.rs-toast.success { border-left: 4px solid var(--green); }
.rs-toast.error   { border-left: 4px solid var(--red); }
.rs-toast.info    { border-left: 4px solid var(--blue); }

/* ============================================================
   BACK BUTTON
============================================================ */
.btn-back {
  background: transparent;
  border: 1.5px solid var(--border2);
  border-radius: 10px;
  padding: 8px 18px;
  font-family: 'Roboto', sans-serif;
  font-weight: 700;
  font-size: 0.82rem;
  color: var(--text2);
  cursor: pointer;
  transition: 0.2s;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  text-decoration: none;
}
.btn-back:hover { border-color: var(--red); color: var(--red); }

/* ============================================================
   PRIZE STYLES (shared)
============================================================ */
.hero-prize {
  border-radius: var(--radius-lg);
  background: linear-gradient(135deg, rgba(255,183,3,0.08), rgba(255,183,3,0.03));
  border: 1.5px solid rgba(255,183,3,0.25);
  padding: 28px;
  display: flex;
  align-items: center;
  gap: 24px;
  margin-bottom: 16px;
  position: relative;
  overflow: hidden;
}
.hero-prize::before {
  content: 'GRAND PRIZE';
  position: absolute;
  top: 16px; right: -28px;
  background: var(--gold);
  color: #1a0a00;
  font-size: 8px;
  font-weight: 700;
  padding: 5px 50px;
  transform: rotate(35deg);
  letter-spacing: 2px;
}
.hero-img-wrap { position: relative; flex-shrink: 0; }
.hero-img-wrap img {
  width: 110px; height: 110px;
  object-fit: contain;
  background: rgba(255,255,255,0.06);
  border-radius: 16px;
  padding: 10px;
  display: block;
}
.hero-medal-badge {
  position: absolute;
  top: -10px; left: -10px;
  width: 32px; height: 32px;
  border-radius: 50%;
  background: var(--gold);
  font-size: 0.9rem;
  display: flex; align-items: center; justify-content: center;
  border: 2px solid var(--bg);
}
.hero-info {}
.hero-pos { font-size: 0.68rem; font-weight: 700; color: var(--gold); letter-spacing: 1.5px; text-transform: uppercase; margin-bottom: 4px; }
.hero-name { font-family: 'Bebas Neue', sans-serif; font-size: 2rem; color: var(--text); line-height: 1; margin-bottom: 4px; }
.hero-val { font-size: 1rem; font-weight: 700; color: var(--gold); margin-bottom: 4px; }
.hero-desc { font-size: 0.8rem; color: var(--text3); }

.row-prizes { display: flex; gap: 12px; margin-bottom: 12px; flex-wrap: wrap; }
.row-prize {
  flex: 1 1 180px;
  border-radius: var(--radius);
  padding: 16px;
  display: flex;
  align-items: center;
  gap: 12px;
  border: 1.5px solid transparent;
  transition: 0.2s;
  background: var(--surface);
}
.row-prize:hover { transform: translateY(-4px); }
.rp-2 { border-color: rgba(61,158,255,0.3); }
.rp-3 { border-color: rgba(0,229,160,0.3); }
.rp-img { width: 66px; height: 66px; object-fit: contain; background: rgba(255,255,255,0.06); border-radius: 10px; padding: 6px; flex-shrink: 0; }
.rp-pos { font-size: 0.68rem; font-weight: 700; letter-spacing: 1px; text-transform: uppercase; margin-bottom: 3px; }
.rp-2 .rp-pos { color: var(--blue); }
.rp-3 .rp-pos { color: var(--green); }
.rp-name { font-size: 0.95rem; font-weight: 700; color: var(--text); }
.rp-val  { font-size: 0.8rem; color: var(--text3); margin-top: 2px; }

.cash-list { display: flex; flex-direction: column; gap: 8px; margin-bottom: 2.5rem; }
.cash-row {
  display: flex; align-items: center; gap: 12px;
  padding: 12px 16px;
  border-radius: 10px;
  background: var(--surface);
  border: 1px solid var(--border);
  transition: 0.2s;
}
.cash-row:hover { transform: translateX(6px); border-color: rgba(255,61,90,0.2); }
.cash-rank {
  width: 36px; height: 36px;
  border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  font-size: 0.72rem; font-weight: 700; flex-shrink: 0;
}
.cr-4 { background: rgba(155,92,255,0.15); color: var(--purple); }
.cr-5 { background: rgba(255,61,90,0.12); color: var(--red); }
.cr-6 { background: rgba(255,183,3,0.12); color: var(--gold); }
.cash-label { flex: 1; }
.cash-label strong { font-size: 0.88rem; color: var(--text); display: block; }
.cash-label span   { font-size: 0.72rem; color: var(--text3); }
.cash-bar-wrap { width: 80px; background: var(--surface2); border-radius: 4px; height: 5px; overflow: hidden; }
.cash-bar { height: 5px; border-radius: 4px; background: linear-gradient(90deg, var(--red), var(--gold)); }
.cash-amount { font-size: 0.95rem; font-weight: 700; color: var(--text); min-width: 75px; text-align: right; }

/* ============================================================
   WIZARD STEPS
============================================================ */
.wizard-bar { display: flex; align-items: center; margin-bottom: 32px; }
.wz-step { display: flex; align-items: center; gap: 0; flex: 1; flex-direction: column; }
.wz-circle {
  width: 40px; height: 40px;
  border-radius: 50%;
  border: 2px solid var(--border2);
  background: var(--surface);
  display: flex; align-items: center; justify-content: center;
  font-weight: 700;
  font-size: 0.9rem;
  color: var(--text3);
  transition: 0.3s;
  flex-shrink: 0;
}
.wz-step.active .wz-circle { background: var(--red); border-color: var(--red); color: #fff; box-shadow: 0 0 20px rgba(255,61,90,0.4); }
.wz-step.done .wz-circle { background: var(--green); border-color: var(--green); color: var(--bg); }
.wz-label { font-size: 0.75rem; font-weight: 700; color: var(--text3); white-space: nowrap; }
.wz-step.active .wz-label { color: var(--red); }
.wz-step.done .wz-label { color: var(--green); }
.wz-line { flex: 1; height: 2px; background: var(--border); margin: 0 10px; }
.wizard-pane { display: none; }
.wizard-pane.active { display: block; }

/* ============================================================
   PAYMENT
============================================================ */
.pay-method {
  border: 1.5px solid var(--border2);
  border-radius: var(--radius);
  padding: 14px 16px;
  cursor: pointer;
  transition: 0.2s;
  display: flex;
  align-items: center;
  gap: 12px;
  background: var(--surface);
  color: var(--text);
}
.pay-method:hover { border-color: var(--red); }
.pay-method.selected { border-color: var(--red); background: rgba(255,61,90,0.08); }

.fee-box {
  background: linear-gradient(135deg, rgba(255,61,90,0.1), rgba(255,61,90,0.05));
  border: 1.5px dashed rgba(255,61,90,0.4);
  border-radius: var(--radius);
  padding: 18px;
  text-align: center;
  margin-top: 12px;
}
.fee-box .fee-lbl { font-size: 0.68rem; font-weight: 700; letter-spacing: 1.5px; text-transform: uppercase; color: var(--red); margin-bottom: 4px; }
.fee-box .fee-amt { font-family: 'Bebas Neue', sans-serif; font-size: 2.5rem; color: var(--red); }


.powered-presented {
	background:rgba(255,255,255,0.04);border:1px solid var(--border);border-radius:10px;padding:12px 16px;margin-bottom:16px;height: 95px;
    min-width: 235px;
}

/* ============================================================
   RESPONSIVE
============================================================ */
@media(max-width: 768px) {
  .auth-card { padding: 24px 18px; }
  .wz-label { display: none; }
  .hero-prize { flex-direction: column; text-align: center; }
  .hero-img-wrap { margin: 0 auto; }
  .hero-prize::before { display: none; }
  .row-prizes { flex-direction: column; }
  .cash-bar-wrap { display: none; }
}

/* ============================================================
   USER PANEL — WEBSITE VIEW ADDITIONS
   Added below existing style.css — no sidebar, website feel
============================================================ */

/* Navbar: logged-in user avatar + dropdown */
.nav-user-pill {
  display: flex; align-items: center; gap: 8px;
  background: var(--surface); border: 1px solid var(--border2);
  border-radius: 50px; padding: 4px 14px 4px 4px;
  cursor: pointer; transition: all 0.18s; text-decoration: none;
  color: var(--text);
}
.nav-user-pill:hover, .nav-user-pill.show { border-color: var(--red); }
.nav-user-pill::after { display: none; }
.nav-user-avatar {
  width: 28px; height: 28px; border-radius: 50%;
  object-fit: cover; border: 2px solid var(--red);
}
.nav-user-name { font-size: 0.82rem; font-weight: 600; color: var(--text); }
.nav-user-pts { font-size: 0.65rem; color: var(--gold); font-weight: 700; display: block; line-height: 1; }
.nav-dropdown {
  background: var(--bg2) !important; border: 1px solid var(--border2) !important;
  border-radius: var(--radius) !important; padding: 8px !important;
  box-shadow: 0 12px 40px rgba(0,0,0,0.5) !important; min-width: 210px;
}
.nav-dropdown .dropdown-item {
  color: var(--text2); border-radius: 8px; padding: 9px 14px;
  font-size: 0.83rem; font-weight: 600;
  display: flex; align-items: center; gap: 10px;
  transition: all 0.15s; background: transparent;
}
.nav-dropdown .dropdown-item:hover { background: rgba(255,255,255,0.05); color: var(--text); }
.nav-dropdown .dropdown-item.logout { color: var(--red); }
.nav-dropdown .dropdown-item.logout:hover { background: rgba(255,61,90,0.08); }
.nav-dropdown .dd-divider { border-top: 1px solid var(--border); margin: 6px 0; }

/* ── USER HERO BAND ───────────────────────────────────── */
.user-hero-band {
  background: linear-gradient(180deg, rgba(255,61,90,0.07) 0%, transparent 100%);
  border-bottom: 1px solid var(--border);
  padding: 36px 0 0;
}
.uhb-inner {
  display: flex; align-items: center; gap: 20px;
  padding-bottom: 28px; flex-wrap: wrap;
}
.uhb-avatar {
  width: 72px; height: 72px; border-radius: 50%;
  object-fit: cover; border: 3px solid var(--red);
  box-shadow: 0 0 0 4px rgba(255,61,90,0.15);
  flex-shrink: 0;
}
.uhb-info { flex: 1; min-width: 0; }
.uhb-name {
  font-family: 'Bebas Neue', sans-serif; font-size: 1.8rem;
  color: var(--text); line-height: 1; letter-spacing: 0.5px;
}
.uhb-handle { font-size: 0.78rem; color: var(--text3); margin-top: 2px; }
.uhb-chips { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 8px; }
.uhb-chip {
  display: inline-flex; align-items: center; gap: 5px;
  background: var(--surface); border: 1px solid var(--border);
  border-radius: 50px; font-size: 0.68rem; font-weight: 700;
  padding: 4px 12px; color: var(--text2);
}
.uhb-chip.gold { background: rgba(255,183,3,0.1); color: var(--gold); border-color: rgba(255,183,3,0.25); }
.uhb-chip.red  { background: rgba(255,61,90,0.1);  color: var(--red);  border-color: rgba(255,61,90,0.25); }
.uhb-chip.green{ background: rgba(0,229,160,0.1);  color: var(--green);border-color: rgba(0,229,160,0.25); }
.uhb-action { flex-shrink: 0; }

/* ── USER NAV TABS ────────────────────────────────────── */
.user-nav-tabs {
  display: flex; gap: 0; overflow-x: auto;
  -ms-overflow-style: none; scrollbar-width: none;
  border-top: 1px solid var(--border);
}
.user-nav-tabs::-webkit-scrollbar { display: none; }
.unt-link {
  display: flex; align-items: center; gap: 7px;
  padding: 13px 18px; font-size: 0.82rem; font-weight: 600;
  color: var(--text3); border-bottom: 2px solid transparent;
  cursor: pointer; text-decoration: none; white-space: nowrap;
  transition: color 0.18s, border-color 0.18s; position: relative;
}
.unt-link i { font-size: 0.9rem; }
.unt-link:hover { color: var(--text); border-bottom-color: var(--border2); }
.unt-link.active { color: var(--red); border-bottom-color: var(--red); }
.unt-badge {
  background: var(--red); color: #fff; border-radius: 50px;
  font-size: 0.58rem; font-weight: 700; padding: 1px 6px;
  min-width: 16px; text-align: center; line-height: 1.4;
}
.unt-badge.gold { background: var(--gold); color: var(--dark); }

/* ── CONTENT AREA ─────────────────────────────────────── */
.user-content { padding: 40px 0 72px; background: var(--bg); }

/* Reuse panel cards without sidebar */
.panel-card {
  background: var(--surface); border: 1px solid var(--border);
  border-radius: var(--radius-lg); padding: 24px; margin-bottom: 20px;
}
.panel-card-header {
  display: flex; align-items: center; justify-content: space-between;
  margin-bottom: 20px; flex-wrap: wrap; gap: 8px;
}
.pch-title { font-weight: 700; font-size: 1rem; color: var(--text); }
.pch-link { font-size: 0.78rem; color: var(--red); text-decoration: none; font-weight: 600; }
.pch-link:hover { text-decoration: underline; }
.panel-page-header {
  display: flex; align-items: flex-start; justify-content: space-between;
  flex-wrap: wrap; gap: 12px; margin-bottom: 28px;
}
.pph-title { font-family: 'Bebas Neue', sans-serif; font-size: 2rem; color: var(--text); letter-spacing: 0.5px; line-height: 1; }
.pph-sub { font-size: 0.82rem; color: var(--text3); margin-top: 4px; }

/* Stat cards */
.stat-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px,1fr)); gap: 12px; margin-bottom: 28px; }
.stat-card { background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); padding: 20px; position: relative; overflow: hidden; transition: border-color 0.2s, transform 0.2s; }
.stat-card:hover { border-color: var(--border2); transform: translateY(-2px); }
.stat-card::before { content: ''; position: absolute; top: 0; left: 0; right: 0; height: 2px; }
.stat-card.red::before   { background: linear-gradient(90deg,var(--red),var(--gold)); }
.stat-card.gold::before  { background: linear-gradient(90deg,var(--gold),var(--green)); }
.stat-card.green::before { background: linear-gradient(90deg,var(--green),var(--blue)); }
.stat-card.blue::before  { background: linear-gradient(90deg,var(--blue),var(--purple)); }
.sc-icon  { font-size: 1.4rem; margin-bottom: 10px; }
.sc-val   { font-family: 'Bebas Neue',sans-serif; font-size: 2rem; color: var(--text); line-height: 1; }
.sc-label { font-size: 0.72rem; color: var(--text3); font-weight: 700; text-transform: uppercase; letter-spacing: 0.5px; margin-top: 4px; }
.sc-change { font-size: 0.72rem; margin-top: 6px; }
.sc-change.up   { color: var(--green); }
.sc-change.down { color: var(--red); }

/* Competition entry card (dashboard list) */
.comp-entry-card { display: flex; align-items: center; gap: 14px; padding: 14px; background: var(--bg2); border: 1px solid var(--border); border-radius: var(--radius); margin-bottom: 10px; transition: all 0.18s; text-decoration: none; color: inherit; }
.comp-entry-card:hover { border-color: var(--border2); background: rgba(255,255,255,0.02); }
.cec-thumb { width: 52px; height: 52px; border-radius: 10px; object-fit: cover; flex-shrink: 0; }
.cec-body { flex: 1; min-width: 0; }
.cec-name { font-weight: 700; font-size: 0.9rem; color: var(--text); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cec-meta { font-size: 0.73rem; color: var(--text3); margin-top: 2px; }
.cec-status { display: inline-flex; align-items: center; gap: 4px; font-size: 0.68rem; font-weight: 700; padding: 3px 10px; border-radius: 50px; text-transform: uppercase; letter-spacing: 0.5px; flex-shrink: 0; }
.status-active    { background: rgba(0,229,160,0.12);   color: var(--green); border: 1px solid rgba(0,229,160,0.3); }
.status-pending   { background: rgba(255,183,3,0.12);   color: var(--gold);  border: 1px solid rgba(255,183,3,0.3); }
.status-won       { background: rgba(255,183,3,0.15);   color: var(--gold);  border: 1px solid rgba(255,183,3,0.35); }
.status-completed { background: rgba(61,158,255,0.1);   color: var(--blue);  border: 1px solid rgba(61,158,255,0.25); }

/* Transactions */
.txn-table { width: 100%; border-collapse: collapse; }
.txn-table th { font-size: 0.68rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.5px; color: var(--text3); padding: 8px 12px; border-bottom: 1px solid var(--border); text-align: left; }
.txn-table td { padding: 12px; border-bottom: 1px solid var(--border); font-size: 0.85rem; color: var(--text2); vertical-align: middle; }
.txn-table tr:last-child td { border-bottom: none; }
.txn-id { font-size: 0.72rem; color: var(--text3); margin-top: 2px; }
.txn-amount { font-weight: 700; font-size: 0.9rem; }
.txn-amount.credit { color: var(--green); }
.txn-amount.debit  { color: var(--red); }
.txn-badge { display: inline-flex; align-items: center; gap: 4px; font-size: 0.68rem; font-weight: 700; padding: 2px 8px; border-radius: 50px; text-transform: uppercase; }
.txn-success { background: rgba(0,229,160,0.1); color: var(--green); }
.txn-pending { background: rgba(255,183,3,0.1);  color: var(--gold); }
.txn-failed  { background: rgba(255,61,90,0.1);  color: var(--red); }

/* Points */
.points-hero { background: linear-gradient(135deg,rgba(255,183,3,0.12),rgba(255,61,90,0.08)); border: 1px solid rgba(255,183,3,0.25); border-radius: var(--radius-lg); padding: 32px; text-align: center; margin-bottom: 24px; position: relative; overflow: hidden; }
.points-hero::before { content:'🏆'; position:absolute; font-size:10rem; opacity:0.04; top:-20px; right:-20px; line-height:1; }
.ph-coins { font-family:'Bebas Neue',sans-serif; font-size:4rem; color:var(--gold); line-height:1; text-shadow:0 0 40px rgba(255,183,3,0.4); }
.ph-label { font-size:0.8rem; color:var(--text3); font-weight:700; text-transform:uppercase; letter-spacing:1px; margin-top:4px; }
.ph-value { font-size:1rem; color:var(--text2); margin-top:8px; }
.points-log-item { display:flex; align-items:center; gap:12px; padding:12px 0; border-bottom:1px solid var(--border); }
.points-log-item:last-child { border-bottom:none; }
.pli-icon { width:36px; height:36px; border-radius:10px; display:flex; align-items:center; justify-content:center; font-size:1rem; flex-shrink:0; }
.pli-earn  { background:rgba(0,229,160,0.12); color:var(--green); }
.pli-spend { background:rgba(255,61,90,0.12);  color:var(--red); }
.pli-body { flex:1; }
.pli-desc { font-size:0.85rem; color:var(--text); font-weight:600; }
.pli-date { font-size:0.72rem; color:var(--text3); margin-top:2px; }
.pli-pts { font-weight:700; font-size:0.95rem; }
.pli-pts.earn  { color:var(--green); }
.pli-pts.spend { color:var(--red); }

/* Buttons */
.btn-panel { display:inline-flex; align-items:center; gap:8px; padding:10px 22px; border-radius:var(--radius); font-size:0.85rem; font-weight:700; cursor:pointer; transition:all 0.18s; border:none; font-family:'Roboto',sans-serif; text-decoration:none; }
.btn-panel-primary { background:var(--red); color:#fff; }
.btn-panel-primary:hover { background:var(--red-dark); transform:translateY(-1px); }
.btn-panel-ghost { background:transparent; border:1px solid var(--border2); color:var(--text2); }
.btn-panel-ghost:hover { border-color:var(--red); color:var(--red); }

/* Form fields */
.form-field label { font-size:0.77rem; font-weight:700; color:var(--text2); text-transform:uppercase; letter-spacing:0.4px; margin-bottom:6px; display:block; }
.form-field input, .form-field select, .form-field textarea { width:100%; background:var(--bg2); border:1px solid var(--border2); border-radius:var(--radius); color:var(--text); padding:11px 14px; font-size:0.87rem; font-family:'Roboto',sans-serif; transition:border-color 0.2s,box-shadow 0.2s; outline:none; }
.form-field input:focus, .form-field select:focus, .form-field textarea:focus { border-color:var(--red); box-shadow:0 0 0 3px rgba(255,61,90,0.12); }
.form-field input::placeholder, .form-field textarea::placeholder { color:var(--text3); }
.form-field select option { background:var(--bg2); }
.profile-form-section { margin-bottom:28px; }
.pfs-title { font-size:0.8rem; font-weight:700; text-transform:uppercase; letter-spacing:0.5px; color:var(--text3); margin-bottom:14px; border-bottom:1px solid var(--border); padding-bottom:8px; }
.avatar-upload-area { display:flex; align-items:center; gap:20px; margin-bottom:24px; flex-wrap:wrap; }
.aua-preview { width:80px; height:80px; border-radius:50%; object-fit:cover; border:3px solid var(--red); }
.aua-actions { display:flex; flex-direction:column; gap:8px; }

/* Referral */
.referral-code-box { background:var(--bg2); border:1px dashed rgba(255,183,3,0.4); border-radius:var(--radius); padding:20px 24px; display:flex; align-items:center; justify-content:space-between; gap:16px; margin-bottom:20px; flex-wrap:wrap; }
.rcb-code { font-family:'Bebas Neue',sans-serif; font-size:2.2rem; color:var(--gold); letter-spacing:4px; }
.rcb-label { font-size:0.72rem; color:var(--text3); font-weight:700; text-transform:uppercase; }
.share-btn-sm { display:inline-flex; align-items:center; gap:8px; padding:9px 18px; border-radius:var(--radius); font-size:0.82rem; font-weight:700; border:1px solid var(--border2); background:var(--surface); color:var(--text2); cursor:pointer; transition:all 0.18s; text-decoration:none; }
.share-btn-sm:hover { border-color:var(--red); color:var(--red); }
.share-btn-sm.wa { border-color:rgba(37,211,102,0.4); color:#25d366; background:rgba(37,211,102,0.05); }
.share-btn-sm.wa:hover { background:rgba(37,211,102,0.12); }

/* Filter tabs (competitions) */
.filter-tabs { display:flex; gap:6px; flex-wrap:wrap; margin-bottom:20px; }
.ftab { padding:7px 18px; border-radius:50px; font-size:0.78rem; font-weight:700; border:1px solid var(--border2); background:var(--surface); color:var(--text2); cursor:pointer; transition:all 0.18s; }
.ftab.active,.ftab:hover { background:var(--red); color:#fff; border-color:var(--red); }

/* Comp cards */
.comp-detail-card { background:var(--surface); border:1px solid var(--border); border-radius:var(--radius-lg); overflow:hidden; transition:border-color 0.2s,transform 0.18s; height:100%; }
.comp-detail-card:hover { border-color:var(--border2); transform:translateY(-3px); }
.cdc-img { width:100%; height:160px; object-fit:cover; }
.cdc-body { padding:18px 20px; }
.cdc-name { font-weight:700; font-size:1rem; color:var(--text); margin-bottom:4px; }
.cdc-meta { font-size:0.75rem; color:var(--text3); margin-bottom:12px; }
.cdc-progress-label { display:flex; justify-content:space-between; font-size:0.72rem; color:var(--text3); margin-bottom:6px; }
.cdc-progress { height:6px; background:var(--surface2); border-radius:50px; margin-bottom:14px; overflow:hidden; }
.cdc-progress-fill { height:100%; border-radius:50px; background:linear-gradient(90deg,var(--red),var(--gold)); }
.cdc-actions { display:flex; gap:8px; flex-wrap:wrap; }
.cdc-rank-badge { display:inline-flex; align-items:center; gap:6px; padding:6px 14px; border-radius:50px; font-size:0.75rem; font-weight:700; background:rgba(255,183,3,0.12); color:var(--gold); border:1px solid rgba(255,183,3,0.3); }

/* Invoice modal */
.invoice-modal-bg { position:fixed; inset:0; background:rgba(0,0,0,0.75); backdrop-filter:blur(8px); z-index:9999; display:flex; align-items:center; justify-content:center; padding:20px; opacity:0; visibility:hidden; transition:all 0.25s; }
.invoice-modal-bg.open { opacity:1; visibility:visible; }
.invoice-card { background:var(--bg2); border:1px solid var(--border2); border-radius:var(--radius-lg); padding:36px; max-width:520px; width:100%; }
.inv-header { display:flex; justify-content:space-between; align-items:flex-start; margin-bottom:28px; }
.inv-brand { font-family:'Bebas Neue',sans-serif; font-size:1.6rem; color:var(--text); }
.inv-brand span { color:var(--red); }
.inv-badge { font-size:0.65rem; font-weight:700; padding:3px 10px; border-radius:50px; background:rgba(0,229,160,0.12); color:var(--green); border:1px solid rgba(0,229,160,0.25); }
.inv-meta-row { display:flex; justify-content:space-between; margin-bottom:6px; font-size:0.82rem; }
.inv-meta-row .label { color:var(--text3); }
.inv-meta-row .val { color:var(--text); font-weight:600; }
.inv-divider { border:none; border-top:1px solid var(--border); margin:16px 0; }
.inv-line-item { display:flex; justify-content:space-between; padding:8px 0; font-size:0.85rem; border-bottom:1px solid var(--border); }
.inv-line-item:last-of-type { border-bottom:none; }
.inv-total { display:flex; justify-content:space-between; font-weight:700; font-size:1rem; color:var(--text); margin-top:8px; padding-top:8px; border-top:2px solid var(--border2); }
.inv-footer { text-align:center; font-size:0.72rem; color:var(--text3); margin-top:20px; line-height:1.7; }

/* Password strength */
.strength-bar { display:flex; gap:4px; margin-top:8px; }
.sb-seg { height:4px; flex:1; border-radius:2px; background:var(--surface2); transition:background 0.3s; }
.strength-label { font-size:0.72rem; color:var(--text3); margin-top:4px; }

/* Points extras */
.how-earn-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(180px,1fr)); gap:14px; margin-bottom:24px; }
.he-card { background:var(--surface); border:1px solid var(--border); border-radius:var(--radius); padding:18px; text-align:center; transition:border-color 0.2s; }
.he-card:hover { border-color:var(--border2); }
.he-icon { font-size:1.8rem; margin-bottom:8px; }
.he-pts { font-family:'Bebas Neue',sans-serif; font-size:1.6rem; color:var(--gold); }
.he-desc { font-size:0.74rem; color:var(--text3); margin-top:4px; line-height:1.4; }
.redeem-card { background:var(--surface); border:1px solid var(--border); border-radius:var(--radius); padding:18px; display:flex; align-items:center; gap:14px; margin-bottom:10px; cursor:pointer; transition:all 0.18s; }
.redeem-card:hover { border-color:var(--gold); background:rgba(255,183,3,0.04); }
.rc-reward-icon { width:44px; height:44px; border-radius:12px; background:rgba(255,183,3,0.12); display:flex; align-items:center; justify-content:center; font-size:1.3rem; }
.rc-reward-body { flex:1; }
.rc-reward-name { font-weight:700; font-size:0.9rem; color:var(--text); }
.rc-reward-desc { font-size:0.72rem; color:var(--text3); margin-top:2px; }
.rc-reward-pts { font-family:'Bebas Neue',sans-serif; font-size:1.4rem; color:var(--gold); }
.rc-reward-pts small { font-family:'Roboto',sans-serif; font-size:0.65rem; color:var(--text3); display:block; }

/* Referral extras */
.referral-hero { background:linear-gradient(135deg,rgba(155,92,255,0.15),rgba(255,61,90,0.08)); border:1px solid rgba(155,92,255,0.25); border-radius:var(--radius-lg); padding:36px 32px; margin-bottom:28px; position:relative; overflow:hidden; text-align:center; }
.referral-hero::before { content:'👥'; position:absolute; font-size:12rem; opacity:0.04; top:-30px; right:-40px; line-height:1; }
.rh-title { font-family:'Bebas Neue',sans-serif; font-size:2.5rem; color:var(--text); margin-bottom:8px; letter-spacing:0.5px; }
.rh-sub { font-size:0.9rem; color:var(--text2); line-height:1.75; max-width:500px; margin:0 auto 24px; }
.how-it-works { display:grid; grid-template-columns:repeat(auto-fill,minmax(160px,1fr)); gap:14px; margin-bottom:24px; }
.hiw-card { background:var(--surface); border:1px solid var(--border); border-radius:var(--radius); padding:20px 16px; text-align:center; }
.hiw-num { width:32px; height:32px; border-radius:50%; background:linear-gradient(135deg,var(--red),var(--gold)); color:#fff; font-weight:700; font-size:0.9rem; display:flex; align-items:center; justify-content:center; margin:0 auto 10px; }
.hiw-label { font-weight:700; font-size:0.85rem; color:var(--text); margin-bottom:4px; }
.hiw-desc { font-size:0.74rem; color:var(--text3); line-height:1.5; }
.referral-friend-card { display:flex; align-items:center; gap:12px; padding:12px 16px; background:var(--bg2); border:1px solid var(--border); border-radius:var(--radius); margin-bottom:8px; }
.rfc-avatar { width:36px; height:36px; border-radius:50%; object-fit:cover; }
.rfc-body { flex:1; }
.rfc-name { font-weight:700; font-size:0.85rem; color:var(--text); }
.rfc-joined { font-size:0.7rem; color:var(--text3); }
.rfc-earned { font-weight:700; color:var(--green); font-size:0.85rem; }
.leaderboard-row { display:flex; align-items:center; gap:12px; padding:12px 16px; border-bottom:1px solid var(--border); }
.leaderboard-row:last-child { border-bottom:none; }
.lb-rank { font-family:'Bebas Neue',sans-serif; font-size:1.3rem; width:28px; text-align:center; }
.lb-rank.gold   { color:var(--gold); }
.lb-rank.silver { color:#aaa; }
.lb-rank.bronze { color:#cd7f32; }

/* Toast */
.rs-toast { position:fixed; right:24px; background:var(--surface2); border:1px solid var(--border2); border-radius:var(--radius); padding:14px 20px; display:flex; align-items:center; gap:10px; font-size:0.85rem; color:var(--text); font-weight:600; z-index:99999; transform:translateY(20px); opacity:0; transition:all 0.3s; pointer-events:none; box-shadow:0 8px 30px rgba(0,0,0,0.4); }
.rs-toast.show { transform:translateY(0); opacity:1; }

li.nav-item {
    padding: 8px 16px !important;
}
.rs-nav-link:hover, .rs-nav-link.active {
    background: none;
}
.rs-nav-link {
    padding: 0 !important; 
}
nav.rs-navbar.navbar.navbar-expand-lg.scrolled {
    position: fixed;
    width: 100%;
}

.user-nav-tabs {
    justify-content: center;
}


.dropdown-menu-end[data-bs-popper] {
    right: 0;
    left: 0;
}
.nav-dropdown {
    padding: 0px !important;
    min-width: 120px;
}

/* .navbar-brand-text { */
/*     background: #ffffff; */
/*     padding: 5px; */
/*     border-radius: 10px; */
/* } */
.rs-nav-link {
    color: var(--white) !important;
}
.rs-nav-link:hover, .rs-nav-link.active {
    color: var(--red) !important;
}


#goog-gt-tt,.goog-logo-link,.goog-te-balloon-frame,.goog-te-banner-frame,.goog-te-gadget span,.gskiptranslate,.swiper-pagination-lock,body>.skiptranslate,div#goog-gt- {
    display: none!important
}

.goog-te-gadget {
    font-family: arial;
    font-size: 7px!important;
    white-space: nowrap;
    color: transparent!important
}

.goog-text-highlight {
    background: 0 0!important;
    box-shadow: none!important
}

.goog-te-gadget .goog-te-combo {
    margin: 4px 0;
    padding: 5px 30px 5px 10px;
    line-height: 20px;
    color: #000;
    font-size: 13px;
    border-radius: 4px;
    height: 30px
}
/* ── RESPONSIVE ─────────────────────────────────────────── */
@media(max-width:992px) {
  .user-nav-tabs {
    justify-content: flex-start;
  }
}

@media(max-width:768px) {
  .uhb-avatar { width:54px; height:54px; }
  .uhb-name { font-size:1.4rem; }
  .uhb-chips { gap:5px; }
  .uhb-action { display:none; }
  .unt-link { padding:11px 12px; font-size:0.78rem; }
  .stat-cards { grid-template-columns:repeat(2,1fr) !important; gap:10px; }
  .pph-title { font-size:1.6rem; }
  .panel-page-header { flex-direction:column; align-items:flex-start; }
  .txn-table th:nth-child(2),.txn-table td:nth-child(2) { display:none; }
  .user-content { padding:24px 0 48px; }
}
@media(max-width:480px) {
  /* .uhb-chips { display:none; } */
  /* .unt-link .tab-txt { display:none; } */
  .unt-link { padding:11px 14px; font-size:1rem; }
  .referral-hero { padding:24px 16px; }
  .rh-title { font-size:1.8rem; }
}

:lang(ta) h1.hero-title, :lang(ta) .tagline-main, :lang(ta) .section-title {
    font-size: 50px;
    line-height: 1.2;
}

@media (max-width:767px) {
    :lang(ta) h1.hero-title, :lang(ta) h1.hero-title, :lang(ta) .tagline-main, :lang(ta) .section-title {
        font-size: 30px;
    }
}
.footer-tagline {
    text-align: justify;
}
.footer-copy {
    font-size: .9rem;
}
.upload-card-title {
    letter-spacing: 1px !important;
}


.nav-user-name {
	text-transform: capitalize;
}