/**
 * Mobile: left nav is a fixed drawer (not stacked above the feed).
 * Desktop/tablet (≥768px): unchanged — sidebar stays in the grid.
 */
@media (max-width: 767.98px) {
  body.sg-offcanvas-open {
    overflow: hidden;
  }

  .sg-offcanvas:not(.bos-admin-layout):not(.bos-settings) {
    overflow: visible;
  }

  .sg-offcanvas:not(.bos-admin-layout):not(.bos-settings) > .row {
    position: relative;
    overflow: visible;
  }

  /* Sidebar column: collapse in grid; drawer is position:fixed */
  .sg-offcanvas:not(.bos-admin-layout):not(.bos-settings) > .row > .sg-offcanvas-sidebar {
    flex: 0 0 0 !important;
    width: 0 !important;
    max-width: 0 !important;
    min-height: 0 !important;
    height: 0 !important;
    overflow: visible !important;
    position: fixed !important;
    top: calc(56px + env(safe-area-inset-top, 0px));
    left: 0 !important;
    bottom: 0;
    z-index: 1045;
    width: min(320px, 88vw) !important;
    max-width: min(320px, 88vw) !important;
    flex: none !important;
    height: auto !important;
    padding: 10px 10px calc(12px + env(safe-area-inset-bottom, 0px)) !important;
    margin: 0 !important;
    transform: translate3d(-105%, 0, 0);
    transition: transform 0.28s ease;
    overflow-x: hidden;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    pointer-events: none;
    background: transparent;
  }

  .sg-offcanvas:not(.bos-admin-layout):not(.bos-settings).active > .row > .sg-offcanvas-sidebar {
    transform: translate3d(0, 0, 0);
    pointer-events: auto;
  }

  .sg-offcanvas:not(.bos-admin-layout):not(.bos-settings) .sg-offcanvas-sidebar .budun-sidebar {
    max-height: 100%;
    overflow-y: auto;
  }

  .sg-offcanvas-backdrop {
    display: none;
    position: fixed;
    inset: 0;
    z-index: 1040;
    background: rgba(15, 18, 24, 0.48);
    cursor: pointer;
  }

  .sg-offcanvas:not(.bos-admin-layout):not(.bos-settings).active > .sg-offcanvas-backdrop {
    display: block;
  }

  /* Keep feed full width — do not slide mainbar off-screen */
  .sg-offcanvas:not(.bos-admin-layout):not(.bos-settings) .sg-offcanvas-mainbar {
    left: 0 !important;
    width: 100%;
    max-width: 100%;
    flex: 0 0 100%;
  }

  .sg-offcanvas:not(.bos-admin-layout):not(.bos-settings).active .sg-offcanvas-mainbar {
    left: 0 !important;
  }
}
