/* ---------------------------------------------------------------
   kunden/ui/akquise — the two gate cards on the Tafel and the Akquise panel (akquise.js).
   After the kit: the board's lane and card are the kit's; this styles only what is inside.
   --------------------------------------------------------------- */

/* A card on the Tafel: name, trade and age, the state in a line, one button. */
.kd-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 0.2rem;
  padding: 0.3rem 0.1rem 0.3rem 0.3rem;
}

/* Three lines at most: a name as long as a firm's register entry does not make a tall card. */
.kd-card .adm-card-title {
  display: -webkit-box;
  overflow: hidden;
  color: inherit;
  font-size: 0.9rem;
  line-height: 1.25;
  text-decoration: none;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  line-clamp: 3;
}

.kd-card .adm-card-title:hover {
  text-decoration: underline;
}

.kd-card-meta {
  margin: 0;
  color: var(--muted);
  font-size: 0.78rem;
  overflow-wrap: break-word;
}

.kd-card-state {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 0.35rem;
  margin-top: 0.15rem;
  font-size: 0.8rem;
}

/* Two lines at most; the card's title attribute and the business's page have the rest. */
.kd-card-line {
  display: -webkit-box;
  margin: 0;
  overflow: hidden;
  overflow-wrap: break-word;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  line-clamp: 2;
}

.kd-card-line.fail {
  color: var(--bad);
}

.kd-card-line.wait {
  color: var(--warn, var(--muted));
}

.kd-card-line.run {
  display: flex;
  align-items: center;
  gap: 0.35rem;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.kd-card-state .btn {
  justify-self: start;
  max-width: 100%;
  padding-block: 0.25rem;
  font-size: 0.8rem;
  white-space: nowrap;
}

.kd-card-state .kd-start {
  display: grid;
  justify-items: start;
  gap: 0.2rem;
  min-width: 0;
}

.kd-card-state .kd-start-said {
  overflow-wrap: break-word;
  min-width: 0;
}

.kd-name {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 0.4rem;
}

.kd-name .kd-gate-acts {
  align-items: flex-end;
}

.kd-name .btn {
  max-width: 100%;
  white-space: normal;
}

/* „Protokoll": the runs of a card, the newest open. */
.kd-log {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 0.4rem;
  padding-top: 0.5rem;
  border-top: 1px solid var(--line-soft);
  font-size: 0.85rem;
}

.kd-log-head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
}

.kd-log-head h3 {
  margin: 0;
  font-size: 0.95rem;
}

.kd-log-run > summary {
  cursor: pointer;
  overflow-wrap: break-word;
}

.kd-log-run > summary > span {
  margin-inline-start: 0.4rem;
}

.kd-log-run ol {
  display: grid;
  gap: 0.3rem;
  margin: 0.35rem 0 0.5rem;
  padding: 0;
  list-style: none;
}

.kd-log-line {
  display: grid;
  grid-template-columns: 4.6rem minmax(0, 1fr);
  gap: 0.5rem;
}

.kd-log-line time {
  color: var(--muted);
  font-variant-numeric: tabular-nums;
}

.kd-log-what p {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.15rem 0.4rem;
  margin: 0;
  overflow-wrap: anywhere;
}

.kd-log-what ul {
  margin: 0.1rem 0 0;
  padding-left: 1.1rem;
  overflow-wrap: anywhere;
}

.kd-log-line.finding strong {
  font-weight: 500;
}

.kd-gate-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 0.3rem;
  margin: 0;
}

.kd-gate-line {
  margin: 0;
  overflow-wrap: anywhere;
}

.kd-findings {
  margin: 0;
  padding-left: 1.1rem;
}

.kd-findings li + li {
  margin-top: 0.15rem;
}

.kd-gate-acts {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem;
  margin-top: 0.2rem;
}

.kd-letter {
  display: grid;
  gap: 0.35rem;
}

.kd-letter-text pre {
  margin: 0.25rem 0 0;
  max-height: 16rem;
  overflow: auto;
  font: inherit;
  white-space: pre-wrap;
}

.kd-akquise .kd-letter-text pre {
  max-height: none;
}

.kd-talk summary {
  cursor: pointer;
  color: var(--muted);
}

.kd-akquise,
.kd-akquise-today {
  display: grid;
  gap: 0.5rem;
}

.kd-akquise-today p,
.kd-night p {
  margin: 0;
}

.kd-night {
  display: grid;
  gap: 0.3rem;
  padding-top: 0.5rem;
  border-top: 1px solid var(--line-soft);
}

/* ── Heute: the morning's two jobs ─────────────────────────────────────────── */

.kd-today {
  display: grid;
  gap: 0.75rem;
  margin-bottom: 1.25rem;
}

.kd-counts {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem 1.25rem;
  margin: 0;
  font-size: 1rem;
}

.kd-counts strong {
  font-size: 1.5rem;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}

.kd-group h2 {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 0.5rem;
  margin: 0 0 0.35rem;
  font-size: 1rem;
}

.kd-group-n {
  font-variant-numeric: tabular-nums;
  color: var(--muted);
}

.kd-group h2 .muted {
  font-size: 0.8125rem;
  font-weight: 400;
}

.kd-group ol {
  margin: 0;
  padding: 0;
  list-style: none;
  border-top: 1px solid var(--border);
}

.kd-group li a {
  display: grid;
  grid-template-columns: minmax(0, 2fr) minmax(0, 3fr) auto;
  gap: 0.25rem 0.75rem;
  align-items: baseline;
  padding: 0.5rem 0.25rem;
  border-bottom: 1px solid var(--border);
  color: inherit;
  text-decoration: none;
}

.kd-group li a:hover,
.kd-group li a:focus-visible {
  background: var(--surface-2, var(--border));
}

.kd-group li strong,
.kd-group li .kd-card-line {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.kd-group li .kd-card-line {
  margin: 0;
}

.kd-group.answers li {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  border-bottom: 1px solid var(--border);
}

.kd-group.answers li a {
  flex: 1;
  min-width: 0;
  border-bottom: 0;
}

.kd-group.answers li .btn {
  flex: none;
}

/* „Termin vereinbaren" from a preview: name and time on the first row, every detail on its own line below. */
.kd-group.answers li.termin a {
  grid-template-columns: minmax(0, 1fr) auto;
}

.kd-termin {
  grid-column: 1 / -1;
  display: flex;
  flex-direction: column;
  gap: 0.1rem;
  white-space: pre-line;
  overflow-wrap: anywhere;
}

.kd-termin b {
  color: var(--warn, inherit);
}

/* Anfragen: what was typed keeps its lines (Terminwunsch, Nachricht, Vorschlag). */
.kd-lead-message {
  white-space: pre-line;
  overflow-wrap: anywhere;
}

.kd-group li small {
  color: var(--muted);
  white-space: nowrap;
}

@media (max-width: 640px) {
  .kd-group li a {
    grid-template-columns: minmax(0, 1fr) auto;
  }

  .kd-group li .kd-card-line {
    grid-column: 1 / -1;
    grid-row: 2;
  }
}

.kd-done.small {
  padding: 1.25rem 0;
}

.kd-done.small h2 {
  margin: 0;
  font-size: 1.125rem;
}

.kd-today-line {
  display: grid;
  gap: 0.4rem;
}

.kd-today-line p {
  margin: 0;
}

.kd-today .kd-night {
  border-top: 0;
  padding-top: 0;
}

/* The rest of the old Heute, folded. */
.kd-more {
  margin-top: 1.5rem;
}

.kd-more > summary {
  cursor: pointer;
  padding: 0.5rem 0;
  color: var(--muted);
  font-weight: 600;
}

.kd-more > .adm-dashboard-cards {
  margin-top: 0.75rem;
}

/* ── Review: one business at a time ───────────────────────────────────────── */

.kd-review {
  display: grid;
  grid-template-columns: 15rem minmax(0, 1fr);
  gap: 1.5rem;
  align-items: start;
  font-size: 1rem;
}

.kd-rail {
  position: sticky;
  top: 1rem;
  max-height: calc(100vh - 2rem);
  overflow: auto;
}

.kd-rail-head {
  margin: 0 0 0.5rem;
  color: var(--muted);
  font-weight: 600;
}

.kd-rail ol {
  display: grid;
  gap: 2px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.kd-rail a {
  display: grid;
  gap: 0.1rem;
  padding: 0.55rem 0.7rem;
  border-radius: var(--radius);
  color: var(--fg);
  text-decoration: none;
}

.kd-rail a:hover {
  background: var(--surface-2);
}

.kd-rail a.here {
  background: var(--surface-2);
  box-shadow: inset 3px 0 0 var(--accent);
  font-weight: 600;
}

.kd-rail small {
  color: var(--muted);
  font-size: 0.85rem;
  font-weight: 400;
}

.kd-one {
  display: grid;
  gap: 1.25rem;
  max-width: 62rem;
}

.kd-one-head {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: flex-start;
  gap: 0.75rem;
}

.kd-one-head h1 {
  margin: 0;
  font-size: 1.6rem;
  line-height: 1.2;
}

.kd-one-head p {
  margin: 0.25rem 0 0;
}

.kd-step {
  display: flex;
  align-items: center;
  gap: 0.25rem;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}

.kd-opens,
.kd-decide {
  display: flex;
  flex-wrap: wrap;
  gap: 0.6rem;
}

.btn.big {
  min-height: 2.75rem;
  padding-inline: 1.1rem;
  font-size: 1rem;
  gap: 0.5rem;
}

.btn kbd {
  margin-left: 0.5rem;
  padding: 0 0.35rem;
  border: 1px solid currentColor;
  border-radius: 4px;
  font: inherit;
  font-size: 0.8em;
  opacity: 0.7;
}

.kd-big-shots {
  display: grid;
  grid-template-columns: minmax(0, 3fr) minmax(0, 1fr);
  gap: 0.75rem;
  align-items: start;
}

.kd-big-shot {
  display: block;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: var(--radius-lg, var(--radius));
  background: var(--surface-2);
}

.kd-big-shot.desk {
  aspect-ratio: 1366 / 900;
}

.kd-big-shot.phone {
  aspect-ratio: 390 / 844;
}

.kd-big-shot img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: top;
}

.kd-big-shot.none {
  display: grid;
  place-items: center;
  color: var(--muted);
}

.kd-facts {
  display: grid;
  gap: 0.9rem;
  max-width: 44rem;
  line-height: 1.5;
}

.kd-score {
  margin: 0;
  font-size: 1.05rem;
  color: var(--muted);
}

.kd-score strong {
  font-size: 1.8rem;
  color: var(--fg);
}

.kd-score.weak strong {
  color: var(--bad);
}

.kd-findings.big {
  display: grid;
  gap: 0.5rem;
  padding-left: 1.25rem;
  font-size: 1.05rem;
}

.kd-facts dl {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 0.35rem 1rem;
  margin: 0;
}

.kd-facts dt {
  color: var(--muted);
}

.kd-facts dd {
  margin: 0;
  overflow-wrap: anywhere;
}

.kd-one-letter {
  max-width: 44rem;
}

.kd-one-letter .kd-letter-text pre {
  max-height: none;
  font-size: 1rem;
  line-height: 1.55;
}

.kd-done {
  grid-column: 1 / -1;
  display: grid;
  justify-items: center;
  gap: 0.75rem;
  padding: 4rem 1rem;
  text-align: center;
}

.kd-done svg {
  width: 2.5rem;
  height: 2.5rem;
  color: var(--ok);
}

.kd-done h1 {
  margin: 0;
  font-size: 1.4rem;
}

.kd-done p {
  margin: 0;
}

@media (max-width: 760px) {
  .kd-review {
    grid-template-columns: minmax(0, 1fr);
    gap: 1rem;
  }

  /* On a phone the rail is a short strip above the business, not a column. */
  .kd-rail {
    position: static;
    max-height: none;
    order: 2;
  }

  .kd-rail ol {
    max-height: 12rem;
    overflow: auto;
  }

  .kd-big-shots {
    grid-template-columns: minmax(0, 2fr) minmax(0, 1fr);
  }

  .btn kbd {
    display: none;
  }

  .kd-decide .btn.big,
  .kd-opens .btn.big {
    flex: 1 1 100%;
    justify-content: center;
  }
}

/* The decision stays in reach while the screenshots and findings scroll past. */
.kd-decide {
  position: sticky;
  bottom: 0;
  z-index: 2;
  padding: 0.75rem 0;
  border-top: 1px solid var(--line-soft);
  background: var(--bg);
}

.kd-one-letter .kd-gate-acts {
  position: sticky;
  bottom: 0;
  z-index: 2;
  padding: 0.75rem 0;
  border-top: 1px solid var(--line-soft);
  background: var(--bg);
}

/* The night's word on an approved business: running, parked, or failed with a reason. */
.kd-work {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.4rem;
  margin: 0;
}

.kd-pulse {
  width: 0.55rem;
  height: 0.55rem;
  border-radius: 50%;
  background: var(--ok);
  animation: kd-pulse 1.4s ease-in-out infinite;
}

@keyframes kd-pulse {
  50% {
    opacity: 0.25;
  }
}

@media (prefers-reduced-motion: reduce) {
  .kd-pulse {
    animation: none;
  }
}

.kd-start {
  display: inline-flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem;
}

.kd-start-said {
  font-size: 0.85rem;
}

.kd-board-top {
  margin-bottom: 0.75rem;
}

.kd-more-acts summary {
  cursor: pointer;
  color: var(--muted);
}

.kd-more-acts[open] {
  flex-basis: 100%;
}

/* „ECG-Prüfung": one line per address, the two outcomes at its end. */
.kd-ecg {
  display: grid;
  gap: 0.75rem;
  max-width: 60rem;
}

.kd-ecg h1 {
  margin: 0;
}

.kd-ecg-list {
  display: grid;
  gap: 0.5rem;
  margin: 0;
  padding: 0;
  list-style: none;
}

.kd-ecg-list li {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem 0.75rem;
  padding: 0.5rem 0;
  border-bottom: 1px solid var(--line-soft);
}

.kd-ecg-list li > a {
  flex: 1 1 14rem;
}

.kd-ecg-list code {
  flex: 1 1 14rem;
  overflow-wrap: anywhere;
}
