/*! Budget pacer — tool-specific styles only. */

.jbm-cal {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: 5px;
  margin-top: .5rem;
}

.jbm-cal__dow {
  font-size: .68rem;
  text-transform: uppercase;
  letter-spacing: .07em;
  color: var(--jbm-muted);
  text-align: center;
  padding-bottom: .15rem;
}

.jbm-cal__cell {
  position: relative;
  min-height: 54px;
  border-radius: 6px;
  border: 1px solid var(--jbm-line);
  background: var(--jbm-surface-2);
  padding: .3rem .35rem;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  font-size: .74rem;
  color: var(--jbm-ink-soft);
}

.jbm-cal__cell[data-state="ontrack"]    { background: var(--jbm-good-tint); border-color: var(--jbm-good); }
.jbm-cal__cell[data-state="behind"]     { background: var(--jbm-warn-tint); border-color: var(--jbm-warn); }
.jbm-cal__cell[data-state="catchup"]    { background: var(--jbm-bad-tint);  border-color: var(--jbm-bad); }
.jbm-cal__cell[data-state="elapsed"]    { background: var(--jbm-line); border-color: var(--jbm-line); opacity: .75; }
.jbm-cal__cell[data-state="off"]        { background: transparent; border-style: dashed; opacity: .5; }

.jbm-cal__day { font-weight: 700; color: var(--jbm-ink); font-size: .8rem; }
.jbm-cal__amt { font-variant-numeric: tabular-nums; font-size: .7rem; }
.jbm-cal__cell[data-state="elapsed"] .jbm-cal__day,
.jbm-cal__cell[data-state="off"] .jbm-cal__day { color: var(--jbm-muted); }

.jbm-cal__cell--today { box-shadow: inset 0 0 0 2px var(--jbm-red); }

.jbm-legend {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem 1rem;
  margin-top: .85rem;
}

.jbm-panel--good { border-top: 3px solid var(--jbm-good); }
.jbm-panel--warn { border-top: 3px solid var(--jbm-warn); }
.jbm-panel--bad  { border-top: 3px solid var(--jbm-bad); }

#goal-table tr[data-jbm-out="g-row-gap"] td { font-weight: 700; }
#goal-table tr[data-tone="good"] td { color: var(--jbm-good); }
#goal-table tr[data-tone="bad"] td  { color: var(--jbm-bad); }

@media (max-width: 620px) {
  .jbm-cal { gap: 3px; }
  .jbm-cal__cell { min-height: 44px; padding: .2rem; }
  .jbm-cal__amt { display: none; }
  .jbm-cal__cell::after {
    content: attr(data-short);
    font-size: .6rem;
    text-align: center;
  }
}