/* ===== 側欄式後台外殼（對齊代管單機/月租版）===== */
:root{
  --side-bg: #0d263f;
  --side-bg-2: #0a1f34;
  --side-w: 218px;
}
body.has-sidebar{ margin:0; background:var(--bg); }

/* 側欄 */
.app-sidebar{
  position:fixed; top:0; left:0; bottom:0; width:var(--side-w);
  background:var(--side-bg);
  color:rgba(255,255,255,.72);
  display:flex; flex-direction:column;
  padding:18px 14px;
  z-index:1040;
  overflow-y:auto;
}
.app-sidebar .side-logo{
  color:#fff; font-weight:900; font-size:1.05rem; letter-spacing:.5px;
  margin-bottom:4px; padding:4px 6px;
}
.app-sidebar .side-sub{
  color:rgba(255,255,255,.45); font-size:.7rem; font-weight:700;
  margin-bottom:18px; padding:0 6px;
}
.side-nav{ display:flex; flex-direction:column; gap:4px; flex:1; }
.side-link{
  display:flex; align-items:center; gap:11px;
  padding:10px 12px; border-radius:8px;
  font-size:.85rem; font-weight:800;
  color:rgba(255,255,255,.72); text-decoration:none;
  white-space:nowrap;
}
.side-link:hover{ color:#fff; background:rgba(255,255,255,.07); }
.side-link.active{ color:#fff; background:rgba(255,255,255,.14); }
.side-link .ic{ width:17px; height:17px; flex:none; opacity:.9; }
.app-sidebar .side-logo{ display:flex; align-items:center; gap:8px; }
.app-sidebar .side-logo .ic{ width:19px; height:19px; }
.side-divider{ height:1px; background:rgba(255,255,255,.12); margin:12px 4px; }
.side-foot{ display:flex; flex-direction:column; gap:4px; }
.side-foot .side-link{ font-weight:700; font-size:.8rem; }

/* 主內容區 */
.app-main{ margin-left:var(--side-w); min-height:100vh; display:flex; flex-direction:column; }
.app-topbar{
  position:sticky; top:0; z-index:1030;
  background:#fff; border-bottom:1px solid var(--border);
  box-shadow:var(--shadow-sm);
  display:flex; align-items:center; gap:12px;
  padding:10px 20px;
}
.side-toggle{
  display:none; border:none; background:transparent;
  font-size:1.3rem; color:var(--primary); cursor:pointer; line-height:1;
}
.topbar-title{ font-weight:900; color:var(--primary); font-size:1rem; }
.topbar-right{ margin-left:auto; display:flex; align-items:center; gap:8px; }
.app-content{ padding:20px; flex:1; }
.app-content > .container-fluid{ padding-left:0!important; padding-right:0!important; }

/* 手機版：側欄收合 */
.side-backdrop{ display:none; position:fixed; inset:0; background:rgba(0,0,0,.4); z-index:1035; }
@media (max-width: 991.98px){
  .app-sidebar{ transform:translateX(-100%); transition:transform .25s ease; }
  body.sidebar-open .app-sidebar{ transform:translateX(0); }
  body.sidebar-open .side-backdrop{ display:block; }
  .app-main{ margin-left:0; }
  .side-toggle{ display:block; }
}