/*
 * Direct page current menu frame.
 * Keep /phong-thi/, /tang-kinh-cac/ and /thien-dao-bang/ as real pages; reserve space for
 * the Sảnh sidebar/bottom-nav so module layouts do not sit under the menu.
 */
:root{--jlpt-direct-sidebar-w:clamp(209px,31.188dvh,260px);--jlpt-direct-bottom-nav-h:96px;}
body.jlpt180-direct-module-page.jlpt180-clean-lobby{
  min-height:100dvh!important;
  overflow-x:hidden!important;
  color:#0f172a;
  background:
    radial-gradient(circle at 0% 0%, rgba(255,220,236,.34), transparent 30%),
    radial-gradient(circle at 100% 8%, rgba(204,251,241,.34), transparent 32%),
    linear-gradient(180deg,#fffafd 0%,#f8fdff 48%,#fff7fb 100%)!important;
}
body.jlpt180-direct-module-page.jlpt180-clean-lobby .jlpt180-direct-shell-sidebar,
body.jlpt180-direct-module-page.jlpt180-clean-lobby .jlpt180-direct-shell-bottom-nav{
  font-family:"Plus Jakarta Sans", Arial, sans-serif;
}
body.jlpt180-direct-module-page.jlpt180-clean-lobby .jlpt180-direct-shell-sidebar a,
body.jlpt180-direct-module-page.jlpt180-clean-lobby .jlpt180-direct-shell-bottom-nav a{text-decoration:none!important;}
body.jlpt180-direct-module-page.jlpt180-clean-lobby .jlpt180-direct-shell-sidebar .nl,
body.jlpt180-direct-module-page.jlpt180-clean-lobby .jlpt180-direct-shell-bottom-nav .bni{-webkit-tap-highlight-color:transparent;}

/* Remove theme title/header shells on module pages. The module has its own hero. */
body.jlpt180-direct-module-page #masthead,
body.jlpt180-direct-module-page .site-header,
body.jlpt180-direct-module-page .entry-header,
body.jlpt180-direct-module-page .page-header,
body.jlpt180-direct-module-page .entry-title,
body.jlpt180-direct-module-page .page-title,
body.jlpt180-direct-module-page .wp-block-post-title,
body.jlpt180-direct-module-page .ast-single-post-order,
body.jlpt180-direct-module-page .ast-archive-description,
body.jlpt180-direct-module-page .ast-breadcrumbs-wrapper{
  display:none!important;
}
body.jlpt180-direct-module-page #page,
body.jlpt180-direct-module-page .site,
body.jlpt180-direct-module-page .site-content,
body.jlpt180-direct-module-page .ast-container,
body.jlpt180-direct-module-page .content-area,
body.jlpt180-direct-module-page .site-main,
body.jlpt180-direct-module-page article,
body.jlpt180-direct-module-page .entry-content,
body.jlpt180-direct-module-page .wp-site-blocks{
  max-width:none!important;
  width:100%!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
}
body.jlpt180-direct-module-page .entry-content > *{
  max-width:none!important;
}

@media (min-width:900px){
  body.jlpt180-direct-module-page.jlpt180-clean-lobby{padding-left:var(--jlpt-direct-sidebar-w)!important;}
  body.jlpt180-direct-module-page.jlpt180-clean-lobby .jlpt180-direct-shell-sidebar.sidebar{
    --jlpt-sidebar-w:var(--jlpt-direct-sidebar-w);
    position:fixed!important;left:0!important;top:0!important;bottom:0!important;width:var(--jlpt-direct-sidebar-w)!important;height:100dvh!important;z-index:9997!important;
  }
  body.admin-bar.jlpt180-direct-module-page.jlpt180-clean-lobby .jlpt180-direct-shell-sidebar.sidebar{top:32px!important;height:calc(100dvh - 32px)!important;}
  body.jlpt180-direct-module-page.jlpt180-clean-lobby .jlpt180-direct-shell-bottom-nav{display:none!important;}

  /* Tàng Kinh Các has 100vw escape rules. Pull it back into the content lane. */
  body.jlpt180-direct-module-tkc #view-tangkho.tkc-v3-view{
    width:calc(100vw - var(--jlpt-direct-sidebar-w))!important;
    max-width:calc(100vw - var(--jlpt-direct-sidebar-w))!important;
    min-height:100dvh!important;
    margin-left:0!important;
    margin-right:0!important;
    left:auto!important;
    right:auto!important;
    overflow-x:hidden!important;
  }
  body.jlpt180-direct-module-tkc #view-tangkho .tkc-app{
    width:100%!important;max-width:none!important;margin:0!important;
    padding-top:clamp(18px,2vw,28px)!important;
    padding-left:clamp(18px,2.3vw,42px)!important;
    padding-right:clamp(18px,2.3vw,42px)!important;
  }

  /* Phòng Thi also uses 100vw to escape old WordPress wrappers. Keep it inside menu lane. */
  body.jlpt180-direct-module-exam .exam-wrap.jlpt180-eh-room-skin,
  body.jlpt180-direct-module-exam .jlpt180-eh-v3{
    width:calc(100vw - var(--jlpt-direct-sidebar-w))!important;
    max-width:calc(100vw - var(--jlpt-direct-sidebar-w))!important;
    margin-left:0!important;margin-right:0!important;
    left:auto!important;right:auto!important;
  }
  body.jlpt180-direct-module-exam .exam-wrap.jlpt180-eh-room-skin{padding:16px 18px 36px!important;}
}

@media (max-width:899px){
  body.jlpt180-direct-module-page.jlpt180-clean-lobby{padding-bottom:calc(var(--jlpt-direct-bottom-nav-h) + env(safe-area-inset-bottom,0px))!important;}
  body.jlpt180-direct-module-page.jlpt180-clean-lobby .jlpt180-direct-shell-sidebar.sidebar{display:none!important;}
  body.jlpt180-direct-module-page.jlpt180-clean-lobby .jlpt180-direct-shell-bottom-nav.bn{display:grid!important;z-index:9998!important;}
  body.jlpt180-direct-module-tkc #view-tangkho.tkc-v3-view,
  body.jlpt180-direct-module-exam .exam-wrap.jlpt180-eh-room-skin,
  body.jlpt180-direct-module-exam .jlpt180-eh-v3{
    width:100vw!important;max-width:100vw!important;margin-left:calc(50% - 50vw)!important;margin-right:calc(50% - 50vw)!important;
  }
  body.jlpt180-direct-module-tkc #view-tangkho .tkc-app{padding-bottom:calc(112px + env(safe-area-inset-bottom,0px))!important;}
  body.jlpt180-direct-module-exam .exam-wrap.jlpt180-eh-room-skin{padding-bottom:calc(124px + env(safe-area-inset-bottom,0px))!important;}
}
@media (max-width:782px){body.admin-bar.jlpt180-direct-module-page.jlpt180-clean-lobby{padding-top:0!important;}}
