/* ============================================================
   components/event-facts.css
   The key-facts panel on an event: when, where, how to get in.
   It sits directly under the title, above the hero, because that
   is the whole question a reader brings to an event page.
   No outer margin on the root; the template places it.
   ============================================================ */
.rfi-event-facts { background: var(--rfi-bg); border-radius: var(--rfi-radius); padding: 18px 20px; }

.rfi-event-facts__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 15px 24px; }
@media (max-width: 700px) { .rfi-event-facts__grid { grid-template-columns: 1fr; } }

.rfi-event-facts__row { display: flex; gap: 11px; align-items: flex-start; }
.rfi-event-facts__row svg { width: 18px; height: 18px; fill: var(--rfi-navy); flex: none; margin-top: 2px; }
.rfi-event-facts__label { display: block; font-family: var(--rfi-font-ui); font-size: 10.5px; font-weight: 600; letter-spacing: .5px; text-transform: uppercase; color: var(--rfi-text-3); }
.rfi-event-facts__value { display: block; font-size: 14.5px; color: var(--rfi-text); margin-top: 3px; }
.rfi-event-facts__value a { color: var(--rfi-navy); }
.rfi-event-facts__value a:hover { color: var(--rfi-teal); }

.rfi-event-facts__actions { display: flex; align-items: center; gap: 13px; margin-top: 16px; padding-top: 15px; border-top: 1px solid var(--rfi-border); }

/* The status pill states a fact about time, so it is quiet, not a call to action.
   Ended is muted: the event still exists as a record, but it is not asking for
   anything any more (design-decisions.md 4). */
.rfi-event-facts__status {
  font-family: var(--rfi-font-ui); font-size: 9.5px; font-weight: 600; letter-spacing: .6px; text-transform: uppercase;
  color: var(--rfi-navy); background: var(--rfi-partner-tint);
  box-shadow: 0 0 0 1px var(--rfi-partner-line) inset;
  padding: 4px 9px; border-radius: var(--rfi-radius-xs);
}
.rfi-event-facts__status.is-ended { color: var(--rfi-text-3); background: var(--rfi-input); box-shadow: none; }