/* ==========================================================================
   mtemps7 — FAQ (faq)
   بحث عريض في النص + تصنيفات نصية بخط كهرماني ← أسئلة على عمودين بخطوط شعرة
   (رقم + سؤال + زرار + بيتقلب ×، والإجابة grid-template-rows 0fr → 1fr) ← شريط مساعدة كحلي.
   ========================================================================== */
.mtemps7-faq-tools { display: grid; justify-items: center; gap: var(--mtemps7-sp-4); max-width: 46rem; margin: 0 auto var(--mtemps7-sp-7); }
.mtemps7-faq-search { width: 100%; }
.mtemps7-faq-search .mtemps7-ui-input { min-height: 3.75rem; border-radius: var(--mtemps7-r-pill); background: var(--mtemps7-bg); font-size: var(--mtemps7-fs-md); padding-inline-start: 3rem; }
.mtemps7-faq-search i { inset-inline-start: 1.25rem; color: var(--mtemps7-primary); }
.mtemps7-faq-cats { display: flex; flex-wrap: wrap; justify-content: center; gap: var(--mtemps7-sp-1) var(--mtemps7-sp-2); }
.mtemps7-faq-cat { position: relative; min-height: var(--mtemps7-tap); padding: 0 var(--mtemps7-sp-3); color: var(--mtemps7-muted); font-size: var(--mtemps7-fs-sm); font-weight: var(--mtemps7-fw-bold); transition: color var(--mtemps7-dur-2); }
.mtemps7-faq-cat::after { content: ""; position: absolute; inset-inline: var(--mtemps7-sp-3); inset-block-end: 0.35rem; height: 2px; background: var(--mtemps7-accent); transform: scaleX(0); transition: transform var(--mtemps7-dur-3) var(--mtemps7-ease-film); }
.mtemps7-faq-cat:hover { color: var(--mtemps7-text); }
.mtemps7-faq-cat[aria-pressed="true"] { color: var(--mtemps7-text); }
.mtemps7-faq-cat[aria-pressed="true"]::after { transform: scaleX(1); }

.mtemps7-faq-list { display: grid; align-items: start; column-gap: var(--mtemps7-sp-7); border-block-start: var(--mtemps7-hair) solid var(--mtemps7-line-2); }
@media (min-width: 960px) { .mtemps7-faq-list { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.mtemps7-faq-item { position: relative; border-block-end: var(--mtemps7-hair) solid var(--mtemps7-line-2); }
.mtemps7-faq-item::after { content: ""; position: absolute; inset-block-end: -1px; inset-inline: 0; height: 1px; background: var(--mtemps7-deep); transform: scaleX(0); transform-origin: var(--mtemps7-x-start); transition: transform var(--mtemps7-dur-4) var(--mtemps7-ease-film); }
.mtemps7-faq-item.mtemps7-is-open::after { transform: scaleX(1); }
.mtemps7-faq-item h3 { font-size: inherit; }
.mtemps7-faq-q { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: var(--mtemps7-sp-4); width: 100%; min-height: 4.5rem; padding-block: var(--mtemps7-sp-4); color: var(--mtemps7-text); font-size: var(--mtemps7-fs-md); font-weight: var(--mtemps7-fw-bold); line-height: 1.5; text-align: start; }
.mtemps7-faq-num { color: var(--mtemps7-muted); font-size: var(--mtemps7-fs-xs); font-variant-numeric: tabular-nums; transition: color var(--mtemps7-dur-2); }
.mtemps7-faq-item.mtemps7-is-open .mtemps7-faq-num, .mtemps7-faq-q:hover .mtemps7-faq-num { color: var(--mtemps7-primary); }
.mtemps7-faq-icon { position: relative; display: grid; place-items: center; width: 2.25rem; height: 2.25rem; border: var(--mtemps7-hair) solid var(--mtemps7-line-2); border-radius: 50%; transition: transform var(--mtemps7-dur-3) var(--mtemps7-ease-out), background-color var(--mtemps7-dur-2), border-color var(--mtemps7-dur-2); }
.mtemps7-faq-icon::before, .mtemps7-faq-icon::after { content: ""; position: absolute; width: 0.75rem; height: 1.5px; border-radius: 1px; background: currentColor; }
.mtemps7-faq-icon::after { transform: rotate(90deg); }
.mtemps7-faq-q:hover .mtemps7-faq-icon { border-color: var(--mtemps7-deep); }
.mtemps7-faq-item.mtemps7-is-open .mtemps7-faq-icon { border-color: var(--mtemps7-accent); background: var(--mtemps7-accent); color: var(--mtemps7-on-accent); transform: rotate(135deg); }
.mtemps7-faq-a { display: grid; grid-template-rows: 0fr; transition: grid-template-rows var(--mtemps7-dur-3) var(--mtemps7-ease-out); }
.mtemps7-faq-item.mtemps7-is-open .mtemps7-faq-a { grid-template-rows: 1fr; }
.mtemps7-faq-a > div { min-height: 0; overflow: hidden; }
.mtemps7-faq-a p { padding-block-end: var(--mtemps7-sp-5); padding-inline: calc(1.5rem + var(--mtemps7-sp-4)) calc(2.25rem + var(--mtemps7-sp-4)); color: var(--mtemps7-muted); }
.mtemps7-faq-empty { padding: var(--mtemps7-sp-6); color: var(--mtemps7-muted); text-align: center; }

/* شريط المساعدة */
.mtemps7-faq-help { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: center; gap: var(--mtemps7-sp-4); margin-block-start: var(--mtemps7-sp-7); padding: var(--mtemps7-sp-5) var(--mtemps7-pad-card); border-radius: var(--mtemps7-r-lg); background: var(--mtemps7-deep); color: var(--mtemps7-on-deep); }
.mtemps7-faq-help-ico { display: grid; place-items: center; width: 3.25rem; height: 3.25rem; border-radius: 50%; background: var(--mtemps7-accent); color: var(--mtemps7-on-accent); font-size: 1.2rem; }
.mtemps7-faq-help-title { font-size: var(--mtemps7-fs-lg); font-weight: var(--mtemps7-fw-bold); }
.mtemps7-faq-help-text { color: var(--mtemps7-on-deep-muted); font-size: var(--mtemps7-fs-sm); }
.mtemps7-faq-help .mtemps7-ui-btn { grid-column: 1 / -1; --mtemps7-btn-hover-bg: var(--mtemps7-whatsapp-2); }
@media (min-width: 640px) { .mtemps7-faq-help { grid-template-columns: auto minmax(0, 1fr) auto; } .mtemps7-faq-help .mtemps7-ui-btn { grid-column: auto; } }
