/* mod_dzg_faq - minimal, uses CSS variables for theming */
.dzg-faq{
  --dzg-faq-accent: #060454;
  --dzg-faq-header-bg: #060454;
  --dzg-faq-header-text: #ffffff;
  --dzg-faq-content-bg: #ffffff;
  --dzg-faq-content-text: #1a1a1a;
  --dzg-faq-border: #d0d0d0;
  --dzg-faq-radius: 10px;
  --dzg-faq-gap: 10px;
  box-sizing: border-box;
}

.dzg-faq *{ box-sizing: border-box; }

.dzg-faq-empty{
  padding: 1rem;
  border: 1px dashed var(--dzg-faq-border);
  border-radius: var(--dzg-faq-radius);
}

.dzg-faq-toc{
  margin: 0 0 var(--dzg-faq-gap) 0;
}
.dzg-faq-toc-list{
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-wrap: wrap;
  gap: calc(var(--dzg-faq-gap) * 0.75);
}
.dzg-faq-toc-link{
  display: inline-block;
  padding: .35rem .6rem;
  border-radius: 999px;
  border: 1px solid var(--dzg-faq-border);
  text-decoration: none;
}
.dzg-faq-toc-link:hover{ border-color: var(--dzg-faq-accent); }

.dzg-faq-groups{
  display: flex;
  flex-wrap: wrap;
  gap: var(--dzg-faq-gap);
}

.dzg-faq.cols-1 .dzg-faq-group{ flex: 1 1 100%; }
.dzg-faq.cols-2 .dzg-faq-group{ flex: 1 1 calc(50% - var(--dzg-faq-gap)); }
.dzg-faq.cols-3 .dzg-faq-group{ flex: 1 1 calc(33.333% - var(--dzg-faq-gap)); }

@media (max-width: 900px){
  .dzg-faq.cols-3 .dzg-faq-group{ flex-basis: calc(50% - var(--dzg-faq-gap)); }
}
@media (max-width: 600px){
  .dzg-faq.cols-2 .dzg-faq-group,
  .dzg-faq.cols-3 .dzg-faq-group{ flex-basis: 100%; }
}

.dzg-faq-group-title{
  margin: 0 0 .6rem 0;
  color: var(--dzg-faq-content-text);
}

/* Question list */
.dzg-faq-items{ display: grid; gap: var(--dzg-faq-gap); }

/* Each item is composed of a header bar + (optional) answer card */
.dzg-faq-item{
  border: 0;
  background: transparent;
}


.dzg-faq-q{
  width: 100%;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: .75rem;
  padding: .85rem 1rem;
  border: 0;
  cursor: pointer;
  background: var(--dzg-faq-header-bg);
  color: var(--dzg-faq-header-text);
  font-weight: 600;
  text-align: left;
}

.dzg-faq-q:focus-visible{ outline: 2px solid var(--dzg-faq-accent); outline-offset: 2px; }

.dzg-faq-icon{
  width: 1.25rem;
  height: 1.25rem;
  display: inline-block;
  position: relative;
  flex: 0 0 auto;
}
.dzg-faq-icon::before,
.dzg-faq-icon::after{
  content: "";
  position: absolute;
  inset: 50% auto auto 50%;
  transform: translate(-50%, -50%);
  background: currentColor;
  border-radius: 1px;
}
.dzg-faq-icon::before{ width: 14px; height: 2px; }
.dzg-faq-icon::after{ width: 2px; height: 14px; }

.dzg-faq-q[aria-expanded="true"] .dzg-faq-icon::after{ display: none; }

.dzg-faq-a{
  padding: .9rem 1rem;
  color: var(--dzg-faq-content-text);
  background: var(--dzg-faq-content-bg);
}

/* Theme tweaks */
.dzg-faq.theme-minimal .dzg-faq-item{ border: 0; border-bottom: 1px solid var(--dzg-faq-border); border-radius: 0; }
.dzg-faq.theme-outline .dzg-faq-q{ background: transparent; color: var(--dzg-faq-content-text); }
.dzg-faq.theme-outline .dzg-faq-q{ border-bottom: 1px solid var(--dzg-faq-border); }
.dzg-faq.theme-pill .dzg-faq-item{ border-radius: 999px; }
.dzg-faq.theme-pill .dzg-faq-a{ border-top: 1px solid var(--dzg-faq-border); }

/* v1.0.5 - Accordion behaviour/look aligned with the legacy FAQ page */
.dzg-faq-items{ gap: var(--dzg-faq-gap); }

.dzg-faq-item{
  border: 0;
  background: transparent;
  overflow: visible;
  border-radius: 0;
}

.dzg-faq-q{
  border: 1px solid var(--dzg-faq-border);
  border-radius: var(--dzg-faq-radius);
}

.dzg-faq-q[aria-expanded="true"]{
  background: var(--dzg-faq-accent);
}

.dzg-faq-a{
  margin-top: calc(var(--dzg-faq-gap) * 0.75);
  border: 1px solid var(--dzg-faq-border);
  border-radius: var(--dzg-faq-radius);
  background: var(--dzg-faq-content-bg);
  padding: 1rem;
  position: relative;
}

/* small pointer towards the question bar */
.dzg-faq-a::before{
  content: "";
  position: absolute;
  top: -10px;
  left: 1.6rem;
  border-width: 0 10px 10px 10px;
  border-style: solid;
  border-color: transparent transparent var(--dzg-faq-border) transparent;
}
.dzg-faq-a::after{
  content: "";
  position: absolute;
  top: -9px;
  left: 1.6rem;
  border-width: 0 9px 9px 9px;
  border-style: solid;
  border-color: transparent transparent var(--dzg-faq-content-bg) transparent;
}

/* Avoid long lines overflowing on small screens */
.dzg-faq-qtext{ word-break: break-word; }