/* NEON GADGET HUB | CUSTOMER LOGIN FINAL | 2026-10-26
   Frontend-only, intentionally scoped to body.ngh-login-final.
   Official logo scripts and existing backend auth / OTP flows are preserved. */
:root{--ngh-orange:#ff7200;--ngh-black:#090b0e}
html{overflow-x:hidden}
body.ngh-login-final{margin:0;background:#f9fbfd!important;color:#17191e;font-family:Inter,"Segoe UI",Arial,sans-serif;min-height:100vh}
body.ngh-login-final .benefits{background:#121519!important;color:#f4f6f7!important;min-height:33px!important;padding:6px 4vw!important;font-size:11px!important;display:flex;justify-content:space-between;gap:16px;box-shadow:none!important}
body.ngh-login-final .benefits span{white-space:nowrap}
body.ngh-login-final .header,body.ngh-login-final .nav{background:#080a0c!important;color:#fff!important;border:0!important}
body.ngh-login-final .header-inner{max-width:1500px!important;margin:0 auto;height:75px!important;min-height:0!important;gap:28px!important;padding:0 clamp(16px,4.4vw,70px)!important;background:transparent!important}
body.ngh-login-final .brand{width:183px!important;color:#fff!important;text-decoration:none}
body.ngh-login-final .brand-main{color:#fff!important;font-size:37px!important;line-height:.95}
body.ngh-login-final .brand-o{color:var(--ngh-orange)!important}
body.ngh-login-final .brand-sub{color:#fff!important;font-size:11px!important;letter-spacing:3.9px!important}
body.ngh-login-final .search{background:#22262b!important;border:1px solid #31363b!important;box-shadow:none!important;height:42px!important;max-width:610px!important;border-radius:24px!important}
body.ngh-login-final .search input{color:#fff!important;background:transparent!important;font-size:12px!important}
body.ngh-login-final .search input::placeholder{color:#abb1b9!important}
body.ngh-login-final .search button{width:54px!important;background:#ff7200!important;color:#fff!important}
body.ngh-login-final .header-actions{gap:28px!important}
body.ngh-login-final .header-actions a{color:#f7f7f7!important;font-size:11px!important}
body.ngh-login-final .action-icon{color:#fff!important;font-size:25px!important}
body.ngh-login-final .nav-inner{max-width:1500px!important;min-height:37px!important;gap:31px!important;padding:0 clamp(16px,4.4vw,70px)!important}
body.ngh-login-final .nav-inner>a{font-size:12px!important;color:#f0f2f5!important}
body.ngh-login-final .nav-inner>a:hover{color:#ff820d!important}
body.ngh-login-final .nav-inner .categories{background:#ff7200!important;box-shadow:none!important;padding:8px 13px!important;font-size:11px!important}
body.ngh-login-final main{position:relative;isolation:isolate;max-width:none!important;margin:0!important;min-height:calc(100svh - 145px);padding:25px 22px 27px!important;display:flex;align-items:flex-start;justify-content:center;overflow:hidden;background:radial-gradient(ellipse at 50% 35%,#fff 30%,#f5f9fc 100%)}
/* Pale orange corner circles, positioned behind the centered auth card. */
body.ngh-login-final main::before,body.ngh-login-final main::after{content:"";position:absolute;pointer-events:none;z-index:-1;border-radius:50%;border:clamp(50px,8vw,135px) solid rgba(255,119,18,.125)}
body.ngh-login-final main::before{width:clamp(370px,51vw,700px);height:clamp(370px,51vw,700px);left:calc(-1 * clamp(280px,42vw,600px));top:38px}
body.ngh-login-final main::after{width:clamp(210px,28vw,385px);height:clamp(210px,28vw,385px);right:calc(-1 * clamp(160px,19vw,270px));top:-230px}
body.ngh-login-final .breadcrumb{display:none!important}
body.ngh-login-final .auth-shell{position:relative;z-index:1;display:flex!important;flex-direction:column!important;gap:0!important;align-items:stretch!important;width:min(100%,510px)!important;max-width:510px!important;min-height:0!important;height:auto!important;margin:0 auto!important;border:1px solid #e6e7ea!important;border-radius:12px!important;overflow:hidden!important;background:#fff!important;box-shadow:0 19px 40px rgba(25,36,50,.10)!important}
body.ngh-login-final .auth-shell .promo{display:block!important;width:100%!important;flex:none!important;min-height:0!important;height:205px!important;padding:0!important;margin:0!important;border:0!important;border-radius:0!important;background:#111 url('/assets/images/ngh-login-promo.jpg') center/cover no-repeat!important;box-shadow:none!important}
body.ngh-login-final .promo-content,body.ngh-login-final .promo-decor,body.ngh-login-final .promo-footer{display:none!important}
body.ngh-login-final .login-panel{display:block!important;min-height:0!important;flex:auto!important;align-self:stretch!important;width:100%!important;margin:0!important;padding:19px 25px 21px!important;background:#fff!important;border:0!important;border-radius:0!important;box-shadow:none!important}
body.ngh-login-final .login-panel>.panel-top,body.ngh-login-final .login-panel>h2,body.ngh-login-final .login-panel>.subtitle{display:none!important}
body.ngh-login-final .ngh-compact-tabs{display:grid!important;grid-template-columns:1fr 1fr!important;gap:0!important;margin:0 0 13px!important;padding:0!important;border:0!important;border-bottom:1px solid #e1e5e9!important;border-radius:0!important;background:#fff!important}
body.ngh-login-final .ngh-tab{border:0!important;border-bottom:2px solid transparent!important;border-radius:0!important;padding:9px 4px 10px!important;color:#656d7c!important;background:#fff!important;font-weight:700!important;font-size:14px!important;cursor:pointer;box-shadow:none!important}
body.ngh-login-final .ngh-tab.active{background:#fff!important;color:#f56900!important;border-bottom-color:#ff6b00!important;box-shadow:none!important}
body.ngh-login-final .ngh-tab:focus-visible{outline:2px solid #ff7100;outline-offset:-3px}
body.ngh-login-final .login-panel form>label{display:block!important;margin:11px 0 5px!important;font-size:11px!important;line-height:1.3!important;color:#2d3037!important;font-weight:650!important}
body.ngh-login-final .field{height:43px!important;min-height:43px!important;border:1px solid #d8dfe6!important;border-radius:5px!important;background:#fff!important}
body.ngh-login-final .field:focus-within{border-color:#ff7200!important;box-shadow:0 0 0 3px rgba(255,114,0,.13)!important}
body.ngh-login-final .field-icon{font-size:18px!important;color:#768191!important;padding-left:13px!important;padding-right:12px!important}
body.ngh-login-final .field input{font-size:12px!important;color:#151a22!important}
body.ngh-login-final .show-password{padding:10px 13px!important;font-size:12px!important}
body.ngh-login-final .options{margin:12px 0 14px!important;gap:5px!important;flex-wrap:wrap!important}
body.ngh-login-final .remember{font-size:11px!important;color:#3e4651!important}
body.ngh-login-final .options>a{font-size:11px!important;color:#fa6800!important}
body.ngh-login-final .signin{height:44px!important;min-height:44px!important;margin:0!important;border-radius:6px!important;background:linear-gradient(90deg,#ff7000,#ff6800)!important;box-shadow:none!important;font-size:13px!important;letter-spacing:.1px!important}
body.ngh-login-final .signin:hover{filter:brightness(.96)}
body.ngh-login-final .signin:focus-visible{outline:2px solid #202020;outline-offset:3px}
body.ngh-login-final .login-panel>.divider,body.ngh-login-final .login-panel>.trust{display:none!important}
body.ngh-login-final .signup:has(#openRegister){display:none!important}
body.ngh-login-final .login-panel .new-heading{margin:4px 0 13px!important}
body.ngh-login-final .login-panel .new-heading h3{font-size:17px!important}
body.ngh-login-final .login-panel .new-heading p{font-size:11px!important;line-height:1.45!important}
body.ngh-login-final #otpForm .subtitle{font-size:12px!important;margin:9px 0!important}
body.ngh-login-final #registerPane .signin,body.ngh-login-final #otpForm .signin{margin-top:17px!important}
body.ngh-login-final #registerPane>.signup{margin:14px 0 0!important;text-align:center!important;font-size:12px!important}
body.ngh-login-final footer,body.ngh-login-final .help{display:none!important}
body.ngh-login-final .feedback{margin:10px 0!important}
@media(max-width:980px){body.ngh-login-final .header-inner{gap:16px!important;padding:10px 18px!important}body.ngh-login-final .header-actions{gap:14px!important}body.ngh-login-final .nav-inner{gap:20px!important;padding:0 18px!important;overflow:auto}}
@media(max-width:700px){body.ngh-login-final .benefits{justify-content:center;gap:12px;font-size:10px!important}body.ngh-login-final .benefits span:nth-child(n+3){display:none!important}body.ngh-login-final .header-inner{min-height:0!important;height:auto!important;flex-wrap:wrap!important;padding:13px 14px!important}body.ngh-login-final .brand{width:135px!important}body.ngh-login-final .brand-main{font-size:30px!important}body.ngh-login-final .brand-sub{font-size:9px!important;letter-spacing:2.6px!important}body.ngh-login-final .search{order:3;flex:auto;width:100%;max-width:none!important}body.ngh-login-final .header-actions{margin-left:auto!important;gap:13px!important}body.ngh-login-final .nav-inner{min-height:37px!important;gap:16px!important}body.ngh-login-final .nav-inner>a{font-size:11px!important}body.ngh-login-final main{min-height:calc(100svh - 150px);padding:18px 12px 24px!important}body.ngh-login-final .auth-shell{width:min(100%,470px)!important}body.ngh-login-final .auth-shell .promo{height:clamp(135px,38vw,190px)!important}body.ngh-login-final .login-panel{padding:17px 16px 22px!important}}
@media(max-height:760px) and (min-width:701px){body.ngh-login-final .header-inner{height:61px!important}body.ngh-login-final .nav-inner{min-height:31px!important}body.ngh-login-final main{padding:11px 16px 11px!important;min-height:calc(100svh - 125px)}body.ngh-login-final .auth-shell{max-width:435px!important}body.ngh-login-final .auth-shell .promo{height:130px!important}body.ngh-login-final .login-panel{padding:11px 17px 14px!important}body.ngh-login-final .login-panel form>label{margin:7px 0 4px!important}body.ngh-login-final .field{height:38px!important;min-height:38px!important}body.ngh-login-final .options{margin:8px 0!important}body.ngh-login-final .signin{height:40px!important;min-height:40px!important}body.ngh-login-final .ngh-compact-tabs{margin-bottom:6px!important}body.ngh-login-final .ngh-tab{padding:5px!important}}
@media(prefers-reduced-motion:reduce){body.ngh-login-final *{scroll-behavior:auto!important;transition:none!important;animation:none!important}}