/**
 * Overrides for pages that differ between the old UMKC site and this one.
 * Remove a rule once the page it targets matches the old site again.
 *
 * Loaded unaggregated (see the local-stylesheets library): local-theme.css
 * ends inside two unclosed @media blocks, which would swallow these rules if
 * they were bundled after it.
 */

/*
 * /collections (also the front page here) is the top_level_collections view,
 * a grid of titles, not the old site's search results page.
 */

/* The theme pulls the front page's featured region up 150px over the content
   area, which was empty on the old home page; here it covered the list. */
.path-frontpage:has(.view-id-top_level_collections) #featured {
  margin-top: 0;
}

/* The theme's 40-50px headings overflowed the grid; the heading was also
   dark grey on the region's dark background. */
.view-id-top_level_collections .view-header h2 {
  font-size: 32px;
  margin: 10px 0 20px;
  color: inherit;
}
.view-id-top_level_collections .views-view-grid .views-row {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
  margin-bottom: 20px;
  float: none;
}
.view-id-top_level_collections .views-view-grid .views-col {
  /* Views sets an inline width: 25%, and its col-1..col-4 classes collide
     with Bootstrap's grid, which caps col-1 at 8.33% wide. Let the columns
     size and wrap instead. */
  width: auto !important;
  max-width: none;
  flex: 1 1 220px;
  min-width: 0;
  float: none;
  padding: 0;
}
.view-id-top_level_collections .views-field-title h3 {
  font-size: 22px;
  line-height: 1.3;
  margin: 0;
  overflow-wrap: break-word;
}
@media (max-width: 575px) {
  .view-id-top_level_collections .view-header h2 {
    font-size: 26px;
  }
  .view-id-top_level_collections .views-view-grid .views-col {
    flex-basis: 100%;
  }
}
