.paragraph__events_selective_view_title {
  padding-bottom: 1.5rem;
}

#views-exposed-form-events3-event-selective-view,
#views-exposed-form-events3-events {
  margin-left: 0 !important;
  background-color: #000;
  padding: 1rem;
  border-radius: 0.75rem;
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
  align-items: center;
}

#views-exposed-form-events3-event-selective-view {
  padding-right: 1.75rem;
}

/* Keep all filters with the same pill sizing/padding. */
:is(#views-exposed-form-events3-event-selective-view, #views-exposed-form-events3-events) .views-exposed-widget {
  margin: 0 !important;
  padding: 0.625rem 1rem !important;
  min-height: 2.875rem;
  border: 1px solid #fff;
  border-radius: 999px;
  background: #000;
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
}

/* Date filters need a little extra width for label + value. */
:is(#views-exposed-form-events3-event-selective-view, #views-exposed-form-events3-events) .views-exposed-widget[class*="field_event_date_value_2"],
:is(#views-exposed-form-events3-event-selective-view, #views-exposed-form-events3-events) .views-exposed-widget[class*="field_event_date_value_1"],
:is(#views-exposed-form-events3-event-selective-view, #views-exposed-form-events3-events) .views-exposed-widget[class*="field-event-date-value-2"],
:is(#views-exposed-form-events3-event-selective-view, #views-exposed-form-events3-events) .views-exposed-widget[class*="field-event-date-value-1"],
#views-exposed-form-events3-event-selective-view #edit-field-event-date-value-2-wrapper,
#views-exposed-form-events3-event-selective-view #edit-field-event-date-value-1-wrapper,
#views-exposed-form-events3-events #edit-field-event-date-value-2-wrapper,
#views-exposed-form-events3-events #edit-field-event-date-value-1-wrapper {
  min-width: 18rem;
}

/* Date wrappers are fieldsets (not .views-exposed-widget) in this display. */
#views-exposed-form-events3-event-selective-view #edit-field-event-date-value-2-wrapper,
#views-exposed-form-events3-event-selective-view #edit-field-event-date-value-1-wrapper,
#views-exposed-form-events3-event-selective-view [id^="edit-field-event-date-value-2-wrapper"],
#views-exposed-form-events3-event-selective-view [id^="edit-field-event-date-value-1-wrapper"],
#views-exposed-form-events3-events #edit-field-event-date-value-2-wrapper,
#views-exposed-form-events3-events #edit-field-event-date-value-1-wrapper,
#views-exposed-form-events3-events [id^="edit-field-event-date-value-2-wrapper"],
#views-exposed-form-events3-events [id^="edit-field-event-date-value-1-wrapper"] {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  margin: 0 !important;
  padding: 0.625rem 1rem !important;
  min-height: 2.875rem;
  border: 1px solid #fff;
  border-radius: 999px;
  background: #000;
}

#views-exposed-form-events3-event-selective-view #edit-field-event-date-value-2-wrapper::before {
  content: "From";
  color: #ff4024;
  margin-left: 0.25rem;
}

#views-exposed-form-events3-events #edit-field-event-date-value-2-wrapper::before {
  content: "From";
  color: #ff4024;
  margin-left: 0.25rem;
}

#views-exposed-form-events3-event-selective-view [id^="edit-field-event-date-value-2-wrapper"]::before {
  content: "From";
  color: #ff4024;
  margin-left: 0.25rem;
}

#views-exposed-form-events3-events [id^="edit-field-event-date-value-2-wrapper"]::before {
  content: "From";
  color: #ff4024;
  margin-left: 0.25rem;
}

#views-exposed-form-events3-event-selective-view #edit-field-event-date-value-1-wrapper::before {
  content: "To";
  color: #ff4024;
  margin-left: 0.25rem;
}

#views-exposed-form-events3-events #edit-field-event-date-value-1-wrapper::before {
  content: "To";
  color: #ff4024;
  margin-left: 0.25rem;
}

#views-exposed-form-events3-event-selective-view [id^="edit-field-event-date-value-1-wrapper"]::before {
  content: "To";
  color: #ff4024;
  margin-left: 0.25rem;
}

#views-exposed-form-events3-events [id^="edit-field-event-date-value-1-wrapper"]::before {
  content: "To";
  color: #ff4024;
  margin-left: 0.25rem;
}

#views-exposed-form-events3-event-selective-view #edit-field-event-date-value-2-wrapper .fieldset-wrapper,
#views-exposed-form-events3-event-selective-view #edit-field-event-date-value-1-wrapper .fieldset-wrapper,
#views-exposed-form-events3-event-selective-view [id^="edit-field-event-date-value-2-wrapper"] .fieldset-wrapper,
#views-exposed-form-events3-event-selective-view [id^="edit-field-event-date-value-1-wrapper"] .fieldset-wrapper,
#views-exposed-form-events3-events #edit-field-event-date-value-2-wrapper .fieldset-wrapper,
#views-exposed-form-events3-events #edit-field-event-date-value-1-wrapper .fieldset-wrapper,
#views-exposed-form-events3-events [id^="edit-field-event-date-value-2-wrapper"] .fieldset-wrapper,
#views-exposed-form-events3-events [id^="edit-field-event-date-value-1-wrapper"] .fieldset-wrapper {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  margin: 0;
  padding: 0;
}

#views-exposed-form-events3-event-selective-view #edit-field-event-date-value-2-wrapper .js-form-type-date,
#views-exposed-form-events3-event-selective-view #edit-field-event-date-value-1-wrapper .js-form-type-date,
#views-exposed-form-events3-event-selective-view [id^="edit-field-event-date-value-2-wrapper"] .js-form-type-date,
#views-exposed-form-events3-event-selective-view [id^="edit-field-event-date-value-1-wrapper"] .js-form-type-date,
#views-exposed-form-events3-events #edit-field-event-date-value-2-wrapper .js-form-type-date,
#views-exposed-form-events3-events #edit-field-event-date-value-1-wrapper .js-form-type-date,
#views-exposed-form-events3-events [id^="edit-field-event-date-value-2-wrapper"] .js-form-type-date,
#views-exposed-form-events3-events [id^="edit-field-event-date-value-1-wrapper"] .js-form-type-date {
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
}

/* Flatten nested wrappers so no inner borders/padding appear. */
:is(#views-exposed-form-events3-event-selective-view, #views-exposed-form-events3-events) .views-widget,
:is(#views-exposed-form-events3-event-selective-view, #views-exposed-form-events3-events) .form-item,
:is(#views-exposed-form-events3-event-selective-view, #views-exposed-form-events3-events) .form-type-date-popup,
:is(#views-exposed-form-events3-event-selective-view, #views-exposed-form-events3-events) .date-padding {
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

:is(#views-exposed-form-events3-event-selective-view, #views-exposed-form-events3-events) select,
:is(#views-exposed-form-events3-event-selective-view, #views-exposed-form-events3-events) input[type="text"],
:is(#views-exposed-form-events3-event-selective-view, #views-exposed-form-events3-events) input[type="search"],
:is(#views-exposed-form-events3-event-selective-view, #views-exposed-form-events3-events) input[type="date"] {
  background: #000 !important;
  color: #fff !important;
  border: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
}

/* Keep native dropdown menus readable across OS/browser theme variations. */
:is(#views-exposed-form-events3-event-selective-view, #views-exposed-form-events3-events) select option,
:is(#views-exposed-form-events3-event-selective-view, #views-exposed-form-events3-events) select optgroup {
  background-color: #111 !important;
  color: #fff !important;
}

/* Chosen dropdown fallback to avoid white-on-white in custom select UIs. */
:is(#views-exposed-form-events3-event-selective-view, #views-exposed-form-events3-events) .chosen-container .chosen-drop {
  background: #111 !important;
  border-color: rgba(255, 255, 255, 0.35) !important;
}

:is(#views-exposed-form-events3-event-selective-view, #views-exposed-form-events3-events) .chosen-container .chosen-results li {
  color: #fff !important;
}

:is(#views-exposed-form-events3-event-selective-view, #views-exposed-form-events3-events) input[type="date"] {
  color-scheme: dark;
}

:is(#views-exposed-form-events3-event-selective-view, #views-exposed-form-events3-events) .chosen-container .chosen-single,
:is(#views-exposed-form-events3-event-selective-view, #views-exposed-form-events3-events) .form-type-date-popup .tbc-date-popup-label {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  color: #fff !important;
  margin: 0 !important;
  padding: 0 !important;
}

:is(#views-exposed-form-events3-event-selective-view, #views-exposed-form-events3-events) .form-type-date-popup .tbc-date-popup-label span {
  margin-right: 0 !important;
}

/* Force the date labels visible and inline. */
:is(#views-exposed-form-events3-event-selective-view, #views-exposed-form-events3-events) .views-exposed-widget[class*="field_event_date_value"]>label,
:is(#views-exposed-form-events3-event-selective-view, #views-exposed-form-events3-events) .views-exposed-widget[class*="field-event-date-value"]>label,
:is(#views-exposed-form-events3-event-selective-view, #views-exposed-form-events3-events) .views-exposed-widget[class*="field_event_date_value"]>label.element-invisible,
:is(#views-exposed-form-events3-event-selective-view, #views-exposed-form-events3-events) .views-exposed-widget[class*="field_event_date_value"]>label.visually-hidden {
  display: inline-flex !important;
  position: static !important;
  clip: auto !important;
  clip-path: none !important;
  overflow: visible !important;
  width: auto !important;
  height: auto !important;
  color: #fff !important;
  margin: 0 0.5rem 0 0.25rem !important;
  white-space: nowrap !important;
}

/* Style the date prefixes injected by ViewsFormAlterService. */
#views-exposed-form-events3-event-selective-view #edit-field-event-date-value-2-wrapper .field-prefix,
#views-exposed-form-events3-event-selective-view #edit-field-event-date-value-1-wrapper .field-prefix,
#views-exposed-form-events3-event-selective-view [id^="edit-field-event-date-value-2-wrapper"] .field-prefix,
#views-exposed-form-events3-event-selective-view [id^="edit-field-event-date-value-1-wrapper"] .field-prefix,
#views-exposed-form-events3-events #edit-field-event-date-value-2-wrapper .field-prefix,
#views-exposed-form-events3-events #edit-field-event-date-value-1-wrapper .field-prefix,
#views-exposed-form-events3-events [id^="edit-field-event-date-value-2-wrapper"] .field-prefix,
#views-exposed-form-events3-events [id^="edit-field-event-date-value-1-wrapper"] .field-prefix {
  color: #fff !important;
  display: inline-flex;
  align-items: center;
  margin-right: 0.5rem;
  margin-left: 0.25rem;
  white-space: nowrap;
}

#views-exposed-form-events3-event-selective-view #edit-field-event-date-value-2-date,
#views-exposed-form-events3-event-selective-view #edit-field-event-date-value-1-date,
#views-exposed-form-events3-events #edit-field-event-date-value-2-date,
#views-exposed-form-events3-events #edit-field-event-date-value-1-date {
  width: auto;
  min-width: 9.5rem;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  color: #fff !important;
  box-shadow: none !important;
}

:is(#views-exposed-form-events3-event-selective-view, #views-exposed-form-events3-events) input[type="submit"],
:is(#views-exposed-form-events3-event-selective-view, #views-exposed-form-events3-events) button {
  background-color: #000;
  color: #fff;
  border: 1px solid #fff;
  border-radius: 999px;
  padding: 0.625rem 1.25rem;
}

:is(#views-exposed-form-events3-event-selective-view, #views-exposed-form-events3-events) input::placeholder {
  color: #fff;
  opacity: 0.8;
}

/* Search icon + expandable title input. */
:is(#views-exposed-form-events3-event-selective-view, #views-exposed-form-events3-events) .form-item-title {
  display: inline-flex;
  align-items: center;
  border: 0 !important;
  background: transparent !important;
  padding: 0 !important;
  min-height: auto !important;
}

:is(#views-exposed-form-events3-event-selective-view, #views-exposed-form-events3-events) .form-item-title > label {
  position: relative;
  width: 3rem;
  height: 3rem;
  min-width: 3rem;
  border-radius: 999px;
  border: 1px solid #fff;
  background: #fff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  margin: 0;
  font-size: 0;
  line-height: 0;
  color: transparent !important;
}

:is(#views-exposed-form-events3-event-selective-view, #views-exposed-form-events3-events) .form-item-title > label::before {
  content: "";
  width: 0.92rem;
  height: 0.92rem;
  border: 2px solid #0d1d4a;
  border-radius: 999px;
  display: block;
  box-sizing: border-box;
}

:is(#views-exposed-form-events3-event-selective-view, #views-exposed-form-events3-events) .form-item-title > label::after {
  content: "";
  position: absolute;
  width: 0.56rem;
  height: 2px;
  background: #0d1d4a;
  border-radius: 2px;
  transform: rotate(45deg);
  right: 0.8rem;
  bottom: 0.86rem;
}

:is(#views-exposed-form-events3-event-selective-view, #views-exposed-form-events3-events) .form-item-title #edit-title,
:is(#views-exposed-form-events3-event-selective-view, #views-exposed-form-events3-events) .form-item-title [id^="edit-title"] {
  width: 0;
  min-width: 0;
  opacity: 0;
  pointer-events: none;
  margin: 0 !important;
  padding: 0 !important;
  border: 1px solid transparent !important;
  border-radius: 999px;
  transition: width 0.2s ease, opacity 0.2s ease, margin 0.2s ease, padding 0.2s ease;
}

:is(#views-exposed-form-events3-event-selective-view, #views-exposed-form-events3-events) .form-item-title.title-search-open #edit-title,
:is(#views-exposed-form-events3-event-selective-view, #views-exposed-form-events3-events) .form-item-title.title-search-open [id^="edit-title"],
:is(#views-exposed-form-events3-event-selective-view, #views-exposed-form-events3-events) .form-item-title:focus-within #edit-title,
:is(#views-exposed-form-events3-event-selective-view, #views-exposed-form-events3-events) .form-item-title:focus-within [id^="edit-title"] {
  width: 12.5rem;
  min-width: 12.5rem;
  opacity: 1;
  pointer-events: auto;
  margin-left: 0.5rem !important;
  padding: 0.5rem 0.9rem !important;
  border-color: #fff !important;
  background: transparent !important;
}

.paragraph--no-results .views-exposed-form {
  display: none;
}

/* Color only Event Type / Event Tags / Location labels to red. */
#views-exposed-form-events3-event-selective-view .form-item-field-event-type-tid>label,
#views-exposed-form-events3-event-selective-view .form-item-field-event-tags-target-id>label,
#views-exposed-form-events3-event-selective-view .form-item-field-performance-location-target-id>label,
#views-exposed-form-events3-event-selective-view .form-item-field-free-value>label {
  color: #ff4024 !important;
}

/* Keep selected values in the three select filters white. */
#views-exposed-form-events3-event-selective-view #edit-field-event-type-tid,
#views-exposed-form-events3-event-selective-view #edit-field-event-tags-target-id,
#views-exposed-form-events3-event-selective-view #edit-field-performance-location-target-id,
#views-exposed-form-events3-event-selective-view [id^="edit-field-free-value"] {
  color: #fff !important;
}

#views-exposed-form-events3-events .form-item-field-event-type-tid > label {
  color: #ff4024 !important;
}

#views-exposed-form-events3-events #edit-field-event-type-tid {
  color: #fff !important;
}

/* Keep location filter compact in closed state to avoid wrapping next controls. */
:is(#views-exposed-form-events3-event-selective-view, #views-exposed-form-events3-events) .form-item-field-performance-location-target-id {
  min-width: 0;
}

:is(#views-exposed-form-events3-event-selective-view, #views-exposed-form-events3-events) #edit-field-performance-location-target-id,
:is(#views-exposed-form-events3-event-selective-view, #views-exposed-form-events3-events) [id^="edit-field-performance-location-target-id"] {
  width: 8.5rem;
  max-width: 8.5rem;
  min-width: 0;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* Expand width while interacting so longer values are easier to inspect/select. */
:is(#views-exposed-form-events3-event-selective-view, #views-exposed-form-events3-events) #edit-field-performance-location-target-id:focus,
:is(#views-exposed-form-events3-event-selective-view, #views-exposed-form-events3-events) [id^="edit-field-performance-location-target-id"]:focus {
  width: 14rem;
  max-width: 14rem;
}

:is(#views-exposed-form-events3-event-selective-view, #views-exposed-form-events3-events) .form-select {
  margin-left: 10px;
}

/* Keep Event Type + Series + Event Tags compact in closed state; allow full dropdown width on open. */
:is(#views-exposed-form-events3-event-selective-view, #views-exposed-form-events3-events) .form-item-field-event-type-tid,
:is(#views-exposed-form-events3-event-selective-view, #views-exposed-form-events3-events) .form-item-field-event-tags-target-id,
:is(#views-exposed-form-events3-event-selective-view, #views-exposed-form-events3-events) [class*="form-item-field-event-series"],
:is(#views-exposed-form-events3-event-selective-view, #views-exposed-form-events3-events) [class*="form-item-field-event_series"] {
  min-width: 0;
}

:is(#views-exposed-form-events3-event-selective-view, #views-exposed-form-events3-events) #edit-field-event-type-tid,
:is(#views-exposed-form-events3-event-selective-view, #views-exposed-form-events3-events) [id^="edit-field-event-type-tid"],
:is(#views-exposed-form-events3-event-selective-view, #views-exposed-form-events3-events) #edit-field-event-tags-target-id,
:is(#views-exposed-form-events3-event-selective-view, #views-exposed-form-events3-events) [id^="edit-field-event-tags-target-id"],
:is(#views-exposed-form-events3-event-selective-view, #views-exposed-form-events3-events) [id^="edit-field-event-series"],
:is(#views-exposed-form-events3-event-selective-view, #views-exposed-form-events3-events) [id^="edit-field-event_series"] {
  width: 7rem;
  max-width: 7rem;
  min-width: 0;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

:is(#views-exposed-form-events3-event-selective-view, #views-exposed-form-events3-events) .form-item-field-event-type-tid .chosen-container,
:is(#views-exposed-form-events3-event-selective-view, #views-exposed-form-events3-events) .form-item-field-event-tags-target-id .chosen-container,
:is(#views-exposed-form-events3-event-selective-view, #views-exposed-form-events3-events) [class*="form-item-field-event-series"] .chosen-container,
:is(#views-exposed-form-events3-event-selective-view, #views-exposed-form-events3-events) [class*="form-item-field-event_series"] .chosen-container {
  width: 7rem !important;
  max-width: 7rem !important;
}

:is(#views-exposed-form-events3-event-selective-view, #views-exposed-form-events3-events) .form-item-field-event-type-tid .chosen-container .chosen-single,
:is(#views-exposed-form-events3-event-selective-view, #views-exposed-form-events3-events) .form-item-field-event-tags-target-id .chosen-container .chosen-single,
:is(#views-exposed-form-events3-event-selective-view, #views-exposed-form-events3-events) [class*="form-item-field-event-series"] .chosen-container .chosen-single,
:is(#views-exposed-form-events3-event-selective-view, #views-exposed-form-events3-events) [class*="form-item-field-event_series"] .chosen-container .chosen-single {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

:is(#views-exposed-form-events3-event-selective-view, #views-exposed-form-events3-events) .form-item-field-event-type-tid .chosen-container .chosen-drop,
:is(#views-exposed-form-events3-event-selective-view, #views-exposed-form-events3-events) .form-item-field-event-tags-target-id .chosen-container .chosen-drop,
:is(#views-exposed-form-events3-event-selective-view, #views-exposed-form-events3-events) [class*="form-item-field-event-series"] .chosen-container .chosen-drop,
:is(#views-exposed-form-events3-event-selective-view, #views-exposed-form-events3-events) [class*="form-item-field-event_series"] .chosen-container .chosen-drop {
  width: max-content !important;
  min-width: 14rem !important;
}

#views-exposed-form-events3-event-selective-view .events-filters-clear {
  margin-left: auto;
  margin-right: 0.5rem;
  border: 0;
  background: transparent;
  color: #fff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  flex: 0 0 auto;
  transition: opacity 0.2s ease, text-decoration-color 0.2s ease;
  padding: 0;
  font-size: 1.1rem;
  line-height: 1;
  text-transform: lowercase;
  letter-spacing: 0.01em;
  text-decoration: underline;
  text-decoration-color: rgba(255, 255, 255, 0.55);
  text-underline-offset: 0.18em;
}

#views-exposed-form-events3-event-selective-view .events-filters-clear:hover,
#views-exposed-form-events3-event-selective-view .events-filters-clear:focus-visible {
  color: #fff;
  background: transparent !important;
  opacity: 0.88;
  text-decoration-color: #fff;
  outline: 0;
}

@media screen and (max-width: 767.98px) {
  :is(#views-exposed-form-events3-event-selective-view, #views-exposed-form-events3-events) {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 0.625rem;
  }

  :is(#views-exposed-form-events3-event-selective-view, #views-exposed-form-events3-events) .views-exposed-widget,
  #views-exposed-form-events3-event-selective-view #edit-field-event-date-value-2-wrapper,
  #views-exposed-form-events3-event-selective-view #edit-field-event-date-value-1-wrapper,
  #views-exposed-form-events3-event-selective-view [id^="edit-field-event-date-value-2-wrapper"],
  #views-exposed-form-events3-event-selective-view [id^="edit-field-event-date-value-1-wrapper"],
  #views-exposed-form-events3-events #edit-field-event-date-value-2-wrapper,
  #views-exposed-form-events3-events #edit-field-event-date-value-1-wrapper,
  #views-exposed-form-events3-events [id^="edit-field-event-date-value-2-wrapper"],
  #views-exposed-form-events3-events [id^="edit-field-event-date-value-1-wrapper"] {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    justify-content: flex-start;
  }

  #views-exposed-form-events3-event-selective-view #edit-field-event-date-value-2-wrapper,
  #views-exposed-form-events3-event-selective-view #edit-field-event-date-value-1-wrapper,
  #views-exposed-form-events3-event-selective-view [id^="edit-field-event-date-value-2-wrapper"],
  #views-exposed-form-events3-event-selective-view [id^="edit-field-event-date-value-1-wrapper"],
  #views-exposed-form-events3-events #edit-field-event-date-value-2-wrapper,
  #views-exposed-form-events3-events #edit-field-event-date-value-1-wrapper,
  #views-exposed-form-events3-events [id^="edit-field-event-date-value-2-wrapper"],
  #views-exposed-form-events3-events [id^="edit-field-event-date-value-1-wrapper"] {
    padding-left: 0 !important;
  }

  :is(#views-exposed-form-events3-event-selective-view, #views-exposed-form-events3-events) .chosen-container,
  :is(#views-exposed-form-events3-event-selective-view, #views-exposed-form-events3-events) .chosen-container .chosen-single,
  :is(#views-exposed-form-events3-event-selective-view, #views-exposed-form-events3-events) select {
    width: 100% !important;
    max-width: 100% !important;
  }

  #views-exposed-form-events3-event-selective-view .events-filters-clear {
    margin-left: 0;
    align-self: flex-start;
  }
}
