/* "Mein Konto" neu geordnet (static/js/account_layout.js, 28.09.2026):
   eingeblendete Unterseiten mit Zwischenueberschrift, einheitliche Karten. */
.tab-panel.account-part.active{margin-top:1.75rem;}
.tab-panel.account-part::before{
  content:attr(data-part-title); display:block; margin:0 0 .9rem; padding-top:1.25rem;
  border-top:1px solid var(--border); font-family:'Arvo', Georgia, serif; font-size:1.15rem; font-weight:700; color:var(--ink);
}
.tab-panel.account-part:empty{display:none !important;}
/* "Funktionen" hat selbst keinen Inhalt - die erste Unterseite braucht dort keinen Abstand/Strich */
#tab-konto-funktionen:empty{display:none !important;}
.tab-panel.account-part.account-part-first{margin-top:0;}
.tab-panel.account-part.account-part-first::before{border-top:none; padding-top:0;}

/* Einheitliche Eingabefelder in allen Konto-Bereichen (auch Module wie Lebensmittel retten) */
#tab-settings, #tab-abo, #tab-ai-settings, #tab-notifier-prefs, .tab-panel.account-part{
  --acc-field-h:2.6rem;
}
.tab-panel.account-part input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="file"]),
.tab-panel.account-part select{
  height:var(--acc-field-h); box-sizing:border-box; border:1px solid var(--border); border-radius:10px;
  padding:0 .8rem; background:var(--surface); color:var(--ink); font:inherit; font-size:.95rem; max-width:100%;
}
.tab-panel.account-part .settings-card label + input, .tab-panel.account-part .settings-card label + select{width:100%;}

/* Karten im Konto: gleiche Ueberschriften, Aktion immer unten, gleich hohe Felder */
.tab-panel .settings-card h3{display:flex; flex-wrap:wrap; align-items:center; gap:.3rem .7rem;}
.tab-panel .settings-grid .field input, .tab-panel .settings-grid .password-field input{height:2.6rem; box-sizing:border-box;}
.tab-panel .settings-grid .settings-card-actions .btn, .tab-panel .settings-grid .settings-card > .add-btn{min-width:9.5rem; justify-content:center;}

/* Status je Dienst (ersetzt die fruehere Karte "Funktionsstatus") */
.svc-status{
  display:inline-flex; align-items:center; gap:.35rem; font-family:'Karla', sans-serif; font-size:.75rem; font-weight:700;
  padding:.15rem .55rem; border-radius:999px; background:var(--surface-hover); color:var(--ink-muted); flex:0 0 auto; width:fit-content;
}
.svc-status.on{color:var(--ok, #4a7a3d);}
.svc-status .settings-status-dot{margin:0;}

/* "Ansicht & Nutzung" (usage_profile.js) unter "Allgemein": dieselben Karten wie darueber */
#tab-nutzung.account-part .usp-page{display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:1rem; align-items:stretch; max-width:none;}
#tab-nutzung.account-part .usp-for, #tab-nutzung.account-part .usp-page > .hint{grid-column:1 / -1; margin:0;}
#tab-nutzung.account-part .usp-block{
  background:var(--surface); border:1px solid var(--border); border-radius:var(--radius-card);
  padding:1rem 1.1rem; margin:0; display:flex; flex-direction:column; gap:.5rem;
}
#tab-nutzung.account-part .usp-block:last-child{grid-column:1 / -1;}
#tab-nutzung.account-part .usp-block h3{margin:0 0 .2rem; font-size:1.05rem;}
#tab-nutzung.account-part .usp-level{padding:.55rem .8rem;}
/* Haupt- und "weitere" Nutzungen als EIN durchgehendes Raster (vorher zwei Raster -> halbe Zeile) */
#tab-nutzung.account-part .usp-block:last-child{display:grid; grid-template-columns:repeat(auto-fill, minmax(14rem, 1fr)); gap:.5rem;}
#tab-nutzung.account-part .usp-block:last-child > h3,
#tab-nutzung.account-part .usp-block:last-child > .hint,
#tab-nutzung.account-part .usp-block:last-child > .usp-more-toggle{grid-column:1 / -1; justify-self:start;}
#tab-nutzung.account-part .usp-block:last-child > .usp-uses{display:contents;}
#tab-nutzung.account-part .usp-block:last-child > .usp-uses[hidden]{display:none;}
#tab-nutzung.account-part .usp-block:last-child > .hint{margin:0 0 .3rem;}
@media (max-width: 760px){
  #tab-nutzung.account-part .usp-page{grid-template-columns:1fr;}
}

/* Profilmenue oben rechts (28.09.2026): versteckte Eintraege (Kuechenpost, Hilfe) wirklich
   verbergen, "Tour ansehen" steckt bei Lilli ("Frag Lilli"). */
.user-menu-item[hidden], #userMenuDropdown [data-tour-start]{display:none !important;}

/* Backend > "Nutzer anlegen" + Popup "Neues Passwort festlegen" (admin_users.js, 29.09.2026) */
.au-card{gap:.8rem;}
.au-card .field{display:flex; flex-direction:column; gap:.3rem;}
.au-label{font-size:.78rem; font-weight:700; color:var(--ink-muted);}
.au-card input:not([type="radio"]), .au-card select, .au-pw-modal input{
  width:100%; height:2.6rem; box-sizing:border-box; border:1px solid var(--border); border-radius:10px;
  padding:0 .8rem; background:var(--surface); color:var(--ink); font:inherit;
}
.au-card .password-field input{padding-right:2.6rem;}
.au-roles{border:0; padding:0; margin:0; display:grid; gap:.5rem;}
.au-roles legend{margin-bottom:.3rem;}
.au-role{display:flex; gap:.7rem; align-items:flex-start; border:1px solid var(--border); border-radius:12px; padding:.6rem .8rem; cursor:pointer;}
.au-role:has(input:checked){border-color:var(--accent); background:var(--accent-soft);}
.au-role input{margin-top:.25rem; accent-color:var(--accent);}
.au-role span{display:flex; flex-direction:column; gap:.1rem;}
.au-role small{color:var(--ink-muted); font-size:.8rem;}
.au-household[hidden]{display:none !important;}
.au-pw-modal .field{display:flex; flex-direction:column; gap:.3rem; margin:0 0 .8rem;}
#auPwScrim{z-index:260;}  /* vor Onboarding/Tour: erst das eigene Passwort */

/* Seite "Neues Passwort festlegen" (/passwort-neu/<token>, password_reset_link.js, 29.09.2026) */
.pwl-screen{position:fixed; inset:0; z-index:300; overflow-y:auto; background:var(--bg); display:flex; align-items:flex-start; justify-content:center; padding:clamp(1.5rem, 8vh, 5rem) 16px 2rem;}
.pwl-card{width:min(420px, 100%); background:var(--surface); border:1px solid var(--border); border-radius:20px; padding:1.8rem 1.6rem; box-shadow:0 24px 60px -30px rgba(0,0,0,.35);}
.pwl-logo{display:block; width:150px; height:auto; margin:0 auto 1.2rem;}
.pwl-card h1{font-family:'Arvo', Georgia, serif; font-size:1.4rem; margin:0 0 .5rem; text-align:center;}
.pwl-lead{text-align:center; color:var(--ink-muted); margin:0 0 1rem; line-height:1.45;}
.pwl-user{text-align:center; margin:0 0 1rem; font-size:.9rem;}
.pwl-form{display:flex; flex-direction:column; gap:.8rem;}
.pwl-field{display:flex; flex-direction:column; gap:.3rem;}
.pwl-field span{font-size:.8rem; font-weight:700; color:var(--ink-muted);}
.pwl-field input{height:2.8rem; box-sizing:border-box; border:1px solid var(--border); border-radius:10px; padding:0 .9rem; font:inherit; background:var(--surface); color:var(--ink);}
.pwl-show{display:flex; align-items:center; gap:.5rem; font-size:.88rem;}
.pwl-error{margin:0; color:var(--danger); background:var(--danger-soft); border-radius:10px; padding:.5rem .75rem; font-size:.9rem;}
.pwl-btn{width:100%; justify-content:center; margin-top:.3rem; display:flex;}
:root[data-design="sporty-steel"] .pwl-logo{filter:brightness(0) invert(1);}