/* VIAL LMS 0.6.40: fixed center lane for every left/right sidebar state. */
:root{
  --vial-fixed-left-panel:280px;
  --vial-fixed-right-panel:260px;
  --vial-fixed-panel-gap:18px;
  --vial-fixed-center-max:1100px;
  --vial-fixed-center-width:min(
    var(--vial-fixed-center-max),
    calc(100vw - var(--vial-fixed-left-panel) - var(--vial-fixed-right-panel) - (var(--vial-fixed-panel-gap) * 2))
  );
}

body.with-sidebar.with-sidebar .right-sidebar.moodle-drawer,
body.with-sidebar.with-sidebar .moodle-drawer.right-sidebar{
  position:fixed!important;
  top:var(--vial-topbar-space,78px)!important;
  right:0!important;
  left:auto!important;
  bottom:0!important;
  width:var(--vial-fixed-right-panel)!important;
  max-width:var(--vial-fixed-right-panel)!important;
  min-width:0!important;
  height:calc(100vh - var(--vial-topbar-space,78px))!important;
  padding:10px!important;
  box-sizing:border-box!important;
  display:flex!important;
  flex-direction:column!important;
  gap:12px!important;
  overflow:auto!important;
  z-index:12000!important;
  transition:transform .18s ease!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.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.course-view.course-view .course-left-drawer,
body.lesson-page-view.lesson-page-view .lesson-course-nav{
  position:fixed!important;
  top:var(--vial-topbar-space,78px)!important;
  left:0!important;
  right:auto!important;
  bottom:0!important;
  width:var(--vial-fixed-left-panel)!important;
  max-width:var(--vial-fixed-left-panel)!important;
  min-width:0!important;
  height:calc(100vh - var(--vial-topbar-space,78px))!important;
  padding:10px!important;
  box-sizing:border-box!important;
  overflow:auto!important;
  z-index:13010!important;
  transition:transform .18s ease!important;
}

body.course-view.course-view .course-left-drawer,
body.lesson-page-view.lesson-page-view .lesson-course-nav{
  transform:translateX(-105%)!important;
  pointer-events:none!important;
}

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

body.with-sidebar.with-sidebar.with-sidebar > main.wrap.app-layout.moodle-layout,
body.with-sidebar.with-sidebar.with-sidebar .wrap.app-layout.moodle-layout,
body.with-sidebar.with-sidebar:not(.sidebar-hidden) > main.wrap.app-layout.moodle-layout,
body.with-sidebar.with-sidebar.sidebar-hidden > main.wrap.app-layout.moodle-layout,
body.with-sidebar.with-sidebar:not(.sidebar-hidden):has(.course-outline-shell.course-outline-open) > main.wrap.app-layout.moodle-layout,
body.with-sidebar.with-sidebar.sidebar-hidden:has(.course-outline-shell.course-outline-open) > main.wrap.app-layout.moodle-layout,
body.with-sidebar.with-sidebar:not(.sidebar-hidden):has(.lesson-reading-layout.lesson-nav-open) > main.wrap.app-layout.moodle-layout,
body.with-sidebar.with-sidebar.sidebar-hidden:has(.lesson-reading-layout.lesson-nav-open) > main.wrap.app-layout.moodle-layout,
body.course-view.course-view.with-sidebar > main.wrap.app-layout.moodle-layout,
body.course-view.course-view.with-sidebar:not(.sidebar-hidden) > main.wrap.app-layout.moodle-layout,
body.course-view.course-view.with-sidebar.sidebar-hidden > main.wrap.app-layout.moodle-layout,
body.course-view.course-view.with-sidebar:has(.course-outline-shell.course-outline-open) > main.wrap.app-layout.moodle-layout,
body.course-view.course-view.with-sidebar:has(.course-outline-shell:not(.course-outline-open)) > main.wrap.app-layout.moodle-layout,
body.lesson-page-view.lesson-page-view.with-sidebar > main.wrap.app-layout.moodle-layout,
body.lesson-page-view.lesson-page-view.with-sidebar:not(.sidebar-hidden) > main.wrap.app-layout.moodle-layout,
body.lesson-page-view.lesson-page-view.with-sidebar.sidebar-hidden > main.wrap.app-layout.moodle-layout,
body.lesson-page-view.lesson-page-view.with-sidebar:has(.lesson-reading-layout.lesson-nav-open) > main.wrap.app-layout.moodle-layout,
body.lesson-page-view.lesson-page-view.with-sidebar:has(.lesson-reading-layout:not(.lesson-nav-open)) > main.wrap.app-layout.moodle-layout{
  display:block!important;
  width:var(--vial-fixed-center-width)!important;
  max-width:var(--vial-fixed-center-width)!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;
  box-sizing:border-box!important;
}

body.with-sidebar.with-sidebar .main-content,
body.course-view.course-view .main-content,
body.lesson-page-view.lesson-page-view .main-content{
  display:block!important;
  width:100%!important;
  max-width:100%!important;
  min-width:0!important;
  margin-left:auto!important;
  margin-right:auto!important;
  box-sizing:border-box!important;
}

body.with-sidebar.with-sidebar .main-content > :where(
  .moodle-heading,
  .vial-home-heading,
  .breadcrumbs,
  .course-header,
  .moodle-tabs,
  .home-columns,
  .vial-home-columns,
  .card,
  .grid,
  .moodle-section,
  .admin-directory-list,
  .admin-update-grid,
  .update-details,
  .grade-settings-card,
  .lesson-reader-head,
  .lesson-progress-strip,
  .lesson-reading-layout,
  .lesson-page-nav,
  .lesson-reader-nav,
  .lesson-reader-card,
  .test-question-page,
  .role-home-blocks,
  .add-section-box
){
  width:100%!important;
  max-width:100%!important;
  min-width:0!important;
  margin-left:auto!important;
  margin-right:auto!important;
  box-sizing:border-box!important;
}

body.lesson-page-view.lesson-page-view .lesson-reading-layout{
  display:block!important;
  grid-template-columns:none!important;
  gap:0!important;
}

body.lesson-page-view.lesson-page-view .lesson-reading-main,
body.lesson-page-view.lesson-page-view .lesson-reader-card,
body.lesson-page-view.lesson-page-view .lesson-reader-nav,
body.course-view.course-view .course-header,
body.course-view.course-view .moodle-tabs,
body.course-view.course-view .moodle-section,
body.course-view.course-view .add-section-box{
  width:100%!important;
  max-width:100%!important;
  min-width:0!important;
  margin-left:auto!important;
  margin-right:auto!important;
  box-sizing:border-box!important;
}

body.moodle-home.with-sidebar .home-columns,
body.moodle-home.with-sidebar .vial-home-columns,
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;
  min-width:0!important;
  grid-template-columns:minmax(0,1.6fr) minmax(248px,.75fr)!important;
  gap:14px!important;
  margin-left:auto!important;
  margin-right:auto!important;
}

body.course-view.course-view .course-outline-item,
body.lesson-page-view.lesson-page-view .course-element-nav-item{
  grid-template-columns:42px minmax(0,1fr)!important;
}

body.course-view.course-view .course-left-tab,
body.lesson-page-view.lesson-page-view .lesson-left-tab{
  position:fixed!important;
  left:0!important;
  top:50%!important;
  transform:translateY(-50%)!important;
  z-index:13000!important;
}

body.with-sidebar.with-sidebar .sidebar-tab{
  right:var(--vial-fixed-right-panel)!important;
}

body.with-sidebar.with-sidebar.sidebar-hidden .sidebar-tab{
  right:0!important;
}

@media(max-width:1300px){
  :root{
    --vial-fixed-left-panel:240px;
    --vial-fixed-right-panel:240px;
    --vial-fixed-panel-gap:12px;
  }
}

@media(max-width:980px){
  :root{
    --vial-fixed-center-width:calc(100vw - 24px);
  }

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

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