/* VIAL LMS 0.6.37: all side panels are overlays; center width is stable. */
:root{
  --vial-overlay-right-width:320px;
  --vial-overlay-left-width:340px;
  --vial-overlay-gap:24px;
}

body.with-sidebar .wrap.app-layout.moodle-layout,
body.with-sidebar:not(.sidebar-hidden) .wrap.app-layout.moodle-layout,
body.with-sidebar.sidebar-hidden .wrap.app-layout.moodle-layout,
body.with-sidebar:not(.sidebar-hidden):has(.course-outline-shell.course-outline-open) .wrap.app-layout.moodle-layout,
body.with-sidebar.sidebar-hidden:has(.course-outline-shell.course-outline-open) .wrap.app-layout.moodle-layout,
body.with-sidebar:not(.sidebar-hidden):has(.lesson-reading-layout.lesson-nav-open) .wrap.app-layout.moodle-layout,
body.with-sidebar.sidebar-hidden:has(.lesson-reading-layout.lesson-nav-open) .wrap.app-layout.moodle-layout{
  display:block!important;
  width:min(var(--vial-page-center-width), calc(100vw - var(--vial-page-gutter)))!important;
  max-width:min(var(--vial-page-center-width), calc(100vw - var(--vial-page-gutter)))!important;
  min-width:0!important;
  margin-left:auto!important;
  margin-right:auto!important;
  padding-left:0!important;
  padding-right:0!important;
  transform:none!important;
  transition:none!important;
  grid-template-columns:none!important;
}

body.with-sidebar .main-content{
  width:100%!important;
  max-width:100%!important;
  min-width:0!important;
  margin-left:auto!important;
  margin-right:auto!important;
}

body.with-sidebar .right-sidebar.moodle-drawer,
body.with-sidebar .moodle-drawer.right-sidebar{
  position:fixed!important;
  right:0!important;
  left:auto!important;
  top:var(--vial-topbar-space,78px)!important;
  bottom:0!important;
  width:var(--vial-overlay-right-width)!important;
  max-width:min(88vw,var(--vial-overlay-right-width))!important;
  height:calc(100vh - var(--vial-topbar-space,78px))!important;
  z-index:12000!important;
  display:flex!important;
  flex-direction:column!important;
  overflow:auto!important;
  transform:translateX(0)!important;
  transition:transform .22s ease!important;
}

body.with-sidebar.sidebar-hidden .right-sidebar.moodle-drawer,
body.with-sidebar.sidebar-hidden .moodle-drawer.right-sidebar{
  transform:translateX(105%)!important;
  pointer-events:none!important;
}

body.with-sidebar:not(.sidebar-hidden) .right-sidebar.moodle-drawer,
body.with-sidebar:not(.sidebar-hidden) .moodle-drawer.right-sidebar{
  transform:translateX(0)!important;
  pointer-events:auto!important;
}

body.course-view .course-left-drawer,
body.lesson-page-view .lesson-course-nav{
  position:fixed!important;
  left:0!important;
  right:auto!important;
  top:var(--vial-topbar-space,78px)!important;
  bottom:0!important;
  width:var(--vial-overlay-left-width)!important;
  max-width:min(88vw,var(--vial-overlay-left-width))!important;
  height:calc(100vh - var(--vial-topbar-space,78px))!important;
  z-index:13010!important;
  overflow:auto!important;
  transform:translateX(-105%)!important;
  transition:transform .22s ease!important;
}

body.course-view .course-outline-shell.course-outline-open .course-left-drawer,
body.lesson-page-view .lesson-reading-layout.lesson-nav-open .lesson-course-nav{
  transform:translateX(0)!important;
}

body.course-view .course-outline-shell.course-outline-open .course-left-tab,
body.lesson-page-view .lesson-reading-layout.lesson-nav-open .lesson-left-tab{
  display:none!important;
}

body.moodle-home.with-sidebar:not(.sidebar-hidden) .home-columns,
body.moodle-home.with-sidebar:not(.sidebar-hidden) .vial-home-columns,
body.moodle-home.with-sidebar.sidebar-hidden .home-columns,
body.moodle-home.with-sidebar.sidebar-hidden .vial-home-columns{
  width:100%!important;
  max-width:100%!important;
  margin-left:auto!important;
  margin-right:auto!important;
  grid-template-columns:minmax(0,1.65fr) minmax(320px,.8fr)!important;
}

@media(min-width:1101px) and (max-width:1500px){
  body.course-view.with-sidebar .wrap.app-layout.moodle-layout,
  body.course-view.with-sidebar:not(.sidebar-hidden) .wrap.app-layout.moodle-layout,
  body.course-view.with-sidebar.sidebar-hidden .wrap.app-layout.moodle-layout,
  body.lesson-page-view.with-sidebar .wrap.app-layout.moodle-layout,
  body.lesson-page-view.with-sidebar:not(.sidebar-hidden) .wrap.app-layout.moodle-layout,
  body.lesson-page-view.with-sidebar.sidebar-hidden .wrap.app-layout.moodle-layout{
    width:min(var(--vial-page-center-width), max(680px, calc(100vw - ((var(--vial-overlay-left-width) + var(--vial-overlay-right-width)) + (var(--vial-overlay-gap) * 2)))))!important;
    max-width:min(var(--vial-page-center-width), max(680px, calc(100vw - ((var(--vial-overlay-left-width) + var(--vial-overlay-right-width)) + (var(--vial-overlay-gap) * 2)))))!important;
  }
}

@media(max-width:1100px){
  body.with-sidebar .wrap.app-layout.moodle-layout,
  body.with-sidebar:not(.sidebar-hidden) .wrap.app-layout.moodle-layout,
  body.with-sidebar.sidebar-hidden .wrap.app-layout.moodle-layout{
    width:calc(100vw - 24px)!important;
    max-width:calc(100vw - 24px)!important;
  }

  body.moodle-home.with-sidebar:not(.sidebar-hidden) .home-columns,
  body.moodle-home.with-sidebar:not(.sidebar-hidden) .vial-home-columns,
  body.moodle-home.with-sidebar.sidebar-hidden .home-columns,
  body.moodle-home.with-sidebar.sidebar-hidden .vial-home-columns{
    grid-template-columns:1fr!important;
  }
}
