/* Freshness pills — schedule + last-updated, shown next to section headings.
 * Paired with js/freshness.js. Design tokens inherited from styles.css. */

.fresh-wrap {
  display: inline-flex;
  gap: 0.35rem;
  flex-wrap: wrap;
  margin-left: 0.6rem;
  vertical-align: middle;
  font-family: var(--font-sans, system-ui);
}

.fresh-pill {
  display: inline-flex;
  align-items: center;
  padding: 0.12rem 0.5rem;
  font-size: 0.68rem;
  font-weight: 500;
  line-height: 1.5;
  border-radius: 999px;
  border: 1px solid transparent;
  white-space: nowrap;
  letter-spacing: 0.01em;
  cursor: help;
}

/* Schedule pill — static, always neutral */
.fresh-pill-sched {
  background: rgba(110, 118, 129, 0.15);
  color: var(--text-secondary, #8b949e);
  border-color: rgba(110, 118, 129, 0.25);
}

.fresh-pill-sched.fresh-pill-manual {
  background: rgba(251, 191, 36, 0.12);
  color: var(--yellow, #fbbf24);
  border-color: rgba(251, 191, 36, 0.3);
}

/* Last-updated pill — colored by freshness class set in JS */
.fresh-pill-last.fresh-ok {
  background: rgba(74, 222, 128, 0.14);
  color: var(--green, #4ade80);
  border-color: rgba(74, 222, 128, 0.28);
}
.fresh-pill-last.fresh-late {
  background: rgba(251, 191, 36, 0.14);
  color: var(--yellow, #fbbf24);
  border-color: rgba(251, 191, 36, 0.3);
}
.fresh-pill-last.fresh-stale {
  background: rgba(248, 113, 113, 0.14);
  color: var(--red, #f87171);
  border-color: rgba(248, 113, 113, 0.3);
}
.fresh-pill-last.fresh-unknown,
.fresh-pill-sched.fresh-pill-unknown {
  background: rgba(110, 118, 129, 0.1);
  color: var(--text-muted, #6e7681);
  border-color: rgba(110, 118, 129, 0.2);
  font-style: italic;
}

.fresh-pill-loading {
  opacity: 0.4;
}

@media (max-width: 640px) {
  .fresh-wrap {
    display: flex;
    margin-left: 0;
    margin-top: 0.35rem;
  }
  .fresh-pill {
    font-size: 0.65rem;
  }
}