/* ============================================================
   VioStore — Hỏi đáp sản phẩm
   Dùng lại biến của theme (--line, --fg, --brand…). Theme khác không khai
   những biến này thì các giá trị dự phòng sau dấu phẩy đỡ lấy.
   ============================================================ */

.vio-faq-ds{
  display:flex;
  flex-direction:column;
  gap:8px;
  margin-top:12px;
}

.vio-faq-item{
  border:1.5px solid var(--line,#E7E9EE);
  border-radius:var(--r,12px);
  background:var(--card,#fff);
  overflow:hidden;
}

.vio-faq-item[open]{
  border-color:var(--brand,#FFD400);
  background:var(--brand-soft,#FFF8DB);
}

.vio-faq-item>summary{
  /* `list-style:none` + `::-webkit-details-marker` — bỏ tam giác mặc định ở cả
     Firefox lẫn Safari; mũi tên riêng nằm trong <svg> để xoay được. */
  list-style:none;
  display:flex;
  align-items:center;
  gap:12px;
  padding:14px 16px;
  cursor:pointer;
  font-weight:650;
  font-size:15px;
  line-height:1.45;
  color:var(--fg,#0E1116);
  /* Ngón tay chạm phải có ô đủ lớn — 44px là ngưỡng tối thiểu. */
  min-height:44px;
}

.vio-faq-item>summary::-webkit-details-marker{display:none}

.vio-faq-item>summary:hover{color:var(--price-text,#C2151F)}

.vio-faq-item>summary:focus-visible{
  outline:2px solid var(--brand,#FFD400);
  outline-offset:-2px;
}

.vio-faq-q{flex:1}

.vio-faq-ic{
  flex:none;
  color:var(--fg-3,#646E7E);
  transition:transform .18s ease;
}

.vio-faq-item[open]>summary .vio-faq-ic{transform:rotate(180deg)}

.vio-faq-a{
  padding:0 16px 14px;
  color:var(--fg-2,#4B5563);
  font-size:14.5px;
  line-height:1.65;
}

.vio-faq-a p{margin:0 0 8px}
.vio-faq-a p:last-child{margin-bottom:0}

@media (max-width:640px){
  .vio-faq-item>summary{padding:12px 13px;font-size:14.5px;gap:10px}
  .vio-faq-a{padding:0 13px 12px;font-size:14px}
}
