/* Ruckzugsort design system — mapped onto Rauthy (MD3 / glass) */

@font-face {
  font-family: "Roboto";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("/rauthy-fonts/roboto-400.woff2") format("woff2");
}
@font-face {
  font-family: "Roboto";
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("/rauthy-fonts/roboto-500.woff2") format("woff2");
}
@font-face {
  font-family: "Roboto";
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("/rauthy-fonts/roboto-700.woff2") format("woff2");
}

:root {
  --rz-motion: cubic-bezier(0.2, 0, 0, 1);
  --rz-radius-surface: 1.75rem;
  --rz-radius-inner: 1.25rem;
  --rz-radius-pill: 9999px;
  --rz-radius-shell: calc(2.5rem / 2 + 0.375rem);
  --rz-shadow-soft: 0 1px 2px 0 rgb(0 0 0 / 0.3), 0 1px 3px 1px rgb(0 0 0 / 0.15);
  --rz-shadow-floating: 0 4px 8px 3px rgb(0 0 0 / 0.15), 0 1px 3px rgb(0 0 0 / 0.12);
}

/* ── Tokens (override Rauthy theme — dark default) ── */
body,
.theme-dark body {
  --text: 220 5% 65%;
  --text-high: 0 0% 89%;
  --bg: 0 0% 12%;
  --bg-high: 0 0% 18%;
  --action: 217 82% 76%;
  --accent: 214 100% 87%;
  --error: 0 62% 50%;
  --btn-text: hsl(217 50% 12%);
  --border-radius: 1.75rem;
}

.theme-light body {
  --text: 220 9% 46%;
  --text-high: 0 0% 13%;
  --bg: 0 0% 100%;
  --bg-high: 0 0% 97%;
  --action: 217 89% 61%;
  --accent: 214 82% 35%;
  --error: 0 72% 51%;
  --btn-text: white;
}

@media (prefers-color-scheme: dark) {
  body:not(.theme-light) {
    --text: 220 5% 65%;
    --text-high: 0 0% 89%;
    --bg: 0 0% 12%;
    --bg-high: 0 0% 18%;
    --action: 217 82% 76%;
    --accent: 214 100% 87%;
    --error: 0 62% 50%;
    --btn-text: hsl(217 50% 12%);
  }
}

/* ── Base ── */
body {
  font-family: "Roboto", system-ui, -apple-system, "Segoe UI", sans-serif !important;
  -webkit-font-smoothing: antialiased !important;
  -moz-osx-font-smoothing: grayscale !important;
  font-feature-settings: "rlig" 1, "calt" 1 !important;
  color: hsl(var(--text-high)) !important;
  background-color: hsl(var(--bg)) !important;
  background-image:
    radial-gradient(ellipse 60% 50% at 50% -8%, hsl(217 80% 55% / 0.12), transparent 78%),
    radial-gradient(ellipse 45% 38% at 88% 22%, hsl(280 60% 55% / 0.08), transparent 75%),
    radial-gradient(ellipse 50% 42% at 12% 78%, hsl(195 70% 45% / 0.07), transparent 76%) !important;
  background-attachment: fixed !important;
}

img[alt="Rauthy Logo"] { display: none !important; }
nav#mainNav img[alt="Rauthy Logo"] {
  display: block !important;
}
/* Sprache + Dark Mode überall ausblenden — nur Admin-Sidebar behalten */
.svelte-fexfbq,
.container.svelte-718o94 {
  display: none !important;
}

nav#mainNav .svelte-fexfbq,
nav#mainNav .container.svelte-718o94,
nav.svelte-19v0oqr .svelte-fexfbq,
nav.svelte-19v0oqr .container.svelte-718o94 {
  display: block !important;
}
.tz { display: none !important; }

/* ── Glass surfaces ── */
.glass-rz {
  background: hsl(var(--text-high) / 0.05) !important;
  border: 1px solid hsl(var(--text-high) / 0.08) !important;
  box-shadow: inset 0 1px 0 0 hsl(var(--text-high) / 0.06), var(--rz-shadow-soft) !important;
}

.container.svelte-10jnm51,
.container.svelte-1fx4r2m,
.container.svelte-1iwbfuj,
.container.svelte-1mqlrtv,
.wide.svelte-1tcx7rf {
  border-radius: var(--rz-radius-surface) !important;
}

.wide.svelte-1tcx7rf {
  background: hsl(var(--text-high) / 0.05) !important;
  border: 1px solid hsl(var(--text-high) / 0.08) !important;
  box-shadow: inset 0 1px 0 0 hsl(var(--text-high) / 0.06), var(--rz-shadow-soft) !important;
}

.container.svelte-10jnm51,
.container.svelte-1fx4r2m,
.container.svelte-1iwbfuj,
.container.svelte-1mqlrtv,
.wide.svelte-1tcx7rf {
  position: relative !important;
  isolation: isolate !important;
}

.container.svelte-10jnm51,
.container.svelte-1fx4r2m,
.container.svelte-1iwbfuj,
.container.svelte-1mqlrtv {
  background: hsl(var(--text-high) / 0.05) !important;
  border: 1px solid hsl(var(--text-high) / 0.08) !important;
  box-shadow: inset 0 1px 0 0 hsl(var(--text-high) / 0.06), var(--rz-shadow-soft) !important;
}

.container.svelte-10jnm51::before,
.container.svelte-1fx4r2m::before,
.container.svelte-1iwbfuj::before,
.container.svelte-1mqlrtv::before,
.wide.svelte-1tcx7rf::before {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  border-radius: inherit !important;
  -webkit-backdrop-filter: blur(12px) saturate(1.2) !important;
  backdrop-filter: blur(12px) saturate(1.2) !important;
  z-index: -1 !important;
  pointer-events: none !important;
}

/* ── Typography ── */
.name.svelte-1fx4r2m h2 {
  font-size: 1.375rem !important;
  font-weight: 400 !important;
  line-height: 1.75rem !important;
  letter-spacing: -0.02em !important;
  color: hsl(var(--text-high)) !important;
}

label.svelte-cyvqq2,
.label.svelte-cyvqq2 label {
  font-size: 0.75rem !important;
  font-weight: 500 !important;
  letter-spacing: 0.025em !important;
  color: hsl(var(--text)) !important;
}

/* ── Inputs ── */
input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]):not([type="color"]):not([type="range"]):not([type="file"]),
.input,
textarea,
select {
  height: 2.75rem !important;
  border-radius: var(--rz-radius-pill) !important;
  background: hsl(var(--text-high) / 0.04) !important;
  border: 1px solid hsl(var(--text-high) / 0.08) !important;
  padding: 0 1rem !important;
  font-size: 0.875rem !important;
  font-weight: 400 !important;
  color: hsl(var(--text-high)) !important;
  outline: none !important;
  box-shadow: none !important;
  transition: background-color 200ms var(--rz-motion), border-color 200ms var(--rz-motion) !important;
}

textarea {
  min-height: 5.5rem !important;
  height: auto !important;
  border-radius: var(--rz-radius-inner) !important;
  padding: 0.75rem 1rem !important;
}

input::placeholder,
textarea::placeholder {
  color: hsl(var(--text) / 0.6) !important;
}

input:focus,
.input:focus,
textarea:focus,
select:focus {
  background: hsl(var(--text-high) / 0.06) !important;
  border-color: hsl(var(--text-high) / 0.15) !important;
}

input:disabled,
input[disabled],
input[aria-disabled="true"],
textarea:disabled,
textarea[disabled],
select:disabled,
select[disabled] {
  background: hsl(var(--text-high) / 0.03) !important;
  border-color: hsl(var(--text-high) / 0.07) !important;
  color: hsl(var(--text-high) / 0.68) !important;
  -webkit-text-fill-color: hsl(var(--text-high) / 0.68) !important;
  cursor: not-allowed !important;
  opacity: 1 !important;
  box-shadow: inset 0 1px 0 0 hsl(var(--text-high) / 0.03) !important;
}

input:read-only:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]),
textarea:read-only {
  background: hsl(var(--text-high) / 0.03) !important;
  border-color: hsl(var(--text-high) / 0.07) !important;
  color: hsl(var(--text-high) / 0.68) !important;
  -webkit-text-fill-color: hsl(var(--text-high) / 0.68) !important;
  cursor: default !important;
  opacity: 1 !important;
  box-shadow: inset 0 1px 0 0 hsl(var(--text-high) / 0.03) !important;
}

/* Bevorzugter Benutzername — read-only Feld + Info-Icon */
.inner.svelte-1tcx7rf div.value {
  height: 2.75rem !important;
  min-height: 2.75rem !important;
  align-items: center !important;
  padding: 0 0.35rem 0 0 !important;
  border-radius: var(--rz-radius-pill) !important;
  background: hsl(var(--text-high) / 0.03) !important;
  border: 1px solid hsl(var(--text-high) / 0.08) !important;
  box-shadow: inset 0 1px 0 0 hsl(var(--text-high) / 0.04) !important;
}

.inner.svelte-1tcx7rf div.value .name {
  flex: 1 1 auto !important;
  min-width: 0 !important;
  padding: 0 0.5rem 0 1rem !important;
  font-size: 0.875rem !important;
  font-weight: 400 !important;
  color: hsl(var(--text-high) / 0.68) !important;
}

.inner.svelte-1tcx7rf div.value .btn {
  margin-top: 0 !important;
  display: flex !important;
  align-items: center !important;
  padding-right: 0.2rem !important;
}

.inner.svelte-1tcx7rf .immutableInfo,
.immutableInfo {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 1.625rem !important;
  height: 1.625rem !important;
  margin: 0 !important;
  transform: none !important;
  color: hsl(var(--action)) !important;
  background: hsl(var(--text-high) / 0.06) !important;
  border: 1px solid hsl(var(--text-high) / 0.1) !important;
  border-radius: 9999px !important;
  flex-shrink: 0 !important;
}

.inner.svelte-1tcx7rf .immutableInfo svg,
.immutableInfo svg {
  opacity: 1 !important;
  stroke: hsl(var(--action)) !important;
  width: 0.9rem !important;
}

div[role="tooltip"]:has(.immutableInfo) {
  display: inline-flex !important;
  align-items: center !important;
}

/* ── Buttons ── */
button.svelte-b26n8o:not(.invisible) {
  height: 2.75rem !important;
  min-height: 2.75rem !important;
  padding: 0 1.25rem !important;
  border-radius: var(--rz-radius-pill) !important;
  font-size: 0.875rem !important;
  font-weight: 500 !important;
  letter-spacing: 0.01em !important;
  transition:
    color 200ms var(--rz-motion),
    background-color 200ms var(--rz-motion),
    border-color 200ms var(--rz-motion),
    transform 200ms var(--rz-motion),
    box-shadow 200ms var(--rz-motion) !important;
}

button.svelte-b26n8o:not(.invisible):hover {
  box-shadow: var(--rz-shadow-soft) !important;
}

button.svelte-b26n8o:not(.invisible):active {
  transform: scale(0.98) !important;
}

button.svelte-b26n8o:not(.invisible):focus-visible {
  outline: 2px solid hsl(var(--action) / 0.5) !important;
  outline-offset: 2px !important;
}

button.l1.svelte-b26n8o {
  color: var(--btn-text) !important;
  background: hsl(var(--action)) !important;
  border: none !important;
  box-shadow: var(--rz-shadow-soft) !important;
}

button.l1.svelte-b26n8o:hover {
  background: hsl(var(--action) / 0.9) !important;
}

button.l2.svelte-b26n8o {
  color: hsl(var(--text-high)) !important;
  background: hsl(var(--text-high) / 0.04) !important;
  border: 1px solid hsl(var(--text-high) / 0.1) !important;
}

button.l2.svelte-b26n8o:hover {
  background: hsl(var(--text-high) / 0.08) !important;
  border-color: hsl(var(--text-high) / 0.14) !important;
}

button.l3.svelte-b26n8o {
  color: hsl(var(--action)) !important;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
}

button.l3.svelte-b26n8o:hover {
  background: hsl(var(--text-high) / 0.06) !important;
}

/* OAuth provider buttons */
.providers.svelte-1fx4r2m button,
.providers.svelte-10jnm51 button,
button.l2.svelte-b26n8o {
  width: 100% !important;
}

.inline.svelte-1afr42s {
  gap: 0.625rem !important;
}

.name.svelte-1afr42s {
  font-weight: 500 !important;
  color: hsl(var(--text-high)) !important;
}

/* ── Index landing — compact, same glass as login ── */
main.svelte-18mg5l2:has(.btn.svelte-1uha8ag) {
  min-height: 100dvh !important;
  justify-content: center !important;
  align-items: center !important;
}

main.svelte-18mg5l2:has(.btn.svelte-1uha8ag) .svelte-hshu7b {
  position: relative !important;
  isolation: isolate !important;
  width: min(100%, 24rem) !important;
  height: auto !important;
  min-height: 0 !important;
  flex: 0 0 auto !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  gap: 0 !important;
  padding: 2rem 1.75rem !important;
  margin: 1.5rem !important;
  text-align: center !important;
  border-radius: var(--rz-radius-surface) !important;
  background: hsl(var(--text-high) / 0.05) !important;
  border: 1px solid hsl(var(--text-high) / 0.08) !important;
  box-shadow: inset 0 1px 0 0 hsl(var(--text-high) / 0.06), var(--rz-shadow-soft) !important;
}

main.svelte-18mg5l2:has(.btn.svelte-1uha8ag) .svelte-hshu7b::after {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  border-radius: inherit !important;
  -webkit-backdrop-filter: blur(12px) saturate(1.2) !important;
  backdrop-filter: blur(12px) saturate(1.2) !important;
  z-index: -1 !important;
  pointer-events: none !important;
}

/* Shared mark icon — index, login, register, logout, new account */
main.svelte-18mg5l2:has(.btn.svelte-1uha8ag) .svelte-hshu7b::before,
.container.svelte-1iwbfuj h1::before,
.container.svelte-1mqlrtv h1::before,
.name.svelte-1fx4r2m h2::before,
.domainTxt.svelte-10jnm51 h1::before {
  content: "" !important;
  display: block !important;
  width: 3rem !important;
  height: 3rem !important;
  margin: 0 auto 1.25rem !important;
  border-radius: 50% !important;
  background-color: hsl(var(--action) / 0.12) !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
  background-size: 1.375rem !important;
  border: 1px solid hsl(var(--action) / 0.2) !important;
  box-shadow: inset 0 1px 0 0 hsl(var(--text-high) / 0.06) !important;
}

main.svelte-18mg5l2:has(.btn.svelte-1uha8ag) .svelte-hshu7b::before,
.name.svelte-1fx4r2m h2::before,
.container.svelte-1mqlrtv h1::before {
  background-image: url("/rauthy-icons/key.svg?v=2") !important;
}

main.svelte-18mg5l2:has(.btn.svelte-1uha8ag) .svelte-hshu7b::before {
  flex: 0 0 auto !important;
  align-self: center !important;
}

.domainTxt.svelte-10jnm51 h1::before {
  background-image: url("/rauthy-icons/register.svg") !important;
}

.container.svelte-1iwbfuj h1::before {
  background-image: url("/rauthy-icons/logout.svg") !important;
}

.svelte-hshu7b:has(.btn.svelte-1uha8ag) > .container.svelte-718o94,
.svelte-hshu7b:has(.btn.svelte-1uha8ag) > .svelte-fexfbq {
  display: none !important;
}

.btn.svelte-1uha8ag {
  width: 100% !important;
  align-self: stretch !important;
  min-width: unset !important;
  height: auto !important;
  padding: 0 !important;
  margin: 0 !important;
  gap: 0.75rem !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

.btn.svelte-1uha8ag button {
  width: 100% !important;
}

.btn.svelte-1uha8ag > button.l3.svelte-b26n8o {
  width: 100% !important;
  height: 2.75rem !important;
  min-height: 2.75rem !important;
  margin-top: 0.25rem !important;
  border: none !important;
  background: transparent !important;
  color: hsl(var(--action)) !important;
  box-shadow: none !important;
}

.btn.svelte-1uha8ag > button.l3.svelte-b26n8o:hover {
  background: hsl(var(--text-high) / 0.06) !important;
  box-shadow: none !important;
}

/* ── Login / Register card ── */
.outer.svelte-1fx4r2m {
  background: transparent !important;
}

.container.svelte-10jnm51,
.container.svelte-1fx4r2m,
.container.svelte-1iwbfuj {
  padding: 2.25rem 2rem !important;
  max-width: 28rem !important;
  width: min(100%, 28rem) !important;
}

/* ── OIDC Logout confirmation ── */
main.svelte-18mg5l2:has(.container.svelte-1iwbfuj) {
  min-height: 100dvh !important;
  justify-content: center !important;
  align-items: center !important;
}

main.svelte-18mg5l2:has(.container.svelte-1iwbfuj) .svelte-hshu7b {
  width: 100% !important;
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  padding: 1.5rem !important;
}

.container.svelte-1iwbfuj {
  width: min(100%, 28rem) !important;
  text-align: center !important;
}

.container.svelte-1iwbfuj h1 {
  margin: 0 0 0.75rem !important;
  font-size: 1.375rem !important;
  font-weight: 400 !important;
  line-height: 1.75rem !important;
  letter-spacing: -0.02em !important;
  color: hsl(var(--text-high)) !important;
}

.container.svelte-1iwbfuj p {
  margin: 0 !important;
  max-width: 20rem !important;
  font-size: 0.875rem !important;
  line-height: 1.5 !important;
  color: hsl(var(--text) / 0.82) !important;
}

.btn.svelte-1iwbfuj {
  margin-top: 1.5rem !important;
  width: 100% !important;
  justify-content: center !important;
  flex-wrap: wrap !important;
  gap: 0.75rem !important;
}

.err.svelte-1iwbfuj {
  margin-top: 1rem !important;
  padding: 0.5rem 0.75rem !important;
  border-radius: var(--rz-radius-inner) !important;
  background: hsl(var(--error) / 0.08) !important;
  border: 1px solid hsl(var(--error) / 0.2) !important;
  font-size: 0.8125rem !important;
}

/* ── New Account (type choice) ── */
main.svelte-18mg5l2:has(.container.svelte-1mqlrtv) {
  min-height: 100dvh !important;
  justify-content: center !important;
  align-items: center !important;
}

main.svelte-18mg5l2:has(.container.svelte-1mqlrtv) .svelte-hshu7b {
  width: 100% !important;
  height: auto !important;
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  padding: 1.5rem !important;
}

.svelte-hshu7b:has(.container.svelte-1mqlrtv) > .container.svelte-718o94,
.svelte-hshu7b:has(.container.svelte-1mqlrtv) > .svelte-fexfbq {
  display: none !important;
}

.container.svelte-1mqlrtv {
  width: min(100%, 28rem) !important;
  max-width: 28rem !important;
  max-height: none !important;
  margin: 0 !important;
  margin-top: 0 !important;
  padding: 2.25rem 2rem !important;
  overflow: visible !important;
  text-align: center !important;
}

.container.svelte-1mqlrtv h1 {
  margin: 0 0 0.75rem !important;
  font-size: 1.375rem !important;
  font-weight: 400 !important;
  line-height: 1.75rem !important;
  letter-spacing: -0.02em !important;
  color: hsl(var(--text-high)) !important;
}

.container.svelte-1mqlrtv > p:first-of-type {
  margin: 0 0 1.5rem !important;
  font-size: 0.875rem !important;
  line-height: 1.5 !important;
  color: hsl(var(--text) / 0.82) !important;
}

.container.svelte-1mqlrtv > p:nth-of-type(2) {
  display: none !important;
}

.typeChoice.svelte-1mqlrtv {
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
  gap: 0.75rem !important;
  width: 100% !important;
  margin: 0 0 1rem !important;
}

.typeChoice.svelte-1mqlrtv button.svelte-b26n8o {
  width: 100% !important;
  min-height: 2.75rem !important;
}

.container.svelte-1mqlrtv form {
  width: 100% !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
  gap: 1rem !important;
}

.container.svelte-1mqlrtv [style*="width"] {
  width: 100% !important;
  max-width: 100% !important;
}

.container.svelte-1mqlrtv .err.svelte-1mqlrtv {
  margin-top: 1rem !important;
  max-width: 100% !important;
  padding: 0.5rem 0.75rem !important;
  border-radius: var(--rz-radius-inner) !important;
  background: hsl(var(--error) / 0.08) !important;
  border: 1px solid hsl(var(--error) / 0.2) !important;
  font-size: 0.8125rem !important;
  text-align: center !important;
}

.head.svelte-1fx4r2m { display: none !important; }

.name.svelte-1fx4r2m,
.domainTxt.svelte-10jnm51 {
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  align-items: center !important;
  width: 100% !important;
  margin: 0 0 1.5rem !important;
  padding: 0 !important;
}

.name.svelte-1fx4r2m h2,
.domainTxt.svelte-10jnm51 h1 {
  width: 100% !important;
  margin: 0 0 0.75rem !important;
  padding: 0 !important;
  text-align: center !important;
  font-size: 1.375rem !important;
  font-weight: 400 !important;
  line-height: 1.75rem !important;
  letter-spacing: -0.02em !important;
  color: hsl(var(--text-high)) !important;
}

.domainTxt.svelte-10jnm51 h1 {
  font-size: 0 !important;
  line-height: 0 !important;
  color: transparent !important;
}

.domainTxt.svelte-10jnm51 h1::after {
  content: "Registrieren" !important;
  display: block !important;
  font-size: 1.375rem !important;
  font-weight: 400 !important;
  line-height: 1.75rem !important;
  letter-spacing: -0.02em !important;
  color: hsl(var(--text-high)) !important;
}

.domainTxt.svelte-10jnm51 {
  font-size: 0.875rem !important;
  line-height: 1.5 !important;
  color: hsl(var(--text) / 0.82) !important;
}

.container.svelte-1fx4r2m form,
.container.svelte-10jnm51 form {
  width: 100% !important;
  max-width: 100% !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
  gap: 1rem !important;
}

.container.svelte-1fx4r2m [style*="width"],
.container.svelte-10jnm51 [style*="width"] {
  width: 100% !important;
  max-width: 100% !important;
}

.emailMinHeight.svelte-1fx4r2m {
  min-height: auto !important;
  width: 100% !important;
}

.loginWith.svelte-1fx4r2m > div,
.registerWith.svelte-10jnm51 > div {
  padding: 0 0.25rem !important;
  font-size: 0.75rem !important;
  font-weight: 500 !important;
  letter-spacing: 0.02em !important;
  color: hsl(var(--text) / 0.72) !important;
  background: transparent !important;
  white-space: nowrap !important;
}

.loginWith.svelte-1fx4r2m,
.registerWith.svelte-10jnm51 {
  flex: 0 0 auto !important;
  margin: 0 !important;
  padding: 0 !important;
  display: flex !important;
  align-items: center !important;
}

.providersSeparator.svelte-1fx4r2m,
.providersSeparator.svelte-10jnm51 {
  display: flex !important;
  align-items: center !important;
  gap: 0.75rem !important;
  width: 100% !important;
  margin: 1.5rem 0 1rem !important;
}

.providersSeparator.svelte-1fx4r2m::after,
.providersSeparator.svelte-10jnm51::after {
  content: "" !important;
  flex: 1 1 0 !important;
  min-width: 0 !important;
  height: 1px !important;
  background: hsl(var(--text-high) / 0.1) !important;
}

.separator.svelte-1fx4r2m,
.separator.svelte-10jnm51 {
  flex: 1 1 0 !important;
  min-width: 0 !important;
  height: 1px !important;
  margin: 0 !important;
  background: hsl(var(--text-high) / 0.1) !important;
}

.providers.svelte-1fx4r2m,
.providers.svelte-10jnm51 {
  display: flex !important;
  flex-direction: column !important;
  gap: 0.5rem !important;
  width: 100% !important;
  margin-top: 0.75rem !important;
}

.providers.svelte-1fx4r2m button,
.providers.svelte-10jnm51 button,
.btn.flex-col.svelte-1fx4r2m button,
.submit.svelte-10jnm51 button {
  width: 100% !important;
  min-height: 2.75rem !important;
}

.btn.flex-col.svelte-1fx4r2m,
.submit.svelte-10jnm51 {
  margin: 0 !important;
  width: 100% !important;
}

.reg.svelte-1fx4r2m,
.forgotten.svelte-1fx4r2m a,
.reg.svelte-1fx4r2m a {
  color: hsl(var(--action)) !important;
  text-decoration: none !important;
  font-size: 0.875rem !important;
  font-weight: 500 !important;
  transition: opacity 200ms var(--rz-motion) !important;
}

.reg.svelte-1fx4r2m {
  display: block !important;
  width: 100% !important;
  text-align: center !important;
  margin: 1.25rem 0 0 !important;
  padding: 0 !important;
  line-height: 1.5 !important;
}

.reg.svelte-1fx4r2m a {
  display: inline-block !important;
  padding: 0.35rem 0.5rem !important;
  border-radius: var(--rz-radius-pill) !important;
}

.reg.svelte-1fx4r2m a:hover,
.forgotten.svelte-1fx4r2m a:hover {
  opacity: 0.85 !important;
  background: hsl(var(--text-high) / 0.06) !important;
}

.label.svelte-cyvqq2 {
  padding-left: 0.35rem !important;
  margin-bottom: 0.35rem !important;
}

/* ── Account ── */
.wrapper.svelte-1tcx7rf:has(.wide.svelte-1tcx7rf) {
  justify-content: center !important;
  align-items: center !important;
  padding: 1rem !important;
}

.container.svelte-1tcx7rf {
  position: relative !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
  flex: 1 1 auto !important;
  min-width: 0 !important;
  width: auto !important;
}

.wide.svelte-1tcx7rf,
.wide.svelte-1tcx7rf:has(.info.svelte-1tcx7rf) {
  display: flex !important;
  flex-direction: row !important;
  align-items: stretch !important;
  width: min(68rem, calc(100vw - 2rem)) !important;
  max-width: 68rem !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: min(92dvh, 56rem) !important;
  padding: 1.5rem !important;
  gap: 1.75rem !important;
  border-radius: var(--rz-radius-surface) !important;
}

.info.svelte-1tcx7rf {
  flex: 0 0 27rem !important;
  width: 27rem !important;
  min-width: 27rem !important;
  max-width: 27rem !important;
  border-right: 1px solid hsl(var(--text-high) / 0.08) !important;
  padding: 0.25rem 1rem 1rem 1rem !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  scrollbar-width: thin !important;
  scrollbar-color: hsl(var(--text-high) / 0.18) transparent !important;
}

.info.svelte-1tcx7rf > div {
  display: flex !important;
  flex-direction: column !important;
  gap: 0 !important;
  min-width: 0 !important;
  padding-bottom: 3.75rem !important;
}

/* Avatar-Block — mittig (unabhängig vom Wrapper) */
.info.svelte-1tcx7rf > div > div:has(.container.svelte-1avazsq),
.info.svelte-1tcx7rf > div > div:has(.container.svelte-1avazsq) > div {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  margin: 0 0 1rem !important;
  padding: 0.5rem 0 0.75rem !important;
  border-bottom: none !important;
}

.info.svelte-1tcx7rf > div > div:has(.container.svelte-1avazsq) > div:empty {
  display: none !important;
}

.info.svelte-1tcx7rf > div > div:has(.container.svelte-1avazsq) * {
  margin-left: 0 !important;
  margin-right: 0 !important;
}

.info.svelte-1tcx7rf .container.svelte-1avazsq {
  position: relative !important;
  display: inline-flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  align-items: center !important;
  width: auto !important;
  max-width: 100% !important;
  margin: 0 auto !important;
  padding: 0 !important;
  float: none !important;
}

.info.svelte-1tcx7rf form.avatar.svelte-1avazsq,
.info.svelte-1tcx7rf span.avatar.svelte-1avazsq,
.info.svelte-1tcx7rf .avatar.svelte-1avazsq {
  width: 4.5rem !important;
  height: 4.5rem !important;
  min-width: 4.5rem !important;
  max-width: 4.5rem !important;
  min-height: 4.5rem !important;
  max-height: 4.5rem !important;
  margin: 0 auto !important;
  margin-left: auto !important;
  margin-right: auto !important;
  border-radius: 1rem !important;
  flex-shrink: 0 !important;
  float: none !important;
  position: relative !important;
  left: auto !important;
  right: auto !important;
  transform: none !important;
}

.info.svelte-1tcx7rf .avatar.svelte-1avazsq label.svelte-1avazsq {
  width: 4.5rem !important;
  height: 4.5rem !important;
  border-radius: 1rem !important;
}

.info.svelte-1tcx7rf .avatar.svelte-1avazsq img.svelte-1avazsq {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  border-radius: 1rem !important;
}

/* File-Upload unsichtbar — kein „Keine Datei…“-Text */
.info.svelte-1tcx7rf input[type="file"].svelte-1avazsq {
  position: absolute !important;
  inset: 0 !important;
  width: 0 !important;
  height: 0 !important;
  min-width: 0 !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  opacity: 0 !important;
  border: none !important;
  background: transparent !important;
  box-shadow: none !important;
  pointer-events: none !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
}

/* Hover: dezentes Overlay, kein Upload-Pfeil */
.info.svelte-1tcx7rf .avatar.svelte-1avazsq label.svelte-1avazsq {
  opacity: 0 !important;
  background: transparent !important;
  border-radius: 1rem !important;
  cursor: pointer !important;
}

.info.svelte-1tcx7rf .avatar.svelte-1avazsq label.svelte-1avazsq > *,
.info.svelte-1tcx7rf .avatar.svelte-1avazsq label.svelte-1avazsq svg {
  display: none !important;
}

.info.svelte-1tcx7rf form.avatar.svelte-1avazsq:hover label.svelte-1avazsq,
.info.svelte-1tcx7rf form.avatar.svelte-1avazsq:focus-within label.svelte-1avazsq,
.info.svelte-1tcx7rf .avatar.svelte-1avazsq label.svelte-1avazsq[data-show="true"] {
  opacity: 1 !important;
  background: hsl(var(--bg) / 0.22) !important;
}

.info.svelte-1tcx7rf .avatar.svelte-1avazsq span.absolute.svelte-1avazsq,
.info.svelte-1tcx7rf .font-large.svelte-1avazsq,
.info.svelte-1tcx7rf .font-medium.svelte-1avazsq,
.info.svelte-1tcx7rf .font-small.svelte-1avazsq {
  position: absolute !important;
  inset: 0 !important;
  top: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  height: 100% !important;
  font-size: 1.25rem !important;
  line-height: 1 !important;
  letter-spacing: -0.02em !important;
  background: transparent !important;
  z-index: 1 !important;
}

/* Löschen — kleiner Badge oben rechts auf dem Avatar */
.info.svelte-1tcx7rf .container.svelte-1avazsq > div:has(> .delete.svelte-1avazsq) {
  position: absolute !important;
  top: 0 !important;
  left: 50% !important;
  width: 4.5rem !important;
  height: 4.5rem !important;
  transform: translateX(-50%) !important;
  pointer-events: none !important;
  margin: 0 !important;
}

.info.svelte-1tcx7rf .delete.svelte-1avazsq {
  position: absolute !important;
  top: -0.2rem !important;
  right: -0.2rem !important;
  left: auto !important;
  bottom: auto !important;
  pointer-events: auto !important;
  z-index: 4 !important;
}

.info.svelte-1tcx7rf .delete.svelte-1avazsq button.svelte-b26n8o {
  width: 1.375rem !important;
  height: 1.375rem !important;
  min-width: 1.375rem !important;
  min-height: 1.375rem !important;
  padding: 0 !important;
  border-radius: 9999px !important;
  background: hsl(var(--bg) / 0.92) !important;
  border: 1px solid hsl(var(--text-high) / 0.14) !important;
  color: hsl(var(--error)) !important;
  box-shadow: 0 1px 2px hsl(var(--bg) / 0.35) !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  line-height: 1 !important;
  opacity: 1 !important;
}

.info.svelte-1tcx7rf .delete.svelte-1avazsq button.svelte-b26n8o:hover {
  background: hsl(var(--error) / 0.12) !important;
  border-color: hsl(var(--error) / 0.35) !important;
  color: hsl(var(--error)) !important;
  box-shadow: var(--rz-shadow-soft) !important;
}

.info.svelte-1tcx7rf .delete.svelte-1avazsq button.svelte-b26n8o svg {
  width: 0.7rem !important;
  height: 0.7rem !important;
}

.logo.svelte-4il8gz {
  width: 4.5rem !important;
  height: 4.5rem !important;
  margin: 0 auto !important;
  border-radius: 1rem !important;
  overflow: hidden !important;
  display: flex !important;
}

.inner.svelte-1tcx7rf,
.innerPhone.svelte-1tcx7rf {
  flex: 1 1 auto !important;
  min-width: 0 !important;
  width: auto !important;
  margin-top: 0 !important;
  padding: 0 !important;
  max-height: calc(92dvh - 4rem) !important;
  overflow-y: auto !important;
  border-radius: var(--rz-radius-inner) !important;
}

/* Profilzeilen — eine Zeile pro Eintrag */
.info.svelte-1tcx7rf > div > div:not(:first-child),
.info.svelte-1tcx7rf div:has(> .label.svelte-hh3gic),
.row.svelte-hh3gic {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  gap: 0.5rem !important;
  padding: 0.38rem 0 !important;
  min-height: 1.75rem !important;
  border-bottom: 1px solid hsl(var(--text-high) / 0.05) !important;
}

.info.svelte-1tcx7rf > div > div:not(:first-child) > div:first-child,
.label.svelte-hh3gic,
.labelPhone.svelte-hh3gic {
  flex: 0 0 6.5rem !important;
  width: 6.5rem !important;
  margin: 0 !important;
  padding: 0 !important;
  font-size: 0.6875rem !important;
  font-weight: 500 !important;
  letter-spacing: 0.02em !important;
  line-height: 1.1rem !important;
  color: hsl(var(--text) / 0.58) !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

.value.svelte-hh3gic {
  flex: 1 1 auto !important;
  width: auto !important;
  min-width: 0 !important;
  max-width: none !important;
  padding: 0 !important;
  margin: 0 !important;
  font-size: 0.8125rem !important;
  line-height: 1.2rem !important;
  color: hsl(var(--text-high)) !important;
  text-align: right !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

.info.svelte-1tcx7rf > div > div:not(:first-child):not(:has(.container.svelte-1avazsq)) > div:not(:first-child),
.info.svelte-1tcx7rf div:has(> .label.svelte-hh3gic):not(:has(.container.svelte-1avazsq)) > div:not(.label) {
  flex: 0 0 auto !important;
  width: auto !important;
  min-width: 0 !important;
  display: flex !important;
  justify-content: flex-end !important;
  align-items: center !important;
  margin-left: auto !important;
}

/* Haken / Icons rechtsbündig */
.info.svelte-1tcx7rf > div > div:not(:first-child):not(:has(.container.svelte-1avazsq)) > *:not(:first-child),
.info.svelte-1tcx7rf > div > div:not(:first-child):not(:has(.container.svelte-1avazsq)) svg {
  margin-left: auto !important;
  flex-shrink: 0 !important;
}

.info.svelte-1tcx7rf > div > div:not(:first-child):has(.fed-btn.svelte-hh3gic),
.info.svelte-1tcx7rf > div > div:not(:first-child):has(.providers.svelte-hh3gic) {
  align-items: flex-start !important;
  flex-wrap: wrap !important;
}

.info.svelte-1tcx7rf > div > div:not(:first-child):has(.fed-btn.svelte-hh3gic) > div:not(:first-child) {
  flex: 1 1 0 !important;
  min-width: 0 !important;
  max-width: 100% !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-end !important;
  gap: 0.25rem !important;
  margin-left: auto !important;
  white-space: normal !important;
  overflow: visible !important;
}

.info.svelte-1tcx7rf > div > div:not(:first-child):has(.fed-btn.svelte-hh3gic) .value.svelte-hh3gic {
  white-space: normal !important;
  overflow: visible !important;
  text-overflow: clip !important;
  word-break: break-word !important;
  width: 100% !important;
  text-align: right !important;
}

.fed-btn.svelte-hh3gic,
.providers.svelte-hh3gic {
  margin: 0 !important;
  margin-left: 0 !important;
  white-space: nowrap !important;
  flex-shrink: 0 !important;
}

.fed-btn.svelte-hh3gic a,
.providers.svelte-hh3gic a {
  display: inline-block !important;
  white-space: nowrap !important;
}

.link-err.svelte-hh3gic,
.fed-btn.svelte-hh3gic a {
  color: hsl(var(--action)) !important;
  font-weight: 500 !important;
}

/* Logout — unten links, innerhalb der Profilspalte */
.logout.svelte-1tcx7rf {
  position: absolute !important;
  top: auto !important;
  right: auto !important;
  left: 1.5rem !important;
  bottom: 1.5rem !important;
  width: 24.5rem !important;
  z-index: 2 !important;
}

.logout.svelte-1tcx7rf button.svelte-b26n8o {
  width: 100% !important;
  min-width: 0 !important;
  min-height: 2.5rem !important;
  height: 2.5rem !important;
  padding: 0 1rem !important;
  border-radius: var(--rz-radius-pill) !important;
  background: hsl(var(--text-high) / 0.04) !important;
  border: 1px solid hsl(var(--text-high) / 0.08) !important;
  color: hsl(var(--text)) !important;
  font-size: 0.875rem !important;
  font-weight: 500 !important;
  box-shadow: none !important;
}

.logout.svelte-1tcx7rf button.svelte-b26n8o:hover {
  background: hsl(var(--error) / 0.1) !important;
  border-color: hsl(var(--error) / 0.22) !important;
  color: hsl(var(--error)) !important;
  box-shadow: var(--rz-shadow-soft) !important;
}

@media (max-width: 800px) {
  .wide.svelte-1tcx7rf {
    flex-direction: column !important;
    width: calc(100vw - 1rem) !important;
  }

  .info.svelte-1tcx7rf {
    flex: none !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
    border-right: none !important;
    border-bottom: 1px solid hsl(var(--text-high) / 0.08) !important;
    padding: 0 0 1rem !important;
  }

  .logout.svelte-1tcx7rf {
    position: static !important;
    width: 100% !important;
    order: 2 !important;
    margin-top: 0.5rem !important;
  }
}

/* Innere Account-Panels — nur Listen/Sonderbereiche */
.keysContainer.svelte-kc8qw6 {
  border-radius: var(--rz-radius-inner) !important;
  border: 1px solid hsl(var(--text-high) / 0.06) !important;
  background: hsl(var(--text-high) / 0.03) !important;
  padding: 0.875rem 1rem !important;
}

.keysHeader.svelte-kc8qw6 {
  margin-top: 1rem !important;
  margin-bottom: 0.625rem !important;
  font-weight: 600 !important;
}

.keysContainer.svelte-kc8qw6 .keyContainer.svelte-1s1nui8 {
  margin: 0 !important;
  overflow: visible !important;
}

.keysContainer.svelte-kc8qw6 .keyContainer.svelte-1s1nui8:not(:last-child) {
  margin-bottom: 0.625rem !important;
  padding-bottom: 0.625rem !important;
  border-bottom: 1px solid hsl(var(--text-high) / 0.05) !important;
}

.keysContainer.svelte-kc8qw6 .row.svelte-1s1nui8 {
  width: 100% !important;
  padding: 0.3rem 0 !important;
  gap: 0.75rem !important;
}

/* Tooltip: Rauthy setzt top/left per clientX/clientY → braucht fixed */
div[role="tooltip"] > div[style*="top:"][style*="left:"] {
  position: fixed !important;
  z-index: 2147483647 !important;
  margin: 0 !important;
  transform: none !important;
  max-width: min(20rem, calc(100vw - 1.5rem)) !important;
  white-space: normal !important;
  pointer-events: none !important;
  padding: 0.75rem 1.125rem !important;
  line-height: 1.5 !important;
  font-size: 0.8125rem !important;
  font-weight: 500 !important;
  letter-spacing: 0.01em !important;
  text-align: left !important;
  border-radius: var(--rz-radius-inner) !important;
  background: hsl(var(--text-high) / 0.08) !important;
  color: hsl(var(--text-high)) !important;
  border: 1px solid hsl(var(--text-high) / 0.12) !important;
  box-shadow: inset 0 1px 0 0 hsl(var(--text-high) / 0.06), var(--rz-shadow-floating) !important;
  -webkit-backdrop-filter: blur(12px) saturate(1.2) !important;
  backdrop-filter: blur(12px) saturate(1.2) !important;
}

div[role="tooltip"] {
  position: static !important;
  display: inline-flex !important;
  align-items: center !important;
}

.selfDelete.svelte-l0wlcg,
.hosts.svelte-7k7tzm {
  border-radius: var(--rz-radius-inner) !important;
  border: 1px solid hsl(var(--text-high) / 0.06) !important;
  background: hsl(var(--text-high) / 0.03) !important;
}

.container.svelte-kc8qw6,
.container.svelte-l0wlcg,
.container.svelte-eje6rn,
.container.svelte-xm2562,
.container.svelte-128hqhb,
.container.svelte-1rd6trt,
.container.svelte-l1u2kb {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
}

.inner.svelte-1tcx7rf p.svelte-kc8qw6,
.inner.svelte-1tcx7rf .container.svelte-kc8qw6 > p {
  margin: 0.35rem 0 0.75rem !important;
  color: hsl(var(--text) / 0.82) !important;
  line-height: 1.5 !important;
  max-width: 42rem !important;
}

.selfDelete.svelte-l0wlcg {
  border-color: hsl(var(--error) / 0.25) !important;
  background: hsl(var(--error) / 0.05) !important;
}

/* Tab bar — Ruckzugsort pill-track */
.tabs.svelte-s6j0ts {
  width: 100% !important;
  max-width: 100% !important;
  align-self: stretch !important;
  padding: 0.25rem !important;
  gap: 0.25rem !important;
  margin: 0 0 1rem !important;
  border-radius: var(--rz-radius-pill) !important;
  background: hsl(var(--text-high) / 0.05) !important;
  border: none !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  line-height: 1.25 !important;
  flex-wrap: nowrap !important;
  align-items: center !important;
  overflow-x: auto !important;
  scrollbar-width: none !important;
}

.tabs.svelte-s6j0ts::-webkit-scrollbar {
  display: none !important;
}

.tabs.center.svelte-s6j0ts {
  justify-content: flex-start !important;
}

.tab.svelte-s6j0ts {
  flex: 1 1 0 !important;
  min-height: 2.25rem !important;
  min-width: 0 !important;
  padding: 0.5rem 0.75rem !important;
  font-size: 0.8125rem !important;
  font-weight: 500 !important;
  line-height: 1.15rem !important;
  letter-spacing: 0 !important;
  color: hsl(var(--text) / 0.68) !important;
  background: transparent !important;
  border: none !important;
  border-radius: var(--rz-radius-pill) !important;
  white-space: nowrap !important;
  text-align: center !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  box-shadow: none !important;
  transition:
    color 200ms var(--rz-motion),
    background-color 200ms var(--rz-motion),
    transform 200ms var(--rz-motion) !important;
}

.tab.svelte-s6j0ts:hover {
  color: hsl(var(--text-high)) !important;
  background: hsl(var(--text-high) / 0.04) !important;
}

.tab.svelte-s6j0ts:active {
  transform: scale(0.98) !important;
}

.tab[data-selected="true"].svelte-s6j0ts {
  color: hsl(var(--text-high)) !important;
  background: hsl(var(--text-high) / 0.1) !important;
  border: none !important;
  border-radius: var(--rz-radius-pill) !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

/* ── Admin shell (visual only) ── */
nav.svelte-19v0oqr,
nav#mainNav {
  background: hsl(var(--bg)) !important;
  border-right: 1px solid hsl(var(--text-high) / 0.06) !important;
}

.nav-container.svelte-19v0oqr,
nav#mainNav .nav-container {
  background: hsl(var(--text-high) / 0.03) !important;
}

nav#mainNav .logo,
nav.svelte-19v0oqr .logo {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 0.25rem 0 0.75rem !important;
  margin-bottom: 0.25rem !important;
  border-radius: var(--rz-radius-inner) !important;
  overflow: visible !important;
}

nav#mainNav .logo img[alt="Rauthy Logo"],
nav.svelte-19v0oqr .logo img[alt="Rauthy Logo"] {
  display: block !important;
  width: 100% !important;
  height: auto !important;
  max-height: 3.5rem !important;
  object-fit: contain !important;
}

nav#mainNav .menu,
nav.svelte-19v0oqr .menu {
  gap: 0.2rem !important;
  padding-right: 0.15rem !important;
}

nav#mainNav .menu a,
nav.svelte-19v0oqr .menu a {
  display: block !important;
  text-decoration: none !important;
  border-radius: var(--rz-radius-pill) !important;
  padding: 0.45rem 0.7rem !important;
  color: hsl(var(--text) / 0.82) !important;
  transition:
    background-color 200ms var(--rz-motion),
    color 200ms var(--rz-motion) !important;
}

nav#mainNav .menu a:hover,
nav.svelte-19v0oqr .menu a:hover {
  background: hsl(var(--text-high) / 0.06) !important;
  color: hsl(var(--text-high)) !important;
}

nav#mainNav .menu a[aria-current="page"],
nav.svelte-19v0oqr .menu a[aria-current="page"] {
  text-decoration: none !important;
  background: hsl(var(--text-high) / 0.1) !important;
  color: hsl(var(--text-high)) !important;
  box-shadow: inset 0 0 0 1px hsl(var(--text-high) / 0.08) !important;
}

nav#mainNav .menu a .wide,
nav.svelte-19v0oqr .menu a .wide {
  display: flex !important;
  align-items: center !important;
  gap: 0.625rem !important;
  overflow: visible !important;
  width: 100% !important;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  padding: 0 !important;
}

nav#mainNav .menu a .iconWide,
nav.svelte-19v0oqr .menu a .iconWide {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex-shrink: 0 !important;
  transform: none !important;
}

nav#mainNav .menu a[aria-current="page"] svg,
nav.svelte-19v0oqr .menu a[aria-current="page"] svg {
  stroke: hsl(var(--action)) !important;
  color: hsl(var(--action)) !important;
}

nav#mainNav .bottom,
nav.svelte-19v0oqr .bottom {
  border-top: 1px solid hsl(var(--text-high) / 0.06) !important;
  padding-top: 0.75rem !important;
}

nav#mainNav .bottom .container.svelte-718o94,
nav#mainNav .bottom .svelte-fexfbq,
nav.svelte-19v0oqr .bottom .container.svelte-718o94,
nav.svelte-19v0oqr .bottom .svelte-fexfbq {
  display: block !important;
  position: static !important;
  bottom: auto !important;
  left: auto !important;
}

/* ── Admin NavSub (Benutzerliste / Untermenü) ── */
.navSub nav {
  border-left: 1px solid hsl(var(--text-high) / 0.06) !important;
  border-right: 1px solid hsl(var(--text-high) / 0.06) !important;
  border-radius: 0 var(--rz-radius-inner) var(--rz-radius-inner) 0 !important;
  background: hsl(var(--text-high) / 0.02) !important;
}

.navSub nav > div {
  background: transparent !important;
  padding-top: 2rem !important;
  padding-bottom: 1rem !important;
  line-height: 1.4 !important;
}

.navSub .topBtns {
  margin: 0 0.5rem 0.75rem !important;
  padding: 0 0 0.75rem !important;
  border-bottom: 1px solid hsl(var(--text-high) / 0.06) !important;
}

/* Sort + Suche — zwei saubere Zeilen */
.navSub nav > div > .container {
  display: flex !important;
  align-items: stretch !important;
  flex-direction: column !important;
  flex-wrap: nowrap !important;
  gap: 0.4rem !important;
  margin: 0 0.5rem 0.75rem !important;
  min-width: 0 !important;
  max-width: calc(100% - 1rem) !important;
}

.navSub nav > div > .container > .container {
  width: 100% !important;
  flex: 0 0 auto !important;
  min-width: 0 !important;
  margin: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 0.35rem !important;
}

.navSub search.container,
.navSub search.flex.container {
  width: 100% !important;
  flex: 1 1 auto !important;
  min-width: 0 !important;
  display: flex !important;
  align-items: stretch !important;
  height: 2.125rem !important;
  min-height: 2.125rem !important;
  max-height: 2.125rem !important;
  border-radius: var(--rz-radius-pill) !important;
  background: hsl(var(--text-high) / 0.04) !important;
  border: 1px solid hsl(var(--text-high) / 0.08) !important;
  overflow: hidden !important;
}

.navSub search.container input,
.navSub search input[type="search"] {
  height: 2.125rem !important;
  min-height: 2.125rem !important;
  max-height: 2.125rem !important;
  flex: 1 1 auto !important;
  min-width: 0 !important;
  width: auto !important;
  border: none !important;
  border-radius: 0 !important;
  background: transparent !important;
  padding: 0 1.65rem 0 0.55rem !important;
  box-shadow: none !important;
  font-size: 0.8125rem !important;
}

.navSub search .options {
  flex: 0 0 auto !important;
  margin: 0 !important;
  padding: 0 0.15rem !important;
  background: hsl(var(--text-high) / 0.03) !important;
  border-right: 1px solid hsl(var(--text-high) / 0.08) !important;
  border-radius: 0 !important;
  display: flex !important;
  align-items: center !important;
}

.navSub search .options .btn,
.navSub search .options .btn[data-border="true"],
.navSub search .options .btn[data-border="false"] {
  height: 100% !important;
  min-height: 0 !important;
  border: none !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  padding: 0 0.4rem !important;
}

.navSub search .btnSearch {
  display: none !important;
}

.navSub search .relative {
  position: absolute !important;
  top: 0 !important;
  right: 0.15rem !important;
  bottom: 0 !important;
  width: 1.35rem !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

.navSub search .btnDelete {
  position: static !important;
  top: auto !important;
  right: auto !important;
  transform: none !important;
  opacity: 1 !important;
}

.navSub search .backspace {
  position: static !important;
  bottom: auto !important;
}

.navSub search .btnDelete button.svelte-b26n8o {
  height: 1.35rem !important;
  min-height: 1.35rem !important;
  width: 1.35rem !important;
  min-width: 1.35rem !important;
  padding: 0 !important;
}

/* Nur Sortier-Zeile — nicht in der Suchleiste */
.navSub nav > div > .container > .container .btn[data-border] {
  display: inline-flex !important;
  align-items: center !important;
  gap: 0.15rem !important;
  height: 1.85rem !important;
  min-height: 1.85rem !important;
  padding: 0 0.4rem !important;
  border-radius: var(--rz-radius-pill) !important;
  border: 1px solid hsl(var(--text-high) / 0.1) !important;
  background: hsl(var(--text-high) / 0.04) !important;
  color: hsl(var(--text-high) / 0.88) !important;
  font-size: 0.75rem !important;
  font-weight: 500 !important;
  white-space: nowrap !important;
}

.navSub nav > div > .container > .container .btnText {
  max-width: 4.5rem !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

.navSub nav > div > .container > .container .btn button.svelte-b26n8o {
  height: 1.85rem !important;
  min-height: 1.85rem !important;
  width: 1.85rem !important;
  min-width: 1.85rem !important;
  padding: 0 !important;
  border: none !important;
  border-radius: var(--rz-radius-pill) !important;
  background: transparent !important;
  box-shadow: none !important;
}

/* Benutzer-Einträge (nicht Pagination-li) */
.navSub nav > div > ul {
  list-style: none !important;
  margin: 0 !important;
  padding: 0 0.35rem !important;
}

.navSub .usersList > li,
.navSub nav > div > ul > .usersList li {
  border: none !important;
  border-radius: var(--rz-radius-inner) !important;
  margin: 0.08rem 0 !important;
  padding: 0 !important;
  background: transparent !important;
  transition: background-color 200ms var(--rz-motion) !important;
}

.navSub .usersList > li.pictureLeft,
.navSub nav > div > ul > .usersList li.pictureLeft {
  padding: 0 !important;
  margin: 0.08rem 0 !important;
  border-radius: var(--rz-radius-inner) !important;
}

.navSub .usersList > li.pictureLeft > div,
.navSub nav > div > ul > .usersList li.pictureLeft > div {
  margin: 0 !important;
  width: 100% !important;
}

.navSub .usersList > li.pictureLeft > div > button.svelte-b26n8o,
.navSub nav > div > ul > .usersList li.pictureLeft > div > button.svelte-b26n8o {
  padding: 0.3rem 0.45rem 0.3rem 0.3rem !important;
}

.navSub .usersList > li:nth-of-type(2n + 1),
.navSub nav > div > ul > .usersList li:nth-of-type(2n + 1) {
  background: hsl(var(--text-high) / 0.02) !important;
}

.navSub .usersList > li:hover,
.navSub nav > div > ul > .usersList li:hover {
  background: hsl(var(--text-high) / 0.06) !important;
}

.navSub .usersList > li[aria-current="page"],
.navSub nav > div > ul > .usersList li[aria-current="page"] {
  background: hsl(var(--text-high) / 0.08) !important;
  box-shadow: inset 0 0 0 1px hsl(var(--text-high) / 0.1) !important;
}

.navSub .usersList > li[aria-current="page"] div,
.navSub nav > div > ul > .usersList li[aria-current="page"] div {
  color: hsl(var(--text-high)) !important;
}

.navSub .usersList > li button.svelte-b26n8o,
.navSub nav > div > ul > .usersList li button.svelte-b26n8o {
  display: flex !important;
  height: auto !important;
  min-height: 0 !important;
  width: 100% !important;
  padding: 0.3rem 0.45rem 0.3rem 0.3rem !important;
  border: none !important;
  border-radius: inherit !important;
  background: transparent !important;
  box-shadow: none !important;
  justify-content: flex-start !important;
  align-items: center !important;
  text-align: left !important;
  font-weight: 400 !important;
}

.navSub .usersList > li button.svelte-b26n8o > div,
.navSub nav > div > ul > .usersList li button.svelte-b26n8o > div {
  width: 100% !important;
  min-width: 0 !important;
}

/* User tiles — links bündig statt zentriert + Text-Ellipsis */
.navSub .usersList li.pictureLeft button {
  display: flex !important;
  width: 100% !important;
  min-width: 0 !important;
  justify-content: flex-start !important;
  text-align: left !important;
}

.navSub .usersList li.pictureLeft button > div {
  display: flex !important;
  width: 100% !important;
  min-width: 0 !important;
  justify-content: flex-start !important;
  align-items: center !important;
}

.navSub .usersList li.pictureLeft button > div > * {
  width: 100% !important;
  min-width: 0 !important;
}

.navSub .usersList li.pictureLeft .navBtn {
  display: flex !important;
  width: 100% !important;
  min-width: 0 !important;
  align-items: center !important;
  justify-content: flex-start !important;
}

.navSub .usersList li.pictureLeft .tile {
  flex: 1 1 auto !important;
  min-width: 0 !important;
  overflow: hidden !important;
  align-items: flex-start !important;
  text-align: left !important;
}

.navSub .usersList li.pictureLeft .tile > div {
  max-width: 100% !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

.navSub .navBtn {
  display: flex !important;
  align-items: center !important;
  gap: 0.5rem !important;
  width: 100% !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
}

.navSub .navBtn .picture {
  flex: 0 0 2.25rem !important;
  width: 2.25rem !important;
  height: 2.25rem !important;
  margin: 0 !important;
  padding: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
}

.navSub .navBtn .picture .container {
  width: 2.25rem !important;
  height: 2.25rem !important;
  min-width: 2.25rem !important;
  min-height: 2.25rem !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex-shrink: 0 !important;
}

.navSub .navBtn .picture .avatar {
  width: 2.25rem !important;
  height: 2.25rem !important;
  min-width: 2.25rem !important;
  min-height: 2.25rem !important;
  border-radius: 0.65rem !important;
  overflow: hidden !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  position: relative !important;
  margin: 0 !important;
}

.navSub .navBtn .picture .avatar img.absolute,
.navSub .navBtn .picture .avatar img {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center !important;
  border-radius: inherit !important;
  margin: 0 !important;
}

.navSub .navBtn .picture .avatar .font-small,
.navSub .navBtn .picture .avatar span.absolute {
  position: absolute !important;
  inset: 0 !important;
  top: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  height: 100% !important;
  margin: 0 !important;
  font-size: 0.9rem !important;
  line-height: 1 !important;
}

.navSub .tile {
  flex: 1 1 auto !important;
  min-width: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  justify-content: center !important;
  gap: 0.1rem !important;
  line-height: 1.2 !important;
  text-align: left !important;
  overflow: hidden !important;
}

.navSub .tile > div:first-child {
  width: 100% !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

.navSub .usersList {
  margin-top: 0.35rem !important;
  padding: 0 !important;
}

.navSub .tile .muted {
  opacity: 0.62 !important;
  font-size: 0.75rem !important;
  line-height: 1.1 !important;
}

/* Pagination — alles in einer Zeile */
.navSub nav ul > .container,
.navSub .usersList ~ .container {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 0.35rem !important;
  width: calc(100% - 0.1rem) !important;
  margin: 0.45rem 0.05rem 0 !important;
  padding: 0.45rem 0.25rem 0 !important;
  border-top: 1px solid hsl(var(--text-high) / 0.06) !important;
  font-size: 0.6875rem !important;
  color: hsl(var(--text) / 0.82) !important;
  overflow: hidden !important;
}

.navSub nav ul > .container > .flex:first-child,
.navSub .usersList ~ .container > .flex:first-child {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 0.05rem !important;
  width: auto !important;
  flex: 0 0 auto !important;
  min-width: 0 !important;
}

.navSub nav ul > .container > .flex.gap-10,
.navSub .usersList ~ .container > .flex.gap-10 {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 0.35rem !important;
  width: auto !important;
  flex: 1 1 auto !important;
  min-width: 0 !important;
  overflow: hidden !important;
}

.navSub nav ul > .container .flex.gap-05,
.navSub .usersList ~ .container .flex.gap-05 {
  display: flex !important;
  align-items: center !important;
  gap: 0.2rem !important;
  min-width: 0 !important;
}

.navSub nav ul > .container .chunkSize > div:first-child,
.navSub .usersList ~ .container .chunkSize > div:first-child {
  white-space: nowrap !important;
  flex-shrink: 0 !important;
}

.navSub nav ul > .container nav,
.navSub .usersList ~ .container nav {
  margin: 0 !important;
}

.navSub nav ul > .container ul,
.navSub .usersList ~ .container ul {
  display: inline-flex !important;
  align-items: center !important;
  gap: 0.1rem !important;
  margin: 0 !important;
  padding: 0 !important;
}

.navSub nav ul > .container button.svelte-b26n8o,
.navSub .usersList ~ .container > .flex:first-child button.svelte-b26n8o {
  height: 1.4rem !important;
  min-height: 1.4rem !important;
  width: 1.4rem !important;
  min-width: 1.4rem !important;
  padding: 0 !important;
  border-radius: var(--rz-radius-pill) !important;
  background: transparent !important;
  box-shadow: none !important;
  flex-shrink: 0 !important;
}

.navSub nav ul > .container .link,
.navSub .usersList ~ .container .link {
  width: 1.2rem !important;
  min-width: 1.2rem !important;
  height: 1.2rem !important;
  margin: 0 !important;
  padding: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  border-radius: var(--rz-radius-pill) !important;
  font-size: 0.6875rem !important;
  line-height: 1 !important;
}

.navSub nav ul > .container li,
.navSub .usersList ~ .container li {
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

.navSub nav ul > .container li[aria-current="step"],
.navSub .usersList ~ .container li[aria-current="step"] {
  background: transparent !important;
  box-shadow: none !important;
}

.navSub nav ul > .container li[aria-current="step"] .link,
.navSub .usersList ~ .container li[aria-current="step"] .link {
  background: hsl(var(--text-high) / 0.1) !important;
  color: hsl(var(--action)) !important;
  font-weight: 600 !important;
  text-decoration: none !important;
}

.navSub nav ul > .container .chunkSize,
.navSub .usersList ~ .container .chunkSize {
  margin: 0 !important;
  display: flex !important;
  align-items: center !important;
  gap: 0.2rem !important;
  min-width: 0 !important;
}

.navSub nav ul > .container .chunkSize .btn,
.navSub nav ul > .container .chunkSize .btn[data-border="true"],
.navSub nav ul > .container .chunkSize .btn[data-border="false"],
.navSub .usersList ~ .container .chunkSize .btn,
.navSub .usersList ~ .container .chunkSize .btn[data-border="true"],
.navSub .usersList ~ .container .chunkSize .btn[data-border="false"] {
  height: 1.35rem !important;
  min-height: 1.35rem !important;
  padding: 0 0.25rem !important;
  font-size: 0.6875rem !important;
  border: 1px solid hsl(var(--text-high) / 0.1) !important;
  background: hsl(var(--text-high) / 0.04) !important;
}

.navSub nav ul > .container .total,
.navSub .usersList ~ .container .total {
  transform: none !important;
  font-size: 0.6875rem !important;
  color: hsl(var(--text) / 0.72) !important;
  white-space: nowrap !important;
  flex-shrink: 0 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

.navSub nav ul > .container .iconLeft,
.navSub .usersList ~ .container .iconLeft {
  margin: 0 !important;
  transform: rotate(180deg) !important;
}

.navSub nav ul > .container .iconRight,
.navSub .usersList ~ .container .iconRight {
  margin: 0 !important;
  transform: none !important;
}

#events.svelte-1xw51uq,
.events {
  background: hsl(var(--text-high) / 0.04) !important;
  border-left: 1px solid hsl(var(--text-high) / 0.06) !important;
}

.content.svelte-1qg5d05 {
  background: transparent !important;
}

/* ── Dialogs ── */
dialog.svelte-5awcn0 {
  border: 1px solid hsl(var(--text-high) / 0.08) !important;
  border-radius: var(--rz-radius-surface) !important;
  background: hsl(var(--bg) / 0.72) !important;
  box-shadow: var(--rz-shadow-floating) !important;
  -webkit-backdrop-filter: blur(12px) saturate(1.2);
  backdrop-filter: blur(12px) saturate(1.2);
}

dialog.svelte-5awcn0::backdrop {
  background: rgb(0 0 0 / 0.5) !important;
  -webkit-backdrop-filter: blur(4px);
  backdrop-filter: blur(4px);
}

/* ── Login layout + Passkey (structural — required) ── */
main.svelte-18mg5l2:has(.outer.svelte-1fx4r2m) {
  min-height: 100dvh !important;
  justify-content: center !important;
  align-items: center !important;
}

.outer.svelte-1fx4r2m {
  width: 100% !important;
  min-height: 100dvh !important;
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
}

.outer.svelte-1fx4r2m .svelte-hshu7b {
  width: 100% !important;
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
}

.loadingGlobal.svelte-1fx4r2m {
  position: fixed !important;
  inset: 0 !important;
  width: 100vw !important;
  height: 100dvh !important;
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  z-index: 99998 !important;
  margin: 0 !important;
  background: hsl(var(--bg) / 0.85) !important;
  -webkit-backdrop-filter: blur(4px);
  backdrop-filter: blur(4px);
}

.wrapperOuter.svelte-bgjnqu {
  position: fixed !important;
  inset: 0 !important;
  width: 100vw !important;
  height: 100dvh !important;
  z-index: 2147483646 !important;
  margin: 0 !important;
  padding: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  background: hsl(var(--bg) / 0.82) !important;
  -webkit-backdrop-filter: blur(8px) !important;
  backdrop-filter: blur(8px) !important;
}

.wrapperInner.svelte-bgjnqu {
  position: static !important;
  width: auto !important;
  height: auto !important;
  min-height: 0 !important;
  background: transparent !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex: 0 0 auto !important;
}

.content.svelte-bgjnqu {
  position: relative !important;
  top: auto !important;
  left: auto !important;
  transform: none !important;
  border-radius: var(--rz-radius-surface) !important;
  background: hsl(var(--text-high) / 0.06) !important;
  border: 1px solid hsl(var(--text-high) / 0.1) !important;
  -webkit-backdrop-filter: blur(12px) saturate(1.2) !important;
  backdrop-filter: blur(12px) saturate(1.2) !important;
  box-shadow: inset 0 1px 0 0 hsl(var(--text-high) / 0.06), var(--rz-shadow-floating) !important;
  min-width: min(22rem, 92vw) !important;
  padding: 1.5rem 1.75rem !important;
  margin: 0 !important;
  color: hsl(var(--text-high)) !important;
  font-weight: 500 !important;
}

.contentHeader.svelte-bgjnqu {
  font-size: 0.9375rem !important;
  font-weight: 500 !important;
  letter-spacing: 0.01em !important;
}

/* Account: Passkey-Overlay darf nicht in Sidebar/Content-Scroll gefangen werden */
.wide.svelte-1tcx7rf:has(.wrapperOuter.svelte-bgjnqu),
.info.svelte-1tcx7rf:has(.wrapperOuter.svelte-bgjnqu),
.inner.svelte-1tcx7rf:has(.wrapperOuter.svelte-bgjnqu),
.container.svelte-1tcx7rf:has(.wrapperOuter.svelte-bgjnqu) {
  overflow: visible !important;
}

.wide.svelte-1tcx7rf .wrapperOuter.svelte-bgjnqu,
.inner.svelte-1tcx7rf .wrapperOuter.svelte-bgjnqu,
.container.svelte-1tcx7rf .wrapperOuter.svelte-bgjnqu {
  position: fixed !important;
  inset: 0 !important;
  width: 100vw !important;
  height: 100dvh !important;
  margin: 0 !important;
  padding: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  z-index: 2147483646 !important;
  background: hsl(var(--bg) / 0.82) !important;
  -webkit-backdrop-filter: blur(8px) !important;
  backdrop-filter: blur(8px) !important;
}

.wide.svelte-1tcx7rf .wrapperInner.svelte-bgjnqu,
.inner.svelte-1tcx7rf .wrapperInner.svelte-bgjnqu,
.container.svelte-1tcx7rf .wrapperInner.svelte-bgjnqu {
  position: static !important;
  width: auto !important;
  height: auto !important;
  min-height: 0 !important;
  background: transparent !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex: 0 0 auto !important;
}

/* ── Scrollbar ── */
* {
  scrollbar-width: thin;
  scrollbar-color: hsl(220 5% 28%) transparent;
}

::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}

::-webkit-scrollbar-thumb {
  background: hsl(220 5% 28%);
  border-radius: 9999px;
}

@media (prefers-reduced-motion: reduce) {
  * {
    animation-duration: 0.001ms !important;
    transition-duration: 0.001ms !important;
  }
}