/* accordion */
.accordion--layout {
  --accordion-title-min-height: 50px;
  --accordion-title-py: var(--sp8);
  --accordion-title-fs: var(--fs-14);
  --accordion-title-clr: var(--clr-blue);
  --accordion-title-hvr-clr: var(--clr-teal-500);
  --accordion-item-separator-clr: var(--clr-blue);
  --accordion-content-py: var(--sp5);
  --accordion-content-px: var(--sp5);
  --accordion-content-bg: var(--clr-blue-gray);
  --option-clr: var(--clr-gray-dark);
  --option-active-clr: var(--clr-teal-500);
  --accordion-default-icon: url(/themes/custom/gff/components/redesign/elements/accordion/img/accordian_plus_icon.svg);
  --accordion-default-icon-hvr: url(/themes/custom/gff/components/redesign/elements/accordion/img/accordian_plus_icon-hvr.svg);
  --accordion-open-state-icon: url(/themes/custom/gff/components/redesign/elements/accordion/img/accordian_minus-icon.svg);
  --accordion-open-state-icon-hvr: url(/themes/custom/gff/components/redesign/elements/accordion/img/accordian_minus-icon-hvr.svg);
  --accordion-icon-opacity: 1;
  --accordion-icon-width: 15px;
  --accordion-icon-height: 15px;
  --accordion-title-cursor: pointer;
}

.accordion--item {
  border-bottom: 1px solid var(--accordion-item-separator-clr);
}

.accordion--item:first-child {
  border-top: 1px solid var(--accordion-item-separator-clr);
}

.accordion--header {
  width: 100%;
  min-height: var(--accordion-title-min-height);
  display: flex;
  align-items: center;
  padding: 17px 0;
}

.accordion--title {
  /* padding: var(--accordion-title-py) 0; */
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  width: 100%;
  font-size: var(--accordion-title-fs);
  line-height: 1.285714285;
  font-weight: var(--fw-bold);
  color: var(--accordion-title-clr);
  transition: padding 0.3s linear 0s;
  cursor: var(--accordion-title-cursor);
}

.accordion--item:has(.selected-option) .accordion--title,
.accordion--item.active .accordion--title,
.accordion--title:hover {
  color: var(--accordion-title-hvr-clr);
}

.accordion--title:after {
  content: "";
  background: var(--accordion-default-icon) no-repeat center center transparent;
  flex-shrink: 0;
  width: var(--accordion-icon-width);
  height: var(--accordion-icon-height);
  opacity: var(--accordion-icon-opacity);
}

.accordion--item:has(.selected-option):not(.active) .accordion--title:after,
.accordion--title:hover:after {
  background-image: var(--accordion-default-icon-hvr);
}

.accordion--item.active .accordion--title:after {
  background-image: var(--accordion-open-state-icon-hvr);
}

/* accordion--body */
.accordion--body {
  overflow: hidden;
  transition: height 0.3s ease, margin 0.3s ease;
}

.accordion-loaded .accordion--body {
  display: none;
}

.accordion--content {
  padding: var(--accordion-content-py) var(--accordion-content-px);
  background: var(--accordion-content-bg);
  border-radius: 5px;
}

.accordion--description {
  font-size: 12px;
  margin-bottom: 10px;
}

.accordion--list {
  max-height: 190px;
}

.accordion--option:not(:last-child) {
  margin-bottom: calc(var(--sp3) - 1px);
}

.accordion--option-field {
  font-size: var(--fs-14);
  line-height: 1.2857142857142858;
  color: var(--option-clr);
  display: block;
}

.accordion--option-field:hover,
.accordion--option-field.selected-option {
  color: var(--option-active-clr);
}

/* if conent scrollable */
.accordion-loaded .scroll-container:not(.scrollable) {
  overflow: hidden;
}

.accordion--content:has(.scrollable) {
  padding-right: 0;
}

.accordion--content:has(.scrollable) .scroll-container {
  padding-right: calc(var(--accordion-content-px) + var(--sp3)) !important;
}

/* active */
.accordion--item.active .accordion--body {
  /* margin-top: calc(-1 * var(--title-vr-p) + var(--sp1)); */
  margin-top: 0;
}

/* info */
.accordion--title .info-inline {
  top: 2px;
}

/* disable accordion minus */
.accordion--item.active .disabled-accordion-toggle {
  --accordion-title-cursor: default;
  --accordion-icon-opacity: 0.5;
}

/* no-accordion-content */
.no-accordion-content .accordion--title:after {
  display: none;
}

.aside-category-inner {
  padding: 10px 0;
}

/* scroll */
.aside-category-inner {
  max-height: 550px;
  overflow: auto;
}

.aside-category-inner.site-scrollbar {
  padding-right: 0;
}

.aside-category-inner:not(.is-scrollable2) {
  --scrollbar-thumb-bg: transparent;
  --scrollbar-track-bg: transparent;
}

.aside-category-inner.is-scrollable {
  width: calc(100% + var(--col-padding));
  padding-right: calc(var(--col-padding) - var(--scrollbar-width));
}