/* SIBINA SD — gaya bersama: logo lambang Kabupaten Deli Serdang di samping judul,
   dipakai seragam pada seluruh halaman (sidebar, header portal, dan halaman login). */

.brand .logo,
aside .brand .logo,
.logo-row .logo,
.fbrand .logo,
.hero .logo,
.head .logo,
.logo.sibina {
  background: #fff url('../../logo_deli_serdang.png') center/84% no-repeat !important;
  border-radius: 50%;
  box-shadow: 0 0 0 1px rgba(255, 255, 255, .28);
}

/* Ikon SVG bawaan di dalam kotak logo disembunyikan agar lambang tampil utuh. */
.brand .logo > svg,
aside .brand .logo > svg,
.logo-row .logo > svg,
.fbrand .logo > svg,
.hero .logo > svg,
.head .logo > svg,
.logo.sibina > svg { display: none !important; }

/* ---- Sidebar sisipan (untuk halaman utilitas yang belum punya kerangka) ---- */
.sbx { position: fixed; top: 0; left: 0; bottom: 0; width: 250px; z-index: 900;
  background: linear-gradient(180deg, #14406f, #0f2f5c); color: #cfe0f4; overflow-y: auto;
  font-family: 'Segoe UI', system-ui, -apple-system, Roboto, Arial, sans-serif; }
.sbx .brand { display: flex; align-items: center; gap: 11px; padding: 16px 18px 12px; }
.sbx .brand .logo { width: 42px; height: 42px; flex: none; }
.sbx .brand b { font-size: 15px; color: #fff; line-height: 1.1; display: block; }
.sbx .brand span { font-size: 10.5px; color: #9fbbdd; }
.sbx .navlbl { font-size: 10.5px; letter-spacing: 1.5px; text-transform: uppercase; color: #7fa2ca;
  padding: 13px 20px 5px; font-weight: 700; }
.sbx nav a { display: flex; align-items: center; gap: 10px; padding: 9px 20px; font-size: 13px;
  color: #cfe0f4; font-weight: 500; border-left: 3px solid transparent; cursor: pointer; text-decoration: none; }
.sbx nav a:hover { background: rgba(255, 255, 255, .07); color: #fff; }
.sbx nav a.active { background: rgba(246, 166, 35, .16); border-left-color: #f6a623; color: #fff; font-weight: 600; }
body.sbx-on { padding-left: 250px; }
@media (max-width: 760px) {
  .sbx { transform: translateX(-100%); transition: transform .25s; }
  .sbx.open { transform: none; }
  body.sbx-on { padding-left: 0; }
  .sbx-toggle { position: fixed; top: 10px; left: 10px; z-index: 950; background: #12386b; color: #fff;
    border: none; border-radius: 9px; padding: 8px 12px; font-size: 16px; cursor: pointer; }
}
.sbx-toggle { display: none; }
@media (max-width: 760px) { .sbx-toggle { display: block; } }
