@import url('./parts/00-tokens.css');
@import url('./parts/50-ns-components.css');

body.login-page { margin:0; min-height:100vh; font-family:var(--ns-font); color:var(--ns-text); background:var(--ns-surface); line-height:1.5; }
.login-layout { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); min-height:100vh; }
.login-panel { min-width:0; padding:48px 56px; }
.login-panel-brand { background:var(--ns-ink-900); color:var(--ns-text-inverse); display:flex; flex-direction:column; align-items:flex-start; gap:20px; }
.login-brandmark { margin-bottom:auto; }
.login-brandmark-badge { display:flex; align-items:center; }
.login-brandmark-logo { width:48px; height:56px; object-fit:contain; }
.login-panel-brand .eyebrow { color:var(--ns-ink-300); margin-top:64px; }
.login-panel-brand h1 { font-size:clamp(30px,3vw,40px); line-height:1.2; font-weight:600; letter-spacing:-.03em; max-width:460px; }
.login-panel-brand p { color:var(--ns-ink-300); font-size:16px; max-width:460px; }
.login-panel-brand > :last-child { margin-bottom:auto; }
.login-feature-list { display:grid; gap:18px; margin-top:16px; }
.login-feature-list article { display:grid; gap:4px; }
.login-feature-list strong { font-weight:600; }
.login-feature-list span { font-size:14px; color:var(--ns-ink-300); }
.login-panel-form { display:flex; align-items:center; justify-content:center; padding:48px; }
.login-card { width:100%; max-width:400px; background:transparent; border:0; box-shadow:none; padding:0; }
.login-card h2 { font-size:28px; line-height:36px; font-weight:600; margin:6px 0; }
.eyebrow { font-size:11px; line-height:16px; font-weight:600; letter-spacing:.06em; text-transform:uppercase; color:var(--ns-primary); }
.muted-copy { color:var(--ns-text-muted); margin:10px 0 16px; font-size:14px; }
.login-form { display:grid; gap:18px; margin:28px 0 20px; }
.login-form > label,.login-form .form-field { display:grid; gap:6px; color:var(--ns-text); font-size:14px; font-weight:500; }
.login-form input:not([type=checkbox]):not([type=radio]),.login-form select { width:100%; height:44px; }
.login-form .primary-button,.login-form .btn-primary { width:100%; min-height:44px; font-size:15px; }
.login-card a { color:var(--ns-primary-text); font-weight:500; }
.login-card p { overflow-wrap:anywhere; }
.login-form .form-check,.web-checkbox { display:flex; align-items:flex-start; gap:8px; }
.login-form .form-check input,.web-checkbox input { width:18px; min-width:18px; height:18px; margin-top:3px; }
.inline-note { padding:10px 14px; margin:16px 0; border:1px solid var(--ns-border); border-radius:6px; font-size:13px; }
.inline-note:empty { display:none; }
.inline-note-error { color:var(--ns-danger); background:var(--ns-danger-soft); border-color:var(--ns-sos-200); }
.ns-alert.danger { background:var(--ns-danger-soft); border-color:var(--ns-sos-200); color:var(--ns-danger); }
.login-form .ns-alert { margin:0; }
.inline-note-success { color:var(--ns-success); background:var(--ns-success-soft); }
.login-form .form-row { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:12px; }
.login-form label input { font-weight:400; }
.d-none,.hidden { display:none; }
@media(max-width:767px) {
 .login-layout { grid-template-columns:minmax(0,1fr); }
 .login-panel-brand { padding:24px; gap:12px; }
 .login-brandmark { margin:0; }
 .login-brandmark-logo { width:30px; height:36px; }
 .login-panel-brand .eyebrow { margin:0; }
 .login-panel-brand h1 { font-size:24px; }
 .login-panel-brand p { font-size:14px; }
 .login-feature-list { gap:12px; margin:0; }
 .login-panel-form { padding:32px 24px; }
 .login-card h2 { font-size:24px; }
 .login-form .form-row { grid-template-columns:minmax(0,1fr); }
}
.ns-target-login .login-panel-brand { padding:48px 56px; gap:0; }
.ns-target-login .login-brandmark { display:flex; align-items:center; gap:12px; margin:0; }
.ns-target-login .login-brandmark strong { font-size:18px; }
.ns-target-login .login-brandmark-logo { width:36px; height:40px; }
.ns-login-message { margin-block:auto; padding-block:48px; max-width:460px; }
.ns-login-message h1 { font-size:40px; line-height:48px; letter-spacing:-.03em; font-weight:600; }
.ns-login-message > p { margin-block-start:14px; font-size:16px; line-height:24px; color:#A6ADBB; }
.ns-login-features { list-style:none; display:flex; flex-direction:column; gap:18px; margin:36px 0 0; padding:0; }
.ns-login-features li { display:flex; gap:12px; align-items:flex-start; }
.ns-login-feature-icon { width:34px; height:34px; flex:none; display:grid; place-items:center; border:1px solid #344054; border-radius:8px; background:#1D2939; color:#D0D5DD; }
.ns-login-features li > span:last-child { display:flex; flex-direction:column; gap:3px; font-size:13px; color:#A6ADBB; }
.ns-login-features strong { color:#EAECF0; font-size:14px; font-weight:500; }
.ns-target-login .login-panel-brand > .ns-login-company { font-size:12px; margin:0; color:#7A8394; }
.ns-target-login .login-card { max-width:380px; }
.ns-password-heading { display:flex; align-items:center; justify-content:space-between; gap:12px; }
.ns-password-heading a { font-size:12px; }
.ns-login-register { text-align:center; font-size:13px; }
.ns-login-shared { display:flex; gap:10px; border-block-start:1px solid var(--ns-divider); padding-block-start:20px; margin-block-start:36px; color:var(--ns-text-muted); font-size:12px; line-height:19px; }
.ns-login-shared svg { flex:none; width:16px; height:16px; }
.ns-login-pilot { display:inline-block; padding:6px 10px; border-radius:999px; background:var(--ns-warning-soft); color:var(--ns-warning); font-size:12px; margin:0 0 20px; }
@media(max-width:767px) {
 .ns-target-login .login-panel-brand { padding:24px; }
 .ns-login-message { padding-block:28px; }
 .ns-login-message h1 { font-size:28px; line-height:36px; }
 .ns-login-features { margin-block-start:24px; }
}
