/*!*************************************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./frontend/node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[1].use[1]!./frontend/node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[1].use[2]!./frontend/node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[1].use[3]!./web/app/themes/parent/components/sidebar/src/sidebar.scss ***!
  \*************************************************************************************************************************************************************************************************************************************************************************************************************/
@import url(https://fonts.googleapis.com/css2?family=Lexend+Deca:wght@100..900&display=swap);
/*!*****************************************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./frontend/node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[1].use[1]!./frontend/node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[1].use[2]!./frontend/node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[1].use[3]!./web/app/themes/parent/components/sidebar/src/sidebar.scss (1) ***!
  \*****************************************************************************************************************************************************************************************************************************************************************************************************************/
.twz-sidebar {
  --close-size: 3rem;
  --text-color: var(--text-color-dark);
  position: fixed;
  top: 0;
  right: 0;
  height: 100%;
  background-color: var(--white);
  z-index: 510;
  translate: 100% 0;
  pointer-events: none;
  transition: translate 0.3s 0.1s ease-in-out;
  max-width: 70rem;
  min-width: 30rem;
  width: -moz-min-content;
  width: min-content;
}
@media (max-width: 767px) {
  .twz-sidebar {
    width: 90%;
    min-width: unset;
  }
}
.sidebar--is-expanded .twz-sidebar {
  translate: 0 0;
  pointer-events: auto;
}
.twz-sidebar__close {
  position: absolute;
  top: 2rem;
  right: 2rem;
  width: var(--close-size);
  height: var(--close-size);
  background-color: var(--sidebar-close-bg, var(--grey-200));
  padding: 0.5rem;
  cursor: pointer;
  z-index: 2;
}
.twz-sidebar__close:hover {
  --sidebar-close-bg: var(--blue-800);
  --sidebar-close-color: var(--white);
}
.twz-sidebar__close svg {
  width: 100%;
  height: 100%;
}
.twz-sidebar__close svg path,
.twz-sidebar__close svg polygon {
  fill: var(--sidebar-close-color, var(--text-color-dark));
}
.twz-sidebar .twz-sidebar__content {
  position: relative;
  display: flex;
  flex-direction: column;
  max-height: 100%;
  padding: 2.5rem 3.5rem 2.5rem 2.5rem;
  overflow-y: auto;
}
.twz-sidebar .twz-sidebar__content.is--loading {
  opacity: 0.5;
  pointer-events: none;
}
.twz-sidebar .twz-sidebar__content__title {
  margin-right: var(--close-size);
}
.twz-sidebar .twz-sidebar__content__body {
  margin-top: 2rem;
  color: var(--text-color);
}

.twz-tooltip-content {
  display: none;
}
