/*
Generated time: September 26, 2024 17:27
This file was created by the app developer. Feel free to contact the original developer with any questions. It was minified (compressed) by AVADA. AVADA do NOT own this script.
*/
/* ─── FAQ PAGE ───────────────────────────────────────────── */

.main-faqs {
  background: #fff;
  padding: 40px 0 60px;
}

.main-faqs .faq-title {
  font-family: 'Gabarito', sans-serif;
  font-size: 30px;
  font-weight: 500;
  text-align: center;
  text-transform: uppercase;
  margin-bottom: 24px;
}

/* ─── LAYOUT ─────────────────────────────────────────────── */

.faqs .faqs-outer {
  display: flex;
  gap: 40px;
}

.faqs .faqs-outer .faq-content-leftside {
  max-width: 260px;
  width: 100%;
  flex-shrink: 0;
}

.faq-content-right-side {
  width: 100%;
  min-width: 0;
}

/* ─── LEFT NAV ───────────────────────────────────────────── */

.faq-heading-outer {
  list-style: none;
  background-color: #f0ece8;
  padding: 6px 0;
  margin-top: 8px;
}

.faq-heading-outer li {
  transition: background-color 0.3s ease;
}

.faq-heading-outer .faq-heading-inner:hover,
.faq-heading-outer .faq-heading-inner.active {
  background-color: hsl(45, 33%, 95%);
}

.faq-heading-outer li a {
  display: block;
  padding: 13px 24px;
  text-decoration: none;
}

.faq-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.faq-heading h2 {
  font-family: 'Yantramanav', sans-serif;
  font-size: 14px;
  font-weight: 400;
  line-height: normal;
  color: rgba(0, 0, 0, 0.7);
}

.faq-heading-outer .faq-heading-inner .faq-heading svg { display: none; }
.faq-heading-outer .faq-heading-inner.active svg,
.faq-heading-outer .faq-heading-inner:hover svg   { display: block; }

/* ─── SEARCH ─────────────────────────────────────────────── */

.custom-search-box {
  display: flex;
  align-items: center;
  background-color: #f7f7f7;
  padding: 16px 20px;
  gap: 10px;
}

.custom-search-box svg {
  width: 17px;
  height: 17px;
  min-width: 17px;
  vertical-align: middle;
}

.custom-search-box input {
  width: 100%;
  background: transparent;
  border: none;
  font-family: 'Yantramanav', sans-serif;
  font-size: 15px;
  font-weight: 400;
  color: #000;
}

.custom-search-box input::placeholder { color: rgba(0, 0, 0, 0.55); }
.custom-search-box input:focus-visible { outline: none; box-shadow: none; }

/* ─── RIGHT CONTENT ──────────────────────────────────────── */

.faq-content-right-side .faqs-block-inner {
  background-color: #f7f7f7;
  padding: 14px;
  margin-bottom: 28px;
}

.faq-content-right-side .faqs-heading {
  font-family: 'Romie', serif;
  font-size: 26px;
  font-weight: 300;
  line-height: 1.4;
  color: #000;
  margin-bottom: 12px;
}

/* ─── ACCORDION ──────────────────────────────────────────── */

.faq-accodion-inner {
  background-color: #fff;
  margin-bottom: 8px;
}

.faq-accordion.faq-page-accordion {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 16px 24px;
  cursor: pointer;
}

.faq-sub_title {
  font-family: 'Romie', serif;
  font-size: 17px;
  font-weight: 300;
  line-height: 1.4;
  color: #000;
}

.faq-accordion-icon {
  width: 30px;
  height: 30px;
  min-width: 30px;
  background-color: #f0ece8;
  border: 1px solid rgba(0, 0, 0, 0.1);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
}

.faq-accordion.faq-page-accordion.active .faq-accordion-icon {
  background-color: #fff;
}

.faq-accordion-icon svg {
  vertical-align: middle;
  transition: transform 0.35s ease;
  transform: rotate(180deg);
}

.faq-accordion.faq-page-accordion.active .faq-accordion-icon svg {
  transform: rotate(0deg);
}

/* ─── PANEL ──────────────────────────────────────────────── */

.main-faqs .product-decs-panel {
  display: none;
  overflow: hidden;
  padding: 0 60px 16px 24px;
}

.main-faqs .product-decs-panel p,
.main-faqs .product-decs-panel ul li {
  font-family: 'Yantramanav', sans-serif;
  font-size: 15px;
  font-weight: 400;
  line-height: 26px;
  color: rgba(0, 0, 0, 0.7);
  letter-spacing: 0.3px;
}

.main-faqs .product-decs-panel p  { margin-bottom: 12px; }
.main-faqs .product-decs-panel ul { padding-left: 22px; margin-bottom: 12px; }

/* ─── MOBILE DROPDOWN ────────────────────────────────────── */

.select-menu {
  max-width: 100%;
  margin: 0;
}

.select-menu .select-btn {
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 50px;
  background: #f0ece8;
  padding: 0 18px;
  cursor: pointer;
}

.select-menu .select-btn span,
.select-menu .options .option-text,
.select-menu .options .option-text a {
  font-family: 'Yantramanav', sans-serif;
  font-size: 14px;
  font-weight: 400;
  color: rgba(0, 0, 0, 0.7);
  text-decoration: none;
}

.select-menu .options {
  position: absolute;
  width: 100%;
  max-height: 280px;
  overflow-y: auto;
  margin-top: 6px;
  background: #fff;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.1);
  z-index: 2;
  animation: fadeInUp 0.35s both;
}

.select-menu:not(.active) .options {
  display: none;
}

.select-menu.active .options {
  display: block;
}

.select-menu .options .option {
  display: flex;
  align-items: center;
  padding: 14px 18px;
  cursor: pointer;
  background: #fff;
}

.select-menu .options .option + .option { border-top: 1px solid #efefef; }
.select-menu .options .option:hover      { background: #f0ece8; }

/* ─── ANIMATIONS ─────────────────────────────────────────── */

@keyframes fadeInUp {
  from { transform: translateY(16px); opacity: 0; }
  to   { transform: translateY(0);    opacity: 1; }
}

/* ─── TABLET (750–1024px) ────────────────────────────────── */

@media screen and (min-width: 750px) and (max-width: 1024px) {
  .faqs .faqs-outer { gap: 20px; }
  .faqs .faqs-outer .faq-content-leftside { max-width: 210px; }
  .faq-heading-outer li a { padding: 12px 18px; }
  .faq-accordion.faq-page-accordion { padding: 16px 18px; }
  .main-faqs .product-decs-panel { padding: 0 30px 16px 18px; }
}

/* ─── DESKTOP: hide mobile dropdown ─────────────────────── */

@media screen and (min-width: 750px) {
  .faq-content-leftside .select-menu { display: none; }
}

/* ─── MOBILE (<750px) ────────────────────────────────────── */

@media screen and (max-width: 749px) {
  .main-faqs { padding: 24px 0 40px; }

  .faqs .faqs-outer {
    flex-direction: column;
    gap: 24px;
  }

  .faqs .faqs-outer .faq-content-leftside {
    max-width: 100%;
    position: relative;
  }

  .faq-heading-outer  { display: none; }
  .custom-search-box  { display: none; }

  .main-faqs .faq-title { font-size: 26px; }

  .faq-content-right-side .faqs-heading {
    font-size: 22px;
    margin-bottom: 10px;
  }

  .faq-accordion.faq-page-accordion { padding: 13px 18px; }

  .faq-sub_title {
    font-family: 'Yantramanav', sans-serif;
    font-size: 14px;
    font-weight: 400;
    line-height: 1.5;
    max-width: 85%;
  }

  .main-faqs .product-decs-panel { padding: 0 18px 16px; }

  .main-faqs .product-decs-panel p,
  .main-faqs .product-decs-panel ul li {
    font-size: 14px;
    line-height: 22px;
  }
}