/* Phase 85 — focused authentication surface */
body.nb-auth-page,
body.woocommerce-account:not(.logged-in){background:#050505!important;overflow-x:hidden}
body.nb-auth-page .site-header,
body.nb-auth-page .site-footer{display:none!important}
body.nb-auth-page #page,
body.nb-auth-page .site,
body.nb-auth-page .site-content,
body.nb-auth-page main,
body.nb-auth-page .content-shell,
body.nb-auth-page .content-shell__inner{background:#050505!important;max-width:none!important;width:100%!important;margin:0!important;padding:0!important}
body.nb-auth-page .content-shell{min-height:100svh!important}

.nb-auth{
    position:relative;
    isolation:isolate;
    min-height:100svh;
    display:grid;
    place-items:center;
    padding:34px 18px;
    overflow:hidden;
    background:#050505;
}
.nb-auth__ambient{
    position:absolute;
    z-index:-2;
    inset:0;
    pointer-events:none;
    background:
        radial-gradient(820px 540px at 24% 26%,rgba(48,25,132,.16),transparent 66%),
        radial-gradient(780px 560px at 82% 72%,rgba(12,162,28,.055),transparent 70%),
        linear-gradient(135deg,#050505 0%,#060508 48%,#050605 100%);
    background-repeat:no-repeat;
}
.nb-auth__ambient::after{
    content:"";
    position:absolute;
    inset:0;
    opacity:.18;
    background-image:linear-gradient(rgba(255,255,255,.018) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.012) 1px,transparent 1px);
    background-size:72px 72px;
    -webkit-mask-image:radial-gradient(circle at center,#000,transparent 76%);
    mask-image:radial-gradient(circle at center,#000,transparent 76%);
}
.nb-auth__center{width:min(100%,430px);display:grid;gap:15px;justify-items:center}
.nb-auth__card{
    position:relative;
    width:100%;
    direction:rtl;
    padding:29px;
    border:1px solid #252525;
    border-radius:22px;
    background:linear-gradient(180deg,rgba(14,14,14,.985),rgba(8,8,8,.99));
    box-shadow:0 34px 100px rgba(0,0,0,.52),inset 0 1px rgba(255,255,255,.018);
    overflow:hidden;
}
.nb-auth__card::before{content:"";position:absolute;inset:0 24px auto;height:1px;background:linear-gradient(90deg,transparent,rgba(118,87,232,.7),rgba(12,162,28,.18),transparent)}
.nb-auth__card::after{content:"";position:absolute;width:116px;height:116px;left:-62px;top:-62px;border:1px solid rgba(112,89,212,.15);border-radius:50%;pointer-events:none}
.nb-auth__card-head{position:relative;margin-bottom:25px;padding-top:2px}
.nb-auth__step{display:block;width:max-content;margin:0 auto 13px 0;direction:ltr;color:#806de0;font:700 8px/1 var(--font-mono);letter-spacing:.13em}
.nb-auth__card h1,.nb-auth__card h2{margin:0;color:#f2f3f3;font-weight:950;line-height:1.55}
.nb-auth__card h1{font-size:24px}.nb-auth__card h2{font-size:16px}
.nb-auth__panel,.nb-auth__state{display:grid;gap:15px}
.nb-auth__panel[hidden],.nb-auth__state[hidden]{display:none!important}

.nb-auth__field{display:grid;gap:8px;margin:0}
.nb-auth__field>span{color:#c7ccd1;font-size:10.5px;font-weight:850}
.nb-auth__field input,.nb-auth__input-shell{box-sizing:border-box;width:100%;height:51px;border:1px solid #292929;border-radius:11px;background:#070707;color:#fff;transition:border-color .18s,box-shadow .18s,background .18s}
.nb-auth__field input{padding:0 14px;outline:0;font-family:var(--font-sans);font-size:13px}
.nb-auth__field input:focus,.nb-auth__input-shell:focus-within{border-color:#5638ba;background:#080709;box-shadow:0 0 0 3px rgba(48,25,132,.16)}
.nb-auth__field input[readonly]{color:#929aa4;cursor:default;background:#090909}
.nb-auth__input-shell{display:flex;align-items:center;padding:0 12px;gap:9px}
.nb-auth__input-shell input{height:100%;padding:0;border:0;background:transparent;box-shadow:none!important}
.nb-auth__input-icon{display:grid;place-items:center;color:#707984}.nb-auth__input-icon svg{width:16px;height:16px}

.nb-auth__primary{
    min-height:51px;
    border:1px solid #4b2dac;
    border-radius:11px;
    background:linear-gradient(180deg,#4427ad,#301984);
    box-shadow:0 12px 32px rgba(48,25,132,.16),inset 0 1px rgba(255,255,255,.06);
    color:#fff;
    font-family:var(--font-sans);
    font-size:11.5px;
    font-weight:900;
    cursor:pointer;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:9px;
    transition:transform .15s,filter .15s,opacity .15s,border-color .15s;
}
.nb-auth__primary:hover{filter:brightness(1.12);transform:translateY(-1px);border-color:#6749d0}.nb-auth__primary:disabled{opacity:.46;cursor:not-allowed;transform:none}.nb-auth__primary.is-loading{opacity:.62}.nb-auth__primary svg{width:15px;height:15px}

.nb-auth__switch,.nb-auth__secondary{
    min-height:50px;
    border:1px solid #232323;
    border-radius:11px;
    background:#090909;
    color:#969da6;
    font-family:var(--font-sans);
    cursor:pointer;
    transition:border-color .18s,background .18s,color .18s;
}
.nb-auth__switch{width:100%;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:10px;padding:11px 13px;text-align:right}
.nb-auth__switch>svg{width:17px;height:17px;color:#8c76ed}.nb-auth__switch span{display:grid}.nb-auth__switch strong{color:#dddfe2;font-size:10.5px}.nb-auth__switch small{font-size:8.5px;color:#626b75}.nb-auth__switch:hover,.nb-auth__secondary:hover{border-color:#38304f;background:#0b0a0f;color:#c1b4f3}
.nb-auth__secondary-actions{display:grid;grid-template-columns:1fr 1fr;gap:9px}.nb-auth__secondary{padding:0 11px;font-size:9.5px;font-weight:800}.nb-auth__secondary:disabled{opacity:.44;cursor:not-allowed}.nb-auth__secondary--wide{width:100%;display:flex;align-items:center;justify-content:center;gap:7px}.nb-auth__secondary svg{width:13px;height:13px}

.nb-auth__otp-slots{display:grid;grid-template-columns:repeat(var(--nb-otp-digits,6),minmax(0,1fr));gap:7px;width:100%}
.nb-auth__otp-slot{
    width:100%!important;
    min-width:0!important;
    height:57px!important;
    padding:0!important;
    border:1px solid #2b2b2b!important;
    border-radius:10px!important;
    background:#060606!important;
    color:#fff!important;
    text-align:center!important;
    direction:ltr!important;
    font:900 20px/1 var(--font-mono)!important;
    caret-color:#b6a8ff;
}
.nb-auth__otp-slot:focus{border-color:#6749d0!important;box-shadow:0 0 0 3px rgba(48,25,132,.16)!important;outline:0!important}
.nb-auth__field-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}

.nb-auth__mode-title{display:flex;gap:11px;align-items:center;padding:0 0 4px}.nb-auth__mode-title>span{width:39px;height:39px;border:1px solid #2e2745;border-radius:10px;background:#100d1d;color:#927af3;display:grid;place-items:center}.nb-auth__mode-title>span svg{width:17px;height:17px}.nb-auth__mode-title div{display:grid}.nb-auth__mode-title small{font:650 8px/1.4 var(--font-mono);direction:ltr;text-align:right;color:#75679c}.nb-auth__mode-title h2{font-size:16px;margin:2px 0 0}
.nb-auth__back{justify-self:start;display:inline-flex;align-items:center;gap:7px;padding:0 0 4px;border:0;background:transparent;color:#9188a6;font-family:var(--font-sans);font-size:9.5px;cursor:pointer}.nb-auth__back svg{width:13px;height:13px}
.nb-auth__message{padding:10px 12px;margin:0 0 15px;border:1px solid #2b2b2b;border-radius:10px;background:#090909;color:#b8bec6;font-size:10.5px;line-height:1.8}.nb-auth__message[data-type=error]{border-color:rgba(228,73,73,.28);background:rgba(228,73,73,.055);color:#f09292}.nb-auth__message[data-type=success]{border-color:rgba(12,162,28,.3);background:rgba(12,162,28,.055);color:#83d48e}
.nb-auth__captcha{min-height:0;padding-top:2px;direction:ltr}.nb-auth__captcha:not([hidden]){min-height:65px}
.nb-auth__home{display:inline-flex;align-items:center;gap:7px;color:#6c747e!important;text-decoration:none!important;font-size:9.5px;font-weight:750}.nb-auth__home:hover{color:#aaa0d8!important}.nb-auth__home svg{width:13px;height:13px}

.woocommerce-account:not(.logged-in) .woocommerce{max-width:none!important;background:#050505!important}.woocommerce-account:not(.logged-in) .woocommerce>.woocommerce-notices-wrapper{width:min(calc(100% - 28px),430px);margin:18px auto 0}.woocommerce-account:not(.logged-in) .woocommerce-form-login,.woocommerce-account:not(.logged-in) .u-columns{display:none!important}

@media(max-width:520px){
    .nb-auth{padding:22px 12px}.nb-auth__card{padding:21px;border-radius:18px}.nb-auth__card h1{font-size:21px}.nb-auth__secondary-actions,.nb-auth__field-grid{grid-template-columns:1fr}.nb-auth__otp-slots{gap:5px}.nb-auth__otp-slot{height:52px!important;font-size:18px!important}.nb-auth__step{margin-bottom:11px}
}

/* Phase 86 — true full-viewport auth canvas.
 * Account navigation styles load after auth.css, so the login surface must
 * explicitly break out of any account/container width on every display size. */
body.nb-auth-page,
html:has(body.nb-auth-page){
    background:#050505!important;
}
body.nb-auth-page #main-content,
body.nb-auth-page .content-shell,
body.nb-auth-page .content-shell__inner,
body.nb-auth-page .content-shell__inner--narrow,
body.nb-auth-page article.entry-content,
body.nb-auth-page .woocommerce{
    width:100%!important;
    max-width:none!important;
    min-width:0!important;
    margin:0!important;
    padding:0!important;
    background:#050505!important;
}
body.nb-auth-page .nb-auth{
    width:100vw!important;
    max-width:none!important;
    min-height:100svh!important;
    margin-inline:calc(50% - 50vw)!important;
    background:#050505!important;
}
body.nb-auth-page .nb-auth__ambient{
    position:absolute!important;
    inset:0!important;
    width:100%!important;
    height:100%!important;
    background:
        radial-gradient(900px 620px at 29% 31%,rgba(48,25,132,.13),transparent 70%),
        radial-gradient(900px 700px at 76% 74%,rgba(12,162,28,.045),transparent 72%),
        linear-gradient(145deg,#050505 0%,#060508 50%,#050605 100%)!important;
    background-repeat:no-repeat!important;
    background-size:cover!important;
}

/* Phase 87 — TOTP challenge. Existing login states stay unchanged. */
.nb-auth__mfa-help{margin:0;color:#626b74;font-size:8px;line-height:1.85;text-align:center}

/* Phase 130 V104 readability — Auth. Typography only; layout/spacing unchanged. */
.nb-auth__field>span{font-size:12.5px}
.nb-auth__field input{font-size:14px}
.nb-auth__primary{font-size:13px}
.nb-auth__switch strong{font-size:12px}
.nb-auth__switch small{font-size:10.5px}
.nb-auth__secondary{font-size:11.5px}
.nb-auth__back{font-size:11px}
.nb-auth__message{font-size:12px;line-height:1.9}
.nb-auth__home{font-size:11px}
.nb-auth__mfa-help{font-size:10.5px;line-height:1.9}

/* Phase 130 V104 mobile readability floor — auth. */
@media(max-width:700px){.nb-auth__field input{font-size:16px}}


/* Phase 130 V199 — one visual surface for every wrapped auth credential field.
 * Chrome/Safari autofill paints the input itself, while the icon lives on the
 * parent shell. Keeping both layers on the exact same solid surface prevents
 * the visible two-tone split on mobile, email and password fields. */
.nb-auth__input-shell{
    background:#09090b;
    overflow:hidden;
}
.nb-auth__input-shell:focus-within{
    background:#09090b;
}
.nb-auth__input-shell input{
    background:#09090b!important;
    border-radius:0!important;
}
.nb-auth__input-shell:has(input[data-nb-intl-email]){
    background:#09090b;
    border-color:#303038;
    box-shadow:inset 0 1px rgba(255,255,255,.018);
}
.nb-auth__input-shell:has(input[data-nb-intl-email]):focus-within{
    border-color:#6749d0;
    background:#09090b;
    box-shadow:0 0 0 3px rgba(103,73,208,.13),inset 0 1px rgba(255,255,255,.025);
}
.nb-auth__field>input:-webkit-autofill,
.nb-auth__field>input:-webkit-autofill:hover,
.nb-auth__field>input:-webkit-autofill:focus{
    -webkit-text-fill-color:#eef0f4!important;
    caret-color:#fff!important;
    -webkit-box-shadow:0 0 0 1000px #070707 inset!important;
    box-shadow:0 0 0 1000px #070707 inset!important;
    transition:background-color 9999s ease-out 0s!important;
}
.nb-auth__input-shell input:-webkit-autofill,
.nb-auth__input-shell input:-webkit-autofill:hover,
.nb-auth__input-shell input:-webkit-autofill:focus{
    -webkit-text-fill-color:#eef0f4!important;
    caret-color:#fff!important;
    -webkit-box-shadow:0 0 0 1000px #09090b inset!important;
    box-shadow:0 0 0 1000px #09090b inset!important;
    border-radius:0!important;
    transition:background-color 9999s ease-out 0s!important;
}
.nb-auth__input-shell input[data-nb-intl-email]{color:#eef0f4!important;font-weight:650;letter-spacing:.01em}
.nb-auth__input-shell input[data-nb-intl-email]::placeholder{color:#59616c}

/* Phase 130 V200 — exact single-surface auth fields on mobile/tablet.
 * mobile-color-system.css intentionally raises auth surfaces to #090c0f at
 * <=1024px. The nested input had a higher-specificity V199 background, which
 * left the icon zone and editable zone one luminance step apart. Keep the
 * shell, editable area and browser autofill paint on the same physical color. */
@media(max-width:1024px){
    body.nb-auth-page .nb-auth__input-shell,
    body.nb-auth-page .nb-auth__input-shell input{
        background:#090c0f!important;
        background-color:#090c0f!important;
    }
    body.nb-auth-page .nb-auth__input-shell input:-webkit-autofill,
    body.nb-auth-page .nb-auth__input-shell input:-webkit-autofill:hover,
    body.nb-auth-page .nb-auth__input-shell input:-webkit-autofill:focus{
        -webkit-text-fill-color:#eef0f4!important;
        caret-color:#fff!important;
        -webkit-box-shadow:0 0 0 1000px #090c0f inset!important;
        box-shadow:0 0 0 1000px #090c0f inset!important;
    }
}