/* Mihrâb — Faz 9 */

/* Ana ekran: bildirim zili */
.zil-btn svg{opacity:.75}
.zil-btn.acik svg{opacity:1;color:#7CF0CF}
.zil-btn:not(.acik) small{color:#F4D58D}
.card.vurgu{animation:kartVurgu 1.6s ease-out}
@keyframes kartVurgu{0%,40%{box-shadow:0 0 0 3px var(--gold)}100%{box-shadow:var(--shadow-sm)}}

/* Okuma hızı */
.hiz-btn{white-space:nowrap}
.mini.hiz-btn.on{background:var(--gold-soft);color:var(--gold);border-color:var(--gold)}

/* Tecvid kuralı açıklaması */
.tj-acik{position:fixed;left:12px;right:12px;bottom:calc(env(safe-area-inset-bottom,0px) + 96px);z-index:70;max-width:560px;margin:0 auto;display:flex;gap:10px;align-items:flex-start;background:var(--surface);color:var(--ink);border:1px solid var(--line);border-radius:16px;padding:12px 12px 12px 16px;box-shadow:0 18px 36px -14px rgba(0,0,0,.45)}
.tj-acik[hidden]{display:none}
.tj-acik b{font-size:1rem}
.tj-acik p{margin:4px 0 0;font-size:.9rem;line-height:1.5;color:var(--muted)}
.tj-acik .mini{flex:none}
.tj{cursor:help}

/* Kur'an öğreniyorum */
.og-ust{display:grid;gap:10px}
.og-ust small{display:block;color:var(--muted);font-size:.86rem;margin-top:2px}
.og-ust .cubuk{margin:0}
.og-liste{list-style:none;padding:0;margin:14px 0;display:grid;gap:8px}
.og-liste button{width:100%;display:grid;grid-template-columns:auto 1fr auto;gap:12px;align-items:center;text-align:left;border:1px solid var(--line);background:var(--surface);border-radius:16px;padding:12px 14px;color:var(--ink);box-shadow:var(--shadow-sm)}
.og-liste button:disabled{opacity:.55}
.og-liste small{display:block;color:var(--muted);font-size:.82rem}
.og-no{width:38px;height:38px;border-radius:12px;display:grid;place-items:center;font:700 1rem var(--font-num);background:color-mix(in srgb,var(--r,var(--accent)) 15%,var(--surface));color:var(--r,var(--accent))}
.og-liste .tamam .og-no{background:var(--r,var(--accent));color:#fff}
.og-durum{font-size:.82rem;font-weight:700;color:var(--r,var(--accent))}
.og-geri{margin-bottom:12px}
.og-ders h3{font-size:1.3rem;margin-bottom:8px}
.og-ders p{line-height:1.7}
.og-ornek{display:grid;grid-template-columns:repeat(auto-fill,minmax(78px,1fr));gap:8px}
.og-ornek button{border:1px solid var(--line);background:var(--surface);border-radius:14px;padding:10px 4px 8px;display:grid;justify-items:center;gap:2px;color:var(--ink)}
.og-ornek button:active{background:color-mix(in srgb,var(--r,var(--accent)) 15%,var(--surface))}
.og-ornek .ar{font-family:var(--font-ar);font-size:2rem;line-height:1.8}
.og-ornek small{color:var(--muted);font-size:.8rem}
.og-alt{margin-top:16px;align-items:center}
.og-buyuk{text-align:center;font-family:var(--font-ar);font-size:3.6rem;line-height:1.7;margin:6px 0}
.og-tarif{font-size:1.05rem;line-height:1.6;text-align:center;margin:14px 0}
.og-tecvid{display:grid;gap:10px}
.og-tecvid p{margin:6px 0 0;line-height:1.55}
.og-tj-ornek{font-family:var(--font-quran,var(--font-ar));font-size:1.6rem;text-align:right}
.og-sureler{display:grid;gap:10px}
.og-sureler .card.tamam{border-color:var(--r,var(--accent))}
.og-giris{width:100%;display:grid;grid-template-columns:auto 1fr auto;gap:14px;align-items:center;text-align:left;margin:10px 0 4px;color:var(--ink)}
.og-giris small{display:block;color:var(--muted);font-size:.86rem}
.og-giris-ic{width:44px;height:44px;border-radius:12px;display:grid;place-items:center;font-family:var(--font-ar);font-size:1.15rem;background:color-mix(in srgb,#0EA5E9 15%,var(--surface));color:#0284C7}
[data-go="ogren"],[data-hizli-git="ogren"],.hizli-liste li:has([data-hizli-cikar="ogren"]),#v-ogren{--r:#0EA5E9}
.hero-bilgi .zil-btn small{color:#F4D58D}
.hero-bilgi .zil-btn.acik small{color:#A9A296}
@media (min-width:721px){.hero-bilgi:has(.zil-btn){grid-template-columns:repeat(4,minmax(0,1fr))}}
@media (max-width:720px){.hero-bilgi:has(.zil-btn) > :first-child{grid-column:auto}}

/* Kurs: yöntem kartı, harf aileleri, kart kart öğrenme */
.og-yontem summary{cursor:pointer;display:grid;gap:2px}
.og-yontem summary small{color:var(--muted);font-size:.84rem}
.og-adim{margin:12px 0 8px;padding-left:20px;display:grid;gap:8px;line-height:1.6}
.og-aile{margin-bottom:12px}
.og-aile .card-title{margin-bottom:6px}
.og-kart{text-align:center}
.og-noktalar{display:inline-flex;gap:3px;flex-wrap:wrap;max-width:55%;justify-content:flex-end}
.og-noktalar i{width:7px;height:7px;border-radius:50%;background:var(--line)}
.og-noktalar i.on{background:var(--r,var(--accent))}
.og-okunus{font:700 2rem var(--font-head);color:var(--r,var(--accent));margin:4px 0 10px}
.og-goster{margin:6px auto 12px;white-space:normal}
.og-kart-alt{justify-content:center;margin-top:8px}

/* Sayaç satırı ve yönetim sayfası */
.sayac-satir{display:flex;flex-wrap:wrap;justify-content:center;gap:6px 18px;margin:18px 0 4px;font-size:.86rem;color:var(--muted)}
.sayac-satir span{display:inline-flex;align-items:center;gap:6px}
.canli-nokta{width:8px;height:8px;border-radius:50%;background:#22C55E;box-shadow:0 0 0 0 rgba(34,197,94,.6);animation:canliNabiz 2s infinite}
@keyframes canliNabiz{70%{box-shadow:0 0 0 7px rgba(34,197,94,0)}100%{box-shadow:0 0 0 0 rgba(34,197,94,0)}}
.yn-ozet{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px}
.yn-ozet .card{display:grid;gap:2px}
.yn-ozet b{font:700 1.8rem var(--font-num)}
.yn-ozet small{color:var(--muted);font-size:.82rem}
.yn-grafik{height:120px}
.yn-bolum{grid-template-columns:120px 1fr 44px}
.ist-cubuk.yn-grafik{display:grid;grid-template-columns:repeat(30,minmax(0,1fr));gap:2px}
.yn-grafik small{visibility:hidden}
.yn-grafik>div:nth-child(5n+1) small,.yn-grafik>div:last-child small{visibility:visible}
.yn-tablo{overflow-x:auto}
.yn-tablo table{width:100%;border-collapse:collapse;font-size:.88rem}
.yn-tablo th,.yn-tablo td{padding:6px 8px;text-align:right;border-bottom:1px solid var(--line)}
.yn-tablo th:first-child,.yn-tablo td:first-child{text-align:left}
.yn-tablo th{color:var(--muted);font-weight:600}