/* ==========================================================
   CHERITAN SITE SYSTEM v4.2 — SCROLL SAFETY
   Keeps every page vertically scrollable on desktop/tablet/mobile.
   This file intentionally loads last.
   ========================================================== */

/* 1) Browser/document scrolling must stay available. */
html{
  min-height:100%!important;
  height:auto!important;
  max-height:none!important;
  overflow-x:clip!important;
  overflow-y:auto!important;
  overscroll-behavior-y:auto!important;
  scroll-behavior:auto;
}
body.cheritan-designed-page{
  position:static!important;
  min-height:100%!important;
  height:auto!important;
  max-height:none!important;
  overflow-x:hidden!important;
  overflow-y:visible!important;
  overscroll-behavior-y:auto!important;
  touch-action:auto!important;
  -webkit-overflow-scrolling:touch;
}

/* 2) The main page wrappers must never become vertical scroll traps. */
:where(
  .cht-site,
  .cht-about-page,
  .cht-courses-page,
  .cht-makeup-page,
  .cht-beauty-page,
  .cht-studio-page,
  .cht-contact-page,
  .cht-blog-page,
  .cht-post-page,
  .cht-privacy-page
){
  height:auto!important;
  max-height:none!important;
  min-height:0;
  overflow-x:clip!important;
  overflow-y:visible!important;
  overscroll-behavior-y:auto!important;
  touch-action:auto!important;
}

:where(
  .cht-site,
  .cht-about-page,
  .cht-courses-page,
  .cht-makeup-page,
  .cht-beauty-page,
  .cht-studio-page,
  .cht-contact-page,
  .cht-blog-page,
  .cht-post-page,
  .cht-privacy-page
) main{
  position:relative;
  height:auto!important;
  max-height:none!important;
  overflow:visible!important;
  touch-action:auto!important;
}

/* 3) Fix the Courses wrapper specifically; older CSS used overflow:hidden. */
.cht-courses-page{
  overflow-x:clip!important;
  overflow-y:visible!important;
}

/* 4) Mobile menu and dialog content should scroll inside themselves when needed. */
.cr-menu[open] > nav,
.cht-mobile-nav nav,
.cr-dialog,
.cht-dialog,
dialog[open] .cht-course-enquiry-source{
  -webkit-overflow-scrolling:touch!important;
  overscroll-behavior-y:contain;
  touch-action:pan-y!important;
}
.cr-menu[open] > nav,
.cht-mobile-nav nav{
  max-height:calc(100dvh - 105px)!important;
  overflow-y:auto!important;
  overflow-x:hidden!important;
}
.cr-dialog,
.cht-dialog{
  max-height:88dvh!important;
  overflow-y:auto!important;
}

/* 5) Fixed rails/bottom bars must not create an invisible touch-blocking layer. */
.cht-social-rail,
.cr-actions,
.cht-mobile-actions{
  pointer-events:none;
}
.cht-social-rail a,
.cht-social-rail button,
.cr-actions a,
.cr-actions button,
.cht-mobile-actions a,
.cht-mobile-actions button{
  pointer-events:auto;
}

/* 6) Mobile/touch-specific vertical-pan insurance. */
@media (max-width:1024px), (hover:none) and (pointer:coarse){
  html,body.cheritan-designed-page{
    width:100%!important;
    min-height:100%!important;
    height:auto!important;
    max-height:none!important;
  }
  body.cheritan-designed-page,
  body.cheritan-designed-page main,
  body.cheritan-designed-page main > section{
    touch-action:pan-y pinch-zoom!important;
  }
  body.cheritan-designed-page main > section{
    overflow-y:visible!important;
  }
}