/* Cascade repair for the listing routes — INTERIM, not a live behaviour.
 *
 * src/styles/embeds.css is the deduped union of every live page's <style>
 * blocks, so rules that on the live site apply to ONE page now apply to all of
 * them. Two of those blocks land on the listings and move real pixels. Every
 * declaration below is a live COMPUTED value, measured with
 * .parity/tmp/cssdiff.mjs against www.sdata.us on 2026-09-16 — nothing here is
 * authored from taste, and nothing here exists to make the build differ from
 * live. Delete the whole file once embeds.css scopes its blocks to the page
 * they came from; it then becomes a no-op. Reported in needsFromOthers.
 *
 * The file is loaded from the page body (Listing.astro), after embeds.css, so
 * equal-specificity rules win by order. style-src 'self' allows it: it is a
 * same-origin stylesheet, not an inline <style> and not a style attribute.
 *
 * ── Block 1: /platform's carousel rule, on /all-resources/resources ────────
 * embeds.css: `.swiper { width:75%; margin:0; overflow:visible }` (from
 * /platform, where the slider deliberately shows the next slide through).
 * Measured at 1440 on /all-resources/resources:
 *   .swiper  width     live 1382px   build 1037px
 *            overflow  live hidden   build visible
 */
.hero .swiper {
  width: auto;
  overflow: hidden;
}

/* ── Block 2: /all-resources/events' mobile pill bar, on the filter sidebar ─
 * embeds.css carries a ~120-line `@media (max-width:767px)` block from
 * /all-resources/events that turns the filter sidebar into a horizontally
 * scrolling pill bar. On live that markup only exists on the events page; here
 * it restyles the identical classes on /all-resources/resources and
 * /categories/*. Measured at 390 on /all-resources/resources (live vs build):
 *   .event-filters-column  border-left/right 1px vs 0 · overflow visible vs
 *                          hidden/auto · height 330px vs 350px
 *   .filter_form           padding-inline 8px vs 0 · row-gap 0 vs 4px
 *   .filter_block_header   padding-right 16px vs 8px
 *   .filter_list           column vs row · gap 12px vs 8px · padding-bottom
 *                          20px vs 0
 *   .checkbox_field        transparent vs sage pill, radius 0 vs 999px,
 *                          padding 0 vs 8px/16px, its checkbox block vs none
 * The height delta pushed every one of the 20 cards 20px down the page, which
 * is the whole of that cell's layout score (37.2).
 */
@media screen and (max-width: 767px) {
  .event-filters-column {
    border-left: 1px solid var(--sage);
    border-right: 1px solid var(--sage);
    overflow-x: visible;
    overflow-y: visible;
    max-width: none;
  }
  .event-filters .filter_form {
    padding-left: .5rem;
    padding-right: .5rem;
    grid-row-gap: 0rem;
    row-gap: 0rem;
  }
  .event-filters .filter_block {
    min-width: auto;
  }
  .event-filters .filter_block_header {
    padding-right: 1rem;
  }
  .event-filters .filter_list-wrapper {
    overflow-x: visible;
    overflow-y: visible;
    max-width: none;
    padding-top: 0;
    padding-right: 0;
    -webkit-mask-image: none;
    mask-image: none;
  }
  .event-filters .filter_list {
    display: flex;
    flex-flow: column nowrap;
    min-width: 0;
    grid-column-gap: .75rem;
    grid-row-gap: .75rem;
    gap: .75rem;
    padding-bottom: 1.25rem;
  }
  .event-filters .checkbox_field {
    background-color: transparent;
    color: #b7b7b7;
    border-radius: 0;
    padding: 0;
    gap: normal;
    white-space: normal;
  }
  .event-filters .checkbox_field .checkbox_input {
    display: block;
    min-width: auto;
  }
  .event-filters .checkbox_field .checkbox_label {
    margin-right: .25rem;
  }
}
