/* List Item / Chronic — SD-75
 * Chronicle entry: label pills + text values + optional partner links + CTA.
 * Mobile-first: S default, M ≥1024px, L ≥1280px
 */

.list-item-chronic {
  display: flex;
  flex-direction: column;
  gap: var(--dk-space-06);   /* 32px — Figma spacing-06 */
  width: 100%;
}

/* --- Row: label chip + value --- */
.list-item-chronic__row {
  display: flex;
  flex-direction: column;
  gap: var(--dk-space-01);   /* 8px */
  align-items: flex-start;
}

.list-item-chronic__value {
  line-height: 1.3;
  color: var(--dk-color-black);
  margin: 0;
}

/* --- Partner list (lokale Partnerschaft) ---
 * Figma content-list: H 44, icon 24, icon–text gap 12.
 * Feedback 7999:4833 / 8120:34234: gleicher Tab + arrow-right (nicht ↗).
 */
.list-item-chronic__partner-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: var(--dk-space-01);   /* 8px — Feedback: mehr als Figma 4px */
  width: 100%;
}

.list-item-chronic__partner-list .dk-link-meta-extern {
  gap: var(--dk-space-02);   /* 12px — Figma itemSpacing */
  min-block-size: 2.75rem;   /* 44px hit area */
}

.list-item-chronic__partner-list .dk-link-meta-extern-icon {
  width: 1.5rem;             /* 24px — Figma extern */
  height: 1.5rem;
}

/* Override link-meta-extern font size for this context (ui-m / 24px L) */
.list-item-chronic__partner-list .dk-link-meta-extern-text {
  font-size: var(--dk-text-ui-m-size);
  line-height: 1.2;
}

/* Plain-text fallback when a partner has no link (Figma feedback 7999:4777) */
.list-item-chronic__partner-text {
  display: flex;
  align-items: center;
  min-block-size: 2.75rem; /* 44px — matches the linked rows */
  color: var(--dk-color-black);
}

/* --- CTA button (black pill) — not full-width (Feedback 7880:67214) --- */
.list-item-chronic__cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  align-self: flex-start;    /* parent is flex column → default stretch would go full width */
  width: auto;
  min-height: 2.75rem;       /* 44px */
  max-height: 3rem;          /* 48px */
  padding: var(--dk-space-03) var(--dk-space-06);   /* 12px 24px */
  background-color: var(--dk-color-black);
  color: var(--dk-color-white);
  border-radius: 1000px;
  line-height: 1.2;
  text-decoration: none;
  white-space: nowrap;
  flex-shrink: 0;
}

.list-item-chronic__cta:hover {
  opacity: 0.85;
}

.list-item-chronic__cta:focus-visible {
  outline: none;
  box-shadow:
    0 0 0 2px var(--dk-color-black),
    0 0 0 4px var(--dk-color-white),
    0 0 0 8px #008eff;
}