/*!*******************************************************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[1].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[1].use[2]!./node_modules/resolve-url-loader/index.js!./node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[1].use[4]!./resources/styles/src/05-components/agenda-filter/style.scss ***!
  \*******************************************************************************************************************************************************************************************************************************************************************************************************************************/
/**
 * This starter file imports the first two tiers of SCSS for simple use by
 * anything further down the pyramid.
 */
/* Variables */
/*
 * Breakpoints and related settings
 */
/*
 * Color settings
 * 
 * Color names generated via "Name That Color"
 * @link https://chir.ag/projects/name-that-color
 */
/* Universal colors */
/* Theme colors */
/*
 * Font settings
 */
/* Functions */
/* Automatically calculates the clamp values given an minimum and maximum */
/**
 * Pixel to rem function, inspired by Chris Coyier's post on CSS Tricks:
 * https://css-tricks.com/snippets/sass/px-to-em-functions/
 */
/* Strips units from an input */
/* Mixins */
/*
 * Size shorthand
 */
/* Placeholders */
/**
 * Resets basic input styles
 */
/**
 * Resets basic list styles
 */
/**
 * Overlay placeholder, inspired by Chris Coyier's post on CSS Tricks:
 * https://css-tricks.com/snippets/sass/covering-mixin/
 */
/*
 * Theme-specific placeholders
 */
.agenda-filter__dropdowns .agenda-filter__dropdown-list-item {
  font-family: jaf-facitweb, sans-serif;
  font-weight: 400;
}

.agenda-filter__clear-button, .agenda-filter__dropdown-button, .agenda-filter__dropdowns .agenda-filter__dropdown-close, .agenda-filter__print-button, .agenda-filter__wrapper .agenda-filter__container .agenda-filter__container-item {
  font-family: jaf-facitweb, sans-serif;
  font-weight: 600;
}

/* Theme Settings */
.agenda-filter {
  margin: 0 auto;
  padding: 0 1rem;
}
@media screen and (min-width: 992px) {
  .agenda-filter {
    padding: 0 5%;
  }
}

.agenda-filter__clear-button {
  color: #001e62;
  color: var(--color__primary, #001e62);
  cursor: pointer;
  display: none;
  font-size: 1rem;
  line-height: 1.375rem;
  -webkit-box-ordinal-group: 5;
      -ms-flex-order: 4;
          order: 4;
  text-align: center;
  -webkit-text-decoration: underline;
  text-decoration: underline;
}

.agenda-filter__dropdown-button {
  background: #001e62;
  background: var(--color__primary, #001e62);
  border: none;
  border-radius: 5px;
  color: #fff;
  color: var(--color__white, #fff);
  font-size: 1rem;
  height: 40px;
  line-height: 1.375rem;
  position: relative;
  text-align: center;
  text-transform: uppercase;
  -webkit-transition: background 300ms ease-in-out;
  transition: background 300ms ease-in-out;
  width: 100%;
}
@media screen and (min-width: 992px) {
  .agenda-filter__dropdown-button {
    width: 159.6px;
  }
}
.agenda-filter__dropdown-button:hover {
  background: #41b6e6;
  background: var(--color__highlight, #41b6e6);
}

.agenda-filter__dropdowns {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-flow: row wrap;
          flex-flow: row wrap;
  gap: 0.5rem;
  -webkit-box-ordinal-group: 3;
      -ms-flex-order: 2;
          order: 2;
  width: 100%;
}
@media screen and (min-width: 992px) {
  .agenda-filter__dropdowns {
    -webkit-box-ordinal-group: 2;
        -ms-flex-order: 1;
            order: 1;
    width: auto;
  }
}
.agenda-filter__dropdowns .agenda-filter__dropdown {
  position: relative;
  width: 100%;
}
@media screen and (min-width: 992px) {
  .agenda-filter__dropdowns .agenda-filter__dropdown {
    width: auto;
  }
}
.agenda-filter__dropdowns .agenda-filter__dropdown-close {
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  background: transparent;
  border: none;
  color: #000;
  color: var(--color__black, #000);
  cursor: pointer;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-negative: 0;
      flex-shrink: 0;
  font-size: 1.25rem;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
  line-height: 1;
  padding: 0.35rem 0.5rem 0.25rem;
  width: 100%;
}
.agenda-filter__dropdowns .agenda-filter__dropdown-close:hover, .agenda-filter__dropdowns .agenda-filter__dropdown-close:focus-visible {
  color: #001e62;
  color: var(--color__primary, #001e62);
}
.agenda-filter__dropdowns .agenda-filter__dropdown-close:focus-visible {
  outline: 2px solid #001e62;
  outline: 2px solid var(--color__primary, #001e62);
  outline-offset: -2px;
}
.agenda-filter__dropdowns .agenda-filter__dropdown-search {
  background: #fff;
  background: var(--color__white, #fff);
  border: none;
  border-radius: 3px;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  display: block;
  font-family: jaf-facitweb, sans-serif;
  font-weight: 400;
  margin: 0 auto;
  padding: 0.35rem 0.5rem;
  width: 90%;
}
.agenda-filter__dropdowns .agenda-filter__dropdown-search:focus-visible {
  outline: 2px solid #555;
  outline: 2px solid var(--color__gray-5, #555);
  outline-offset: 2px;
}
.agenda-filter__dropdowns .agenda-filter__dropdown-list {
  background: #d9d9d9;
  border-radius: 5px;
  display: none;
  left: 0;
  list-style-type: none;
  margin: 0;
  max-width: none;
  max-width: initial;
  padding: 0;
  position: absolute;
  top: calc(100% + 0.25rem);
  width: 100%;
  z-index: 1;
}
.agenda-filter__dropdowns .agenda-filter__dropdown-list.is-visible {
  display: block;
}
.agenda-filter__dropdowns .agenda-filter__dropdown-list-item {
  background: transparent;
  color: #000;
  color: var(--color__black, #000);
  cursor: pointer;
  font-size: 1rem;
  line-height: 1.375rem;
  margin: 0;
  padding: 0.5rem 1rem;
  -webkit-transition: background 300ms ease-in-out;
  transition: background 300ms ease-in-out;
}
.agenda-filter__dropdowns .agenda-filter__dropdown-list-item:hover {
  background: #aaa;
}

.agenda-filter__dropdown-icon {
  position: absolute;
  right: 0.5rem;
  top: 50%;
  translate: 0 -50%;
}
.agenda-filter__dropdown-icon svg {
  fill: #fff;
  fill: var(--color__white, #fff);
  height: 12px;
  width: 12px;
}

.agenda-filter__print-button {
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  background: #78be20;
  background: var(--color__button, #78be20);
  border: none;
  border-radius: 5px;
  color: #fff;
  color: var(--color__white, #fff);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  font-size: 1rem;
  gap: 0.5rem;
  height: 40px;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  line-height: 1.375rem;
  -webkit-box-ordinal-group: 2;
      -ms-flex-order: 1;
          order: 1;
  position: relative;
  text-align: center;
  text-transform: uppercase;
  -webkit-transition: background 300ms ease-in-out;
  transition: background 300ms ease-in-out;
  width: 100%;
}
@media screen and (min-width: 992px) {
  .agenda-filter__print-button {
    -webkit-box-ordinal-group: 3;
        -ms-flex-order: 2;
            order: 2;
    width: 103px;
  }
}
.agenda-filter__print-button:hover {
  background: #41b6e6;
  background: var(--color__highlight, #41b6e6);
}
.agenda-filter__print-button svg {
  fill: #fff;
  fill: var(--color__white, #fff);
  height: 1.25rem;
  width: 1.25rem;
}

.agenda-filter__wrapper {
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-flow: row wrap;
          flex-flow: row wrap;
  gap: 1rem;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  margin: 0 auto;
  max-width: 76.875rem;
  width: 100%;
}
@media screen and (min-width: 992px) {
  .agenda-filter__wrapper {
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
  }
}
.agenda-filter__wrapper:has(.agenda-filter__container-item) .agenda-filter__clear-button {
  display: block;
}
.agenda-filter__wrapper .agenda-filter__container {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-flow: row wrap;
          flex-flow: row wrap;
  gap: 1rem;
  list-style-type: none;
  margin: 0;
  -webkit-box-ordinal-group: 4;
      -ms-flex-order: 3;
          order: 3;
  padding: 0;
  max-width: none;
  max-width: initial;
  width: 100%;
}
.agenda-filter__wrapper .agenda-filter__container .agenda-filter__container-item {
  border: 1px solid #001e62;
  border: 1px solid var(--color__primary, #001e62);
  border-radius: 5px;
  color: #001e62;
  color: var(--color__primary, #001e62);
  cursor: pointer;
  font-size: 1rem;
  height: 27px;
  line-height: 1.375rem;
  margin: 0;
  padding: 0.125rem 2rem 0.125rem 1rem;
  position: relative;
  text-align: center;
  -webkit-transition: background 300ms ease-in-out, color 300ms ease-in-out;
  transition: background 300ms ease-in-out, color 300ms ease-in-out;
}
.agenda-filter__wrapper .agenda-filter__container .agenda-filter__container-item::after {
  content: "x";
  color: #001e62;
  color: var(--color__primary, #001e62);
  font-size: 0.75rem;
  position: absolute;
  right: 0.5rem;
  top: 50%;
  -webkit-transition: color 300ms ease-in-out;
  transition: color 300ms ease-in-out;
  translate: 0 -50%;
}
.agenda-filter__wrapper .agenda-filter__container .agenda-filter__container-item:hover {
  background: #001e62;
  background: var(--color__primary, #001e62);
  color: #fff;
  color: var(--color__white, #fff);
}
.agenda-filter__wrapper .agenda-filter__container .agenda-filter__container-item:hover::after {
  color: #fff;
  color: var(--color__white, #fff);
}
