#dersSayfasi { --lesson-bg:#0F172A; --lesson-left:#172235; --lesson-right:#1E293B; --lesson-card:#1E293B; --lesson-selected:#244263; --lesson-tag:#24463F; --lesson-tag-text:#5EEAD4; color:var(--detail-text); }
html[data-tema="acik"] #dersSayfasi { --lesson-bg:#F8FAFC; --lesson-left:#FFFFFF; --lesson-right:#FFFFFF; --lesson-card:#F8FAFC; --lesson-selected:#DBEAFE; --lesson-tag:#CCFBF1; --lesson-tag-text:#0F766E; }
body.ders-ekrani .kutu { width:calc(100vw - 24px); max-width:1680px; margin-left:0; padding:var(--content-pad-block) var(--content-pad-inline); align-self:flex-start; background:#0F172A; box-shadow:none; }
body.ders-ekrani.menu-acik .kutu { margin-left:230px; width:calc(100vw - 244px); }
html[data-tema="acik"] body.ders-ekrani .kutu { background:#F8FAFC; }
body.ders-ekrani :is(#uygulamaBaslik,#durum) { display:none; }
.ders-ust { display:flex; align-items:center; justify-content:flex-end; gap:12px; margin-bottom:10px; }
#dersSayfasi button,#dersModal button { color:var(--detail-text); background:var(--note-bg); border:1px solid var(--detail-border); border-radius:7px; font:inherit; cursor:pointer; }
#dersSayfasi .ders-turkuaz,#dersModal .ders-turkuaz { background:#0F766E; color:#fff; border-color:#0F766E; white-space:nowrap; }
#dersSayfasi .ders-turkuaz:hover,#dersModal .ders-turkuaz:hover { background:#12877D; }
.ders-paneller { display:grid; grid-template-columns:minmax(0,35fr) minmax(0,65fr); gap:14px; height:clamp(300px,calc(100dvh - 210px),900px); min-height:0; }
.ders-sol,.ders-sag { min-width:0; min-height:0; border:1px solid var(--detail-border); border-radius:10px; overflow:hidden; display:flex; flex-direction:column; }
.ders-sol { background:var(--lesson-left); padding:14px; }
.ders-sag { background:var(--lesson-right); }
.ders-arama { display:flex; gap:8px; flex-shrink:0; }
.ders-arama label { position:relative; flex:1; min-width:0; }
#dersAramaSimge { position:absolute; left:10px; top:12px; color:var(--detail-muted); }
#dersAra { width:100%; height:42px; box-sizing:border-box; padding:9px 10px 9px 34px; background:var(--lesson-bg); color:var(--detail-text); border-color:var(--detail-border); font-size:14px; }
.ders-filtre-kapsa { position:relative; }
#dersFiltre { display:flex; align-items:center; gap:6px; height:42px; box-sizing:border-box; padding:9px 10px; }
#dersFiltre.aktif { border-color:#0F766E; color:var(--lesson-tag-text); }
#dersKategoriler { position:absolute; right:0; top:48px; z-index:8; width:220px; max-width:70vw; max-height:240px; overflow:auto; border:1px solid var(--detail-border); border-radius:8px; padding:5px; background:var(--lesson-left); }
#dersKategoriler button { display:block; width:100%; text-align:left; border:0; background:transparent; padding:9px; overflow-wrap:anywhere; }
#dersKategoriler button:hover { background:var(--lesson-selected); }
#dersAktifFiltre { margin-top:8px; font-size:12px; color:var(--lesson-tag-text); }
#dersAktifFiltre button { border:0; margin-left:6px; padding:3px 7px; color:inherit; }
.ders-liste-baslik { display:flex; color:var(--detail-muted); font-size:12px; margin:9px 0 8px; }
#dersListe { overflow-y:auto; min-height:0; scrollbar-gutter:stable; }
#dersSayfasi .ders-kart { display:block; width:100%; text-align:left; padding:9px 12px; margin-bottom:7px; border:1px solid var(--detail-border); border-radius:8px; background:var(--lesson-card); box-sizing:border-box; }
#dersSayfasi .ders-kart[aria-pressed="true"] { background:var(--lesson-selected); border-color:#3B82F6; }
.ders-kart strong { display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; overflow:hidden; font-size:15px; font-weight:600; line-height:1.4; overflow-wrap:anywhere; }
.ders-kart small { display:block; margin-top:5px; font-size:12px; color:var(--detail-muted); overflow-wrap:anywhere; }
.ders-kart-kategori { color:var(--lesson-tag-text); }
.ders-detay-ust { padding:14px 20px 12px; flex-shrink:0; border-bottom:1px solid var(--detail-border); }
.ders-detay-islem { display:flex; align-items:center; gap:8px; }
.ders-kategori-etiket { padding:5px 9px; border-radius:6px; background:var(--lesson-tag); color:var(--lesson-tag-text); font-size:12px; overflow-wrap:anywhere; }
.ders-menu { margin-left:auto; position:relative; }
.ders-menu summary { list-style:none; cursor:pointer; padding:8px; border-radius:6px; }
.ders-menu summary::-webkit-details-marker { display:none; }
.ders-menu > div { position:absolute; right:0; top:36px; z-index:8; padding:5px; width:120px; border:1px solid var(--detail-border); border-radius:7px; background:var(--lesson-left); }
.ders-menu button { display:block; width:100%; margin:3px 0; text-align:left; }
#dersSayfasi .ders-detay-ust h2 { font-size:24px; font-weight:700; line-height:1.3; letter-spacing:-.3px; margin:10px 0 8px; color:var(--detail-text); overflow-wrap:anywhere; }
.ders-detay-ust small { display:flex; align-items:center; gap:7px; color:var(--detail-muted); font-size:12px; }
.ders-icon { display:inline-flex; flex-shrink:0; }
.ders-detay-icerik { overflow-y:auto; min-height:0; padding:0 20px 16px; scrollbar-gutter:stable; }
.ders-detay-icerik section { padding:15px 0; border-bottom:1px solid var(--detail-border); }
.ders-detay-icerik section:last-child { border-bottom:0; }
.ders-detay-icerik h3 { display:flex; align-items:center; gap:8px; font-size:16px; font-weight:600; line-height:1.45; color:var(--detail-text); margin:0 0 10px; }
.ders-detay-icerik section:first-child h3 .ders-icon { color:#FBBF24; }
.ders-detay-icerik section:nth-child(2) h3 .ders-icon { color:#4ADE80; }
html[data-tema="acik"] .ders-detay-icerik section:first-child h3 .ders-icon { color:#B45309; }
html[data-tema="acik"] .ders-detay-icerik section:nth-child(2) h3 .ders-icon { color:#15803D; }
.ders-zengin,.ders-editor { line-height:1.65; font-size:14px; overflow-wrap:anywhere; }
.ders-zengin :is(p,ul,ol),.ders-editor :is(p,ul,ol) { margin:8px 0; }
.ders-zengin ul,.ders-editor ul { list-style:disc; padding-left:23px; }
.ders-zengin ol,.ders-editor ol { list-style:decimal; padding-left:23px; }
.ders-zengin li,.ders-editor li { display:list-item; background:transparent; padding:0; margin:4px 0; border:0; border-radius:0; list-style:inherit; }
.ders-zengin li::marker,.ders-editor li::marker { color:inherit; }
.ders-bos { margin:16px; font-size:14px; line-height:1.6; color:var(--detail-muted); }
.ders-dosya { display:flex; align-items:center; gap:8px; padding:8px 0; font-size:13px; min-width:0; }
.ders-dosya > span:not(.ders-icon) { flex:1; min-width:0; overflow-wrap:anywhere; }
.ders-dosya small { font-size:11px; color:var(--detail-muted); }
.ders-dosya button { padding:7px; font-size:12px !important; }
#dersBildirim { padding:8px 10px; margin:0 0 12px; font-size:13px; color:var(--lesson-tag-text); border:1px solid var(--detail-border); border-radius:7px; }
#dersBildirim[role="alert"] { color:#F87171; }
html[data-tema="acik"] #dersBildirim[role="alert"],html[data-tema="acik"] #dersFormHata { color:#B91C1C; }
#dersModal { width:660px; max-width:calc(100vw - 24px); max-height:calc(100dvh - 32px); padding:20px; border:1px solid var(--detail-border); border-radius:12px; background:var(--detail-bg); color:var(--detail-text); box-sizing:border-box; overflow-y:auto; }
#dersModal::backdrop { background:#020617aa; }
#dersForm { display:grid; gap:14px; }
#dersForm header { display:flex; justify-content:space-between; align-items:center; gap:12px; }
#dersForm h2 { margin:0; font-size:21px; color:var(--detail-text); }
#dersForm label { display:grid; gap:7px; font-size:14px; }
#dersForm input { width:100%; box-sizing:border-box; color:var(--detail-text); background:var(--note-bg); border-color:var(--detail-border); }
.ders-araclar { display:flex; flex-wrap:wrap; gap:4px; margin-top:8px; }
#dersModal .ders-araclar button { padding:6px 8px; font-size:12px; }
#dersModal .ders-araclar button[aria-pressed="true"] { background:#244263; border-color:#60A5FA; color:#F8FAFC; box-shadow:inset 0 -2px 0 #60A5FA; }
html[data-tema="acik"] #dersModal .ders-araclar button[aria-pressed="true"] { background:#DBEAFE; border-color:#2563EB; color:#1E40AF; box-shadow:inset 0 -2px 0 #2563EB; }
.ders-editor { min-height:100px; max-height:230px; overflow-y:auto; padding:10px; border:1px solid var(--detail-border); border-radius:7px; background:var(--note-bg); outline:none; }
.ders-editor:focus { border-color:var(--detail-icon); }
.ders-editor:empty::before { content:attr(data-placeholder); color:var(--detail-muted); pointer-events:none; }
#dersForm footer { display:flex; justify-content:flex-end; gap:8px; }
#dersFormHata { margin:0; color:#F87171; font-size:13px; }
.ders-geri { display:none; }
@media(max-width:700px) {
 body.ders-ekrani .kutu,body.ders-ekrani.menu-acik .kutu { width:100%; margin:0; padding:20px 12px; }
 .ders-ust { align-items:flex-start; flex-wrap:wrap; }
 .ders-paneller { grid-template-columns:minmax(0,1fr); height:calc(100dvh - 260px); min-height:280px; }
 .ders-sag { display:none; }
 .ders-detay-acik .ders-sol { display:none; }
 .ders-detay-acik .ders-sag { display:flex; }
 .ders-geri { display:block; padding:7px !important; font-size:12px !important; }
 .ders-detay-ust { padding:12px; }
 .ders-detay-icerik { padding:0 12px 12px; }
 #dersSayfasi .ders-detay-ust h2 { font-size:23px; }
 .ders-dosya { flex-wrap:wrap; }
 .ders-dosya small { flex-basis:auto; }
 #dersModal { padding:14px; }
}

/* Tek seviyeli klasör giriş ekranı; içerideki iki panel değiştirilmez. */
.ders-klasor-yol { display:flex; align-items:center; gap:6px; min-width:0; margin-right:auto; font-size:13px; color:var(--detail-muted); }
#dersSayfasi .ders-klasor-yol button { border:0; background:transparent; padding:5px 0; color:var(--lesson-tag-text); font-size:13px; }
.ders-klasor-yol > span:last-child { overflow-wrap:anywhere; color:var(--detail-text); }
.ders-klasor-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(220px,1fr)); gap:14px; margin-top:14px; }
.ders-klasor-kart { position:relative; min-width:0; border:1px solid var(--detail-border); border-radius:10px; background:var(--lesson-card); }
#dersSayfasi .ders-klasor-ac { border:0; width:100%; min-height:112px; padding:18px 46px 18px 16px; display:grid; grid-template-columns:30px minmax(0,1fr); gap:6px 10px; text-align:left; background:transparent; }
.ders-klasor-ac strong { font-size:15px; font-weight:600; overflow-wrap:anywhere; }
.ders-klasor-ac small { grid-column:2; color:var(--detail-muted); font-size:12px; }
.ders-klasor-simge { grid-row:1 / 3; color:var(--lesson-tag-text); }
.ders-klasor-kart:hover { border-color:var(--lesson-tag-text); }
.ders-klasor-menu { position:absolute; right:8px; top:10px; }
.ders-klasor-menu summary { list-style:none; cursor:pointer; padding:8px; }
.ders-klasor-menu summary::-webkit-details-marker { display:none; }
.ders-klasor-menu > div { position:absolute; z-index:10; right:0; width:170px; padding:5px; border:1px solid var(--detail-border); border-radius:8px; background:var(--lesson-left); }
.ders-klasor-menu button { display:block; width:100%; text-align:left; font-size:13px !important; padding:8px; }
.ders-klasor-modal { width:390px; max-width:calc(100vw - 24px); max-height:calc(100dvh - 32px); box-sizing:border-box; padding:20px; border:1px solid var(--detail-border); border-radius:12px; background:var(--detail-bg); color:var(--detail-text); }
.ders-klasor-modal::backdrop { background:#020617aa; }
.ders-klasor-modal form { display:grid; gap:14px; }
.ders-klasor-modal h2 { font-size:19px; margin:0; color:var(--detail-text); }
.ders-klasor-modal label { display:grid; gap:7px; font-size:14px; }
.ders-klasor-modal :is(input,select),#dersKlasorSec { width:100%; min-width:0; box-sizing:border-box; color:var(--detail-text); background:var(--note-bg); border:1px solid var(--detail-border); padding:10px; }
.ders-klasor-modal footer { display:flex; justify-content:flex-end; gap:8px; }
.ders-klasor-modal footer button:last-child { background:#0F766E; color:#fff; }
.ders-klasor-modal p[role="alert"] { font-size:13px; margin:0; color:#F87171; }
html[data-tema="acik"] .ders-klasor-modal p[role="alert"] { color:#B91C1C; }
.ders-menu > div { width:155px; }
@media(max-width:700px) { .ders-klasor-grid { grid-template-columns:repeat(auto-fill,minmax(min(220px,100%),1fr)); } .ders-klasor-yol { width:100%; flex-wrap:wrap; } }

/* Bilgi hiyerarşisi ve yalnızca yeni dersler için biçim tercihleri. */
.ders-detay-icerik section:last-child h3 { font-size:14px; font-weight:600; color:var(--detail-muted); margin-bottom:10px; }
.ders-bicim-ayari { border:1px solid var(--detail-border); border-radius:8px; padding:10px 12px; background:var(--note-bg); min-width:0; }
.ders-bicim-ayari summary { cursor:pointer; font-size:13px; font-weight:600; color:var(--detail-text); }
.ders-bicim-secenekleri { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; margin-top:12px; }
.ders-bicim-secenekleri fieldset { min-width:0; padding:0; margin:0; border:0; }
.ders-bicim-secenekleri legend { font-size:13px; font-weight:600; padding:0; margin-bottom:8px; }
#dersForm .ders-bicim-secenekleri label { display:flex; align-items:center; gap:8px; font-size:13px; margin:8px 0; cursor:pointer; }
#dersForm .ders-bicim-secenekleri input { width:17px; height:17px; flex:0 0 17px; padding:0; margin:0; accent-color:#0F766E; }
#dersBicimDurum { display:block; color:var(--detail-muted); font-size:12px; line-height:1.5; margin-top:8px; }
#dersBicimDurum[role="alert"] { color:#F87171; }
html[data-tema="acik"] #dersBicimDurum[role="alert"] { color:#B91C1C; }
@media(max-width:480px) { .ders-bicim-secenekleri { grid-template-columns:minmax(0,1fr); gap:6px; } }
/* Ders dışa aktarma ve kartın tamamından sıralama. */
#dersSayfasi .ders-disari-aktar { display:inline-flex; align-items:center; gap:7px; }
.ders-sira-satir { position:relative; min-width:0; }
#dersSayfasi .ders-sira-satir .ders-kart { padding-right:42px; }
#dersSayfasi .ders-sira-tutamac { position:absolute; top:8px; right:6px; width:30px; min-height:34px; padding:3px; border:0; background:transparent; color:var(--detail-muted); cursor:grab; touch-action:none; font-size:21px; }
#dersSayfasi .ders-sira-tutamac:disabled { cursor:default; opacity:.35; }
.ders-sira-secimler { position:absolute; right:6px; top:43px; z-index:9; padding:5px; border:1px solid var(--detail-border); border-radius:7px; background:var(--lesson-left); }
#dersSayfasi .ders-sira-secimler button { display:block; width:100%; text-align:left; padding:8px; font-size:12px; }
#dersSiraBilgi { color:var(--detail-muted); font-size:12px; line-height:1.5; margin:0 0 8px; }
.ders-sira-hedef { border:1px dashed var(--detail-icon); border-radius:8px; box-sizing:border-box; display:grid; place-items:center; color:var(--detail-muted); margin-bottom:8px; }
.ders-tasiniyor { box-shadow:0 6px 20px #0003; opacity:.95; }
#dersAktarMesaj { color:var(--detail-muted); line-height:1.5; }
#dersSayfasi .ders-sira-secimler button:disabled { opacity:.45; }
@media(max-width:700px) { #dersSayfasi .ders-sira-tutamac { width:36px; min-height:44px; } #dersSayfasi .ders-sira-satir .ders-kart { padding-right:48px; } .ders-ust .ders-disari-aktar { margin-left:auto; } }

#dersSayfasi .ders-siralanabilir .ders-kart { cursor:grab; user-select:none; -webkit-user-select:none; -webkit-touch-callout:none; }
#dersSayfasi .ders-tasiniyor .ders-kart { cursor:grabbing; }

/* Mevcut klasörler ve iki panel; yalnızca hiyerarşi ve seçim vurgusu. */
.ders-klasor-grid { align-items:stretch; }
.ders-klasor-ac strong { line-height:1.4; }
.ders-klasor-ac small { line-height:1.4; }
html:root #dersSayfasi .ders-kart[aria-pressed="true"] { box-shadow:inset 3px 0 0 var(--detail-icon); border-color:var(--detail-icon); }
@media(hover:hover) and (pointer:fine) {
 html:root #dersSayfasi .ders-klasor-kart:hover { background:color-mix(in srgb,var(--lesson-card) 94%,var(--detail-text)); border-color:var(--detail-icon); }
 html:root #dersSayfasi .ders-kart:not([aria-pressed="true"]):hover { background:color-mix(in srgb,var(--lesson-card) 96%,var(--detail-text)); border-color:var(--detail-icon); }
}
.ders-kart small { line-height:1.5; }

/* Yalnızca derslerin okuma görünümü; kayıtlı içerik ve editör stili değişmez. */
#dersSayfasi #dersSag .ders-detay-ust,
#dersSayfasi #dersSag .ders-detay-icerik > section { border-bottom-color:color-mix(in srgb,var(--detail-border) 65%,transparent); }
#dersSayfasi #dersSag .ders-detay-icerik h3 .ders-icon { color:var(--detail-muted); }
.ders-detay-icerik h3 .ders-icon svg { width:15px; height:15px; }
.ders-detay-icerik .ders-zengin { line-height:1.8; max-width:85ch; min-width:0; overflow-wrap:anywhere; }
.ders-detay-icerik .ders-zengin p { margin:0 0 .8em; }
.ders-detay-icerik .ders-zengin :is(ul,ol) { margin:.5em 0 .75em; padding-inline-start:1.6em; list-style-position:outside; }
.ders-detay-icerik .ders-zengin li { padding-inline-start:.15em; margin:.25em 0; line-height:1.8; }
.ders-detay-icerik .ders-zengin :is(strong,b) { font-weight:600; }
.ders-detay-icerik .ders-zengin > :last-child { margin-bottom:0; }
@media(max-width:768px) { #dersAra,#dersFiltre { height:44px; } }