/* FAQ ACCORDIONS */

/* Faq Parent animations */

.panel.faq-section a[data-toggle="collapse"] {
  display: block;
  position: relative;
}

.panel.faq-section a[data-toggle="collapse"]:after {
  content: "" !important;
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 24px;
  height: 24px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none' viewBox='0 0 24 24'%3E%3Cpath stroke='%23394d45' stroke-linecap='round' stroke-linejoin='round' stroke-width='2.5' d='M7 10L12 15L17 10'%3E%3C/path%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center;
  transition: transform 150ms;
}

.panel.faq-section a[data-toggle="collapse"][aria-expanded="true"]:after {
  transform: translateY(-50%) rotate(180deg);
}

.accordion-inner h4 div[data-toggle="collapse"]:after {
  content: "" !important;
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 24px;
  height: 24px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none' viewBox='0 0 24 24'%3E%3Cpath stroke='%23394d45' stroke-linecap='round' stroke-linejoin='round' stroke-width='2.5' d='M7 10L12 15L17 10'%3E%3C/path%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center;
  transition: transform 150ms;

  border: 1px solid red;
  display: inline-block !important;
}

.panel.faq-section,
.panel.panel.faq-section h3,
#data-toggle {
  margin: 0;
  text-align: left;
}

#data-toggle {
  padding: 20px 0;
}

/* ACCORDION SECTiON */

#faq-section-accordion {
  .panel {
    border: none;
    border-radius: 0;
    background-color: transparent;
  }

  h3 {
    font-size: 24px;

    a {
      display: block;
      padding: 24px 0;
      color: black;
      text-decoration: none;
      border-bottom: 1px solid #040404;

      &:hover {
        cursor: pointer;
        /* color: var(--bentley-teal-50); */
      }
    }

    a[aria-expanded="true"] {
      color: var(--bentley-living-green-50);
    }
  }

  h4 {
    a {
      color: black;
    }
  }
}

.panel.faq-section a[data-toggle="collapse"][aria-expanded="true"]:after {
  transform: translateY(-50%) rotate(180deg);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none' viewBox='0 0 24 24'%3E%3Cpath stroke='%2357744e' stroke-linecap='round' stroke-linejoin='round' stroke-width='2.5' d='M7 10L12 15L17 10'%3E%3C/path%3E%3C/svg%3E");
}

/* For consistency, also update the accordion-inner element if needed */
.accordion-inner h4 div[data-toggle="collapse"][aria-expanded="true"]:after {
  transform: translateY(-50%) rotate(180deg);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none' viewBox='0 0 24 24'%3E%3Cpath stroke='%2357744e' stroke-linecap='round' stroke-linejoin='round' stroke-width='2.5' d='M7 10L12 15L17 10'%3E%3C/path%3E%3C/svg%3E");
}

#faq-section-accordion .accordion-inner div[aria-expanded="true"] h4 a,
.accordion-inner div[aria-expanded="true"] h4 a {
  color: var(--bentley-living-green-50);
}

/* animation style for faq arrows */
/* #faq-section-accordion i {
  -webkit-transition-duration: 0.25s;
  -moz-transition-duration: 0.25s;
  -o-transition-duration: 0.25s;
  transition-duration: 0.25s;
  -webkit-transition-property: -webkit-transform;
  -moz-transition-property: -moz-transform;
  -o-transition-property: -o-transform;
  transition-property: transform;
}
 */

/* default position for faq section arrows */
/* #faq-section-accordion h3 i {
  float: right;
  margin: 15px;
  color: #ffffff;
} */

/* -------------------------------------------------------- Nested title */
#faq-section-accordion h4 {
  text-align: left;
  color: black;
}

/* override default a:hover for faq questions */
#faq-section-accordion h4 a:hover {
  cursor: pointer;
}
