/* ¯¯¯¯¯¯¯¯¯ *\
  FILTER
\* ˍˍˍˍˍˍˍˍˍ */
.fr-filter {
  position: relative;
  margin: 0 -0.5rem 1rem -0.5rem;
}

.fr-filter::before {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
}

.fr-filter__title {
  margin: 0;
  display: block;
  font-size: unset;
  line-height: unset;
  padding: 0 0.5rem 0 0.5rem;
  margin-bottom: 1rem;
}

.fr-filter:focus-within {
  z-index: 1;
}

.fr-filter__btn {
  --text-spacing: 0;
  --title-spacing: 0;
  display: inline-flex;
  flex-direction: row;
  align-items: center;
  width: -moz-fit-content;
  width: fit-content;
  font-weight: 500;
  font-size: 0.875rem;
  line-height: 1.5rem;
  min-height: 2.5rem;
  padding: 0.5rem 0.75rem;
  overflow: initial;
  max-width: 100%;
  max-height: none;
  width: fit-content;
  text-align: left;
  margin: 0;
  color: var(--text-action-high-blue-france);
}

.fr-filter__btn::before,
.fr-filter__btn::after {
  display: block;
}

.fr-filter__btn::after {
  --icon-size: 1rem;
  margin-right: -0.125rem;
  margin-left: 1rem;
  flex: 0 0 auto;
  display: inline-block;
  vertical-align: calc((0.75em - var(--icon-size)) * 0.5);
  background-color: currentColor;
  width: var(--icon-size);
  height: var(--icon-size);
  -webkit-mask-size: 100% 100%;
  mask-size: 100% 100%;
  -webkit-mask-image: url("../../dsfr-v1.14.3/dist/icons/arrows/arrow-down-s-line.svg");
  mask-image: url("../../dsfr-v1.14.3/dist/icons/arrows/arrow-down-s-line.svg");
  content: "";
  transition: transform 0.3s;
}

.fr-filter-reset__btn {
  --text-spacing: 0;
  --title-spacing: 0;
  display: inline-flex;
  flex-direction: row;
  align-items: center;
  width: -moz-fit-content;
  width: fit-content;
  font-weight: 500;
  font-size: 0.875rem;
  line-height: 1.5rem;
  min-height: 2.5rem;
  padding: 0.5rem 0.75rem;
  overflow: initial;
  max-width: 100%;
  max-height: none;
  width: fit-content;
  text-align: left;
  margin: 0;
  color: var(--text-action-high-blue-france);
}

.fr-filter--enlarge__btn {
  --text-spacing: 0;
  --title-spacing: 0;
  display: inline-flex;
  flex-direction: row;
  align-items: center;
  width: -moz-fit-content;
  width: fit-content;
  font-weight: 500;
  font-size: 1rem;
  line-height: 1.5rem;
  min-height: 3rem;
  padding: 0.75rem 1rem;
  overflow: initial;
  max-width: 100%;
  max-height: none;
  width: 100%;
  text-align: left;
  margin: 0;
  color: var(--text-action-high-blue-france);
}

.fr-filter--enlarge__btn::after {
  --icon-size: 1rem;
  margin-right: -0.125rem;
  margin-left: 1rem;
  flex: 0 0 auto;
  display: inline-block;
  vertical-align: calc((0.75em - var(--icon-size)) * 0.5);
  background-color: currentColor;
  width: var(--icon-size);
  height: var(--icon-size);
  -webkit-mask-size: 100% 100%;
  mask-size: 100% 100%;
  -webkit-mask-image: url("../../dsfr-v1.14.3/dist/icons/arrows/arrow-down-s-line.svg");
  mask-image: url("../../dsfr-v1.14.3/dist/icons/arrows/arrow-down-s-line.svg");
  content: "";
  transition: transform 0.3s;
  margin-right: 0;
  margin-left: auto;
}

.fr-filter__btn::before {
  content: none;
}

.fr-filter__btn[aria-expanded=true]::after {
  transform: rotate(-180deg);
}

.fr-filter__btn.fr-filter-actived,
.fr-filter-actived .fr-filter__btn {
  background-color: var(--light-decisions-background-background-transparent-active, rgba(0, 0, 0, 0.08));
}

/* .fr-filter__btn.fr-filter-actived::after,
.fr-filter-actived .fr-filter__btn::after {
  content: "(1)";
  display: inline-flex;
  align-items: center;
  line-height: 1rem;
  width: auto;
  min-width: 1rem;
  padding-right: 1.25rem;
  margin-left: 0.5rem;
  margin-right: 0;
  background-color: transparent;
  background-image: url("../../dsfr-v1.14.3/dist/icons/arrows/arrow-down-s-line.svg");
  background-repeat: no-repeat;
  background-position: right center;
  background-size: 1rem 1rem;
  -webkit-mask-image: none;
  mask-image: none;
} */

/* .fr-filter__btn.fr-filter-actived[aria-expanded=true]::after,
.fr-filter-actived .fr-filter__btn[aria-expanded=true]::after {
  transform: none;
} */

.fr-filter__collapse {
    padding-left: 0.75rem;
    display: flex;
    flex-direction: column;
    position: relative;
    margin: 0 0.5rem 0 0.5rem;
    background-color: var(--background-default-grey);

    --idle: transparent;
    --hover: var(--background-default-grey-hover);
    --active: var(--background-default-grey-active);
    background-size: 100% 1px, 1px 100%, 1px 100%, 100% 1px;
    background-repeat: no-repeat, no-repeat, no-repeat, no-repeat;
    background-position: 100% 100%, 0 0, 100% 0, 100% 0;
    padding: 1px;
    background-image: linear-gradient(0deg, var(--border-default-grey), var(--border-default-grey)), linear-gradient(0deg, var(--border-default-grey), var(--border-default-grey)), linear-gradient(0deg, var(--border-default-grey), var(--border-default-grey)), linear-gradient(0deg, var(--border-default-grey), var(--border-default-grey));

}

.fr-filter .fr-collapse {
  --ul-type: disc;
  --ol-type: decimal;
  --ul-start: 1rem;
  --ol-start: 1.5rem;
  --xl-block: 0.5rem;
  --li-bottom: 0.25rem;
  --xl-base: 1em;
  --ol-content: counters(li-counter, ".") ".  ";
  transition: visibility 0.3s, padding 0.3s;
}

.fr-filter .fr-collapse--expanded {
  padding-top: 1rem;
  margin-bottom: 1.5rem;
}

.fr-filters-group {
  --ul-type: none;
  --ol-type: none;
  --ul-start: 0;
  --ol-start: 0;
  --xl-block: 0;
  --li-bottom: 0;
  --ol-content: none;

  width: auto;
  max-width: 100%;

  display: flex;
  flex-wrap: wrap;
  column-gap: 1rem !important;
}

.fr-filters-group .fr-filter {
  display: contents;
}

.fr-filters-group .fr-filter__title {
  order: 1;
  flex: 0 0 auto;
  padding: 0;
}

.fr-filters-group .fr-filter__collapse {
  order: 2;
  flex: 0 0 100%;
  margin-left: 0;
}

.fr-filter__btn[aria-expanded=true] {
  background-color: var(--background-open-blue-france);

  --idle: transparent;
  --hover: var(--background-open-blue-france-hover);
  --active: var(--background-open-blue-france-active);
}

@media (min-width: 36em) {
    /*! media md */
    .fr-filter .fr-collapse {
      padding-left: 1rem;
      padding-right: 1rem;
    }
}

@media (-ms-high-contrast: active), (forced-colors: active) {
    .fr-filter__btn::after {
      forced-color-adjust: none;
      background-color: buttontext;
    }

    .fr-filter {
      border-top: 1px solid;
      border-bottom: 1px solid;
    }

    .fr-filter + .fr-filter {
      border-top: none;
    }
}

@media (prefers-reduced-motion: reduce) {
    .fr-collapse {
      transition: none;
    }

    .fr-collapse::before {
      transition: none;
    }

    .fr-filter__btn::after {
      transition: none;
    }

    .fr-filter .fr-collapse {
      transition: none;
    }
}

@media screen and (min-width: 0\0) and (min-resolution: 72dpi) {
    /**
    * Reset liste à puce
    */
    .fr-filters-group ul {
      list-style-type: none;
    }

    .fr-filters-group ol {
      list-style-type: none;
    }

    .fr-filters-group ul,
    .fr-filters-group ol {
      padding-left: 0;
      margin-top: 0;
      margin-bottom: 0;
    }

    .fr-filter__btn::before,
    .fr-filter__btn::after {
      background-color: transparent;
      background-size: 100%;
      background-repeat: no-repeat;
      background-image: url("../../dsfr-v1.14.3/dist/icons/arrows/arrow-down-s-line.svg");
      width: 1rem;
      height: 1rem;
    }

    .fr-filter__btn[aria-expanded=true]::after {
      transform: rotate(-180deg);
    }

    .fr-filter::before {
      box-shadow: inset 0 1px 0 0 #ddd, 0 1px 0 0 #ddd;
    }

    .fr-filter__btn {
      color: #000091;
    }

    .fr-filter__btn[aria-expanded=true] {
      background-color: #e3e3fd;
    }
}


@media print {
    .fr-filter {
      box-shadow: inset 0 0 0 1px var(--border-default-grey);
    }

    .fr-filter::before {
      box-shadow: none;
    }

    .fr-filter__btn {
      box-shadow: inset 0 0 0 1px var(--border-default-grey);
      page-break-after: avoid;
    }

    .fr-filter__btn::after {
      -webkit-print-color-adjust: exact;
      print-color-adjust: exact;
      transform: rotate(-180deg);
    }

    .fr-filter .fr-collapse {
      --collapse-max-height: none !important;
      --collapse: inherit !important;
      visibility: visible;
      padding: 1rem;
    }
}