/* Sidebar toggle + responsive layout helpers */
#sidebar{transition:transform .22s ease-in-out; z-index:40}

/* Default: mobile-first — content full-width, sidebar hidden off-canvas */
.ml-sidebar{margin-left:0 !important}
#sidebar{transform:translateX(-100%);}

/* Desktop: show sidebar and add left margin to content */
@media (min-width: 768px){
  .ml-sidebar{margin-left:var(--sidebar-width) !important}
  #sidebar{transform:none}
}

/* When sidebar is visible on mobile, app.js sets inline style transform to translateX(0) */
.overlay-backdrop{position:fixed;inset:0;background:rgba(2,6,23,0.5);z-index:30}

/* Make topbar have a solid background on small screens for readability */
@media (max-width: 767px){
  header.w-full.bg-transparent{background-color: rgb(15 23 36);}
}