/* ==========================================================================
   FAQ — filterable accordion (widget: aumtm_faq)

   Repeaters cannot be nested, so there is no "group containing questions"
   structure. Each question carries a category name instead and the filter
   buttons are derived by de-duplicating those names: type a new category on one
   question and its button appears; delete the last question using a category
   and the button goes. The editor only ever maintains one flat list.

   Built on <details>/<summary>: keyboard accessible and fully functional with
   no JavaScript. Script is used only to keep one panel open at a time and to
   apply the filter.
   ========================================================================== */

/* ---------- Category filter ---------- */
.aumtm-faq__tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 0.625rem;
  margin-bottom: 2.25rem;
}
.aumtm-faq__tab {
  padding: 0.625rem 1.25rem;
  border: 1px solid var(--aumtm-line);
  border-radius: 999px;
  background: #fff;
  color: var(--aumtm-text);
  font-size: var(--aumtm-fs-xs);
  font-weight: 600;
  letter-spacing: 0.04em;
  cursor: pointer;
  transition: background var(--aumtm-dur) var(--aumtm-ease),
              color var(--aumtm-dur) var(--aumtm-ease),
              border-color var(--aumtm-dur) var(--aumtm-ease);
}
.aumtm-faq__tab:hover { border-color: var(--aumtm-cyan); color: var(--aumtm-blue); }
.aumtm-faq__tab[aria-selected="true"] {
  background: var(--aumtm-blue);
  border-color: var(--aumtm-blue);
  color: #fff;
}

/* ---------- Accordion ---------- */
.aumtm-faq__list { display: grid; gap: 0.875rem; }

/* Filtering is a client-side view of content that is all present in the markup —
   with no JavaScript every question is visible — so it toggles the hidden
   attribute rather than a display class. */
.aumtm-faq__item[hidden] { display: none; }

.aumtm-faq__item {
  background: #fff;
  border: 1px solid var(--aumtm-line);
  border-radius: var(--aumtm-radius);
  transition: border-color var(--aumtm-dur) var(--aumtm-ease),
              box-shadow var(--aumtm-dur) var(--aumtm-ease);
}
.aumtm-faq__item[open] {
  border-color: var(--aumtm-cyan);
  box-shadow: var(--aumtm-shadow);
}

.aumtm-faq__q {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1.5rem;
  padding: 1.25rem 1.5rem;
  cursor: pointer;
  list-style: none;
  font-size: 1.0625rem;
  font-weight: 600;
  color: var(--aumtm-heading);
  line-height: 1.6;
}
.aumtm-faq__q::-webkit-details-marker { display: none; }

.aumtm-faq__icon {
  position: relative;
  flex: none;
  width: 20px;
  height: 20px;
  margin-top: 0.3em;
}
.aumtm-faq__icon::before,
.aumtm-faq__icon::after {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  background: var(--aumtm-blue);
  transform: translate(-50%, -50%);
  transition: transform var(--aumtm-dur) var(--aumtm-ease),
              opacity var(--aumtm-dur) var(--aumtm-ease);
}
.aumtm-faq__icon::before { width: 14px; height: 2px; }
.aumtm-faq__icon::after  { width: 2px; height: 14px; }
.aumtm-faq__item[open] .aumtm-faq__icon::after { opacity: 0; transform: translate(-50%, -50%) rotate(90deg); }

.aumtm-faq__a {
  padding: 0 1.5rem 1.5rem;
  font-size: var(--aumtm-fs-sm);
  line-height: 1.85;
}
.aumtm-faq__a > * + * { margin-top: 0.875rem; }
.aumtm-faq__a::before {
  content: "";
  display: block;
  width: 40px;
  height: 2px;
  margin-bottom: 1.125rem;
  background: var(--aumtm-cyan);
}

/* ---------- Closing panel ---------- */
.aumtm-faq__foot {
  margin-top: 2.5rem;
  padding: 1.75rem;
  background: var(--aumtm-blue-tint);
  border-radius: var(--aumtm-radius);
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 1rem 1.5rem;
}
.aumtm-faq__foot p { font-size: var(--aumtm-fs-sm); }
.aumtm-faq__foot strong { display: block; color: var(--aumtm-heading); font-size: 1.0625rem; margin-bottom: 0.25rem; }