/* ============================================================
   components/panel.css
   The white panel, the section head, and the top list (six rows,
   two columns). It reads as a list because it is a list; it does
   not compete with the card blocks around it. No outer margin.
   ============================================================ */
.rfi-panel { background: var(--rfi-surface); border-radius: var(--rfi-radius); box-shadow: var(--rfi-shadow); padding: 20px var(--rfi-pad-panel); }

.rfi-section-head { display: flex; align-items: baseline; gap: 12px; }
.rfi-section-head__hint { font-size: var(--rfi-meta); color: var(--rfi-text-3); }
.rfi-section-head__arrow { margin-left: auto; font-family: var(--rfi-font-ui); font-size: 13px; font-weight: 500; color: var(--rfi-teal); }
.rfi-section-head__arrow:hover { text-decoration: underline; }

/* Top list: two-column ranked rows. */
.rfi-toplist { display: grid; grid-template-columns: 1fr 1fr; column-gap: 28px; }
.rfi-toplist__row { display: flex; gap: 13px; align-items: baseline; padding: 11px 0; border-top: 1px solid var(--rfi-border-soft); }
.rfi-toplist__row:nth-child(-n+2) { border-top: 0; }
.rfi-toplist__n { font-family: var(--rfi-font-ui); font-size: 15px; font-weight: 600; color: var(--rfi-text-3); flex: none; width: 16px; }
.rfi-toplist__t { font-size: 14px; line-height: 1.45; }
.rfi-toplist__row:hover .rfi-toplist__t, .rfi-toplist__row:hover .rfi-toplist__n { color: var(--rfi-teal); }
@media (max-width: 700px) { .rfi-toplist { grid-template-columns: 1fr; } .rfi-toplist__row:nth-child(2) { border-top: 1px solid var(--rfi-border-soft); } }

/* Event and company rows inside a panel. */
.rfi-listrow { display: flex; gap: 14px; padding: 13px 0; border-top: 1px solid var(--rfi-border-soft); align-items: center; }
.rfi-listrow:first-child { border-top: 0; padding-top: 2px; }
.rfi-listrow__date { font-family: var(--rfi-font-ui); font-size: 12.5px; font-weight: 600; color: var(--rfi-teal-dark); width: 96px; flex: none; line-height: 1.4; }
.rfi-listrow__name { display: block; font-family: var(--rfi-font-ui); font-size: 15px; font-weight: 500; }
.rfi-listrow:hover .rfi-listrow__name { color: var(--rfi-teal); }
.rfi-listrow__sub { display: block; font-size: 12px; color: var(--rfi-text-3); margin-top: 3px; }
.rfi-listrow__logo { width: 52px; height: 34px; flex: none; border-radius: var(--rfi-radius-xs); display: flex; align-items: center; justify-content: center; font-size: 8px; color: var(--rfi-text-3); font-family: var(--rfi-font-ui); overflow: hidden; }
.rfi-listrow__logo img { width: 100%; height: 100%; object-fit: contain; }
/* No logo: the company's initials fill the same slot, same size, same radius. */
.rfi-listrow__logo--mono { background: var(--rfi-monogram-bg); }
.rfi-listrow__mono { font-family: var(--rfi-font-ui); font-size: 13px; font-weight: 600; letter-spacing: .5px; color: var(--rfi-monogram-text); }