/* =====================================================================
   Derinlik katmanı: yönetim paneli ve giriş ekranı. app.css ve canli.css'ten sonra yüklenir.
   Dünya aynı: beyaz yüzey, tek mavi, sistem yazı tipi. Bu dosya renk değil katman ekler: açık gri zemin üzerinde beyaz kartlar,
   tek boşluk ölçeği, netleşen başlık ve rakam hiyerarşisi, kategori işaretleri, boş durum, onay bildirimi, giriş ekranı.
   Yalnız değişken kullanır (sabit renk yok); açık ve karanlık temada aynı düzen. Yazdırma kuralları burada yok (baskıda zemin beyazdır, bildirim yoktur).
   Ayrıntı: DESIGN.md "Elevation & Depth", "Kategori işaretleri", "Boş durum", "Bildirim".
   ===================================================================== */

/* ---------- Sayfa zemini: açık gri; sol menü, üst şerit ve kartlar beyaz ---------- */
@media screen {
    body.app { --bg: var(--canvas); background: var(--canvas); }
    /* Zemin üzerinde duran nötr öğeler görünür kalsın. */
    body.app .alert-info { background: var(--surface); border: 1px solid var(--border); color: var(--text-2); }
    body.app .badge:not([class*="badge-success"]):not([class*="badge-warning"]):not([class*="badge-danger"]):not([class*="badge-primary"]),
    body.app .badge-info, body.app .badge-muted { box-shadow: inset 0 0 0 1px var(--border); }
    body.app .footer { background: transparent; }
}

/* ---------- Kategori işaretleri: yalnız simge rengi (menü başlığı ve üst şerit); tablolar renksiz ---------- */
[data-simge="ogrenci"]   { --kat: var(--kat-ogrenci); }
[data-simge="akademik"]  { --kat: var(--kat-akademik); }
[data-simge="olcme"]     { --kat: var(--kat-olcme); }
[data-simge="rehberlik"] { --kat: var(--kat-rehberlik); }
[data-simge="muhasebe"]  { --kat: var(--kat-muhasebe); }
[data-simge="personel"]  { --kat: var(--kat-personel); }
[data-simge="okul"]      { --kat: var(--kat-okul); }
[data-simge="destek"]    { --kat: var(--kat-destek); }
[data-simge="iletisim"]  { --kat: var(--kat-iletisim); }
[data-simge="ayarlar"]   { --kat: var(--kat-ayarlar); }

.nav-kat-baslik { gap: .6rem; margin-top: .3rem; color: var(--text-2); font-size: var(--fs-sm); font-weight: 600; letter-spacing: 0; }
.nav-kat.is-active > .nav-kat-baslik { color: var(--text); }
.nav-kat-simge { display: grid; place-items: center; flex: none; width: 18px; height: 18px; color: var(--kat, var(--muted)); }
.nav-kat-simge .icon { width: 18px; height: 18px; vertical-align: 0; }
.nav-kat-simge:empty { display: none; }
/* Alt bağlantılar başlığın metniyle aynı hizada başlar. */
.nav-kat .nav-sub, .nav-igne .nav-sub { padding-left: calc(.6rem + 18px + .6rem); }
.nav-kat-ayar { margin-top: 1rem; }

.kat-isaret { display: inline-grid; place-items: center; flex: none; width: 22px; height: 22px; margin-right: .45rem; color: var(--kat, var(--muted)); }
.kat-isaret .icon { width: 18px; height: 18px; vertical-align: 0; }

/* Dar ekranda üst şerit sığmaz: sayfa adı zaten h1 olarak altta durur, şeritte yalnız kategori işareti ve iğne kalır ("B…" gibi kesik ad görünmez). */
@media (max-width: 600px) {
    .topbar-title-metin { display: none; }
    .topbar-title { gap: 0; }
    .kampus-secici-kompakt .icon { display: none; }
    .kampus-secici-kompakt select { min-width: 0; width: 6.75rem; }
}

/* Sol menü markası: logo varsa küçük logo */
.brand-mark img { display: block; width: 28px; height: 28px; object-fit: contain; border-radius: var(--radius-sm); }

/* ---------- Başlık hiyerarşisi: sayfa 24, bölüm 17, kart ve alt bölüm 14.5 (ağırlık kurar) ---------- */
.page-header { margin-bottom: var(--space-section); }
.page-header > div > p, .page-header > p { color: var(--muted); font-size: var(--fs-md); }
.content > h2 { margin: var(--space-xl) 0 var(--space-md); }
.content > h2:first-child, .content > .page-header + h2, .content > .sekme-seridi + h2 { margin-top: 0; }
.content > h3 { margin: var(--space-section) 0 var(--space-sm); }
.card-title, .card h3 { color: var(--text); }
.card-title { margin-bottom: var(--space-block); }

/* Rakamlar: hizalı, tek boyut. Para ve sayaç satırda kırılmaz. */
.stat-value { font-size: var(--fs-fig); line-height: 1.3; letter-spacing: -.01em; }
.table td, .table th, .kv dd, .badge, time, .pagination-links, .stat-hint, .bugun-sayi { font-variant-numeric: tabular-nums; }
.stat-label { color: var(--text-2); }

/* ---------- Tablo: başlık satırı hafifçe ayrışır; satır yüksekliği ve yoğunluk aynı ---------- */
.table thead th { background: var(--surface-2); }
.table tbody tr:hover { background: var(--surface-2); }
.table thead th:first-child { border-top-left-radius: calc(var(--radius) - 1px); }
.table thead th:last-child { border-top-right-radius: calc(var(--radius) - 1px); }
.card > .table-wrap .table thead th:first-child, .card > .table-wrap .table thead th:last-child { border-radius: 0; }
.table-wrap .table:has(.satir-eylem) thead th:last-child:empty { background: var(--surface-2); }
@media (max-width: 720px) { .table thead th:last-child:empty { background: var(--surface-2); } }

/* ---------- Kart ve modal: ince çizgi, tutarlı gölge ---------- */
.modal { box-shadow: var(--shadow-lg); }
.modal-ust { background: var(--surface); }
.modal-baslik { font-size: var(--fs-lg); }
@media screen and (prefers-reduced-motion: no-preference) {
    .js dialog.modal { transform: translateY(8px) scale(.985); }
    .js dialog.modal[open] { transform: none; }
    @starting-style { .js dialog.modal[open] { opacity: 0; transform: translateY(10px) scale(.985); } }
}
@media screen and (prefers-reduced-motion: no-preference) and (max-width: 600px) {
    .js dialog.modal { transform: translateY(16px); }
    .js dialog.modal[open] { transform: none; }
    @starting-style { .js dialog.modal[open] { transform: translateY(20px); } }
}

/* ---------- Boş durum: sade çizim, tek cümle, ilk kaydı ekle düğmesi (core::partials/bos-durum, bos_durum()) ---------- */
.empty { color: var(--text-2); }
.bos-durum { display: flex; flex-direction: column; align-items: center; gap: var(--space-block); padding: 3rem 1rem; text-align: center; color: var(--text-2); }
td > .bos-durum, .table td > .bos-durum { padding: 2.25rem 1rem; }
.bos-cizim { width: 120px; height: 88px; flex: none; }
.bos-cizim .b-arka { fill: var(--surface-2); stroke: var(--border-strong); stroke-width: 1.5; }
.bos-cizim .b-on { fill: var(--surface); stroke: var(--border-strong); stroke-width: 1.5; }
.bos-cizim .b-cizgi { stroke: var(--border-strong); stroke-width: 2; stroke-linecap: round; opacity: .65; }
.bos-cizim .b-vurgu { stroke: var(--primary); stroke-width: 2.5; stroke-linecap: round; }
.bos-cizim .b-lup { fill: var(--surface); stroke: var(--primary); stroke-width: 2.5; }
.bos-metin { margin: 0; max-width: 42ch; font-size: var(--fs-md); text-wrap: balance; }
/* Sayfa başlığında zaten tek birincil düğme var; boş durumdaki düğme ikincil yüzeydedir, yalnız artı işareti mavidir. */
.bos-eylem { margin-top: var(--space-xs); }
.bos-eylem .icon { color: var(--primary); }
@media screen and (prefers-reduced-motion: no-preference) {
    @keyframes bos-gir { from { opacity: 0; transform: translateY(4px); } }
    .bos-durum > * { animation: bos-gir var(--dur) var(--ease) backwards; }
    .bos-durum > :nth-child(2) { animation-delay: 40ms; }
    .bos-durum > :nth-child(3) { animation-delay: 80ms; }
}

/* ---------- Onay bildirimi (public/assets/js/bildirim.js) ---------- */
.bildirim-alani {
    position: fixed; right: 1.25rem; bottom: 1.25rem; z-index: 70;
    display: flex; flex-direction: column; gap: var(--space-sm); width: min(380px, calc(100vw - 2rem)); pointer-events: none;
}
.bildirim {
    pointer-events: auto; display: flex; align-items: center; gap: .65rem; padding: .6rem .4rem .6rem .8rem;
    background: var(--surface); color: var(--text); border: 1px solid var(--border-strong); border-radius: var(--radius);
    box-shadow: var(--shadow-lg); font-size: var(--fs-sm);
}
.bildirim-isaret { display: grid; place-items: center; flex: none; width: 22px; height: 22px; border-radius: 50%; background: var(--success-soft); color: var(--success); }
.bildirim-isaret .icon { width: 13px; height: 13px; vertical-align: 0; }
.bildirim-info .bildirim-isaret { background: var(--info-soft); color: var(--info); }
.bildirim-warning .bildirim-isaret { background: var(--warning-soft); color: var(--warning); }
.bildirim-error .bildirim-isaret { background: var(--danger-soft); color: var(--danger); }
.bildirim-metin { flex: 1; min-width: 0; overflow-wrap: anywhere; }
.bildirim-kapat {
    display: grid; place-items: center; flex: none; width: 28px; height: 28px; padding: 0; border: 0; border-radius: var(--radius-sm);
    background: transparent; color: var(--muted); cursor: pointer;
}
.bildirim-kapat:hover { background: var(--surface-2); color: var(--text); }
.bildirim-kapat .icon { width: 15px; height: 15px; vertical-align: 0; }
@media (pointer: coarse) { .bildirim-kapat { width: 44px; height: 44px; margin: -.6rem 0; } }
@media (max-width: 900px) { body:has(.geri-al) .bildirim-alani { bottom: 5rem; } }
@media (max-width: 600px) { .bildirim-alani { left: .5rem; right: .5rem; bottom: .5rem; width: auto; } }
@media screen and (prefers-reduced-motion: no-preference) {
    @keyframes bildirim-gir { from { opacity: 0; transform: translateY(8px); } }
    @keyframes bildirim-git { to { opacity: 0; transform: translateY(4px); } }
    .bildirim { animation: bildirim-gir var(--dur) var(--ease) backwards; }
    .bildirim.bildirim-kapaniyor { animation: bildirim-git 140ms ease-in forwards; }
}
@media print { .bildirim-alani { display: none !important; } }

/* Geri al bildirimi: yan çizgi yok, bildirimle aynı yüzey */
.geri-al { border-left-width: 1px; border-left-color: var(--border-strong); }

/* ---------- Öğrenci kartı başlığı: fotoğraf, ad, rozetler tek beyaz yüzeyde ---------- */
.ogrenci-kart-baslik {
    align-items: center; padding: var(--space-card); margin-bottom: var(--space-card);
    background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); box-shadow: var(--shadow-sm);
}
.ogrenci-kart-baslik .ogrenci-baslik { gap: 1.25rem; }
.ogrenci-kart-baslik h1 { margin-bottom: .2rem; }
.ogrenci-kart-baslik p { margin: 0; color: var(--text-2); font-size: var(--fs-md); }
.ogrenci-kart-baslik .ogrenci-foto {
    width: 80px; height: 96px; background: var(--primary-soft); border-color: var(--border); color: var(--primary);
    font-size: var(--fs-xl);
}
.ogrenci-kart-baslik .ogrenci-rozetler { margin-top: .55rem; }
@media (max-width: 560px) {
    .ogrenci-kart-baslik { padding: var(--space-block); }
    .ogrenci-kart-baslik .ogrenci-foto { width: 64px; height: 80px; font-size: var(--fs-lg); }
}

/* ---------- Giriş ekranı ---------- */
body.giris { display: block; place-items: normal; min-height: 0; padding: 0; background: var(--canvas); }
.giris-sayfa { display: grid; grid-template-columns: minmax(0, 1fr); min-height: 100vh; min-height: 100dvh; }
.giris-alan { display: grid; place-items: center; padding: 3.5rem 1.25rem 2.5rem; }
.giris-kutu {
    width: 100%; max-width: 400px; padding: 2.25rem 2rem 1.75rem;
    background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); box-shadow: var(--shadow-sm);
}
.giris-marka { display: flex; align-items: center; gap: .85rem; margin-bottom: 2rem; }
.giris-logo { display: grid; place-items: center; flex: none; width: 44px; height: 44px; color: var(--primary); }
.giris-logo img { display: block; max-width: 44px; max-height: 44px; object-fit: contain; }
.giris-logo .icon { width: 30px; height: 30px; vertical-align: 0; }
.giris-okul { font-size: var(--fs-lg); font-weight: 600; line-height: 1.25; text-wrap: balance; }
.giris .login-card .card-title { margin-bottom: var(--space-card); }
.giris .login-card .muted { margin: 0; }
.giris-gorsel { display: none; }
@media (min-width: 900px) {
    .giris-fotolu { grid-template-columns: minmax(420px, 5fr) 7fr; }
    .giris-fotolu .giris-alan { background: var(--surface); padding: 2.5rem 3rem; }
    .giris-fotolu .giris-kutu { max-width: 380px; padding: 0; background: none; border: 0; box-shadow: none; }
    .giris-fotolu .giris-gorsel { display: block; position: relative; overflow: hidden; background: var(--surface-2); }
    .giris-fotolu .giris-gorsel img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; display: block; }
    .giris-fotolu .minimal-theme .btn { background: var(--surface); border: 1px solid var(--border); box-shadow: var(--shadow-btn); }
}
:root[data-theme="dark"] .giris-gorsel img { filter: brightness(.75); }
@media (max-width: 420px) {
    .giris-alan { padding: 3.5rem .75rem 1.25rem; align-items: start; }
    .giris-kutu { padding: 1.75rem 1.25rem 1.5rem; }
}
@media screen and (prefers-reduced-motion: no-preference) {
    @keyframes giris-gir { from { opacity: 0; transform: translateY(var(--rise)); } }
    .giris-kutu { animation: giris-gir var(--dur-slow) var(--ease) backwards; }
    .giris-gorsel img { animation: canli-soluk 400ms ease-out backwards; }
}
