/* Yangi Bozor — kirish/ro'yxatdan o'tish sahifalari dizayni. */
:root{
  --brand:#4F46E5; --brand-dk:#4338CA; --brand-50:#EEF2FF;
  --ink:#0F172A; --ink-2:#334155; --mute:#64748B; --faint:#94A3B8;
  --line:#E2E8F0; --bg:#F8FAFC; --card:#fff; --soft:#F1F5F9;
  --err:#B91C1C; --err-50:#FEF2F2; --err-line:#FECACA;
  --info:#B45309; --info-50:#FFFBEB; --info-line:#FDE68A;
  --note:#1D4ED8; --note-50:#EFF6FF; --note-line:#BFDBFE;
}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--ink);font-family:'Plus Jakarta Sans',-apple-system,'Segoe UI',Roboto,sans-serif;font-size:14px;line-height:1.45;min-height:100vh;display:flex;align-items:center;justify-content:center;padding:40px 16px}
a{color:inherit}
.ic{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}
:focus-visible{outline:2px solid var(--brand);outline-offset:2px}

.auth-card{width:100%;max-width:560px;background:var(--card);border:1px solid var(--line);border-radius:20px;overflow:hidden;box-shadow:0 1px 3px rgba(15,23,42,.06)}
.auth-head{padding:26px 28px 18px;border-bottom:1px solid var(--line);text-align:center}
.auth-logo{display:inline-flex;align-items:center;gap:10px;margin-bottom:14px}
.auth-mark{width:40px;height:40px;border-radius:12px;background:var(--ink);color:#fff;font-weight:800;font-size:17px;display:flex;align-items:center;justify-content:center}
.auth-brand{display:block;text-align:left;font-size:19px;font-weight:800;letter-spacing:-.01em}
.auth-brand b{color:var(--brand)}
.auth-sub{display:block;text-align:left;font-size:10.5px;font-weight:700;color:var(--faint);letter-spacing:.03em;margin-top:1px}
.auth-head h1{margin:0;font-size:18px;font-weight:800;letter-spacing:-.01em}
.auth-head p{margin:5px 0 0;font-size:13px;color:var(--mute)}

.role-panel{background:var(--soft);border:1px solid var(--line);border-radius:14px;padding:10px;margin-bottom:18px}
.role-panel-label{font-size:11.5px;font-weight:700;color:var(--mute);padding:4px 6px 8px}
.role-tabs{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;background:#E2E8F0;padding:4px;border-radius:11px}
.role-radio{position:absolute;opacity:0;width:1px;height:1px;pointer-events:none}
.role-tab{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;padding:10px 4px;border-radius:9px;font-size:12px;font-weight:700;color:var(--mute);cursor:pointer;text-align:center;transition:background .12s,color .12s}
.role-radio:checked + .role-tab{background:#fff;color:var(--brand);box-shadow:0 1px 2px rgba(15,23,42,.08)}
.role-radio:focus-visible + .role-tab{outline:2px solid var(--brand);outline-offset:2px}
@media(min-width:480px){.role-tab{flex-direction:row}}

form{padding:24px 28px 28px}
.field{margin-bottom:16px}
.field label{display:block;font-size:12.5px;font-weight:700;color:var(--ink-2);margin-bottom:6px}
.field label .req{color:#E11D48}
.field input[type=text],.field input[type=tel],.field input[type=password],.field select{
  width:100%;padding:11px 14px;background:var(--soft);border:1px solid var(--line);border-radius:11px;
  font:inherit;font-size:13.5px;color:var(--ink);transition:border-color .12s,background .12s
}
.field input:focus,.field select:focus{outline:none;border-color:var(--brand);background:#fff;box-shadow:0 0 0 4px var(--brand-50)}
.field-row{display:grid;grid-template-columns:1fr 1fr;gap:14px}
@media(max-width:480px){.field-row{grid-template-columns:1fr}}

.hint-box{display:flex;align-items:flex-start;gap:9px;padding:11px 13px;border-radius:11px;font-size:12px;font-weight:500;line-height:1.5;margin-bottom:16px}
.hint-box.warn{background:var(--info-50);color:var(--info);border:1px solid var(--info-line)}
.hint-box.note{background:var(--note-50);color:var(--note);border:1px solid var(--note-line)}
.hint-box .ic{margin-top:1px}

.terms-row{display:flex;align-items:flex-start;gap:9px;margin:18px 0}
.terms-row input{margin-top:2px}
.terms-row label{font-size:11.5px;color:var(--mute);line-height:1.5}
.terms-row a{color:var(--brand);font-weight:700;text-decoration:underline}

.submit-btn{width:100%;display:flex;align-items:center;justify-content:center;gap:8px;height:46px;background:var(--brand);color:#fff;border:0;border-radius:12px;font:inherit;font-weight:700;font-size:14px;cursor:pointer;transition:background .12s}
.submit-btn:hover{background:var(--brand-dk)}

.auth-foot{text-align:center;font-size:12.5px;color:var(--mute);font-weight:500;margin-top:18px}
.auth-foot a{color:var(--brand);font-weight:700}
.auth-back{display:block;margin-top:8px;font-size:12px;color:var(--faint)}

.alert{border-radius:10px;padding:10px 14px;font-size:12.5px;font-weight:600;margin:0 28px 16px}
.alert-error{background:var(--err-50);color:var(--err);border:1px solid var(--err-line)}