/* Authentication: the login composition follows the official signin.html. */
html[data-theme] .design-auth { margin: 0; background: var(--tp-surface-page); color: var(--tp-text-primary); font-family: var(--tp-type-body-md-family); }
.design-auth *, .design-auth *::before, .design-auth *::after { box-sizing: border-box; }
html[data-theme] .design-auth .form-label { color: var(--tp-text-primary); font-size: var(--tp-type-label-md-size); font-weight: var(--tp-type-label-md-weight); line-height: var(--tp-type-label-md-line-height); gap: var(--tp-space-2); margin: var(--tp-space-5) 0; }
html[data-theme] .design-auth .field { display: block; width: 100%; min-width: 0; height: auto; min-height: var(--tp-control-height); padding: var(--tp-space-3) var(--tp-space-4); border: var(--tp-border-width) solid var(--tp-border-strong); border-radius: var(--tp-radius-md); background: var(--tp-surface-card); color: var(--tp-text-primary); font: inherit; font-weight: var(--tp-type-body-md-weight); font-size: var(--tp-type-body-md-size); }
html[data-theme] .design-auth .field::placeholder { color: var(--tp-text-secondary); opacity: 1; }
html[data-theme] .design-auth .password-field .field { padding-right: calc(var(--tp-control-height) + var(--tp-space-2)); }
html[data-theme] .design-auth .password-field button { top: 50%; right: var(--tp-space-half); transform: translateY(-50%); width: var(--tp-control-height); height: var(--tp-control-height); display: grid; place-items: center; color: var(--tp-action-primary); border-radius: var(--tp-radius-sm); }
html[data-theme] .design-auth .login-submit { display: flex; align-items: center; justify-content: center; gap: var(--tp-space-2); height: auto; min-height: var(--tp-control-height); padding: var(--tp-space-3) var(--tp-space-4); border: 0; border-radius: var(--tp-radius-md); background: var(--tp-action-primary); color: var(--tp-action-primary-foreground); font: var(--tp-type-label-md-weight) var(--tp-type-label-md-size)/var(--tp-type-label-md-line-height) var(--tp-type-label-md-family); margin-top: var(--tp-space-5); }
html[data-theme] .design-auth .login-submit:hover:not(:disabled) { background: var(--tp-action-primary-hover); }
html[data-theme] .design-auth .login-submit:active:not(:disabled):not([aria-disabled=true]) { background: var(--tp-action-primary-active); }
html[data-theme] .design-auth .login-submit:disabled { background: var(--tp-action-primary-disabled); cursor: wait; }
html[data-theme] .design-auth :is(input, button):focus-visible { outline: var(--tp-component-focus-ring); outline-offset: var(--tp-focus-offset); }
html[data-theme] .design-auth .login-error { color: var(--tp-status-danger-foreground); background: var(--tp-status-danger-background); border: var(--tp-border-width) solid var(--tp-status-danger-border); border-radius: var(--tp-radius-md); padding: var(--tp-space-3); font-size: var(--tp-type-body-sm-size); line-height: var(--tp-type-body-sm-line-height); }
@font-face{font-family:"Passo Variable";src:url("../design-system/assets/fonts/passo/Passo-Variable.woff") format("woff");font-weight:100 800;font-style:normal;font-display:swap}
/* The CRM login follows the Design System signin metrics and typography. */
html[data-theme] .internal-login {--font-login:var(--font-inter,"Inter","Segoe UI",system-ui,-apple-system,Roboto,Arial,sans-serif);--font-brand:var(--font-passo,"Passo","Inter","Segoe UI",system-ui,Arial,sans-serif);--font-ui:var(--font-login);--tp-type-body-md-family:var(--font-login);--tp-type-label-md-family:var(--font-login);--tp-type-heading-lg-family:var(--font-brand);font-family:var(--font-login);font-size:16px;line-height:1.5;background:var(--tp-surface-card)}
html[data-theme] .password-change {--font-login:"Passo Variable","Inter","Segoe UI",system-ui,-apple-system,Roboto,Arial,sans-serif;--font-brand:var(--font-login);--font-ui:var(--font-login);--tp-type-body-md-family:var(--font-login);--tp-type-label-md-family:var(--font-login);--tp-type-heading-lg-family:var(--font-brand);font-family:var(--font-login);font-size:16px;line-height:1.5;background:var(--tp-surface-card)}
html[data-theme] .internal-login .login-shell {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));min-height:100vh;width:100%;overflow:visible;background:var(--tp-surface-card)}
html[data-theme] .internal-login .login-form-panel {display:grid;grid-template-rows:auto minmax(0,1fr);min-width:0;min-height:100vh;padding:0;background:var(--tp-surface-card)}
.internal-login .login-topbar {display:flex;align-items:center;justify-content:space-between;gap:16px;width:100%;max-width:448px;margin:0 auto;padding:40px 0 18px}
.internal-login .login-context {color:var(--tp-text-secondary);font-family:var(--font-login);font-size:14px;font-weight:400;line-height:20px}
.internal-login .login-theme-actions {position:fixed;right:24px;bottom:24px;z-index:50;display:flex;align-items:center;justify-content:flex-end;width:56px;height:56px;margin:0}
html[data-design-system] body.internal-login #themeToggle {display:grid;place-items:center;width:56px;height:56px;min-width:56px;padding:0;border:0;border-radius:50%;color:var(--color-white,#fff);background:var(--color-brand-500,#6b0080);box-shadow:none}
html[data-design-system] body.internal-login #themeToggle:hover {color:var(--color-white,#fff);background:var(--color-brand-600,#81009b)}
.internal-login .login-form-content {display:block;align-self:center;width:100%;max-width:448px;margin:0 auto;padding:0}
.internal-login .login-card {width:100%;max-width:none;min-width:0}
html[data-theme] .internal-login .login-mobile-brand {display:none;min-height:52px;margin:0 0 36px;padding:0;align-items:center}
html[data-theme] .internal-login .login-heading {margin-bottom:20px}
html[data-theme] .internal-login .login-card :is(h1,h2) {font-family:var(--font-brand);font-size:30px;font-weight:600;line-height:38px;letter-spacing:0;color:var(--tp-text-primary);margin:0 0 8px}
html[data-theme="dark"] .internal-login .login-card :is(h1,h2) {color:rgb(255 255 255 / 90%)}
html[data-theme] .internal-login .login-intro {color:var(--tp-text-secondary);font-family:var(--font-login);font-size:14px;font-weight:400;line-height:20px;margin:0}
html[data-theme="dark"] .internal-login .login-intro {color:var(--color-gray-400,#767078)}
.internal-login #loginForm {display:grid;gap:20px}
.internal-login .login-field-group {min-width:0}
html[data-theme] .internal-login .login-field-group .form-label,
html[data-theme] .internal-login .password-reset-panel .login-field-group .form-label {display:block;color:var(--color-gray-700,#3b333f);font-family:var(--font-login);font-size:14px;font-weight:500;line-height:20px;margin:0 0 6px}
html[data-theme="dark"] .internal-login .login-field-group .form-label,
html[data-theme="dark"] .internal-login .password-reset-panel .login-field-group .form-label {color:var(--color-gray-400,#767078)}
.internal-login .auth-required {display:inline;color:var(--tp-status-danger-foreground);line-height:1}
html[data-theme] .internal-login .field {height:44px;min-height:44px;padding:10px 16px;background:var(--tp-surface-card);border:1px solid var(--color-gray-300,#c6c6c6);border-radius:8px;color:var(--tp-text-primary);font-family:var(--font-login);font-size:14px;font-weight:400;line-height:20px;box-shadow:var(--tp-shadow-xs,0 1px 2px 0 rgb(16 24 40 / 5%))}
html[data-theme] .internal-login #loginForm .field::placeholder {color:var(--color-gray-400,#767078);opacity:1}
html[data-theme="dark"] .internal-login #loginForm .field::placeholder {color:rgb(255 255 255 / 30%)}
html[data-theme="dark"] .internal-login .field {border-color:var(--color-gray-700,#3b333f)!important;color:rgb(255 255 255 / 90%)}
html[data-theme] .internal-login .field:focus {border-color:#D58AE3!important;outline:0;box-shadow:0 0 0 3px color-mix(in srgb,var(--color-brand-500,#6b0080) 10%,transparent)}
html[data-theme="dark"] .internal-login .field:focus {border-color:#CA70DC!important}
html[data-theme] .internal-login .password-field .field {padding-right:44px}
html[data-theme] .internal-login .password-field button {top:50%;right:5px;width:38px;height:38px;min-height:0;padding:0;transform:translateY(-50%);display:grid;place-items:center;color:var(--tp-text-secondary);border:0;border-radius:6px;background:transparent;cursor:pointer}
html[data-theme] .internal-login .password-field button:hover {color:var(--tp-action-primary);background:var(--tp-soft)}
html[data-theme="dark"] .internal-login .password-field button {color:var(--color-gray-400,#767078)}
html[data-theme="dark"] .internal-login .password-field button:hover {color:var(--color-gray-300,#e5e5e5)}
.internal-login .admin-login-eye-hide {display:none}
.internal-login [data-toggle-password][aria-pressed=true] .admin-login-eye-show {display:none}
.internal-login [data-toggle-password][aria-pressed=true] .admin-login-eye-hide {display:block}
html[data-theme] .internal-login .login-submit {width:100%;margin:0;min-height:44px;height:44px;padding:12px 16px;font-family:var(--font-login);font-size:14px;font-weight:500;line-height:20px;border-radius:8px;background:var(--color-brand-500,#6b0080);color:var(--color-white,#fff);box-shadow:var(--tp-shadow-xs,0 1px 2px 0 rgb(16 24 40 / 5%))}
html[data-theme] .internal-login .login-submit:hover:not(:disabled) {background:var(--color-brand-600,#81009b);color:var(--color-white,#fff)}
html[data-theme] .internal-login .login-submit:active:not(:disabled):not([aria-disabled=true]) {background:var(--color-brand-700,#4b005a);color:var(--color-white,#fff)}
html[data-theme] .internal-login .login-submit:disabled {background:var(--tp-action-primary-disabled)}
html[data-theme] .internal-login .login-error {margin:0;padding:12px 14px;border-radius:8px;font:400 14px/20px var(--font-login)}
html[data-theme] .internal-login .login-reference-panel {position:relative;display:grid;place-items:center;min-width:0;min-height:100vh;padding:0;background:linear-gradient(135deg,#4b005a 0%,#6b0080 54%,#81009b 100%);isolation:isolate}
html[data-theme="dark"] .internal-login .login-reference-panel {background:linear-gradient(135deg,#25002D 0%,#4b005a 55%,#6b0080 100%)}
.internal-login .login-brand-content {position:relative;z-index:2;display:block;text-align:center;width:min(100% - 80px,448px);margin:0 auto}
.internal-login .login-brand-content .tp-brand {display:inline-flex;padding:calc(var(--tp-logo-width-hero) * var(--tp-logo-protection-ratio));min-inline-size:calc(var(--tp-logo-width-hero) + 2 * var(--tp-logo-width-hero) * var(--tp-logo-protection-ratio));margin:0 auto 32px}
.internal-login .login-brand-tagline {font-family:var(--font-brand);font-size:30px;font-weight:500;line-height:38px;letter-spacing:0;color:#fff;margin:0 0 16px}
.internal-login .login-brand-description {font-family:var(--font-login);font-size:20px;font-weight:400;line-height:30px;color:rgb(255 255 255 / 80%);margin:16px auto 0;max-width:448px}
.internal-login .tp-accent-line {top:22%;right:64px}
.internal-login .tp-dots {bottom:48px;left:48px}
/* Password change retains the compact account-security card. */
.design-auth .auth-brand { display: inline-flex; flex-shrink: 0; padding: var(--tp-logo-protection); margin: 0; max-width: 100%; }
.design-auth .auth-brand img { display: block; width: var(--tp-logo-width); min-width: var(--tp-logo-width); height: auto; object-fit: contain; margin: 0; filter: none; }
.design-auth .auth-brand .auth-brand-negative { display: none; }
html[data-theme="dark"] .design-auth .auth-brand-positive { display: none; }
html[data-theme="dark"] .design-auth .auth-brand .auth-brand-negative { display: block; }
html[data-theme] .design-auth .eyebrow { display: block; font: var(--tp-type-label-sm-weight) var(--tp-type-label-sm-size)/var(--tp-type-label-sm-line-height) var(--tp-type-label-sm-family); letter-spacing: var(--tp-type-label-sm-letter-spacing); color: var(--tp-action-primary); }
html[data-theme] .design-auth .password-card h1 { color: var(--tp-text-primary); font-family: var(--tp-type-heading-lg-family); font-size: var(--tp-type-heading-lg-size); font-weight: var(--tp-type-heading-lg-weight); line-height: var(--tp-type-heading-lg-line-height); letter-spacing: var(--tp-type-heading-lg-letter-spacing); margin: var(--tp-space-3) 0 var(--tp-space-4); overflow-wrap: anywhere; }
html[data-theme] .design-auth :is(.password-card > p, .password-rules) { color: var(--tp-text-secondary); font-size: var(--tp-type-body-sm-size); line-height: var(--tp-type-body-sm-line-height); }
.design-auth .password-card > p { margin-bottom: var(--tp-space-6); }
html[data-theme] .design-auth .password-page { min-height: 100svh; padding: var(--tp-space-6) var(--tp-space-4); background: var(--tp-surface-page); }
html[data-theme] .design-auth .password-card { width: 100%; max-width: 520px; min-width: 0; padding: var(--tp-space-6); border: var(--tp-border-width) solid var(--tp-border-default); border-radius: var(--tp-radius-xl); background: var(--tp-surface-card); color: var(--tp-text-primary); box-shadow: var(--tp-elevation-1); }
.design-auth .password-card .auth-brand { margin-bottom: var(--tp-space-5); }
.design-auth .password-rules { margin-top: calc(-1 * var(--tp-space-3)); }
@media (max-width:1023px) {
 html[data-theme] .internal-login .login-shell {grid-template-columns:minmax(0,1fr)}
 html[data-theme] .internal-login .login-reference-panel {display:none}
 html[data-theme] .internal-login .login-form-panel {padding-inline:clamp(24px,8vw,72px)}
}
@media (max-width:620px) {
 html[data-theme] .internal-login .login-form-panel {padding-inline:24px}
 html[data-theme] .internal-login .login-heading {margin-bottom:20px}
 html[data-theme] .internal-login .login-mobile-brand {margin-bottom:28px}
}
@media (min-width:640px) {
 html[data-theme] .internal-login .login-card :is(h1,h2) {font-size:36px;line-height:44px}
 html[data-theme] .internal-login .login-heading {margin-bottom:32px}
}
@media (max-width:400px) {html[data-theme] .design-auth .password-card {padding:var(--tp-space-5)}}

/* Account security shares authentication controls while retaining its compact card. */
html[data-theme] .password-change .password-topbar {display:flex;justify-content:flex-end;align-items:center;min-height:44px;margin:0 0 16px;padding:0}
html[data-design-system] body.password-change #themeToggle {position:static;display:grid;place-items:center;width:44px;height:44px;min-width:44px;padding:0;border:1px solid var(--tp-border-default);border-radius:50%;color:var(--tp-text-secondary);background:var(--tp-surface-card)}
html[data-design-system] body.password-change #themeToggle:hover {background:var(--tp-soft);border-color:var(--tp-action-primary);color:var(--tp-action-primary)}
html[data-theme] .password-change .password-card .field {height:46px;min-height:46px;padding:10px 12px;border-radius:6px;border-color:var(--color-palette-silver);background:var(--tp-surface-card);font:400 16px/24px var(--font-login);box-shadow:0 1px 2px rgb(37 0 45 / 4%)}
html[data-theme="dark"] .password-change .password-card .field {border-color:var(--tp-border-default)}
html[data-theme] .password-change .password-card .field:hover {border-color:var(--color-palette-battleship)}
html[data-theme] .password-change .password-card .field:focus {border-color:var(--tp-action-primary);outline:3px solid color-mix(in srgb,var(--tp-action-primary) 13%,transparent);outline-offset:0}
html[data-theme] .password-change .form-label {font:600 14px/1.35 var(--font-login);gap:7px}
html[data-theme] .password-change .login-submit {height:46px;min-height:46px;padding:0 20px;border-radius:8px;font:600 15.04px/1.5 var(--font-login);box-shadow:0 8px 20px rgb(107 0 128 / 18%)}
html[data-theme] .password-change .login-error {font:400 16px/1.55 var(--font-login);padding:12px 14px;border-radius:8px}

/* Password recovery keeps the same authentication composition and control metrics. */
html[data-theme] .internal-login .login-forgot,
html[data-theme] .internal-login .login-secondary {
  display: inline-flex;
  align-items: center;
  justify-content: center;
   min-height: 20px;
   padding: 0;
  border: 0;
  border-radius: var(--tp-radius-sm);
  background: transparent;
  color: var(--tp-action-primary);
   font-family: var(--font-login);
   font-size: 14px;
   font-weight: 400;
   line-height: 20px;
  cursor: pointer;
}
html[data-theme] .internal-login .login-form-options {display:flex;justify-content:space-between;align-items:center;gap:16px;min-height:20px}
html[data-theme] .internal-login .login-forgot { justify-self: end; margin: 0; }
html[data-theme="dark"] .internal-login .login-forgot { color: var(--color-brand-400,#ca70dc); }
html[data-theme] .internal-login .login-remember {display:inline-flex;align-items:center;gap:12px;min-height:20px;color:var(--tp-text-secondary);font:400 14px/20px var(--font-login);cursor:pointer;user-select:none}
html[data-theme] .internal-login .login-remember input {appearance:none;display:grid;place-items:center;width:20px;height:20px;flex:0 0 20px;margin:0;border:1.25px solid var(--tp-border-default);border-radius:6px;background:transparent;cursor:pointer}
html[data-theme] .internal-login .login-remember input:checked {border-color:var(--tp-action-primary);background:var(--tp-action-primary)}
html[data-theme] .internal-login .login-remember input:checked::after {content:"";width:9px;height:5px;border:2px solid var(--tp-text-inverse);border-top:0;border-right:0;transform:translateY(-1px) rotate(-45deg)}
html[data-theme] .internal-login .login-remember input:focus-visible {outline:3px solid color-mix(in srgb,var(--tp-action-primary) 24%,transparent);outline-offset:2px}
html[data-theme] .internal-login :is(.login-forgot, .login-secondary):hover { background: var(--tp-soft); }
html[data-theme] .internal-login .password-reset-panel { width: 100%; }
html[data-theme] .internal-login .password-reset-panel .login-heading { margin-bottom: 20px; }
@media (min-width: 640px) { html[data-theme] .internal-login .password-reset-panel .login-heading { margin-bottom: 32px; } }
html[data-theme] .internal-login .password-reset-panel form { display: grid; gap: 20px; }
html[data-theme] .internal-login .password-reset-panel .form-label { display: inline-flex; align-items: baseline; flex-wrap: nowrap; width: max-content; max-width: 100%; white-space: nowrap; gap: 2px; }
html[data-design-system] body.internal-login .password-reset-panel .auth-label-nowrap { display: inline-block; white-space: nowrap; }
html[data-design-system] body.internal-login .password-reset-panel .form-label { margin: 0 0 6px; font-family: var(--font-login); font-size: 14px; font-weight: 500; line-height: 20px; }
html[data-design-system] body.internal-login .password-reset-panel .field { height: 44px; min-height: 44px; padding: 10px 16px; border-color: var(--color-gray-300,#c6c6c6) !important; border-radius: 8px; font-family: var(--font-login); font-size: 14px; font-weight: 400; line-height: 20px; box-shadow: var(--tp-shadow-xs,0 1px 2px 0 rgb(16 24 40 / 5%)); }
html[data-theme="dark"] body.internal-login .password-reset-panel .field { border-color: var(--color-gray-700,#3b333f) !important; color: rgb(255 255 255 / 90%); }
html[data-theme="dark"] body.internal-login .password-reset-panel .field::placeholder { color: rgb(255 255 255 / 30%); }
html[data-theme] .internal-login .password-reset-panel .form-label:not(:first-child) { margin-top: 0; }
html[data-theme] .internal-login .password-reset-panel .login-submit { margin-top: 0; }
html[data-theme] .internal-login .password-reset-message {
  margin: 0;
  padding: 12px 14px;
  border: var(--tp-border-width) solid var(--tp-status-success-border);
  border-radius: var(--tp-radius-md);
  background: var(--tp-status-success-background);
  color: var(--tp-status-success-foreground);
    font-family: var(--font-login);
    font-size: 14px;
    font-weight: 400;
    line-height: 20px;
}
html[data-theme] .internal-login .password-reset-panel .login-secondary { width: 100%; margin-top: 2px; }
