/* kazanim.css — kazanımlar, ustalık döngüsü ve analitik (kazanim.js).
   Renkler stil.css'teki palet değişkenlerinden; koyu tema oradan gelir.
   Hoca paneli de bu dosyayı yükler (matris, karışıklık tablosu). */

/* Soru ekranındaki şerit: "Şu kazanımı birlikte tamamlayalım: …" */
.kz-bant{margin:.5rem 0 .2rem;padding:.45rem .75rem;border-radius:10px;background:var(--uyari-zem);color:var(--murekkep);border-left:4px solid var(--uyari);font-size:.92rem;line-height:1.45;overflow-wrap:anywhere}
.kz-bant .osm{font-size:1.15em}

/* Zorlanan öğrenciye iskele: öne çıkan ipucu düğmesi ve açılır harf tablosu */
.dugme.kz-oner{border-style:dashed}
.kz-destek{margin:.8rem 0 0;border:1px dashed var(--cizgi-koyu);border-radius:10px;padding:.35rem .7rem}
.kz-destek summary{cursor:pointer;color:var(--vurgu);font-size:.92rem}
.kz-destek .harf-tablo{margin-top:.5rem}

/* Eksik kazanım ara ekranı */
.kz-ara-liste{list-style:none;padding:0;margin:.6rem 0}
.kz-ara-oge{padding:.55rem 0;border-bottom:1px solid var(--cizgi)}
.kz-ara-oge:last-child{border-bottom:0}

/* Ustalık çubuğu: %80 eşiği ince çizgiyle */
.kz-cubuk{position:relative;display:block;height:9px;border-radius:5px;background:var(--gri-zem);overflow:hidden;margin:.35rem 0}
.kz-cubuk i{display:block;height:100%;border-radius:5px;background:var(--uyari)}
.kz-tamamlandi .kz-cubuk i{background:var(--olur)}
.kz-eksik .kz-cubuk i{background:var(--olmaz)}
.kz-esik{position:absolute;top:0;bottom:0;left:80%;width:2px;background:var(--murekkep-3);opacity:.55}
.kucuk-cubuk{display:inline-block;width:5rem;height:7px;vertical-align:middle;margin:0 0 0 .4rem}

/* Kazanım satırı (Kazanımlarım) */
.kz-satir{display:grid;grid-template-columns:1fr auto;gap:.1rem .8rem;align-items:center;padding:.7rem 0;border-bottom:1px solid var(--cizgi)}
.kz-satir:last-child{border-bottom:0}
.kz-satir > *{grid-column:1}
.kz-satir .kz-calis{grid-column:2;grid-row:1 / span 3;min-height:40px;padding:.4rem .9rem}
.kz-bas{display:flex;flex-wrap:wrap;align-items:center;gap:.25rem .5rem}
.kz-no{font-family:var(--veri);font-size:.75rem;color:var(--murekkep-3);min-width:2.2rem}
.kz-alt{display:flex;flex-wrap:wrap;align-items:center;gap:.2rem .6rem}
.kz-ac summary{cursor:pointer;font-size:.88rem;color:var(--murekkep-2)}
.kz-ac p{margin:.25rem 0}
.kz-baslamadi{opacity:.75}

/* Kanıt şeridi: son cevaplar (yeşil doğru, kırmızı yanlış, soluk = ipuçlu/az ağırlıklı) */
.kz-serit{display:inline-flex;gap:2px;align-items:center;vertical-align:middle}
.kz-serit i{display:block;width:7px;height:7px;border-radius:50%}
.kz-serit i.d{background:var(--olur)}
.kz-serit i.y{background:var(--olmaz)}
.kz-serit i.hafif{opacity:.45}

/* Üst özet */
.kz-ozet .buyuk-sayi small{font-size:1rem;color:var(--murekkep-3)}
.kz-ozet .kz-sure{font-size:1.5rem;line-height:1.75rem}
.kz-simdi h3{margin-bottom:.2rem}

/* Öğrenme eğrisi (satır içi SVG) */
.kz-egri{display:block;width:100%;max-width:560px;height:auto;margin:.4rem 0}
.kz-egri-cubuk{fill:var(--vurgu-yum);stroke:var(--vurgu);stroke-width:.6}
.kz-egri-cizgi{fill:none;stroke:var(--olur);stroke-width:2}
.kz-egri-nokta{fill:var(--olur)}
.kz-egri-esik{stroke:var(--murekkep-3);stroke-width:1;stroke-dasharray:3 3;opacity:.6}
.kz-egri-yazi{fill:var(--murekkep-3);font-size:9px;font-family:var(--veri);text-anchor:middle}
.kz-lejant{display:inline-block;width:12px;height:9px;border-radius:2px;vertical-align:middle}
.kz-lejant.cubuk{background:var(--vurgu-yum);border:1px solid var(--vurgu)}
.kz-lejant.cizgi{height:3px;background:var(--olur)}

/* Harfler: en sağlam / en zayıf */
.kz-harfler{display:grid;grid-template-columns:repeat(auto-fit,minmax(13rem,1fr));gap:.8rem}
.kz-harf{display:inline-flex;flex-direction:column;align-items:center;min-width:3.4rem;margin:.3rem .3rem 0 0;padding:.3rem .4rem;border:1px solid var(--cizgi);border-radius:10px}
.kz-harf b{font-family:var(--osm);font-size:1.9rem;font-weight:400;line-height:1.3}
.kz-harf small{font-family:var(--veri);font-size:.72rem;color:var(--murekkep-3)}
.kz-ayrinti summary{cursor:pointer}

/* Oturum sonu / karne mini liste */
.kz-mini-satir{display:flex;flex-wrap:wrap;align-items:center;gap:.3rem;padding:.3rem 0}
.kz-mini-satir .kz-cubuk i{background:var(--uyari)}

/* ── Hoca paneli ── */
.kz-lejant-kutu{display:flex;flex-wrap:wrap;gap:.4rem 1rem;align-items:center;font-size:.88rem}
.kz-h{display:inline-block;min-width:2.1rem;padding:.12rem .25rem;border-radius:6px;text-align:center;font-family:var(--veri);font-size:.8rem;background:var(--gri-zem);color:var(--murekkep-2)}
.kz-h.tamamlandi{background:var(--olur-zem);color:var(--olur);font-weight:600}
.kz-h.ogreniyor{background:var(--uyari-zem);color:var(--uyari)}
.kz-h.eksik{background:var(--olmaz-zem);color:var(--olmaz);font-weight:600;outline:1px solid var(--olmaz)}
.kz-h.baslamadi{opacity:.55}
/* Hakem 2: hücre düğme; büyük = ustalık %, küçük = kanıt sayısı; dokununca ayrıntı #kz-detay'da */
button.kz-h{border:0;cursor:pointer;min-height:36px;min-width:3rem;line-height:1.15;font:inherit;font-family:var(--veri);font-size:.82rem}
.kz-h small{display:block;font-size:.66rem;font-weight:400;opacity:.8}
.kz-h.secili,button.kz-h:focus-visible{outline:2px solid var(--vurgu);outline-offset:1px}
.kz-detay{min-height:2.6em;margin:.2rem 0 .5rem;padding:.35rem .6rem;border-radius:8px;background:var(--panel-2)}
.kz-oneri td{vertical-align:top}
.kz-oneri .osm{font-size:1.3rem}
.kz-matris th{white-space:nowrap}
.kz-matris td,.kz-matris th{text-align:center}
.kz-matris td:first-child,.kz-matris th:first-child{text-align:left}
.kz-risk{display:inline-block;margin:.1rem .2rem .1rem 0;padding:.05rem .45rem;border-radius:20px;font-size:.75rem;background:var(--olmaz-zem);color:var(--olmaz)}
.kz-karis td,.kz-karis th{text-align:center;padding:.25rem .35rem;font-family:var(--veri);font-size:.85rem}
.kz-karis th .osm,.kz-karis td .osm{font-size:1.3rem}
.kz-karis td.dolu{background:var(--olmaz-zem);color:var(--olmaz);font-weight:600}
.kz-karis td.kosegen{background:var(--panel-2)}
.kz-iki{display:grid;grid-template-columns:repeat(auto-fit,minmax(16rem,1fr));gap:.9rem}
.kz-iki .kart{margin:0}
.kz-matris td:first-child{min-width:11rem}

/* Hakem 3: iki aşamalı ustalık. Geçici tamam açık yeşil (eski "tamamlandı"), kalıcı dolu
   yeşil; öğreniyor sarı kalır. Öğrenci rozetleri de aynı renk dili. */
.kz-h.tamamlandi.gecici{background:var(--olur-zem);color:var(--olur);outline:1px dashed var(--olur)}
.kz-h.tamamlandi.kalici{background:var(--olur);color:var(--panel, #fff)}
.etiket.kalici-rozet{background:var(--olur);color:var(--panel, #fff);font-weight:600}
.etiket.gecici-rozet{background:transparent;color:var(--murekkep-3);border:1px dashed var(--cizgi)}
.kz-rozet-aciklama{margin:.2rem 0 .8rem}
.kz-rozet-aciklama .etiket{font-size:.75rem}
.tekrar-kart.eksik-kart{background:var(--uyari-zem);border-color:var(--uyari)}
.kz-oneri-hepsi{margin-top:.5rem}