:root{--site-bg:#070d1a;--site-surface:#111a2d;--site-surface-2:#0d1628;--site-border:#263752;--site-text:#eef4ff;--site-muted:#93a4bd;--site-primary:#3b82f6;--site-primary-2:#0ea5e9;--site-shadow:0 18px 48px rgba(0,0,0,.24)}
html[data-theme="light"]{--site-bg:#f1f5f9;--site-surface:#fff;--site-surface-2:#f8fafc;--site-border:#dbe4ef;--site-text:#172033;--site-muted:#64748b;--site-primary:#2563eb;--site-primary-2:#0ea5e9;--site-shadow:0 18px 48px rgba(15,23,42,.10);color-scheme:light}
html[data-theme="dark"]{color-scheme:dark}body{transition:background-color .2s ease,color .2s ease;cursor:auto!important}.site-theme-toggle{position:fixed;top:18px;right:18px;z-index:10020;display:flex;align-items:center;gap:7px;border:1px solid var(--site-border);border-radius:999px;padding:9px 13px;background:var(--site-surface);color:var(--site-text);box-shadow:var(--site-shadow);font-weight:750;font-size:12px;cursor:pointer}.theme-light-icon{display:none}html[data-theme="light"] .theme-dark-icon{display:none}html[data-theme="light"] .theme-light-icon{display:inline}.support-widget{position:fixed;right:22px;bottom:22px;z-index:10030;display:flex;align-items:flex-end;flex-direction:column}.support-main{width:58px;height:58px;border:0;border-radius:50%;display:grid;place-items:center;background:linear-gradient(135deg,#2563eb,#0ea5e9);color:#fff;font-size:22px;cursor:pointer;box-shadow:0 14px 30px rgba(37,99,235,.34);transition:transform .2s}.support-main:hover{transform:translateY(-2px)}.support-close-icon{display:none;font-size:30px;line-height:1}.support-widget.open .support-chat-icon{display:none}.support-widget.open .support-close-icon{display:inline}.support-caption{margin-top:6px;padding:4px 8px;border-radius:999px;background:var(--site-surface);border:1px solid var(--site-border);color:var(--site-text);font-size:10px;font-weight:800;box-shadow:var(--site-shadow)}.support-menu{display:none;gap:9px;flex-direction:column;margin-bottom:12px}.support-widget.open .support-menu{display:flex;animation:supportUp .18s ease}.support-option{min-width:178px;display:flex;align-items:center;gap:10px;padding:10px 13px;border-radius:14px;background:var(--site-surface);border:1px solid var(--site-border);color:var(--site-text)!important;text-decoration:none!important;box-shadow:var(--site-shadow)}.support-option span{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;color:#fff;font-size:11px;font-weight:900}.support-option.whatsapp span{background:#22c55e}.support-option.telegram span{background:#229ed9}.support-option strong{font-size:13px}@keyframes supportUp{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
/* Light theme: public order */
html[data-theme="light"] body{background:radial-gradient(circle at top left,rgba(37,99,235,.09),transparent 28%),radial-gradient(circle at bottom right,rgba(14,165,233,.08),transparent 28%),var(--site-bg)!important;color:var(--site-text)!important}html[data-theme="light"] .custom-card{background:#fff!important;border-color:#dbe4ef!important;box-shadow:var(--site-shadow)!important}html[data-theme="light"] .order-panel,html[data-theme="light"] .premium-panel{background:#fff!important;border-color:#dbe4ef!important;box-shadow:0 14px 35px rgba(15,23,42,.08)!important}html[data-theme="light"] .order-heading h5,html[data-theme="light"] .premium-heading h5,html[data-theme="light"] .order-step,html[data-theme="light"] .premium-step,html[data-theme="light"] h1,html[data-theme="light"] h2,html[data-theme="light"] h3,html[data-theme="light"] h4,html[data-theme="light"] h5{color:#172033!important}html[data-theme="light"] .order-heading p,html[data-theme="light"] .premium-heading p,html[data-theme="light"] .text-muted,html[data-theme="light"] .muted{color:#64748b!important}html[data-theme="light"] .order-control,html[data-theme="light"] .premium-control,html[data-theme="light"] input,html[data-theme="light"] select,html[data-theme="light"] textarea{background:#f8fafc!important;color:#172033!important;border-color:#cbd5e1!important}html[data-theme="light"] .order-control::placeholder,html[data-theme="light"] .premium-control::placeholder,html[data-theme="light"] input::placeholder{color:#94a3b8!important}html[data-theme="light"] .nav-tabs-custom{background:#f8fafc!important;border-color:#dbe4ef!important}html[data-theme="light"] .nav-tabs-custom .nav-link{background:transparent!important;color:#475569!important}html[data-theme="light"] .nav-tabs-custom .nav-link.active{background:linear-gradient(135deg,#2563eb,#0ea5e9)!important;color:#fff!important}html[data-theme="light"] .voucher-switch-box,html[data-theme="light"] .premium-option-box,html[data-theme="light"] .order-summary,html[data-theme="light"] .premium-payment-box{background:#f8fafc!important;border-color:#dbe4ef!important;color:#172033!important}html[data-theme="light"] .popup-box,html[data-theme="light"] .modal-content{background:#fff!important;color:#172033!important;border-color:#dbe4ef!important}
/* Admin light */
html[data-theme="light"] .app-shell,html[data-theme="light"] .content{background:var(--site-bg)!important;color:var(--site-text)!important}html[data-theme="light"] .sidebar{background:#fff!important;border-color:var(--site-border)!important}html[data-theme="light"] .sidebar nav a{color:#475569!important}html[data-theme="light"] .sidebar nav a:hover,html[data-theme="light"] .sidebar nav a.active{background:#eaf2ff!important;color:#1d4ed8!important}html[data-theme="light"] .card,html[data-theme="light"] .admin-chip,html[data-theme="light"] .login-card{background:#fff!important;border-color:var(--site-border)!important;color:var(--site-text)!important;box-shadow:0 12px 32px rgba(15,23,42,.06)}html[data-theme="light"] .note{background:#eff6ff!important;border-color:#bfdbfe!important;color:#334155!important}html[data-theme="light"] .table th,html[data-theme="light"] .table td{border-color:#e2e8f0!important;color:#334155!important}html[data-theme="light"] .table th{color:#64748b!important}
/* Member light */
html[data-theme="light"] .shell{background:var(--site-bg)!important}html[data-theme="light"] .shell aside{background:#fff!important;border-color:var(--site-border)!important}html[data-theme="light"] .shell aside a{color:#475569!important}html[data-theme="light"] .shell aside a:hover,html[data-theme="light"] .shell aside a.active{background:#eaf2ff!important;color:#1d4ed8!important}html[data-theme="light"] .shell main{color:var(--site-text)!important}html[data-theme="light"] .shell .card,html[data-theme="light"] .member-section,html[data-theme="light"] .file-card,html[data-theme="light"] .data-grid>div{background:#fff!important;border-color:var(--site-border)!important;color:var(--site-text)!important;box-shadow:0 10px 28px rgba(15,23,42,.055)}html[data-theme="light"] .data-grid>div,html[data-theme="light"] .file-card{background:#f8fafc!important}html[data-theme="light"] .status{background:#e2e8f0!important;color:#334155!important}html[data-theme="light"] .status.ok{background:#dcfce7!important;color:#15803d!important}
@media(max-width:700px){.site-theme-toggle{top:10px;right:10px}.site-theme-label{display:none}.support-widget{right:14px;bottom:14px}.support-main{width:52px;height:52px}}

/* =========================================================
   LIGHT THEME V2 — mengikuti gaya clean Blade/Laravel
   ========================================================= */
html[data-theme="light"]{
  --site-bg:#f1f5f9;
  --site-surface:#ffffff;
  --site-surface-2:#f8fafc;
  --site-border:#e2e8f0;
  --site-text:#172033;
  --site-muted:#64748b;
  --site-primary:#2563eb;
  --site-primary-2:#0ea5e9;
  --site-shadow:0 20px 55px rgba(15,23,42,.10);
}
html[data-theme="light"] body{
  background:
    radial-gradient(circle at top left,rgba(37,99,235,.11),transparent 30%),
    radial-gradient(circle at bottom right,rgba(14,165,233,.09),transparent 30%),
    #f1f5f9!important;
  color:#172033!important;
}
html[data-theme="light"] .container.min-vh-100{align-items:flex-start!important;padding-top:42px!important;padding-bottom:42px!important}
html[data-theme="light"] .custom-card{
  background:#fff!important;
  border:1px solid rgba(226,232,240,.95)!important;
  border-radius:22px!important;
  box-shadow:0 20px 55px rgba(15,23,42,.12)!important;
  color:#172033!important;
}
html[data-theme="light"] .custom-card>.d-flex:first-child{
  padding-bottom:18px!important;
  margin-bottom:18px!important;
  border-bottom:1px solid #e2e8f0!important;
}
html[data-theme="light"] .custom-card .rc-font,
html[data-theme="light"] .custom-card h4{color:#172033!important;text-shadow:none!important}
html[data-theme="light"] .shine-icon{filter:none!important;text-shadow:none!important}
html[data-theme="light"] .nav-tabs-custom{
  padding:6px!important;
  background:#f8fafc!important;
  border:1px solid #e2e8f0!important;
  border-radius:16px!important;
  box-shadow:none!important;
}
html[data-theme="light"] .nav-tabs-custom .nav-item{flex:1!important}
html[data-theme="light"] .nav-tabs-custom .nav-link{
  width:100%!important;
  min-height:48px!important;
  border-radius:12px!important;
  background:transparent!important;
  color:#475569!important;
  box-shadow:none!important;
  font-weight:800!important;
}
html[data-theme="light"] .nav-tabs-custom .nav-link:hover:not(.active){background:#eef2f7!important;color:#1e293b!important}
html[data-theme="light"] .nav-tabs-custom .nav-link.active{
  background:linear-gradient(135deg,#2563eb,#0ea5e9)!important;
  color:#fff!important;
  box-shadow:0 10px 22px rgba(37,99,235,.22)!important;
}
html[data-theme="light"] #order .order-panel,
html[data-theme="light"] .premium-panel{
  background:#fff!important;
  border:1px solid #e2e8f0!important;
  border-radius:20px!important;
  box-shadow:0 14px 38px rgba(15,23,42,.08)!important;
  color:#172033!important;
}
html[data-theme="light"] #order .order-panel::before{background:linear-gradient(90deg,#2563eb,#0ea5e9)!important;height:4px!important}
html[data-theme="light"] #order .order-heading-icon,
html[data-theme="light"] .premium-heading-icon{
  background:linear-gradient(135deg,#2563eb,#0ea5e9)!important;
  box-shadow:0 10px 22px rgba(37,99,235,.20)!important;
}
html[data-theme="light"] #order .order-heading h5,
html[data-theme="light"] .premium-heading h5{color:#172033!important}
html[data-theme="light"] #order .order-heading p,
html[data-theme="light"] .premium-heading p{color:#64748b!important}
html[data-theme="light"] #order .order-step,
html[data-theme="light"] .premium-step{color:#334155!important}
html[data-theme="light"] #order .order-step-number,
html[data-theme="light"] .premium-step>span{
  background:#eff6ff!important;
  color:#2563eb!important;
  border:1px solid #bfdbfe!important;
}
html[data-theme="light"] #order .order-label,
html[data-theme="light"] .premium-label,
html[data-theme="light"] label{color:#334155!important}
html[data-theme="light"] #order .order-label i,
html[data-theme="light"] .premium-label i{color:#2563eb!important}
html[data-theme="light"] #order .order-control,
html[data-theme="light"] .premium-control,
html[data-theme="light"] .form-control,
html[data-theme="light"] .form-select,
html[data-theme="light"] input,
html[data-theme="light"] select,
html[data-theme="light"] textarea{
  background:#f8fafc!important;
  color:#172033!important;
  border:1px solid #cbd5e1!important;
  box-shadow:none!important;
}
html[data-theme="light"] #order .order-control:focus,
html[data-theme="light"] .premium-control:focus,
html[data-theme="light"] input:focus,
html[data-theme="light"] select:focus,
html[data-theme="light"] textarea:focus{
  background:#fff!important;
  color:#172033!important;
  border-color:#2563eb!important;
  box-shadow:0 0 0 4px rgba(37,99,235,.12)!important;
  transform:none!important;
}
html[data-theme="light"] input::placeholder,
html[data-theme="light"] textarea::placeholder{color:#94a3b8!important}
html[data-theme="light"] select option{background:#fff!important;color:#172033!important}
html[data-theme="light"] #order .order-help,
html[data-theme="light"] .premium-info-box{
  background:#fff8e6!important;
  color:#92400e!important;
  border:1px solid #f5d58b!important;
}
html[data-theme="light"] #order .voucher-switch-box,
html[data-theme="light"] .premium-option-box{
  background:#f8fafc!important;
  border:1px dashed #cbd5e1!important;
  color:#334155!important;
}
html[data-theme="light"] #order .voucher-switch-box .form-check-label,
html[data-theme="light"] .premium-option-box .form-check-label{color:#334155!important}
html[data-theme="light"] #order .order-summary,
html[data-theme="light"] .premium-payment-box{
  background:#eff6ff!important;
  border:1px solid #bfdbfe!important;
  color:#172033!important;
}
html[data-theme="light"] #order .order-summary-title,
html[data-theme="light"] .premium-payment-box small{color:#64748b!important}
html[data-theme="light"] #order .order-summary-value,
html[data-theme="light"] .premium-payment-box strong{color:#172033!important}
html[data-theme="light"] #order .btn-order-modern,
html[data-theme="light"] .premium-submit,
html[data-theme="light"] .member-login-button{
  background:linear-gradient(135deg,#2563eb,#0ea5e9)!important;
  color:#fff!important;
  box-shadow:0 12px 25px rgba(37,99,235,.24)!important;
}
html[data-theme="light"] #order .btn-order-modern:hover,
html[data-theme="light"] .premium-submit:hover,
html[data-theme="light"] .member-login-button:hover{
  box-shadow:0 16px 30px rgba(37,99,235,.30)!important;
  transform:translateY(-1px)!important;
}
html[data-theme="light"] .text-secondary{color:#64748b!important}
html[data-theme="light"] footer,
html[data-theme="light"] .footer,
html[data-theme="light"] .Made-with{color:#64748b!important}
html[data-theme="light"] .site-theme-toggle{
  background:#fff!important;
  color:#334155!important;
  border:1px solid #dbe4ef!important;
  box-shadow:0 8px 20px rgba(15,23,42,.08)!important;
}

/* Admin: clean white dashboard */
html[data-theme="light"] .app-shell{background:#f1f5f9!important}
html[data-theme="light"] .sidebar{
  background:#fff!important;
  border-right:1px solid #e2e8f0!important;
  box-shadow:8px 0 28px rgba(15,23,42,.035)!important;
}
html[data-theme="light"] .brand{color:#172033!important}
html[data-theme="light"] .brand-sub{color:#64748b!important}
html[data-theme="light"] .sidebar nav a{color:#475569!important}
html[data-theme="light"] .sidebar nav a:hover,
html[data-theme="light"] .sidebar nav a.active{background:#eff6ff!important;color:#1d4ed8!important}
html[data-theme="light"] .content{background:#f1f5f9!important;color:#172033!important}
html[data-theme="light"] .topbar h1{color:#172033!important}
html[data-theme="light"] .topbar p{color:#64748b!important}
html[data-theme="light"] .admin-chip{
  background:#fff!important;
  color:#334155!important;
  border:1px solid #e2e8f0!important;
  box-shadow:0 8px 20px rgba(15,23,42,.05)!important;
}
html[data-theme="light"] .card,
html[data-theme="light"] .login-card{
  background:#fff!important;
  color:#172033!important;
  border:1px solid #e2e8f0!important;
  box-shadow:0 12px 30px rgba(15,23,42,.06)!important;
}
html[data-theme="light"] .stat-label,
html[data-theme="light"] .field label,
html[data-theme="light"] .muted{color:#64748b!important}
html[data-theme="light"] .stat-value,
html[data-theme="light"] .section-title{color:#172033!important}
html[data-theme="light"] .table th{background:#f8fafc!important;color:#64748b!important}
html[data-theme="light"] .table td{color:#334155!important;background:#fff!important}
html[data-theme="light"] .table th,
html[data-theme="light"] .table td{border-color:#e2e8f0!important}
html[data-theme="light"] .note{background:#eff6ff!important;color:#334155!important;border-color:#bfdbfe!important}
html[data-theme="light"] .btn{background:#2563eb!important;color:#fff!important}
html[data-theme="light"] .btn.secondary{background:#e2e8f0!important;color:#334155!important}
html[data-theme="light"] .btn.danger{background:#dc2626!important;color:#fff!important}
html[data-theme="light"] .pagination a{background:#fff!important;color:#334155!important;border:1px solid #e2e8f0!important}
html[data-theme="light"] .pagination a.active{background:#2563eb!important;color:#fff!important}

/* Member area: clean Blade-style cards */
html[data-theme="light"] .shell{background:#f1f5f9!important}
html[data-theme="light"] .shell aside{
  background:#fff!important;
  border-right:1px solid #e2e8f0!important;
  box-shadow:8px 0 28px rgba(15,23,42,.035)!important;
}
html[data-theme="light"] .shell aside a{color:#475569!important}
html[data-theme="light"] .shell aside a:hover,
html[data-theme="light"] .shell aside a.active{background:#eff6ff!important;color:#1d4ed8!important}
html[data-theme="light"] .shell main{background:#f1f5f9!important;color:#172033!important}
html[data-theme="light"] .shell header h1{color:#172033!important}
html[data-theme="light"] .shell header p{color:#64748b!important}
html[data-theme="light"] .shell .card{
  background:#fff!important;
  color:#172033!important;
  border:1px solid #e2e8f0!important;
  box-shadow:0 12px 30px rgba(15,23,42,.06)!important;
}
html[data-theme="light"] .data-grid>div,
html[data-theme="light"] .file-card{
  background:#f8fafc!important;
  color:#172033!important;
  border:1px solid #e2e8f0!important;
  box-shadow:none!important;
}
html[data-theme="light"] .data-grid small,
html[data-theme="light"] .file-card p{color:#64748b!important}
html[data-theme="light"] .file-card h3{color:#172033!important}
html[data-theme="light"] .shell table th{background:#f8fafc!important;color:#64748b!important}
html[data-theme="light"] .shell table td{background:#fff!important;color:#334155!important}
html[data-theme="light"] .shell th,
html[data-theme="light"] .shell td{border-color:#e2e8f0!important}
html[data-theme="light"] .status{background:#e2e8f0!important;color:#334155!important}
html[data-theme="light"] .status.ok{background:#dcfce7!important;color:#15803d!important}
html[data-theme="light"] .login-wrap{background:radial-gradient(circle at top left,rgba(37,99,235,.11),transparent 30%),#f1f5f9!important}
html[data-theme="light"] .login-card{box-shadow:0 20px 55px rgba(15,23,42,.12)!important}

@media(max-width:700px){
  html[data-theme="light"] .container.min-vh-100{padding-top:18px!important;padding-bottom:18px!important}
  html[data-theme="light"] .custom-card{border-radius:17px!important}
  html[data-theme="light"] #order .order-panel,
  html[data-theme="light"] .premium-panel{border-radius:17px!important}
}

.support-logo-svg{width:28px!important;height:28px!important;display:grid!important;place-items:center!important;border-radius:50%!important}.support-logo-svg svg{width:19px;height:19px}.support-option.whatsapp .support-logo-svg{background:#25d366;color:#fff}.support-option.telegram .support-logo-svg{background:#229ed9;color:#fff}

/* =========================================================
   VIP GAMING — UNIFIED INVOICE UI v4
   Tampilan global Order / Perpanjang / Login / Invoice
   ========================================================= */
:root{
  --vip-bg:#061126;
  --vip-bg-soft:#0a1730;
  --vip-panel:#0f213f;
  --vip-panel-soft:#132a50;
  --vip-line:#28456f;
  --vip-text:#f5f9ff;
  --vip-muted:#9fb4d2;
  --vip-blue:#2878f0;
  --vip-cyan:#13a9e9;
  --vip-success:#23b26d;
  --vip-warning:#f59e0b;
  --vip-danger:#ef4444;
  --vip-shadow:0 22px 60px rgba(0,0,0,.25);
  --vip-radius:20px;
}
html[data-theme="light"]{
  --vip-bg:#eef5fc;
  --vip-bg-soft:#e8f1fb;
  --vip-panel:#ffffff;
  --vip-panel-soft:#f4f8fd;
  --vip-line:#d6e3f1;
  --vip-text:#10233f;
  --vip-muted:#617792;
  --vip-blue:#2878f0;
  --vip-cyan:#13a9e9;
  --vip-shadow:0 22px 60px rgba(33,76,123,.13);
}
html,body{min-height:100%;}
body{
  color:var(--vip-text)!important;
  background:
    radial-gradient(circle at 8% 0%,rgba(40,120,240,.14),transparent 31%),
    radial-gradient(circle at 96% 92%,rgba(19,169,233,.10),transparent 30%),
    var(--vip-bg)!important;
  font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif!important;
}
.custom-card{
  border:1px solid var(--vip-line)!important;
  border-radius:24px!important;
  background:var(--vip-bg-soft)!important;
  box-shadow:var(--vip-shadow)!important;
  overflow:hidden;
}
.custom-card>.d-flex:first-child{
  min-height:74px;
  margin:-1px -1px 20px!important;
  padding:20px 24px!important;
  color:#fff!important;
  border:0!important;
  background:linear-gradient(135deg,#2878f0,#13a9e9)!important;
}
.custom-card>.d-flex:first-child .rc-font,
.custom-card>.d-flex:first-child h4{color:#fff!important;text-shadow:none!important;letter-spacing:.2px}
.nav-tabs-custom{
  display:grid!important;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:8px!important;
  margin:0 20px 20px!important;
  padding:7px!important;
  border:1px solid var(--vip-line)!important;
  border-radius:17px!important;
  background:var(--vip-panel)!important;
}
.nav-tabs-custom .nav-item{width:100%}
.nav-tabs-custom .nav-link{
  position:relative;
  overflow:hidden;
  width:100%!important;
  min-height:48px;
  padding:10px 12px!important;
  border:0!important;
  border-radius:12px!important;
  background:transparent!important;
  color:var(--vip-muted)!important;
  font-weight:800!important;
  font-size:13px!important;
  transition:.2s ease!important;
}
.nav-tabs-custom .nav-link:hover{color:var(--vip-text)!important;background:var(--vip-panel-soft)!important;transform:translateY(-1px)}
.nav-tabs-custom .nav-link.active{
  color:#fff!important;
  background:linear-gradient(135deg,#2878f0,#13a9e9)!important;
  box-shadow:0 11px 25px rgba(40,120,240,.28)!important;
}
.nav-tabs-custom .nav-link.active:after{
  content:"";position:absolute;inset:-70% auto -70% -35%;width:25%;transform:rotate(22deg);
  background:rgba(255,255,255,.32);animation:vipNavShine 2.7s ease-in-out infinite;
}
@keyframes vipNavShine{0%,55%{left:-35%}100%{left:125%}}
.tab-content{padding:0 20px 22px!important}
#order .order-panel,.premium-panel{
  color:var(--vip-text)!important;
  border:1px solid var(--vip-line)!important;
  border-radius:var(--vip-radius)!important;
  background:var(--vip-panel)!important;
  box-shadow:0 15px 38px rgba(0,0,0,.12)!important;
}
#order .order-panel:before{height:4px!important;background:linear-gradient(90deg,#2878f0,#13a9e9)!important}
#order .order-heading-icon,.premium-heading-icon{
  color:#fff!important;background:linear-gradient(135deg,#2878f0,#13a9e9)!important;
  box-shadow:0 10px 22px rgba(40,120,240,.25)!important;
}
#order .order-heading h5,.premium-heading h5,#order .order-step,.premium-step{color:var(--vip-text)!important}
#order .order-heading p,.premium-heading p{color:var(--vip-muted)!important}
#order .order-label,.premium-label{color:var(--vip-text)!important}
#order .order-label i,.premium-label i{color:var(--vip-blue)!important}
#order .order-step-number,.premium-step span{
  color:var(--vip-blue)!important;background:rgba(40,120,240,.11)!important;border-color:rgba(40,120,240,.30)!important;
}
#order .order-control,.premium-control,
.custom-card input,.custom-card select,.custom-card textarea{
  color:var(--vip-text)!important;
  background:var(--vip-panel-soft)!important;
  border:1px solid var(--vip-line)!important;
  border-radius:12px!important;
  box-shadow:none!important;
}
#order .order-control:focus,.premium-control:focus,.custom-card input:focus,.custom-card select:focus,.custom-card textarea:focus{
  border-color:var(--vip-blue)!important;box-shadow:0 0 0 4px rgba(40,120,240,.13)!important;
}
.custom-card option{color:#10233f!important;background:#fff!important}
.order-help,.premium-info-box,.transaction-notice{
  color:var(--vip-muted)!important;background:rgba(40,120,240,.08)!important;border-color:rgba(40,120,240,.28)!important;
}
.voucher-switch-box,.premium-option-box,.order-summary,.premium-payment-box{
  color:var(--vip-text)!important;background:var(--vip-panel-soft)!important;border-color:var(--vip-line)!important;
}
.btn-order-modern,.premium-submit,.member-login-button{
  display:flex!important;align-items:center!important;justify-content:center!important;gap:8px!important;
  color:#fff!important;background:linear-gradient(135deg,#2878f0,#13a9e9)!important;
  border:0!important;border-radius:13px!important;box-shadow:0 13px 28px rgba(40,120,240,.25)!important;
}
.btn-order-modern:hover,.premium-submit:hover,.member-login-button:hover{color:#fff!important;transform:translateY(-2px)!important;box-shadow:0 18px 35px rgba(40,120,240,.34)!important}
.order-summary-badge,.premium-payment-box>span{color:#087343!important;background:#dff8ea!important;border-color:#b9e9cf!important}
.site-theme-toggle{border-color:var(--vip-line)!important;background:var(--vip-panel)!important;color:var(--vip-text)!important;box-shadow:0 10px 25px rgba(0,0,0,.12)!important}
.support-option,.support-caption{border-color:var(--vip-line)!important;background:var(--vip-panel)!important;color:var(--vip-text)!important}
.popup-box,.modal-content{border-color:var(--vip-line)!important;background:var(--vip-panel)!important;color:var(--vip-text)!important}
.footer,.custom-card footer{color:var(--vip-muted)!important}
html[data-theme="light"] .custom-card{background:#fff!important}
html[data-theme="light"] .custom-card>.d-flex:first-child{color:#fff!important}
html[data-theme="light"] .custom-card>.d-flex:first-child *{color:#fff!important}
html[data-theme="light"] #order .order-panel,html[data-theme="light"] .premium-panel{background:#fff!important}
html[data-theme="light"] .nav-tabs-custom{background:#f5f9fe!important}
html[data-theme="light"] #order .order-control,html[data-theme="light"] .premium-control,
html[data-theme="light"] .custom-card input,html[data-theme="light"] .custom-card select,html[data-theme="light"] .custom-card textarea{background:#f4f8fd!important;color:#10233f!important}
@media(max-width:820px){
 .nav-tabs-custom{grid-template-columns:repeat(2,minmax(0,1fr))}
 .tab-content{padding:0 12px 16px!important}.nav-tabs-custom{margin:0 12px 14px!important}
 .custom-card>.d-flex:first-child{padding:18px!important}
}
@media(max-width:480px){.nav-tabs-custom{grid-template-columns:1fr 1fr}.nav-tabs-custom .nav-link{font-size:11px!important;padding:8px 5px!important}}




/* Grup floating: dibuat sama dengan tombol Chat CS dan tepat di atasnya */
.community-float-widget{
    position:fixed;
    right:22px;
    bottom:108px;
    z-index:10031;
    display:flex;
    align-items:flex-end;
    flex-direction:column;
}
.community-float-main{
    width:58px;
    height:58px;
    border:0;
    border-radius:50%;
    display:grid;
    place-items:center;
    background:linear-gradient(135deg,#2563eb,#0ea5e9);
    color:#fff;
    font-size:22px;
    cursor:pointer;
    box-shadow:0 14px 30px rgba(37,99,235,.34);
    transition:transform .2s;
    padding:0;
}
.community-float-main:hover{
    transform:translateY(-2px);
}
.community-float-open-icon{
    display:inline-flex;
    align-items:center;
    justify-content:center;
}
.community-float-close-icon{
    display:none;
    font-size:30px;
    line-height:1;
}
.community-float-widget.open .community-float-open-icon{
    display:none;
}
.community-float-widget.open .community-float-close-icon{
    display:inline;
}
.community-float-caption{
    margin-top:6px;
    padding:4px 8px;
    border-radius:999px;
    background:var(--site-surface);
    border:1px solid var(--site-border);
    color:var(--site-text);
    font-size:10px;
    font-weight:800;
    box-shadow:var(--site-shadow);
}
.community-float-menu{
    display:none;
    gap:9px;
    flex-direction:column;
    margin-bottom:12px;
}
.community-float-widget.open .community-float-menu{
    display:flex;
    animation:supportUp .18s ease;
}
.community-float-option{
    min-width:210px;
    display:flex;
    align-items:center;
    gap:10px;
    padding:11px 13px;
    border-radius:14px;
    background:var(--site-surface);
    border:1px solid var(--site-border);
    color:var(--site-text);
    text-decoration:none;
    box-shadow:var(--site-shadow);
    font-size:13px;
    white-space:nowrap;
}
.community-float-option:hover{
    color:var(--site-text);
    transform:translateY(-1px);
}
.community-float-option-icon{
    width:30px;
    height:30px;
    border-radius:50%;
    display:grid;
    place-items:center;
    flex:0 0 30px;
    background:rgba(37,99,235,.12);
    color:#2563eb;
}
@media(max-width:576px){
    .community-float-widget{
        right:16px;
        bottom:104px;
    }
    .community-float-main{
        width:54px;
        height:54px;
    }
}


/* Saat salah satu menu terbuka, tombol lain disembunyikan sementara */
body:has(.community-float-widget.open) .support-widget{
    opacity:0;
    pointer-events:none;
    transform:translateY(6px);
}
body:has(.support-widget.open) .community-float-widget{
    opacity:0;
    pointer-events:none;
    transform:translateY(6px);
}
.support-widget,
.community-float-widget{
    transition:opacity .16s ease, transform .16s ease;
}
