/* Local review only. Match Eric's approved PTSD research-card reference.
   The HTML allowlist identifies reviewed chart groups; this stylesheet does
   not decide which content a guide should contain. Keep all existing fill
   classes, widths, rate captions, denominators, legends, and source wording. */
.research-chart-card {
  box-sizing: border-box;
  min-width: 0;
  max-width: 100%;
  margin: 1.4rem 0 1.6rem;
  padding: 1.5rem;
  border: 1px solid var(--color-accent);
  border-radius: var(--radius-md);
  background: var(--color-surface);
}

/* Existing title text and heading levels are retained. Some browser-created
   charts supply their titles as paragraphs with inline styling. */
.research-chart-card > .research-chart-title {
  font-family: inherit;
  font-size: 1.15rem !important;
  font-weight: 700;
  line-height: 1.35;
  text-align: center;
  color: var(--color-primary) !important;
  margin: 1.4rem 0 .4rem !important;
  padding-bottom: .5rem;
  border-bottom: 1px solid var(--color-border);
}

.research-chart-card > p:not(.research-chart-title) {
  font-size: .9rem !important;
  line-height: 1.6 !important;
}

.research-chart-card > .cond-bars {
  margin-bottom: 0;
}

.research-chart-card > .research-chart-title + .bva-factor-row {
  margin-top: 1.2rem;
}

/* A long label must not be squeezed by a nonwrapping percentage on a phone.
   This also covers the eight existing cards without changing their desktop
   appearance. No row colors, numerical widths, or bar heights are replaced. */
@media (max-width: 650px) {
  .research-chart-card { padding: 1rem; }
  :is(.research-chart-card, .research-chart-existing) .bva-factor-head {
    flex-wrap: wrap;
    gap: .15rem .5rem;
  }
  :is(.research-chart-card, .research-chart-existing) .bva-factor-label {
    flex: 1 1 12rem;
  }
  :is(.research-chart-card, .research-chart-existing) .bva-factor-rate {
    margin-left: auto;
  }
}