/* ============================================================
   login.css — Auth Login Standalone
   Dipindah dari: auth/login.blade.php
   ============================================================ */
:root {
  --simace-green-900: #0D3E22;
  --simace-green-800: #14502F;
  --simace-green-700: #1B6B3F;
  --simace-green-600: #2E8157;
  --simace-green-500: #5AA383;
  --simace-green-100: #DDEAE0;
  --simace-green-50:  #ECF3EE;
  --simace-gold-700:  #B58A2A;
  --simace-gold-600:  #D4A03D;
  --simace-gold-500:  #E4AA38;
  --simace-gold-100:  #FAEDC4;
  --simace-maroon:    #A14545;
  --simace-paper:     #FFFFFF;
  --simace-surface:   #F8F6F0;
  --simace-surface-2: #F0EDE3;
  --simace-line:      #E8E3D2;
  --simace-ink-900:   #1E1F1A;
  --simace-ink-700:   #4A4B43;
  --simace-ink-500:   #7A7B70;
  --simace-ink-400:   #A3A498;
  --bs-body-font-family: 'Plus Jakarta Sans', system-ui, sans-serif;
  --bs-body-color: var(--simace-ink-900);
  --bs-body-bg: var(--simace-surface);
  --bs-primary: var(--simace-green-700);
  --bs-primary-rgb: 27, 107, 63;
  --bs-link-color: var(--simace-green-700);
  --bs-link-hover-color: var(--simace-green-900);
  --bs-border-color: var(--simace-line);
}
html { font-size: 16px; }
body { font-family: 'Plus Jakarta Sans', system-ui, sans-serif; color: var(--simace-ink-900); background: var(--simace-surface); margin: 0; overflow: hidden; }
body::before {
  content: ''; position: fixed; inset: 0; pointer-events: none; z-index: 0; opacity: .035;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='300' height='300' viewBox='0 0 300 300'><g fill='none' stroke='%2314502F' stroke-width='1.5'><path d='M50 150 Q50 100 100 100 Q150 100 150 50 Q150 100 200 100 Q250 100 250 150'/><circle cx='150' cy='150' r='40'/><path d='M150 110 Q120 150 150 190 Q180 150 150 110'/><circle cx='150' cy='150' r='6' fill='%2314502F'/></g></svg>");
  background-size: 360px;
}
h2 { font-family: 'Plus Jakarta Sans'; font-weight: 700; letter-spacing: -0.01em; color: var(--simace-green-900); }
.font-serif { font-family: 'Lora', Georgia, serif; }
.btn { font-weight: 600; border-radius: 8px; padding: .55rem 1rem; }
.btn-primary { background: var(--simace-green-700); border-color: var(--simace-green-700); }
.btn-primary:hover, .btn-primary:focus { background: var(--simace-green-800); border-color: var(--simace-green-800); }
.btn-outline-secondary { color: var(--simace-ink-700); border-color: var(--simace-line); background: var(--simace-paper); }
.btn-outline-secondary:hover { background: var(--simace-surface); color: var(--simace-green-900); border-color: var(--simace-green-700); }
.form-control {
  border-radius: 8px; border-color: var(--simace-line); padding: .65rem .9rem; font-size: 1rem;
  background: var(--simace-paper); color: var(--simace-ink-900);
}
.form-control:focus { border-color: var(--simace-green-700); box-shadow: 0 0 0 3px rgba(27,107,63,.12); }
.form-label { font-size: .8rem; font-weight: 600; color: var(--simace-ink-700); margin-bottom: .35rem; text-transform: uppercase; letter-spacing: .04em; }
.input-group-text { background: var(--simace-paper); border-color: var(--simace-line); color: var(--simace-ink-500); }
.login-stage {
  height: 100vh; display: grid; grid-template-columns: 1.05fr 1fr; background: var(--simace-paper);
  align-items: stretch; overflow: hidden;
}
@media (max-width: 900px) { .login-stage { grid-template-columns: 1fr; } .login-stage .side { display: none; } }
.login-stage .side {
  background: linear-gradient(160deg, var(--simace-green-900), var(--simace-green-700) 70%, var(--simace-green-600));
  color: #fff; padding: 3rem; position: relative; overflow: hidden; display: flex; flex-direction: column; justify-content: space-between;
}
.login-stage .side .motif {
  position: absolute; inset: 0; opacity: .12; pointer-events: none;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='240' height='240' viewBox='0 0 240 240'><g fill='none' stroke='%23F0E4B8' stroke-width='1.5'><path d='M40 120 Q40 80 80 80 Q120 80 120 40 Q120 80 160 80 Q200 80 200 120'/><circle cx='120' cy='120' r='28'/><path d='M120 92 Q100 120 120 148 Q140 120 120 92'/></g></svg>");
}
.login-stage .form-panel { padding: 3rem; display: flex; flex-direction: column; justify-content: center; overflow-y: auto; }
.login-stage .form-card { max-width: 420px; width: 100%; margin: 0 auto; }
.login-stage.has-bg-image .form-card {
  background: var(--simace-paper);
  border-radius: 16px;
  box-shadow: 0 8px 48px rgba(0,0,0,.14);
  padding: 2.5rem;
  border: 1px solid var(--simace-line);
}
@media (max-width: 991px) { .login-stage .form-panel { padding: 2rem 1.25rem; } }