/* Brand-only bridge. Load after brand.css.
   Use FAQ's block structure so the shared desktop controller can position
   the main area and sidebars without adding margins inside a grid track. */
html body .page-wrapper.vsl-brand-layout {
  --header-height: 64px;
  --left-sidebar-width: 300px;
  --right-sidebar-width: 368px;
  display: block !important;
  position: relative;
  padding: 5px 0 40px !important;
}
html body .page-wrapper.vsl-brand-layout > main.vsl-brand-main {
  display: block;
  width: auto !important;
  min-width: 0 !important;
  max-width: 100% !important;
  margin: 59px 447px 0 344px !important;
  padding: 5px 60px 32px 32px !important;
  min-height: calc(100vh - var(--header-height) - 48px);
}
html body .page-wrapper.vsl-brand-layout > .left-sidebar,
html body .page-wrapper.vsl-brand-layout > .right-sidebar {
  position: fixed !important;
  top: calc(var(--header-height) + 24px);
  height: calc(100vh - var(--header-height) - 48px) !important;
  max-height: none;
  overflow-y: auto;
  z-index: 10;
  scrollbar-width: none;
  -ms-overflow-style: none;
}
html body .page-wrapper.vsl-brand-layout > .left-sidebar {
  left: 24px !important;
  right: auto !important;
  width: var(--left-sidebar-width) !important;
}
html body .page-wrapper.vsl-brand-layout > .right-sidebar {
  left: auto !important;
  right: 24px !important;
  width: var(--right-sidebar-width) !important;
}
.vsl-brand-layout > .left-sidebar::-webkit-scrollbar,
.vsl-brand-layout > .right-sidebar::-webkit-scrollbar {
  display: none;
}
@media screen and (max-width: 1200px), screen and (hover: none) and (pointer: coarse) {
  html body .page-wrapper.vsl-brand-layout {
    padding: calc(var(--header-height) + env(safe-area-inset-top, 0px) + 14px) 8px max(18px, env(safe-area-inset-bottom)) 10px !important;
  }
  html body .page-wrapper.vsl-brand-layout > main.vsl-brand-main {
    width: 100% !important;
    margin: 0 !important;
    padding: 0 0 22px !important;
    min-height: 0;
  }
  html body .page-wrapper.vsl-brand-layout > .left-sidebar,
  html body .page-wrapper.vsl-brand-layout > .right-sidebar {
    display: none !important;
  }
}
