/* Listing appearance is selected per display in ABC's Content layouts. */
.abc-listing--zebra > .views-row:nth-child(odd) {
  background: var(--abc-zebra-odd, #f2f5f7);
}
.abc-listing--zebra > .views-row:nth-child(even) {
  background: var(--abc-zebra-even, #e8eef2);
}
.abc-listing--zebra > .views-row > .sizer0 {
  box-sizing: border-box;
  max-width: var(--abc-content-width, 100%);
  margin-inline: auto;
  padding: var(--layout-section-space, 2rem) 20px;
}
#full-width-content .abc-listing--boxed,
.abc-page-full .abc-listing--boxed {
  max-width: var(--abc-content-width, 100%);
  margin-inline: auto;
}
.abc-listing--cards {
  max-width: var(--abc-content-width, 100%);
  margin-inline: auto;
  row-gap: var(--layout-section-space, 2rem);
  padding-block: var(--layout-section-space, 2rem);
}
.abc-listing--cards .layout-card {
  padding: var(--layout-section-space, 2rem);
}

/* Summaries and other non-listing output keep the configured content width.
 * Views can switch to a contextual-filter summary without changing its saved
 * row format. Only the actual Zebra/Card wrappers manage their own width.
 */
#full-width-content .view > .view-content:not(:has(> .abc-listing)),
.abc-page-full .view > .view-content:not(:has(> .abc-listing)) {
  box-sizing: border-box;
  max-width: var(--abc-content-width, 100%);
  margin-inline: auto;
  padding-inline: 20px;
}

/* Keep Views controls readable beside full-width listing bands. */
#full-width-content .view > .view-header,
#full-width-content .view > .view-filters,
#full-width-content .view > .view-footer,
#full-width-content .view > .pager,
#full-width-content .view > .view-empty,
#full-width-content .view > .more-link,
#full-width-content .view > .feed-icons,
#full-width-content .view > .view-content > h3,
.abc-page-full .view > .view-header,
.abc-page-full .view > .view-filters,
.abc-page-full .view > .view-footer,
.abc-page-full .view > .pager,
.abc-page-full .view > .view-empty,
.abc-page-full .view > .more-link,
.abc-page-full .view > .feed-icons,
.abc-page-full .view > .view-content > h3 {
  box-sizing: border-box;
  max-width: var(--abc-content-width, 100%);
  margin-inline: auto;
  padding-inline: 20px;
}

/* The optional full-width page include places main content outside sizer0. */
#main.abc-page-full {
  margin: 0;
}
.abc-page-intro,
.abc-page-full .block-page-title-block {
  box-sizing: border-box;
  max-width: var(--abc-content-width, 100%);
  margin-inline: auto;
  padding-inline: 20px;
}