/* Tab: benutzer — flach (29.10.2026). Scope: html.twenty-ui[data-crm-page="benutzer"]
   Eine Fläche, keine Karte in Karte: Abschnitte trennt eine 1px-Linie, Konten sind Tabellenzeilen. */
html.twenty-ui[data-crm-page="benutzer"] main .hk-pg-header{padding-bottom:16px}

/* Hinweistext: flach, mit Akzentlinie statt getöntem Kasten */
html.twenty-ui[data-crm-page="benutzer"] main .crm-context-note{display:flex;flex-direction:column;gap:4px;background:transparent;border:0;border-left:3px solid var(--crm-accent);border-radius:0;padding:2px 0 2px 14px;font-size:14px;line-height:1.55;margin:0 0 32px}
html.twenty-ui[data-crm-page="benutzer"] main .crm-context-note strong{font-size:13px;margin:0;color:var(--crm-quiet)}

/* Abschnitte: Linie oben, kein Rahmen, kein Hintergrund */
html.twenty-ui[data-crm-page="benutzer"] main>div>.card{background:transparent;border:0;border-top:1px solid var(--crm-line);border-radius:0;box-shadow:none;margin:0 0 32px;overflow:visible}
html.twenty-ui[data-crm-page="benutzer"] main>div>.card>.card-header{display:flex;flex-direction:column;align-items:flex-start;gap:4px;background:transparent;border:0;padding:20px 0 16px}
html.twenty-ui[data-crm-page="benutzer"] main .card-header h2{font-size:16px!important;line-height:1.4;font-weight:600;margin:0!important}
html.twenty-ui[data-crm-page="benutzer"] main .card-header p{margin:4px 0 0!important;font-size:13px;color:var(--crm-quiet)}
html.twenty-ui[data-crm-page="benutzer"] main .card-body.text-muted{padding:16px 0 4px;text-align:left;font-size:14px}
html.twenty-ui[data-crm-page="benutzer"] main>div>.card>.card-footer{background:transparent;border:0;padding:14px 0 0}

/* Tabelle: flache Zeilen, Kopf ohne Füllung */
html.twenty-ui[data-crm-page="benutzer"] main .table-responsive{border:0;border-radius:0;overflow-x:auto}
html.twenty-ui[data-crm-page="benutzer"] main .table th{background:transparent;border-top:0;border-bottom:1px solid var(--crm-line);color:var(--crm-quiet)}
html.twenty-ui[data-crm-page="benutzer"] main .table td{border-color:var(--crm-line)}
html.twenty-ui[data-crm-page="benutzer"] main thead th:first-child,html.twenty-ui[data-crm-page="benutzer"] main tbody td:first-child{padding-left:0}
html.twenty-ui[data-crm-page="benutzer"] main thead th:last-child,html.twenty-ui[data-crm-page="benutzer"] main tbody td:last-child{padding-right:0}
html.twenty-ui[data-crm-page="benutzer"] main tbody td .badge{font-size:12px;font-weight:500;padding:4px 10px;border-radius:999px}
html.twenty-ui[data-crm-page="benutzer"] main tbody td a.fw-semibold{text-decoration:none}
html.twenty-ui[data-crm-page="benutzer"] main tbody td a.fw-semibold:hover{color:var(--crm-accent)!important}

/* F5-11: Benutzer-Akte — Wert in Betonfarbe, Beschriftung bleibt leise (text-muted); Absätze und Knopf mit Abstand */
html.twenty-ui[data-crm-page="benutzer"] main dl.row>dd{color:var(--bs-emphasis-color,#000);font-weight:500}
html.twenty-ui[data-crm-page="benutzer"] main .card-body>p+p{margin-top:12px}
html.twenty-ui[data-crm-page="benutzer"] main .card-body>p+.btn{margin-top:16px}

@media(max-width:760px){
  html.twenty-ui[data-crm-page="benutzer"] main .hk-pg-header .pg-header-action-wrap .btn{flex:1 1 100%;min-height:48px}
  html.twenty-ui[data-crm-page="benutzer"] main .hk-pg-header{padding-bottom:8px}
  html.twenty-ui[data-crm-page="benutzer"] main .crm-context-note{margin:8px 0 24px}
  html.twenty-ui[data-crm-page="benutzer"] main>div>.card{margin-bottom:24px}
  html.twenty-ui[data-crm-page="benutzer"] main>div>.card>.card-header{padding:16px 0 12px}
  html.twenty-ui[data-crm-page="benutzer"] main .table-responsive{overflow:visible}
  html.twenty-ui[data-crm-page="benutzer"] main .table-responsive>table,html.twenty-ui[data-crm-page="benutzer"] main .table-responsive tbody{display:block}
  html.twenty-ui[data-crm-page="benutzer"] main .table-responsive thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
  html.twenty-ui[data-crm-page="benutzer"] main tbody tr{display:grid;grid-template-columns:1fr 1fr;gap:14px 16px;padding:14px 0;border-bottom:1px solid var(--crm-line)}
  html.twenty-ui[data-crm-page="benutzer"] main tbody tr:hover{background:transparent}
  html.twenty-ui[data-crm-page="benutzer"] main tbody td{display:flex;flex-direction:column;align-items:flex-start;gap:4px;padding:0!important;border:0;min-width:0;overflow-wrap:anywhere}
  html.twenty-ui[data-crm-page="benutzer"] main tbody td:first-child{grid-column:1/-1;min-height:44px;justify-content:center}
  html.twenty-ui[data-crm-page="benutzer"] main tbody td[data-label]:not(:first-child)::before{content:attr(data-label);font-size:12px;font-weight:600;letter-spacing:.02em;color:var(--crm-quiet)}
  /* F5-12: Touch-Ziele ≥ 44 px — Namenslink in der Liste, „← Benutzer“ auf Akte und Neuanlage */
  html.twenty-ui[data-crm-page="benutzer"] main tbody td a.fw-semibold{display:inline-flex;align-items:center;min-height:44px}
  html.twenty-ui[data-crm-page="benutzer"] main>div>a[href="/benutzer"]:first-child{display:inline-flex;align-items:center;gap:6px;min-height:44px}
}
/* F5-11: Akte am Handy (dt/dd untereinander, unter 576 px) — Beschriftung klein über dem Wert, Paare durch Abstand getrennt */
@media(max-width:575.98px){
  html.twenty-ui[data-crm-page="benutzer"] main dl.row>dt{font-size:13px;line-height:1.4;margin-top:14px}
  html.twenty-ui[data-crm-page="benutzer"] main dl.row>dt:first-child{margin-top:0}
  html.twenty-ui[data-crm-page="benutzer"] main dl.row>dd{margin-bottom:0}
}
