/* ─── Description list (.dv-desclist) ────────────────────────────────────
   Formalized key/value description-list component. Promotes the earlier
   `.dv-kv` pattern into a proper <dl> with named variants. Default is the
   STACKED multi-column grid (muted label on TOP, ink value BELOW) the
   info_card bodies rely on — the eye scans straight down, no full-width
   eye travel, no per-row dividers. Token-driven, light-only.

   API
     .dv-desclist                      the <dl>: responsive auto-fill grid
     .dv-desclist__row                 a <div> wrapping one dt + dd
     .dv-desclist__term                the <dt> (label: 12px, muted)
     .dv-desclist__desc                the <dd> (value: 14px, ink)
   Variants (on .dv-desclist)
     --inline      term left / desc right on one line (settings layout)
     --striped     alternating row tints + hairline dividers
   Modifier (on .dv-desclist__row)
     --full        row spans all grid columns (long values)

   Supersedes the retired `.dv-kv` pattern — Waiver show now renders this
   component; `.dv-kv*` and the `kv_row` partial no longer exist. */

.dv-desclist {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
  gap: 18px 28px;
  margin: 0;
}

.dv-desclist__row {
  min-width: 0;
}
.dv-desclist__row--full {
  grid-column: 1 / -1;
}

.dv-desclist__term {
  display: block;
  color: var(--text-muted);
  font-size: var(--text-xs);
  line-height: 1.4;
  margin-bottom: 3px;
}

.dv-desclist__desc {
  display: block;
  color: var(--ink);
  font-weight: 500;
  font-size: var(--text-sm);
  line-height: 1.45;
  margin: 0;
  word-break: break-word;
}
.dv-desclist__desc a {
  color: var(--accent);
}

/* ── --inline: term left, desc right, one line per row (settings layout) ── */
.dv-desclist--inline {
  display: block;
}
.dv-desclist--inline .dv-desclist__row {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 16px;
  padding: 8px 0;
}
.dv-desclist--inline .dv-desclist__row--full {
  grid-column: auto;
}
.dv-desclist--inline .dv-desclist__term {
  margin-bottom: 0;
  flex: 0 0 auto;
}
.dv-desclist--inline .dv-desclist__desc {
  text-align: right;
  flex: 1 1 auto;
  min-width: 0;
}

/* ── --striped: alternating tints + hairline dividers (best with --inline) ── */
.dv-desclist--striped {
  display: block;
}
.dv-desclist--striped .dv-desclist__row {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 16px;
  padding: 10px 14px;
  border-bottom: 1px solid var(--hairline);
}
.dv-desclist--striped .dv-desclist__row:first-child {
  border-top: 1px solid var(--hairline);
}
.dv-desclist--striped .dv-desclist__row:nth-child(odd) {
  background: var(--surface-alt);
}
.dv-desclist--striped .dv-desclist__row--full {
  grid-column: auto;
}
.dv-desclist--striped .dv-desclist__term {
  margin-bottom: 0;
  flex: 0 0 auto;
}
.dv-desclist--striped .dv-desclist__desc {
  text-align: right;
  flex: 1 1 auto;
  min-width: 0;
}
