/* Uygulamaya özel stiller. Bootstrap'in üzerine az sayıda ekleme. */
:root {
    --nb-radius: .5rem;
    --nb-primary: #0d6efd;
}
.card { border-radius: var(--nb-radius); }
.nb-navbar { border-top: 4px solid var(--nb-primary); }
.btn-primary {
    --bs-btn-bg: var(--nb-primary);
    --bs-btn-border-color: var(--nb-primary);
    --bs-btn-hover-bg: color-mix(in srgb, var(--nb-primary) 85%, black);
    --bs-btn-hover-border-color: color-mix(in srgb, var(--nb-primary) 85%, black);
    --bs-btn-active-bg: color-mix(in srgb, var(--nb-primary) 75%, black);
    --bs-btn-active-border-color: color-mix(in srgb, var(--nb-primary) 75%, black);
    --bs-btn-disabled-bg: var(--nb-primary);
    --bs-btn-disabled-border-color: var(--nb-primary);
}

/* Düzen: kenar çubuğu (bi-* simgeleri yerel: vendor/bootstrap-icons) + tam genişlik içerik */
.nb-shell { display: flex; align-items: flex-start; gap: 1rem; }
.nb-main { flex: 1 1 auto; min-width: 0; }
.nb-side-nav .nb-menu-item { display: flex; align-items: center; gap: .65rem; padding: .55rem .65rem; border-radius: .6rem; color: var(--bs-body-color); text-decoration: none; }
.nb-side-nav .nb-menu-item:hover { background: var(--bs-tertiary-bg); }
.nb-side-nav .nb-menu-item.active { background: #e7f1ff; color: var(--nb-primary); font-weight: 600; }
.nb-side-nav .nb-menu-item.disabled { color: var(--bs-secondary-color); cursor: default; }
.nb-side-nav .bi { font-size: 1.1rem; width: 1.4rem; text-align: center; flex: 0 0 auto; }
.nb-label { white-space: nowrap; }
.nb-soon { font-size: .7rem; }
.nb-side-head { align-items: center; justify-content: space-between; padding: .25rem .35rem .6rem; margin-bottom: .35rem; border-bottom: 1px solid var(--bs-border-color); }
.nb-side-title { font-weight: 700; }
.nb-side-toggle { border: 1px solid var(--bs-border-color); border-radius: .6rem; padding: .25rem .6rem; background: var(--bs-tertiary-bg); }
.nb-side-toggle:hover { background: var(--bs-secondary-bg); }
@media (min-width: 992px) {
    .nb-sidebar { flex: 0 0 auto; width: 15rem; position: sticky; top: 4.75rem; max-height: calc(100vh - 5.75rem); overflow-x: hidden; overflow-y: auto; overscroll-behavior-y: contain; scrollbar-width: thin;
        background: #fff; border: 1px solid var(--bs-border-color); border-radius: .9rem; padding: .6rem; transition: width .18s ease; }
    .nb-collapsed .nb-sidebar { width: 4.5rem; }
    .nb-collapsed .nb-side-title, .nb-collapsed .nb-label { display: none; }
    .nb-collapsed .nb-side-head { justify-content: center; }
    .nb-collapsed .nb-side-nav .nb-menu-item { justify-content: center; padding: .6rem .3rem; }
}
@media (max-width: 991.98px) {
    .nb-sidebar { display: contents; }
}

/* Gün sayfası (eski uygulamanın görünümü): tek büyük kart içinde yumuşak zeminli paneller, iç kaydırma yok, tüm sayfa akar */
body.bg-body-tertiary { background-color: #f4f6f8 !important; }
.nb-soft-panel { background: rgba(0,0,0,.02); }
.nb-compact .table { margin-bottom: 0; }
.nb-compact .table td, .nb-compact .table th { padding: .30rem .40rem; font-size: .875rem; }
.nb-compact .list-group-item { padding: .35rem .55rem; font-size: .875rem; }
.nb-alarm-band { max-width: 620px; width: 100%; }
.nb-status-icon { display: inline-block; width: 14px; text-align: center; margin-right: 6px; }
.nb-col-min { width: 1%; }
#dutyManageTabs { scrollbar-width: thin; }
#dutyManageTabs::-webkit-scrollbar { height: 6px; }
.nb-roster-edit-table { table-layout: fixed; }
.nb-roster-edit-table th, .nb-roster-edit-table td { vertical-align: middle; }
.nb-row-action { width: 34px; min-width: 34px; padding-left: 0; padding-right: 0; }

/* Form kartları: tek sütunlu formlar çok genişlemesin */
.nb-form { max-width: 56rem; }

/* TV ekranı */
.nb-tv { background: #0b1220; color: #f1f5f9; min-height: 100vh; display: flex; align-items: center; justify-content: center; text-align: center; }
.nb-tv h1 { font-size: clamp(2rem, 5vw, 4rem); font-weight: 600; }
.nb-tv p { color: #94a3b8; font-size: 1.25rem; }

/* Gün sayfası nöbetçi tablosu: sabit sütunlar, uzun adlar … ile kısalır (eski sistemdeki gibi) */
.nb-roster-table { table-layout: fixed; width: 100%; }
.nb-roster-table .nb-col-teacher { width: 46%; }
.nb-roster-table .nb-col-load { width: 4rem; }
.nb-ellipsis { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* Ana sayfa (eski index.php): tek büyük kart, beyaz paneller, 13px tablolar, 12px başlıklar, sabit satır yüksekliği matris */
.nb-ctable { font-size: 13px; }
.nb-ctable thead th { font-size: 12px; }
.nb-scroll420 { max-height: 420px; overflow: auto; }
.nb-matrix { table-layout: fixed; width: 100%; font-size: 12px; }
.nb-matrix tbody tr { height: 56px; }
.nb-matrix td { height: 56px; vertical-align: middle !important; padding: .25rem .35rem; }
.nb-matrix th, .nb-matrix td { overflow: hidden !important; }
.nb-matrix.table-bordered > :not(caption) > * > * { border-color: rgba(0,0,0,.16) !important; }
.nb-free-cell { background-color: rgba(var(--bs-success-rgb), .26) !important; box-shadow: inset 0 0 0 1px rgba(0,0,0,.14); }
.nb-chip { font-size: 11px; line-height: 1.2; }

/* Gün sayfası panel genişlikleri (xl): görevler 5/12, nöbetçiler daraltıldı, kazanılan yer gelmeyenlere */
@media (min-width: 1200px) {
    .nb-col-tasks { flex: 0 0 auto; width: 38.667%; }
    .nb-col-roster { flex: 0 0 auto; width: 32%; }
    .nb-col-absences { flex: 0 0 auto; width: 29.333%; }
}

/* Ana sayfa: Günün Nöbetçileri tablosu (öğretmen sütunu dar, uzun adlar … ile) */
.nb-duty-table { table-layout: fixed; width: 100%; }
.nb-duty-table .nb-col-teacher { width: 46%; }
.nb-duty-table .nb-col-load { width: 3.6rem; }

/* Görevlendirme: Atanan sütunu dar; uzun adlar … ile, seçim kutusu sınırlı genişlikte */
.nb-col-assigned { width: 9.5rem; max-width: 9.5rem; }
.nb-col-assigned .form-select { max-width: 9.5rem; }
.nb-col-assigned b { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* Ana sayfa başlığı: alarm tarih ile düğmeler arasında; dar ekranda başlığın altında kendi satırında */
.nb-head-alarm { min-width: 0; }
.nb-head-alarm .alert { white-space: nowrap; }
@media (max-width: 1599.98px) {
    .nb-head-alarm { order: 3; flex-basis: 100%; }
    .nb-head-alarm .nb-alarm-band { max-width: none; }
}