/* أذكار الصباح والمساء (9.21) — partials/adhkar.blade.php لكل قوالب الذكرى. ملف محلي بلا خطوط أو صور خارجية (Amiri Quran من app.css).
   الألوان رموز --az-* تأخذ قيمها من القالب: سكينة (--sk-*)، نور، أثر، وإلا رموز الموقع العامة؛ نصوص صغيرة بتباين AA على الأبيض.
   بلا JavaScript: المجموعتان <details> أصليتان والعدّاد مخفي (hidden). الحركة الوحيدة (سهم الفتح ولون الزر) تتوقف مع prefers-reduced-motion. */

.adhkar {
  --az-ink: var(--olive-deep, #212f29);
  --az-text: var(--ink, #1c1c19);
  --az-muted: var(--muted, #766c5c);
  --az-line: var(--line, #e3ddcd);
  --az-accent: var(--olive, #33443c);
  --az-accent-ink: #ffffff;
  --az-soft: var(--paper-soft, #f6f3ee);
  --az-surface: var(--surface, #ffffff);
  --az-serif: "Amiri Quran", "Amiri", "Noto Naskh Arabic", "Traditional Arabic", serif;
  --az-focus: var(--gold-deep, #8c6a30);
}
.template-noor .adhkar { --az-ink: var(--no-gold-deep); --az-text: var(--no-text); --az-line: var(--no-line); --az-accent: var(--no-green-deep); --az-soft: var(--no-green-soft); --az-focus: var(--no-gold-deep); }
.template-athar .adhkar { --az-ink: var(--at-navy); --az-text: var(--at-text); --az-muted: var(--at-muted); --az-line: var(--at-silver-line); --az-accent: var(--at-navy); --az-soft: var(--at-mist-soft); --az-focus: var(--at-navy); }
.template-sakina .adhkar { --az-ink: var(--sk-primary); --az-text: var(--sk-ink); --az-muted: var(--sk-muted); --az-line: var(--sk-line); --az-accent: var(--sk-primary-2); --az-soft: var(--sk-emerald-soft); --az-surface: var(--sk-white); --az-serif: var(--sk-serif); --az-focus: var(--sk-brass); }

.adhkar [hidden] { display: none !important; }
/* الأزرار تحت .adhkar (0,2,0) لتغلب إعادة ضبط سكينة .template-sakina button (0,1,1). */

/* الغلاف في غير سكينة (سكينة تستعمل sk-sec/sk-sec-head كبقية أقسامها) */
.tpl-mem-adhkar { padding-block: 3rem; }
.adhkar-head { max-width: 40rem; margin: 0 auto 1.75rem; text-align: center; }
.adhkar-head h2 { margin: 0 0 0.4rem; font-family: var(--az-serif); font-weight: 400; font-size: clamp(1.6rem, 5vw, 2.1rem); line-height: 1.6; color: var(--az-ink); }
.adhkar-lede { margin: 0; font-size: 0.95rem; line-height: 1.9; color: var(--az-muted); }
.template-sakina .sk-adhkar { background: var(--sk-canvas); border-top: 1px solid rgba(229, 222, 201, 0.7); }

.adhkar-groups { display: grid; gap: 0.9rem; max-width: 50rem; margin-inline: auto; }
.adhkar-group { background: var(--az-surface); border: 1px solid var(--az-line); border-radius: 1rem; overflow: hidden; }
.adhkar-summary { display: flex; align-items: center; gap: 0.85rem; min-height: 3.75rem; padding: 0.7rem 1rem; cursor: pointer; list-style: none; color: var(--az-text); }
.adhkar-summary::-webkit-details-marker { display: none; }
.adhkar-summary::marker { content: ""; }
.adhkar-summary:focus-visible { outline: 3px solid var(--az-focus); outline-offset: -3px; border-radius: 1rem; }
.adhkar-summary-icon { display: inline-grid; place-items: center; flex: none; width: 2.6rem; height: 2.6rem; border-radius: 999px; background: var(--az-soft); color: var(--az-accent); }
.adhkar-summary-text { display: grid; gap: 0.1rem; flex: 1; min-width: 0; }
.adhkar-summary-title { font-size: 1.1rem; font-weight: 600; line-height: 1.5; color: var(--az-ink); }
.adhkar-summary-meta { font-size: 0.85rem; line-height: 1.6; color: var(--az-muted); }
.adhkar-summary-progress::before { content: " · "; }
.adhkar-chevron { flex: none; width: 0.65rem; height: 0.65rem; margin-inline: 0.35rem; border-right: 2px solid var(--az-muted); border-bottom: 2px solid var(--az-muted); transform: rotate(135deg); } /* physical borders: ⌟ rotated — closed points left (forward in RTL), open points down */
.adhkar-group[open] > .adhkar-summary { border-block-end: 1px solid var(--az-line); }
.adhkar-group[open] > .adhkar-summary .adhkar-chevron { transform: rotate(45deg); }

.adhkar-tools { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 0.5rem 1rem; padding: 0.7rem 1rem; background: var(--az-soft); border-block-end: 1px solid var(--az-line); }
.adhkar-tally { margin: 0; font-size: 0.9rem; font-weight: 600; color: var(--az-ink); }
.adhkar-confirm { display: flex; flex-wrap: wrap; align-items: center; gap: 0.5rem; width: 100%; }
.adhkar-confirm p { margin: 0; flex-basis: 100%; font-size: 0.9rem; color: var(--az-text); }
.adhkar .adhkar-reset, .adhkar .adhkar-confirm-yes, .adhkar .adhkar-confirm-no { min-height: 44px; padding: 0.4rem 1rem; border-radius: 999px; border: 1px solid var(--az-line); background: var(--az-surface); color: var(--az-ink); font: inherit; font-size: 0.9rem; font-weight: 600; text-align: center; cursor: pointer; }
.adhkar .adhkar-confirm-yes { background: var(--az-accent); border-color: var(--az-accent); color: var(--az-accent-ink); }
.adhkar .adhkar-reset[aria-disabled="true"] { color: var(--az-muted); cursor: default; }

.adhkar-list { list-style: none; margin: 0; padding: 0; counter-reset: dhikr; }
.adhkar-item { position: relative; padding: 1.1rem 1rem 1rem; counter-increment: dhikr; }
.adhkar-item + .adhkar-item { border-block-start: 1px solid var(--az-line); }
.adhkar-item::before { content: counter(dhikr, arabic-indic); display: inline-grid; place-items: center; min-width: 1.75rem; height: 1.75rem; margin-block-end: 0.5rem; border: 1px solid var(--az-line); border-radius: 999px; font-size: 0.8rem; color: var(--az-muted); }
.adhkar-text { margin: 0 0 0.85rem; font-family: var(--az-serif); font-size: clamp(1.15rem, 3.6vw, 1.32rem); line-height: 2.2; color: var(--az-text); overflow-wrap: break-word; text-wrap: pretty; }
.adhkar-surah { display: block; font-family: inherit; font-size: 0.85rem; font-weight: 600; line-height: 1.6; color: var(--az-muted); }
.adhkar-ayah-no { color: var(--az-accent); white-space: nowrap; }
.adhkar-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 0.5rem 0.9rem; }
.adhkar-count { margin: 0; font-size: 0.9rem; line-height: 1.6; color: var(--az-muted); }
.adhkar-count strong { color: var(--az-ink); font-weight: 600; }
.adhkar-source { margin: 0; margin-inline-start: auto; font-size: 0.8rem; line-height: 1.6; color: var(--az-muted); }
.adhkar .adhkar-tap { min-height: 44px; min-width: 7.5rem; padding: 0.4rem 1.1rem; border: 1px solid var(--az-accent); border-radius: 999px; background: var(--az-surface); color: var(--az-accent); font: inherit; font-size: 0.95rem; font-weight: 600; text-align: center; cursor: pointer; touch-action: manipulation; }
.adhkar .adhkar-tap:focus-visible, .adhkar .adhkar-reset:focus-visible, .adhkar .adhkar-confirm button:focus-visible { outline: 3px solid var(--az-focus); outline-offset: 2px; }
.adhkar .adhkar-tap[aria-disabled="true"] { background: var(--az-accent); color: var(--az-accent-ink); cursor: default; }
.adhkar-item.is-done .adhkar-text { color: var(--az-muted); }

.adhkar-credit { max-width: 50rem; margin: 1rem auto 0; font-size: 0.8rem; line-height: 1.8; color: var(--az-muted); text-align: center; }

@media (max-width: 420px) {
  .adhkar-summary { gap: 0.6rem; padding-inline: 0.8rem; }
  .adhkar-item { padding-inline: 0.85rem; }
  .adhkar-source { flex-basis: 100%; margin-inline-start: 0; }
}

@media (prefers-reduced-motion: no-preference) {
  .adhkar-chevron { transition: transform 0.2s ease; }
  .adhkar .adhkar-tap { transition: background-color 0.15s ease, color 0.15s ease; }
}