:root{--maxw:1000px;--gap:12px;--radius:12px;--bg:#0f172a;--card:#111827;--text:#e5e7eb;--muted:#9ca3af;--accent:#60a5fa;--error:#f87171;--ok:#34d399}
*{box-sizing:border-box}body{margin:0;font-family:system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,"Apple Color Emoji","Segoe UI Emoji";background:var(--bg);color:var(--text)}
.container{width:100%;max-width:var(--maxw);margin:0 auto;padding:16px}
.card{background:var(--card);border-radius:var(--radius);padding:16px;box-shadow:0 2px 8px rgba(0,0,0,.25)}
h1,h2,h3{margin-top:0}label{display:block;margin-top:10px;font-weight:600}
input[type="text"],input[type="tel"],input[type="number"],input[type="password"],textarea,select{width:100%;padding:10px;border-radius:8px;border:1px solid #374151;background:#0b1220;color:var(--text)}
textarea{min-height:120px}input[type="file"]{margin-top:8px}
.row{display:grid;grid-template-columns:1fr 1fr;gap:var(--gap)}.row-3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:var(--gap)}
@media (max-width:720px){.row,.row-3{grid-template-columns:1fr}}
.actions{margin-top:16px;display:flex;gap:10px;flex-wrap:wrap}
button,.btn{background:var(--accent);color:#0b1220;padding:10px 14px;font-weight:700;border:none;border-radius:10px;cursor:pointer;text-decoration:none;display:inline-block}
.notice{padding:10px;border-radius:8px}.notice.ok{background:rgba(52,211,153,.15);border:1px solid var(--ok)}.notice.err{background:rgba(248,113,113,.12);border:1px solid var(--error)}
.table{width:100%;border-collapse:collapse}.table th,.table td{border-bottom:1px solid #374151;padding:8px;text-align:left}
.badge{padding:2px 8px;border-radius:999px;border:1px solid #374151;font-size:12px}.badge.A{border-color:#93c5fd;color:#93c5fd}.badge.B{border-color:#fca5a5;color:#fca5a5}
.small{color:var(--muted);font-size:12px}
.gallery{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:12px;margin-top:8px}.gallery img{width:100%;height:120px;object-fit:cover;border-radius:8px;border:1px solid #374151}
.searchbar{display:flex;gap:8px;margin:8px 0}
.fieldset{border:1px solid #374151;border-radius:12px;padding:12px;margin:12px 0;background:#0b1220}
.fieldset legend{padding:0 8px;color:#93c5fd;font-weight:700}
.group{display:grid;gap:var(--gap)}.group .row,.group .row-3{margin-top:6px}
.req{color:var(--error);margin-left:.25rem}
/* Bearbeitungs Karte */
.card_edit{
    background:#0b1220;                /* etwas heller als var(--card) */
    border:2px solid var(--accent);    /* klare Abhebung mit deiner Akzentfarbe */
    border-radius:var(--radius);
    padding:16px;
    margin:16px 0;
    box-shadow:0 2px 12px rgba(0,0,0,.35);
}

/* optionales Label oben links via data-label */
.card_edit[data-label]::before{
    content:attr(data-label);
    display:inline-block;
    font-size:12px;
    font-weight:700;
    letter-spacing:.04em;
    color:var(--accent);
    background:rgba(96,165,250,.10);   /* Akzent sehr dezent als Flaeche */
    border:1px solid var(--accent);
    border-radius:6px;
    padding:2px 8px;
    margin-bottom:10px;
}

/* Ueberschrift im Block */
.card_edit h2{
    margin-top:0;
    color:var(--accent);
}

/* Inputs im Bearbeitungs Block bei Fokus deutlicher */
.card_edit input[type="text"],
.card_edit input[type="tel"],
.card_edit input[type="number"],
.card_edit input[type="password"],
.card_edit textarea,
.card_edit select{
    border-color:#374151;
}
/* fixierter Hinweis oben im Inhalt */
.twofa_banner{
    background: rgba(248,113,113,.12); /* wie .notice.err Hintergrund */
    border: 1px solid var(--error);
    color: var(--text);
    border-radius: var(--radius);
    padding: 10px 12px;
    margin: 8px 0 16px;
    display: flex;
    gap: 12px;
    align-items: center;
    justify-content: space-between;
}
.twofa_banner .msg{
    font-weight: 600;
}
.twofa_banner .sub{
    color: var(--muted);
    font-size: 12px;
}
.twofa_banner .actions{
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}
.badge.recent {
  display:inline-block;
  padding: 0.15rem 0.4rem;
  border-radius: 0.4rem;
  font-size: 0.75rem;
  font-weight: 600;
  background: #e6f4ea;   /* zart grün */
  color: #137333;        /* dunkler grün */
  border: 1px solid #c7e7d0;
  margin-left: .35rem;
  vertical-align: middle;
}
