/* ==========================================================================
   Negative keyword list builder — tool-only CSS.

   Shared components (jbm-panel, jbm-pill, jbm-stat, jbm-list, jbm-callout)
   come from jbm-tools.css. Only the theme cards and the match trail are new.
   ========================================================================== */

/* ── one theme card ─────────────────────────────────────────────────────── */

.jbm-theme {
  padding: 1rem;
  border: 1px solid var(--jbm-line);
  border-radius: 10px;
  background: var(--jbm-surface);
}

.jbm-theme + .jbm-theme { margin-top: .75rem; }

.jbm-theme--unthemed { border-style: dashed; }

.jbm-theme__top {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: .75rem;
  flex-wrap: wrap;
}

.jbm-theme__name {
  font-weight: 700;
  color: #fff;
  font-size: 1rem;
  line-height: 1.3;
  min-width: 0;
}

.jbm-theme__spend { flex: none; font-weight: 700; }

.jbm-theme__figs {
  margin: .5rem 0 0;
  font-size: .84rem;
  color: var(--jbm-ink-soft);
}
.jbm-theme__figs b { color: #fff; }

.jbm-theme__fig + .jbm-theme__fig { margin-left: 1rem; }

.jbm-theme__nosp {
  display: inline-block;
  margin-top: .4rem;
  font-size: .78rem;
  color: var(--jbm-muted);
}

/* The match trail: the term and the exact theme keyword that caught it.
   Showing the cause is what makes a negative list reviewable. */
.jbm-theme__terms {
  margin: .7rem 0 0;
  padding: .6rem 0 0;
  border-top: 1px solid var(--jbm-line);
  list-style: none;
  font-size: .82rem;
}

.jbm-theme__term {
  display: flex;
  flex-wrap: wrap;
  gap: .4rem;
  align-items: baseline;
  padding: .2rem 0;
  color: var(--jbm-ink-soft);
  line-height: 1.45;
}

.jbm-theme__term-t { color: #fff; }

.jbm-theme__term-k {
  color: var(--jbm-info);
  font-family: var(--jbm-font-data);
  font-size: .78rem;
  white-space: nowrap;
}

.jbm-theme__term-s {
  margin-left: auto;
  font-variant-numeric: tabular-nums;
  color: var(--jbm-muted);
  white-space: nowrap;
}

/* Rules that matched nothing, and terms that matched two themes. Both are
   data-quality problems in the operator's rules, surfaced not swallowed. */
.jbm-theme__flag {
  margin: .6rem 0 0;
  font-size: .78rem;
  color: var(--jbm-warn);
  line-height: 1.5;
}
.jbm-theme__flag--dead { color: var(--jbm-muted); }

.jbm-theme__conflict {
  margin: .6rem 0 0;
  font-size: .8rem;
  color: var(--jbm-bad);
  line-height: 1.5;
}

/* ── the decisions list ─────────────────────────────────────────────────── */

.jbm-list--warn-item { color: var(--jbm-warn); }
.jbm-list--bad-item { color: var(--jbm-bad); }

/* ── empty state ────────────────────────────────────────────────────────── */

.jbm-empty {
  padding: 1.25rem;
  border: 1px dashed var(--jbm-line-strong);
  border-radius: 10px;
  color: var(--jbm-muted);
  font-size: .9rem;
  line-height: 1.6;
}

@media (max-width: 560px) {
  .jbm-theme__top { align-items: flex-start; }
  .jbm-theme__fig { display: block; margin-left: 0 !important; }
  .jbm-theme__term-s { margin-left: 0; }
}