/* ============================================
   CRYPLAND – AUTH CSS
   ============================================ */
:root {
  --primary: #00d4aa;
  --bg-dark: #0a0e1a;
  --bg-card: #111827;
  --bg-card2: #1a2035;
  --border: #1e2d42;
}
* { box-sizing: border-box; }
body.auth-body { font-family: 'Inter', sans-serif; background: var(--bg-dark); min-height: 100vh; overflow-x: hidden; }
.auth-container { display: flex; min-height: 100vh; }
.auth-left {
  width: 45%; background: linear-gradient(135deg, #0d1a2e 0%, #0a0e1a 100%);
  border-right: 1px solid var(--border);
  display: flex; align-items: center; justify-content: center;
  padding: 48px; position: relative; overflow: hidden;
}
.auth-left::before {
  content: ''; position: absolute; inset: 0;
  background: radial-gradient(ellipse 80% 80% at 20% 50%, rgba(0,212,170,0.08) 0%, transparent 70%);
}
.auth-left-content { position: relative; z-index: 1; }
.auth-logo h3 { color: #fff; font-weight: 800; margin: 0; }
.auth-logo small { color: var(--primary); font-size: 13px; }
.auth-left h2 { font-size: 2rem; font-weight: 800; line-height: 1.3; }
.auth-feature-item { padding: 6px 0; font-size: 14px; color: #d1d5db; }
.auth-stats h4 { font-size: 1.6rem; font-weight: 800; }
.auth-right {
  flex: 1; display: flex; align-items: center; justify-content: center;
  padding: 24px; background: var(--bg-dark);
}
.auth-card {
  width: 100%; max-width: 460px;
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: 16px;
  padding: 36px 32px;
  box-shadow: 0 20px 60px rgba(0,0,0,0.4);
}
.auth-card h5 { color: #fff; font-weight: 700; }
.form-label { color: #d1d5db; font-size: 13px; font-weight: 500; }
.form-control, .form-select {
  background: #1a2035 !important; border-color: #1e2d42 !important;
  color: #e2e8f0 !important; border-radius: 10px;
}
.form-control:focus, .form-select:focus {
  border-color: var(--primary) !important;
  box-shadow: 0 0 0 3px rgba(0,212,170,0.12) !important;
}
.form-control::placeholder { color: #4b5563 !important; }
.input-group-text { background: #1a2035 !important; border-color: #1e2d42 !important; color: #6b7280 !important; }
.btn-primary { background: var(--primary) !important; border-color: var(--primary) !important; color: #0a0e1a !important; font-weight: 700; border-radius: 10px; }
.btn-primary:hover { background: #00b894 !important; }
.auth-divider { position: relative; text-align: center; color: #4b5563; }
.auth-divider::before, .auth-divider::after { content: ''; position: absolute; top: 50%; width: 42%; height: 1px; background: #1e2d42; }
.auth-divider::before { left: 0; } .auth-divider::after { right: 0; }
.alert-success { background: rgba(0,200,81,0.1); border-color: rgba(0,200,81,0.3); color: #00c851; }
.alert-danger  { background: rgba(255,68,68,0.1); border-color: rgba(255,68,68,0.3); color: #ff6666; }
.form-check-input { background-color: #1a2035; border-color: #374151; }
.form-check-label { color: #9ca3af; font-size: 13px; }
.otp-digit { width: 48px !important; font-size: 1.3rem; background: #1a2035 !important; border-color: #1e2d42 !important; color: #fff !important; border-radius: 10px; }
.otp-digit:focus { border-color: var(--primary) !important; }
