.view-abb-newsroom.view-display-id-overview {
  position: relative;
}

  .view-abb-newsroom.view-display-id-overview .view-filters {
    display: flex;
    flex-direction: column;
    max-width: min(calc(var(--dxp-layout-content-max-width)), 27.1875rem);
    border: 0.0625rem solid rgba(0, 0, 0, 0.15);
    border-radius: 1.5rem;
    background: #F6F7FA;
    box-shadow: 0 1.5rem 2rem 0 rgba(0, 0, 0, 0.15);
  }

  @media all and (width >= 768px) {

  .view-abb-newsroom.view-display-id-overview .view-filters {
      max-width: unset
  }
    }

  .view-abb-newsroom.view-display-id-overview .form--inline {
    padding: 2rem;
  }

  .view-abb-newsroom.view-display-id-overview fieldset.form-item {
    display: flex;
    float: none !important;
    flex-direction: column;
    width: 100%;
    margin: 0 0 1rem 0;
    border-bottom: 0.0625rem solid var(--color-border);
    gap: 1rem;
    padding-block: 1.25rem 1.5rem;
  }

  .view-abb-newsroom.view-display-id-overview fieldset.form-item:last-of-type {
      border-bottom: none;
    }

  .view-abb-newsroom.view-display-id-overview fieldset.form-item label {
      font: var(--dxp-font-body-secondary);
    }

  .view-abb-newsroom.view-display-id-overview fieldset.form-item legend {
      letter-spacing: var(--abb-letter-spacing-label-medium);
      font: var(--abb-font-label-medium);
    }

  .view-abb-newsroom.view-display-id-overview .form-actions {
    display: flex;
    flex-direction: row-reverse;
    justify-content: space-between;
    margin: 0;
  }

  /* Overriding reset button styles from here */

  .view-abb-newsroom.view-display-id-overview .form-actions .dxp-button[name="reset"] {
        min-height: unset;
        margin: 0;
        padding: 0;
        text-decoration: underline;
        color: var(--dxp-color-foreground-secondary);
        border-radius: none;
        background: none;
        font: var(--abb-body-s);
        text-underline-offset: 0.5rem;
      }

  .view-abb-newsroom.view-display-id-overview .form-actions .dxp-button[name="reset"] .dxp-icon {
          display: none;
        }

  /* Reset and Apply button use the same template */

  .view-abb-newsroom.view-display-id-overview .form-actions .dxp-button:not([name="reset"]) {
        --button-padding-vertical: 0.6875rem;
        --button-padding-horizontal: 1rem;

        width: 7.6875rem;
        min-height: unset;
        font: var(--abb-font-label-small);
      }

  .view-abb-newsroom.view-display-id-overview .form-actions .dxp-button:not([name="reset"]) .dxp-icon {
          display: none;
        }

  /* @todo This is just to get a visual feedback because of the design specification. */

  .view-abb-newsroom.view-display-id-overview .views-exposed-form {
    width: auto;
  }

  @media all and (width >= 768px) {

  .view-abb-newsroom.view-display-id-overview .views-exposed-form {
      width: 27.1875rem
  }
    }

  .view-abb-newsroom.view-display-id-overview .dxp-button-toggle-filters {
    --button-filled-background-color: var(--abb-color-surface-secondary);
    --button-filled-label-color: var(--dxp-color-foreground-tertiary);
    --button-padding-vertical: 0.90625rem;
    --button-padding-horizontal: 2rem;

    display: flex;
    justify-content: space-between;
    width: 12.5rem;
    min-height: unset;
    margin-bottom: 2rem;
    margin-left: auto;
    border: thin solid var(--color-border);
    font: var(--abb-body-s);
  }

  @media all and (width >= 768px) {

  .view-abb-newsroom.view-display-id-overview .dxp-button-toggle-filters {
      margin-bottom: 3.5rem
  }
    }

  .view-abb-newsroom.view-display-id-overview .dxp-button-toggle-filters .dxp-button__label {
      padding: 0
    }

  .view-abb-newsroom.view-display-id-overview .dxp-button-toggle-filters .dxp-button__icon:last-child {
        margin: 0;
        margin-block: 0;
      }

  .view-abb-newsroom.view-display-id-overview .dxp-button-toggle-filters .dxp-button__icon .dxp-icon {
        --icon-color: var(--dxp-color-foreground-primary);
        --icon-size: 1.25rem;
      }

  .view-abb-newsroom.view-display-id-overview .view-filters {
    position: absolute;
    z-index: 10;
    top: 0;
    right: 0;
  }

  .view-abb-newsroom.view-display-id-overview .view-filters.hidden {
      display: none;
    }

  .view-abb-newsroom.view-display-id-overview .view-filters__title {
      display: flex;
      justify-content: space-between;
      padding: 1rem 2rem;
      cursor: pointer;
      border-bottom: 0.0625rem solid var(--color-border);
    }

  .view-abb-newsroom.view-display-id-overview .view-filters__title span {
        font: var(--abb-body-s);
      }

  .view-abb-newsroom.view-display-id-overview .view-filters__title .dxp-icon {
        margin: 0;
      }

.abb--bef-links, .abb--bef-checkboxes {
  display: flex;
  flex-wrap: wrap;
  margin: 0;
  padding: 0;
  list-style: none;
  gap: 0.5rem;
}

.abb--bef-links li, .abb--bef-checkboxes li {
    margin: 0;
    padding: 0;
  }

.abb--bef-links .form-item, .abb--bef-checkboxes .form-item {
    margin: 0;
  }

.abb--bef-links .badge, .abb--bef-checkboxes .badge {
    cursor: pointer;
  }

.abb--bef-links .form-checkbox, .abb--bef-links .form-radio, .abb--bef-checkboxes .form-checkbox, .abb--bef-checkboxes .form-radio {
    display: none;
  }

.abb--bef-links .bef-link--selected .badge, .abb--bef-links .form-checkbox:checked ~ label .badge, .abb--bef-links .form-radio:checked ~ label .badge, .abb--bef-checkboxes .bef-link--selected .badge, .abb--bef-checkboxes .form-checkbox:checked ~ label .badge, .abb--bef-checkboxes .form-radio:checked ~ label .badge {
    color: #fff;
    background: var(--dxp-color-brand-primary);
  }

.abb--bef-links .bef-link:not(.bef-link--selected):hover .badge, .abb--bef-checkboxes .bef-link:not(.bef-link--selected):hover .badge {
    background: var(--abb-color-scale-400);
  }