/* =====================================================================
   EgitimPro — Sol Menü / Sidebar (2026)
   ---------------------------------------------------------------------
   Tasarım ilkeleri:
     • Sade, düşük kontrastlı sıcak nötr zemin, gölge yerine ince çizgi
     • Yumuşak köşeli (12px) satırlar, geniş nefes alanı
     • Aktif durum: soft tint + sol tarafta ince aksan çubuğu
     • Bölüm başlıkları: küçük, harf aralıklı, sessiz
     • Kısaltılmış (mini) sidebar ile tam uyumlu
   Kapsam: admin, okul, öğretmen (Modernize) + öğrenci, veli (Around)
   ===================================================================== */

/* ==================================================================== */
/* A. MODERNIZE PANELLERİ (admin / okul / öğretmen)                     */
/* ==================================================================== */

.left-sidebar {
    background: var(--neutral-bg, #faf8f7);
    border-right: 1px solid var(--neutral-line, #ece5e1);
    box-shadow: none;
}
[data-bs-theme="dark"] .left-sidebar {
    background: var(--neutral-bg, #241f1d);
    border-right-color: var(--neutral-line, #2f2b28);
}

/* --- Marka alanı ---------------------------------------------------- */
.left-sidebar .brand-logo {
    min-height: 78px;
    padding: 0 20px;
    position: sticky;
    top: 0;
    z-index: 5;
    background: var(--neutral-bg, #faf8f7);
}
[data-bs-theme="dark"] .left-sidebar .brand-logo { background: var(--neutral-bg, #241f1d); }
.left-sidebar .brand-logo .logo-img img {
    transition: transform .25s ease;
}
.left-sidebar .brand-logo .logo-img:hover img {
    transform: scale(1.03);
}

/* --- Kaydırma alanı ------------------------------------------------- */
.left-sidebar .scroll-sidebar {
    padding: 4px 14px 24px;
}
.left-sidebar .scroll-sidebar .simplebar-scrollbar::before {
    background: rgba(var(--brand-rgb, 201, 127, 103), .35);
    border-radius: 99px;
}
.left-sidebar .sidebar-nav ul#sidebarnav {
    padding: 0;
    margin: 0;
}

/* --- Bölüm başlıkları ----------------------------------------------- */
.left-sidebar .nav-small-cap {
    margin: 22px 0 6px;
    padding: 0 12px;
    font-size: 10.5px;
    font-weight: 700;
    letter-spacing: .09em;
    line-height: 18px;
    text-transform: uppercase;
    color: var(--neutral-muted, #8b8079);
    opacity: .85;
}
.left-sidebar .sidebar-nav ul#sidebarnav > .nav-small-cap:first-child {
    margin-top: 10px;
}
[data-bs-theme="dark"] .left-sidebar .nav-small-cap { color: var(--neutral-muted, #8b8079); }

/* Noktalı ikon sade görünüm için gizlenir (mini modda tema geri açar) */
.left-sidebar .nav-small-cap .nav-small-cap-icon { display: none; }

/* --- Menü satırları -------------------------------------------------- */
.left-sidebar .sidebar-nav ul .sidebar-item .sidebar-link {
    position: relative;
    display: flex;
    align-items: center;
    gap: 12px;
    margin: 2px 0;
    padding: 10px 12px;
    border-radius: 12px;
    font-size: 14px;
    font-weight: 500;
    line-height: 22px;
    color: var(--neutral-body, #6a615b);
    background: transparent;
    transition: background-color .18s ease, color .18s ease, transform .18s ease;
}
[data-bs-theme="dark"] .left-sidebar .sidebar-nav ul .sidebar-item .sidebar-link {
    color: var(--neutral-body, #a4b0c0);
}

.left-sidebar .sidebar-nav .sidebar-link > span:first-child {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 22px;
}
.left-sidebar .sidebar-nav .sidebar-link i {
    font-size: 19px;
    line-height: 1;
    color: var(--neutral-muted, #8b8079);
    transition: color .18s ease;
}
[data-bs-theme="dark"] .left-sidebar .sidebar-nav .sidebar-link i { color: var(--neutral-muted, #8b8079); }

.left-sidebar .sidebar-nav .sidebar-link .hide-menu {
    overflow: hidden;
    text-overflow: ellipsis;
}

/* Hover */
.left-sidebar .sidebar-nav ul .sidebar-item .sidebar-link:hover {
    background: rgba(var(--brand-rgb, 201, 127, 103), .08);
    color: var(--brand-ink, #a05941);
    transform: translateX(2px);
}
.left-sidebar .sidebar-nav ul .sidebar-item .sidebar-link:hover i {
    color: var(--brand, #c97f67);
}

/* Aktif */
.left-sidebar .sidebar-nav ul .sidebar-item .sidebar-link.active,
.left-sidebar .sidebar-nav ul .sidebar-item.selected > .sidebar-link,
.left-sidebar .sidebar-nav ul .sidebar-item > .sidebar-link.active {
    background: rgba(var(--brand-rgb, 201, 127, 103), .13);
    color: var(--brand-ink, #a05941);
    font-weight: 600;
    box-shadow: none;
}
.left-sidebar .sidebar-nav ul .sidebar-item .sidebar-link.active i {
    color: var(--brand, #c97f67);
}
[data-bs-theme="dark"] .left-sidebar .sidebar-nav ul .sidebar-item .sidebar-link.active {
    background: rgba(214, 154, 132, .16);
    color: #e3b6a6;
}
[data-bs-theme="dark"] .left-sidebar .sidebar-nav ul .sidebar-item .sidebar-link.active i {
    color: #d69a84;
}

/* Sol aksan çubuğu — satırın içinde (simplebar taşmayı kırptığı için) */
.left-sidebar .sidebar-nav ul .sidebar-item .sidebar-link.active::before {
    content: "";
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 3px;
    height: 20px;
    border-radius: 0 3px 3px 0;
    background: var(--brand, #c97f67);
}
.left-sidebar .sidebar-nav ul .sidebar-item .sidebar-link.active:hover {
    background: rgba(var(--brand-rgb, 201, 127, 103), .18);
    transform: translateX(2px);
}

/* Eski tema oku kaldırılır (has-arrow açılır menüler hariç) */
.left-sidebar .sidebar-nav .sidebar-link.active:not(.has-arrow)::after {
    content: none;
}

/* Açılır alt menüler */
.left-sidebar .sidebar-nav .sidebar-link.has-arrow::after {
    border-color: var(--neutral-muted, #8b8079);
}
.left-sidebar .sidebar-nav .first-level .sidebar-link {
    padding-left: 46px;
    font-size: 13.5px;
}

/* Rozet / sayaç hizası */
.left-sidebar .sidebar-nav .sidebar-link .badge {
    margin-left: auto;
    font-size: 11px;
    font-weight: 600;
    padding: 3px 7px;
    border-radius: 99px;
}

/* Uyarı kutusu (admin/okul olarak giriş bandı) */
.left-sidebar .sidebar-item.bg-warning-subtle {
    border-radius: 14px;
    margin-bottom: 14px;
    border: 1px solid rgba(185, 134, 63, .30);
}

/* Sidebar içindeki form butonları (şube geçişi) menü satırı gibi görünsün */
.left-sidebar .sidebar-nav .sidebar-item form .sidebar-link {
    display: flex;
    align-items: center;
    gap: 12px;
    width: 100%;
    text-decoration: none;
    color: var(--neutral-body, #6a615b);
}

/* --- Mini (kısaltılmış) sidebar uyumu -------------------------------- */
[data-sidebartype="mini-sidebar"] .left-sidebar:not(:hover) .scroll-sidebar {
    padding-left: 10px;
    padding-right: 10px;
}
[data-sidebartype="mini-sidebar"] .left-sidebar:not(:hover) .sidebar-nav ul .sidebar-item .sidebar-link {
    justify-content: center;
    padding: 11px 10px;
    transform: none;
}
[data-sidebartype="mini-sidebar"] .left-sidebar:not(:hover) .sidebar-nav ul .sidebar-item .sidebar-link.active::before {
    content: none;
}
[data-sidebartype="mini-sidebar"] .left-sidebar:not(:hover) .nav-small-cap {
    padding: 0;
    text-align: center;
}

/* --- Versiyon etiketi ------------------------------------------------ */
.left-sidebar .position-absolute.bottom-0 {
    background: transparent !important;
    border-top: 1px solid var(--neutral-line, #ece5e1);
}
[data-bs-theme="dark"] .left-sidebar .position-absolute.bottom-0 {
    border-top-color: var(--neutral-line, #2f2b28);
}

/* --- Üst bar ile uyum ------------------------------------------------ */
.topbar { border-bottom: 1px solid var(--neutral-line, #ece5e1); }
[data-bs-theme="dark"] .topbar { border-bottom-color: var(--neutral-line, #2f2b28); }


/* ==================================================================== */
/* B. AROUND PANELLERİ (öğrenci / veli)                                 */
/*    Sol sütun navigasyonu kart görünümüne çevrilir.                   */
/* ==================================================================== */

#sidebarAccount .offcanvas-body {
    padding: 22px 18px;
    background: var(--neutral-surface, #fff);
    border: 1px solid var(--neutral-line, #ece5e1);
    border-radius: 20px;
}
[data-bs-theme="dark"] #sidebarAccount .offcanvas-body {
    background: var(--neutral-surface, #202936);
    border-color: var(--neutral-line, #2f2b28);
}

/* Kullanıcı kartı */
#sidebarAccount .offcanvas-body > div:first-child {
    padding-bottom: 18px;
    margin-bottom: 18px !important;
    border-bottom: 1px solid var(--neutral-line, #ece5e1);
}
[data-bs-theme="dark"] #sidebarAccount .offcanvas-body > div:first-child {
    border-bottom-color: var(--neutral-line, #2f2b28);
}
#sidebarAccount .rounded-circle.p-3,
#sidebarAccount .rounded-circle.p-2 {
    background: rgba(var(--brand-rgb, 201, 127, 103), .12) !important;
}
#sidebarAccount .rounded-circle i { color: var(--brand, #c97f67) !important; }

/* Bölüm başlıkları */
#sidebarAccount .nav > h4 {
    font-size: 10.5px !important;
    font-weight: 700 !important;
    letter-spacing: .09em;
    color: var(--neutral-muted, #8b8079) !important;
    margin-bottom: 8px !important;
    padding-left: 12px;
}

/* Menü satırları */
#sidebarAccount .nav.flex-column { gap: 2px; }
#sidebarAccount .nav-link,
#sidebarAccount .nav button.nav-link {
    display: flex;
    align-items: center;
    padding: 10px 12px !important;
    border-radius: 12px;
    font-size: 14px;
    font-weight: 500 !important;
    color: var(--neutral-body, #6a615b);
    transition: background-color .18s ease, color .18s ease, transform .18s ease;
}
[data-bs-theme="dark"] #sidebarAccount .nav-link { color: var(--neutral-body, #a4b0c0); }

#sidebarAccount .nav-link i {
    font-size: 19px !important;
    width: 22px;
    opacity: 1 !important;
    color: var(--neutral-muted, #8b8079);
    transition: color .18s ease;
    margin-right: 10px !important;
}

#sidebarAccount .nav-link:hover {
    background: rgba(var(--brand-rgb, 201, 127, 103), .08);
    color: var(--brand-ink, #a05941);
    transform: translateX(2px);
}
#sidebarAccount .nav-link:hover i { color: var(--brand, #c97f67); }

#sidebarAccount .nav-link.active {
    position: relative;
    background: rgba(var(--brand-rgb, 201, 127, 103), .13);
    color: var(--brand-ink, #a05941);
    font-weight: 600 !important;
}
#sidebarAccount .nav-link.active i { color: var(--brand, #c97f67); }
#sidebarAccount .nav-link.active::before {
    content: "";
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 3px;
    height: 20px;
    border-radius: 0 3px 3px 0;
    background: var(--brand, #c97f67);
}
[data-bs-theme="dark"] #sidebarAccount .nav-link.active {
    background: rgba(214, 154, 132, .16);
    color: #e3b6a6;
}
[data-bs-theme="dark"] #sidebarAccount .nav-link.active i { color: #d69a84; }

/* Satır sonundaki rozetler */
#sidebarAccount .nav-link .badge {
    margin-left: auto;
    font-size: 11px;
    font-weight: 600;
    border-radius: 99px;
    padding: 3px 7px;
}

/* Çıkış satırı ayrılır */
#sidebarAccount .nav form {
    display: block;
    width: 100%;
    margin-top: 6px;
    padding-top: 6px;
    border-top: 1px solid var(--neutral-line, #ece5e1);
}
[data-bs-theme="dark"] #sidebarAccount .nav form { border-top-color: var(--neutral-line, #2f2b28); }

/* Masaüstünde sabit kalsın */
@media (min-width: 992px) {
    #sidebarAccount { position: sticky; top: 100px; }
}


/* ==================================================================== */
/* C. MOBİL (≤ 1299px kayan menü, ≤ 991px dar ekran)                    */
/* ==================================================================== */

/* --- Üst bardaki logo hiçbir zaman taşmasın -------------------------- */
.topbar .logo-img img,
.navbar-brand img {
    max-width: 100%;
    height: auto;
}

@media (max-width: 1299.98px) {
    /* Kayan menü: perde + gölge ile içerikten ayrılsın */
    .left-sidebar {
        box-shadow: 8px 0 28px rgba(47, 43, 40, .12);
    }
    /* Marka alanı üst bar yüksekliğiyle hizalı */
    .left-sidebar .brand-logo { min-height: 70px; }
}

@media (max-width: 991.98px) {
    /* Ekrana sığan menü genişliği */
    .left-sidebar { width: min(280px, 86vw); }
    #main-wrapper:not(.show-sidebar) .left-sidebar { left: calc(-1 * min(280px, 86vw)); }

    .left-sidebar .scroll-sidebar { padding: 4px 12px 24px; }

    /* Dokunma hedefi en az 44px */
    .left-sidebar .sidebar-nav ul .sidebar-item .sidebar-link {
        padding: 12px;
        font-size: 15px;
    }
    .left-sidebar .sidebar-nav .sidebar-link i { font-size: 21px; }

    /* Üst bar sıkışmasın */
    .topbar { padding: 0 12px; }
    .topbar .logo-img img { max-height: 34px; width: auto; }

    /* Menüye dokunulunca hover kayması olmasın */
    .left-sidebar .sidebar-nav ul .sidebar-item .sidebar-link:hover { transform: none; }
    .left-sidebar .sidebar-nav ul .sidebar-item .sidebar-link.active:hover { transform: none; }

    /* Öğrenci / veli panelinde offcanvas menü */
    #sidebarAccount.offcanvas-lg { width: min(300px, 88vw); }
    #sidebarAccount .offcanvas-body {
        border: 0;
        border-radius: 0;
        padding: 20px 16px;
    }
    #sidebarAccount .nav-link { padding: 12px !important; font-size: 15px; }
    #sidebarAccount .nav-link i { font-size: 21px !important; }
    #sidebarAccount .nav-link:hover { transform: none; }
}

/* Öğrenci / veli panelindeki mobil menü düğmesi */
.panel-menu-toggle {
    width: 40px; height: 40px;
    display: inline-flex; align-items: center; justify-content: center;
    border-radius: 10px;
    background: rgba(var(--brand-rgb, 201, 127, 103), .10);
    color: var(--brand, #c97f67);
    flex-shrink: 0;
}
.panel-menu-toggle i { font-size: 21px; }
.panel-menu-toggle:hover,
.panel-menu-toggle:focus-visible {
    background: rgba(var(--brand-rgb, 201, 127, 103), .18);
    color: var(--brand-ink, #a05941);
}

/* Sabit üst barın altına içerik girmesin (küçük ekranda bar daha alçak) */
@media (max-width: 575.98px) {
    .left-sidebar .brand-logo { min-height: 62px; padding: 0 16px; }
    .topbar .logo-img img { max-height: 30px; }
}


/* ==================================================================== */
/* D. MOBİL GÜVENLİK AĞI — proje geneli                                 */
/*    Tek tek sayfa düzeltmek yerine dar ekranda yaygın taşma           */
/*    kalıplarını topluca engeller.                                     */
/* ==================================================================== */

@media (max-width: 767.98px) {
    /* Başlık + aksiyon düğmesi satırları alt alta insin */
    .d-flex.justify-content-between:not(.flex-nowrap):not(.navbar):not(.topbar *) {
        flex-wrap: wrap;
        gap: .75rem;
    }
    /* Düğme kümeleri sığmazsa sarsın */
    .d-flex.gap-2, .d-flex.gap-3 { flex-wrap: wrap; }

    /* Uzun başlıklar kelime ortasından bölünebilsin */
    h1, h2, h3, .h1, .h2, .h3 { overflow-wrap: anywhere; }

    /* Medya ve gömülü içerik asla taşmasın */
    img, svg, video, iframe, canvas { max-width: 100%; }

    /* Tablolar kendi kutusunda yatay kaysın (sayfa kaymasın) */
    .table-responsive { -webkit-overflow-scrolling: touch; }
    .card-body > table,
    .card > table { display: block; overflow-x: auto; }

    /* Kart iç boşlukları dar ekranda küçülsün */
    .card { --bs-card-spacer-x: 18px; --bs-card-spacer-y: 18px; }
    .card > .card-body { padding: 18px; }
}

/* Sayfanın kendisi hiçbir koşulda yana kaymasın */
html, body { overflow-x: clip; }

/* Tam menü düğmesi varken navbar'daki ikinci hamburger gizlenir */
@media (max-width: 991.98px) {
    .navbar-toggler.d-lg-none-hide-mobile { display: none !important; }
}

/* ------------------------------------------------------------------ */
/* Sürüm rozeti — menünün son öğelerini kapatmaz                       */
/* Eskiden position:absolute idi; uzun menülerde "Yöneticiler" ve      */
/* "Sistem Ayarları" bağlantılarının üstüne biniyordu.                 */
/* ------------------------------------------------------------------ */
html:root .left-sidebar .sidebar-surum {
    position: sticky;
    bottom: 0;
    z-index: 2;
    margin-top: auto;
    padding: 12px 16px;
    text-align: center;
    font-size: 11px;
    letter-spacing: .04em;
    color: var(--neutral-muted);
    background: var(--sidebar-bg, #f7f4f2);
    border-top: 1px solid var(--neutral-line);
}
html:root .left-sidebar .sidebar-surum strong { font-weight: 600; color: var(--neutral-ink); }

/* Sidebar'ı sütun akışına al ki sürüm rozeti gerçekten en alta otursun
   ve kaydırılan menü onun altında kalmasın. */
html:root .left-sidebar > div:first-child {
    display: flex;
    flex-direction: column;
    height: 100%;
}
html:root .left-sidebar .sidebar-nav { flex: 1 1 auto; min-height: 0; }