/* ============================================================
   BARÜMAT portal — görünüm
   Renkler ve ölçüler tek yerden: :root bloğu.
   ============================================================ */

:root {
  color-scheme: light;

  /* koyu sol menü */
  --menu-zemin:  #1b2230;
  --menu-metin:  #aeb6c4;
  --menu-grup:   #6d7686;
  --menu-aktif:  #ffffff;
  --menu-secili: #262f42;

  /* sağ taraf */
  --zemin:    #eef1f5;
  --kart:     #ffffff;
  --cizgi:    #dfe4ea;
  --murekkep: #1c2430;
  --soluk:    #68738a;
  --vurgu:    #2563eb;
  --vurgu-yumusak: #e8effe;
  --vurgu-buton:   #2563eb;
  --bant:     #232b3b;

  /* ders programı */
  --yumusak:   #f1f4f8;
  --lu:        #9a5820;
  --lu-zemin:  #f6ecdf;
  --ara:       #e7ebf1;

  --menu-en: 264px;
  --r:       12px;
  --r-kucuk: 8px;
  --gecis:   150ms ease;
  --golge-1: 0 1px 2px rgba(15, 23, 42, .05), 0 1px 1px rgba(15, 23, 42, .03);
  --golge-2: 0 12px 28px -10px rgba(15, 23, 42, .18), 0 2px 8px -2px rgba(15, 23, 42, .08);
}

@media (prefers-color-scheme: dark) {
  :root {
    color-scheme: dark;

    --zemin:    #10141c;
    --kart:     #1b2230;
    --cizgi:    #2a3347;
    --murekkep: #e8ecf4;
    --soluk:    #97a1b8;
    --vurgu:    #5b9bf5;
    --vurgu-yumusak: #202a3f;
    --vurgu-buton:   #2f6fe0;
    --bant:     #05070c;

    --yumusak:   #232b3b;
    --lu:        #e0a458;
    --lu-zemin:  #382a17;
    --ara:       #1a212e;

    --golge-1: 0 1px 2px rgba(0, 0, 0, .35), 0 1px 1px rgba(0, 0, 0, .25);
    --golge-2: 0 14px 32px -10px rgba(0, 0, 0, .55), 0 2px 8px -2px rgba(0, 0, 0, .35);
  }
}

* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }

body {
  margin: 0;
  background: var(--zemin);
  color: var(--murekkep);
  font-family: "Inter", system-ui, -apple-system, Segoe UI, Roboto, sans-serif;
  font-size: 14.5px;
  line-height: 1.5;
  transition: background var(--gecis), color var(--gecis);
}

.portal { display: flex; min-height: 100vh; }

/* ================= SOL MENÜ ================= */

.menu {
  width: var(--menu-en);
  flex: 0 0 var(--menu-en);
  background: var(--menu-zemin);
  color: var(--menu-metin);
  display: flex;
  flex-direction: column;
  position: sticky;
  top: 0;
  height: 100vh;
  overflow-y: auto;
}

.marka {
  display: flex;
  align-items: center;
  gap: 11px;
  padding: 18px 18px 16px;
  border-bottom: 1px solid #2a3347;
}

.marka-buton {
  background: none;
  border: none;
  border-bottom: 1px solid #2a3347;
  width: 100%;
  text-align: left;
  cursor: pointer;
  font: inherit;
  color: inherit;
  transition: background var(--gecis);
}
.marka-buton:hover { background: var(--menu-secili); }

.logo {
  width: 40px; height: 40px;
  display: grid;
  place-items: center;
  flex-shrink: 0;
}
.logo img { width: 100%; height: 100%; object-fit: contain; }

.marka-ad  { color: #fff; font-weight: 700; font-size: 16px; letter-spacing: .02em; }
.marka-alt { font-size: 10.5px; color: var(--menu-grup); }

.menu nav { padding: 10px 10px 16px; flex: 1; }

.grup {
  margin: 16px 10px 6px;
  font-size: 10px;
  font-weight: 600;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--menu-grup);
}

.mlink {
  display: flex;
  align-items: center;
  gap: 11px;
  padding: 9px 10px;
  border-radius: 8px;
  color: inherit;
  text-decoration: none;
  font-size: 13.5px;
  margin-bottom: 2px;
}

.mlink svg {
  width: 18px; height: 18px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.7;
  stroke-linecap: round;
  stroke-linejoin: round;
  flex: 0 0 auto;
}

.mlink:hover { background: var(--menu-secili); color: #dbe1ea; }
.mlink.aktif { background: var(--menu-secili); color: var(--menu-aktif); font-weight: 600; }

.mlink-buton {
  width: 100%;
  background: none;
  border: 0;
  font: inherit;
  font-size: 13.5px;
  text-align: left;
  cursor: pointer;
  color: var(--menu-metin);
}

/* açılır başlık (Ders Programları) */
.mlink.acilir {
  width: 100%;
  background: none;
  border: 0;
  font: inherit;
  font-size: 13.5px;
  text-align: left;
  cursor: pointer;
  color: var(--menu-metin);
}
.mlink.acilir span { flex: 1; }

.mlink.acilir .ok {
  width: 15px; height: 15px;
  transition: transform var(--gecis);
}
.mlink.acilir[aria-expanded="false"] .ok { transform: rotate(-90deg); }

/* alt menü */
.altmenu {
  overflow: hidden;
  margin: 2px 0 4px;
  padding-left: 29px;
  border-left: 1px solid #2f394d;
  margin-left: 19px;
}
.altmenu.kapali { display: none; }

.alink {
  display: block;
  padding: 7px 10px;
  border-radius: 7px;
  color: var(--menu-metin);
  text-decoration: none;
  font-size: 13px;
  margin-bottom: 1px;
}
.alink:hover { background: var(--menu-secili); color: #dbe1ea; }
.alink.aktif { background: var(--menu-secili); color: var(--menu-aktif); font-weight: 600; }

.menu-alt {
  padding: 14px 18px;
  font-size: 11px;
  color: var(--menu-grup);
  border-top: 1px solid #2a3347;
}

/* ================= SAĞ TARAF ================= */

.govde { flex: 1; min-width: 0; display: flex; flex-direction: column; }

.ustbar {
  background: var(--kart);
  border-bottom: 1px solid var(--cizgi);
  padding: 10px 22px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  position: sticky;
  top: 0;
  z-index: 20;
}

.hamburger {
  display: none;
  background: none;
  border: 1px solid var(--cizgi);
  border-radius: 8px;
  padding: 6px;
  cursor: pointer;
}
.hamburger svg { width: 20px; height: 20px; stroke: var(--murekkep); stroke-width: 2; fill: none; }

.donem {
  font: inherit;
  font-size: 13px;
  font-weight: 600;
  color: inherit;
  background: var(--yumusak);
  border: 1px solid var(--cizgi);
  border-radius: 8px;
  padding: 6px 12px;
  cursor: pointer;
}

.donem-statik { cursor: default; }

.ustbar-sag {
  margin-left: auto;
  display: flex;
  align-items: center;
  gap: 10px;
}

.donem-aktif-rozet {
  font-size: 11px;
  font-weight: 700;
  color: #16a34a;
  background: #16a34a1a;
  border: 1px solid #16a34a40;
  border-radius: 999px;
  padding: 4px 10px;
  white-space: nowrap;
}

.icerik { padding: 22px; max-width: 1240px; width: 100%; margin: 0 auto; }

/* Bölüm gösterimi: yalnız .aktif olan görünür */
.bolum { display: none; }
.bolum.aktif { display: block; }

/* ================= BÖLÜM (DEPARTMAN) SEÇİM EKRANI ================= */
/* .portal ile hiç iç içe değil, sadece body.birim-secim-acik ile
   görünürlük değişir — yukarıdaki .bolum/.aktif mekanizmasına dokunmaz. */

#birim-secim-ekrani {
  display: none;
  min-height: 100vh;
  align-items: center;
  justify-content: center;
  padding: 48px 22px;
  background:
    radial-gradient(600px 200px at 100% -20%, rgba(91, 155, 245, .25), transparent 60%),
    linear-gradient(135deg, var(--bant), #101728);
}

body.birim-secim-acik .portal { display: none; }
body.birim-secim-acik #birim-secim-ekrani { display: flex; }

.birim-secim-govde { width: 100%; max-width: 920px; text-align: center; }

.birim-secim-marka {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 6px;
}
.birim-secim-marka .logo { width: 56px; height: 56px; }
.birim-secim-marka .marka-ad { font-size: 22px; }
.birim-secim-marka .marka-alt { font-size: 12.5px; }

.birim-izgara {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 18px;
  text-align: left;
  margin-top: 34px;
}

@media (max-width: 900px) {
  .birim-izgara { grid-template-columns: 1fr; }
}

.birim-karti {
  position: relative;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  justify-content: center;
  min-height: 150px;
  font: inherit;
  text-align: left;
  cursor: pointer;
  background: var(--kart);
  border: 1px solid var(--cizgi);
  border-radius: var(--r);
  padding: 26px 28px;
  box-shadow: var(--golge-1);
  transition: box-shadow 220ms ease, transform 220ms ease, border-color 220ms ease;
}
.birim-karti:hover { box-shadow: var(--golge-2); border-color: transparent; transform: translateY(-3px) scale(1.025); }
.birim-karti:hover .birim-karti-ok svg { transform: translateX(3px); }

/* Karta tıklanınca bölümün sayfasına geçmeden önce, tıklanan kart tam
   ekranı kaplayacak şekilde büyüyerek açılır (JS: birimKartinaTikla) —
   .birim-izgara'nın grid akışından çıkıp position:fixed ile animasyonu
   kendi başına yürütür, bu yüzden geçiş süresi grid transition'ından
   ayrı, biraz daha yavaş ve net bir eğri kullanır. */
.birim-karti.birim-karti-aciliyor {
  transition: top 420ms cubic-bezier(.4,0,.2,1), left 420ms cubic-bezier(.4,0,.2,1),
              width 420ms cubic-bezier(.4,0,.2,1), height 420ms cubic-bezier(.4,0,.2,1),
              border-radius 420ms cubic-bezier(.4,0,.2,1);
}

.birim-karti h2 { margin: 0; padding-right: 50px; font-size: 24px; font-weight: 800; color: var(--murekkep); }

.birim-karti-ok {
  position: absolute;
  right: 22px; bottom: 22px;
  color: var(--birim-vurgu, var(--vurgu));
}
.birim-karti-ok svg {
  width: 22px; height: 22px;
  fill: none; stroke: currentColor;
  stroke-width: 2; stroke-linecap: round; stroke-linejoin: round;
  transition: transform var(--gecis);
}

.birim-motif {
  position: absolute;
  top: -18px; right: -18px;
  width: 170px; height: 170px;
  color: var(--birim-vurgu, var(--vurgu));
  opacity: .5;
  fill: none;
  stroke: currentColor;
  stroke-width: 2.2;
  stroke-linecap: round;
  stroke-linejoin: round;
  pointer-events: none;
}
.birim-motif text { opacity: .45; }

.birim-karti-matematik { --birim-vurgu: var(--vurgu); }
.birim-karti-btbs      { --birim-vurgu: #14b8a6; }
.birim-karti-bio       { --birim-vurgu: #2f9e5c; }
.birim-karti-mbg       { --birim-vurgu: #7c5cd6; }

/* ================= ANA SAYFA ================= */

.bant {
  position: relative;
  overflow: hidden;
  background:
    radial-gradient(600px 200px at 100% -20%, rgba(91, 155, 245, .25), transparent 60%),
    linear-gradient(135deg, var(--bant), #101728);
  color: #fff;
  border-radius: var(--r);
  padding: 24px 26px;
  margin-bottom: 18px;
}

.bant-ust {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 14px;
  flex-wrap: wrap;
}

.bant h1 { margin: 0 0 4px; font-size: 30px; font-weight: 800; letter-spacing: -.01em; }
.bant p  { margin: 0; color: #9aa4b8; font-size: 13.5px; }

.bant-guncelleme {
  font-size: 12px;
  color: #cdd4e0;
  background: rgba(255, 255, 255, .08);
  border: 1px solid rgba(255, 255, 255, .12);
  border-radius: 999px;
  padding: 5px 12px;
  white-space: nowrap;
}

/* ================= İSTATİSTİK ŞERİDİ ================= */

.istatistik-izgara {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 12px;
  margin-bottom: 18px;
}

.istatistik {
  background: var(--kart);
  border: 1px solid var(--cizgi);
  border-radius: var(--r);
  padding: 14px 16px;
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.istatistik-deger { font-size: 24px; font-weight: 700; color: var(--murekkep); line-height: 1.15; }
.istatistik-etiket { font-size: 12px; color: var(--soluk); }

.kart-izgara {
  display: grid;
  grid-template-columns: 1.4fr 1fr;
  gap: 18px;
}

.kart {
  background: var(--kart);
  border: 1px solid var(--cizgi);
  border-radius: var(--r);
  padding: 18px 20px;
  box-shadow: var(--golge-1);
  transition: box-shadow var(--gecis), border-color var(--gecis), background var(--gecis);
}

.kart-izgara .kart:hover { box-shadow: var(--golge-2); border-color: transparent; }

.kart-baslik {
  display: flex;
  align-items: center;
  gap: 9px;
  margin: 0 0 14px;
  font-size: 15px;
  font-weight: 700;
}

.kart-baslik svg {
  width: 19px; height: 19px;
  fill: none; stroke: var(--vurgu);
  stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round;
}

.kart-etiket {
  margin: 0 0 8px;
  font-size: 10.5px;
  font-weight: 600;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--soluk);
}

.hizli { display: grid; grid-template-columns: 1fr 1fr; gap: 4px 20px; }
.hizli .hlink:last-child { grid-column: 1 / -1; }

.hlink {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 11px 4px;
  border-bottom: 1px solid var(--cizgi);
  color: inherit;
  text-decoration: none;
  font-size: 14px;
}
.hlink:hover { color: var(--vurgu); }

.hikon { font-size: 11px; }
.hikon.mor     { color: #7c5cd6; }
.hikon.turuncu { color: #d97f2e; }
.hikon.mavi    { color: #2f7fd6; }

.bos-kart {
  padding: 30px 10px;
  text-align: center;
  color: var(--soluk);
  font-size: 13.5px;
}
.bos-kart svg {
  width: 30px; height: 30px;
  fill: none; stroke: var(--cizgi);
  stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round;
  margin-bottom: 8px;
}
.bos-kart p { margin: 0; }

/* ================= ANA SAYFA GÖRSEL PANELİ ("süs") =================
   Sadece kodda (BIRIM_GORSEL) tanımlı, arayüzden düzenlenemez. */

.gorsel-panel-kart { padding: 0; overflow: hidden; margin-bottom: 18px; }

.gorsel-panel { background: var(--zemin); }

.gorsel-panel img {
  width: 100%;
  max-height: 360px;
  object-fit: cover;
  display: block;
}

.sifre-kural-listesi {
  list-style: none;
  margin: 6px 0 0;
  padding: 0;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 3px 10px;
  font-size: 11.5px;
  color: var(--soluk);
}
.sifre-kural-listesi li { display: flex; align-items: center; gap: 6px; }
.sifre-kural-listesi li::before {
  content: "";
  width: 13px; height: 13px;
  flex: none;
  border-radius: 50%;
  border: 1.5px solid var(--cizgi);
  background: transparent;
}
.sifre-kural-listesi li.tamam { color: #2e8b4f; }
.sifre-kural-listesi li.tamam::before {
  border-color: #2e8b4f;
  background: #2e8b4f url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l5 5L19 7'/%3E%3C/svg%3E") center/9px no-repeat;
}

/* ================= DERS PROGRAMI ================= */

.sayfa-bas {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 14px;
  flex-wrap: wrap;
  margin-bottom: 16px;
}

.sayfa-bas h1 { margin: 0; font-size: 21px; font-weight: 700; }

.guncelleme { margin: 0; font-size: 12px; color: var(--soluk); }

.panel-kart {
  display: flex;
  gap: 14px;
  flex-wrap: wrap;
  align-items: flex-end;
  margin-bottom: 14px;
}

.alan { display: flex; flex-direction: column; gap: 5px; }
.alan.buyu { flex: 1 1 220px; }

.alan label {
  font-size: 10.5px;
  font-weight: 600;
  letter-spacing: .09em;
  text-transform: uppercase;
  color: var(--soluk);
}

select {
  font: inherit;
  font-size: 14px;
  color: var(--murekkep);
  padding: 8px 10px;
  border: 1px solid var(--cizgi);
  border-radius: 8px;
  background: var(--kart);
  min-width: 160px;
  max-width: 100%;
  transition: border-color var(--gecis);
}

select:focus-visible, button:focus-visible, .mlink:focus-visible, .hlink:focus-visible {
  outline: 2px solid var(--vurgu);
  outline-offset: 2px;
}

.dugme {
  font: inherit;
  font-size: 14px;
  font-weight: 600;
  padding: 9px 18px;
  border: 1px solid var(--vurgu-buton);
  border-radius: 8px;
  background: var(--vurgu-buton);
  color: #fff;
  cursor: pointer;
  transition: background var(--gecis), transform var(--gecis);
}
.dugme:hover { background: #1d4fd0; }
.dugme:active { transform: translateY(1px); }

/* Geri Al / İleri Al gibi tek sembollü kutucuk butonlar — metin olmadan,
   sadece ok simgesi (bkz. plan-geri-al/plan-ileri-al vb.). */
.dugme-ikon { padding: 8px 14px; font-size: 17px; line-height: 1; }
.dugme-ikon:disabled { opacity: 0.4; cursor: default; }

/* Simge-butonun içindeki SVG (metin yerine ikon): çizgi ikonu, buton
   metniyle aynı renk. */
.dugme-ikon > svg {
  display: block;
  width: 18px; height: 18px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}
/* Fakülte Çakışma Raporu butonu: çakışma varken kırmızıya döner. */
#derslik-kullanim-cakisma.cakisma-var {
  background: #d03b3b;
  border-color: #d03b3b;
}
#derslik-kullanim-cakisma.cakisma-var:hover { background: #b93030; }

/* Değişiklik Geçmişi tablosu — solda hizalı, normal satır yüksekliğinde
   (ders programı tablolarının ortalanmış/sabit yükseklikli düzeni burada
   uygun değil, bu bir metin listesi). */
.degisiklik-tablo th, .degisiklik-tablo td {
  text-align: left;
  height: auto;
  padding: 8px 10px;
  font-size: 12.5px;
  white-space: normal;
}
.degisiklik-tablo tbody th { position: static; }
.degisiklik-tablo td:first-child { white-space: nowrap; color: var(--soluk); }

/* ================= SAĞDAN AÇILAN YÖNETİM ÇEKMECESİ =================
   Değişiklik Geçmişi + kişisel notlar. Ayrı sayfa yerine, çalışılan
   sayfanın yanından açılıp kapanan panel. */

/* ---- Radyal (yelpaze) menü ----
   Sağ kenara sabit bir çapa; .radyal-ana butonu her zaman görünür,
   .radyal-oge butonları kapalıyken ananın altında toplu durur, açılınca
   bir yay boyunca dışarı açılır. Yay üzerindeki --x / --y kaydırmaları
   app.js'teki radyalOgeleriYerlestir() tarafından her öğeye yazılır. */
.radyal-menu {
  position: fixed;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
  z-index: 46;
  width: 0;
  height: 0;
}

.radyal-ana {
  position: absolute;
  right: 8px;
  top: 50%;
  margin-top: -24px;
  width: 48px;
  height: 48px;
  display: grid;
  place-items: center;
  border: 1px solid var(--cizgi);
  border-radius: 50%;
  background: var(--kart);
  color: var(--murekkep);
  box-shadow: var(--golge-1);
  cursor: pointer;
  transition: background var(--gecis), color var(--gecis), border-color var(--gecis), transform var(--gecis);
}
.radyal-ana:hover { color: var(--vurgu-buton); }
.radyal-ana svg {
  position: absolute;
  width: 24px;
  height: 24px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.7;
  stroke-linecap: round;
  stroke-linejoin: round;
  transition: opacity var(--gecis), transform var(--gecis);
}
.radyal-ana-kapat { opacity: 0; transform: rotate(-45deg) scale(.7); }
.radyal-menu.acik .radyal-ana {
  background: var(--vurgu-buton);
  color: #fff;
  border-color: transparent;
}
.radyal-menu.acik .radyal-ana-ac { opacity: 0; transform: rotate(45deg) scale(.7); }
.radyal-menu.acik .radyal-ana-kapat { opacity: 1; transform: rotate(0) scale(1); }

/* Açılınca ananın arkasında beliren yumuşak ışık — sadece süs. */
.radyal-blob {
  position: absolute;
  right: -40px;
  top: 50%;
  width: 300px;
  height: 300px;
  margin-top: -150px;
  border-radius: 50%;
  background: radial-gradient(circle at 72% 50%,
              var(--vurgu-yumusak) 0%, rgba(124, 92, 255, .14) 38%, transparent 70%);
  opacity: 0;
  transform: scale(.35);
  transform-origin: 78% 50%;
  transition: opacity var(--gecis), transform var(--gecis);
  pointer-events: none;
}
.radyal-menu.acik .radyal-blob { opacity: 1; transform: scale(1); }

.radyal-ogeler {
  position: absolute;
  right: 8px;
  top: 50%;
}
.radyal-oge {
  position: absolute;
  right: 3px;
  top: 0;
  margin-top: -21px;
  width: 42px;
  height: 42px;
  display: grid;
  place-items: center;
  border: 1px solid var(--cizgi);
  border-radius: 50%;
  background: var(--kart);
  color: var(--murekkep);
  box-shadow: var(--golge-1);
  cursor: pointer;
  opacity: 0;
  visibility: hidden;
  transform: translate(0, 0) scale(.3);
  pointer-events: none;
  transition: transform var(--gecis), opacity var(--gecis), color var(--gecis),
              border-color var(--gecis), visibility var(--gecis);
}
.radyal-oge svg {
  width: 20px;
  height: 20px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.7;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.radyal-oge:hover,
.radyal-oge:focus-visible { color: var(--vurgu-buton); border-color: var(--vurgu-buton); }

.radyal-menu.acik .radyal-oge {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transform: translate(var(--x, 0), var(--y, 0)) scale(1);
  transition-delay: calc(var(--i, 0) * 28ms);
}

.radyal-etiket {
  position: absolute;
  right: calc(100% + 10px);
  top: 50%;
  transform: translateY(-50%) translateX(6px);
  white-space: nowrap;
  font-size: 12px;
  font-weight: 700;
  background: var(--murekkep);
  color: var(--zemin);
  padding: 3px 8px;
  border-radius: 6px;
  opacity: 0;
  pointer-events: none;
  transition: opacity var(--gecis), transform var(--gecis);
}
.radyal-oge:hover .radyal-etiket,
.radyal-oge:focus-visible .radyal-etiket {
  opacity: 1;
  transform: translateY(-50%) translateX(0);
}

.cekmece {
  position: fixed;
  top: 0; right: 0; bottom: 0;
  width: 440px;
  max-width: 100%;
  z-index: 47;
  background: var(--zemin);
  border-left: 1px solid var(--cizgi);
  box-shadow: var(--golge-2);
  transform: translateX(100%);
  transition: transform var(--gecis);
  display: flex;
  flex-direction: column;
}
.cekmece.acik { transform: translateX(0); }

.cekmece-bas {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 10px 12px;
  background: var(--kart);
  border-bottom: 1px solid var(--cizgi);
}
.cekmece-sekmeler { display: flex; gap: 4px; flex: 1; min-width: 0; }
.cekmece-sekme {
  font: inherit;
  font-size: 12.5px;
  font-weight: 700;
  padding: 7px 12px;
  border: 1px solid transparent;
  border-radius: 8px;
  background: none;
  color: var(--soluk);
  cursor: pointer;
  white-space: nowrap;
}
.cekmece-sekme:hover { background: var(--vurgu-yumusak); }
.cekmece-sekme.aktif { background: var(--vurgu-yumusak); color: var(--vurgu-buton); border-color: var(--cizgi); }
.cekmece-kapat {
  flex: 0 0 auto;
  width: 32px; height: 32px;
  border: 1px solid var(--cizgi);
  border-radius: 8px;
  background: none;
  color: var(--soluk);
  font-size: 20px;
  line-height: 1;
  cursor: pointer;
}
.cekmece-kapat:hover { background: var(--vurgu-yumusak); color: var(--murekkep); }

.cekmece-govde { flex: 1; overflow-y: auto; padding: 14px; }
.cekmece-ipucu { margin: 0 0 10px; font-size: 11.5px; color: var(--soluk); }
.cekmece-yedek {
  background: var(--kart);
  border: 1px solid var(--cizgi);
  border-radius: var(--r);
  padding: 12px;
  margin-bottom: 14px;
}
.cekmece-yedek .cekmece-ipucu { margin: 8px 0 0; }

/* --- kişisel notlar --- */

.not-ekle { display: flex; flex-direction: column; gap: 8px; margin-bottom: 12px; }
.not-ekle .dugme { align-self: flex-end; }

#not-yeni,
.not-duzenle-alani {
  width: 100%;
  resize: vertical;
  font: inherit;
  font-size: 13.5px;
  line-height: 1.6;
  padding: 10px 12px;
  border: 1px solid var(--cizgi);
  border-radius: var(--r);
  background: var(--kart);
  color: var(--murekkep);
}

.not-kart {
  background: var(--kart);
  border: 1px solid var(--cizgi);
  border-radius: var(--r);
  padding: 10px 12px;
}
.not-kart + .not-kart { margin-top: 8px; }

.not-bas { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 6px; }
.not-tarih { font-size: 11.5px; font-weight: 600; color: var(--soluk); }

/* İşlem düğmeleri yalnızca simge — yazı yer kaplamasın; anlamı title ve
   aria-label'da (ekran okuyucu ve fareyle bekleme için). */
.not-islemler { display: flex; gap: 2px; flex: 0 0 auto; }
.not-ikon {
  width: 28px; height: 28px;
  display: grid; place-items: center;
  border: none; border-radius: 7px;
  background: none; color: var(--soluk);
  cursor: pointer;
}
.not-ikon svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.not-ikon:hover { background: var(--vurgu-yumusak); color: var(--vurgu-buton); }
.not-ikon[data-eylem="sil"]:hover { background: #fdecea; color: #d03b3b; }

.not-govde { font-size: 13.5px; line-height: 1.55; white-space: pre-wrap; overflow-wrap: anywhere; }

/* --- geçmiş kayıtları (tıklayınca açılan ayrıntı) --- */

.gecmis-kayit {
  background: var(--kart);
  border: 1px solid var(--cizgi);
  border-radius: var(--r);
  overflow: hidden;
}
.gecmis-kayit + .gecmis-kayit { margin-top: 8px; }

.gecmis-bas {
  display: block;
  width: 100%;
  text-align: left;
  font: inherit;
  background: none;
  border: none;
  padding: 10px 12px;
  cursor: pointer;
  color: var(--murekkep);
}
.gecmis-bas:disabled { cursor: default; }
.gecmis-bas:hover:not(:disabled) { background: var(--vurgu-yumusak); }
.gecmis-ust { display: flex; justify-content: space-between; align-items: baseline; gap: 10px; }
.gecmis-islem { font-size: 13px; font-weight: 700; }
.gecmis-tarih { font-size: 11.5px; color: var(--soluk); white-space: nowrap; }
.gecmis-kim,
.gecmis-kapsam { display: block; font-size: 11.5px; color: var(--soluk); margin-top: 2px; }
.gecmis-ozet {
  display: flex; justify-content: space-between; align-items: center; gap: 8px;
  margin-top: 6px; font-size: 12.5px; font-weight: 600; color: var(--vurgu-buton);
}
.gecmis-ok { transition: transform var(--gecis); }
.gecmis-bas.acik .gecmis-ok { transform: rotate(180deg); }

.gecmis-detay { border-top: 1px solid var(--cizgi); padding: 10px 12px; }
.gecmis-grup + .gecmis-grup { margin-top: 10px; }
.gecmis-grup h4 {
  margin: 0 0 4px;
  font-size: 11px; font-weight: 800;
  letter-spacing: .06em; text-transform: uppercase;
}
.gecmis-grup-eklendi h4 { color: #16a34a; }
.gecmis-grup-silindi h4 { color: #d03b3b; }
.gecmis-grup-degisti h4 { color: #9a5820; }
.gecmis-grup ul { margin: 0; padding-left: 18px; }
.gecmis-grup li { font-size: 12px; color: var(--murekkep); margin-bottom: 2px; }

@media (max-width: 720px) {
  .cekmece { width: 100%; }
  /* Radyal menüyü biraz küçült — dar ekranda yay taşmasın. */
  .radyal-ana { width: 44px; height: 44px; margin-top: -22px; }
  .radyal-ana svg { width: 22px; height: 22px; }
  .radyal-oge { width: 40px; height: 40px; margin-top: -20px; }
}

/* --- Arama sonuçları --- */
.ara-sonuc {
  background: var(--kart);
  border: 1px solid var(--cizgi);
  border-radius: var(--r);
  padding: 10px 14px;
}
.ara-sonuc + .ara-sonuc { margin-top: 8px; }
.ara-sonuc-bas { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; flex-wrap: wrap; }
/* .ad ve .detay kendi kurallarinda ortalanmis (tablo hucreleri icin) —
   listede sola yaslanmali. */
.ara-sonuc .ad { font-size: 14px; font-weight: 700; color: var(--murekkep); text-align: left; }
.ara-sonuc .detay { margin-top: 3px; font-size: 12.5px; color: var(--soluk); text-align: left; }
.ara-zaman { font-size: 12.5px; font-weight: 700; color: var(--vurgu-buton); white-space: nowrap; }

.ozet { margin: 0 0 12px; font-size: 13px; color: var(--soluk); }
.ozet strong { color: var(--murekkep); font-weight: 700; }

/* --- tablo --- */

.tablo-kutu {
  background: var(--kart);
  border: 1px solid var(--cizgi);
  border-radius: var(--r);
  overflow-x: auto;
}

/* Sütun genişlikleri ve satır yüksekliği burada elle ayarlanır. */
table {
  border-collapse: collapse;
  table-layout: fixed;
  width: 100%;
}

col.sutun-saat { width: 92px; }
/* col.sutun-gun genişliği belirtilmiyor: table-layout:fixed altında kalan
   tüm boşluğu 5 gün sütunu otomatik olarak eşit paylaşır. */

th, td {
  border: 1px solid var(--cizgi);
  padding: 4px 6px;
  text-align: center;
  vertical-align: middle;
}

thead th {
  background: var(--baslik-rengi, var(--yumusak));
  font-size: 12px;
  font-weight: 700;
  padding: 9px 6px;
}

tbody th {
  position: sticky;
  left: 0;
  z-index: 1;
  height: 62px;
  background: var(--baslik-rengi, var(--yumusak));
  font-size: 10.5px;
  font-weight: 700;
  color: var(--soluk);
  white-space: nowrap;
}

td { height: 62px; }

/* Sınav Programları (herkese açık): 15dk'lık dilimler çok daha fazla satır
   demek — bu yüzden sadece bu tabloda satırlar kısa. */
.tablo-kutu-sinav td { height: 22px; padding: 2px 4px; }
.tablo-kutu-sinav tbody th { height: 22px; font-size: 9px; padding: 2px 4px; }
.tablo-kutu-sinav thead th { font-size: 10px; padding: 6px 4px; }
.tablo-kutu-sinav .ad { font-size: 9.5px; }
.tablo-kutu-sinav .detay { font-size: 8px; margin-top: 1px; }
.tablo-kutu-sinav .ders + .ders { margin-top: 2px; padding-top: 2px; }

/* Gözetmenlik Dağılımı: gün başına ayrı bir tablo (bölüme göre sütun sayısı
   değiştiği için), aralarına boşluk; üstte bölüm adına göre gruplanmış
   colspan'li başlık satırı; hücre içindeki gözetmen ismi ayrı vurgulanır. */
.gozetmenlik-tablo-kutu { margin-bottom: 16px; }
.gozetmenlik-tablo-kutu:last-child { margin-bottom: 0; }
.gozetmenlik-birim-baslik { border-bottom: 2px solid var(--vurgu) !important; }
/* Tarih/Gün etiketi: kaydırma sırasında sabitlenmiyor (istenmiyor) —
   sadece kendi (rowspan'lı) hücresinin tam ortasında sabit duruyor. */
col.sutun-tarih { width: 88px; }
.gozetmenlik-tarih-hucre,
.derslik-gun-hucre { padding: 0; vertical-align: middle; }
.gozetmenlik-tarih-govde,
.derslik-gun-govde {
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--yumusak);
}
.gozetmenlik-tarih-govde span,
.derslik-gun-govde span {
  display: inline-block;
  transform: rotate(-90deg);
  white-space: nowrap;
  font-size: 15px;
  font-weight: 800;
  color: var(--murekkep);
}

/* Fen Fakültesi Derslik Kullanım Bilgileri — 12 derslik yan yana sütun,
   günler 90° döndürülmüş satır grubu. Sütunlar dar olduğu için yazılar
   .tablo-kutu-sinav'dakinden de küçük. */
.derslik-kullanim-tablo table { min-width: 1180px; }
.derslik-kullanim-tablo thead th { font-size: 9.5px; line-height: 1.25; }
.derslik-kullanim-tablo .derslik-kapasite {
  display: block;
  font-size: 8px;
  font-weight: 600;
  color: var(--soluk);
}
.derslik-kullanim-tablo .ad { font-size: 8.5px; }
.derslik-kullanim-tablo .detay { font-size: 7.5px; }
.derslik-kullanim-tablo .rozet { font-size: 7px; margin-left: 3px; padding: 0 3px; }

/* Satır yüksekliği SABİT: her saat satırı tam --derslik-satir kadar, bir
   dersin kutusu da kapladığı blok sayısı (--blok-sayisi) kadar. İçerik
   taşarsa satır büyümez, kutu içinde kırpılır — aksi halde uzun ders adı
   olan tek bir hücre bütün satırı (ve 12 sütunu birden) uzatıyordu. */
/* 54px: ölçüldü — kutuların ~%97'si satır başına bu yüksekliğe sığıyor.
   Sığmayan birkaç uzun adlı tek saatlik dersin metni kırpılır, tam hâli
   kutunun title'ında (fareyle üzerine gelince) görünür. Tüm tabloyu en
   uzun ada göre büyütmek 50 satırı birden gereksiz yere uzatırdı. */
.derslik-kullanim-tablo { --derslik-satir: 54px; }
.derslik-kullanim-tablo td,
.derslik-kullanim-tablo tbody th { height: var(--derslik-satir); }
.derslik-kullanim-tablo td { padding: 0; }
.derslik-kullanim-tablo .derslik-hucre-govde {
  height: calc(var(--blok-sayisi, 1) * var(--derslik-satir));
  overflow: hidden;
  padding: 2px 3px;
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  /* "safe": içerik sığıyorsa dikeyde ortalar, sığmıyorsa üste yaslar —
     ortalayıp kırpsaydı ders KODU (en kritik bilgi) üstten kesilirdi. */
  justify-content: safe center;
  gap: 2px;
}
/* .ders:only-child (Sınav Programları için) kutuyu ortalayan bir flex
   konteynerine çeviriyor; sabit yükseklikli bu tabloda içerik sığmayınca
   YUKARI taşıp ders KODUNU kesiyordu. "safe": sığarsa ortalar, sığmazsa
   üste yaslar — kod her zaman görünür kalır. */
.derslik-kullanim-tablo .derslik-hucre-govde .ders {
  overflow: hidden;
  justify-content: safe center;
}

/* Bölüm renkleri — SADECE bu sayfada (sınıf renklerinin yerine geçer).
   Mavi bölüm rozeti bilerek dokunulmadan kalıyor. */
.derslik-kullanim-tablo .ders[data-birim] { border-radius: 6px; padding: 4px 3px; }
.derslik-kullanim-tablo .ders[data-birim="matematik"] { background: #DDC7EE; }
.derslik-kullanim-tablo .ders[data-birim="btbs"] { background: #FFE5CD; }
.derslik-kullanim-tablo .ders[data-birim="biyoteknoloji"] { background: #D4F2D0; }
.derslik-kullanim-tablo .ders[data-birim="mbg"] { background: #EFC2C2; }
.derslik-kullanim-tablo .ders[data-birim] .ad { color: #1c2430; }
.derslik-kullanim-tablo .ders[data-birim] .detay { color: #46506b; }
/* Bir günün ilk satırı — gün grupları birbirinden net ayrılsın. */
.derslik-kullanim-tablo tr.derslik-gun-basi > th,
.derslik-kullanim-tablo tr.derslik-gun-basi > td { border-top: 2px solid var(--cizgi); }

/* Gözetmen Programı (herkese açık) — tablonun üzerindeki, her gözetmen
   için bir kutucuk gösteren süre şeridi. */
.gozetmenlik-sure-kutulari {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
  gap: 10px;
  margin-bottom: 16px;
}
.gozetmenlik-sure-kutu {
  background: var(--kart);
  border: 1px solid var(--cizgi);
  border-radius: var(--r);
  padding: 14px 10px;
  text-align: center;
}
.gozetmenlik-sure-kutu-vurgu { border-color: var(--vurgu); background: var(--vurgu-yumusak); }
.gozetmenlik-sure-kutu-ad { font-size: 11px; font-weight: 600; color: var(--soluk); min-height: 28px; }
.gozetmenlik-sure-kutu-deger { font-size: 24px; font-weight: 800; color: var(--vurgu); margin-top: 4px; line-height: 1.1; }
.gozetmenlik-sure-kutu-alt { font-size: 10.5px; color: var(--soluk); margin-top: 2px; }

/* Bir gözetmen seçildiğinde: büyük ızgara yerine sade, kronolojik kişisel
   liste — Öğretim Üyesi Programları'ndaki kişisel görünümün karşılığı. */
.gozetmenlik-kisisel-tablo table { table-layout: auto; }
.gozetmenlik-kisisel-tablo th, .gozetmenlik-kisisel-tablo td { text-align: left; padding: 9px 12px; }
.gozetmenlik-kisisel-tablo thead th { background: var(--yumusak); font-size: 11px; color: var(--soluk); }
.gozetmenlik-isim { font-weight: 600; color: var(--vurgu); }
.gozetmenlik-hucre-tik { cursor: pointer; }
.gozetmenlik-hucre-tik:hover { background: var(--vurgu-yumusak); }
.gozetmenlik-vurgu { background: var(--vurgu-yumusak) !important; outline: 2px solid var(--vurgu); outline-offset: -2px; }
.gozetmenlik-soluk { opacity: .35; }

/* Farklı bölümlerin habersizce aynı dersliği aynı saatte kullanması —
   her bölüm sadece kendi programını kontrol ettiği için bu tür bir
   çakışmayı ancak 4 bölümü birden gören bu tablo yakalayabilir. */
.gozetmenlik-derslik-cakisma { background: #fdecea !important; outline: 2px solid #d03b3b; outline-offset: -2px; }
.gozetmenlik-cakisma-uyari { color: #d03b3b; font-weight: 700; }

/* Henüz gözetmen atanmamış sınav — kırmızı (gerçek çakışma) ile
   karışmasın diye mavi; çakışma varsa (yukarıdaki kural) o öncelikli. */
.gozetmenlik-atanmadi { background: #e8f0fe !important; outline: 2px solid #2563eb; outline-offset: -2px; }
@media (prefers-color-scheme: dark) {
  .gozetmenlik-derslik-cakisma { background: #3a1f1f !important; }
  .gozetmenlik-atanmadi { background: #1a2b4a !important; }
}

/* height:100% (:only-child ile SADECE hücrede tek başına olduğunda —
   3+ ders üst üste geldiğinde eskisi gibi doğal yükseklikte, alt alta
   dizilmeye devam eder, bkz. ".ders + .ders" aşağıda) kutunun, kapladığı
   bloğun TAMAMINI (rowspan'lı <td>'nin gerçek yüksekliği) doldurmasını
   sağlar; flex ile içindeki yazılar (.ad/.detay) o tam yükseklik içinde
   dikeyde ortalanır — önceden kutu sadece yazı kadar yer kaplayıp
   hücrenin ortasında küçük bir ada gibi duruyordu. */
.ders {
  text-align: center;
}
.ders:only-child {
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.ders + .ders {
  margin-top: 5px;
  padding-top: 5px;
  border-top: 1px dashed var(--cizgi);
}

.ders-cift {
  display: flex;
  gap: 6px;
  height: 100%;
}
.ders-cift .ders {
  flex: 1 1 0; min-width: 0;
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.ders-cift .ders + .ders {
  margin-top: 0;
  padding-top: 0;
  border-top: none;
  padding-left: 6px;
  border-left: 1.5px solid var(--cizgi);
}

/* Herkese açık Sınav Programları: kutular sınıf düzeyine göre — Sınav
   Programı Planlama'daki .plan-dolu[data-sinif] ile BİREBİR AYNI renkler
   ve aynı sabit/koyu metin renkleri (tema fark etmeksizin okunaklı olsun). */
.ders[data-sinif] { border-radius: 6px; padding: 4px 3px; }
.ders[data-sinif="1"] { background: #D4F2D0; }
.ders[data-sinif="2"] { background: #FFE5CD; }
.ders[data-sinif="3"] { background: #EFC2C2; }
.ders[data-sinif="4"] { background: #DDC7EE; }
.ders[data-sinif] .ad { color: #1c2430; }
.ders[data-sinif] .detay { color: #46506b; }

.ad    { font-size: 12px; font-weight: 600; line-height: 1.25; text-align: center; }
.detay { margin-top: 2px; font-size: 10.5px; color: var(--soluk); text-align: center; }

.rozet {
  display: inline-block;
  margin-left: 5px;
  padding: 0 5px;
  border-radius: 4px;
  background: var(--lu-zemin);
  color: var(--lu);
  font-size: 8.5px;
  font-weight: 700;
  letter-spacing: .05em;
  vertical-align: 1.5px;
}
/* Hocanın seçili bölüm DIŞINDA, başka bir bölümdeki dersi — normal seviye
   rozetiyle (mor) karışmasın diye ayrı (mavi) renk. */
.rozet-bolum { background: var(--vurgu-yumusak); color: var(--vurgu-buton); }

.bos {
  background: var(--kart);
  border: 1px solid var(--cizgi);
  border-radius: var(--r);
  padding: 34px 20px;
  text-align: center;
  color: var(--soluk);
}

/* ================= İLETİŞİM ================= */

.iletisim { margin: 0; display: grid; grid-template-columns: 110px 1fr; gap: 10px 14px; }
.iletisim dt { font-weight: 600; color: var(--soluk); font-size: 13px; }
.iletisim dd { margin: 0; }

.iletisim-asgor-listesi { display: grid; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); gap: 12px; }
.iletisim-asgor-karti { border: 1px solid var(--cizgi); border-radius: var(--r-kucuk); padding: 12px 14px; min-width: 0; }
.iletisim-asgor-ad { font-weight: 700; font-size: 13px; line-height: 1.35; margin-bottom: 6px; overflow-wrap: break-word; }
.iletisim-asgor-rol { font-size: 11px; font-weight: 600; color: var(--vurgu); margin: -3px 0 6px; }
.iletisim-asgor-detay { font-size: 12px; color: var(--soluk); overflow-wrap: break-word; }
.iletisim-asgor-detay + .iletisim-asgor-detay { margin-top: 1px; }

/* ================= HAVUZ DERSLERİ (yönetim) ================= */

.havuz-izgara { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 16px; }
@media (max-width: 900px) { .havuz-izgara { grid-template-columns: 1fr; } }

.havuz-kutu h3 { margin: 0 0 12px; font-size: 14px; }
.havuz-form { display: flex; flex-direction: column; gap: 8px; margin-bottom: 12px; }
.havuz-form input, .havuz-form select {
  width: 100%; font: inherit; font-size: 13.5px; padding: 8px 10px;
  border: 1px solid var(--cizgi); border-radius: 8px; background: var(--kart); color: var(--murekkep);
}

.rol-checkbox-satir {
  display: flex; flex-wrap: wrap; gap: 6px 16px;
  padding: 2px 2px 4px; font-size: 13px; color: var(--murekkep);
}
.rol-checkbox-satir label { display: flex; align-items: center; gap: 6px; cursor: pointer; }

/* Açılır çoklu-seçim (ör. Sınav Ata'daki Derslik): kapalıyken tek satırlık
   bir buton, tıklanınca altına tik'li bir liste açılır — istenen kadar
   seçim tek oturumda (panel kapanmadan) yapılabilir. */
.cok-secim { position: relative; }
.cok-secim-baslik {
  width: 100%; text-align: left; padding: 8px 10px; border: 1px solid var(--cizgi); border-radius: 8px;
  background: var(--kart); color: var(--murekkep); cursor: pointer; font: inherit; font-size: 14px;
}
.cok-secim-baslik:hover { border-color: var(--vurgu); }
.cok-secim-panel {
  display: none; position: absolute; top: calc(100% + 4px); left: 0; right: 0; z-index: 20;
  background: var(--kart); border: 1px solid var(--cizgi); border-radius: 8px; box-shadow: var(--golge-2);
  padding: 8px; max-height: 180px; overflow-y: auto;
}
.cok-secim.acik .cok-secim-panel { display: block; }
.cok-secim-satir {
  padding: 7px 8px; border-radius: 6px; cursor: pointer; font-size: 13.5px; color: var(--murekkep);
}
.cok-secim-satir:hover { background: var(--vurgu-yumusak); }
.cok-secim-satir.secili { background: var(--vurgu-buton); color: #fff; font-weight: 600; }

.liste { max-height: 260px; overflow-y: auto; }
.liste-eleman {
  display: flex; justify-content: space-between; align-items: center; gap: 8px;
  padding: 7px 2px; border-bottom: 1px solid var(--cizgi); font-size: 13px;
}
.liste-eleman:last-child { border-bottom: none; }
.btn-sil, .btn-rol-sil {
  font: inherit; font-size: 11.5px; font-weight: 600; padding: 3px 9px;
  border-radius: 6px; border: 1px solid #d03b3b; background: transparent; color: #d03b3b; cursor: pointer;
  flex-shrink: 0;
}
.btn-sil:hover, .btn-rol-sil:hover { background: #d03b3b; color: #fff; }

.planlama-ust { display: flex; align-items: flex-end; gap: 14px; margin-bottom: 16px; flex-wrap: wrap; }

.plan-tum-blok { margin-bottom: 6px; }
.plan-tum-blok:last-child { margin-bottom: 0; }
.plan-tum-baslik { margin: 0 0 8px; font-size: 14px; font-weight: 700; color: var(--murekkep); }

.plan-tablo { width: 100%; border-collapse: collapse; table-layout: fixed; }
.plan-tablo th, .plan-tablo td { border: 1px solid var(--cizgi); padding: 4px; text-align: center; vertical-align: top; }
.plan-tablo thead th { background: var(--yumusak); font-size: 11.5px; padding: 8px 4px; }
.plan-tablo thead input[type="date"] {
  width: 100%; font: inherit; font-size: 11px; padding: 3px 2px;
  border: 1px solid var(--cizgi); border-radius: 5px; background: var(--kart); color: var(--murekkep);
}
.sinav-gunu-adi { margin-top: 3px; font-size: 10px; font-weight: 600; color: var(--soluk); }
.plan-tablo tbody th { background: var(--yumusak); font-size: 10px; color: var(--soluk); white-space: nowrap; width: 90px; }
/* Satır yüksekliği SABİT: hücre, kapladığı blok sayısı × 56px'i asla
   aşmaz. Eskiden yalnızca rowspan="1" hücreler sınırlıydı; uzun bir ders
   adı ya da aynı bloğa konan iki ders, bulunduğu satırı (ve dolayısıyla o
   satırdaki BÜTÜN günleri) uzatıp tablonun düzenini bozuyordu. Sınav
   Programı Planlama'da zaten uygulanan çözümün aynısı. */
.plan-hucre {
  height: 56px;
  overflow: hidden;
  cursor: pointer;
  position: relative;
}
/* NOT: <td> üzerinde max-height tarayıcılarca YOK SAYILIR; satırı gerçekten
   sabitlemenin tek yolu içeriği sabit yükseklikli bir sarmalayıcıya almak.
   .plan-govde zaten o sarmalayıcı — yüksekliği artık içeriğe göre değil,
   hücrenin kapladığı blok sayısına göre belirleniyor (padding düşülerek).
   Sadece .plan-tablo-tek (tek sınıf görünümü): "Tüm Sınıflar" bloğu ve Sınav
   Programı Planlama 22px'lik kendi ölçülerini kullanıyor. */
.plan-tablo-tek .plan-govde {
  height: calc(var(--blok-sayisi, 1) * 56px - 8px);
  overflow: hidden;
}

/* Sınav Programı Planlama: 15 dakikalık dilimler çok daha fazla satır demek
   — bu yüzden sadece bu tabloda satırlar kısa (56px yerine 22px).
   GERÇEK KÖK NEDEN (satırların içerik değiştikçe/ders taşındıkça büyüyüp
   küçülmesi): <td>/<th> hiçbir metin taşımasa BİLE, kendi (buraya kadar
   miras kalan, body'nin 14.5px'lik) font-size'ına göre görünmez bir satır
   kutusu ("strut") oluşturur — bu, gerçek içerikten (küçük puntolu
   .plan-dolu/.plan-bos-ipucu) TAMAMEN BAĞIMSIZ olarak hücreyi ~30px'e
   şişiriyordu; hangi hücrelerin bu şişmeyi "görünür" şekilde tetiklediği
   o an tabloya nelerin yerleştiği gibi tesadüfi etkenlere bağlıydı, bu
   yüzden bir ders taşınınca satırlar rastgele büyüyüp küçülüyormuş gibi
   görünüyordu. font-size:0 ile bu hayalet kutu ortadan kalkıyor (asıl
   metinler zaten kendi font-size'larını .plan-dolu/.plan-bos-ipucu'de
   ayrıca tanımlıyor, etkilenmez). max-height + --blok-sayisi (inline,
   JS'ten, sinavTeklisenTabloUret) ek bir güvenlik kırpması olarak kalıyor. */
.plan-tablo-sinav .plan-hucre {
  height: 22px;
  max-height: calc(var(--blok-sayisi, 1) * 22px);
  overflow: hidden;
  font-size: 0;
  line-height: 0;
}
.plan-tablo-sinav tbody th { height: 22px; font-size: 9px; line-height: 1.3; width: 68px; padding: 2px 4px; }
.plan-tablo-sinav .plan-dolu { padding: 2px 3px; }
.plan-tablo-sinav .plan-dolu .ad { font-size: 9.5px; margin-bottom: 0; }
.plan-tablo-sinav .plan-dolu .detay { font-size: 8px; }

/* Sağ tıkla açılan küçük bağlam menüsü (tıklanan noktada belirir). */
.baglam-menu {
  position: fixed; z-index: 200; background: var(--kart); border: 1px solid var(--cizgi);
  border-radius: 8px; box-shadow: var(--golge-2); padding: 4px; min-width: 110px;
}
.baglam-menu-oge {
  display: block; width: 100%; text-align: left; padding: 7px 10px; border: none; background: none;
  font: inherit; font-size: 13px; color: #d03b3b; cursor: pointer; border-radius: 6px;
}
.baglam-menu-oge:hover { background: var(--vurgu-yumusak); }
.plan-hucre:hover { background: var(--vurgu-yumusak); }
.plan-bos-ipucu { color: var(--soluk); font-size: 10px; opacity: .6; }
.plan-govde { height: 100%; }
.plan-govde > .plan-dolu { height: 100%; }
.plan-govde.plan-cift { display: flex; gap: 3px; }
.plan-govde.plan-cift > .plan-dolu { flex: 1 1 0; min-width: 0; margin-top: 0; }
.plan-dolu {
  background: var(--vurgu-yumusak); border-radius: 6px; padding: 3px 4px; text-align: center;
  font-size: 10.5px; line-height: normal; position: relative; cursor: grab;
  overflow: hidden;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
}
.plan-dolu + .plan-dolu { margin-top: 4px; }
.plan-dolu:active { cursor: grabbing; }
.plan-dolu .ad {
  font-weight: 700; margin-bottom: 1px; line-height: 1.15;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.plan-dolu .detay { color: var(--soluk); font-size: 9.5px; display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.plan-sil { position: absolute; top: 2px; right: 2px; border: none; background: none; color: #d03b3b; font-weight: 700; cursor: pointer; font-size: 13px; line-height: 1; padding: 2px; }
.plan-surukle-hedef { background: var(--vurgu-yumusak) !important; outline: 2px dashed var(--vurgu); outline-offset: -2px; }

/* Tüm Sınıflar: SADECE bu alt alta mini tablolarda satırlar daha kısa
   (normal tekli sınıf/hoca tablosunun 56px'lik satır yüksekliği bu kuralların
   dışında kalır ve hiç değişmez).
   NOT: genel .plan-tablo/.plan-hucre kurallarından (ve sitenin genel th/td
   kurallarından) miras kalan, satırı büyük tutan gizli bir min-yükseklik
   etkisi vardı — bu yüzden burada "all: revert" ile bu alt ağacı sıfırlayıp
   kompakt görünümü baştan, kendi kurallarıyla kuruyoruz. */
.plan-tum-blok, .plan-tum-blok * { all: revert; box-sizing: border-box; }
.plan-tum-blok { margin-bottom: 6px; font-family: "Inter", system-ui, -apple-system, Segoe UI, Roboto, sans-serif; }
.plan-tum-blok:last-child { margin-bottom: 0; }
.plan-tum-blok table.plan-tablo { border-collapse: collapse; table-layout: fixed; width: 100%; font-size: 7px; }
.plan-tum-blok th, .plan-tum-blok td { border: 1px solid var(--cizgi); padding: 1px; text-align: center; vertical-align: top; }
.plan-tum-blok thead th { background: var(--yumusak); font-size: 7.5px; padding: 2px 1px; }
.plan-tum-blok tbody th { background: var(--yumusak); font-size: 6.5px; color: var(--soluk); white-space: nowrap; width: 46px; }
.plan-tum-blok td.plan-hucre { height: 22px; cursor: pointer; position: relative; }
.plan-tum-blok td.plan-hucre:hover { background: var(--vurgu-yumusak); }
.plan-tum-blok .plan-bos-ipucu { color: var(--soluk); font-size: 6.5px; opacity: .6; }
.plan-tum-blok .plan-govde { height: 100%; }
.plan-tum-blok .plan-govde > .plan-dolu { height: 100%; }
.plan-tum-blok .plan-govde.plan-cift { display: flex; gap: 2px; }
.plan-tum-blok .plan-govde.plan-cift > .plan-dolu { flex: 1 1 0; min-width: 0; margin-top: 0; }
.plan-tum-blok .plan-dolu {
  background: var(--vurgu-yumusak); border-radius: 3px; padding: 0 2px; text-align: center;
  font-size: 6.5px; position: relative; cursor: grab; overflow: hidden;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  user-select: none; -webkit-user-select: none; -webkit-user-drag: element;
}
.plan-tum-blok .plan-dolu + .plan-dolu { margin-top: 1px; }
.plan-tum-blok .plan-dolu .ad {
  font-weight: 700; line-height: 1.1;
  display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; overflow: hidden;
}
.plan-tum-blok .plan-dolu .detay { color: var(--soluk); font-size: 5.5px; line-height: 1.1; display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.plan-tum-blok .plan-sil { position: absolute; top: -1px; right: -1px; border: none; background: none; color: #d03b3b; font-weight: 700; cursor: pointer; font-size: 8px; line-height: 1; padding: 0; }
.plan-tum-blok .plan-surukle-hedef { background: var(--vurgu-yumusak) !important; outline: 1px dashed var(--vurgu); outline-offset: -1px; }

/* Ders/Sınav Programı Planlama: kutular, dersin sınıf düzeyine göre
   (public Lisans Ders Programı'ndaki SINIF_RENK ile BİREBİR AYNI) renklenir
   — aranan sınıf tek bakışta ayırt edilsin diye. Yüksek Lisans/Doktora'da
   (data-sinif yok) varsayılan --vurgu-yumusak zemin kalır. Metin renkleri
   sabit/koyu tutuluyor (tema fark etmeksizin) çünkü pastel zeminler koyu
   temadaki varsayılan açık renkli yazıyla okunaksız olurdu. */
.plan-dolu[data-sinif="1"] { background: #D4F2D0; }
.plan-dolu[data-sinif="2"] { background: #FFE5CD; }
.plan-dolu[data-sinif="3"] { background: #EFC2C2; }
.plan-dolu[data-sinif="4"] { background: #DDC7EE; }
.plan-dolu[data-sinif] .ad { color: #1c2430; }
.plan-dolu[data-sinif] .detay { color: #46506b; }
.plan-dolu[data-sinif] .plan-sil { color: #b13030; }

.modal { display: none; position: fixed; inset: 0; z-index: 50; background: rgba(10, 14, 22, .55); align-items: center; justify-content: center; }
.modal.acik { display: flex; }
.modal-kutu { background: var(--kart); border-radius: var(--r); padding: 22px; width: 420px; max-width: 92vw; box-shadow: var(--golge-2); }
.modal-kutu h3 { margin: 0 0 4px; font-size: 15px; }

/* Fakülte Çakışma Raporu modalı — normal modaldan geniş, gövdesi kaydırılır. */
.cakisma-rapor-kutu { width: 640px; }
.cakisma-rapor-govde { max-height: 55vh; overflow-y: auto; margin: 4px 0 16px; }
.cakisma-rapor-ozet { margin: 0 0 12px; font-size: 12.5px; font-weight: 600; color: var(--murekkep); }
.cakisma-rapor-ozet.temiz { color: #2e8b4f; }
.cakisma-rapor-ozet.uyari { color: #d03b3b; }
.cakisma-rapor-gun { margin: 14px 0 6px; font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; color: var(--soluk); }
.cakisma-rapor-gun:first-child { margin-top: 0; }
.cakisma-bulgu { border: 1px solid var(--cizgi); border-left: 3px solid #d03b3b; border-radius: 8px; padding: 9px 11px; margin-bottom: 8px; }
.cakisma-bulgu-bas { font-size: 12px; color: var(--soluk); margin-bottom: 5px; display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.cakisma-rozet { font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; padding: 2px 6px; border-radius: 999px; color: #fff; }
.cakisma-rozet-derslik { background: #d03b3b; }
.cakisma-rozet-hoca { background: #b7791f; }
.cakisma-bulgu-ders { font-size: 12.5px; color: var(--murekkep); padding: 2px 0; }
.cakisma-bulgu-ders .cakisma-bolum { font-weight: 700; color: var(--soluk); }
.cakisma-rapor-bos { font-size: 12.5px; color: var(--soluk); margin: 8px 0; }
.modal-zaman { margin: 0 0 16px; font-size: 12.5px; color: var(--soluk); }
.modal-alan { display: flex; flex-direction: column; gap: 5px; margin-bottom: 12px; }
/* Bu satır ŞART. Üstteki "display: flex" bir yazar (author) kuralıdır ve
   tarayıcının varsayılan [hidden] { display: none } kuralını her zaman ezer;
   bu yüzden app.js "modal-hocalar-alan.hidden = true" dese bile kutu görünür
   kalıyordu — "Dersi veren öğretim üyeleri" alanı her derste açıktı. */
.modal-alan[hidden] { display: none; }
/* Alan altındaki küçük açıklama (ör. toplu öğretim üyesi seçimi). */
.modal-ipucu { margin: 2px 0 0; font-size: 11.5px; line-height: 1.45; color: var(--soluk); text-transform: none; }
.modal-alan label { font-size: 11px; font-weight: 600; color: var(--soluk); text-transform: uppercase; letter-spacing: .05em; }
.modal-alan input, .modal-alan select {
  width: 100%; font: inherit; font-size: 14px; padding: 9px 11px;
  border: 1px solid var(--cizgi); border-radius: 8px; background: var(--kart); color: var(--murekkep);
  transition: border-color var(--gecis);
}
.modal-alan input:focus-visible, .modal-alan select:focus-visible {
  outline: none; border-color: var(--vurgu);
}
.modal-butonlar { display: flex; gap: 10px; margin-top: 6px; }
.dugme-ikincil {
  font: inherit; font-size: 14px; font-weight: 600; padding: 9px 18px; border-radius: 8px;
  border: 1px solid var(--cizgi); background: transparent; color: var(--murekkep); cursor: pointer;
}

/* ================= YÖNETİCİ GİRİŞİ MODALI (özel tasarım) =================
   Diğer tüm modallardan farklı olarak dolgu bir arka plan yerine, bölüm
   seçim ekranıyla aynı koyu lacivert degrade + fakültenin 4 bölümüne ait
   motifler (birim seçim kartlarındakiyle birebir aynı çizimler) yavaşça
   süzülüyor — "4 bir taraftan bölüme has hareketli şekiller" isteği. */

.modal.giris-modal {
  background:
    radial-gradient(600px 200px at 100% -20%, rgba(91, 155, 245, .25), transparent 60%),
    linear-gradient(135deg, var(--bant), #101728);
}

.giris-motifler { position: absolute; inset: 0; overflow: hidden; pointer-events: none; }

.giris-motif {
  position: absolute;
  width: 340px; height: 340px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.6;
  stroke-linecap: round;
  stroke-linejoin: round;
  opacity: .16;
}
.giris-motif text { opacity: .55; }

.giris-motif-matematik { top: -70px; left: -70px; color: #5b9bf5; animation: girisMotifSuzul 22s ease-in-out infinite; }
.giris-motif-btbs      { top: -80px; right: -80px; color: #14b8a6; animation: girisMotifSuzul 26s ease-in-out infinite 2s reverse; }
.giris-motif-bio       { bottom: -80px; left: -60px; color: #2f9e5c; animation: girisMotifSuzul 24s ease-in-out infinite 1s; }
.giris-motif-mbg       { bottom: -90px; right: -60px; color: #9b7ee8; animation: girisMotifSuzul 28s ease-in-out infinite 3s reverse; }

@keyframes girisMotifSuzul {
  0%, 100% { transform: translate(0, 0) rotate(0deg); }
  50%      { transform: translate(16px, -20px) rotate(4deg); }
}

@media (prefers-reduced-motion: reduce) {
  .giris-motif { animation: none; }
}

@media (max-width: 720px) {
  .giris-motif { width: 220px; height: 220px; opacity: .12; }
}

.giris-modal-kutu { position: relative; z-index: 1; width: 400px; }

.giris-marka { text-align: center; margin-bottom: 16px; }
.giris-marka .logo { width: 48px; height: 48px; margin: 0 auto 8px; }
.giris-marka .marka-ad { display: block; color: var(--murekkep); font-size: 19px; font-weight: 800; letter-spacing: .02em; }
.giris-marka .marka-alt { display: block; color: var(--soluk); font-size: 12px; margin-top: 2px; }

.giris-modal-kutu h3 { text-align: center; }
.giris-modal-kutu .modal-zaman { text-align: center; margin-bottom: 20px; }

.giris-sifre-sarmal { position: relative; }
.giris-sifre-sarmal input { padding-right: 38px; }
.giris-sifre-goster {
  position: absolute;
  top: 50%; right: 3px;
  transform: translateY(-50%);
  width: 30px; height: 30px;
  display: grid; place-items: center;
  background: none; border: none; cursor: pointer;
  color: var(--soluk);
}
.giris-sifre-goster svg {
  width: 18px; height: 18px;
  fill: none; stroke: currentColor;
  stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round;
}
.giris-sifre-goster:hover { color: var(--vurgu); }

.giris-sifremi-unuttum {
  display: block;
  margin: 6px 0 0 auto;
  padding: 0;
  background: none; border: none; cursor: pointer;
  font-size: 12px;
  color: var(--soluk);
  text-decoration: underline;
}
.giris-sifremi-unuttum:hover { color: var(--vurgu); }

/* ================= MOBİL ================= */

.perde { display: none; }

@media (max-width: 900px) {
  .menu {
    position: fixed;
    left: 0; top: 0;
    z-index: 40;
    transform: translateX(-100%);
    transition: transform .22s ease;
  }
  .menu.acik { transform: translateX(0); }

  .perde.acik {
    display: block;
    position: fixed;
    inset: 0;
    z-index: 30;
    background: rgba(15, 20, 30, .45);
  }

  .hamburger { display: inline-flex; }
  .kart-izgara { grid-template-columns: 1fr; }
  .istatistik-izgara { grid-template-columns: 1fr 1fr; }
  .havuz-izgara { grid-template-columns: 1fr; }
  .icerik { padding: 16px; }
  .bant-ust { flex-direction: column; align-items: flex-start; }
}

/* --- mobil: hafta ızgarası yerine güne göre liste --- */

/* Masaüstünde liste gizli, tablo görünür. */
.hafta-gorunum > .mobil-gun-listesi { display: none; }

@media (max-width: 720px) {
  .hafta-gorunum > .tablo-kutu { display: none; }
  .hafta-gorunum > .mobil-gun-listesi { display: block; }

  /* Listeye çevrilmeyen geniş tablolar (Sınav Programları, Gözetmenlik,
     Derslik Kullanımı) ezilmek yerine yatay kaysın: table-layout:fixed
     altında 390px'e sıkışınca sütunlar okunmaz hâle geliyordu. */
  .tablo-kutu > table { min-width: 640px; }
  .gozetmenlik-tablo-kutu > table { min-width: 900px; }
  /* Değişiklik Geçmişi bir metin listesi — akmaya devam etsin. */
  .tablo-kutu > table.degisiklik-tablo { min-width: 0; }
}

.mobil-gun { margin-bottom: 18px; }
.mobil-gun:last-child { margin-bottom: 0; }
.mobil-gun h3 {
  margin: 0 0 8px;
  font-size: 13px;
  font-weight: 800;
  letter-spacing: .04em;
  text-transform: uppercase;
  color: var(--soluk);
}
.mobil-ders {
  display: flex;
  gap: 10px;
  align-items: flex-start;
  background: var(--kart);
  border: 1px solid var(--cizgi);
  border-radius: var(--r);
  padding: 10px 12px;
}
.mobil-ders + .mobil-ders { margin-top: 8px; }
.mobil-saat {
  flex: 0 0 auto;
  min-width: 84px;
  font-size: 11.5px;
  font-weight: 700;
  color: var(--vurgu-buton);
  padding-top: 1px;
}
.mobil-ders-govde { min-width: 0; }
/* .ad ve .detay'ın KENDİlerinde text-align:center var (tablo hücreleri için);
   doğrudan kural kalıtımla geleni yendiği için üst öğeye yazmak yetmiyor,
   burada ikisini de ayrıca sola yaslamak gerekiyor. */
.mobil-ders-govde .ad,
.mobil-ders-govde .detay { text-align: left; }
.mobil-ders-govde .ad { display: block; font-size: 13.5px; font-weight: 700; color: var(--murekkep); }
.mobil-ders-govde .detay { display: block; font-size: 12px; color: var(--soluk); margin-top: 2px; }

/* ================= YAZDIRMA / PDF ================= */

@media print {
  @page { size: A4 landscape; margin: 9mm; }
  body { background: #fff; color: #1c2430; font-size: 11px; }
  .menu, .ustbar, .panel-kart, .perde, .istatistik-izgara, .bant-guncelleme { display: none !important; }
  /* Yazdırmada her zaman tablo basılır; mobil liste görünümü asla. */
  .mobil-gun-listesi { display: none !important; }
  .hafta-gorunum > .tablo-kutu { display: block !important; }
  .icerik { padding: 0; max-width: none; }
  .tablo-kutu { border: none; overflow: visible; }
  table, .tablo-kutu > table, .gozetmenlik-tablo-kutu > table { min-width: 0; }
  .ad { font-size: 10.5px; }
  .detay { font-size: 9.5px; }
  h1 { font-size: 18px; }
}

@media (prefers-reduced-motion: reduce) {
  * { transition: none !important; animation: none !important; }
}