/* NEO PAYMENT GATEWAY — TOKO DEMO (DigiStore) bahasa visual SITUNEO (24 Okt 2026). Dimuat SESUDAH gaya lama halaman demo.
 * Memetakan peubah warna lama (tema gelap ungu/pink) ke token terang hangat + tema gelap pilihan. Hanya tampilan; logika toko demo tidak disentuh. */
:root{
  --bg-dark:var(--bg);--bg-card:var(--card);--bg-card-hover:var(--bg2);--bg-input:var(--bg);
  --accent:var(--neo);--accent-light:var(--neo);--accent-glow:rgba(10,110,101,.14);
  --success:var(--ok);--success-glow:rgba(31,122,77,.14);--warning:var(--warn);--warning-glow:rgba(201,162,39,.2);--error:var(--bad);
  --game:var(--neo);--game-glow:rgba(10,110,101,.14);
  --text:var(--ink);--text-secondary:var(--muted);--text-muted:var(--muted);
  --border:var(--line);--border-hover:var(--line2);
  --gradient-primary:linear-gradient(var(--navy),var(--navy));--gradient-game:linear-gradient(var(--navy),var(--navy));--gradient-success:linear-gradient(var(--ok),var(--ok));
}
body.nd{background:var(--bg);color:var(--ink);font-size:1.0625rem;line-height:1.7}
body.nd h1,body.nd h2,body.nd h3,body.nd h4{font-family:var(--f-judul)}
body.nd header{background:var(--bg);backdrop-filter:none;-webkit-backdrop-filter:none;border-bottom:1px solid var(--line)}
body.nd .logo-icon{background:var(--navy);box-shadow:none}
body.nd .logo-text{color:var(--ink);background:none;-webkit-text-fill-color:currentColor}
body.nd .nav-link{color:var(--muted)}body.nd .nav-link:hover{color:var(--ink);background:var(--bg2)}
body.nd .nav-btn,body.nd .btn{background:var(--navy);color:var(--on-navy);border:2px solid var(--navy);box-shadow:0 3px 0 rgba(11,23,54,.28);border-radius:12px}
body.nd .nav-btn:hover,body.nd .btn:hover{transform:translateY(-2px);box-shadow:0 5px 0 rgba(11,23,54,.28);background:var(--navy)}
body.nd .btn:active{transform:translateY(2px);box-shadow:0 1px 0 rgba(11,23,54,.28)}
html[data-tema="gelap"] body.nd .nav-btn,html[data-tema="gelap"] body.nd .btn{background:var(--gold);color:var(--on-gold);border-color:var(--gold)}
body.nd .btn-outline{background:transparent;color:var(--ink);border:2px solid var(--ink);box-shadow:none}
body.nd .back-btn{background:var(--card);color:var(--ink);border:1px solid var(--line2)}
body.nd .demo-indicator{background:var(--warn-bg);color:var(--warn);border:1px solid var(--line2);border-radius:999px}
body.nd .demo-indicator-dot,body.nd .demo-badge-dot{background:var(--gold);box-shadow:none;animation:none}
body.nd .demo-banner{background:var(--navy);color:var(--on-navy);border:0}body.nd .demo-banner::before{display:none}
body.nd .demo-banner *{color:var(--on-navy)}body.nd .demo-badge{background:rgba(244,239,227,.12);border:1px solid rgba(244,239,227,.3);color:var(--on-navy)}
body.nd .demo-text a{color:#F2D56B;text-decoration:underline}
body.nd .hero{background:var(--bg);padding-top:56px}body.nd .hero::before{display:none}
body.nd .hero-badge{background:var(--card);border:1px solid var(--line2);color:var(--neo)}
body.nd .hero-title{color:var(--ink);letter-spacing:-.02em}
body.nd .hero-title span{background:none;-webkit-background-clip:border-box;background-clip:border-box;-webkit-text-fill-color:currentColor;color:var(--neo);box-shadow:inset 0 -.2em 0 var(--gold)}
body.nd .hero-desc{color:var(--muted)}
body.nd .hero-stat-value{color:var(--ink);background:none;-webkit-text-fill-color:currentColor}
body.nd .section-title,body.nd .section-header h2{color:var(--ink)}body.nd .section-subtitle{color:var(--muted)}
body.nd .section-title-icon{background:var(--navy);color:var(--gold)}
body.nd .product-card{background:var(--card);border:1px solid var(--line);box-shadow:var(--shadow)}
body.nd .product-card::before{display:none}
body.nd .product-card:hover{border-color:var(--gold);transform:translateY(-3px)}
body.nd .product-icon,body.nd .product-card.game .product-icon{background:var(--navy);color:var(--gold);box-shadow:none}
body.nd .product-badge,body.nd .product-badge.topup{background:var(--warn-bg);color:var(--warn);border:1px solid var(--line2)}
body.nd .product-name{color:var(--ink)}body.nd .product-desc{color:var(--muted)}
body.nd .product-price,body.nd .product-price.manual{color:var(--ink);background:none;-webkit-text-fill-color:currentColor}
body.nd .modal-overlay{background:rgba(11,23,54,.62);backdrop-filter:none}
body.nd .modal{background:var(--card);border:1px solid var(--line2);color:var(--ink)}
body.nd .modal-header{border-bottom:1px solid var(--line)}body.nd .modal-title{color:var(--ink)}
body.nd .form-input,body.nd .amount-input{background:var(--bg);color:var(--ink);border:1.5px solid var(--line2)}
body.nd .form-input:focus{border-color:var(--neo);box-shadow:0 0 0 3px rgba(10,110,101,.22)}
body.nd .payment-option{background:var(--bg);border:1.5px solid var(--line2)}
body.nd .payment-option.active{border-color:var(--gold);background:var(--warn-bg)}
body.nd .bank-info-box,body.nd .order-summary,body.nd .payment-breakdown,body.nd .invoice-box{background:var(--bg);border:1px solid var(--line)}
body.nd .warning-box{background:var(--warn-bg);border:1px solid var(--line2)}
body.nd .qr-box{background:#fff}
body.nd footer{background:var(--navy);color:var(--navy-mute);border-top:0}
body.nd footer *{color:var(--navy-mute)}body.nd footer a:hover{color:#fff}
body.nd .toast{background:var(--card);color:var(--ink);border:1px solid var(--line2)}
body.nd .nd-tema{margin-left:8px}
/* Bagian-bagian ber-gaya sebaris: gradasi/warna-warni -> kartu terang bergaris tipis (hanya tampilan) */
body.nd [style*="linear-gradient"]{background:var(--card)!important;border-color:var(--line2)!important;box-shadow:none!important}
body.nd [style*="rgba(255, 255, 255"],body.nd [style*="rgba(255,255,255"]{border-color:var(--line)!important}
body.nd [style*="rgba(15, 23, 42"],body.nd [style*="rgba(0, 0, 0"],body.nd [style*="rgba(0,0,0"],body.nd [style*="rgba(19, 19, 26"],body.nd [style*="rgba(26, 26, 35"]{background:var(--bg)!important}
body.nd .container [style*="color: white"],body.nd .container [style*="color:white"],body.nd .container [style*="color: #fff"],body.nd .container [style*="color:#fff"]{color:var(--ink)!important}
body.nd .container [style*="color: #9ca3af"],body.nd .container [style*="color:#9ca3af"],body.nd .container [style*="color: #94a3b8"],body.nd .container [style*="color:#94a3b8"],body.nd .container [style*="color: var(--text-secondary)"]{color:var(--muted)!important}
body.nd .container [style*="color: #6ee7b7"],body.nd .container [style*="color: #34d399"],body.nd .container [style*="color: #10b981"],body.nd .container [style*="color:#10b981"]{color:var(--ok)!important}
body.nd .container [style*="color: #f87171"],body.nd .container [style*="color: #ef4444"],body.nd .container [style*="color:#ef4444"]{color:var(--bad)!important}
body.nd .container [style*="color: #fbbf24"],body.nd .container [style*="color: #f59e0b"],body.nd .container [style*="color:#f59e0b"],body.nd .container [style*="color: #fcd34d"]{color:var(--warn)!important}
body.nd .container [style*="color: #818cf8"],body.nd .container [style*="color: #a5b4fc"],body.nd .container [style*="color: #c4b5fd"],body.nd .container [style*="color: #a78bfa"],body.nd .container [style*="color: #f472b6"],body.nd .container [style*="color: #f9a8d4"],body.nd .container [style*="color: #6366f1"],body.nd .container [style*="color: #ec4899"]{color:var(--neo)!important}
body.nd .container [style*="background: #fff"],body.nd .container [style*="background:#fff"]{background:var(--card)!important}
/* Foto suasana di hero */
.nd-hero-grid{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:48px;align-items:center;text-align:left}
.nd-hero-grid .hero-content{text-align:left;margin:0}
.nd-hero-foto .np-foto{box-shadow:var(--shadow)}
@media (max-width:900px){.nd-hero-grid{grid-template-columns:1fr}}
/* Tanpa pastel warna-warni: kotak bertinta -> netral krem/putih bergaris tipis */
body.nd .container div[style*="background: rgba("],body.nd .container div[style*="background:rgba("]{background:var(--bg2)!important}
body.nd .container [style*="border: 2px solid rgba("],body.nd .container [style*="border: 1px solid rgba("],body.nd .container [style*="border:1px solid rgba("],body.nd .container [style*="border: 2px dashed rgba("]{border-color:var(--line2)!important}
body.nd .container [style*="border-left: 4px solid"],body.nd .container [style*="border-left:4px solid"]{border-left-color:var(--gold)!important}
body.nd .logo-icon{color:var(--gold)}
body.nd .logo-icon svg{stroke:var(--gold)}
body.nd .hero-stats{border-top:1px solid var(--line2);padding-top:18px}
body.nd footer [style]{color:var(--navy-mute)!important}
body.nd .container [style*="color: #c084fc"],body.nd .container [style*="color: #a855f7"],body.nd .container [style*="color: #fca5a5"]{color:var(--neo)!important}
body.nd .container [style*="color: #22c55e"]{color:var(--ok)!important}
body.nd .container [style*="color: #f472b6"]{color:var(--neo)!important}
body.nd .container [style*="background"][style*="rgba("]:not(.qr-box){background:var(--bg2)!important}
body.nd .container strong,body.nd .warning-text strong{color:inherit}
body.nd header .container,body.nd footer .container{color:inherit}
body.nd .container table{display:block;max-width:100%;overflow-x:auto}
body.nd .container span[style*="font-size: 0.7"],body.nd .container span[style*="font-size:0.7"],body.nd .product-badge{font-size:.75rem!important}
body.nd .hero-desc{font-size:1.0625rem;line-height:1.7}
body.nd footer [style]{background:transparent!important;border-color:rgba(255,255,255,.18)!important}
body.nd footer .container [style][style][style]{background:transparent!important;border-color:rgba(255,255,255,.18)!important}
body.nd footer{--text-secondary:var(--navy-mute);--text-muted:var(--navy-mute);--text:#fff}
body.nd footer .container [style*="color"]{color:var(--navy-mute)!important}body.nd footer .container h3[style]{color:#fff!important}
@media (max-width:460px){body.nd .container [style*="grid-template-columns"]{grid-template-columns:minmax(0,1fr)!important}}
body.nd .container span[style*="background"][style*="rgba("]{background:var(--card)!important;border:1px solid var(--line2)!important}
body.nd .container table{display:table;min-width:0}
body.nd #demo-sdk-template span[style*="color: white"],body.nd #demo-sdk-only span[style*="color: white"]{color:var(--ink)!important;border:1px solid var(--line2)}