.path-community-events section.layout--with-complementary {
  display: block;
}

.path-community-events section.layout--with-complementary > .region--content,
.path-community-events section.layout--with-complementary > aside {
  width: 100%;
  max-width: 100%;
}

.path-community-events #block-socialblue-content,
.path-community-events .views-element-container {
  width: 100%;
  max-width: 100%;
}

/* Exposed filter: full-width "landscape" card with the fields flowing across
   in ~two rows instead of one tall stacked column.

   Note on the DOM: .views-exposed-form is the outer BLOCK wrapper. Its direct
   children are the mobile off-canvas trigger and #block-filter (an off-canvas
   panel). The real fields live in:
     .views-exposed-form #block-filter .offcanvas-body form > .clearfix
   so the flex container has to be that inner wrapper, not .views-exposed-form. */
.path-community-events .views-exposed-form {
  display: block;
  width: 100%;
  max-width: 100%;
  margin-bottom: 1.25rem;
  padding: 1.25rem 1.5rem;
  background: #fff;
  border: 1px solid rgba(0, 0, 0, 0.08);
  border-radius: 8px;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06);
}

/* On desktop the off-canvas panel renders inline; let every wrapper fill the
   card width so the fields can spread out. */
.path-community-events .views-exposed-form #block-filter,
.path-community-events .views-exposed-form .off-canvas,
.path-community-events .views-exposed-form .offcanvas-body,
.path-community-events .views-exposed-form > form,
.path-community-events .views-exposed-form .offcanvas-body > form {
  width: 100%;
  max-width: 100%;
  margin: 0;
}

/* The inner wrapper directly holding the fieldset + filters + actions is the
   horizontal flex container. */
.path-community-events .views-exposed-form form > .clearfix {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: 0.85rem 1rem;
}

/* Each filter (and the date-range fieldset) is an equal-ish column. The basis
   makes them wrap onto roughly two rows on a typical content width. */
.path-community-events .views-exposed-form form > .clearfix > .form-item,
.path-community-events .views-exposed-form form > .clearfix > fieldset {
  flex: 1 1 13rem;
  min-width: 0;
  max-width: 18rem;
  margin: 0;
}

/* Flatten the date-range fieldset chrome and keep its two radios together. */
.path-community-events .views-exposed-form fieldset.fieldgroup {
  padding: 0;
  border: 0;
}

.path-community-events .views-exposed-form fieldset > legend {
  width: auto;
  margin: 0;
  padding: 0;
  border: 0;
}

.path-community-events .views-exposed-form fieldset > legend:empty,
.path-community-events .views-exposed-form fieldset > legend span:empty {
  display: none;
}

.path-community-events .views-exposed-form .fieldset-wrapper {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.25rem 1rem;
}

.path-community-events .views-exposed-form .fieldset-wrapper .form-item {
  margin: 0;
}

/* Inputs fill their column. */
.path-community-events .views-exposed-form .form-item .form-control,
.path-community-events .views-exposed-form .form-item .form-select,
.path-community-events .views-exposed-form .form-item select,
.path-community-events .views-exposed-form .form-item .select2-container {
  width: 100% !important;
}

/* Filter button sits at the bottom of its column without stretching. */
.path-community-events .views-exposed-form form > .clearfix > .form-actions {
  flex: 0 0 auto;
  align-self: flex-end;
  margin: 0;
}

.path-community-events .views-exposed-form .help-block:empty,
.path-community-events .views-exposed-form .description:empty {
  display: none;
}

.view-id-upcoming_events.view-display-id-page_community_events {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1.5rem;
  align-items: start;
  width: 100%;
  max-width: 100%;
}

.view-id-upcoming_events.view-display-id-page_community_events > .pager,
.view-id-upcoming_events.view-display-id-page_community_events > .pager-nav,
.view-id-upcoming_events.view-display-id-page_community_events > nav,
.view-id-upcoming_events.view-display-id-page_community_events > .views-row {
  grid-column: 1 / -1;
}

@media (max-width: 575.98px) {
  .view-id-upcoming_events.view-display-id-page_community_events {
    grid-template-columns: 1fr;
    gap: 1rem;
  }
}

.view-id-upcoming_events .teaser.card {
  display: flex !important;
  flex-direction: column !important;
  flex-wrap: nowrap !important;
  height: auto !important;
  min-height: 0;
  width: auto !important;
  max-width: 100%;
  float: none !important;
  overflow: hidden;
}

.view-id-upcoming_events .teaser.card .teaser__image {
  width: 100% !important;
  height: auto !important;
  max-height: none !important;
  flex: 0 0 auto !important;
  overflow: visible;
}

.view-id-upcoming_events .teaser.card .teaser__image > a {
  display: block;
  width: 100%;
  line-height: 0;
}

.view-id-upcoming_events .teaser.card .teaser__image img {
  display: block;
  width: 100%;
  height: auto;
  max-width: 100%;
}

.view-id-upcoming_events .teaser.card .teaser__body {
  flex: 1 1 auto !important;
  width: 100%;
  max-width: 100% !important;
  min-height: 0;
}