/* ============================================================
   AUTH PAGES — split screen layout
   Dipakai bareng style.css (jangan hapus link ke style.css)
   ============================================================ */

.auth-shell{
  min-height:100vh;
  display:grid;
  grid-template-columns:1fr 1fr;
}

.auth-brand{
  background:var(--ink);
  color:var(--text-on-ink);
  padding:48px;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  position:relative;
  overflow:hidden;
}
.auth-brand::before{
  content:"";
  position:absolute; inset:0;
  background:radial-gradient(600px 300px at 90% 100%, rgba(201,162,39,0.18), transparent 60%);
  pointer-events:none;
}
.auth-brand-top .brand{ color:#fff; margin-bottom:56px; }
.auth-brand-quote{ max-width:380px; position:relative; }
.auth-brand-quote p{ font-family:var(--font-display); font-size:22px; line-height:1.4; margin-bottom:16px; }
.auth-brand-quote span{ font-family:var(--font-mono); font-size:12.5px; color:var(--text-on-ink-muted); }

.auth-form-side{
  display:flex;
  align-items:center;
  justify-content:center;
  padding:48px 24px;
}
.auth-form-box{ width:100%; max-width:400px; }
.auth-form-box h1{ font-size:26px; margin-bottom:6px; }
.auth-form-box .sub{ color:var(--text-muted); font-size:14.5px; margin-bottom:32px; }

.form-group{ margin-bottom:18px; }
.form-group label{
  display:block;
  font-size:13px;
  font-weight:500;
  margin-bottom:7px;
  color:var(--text);
}
.form-group input,
.form-group select{
  width:100%;
  padding:11px 14px;
  border:1px solid var(--border);
  border-radius:var(--radius-sm);
  font-size:14px;
  font-family:var(--font-body);
  background:var(--surface);
  transition:border-color .15s;
}
.form-group input:focus,
.form-group select:focus{
  outline:none;
  border-color:var(--ink);
}
.form-row{ display:grid; grid-template-columns:1fr 1fr; gap:14px; }

.form-hint{ font-size:12.5px; color:var(--text-muted); margin-top:6px; }
.form-error{
  background:#FDECEA;
  color:var(--red);
  border:1px solid #F5C6C0;
  padding:12px 14px;
  border-radius:var(--radius-sm);
  font-size:13.5px;
  margin-bottom:20px;
}
.form-success{
  background:#EAF7F1;
  color:var(--green);
  border:1px solid #C3E9D6;
  padding:12px 14px;
  border-radius:var(--radius-sm);
  font-size:13.5px;
  margin-bottom:20px;
}

.form-check{ display:flex; align-items:center; gap:8px; font-size:13.5px; color:var(--text-muted); margin-bottom:20px; }

.auth-submit{ width:100%; justify-content:center; padding:13px; margin-top:6px; }
.auth-footer-link{ text-align:center; font-size:13.5px; color:var(--text-muted); margin-top:24px; }
.auth-footer-link a{ color:var(--ink); font-weight:600; }

.status-badge{
  display:inline-flex; align-items:center; gap:6px;
  padding:6px 12px; border-radius:20px;
  font-size:12.5px; font-weight:500;
}
.status-badge.pending{ background:#FCF4DC; color:#8A6D14; }
.status-badge.verified{ background:#E2F5EA; color:#1F9D6C; }
.status-badge.rejected{ background:#FDECEA; color:var(--red); }

@media (max-width:860px){
  .auth-shell{ grid-template-columns:1fr; }
  .auth-brand{ display:none; }
}