/* Auth page styles — extracted verbatim from design-reference/files/page-auth.html */
body{background:var(--page);}
.authpage{min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:40px 24px;position:relative;overflow:hidden;}
.orb{position:absolute;border-radius:50%;filter:blur(60px);pointer-events:none;}
.o1{top:-130px;right:-90px;width:340px;height:340px;background:radial-gradient(circle,rgba(91,91,239,.16),transparent 70%);}
.o2{bottom:-150px;left:-90px;width:320px;height:320px;background:radial-gradient(circle,rgba(217,119,6,.10),transparent 70%);}
.brandrow{position:relative;margin-bottom:20px;}
.brandrow img{height:28px;display:block;}
.card{position:relative;width:100%;max-width:400px;background:#fff;border:1px solid var(--line2);border-radius:var(--r-card);padding:28px;}
.steps{display:flex;gap:6px;margin-bottom:20px;}
.steps .s{flex:1;height:4px;border-radius:999px;background:var(--line);}
.steps .s.on{background:var(--primary);}
.card h1{font-size:21px;font-weight:800;letter-spacing:-.02em;}
.card .sub{color:var(--muted);font-size:14px;margin:7px 0 22px;line-height:1.5;}

.field{margin-bottom:15px;}
.field label{display:block;font-size:13px;font-weight:700;color:var(--ink);margin-bottom:6px;}
.field .req{color:var(--danger);}
.field .opt{color:var(--muted);font-weight:400;font-size:12px;}
.field .hint{font-size:12px;color:var(--muted);margin-top:6px;}
.inp{display:flex;align-items:center;gap:9px;border:1.5px solid var(--line2);border-radius:var(--r-btn);padding:0 12px;background:#fff;height:46px;}
.inp:focus-within{border-color:var(--primary);box-shadow:0 0 0 3px var(--primary-100);}
.ta{width:100%;border:1.5px solid var(--line2);border-radius:var(--r-btn);padding:12px 14px;font-size:15px;font-family:inherit;color:var(--ink);background:#fff;resize:vertical;line-height:1.5;}
.ta:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 3px var(--primary-100);}
.ok-msg{background:var(--success-bg);color:var(--success);border-radius:var(--r-btn);padding:12px 14px;font-size:13.5px;font-weight:600;margin-bottom:16px;}
.inp i{color:var(--muted);width:17px;height:17px;flex:none;}
.inp input{border:none;outline:none;flex:1;font-size:15px;font-family:inherit;color:var(--ink);background:none;height:100%;}
.inp .prefix{font-weight:700;color:var(--body);font-size:15px;border-right:1px solid var(--line2);padding-right:10px;}
.checkbox{display:flex;gap:10px;align-items:flex-start;font-size:13.5px;color:var(--body);cursor:pointer;margin-bottom:16px;}
.checkbox input{margin-top:2px;width:16px;height:16px;accent-color:var(--primary);flex:none;}
.divider{display:flex;align-items:center;gap:12px;color:var(--muted);font-size:13px;margin:14px 0;}
.divider:before,.divider:after{content:"";flex:1;height:1px;background:var(--line);}
.legal{font-size:11.5px;color:var(--muted);text-align:center;line-height:1.5;margin:14px 0 0;}
.legal a{color:var(--primary-d);}
.otp{display:flex;gap:9px;}
.otp .b{flex:1;height:52px;display:flex;align-items:center;justify-content:center;font-size:21px;font-weight:800;border:1.5px solid var(--line2);border-radius:var(--r-btn);color:var(--ink);}
.otp .b.f{border-color:var(--primary);box-shadow:0 0 0 3px var(--primary-100);}
.otp .b.cursor{border-color:var(--primary);}
.resend{display:flex;justify-content:space-between;align-items:center;font-size:13px;margin-top:15px;}
.linkb{background:none;border:none;color:var(--primary-d);font-weight:700;cursor:pointer;font-family:inherit;font-size:13px;padding:0;}
.trust{position:relative;margin-top:18px;display:flex;gap:16px;flex-wrap:wrap;justify-content:center;color:var(--muted);font-size:12.5px;font-weight:600;}
.trust span{display:inline-flex;align-items:center;gap:6px;}
.trust i{width:14px;height:14px;color:var(--success);}

/* Error state */
.err-msg{font-size:13px;color:var(--danger);margin:0 0 14px;padding:10px 12px;background:var(--danger-bg);border-radius:var(--r-btn);}

/* Split auth layout (per Login Page design): brand panel left, form right */
.ap-root{min-height:100vh;display:grid;grid-template-columns:1.08fr 1fr;background:var(--page);}
.ap-brand{position:relative;overflow:hidden;background:linear-gradient(150deg,#5B5BEF 0%,#3730A5 52%,#1E1B4B 100%);color:#fff;padding:60px 56px;display:flex;flex-direction:column;justify-content:center;gap:34px;}
.ap-quote{max-width:440px;}
.ap-glow{position:absolute;border-radius:50%;pointer-events:none;}
.ap-glow.g1{top:-160px;right:-120px;width:460px;height:460px;background:radial-gradient(circle,rgba(255,255,255,.18),rgba(255,255,255,0) 68%);}
.ap-glow.g2{bottom:-180px;left:-150px;width:440px;height:440px;background:radial-gradient(circle,#818CF8,rgba(0,0,0,0) 66%);opacity:.55;}
.ap-mark{position:absolute;right:-46px;bottom:-52px;width:290px;opacity:.12;filter:brightness(0) invert(1);pointer-events:none;}
.ap-logo{position:relative;height:30px;align-self:flex-start;filter:brightness(0) invert(1);display:block;}
.ap-mid{position:relative;}
.ap-kicker{font-size:13px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:#C7D2FE;}
.ap-mid h1{font-size:clamp(28px,3.2vw,40px);font-weight:800;letter-spacing:-.025em;line-height:1.1;margin:16px 0 0;color:#fff;}
.ap-tamil{font-family:'Noto Sans Tamil',Inter,sans-serif;font-size:17px;font-weight:600;color:rgba(255,255,255,.72);margin-top:12px;}
.ap-lead{font-size:16.5px;line-height:1.6;color:rgba(255,255,255,.82);margin:18px 0 0;max-width:410px;}
.ap-checks{display:flex;flex-direction:column;gap:14px;margin-top:34px;}
.ap-check{display:flex;align-items:center;gap:12px;font-size:15px;font-weight:600;color:rgba(255,255,255,.94);}
.ap-check .ic{width:32px;height:32px;flex:none;border-radius:8px;background:rgba(255,255,255,.16);color:#fff;display:inline-flex;align-items:center;justify-content:center;}
.ap-check .ic svg{width:16px;height:16px;stroke-width:3;}
.ap-quote{position:relative;background:rgba(255,255,255,.10);border:1px solid rgba(255,255,255,.16);border-radius:14px;padding:22px 24px;}
.ap-quote p{font-size:15px;line-height:1.6;color:#fff;margin:0;font-weight:500;}
.ap-who{display:flex;align-items:center;gap:12px;margin-top:16px;}
.ap-who .av{width:38px;height:38px;flex:none;border-radius:50%;background:rgba(255,255,255,.2);color:#fff;font-weight:700;display:inline-flex;align-items:center;justify-content:center;}
.ap-who .nm{font-weight:700;font-size:13.5px;line-height:1.35;}
.ap-who .rl{font-size:12px;color:rgba(255,255,255,.7);line-height:1.35;}
.ap-form{position:relative;display:flex;align-items:center;justify-content:center;padding:48px 40px;background:var(--page);overflow:hidden;}
.ap-fglow{position:absolute;top:-120px;right:-90px;width:340px;height:340px;border-radius:50%;background:radial-gradient(circle,rgba(91,91,239,.12),transparent 70%);pointer-events:none;}
.ap-panel{position:relative;width:100%;max-width:400px;}
.ap-mhead{display:none;align-items:center;justify-content:center;gap:10px;margin-bottom:30px;}
.ap-panel h1.ap-h{font-size:24px;font-weight:800;letter-spacing:-.02em;color:var(--ink);margin:0;}
.ap-panel .sub{color:var(--muted);font-size:15px;margin:8px 0 0;line-height:1.6;}
.ap-panel form{margin-top:26px;}
.ap-back{display:inline-flex;align-items:center;gap:6px;background:none;border:none;padding:0;margin:0 0 18px;cursor:pointer;color:var(--muted);font-size:13px;font-weight:600;text-decoration:none;}
.ap-back:hover{color:var(--primary);}
.ap-back svg{width:16px;height:16px;}
.ap-secure{display:flex;align-items:center;justify-content:center;gap:8px;margin-top:28px;color:var(--muted);font-size:12px;}
.ap-secure svg{width:14px;height:14px;}
@media(max-width:900px){
  .ap-root{grid-template-columns:1fr;}
  .ap-brand{display:none;}
  .ap-mhead{display:flex;}
  .ap-form{padding:44px 24px;}
}

/* Submit-button loading spinner (btnloader.js adds .is-loading on submit) */
.btn.is-loading{position:relative;color:transparent !important;pointer-events:none;}
.btn.is-loading svg{visibility:hidden;}
.btn.is-loading::after{content:"";position:absolute;top:50%;left:50%;width:18px;height:18px;margin:-9px 0 0 -9px;border:2.5px solid rgba(255,255,255,.35);border-top-color:#fff;border-radius:50%;animation:btnspin .7s linear infinite;}
.btn-outline.is-loading::after{border-color:rgba(91,91,239,.25);border-top-color:var(--primary);}
@keyframes btnspin{to{transform:rotate(360deg);}}
