/* GlobX Otel - AdminLTE 4 üzerine küçük eklemeler */
:root { --globx-primary: #0d6efd; }

.avatar-initials {
  display: inline-flex; align-items: center; justify-content: center;
  width: 32px; height: 32px; border-radius: 50%;
  background: var(--bs-primary); color: #fff; font-weight: 600; font-size: .8rem; flex-shrink: 0;
}
.avatar-initials.avatar-lg { width: 72px; height: 72px; font-size: 1.5rem; border: 3px solid rgba(255,255,255,.5); }
.user-header { text-align: center; }

.nav-badge { font-size: .6rem; margin-left: auto; flex-shrink: 0; }
.sidebar-menu .nav-text { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; margin-right: .35rem; }
.sidebar-menu .nav-link p { display: flex; align-items: center; width: 100%; }

.brand-image { max-height: 32px; }

/* Oda grid (gösterge paneli önizlemesi) */
.room-grid { display: flex; flex-wrap: wrap; gap: 6px; }
.room-tile {
  width: 64px; padding: 6px 4px; border-radius: 6px; text-align: center; font-size: .8rem; line-height: 1.1;
  border: 1px solid var(--bs-border-color); background: var(--bs-body-bg); position: relative;
}
.room-tile .no { font-weight: 700; font-size: .95rem; }
.room-tile .type { font-size: .65rem; color: var(--bs-secondary-color); }
.room-tile::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 4px; border-radius: 6px 0 0 6px; background: var(--rt, #999); }
.room-tile.hk-dirty { background: rgba(var(--bs-warning-rgb), .15); }
.room-tile.hk-ooo, .room-tile.hk-oos { background: rgba(var(--bs-danger-rgb), .15); }
.room-tile.hk-inspected { background: rgba(var(--bs-info-rgb), .12); }

/* Yetki matrisi */
.perm-group { border: 1px solid var(--bs-border-color); border-radius: .5rem; }
.perm-group .perm-head { background: var(--bs-tertiary-bg); padding: .5rem .75rem; border-bottom: 1px solid var(--bs-border-color); }
.perm-group .perm-body { padding: .5rem .75rem; }

.table td, .table th { vertical-align: middle; }
.login-page .brand-mark { font-size: 2rem; }
.htmx-request.btn { pointer-events: none; opacity: .7; }

/* Grafik renkleri (dataviz referans paleti: sabit sıra, açık/koyu ayrı adımlar) */
:root {
  --viz-1: #2a78d6; --viz-2: #eb6834; --viz-3: #1baf7a; --viz-4: #eda100; --viz-5: #8b5cf6; --viz-6: #e11d74; --viz-7: #0891b2; --viz-8: #78716c;
  --viz-grid: rgba(0,0,0,.07); --viz-text: #52514e;
}
[data-bs-theme="dark"] {
  --viz-1: #3987e5; --viz-2: #d95926; --viz-3: #199e70; --viz-4: #c98500; --viz-5: #9d74f7; --viz-6: #e0457f; --viz-7: #22a3c4; --viz-8: #a8a29e;
  --viz-grid: rgba(255,255,255,.08); --viz-text: #c3c2b7;
}
.chart-box { position: relative; height: 280px; }
.kpi .kpi-value { font-size: 1.6rem; font-weight: 700; line-height: 1.1; }
.kpi .kpi-label { color: var(--bs-secondary-color); font-size: .8rem; }
.kpi .kpi-delta { font-size: .8rem; }

/* Marka logoları */
.sidebar-brand .brand-link { display:flex; align-items:center; gap:.4rem; }
.sidebar-brand .brand-mark { display:none; max-height:30px; }
.sidebar-brand .brand-wordmark { max-height:42px; width:auto; }
.sidebar-collapse .app-sidebar:not(:hover) .brand-wordmark { display:none; }
.sidebar-collapse .app-sidebar:not(:hover) .brand-mark { display:inline-block; }
.brand-logo { width:min(230px,70%); height:auto; }
.logo-dark-only { display:none; }
[data-bs-theme="dark"] .logo-dark-only { display:inline-block; }
[data-bs-theme="dark"] .logo-light-only { display:none; }

/* ======================================================================
   MODAL İÇİNDEKİ FORM — KAYDIRMA (20.10.2026)

   ⚠️ Uzun formlar (Kontrat Ekle) ekrandan taşıyor, kaydırma çubuğu
   çıkmıyor ve "Kaydet" düğmesine ulaşılamıyordu.

   Sebep: Bootstrap'ın `modal-dialog-scrollable` düzeni, header/body/footer'ın
   `.modal-content`in DOĞRUDAN flex çocukları olmasına dayanıyor. Bizim CRUD
   şablonumuz hepsini bir `<form>` içine sarıyor (tek POST için gerekli), o
   yüzden araya giren form zinciri kırıyor: `.modal-body` daralamıyor ve
   `overflow-y:auto` hiç devreye girmiyor.

   Çözüm: formu da flex sütun yapıp zinciri sürdürmek. Böylece gövde
   daralır, başlık ve alt düğme şeridi sabit kalır.
   ====================================================================== */
.modal-dialog-scrollable .modal-content > form {
  display: flex;
  flex-direction: column;
  max-height: 100%;
  overflow: hidden;
}
.modal-dialog-scrollable .modal-content > form > .modal-body {
  overflow-y: auto;
}