/* Kontakt und Einverständnis (FUKONTAKT): table with chips per contact way, always light like the office pages. */
.kc { margin: 26px 0 8px; }
.kc h3 { margin: 0 0 8px; }
.kc-scroll { overflow-x: auto; }
.kc-table { width: 100%; border-collapse: collapse; font-size: 15px; }
.kc-table th { font-size: 12px; letter-spacing: .8px; text-transform: uppercase; color: var(--ui-muted); text-align: left;
  padding: 8px 10px; border-bottom: 2px solid var(--ui-line); }
.kc-table td { padding: 10px; border-bottom: 1px solid var(--ui-line); vertical-align: top; }
.kc-table td > strong, .kc-value, .kc-hint { display: block; }
.kc-value { overflow-wrap: anywhere; }
.kc-hint { color: var(--ui-muted); font-size: 14px; }
.kc-chips { display: flex; flex-wrap: wrap; gap: 4px; margin-bottom: 4px; }
.kc-chip { display: inline-block; padding: 3px 10px; border-radius: 999px; font-weight: 700; font-size: 13px; }
.kc-chip.y { background: var(--ui-success-bg); color: var(--ui-success); }
.kc-chip.n { background: var(--ui-danger-bg); color: var(--ui-danger); }
.kc-chip.u { background: var(--ui-warn-bg); color: var(--ui-warn); }
.kc-table td > .kc-chip.u { margin: 2px 0; }
.kc-actions { display: flex; flex-wrap: wrap; gap: 10px; margin: 14px 0 8px; }
.kc-stack { flex-direction: column; align-items: stretch; }
.kc-btn { min-height: 44px; padding: 8px 16px; border: 2px solid var(--ui-line); border-radius: var(--ui-radius-small, 10px);
  background: var(--ui-surface); color: var(--ui-ink); font: inherit; font-weight: 700; cursor: pointer; }
.kc-btn.primary { background: var(--ui-action); border-color: var(--ui-action); color: var(--ui-on-action); }
.kc-btn:disabled { opacity: .55; cursor: not-allowed; }
.kc-btn:focus-visible, .kc-dialog :focus-visible { outline: 3px solid var(--ui-focus); outline-offset: 2px; }
.kc-notice { color: var(--ui-success); font-weight: 700; }
.kc-error { color: var(--ui-danger); font-weight: 700; min-height: 1em; }
.kc-dialog { width: min(640px, calc(100vw - 32px)); max-height: calc(100vh - 32px); border: 0;
  border-radius: var(--ui-radius, 16px); background: var(--ui-surface); color: var(--ui-ink); padding: 24px;
  box-shadow: var(--ui-shadow); }
.kc-dialog::backdrop { background: rgb(0 0 0 / .35); }
.kc-form, .kc-ways { display: grid; gap: 12px; }
.kc-field { display: grid; gap: 4px; font-weight: 700; }
.kc-field select { min-height: 44px; font: inherit; }
.kc-way { border: 1px solid var(--ui-line); border-radius: var(--ui-radius-small, 10px); padding: 8px 12px;
  display: flex; flex-wrap: wrap; gap: 6px 18px; align-items: center; }
.kc-way legend { font-weight: 700; padding: 0 4px; }
.kc-radio, .kc-check { display: flex; gap: 8px; align-items: center; min-height: 44px; }
.kc-way .kc-hint { flex-basis: 100%; }
@media (max-width: 640px) {
  .kc-table thead { display: none; }
  .kc-table, .kc-table tbody, .kc-table tr, .kc-table td { display: block; width: 100%; }
  .kc-table tr { border-bottom: 1px solid var(--ui-line); padding: 8px 0; }
  .kc-table td { border: 0; padding: 4px 0; }
  .kc-table td:not(:first-child)::before { content: attr(data-label); display: block; font-size: 12px; letter-spacing: .8px;
    text-transform: uppercase; color: var(--ui-muted); }
}