/* Nur Login-/2FA-Seiten gestalten */

body:has(.page-content.user.signin) {
  font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

body:has(.page-content.user.signin) #navbar,
body:has(.page-content.user.signin) .page-footer {
  display: none !important;
}

.page-content.user.signin {
  min-height: 100vh !important;
  background:
    linear-gradient(rgba(0,0,0,0.35), rgba(0,0,0,0.35)),
    url("/assets/img/login-hero-bg.jpg") center center / cover fixed no-repeat !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 24px !important;
}

.page-content.user.signin .column {
  width: 100% !important;
  max-width: 560px !important;
  margin: 0 auto !important;
}

.page-content.user.signin h3.ui.top.attached.header,
.page-content.user.signin h4.ui.top.attached.header.center,
.page-content.user.signin .ui.attached.segment {
  background: rgba(0, 0, 0, 0.52) !important;
  color: #ffffff !important;
  border-color: rgba(255,255,255,0.25) !important;
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
}

.page-content.user.signin h3.ui.top.attached.header,
.page-content.user.signin h4.ui.top.attached.header.center {
  border-radius: 18px 18px 0 0 !important;
  border-bottom: none !important;
}

.page-content.user.signin .ui.attached.segment {
  border-radius: 0 0 18px 18px !important;
  padding: 30px 36px !important;
}

.page-content.user.signin label,
.page-content.user.signin a,
.page-content.user.signin p,
.page-content.user.signin .field,
.page-content.user.signin .header {
  color: #ffffff !important;
}

.page-content.user.signin input[type="text"],
.page-content.user.signin input[type="password"] {
  height: 46px !important;
  background: rgba(255,255,255,0.12) !important;
  color: #ffffff !important;
  border: 1px solid rgba(255,255,255,0.35) !important;
  border-radius: 9px !important;
}

.page-content.user.signin .button {
  width: 100% !important;
  height: 48px !important;
  background: #ffffff !important;
  color: #111111 !important;
  border-radius: 9px !important;
  font-weight: 700 !important;
}

.page-content.user.signin .signin-passkey {
  display: block !important;
  color: #ffffff !important;
  text-align: center !important;
}
