/* v3.5.3 shared scrolling contract.
   Loaded after each interface's embedded stylesheet so it can correct viewport
   locking without changing the individual visual designs. */
html{min-height:100%;max-width:100%;overflow-x:hidden}
body{max-width:100%;overflow-x:hidden;-webkit-overflow-scrolling:touch}

/* Skype is intentionally a viewport app, so its columns must own the scroll.
   min-height:0 is essential for nested flex overflow on Safari/iOS. */
body.ui-skype{height:100dvh;min-height:100dvh;overflow:hidden;overscroll-behavior:none}
body.ui-skype .app{height:100dvh!important;min-height:0!important;overflow:hidden!important}
body.ui-skype .people,
body.ui-skype .primary{min-height:0!important;overflow:hidden}
body.ui-skype .peopleScroll,
body.ui-skype .callFrame{min-height:0!important;overflow-x:hidden!important;overflow-y:auto!important;-webkit-overflow-scrolling:touch;overscroll-behavior-y:contain;touch-action:pan-y}
body.ui-skype .settingsOverlay.show{overflow-x:hidden!important;overflow-y:auto!important;-webkit-overflow-scrolling:touch;touch-action:pan-y}
body.ui-skype .settingsBody{min-height:min-content}
body.ui-skype .composeBox,
body.ui-skype .modalbox{overscroll-behavior-y:contain;-webkit-overflow-scrolling:touch;touch-action:pan-y}

/* Matrix/Classic use normal document scrolling.  Never let a fixed-height app
   wrapper or mobile browser viewport freeze the page. */
body.ui-matrix{height:auto!important;min-height:100dvh!important;overflow-y:auto!important;overscroll-behavior-y:auto;touch-action:pan-y}
body.ui-matrix .app{height:auto!important;min-height:100dvh!important;overflow:visible!important}
body.ui-matrix .shell,
body.ui-matrix .view.active{overflow:visible!important}
body.ui-matrix .list,
body.ui-matrix .roleGrid,
body.ui-matrix .modal>.card{overscroll-behavior:contain;-webkit-overflow-scrolling:touch;touch-action:pan-y}

/* Operator is also a document-scrolling desktop console, with independently
   scrolling queue/people panes. */
body.ui-operator{height:auto!important;min-height:100dvh!important;overflow-y:auto!important;overscroll-behavior-y:auto;touch-action:pan-y}
body.ui-operator .app{height:auto!important;min-height:100dvh!important;overflow:visible!important}
body.ui-operator .peopleScroll,
body.ui-operator .queue,
body.ui-operator .modalbox{overscroll-behavior-y:contain;-webkit-overflow-scrolling:touch;touch-action:pan-y}

@media(max-width:900px){
  body.ui-skype .people,
  body.ui-skype .primary{height:auto;min-height:0!important}
  body.ui-skype .callFrame{height:100%;padding-bottom:max(20px,calc(20px + env(safe-area-inset-bottom)))}
  body.ui-skype .peopleScroll{padding-bottom:max(82px,calc(70px + env(safe-area-inset-bottom)))}
}

@media(max-width:760px){
  body.ui-matrix .shell,
  body.ui-operator .console{padding-bottom:max(110px,calc(92px + env(safe-area-inset-bottom)))}
}