/* ================================
   AUTH: Dark + Gold Theme
   ================================ */
.auth-page.auth-gold{
  min-height: 100vh;
  display: flex;
  align-items: center;
  position: relative;
  overflow: hidden;
}

/* Gold palette */
:root{
  --gold-300:#E7D8A6;
  --gold-400:#D9B872;
  --gold-500:#C7A059;
  --gold-600:#B38C43;
}

/* background dekoratif */
.auth-bg{
  position:absolute; inset:0; pointer-events:none;
  background:
    radial-gradient(60rem 40rem at 110% -10%, rgba(217,184,114,.08), transparent 60%),
    radial-gradient(50rem 30rem at -10% -20%, rgba(179,140,67,.08), transparent 55%),
    linear-gradient(180deg, rgba(13,18,32,1), rgba(12,16,28,1));
  z-index:0;
}
.auth-bg .orb{
  position:absolute; border-radius:50%;
  filter: blur(40px); opacity:.35; mix-blend-mode:screen;
}
.auth-bg .orb-1{ width:220px; height:220px; background:#D9B872; top:8%; left:-60px; }
.auth-bg .orb-2{ width:280px; height:280px; background:#C7A059; bottom:10%; right:-80px; }
.auth-bg .orb-3{ width:140px; height:140px; background:#B38C43; bottom:35%; left:10%; }

.auth-wrap{ position:relative; z-index:1; padding:32px 0; }
.auth-card{
  border: 1px solid rgba(217,184,114,.18);
  border-radius: 16px;
  background: rgba(15,18,30,.55);
  backdrop-filter: blur(8px);
  color:#e5e7eb;
  overflow:hidden;
}

/* panel hero */
.auth-hero{
  background:
    linear-gradient(145deg, rgba(217,184,114,.15), rgba(15,18,30,.6) 40%, rgba(15,18,30,.9));
  border-right: 1px solid rgba(217,184,114,.15);
}
.brand-dot{ width:12px; height:12px; border-radius:50%; background: var(--gold-400); box-shadow:0 0 0 4px rgba(217,184,114,.15); }
.brand-text{ font-weight:700; letter-spacing:.3px; }
.hero-title{ font-weight:800; color:#fff; }
.hero-sub{ color:#cbd5e1; opacity:.9; }
.text-soft{ color:#a5b4c4; }

/* label & link */
.form-label{ font-size:.9rem; color:#cbd5e1; margin-bottom:.35rem; }
.link-soft{ color:#9fb0c6; text-decoration:none; }
.link-soft:hover{ color:#c7d3e3; }
.link-gold{ color: var(--gold-400); text-decoration: none; }
.link-gold:hover{ color: var(--gold-300); }

/* input dengan ikon */
.input-icon-wrap{ position: relative; }
.input-icon{
  position:absolute; left:14px; top:50%; transform:translateY(-50%);
  color:#94a3b8; opacity:.9;
}
.with-icon{ padding-left:40px; }

/* input style */
.form-control-gold{
  height: 3rem;
  border-radius: .8rem;
  background: rgba(8,12,20,.55);
  border: 1px solid rgba(148,163,184,.25);
  color: #e5e7eb;
  transition: border-color .2s, box-shadow .2s, background .2s;
}
.form-control-gold::placeholder{ color:#7c8aa0; }
.form-control-gold:focus{
  background: rgba(10,14,22,.7);
  border-color: rgba(217,184,114,.55);
  box-shadow: 0 0 0 .2rem rgba(217,184,114,.18);
}

/* eye button */
.btn-eye{
  position:absolute; right:8px; top:50%; transform:translateY(-50%);
  width:38px; height:38px; border-radius:10px;
  border:1px solid rgba(148,163,184,.25);
  background: rgba(12,18,30,.6); color:#d1d5db;
  display:flex; align-items:center; justify-content:center;
  cursor:pointer;
}
.btn-eye:hover{ border-color: rgba(217,184,114,.45); }

/* tombol utama gold */
.btn-gold{
  height: 3.1rem;
  border-radius: .9rem;
  color: #0b1220;
  font-weight: 700;
  letter-spacing:.2px;
  background-image: linear-gradient(180deg, var(--gold-300), var(--gold-500));
  border: 0;
  box-shadow: 0 10px 22px rgba(217,184,114,.25);
  transition: transform .08s ease, filter .2s ease;
}
.btn-gold:hover{ filter: brightness(1.02); }
.btn-gold:active{ transform: translateY(1px); }

/* teks gold */
.text-gold-600{ color: var(--gold-400); }

/* kecilkan card di device kecil */
@media (max-width: 575.98px){
  .auth-wrap{ padding: 20px 0; }
  .auth-card{ border-radius: 14px; }
}
/* ===== Auth Register helpers ===== */
ul { list-style: none; padding-left: 0; }
ul li::before{
  content: '•'; color: var(--gold-400); margin-right: .5rem; font-weight: 700;
}
.is-invalid { border-color: #ef4444 !important; }
#passHint { font-size: .825rem; }

/* tombol eye “aktif” (opsional efek) */
.btn-eye.on { border-color: rgba(217,184,114,.55); }