/* Thumbnails for the Exhibitor Resource cards on trade-show-guides.html.
 *
 * A file, not more lines in the page's inline <style>: that block is pinned by a CSP hash,
 * and editing it makes the browser discard the page's entire stylesheet. See resource-cards.js.
 *
 * The page's own rule is
 *   .resource-row{display:grid;grid-template-columns:minmax(150px,.28fr) minmax(0,1fr) auto;...}
 * and it already ships in that pinned block. resource-cards.js restores the class so that rule
 * finally applies (see the comment there); all this file does is widen the grid by one leading
 * column for the thumbnail, on cards that have one. A card without a hero image is untouched and
 * keeps the page's three-column layout exactly as authored.
 */
.resource-row.has-thumb {
  grid-template-columns: 120px minmax(150px, .28fr) minmax(0, 1fr) auto;
}
.resource-row > .resource-thumb {
  overflow: hidden;
  border-radius: 6px;
  background: #202936;
  aspect-ratio: 4 / 3;
}
.resource-row > .resource-thumb img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

@media (max-width: 620px) {
  /* The page collapses .resource-row to a single column here. Match that specificity so the
     four-column rule above does not leak onto phones, and let the thumbnail lead the stack. */
  .resource-row.has-thumb {
    grid-template-columns: 1fr;
  }
  .resource-row > .resource-thumb {
    width: 100%;
    aspect-ratio: 16 / 9;
  }
}

/* Calendar row buttons (2026-09-26): one line each, stacked in the Links column. Inline anchors with
   padding wrapped "Official Website" onto two lines that spilled out of the button box. */
.calendar-table td .button {
  display: inline-block;
  white-space: nowrap;
  margin: 0 6px 6px 0;
  grid-column: auto;
}

/* Calendar (2026-09-26, Owner): city and venue directly under the show name, so a visitor on the
   unfiltered first page sees where each show is without scrolling to the Location/Venue columns. */
.calendar-table .cal-where {
  display: block;
  margin-top: 4px;
  color: var(--muted, #aeb8c7);
  font-size: .86rem;
}

/* Calendar city groups (2026-09-26, Owner): one header row per city on the unfiltered first page. */
.calendar-table .cal-group-row th {
  background: var(--panel-2, #171e28);
  color: var(--text, #f5f7fb);
  font-size: .95rem;
  letter-spacing: 0;
  text-transform: none;
  padding: 12px 16px;
}
.calendar-table .cal-group-row th span {
  color: var(--muted, #aeb8c7);
  font-weight: 400;
}