/* Ladies24 V251 — Login + Registrierung im Premium-Dark-Look
   Rein visuelles Update: Auth-/Supabase-Logik, Routen und Form-Verhalten bleiben unverändert. */

html[data-l24-premium="204"] #L24App:is([data-view="account"],[data-view="register"]) {
  --l24-auth-bg: var(--l24-ui-page, #11131b);
  --l24-auth-card: var(--l24-ui-surface, #161820);
  --l24-auth-card-top: var(--l24-ui-surface-2, #1b1e27);
  --l24-auth-field: var(--l24-ui-field, #20232e);
  --l24-auth-border: var(--l24-ui-line-strong, rgba(255,255,255,.14));
  --l24-auth-border-soft: var(--l24-ui-line, rgba(255,255,255,.08));
  --l24-auth-page: var(--l24-ui-page, #11131b);
  --l24-auth-text: var(--l24-ui-text, #f7f7fa);
  --l24-auth-muted: var(--l24-ui-muted, #a5aab6);
  --l24-auth-muted-2: var(--l24-ui-muted-2, #747986);
  --l24-auth-pink: var(--l24-ui-accent, #ff2a7a);
  background: var(--l24-auth-bg) !important;
  color: var(--l24-auth-text);
}

html[data-l24-premium="204"] #L24App:is([data-view="account"],[data-view="register"]) .l24-main-content,
html[data-l24-premium="204"] #L24App:is([data-view="account"],[data-view="register"]) .l24-auth-login,
html[data-l24-premium="204"] #L24App:is([data-view="account"],[data-view="register"]) .l24-page,
html[data-l24-premium="204"] #L24App:is([data-view="account"],[data-view="register"]) .l24-page-wrap,
html[data-l24-premium="204"] #L24App:is([data-view="account"],[data-view="register"]) .l24-page-shell {
  background: var(--l24-auth-page) !important;
}

html[data-l24-premium="204"] #L24App:is([data-view="account"],[data-view="register"]) {
  --l24-bg: var(--l24-auth-page) !important;
}

html[data-l24-premium="204"] #L24App:is([data-view="account"],[data-view="register"]) .l24-auth-login {
  padding: 26px 0 58px !important;
}

html[data-l24-premium="204"] #L24App:is([data-view="account"],[data-view="register"]) .l24-account-card--login {
  max-width: 590px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  backdrop-filter: none !important;
  color: var(--l24-auth-text) !important;
  box-shadow: none !important;
}

html[data-l24-premium="204"] #L24App:is([data-view="account"],[data-view="register"]) .l24-auth-login__back,
html[data-l24-premium="204"] #L24App:is([data-view="account"],[data-view="register"]) .l24-back {
  margin-bottom: 20px !important;
  color: var(--l24-auth-muted) !important;
  font-size: 14px !important;
  font-weight: 760 !important;
}

html[data-l24-premium="204"] #L24App:is([data-view="account"],[data-view="register"]) .l24-back:hover,
html[data-l24-premium="204"] #L24App:is([data-view="account"],[data-view="register"]) .l24-back:focus-visible {
  color: #fff !important;
}

html[data-l24-premium="204"] #L24App:is([data-view="account"],[data-view="register"]) .l24-auth-login__heading {
  margin-bottom: 24px !important;
}

html[data-l24-premium="204"] #L24App:is([data-view="account"],[data-view="register"]) .l24-auth-login__heading h1 {
  margin: 0 !important;
  color: #fff !important;
  font-family: var(--l24-ui-font, Inter, system-ui, sans-serif) !important;
  font-size: clamp(30px, 5vw, 38px) !important;
  line-height: 1.04 !important;
  font-weight: 820 !important;
  letter-spacing: -.045em !important;
}

html[data-l24-premium="204"] #L24App:is([data-view="account"],[data-view="register"]) .l24-auth-login__heading p {
  max-width: 500px !important;
  margin: 12px 0 0 !important;
  color: var(--l24-auth-muted) !important;
  font-size: 15px !important;
  line-height: 1.55 !important;
}

html[data-l24-premium="204"] #L24App:is([data-view="account"],[data-view="register"]) .l24-social-auth__button {
  min-height: 58px !important;
  padding: 0 18px !important;
  border: 1px solid rgba(255,255,255,.17) !important;
  border-radius: var(--l24-ui-radius-control, 14px) !important;
  background: var(--l24-auth-field) !important;
  color: #f7f8fa !important;
  box-shadow: none !important;
  font-size: 15px !important;
  font-weight: 800 !important;
}

html[data-l24-premium="204"] #L24App:is([data-view="account"],[data-view="register"]) .l24-social-auth__button:hover {
  border-color: rgba(255,255,255,.27) !important;
  background: var(--l24-ui-field,#20232e) !important;
  box-shadow: none !important;
}

html[data-l24-premium="204"] #L24App:is([data-view="account"],[data-view="register"]) .l24-social-auth__button:focus-visible {
  outline: 2px solid var(--l24-auth-pink) !important;
  outline-offset: 2px !important;
}

html[data-l24-premium="204"] #L24App:is([data-view="account"],[data-view="register"]) .l24-social-auth__legal {
  margin: 4px 4px 0 !important;
  color: var(--l24-auth-muted-2) !important;
  font-size: 11.5px !important;
  line-height: 1.5 !important;
}

html[data-l24-premium="204"] #L24App:is([data-view="account"],[data-view="register"]) .l24-social-auth__legal a {
  color: var(--l24-ui-accent-light,#ff4b8c) !important;
  font-weight: 780 !important;
  text-decoration-color: rgba(255,75,140,.7) !important;
  text-underline-offset: 3px !important;
}

html[data-l24-premium="204"] #L24App:is([data-view="account"],[data-view="register"]) .l24-auth-divider {
  margin: 21px 0 19px !important;
  color: var(--l24-auth-muted-2) !important;
  font-size: 12px !important;
}

html[data-l24-premium="204"] #L24App:is([data-view="account"],[data-view="register"]) .l24-auth-divider::before,
html[data-l24-premium="204"] #L24App:is([data-view="account"],[data-view="register"]) .l24-auth-divider::after {
  background: rgba(255,255,255,.14) !important;
}

html[data-l24-premium="204"] #L24App:is([data-view="account"],[data-view="register"]) .l24-form-grid {
  gap: 15px !important;
}

html[data-l24-premium="204"] #L24App:is([data-view="account"],[data-view="register"]) .l24-field {
  gap: 7px !important;
}

html[data-l24-premium="204"] #L24App:is([data-view="account"],[data-view="register"]) .l24-field > span {
  color: #f4f5f7 !important;
  font-size: 14px !important;
  font-weight: 800 !important;
}

html[data-l24-premium="204"] #L24App:is([data-view="account"],[data-view="register"]) .l24-control {
  min-height: 56px !important;
  border: 1px solid rgba(255,255,255,.16) !important;
  border-radius: var(--l24-ui-radius-control, 14px) !important;
  background: var(--l24-auth-field) !important;
  color: #f5f6f8 !important;
  caret-color: var(--l24-auth-pink) !important;
  box-shadow: none !important;
  font-size: 15px !important;
}

html[data-l24-premium="204"] #L24App:is([data-view="account"],[data-view="register"]) .l24-control::placeholder {
  color: var(--l24-auth-muted-2) !important;
}

html[data-l24-premium="204"] #L24App:is([data-view="account"],[data-view="register"]) .l24-control:focus {
  border-color: var(--l24-ui-accent-border, rgba(255,42,122,.35)) !important;
  box-shadow: none !important;
}

html[data-l24-premium="204"] #L24App:is([data-view="account"],[data-view="register"]) .l24-password-toggle {
  color: var(--l24-auth-muted) !important;
  background: transparent !important;
}

html[data-l24-premium="204"] #L24App:is([data-view="account"],[data-view="register"]) .l24-password-toggle:hover {
  color: #fff !important;
  background: rgba(255,255,255,.05) !important;
}

html[data-l24-premium="204"] #L24App:is([data-view="account"],[data-view="register"]) .l24-password-toggle:focus-visible {
  outline: 2px solid var(--l24-auth-pink) !important;
  outline-offset: 0 !important;
}

html[data-l24-premium="204"] #L24App:is([data-view="account"],[data-view="register"]) .l24-button--primary {
  min-height: 58px !important;
  margin-top: 4px !important;
  border: 0 !important;
  border-radius: var(--l24-ui-radius-control, 14px) !important;
  background: linear-gradient(180deg, var(--l24-ui-accent-light,#ff4b8c), var(--l24-ui-accent-strong,#f72e68)) !important;
  color: #fff !important;
  box-shadow: none !important;
  font-size: 16px !important;
  font-weight: 850 !important;
}

html[data-l24-premium="204"] #L24App:is([data-view="account"],[data-view="register"]) .l24-button--primary:hover {
  background: var(--l24-ui-accent-strong,#f72e68) !important;
  transform: none !important;
}

html[data-l24-premium="204"] #L24App:is([data-view="account"],[data-view="register"]) .l24-button--primary:focus-visible {
  outline: 2px solid var(--l24-ui-accent-light,#ff4b8c) !important;
  outline-offset: 2px !important;
}

html[data-l24-premium="204"] #L24App:is([data-view="account"],[data-view="register"]) .l24-auth-login__register {
  margin-top: 18px !important;
  color: var(--l24-auth-muted) !important;
  font-size: 13.5px !important;
}

html[data-l24-premium="204"] #L24App:is([data-view="account"],[data-view="register"]) .l24-auth-login__register a,
html[data-l24-premium="204"] #L24App:is([data-view="account"],[data-view="register"]) .l24-check a {
  color: var(--l24-ui-accent-light,#ff4b8c) !important;
  font-weight: 800 !important;
  text-decoration-color: rgba(255,75,140,.62) !important;
  text-underline-offset: 3px !important;
}

html[data-l24-premium="204"] #L24App[data-view="register"] .l24-check {
  align-items: flex-start !important;
  gap: 13px !important;
  margin: 3px 0 !important;
  color: #b5bac6 !important;
  font-size: 13px !important;
  line-height: 1.48 !important;
}

html[data-l24-premium="204"] #L24App[data-view="register"] .l24-check input[type="checkbox"] {
  appearance: none !important;
  -webkit-appearance: none !important;
  display: grid !important;
  place-content: center !important;
  flex: 0 0 22px !important;
  width: 22px !important;
  height: 22px !important;
  margin: 0 !important;
  border: 1.5px solid #aeb4c0 !important;
  border-radius: 5px !important;
  background: var(--l24-auth-field) !important;
  cursor: pointer !important;
}

html[data-l24-premium="204"] #L24App[data-view="register"] .l24-check input[type="checkbox"]::before {
  content: "";
  width: 11px;
  height: 7px;
  border-left: 2px solid #fff;
  border-bottom: 2px solid #fff;
  transform: rotate(-45deg) scale(0);
  transform-origin: center;
  transition: transform .12s ease;
}

html[data-l24-premium="204"] #L24App[data-view="register"] .l24-check input[type="checkbox"]:checked {
  border-color: var(--l24-auth-pink) !important;
  background: var(--l24-auth-pink) !important;
}

html[data-l24-premium="204"] #L24App[data-view="register"] .l24-check input[type="checkbox"]:checked::before {
  transform: rotate(-45deg) scale(1);
}

html[data-l24-premium="204"] #L24App[data-view="register"] .l24-check input[type="checkbox"]:focus-visible {
  outline: 2px solid var(--l24-auth-pink) !important;
  outline-offset: 2px !important;
}

html[data-l24-premium="204"] #L24App[data-view="account"] .l24-auth-login__reset {
  margin-top: 20px !important;
  padding-top: 18px !important;
  border-top: 1px solid rgba(255,255,255,.10) !important;
}

html[data-l24-premium="204"] #L24App[data-view="account"] .l24-auth-login__reset summary {
  color: #9fa5b1 !important;
  font-size: 13.5px !important;
  font-weight: 760 !important;
}

html[data-l24-premium="204"] #L24App[data-view="account"] .l24-auth-login__reset summary:hover {
  color: #fff !important;
}

html[data-l24-premium="204"] #L24App[data-view="account"] .l24-auth-login__reset .l24-button--ghost {
  border: 1px solid rgba(255,255,255,.15) !important;
  background: var(--l24-auth-field) !important;
  color: #fff !important;
}

html[data-l24-premium="204"] #L24App:is([data-view="account"],[data-view="register"]) .l24-error {
  color: #ff8aab !important;
}

@media (max-width: 620px) {
  html[data-l24-premium="204"] #L24App:is([data-view="account"],[data-view="register"]) .l24-auth-login {
    padding: 20px 0 42px !important;
  }

  html[data-l24-premium="204"] #L24App:is([data-view="account"],[data-view="register"]) .l24-auth-login > .l24-page {
    padding-left: 16px !important;
    padding-right: 16px !important;
  }

  html[data-l24-premium="204"] #L24App:is([data-view="account"],[data-view="register"]) .l24-account-card--login {
    padding: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
  }

  html[data-l24-premium="204"] #L24App:is([data-view="account"],[data-view="register"]) .l24-auth-login__heading h1 {
    font-size: clamp(32px, 9vw, 40px) !important;
  }

  html[data-l24-premium="204"] #L24App:is([data-view="account"],[data-view="register"]) .l24-auth-login__heading p {
    font-size: 14px !important;
  }

  html[data-l24-premium="204"] #L24App:is([data-view="account"],[data-view="register"]) .l24-social-auth__button,
  html[data-l24-premium="204"] #L24App:is([data-view="account"],[data-view="register"]) .l24-control,
  html[data-l24-premium="204"] #L24App:is([data-view="account"],[data-view="register"]) .l24-button--primary {
    min-height: 54px !important;
  }

  html[data-l24-premium="204"] #L24App:is([data-view="account"],[data-view="register"]) .l24-social-auth__button {
    border-radius: 14px !important;
    font-size: 14px !important;
  }

  html[data-l24-premium="204"] #L24App:is([data-view="account"],[data-view="register"]) .l24-control,
  html[data-l24-premium="204"] #L24App:is([data-view="account"],[data-view="register"]) .l24-button--primary {
    border-radius: 14px !important;
  }

  html[data-l24-premium="204"] #L24App:is([data-view="account"],[data-view="register"]) .l24-social-auth__legal {
    font-size: 10.8px !important;
  }

  html[data-l24-premium="204"] #L24App[data-view="register"] .l24-check {
    font-size: 12.5px !important;
  }
}

@media (max-width: 380px) {
  html[data-l24-premium="204"] #L24App:is([data-view="account"],[data-view="register"]) .l24-account-card--login {
    padding: 0 !important;
    border-radius: 0 !important;
  }

  html[data-l24-premium="204"] #L24App:is([data-view="account"],[data-view="register"]) .l24-auth-login__heading h1 {
    font-size: 31px !important;
  }
}


/* V255 — REAL auth background fix.
   premium-v204.css forces --p-soft (#f5f5f8) onto .l24-main-content and every normal .l24-section.
   Override those exact selectors AFTER premium-v204, and remove the outer auth card. */
html[data-l24-premium="204"] #L24App:is([data-view="account"],[data-view="register"]) {
  --l24-bg: var(--p-bg, #11131b) !important;
  background: var(--p-bg, #11131b) !important;
}
html[data-l24-premium="204"] #L24App:is([data-view="account"],[data-view="register"]) .l24-main-content {
  background: var(--p-bg, #11131b) !important;
}
html[data-l24-premium="204"] #L24App:is([data-view="account"],[data-view="register"]) .l24-main-content > .l24-section.l24-auth-login:not(.l24-market-results):not(.l24-section--dark) {
  background: var(--p-bg, #11131b) !important;
}
html[data-l24-premium="204"] #L24App:is([data-view="account"],[data-view="register"]) .l24-auth-login,
html[data-l24-premium="204"] #L24App:is([data-view="account"],[data-view="register"]) .l24-auth-login > .l24-page {
  background: var(--p-bg, #11131b) !important;
}
html[data-l24-premium="204"] #L24App:is([data-view="account"],[data-view="register"]) .l24-auth-login > .l24-page {
  max-width: 640px !important;
  padding-left: 26px !important;
  padding-right: 26px !important;
}
html[data-l24-premium="204"] #L24App:is([data-view="account"],[data-view="register"]) .l24-account-card.l24-account-card--login {
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
}
html[data-l24-premium="204"] #L24App:is([data-view="account"],[data-view="register"]) .l24-social-auth__button {
  width: 100% !important;
}
@media (max-width:620px){
  html[data-l24-premium="204"] #L24App:is([data-view="account"],[data-view="register"]) .l24-auth-login {
    padding-top: 26px !important;
  }
  html[data-l24-premium="204"] #L24App:is([data-view="account"],[data-view="register"]) .l24-auth-login > .l24-page {
    padding-left: 28px !important;
    padding-right: 28px !important;
  }
}


/* V318 — auth uses the same scale and surfaces as the public benchmark. */
html[data-l24-premium="204"] #L24App:is([data-view="account"],[data-view="register"]){
  font-family:var(--l24-ui-font)!important;
}
html[data-l24-premium="204"] #L24App:is([data-view="account"],[data-view="register"]) :is(.l24-social-auth__button,.l24-button--primary,.l24-control){
  min-height:56px!important;
  box-shadow:none!important;
}
html[data-l24-premium="204"] #L24App:is([data-view="account"],[data-view="register"]) .l24-account-card--login{
  width:min(100% - 32px,590px)!important;
  margin-inline:auto!important;
}
@media(max-width:520px){
  html[data-l24-premium="204"] #L24App:is([data-view="account"],[data-view="register"]) .l24-auth-login__heading h1{
    font-size:30px!important;
  }
}