@import url('https://fonts.googleapis.com/css2?family=Hind+Siliguri:wght@400;500;600;700&family=Noto+Sans+Bengali:wght@400;500;600;700&display=swap');
:root{--blue:#0868ef;--blue2:#005be8;--navy:#08285f;--text:#536c93;--muted:#8290a6;--line:#d5e1ed;--soft:#eff8ff;--white:#fff;--shadow:0 18px 44px rgba(10,58,124,.08)}
*{box-sizing:border-box}html,body{margin:0;padding:0;min-width:0}html{-webkit-text-size-adjust:100%}body{font-family:'Hind Siliguri','Noto Sans Bengali',sans-serif;color:var(--navy);background:#eef7fd;overflow-x:hidden}img{display:block;max-width:100%}a{text-decoration:none;color:inherit}button,input,select,textarea{font:inherit}button{cursor:pointer}.desktop-only{display:block}.mobile-only{display:none}
.auth-bg{min-height:100vh;position:relative;overflow:hidden;background:radial-gradient(circle at -5% 20%,rgba(161,210,255,.35) 0 13%,transparent 13%),radial-gradient(circle at 70% -5%,rgba(161,210,255,.20) 0 15%,transparent 15%),radial-gradient(circle at 104% 12%,rgba(161,210,255,.24) 0 12%,transparent 12%),linear-gradient(#eef8ff,#f8fbff)}
.auth-bg:before,.auth-bg:after{content:'';position:absolute;border-radius:50%;background:rgba(162,210,252,.15);pointer-events:none}.auth-bg:before{width:420px;height:420px;left:-270px;top:105px}.auth-bg:after{width:420px;height:420px;right:-280px;top:24px}
.logo{object-fit:contain}.login-top{width:min(calc(100% - 180px),1334px);height:76px;margin:auto;display:flex;align-items:center;justify-content:space-between;position:relative;z-index:2}.login-top .logo{width:122px;height:auto}.login-top .links{display:flex;align-items:center;gap:18px;font-size:15px;font-weight:600}.sep{color:#bdcddd}.lang-link{color:#5b739a;transition:color .18s ease}.lang-link:hover{color:#0967ec}.lang-link.is-active{color:#001a55;font-weight:700;text-decoration:underline;text-underline-offset:4px}
.login-card{width:min(calc(100% - 180px),1354px);height:min(884px,calc(100dvh - 140px));height:min(884px,calc(100vh - 140px));margin:16px auto 48px;display:grid;grid-template-columns:53.6% 46.4%;background:#fff;border:1px solid #dce7f1;border-radius:25px;overflow:hidden;box-shadow:var(--shadow);position:relative;z-index:1}.login-art{width:100%;height:100%;object-fit:fill}.login-panel{padding:54px 35px 36px;display:flex;flex-direction:column;min-width:0;overflow-y:auto}.eyebrow{font-size:16px;color:#0768ec;font-weight:600;margin-bottom:17px}.login-panel h1{margin:0;font-size:36px;line-height:1.12;font-weight:700;letter-spacing:-.25px}.login-panel>.sub{margin-top:11px;color:#7e8da4;font-size:17px;font-weight:500;line-height:1.35}.login-socials{display:grid;gap:15px;margin-top:34px}.social{height:61px;border:1.3px solid #d4deea;border-radius:12px;background:#fff;color:#101f42;display:flex;align-items:center;justify-content:center;gap:14px;font-size:18px;font-weight:600}.social img{width:27px;height:27px;object-fit:contain}.fbblue{background:linear-gradient(90deg,#0d6cf0,#0059e8);border-color:#0d66ed;color:#fff}.divide{display:grid;grid-template-columns:1fr auto 1fr;gap:18px;align-items:center;color:#71839e;font-size:16px;font-weight:500;margin:22px 0 18px}.divide:before,.divide:after{content:'';height:1px;background:#d5dfeb}.login-form,.reg-form{display:grid;gap:17px}.login-form{margin-top:26px}.field{min-width:0}.field label{display:block;font-size:16px;font-weight:400;margin-bottom:7px;line-height:1.15}.control{height:54px;border:1.3px solid #d0dce8;border-radius:11px;background:#fff;display:flex;align-items:center;gap:12px;padding:0 15px;min-width:0}.control input,.control select,.control textarea{border:0;outline:0;background:transparent;width:100%;min-width:0;height:100%;font-size:16px;color:#243a61}.control input::placeholder,.control textarea::placeholder{color:#8b9ab0}.icon{display:flex;align-items:center;justify-content:center;color:#7c8ba5;flex:0 0 auto}.icon svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:2}.eye{margin-left:auto}.remember{display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:16px;font-weight:400}.remember .left{display:flex;align-items:center;gap:10px}.box{width:23px;height:23px;border:1.6px solid #99aac1;border-radius:5px;background:#fff;flex:0 0 auto}.remember a,.foot a,.checkline a{color:#0768ed;text-decoration:none}.btn{width:100%;height:60px;border:0;border-radius:12px;display:flex;align-items:center;justify-content:center;gap:12px;font-size:18px;font-weight:600}.btn.primary{background:linear-gradient(90deg,#0d6cf0,#0059e8);color:#fff}.btn svg{width:23px;height:23px;fill:none;stroke:currentColor;stroke-width:2}.foot{text-align:center;color:#677a97;font-size:16px;font-weight:500}.policy{margin-top:auto;text-align:center;color:#929fb1;font-size:15px;padding-top:16px}
/* customer registration desktop */
.reg-desktop{width:100%;min-height:100vh;display:grid;grid-template-columns:minmax(0,1fr) minmax(560px,740px);align-items:stretch;gap:0;position:relative;z-index:1}.reg-left{width:100%;height:100vh;min-height:820px;object-fit:cover;object-position:center}.reg-card{background:#fff;margin:32px 34px 32px 0;border:1px solid #e2ebf4;border-radius:24px;padding:30px 34px 25px;box-shadow:var(--shadow);align-self:center}.reg-card h1,.mobile-reg-card h2{margin:0;text-align:center;font-size:36px;line-height:1.08;font-weight:700}.subtitle{text-align:center;color:#7b8ba3;font-size:18px;font-weight:500;margin-top:7px}.tabs{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:18px}.tab{min-height:112px;border:1.5px solid #e4ebf4;border-radius:16px;background:#fff;position:relative;padding:16px;display:flex;align-items:center;gap:14px;transition:border-color .18s ease,box-shadow .18s ease,transform .18s ease,background-color .18s ease}.tab:hover{border-color:#b7d2f2;box-shadow:0 10px 22px rgba(16,58,110,.08);transform:translateY(-1px)}.tab.active{border-color:#0a68ef;background:linear-gradient(180deg,#f2f8ff,#fff);box-shadow:0 12px 26px rgba(8,104,239,.14)}.tab.blue{background:linear-gradient(90deg,#106eef,#0058e8);border-color:#0869ed;color:#fff}.tab .round{width:58px;height:58px;border-radius:16px;background:#f2f6fb;color:#5b739a;display:flex;align-items:center;justify-content:center;flex:0 0 auto;transition:background-color .18s ease,color .18s ease,box-shadow .18s ease}.tab.active .round{background:linear-gradient(140deg,#1372f2,#0a5ae0);color:#fff;box-shadow:0 8px 16px rgba(10,104,239,.26)}.tab.blue .round{background:rgba(255,255,255,.16);color:#fff}.round svg{width:28px;height:28px;fill:none;stroke:currentColor;stroke-width:1.9}.tab h3{margin:0;font-size:21px;line-height:1.2;font-weight:400;color:#1a2c4b}.tab.active h3{color:#0a68ef}.tab p{margin:4px 0 0;color:#7b8ba3;font-size:14px;line-height:1.3;font-weight:400}.tab.blue p{color:#edf4ff}.tick{position:absolute;right:12px;top:12px;width:24px;height:24px;border-radius:50%;background:#0a68ef;color:#fff;display:flex;align-items:center;justify-content:center;box-shadow:0 4px 10px rgba(10,104,239,.3)}.tick svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:3.2}.reg-socials{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:18px}.reg-form .twocol,.twocol{display:grid;grid-template-columns:1fr 1fr;gap:16px}.control.phone{padding:0}.code{height:100%;min-width:118px;border-right:1.3px solid #d0dce8;display:flex;align-items:center;justify-content:center;color:#263a60;font-size:16px;font-weight:600;white-space:nowrap}.control.phone input{padding:0 15px}.note{color:#8b98ad;font-size:13px;margin-top:5px}.checkline{display:flex;align-items:flex-start;gap:11px;font-size:16px;font-weight:500;line-height:1.35}.checkline .box{margin-top:1px}.vendor-page{padding:18px 0 30px}.vendor-wrap{width:min(calc(100% - 54px),820px);margin:auto;position:relative;z-index:2}.vendor-headbar{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px}.vendor-headbar .logo{height:60px;width:auto}.lang{font-size:18px;font-weight:600}.vendor-content{background:#fff;border:1px solid #e1eaf3;border-radius:20px;padding:15px 18px 20px;box-shadow:var(--shadow)}.vendor-content>.tabs{margin-top:0}.vendor-title{font-size:34px;line-height:1.1;margin:18px 0 0;font-weight:700}.vendor-sub{color:#72839d;font-size:17px;font-weight:500;margin:4px 0 16px}.section{border:1px solid #dce7f1;border-radius:15px;overflow:hidden;margin-top:14px;background:#fff}.section-head{height:58px;background:#f3f8fc;display:flex;align-items:center;gap:14px;padding:0 16px;border-bottom:1px solid #e2ebf4}.section-num{width:44px;height:44px;border-radius:50%;background:#0870f3;color:#fff;display:flex;align-items:center;justify-content:center;font-size:20px;font-weight:700;flex:0 0 auto}.section-head h3{font-size:22px;margin:0;font-weight:700}.section-body{padding:14px 16px 16px}.control.area{height:92px;align-items:flex-start;padding-top:12px}.control.area textarea{resize:none;height:65px}.upload{height:76px;border:1.4px dashed #aebfd4;border-radius:11px;display:flex;align-items:center;justify-content:center;text-align:center}.upload svg{width:29px;height:29px;fill:none;stroke:#607494;stroke-width:2}.upload strong{display:block;font-size:16px}.upload small{display:block;color:#7587a3;font-size:12px;margin-top:2px}.vendor-bottom{display:grid;gap:13px;margin-top:14px}.vendor-socials{display:grid;grid-template-columns:1fr 1fr;gap:12px}
/* mobile exact customer layout */
.mobile-reg{min-height:100vh}.mobile-top-image{width:100%;height:auto}.mobile-reg-card{margin:-4px 18px 0;background:#fff;border:1px solid #e5edf5;border-bottom:0;border-radius:25px 25px 0 0;padding:22px 20px 28px;box-shadow:0 -8px 30px rgba(18,68,127,.08);position:relative;z-index:3}.mobile-reg-card h2{font-size:30px}.mobile-reg-card .subtitle{font-size:16px}.mobile-reg-card .tabs{gap:18px}.mobile-reg-card .tab{display:block;text-align:center;min-height:121px;padding:13px 10px}.mobile-reg-card .tab .round{width:70px;height:70px;margin:0 auto 7px}.mobile-reg-card .tab h3{font-size:21px}.mobile-reg-card .tab p{font-size:14px;margin-top:3px}.mobile-reg-card .reg-socials{gap:18px}.mobile-reg-card .social{font-size:17px;height:57px}.mobile-reg-card .divide{margin:17px 0}.mobile-reg-card .reg-form{gap:16px}.mobile-reg-card .field label{font-size:17px}.mobile-reg-card .control{height:59px;border-radius:10px}.mobile-reg-card .control input{font-size:16px}.mobile-reg-card .control.phone .code{min-width:125px}.mobile-reg-card .checkline{font-size:16px}.mobile-reg-card .btn{height:60px}.mobile-reg-card .foot{font-size:16px}
/* tablet */
@media(max-width:1180px) and (min-width:769px){.login-top,.login-card{width:calc(100% - 64px)}.login-card{height:min(760px,calc(100dvh - 140px));height:min(760px,calc(100vh - 140px));grid-template-columns:48% 52%}.login-panel{padding:40px 34px 30px}.login-panel h1{font-size:31px}.reg-desktop{grid-template-columns:44% 56%}.reg-card{margin:24px 24px 24px 0;padding:24px 24px 22px}.reg-card h1{font-size:32px}.reg-left{min-height:850px}.tab{padding:14px}.tab .round{width:64px;height:64px}.tab h3{font-size:21px}.reg-form .twocol{gap:12px}.control{height:52px}}
/* mobile */
@media(max-width:768px){.desktop-only{display:none!important}.mobile-only{display:block!important}.auth-bg{background:radial-gradient(circle at -18% 15%,rgba(158,208,255,.34) 0 18%,transparent 18%),radial-gradient(circle at 110% 3%,rgba(158,208,255,.22) 0 16%,transparent 16%),linear-gradient(#eff8ff,#fbfdff)}.login-top{width:calc(100% - 28px);height:68px}.login-top .logo{width:112px}.login-top .links{font-size:13px;gap:10px}.login-card{width:calc(100% - 24px);height:auto;margin:0 auto 24px;display:block;border-radius:20px}.login-art{height:auto;aspect-ratio:1.1/1;object-fit:fill}.login-panel{padding:22px 18px 25px}.eyebrow{font-size:14px;margin-bottom:8px}.login-panel h1{font-size:30px}.login-panel>.sub{font-size:15px;margin-top:7px}.login-socials{gap:11px;margin-top:18px}.social{height:54px;font-size:16px}.divide{font-size:14px;margin:16px 0}.field label{font-size:16px}.control{height:58px}.control input,.control select,.control textarea{font-size:16px}.remember{font-size:15px;align-items:flex-start;flex-direction:column}.btn{height:56px;font-size:17px}.foot{font-size:15px}.policy{font-size:13px}.vendor-page{padding:0 0 20px}.vendor-wrap{width:100%;padding:0 12px}.vendor-headbar{padding:10px 2px 8px}.vendor-headbar .logo{height:52px}.lang{font-size:16px}.vendor-content{border-radius:17px;padding:10px 12px 16px}.vendor-content .tabs{gap:12px}.vendor-content .tab{min-height:90px;padding:10px 12px}.vendor-content .tab .round{width:58px;height:58px}.vendor-content .tab h3{font-size:18px}.vendor-content .tab p{font-size:12px}.vendor-title{font-size:29px;margin-top:14px}.vendor-sub{font-size:15px;margin-bottom:12px}.section{margin-top:11px}.section-head{height:52px;padding:0 12px}.section-num{width:40px;height:40px;font-size:18px}.section-head h3{font-size:19px}.section-body{padding:12px}.vendor-content .twocol{gap:10px}.vendor-content .field label{font-size:14px}.vendor-content .control{height:52px;padding:0 11px;gap:8px}.vendor-content .control input,.vendor-content .control select,.vendor-content .control textarea{font-size:13px}.vendor-content .code{min-width:105px;font-size:13px}.vendor-content .control.area{height:88px}.vendor-content .upload{height:70px}.vendor-bottom .checkline{font-size:14px}.vendor-bottom .btn{height:54px;font-size:17px}.vendor-socials .social{height:52px;font-size:15px}.vendor-bottom .divide{font-size:14px;margin:4px 0}.vendor-bottom .foot{font-size:14px}}
@media(max-width:430px){.mobile-reg-card{margin-left:10px;margin-right:10px;padding:18px 14px 24px}.mobile-reg-card h2{font-size:27px}.mobile-reg-card .tabs,.mobile-reg-card .reg-socials{gap:10px}.mobile-reg-card .tab{padding:11px 7px}.mobile-reg-card .tab .round{width:62px;height:62px}.mobile-reg-card .tab h3{font-size:19px}.mobile-reg-card .tab p{font-size:12px}.mobile-reg-card .social{font-size:15px;gap:8px}.mobile-reg-card .social img{width:23px;height:23px}.mobile-reg-card .control.phone .code{min-width:108px}.mobile-reg-card .checkline{font-size:14px}.vendor-content .twocol{grid-template-columns:1fr}.vendor-content .field[style*="margin-top"]{margin-top:10px!important}.vendor-socials{grid-template-columns:1fr 1fr}.login-top .links a:first-child{font-size:0}.login-top .links a:first-child svg{width:19px;height:19px}}
@media(max-width:360px){.tabs{grid-template-columns:1fr 1fr}.mobile-reg-card .tab p{display:none}.vendor-content .tabs{grid-template-columns:1fr 1fr}.vendor-content .tab p{display:none}.vendor-socials{grid-template-columns:1fr}.reg-socials{grid-template-columns:1fr}.login-socials{grid-template-columns:1fr}}
/* functional auth additions */
.control.has-error{border-color:#e02b2b}.has-error .icon{color:#e02b2b}
.field-error{color:#e02b2b;font-size:14px;font-weight:500;margin-top:6px}
.auth-banner{padding:12px 14px;border-radius:10px;font-size:15px;font-weight:600;margin-bottom:16px;line-height:1.5}
.auth-banner--success{background:#e9f9ef;color:#157a3d;border:1px solid #bfe9cf}
.auth-banner--error{background:#fdecec;color:#c02727;border:1px solid #f5c2c2}
.auth-alert{position:fixed;top:20px;left:50%;transform:translateX(-50%);z-index:90;display:flex;align-items:flex-start;gap:12px;width:min(520px,calc(100% - 28px));padding:14px 46px 14px 15px;background:#fff;border:1px solid transparent;border-radius:15px;font-size:15px;line-height:1.5;box-shadow:0 18px 40px rgba(11,32,64,.18);animation:auth-alert-in .32s cubic-bezier(.2,.8,.2,1) both}
.auth-alert--error{border-color:#f2c4c1;color:#b42318;background:linear-gradient(180deg,#fff6f5,#fff 62%)}
.auth-alert--success{border-color:#b6e6c8;color:#116b38;background:linear-gradient(180deg,#f1fcf5,#fff 62%)}
.auth-alert__icon{flex:0 0 auto;width:34px;height:34px;border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff}
.auth-alert--error .auth-alert__icon{background:#e02424;box-shadow:0 6px 14px rgba(224,36,36,.3)}
.auth-alert--success .auth-alert__icon{background:#12a05a;box-shadow:0 6px 14px rgba(18,160,90,.3)}
.auth-alert__icon svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:2.1;stroke-linecap:round;stroke-linejoin:round}
.auth-alert__body{min-width:0;flex:1 1 auto;padding-top:3px}
.auth-alert__title{display:block;font-weight:600;margin-bottom:2px}
.auth-alert__list{margin:0;padding:0;list-style:none;display:grid;gap:3px}
.auth-alert__list li{position:relative;padding-left:14px;font-weight:400;opacity:.92}
.auth-alert__list li:before{content:'';position:absolute;left:2px;top:9px;width:5px;height:5px;border-radius:50%;background:currentColor;opacity:.5}
.auth-alert--success .auth-alert__list li:before{display:none}
.auth-alert__close{position:absolute;right:11px;top:11px;width:28px;height:28px;border:0;border-radius:9px;background:transparent;color:inherit;opacity:.55;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:opacity .15s ease,background-color .15s ease}
.auth-alert__close:hover{opacity:1;background:rgba(0,0,0,.06)}
.auth-alert__close svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round}
.auth-alert.is-hiding{opacity:0;transform:translate(-50%,-12px);transition:opacity .2s ease,transform .2s ease}
@keyframes auth-alert-in{from{opacity:0;transform:translate(-50%,-16px) scale(.97)}to{opacity:1;transform:translate(-50%,0) scale(1)}}
@media(prefers-reduced-motion:reduce){.auth-alert{animation:none}}
.remember .left{cursor:pointer}
.remember input.box{width:23px;height:23px;border:1.6px solid #99aac1;border-radius:5px;background:#fff;flex:0 0 auto;-webkit-appearance:none;appearance:none;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;padding:0;margin:0}
.remember input.box:checked{border-color:#0868ef;background:#0868ef;position:relative}
.remember input.box:checked:after{content:'';width:13px;height:13px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='3.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12l5 5 9-10'/%3E%3C/svg%3E") no-repeat center/contain}
.policy a{color:#929fb1;text-decoration:underline}
.icon.eye{border:0;background:none;padding:0;color:#7c8ba5;transition:color .15s ease}.icon.eye:hover{color:#0967ec}
.icon.eye .eye-off{display:none}.icon.eye.is-revealed .eye-off{display:flex}.icon.eye.is-revealed .eye-on{display:none}
.icon.eye svg{stroke-linecap:round;stroke-linejoin:round}

/* ===== single-form register layout (customer) ===== */
.reg-layout{width:min(calc(100% - 180px),1354px);height:auto;min-height:min(884px,calc(100vh - 140px));margin:16px auto 48px;display:grid;grid-template-columns:53.6% 46.4%;background:#fff;border:1px solid #dce7f1;border-radius:25px;overflow:hidden;box-shadow:var(--shadow);position:relative;z-index:1}
.reg-layout .reg-left{width:100%;height:100%;min-height:100%;align-self:stretch;object-fit:fill}
.reg-card{margin:0;border:0;border-radius:0;box-shadow:none;padding:54px 35px 36px;align-self:stretch;overflow:visible}
.reg-card .tab-text{min-width:0;display:block}
.req{color:#e02b2b}
.field-spaced{margin-top:14px}
.social[disabled]{opacity:.6;cursor:not-allowed}
.control select{-webkit-appearance:none;appearance:none;cursor:pointer;padding-right:24px}
.select-wrap{position:relative}
.select-wrap .caret{position:absolute;right:15px;top:50%;width:9px;height:9px;margin-top:-6px;border-right:2px solid #7c8ba5;border-bottom:2px solid #7c8ba5;transform:rotate(45deg);pointer-events:none}
.control.has-error .caret{border-color:#e02b2b}
.upload{cursor:pointer;transition:border-color .15s ease,background .15s ease}
.upload:hover{border-color:#7f9dc4;background:#f7fbff}
.upload-inner{display:block}
.upload input[type=file]{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.checkline input.box{width:23px;height:23px;border:1.6px solid #99aac1;border-radius:5px;background:#fff;flex:0 0 auto;-webkit-appearance:none;appearance:none;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;padding:0;margin:1px 0 0}
.checkline input.box:checked{border-color:#0868ef;background:#0868ef;position:relative}
.checkline input.box:checked:after{content:"";width:13px;height:13px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='3.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12l5 5 9-10'/%3E%3C/svg%3E") no-repeat center/contain}
@media(max-width:1180px) and (min-width:769px){.reg-layout{width:calc(100% - 64px);height:auto;min-height:min(760px,calc(100vh - 140px));grid-template-columns:48% 52%}.reg-card{padding:40px 34px 30px}.auth-top{width:calc(100% - 64px)}}
@media(max-width:768px){
.reg-layout{display:block;width:100%;height:auto;min-height:100vh;margin:0;background:transparent;border:0;border-radius:0;box-shadow:none;overflow:visible}
.reg-layout .reg-left{width:100%;height:auto;min-height:0}
.reg-card{margin:-4px 18px 0;border:1px solid #e5edf5;border-radius:25px 25px 0 0;border-bottom:0;padding:22px 20px 28px;box-shadow:0 -8px 30px rgba(18,68,127,.08);position:relative;z-index:3}
.reg-card h1{font-size:30px}
.reg-card .subtitle{font-size:16px}
.reg-card .tabs{gap:18px}
.reg-card .tab{display:block;text-align:center;min-height:121px;padding:13px 10px}
.reg-card .tab .round{width:70px;height:70px;margin:0 auto 7px}
.reg-card .tab h3{font-size:21px}
.reg-card .tab p{font-size:14px;margin-top:3px}
.reg-card .twocol{grid-template-columns:1fr}
.reg-card .reg-socials{gap:18px}
.reg-card .social{font-size:17px;height:57px}
.reg-card .divide{margin:17px 0}
.reg-card .reg-form{gap:16px}
.reg-card .field label{font-size:17px}
.reg-card .control{height:59px;border-radius:10px}
.reg-card .control input,.reg-card .control select{font-size:16px}
.reg-card .control.phone .code{min-width:125px}
.reg-card .checkline{font-size:16px}
.reg-card .btn{height:60px}
.reg-card .foot{font-size:16px}
}
@media(max-width:430px){
.reg-card{margin-left:10px;margin-right:10px;padding:18px 14px 24px}
.reg-card h1{font-size:27px}
.reg-card .tabs,.reg-card .reg-socials{gap:10px}
.reg-card .tab{padding:11px 7px}
.reg-card .tab .round{width:62px;height:62px}
.reg-card .tab h3{font-size:19px}
.reg-card .tab p{font-size:12px}
.reg-card .social{font-size:15px;gap:8px}
.reg-card .social img{width:23px;height:23px}
.reg-card .control.phone .code{min-width:108px}
.reg-card .checkline{font-size:14px}
.vendor-content .field-spaced{margin-top:10px}
}
@media(max-width:360px){.reg-card .tab p{display:none}}
.reg-layout-hero{width:100%;height:auto}
/* ===== shared auth header (mirrors .login-top) ===== */
.auth-top{width:min(calc(100% - 180px),1334px);height:76px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;position:relative;z-index:2}
.auth-top .logo{width:122px;height:auto;object-fit:contain}
.auth-top .links{display:flex;align-items:center;gap:18px;font-size:15px;font-weight:600}
.auth-top .home-link{color:#0967ec;display:inline-flex;align-items:center;gap:6px}
.auth-top .home-link svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:2;flex:0 0 auto}
.auth-top .sep{color:#bdcddd}
/* customer register: header on top, layout fills the rest */
.reg-page{min-height:100vh}
.vendor-page .auth-top{margin:14px auto 4px}
@media(max-width:768px){
.auth-top{width:calc(100% - 28px);height:68px}
.auth-top .logo{width:112px}
.auth-top .links{font-size:13px;gap:10px}
}
@media(max-width:430px){
.auth-top .home-link{font-size:0}
.auth-top .home-link svg{width:19px;height:19px}
}
/* ===== compact account-type tabs ===== */
.tabs{gap:12px}
.tabs .tab{min-height:104px;padding:13px;border-radius:13px;gap:13px}
.tabs .tab .round{width:64px;height:64px}
.tabs .tab .round svg{width:32px;height:32px}
.tabs .tab h3{font-size:21px}
.tabs .tab p{font-size:14px;margin-top:4px}
@media(max-width:1180px) and (min-width:769px){
.tabs .tab{padding:11px}
.tabs .tab .round{width:56px;height:56px}
.tabs .tab .round svg{width:29px;height:29px}
.tabs .tab h3{font-size:19px}
.tabs .tab p{font-size:13px}
}
@media(max-width:768px){
.reg-card .tabs{gap:14px}
.reg-card .tab{min-height:104px;padding:11px 8px}
.reg-card .tab .round{width:62px;height:62px;margin:0 auto 6px}
.reg-card .tab .round svg{width:31px;height:31px}
.reg-card .tab h3{font-size:19px}
.reg-card .tab p{font-size:13px;margin-top:3px}
.vendor-content .tabs{gap:12px}
.vendor-content .tab{min-height:82px;padding:9px 10px;gap:10px}
.vendor-content .tab .round{width:50px;height:50px}
.vendor-content .tab .round svg{width:26px;height:26px}
.vendor-content .tab h3{font-size:17px}
.vendor-content .tab p{font-size:11px;margin-top:3px}
}
@media(max-width:430px){
.reg-card .tabs{gap:10px}
.reg-card .tab{min-height:96px;padding:10px 6px}
.reg-card .tab .round{width:56px;height:56px}
.reg-card .tab .round svg{width:28px;height:28px}
.reg-card .tab h3{font-size:18px}
.reg-card .tab p{font-size:12px}
.vendor-content .tab{min-height:74px;padding:8px;gap:8px}
.vendor-content .tab .round{width:44px;height:44px}
.vendor-content .tab .round svg{width:23px;height:23px}
.vendor-content .tab h3{font-size:16px}
}
/* ===== breathing room above the first name field ===== */
.reg-card .reg-form{margin-top:18px}
.vendor-content > form > .section:first-of-type{margin-top:20px}
@media(max-width:768px){
.reg-card .reg-form{margin-top:14px}
.vendor-content > form > .section:first-of-type{margin-top:16px}
}
/* ===== role switcher =====
   Both roles render inside the same .reg-layout card, so the shell, the left image,
   the heading and the tabs are identical by construction. The tabs swap only
   [data-reg-panel], so the card and image stay put and just the form fields change. */
.reg-card .twocol.field-spaced{margin-top:14px}
@media(max-width:768px){
.reg-card .twocol.field-spaced{margin-top:12px}
}

/* ===== login on mobile: panel rises over the side image (mirrors .reg-card) =====
   The register page stacks the hero image full width and pulls the white card up
   over it, so the login card does exactly the same instead of stacking flat. */
@media(max-width:768px){
.login-card{width:100%;height:auto;margin:0;display:block;background:transparent;border:0;border-radius:0;box-shadow:none;overflow:visible}
.login-art{width:100%;height:100%;object-fit:fill}
.login-panel{position:relative;z-index:3;margin:-58px 12px 0;background:#fff;border:1px solid #e5edf5;border-bottom:0;border-radius:26px 26px 0 0;box-shadow:0 -8px 30px rgba(18,68,127,.08);padding:32px 18px 30px;overflow:visible}
.login-panel h1{font-size:28px}
.login-panel>.sub{font-size:15px}
}
@media(max-width:430px){
.login-art{aspect-ratio:5/4}
.login-panel{margin:-48px 8px 0;border-radius:22px 22px 0 0;padding:28px 14px 26px}
.login-panel h1{font-size:25px}
}


/* ===== OTP password-reset flow =====
   Step 2 (code entry) and step 3 (new password) reuse the login card, so these
   rules only cover the pieces the login form does not already provide. */
.field-hint{color:#6b7f9b;font-size:13px;font-weight:500;margin-top:6px}
.otp-input{width:100%;border:1px solid #d7e3f1;background:#f7fbff;border-radius:14px;padding:16px 18px;font-size:26px;font-weight:700;letter-spacing:.42em;text-align:center;text-indent:.42em;color:#001a55;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;transition:border-color .18s ease,box-shadow .18s ease,background .18s ease}
.otp-input::placeholder{color:#b9c8da;letter-spacing:.42em}
.otp-input:focus{outline:none;border-color:#0967ec;background:#fff;box-shadow:0 0 0 4px rgba(9,103,236,.12)}
.otp-input.has-error{border-color:#e02b2b;box-shadow:0 0 0 4px rgba(224,43,43,.1)}
.otp-readonly{width:100%;border:1px solid #e5edf5;background:#f4f8fd;border-radius:12px;padding:13px 15px;font-size:15px;font-weight:500;color:#5b739a;cursor:not-allowed}
.otp-resend{margin-top:16px;text-align:center;min-height:22px}
.otp-resend-text{margin:0;font-size:14px;font-weight:500;color:#6b7f9b}
.otp-resend-button{background:none;border:0;padding:0;color:#0967ec;font-size:14px;font-weight:700;text-decoration:underline;text-underline-offset:4px;cursor:pointer;font-family:inherit}
.otp-resend-button:hover{color:#001a55}
