/* Jayplus: midnight navy, forest green and mint.
 * Legacy selectors remain for compatibility with the existing templates.
 * Important declarations override the original theme's important palette.
 */
:root {
  --jay-bg: #0b111e;
  --jay-surface: #142a29;
  --jay-raised: #1a202c;
  --jay-green: #4cc77b;
  --jay-mint: #afe5c2;
  --jay-text: #f3f7f5;
  --jay-muted: #b4c5bf;
  --jay-border: rgba(76, 199, 123, .3);
  --jay-gradient: linear-gradient(110deg, #4cc77b, #afe5c2);
  --bg: var(--jay-bg);
  --gold: var(--jay-mint);
  --red: var(--jay-green);
  --red-dark: #1c4938;
  --text: var(--jay-text);
  --muted: var(--jay-muted);
}

body {
  background: radial-gradient(ellipse at top, #193732, transparent 65%), #0d1820 !important;
  color: var(--jay-text) !important;
}
.site-v2 {
  --modern-bg: var(--jay-bg);
  --modern-surface: var(--jay-surface);
  --modern-surface-strong: #1c3d32;
  --modern-border: var(--jay-border);
  --modern-text: var(--jay-text);
  --modern-muted: var(--jay-muted);
  --modern-brand: var(--jay-green);
  --modern-accent: var(--jay-mint);
  --modern-cool: var(--jay-mint);
  background: var(--jay-bg) !important;
  color: var(--jay-text) !important;
}
.header-v2 {
  background: rgba(2, 9, 8, .96) !important;
  border-bottom-color: var(--jay-border) !important;
}
.hero-v2 {
  background: linear-gradient(115deg, #1c4033, #101e25 70%, #0b111e) !important;
  border-color: var(--jay-border) !important;
}
.hero-v2::before {
  background: radial-gradient(ellipse at top left, rgba(76, 199, 123, .18), transparent 70%) !important;
}
.trust-v2, .games-v2, .faq-v2 {
  background: var(--jay-bg) !important;
  border-color: var(--jay-border) !important;
}
.process-v2, .content-v2 {
  background: transparent !important;
  border-color: transparent !important;
}
.footer-v2 {
  background: linear-gradient(180deg, #142a29, #0b111e) !important;
  border-color: var(--jay-border) !important;
}
.footer-v2 .border-t { border-color: var(--jay-border) !important; }

#page .hero-v2__title, #trust-title,
.section-v2__heading h2, .process-v2 h2, .faq-v2 h2 {
  background: none !important;
  color: var(--jay-text) !important;
  -webkit-text-fill-color: var(--jay-text) !important;
  text-shadow: none !important;
}
.seo-longform-v2__article h2.herder-text {
  border-left-color: var(--jay-green) !important;
  background: linear-gradient(90deg, #1c4938, #142a29) !important;
  color: var(--jay-text) !important;
  -webkit-text-fill-color: var(--jay-text) !important;
}
.feature-card-v2 h3, .game-card-v2 h3,
.post-card-v2 h3, .step-list-v2 h3,
.faq-list-v2 summary, .seo-longform-v2__article h3 {
  color: var(--jay-mint) !important;
}
.hero-v2__lead, .section-v2__heading p,
.process-v2 p, .faq-v2 p, .feature-card-v2 p,
.game-card-v2 p, .post-card-v2 p, .step-list-v2 p,
.seo-longform-v2__article p, .seo-longform-v2__article li {
  color: var(--jay-muted) !important;
}
.nav-v2__links a { 
  color: var(--jay-text) !important; 
  background: rgba(76, 199, 123, .1) !important;
  border-color: var(--jay-border) !important;
}
.site-v2 a:hover, .link-v2 { color: var(--jay-mint) !important; }
.nav-v2__links a:hover {
  background: rgba(76, 199, 123, .1) !important;
  border-color: var(--jay-border) !important;
}

#page .btn-v2--primary, #page .bg-gold-red, #btn_top {
  background: var(--jay-gradient) !important;
  color: #06160e !important;
  border-color: var(--jay-green) !important;
  box-shadow: 0 5px 20px rgba(76, 199, 123, .18) !important;
}
#page .btn-v2--primary:hover, #page .bg-gold-red:hover, #btn_top:hover {
  background: linear-gradient(110deg, #67d790, #c4efd2) !important;
  color: #06160e !important;
}
#page .btn-v2--ghost,
.hero-v2__copy a[href="https://login.xpz.app"] {
  background: var(--jay-bg) !important;
  border-color: var(--jay-green) !important;
  color: var(--jay-green) !important;
  box-shadow: 0 4px 12px rgba(0, 0, 0, .22) !important;
}
.hero-v2__copy a[href="https://line.xpz.app"] {
  background: #1c4938 !important;
  border-color: var(--jay-green) !important;
  color: var(--jay-text) !important;
}
#page .btn-v2--ghost:hover {
  background: #142a29 !important;
  color: var(--jay-mint) !important;
}
.nav-v2__toggle, .nav-v2__toggle:hover, .nav-v2__toggle:focus {
  background: var(--jay-surface) !important;
  border-color: var(--jay-border) !important;
  box-shadow: none !important;
}
.nav-v2__toggle-icon span {
  background: var(--jay-green) !important;
  box-shadow: none !important;
}

.feature-card-v2, .game-grid-v2 > article,
.step-list-v2 li, .post-card-v2,
.faq-list-v2 details, .empty-v2,
.post-swiper .post-card-v2 {
  background: linear-gradient(135deg, #1c3d32, #14232a) !important;
  border-color: var(--jay-border) !important;
  box-shadow: 0 12px 28px rgba(0, 0, 0, .2) !important;
}
.feature-card-v2:hover, .game-grid-v2 > article:hover,
.post-card-v2:hover, .faq-list-v2 details[open],
.post-swiper .swiper-slide-active, .post-swiper .swiper-slide:hover {
  background: #1c3d32 !important;
  border-color: var(--jay-green) !important;
  box-shadow: 0 0 22px rgba(76, 199, 123, .12) !important;
}
.step-list-v2 span, .feature-card-v2__icon, .step-list-v2__number {
  background: rgba(76, 199, 123, .14) !important;
  color: var(--jay-mint) !important;
}
.game-grid-v2 > article span {
  border-color: var(--jay-mint) !important;
  color: var(--jay-text) !important;
}
.hero-v2__frame {
  box-shadow: 18px 20px 0 rgba(76, 199, 123, .06) !important;
}
.post-slider-v2__button {
  background: var(--jay-surface) !important;
  border-color: var(--jay-border) !important;
  color: var(--jay-mint) !important;
}
.post-slider-v2__button:hover, .post-slider-v2__button:focus {
  background: #1c4938 !important;
  border-color: var(--jay-green) !important;
}
.mobile-bottom-nav {
  background: linear-gradient(180deg, #142a29, #0b111e) !important;
  border-top-color: var(--jay-green) !important;
  box-shadow: 0 -2px 10px rgba(76, 199, 123, .2) !important;
}
.mobile-bottom-nav a, .mobile-bottom-nav__link,
.mobile-bottom-nav__list li {
  background: transparent !important;
  color: var(--jay-text) !important;
}
.mobile-bottom-nav__link:hover, .mobile-bottom-nav__link:focus {
  background: rgba(76, 199, 123, .14) !important;
  color: var(--jay-mint) !important;
}
.site-v2 :is(a, button, input, textarea, select):focus-visible {
  outline: 2px solid var(--jay-mint);
  outline-offset: 3px;
}
::selection { background: #4cc77b; color: #06160e; }
