:root{
  --rsp-primary:#3575bb;
  --rsp-secondary:#feea00;
  --rsp-white:#fff;
  --rsp-ink:#17395f;
  --rsp-muted:#6f86a0;
  --rsp-line:#cfe1f3;
  --rsp-shadow:0 12px 30px rgba(53,117,187,.12);
  --primary:var(--rsp-primary);
  --brand:var(--rsp-primary);
  --accent:var(--rsp-secondary);
  --light:var(--rsp-white);
}

body{
  color:var(--rsp-ink);
  background:var(--rsp-white);
}

a{color:var(--rsp-primary)}
a:hover{color:var(--rsp-ink)}
.text-muted{color:var(--rsp-muted)!important}
.text-dark{color:var(--rsp-ink)!important}
.text-primary,.text-success,.text-danger,.text-info{color:var(--rsp-primary)!important}
.text-warning{color:var(--rsp-ink)!important}

.main-content{
  min-height:100vh;
  background:var(--rsp-white);
}

#sidebar,
.mobile-header{
  background:var(--rsp-primary)!important;
  color:var(--rsp-white)!important;
  box-shadow:8px 0 28px rgba(53,117,187,.16)!important;
}

#sidebar .sidebar-header{
  border-bottom-color:rgba(255,255,255,.28)!important;
}

#sidebar .nav-link{
  color:rgba(255,255,255,.88)!important;
  border-left-color:transparent!important;
}

#sidebar .nav-link:hover{
  background:var(--rsp-white)!important;
  color:var(--rsp-primary)!important;
}

#sidebar .nav-link.active{
  background:var(--rsp-secondary)!important;
  color:var(--rsp-ink)!important;
  border-left-color:var(--rsp-secondary)!important;
  font-weight:700;
}

#sidebar .sidebar-footer{
  border-top-color:rgba(255,255,255,.28)!important;
}

#sidebar .sidebar-footer a,
#sidebar .toggle-btn,
.mobile-header .toggle-btn{
  color:var(--rsp-white)!important;
}

#sidebar .sidebar-footer a:hover,
#sidebar .toggle-btn:hover,
.mobile-header .toggle-btn:hover{
  background:var(--rsp-white)!important;
  color:var(--rsp-primary)!important;
}

#sidebar .admin-badge,
#sidebar .badge-admin,
.mobile-header .admin-badge{
  background:var(--rsp-secondary)!important;
  border-color:var(--rsp-secondary)!important;
  color:var(--rsp-ink)!important;
}

.overlay{background:rgba(23,57,95,.42)!important}

.card,
.stat-card,
.test-card,
.package,
.modal-content,
.offcanvas{
  background:var(--rsp-white)!important;
  color:var(--rsp-ink)!important;
  border:1px solid var(--rsp-line)!important;
  border-radius:8px!important;
  box-shadow:var(--rsp-shadow)!important;
}

.card-header,
.card-footer,
.modal-header,
.modal-footer{
  background:var(--rsp-white)!important;
  border-color:var(--rsp-line)!important;
}

.bg-primary-subtle,
.bg-success-subtle,
.bg-danger-subtle,
.bg-info-subtle{
  background:var(--rsp-white)!important;
  border:1px solid var(--rsp-line)!important;
}

.bg-warning-subtle{
  background:var(--rsp-secondary)!important;
  border:1px solid var(--rsp-secondary)!important;
}

.bg-primary,
.bg-success,
.bg-danger,
.bg-info,
.bg-secondary{
  background-color:var(--rsp-primary)!important;
  color:var(--rsp-white)!important;
}

.bg-warning{
  background-color:var(--rsp-secondary)!important;
  color:var(--rsp-ink)!important;
}

.bg-primary.bg-opacity-10,
.bg-success.bg-opacity-10,
.bg-danger.bg-opacity-10,
.bg-info.bg-opacity-10,
.bg-secondary.bg-opacity-10{
  background:var(--rsp-white)!important;
  color:var(--rsp-primary)!important;
  border:1px solid var(--rsp-line);
}

.bg-warning.bg-opacity-10{
  background:var(--rsp-secondary)!important;
  color:var(--rsp-ink)!important;
  border:1px solid var(--rsp-secondary);
}

.btn{
  border-radius:8px!important;
  font-weight:700;
}

.btn-primary,
.btn-success,
.btn-danger,
.btn-info,
.btn-dark,
.btn-brand{
  background:var(--rsp-primary)!important;
  border-color:var(--rsp-primary)!important;
  color:var(--rsp-white)!important;
}

.btn-warning,
.btn-accent{
  background:var(--rsp-secondary)!important;
  border-color:var(--rsp-secondary)!important;
  color:var(--rsp-ink)!important;
}

.btn-secondary,
.btn-light,
.btn-outline-primary,
.btn-outline-secondary,
.btn-outline-danger,
.btn-outline-success,
.btn-brand-soft{
  background:var(--rsp-white)!important;
  border-color:var(--rsp-primary)!important;
  color:var(--rsp-primary)!important;
}

.btn-primary:hover,
.btn-success:hover,
.btn-danger:hover,
.btn-info:hover,
.btn-dark:hover,
.btn-brand:hover{
  background:var(--rsp-ink)!important;
  border-color:var(--rsp-ink)!important;
  color:var(--rsp-white)!important;
}

.btn-warning:hover,
.btn-accent:hover{
  filter:brightness(.96);
  color:var(--rsp-ink)!important;
}

.btn-outline-primary:hover,
.btn-outline-secondary:hover,
.btn-outline-danger:hover,
.btn-outline-success:hover,
.btn-brand-soft:hover{
  background:var(--rsp-primary)!important;
  border-color:var(--rsp-primary)!important;
  color:var(--rsp-white)!important;
}

.badge{
  border-radius:6px!important;
  font-weight:700;
}

.alert{
  background:var(--rsp-white)!important;
  color:var(--rsp-ink)!important;
  border:1px solid var(--rsp-primary)!important;
  border-radius:8px!important;
}

.alert-warning{
  background:var(--rsp-secondary)!important;
  border-color:var(--rsp-secondary)!important;
}

.progress{
  background:var(--rsp-white)!important;
  border:1px solid var(--rsp-line);
}

.progress-bar,
.progress-bar.bg-success,
.progress-bar.bg-danger{
  background:var(--rsp-primary)!important;
}

.progress-bar.bg-warning{background:var(--rsp-secondary)!important}

.table{--bs-table-color:var(--rsp-ink);--bs-table-bg:var(--rsp-white)}
.table-light,
.table > thead{
  --bs-table-bg:var(--rsp-white);
  --bs-table-color:var(--rsp-ink);
  border-bottom:2px solid var(--rsp-primary);
}
.table > :not(caption) > * > *{border-color:var(--rsp-line)}
.table-hover > tbody > tr:hover > *{--bs-table-bg-state:rgba(53,117,187,.06)}

.form-control,
.form-select,
.input-group-text{
  background:var(--rsp-white)!important;
  color:var(--rsp-ink)!important;
  border-color:var(--rsp-line)!important;
  border-radius:8px;
}

.form-control:focus,
.form-select:focus{
  border-color:var(--rsp-primary)!important;
  box-shadow:0 0 0 .2rem rgba(53,117,187,.15)!important;
}

.form-check-input:checked{
  background-color:var(--rsp-primary)!important;
  border-color:var(--rsp-primary)!important;
}

.dropdown-menu{
  background:var(--rsp-white);
  border-color:var(--rsp-line);
  box-shadow:var(--rsp-shadow);
}

.dropdown-item{color:var(--rsp-ink)}
.dropdown-item:hover,.dropdown-item:focus{
  background:var(--rsp-secondary);
  color:var(--rsp-ink);
}

.ref-code,
.secret-box{
  background:var(--rsp-primary)!important;
  color:var(--rsp-secondary)!important;
  border-color:var(--rsp-primary)!important;
}

.stat-icon{color:var(--rsp-primary)!important}
.clock-display{
  background:var(--rsp-primary)!important;
  color:var(--rsp-secondary)!important;
}
.wa-float{
  background:var(--rsp-secondary)!important;
  color:var(--rsp-primary)!important;
  box-shadow:0 10px 24px rgba(53,117,187,.2)!important;
}
.wa-float:hover{
  background:var(--rsp-primary)!important;
  color:var(--rsp-white)!important;
}
.ribbon-green,
.stack-note{
  background:var(--rsp-secondary)!important;
  color:var(--rsp-ink)!important;
}
.status-pending{
  background:var(--rsp-secondary)!important;
  color:var(--rsp-ink)!important;
}
.status-paid,
.status-failed{
  background:var(--rsp-primary)!important;
  color:var(--rsp-white)!important;
}
.test-desc{color:var(--rsp-muted)!important}

/* Login dan registrasi */
.public-auth-page{
  background:var(--rsp-white)!important;
  color:var(--rsp-ink)!important;
}

.public-auth-page .hero{
  background:var(--rsp-primary)!important;
}

.public-auth-page .hero::after{background:none!important}
.public-auth-page .auth{background:var(--rsp-white)!important}
.public-auth-page .card{
  width:min(560px,92vw);
  padding:28px;
}
.public-auth-page .auth-logo{
  background:var(--rsp-primary);
  border-radius:8px;
  padding:12px 22px;
}
.public-auth-page .title{color:var(--rsp-ink)!important}
.public-auth-page .label,
.public-auth-page .meta{color:var(--rsp-muted)!important}
.public-auth-page .input{
  background:var(--rsp-white)!important;
  color:var(--rsp-ink)!important;
  border:1px solid var(--rsp-line)!important;
  box-shadow:none!important;
}
.public-auth-page .input:focus{
  border-color:var(--rsp-primary)!important;
  box-shadow:0 0 0 .2rem rgba(53,117,187,.15)!important;
}
.public-auth-page .btn-primary{
  background:var(--rsp-primary)!important;
  box-shadow:none!important;
}
.public-auth-page .error{
  background:var(--rsp-white)!important;
  border:1px solid var(--rsp-primary)!important;
  color:var(--rsp-ink)!important;
}
.public-auth-page .agree{color:var(--rsp-muted)!important}
.public-auth-page .linklike{color:var(--rsp-primary)!important}
.public-auth-page .terms-backdrop{background:rgba(23,57,95,.42)!important}
.public-auth-page .terms-card{
  background:var(--rsp-white)!important;
  color:var(--rsp-ink)!important;
  border:1px solid var(--rsp-line)!important;
  border-radius:8px!important;
  box-shadow:var(--rsp-shadow)!important;
}
.public-auth-page .terms-head{
  background:var(--rsp-primary)!important;
  color:var(--rsp-white)!important;
}
.public-auth-page .terms-close{
  background:var(--rsp-secondary)!important;
  color:var(--rsp-ink)!important;
}

/* Tentang / halaman pemasaran */
.public-about-page{
  background:var(--rsp-white)!important;
  color:var(--rsp-ink)!important;
}

.public-about-page .navbar,
.public-about-page footer{
  background:var(--rsp-primary)!important;
  color:var(--rsp-white)!important;
}

.public-about-page .hero{
  background:var(--rsp-primary)!important;
  color:var(--rsp-white)!important;
}

.public-about-page .section,
.public-about-page .pricing{
  background:var(--rsp-white)!important;
  color:var(--rsp-ink)!important;
}

.public-about-page .card-soft,
.public-about-page .testi,
.public-about-page .faq-item{
  background:var(--rsp-white)!important;
  color:var(--rsp-ink)!important;
  border:1px solid var(--rsp-line)!important;
  border-radius:8px!important;
  box-shadow:var(--rsp-shadow)!important;
}

.public-about-page .icon-lg,
.public-about-page .icon-circle{
  background:var(--rsp-secondary)!important;
  color:var(--rsp-primary)!important;
}

.public-about-page .ribbon,
.public-about-page .ribbon.green{
  background:var(--rsp-secondary)!important;
  color:var(--rsp-ink)!important;
}

.public-about-page .ul-check i{color:var(--rsp-primary)!important}
.public-about-page .pricing p[style]{color:var(--rsp-muted)!important}
.public-about-page footer a,
.public-about-page footer .text-muted{color:var(--rsp-white)!important}

/* Pemulihan akun dan halaman utilitas */
.public-recovery-page,
.brand-page{
  min-height:100vh;
  background:var(--rsp-white)!important;
  color:var(--rsp-ink)!important;
}

.public-recovery-page .hero{
  background:var(--rsp-primary)!important;
  color:var(--rsp-white)!important;
}

.public-recovery-page .auth{background:var(--rsp-white)!important}
.public-recovery-page .card-auth,
.public-recovery-page > .card,
.brand-page .card{
  background:var(--rsp-white)!important;
  color:var(--rsp-ink)!important;
  border:1px solid var(--rsp-line)!important;
  border-radius:8px!important;
  box-shadow:var(--rsp-shadow)!important;
}

.public-recovery-page .brand-chip,
.public-recovery-page .logo-badge,
.public-recovery-page .badge-admin{
  background:var(--rsp-secondary)!important;
  color:var(--rsp-ink)!important;
  border-color:var(--rsp-secondary)!important;
}

.public-recovery-page .desc,
.public-recovery-page .hint,
.public-recovery-page .meta,
.public-recovery-page .form-label{
  color:var(--rsp-muted)!important;
}

.public-recovery-page .input-code{
  background:var(--rsp-white)!important;
  color:var(--rsp-ink)!important;
  border:1px solid var(--rsp-primary)!important;
}

.public-recovery-page .timer-bar{background:var(--rsp-primary)!important}
.brand-page .result-card,
.brand-page .description{
  background:var(--rsp-white)!important;
  color:var(--rsp-ink)!important;
  border:1px solid var(--rsp-line)!important;
  border-radius:8px!important;
  box-shadow:var(--rsp-shadow)!important;
}
.brand-page .total-score{color:var(--rsp-primary)!important}
.brand-page .btn-dashboard{
  background:var(--rsp-primary)!important;
  color:var(--rsp-white)!important;
  border-radius:8px!important;
}
.brand-page .steps li::before{
  background:var(--rsp-secondary)!important;
  color:var(--rsp-ink)!important;
}
@media(max-width:768px){
  .main-content{padding-left:16px!important;padding-right:16px!important}
  .card,.stat-card{box-shadow:0 8px 20px rgba(53,117,187,.1)!important}
  .public-auth-page .card{padding:22px 16px}
}