/* Styles for mega-inline.hbs — a mega panel rendered inside a sidebar entry
   instead of the desktop drawer. Sidebar-only, so no desktop breakpoint. */

/* Paints its own ground rather than letting the sidebar entry show through the
   8px gutters between cards: legacy's panel container is `--gray-0` at every
   width, a shade deeper than the entry behind it in dark theme. */
.mega-inline {
  display: flex;
  justify-content: start;
  min-width: 100%;
  width: 300px;
  padding-top: 16px;
  overflow-x: auto;
  background: var(--gray-0);
  border-radius: 0 0 24px 24px;
}

/* Six fixed columns wider than the viewport: the strip scrolls sideways and wraps
   onto a second row once a panel holds more than six cards. */
.mega-inline .mega-cards {
  width: 900px;
  grid-template-columns: repeat(6, 1fr);
}

/* The "بیشتر" tile is deliberately excluded. Legacy gives it nothing but
   `min-width: 64px` and lets the grid track decide: behind eleven 210px crypto
   cards its track is already 210px wide so it stretches to match, but next to the
   wider blog categories it keeps its own track and shrinks to 64px. Forcing 210px
   on it made the blog strip 146px wider than upstream. */
.mega-inline .card-item:not(.card-more) {
  width: 210px;
}