/* ══════════════════════════════════════
   auth.css — Авторизация
   ══════════════════════════════════════ */

* { margin:0; padding:0; box-sizing:border-box; }
body { font-family:'Inter',sans-serif; background:#09090b; color:#fafafa; min-height:100vh; display:flex; align-items:center; justify-content:center; }
a { color:#a78bfa; text-decoration:none; }
a:hover { color:#c4b5fd; }

.auth-wrapper { width:100%; max-width:420px; padding:24px; }
.auth-logo { text-align:center; margin-bottom:32px; }
.auth-logo h1 { font-size:28px; font-weight:700; display:flex; align-items:center; justify-content:center; gap:10px; }
.auth-logo svg { width:32px; height:32px; color:#7c3aed; }

.auth-card { background:#18181b; border:1px solid #27272a; border-radius:16px; padding:32px; }
.auth-card h2 { font-size:22px; font-weight:600; margin-bottom:8px; text-align:center; }
.auth-card .subtitle { text-align:center; color:#71717a; font-size:14px; margin-bottom:24px; }

.form-group { margin-bottom:16px; }
.form-group label { display:block; color:#a1a1aa; font-size:13px; font-weight:500; margin-bottom:6px; }
.form-control { width:100%; padding:12px 16px; background:#09090b; border:1px solid #27272a; border-radius:10px; color:#fafafa; font-size:15px; font-family:inherit; transition:border-color .15s; }
.form-control:focus { outline:none; border-color:#7c3aed; }
.form-control-code { text-align:center; font-size:24px; letter-spacing:8px; font-weight:600; }

.btn { display:block; width:100%; padding:12px; border-radius:10px; font-size:15px; font-weight:600; border:none; cursor:pointer; font-family:inherit; transition:all .15s; }
.btn-primary { background:#7c3aed; color:#fff; }
.btn-primary:hover { background:#6d28d9; }
.btn-primary:disabled { opacity:.6; cursor:not-allowed; }
.btn-primary .spinner { display:inline-block; width:16px; height:16px; border:2px solid rgba(255,255,255,.3); border-top-color:#fff; border-radius:50%; animation:spin .6s linear infinite; vertical-align:middle; margin-right:6px; }
@keyframes spin { to { transform:rotate(360deg); } }
.btn-link { background:transparent; color:#71717a; font-size:13px; margin-top:12px; }
.btn-link:hover { color:#a78bfa; }

.form-control.is-invalid, .form-control.is-invalid:focus { border-color:#ef4444; box-shadow:0 0 0 1px rgba(239,68,68,.25); animation:shake .3s ease; outline:none; }
.form-error { color:#f87171; font-size:12px; margin-top:4px; display:none; }
.form-error.show { display:block; }
@keyframes shake { 0%,100%{transform:translateX(0)} 25%{transform:translateX(-4px)} 50%{transform:translateX(4px)} 75%{transform:translateX(-4px)} }

.error-msg { background:rgba(239,68,68,.12); color:#f87171; padding:10px 14px; border-radius:8px; margin-bottom:16px; font-size:14px; border:1px solid rgba(239,68,68,.2); }
.info-msg { background:rgba(124,58,237,.1); color:#a78bfa; padding:10px 14px; border-radius:8px; margin-bottom:16px; font-size:14px; border:1px solid rgba(124,58,237,.2); }
.debug-msg { background:rgba(34,197,94,.1); color:#4ade80; padding:10px 14px; border-radius:8px; margin-bottom:16px; font-size:13px; font-family:monospace; border:1px solid rgba(34,197,94,.2); }

.timer { text-align:center; color:#71717a; font-size:13px; margin-top:12px; }
.timer span { color:#a78bfa; font-weight:600; }