/* Anonymous access uses the Lenzuoli brand, independently of dashboard preferences. */
:where(#login-screen, #suspended-screen, #bbr-force-password-overlay, .lz-auth-page) {
  --bbr-bg-app: #f4efe6;
  --bbr-bg-surface: #fbf8f1;
  --bbr-bg-sunken: #f1ead9;
  --bbr-fg-primary: #1a0f07;
  --bbr-fg-heading: #1a0f07;
  --bbr-fg-secondary: #4a423a;
  --bbr-fg-muted: #5f574d;
  --bbr-bd-default: #e0d7c6;
  --bbr-bd-strong: #d2c7b2;
  --bbr-accent: #bb440e;
  --bbr-accent-hover: #7a2e0e;
  --bbr-accent-active: #6a280c;
  --bbr-fg-on-accent: #fff;
  --lz-auth-heading-size: 24px;
  --bbr-accent-soft: color-mix(in srgb, #bb440e 14%, transparent);
  --bbr-accent-soft-fg: #7a2e0e;
  --bbr-ring: color-mix(in srgb, #bb440e 30%, transparent);
  --shadow-focus: 0 0 0 3px var(--bbr-ring);
  --bbr-btn-primary-bg: linear-gradient(180deg, color-mix(in oklch, var(--bbr-accent) 90%, white), var(--bbr-accent));
  --bbr-btn-primary-bg-hover: linear-gradient(180deg, color-mix(in oklch, var(--bbr-accent-hover) 75%, var(--bbr-accent)), var(--bbr-accent-hover));
  --bbr-btn-bg: linear-gradient(180deg, color-mix(in srgb, var(--bbr-bg-surface) 70%, white), color-mix(in srgb, var(--bbr-bg-surface) 50%, var(--bbr-bg-sunken)));
  font-family: var(--bbr-font-sans);
  color: var(--bbr-fg-primary);
  color-scheme: light;
}
#login-screen, #suspended-screen, .lz-auth-page {
  background: var(--bbr-bg-app) !important;
  min-height: 100vh;
  min-height: 100dvh;
  padding: var(--space-600) !important;
}
.lz-auth-page { display: flex; align-items: center; justify-content: center; }
:is(#login-screen, #suspended-screen, #bbr-force-password-overlay, .lz-auth-page) .login-card,
#bbr-force-password-overlay .bbr-force-password-card {
  width: 100%;
  max-width: 440px;
  margin: 0;
  padding: var(--space-1000) !important;
  background: var(--bbr-bg-surface) !important;
  color: var(--bbr-fg-primary);
  border: 1px solid var(--bbr-bd-default) !important;
  border-radius: var(--radius-xl);
  box-shadow: var(--shadow-lg);
}
:is(#login-screen, #suspended-screen, .lz-auth-page) .login-brand {
  font-family: var(--bbr-font-sans) !important;
  line-height: 1;
  margin: 0 0 var(--space-400);
}
.login-brand img { display: block; width: 224px; max-width: 100%; height: auto; margin: 0 auto; }
:is(#login-screen, #suspended-screen, #bbr-force-password-overlay, .lz-auth-page) :is(h1, h2, .success-title) {
  font-family: var(--bbr-font-sans);
  font-size: var(--lz-auth-heading-size);
  font-weight: 700;
  line-height: 1.3;
  color: var(--bbr-fg-heading);
}
#suspended-screen .login-title { margin: var(--space-600) 0 var(--space-400); }
:is(#login-screen, #suspended-screen, #bbr-force-password-overlay, .lz-auth-page) :is(.login-subtitle, .login-note, .subtitle, .hint, .success-sub) {
  color: var(--bbr-fg-muted) !important;
  font: inherit;
  font-size: var(--text-sm);
  line-height: 1.5;
}
#login-screen .login-subtitle { margin-bottom: var(--space-800); }
.login-note { margin: var(--space-150) 0 0; }
.login-help { margin: var(--space-400) 0 0; text-align: center; }
#login-forgot-panel { margin-top: var(--space-500); padding-top: var(--space-500); border-top: 1px solid var(--bbr-bd-default); }
#login-forgot-panel > .login-note { margin-bottom: var(--space-300); }
.login-panel-message { margin-top: var(--space-300); border-radius: var(--radius-md); padding: var(--space-300); font-size: var(--text-sm); }
:is(#login-screen, #suspended-screen, #bbr-force-password-overlay, .lz-auth-page) label {
  display: block;
  font-family: var(--bbr-font-sans);
  font-size: var(--text-sm) !important;
  font-weight: 600 !important;
  color: var(--bbr-fg-secondary) !important;
  margin-bottom: var(--space-150);
  letter-spacing: 0;
  text-transform: none;
}
:is(#login-screen, #bbr-force-password-overlay, .lz-auth-page) :is(input[type=text], input[type=password]) {
  width: 100%;
  min-height: 44px;
  padding: var(--space-300) !important;
  border: 1px solid var(--bbr-bd-default) !important;
  border-radius: var(--radius-md);
  background: var(--bbr-bg-surface) !important;
  color: var(--bbr-fg-primary) !important;
  font-family: var(--bbr-font-sans) !important;
  font-size: 16px !important;
}
:is(#login-screen, #bbr-force-password-overlay, .lz-auth-page) input:focus {
  border-color: var(--bbr-accent) !important;
  box-shadow: var(--shadow-focus) !important;
  outline: none;
}
.login-password-field { position: relative; }
.lz-auth-page .pw-wrap :is(#pw1, #pw2) { padding-right: var(--space-2000) !important; }
.lz-auth-page input[readonly] { background: var(--bbr-bg-sunken) !important; color: var(--bbr-fg-secondary) !important; }
#login-screen #bbr-login-password { padding-right: var(--space-1200) !important; }
#login-screen #bbr-login-pw-toggle { position: absolute; right: var(--space-100); top: 50%; transform: translateY(-50%); min-height: 36px; width: 36px; }
:is(#login-screen, #suspended-screen, #bbr-force-password-overlay, .lz-auth-page) .btn {
  font-family: var(--bbr-font-sans) !important;
  border-radius: var(--radius-md);
  color: var(--bbr-fg-primary) !important;
  background: var(--bbr-btn-bg) !important;
  border: 1px solid var(--bbr-bd-default) !important;
}
:is(#login-screen, #suspended-screen, #bbr-force-password-overlay, .lz-auth-page) .btn-primary {
  background: var(--bbr-btn-primary-bg) !important;
  color: var(--bbr-fg-on-accent) !important;
  border-color: var(--bbr-accent) !important;
}
:is(#login-screen, #suspended-screen, #bbr-force-password-overlay, .lz-auth-page) .btn-primary:hover {
  background: var(--bbr-btn-primary-bg-hover) !important;
  border-color: var(--bbr-accent-hover) !important;
}
:is(#login-screen, #suspended-screen, #bbr-force-password-overlay, .lz-auth-page) .btn-plain {
  background: transparent !important;
  border-color: transparent !important;
  box-shadow: none !important;
  color: var(--bbr-fg-muted) !important;
}
:is(#login-screen, #suspended-screen, #bbr-force-password-overlay, .lz-auth-page) .btn:not(.btn-primary):hover { background: var(--bbr-bg-sunken) !important; }
:is(#login-screen, #suspended-screen, #bbr-force-password-overlay, .lz-auth-page) .btn-plain:hover { border-color: transparent !important; color: var(--bbr-fg-primary) !important; }
:is(#login-screen, #suspended-screen, #bbr-force-password-overlay, .lz-auth-page) .btn:focus-visible { outline: none; box-shadow: var(--shadow-focus) !important; }
#login-screen .login-btn, #suspended-screen .login-btn, #bbr-force-password-overlay .login-btn, .lz-auth-page #submit-btn, .lz-auth-page .btn-secondary { width: 100%; min-height: 44px; }
#login-screen .login-error { padding: var(--space-300); color: var(--bbr-red-fg); background: var(--bbr-red-soft); }
.login-copy { color: var(--bbr-fg-secondary); font-size: var(--text-md); line-height: 1.65; margin-bottom: var(--space-600); }
@media (max-width: 600px) {
  #login-screen, #suspended-screen, .lz-auth-page { padding: var(--space-400) !important; }
  :is(#login-screen, #suspended-screen, .lz-auth-page) .login-card, #bbr-force-password-overlay .bbr-force-password-card { padding: var(--space-600) !important; margin: 0; }
}
