/* Gelişim özeti (yazdırılabilir, A4 × 2) — js/ui/gelisim-ozeti.js. Öğrenci Gelişim ekranı (#gelisim/ozet) ve öğretmen/veli raporu kullanır.
   Kâğıtlar temadan bağımsızdır: renkler burada sabittir (gece modunda da açık renk). Araç çubuğu (.ozet-arac) temaya uyar. */

/* ---------- ekrandaki araç çubuğu (yazdırılmaz) ---------- */
.ozet-ekran { display: flex; flex-direction: column; gap: 18px; min-width: 0; }
.ozet-arac { display: flex; align-items: flex-end; gap: 12px; flex-wrap: wrap; padding: 16px 20px; border-radius: var(--y-r, 18px); background: var(--y-yuzey); border: 1px solid var(--y-kenar); }
.ozet-arac .alan-kutu { display: flex; flex-direction: column; gap: 4px; font-size: 12px; font-weight: 700; color: var(--y-metin-2); }
.ozet-arac .alan-kutu input, .ozet-arac .alan-kutu textarea { min-height: 44px; box-sizing: border-box; padding: 0 12px; border-radius: 10px; border: 1px solid var(--y-kenar-2); background: var(--y-yuzey); color: var(--y-metin); font: 600 15px/1.3 var(--govde, system-ui, sans-serif); }
.ozet-arac .alan-kutu textarea { width: min(380px, 70vw); padding: 11px 12px; resize: vertical; }
.ozet-arac .alan-kutu input:focus, .ozet-arac .alan-kutu textarea:focus { outline: none; border-color: var(--y-ana); box-shadow: 0 0 0 3px var(--odak-halka); }
.ozet-arac .bilgi { font-size: 13px; color: var(--y-metin-2); max-width: 240px; line-height: 1.35; align-self: center; }
.ozet-arac .yazdir { margin-left: auto; }
.ozet-kutu { overflow-x: auto; padding: 4px 0 12px; -webkit-overflow-scrolling: touch; }

/* ---------- kâğıt ---------- */
.ozet-kagitlar { display: flex; flex-direction: column; align-items: center; gap: 24px; width: max-content; min-width: 100%; }
.ozet-sayfa {
  --k-yazi: #14262B; --k-yazi2: #55666A; --k-cizgi: #E4E0D6; --k-zemin2: #F8F7F3; --k-ana: #0E4F5C; --k-iz: #ECE8DF;
  box-sizing: border-box; width: 210mm; height: 297mm; margin: 0; padding: 13mm 14mm 11mm; background: #FFFFFF; color: var(--k-yazi);
  box-shadow: 0 6px 24px rgba(0, 0, 0, .18); display: flex; flex-direction: column; gap: 5mm; overflow: hidden;
  font-family: 'Plus Jakarta Sans', system-ui, sans-serif; font-size: 11pt; font-weight: 400; line-height: 1.35; text-align: left;
  -webkit-print-color-adjust: exact; print-color-adjust: exact; color-scheme: light;
}
.ozet-sayfa h1, .ozet-sayfa h2 { color: var(--k-yazi); font-family: inherit; margin: 0; }
.ozet-sayfa h2 { font-size: 12.5pt; font-weight: 800; letter-spacing: -.01em; }
.ozet-sayfa h2.bosluk { margin-bottom: 2mm; }
.ozet-sayfa .kucuk { font-size: 8.5pt; color: var(--k-yazi2); }
.ozet-sayfa svg { display: block; width: 100%; height: auto; margin-top: 1mm; font-family: inherit; }
.oz-kafa { display: flex; align-items: flex-start; justify-content: space-between; gap: 6mm; padding-bottom: 4mm; border-bottom: 2px solid var(--k-ana); }
.oz-kafa.orta { align-items: center; }
.oz-marka { display: flex; align-items: center; gap: 8px; font-size: 13pt; font-weight: 800; color: var(--k-ana); letter-spacing: -.02em; }
.oz-marka svg { width: 26px; height: 26px; margin: 0; }
.oz-kafa h1 { margin: 2mm 0 0; font-size: 21pt; font-weight: 800; letter-spacing: -.02em; line-height: 1.1; }
.oz-kafa h1.kucuk-baslik { font-size: 16pt; }
.oz-kafa dl { margin: 0; display: grid; grid-template-columns: auto auto; column-gap: 4mm; row-gap: 1.2mm; font-size: 9.5pt; }
.oz-kafa dt { color: var(--k-yazi2); font-weight: 600; }
.oz-kafa dd { margin: 0; font-weight: 700; }
.oz-karolar { display: grid; grid-template-columns: repeat(4, 1fr); gap: 3mm; }
.oz-karo { border: 1px solid var(--k-cizgi); border-radius: 3mm; padding: 3mm 3.5mm; }
.oz-karo .et, .oz-one .et { font-size: 7.5pt; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--k-yazi2); }
.oz-karo .d { margin-top: 1.5mm; display: flex; align-items: baseline; gap: 1.5mm; flex-wrap: wrap; }
.oz-karo .d b { font-size: 19pt; font-weight: 800; line-height: 1; letter-spacing: -.02em; font-variant-numeric: tabular-nums; }
.oz-karo .d span { font-size: 9pt; font-weight: 600; color: var(--k-yazi2); }
.oz-ikili { display: grid; grid-template-columns: 74mm 1fr; gap: 5mm; align-items: start; }
.oz-lejant { display: flex; gap: 4mm; font-size: 8pt; font-weight: 600; color: var(--k-yazi2); margin-top: 1mm; }
.oz-lejant span { display: flex; align-items: center; gap: 1.5mm; }
.oz-lejant i { width: 5mm; border-top: 2px solid var(--k-ana); }
.oz-lejant i.once { border-top: 2px dashed #8A989B; }
.oz-not { margin: 2mm 0 0; }
.ozet-sayfa table { width: 100%; border-collapse: collapse; font-size: 9pt; }
.ozet-sayfa th { text-align: left; font-size: 7.5pt; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--k-yazi2); padding: 0 1.5mm 1.5mm; border-bottom: 1px solid var(--k-cizgi); }
.ozet-sayfa td { padding: 1.6mm 1.5mm; border-bottom: 1px solid var(--k-iz); vertical-align: middle; color: var(--k-yazi); }
.ozet-sayfa td.sayi, .ozet-sayfa th.sayi { text-align: right; font-variant-numeric: tabular-nums; }
.ozet-sayfa td b { font-weight: 700; }
.oz-renk { display: inline-block; width: 2.4mm; height: 2.4mm; border-radius: .6mm; margin-right: 1.8mm; vertical-align: 0; }
.oz-alt { display: block; margin-left: 4.2mm; font-size: 7.5pt; color: var(--k-yazi2); font-weight: 500; }
.oz-artis { font-weight: 800; color: #2F6E3E; }
.oz-yok { color: var(--k-yazi2); }
.oz-satir { display: flex; justify-content: space-between; align-items: baseline; gap: 4mm; }
.oz-one { display: grid; grid-template-columns: repeat(3, 1fr); gap: 3mm; }
.oz-one > div { border-radius: 3mm; padding: 3mm 3.5mm; background: var(--k-zemin2); }
.oz-one > div.dikkat-et { background: #FDF1DC; }
.oz-one .dikkat-et .et { color: #7A4A00; }
.oz-one b { display: block; margin-top: 1mm; font-size: 11pt; font-weight: 800; }
.oz-one p { margin: 1mm 0 0; font-size: 8.5pt; line-height: 1.4; color: var(--k-yazi2); }
.oz-ayak { margin-top: auto; display: flex; justify-content: space-between; gap: 6mm; padding-top: 3mm; border-top: 1px solid var(--k-cizgi); font-size: 7.5pt; line-height: 1.45; color: var(--k-yazi2); }
.oz-ayak span:last-child { white-space: nowrap; }
.oz-ayak b { color: var(--k-yazi); }
/* sayfa 2 */
.oz-grup td { padding-top: 3mm; padding-bottom: 1.2mm; border-bottom: 1px solid var(--k-cizgi); font-size: 9.5pt; font-weight: 800; }
.oz-grup .yk { font-weight: 600; color: var(--k-yazi2); font-size: 8pt; }
.oz-etk td { padding-top: .9mm; padding-bottom: .9mm; }
.oz-etk td.ad { padding-left: 5.7mm; }
.oz-yildiz { display: inline-flex; gap: .6mm; vertical-align: middle; }
.oz-yildiz svg { width: 12px; height: 12px; margin: 0; }
.oz-durum { font-size: 8pt; font-weight: 700; padding: .6mm 2mm; border-radius: 1.5mm; white-space: nowrap; }
.oz-durum.tam { background: #E3F0E5; color: #2F6E3E; }
.oz-durum.eksik { background: #FDF1DC; color: #7A4A00; }
.oz-durum.yeni { background: #F1EEE7; color: #55666A; }
.oz-notlar { border: 1px solid var(--k-cizgi); border-radius: 3mm; padding: 3mm 4mm; min-height: 28mm; }
.oz-notlar .yazili { margin: 2mm 0 0; font-size: 10pt; line-height: 1.5; white-space: pre-wrap; }
.oz-notlar .satirlar { margin-top: 1mm; height: 15mm; background: repeating-linear-gradient(to bottom, transparent 0, transparent 6.8mm, var(--k-cizgi) 6.8mm, var(--k-cizgi) 7.2mm); }

/* ---------- yazdırma ---------- */
@page { size: A4; margin: 0; }
@media print {
  html, body { background: #FFFFFF !important; margin: 0 !important; padding: 0 !important; }
  .ozet-arac, .y1-ust, .guncelle-bant, .toast, .y1-sayfa-bas, .perde, #oyun-kok { display: none !important; }
  .kabuk.y1, .y1-icerik, .ozet-ekran, .ozet-kutu { display: block !important; padding: 0 !important; margin: 0 !important; max-width: none !important; background: #FFFFFF !important; overflow: visible !important; }
  .ozet-kagitlar { display: block; width: auto; gap: 0; }
  .ozet-sayfa { margin: 0; box-shadow: none; break-after: page; page-break-after: always; }
  .ozet-sayfa:last-child { break-after: auto; page-break-after: auto; }
}
.oz-etk td.sure, .oz-etk-tablo th.sayi { white-space: nowrap; }
.oz-etk td.ad b { white-space: nowrap; }
.oz-etk-tablo { font-size: 8.5pt; }
/* kabuk başlık kurallarından bağımsız (ui.css / ada.css .y1 h2) */
.ozet-kagitlar .ozet-sayfa h2 { font-size: 12.5pt; line-height: 1.25; letter-spacing: -.01em; }
.ozet-kagitlar .ozet-sayfa .oz-kafa h1 { font-size: 21pt; line-height: 1.1; }
.ozet-kagitlar .ozet-sayfa .oz-kafa h1.kucuk-baslik { font-size: 16pt; }
