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

/* Hinweis: flache Warnleiste statt gefülltem Kasten */
html.twenty-ui[data-crm-page="lead-regeln"] main .alert{display:flex;align-items:flex-start;gap:12px;background:transparent;border:0;border-left:3px solid var(--bs-warning,#e0a800);border-radius:0;padding:2px 0 2px 14px;margin:0 0 28px;font-size:14px;line-height:1.55;color:var(--bs-body-color)}
html.twenty-ui[data-crm-page="lead-regeln"] main .alert>svg{flex:0 0 18px;width:18px;height:18px;margin-top:2px;color:var(--bs-warning-text-emphasis,#8a6d00)}

/* Abschnitte: Linie oben, kein Rahmen, kein Hintergrund */
html.twenty-ui[data-crm-page="lead-regeln"] main>div>.card{background:transparent;border:0;border-top:1px solid var(--crm-line);border-radius:0;box-shadow:none;margin:0 0 32px}
html.twenty-ui[data-crm-page="lead-regeln"] main>div>.card>div:first-child{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;padding:20px 0 16px}
html.twenty-ui[data-crm-page="lead-regeln"] main>div>.card>div:first-child p{margin-top:4px!important;font-size:13px;color:var(--crm-quiet)}
html.twenty-ui[data-crm-page="lead-regeln"] main>div>.card>div:first-child .badge{white-space:nowrap}
html.twenty-ui[data-crm-page="lead-regeln"] main>div>.card>.card-footer{background:transparent;border:0;padding:14px 0 0}
html.twenty-ui[data-crm-page="lead-regeln"] main>div>.card>.card-footer .btn{align-self:flex-start}

/* Tabelle: flache Zeilen, Kopf ohne Füllung */
html.twenty-ui[data-crm-page="lead-regeln"] main .table-responsive{border:0;border-radius:0;overflow-x:visible}
html.twenty-ui[data-crm-page="lead-regeln"] main .table-responsive>table{table-layout:fixed;width:100%}
html.twenty-ui[data-crm-page="lead-regeln"] main .table th{background:transparent;border-bottom:1px solid var(--crm-line);border-top:0;color:var(--crm-quiet)}
html.twenty-ui[data-crm-page="lead-regeln"] main .table td{border-color:var(--crm-line)}
html.twenty-ui[data-crm-page="lead-regeln"] main thead th:first-child,html.twenty-ui[data-crm-page="lead-regeln"] main tbody td:first-child{width:104px}
html.twenty-ui[data-crm-page="lead-regeln"] main table:has(input[aria-label="Gewicht"]) thead th:nth-child(3),html.twenty-ui[data-crm-page="lead-regeln"] main td:has(input[aria-label="Gewicht"]){width:120px}
html.twenty-ui[data-crm-page="lead-regeln"] main thead th:last-child,html.twenty-ui[data-crm-page="lead-regeln"] main tbody td:last-child{width:132px;text-align:right}
html.twenty-ui[data-crm-page="lead-regeln"] main tbody td{padding-top:12px;padding-bottom:12px}
html.twenty-ui[data-crm-page="lead-regeln"] main tbody td .form-switch{margin:0;display:flex;align-items:center;padding-left:0}
html.twenty-ui[data-crm-page="lead-regeln"] main tbody td .form-check-input{width:2.5em;height:1.4em;cursor:pointer;margin-left:0;float:none}
html.twenty-ui[data-crm-page="lead-regeln"] main tbody td input.form-control{width:100%;min-width:0}
html.twenty-ui[data-crm-page="lead-regeln"] main tbody td input[type=number]{text-align:center}
html.twenty-ui[data-crm-page="lead-regeln"] main .btn-flush-danger{color:#b3261e;white-space:nowrap}
html.twenty-ui[data-crm-page="lead-regeln"] main .btn-flush-danger:hover{background:rgba(220,53,69,.08)}

/* F5-13: hell ≥ 4,5:1 — „Entfernen“ #b3261e (6,5:1 auf Weiß), Punkte-Badge #087443 (5,5:1 auf dem hellgrünen Grund) */
html.twenty-ui[data-crm-page="lead-regeln"]:not([data-bs-theme="dark"]) main .badge-soft-success{color:#087443}

/* Dunkel: Entfernen lesbar (Kontrast) */
html.twenty-ui[data-crm-page="lead-regeln"][data-bs-theme="dark"] main .btn-flush-danger{color:#ff8a94}
html.twenty-ui[data-crm-page="lead-regeln"][data-bs-theme="dark"] main .btn-flush-danger:hover{background:rgba(255,138,148,.12)}

/* F5-04: Leseansicht der Hinweise nur am Handy (siehe unten) */
html.twenty-ui[data-crm-page="lead-regeln"] main .lr-hinweis-voll{display:none}

@media(max-width:760px){
  html.twenty-ui[data-crm-page="lead-regeln"] main .hk-pg-header .pg-header-action-wrap .btn{flex:1 1 100%;min-height:48px}
  html.twenty-ui[data-crm-page="lead-regeln"] main .hk-pg-header{padding-bottom:8px}
  html.twenty-ui[data-crm-page="lead-regeln"] main .alert{margin-bottom:20px;padding-left:12px}
  html.twenty-ui[data-crm-page="lead-regeln"] main .alert>svg{flex-basis:16px;width:16px;height:16px;margin-top:3px}
  html.twenty-ui[data-crm-page="lead-regeln"] main>div>.card{margin-bottom:24px}
  html.twenty-ui[data-crm-page="lead-regeln"] main>div>.card>div:first-child{flex-wrap:wrap;padding:16px 0 12px}
  html.twenty-ui[data-crm-page="lead-regeln"] main>div>.card>div:first-child>span.badge{order:3}
  html.twenty-ui[data-crm-page="lead-regeln"] main>div>.card>.card-footer .btn{width:100%;min-height:48px}
  /* Tabellen als gestapelte Zeilen mit Beschriftung */
  html.twenty-ui[data-crm-page="lead-regeln"] main .table-responsive>table,html.twenty-ui[data-crm-page="lead-regeln"] main .table-responsive tbody{display:block;table-layout:auto}
  html.twenty-ui[data-crm-page="lead-regeln"] main .table-responsive thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
  html.twenty-ui[data-crm-page="lead-regeln"] main tbody tr{display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"k k" "a d";gap:12px;align-items:center;padding:14px 0;width:100%;box-sizing:border-box;border-bottom:1px solid var(--crm-line)}
  html.twenty-ui[data-crm-page="lead-regeln"] main tbody tr:has(input[aria-label="Gewicht"]){grid-template-columns:auto minmax(0,1fr) auto;grid-template-areas:"k k k" "a g d"}
  html.twenty-ui[data-crm-page="lead-regeln"] main tbody tr:has(td:nth-child(3) input[aria-label^="Hinweis"]){grid-template-areas:"k k" "h h" "a d"}
  html.twenty-ui[data-crm-page="lead-regeln"] main tbody td,html.twenty-ui[data-crm-page="lead-regeln"] main thead th:first-child,html.twenty-ui[data-crm-page="lead-regeln"] main tbody td:first-child,html.twenty-ui[data-crm-page="lead-regeln"] main tbody td:last-child,html.twenty-ui[data-crm-page="lead-regeln"] main td:has(input[aria-label="Gewicht"]){display:block;width:auto!important;padding:0!important;border:0;text-align:left}
  html.twenty-ui[data-crm-page="lead-regeln"] main tbody td:nth-child(1){grid-area:a}
  html.twenty-ui[data-crm-page="lead-regeln"] main tbody td:nth-child(2){grid-area:k}
  html.twenty-ui[data-crm-page="lead-regeln"] main tbody td:nth-child(3){grid-area:h}
  html.twenty-ui[data-crm-page="lead-regeln"] main tbody td:has(input[aria-label="Gewicht"]){grid-area:g;display:flex;align-items:center;justify-content:flex-end;gap:10px}
  html.twenty-ui[data-crm-page="lead-regeln"] main tbody td:has(input[aria-label="Gewicht"])::before{content:"Gewicht";font-size:13px;color:var(--crm-quiet)}
  html.twenty-ui[data-crm-page="lead-regeln"] main tbody td:has(input[aria-label="Gewicht"]) input{width:72px!important}
  html.twenty-ui[data-crm-page="lead-regeln"] main tbody td:last-child{grid-area:d;justify-self:end}
  html.twenty-ui[data-crm-page="lead-regeln"] main tbody td:nth-child(1) .form-switch{min-height:44px;padding-left:0}
  html.twenty-ui[data-crm-page="lead-regeln"] main tbody td:nth-child(1) .form-switch::after{content:"Aktiv";margin-left:10px;font-size:14px;color:var(--crm-quiet)}
  html.twenty-ui[data-crm-page="lead-regeln"] main tbody tr:has(input[aria-label^="Hinweis"]) td:nth-child(1) .form-switch::after{content:"Freigegeben"}
  html.twenty-ui[data-crm-page="lead-regeln"] main tbody td:nth-child(1) .form-check-input{width:2.9em;height:1.6em;margin:0}
  html.twenty-ui[data-crm-page="lead-regeln"] main tbody td:nth-child(2) input{font-weight:500}
  html.twenty-ui[data-crm-page="lead-regeln"] main .btn-flush-danger{min-height:44px;padding:8px 12px}
  /* F5-04: „Hinweis / Freigabegrund“ ist ein einzeiliges Feld und schnitt lange Texte ab. lead-regeln.js legt dahinter eine
     mehrzeilige Leseansicht (.lr-hinweis-voll, aria-hidden); das echte Feld liegt durchsichtig darüber und wird beim Antippen/Fokus sichtbar. */
  html.twenty-ui[data-crm-page="lead-regeln"] main tbody td:has(>.lr-hinweis-voll){position:relative}
  html.twenty-ui[data-crm-page="lead-regeln"] main tbody td>.lr-hinweis-voll{display:block;min-height:44px;padding:10px 12px;border:1px solid var(--crm-line);border-radius:8px;background:var(--bs-body-bg);color:#262a2e;font-size:16px;line-height:1.4;white-space:pre-wrap;overflow-wrap:anywhere}
  html.twenty-ui[data-crm-page="lead-regeln"][data-bs-theme="dark"] main tbody td>.lr-hinweis-voll{color:var(--bs-body-color)}
  html.twenty-ui[data-crm-page="lead-regeln"] main tbody td>input:has(+.lr-hinweis-voll){position:absolute;inset:0;width:100%;height:100%;min-height:0;z-index:1}
  html.twenty-ui[data-crm-page="lead-regeln"] main tbody td>input:has(+.lr-hinweis-voll):not(:focus){color:transparent;background-color:transparent}
}