/* recommendations#show — page layout: banner grid + browser grid + empty state.
 * The new Figma "work file" dashboard (screen #1). Banner cards, filter rail,
 * toolbar, table/cards live in widgets/recommendations/. */

/* ---- Banner grid ---- */
.rec-banner {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--spacing-16);
  margin-bottom: var(--spacing-32);
}
@media (min-width: 48rem) {
  .rec-banner { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (min-width: 64rem) {
  .rec-banner { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}

/* ---- Browser: filter rail + content ---- */
.rec-browser-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--spacing-16);
}
@media (min-width: 64rem) {
  /* Note: bespoke rail width — no design-system column-width token exists. */
  .rec-browser-grid { grid-template-columns: 18rem minmax(0, 1fr); }
}

.rec-browser-main { min-width: 0; }

/* ---- Empty state ---- */
.rec-empty {
  padding: var(--spacing-32);
  text-align: center;
  color: var(--text-tertiary);
  background-color: var(--background-surface-1);
  border-radius: var(--corner-radius-xs);
}