/* odoprompt — uygulama katmani.
 *
 * odo-arayuz.css TASARIM SISTEMIDIR ve DEGISTIRILMEZ. Burasi yalnizca
 * tasarim sisteminde KARSILIGI OLMAYAN, bu uygulamaya ozgu birkac yardimci
 * sinif tanimlar.
 *
 * Sistemde zaten olani burada yeniden tanimlamayin. Ilk yazimda tam tersi
 * yapildi: .kart/.rozet/.soluk/.btn-birincil gibi UYDURMA adlar kullanildi,
 * sistemdeki karsiliklari (.card/.badge/.muted/.btn-primary) yerine. Sayfalar
 * render oluyordu ama hicbir stil uygulanmiyordu. Yeni sinif eklemeden once
 *     python3 scripts/sinif_denetimi.py
 * calistirin — tanimsiz sinif kullanimini yakalar.
 */

/* --- Ust uste istiflenen bloklarin dikey ritmi ---
 *
 * Tasarim sisteminde .card MARGIN TASIMAZ; bosluklanmasi cagirana birakilmis:
 *   .grid .card  -> .grid'in gap:1rem'i
 *   .stats       -> kendi margin-bottom:1.75rem'i
 * Panel sayfalarinda kartlar dogrudan .wrap altina istifleniyor ve arada
 * HIC BOSLUK KALMIYORDU (olculdu: 0px) — kartlar birbirine yapisik ciziliyordu.
 *
 * Deger .stats'in margin-bottom'u ile ayni secildi: baslik -> sayaclar ->
 * kart -> kart boyunca TEK ritim olusuyor.
 *
 * SADECE sistemin bos biraktigi yerlere kural yaziliyor. Sistemde zaten
 * margin'i olanlara (.alert 1.1rem, .actions .5rem, .filter-row 1.1rem)
 * DOKUNULMUYOR — onlari ezmek tasarim sistemini catallastirir. */
.wrap > .card { margin-bottom: 1.75rem; }

/* Son blogun altinda .wrap'in kendi padding-bottom'u (4rem) zaten var */
.wrap > :last-child { margin-bottom: 0; }

/* Kart basligi ile govdesi arasi — .head-row sistemde margin tasimiyor */
.card > .head-row { margin-bottom: .9rem; }

/* Kart icinde ust uste gelen tablo/form — .tbl de margin tasimiyor */
.card > .tbl:not(:last-child),
.card > form:not(:last-child) { margin-bottom: 1rem; }

/* --- Sol menu basligi ile icerik basligi AYNI HIZADA ---
 *
 * Iki cubuk birbirinden bagimsiz olculendirilmisti ve alt cizgileri
 * tutmuyordu (olculdu: .side-ust alt kenar 66.3px, .ust-cubuk 58.9px
 * — 7.3px kayma). Yukseklikleri iceriklerine gore olusuyordu:
 * solda .brand'in 1.3rem'i, sagda btn-sm dugmeler.
 *
 * Cozum: ikisine de AYNI min-height verip dikey padding'i sifirliyoruz.
 * Ikisi de zaten display:flex; align-items:center oldugu icin icerik
 * kendiliginden ortalaniyor. Yatay padding'e DOKUNULMUYOR
 * (padding-block yalnizca dikeyi hedefler).
 *
 * body.dar .side-ust kisayol `padding` ile ezdigi icin secici listeye
 * ACIKCA dahil edildi — yoksa daraltilmis menude hizalama bozulurdu. */
:root { --ust-yukseklik: 3.9rem; }

.side-ust,
body.dar .side-ust,
.ust-cubuk {
  padding-block: 0;
  min-height: var(--ust-yukseklik);
}

/* --- Ust cubuk ikon dugmeleri ---
 * Metinsiz dugmeler (ara, onay, bildirim, tam ekran) kare gorunsun;
 * btn-sm yatay padding metin icin ayarli.
 * Yukseklik esitleniyor: ikon dugmeler 30px, metinli tema dugmesi 36px
 * cikiyordu — yan yana durduklari icin 6px fark goze carpiyordu. */
.ust-sag .btn-ghost { min-height: 2.25rem; }
.ust-sag .btn-ghost:not(:has(#tema-metin)) { padding-inline: .5rem; }

/* Sayac rozeti dugmenin kosesine otursun — .zil position:relative verir */
.ust-sag .zil { display: inline-flex; }

/* --- Ust cubuk sayac rozeti ---
 *
 * NEDEN .zil-sayac DEGIL: tasarim sisteminin bildirim merkezi bileseni
 * (odo-arayuz.js -> merkezSay) sayfa acilisinda BELGEDEKI ILK .zil-sayac
 * ogesini bulup icerigini `.merkez-oge.okunmamis` sayisina gore YENIDEN
 * YAZIYOR. Bizde bildirim merkezi markup'i yok, dolayisiyla sunucudan
 * gelen dogru sayac (1) sifira cekiliyor ve gizleniyordu.
 *
 * Bu yuzden ayri bir ad kullaniliyor. Gorsel olarak .zil-sayac ile ayni
 * tanimi tasir — sistemi ezmiyoruz, sahipli bir sinifin yanina kendi
 * sinifimizi koyuyoruz. Bildirim merkezi ileride eklenirse bu sinif
 * kaldirilip .zil-sayac'a donulebilir. */
.ust-sayac {
  position: absolute; top: -3px; right: -3px;
  min-width: 16px; height: 16px; padding: 0 .2rem;
  border-radius: var(--radius-full); background: var(--danger);
  color: #fff; font-size: .62rem; font-weight: 700;
  display: grid; place-items: center;
  border: 2px solid var(--yuzey);
}

/* --- Daraltilmis menude UCAN alt menu ---
 *
 * Tasarim sistemi daraltilmis kenar cubugunda alt menuyu tamamen
 * gizliyor: `body.dar .nav-alt{display:none!important}`. Bu, alt menude
 * yalnizca birkac yonetim baglantisi varken makuldu — gezinmenin geri
 * kalani ikonlarla ust seviyedeydi.
 *
 * Artik Panel disindaki TUM sayfalar bu grubun altinda. Kural oldugu gibi
 * kalsaydi menu daraltilinca SADECE PANEL'e erisilebilirdi; daralt
 * dugmesi gezinmeyi tamamen kilitlerdi.
 *
 * Cozum: daraltilmis modda alt menu, uzerine gelince (veya klavyeyle
 * odaklaninca) kenar cubugunun saginda acilan bir kutu olarak gosteriliyor.
 * .nav'in overflow-x:hidden'i kutuyu kirpardi; yalnizca daraltilmis modda
 * kaldiriliyor — orada zaten 2 oge var, kaydirma gerekmiyor.
 * Mobilde daraltma devre disi (tasarim sistemi), bu yuzden dokunmatikte
 * hover sorunu olusmuyor. */
body.dar .nav { overflow: visible; }
body.dar .nav-grup { position: relative; }

body.dar .nav-grup:hover > .nav-alt,
body.dar .nav-grup:focus-within > .nav-alt {
  display: flex !important;
  /* left:100% — kutu ogeye BITISIK; arada bosluk birakmak fareyle
     gecerken hover'i kopariyordu. */
  position: absolute; left: 100%; top: 0; z-index: 70;
  min-width: 13rem; margin: 0; padding: .4rem;
  border: 1px solid rgba(255, 255, 255, .12); border-left: 0;
  border-radius: var(--radius-md);
  background: #241634;
  box-shadow: var(--shadow-lg);
}

/* body.dar .nav a icerigi ortalar; ucan kutuda sola hizali olmali */
body.dar .nav-grup > .nav-alt a {
  justify-content: flex-start;
  padding-left: .7rem; padding-right: .7rem;
}

/* body.dar .nav-rozet gizlenir; ucan kutuda sayac gorunmeli */
body.dar .nav-grup > .nav-alt .nav-rozet { display: inline-block; }

/* --- Satir icinde birden fazla POST formu (tablo satiri eylemleri) --- */
.satir-form { display: inline-block; margin: 0 .25rem 0 0; }

/* --- Tablo hucre yardimcilari --- */
.tbl .dar { white-space: nowrap; width: 1%; }
.tbl .sag { text-align: right; }
.tbl .orta { text-align: center; }

/* Uzun metni tek satirda kirp (kaynak yollari, hata mesajlari) */
.kirp {
  max-width: 26rem; overflow: hidden;
  text-overflow: ellipsis; white-space: nowrap;
}

/* Okunmamis bildirim satiri */
.satir-okunmamis { font-weight: 600; }

/* --- Bildirim seviyesi noktasi ---
   .badge kullanmiyoruz: tablo satirinda tek karakterlik gosterge yeterli,
   rozet fazla gurultu yapiyor. */
.nokta {
  display: inline-block; width: .55rem; height: .55rem;
  border-radius: 50%; background: var(--ink-400);
}
.nokta-info    { background: var(--info,   #3b82f6); }
.nokta-success { background: var(--ok,     #16a34a); }
.nokta-warning { background: var(--warn,   #d97706); }
.nokta-error   { background: var(--danger, #dc2626); }

/* --- Onay kutusu satiri / grubu (form icinde) --- */
.onay-satir { display: flex; align-items: center; gap: .5rem; }
.onay-grup { display: flex; gap: 1.1rem; flex-wrap: wrap; }

/* --- Uzun metin blogu (bildirim govdesi, JSON, cikti) ---
   .copy-box koyu zeminlidir ve kopyalama dugmesi bekler; burada yalnizca
   okunabilir bir blok gerekiyor. */
.metin-blok {
  white-space: pre-wrap; word-break: break-word;
  font-size: .8rem; line-height: 1.55;
  padding: .75rem; border-radius: var(--radius-md, 8px);
  background: var(--surface-100); border: 1px solid var(--ink-200);
  overflow-x: auto;
}

/* --- Sayfalama devre disi oku --- */
.pasif { opacity: .4; pointer-events: none; }

/* --- Ortalanmis tek kart (oturum ici hata sayfasi) --- */
.merkez-kart { max-width: 28rem; margin: 3rem auto; text-align: center; }

/* --- Sürüm karşılaştırma (diff) ---
 *
 * Tasarim sisteminde diff karsiligi YOK; bu yuzden burada tanimli.
 * Renkler sistemin degiskenlerinden turer (--ok / --danger), sabit
 * hex yazilmaz — tema degistiginde birlikte degissin diye.
 */
.diff {
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  font-size: .8rem;
  line-height: 1.65;
  border: 1px solid var(--line, #e5e7eb);
  border-radius: var(--radius-md);
  overflow-x: auto;
  margin: .6rem 0;
}
.diff div { padding: .1rem .7rem; white-space: pre-wrap; word-break: break-word; }
.diff .d-ekle { background: color-mix(in srgb, var(--ok, #16a34a) 12%, transparent); }
.diff .d-sil  { background: color-mix(in srgb, var(--danger, #dc2626) 12%, transparent); }
.diff .d-basl {
  background: var(--surface, #f9fafb);
  color: var(--ink-500);
  font-weight: 600;
}
.diff .d-ayni { color: var(--ink-600); }

/* --- Kullanım çubukları ---
 * Grafik kutuphanesi eklemek yerine genislik yuzdesi: bagimliliksiz,
 * yazdirilabilir ve erisilebilir kaliyor.
 */
.cubuk-satir { display: flex; align-items: center; gap: .6rem; margin: .25rem 0; }
.cubuk-ad { flex: 0 0 14rem; font-size: .85rem; }
.cubuk-kap { flex: 1; background: var(--surface, #f3f4f6);
             border-radius: var(--radius-sm); height: .95rem; overflow: hidden; }
.cubuk { height: 100%; background: var(--brand-purple, #7c3aed); border-radius: inherit; }
.cubuk-sayi { flex: 0 0 4.5rem; text-align: right; font-size: .82rem;
              color: var(--ink-500); }