/* ═══════════════════════════════════════════════════════════════════
   FAQ accordion — produkt (.ks-product-faq) i globální stránka (.ks-faq-page).
   Tokeny dodává Design_System (always-on). Vlna 2+: přesun .ks-faq-item do
   design-system components.css a sdílení s .ks-category .ks-faq-* (CategoryPage).
   ═══════════════════════════════════════════════════════════════════ */

.ks-product-faq {
  padding: var(--s-2xl) var(--s-md);
  background: var(--color-grey-light);
  /* Full-bleed: přebije boční okraj šablony single-product v Elementoru,
     bez ohledu na position kontextu nadřazeného kontejneru. */
  width: 100vw;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
}
.ks-product-faq .ks-faq-inner { max-width: 680px; margin: 0 auto; }

.ks-faq-page { max-width: 760px; margin: 0 auto; padding: var(--s-lg) var(--s-md); }

/* ─── Sdílená položka accordionu ─── */
.ks-product-faq .ks-faq-item,
.ks-faq-page .ks-faq-item {
  background: var(--color-bg);
  border-radius: var(--radius-s);
  margin-bottom: var(--s-xs);
  overflow: hidden;
}
.ks-product-faq .ks-faq-item summary,
.ks-faq-page .ks-faq-item summary {
  display: flex; justify-content: space-between; align-items: center; gap: var(--s-sm);
  padding: var(--s-sm) var(--s-md);
  font-family: var(--font-display); font-size: var(--t-md); font-weight: 600;
  letter-spacing: 0.3px; text-transform: uppercase;
  cursor: pointer; list-style: none;
  min-height: var(--min-touch);
}
.ks-product-faq .ks-faq-item summary::-webkit-details-marker,
.ks-faq-page .ks-faq-item summary::-webkit-details-marker { display: none; }
.ks-product-faq .ks-faq-item summary:hover,
.ks-faq-page .ks-faq-item summary:hover { color: var(--color-primary); }
.ks-product-faq .ks-faq-marker,
.ks-faq-page .ks-faq-marker {
  flex: 0 0 auto; color: var(--color-primary); font-weight: 700;
  transition: transform var(--transition-fast);
}
.ks-product-faq .ks-faq-marker::before,
.ks-faq-page .ks-faq-marker::before { content: '+'; font-size: var(--t-lg); }
.ks-product-faq .ks-faq-item[open] .ks-faq-marker,
.ks-faq-page .ks-faq-item[open] .ks-faq-marker { transform: rotate(45deg); }
.ks-product-faq .ks-faq-answer,
.ks-faq-page .ks-faq-answer { padding: 0 var(--s-md) var(--s-sm); }
.ks-product-faq .ks-faq-answer p,
.ks-faq-page .ks-faq-answer p {
  font-size: var(--t-sm); line-height: 1.7; color: var(--color-grey-accent); margin: 0 0 var(--s-xs);
}
.ks-product-faq .ks-faq-answer a,
.ks-faq-page .ks-faq-answer a { color: var(--color-primary); text-decoration: underline; }
.ks-product-faq .ks-faq-answer ul,
.ks-product-faq .ks-faq-answer ol,
.ks-faq-page .ks-faq-answer ul,
.ks-faq-page .ks-faq-answer ol { margin: 0 0 var(--s-xs) var(--s-md); }
.ks-product-faq .ks-faq-answer li,
.ks-faq-page .ks-faq-answer li { font-size: var(--t-sm); line-height: 1.7; color: var(--color-grey-accent); }

/* ─── Globální stránka: vyhledávání + sekce ─── */
.ks-faq-search { margin-bottom: var(--s-lg); }
.ks-faq-search-input {
  width: 100%;
  padding: var(--s-sm) var(--s-md);
  font-size: var(--t-md);
  border: 1px solid var(--color-grey-light);
  border-radius: var(--radius-s);
  background: var(--color-bg);
}
.ks-faq-search-input:focus { outline: 2px solid var(--color-primary); outline-offset: 1px; }
.ks-faq-empty { margin: var(--s-sm) 0 0; color: var(--color-grey-accent); font-size: var(--t-sm); }

.ks-faq-group { margin-bottom: var(--s-xl); }
.ks-faq-group[hidden] { display: none; }
.ks-faq-group-title { margin: 0 0 var(--s-sm); }
.ks-faq-page .ks-faq-item[hidden] { display: none; }
.ks-faq-page .ks-faq-item:target { box-shadow: 0 0 0 2px var(--color-primary); }
