/* Stammdaten → Preislisten → Tarifliste (Fabian 6.11.2026). Tablet und Desktop, Knöpfe fingergross, keine Bedienung nur per Überfahren. */
.tl-seite .card, .tl-seite.card { margin-bottom: 14px; }
.tl-hinweis { color: var(--muted, #64748b); font-size: 13px; margin: 4px 0 8px; max-width: 90ch; }
.tl-gruppen { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 8px; }
.tl-gruppe { display: flex; flex-direction: column; gap: 3px; align-items: flex-start; text-align: left; min-height: 56px; padding: 9px 12px; background: #fff; color: #111; border: 1px solid #c9cdcb; border-radius: 6px; font: inherit; cursor: pointer; touch-action: manipulation; }
.tl-gruppe small { color: #4b5563; font-size: 12px; }
.tl-gruppe.aktiv { background: #111; color: #fff; border-color: #111; }
.tl-gruppe.aktiv small { color: #e5e7eb; }
.tl-tabelle { width: 100%; border-collapse: collapse; font-size: 13px; }
.tl-tabelle th, .tl-tabelle td { padding: 7px 8px; vertical-align: top; border-top: 1px solid #e5e7eb; text-align: left; }
.tl-tabelle thead th { border-top: 0; font-size: 12px; color: #4b5563; }
.tl-tabelle small { color: #4b5563; font-size: 12px; }
.tl-tabelle th.tl-zahl, .tl-tabelle td.tl-zahl { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
.tl-faktoren small { display: block; margin-top: 3px; }
.tl-faktor { width: 110px; min-height: 40px; padding: 6px 8px; font-size: 14px; }
.tl-offen { color: #8a271d; font-weight: 600; }
.tl-gesperrt td { background: #fdf4f2; }
.tl-klein { margin-top: 4px; font-size: 12px; padding: 5px 9px; }
.tl-filter, .tl-leiste { display: flex; flex-wrap: wrap; gap: 10px; align-items: flex-end; margin: 6px 0 10px; }
.tl-filter label, .tl-leiste label { display: flex; flex-direction: column; gap: 3px; font-size: 12px; color: #4b5563; }
.tl-filter select, .tl-filter input, .tl-leiste input { min-height: 40px; min-width: 170px; }
.tl-probe input { width: 90px; min-height: 40px; padding: 6px 8px; }
.tl-total { text-align: right; font-size: 16px; margin: 10px 8px 0; }
.tl-basis { margin-top: 6px; font-size: 12px; }
.tl-basis label { display: inline-flex; flex-direction: column; gap: 3px; margin: 4px 10px 4px 0; }
.tl-basis input { width: 110px; min-height: 40px; }
.tl-liste { margin: 6px 0 8px 18px; font-size: 13px; }
.tl-liste li { margin: 2px 0; }
.tl-kacheln { display: grid; grid-template-columns: repeat(auto-fit, minmax(130px, 1fr)); gap: 10px; margin: 10px 0; }
.tl-kacheln div { border: 1px solid #e5e7eb; border-radius: 5px; padding: 8px 10px; }
.tl-kacheln b { display: block; font-size: 20px; }
.tl-kacheln small { color: #4b5563; font-size: 12px; }
.tl-vergleich { margin-top: 6px; }
@media (pointer: coarse), (max-width: 1240px) {
  .tl-seite button, .tl-seite .btn-secondary, .tl-seite .btn-primary { min-height: 44px; }
  .tl-faktor, .tl-probe input, .tl-basis input, .tl-filter select, .tl-filter input, .tl-leiste input { min-height: 44px; }
}
@media (max-width: 900px) {
  .tl-tabelle thead { display: none; }
  .tl-tabelle, .tl-tabelle tbody { display: block; }
  .tl-tabelle tr { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 2px 12px; padding: 8px 0; border-top: 1px solid #d1d5db; }
  .tl-tabelle th, .tl-tabelle td { display: block; border: 0; padding: 3px 0; }
  .tl-tabelle tbody th, .tl-tabelle td[data-t="Leistung"], .tl-tabelle td[data-t="Zeile"] { grid-column: 1 / -1; }
  .tl-tabelle td[data-t]::before { content: attr(data-t); display: block; font-size: 11px; color: #4b5563; }
  .tl-tabelle th.tl-zahl, .tl-tabelle td.tl-zahl { text-align: left; }
}
.tl-preise b { font-weight: 600; }
.tl-herleitung { display: block; margin-top: 3px; color: var(--muted, #64748b); }
.tl-schwach { color: #92400e; }
.tl-paare { list-style: none; margin: 6px 0 0; padding: 0; font-size: 12px; max-height: 260px; overflow-y: auto; }
.tl-paare li { padding: 3px 0; border-top: 1px solid var(--line, #e2e8f0); }
.tl-auffaellig summary { font-weight: 600; }
.tl-angehoben { color: #92400e; }