/* Customer sign-in: scoped so register/recovery and storefront layouts stay independent. */
html:has(.customer-auth-page--login), body:has(.customer-auth-page--login) { height:auto; overflow:auto; }
body:has(.customer-auth-page--login) { margin:0; background:var(--ui-bg-page,#f5f7f8); }
body:has(.customer-auth-page--login) > .ek-nav { display:none !important; }
body:has(.customer-auth-page--login) #main-content { height:auto; min-height:100dvh; overflow:visible; padding:0; }
.customer-auth-page--login { display:flex; align-items:center; min-height:100dvh; height:auto; padding:32px 24px 96px; font-family:Inter,system-ui,sans-serif; background:var(--ui-bg-page,#f5f7f8); }
.customer-auth-page--login::before { display:none; }
.customer-auth-page--login .customer-auth-page__inner { width:min(1080px,100%); max-height:none; }
.login-topbar { display:flex; align-items:center; justify-content:space-between; gap:20px; margin:0 4px 28px; }
.login-topbar__brand { display:inline-flex; align-items:center; min-width:0; color:var(--ui-text); font-size:18px; font-weight:650; text-decoration:none; }
.login-topbar__brand img { display:block; max-width:190px; max-height:44px; width:auto; height:auto; object-fit:contain; }
.login-topbar__nav { display:flex; align-items:center; gap:14px; }
.login-store-link { display:inline-flex; align-items:center; gap:7px; min-height:42px; text-decoration:none; color:var(--ui-text-muted); font-size:13px; }
.login-store-link svg { width:17px; height:17px; }
.login-languages { position:relative; z-index:5; }
.login-languages summary { display:flex; align-items:center; gap:8px; min-height:42px; padding:8px 12px; border:1px solid var(--ui-border); border-radius:10px; background:var(--ui-surface); color:var(--ui-text); font-size:12px; font-weight:600; list-style:none; cursor:pointer; }
.login-languages summary::-webkit-details-marker { display:none; }
.login-languages img { border-radius:2px; object-fit:cover; }
.login-languages summary svg { width:13px; height:13px; transition:transform .18s ease; }
.login-languages[open] summary svg { transform:rotate(180deg); }
.login-languages__menu { position:absolute; inset-inline-end:0; top:calc(100% + 8px); display:grid; grid-template-columns:minmax(0,1fr); gap:4px; padding:6px; width:112px; max-height:260px; overflow:auto; background:var(--ui-surface); border:1px solid var(--ui-border); border-radius:12px; box-shadow:0 10px 32px #102c2314; }
.login-languages__menu a { display:flex; align-items:center; gap:8px; min-height:40px; padding:8px; border-radius:7px; font-size:12px; color:var(--ui-text); text-decoration:none; }
.login-languages__menu a:hover,.login-languages__menu a[aria-current] { background:var(--ui-primary-soft); color:var(--ui-primary-text,var(--ui-primary)); }
.customer-auth-page--login .customer-auth-shell { grid-template-columns:1fr 1fr; min-height:580px; max-height:none; border-radius:22px; border:1px solid var(--ui-border); box-shadow:0 20px 64px #1633280a; animation:login-arrive .55s cubic-bezier(.2,.7,.2,1) both; }
.customer-auth-page--login .customer-auth-context { display:flex; align-items:center; padding:48px; border:0; background:color-mix(in srgb,var(--ui-primary) 82%,#101e1a); color:#fff; }
.customer-auth-page--login .customer-auth-context__topbar { display:none; }
.customer-auth-page--login .customer-auth-context::after { width:310px; height:310px; inset-inline-end:-145px; inset-block-end:-160px; border-color:#ffffff18; box-shadow:0 0 0 38px #ffffff04,0 0 0 76px #ffffff04,0 0 0 114px #ffffff03; animation:login-orbit 16s ease-in-out infinite alternate; }
.customer-auth-page--login .customer-auth-context__content { position:relative; z-index:1; width:100%; }
.login-brand-monogram { display:flex; align-items:center; justify-content:center; position:relative; width:66px; height:66px; margin-bottom:42px; border:1px solid #ffffff26; border-radius:18px; background:#ffffff09; color:#fff; font-size:30px; font-weight:500; }
.login-brand-monogram > svg { position:absolute; bottom:-8px; inset-inline-end:-8px; width:26px; height:26px; padding:4px; border:1px solid #ffffff30; border-radius:8px; background:var(--ui-primary); }
.customer-auth-page--login .customer-auth-context__eyebrow { color:#d5e5dd; font-size:10px; letter-spacing:.16em; margin-bottom:14px; }
.customer-auth-page--login .customer-auth-context__eyebrow::before { background:var(--ui-accent,#d5b879); box-shadow:none; }
.customer-auth-page--login .customer-auth-context h2 { max-width:11ch; margin:0; font:550 clamp(32px,3.4vw,46px)/1.12 Inter,system-ui,sans-serif !important; letter-spacing:-.035em; color:#fff !important; text-wrap:balance; }
.customer-auth-page--login .customer-auth-context__lead { max-width:34ch; margin-top:18px; color:#d0ded7; font-size:13px; line-height:1.8; }
.customer-auth-page--login .customer-auth-context__items { display:grid; grid-template-columns:1fr; gap:15px; margin-top:34px; }
.customer-auth-page--login .customer-auth-context__item { display:flex; align-items:center; gap:10px; color:#e4eee9; font-size:12px; }
.customer-auth-page--login .customer-auth-context__icon { display:grid; place-items:center; width:28px; height:28px; border:1px solid #ffffff20; border-radius:8px; background:#ffffff08; color:#e5f2e9; }
.customer-auth-page--login .customer-auth-card { padding:46px 48px; display:flex; align-items:center; background:var(--ui-surface); }
.customer-auth-page--login .auth-form-wrap { width:100%; max-width:380px; background:transparent; }
.customer-auth-page--login .auth-form-eyebrow { font-size:10px; margin-bottom:12px; letter-spacing:.12em; }
.customer-auth-page--login .auth-form-title { font-family:Inter,system-ui,sans-serif !important; font-size:32px !important; font-weight:600; letter-spacing:-.04em; line-height:1.18; }
.customer-auth-page--login .auth-form-lead { margin-top:10px; font-size:13px; line-height:1.7; }
.customer-auth-page--login .auth-form { margin-top:30px; }
.customer-auth-page--login .auth-field { gap:8px; margin-bottom:19px; }
.customer-auth-page--login .auth-input { min-height:48px; width:100%; border:1px solid var(--ui-border); border-radius:10px; background:var(--ui-input-bg,var(--ui-surface)); color:var(--ui-text); font-family:inherit; font-size:14px; transition:border-color .18s,box-shadow .18s; }
.customer-auth-page--login .auth-input:focus { outline:0; border-color:var(--ui-primary); box-shadow:0 0 0 3px var(--ui-primary-soft); }
.customer-auth-page--login .auth-input.is-invalid,.customer-auth-page--login .auth-input[aria-invalid="true"] { border-color:var(--ui-danger); }
.customer-auth-page--login .auth-input.is-invalid:not([aria-invalid]) { border-color:var(--ui-border); }
.customer-auth-page--login .auth-label,.customer-auth-page--login .auth-link { font-size:12px; }
.customer-auth-page--login .auth-control__action { width:42px; height:44px; inset-inline-end:2px; }
.customer-auth-page--login .auth-options { margin:2px 0 21px; }
.customer-auth-page--login .auth-checkbox { align-items:center; font-size:12px; }
.customer-auth-page--login .auth-checkbox input { width:16px; height:16px; flex-basis:16px; margin:0; }
.customer-auth-page--login .auth-submit { min-height:48px; padding:12px 18px; border-radius:10px; font-size:13px; box-shadow:none; }
.login-submit-arrow { width:18px; height:18px; margin-inline-start:6px; transition:transform .2s; }
.customer-auth-page--login .auth-submit:hover .login-submit-arrow { transform:translateX(3px); }
[dir="rtl"] .login-submit-arrow { rotate:180deg; }
[dir="rtl"] .customer-auth-page--login .auth-submit:hover .login-submit-arrow { transform:translateX(-3px); }
.customer-auth-page--login .auth-submit:disabled { cursor:wait; opacity:.75; }
.auth-submit-spinner { width:16px; height:16px; border:2px solid currentColor; border-inline-end-color:transparent; border-radius:50%; animation:login-spin .7s linear infinite; }
.customer-auth-page--login .auth-switch { margin-top:26px; padding-top:22px; border-top:1px solid var(--ui-border); font-size:12px; }
.customer-auth-page--login .auth-guest-link { margin-top:12px; padding:10px; border:1px solid var(--ui-border); border-radius:9px; color:var(--ui-text-muted); font-size:12px; transition:background .18s,color .18s; }
.customer-auth-page--login .auth-guest-link:hover { background:var(--ui-surface-alt); color:var(--ui-text); }
.login-field-error { margin:0; color:var(--ui-danger-text,var(--ui-danger)); font-size:12px; line-height:1.5; }
.login-field-error[hidden] { display:none; }
@keyframes login-arrive { from { opacity:0; transform:translateY(12px); } to { opacity:1; transform:translateY(0); } }
@keyframes login-orbit { from { transform:translate(0,0); } to { transform:translate(-12px,-12px); } }
@keyframes login-spin { to { transform:rotate(360deg); } }
@media(max-width:820px) {
 .customer-auth-page--login { padding:24px 18px 110px; }
 .customer-auth-page--login .customer-auth-shell { grid-template-columns:minmax(230px,.85fr) 1.15fr; min-height:550px; }
 .customer-auth-page--login .customer-auth-context { padding:30px; }
 .customer-auth-page--login .customer-auth-card { padding:32px 26px; }
 .login-brand-monogram { margin-bottom:30px; }
 .customer-auth-page--login .customer-auth-context h2 { font-size:32px !important; }
}
@media(max-width:640px) {
 .customer-auth-page--login { display:block; min-height:100dvh; padding:22px 16px 160px; }
 .login-topbar { margin:0 0 26px; gap:12px; }
 .login-topbar__brand img { max-width:146px; max-height:36px; }
 .login-topbar__nav { gap:12px; }
 .login-store-link { min-height:44px; }
 .login-store-link span { display:none; }
 .login-languages summary { min-height:44px; padding:8px 10px; }
 .customer-auth-page--login .customer-auth-shell { display:block; min-height:0; border-radius:16px; overflow:visible; }
 .customer-auth-page--login .customer-auth-context { display:none; }
 .customer-auth-page--login .customer-auth-card { display:block; padding:30px 24px; border-radius:16px; }
 .customer-auth-page--login .auth-form-title { font-size:29px !important; }
 .customer-auth-page--login .auth-input { font-size:16px; }
 .customer-auth-page--login .auth-form { margin-top:26px; }
 .customer-auth-page--login .auth-control__action { min-width:44px; }
 .customer-auth-page--login .auth-form-lead { font-size:13px; }
}
@media(max-width:360px) { .customer-auth-page--login { padding-inline:12px; } .customer-auth-page--login .customer-auth-card { padding:26px 18px; } .login-topbar__brand img { max-width:126px; } .login-topbar__nav { gap:8px; } }
@media(prefers-reduced-motion:reduce) { .customer-auth-page--login *, .customer-auth-page--login *::after { animation:none !important; transition:none !important; } }
/* Storefront typography must not override the account interface. */
body .customer-auth-page--login { --ui-font-heading:var(--ui-font-ui,Inter,system-ui,sans-serif); }
body .customer-auth-page--login .auth-form-wrap { background:transparent !important; }
body .customer-auth-page--login .auth-form-title { font-family:var(--ui-font-ui,Inter,system-ui,sans-serif) !important; font-weight:600 !important; }
body .customer-auth-page--login .customer-auth-context h2 { font-family:var(--ui-font-ui,Inter,system-ui,sans-serif) !important; font-weight:550 !important; }
body .customer-auth-page--login .auth-input:focus { border-color:var(--ui-primary) !important; }
body .customer-auth-page--login .auth-input[aria-invalid="true"] { border-color:var(--ui-danger) !important; }
#main-content .customer-auth-page--login .auth-form-title,
#main-content .customer-auth-page--login .customer-auth-context h2 { font-family:Inter,system-ui,sans-serif !important; }
html[dir="rtl"] #main-content .customer-auth-page--login .auth-form-title,
html[dir="rtl"] #main-content .customer-auth-page--login .customer-auth-context h2 { font-family:Cairo,Tajawal,system-ui,sans-serif !important; }
/* One access workspace; the brand panel slides between the two native forms. */
.customer-auth-page--login .customer-auth-shell { position:relative; grid-template-columns:repeat(2,minmax(0,1fr)); min-height:690px; isolation:isolate; }
.customer-auth-page--login .customer-auth-context { grid-column:2; grid-row:1; z-index:2; clip-path:polygon(8% 0,100% 0,100% 100%,0 100%); padding-inline-start:58px; transition:transform .65s cubic-bezier(.65,0,.2,1),clip-path .65s cubic-bezier(.65,0,.2,1); }
.customer-auth-page--login[data-auth-mode="register"] .customer-auth-context { transform:translateX(-100%); clip-path:polygon(0 0,92% 0,100% 100%,0 100%); padding-inline-start:48px; }
[dir="rtl"] .customer-auth-page--login .customer-auth-context { clip-path:polygon(0 0,92% 0,100% 100%,0 100%); }
[dir="rtl"] .customer-auth-page--login[data-auth-mode="register"] .customer-auth-context { transform:translateX(100%); clip-path:polygon(8% 0,100% 0,100% 100%,0 100%); }
.customer-auth-page--login .customer-auth-card { grid-column:1 / -1; grid-row:1; padding:0; background:transparent; display:block; border-radius:inherit; }
.auth-access-panels { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); min-height:690px; align-items:center; }
.auth-access-panel { min-width:0; grid-row:1; padding:36px 42px; animation:access-form-in .36s ease both; }
.auth-access-panel[data-auth-panel="login"] { grid-column:1; }
.auth-access-panel[data-auth-panel="register"] { grid-column:2; }
.auth-access-panel[hidden] { display:none !important; }
.customer-auth-page--login .auth-access-panel .auth-form-wrap { max-width:390px; }
.auth-access-tabs { display:grid; grid-template-columns:1fr 1fr; gap:4px; padding:4px; margin-bottom:25px; border-radius:10px; background:var(--ui-surface-alt); border:1px solid var(--ui-border); }
.auth-access-tabs a { display:flex; align-items:center; justify-content:center; min-height:36px; padding:8px; border-radius:7px; color:var(--ui-text-muted); text-decoration:none; font-size:12px; font-weight:550; }
.auth-access-tabs a[aria-current="page"] { background:var(--ui-surface); color:var(--ui-text); box-shadow:0 1px 4px #122f2310; }
.auth-access-tabs a:hover { color:var(--ui-primary); }
.customer-auth-page--login .auth-access-panel .auth-form-eyebrow { display:none; }
.customer-auth-page--login .auth-access-panel .auth-form-title { font-size:30px !important; }
.customer-auth-page--login .auth-access-panel .auth-form-lead { font-size:12px; }
.customer-auth-page--login .auth-access-panel[data-auth-panel="register"] .auth-form { margin-top:22px; }
.customer-auth-page--login .auth-access-panel[data-auth-panel="register"] .auth-field { margin-bottom:12px; gap:6px; }
.customer-auth-page--login .auth-access-panel[data-auth-panel="register"] .auth-input { min-height:44px; }
.customer-auth-page--login .auth-access-panel .auth-password-note { margin:0 0 12px; font-size:11px; }
.customer-auth-page--login .auth-access-panel .auth-terms { margin:0 0 16px; padding:0; border:0; background:transparent; }
.customer-auth-page--login .auth-access-panel .auth-terms .auth-checkbox { align-items:flex-start; font-size:11px; }
.customer-auth-page--login .auth-access-panel .auth-terms input { margin-top:2px; }
.customer-auth-page--login .auth-access-panel .auth-divider { display:none; }
.customer-auth-page--login .auth-access-panel[data-auth-panel="register"] .auth-switch { margin-top:18px; padding-top:16px; }
.customer-auth-page--login .login-brand-monogram { margin-bottom:34px; }
@keyframes access-form-in { from {opacity:0; transform:translateY(8px);} to {opacity:1;transform:translateY(0);} }
@media(max-width:820px) and (min-width:641px) {
 .auth-access-panel { padding:30px 24px; }
 .customer-auth-page--login .customer-auth-context { padding-inline:34px 26px; }
 .customer-auth-page--login[data-auth-mode="register"] .customer-auth-context { padding-inline:26px 34px; }
 .customer-auth-page--login .customer-auth-context h2 { font-size:29px !important; }
}
@media(max-width:640px) {
 .customer-auth-page--login .customer-auth-shell { min-height:0; display:block; }
 .auth-access-panels { display:block; min-height:0; }
 .auth-access-panel { padding:26px 24px; }
 .customer-auth-page--login .customer-auth-card { padding:0; }
 .auth-access-tabs { margin-bottom:26px; }
 .auth-access-tabs a { min-height:40px; }
 .customer-auth-page--login .auth-access-panel .auth-form-title { font-size:27px !important; }
 .customer-auth-page--login .auth-access-panel[data-auth-panel="register"] .auth-input { min-height:46px; }
 .customer-auth-page--login .auth-access-panel[data-auth-panel="register"] .auth-field { margin-bottom:14px; }
}
@media(max-width:360px) { .auth-access-panel { padding-inline:18px; } }
@media(prefers-reduced-motion:reduce) { .auth-access-panel { animation:none !important; } }
html[dir="rtl"] .customer-auth-page--login .auth-control--icon input[type="email"] { direction:ltr; text-align:left; padding-left:14px; padding-right:43px; }
/* Integrated access header and saved company brand authority. */
body .customer-auth-page--login { --ui-primary:var(--access-primary); --ui-accent:var(--access-accent); --ui-primary-soft:color-mix(in srgb,var(--access-primary) 8%,var(--ui-surface)); --ui-primary-text:var(--access-link); padding:20px 24px; }
.customer-auth-page--login .customer-auth-shell { grid-template-rows:auto 1fr; min-height:0; }
.customer-auth-page--login .login-topbar { grid-column:1 / -1; grid-row:1; position:relative; z-index:6; margin:0; padding:14px 28px; border-bottom:1px solid var(--ui-border); background:var(--ui-surface); }
.customer-auth-page--login .login-topbar__brand img { max-height:34px; max-width:158px; }
.customer-auth-page--login .customer-auth-context,.customer-auth-page--login .customer-auth-card { grid-row:2; }
.customer-auth-page--login .customer-auth-context { background:var(--access-primary); color:var(--access-on-primary); }
.customer-auth-page--login .customer-auth-context h2 { color:var(--access-on-primary) !important; }
.customer-auth-page--login .customer-auth-context__eyebrow,.customer-auth-page--login .customer-auth-context__lead,.customer-auth-page--login .customer-auth-context__item { color:color-mix(in srgb,var(--access-on-primary) 84%,transparent); }
.customer-auth-page--login .login-brand-monogram,.customer-auth-page--login .customer-auth-context__icon { color:var(--access-on-primary); border-color:color-mix(in srgb,var(--access-on-primary) 22%,transparent); }
.customer-auth-page--login .auth-submit { background:var(--access-primary); color:var(--access-on-primary); border-color:var(--access-primary); }
.customer-auth-page--login .auth-submit:hover { background:color-mix(in srgb,var(--access-primary) 92%,var(--access-on-primary)); border-color:var(--access-primary); }
.customer-auth-page--login .auth-link { color:var(--access-link); }
.auth-access-panels { min-height:600px; }
.auth-access-panel { padding:24px 40px; }
.auth-access-tabs { margin-bottom:18px; }
.customer-auth-page--login .auth-access-panel .auth-switch { display:none; }
.customer-auth-page--login .auth-access-panel[data-auth-panel="register"] .auth-form-lead,.customer-auth-page--login .auth-access-panel[data-auth-panel="register"] .auth-guest-link { display:none; }
.customer-auth-page--login .auth-access-panel[data-auth-panel="register"] .auth-form { margin-top:18px; }
.customer-auth-page--login .auth-access-panel[data-auth-panel="register"] .auth-field { margin-bottom:10px; }
.customer-auth-page--login .auth-access-panel .auth-submit { min-height:44px; }
@media(max-width:820px) and (min-width:641px) { .auth-access-panel { padding:24px; } .customer-auth-page--login .login-topbar { padding-inline:24px; } }
@media(max-width:640px) {
 body .customer-auth-page--login { padding:14px 12px; }
 .customer-auth-page--login .customer-auth-shell { overflow:visible; }
 .customer-auth-page--login .login-topbar { padding:12px 16px; border-radius:16px 16px 0 0; }
 .customer-auth-page--login .login-topbar__brand img { max-width:134px; max-height:30px; }
 .auth-access-panels { min-height:0; }
 .auth-access-panel { padding:22px 20px; }
 .customer-auth-page--login .customer-auth-card { border-radius:0 0 16px 16px; }
}
@media(max-width:360px) { .customer-auth-page--login .login-topbar { padding-inline:14px; } .auth-access-panel { padding:20px 16px; } .customer-auth-page--login .login-topbar__brand img { max-width:116px; } }
@media(max-height:760px) and (min-width:641px) { body .customer-auth-page--login { align-items:flex-start; padding-block:12px; } }
body:has(.customer-auth-page--login) { padding-block-end:0 !important; }
