/* =========================================================================
   Nova School arayüzü
   1. aşama: STOYS V2 ekran düzeni birebir (renkler, ölçüler, yazı tipi).
   Renkler tek yerde (:root) toplandı; arayüz revizyonunda buradan değişecek.
   ========================================================================= */

:root {
    --mavi: #0090d9;          /* üst çubuk, ana düğmeler, seçili öğe */
    --mavi-koyu: #007dbd;
    --mavi-bant: #0b78b8;     /* ana sayfa karşılama bandı, seçili görünüm düğmesi */
    --mavi-yazi: #0a6fa8;     /* açık zemin üzerindeki mavi yazı */
    --mavi-zemin: #f2f8fd;    /* seçili satır / kart zemini */
    --mavi-rozet: #e1f1fb;
    --mavi-arama: #0a7fc4;    /* üst çubuktaki arama kutusu */
    --mavi-acik: #57a6e8;     /* sonuç kartı üst çizgisi */
    --turkuaz: #0aa699;       /* Excel / Sonraki */
    --turkuaz-koyu: #09958a;
    --kirmizi: #f35958;       /* Yazdır */
    --kirmizi-koyu: #e04b4a;
    --mor: #a07cc5;
    --zemin: #eff0f2;         /* sayfa zemini */
    --kart: #ffffff;
    --kart-alt: #f6f7f9;      /* kart alt şeridi / araç çubuğu */
    --cizgi: #e5e9ec;         /* kutu kenarları */
    --cizgi-ince: #eceef1;
    --satir-zebra: #f5f6f8;
    --yazi: #505458;          /* genel yazı */
    --yazi-koyu: #2a2e36;
    --yazi-soluk: #8b91a0;
    --menu-yazi: #2f3237;
    --yazi-tipi: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
}

* { box-sizing: border-box; }
[hidden] { display: none !important; }
html, body { margin: 0; padding: 0; }
body {
    font-family: var(--yazi-tipi);
    font-size: 13px;
    color: var(--yazi);
    background: var(--zemin);
    -webkit-font-smoothing: antialiased;
}
a { color: var(--mavi); text-decoration: none; }
a:hover { color: var(--mavi-koyu); }
button, input, select, textarea { font-family: inherit; font-size: inherit; color: inherit; }
b, strong { font-weight: 600; }
.ikon { width: 16px; height: 16px; flex: none; display: inline-block; vertical-align: -3px; }

/* ---------------------------------------------------------------- üst çubuk */
/* Beyaz şerit, altında mavi çizgi; solda logo + kurum adı, köşeli arama kutusu (tasarım B) */
:root { --ust-yukseklik: 62px; }
.ust {
    position: fixed; top: 0; left: 0; right: 0; z-index: 30;
    height: var(--ust-yukseklik); background: #fff; color: var(--yazi-koyu);
    border-bottom: 3px solid var(--mavi);
    display: flex; align-items: center; padding: 0 0 0 10px;
}
.ust-menu-dugme {
    width: 44px; height: 44px; border: 0; background: none; color: #5b5f66; cursor: pointer; border-radius: 3px;
    display: flex; align-items: center; justify-content: center;
}
.ust-menu-dugme:hover { background: #f1f4f7; color: var(--mavi); }
.ust-menu-dugme .ikon { width: 22px; height: 22px; }
.ust-logo { display: flex; align-items: center; margin: 0 18px 0 8px; }
.ust-logo img { height: 28px; width: auto; display: block; }
.ust-ayrac { width: 1px; height: 30px; background: var(--cizgi); margin-right: 18px; flex: none; }
.ust-kurum { font-size: 18px; font-weight: 400; letter-spacing: .1px; white-space: nowrap; margin-right: 28px; color: var(--yazi-koyu); }
.ust-kurum:hover { color: var(--mavi); }
.ust-ara { width: 420px; max-width: 30vw; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); }
@media (max-width: 1200px) { .ust-ara { position: relative; left: auto; top: auto; transform: none; } }
.ust-ara .ikon { position: absolute; left: 12px; top: 11px; width: 15px; height: 15px; color: #8b91a0; pointer-events: none; }
.ust-ara input {
    width: 100%; height: 38px; border: 1px solid var(--cizgi); border-radius: 2px; padding: 0 12px 0 36px;
    background: #f4f6f8; color: var(--yazi-koyu); font-size: 13px; outline: none;
}
.ust-ara input:focus { background: #fff; border-color: #a9c7e4; }
.ust-ara input::placeholder { color: #8b91a0; }
.ust-sag { margin-left: auto; display: flex; align-items: center; height: 100%; }
.ust-ikonlar { display: flex; gap: 2px; padding-right: 12px; border-right: 1px solid var(--cizgi); height: 34px; align-items: center; }
.ust-ikonlar > a { color: #5b5f66; width: 40px; height: 40px; border-radius: 3px; display: flex; align-items: center; justify-content: center; position: relative; }
.ust-ikonlar > a:hover { background: #f1f4f7; color: var(--mavi); }
.ust-ikonlar > a .ikon, .bildirim-kap > button .ikon { width: 19px; height: 19px; }
.ust-kullanici { display: flex; align-items: center; gap: 10px; padding: 0 16px; color: var(--yazi-koyu); cursor: pointer; position: relative; height: 100%; }
.ust-kullanici-yazi { text-align: right; line-height: 1.3; }
.ust-kullanici-ad { font-size: 13px; }
.ust-kullanici-ad b { font-weight: 700; }
.ust-kullanici-sube { font-size: 11.5px; color: #6b7079; }
.ust-ikonlar .bildirim-kap > button { color: #5b5f66; width: 40px; height: 40px; border-radius: 3px; display: flex; align-items: center; justify-content: center; position: relative; border: 0; background: none; cursor: pointer; }
.ust-ikonlar .bildirim-kap > button:hover, .ust-ikonlar .bildirim-kap > button[aria-expanded="true"] { background: #f1f4f7; color: var(--mavi); }
.ust-rozet { position: absolute; top: 4px; right: 3px; min-width: 16px; height: 16px; padding: 0 4px; border-radius: 8px; background: #d63b3a; color: #fff; font-size: 10px; font-weight: 700; line-height: 16px; text-align: center; }
.bildirim-kap { position: relative; }
.bildirim-liste { position: absolute; top: 48px; right: -60px; width: 340px; background: #fff; border-radius: 4px; box-shadow: 0 8px 28px rgba(0,0,0,.16); z-index: 40; padding: 6px 0; }
.bildirim-baslik { font-size: 12px; font-weight: 600; color: var(--yazi-soluk); text-transform: uppercase; padding: 8px 16px 6px; }
.bildirim-liste a { display: flex; gap: 10px; align-items: flex-start; padding: 10px 16px; color: var(--yazi); font-size: 13px; line-height: 1.4; }
.bildirim-liste a:hover { background: #f5f8fb; }
.bildirim-liste a.onemli { color: var(--yazi-koyu); font-weight: 500; }
.bildirim-liste a .ikon { margin-top: 1px; color: var(--mavi); }
.bildirim-bos { padding: 14px 16px; color: var(--yazi-soluk); font-size: 13px; }
.ara-sonuc { position: absolute; top: 42px; left: 0; right: 0; background: #fff; border-radius: 3px; box-shadow: 0 8px 28px rgba(0,0,0,.16); z-index: 40; max-height: 70vh; overflow-y: auto; padding: 4px 0; }
.ara-sonuc .grup { font-size: 11px; font-weight: 600; color: var(--yazi-soluk); text-transform: uppercase; padding: 9px 14px 4px; }
.ara-sonuc a { display: block; padding: 7px 14px; color: var(--yazi-koyu); font-size: 13px; }
.ara-sonuc a small { display: block; color: var(--yazi-soluk); font-size: 11.5px; margin-top: 1px; }
.ara-sonuc a:hover, .ara-sonuc a.secili { background: #eef6fc; }
.ara-sonuc .bos { padding: 12px 14px; color: var(--yazi-soluk); font-size: 13px; }
.avatar-harf { width: 36px; height: 36px; border-radius: 50%; background: var(--mavi); color: #fff; display: flex; align-items: center; justify-content: center; font-weight: 700; font-size: 13px; flex: none; }
.avatar { width: 34px; height: 34px; border-radius: 50%; background: #e6e8eb; overflow: hidden; display: flex; align-items: flex-end; justify-content: center; }
.avatar img { width: 100%; height: 100%; object-fit: cover; }
.avatar svg { width: 28px; height: 28px; color: #4a4e55; }
.kullanici-acilir {
    display: none; position: absolute; top: 56px; right: 8px; min-width: 190px;
    background: #fff; border-radius: 3px; box-shadow: 0 6px 24px rgba(0,0,0,.15); padding: 6px 0; z-index: 40;
}
.kullanici-acilir.acik { display: block; }
.kullanici-acilir a, .kullanici-acilir button {
    display: flex; align-items: center; gap: 9px; width: 100%; padding: 9px 16px; color: var(--yazi-koyu);
    background: none; border: 0; text-align: left; cursor: pointer; font-size: 13px;
}
.kullanici-acilir a:hover, .kullanici-acilir button:hover { background: #f3f5f7; }
.kullanici-acilir hr { border: 0; border-top: 1px solid var(--cizgi-ince); margin: 5px 0; }

/* ------------------------------------------------------------------ sol menü */
/* Masaüstü: hep açık yan çubuk (252px), « ile 58px simge çubuğuna daralır.
   Alt menü (2. sütun) çubuğun sağında, içeriğin üstünde açılır. */
:root { --menu-genislik: 252px; }
html.menu-dar { --menu-genislik: 58px; }
.menu-ortu { display: none; }
.menu-panel { position: fixed; top: var(--ust-yukseklik); left: 0; bottom: var(--bant-yukseklik); z-index: 25; display: flex; }
.menu-sutun1 {
    width: var(--menu-genislik); background: #fff; border-right: 1px solid #eceef1;
    display: flex; flex-direction: column; transition: width .18s ease;
}
.menu-liste { flex: 1; overflow-y: auto; overflow-x: hidden; padding: 8px 0 16px; }
.menu-oge {
    display: flex; align-items: center; gap: 13px; padding: 0 20px; height: 37px; position: relative; border-bottom: 1px solid #eceef1;
    color: var(--menu-yazi); font-size: 14px; cursor: pointer; white-space: nowrap;
}
.menu-oge .ikon { color: #5b5f66; width: 17px; height: 17px; }
.menu-oge:hover, .menu-oge.secili, .menu-oge.aktif { color: var(--mavi); }
.menu-oge:hover .ikon, .menu-oge.secili .ikon, .menu-oge.aktif .ikon { color: var(--mavi); }
.menu-oge.aktif::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 3px; background: var(--mavi); }
.menu-oge.aktif { background: var(--mavi-zemin); font-weight: 600; }
.menu-oge.secili { background: color-mix(in srgb, var(--mavi) 4%, #fff); }
.menu-daralt {
    display: flex; align-items: center; gap: 13px; height: 42px; padding: 0 20px; border: 0; border-top: 1px solid #eceef1;
    background: #fff; color: var(--yazi-soluk); font-size: 13px; cursor: pointer; white-space: nowrap; overflow: hidden;
}
.menu-daralt:hover { color: var(--mavi); background: #f7f9fb; }
.menu-daralt svg { width: 17px; height: 17px; flex: none; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; transition: transform .18s; }
html.menu-dar .menu-daralt svg { transform: rotate(180deg); }
html.menu-dar .menu-ad { display: none; }
html.menu-dar .menu-oge, html.menu-dar .menu-daralt { justify-content: center; padding: 0; }
.menu-telif { font-size: 10.5px; color: #a3aab5; text-align: center; padding: 2px 0 8px; }

.menu-sutun2 {
    position: absolute; top: 0; bottom: 0; left: var(--menu-genislik); width: 300px;
    background: #fbfbfc; border-right: 1px solid #eceef1; box-shadow: 8px 0 24px rgba(20, 30, 50, .08);
    padding: 22px 0; overflow-y: auto; display: none;
}
.menu-sutun2.acik { display: block; }
.menu-grup { display: none; }
.menu-grup.acik { display: block; }
.menu-grup-baslik { font-size: 12px; font-weight: 600; color: var(--yazi-soluk); text-transform: uppercase; padding: 0 22px 12px 25px; letter-spacing: .1px; }
.menu-grup a { display: block; padding: 9px 22px 9px 25px; color: var(--menu-yazi); font-size: 14px; border-bottom: 1px solid #eceef1; position: relative; }
.menu-grup a:first-of-type { border-top: 1px solid #eceef1; }
.menu-grup a:hover, .menu-grup a.aktif { color: var(--mavi); }
.menu-grup a:hover { background: #f4f8fb; }
.menu-grup a.aktif { font-weight: 600; background: var(--mavi-zemin); }
.menu-grup a.aktif::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 3px; background: var(--mavi); }

/* ------------------------------------------------------------ sayfa iskeleti */
.sayfa { padding-top: var(--ust-yukseklik); padding-bottom: var(--bant-yukseklik); min-height: 100vh; margin-left: var(--menu-genislik); transition: margin-left .18s ease; }
.alt-baslik {
    background: #fff; height: 40px; display: flex; align-items: center; position: relative;
    box-shadow: 0 1px 2px rgba(0,0,0,.05); padding: 0 14px;
}
.yol { font-size: 13px; color: var(--yazi); white-space: nowrap; }
.yol span { color: var(--yazi-soluk); margin: 0 6px; font-size: 11px; }
.yol b { color: var(--yazi-koyu); font-weight: 600; }
.sekmeler { position: absolute; left: 50%; transform: translateX(-50%); display: flex; height: 100%; }
.sekmeler a {
    display: flex; align-items: center; padding: 0 10px; height: 100%; color: var(--yazi-koyu); font-size: 13.5px;
    border-bottom: 3px solid transparent; padding-top: 3px; white-space: nowrap;
}
.sekmeler a.secili { border-bottom-color: var(--mavi); font-weight: 600; }
.sekmeler a:hover { color: var(--mavi); }
.icerik { padding: 22px 12px; }
.icerik-dar { max-width: 940px; margin: 0 auto; }

/* ------------------------------------------------------------------- kartlar */
.kart { background: var(--kart); border-radius: 5px; box-shadow: 0 1px 2px rgba(0,0,0,.04); margin-bottom: 22px; }
.kart-baslik {
    padding: 0 15px; height: 46px; display: flex; align-items: center; border-bottom: 1px solid var(--cizgi-ince);
    font-size: 14.5px; color: var(--yazi-koyu); font-weight: 500; background: #fafbfb; border-radius: 5px 5px 0 0;
}
.kart-baslik.ortali { justify-content: center; background: #fff; }
.kart-baslik .sag { margin-left: auto; }
.kart-govde { padding: 20px; }
.kart-alt { background: var(--kart-alt); padding: 19px 20px; display: flex; justify-content: flex-end; gap: 10px; border-radius: 0 0 5px 5px; }
.kart.sonuc { border-top: 4px solid var(--mavi-acik); }
.kart.sonuc .kart-baslik { background: #fff; }
.mini-dugme {
    width: 30px; height: 30px; border-radius: 3px; background: var(--mavi); color: #fff;
    display: inline-flex; align-items: center; justify-content: center;
}
.mini-dugme:hover { color: #fff; background: var(--mavi-koyu); }

/* ------------------------------------------------------------------- ızgara */
.satir { display: flex; flex-wrap: wrap; margin: 0 -15px; }
.sutun { padding: 0 15px; }
.s-3 { width: 25%; } .s-4 { width: 33.333%; } .s-6 { width: 50%; } .s-12 { width: 100%; } .s-1 { width: 8.333%; } .s-2 { width: 16.666%; } .s-5 { width: 41.666%; } .s-8 { width: 66.666%; } .s-9 { width: 75%; }
.anasayfa .satir { margin: 0 -15px; }
.anasayfa .s-6 { padding: 0 15px; }

/* ------------------------------------------------------------------ formlar */
.alan { margin-bottom: 16px; }
.alan label { display: block; font-size: 13.5px; color: var(--yazi); margin-bottom: 7px; }
.girdi, .secim, textarea.girdi {
    width: 100%; height: 37px; border: 1px solid var(--cizgi); border-radius: 3px; background: #fff;
    padding: 6px 10px; font-size: 13px; color: #282323; outline: none; transition: border-color .15s;
}
textarea.girdi { height: auto; min-height: 92px; resize: vertical; }
.girdi:focus, .secim:focus { border-color: #a9c7e4; box-shadow: 0 0 0 1px #f1f6fb; }
.girdi[readonly] { background: #e5e8eb; border-color: #e5e8eb; }
.secim {
    appearance: none; -webkit-appearance: none; padding-right: 28px; cursor: pointer;
    background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8' height='5'%3E%3Cpath d='M0 0h8L4 5z' fill='%23b9bcc2'/%3E%3C/svg%3E") no-repeat right 12px center;
}
.hata-yazi { color: var(--kirmizi); font-size: 12px; margin-top: 5px; }
.girdi.hatali, .secim.hatali { border-color: #f3a5a4; }
.girdi-ikonlu { position: relative; }
.girdi-ikonlu .girdi { padding-right: 34px; }
.girdi-ikonlu .ikon { position: absolute; right: 11px; top: 11px; width: 14px; height: 14px; color: #d4d7db; }

/* çoklu seçim ("4 öge seçildi") */
.onay-kutu { display: flex !important; align-items: center; gap: 8px; cursor: pointer; }
.onay-kutu input { width: 16px; height: 16px; margin: 0; accent-color: var(--mavi); }
.yetki-izgara { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 16px; }
.yetki-grup { border: 1px solid var(--cizgi); border-radius: 5px; padding: 6px 14px 12px; margin: 0; }
.yetki-grup legend { padding: 0 6px; font-weight: 600; color: var(--yazi-koyu); }
.yetki-grup .onay-kutu { padding: 4px 0; font-size: 13px; }
.baglanti-dugme { border: 0; background: none; padding: 0; color: var(--mavi); cursor: pointer; font: inherit; }
.baglanti-dugme:hover { text-decoration: underline; }
.program-tablo th, .program-tablo td { border: 1px solid var(--cizgi-ince); vertical-align: top; }
.program-tablo tbody tr:nth-child(odd) td { background: #fff; }
.program-tablo tbody th { background: var(--kart-alt); white-space: nowrap; }
.program-tablo td { padding: 6px; min-width: 150px; }
.program-tablo .secim { height: 30px; font-size: 12px; padding: 3px 24px 3px 7px; background-position: right 8px center; }
.program-tablo .program-ders { margin-bottom: 4px; font-weight: 600; }
.program-tablo td.dolu { background: #f2f8fd !important; }
.coklu { position: relative; }
.coklu-liste {
    display: none; position: absolute; top: 40px; left: 0; right: 0; z-index: 20; background: #fff;
    border: 1px solid var(--cizgi); border-radius: 3px; box-shadow: 0 6px 18px rgba(0,0,0,.08); padding: 6px 0; max-height: 260px; overflow-y: auto;
}
.coklu.acik .coklu-liste { display: block; }
.coklu-liste label { display: flex; align-items: center; gap: 8px; padding: 6px 12px; margin: 0; cursor: pointer; font-size: 13px; }
.coklu-liste label:hover { background: #f5f7f9; }
.coklu-liste .tumunu { border-bottom: 1px solid var(--cizgi-ince); margin-bottom: 4px; padding-bottom: 8px; }
.coklu-ozet { text-align: left; }

/* ----------------------------------------------------------------- düğmeler */
.dugme {
    display: inline-flex; align-items: center; justify-content: center; gap: 6px;
    min-width: 100px; height: 37px; padding: 0 14px; border: 0; border-radius: 3px; cursor: pointer;
    background: var(--mavi); color: #fff; font-size: 13.5px; white-space: nowrap;
}
.dugme:hover { background: var(--mavi-koyu); color: #fff; }
.dugme.turkuaz { background: var(--turkuaz); }
.dugme.turkuaz:hover { background: var(--turkuaz-koyu); }
.dugme.kirmizi { background: var(--kirmizi); }
.dugme.kirmizi:hover { background: var(--kirmizi-koyu); }
.dugme.gri { background: #e5e9ec; color: var(--yazi-koyu); }
.dugme.kucuk { min-width: 0; padding: 0 20px; }
.dugme.tam { width: 100%; }
.dugme.ince { height: 32px; font-size: 13px; padding: 0 14px; gap: 6px; }
.dugme .ikon { width: 13px; height: 13px; }

/* ------------------------------------------------------------------ tablolar */
.tablo { width: 100%; border-collapse: collapse; font-size: 13px; }
.tablo th { text-align: left; font-weight: 600; color: var(--yazi-koyu); padding: 12px 8px; white-space: nowrap; font-size: 13px; }
.tablo td { padding: 10px 8px; color: var(--yazi); vertical-align: middle; }
.tablo tbody tr:nth-child(odd) td { background: var(--satir-zebra); }
.tablo .bos td { color: var(--yazi); }
.tablo.kalin-ilk td:first-child { font-weight: 600; color: var(--yazi-koyu); }
.tablo.siralanir th { cursor: pointer; user-select: none; }
.tablo.siralanir th .sirala { display: inline-block; width: 8px; height: 11px; margin-right: 6px; vertical-align: -1px; color: #c4c8ce; }
.tablo td.islemler { text-align: right; white-space: nowrap; }
.tablo td.islemler a { margin-left: 6px; }
.tablo td.islemler .ikon { width: 14px; height: 14px; }
.ikon-mor { color: #9b6bc6; } .ikon-turkuaz { color: var(--turkuaz); } .ikon-kirmizi { color: var(--kirmizi); } .ikon-mavi { color: var(--mavi); }

.arac-cubugu { background: var(--kart-alt); padding: 11px 20px; display: flex; align-items: center; gap: 7px; }
.arac-cubugu .dugme { min-width: 0; padding: 0 19px; }
.arac-cubugu .bul { margin-left: auto; display: flex; align-items: center; gap: 8px; font-size: 12px; }
.arac-cubugu .bul .girdi { width: 170px; }
.sayfalama { display: flex; justify-content: flex-end; align-items: center; gap: 18px; padding: 16px 20px 20px; font-size: 12px; color: var(--yazi); }
.sayfalama a { color: #b7bbc1; font-size: 13px; }
.sayfalama a.aktif { color: var(--yazi-koyu); }

/* ---------------------------------------------------------------- anasayfa */
.anasayfa { padding: 22px; display: flex; flex-direction: column; gap: 20px; }
.anasayfa .kart { margin-bottom: 0; }
/* Karşılama bandı (18.10 kullanıcı seçimi) */
.as-bant { position: relative; overflow: hidden; background: var(--mavi-bant); color: #fff; border-radius: 3px; padding: 20px 26px; min-height: 112px; box-sizing: border-box; }
.as-bant-cizgi { position: absolute; inset: 0; width: 100%; height: 100%; opacity: .22; fill: none; stroke: #fff; stroke-width: 1.2; pointer-events: none; }
.as-bant-ic { position: relative; z-index: 1; }
.as-selam { margin: 0; font-size: 21px; font-weight: 600; color: #fff; }
.as-tarih { margin-top: 4px; font-size: 12.5px; color: rgba(255,255,255,.92); }
.as-bant-alt { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-top: 12px; }
.as-bant-dugme { background: #fff; color: var(--mavi-yazi); padding: 6px 13px; font-size: 12.5px; font-weight: 600; border-radius: 3px; }
.as-bant-dugme:hover { background: var(--mavi-zemin); color: var(--mavi-koyu); }
.as-bant-dugme.ikincil { background: rgba(255,255,255,.16); color: #fff; font-weight: 400; }
.as-bant-dugme.ikincil:hover { background: rgba(255,255,255,.26); color: #fff; }
.as-sezon { display: flex; align-items: center; gap: 8px; font-size: 12.5px; margin-left: 6px; }
.as-sezon .secim { width: 130px; height: 30px; }
.as-bant .as-sezon .secim { border-color: rgba(255,255,255,.45); color: #fff;
    background: rgba(255,255,255,.12) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8' height='5'%3E%3Cpath d='M0 0h8L4 5z' fill='%23ffffff'/%3E%3C/svg%3E") no-repeat right 12px center; }
.as-bant .as-sezon .secim option { color: var(--yazi-koyu); }
.as-bant-slogan { position: absolute; right: 44px; top: 50%; transform: translateY(-50%); font-family: "Great Vibes", cursive; font-size: 42px; line-height: 1; text-align: right; pointer-events: none; }
@media (max-width: 760px) { .as-bant-slogan { display: none; } .as-bant { padding: 16px; } }
.as-kartlar { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; }
.as-ozet { padding: 16px 18px; border-top: 3px solid var(--mavi); }
.as-ozet.turkuaz { border-top-color: var(--turkuaz); }
.as-ozet.turuncu { border-top-color: #f5a623; }
.as-ozet.mor { border-top-color: var(--mor); }
.as-ozet-baslik { font-size: 13px; color: #6b7079; }
.as-ozet-sayi { margin-top: 6px; font-size: 28px; font-weight: 600; color: var(--yazi-koyu); font-variant-numeric: tabular-nums; }
.as-ozet-alt { margin-top: 2px; font-size: 12px; color: #6b7079; }
.as-ozet-alt.iyi { color: #0a7d73; }
.as-ozet-alt.uyari { color: #a86a00; }
.as-hizli { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 12px; }
.as-hizli a { display: flex; flex-direction: column; align-items: center; gap: 8px; padding: 14px 6px; color: var(--yazi-koyu); font-size: 13px; text-align: center; transition: box-shadow .15s, transform .15s; }
.as-hizli a:hover { box-shadow: 0 4px 14px rgba(20, 30, 50, .1); color: var(--mavi); }
.as-hizli .ikon { width: 24px; height: 24px; color: var(--mavi); }
.as-izgara { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; align-items: stretch; }
.as-izgara .kart-baslik { background: #fff; }
.as-not { font-size: 12px; color: #6b7079; font-weight: 400; }
.as-tumu { font-size: 12.5px; font-weight: 400; }
.tablo td.sagda, .tablo th.sagda { text-align: right; }
.tablo tr.toplam td { font-weight: 600; color: var(--yazi-koyu); }
.doluluk { height: 6px; background: #e6eaee; border-radius: 3px; overflow: hidden; }
.doluluk div { height: 6px; background: var(--mavi); border-radius: 3px; }
.doluluk.dolu div { background: #f5a623; }
.as-sekmeler { gap: 18px; padding-bottom: 0; }
.as-sekmeler button { height: 100%; border: 0; background: none; padding: 0; font-size: 14.5px; color: #6b7079; cursor: pointer; border-bottom: 3px solid transparent; }
.as-sekmeler button.secili { color: var(--mavi); font-weight: 500; border-bottom-color: var(--mavi); }
.ust-harf { text-transform: uppercase; }
.kart-govde.sikisik { padding: 12px 18px 16px; }
@media (max-width: 1199px) { .as-hizli { grid-template-columns: repeat(3, minmax(0, 1fr)); } .as-izgara { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 700px) { .as-kartlar { grid-template-columns: repeat(2, minmax(0, 1fr)); } .as-hizli { grid-template-columns: repeat(2, minmax(0, 1fr)); } .anasayfa { padding: 14px; } }

/* -------------------------------------------------------------------- uyarılar */
.bildirim { padding: 11px 16px; border-radius: 3px; margin-bottom: 18px; font-size: 13px; }
.bildirim.basarili { background: #e1f5f2; color: #0a7d73; border: 1px solid #bfe9e3; }
.bildirim.hata { background: #fdecec; color: #c63e3d; border: 1px solid #f8cfcf; }
.bildirim.uyari { background: #fff6e5; color: #93600a; border: 1px solid #f7e0b0; display: flex; align-items: center; gap: 8px; }
.bildirim.uyari .ikon { width: 14px; height: 14px; }

/* --------------------------------------------------------------- profil */
.profil-yerlesim { display: flex; gap: 20px; justify-content: center; padding-top: 22px; }
.profil-menu { width: 300px; background: #fff; border-radius: 5px; align-self: flex-start; box-shadow: 0 1px 2px rgba(0,0,0,.04); overflow: hidden; }
.profil-menu a { display: block; padding: 0 20px; height: 49px; line-height: 49px; color: var(--yazi-soluk); border-left: 4px solid transparent; font-size: 13.5px; }
.profil-menu a.secili { color: var(--yazi-koyu); border-left-color: var(--mavi); }
.profil-menu a:hover { color: var(--yazi-koyu); }
.profil-icerik { width: 620px; }
.yatay-alan { display: flex; align-items: center; margin-bottom: 20px; }
.yatay-alan > label { width: 140px; margin: 0; font-size: 13.5px; color: var(--yazi); flex: none; }
.yatay-alan > .deger { width: 280px; }
.fotograf-kutu { width: 96px; height: 96px; background: #e6e8eb; display: flex; align-items: flex-end; justify-content: center; overflow: hidden; }
.fotograf-kutu svg { width: 82px; height: 82px; color: #4a4e55; }
.fotograf-kutu img { width: 100%; height: 100%; object-fit: cover; }

/* ---------------------------------------------------------------- yakında */
.yakinda { text-align: center; padding: 70px 20px; color: var(--yazi-soluk); }
.yakinda h2 { font-weight: 500; color: var(--yazi-koyu); font-size: 20px; margin: 18px 0 8px; }
.yakinda .ikon { width: 46px; height: 46px; color: #c7ccd2; }

/* ---------------------------------------------------------------- giriş */
.giris-sayfa { --giris-mavi: #0090d9; --giris-mavi-koyu: #007dbd; background: #f9f9f9; min-height: 100vh; display: flex; flex-direction: column; position: relative; overflow-x: hidden; }
.giris-kutu { width: 340px; max-width: calc(100% - 32px); margin: 112px auto 0; position: relative; z-index: 2; }
.giris-kart-logo { text-align: center; margin-bottom: 28px; }
.logo-resim { display: inline-block; height: 36px; width: auto; }
.giris-kart-logo-ic { display: inline-flex; flex-direction: column; align-items: stretch; }
.giris-kart-logo .logo-resim { height: 58px; }
.giris-alt-yazi { margin-top: 12px; font-size: 11px; letter-spacing: 4.2px; margin-right: -4.2px; color: #7d8590; text-align: center; white-space: nowrap; }
.giris-kart { background: #fff; border: 1px solid #e4e7ea; border-radius: 6px; overflow: hidden; box-shadow: 0 10px 30px rgba(20, 30, 50, .07); }
.giris-ust { background: #f2f4f6; padding: 26px 26px 18px; }
.giris-okul { display: flex; justify-content: center; align-items: center; padding: 14px 20px 12px; border-bottom: 1px solid #e4e7ea; background: #fff; min-height: 40px; }
.giris-okul img { display: block; max-height: 58px; max-width: 260px; object-fit: contain; }
.giris-okul b { font-size: 15px; line-height: 1.3; text-align: center; color: var(--giris-mavi-koyu); letter-spacing: .2px; }
.okul-girisi .giris-girdi .girdi:focus { border-color: var(--giris-mavi); box-shadow: 0 0 0 3px color-mix(in srgb, var(--giris-mavi) 12%, transparent); }
.giris-alt { padding: 18px 26px 17px; text-align: center; }
.giris-alt a:not(.dugme) { display: block; margin-top: 11px; font-size: 12px; color: #7d8590; }
.giris-alt a:not(.dugme):hover { color: var(--giris-mavi); }
.giris-form .alan { margin-bottom: 14px; }
.giris-girdi { position: relative; display: block; }
.giris-girdi .girdi { height: 39px; border-color: #e1e5e9; border-radius: 4px; padding-left: 37px; font-size: 13px; }
.giris-girdi .girdi[data-sifre] { padding-right: 42px; }
.giris-girdi .girdi:focus { border-color: #a9c7e4; box-shadow: 0 0 0 3px rgba(0, 144, 217, .08); }
.giris-girdi .sol-ikon { position: absolute; left: 12px; top: 12px; width: 15px; height: 15px; fill: none; stroke: #9aa0aa; stroke-width: 1.7; pointer-events: none; }
.sifre-goster { position: absolute; right: 4px; top: 4px; width: 31px; height: 31px; border: 0; background: none; padding: 0; cursor: pointer; display: flex; align-items: center; justify-content: center; border-radius: 4px; }
.sifre-goster:hover { background: #f1f3f5; }
.sifre-goster svg { width: 16px; height: 16px; fill: none; stroke: #9aa0aa; stroke-width: 1.7; }
.sifre-goster.acik svg { stroke: var(--giris-mavi); }
.gizli-etiket { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.beni-hatirla { display: flex; align-items: center; gap: 7px; font-size: 12.5px; color: var(--yazi); cursor: pointer; }
.beni-hatirla input { margin: 0; width: 14px; height: 14px; accent-color: var(--giris-mavi); }
.giris-dugme { height: 38px; border-radius: 5px; font-size: 14px; background: var(--giris-mavi); }
.giris-dugme:hover { background: var(--giris-mavi-koyu); color: #fff; }
.giris-not { font-size: 13px; line-height: 1.6; color: var(--yazi); }

/* giriş ekranı arka plan süslemeleri (zemin rengi aynı, yalnız soluk çizimler) */
.giris-sus { position: absolute; inset: 0; overflow: hidden; pointer-events: none; z-index: 0; }
.giris-sus-harf {
    position: absolute; left: 14%; top: 50%; transform: translateY(-46%);
    font-size: 600px; line-height: 1; font-weight: 800; letter-spacing: -20px; color: var(--giris-mavi); opacity: .045;
}
.giris-sus-kavis { position: absolute; left: 0; right: 0; top: 70px; width: 100%; height: 260px; color: var(--giris-mavi); opacity: .12; }
.giris-sus-slogan {
    position: absolute; right: 12%; top: 46%; transform: rotate(-9deg);
    font-family: "Great Vibes", "Segoe Script", cursive; color: var(--giris-mavi); line-height: 1.15; opacity: .8;
}
.giris-sus-slogan span { display: block; font-size: 62px; }
.giris-sus-slogan span + span { margin-left: 52px; font-size: 72px; }
.giris-sus-slogan.okul-slogani { max-width: 34vw; }
.giris-sus-slogan.okul-slogani span { font-size: clamp(36px, 3.6vw, 56px); }
.giris-sus-slogan.okul-slogani span + span { font-size: clamp(40px, 4.1vw, 64px); }
.giris-sus-slogan svg { display: block; width: 200px; height: 54px; margin: 4px 0 0 96px; color: var(--giris-mavi); }
.giris-moduller {
    position: absolute; left: 0; right: 0; bottom: 34px; z-index: 1;
    display: flex; justify-content: center; gap: 64px;
}
.giris-modul { display: flex; flex-direction: column; align-items: center; gap: 8px; color: #7d8590; font-size: 14px; }
.giris-modul svg { width: 30px; height: 30px; color: var(--giris-mavi); opacity: .75; }
.giris-surum { position: absolute; left: 16%; bottom: 36px; font-size: 13px; color: #a3a8b0; z-index: 1; }
@media (max-width: 1100px) { .giris-sus-slogan { display: none; } .giris-sus-harf { left: -4%; } }
@media (max-width: 900px), (max-height: 700px) { .giris-moduller, .giris-surum { display: none; } }
@media (max-width: 600px) { .giris-sus { display: none; } .giris-kutu { margin-top: 48px; } }
.renk-bantlari { margin-top: auto; display: flex; height: 6px; }
.renk-bantlari span { flex: 1; }
/* Uygulama içinde: ekranın en altına sabit */
:root { --bant-yukseklik: 5px; }
.renk-bantlari.sabit { position: fixed; left: 0; right: 0; bottom: 0; height: var(--bant-yukseklik); margin: 0; z-index: 35; }

/* ------------------------------------------------------------------ logo */
.logo-yazi { font-weight: 800; letter-spacing: -1px; color: #4a4d52; font-size: 40px; line-height: 1; display: inline-flex; align-items: center; }
.logo-yazi .vurgu { color: var(--mavi); }
.logo-yazi.kucuk { font-size: 15px; letter-spacing: -.3px; }

/* ------------------------------------------------------------------ yazdırma */
@media print {
    .program-tablo .secim { border: 0; background: none; appearance: none; padding: 0; height: auto; }
    .sayfa { margin-left: 0 !important; }
    .ust, .renk-bantlari.sabit, .alt-baslik, .menu-panel, .menu-ortu, form .kart-alt, .arac-cubugu, .sayfalama, .islemler, .arama-karti { display: none !important; }
    .sayfa { padding-top: 0; }
    body { background: #fff; }
    .kart { box-shadow: none; }
}

/* ---------------------------------------------------------- dar ekranlar */
@media (max-width: 991px) {
    :root, html.menu-dar { --menu-genislik: 252px; }
    .sayfa { margin-left: 0; }
    .menu-panel { display: none; }
    .menu-acik .menu-panel { display: flex; z-index: 60; }
    .menu-acik .menu-ortu { display: block; position: fixed; inset: 0; z-index: 50; background: rgba(255,255,255,.8); }
    .menu-daralt { display: none; }
    html.menu-dar .menu-ad { display: inline; }
    html.menu-dar .menu-oge { justify-content: flex-start; padding: 0 20px; }
    .menu-sutun2 { max-width: calc(100vw - 252px); }
    .s-1, .s-2, .s-3, .s-4, .s-5, .s-6, .s-8, .s-9 { width: 100%; }
    .ust-ara, .ust-kurum, .ust-ayrac { display: none; }
    .ust-kullanici-yazi { display: none; }
    .sekmeler { position: static; transform: none; margin-left: auto; overflow-x: auto; }
    .alt-baslik .yol { display: none; }
    .profil-yerlesim { flex-direction: column; padding: 12px; }
    .profil-menu, .profil-icerik { width: 100%; }
    .yatay-alan { flex-direction: column; align-items: stretch; }
    .yatay-alan > label { margin-bottom: 6px; }
    .yatay-alan > .deger { width: 100%; }
    .tablo-kap { overflow-x: auto; }
}

/* =========================================================================
   Öğrenci modülü
   ========================================================================= */
.bolum-baslik { font-size: 13.5px; font-weight: 600; color: var(--yazi-koyu); padding-bottom: 9px; margin: 6px 0 20px; border-bottom: 1px solid #3a8fd0; }
.bolum-baslik.gri { border-bottom-color: #8b91a0; }
.ayirac { border: 0; border-top: 1px solid var(--cizgi-ince); margin: 4px 0 20px; }
.girdi-dugmeli { display: flex; }
.girdi-dugmeli .girdi { border-top-right-radius: 0; border-bottom-right-radius: 0; }
.girdi-dugmeli .dugme { min-width: 0; padding: 0 13px; border-radius: 0 3px 3px 0; height: 37px; }
.ipucu { font-size: 12px; margin-top: 6px; color: var(--yazi-soluk); }
.ipucu.iyi { color: #0a7d73; }
.ipucu.uyari { color: #a86a00; }
.kare-dugme { width: 37px; height: 37px; border: 0; border-radius: 3px; background: var(--turkuaz); color: #fff; cursor: pointer; display: inline-flex; align-items: center; justify-content: center; }
.kare-dugme:hover { background: var(--turkuaz-koyu); }
.kare-dugme.kirmizi { background: var(--kirmizi); }
.kare-dugme .ikon { width: 15px; height: 15px; }
.liste-satir { display: flex; align-items: center; gap: 10px; padding: 7px 10px; background: var(--satir-zebra); border-radius: 3px; margin-bottom: 6px; font-size: 13px; }
.liste-satir .sag { margin-left: auto; }
.sil-x { border: 0; background: none; color: var(--kirmizi); cursor: pointer; font-size: 17px; line-height: 1; padding: 0 4px; }
.rozet { display: inline-block; padding: 2px 8px; border-radius: 10px; font-size: 11px; font-weight: 600; background: #e9edf1; color: #5b6170; white-space: nowrap; }
.rozet.mavi { background: var(--mavi-rozet); color: var(--mavi-yazi); }
.rozet.yesil { background: #e1f5f2; color: #0a7d73; }
.rozet.turuncu { background: #fff2dc; color: #a86a00; }
.rozet.kirmizi { background: #fdecec; color: #c63e3d; }
.rozet.mor { background: #f1eaf8; color: #7a52a3; }
.arama-tek { max-width: 925px; margin: 0 auto 22px; }
.arama-tek .kart-govde { padding: 20px; }
.arama-tek form { display: flex; gap: 10px; }
.arama-tek .girdi { flex: 1; }
.ozet-izgara { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; margin-bottom: 22px; }
.ozet-izgara .kart { margin-bottom: 0; }
.ozet-iki { display: grid; grid-template-columns: 2fr 1fr; gap: 20px; align-items: start; }
.ozet-iki > * { min-width: 0; }
.ozet-iki.esit { align-items: stretch; }   /* sol ve sağ kutular aynı satırda: üst ve alt kenarları hizalı */
.ozet-iki.esit > .kart { margin-bottom: 0; }   /* içindeki geniş tablo sütunu yana itmesin; tablo kendi kutusunda kaysın */
.cubuk { display: flex; align-items: center; gap: 10px; font-size: 13px; margin-bottom: 9px; }
.cubuk-ad { width: 140px; flex: none; }
.cubuk-yol { flex: 1; height: 8px; background: #e6eaee; border-radius: 4px; overflow: hidden; }
.cubuk-yol div { height: 8px; background: var(--mavi); border-radius: 4px; }
.cubuk-sayi { width: 36px; text-align: right; font-weight: 600; color: var(--yazi-koyu); }

/* Ön kayıt takvimi */
.takvim-yerlesim { display: flex; gap: 20px; padding: 22px 12px; align-items: flex-start; }
.takvim-sol { width: 235px; flex: none; }
.mini-takvim { background: #fff; border-radius: 5px; padding: 12px 10px; margin-bottom: 26px; box-shadow: 0 1px 2px rgba(0,0,0,.04); }
.mini-takvim-ust { display: flex; align-items: center; justify-content: space-between; margin-bottom: 10px; font-size: 13px; font-weight: 600; color: var(--yazi-koyu); }
.mini-takvim-ust a { color: var(--mavi); padding: 0 6px; font-size: 17px; }
.mini-takvim table { width: 100%; border-collapse: collapse; text-align: center; font-size: 11.5px; }
.mini-takvim th { color: var(--mavi); font-weight: 600; font-size: 10.5px; padding-bottom: 6px; }
.mini-takvim td a { display: block; padding: 6px 0; color: var(--yazi); border-radius: 3px; }
.mini-takvim td.disari a { color: #c4c8ce; }
.mini-takvim td.olay a { font-weight: 700; color: var(--mavi-koyu); }
.mini-takvim td.secili a { background: var(--mavi); color: #fff; font-weight: 600; }
.takvim-sag { flex: 1; min-width: 0; background: #fff; border-radius: 5px; padding: 20px; box-shadow: 0 1px 2px rgba(0,0,0,.04); }
.takvim-ust { display: flex; align-items: center; gap: 6px; margin-bottom: 18px; }
.takvim-ust .dugme { min-width: 0; padding: 0 12px; height: 30px; font-size: 13px; background: #c8cdd2; }
.takvim-ust .dugme.secili, .takvim-ust .dugme:hover { background: var(--mavi); }
.takvim-ust h2 { flex: 1; text-align: center; margin: 0; font-size: 28px; font-weight: 300; color: #555; }
.takvim-izgara { width: 100%; border-collapse: collapse; table-layout: fixed; font-size: 12px; }
.takvim-izgara th { border: 1px solid #ddd; padding: 5px; font-weight: 600; color: var(--yazi-koyu); }
.takvim-izgara td { border: 1px solid #e3e3e3; vertical-align: top; padding: 2px 3px; height: 24px; }
.takvim-izgara td.saat { width: 64px; text-align: right; color: var(--yazi); padding-right: 6px; }
.takvim-izgara td.bugun { background: #fcf8e3; }
.takvim-izgara tr.yarim td:not(.saat) { border-top-style: dotted; }
.takvim-izgara.ay td { height: 110px; }
.takvim-izgara.ay .gun-no { text-align: right; color: var(--yazi); padding: 2px 3px; }
.takvim-izgara.ay td.disari .gun-no { color: #c4c8ce; }
.olay { display: block; background: #3a87ad; color: #fff; border-radius: 3px; padding: 2px 5px; margin: 1px 0; font-size: 11.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.olay:hover { color: #fff; filter: brightness(1.08); }
.olay.arama { background: #f0a43a; }
.takvim-aciklama { display: flex; gap: 16px; font-size: 12px; margin-top: 12px; color: var(--yazi); }
.takvim-aciklama span::before { content: ""; display: inline-block; width: 10px; height: 10px; border-radius: 2px; background: #3a87ad; margin-right: 6px; vertical-align: -1px; }
.takvim-aciklama span.arama::before { background: #f0a43a; }

/* Yeni kayıt sihirbazı */
.adimlar { background: #fff; border-radius: 5px; padding: 18px 20px 30px; margin-bottom: 8px; display: flex; position: relative; }
.adim { flex: 1; text-align: center; position: relative; color: #b2b7bf; font-size: 12.5px; cursor: pointer; }
.adim::before { content: ""; position: absolute; top: 16px; left: -50%; right: 50%; height: 5px; background: #5b6170; z-index: 0; }
.adim:first-child::before { display: none; }
.adim .no { position: relative; z-index: 1; width: 38px; height: 38px; margin: 0 auto 12px; border-radius: 50%; background: #e6e8eb; color: #fff; display: flex; align-items: center; justify-content: center; font-weight: 600; font-size: 13px; border: 7px solid #fff; box-sizing: content-box; margin-top: -7px; }
.adim.secili, .adim.tamam { color: var(--yazi-koyu); }
.adim.secili .no { background: var(--mavi); }
.adim.tamam .no { background: var(--turkuaz); }
.adim-baslik { font-size: 17px; margin: 0 0 24px; color: var(--yazi); font-weight: 400; }
.adim-baslik b { font-weight: 600; color: var(--yazi-koyu); }
.sihirbaz-adim[hidden] { display: none; }
.foto-alan { display: flex; gap: 30px; }
.foto-sol { width: 138px; flex: none; }
.foto-sol .fotograf-kutu { width: 138px; height: 138px; margin-bottom: 8px; }
.foto-sol .fotograf-kutu svg { width: 120px; height: 120px; }
.foto-sol .dugme { width: 100%; height: 26px; font-size: 12px; margin-bottom: 8px; padding: 0; min-width: 0; }
.foto-sol video { width: 138px; height: 138px; object-fit: cover; background: #000; display: block; margin-bottom: 8px; }
.foto-sag { flex: 1; min-width: 0; }
.veli-kart { border: 1px solid var(--cizgi); border-radius: 5px; padding: 16px 18px 2px; margin-bottom: 20px; }
.veli-kart-ust { display: flex; align-items: center; gap: 16px; margin-bottom: 16px; }
.veli-kart-ust b { font-size: 14px; color: var(--yazi-koyu); }
.veli-kart-ust label { display: flex; align-items: center; gap: 6px; font-size: 13px; cursor: pointer; }

/* Öğrenci kartı */
.ogrenci-ust { display: flex; gap: 20px; align-items: center; }
.ogrenci-ust .fotograf-kutu { width: 90px; height: 90px; border-radius: 4px; }
.ogrenci-ust h2 { margin: 0 0 4px; font-size: 19px; color: var(--yazi-koyu); font-weight: 600; }
.ogrenci-ust .alt { color: var(--yazi-soluk); font-size: 13px; }
.bilgi-izgara { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0 24px; }
.bilgi { display: flex; padding: 8px 0; border-bottom: 1px solid var(--cizgi-ince); font-size: 13px; }
.bilgi span { width: 130px; flex: none; color: var(--yazi-soluk); }
.bilgi b { font-weight: 500; color: var(--yazi-koyu); }

/* Atama / yoklama listeleri */
.secim-tablo td.kutu, .secim-tablo th.kutu { width: 34px; text-align: center; }
.secim-tablo input[type=checkbox] { width: 15px; height: 15px; accent-color: var(--mavi); }
.secim-tablo tr.isaretli td { background: #eef7fd !important; }
.yoklama-secenek { display: inline-flex; gap: 4px; flex-wrap: wrap; }
.yoklama-secenek label { display: inline-flex; align-items: center; gap: 4px; padding: 3px 8px; border: 1px solid var(--cizgi); border-radius: 12px; font-size: 12px; cursor: pointer; background: #fff; }
.yoklama-secenek input { margin: 0; accent-color: var(--mavi); }
.yoklama-secenek label:has(input:checked) { border-color: var(--mavi); background: var(--mavi-rozet); color: var(--mavi-yazi); }
.yoklama-secenek label.geldi:has(input:checked) { border-color: var(--turkuaz); background: #e1f5f2; color: #0a7d73; }
.tablo .secim.kucuk, .tablo .girdi.kucuk { height: 30px; font-size: 12px; padding: 3px 8px; }
.tablo .secim.kucuk { padding-right: 24px; background-position: right 8px center; }
.sayi-girdi { width: 90px; }
.kontenjan-bilgi { font-size: 13px; margin-left: auto; color: var(--yazi); }
.kontenjan-bilgi b { color: var(--yazi-koyu); }

@media (max-width: 991px) {
    .ozet-izgara { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .ozet-iki { grid-template-columns: 1fr; }
    .takvim-yerlesim { flex-direction: column; }
    .takvim-sol { width: 100%; }
    .bilgi-izgara { grid-template-columns: 1fr; }
    .foto-alan { flex-direction: column; }
}

/* =========================================================================
   CRM
   ========================================================================= */
.anket-soru { display: flex; gap: 12px; align-items: flex-start; padding: 14px; border: 1px solid var(--cizgi); border-radius: 4px; margin-bottom: 12px; background: #fff; }
.anket-no { width: 28px; height: 28px; border-radius: 50%; background: var(--mavi); color: #fff; font-weight: 600; font-size: 13px; display: flex; align-items: center; justify-content: center; flex: none; margin-top: 4px; }
.anket-soru-govde { flex: 1; display: flex; flex-direction: column; gap: 8px; min-width: 0; }
.anket-soru-alt { display: flex; gap: 16px; align-items: center; }
.anket-sayfa { background: var(--zemin); min-height: 100vh; }
.anket-kutu { max-width: 720px; margin: 0 auto; padding: 28px 16px 40px; }
.anket-ust { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 18px; flex-wrap: wrap; }
.anket-ust .logo-resim { height: 25px; }
.anket-baslik { margin: 0 0 10px; font-size: 21px; font-weight: 600; color: var(--yazi-koyu); }
.anket-soru-doldur { border: 0; border-top: 1px solid var(--cizgi-ince); margin: 0; padding: 16px 0 10px; }
.anket-soru-doldur legend { font-weight: 600; color: var(--yazi-koyu); padding: 0 0 10px; font-size: 14px; }
.anket-soru-doldur.hatali legend { color: var(--kirmizi); }
.puan-secim { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.puan-secim label { cursor: pointer; }
.puan-secim input { position: absolute; opacity: 0; }
.puan-secim span:not(.as-not) { display: inline-flex; min-width: 44px; height: 44px; padding: 0 12px; align-items: center; justify-content: center; border: 1px solid var(--cizgi); border-radius: 4px; background: #fff; font-weight: 600; }
.puan-secim input:checked + span { background: var(--mavi); border-color: var(--mavi); color: #fff; }
.puan-secim input:focus-visible + span { outline: 2px solid var(--mavi-koyu); outline-offset: 2px; }
code { background: #f1f4f7; border-radius: 3px; padding: 1px 5px; font-size: 12px; color: var(--yazi-koyu); }
.sayi-sag { text-align: right; font-variant-numeric: tabular-nums; }

/* ---------- Ölçme değerlendirme ---------- */
.ikon-turuncu { color: #e09a1a; } .ikon-yesil { color: #1a9a6c; }
.anahtar-girdi { font-family: ui-monospace, Consolas, monospace; letter-spacing: 2px; }
.not-tablo td { padding: 5px 6px; }
.not-tablo input.girdi { width: 64px; height: 30px; text-align: center; padding: 0 4px; }
.not-tablo input.girdi.genis { width: 100%; text-align: left; }
.not-tablo .dy { display: inline-flex; gap: 3px; }
.not-tablo .dy input.girdi { width: 44px; }
.not-tablo th.orta, .not-tablo td.orta { text-align: center; }
.not-tablo td.dusuk { color: var(--kirmizi); font-weight: 600; }
.kilit-bilgi { display: flex; align-items: center; gap: 8px; margin: 12px 20px 0; }
.ilerleme { position: relative; height: 8px; border-radius: 4px; background: #e9edf1; overflow: hidden; min-width: 90px; }
.ilerleme > span { position: absolute; inset: 0 auto 0 0; background: var(--turkuaz); }
.ilerleme.az > span { background: #f5a623; } .ilerleme.yok > span { background: var(--kirmizi); }
.izin-tablo td, .izin-tablo th { text-align: center; } .izin-tablo td:first-child, .izin-tablo th:first-child { text-align: left; }

/* ---------- Raporlar ---------- */
.rapor-not { margin-bottom: 18px; }
.rapor-tablo tfoot td { background: var(--kart-alt); border-top: 2px solid #dde2e7; }
.grafik { font-size: 12px; }
.grafik-lejant { display: flex; gap: 16px; margin-bottom: 10px; color: var(--yazi); }
.grafik-lejant i { display: inline-block; width: 10px; height: 10px; border-radius: 2px; margin-right: 6px; vertical-align: -1px; }
.grafik.dikey .grafik-govde { display: flex; align-items: flex-end; gap: 10px; height: 220px; padding-top: 18px; overflow-x: auto; }
.grafik.dikey .grafik-grup { flex: 1 0 44px; max-width: 120px; height: 100%; display: flex; flex-direction: column; }
.grafik.dikey .grafik-cubuklar { flex: 1; display: flex; align-items: flex-end; gap: 3px; border-bottom: 1px solid #cfd5db; }
.grafik.dikey .grafik-cubuk { flex: 1; min-height: 1px; border-radius: 3px 3px 0 0; position: relative; }
.grafik.dikey .grafik-cubuk span { position: absolute; bottom: 100%; left: 50%; transform: translateX(-50%); font-size: 10px; color: var(--yazi); white-space: nowrap; }
.grafik.dikey .grafik-etiket { text-align: center; margin-top: 6px; height: 30px; overflow: hidden; line-height: 1.25; color: var(--yazi); }
.grafik.yatay { overflow: hidden; }
.grafik.yatay .grafik-grup { display: grid; grid-template-columns: 200px 1fr; gap: 10px; align-items: center; margin-bottom: 6px; }
.grafik.yatay .grafik-etiket { order: -1; text-align: right; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--yazi); }
.grafik.yatay .grafik-cubuklar { display: flex; flex-direction: column; gap: 2px; }
.grafik.yatay .grafik-cubuk { height: 14px; min-width: 1px; border-radius: 0 3px 3px 0; position: relative; }
.grafik.yatay .grafik-cubuk span { position: absolute; left: 100%; margin-left: 6px; top: -1px; font-size: 10.5px; color: var(--yazi); white-space: nowrap; }
@media print { .arama-karti, .arac-cubugu, .sayfalama, .menu-panel, .ust-serit { display: none !important; } }

/* ---------- CMS, Kampüs ---------- */
.kaynak-izgara { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 16px; }
.kaynak-kart { padding: 16px 18px; margin-bottom: 0; display: flex; flex-direction: column; gap: 6px; }
.kaynak-ust { display: flex; justify-content: space-between; align-items: center; }
.kaynak-tur { font-size: 11px; font-weight: 700; padding: 3px 8px; border-radius: 3px; background: #e1f1fb; color: #0a6fa8; }
.kaynak-tur.tur-video { background: #fdecec; color: #c63e3d; } .kaynak-tur.tur-sunum { background: #fff2dc; color: #a86a00; } .kaynak-tur.tur-soru { background: #efe6f8; color: #7a4aa8; } .kaynak-tur.tur-baglanti { background: #e1f5f2; color: #0a7d73; }
.kaynak-ad { font-weight: 600; color: var(--yazi-koyu); font-size: 14px; }
.kaynak-aciklama { margin: 0; font-size: 12.5px; color: var(--yazi); }
.kaynak-alt { margin-top: auto; display: flex; justify-content: space-between; align-items: center; padding-top: 8px; }
.yemek-tablo td { vertical-align: top; min-width: 150px; } .yemek-tablo textarea.girdi { min-height: 80px; font-size: 12.5px; } .yemek-tablo input.girdi { margin-top: 4px; width: 90px; }
.yemek-tablo th.bugun { color: var(--mavi); }
.degisiklik { font-size: 12px; color: var(--yazi); max-width: 340px; word-break: break-word; }
.aktarim-bilgi { background: var(--kart-alt); border-radius: 4px; padding: 4px 16px; margin: 4px 0 14px; font-size: 13px; line-height: 1.6; }
.panel-satir .kart { height: calc(100% - 22px); }
.program-tablo th.bugun { color: var(--mavi); }

/* ---------- Veli / öğrenci portalı ---------- */
body.portal { background: var(--zemin, #eef0f3); min-height: 100vh; padding-bottom: 20px; }
.portal-ust { position: sticky; top: 0; z-index: 20; display: flex; align-items: center; gap: 16px; padding: 10px 20px; background: #fff; border-bottom: 3px solid var(--mavi); flex-wrap: wrap; }
.portal-kurum { font-size: 17px; color: var(--yazi-koyu); }
.portal-menu { display: flex; align-items: center; gap: 4px; margin-left: auto; }
.portal-menu a, .portal-menu button { padding: 8px 12px; border-radius: 3px; color: var(--yazi-koyu); font-size: 14px; background: none; border: 0; cursor: pointer; font-family: inherit; }
.portal-menu a:hover, .portal-menu button:hover, .portal-menu a.secili { background: #eef5fb; color: var(--mavi); }
.portal-kisi { font-size: 13px; color: var(--yazi); } .portal-kisi small { color: var(--mavi); font-weight: 600; margin-left: 4px; }
.portal-icerik { max-width: 1100px; margin: 22px auto; padding: 0 16px; }
.portal-baslik { font-size: 22px; font-weight: 600; color: var(--yazi-koyu); margin: 0 0 16px; }
.portal-kartlar { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 16px; margin-bottom: 22px; }
.portal-kartlar .kart { margin-bottom: 0; }
.portal-cocuk { display: flex; gap: 14px; align-items: center; padding: 16px; color: var(--yazi); text-decoration: none; }
.portal-cocuk:hover { box-shadow: 0 2px 10px rgba(0,0,0,.08); } .portal-cocuk b { color: var(--yazi-koyu); font-size: 15px; }
.portal-foto { width: 58px; height: 58px; border-radius: 50%; background: #e1f1fb; color: #0a6fa8; display: flex; align-items: center; justify-content: center; font-weight: 700; overflow: hidden; flex: none; }
.portal-foto img { width: 100%; height: 100%; object-fit: cover; }
.portal-borc { margin-top: 6px; font-size: 12.5px; color: #0a6fa8; } .portal-borc.gecikmis { color: var(--kirmizi); }
.portal-duyuru { padding: 8px 0; border-bottom: 1px solid var(--cizgi-ince, #eee); font-size: 13.5px; } .portal-duyuru:last-child { border-bottom: 0; }
.portal-ogr-bas { display: flex; gap: 16px; align-items: center; padding: 16px 20px; }
.portal-sekmeler { display: flex; gap: 4px; flex-wrap: wrap; margin-bottom: 14px; }
.portal-sekmeler a { padding: 8px 14px; background: #fff; border-radius: 3px; color: var(--yazi-koyu); font-size: 13.5px; }
.portal-sekmeler a.secili { background: var(--mavi); color: #fff; }
.portal-donem { display: flex; gap: 8px; margin-bottom: 12px; }
.portal-alt-baslik { font-size: 15px; margin: 18px 0 4px; }
.portal-bugun { outline: 2px solid var(--mavi); }
.portal-giris-baslik { font-weight: 600; font-size: 15px; color: var(--yazi-koyu); margin: 0 0 12px; text-align: center; }
@media (max-width: 760px) { .portal-menu { margin-left: 0; width: 100%; overflow-x: auto; } .portal-kisi { display: none; } }
.tablo th.orta, .tablo td.orta { text-align: center; }

/* Sistem yönetim paneli (/sistem) */
.sistem-icerik { max-width: 1280px; }
.sistem-ozet { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 14px; margin-bottom: 18px; }
.sistem-ozet .kart { margin: 0; padding: 14px 16px; display: flex; flex-direction: column; gap: 4px; }
.sistem-ozet .kart span { font-size: 12.5px; color: var(--yazi); }
.sistem-ozet .kart b { font-size: 24px; color: var(--yazi-koyu); font-weight: 600; }
.sistem-ozet .kart.uyari b { color: #a86a00; }
.portal-baslik .rozet { font-size: 12px; vertical-align: middle; margin-left: 8px; }

/* İnternet ön kayıt başvuru formu (/basvuru/{anahtar}) */
.basvuru-icerik { max-width: 860px; }
.basvuru-alt { text-align: center; font-size: 12px; color: var(--yazi); margin-top: 18px; }
.basvuru .onay-kutu { align-items: flex-start; line-height: 1.5; }
.basvuru .onay-kutu.hatali { color: var(--kirmizi); }
.basvuru-baglanti { display: flex; gap: 8px; align-items: center; }
.basvuru-baglanti input { flex: 1; font-family: ui-monospace, Consolas, monospace; font-size: 12.5px; }

/* Veli portalı mesajlaşma */
.konusma { display: flex; flex-direction: column; gap: 10px; margin: 6px 0 14px; }
.balon { max-width: 78%; padding: 10px 14px; border-radius: 6px; background: #fff; border: 1px solid var(--cizgi-ince, #e3e6ea); }
.balon.benim { align-self: flex-end; background: #e8f4fc; border-color: #cfe6f6; }
.balon-ust { display: flex; justify-content: space-between; gap: 14px; font-size: 12px; color: var(--yazi); margin-bottom: 4px; } .balon-ust b { color: var(--yazi-koyu); }
.balon-metin { white-space: pre-line; font-size: 13.5px; line-height: 1.55; color: var(--yazi-koyu); }
.portal-mesaj-satir { display: flex; justify-content: space-between; align-items: center; gap: 10px; padding: 10px 4px; border-bottom: 1px solid var(--cizgi-ince, #eee); color: var(--yazi-koyu); text-decoration: none; }
.portal-mesaj-satir:last-child { border-bottom: 0; } .portal-mesaj-satir:hover { background: #f6fafd; }
.portal-mesaj-satir small { display: block; color: var(--yazi); font-size: 12px; margin-top: 2px; } .portal-mesaj-satir.yeni b { color: var(--mavi); }
.rozet.gri { background: #eef0f2; color: #5d6670; }
.portal-menu .sayac { display: inline-block; min-width: 18px; padding: 0 5px; margin-left: 4px; border-radius: 9px; background: var(--kirmizi); color: #fff; font-size: 11px; line-height: 18px; text-align: center; }
tr.kalin td { font-weight: 600; }
@media (max-width: 760px) { .portal-kartlar[style] { grid-template-columns: 1fr !important; } .balon { max-width: 92%; } }

/* Veli portalı: bildirimler */
.portal-bildirim-ayar { display: flex; justify-content: space-between; align-items: center; gap: 16px; flex-wrap: wrap; }
.portal-bildirim-durum { margin: 4px 0 6px; font-size: 13.5px; } .portal-bildirim-durum.acik { color: #0a7d73; } .portal-bildirim-durum.uyari { color: #a86a00; }
.portal-bildirim { display: grid; grid-template-columns: 96px 1fr auto; gap: 12px; align-items: start; padding: 10px 4px; border-bottom: 1px solid var(--cizgi-ince, #eee); color: var(--yazi-koyu); text-decoration: none; }
.portal-bildirim:last-child { border-bottom: 0; } .portal-bildirim:hover { background: #f6fafd; } .portal-bildirim.yeni { background: #f0f8fe; }
.portal-bildirim-govde b { display: block; font-size: 13.5px; } .portal-bildirim-govde span { font-size: 13px; color: var(--yazi); }
.portal-bildirim small { color: var(--yazi); font-size: 11.5px; white-space: nowrap; }
.portal-bildirim-tur { font-size: 11px; font-weight: 600; text-align: center; padding: 3px 6px; border-radius: 3px; background: #e1f1fb; color: #0a6fa8; }
.portal-bildirim-tur.t-devamsizlik { background: #fdecec; color: #c63e3d; } .portal-bildirim-tur.t-not { background: #e1f5f2; color: #0a7d73; }
.portal-bildirim-tur.t-odeme { background: #fff2dc; color: #a86a00; } .portal-bildirim-tur.t-odev { background: #f1eaf8; color: #7a52a3; }
@media (max-width: 600px) { .portal-bildirim { grid-template-columns: 1fr; gap: 4px; } .portal-bildirim-tur { justify-self: start; } }

/* Veli portalı: özet ve takvim */
.portal-ozet { padding: 12px 16px; font-size: 13px; display: flex; flex-direction: column; gap: 8px; }
.portal-ozet-ust { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; }
.portal-ozet-bolum { display: flex; flex-direction: column; gap: 2px; } .portal-ozet-bolum > b { font-size: 12px; color: var(--yazi); font-weight: 600; text-transform: uppercase; letter-spacing: .3px; }
.portal-ozet-baglantilar { display: flex; gap: 14px; flex-wrap: wrap; border-top: 1px solid var(--cizgi-ince, #eee); padding-top: 8px; font-size: 12.5px; }
.portal-takvim-ust { display: flex; align-items: center; gap: 10px; margin-bottom: 8px; }
.portal-takvim-renkler { display: flex; gap: 12px; flex-wrap: wrap; margin-bottom: 10px; font-size: 12px; }
.portal-takvim-renkler span::before { content: ''; display: inline-block; width: 10px; height: 10px; border-radius: 2px; margin-right: 4px; vertical-align: -1px; background: var(--r, #0090d9); }
.portal-takvim { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 1px; background: var(--cizgi-ince, #e3e6ea); padding: 0; overflow: hidden; }
.portal-takvim-gun-adi { background: #f6f8fa; text-align: center; font-size: 12px; font-weight: 600; padding: 6px 0; color: var(--yazi); }
.portal-takvim-gun { background: #fff; min-height: 92px; padding: 4px 5px; display: flex; flex-direction: column; gap: 2px; overflow: hidden; }
.portal-takvim-gun .no { font-size: 12px; color: var(--yazi); } .portal-takvim-gun.diger { background: #fafbfc; } .portal-takvim-gun.diger .no { color: #b7bec6; }
.portal-takvim-gun.haftasonu { background: #fbfbfc; } .portal-takvim-gun.bugun .no { background: var(--mavi); color: #fff; border-radius: 10px; padding: 0 6px; align-self: flex-start; }
.portal-takvim-gun .olay { font-size: 11px; line-height: 1.35; padding: 1px 4px; border-radius: 2px; background: var(--r-acik, #e1f1fb); color: var(--r, #0a6fa8); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.t-etkinlik { --r: #0a6fa8; --r-acik: #e1f1fb; } .t-toplanti { --r: #7a52a3; --r-acik: #f1eaf8; } .t-sinav { --r: #c63e3d; --r-acik: #fdecec; }
.t-toren { --r: #b03a2e; --r-acik: #fbeae8; } .t-seminer { --r: #2c7a7b; --r-acik: #e6f4f4; } .t-spor { --r: #1e8449; --r-acik: #e6f6ec; }
.t-odev { --r: #0a7d73; --r-acik: #e1f5f2; } .t-odeme { --r: #a86a00; --r-acik: #fff2dc; } .t-tatil, .t-gezi { --r: #5d6670; --r-acik: #eef0f2; }
.portal-takvim-nokta { display: inline-block; width: 9px; height: 9px; border-radius: 50%; background: var(--r, #0090d9); margin-right: 6px; }
@media (max-width: 760px) { .portal-takvim-gun { min-height: 52px; } .portal-takvim-gun .olay { font-size: 0; height: 6px; padding: 0; } }
.mazeret-ust { display: flex; justify-content: space-between; gap: 12px; align-items: flex-start; font-size: 13.5px; line-height: 1.6; }
.mazeret-karar { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; margin-top: 8px; } .mazeret-karar .girdi { flex: 1; min-width: 220px; }
tr.soluk td { color: #98a0a8; }
.portal-belgeler { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; } .portal-belgeler > * { border: 1px solid var(--cizgi-ince, #e3e6ea); border-radius: 4px; padding: 14px; }
@media (max-width: 760px) { .portal-belgeler { grid-template-columns: 1fr; } }

/* Veli portalı: telefonda alt sekme çubuğu */
.portal-menu a, .portal-menu button { white-space: nowrap; }
.portal-alt-menu { display: none; }
@media (max-width: 760px) {
    body.portal:not(.sistem):not(.basvuru) { padding-bottom: calc(64px + env(safe-area-inset-bottom)); }
    body.portal:not(.sistem):not(.basvuru) .portal-menu { display: none; }
    body.portal:not(.sistem):not(.basvuru) .portal-ust { flex-wrap: nowrap; gap: 10px; padding: 8px 12px; }
    body.portal:not(.sistem):not(.basvuru) .portal-kurum { flex: 1; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
    body.portal:not(.sistem):not(.basvuru) .renk-bantlari { display: none; }
    .portal-alt-menu { display: flex; position: fixed; left: 0; right: 0; bottom: 0; z-index: 30; background: #fff; border-top: 1px solid var(--cizgi-ince, #e3e6ea);
        padding: 4px 0 calc(4px + env(safe-area-inset-bottom)); box-shadow: 0 -2px 8px rgba(0,0,0,.05); }
    .portal-alt-menu a { flex: 1; display: flex; flex-direction: column; align-items: center; gap: 2px; font-size: 10.5px; color: var(--yazi); text-decoration: none; padding: 4px 0; position: relative; }
    .portal-alt-menu svg { width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linejoin: round; stroke-linecap: round; }
    .portal-alt-menu a.secili { color: var(--mavi); }
    .portal-alt-menu .sayac { position: absolute; top: 0; left: calc(50% + 6px); min-width: 16px; padding: 0 4px; border-radius: 8px; background: var(--kirmizi); color: #fff; font-size: 10px; line-height: 16px; }
    .portal-kurum { font-size: 14px; }
}
.dogrulama-kodu { letter-spacing: 8px; font-size: 20px !important; text-align: center; font-family: ui-monospace, Consolas, monospace; }

/* KVKK / çerez */
.kvkk-metin { white-space: pre-line; font-size: 13.5px; line-height: 1.7; text-align: justify; padding: 22px 26px !important; }
.kvkk-metin::first-line { font-weight: 700; font-size: 15px; }
.yasal-alt { text-align: center; font-size: 12px; color: var(--yazi); margin: 14px 0 6px; } .yasal-alt a { color: inherit; text-decoration: underline; }
.yasal-alt .telif { margin-top: 4px; font-size: 11px; color: var(--yazi-soluk, #8b93a1); }
.cerez-bildirimi { position: fixed; left: 12px; right: 12px; bottom: 12px; z-index: 60; max-width: 720px; margin: 0 auto; display: flex; gap: 12px; align-items: center; flex-wrap: wrap;
    background: #263238; color: #fff; font-size: 13px; padding: 10px 14px; border-radius: 6px; box-shadow: 0 4px 16px rgba(0,0,0,.2); }
.cerez-bildirimi[hidden] { display: none; } .cerez-bildirimi span { flex: 1; min-width: 200px; } .cerez-bildirimi a { color: #9fd6ff; }
@media (max-width: 760px) { body.portal .cerez-bildirimi { bottom: calc(76px + env(safe-area-inset-bottom)); } }
.teslim-secim { white-space: nowrap; } .teslim-secim label { margin-right: 10px; font-size: 13px; cursor: pointer; }
.teslim-secim .t-yapti { color: #0a7d73; } .teslim-secim .t-eksik { color: #a86a00; } .teslim-secim .t-gec { color: #0a6fa8; } .teslim-secim .t-yapmadi { color: #c63e3d; }
@media (max-width: 760px) { .teslim-tablo thead { display: none; } .teslim-tablo tr { display: grid; grid-template-columns: auto 1fr; gap: 4px 10px; padding: 8px 0; border-bottom: 1px solid var(--cizgi-ince, #eee); }
    .teslim-tablo td { border: 0 !important; padding: 2px 4px !important; } .teslim-secim, .teslim-tablo td:last-child { grid-column: 1 / -1; white-space: normal; } .teslim-secim label { display: inline-block; padding: 4px 0; } }

/* Personel ekranları telefonda: yoklama ve not girişi */
.y-sure { width: 110px; }
@media (max-width: 760px) {
    .yoklama-tablo thead { display: none; }
    .yoklama-tablo tr[data-yoklama-satir] { display: grid; grid-template-columns: auto 1fr auto; gap: 6px 10px; padding: 10px 4px; border-bottom: 1px solid var(--cizgi); }
    .yoklama-tablo tr[data-yoklama-satir] td { border: 0 !important; padding: 0 !important; }
    .yoklama-tablo td:nth-child(2) { font-weight: 600; }
    .yoklama-tablo td:nth-child(3), .yoklama-tablo td.y-aciklama { grid-column: 1 / -1; }
    .yoklama-tablo td:nth-child(4) { grid-column: 1 / 3; }
    .yoklama-tablo td.y-toplam::before { content: attr(data-baslik) ": "; color: var(--gri, #777); font-size: 12px; }
    .yoklama-tablo .yoklama-secenek label { padding: 7px 11px; font-size: 13px; border-radius: 16px; }
    .yoklama-tablo .y-sure, .yoklama-tablo .y-aciklama input { width: 100%; height: 36px; }
    .not-tablo th:nth-child(2), .not-tablo td:nth-child(2) { position: sticky; left: 0; background: #fff; z-index: 1; box-shadow: 2px 0 0 var(--cizgi); max-width: 130px; white-space: normal; }
    .not-tablo th:nth-child(1), .not-tablo td:nth-child(1) { display: none; }
    .not-tablo input.girdi { width: 54px; height: 36px; font-size: 15px; }
    .tablo-kap { overflow-x: auto; -webkit-overflow-scrolling: touch; }
    .arac-cubugu .as-not { flex-basis: 100%; }
}
/* Kullanım kılavuzu */
.yardim-ara { position: relative; margin-bottom: 14px; }
.yardim-ara .ikon { position: absolute; left: 10px; top: 50%; transform: translateY(-50%); width: 18px; height: 18px; color: #8a94a6; }
.yardim-ara input { padding-left: 36px; height: 40px; font-size: 15px; }
.yardim-bolum h2 { font-size: 15px; margin: 18px 0 6px; color: var(--mavi); }
.yardim-konu { border: 1px solid var(--cizgi); border-radius: 6px; margin-bottom: 6px; background: #fff; }
.yardim-konu summary { cursor: pointer; padding: 10px 12px; font-weight: 600; list-style-position: inside; }
.yardim-konu[open] summary { border-bottom: 1px solid var(--cizgi); background: #f6f9fc; }
.yardim-govde { padding: 6px 14px 12px; line-height: 1.55; }
.yardim-govde ol { margin: 6px 0; padding-left: 20px; }
.yardim-not { margin: 6px 0; padding: 6px 10px; background: #fff8e6; border-left: 3px solid #f0b400; font-size: 13px; }

/* Onay / uyarı penceresi (tarayıcı kutusu yerine) */
.onay-perde { position: fixed; inset: 0; z-index: 1000; background: rgba(20, 28, 40, .45); display: flex; align-items: center; justify-content: center; padding: 16px; opacity: 0; transition: opacity .12s; }
.onay-perde.acik { opacity: 1; }
.onay-pencere { width: 100%; max-width: 420px; background: var(--kart); border-radius: 4px; border-top: 3px solid var(--mavi); box-shadow: 0 12px 40px rgba(0, 0, 0, .25); transform: translateY(8px) scale(.98); transition: transform .12s; }
.onay-perde.acik .onay-pencere { transform: none; }
.onay-ust { display: flex; align-items: center; gap: 10px; padding: 16px 20px 0; color: var(--yazi-koyu); font-size: 15px; }
.onay-simge { flex: 0 0 28px; height: 28px; border-radius: 50%; background: #e1f1fb; color: var(--mavi); display: inline-flex; align-items: center; justify-content: center; font-weight: 700; }
.onay-simge.tehlike { background: #fde8e8; color: var(--kirmizi); }
.onay-metin { padding: 10px 20px 18px 58px; line-height: 1.5; color: var(--yazi); white-space: pre-line; }
.onay-alt { display: flex; justify-content: flex-end; gap: 8px; padding: 12px 20px; background: var(--kart-alt); border-top: 1px solid var(--cizgi); border-radius: 0 0 4px 4px; }
.onay-alt .dugme { min-width: 96px; justify-content: center; }
@media (max-width: 480px) { .onay-metin { padding-left: 20px; } .onay-alt .dugme { flex: 1; } }

/* Bütün personel ekranları telefonda: sayfa yana taşmaz; geniş tablolar kendi kutusunda kayar */
@media (max-width: 600px) {
    .ust { padding-left: 4px; }
    .ust-logo { margin: 0 6px 0 2px; }
    .ust-logo img { height: 22px; }
    .ust-ikonlar { gap: 0; padding-right: 4px; }
    .ust-ikonlar > a, .bildirim-kap > button { width: 34px; height: 36px; }
    .ust-ikonlar > a[href*="takvim"] { display: none; }
    .ust-kullanici { padding: 0 8px 0 6px; gap: 0; }
    .icerik, .anasayfa { padding-left: 10px !important; padding-right: 10px !important; }
}
@media (max-width: 760px) {
    .sayfa, .icerik, .kart { max-width: 100%; min-width: 0; }
    .ozet-iki[style] { grid-template-columns: 1fr !important; }
    .ozet-izgara[style] { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
    .as-ozet-sayi { overflow-wrap: anywhere; }
    .kart-govde { overflow-x: auto; -webkit-overflow-scrolling: touch; }
    .kart-govde > .tablo, .tablo-kap > .tablo { min-width: 560px; }
    .kart-govde > .tablo.yoklama-tablo, .kart-govde > .tablo.teslim-tablo, .tablo-kap > .tablo.yoklama-tablo, .tablo-kap > .tablo.teslim-tablo { min-width: 0; }
    .arac-cubugu { flex-wrap: wrap; gap: 6px; }
    .kart-alt { flex-wrap: wrap; gap: 6px; }
    .s-7, .s-10, .s-11 { width: 100%; }
    .alt-baslik { flex-wrap: wrap; height: auto; min-height: 44px; }
    .sekmeler { max-width: 100%; }
    .bildirim-liste, .kullanici-acilir { max-width: calc(100vw - 16px); }
    .girdi, .secim, textarea { max-width: 100%; }
    img, svg, canvas { max-width: 100%; }
}
/* Uzak arama kutusu (kasa müşteri seçimi) */
.uzak-secim { position: relative; }
.uzak-secim .ara-sonuc { top: 100%; margin-top: 2px; max-height: 300px; }
.uzak-secim .ara-sonuc .bos { padding: 8px 14px; color: var(--yazi-soluk); font-size: 13px; }
.aktarim-sablon-baslik { font-weight: 600; font-size: 13px; color: var(--yazi-koyu); margin: 12px 0 6px; }
.aktarim-sablonlar { list-style: none; margin: 0; padding: 0; border: 1px solid #e3e7eb; background: #fff; }
.aktarim-sablonlar li { display: grid; grid-template-columns: 240px 1fr; gap: 12px; align-items: baseline; padding: 7px 12px; border-bottom: 1px solid #eef0f3; font-size: 13px; }
.aktarim-sablonlar li:last-child { border-bottom: 0; }
.aktarim-sablonlar li:nth-child(even) { background: #fafbfc; }
.aktarim-sablonlar a { display: inline-flex; align-items: center; gap: 6px; font-weight: 600; }
.aktarim-sablonlar a svg { width: 15px; height: 15px; flex-shrink: 0; }
.aktarim-sablonlar span { color: var(--yazi); line-height: 1.5; }
@media (max-width: 700px) { .aktarim-sablonlar li { grid-template-columns: 1fr; gap: 2px; } }
.aktarim-turleri { margin: 4px 0 0; padding-left: 18px; font-size: 13px; line-height: 1.55; color: var(--yazi); }
/* Online ödeme (veli portalı) */
.odeme-sayfasi { background: #f4f6f9; }
.odeme-kutu { max-width: 560px; margin: 40px auto; padding: 28px 24px; background: #fff; border-radius: 6px; box-shadow: 0 6px 24px rgba(20, 30, 50, .08); text-align: center; }
.odeme-kutu .logo-resim { height: 28px; margin-bottom: 14px; }
.odeme-kutu h1 { font-size: 20px; margin: 10px 0; }
.odeme-cerceve { width: 100%; min-height: 620px; border: 0; margin-top: 10px; }
.odeme-simge { width: 56px; height: 56px; margin: 6px auto; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 28px; font-weight: 700; background: #eef3f8; color: var(--mavi); }
.odeme-simge.yesil { background: #e6f6ec; color: #2e9d57; }
.odeme-simge.kirmizi { background: #fde8e8; color: var(--kirmizi); }
.portal-odeme { display: flex; flex-wrap: wrap; gap: 8px; align-items: flex-end; padding: 12px; margin: 10px 0 16px; background: #f6f9fc; border: 1px solid var(--cizgi); border-radius: 6px; }
.portal-odeme .alan { margin: 0; }
.portal-odeme input { width: 140px; }
.entegrasyon-kart .kart-baslik .rozet { margin-left: 8px; }
.entegrasyon-anahtarlar { display: flex; flex-direction: column; gap: 6px; justify-content: flex-end; }
.entegrasyon-firma { border-top: 1px dashed var(--cizgi); padding-top: 6px; margin-top: 4px; }
.yasal-metin h2 { font-size: 18px; margin: 0 0 6px; } .yasal-metin h3 { font-size: 15px; margin: 18px 0 6px; color: var(--mavi); }
.yasal-metin { line-height: 1.6; } .yasal-metin ul, .yasal-metin ol { padding-left: 20px; }
/* Mağaza uygulaması içinde (html.nova-uygulama) */
.nova-uygulama .uygulamada-gizle { display: none !important; }
.uygulama-kilit-perde { position: fixed; inset: 0; z-index: 2000; background: #f4f6f9; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 14px; padding: 24px; text-align: center; }
.uygulama-kilit-perde img { height: 30px; }

/* Veli portalı: sağ üstte kullanıcı menüsü (Hesabım) */
.hesap-menu { position: relative; flex-shrink: 0; }
.portal-menu + .hesap-menu { margin-left: 4px; }
.hesap-menu > summary { list-style: none; display: flex; align-items: center; gap: 8px; cursor: pointer; padding: 4px 6px 4px 4px; border-radius: 22px; user-select: none; }
.hesap-menu > summary::-webkit-details-marker { display: none; }
.hesap-menu > summary:hover, .hesap-menu[open] > summary, .hesap-menu > summary.secili { background: #eef5fb; }
.hesap-avatar { width: 34px; height: 34px; border-radius: 50%; background: var(--mavi); color: #fff; display: inline-flex; align-items: center; justify-content: center; font-size: 13px; font-weight: 600; letter-spacing: .5px; flex-shrink: 0; }
.hesap-avatar.buyuk { width: 44px; height: 44px; font-size: 16px; }
.hesap-ad { font-size: 13px; color: var(--yazi-koyu); white-space: nowrap; } .hesap-ad small { display: block; color: var(--mavi); font-weight: 600; font-size: 11px; }
.hesap-ok { width: 16px; height: 16px; fill: none; stroke: var(--yazi); stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; transition: transform .15s; }
.hesap-menu[open] .hesap-ok { transform: rotate(180deg); }
.hesap-panel { position: absolute; right: 0; top: calc(100% + 8px); width: 280px; max-width: calc(100vw - 24px); background: #fff; border: 1px solid var(--cizgi-ince, #e3e6ea); border-radius: 8px; box-shadow: 0 8px 28px rgba(20,40,60,.16); padding: 6px 0; z-index: 50; }
.hesap-panel-ust { display: flex; gap: 12px; align-items: center; padding: 10px 16px 12px; border-bottom: 1px solid var(--cizgi-ince, #eef0f2); margin-bottom: 4px; }
.hesap-panel-ust b { display: block; font-size: 14px; color: var(--yazi-koyu); } .hesap-panel-ust small { display: block; font-size: 12px; color: var(--yazi); margin-top: 2px; }
.hesap-panel a, .hesap-panel button { display: flex; align-items: center; gap: 12px; width: 100%; padding: 10px 16px; font-size: 14px; color: var(--yazi-koyu); text-decoration: none; background: none; border: 0; font-family: inherit; cursor: pointer; text-align: left; }
.hesap-panel a:hover, .hesap-panel button:hover { background: #f3f8fc; color: var(--mavi); }
.hesap-panel svg { width: 19px; height: 19px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; flex-shrink: 0; opacity: .8; }
.hesap-panel form { margin: 4px 0 0; border-top: 1px solid var(--cizgi-ince, #eef0f2); padding-top: 4px; }
.hesap-panel form button { color: var(--kirmizi); }
.hesap-panel .sayac { margin-left: auto; min-width: 18px; padding: 0 5px; border-radius: 9px; background: var(--kirmizi); color: #fff; font-size: 11px; line-height: 18px; text-align: center; }
@media (max-width: 760px) { .hesap-ad, .hesap-ok { display: none; } .hesap-menu > summary { padding: 2px; } }
/* Hesabım sayfası */
.hesap-sayfa { max-width: 620px; }
.hesap-bilgi > div { display: flex; justify-content: space-between; gap: 12px; padding: 7px 0; border-bottom: 1px solid var(--cizgi-ince, #eef0f2); font-size: 14px; }
.hesap-bilgi > div:last-child { border-bottom: 0; } .hesap-bilgi span { color: var(--yazi); } .hesap-bilgi b { text-align: right; font-weight: 600; }
.hesap-not { padding: 0 16px 12px; margin: 0; }
.hesap-liste { padding-top: 4px !important; padding-bottom: 4px !important; }
.hesap-liste a { display: block; padding: 10px 22px 10px 0; border-bottom: 1px solid var(--cizgi-ince, #eef0f2); text-decoration: none; color: var(--yazi-koyu); position: relative; }
.hesap-liste a:last-child { border-bottom: 0; } .hesap-liste a span { display: block; margin-top: 2px; }
.hesap-liste a::after { content: '›'; position: absolute; right: 4px; top: 50%; transform: translateY(-50%); font-size: 20px; color: #a9b3bd; }
.hesap-liste a:hover b { color: var(--mavi); }
#guvenlik .uygulama-kilit-kart { border-top: 1px solid var(--cizgi-ince, #eef0f2); }
.hesap-cikis { margin: 4px 0 20px; } .hesap-cikis .dugme { width: 100%; }
/* Notlar tablosu telefonda: her ders bir satır kartı */
@media (max-width: 760px) {
    .portal-not-tablo thead { display: none; }
    .portal-not-tablo, .portal-not-tablo tbody { display: block; width: 100%; }
    .portal-not-tablo tbody tr td { background: none !important; }
    .portal-not-tablo tbody tr:not(.bos) { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 6px; padding: 8px 4px; border-bottom: 1px solid var(--cizgi-ince, #e3e6ea); }
    .portal-not-tablo tbody td { border: 0 !important; padding: 0 !important; }
    .portal-not-tablo td.ders { flex: 1 0 100%; font-weight: 600; }
    .portal-not-tablo td.not:empty, .portal-not-tablo td.not.yok { display: none; }
    .portal-not-tablo td.not { font-size: 12px; background: #f1f5f8; border-radius: 3px; padding: 2px 7px !important; }
    .portal-not-tablo td.not::before { content: attr(data-kod) " "; color: var(--yazi); }
    .portal-not-tablo td.ort { margin-left: auto; font-size: 13px; }
    .portal-not-tablo td.ort:not(:empty)::before { content: "Ort. "; color: var(--yazi); font-weight: 400; }
}
@media (max-width: 760px) {
    .portal-takvim-ust { gap: 6px; }
    .portal-takvim-ust .portal-baslik { flex: 1; text-align: center; font-size: 18px; white-space: nowrap; }
    .portal-takvim-ust .dugme { min-width: 0; padding: 0 12px; }
}
/* Sistem paneli: okul paketi ve modüller */
.modul-paketler { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.modul-paket { display: flex; gap: 10px; align-items: flex-start; border: 1px solid var(--cizgi); border-radius: 4px; padding: 10px 12px; cursor: pointer; background: #fff; }
.modul-paket:has(input:checked) { border-color: var(--mavi); background: #f2f8fd; }
.modul-paket input { margin-top: 3px; } .modul-paket b { display: block; color: var(--yazi-koyu); } .modul-paket small { display: block; color: var(--yazi); margin-top: 3px; line-height: 1.4; }
.modul-gruplar { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; align-items: start; }
.modul-grup { border: 1px solid var(--cizgi); border-radius: 4px; background: #fff; }
.modul-grup > summary { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 8px 12px; cursor: pointer; list-style: none; }
.modul-grup > summary::-webkit-details-marker { display: none; }
.modul-grup[open] > summary { border-bottom: 1px solid var(--cizgi-ince); }
.modul-ekranlar { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 2px 12px; padding: 8px 12px; font-size: 12.5px; }
@media (max-width: 760px) { .modul-paketler, .modul-gruplar, .modul-ekranlar { grid-template-columns: 1fr; } }
.ornek-veri-form { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; } .ornek-veri-form .girdi { width: 110px; }
/* Erken uyarı */
.eu-ozet { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 12px; margin-bottom: 16px; }
.eu-kart { display: block; padding: 12px 14px; color: var(--yazi); text-decoration: none; border-top: 3px solid var(--mavi); }
.eu-kart.kirmizi { border-top-color: var(--kirmizi); } .eu-kart.secili { background: #f2f8fd; }
.eu-kart span { display: block; font-size: 12.5px; } .eu-kart b { display: block; font-size: 24px; color: var(--yazi-koyu); margin: 2px 0; } .eu-kart small { color: var(--yazi-soluk); }
.eu-nedenler div { margin: 2px 0; font-size: 12.5px; }
.eu-etiket { display: inline-block; min-width: 78px; font-size: 11px; font-weight: 600; padding: 1px 6px; border-radius: 3px; margin-right: 4px; text-align: center; }
.eu-devamsizlik { background: #fff2dc; color: #a86a00; } .eu-not { background: #efe9f8; color: #5b3f94; } .eu-odeme { background: #fde9e9; color: #b13a39; } .eu-etut { background: #e1f5f2; color: #0a7d73; }
@media (max-width: 760px) { .eu-ozet { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

/* ---------- Öğrenci > Mezun Et ---------- */
.mz-duzen { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(320px, 1fr); gap: 15px; align-items: start; margin-bottom: 15px; }
.mz-duzen > .kart { margin-bottom: 0; }
.mz-liste .tablo-kap { max-height: 560px; overflow-y: auto; }
.mz-liste .kart-baslik, .mz-panel .kart-baslik { display: flex; align-items: center; gap: 10px; }
.mz-baslik { font-size: 12px; font-weight: 600; color: var(--yazi-koyu); margin: 14px 0 6px; }
.mz-sablonlar { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; }
.mz-sablon { display: flex; flex-direction: column; align-items: center; gap: 5px; padding: 7px; border: 1px solid #e3e7eb; cursor: pointer; font-size: 12px; position: relative; }
.mz-sablon input { position: absolute; opacity: 0; pointer-events: none; }
.mz-sablon:has(input:checked) { border: 2px solid var(--mavi); padding: 6px; background: var(--mavi-zemin); }
.mz-sablon:has(input:focus-visible) { outline: 2px solid var(--mavi); outline-offset: 2px; }
.mz-sablon-ornek { width: 100%; height: 44px; background: #fffdf7; box-sizing: border-box; }
.mz-sablon-ornek.zarif { border: 4px solid var(--mz-renk, #1d4fa3); background: #fff; position: relative;
    box-shadow: inset 0 0 0 3px #fff, inset 0 0 0 4px #c9b06b; }
.mz-sablon-ornek.zarif::before, .mz-sablon-ornek.zarif::after { content: ""; position: absolute; width: 8px; height: 8px; border: 2px solid #b8963e; }
.mz-sablon-ornek.zarif::before { left: 6px; top: 6px; border-right: 0; border-bottom: 0; } .mz-sablon-ornek.zarif::after { right: 6px; bottom: 6px; border-left: 0; border-top: 0; }
.mz-sablon-ornek.klasik { border: 4px double var(--mz-renk, #1b4f7a); }
.mz-sablon-ornek.modern { border-left: 16px solid var(--mz-renk, #0aa699); border-top: 1px solid #e3e7eb; border-right: 1px solid #e3e7eb; border-bottom: 1px solid #e3e7eb; background: linear-gradient(#f5b301, #f5b301) 12px 14px / 26px 4px no-repeat #fff; }
.mz-sablon-ornek.neseli { border: 3px dashed var(--mz-renk, #1b8dce); border-radius: 8px; background: #fff8e8 radial-gradient(circle, #f5b301 2px, transparent 3px) 0 0 / 14px 14px; }
.mz-kagitlar { display: flex; gap: 6px; flex-wrap: wrap; }
.mz-kagitlar label { cursor: pointer; }
.mz-kagitlar input { position: absolute; opacity: 0; pointer-events: none; }
.mz-kagitlar span { display: inline-block; padding: 6px 13px; border: 1px solid #dfe3e8; font-size: 12.5px; }
.mz-kagitlar input:checked + span { background: var(--mavi); border-color: var(--mavi); color: #fff; }
.mz-kagitlar input:focus-visible + span { outline: 2px solid var(--mavi); outline-offset: 2px; }
.mz-secenek { display: flex; gap: 8px; align-items: flex-start; font-size: 12.5px; line-height: 1.45; margin: 5px 0; cursor: pointer; }
.mz-secenek input { margin-top: 3px; accent-color: var(--mavi); }
.mz-secenek small { display: block; color: var(--yazi-soluk); }
.mz-secenek.pasif { opacity: .55; cursor: default; }
.mz-not { background: #f6f8fa; padding: 8px 10px; margin: 12px 0 0; line-height: 1.5; }
.mz-dugme { display: inline-flex; align-items: center; gap: 7px; }
.mz-dugme svg { width: 18px; height: 18px; }
@media (max-width: 1000px) { .mz-duzen { grid-template-columns: 1fr; } }

/* Mezun Et sonrası kutlama: konfeti + kep */
.mz-kutlama { position: fixed; inset: 0; z-index: 2000; background: rgba(20, 30, 48, .62); display: flex; align-items: center; justify-content: center; padding: 16px; overflow: hidden; }
.mz-konfetiler { position: absolute; inset: 0; pointer-events: none; }
.mz-konfetiler span { position: absolute; top: -40px; animation: mz-dus linear infinite; }
@keyframes mz-dus { 0% { transform: translateY(-40px) rotate(0); opacity: 1; } 85% { opacity: 1; } 100% { transform: translateY(105vh) rotate(720deg); opacity: 0; } }
.mz-kutlama-kart { position: relative; width: 540px; max-width: 100%; background: #fff; border-top: 6px solid #0aa699; box-shadow: 0 24px 60px rgba(0,0,0,.35); text-align: center; padding: 0 34px 26px; box-sizing: border-box; margin-top: 60px; animation: mz-kart .45s ease-out both; }
@keyframes mz-kart { from { transform: scale(.85); opacity: 0; } to { transform: scale(1); opacity: 1; } }
.mz-kep { width: 210px; height: 132px; display: block; margin: -68px auto 0; animation: mz-kep 1.1s cubic-bezier(.3, 1.4, .5, 1) both; }
@keyframes mz-kep { 0% { transform: translateY(-120px) rotate(-25deg) scale(.6); opacity: 0; } 55% { transform: translateY(12px) rotate(8deg) scale(1.08); opacity: 1; } 75% { transform: translateY(-6px) rotate(-4deg) scale(1); } 100% { transform: none; opacity: 1; } }
.mz-puskul { transform-origin: 120px 62px; animation: mz-puskul 1.6s ease-in-out infinite; }
@keyframes mz-puskul { 0%, 100% { transform: rotate(-6deg); } 50% { transform: rotate(8deg); } }
.mz-tebrik { font-size: 28px; font-weight: 700; color: var(--yazi-koyu); margin-top: 2px; }
.mz-kutlama-kart p { font-size: 15px; margin: 8px 0 0; line-height: 1.5; } .mz-kutlama-kart p b { color: #0a7d73; }
.mz-kutlama-ozet { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin-top: 18px; }
.mz-kutlama-ozet div { background: #f2f8fd; padding: 10px 6px; } .mz-kutlama-ozet div:nth-child(2) { background: #e9f8f6; } .mz-kutlama-ozet div:nth-child(3) { background: #fff7e6; }
.mz-kutlama-ozet b { display: block; font-size: 19px; color: #0090d9; overflow-wrap: anywhere; } .mz-kutlama-ozet div:nth-child(2) b { color: #0aa699; } .mz-kutlama-ozet div:nth-child(3) b { color: #c98c00; }
.mz-kutlama-ozet span { font-size: 12px; color: var(--yazi-soluk); }
.mz-kutlama-dugmeler { display: flex; gap: 8px; margin-top: 20px; } .mz-kutlama-dugmeler .dugme { flex: 1; justify-content: center; text-align: center; }
@media (prefers-reduced-motion: reduce) { .mz-konfetiler span, .mz-kep, .mz-puskul, .mz-kutlama-kart { animation: none; } .mz-konfetiler { display: none; } }

/* Kurumsal > Mezuniyet Belgesi Tasarımı */
.mz-ayar { display: grid; grid-template-columns: minmax(360px, 1fr) minmax(0, 1.25fr); gap: 15px; align-items: start; }
.mz-ayar > .kart { margin-bottom: 0; }
.mz-onizleme-kart { position: sticky; top: 12px; }
.mz-onizleme { width: 100%; aspect-ratio: 297 / 212; border: 0; background: #e9ecef; display: block; }
.mz-gorsel { display: flex; align-items: center; gap: 10px; margin-bottom: 6px; } .mz-gorsel img { height: 44px; max-width: 140px; object-fit: contain; border: 1px solid #eceef1; background: #fff; }
.mz-imza { display: grid; grid-template-columns: 26px repeat(3, minmax(0, 1fr)); gap: 8px 10px; align-items: end; padding: 10px 0; border-bottom: 1px solid #eef0f3; }
.mz-imza > .alan:last-child { grid-column: 2 / -1; }
.mz-imza .alan { margin: 0; }
.mz-imza-no { width: 24px; height: 24px; border-radius: 50%; background: var(--mavi-zemin); color: var(--mavi-yazi); font-size: 12px; font-weight: 600; display: flex; align-items: center; justify-content: center; margin-bottom: 4px; }
.mz-imza.yok [data-mz-imza-ad], .mz-imza.yok [data-mz-imza-alan] { opacity: .4; }
.mz-imza .mz-gorsel img { height: 30px; }
@media (max-width: 600px) { .mz-imza { grid-template-columns: 26px minmax(0, 1fr); } .mz-imza > .alan { grid-column: 2; } }
.mz-fontlar { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; }
.mz-font { display: flex; flex-direction: column; align-items: center; gap: 2px; padding: 6px 4px; border: 1px solid #e3e7eb; cursor: pointer; position: relative; text-align: center; }
.mz-font input { position: absolute; opacity: 0; pointer-events: none; }
.mz-font:has(input:checked) { border: 2px solid var(--mavi); padding: 5px 3px; background: var(--mavi-zemin); }
.mz-font:has(input:focus-visible) { outline: 2px solid var(--mavi); outline-offset: 2px; }
.mz-font-ornek { color: #1d4fa3; line-height: 1.3; white-space: nowrap; }
.mz-font small { font-size: 10.5px; color: #6b7280; }
@media (max-width: 600px) { .mz-fontlar { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.mz-renk-izgara { display: grid; grid-template-columns: 1fr; gap: 2px; }
.mz-renk-yok { display: inline-flex !important; align-items: center; justify-content: center; width: auto !important; padding: 0 8px !important; font-size: 11px; color: #6b7280;
    background: repeating-linear-gradient(45deg, #fff 0 5px, #f1f3f5 5px 10px); }
.mz-alanlar { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 6px; }
.mz-alanlar code { font-size: 11px; background: var(--mavi-zemin); color: var(--mavi-yazi); padding: 3px 7px; cursor: pointer; }
.mz-renkler { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }
.mz-renkler label { cursor: pointer; display: inline-flex; }
.mz-renkler input[type=radio] { position: absolute; opacity: 0; pointer-events: none; }
.mz-renkler span, .mz-renkler input[type=color] { width: 30px; height: 30px; border: 3px solid #fff; box-shadow: 0 0 0 1px #dfe3e8; box-sizing: border-box; padding: 0; }
.mz-renkler input[type=radio]:checked + span, .mz-renkler input[type=radio]:checked + input[type=color] { border-color: #f5b301; }
.mz-renkler input[type=radio]:focus-visible + span { outline: 2px solid var(--mavi); outline-offset: 2px; }
@media (max-width: 1000px) { .mz-ayar { grid-template-columns: 1fr; } .mz-onizleme-kart { position: static; } }

/* ---------- Yapay Zekâ Asistanı ---------- */
.yz-durum { display: flex; gap: 12px; align-items: flex-start; padding: 11px 16px; margin-bottom: 15px; border: 1px solid #d9e6f2; background: #f3f8fd; font-size: 13px; line-height: 1.5; }
.yz-durum > svg { width: 22px; height: 22px; flex-shrink: 0; color: #6b4ea0; margin-top: 1px; }
.yz-durum small { display: block; color: var(--yazi-soluk); margin-top: 2px; }
.yz-durum.yz-yok { background: #fdeeee; border-color: #f3caca; } .yz-durum.yz-yok > svg { color: #c0392b; }
.yz-dugme { display: inline-flex; align-items: center; gap: 6px; } .yz-dugme svg { width: 16px; height: 16px; }
.yz-yaziyor { opacity: .75; cursor: progress; }
.yz-duzen { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr); gap: 15px; align-items: start; margin-bottom: 15px; }
.yz-duzen > .kart { margin-bottom: 0; }
@media (max-width: 1000px) { .yz-duzen { grid-template-columns: 1fr; } }
.yz-cikti { font-size: 13.5px; line-height: 1.6; color: var(--yazi-koyu); }
.yz-cikti p { margin: 0 0 6px; }
.yz-alt-baslik { font-weight: 700; margin: 10px 0 4px; color: #4b3a7a; }
.yz-madde { position: relative; padding-left: 16px; margin: 3px 0; } .yz-madde::before { content: ''; position: absolute; left: 3px; top: .62em; width: 6px; height: 6px; border-radius: 50%; background: #8e5ea2; }
.yz-bosluk { height: 4px; }
.yz-cikti-alt { margin-top: 12px; padding-top: 10px; border-top: 1px solid #eceef1; }
.yz-ince { display: block; font-size: 11px; color: var(--yazi-soluk); font-weight: 400; }
.yz-karne-tablo td { vertical-align: top; }
.yz-yorum-hucre { min-width: 380px; } .yz-yorum-hucre textarea { width: 100%; min-height: 64px; font-family: inherit; line-height: 1.45; resize: vertical; box-sizing: border-box; }
.yz-yorum-hucre .rozet { margin-top: 3px; }
.yz-taslak { border: 1px solid #e6e2f0; background: #fbfaff; padding: 12px 14px; margin-bottom: 12px; }
.yz-taslak-baslik { font-weight: 600; font-size: 12.5px; display: flex; justify-content: space-between; color: #4b3a7a; }
.yz-taslak-metin { white-space: pre-line; line-height: 1.55; margin: 8px 0 10px; color: var(--yazi-koyu); }
.yz-taslak-alt { display: flex; gap: 8px; }
.yz-soru-satir { display: flex; gap: 8px; } .yz-soru-satir .girdi { flex: 1; height: 40px; font-size: 15px; } .yz-soru-satir .dugme { height: 40px; }
.yz-ornekler { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; margin-top: 12px; }
.yz-ornek { border: 1px solid #ddd5ee; background: #f7f4fc; color: #4b3a7a; padding: 4px 10px; font: inherit; font-size: 12px; cursor: pointer; border-radius: 12px; }
.yz-ornek:hover { background: #efe9f8; }
.yz-hizli { display: flex; gap: 14px; align-items: flex-end; padding-bottom: 14px; font-size: 13px; }
.yz-bolum { font-weight: 700; font-size: 12.5px; color: var(--yazi-koyu); margin: 12px 0 4px; } .yz-bolum:first-child { margin-top: 0; }
.yz-sayilar td { padding: 6px 8px; }
.yz-kimin { background: #f6f8fa; padding: 8px 10px; margin-bottom: 12px; line-height: 1.5; }
.yz-cubuk { height: 6px; background: #eceef1; margin: 8px 0 4px; } .yz-cubuk span { display: block; height: 100%; background: #8e5ea2; }
.yz-gizlilik p { margin: 0 0 8px; line-height: 1.55; }
.yz-sorular { max-height: 680px; overflow-y: auto; }
.yz-soru-kutu { border-bottom: 1px solid #eceef1; padding: 10px 0; } .yz-soru-kutu:first-child { padding-top: 0; }
.yz-soru-metin { line-height: 1.5; color: var(--yazi-koyu); }
.yz-secenekler { margin: 6px 0 4px 20px; padding: 0; line-height: 1.5; } .yz-secenekler li.dogru { color: #0a7d73; font-weight: 600; }
.yz-soru .kart-baslik svg { width: 16px; height: 16px; vertical-align: -3px; color: #6b4ea0; }

/* ---------- Akademik > Otomatik Ders Programı ---------- */
.op-adimlar { display: flex; gap: 0; margin-bottom: 15px; border: 1px solid #dfe3e8; background: #fff; overflow-x: auto; }
.op-adimlar a { flex: 1; text-align: center; padding: 11px 12px; color: var(--yazi-koyu); text-decoration: none; border-right: 1px solid #eceef1; white-space: nowrap; font-size: 13px; }
.op-adimlar a:last-child { border-right: 0; } .op-adimlar a:hover { background: #f5f8fb; }
.op-adimlar a.secili { background: var(--mavi); color: #fff; font-weight: 600; }
.op-yuk-kap { overflow-x: auto; }
.op-yuk th, .op-yuk td { white-space: nowrap; vertical-align: top; }
.op-yuk thead th, .op-yuk tfoot th { position: sticky; background: #f6f8fa; z-index: 1; } .op-yuk thead th { top: 0; }
.op-yuk td:first-child, .op-yuk th:first-child { position: sticky; left: 0; background: #fff; z-index: 2; min-width: 150px; }
.op-hucre { min-width: 150px; } .op-hucre.oneri { background: #fffbef; }
.op-saat { width: 54px; height: 28px; text-align: center; padding: 0 4px; }
.op-hucre .op-ogr { display: block; width: 100%; min-width: 0; height: 28px; margin-top: 4px; font-size: 12px; box-sizing: border-box; }
.op-hucre .op-saat { display: block; }
.op-yuk tfoot th.op-asim { color: #c0392b; background: #fdeeee; } .op-yuk tfoot th.op-tam { color: #0a7d73; }
.op-kisit { display: grid; grid-template-columns: 300px minmax(0, 1fr); gap: 15px; align-items: start; }
.op-kisit > .kart { margin-bottom: 0; }
.op-ogr-liste { max-height: 620px; overflow-y: auto; }
.op-ogr-liste a { display: flex; justify-content: space-between; align-items: center; gap: 8px; padding: 8px 14px; border-bottom: 1px solid #eef0f3; color: var(--yazi-koyu); text-decoration: none; font-size: 13px; }
.op-ogr-liste a small { display: block; color: var(--yazi-soluk); font-size: 11px; }
.op-ogr-liste a.secili { background: var(--mavi-zemin); border-left: 3px solid var(--mavi); padding-left: 11px; }
.op-rozetler { display: flex; gap: 6px; align-items: center; white-space: nowrap; }
.op-izgara { table-layout: fixed; } .op-izgara th:first-child { width: 80px; } .op-izgara td { padding: 3px; } .op-izgara th label { cursor: pointer; font-weight: 600; }
.op-kutu { display: block; cursor: pointer; } .op-kutu input { position: absolute; opacity: 0; pointer-events: none; }
.op-kutu span { display: block; height: 30px; background: #eef8f1; border: 1px solid #d5ecdc; }
.op-kutu input:checked + span { background: #f8d7d7; border-color: #eab3b3; background-image: repeating-linear-gradient(45deg, transparent 0 6px, rgba(192,57,43,.18) 6px 8px); }
.op-kutu input:focus-visible + span { outline: 2px solid var(--mavi); outline-offset: 1px; }
.op-gunluk { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 10px; }
.op-gunluk label { font-size: 12.5px; display: flex; flex-direction: column; gap: 4px; } .op-gunluk input { width: 90px; }
.op-dersler { display: flex; flex-wrap: wrap; gap: 6px 16px; font-size: 13px; } .op-dersler label { cursor: pointer; }
.op-ozet { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 8px; }
.op-ozet div { background: #f6f8fa; padding: 10px; text-align: center; } .op-ozet b { display: block; font-size: 19px; color: var(--yazi-koyu); }
.op-ozet span { font-size: 12px; color: var(--yazi-soluk); } .op-ozet .iyi { background: #e9f8f6; } .op-ozet .iyi b { color: #0a7d73; } .op-ozet .kotu { background: #fdeeee; } .op-ozet .kotu b { color: #c0392b; }
.op-program { table-layout: fixed; } .op-program th:first-child { width: 54px; }
.op-program td { height: 46px; vertical-align: top; padding: 5px 7px; line-height: 1.3; } .op-program td b { display: block; font-size: 12.5px; } .op-program td small { color: #5c6470; font-size: 11px; }
.tablo.op-program tbody tr td.bos { background: #fafbfc; }
.tablo.op-program tbody tr td.op-r0 { background: #e8f3fc; } .tablo.op-program tbody tr td.op-r1 { background: #e9f8f6; } .tablo.op-program tbody tr td.op-r2 { background: #fff6e0; } .tablo.op-program tbody tr td.op-r3 { background: #fdecec; } .tablo.op-program tbody tr td.op-r4 { background: #f1ebf8; }
.tablo.op-program tbody tr td.op-r5 { background: #fff0e4; } .tablo.op-program tbody tr td.op-r6 { background: #eaf7e5; } .tablo.op-program tbody tr td.op-r7 { background: #fde9f2; } .tablo.op-program tbody tr td.op-r8 { background: #e6f4f7; } .tablo.op-program tbody tr td.op-r9 { background: #f3f1e7; }
.op-program tbody td { border: 2px solid #fff; }
@media (max-width: 900px) { .op-kisit { grid-template-columns: 1fr; } .op-ozet { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.op-duzenle tbody td[data-g] { cursor: pointer; position: relative; }
.op-duzenle tbody td.op-secili { outline: 3px solid var(--mavi); outline-offset: -3px; }
.op-duzenle tbody td.op-hedef { outline: 2px dashed #0aa699; outline-offset: -3px; }
.op-sabitle { position: absolute; right: 3px; top: 3px; margin: 0; }
.op-sabitle button { border: 0; background: transparent; padding: 2px; cursor: pointer; color: #9aa3ad; opacity: 0; line-height: 0; }
.op-sabitle button svg { width: 14px; height: 14px; }
.op-duzenle td:hover .op-sabitle button, .op-sabit .op-sabitle button { opacity: 1; }
.op-sabit .op-sabitle button { color: #c0392b; }
.tablo.op-program tbody tr td.op-sabit { box-shadow: inset 0 0 0 2px #e6b0aa; }
.op-etiket { display: inline-block; font-size: 10px; background: rgba(0,0,0,.08); color: #4a5260; padding: 0 5px; border-radius: 8px; margin-top: 2px; }
.op-ipucu { margin: 10px 20px 0; } .op-ipucu svg { width: 13px; height: 13px; vertical-align: -2px; }
.op-ipucu .op-hata { color: #c0392b; font-weight: 600; }
.op-oda { width: 140px; height: 28px; font-size: 12px; }
.op-grup { margin-top: 4px; font-size: 11.5px; } .op-grup summary { cursor: pointer; color: var(--mavi-yazi); list-style: none; } .op-grup summary::-webkit-details-marker { display: none; }
.op-grup[open] summary { color: var(--yazi-soluk); }

/* Zil: alttaki "bütün bildirimlerim" bağlantısı */
.bildirim-liste a.bildirim-tumu { justify-content: center; font-size: 12px; color: var(--mavi, #0090d9); border-top: 1px solid #eef0f3; background: #fafbfc; }

/* ---------- CRM > Etkinlik Takvimi ---------- */
.et-ust { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin-bottom: 12px; }
.et-ust h2 { margin: 0 10px; font-size: 18px; font-weight: 600; color: var(--yazi-koyu); min-width: 180px; }
.et-ust .bosluk { flex: 1; }
.et-ust .dugme.secili { background: var(--mavi-bant); color: #fff; }
.et-suzgec { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin-bottom: 12px; }
.et-suzgec .secim { width: 220px; }
.et-olay { display: block; margin: 2px 0; padding: 2px 6px; font-size: 11.5px; line-height: 1.35; border-left: 3px solid var(--et, #0090d9); background: color-mix(in srgb, var(--et, #0090d9) 12%, #fff);
    color: #26303d; text-decoration: none; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; border-radius: 2px; }
.et-olay:hover { background: color-mix(in srgb, var(--et, #0090d9) 22%, #fff); color: #111; }
.et-olay.pasif { opacity: .5; text-decoration: line-through; }
.et-ETKINLIK { --et: #0090d9; } .et-TOPLANTI { --et: #6b4ea0; } .et-SINAV { --et: #e67e22; } .et-GEZI { --et: #0aa699; }
.et-TOREN { --et: #c0392b; } .et-SEMINER { --et: #2c7a7b; } .et-SPOR { --et: #27ae60; } .et-TATIL { --et: #8b93a1; }
.et-aciklama { display: flex; flex-wrap: wrap; gap: 12px; font-size: 12px; color: var(--yazi); margin-top: 10px; }
.et-aciklama span::before { content: ""; display: inline-block; width: 10px; height: 10px; margin-right: 5px; background: var(--et); vertical-align: -1px; border-radius: 2px; }
.takvim-izgara.ay td.haftasonu { background: #fafbfc; }
.takvim-izgara.ay td.bugun { background: #fcf8e3; }
.takvim-izgara.ay td .gun-ekle { float: left; visibility: hidden; color: #9aa1ad; font-size: 14px; line-height: 1; padding: 2px 3px; text-decoration: none; }
.takvim-izgara.ay td:hover .gun-ekle { visibility: visible; }
.et-hafta { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); border: 1px solid #e3e3e3; background: #fff; }
.et-hafta > div { border-right: 1px solid #e3e3e3; min-height: 360px; padding: 6px; }
.et-hafta > div:last-child { border-right: 0; }
.et-hafta .baslik { font-size: 12px; font-weight: 600; color: var(--yazi-koyu); padding-bottom: 6px; border-bottom: 1px solid #eef0f3; margin-bottom: 6px; display: flex; justify-content: space-between; }
.et-hafta .bugun { background: #fffcf0; }
.et-hafta .et-olay { white-space: normal; }
.et-hafta .et-olay small { display: block; color: #6b7280; }
.et-yil { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
.et-ay { background: #fff; border: 1px solid #e3e7eb; padding: 8px 10px 10px; }
.et-ay h3 { margin: 0 0 6px; font-size: 13px; font-weight: 600; display: flex; justify-content: space-between; }
.et-ay h3 a { color: var(--yazi-koyu); text-decoration: none; } .et-ay h3 span { color: #8b93a1; font-weight: 400; font-size: 11.5px; }
.et-ay table { width: 100%; border-collapse: collapse; table-layout: fixed; font-size: 11px; text-align: center; }
.et-ay th { color: #9aa1ad; font-weight: 500; padding: 2px 0; }
.et-ay td { padding: 1px 0; height: 22px; position: relative; }
.et-ay td a { display: block; color: #3a4350; text-decoration: none; line-height: 20px; border-radius: 50%; width: 22px; margin: 0 auto; }
.et-ay td.disari a { visibility: hidden; }
.et-ay td.var a { background: var(--et); color: #fff; font-weight: 600; }
.et-ay td.bugun a { outline: 2px solid #f5b301; }
.et-ay ul { list-style: none; margin: 8px 0 0; padding: 0; font-size: 11.5px; }
.et-ay li { padding: 2px 0; border-top: 1px dashed #eef0f3; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.et-ay li b { display: inline-block; min-width: 22px; color: #3a4350; }
.et-ay li i { display: inline-block; width: 8px; height: 8px; border-radius: 50%; background: var(--et); margin-right: 4px; font-style: normal; }
@media (max-width: 1200px) { .et-yil { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 860px) { .et-yil { grid-template-columns: repeat(2, minmax(0, 1fr)); } .et-hafta { grid-template-columns: 1fr; } .et-hafta > div { min-height: 0; border-right: 0; border-bottom: 1px solid #e3e3e3; } }
@media (max-width: 520px) { .et-yil { grid-template-columns: 1fr; } }
.et-hedef { display: flex; flex-wrap: wrap; gap: 6px 18px; }
.et-ust .dugme { min-width: 0; padding-left: 14px; padding-right: 14px; }

/* Portal: aylık / yıllık plan geçişi ve yıllık plan listesi */
.portal-gorunum { display: inline-flex; margin-left: auto; border: 1px solid #d5dbe1; border-radius: 4px; overflow: hidden; }
.portal-gorunum a { padding: 6px 12px; font-size: 13px; color: #3a4350; text-decoration: none; background: #fff; }
.portal-gorunum a.secili { background: #0b78b8; color: #fff; }
.portal-yil-ay { margin-bottom: 12px; }
.portal-yil-ay .kart-baslik { font-size: 14px; }
.portal-yil-satir { display: flex; gap: 12px; padding: 8px 0; border-bottom: 1px solid #eef0f3; }
.portal-yil-satir:last-child { border-bottom: 0; }
.portal-yil-tarih { flex: 0 0 64px; text-align: center; border-radius: 4px; background: var(--r-acik, #eef4fb); color: var(--r, #0a6fa8); padding: 4px 0; line-height: 1.15; }
.portal-yil-tarih b { display: block; font-size: 20px; } .portal-yil-tarih span { font-size: 11px; }
.portal-yil-satir .as-not { display: block; margin-top: 2px; }
.portal-yil-satir.gecti { opacity: .55; }
/* Sistem paneli: okula özel giriş ekranı adresleri */
.giris-adresler { margin-top: 6px; font-size: 12px; background: #f4f8fb; border: 1px solid #e1e8ef; border-radius: 4px; padding: 6px 9px; line-height: 1.7; word-break: break-all; }

/* Okulun rengi (sistem paneli > Giriş ekranı): layouts/app body'ye --mavi… değişkenleri yazılır; Nova logosu, renk bandı, uyarı renkleri değişmez */
.ust-kurum.okul-logolu { display: flex; align-items: center; }
.ust-kurum.okul-logolu img { display: block; max-height: 38px; max-width: 200px; object-fit: contain; }
.as-bant-slogan.okul-slogani { font-size: clamp(30px, 2.6vw, 40px); max-width: 38%; }
/* Kurumsal > Karne Tasarımı */
.karne-ornek { display: block; width: 74px; height: 96px; background: #fff; border: 1px solid #d9dde2; position: relative; padding: 8px 7px; box-sizing: border-box; }
.karne-ornek i { display: block; height: 5px; background: #d5dae0; margin-bottom: 6px; border-radius: 1px; }
.karne-ornek i:first-child { height: 8px; background: var(--mavi); width: 70%; margin: 0 auto 9px; }
.karne-ornek.resmi { border: 3px double var(--mavi); }
.karne-ornek.modern i:first-child { width: auto; margin: -8px -7px 9px; height: 18px; }
.karne-ornek.sade i:first-child { background: #333; width: 100%; height: 3px; }
.karne-bolumler { display: flex; flex-wrap: wrap; gap: 6px 20px; }
.secim-satiri { display: flex; gap: 18px; align-items: center; min-height: 37px; }
.karne-onizleme { aspect-ratio: 210 / 297; max-height: 1000px; }
/* Sistem paneli: abonelik kartı */
.abonelik-izgara, .abonelik-alt { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 380px), 1fr)); gap: 18px 26px; }
.abonelik-alt { border-top: 1px solid var(--cizgi); }
.abonelik-hesap td { white-space: normal; }
.abonelik-hesap tr.ara td { color: var(--yazi-soluk); }
.abonelik-hesap tr.top td { font-weight: 700; color: var(--yazi-koyu); border-top: 2px solid var(--cizgi); }
.abonelik-uyari { background: #fff7e6; border: 1px solid #f1d29a; color: #7a5200; padding: 7px 11px; font-size: 12.5px; margin: 0 0 12px; }
.abonelik-odeme { display: grid; grid-template-columns: 140px 120px 1fr auto; gap: 8px; margin-top: 10px; }
@media (max-width: 700px) { .abonelik-odeme { grid-template-columns: 1fr 1fr; } }
.tablo tr.secili td { background: var(--mavi-zemin); }
.abonelik-bant { display: flex; gap: 12px; align-items: center; flex-wrap: wrap; background: #fff7e6; border: 1px solid #f1d29a; border-left: 4px solid #e98a15; padding: 11px 16px; margin-bottom: 16px; color: #5c3d00; font-size: 13px; }
.abonelik-bant.kirmizi { background: #fdecec; border-color: #f2b8b8; border-left-color: #e04b4a; color: #7a1f1f; }
.abonelik-bant b { color: inherit; }
/* Öğrenci > Giriş-Çıkış listesi */
.kapi-ozet { display: flex; gap: 10px; flex-wrap: wrap; margin-bottom: 16px; }
.kapi-ozet a { background: #fff; border: 1px solid var(--cizgi); border-top: 3px solid var(--mavi); padding: 8px 14px; min-width: 120px; color: var(--yazi); }
.kapi-ozet a span { display: block; font-size: 12px; } .kapi-ozet a b { font-size: 20px; color: var(--yazi-koyu); }
.kapi-ozet a.yesil { border-top-color: #2e9b57; } .kapi-ozet a.turuncu { border-top-color: #e98a15; } .kapi-ozet a.kirmizi { border-top-color: #e04b4a; } .kapi-ozet a.gri { border-top-color: #9aa3ad; }
.kapi-ozet a.secili { background: var(--mavi-zemin); box-shadow: inset 0 0 0 1px var(--mavi); }
.kapi-elle { display: inline-flex; gap: 4px; align-items: center; }
.kapi-elle .girdi { height: 28px; width: 92px; padding: 0 6px; } .kapi-elle input[name=aciklama] { width: 110px; }
.kapi-elle .dugme { min-width: 0; height: 28px; padding: 0 10px; font-size: 12px; }
.kapi-kart { display: inline-block; margin-left: 4px; }
.kapi-yardim ol { margin: 0; padding-left: 20px; line-height: 1.7; }
/* Servis > Günlük takip */
.servis-detay { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 420px), 1fr)); gap: 18px; }
/* Veli portalı: kantin */
.kantin-cuzdan { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 12px; }
.kantin-cuzdan > div { background: linear-gradient(135deg, #0b78b8, #0aa699); color: #fff; border-radius: 12px; padding: 12px 16px; }
.kantin-cuzdan > div + div { background: #fff; color: var(--yazi-koyu); border: 1px solid var(--cizgi); }
.kantin-cuzdan small { display: block; font-size: 12px; opacity: .85; } .kantin-cuzdan b { display: block; font-size: 24px; }
.kantin-yasak { display: flex; flex-wrap: wrap; gap: 6px 18px; }