/* CAPNATU — scroll naturel uniquement pour Events */

html.capnatu-events-native-scroll{
  width:100%;
  height:auto !important;
  min-height:100%;
  margin:0;
  padding:0;
  overflow-x:hidden !important;
  overflow-y:auto !important;
  background:#536fb2;
}

body.capnatu-events-native-scroll{
  width:100%;
  height:auto !important;
  min-height:100vh;
  min-height:100svh;
  min-height:100dvh;
  margin:0;
  padding:0;
  overflow-x:hidden !important;
  overflow-y:visible !important;
  overscroll-behavior-y:auto !important;
  -webkit-overflow-scrolling:touch;
  background:
    radial-gradient(760px 430px at 12% 5%,rgba(255,255,255,.25),transparent 62%),
    radial-gradient(760px 460px at 91% 26%,rgba(79,222,224,.20),transparent 64%),
    radial-gradient(780px 470px at 42% 102%,rgba(226,100,195,.22),transparent 65%),
    linear-gradient(155deg,#367faf 0%,#536fb2 52%,#79569a 100%) !important;
  background-repeat:no-repeat !important;
  background-size:cover !important;
  background-position:center top !important;
  background-attachment:scroll !important;
}

body.capnatu-events-native-scroll::before,
body.capnatu-events-native-scroll::after{
  display:none !important;
  content:none !important;
}

body.capnatu-events-native-scroll .app{
  position:relative !important;
  top:auto !important;
  right:auto !important;
  bottom:auto !important;
  left:auto !important;
  width:100% !important;
  max-width:760px !important;
  height:auto !important;
  min-height:100vh !important;
  min-height:100svh !important;
  min-height:100dvh !important;
  margin:0 auto !important;
  overflow:visible !important;
  overflow-x:visible !important;
  overflow-y:visible !important;
  overscroll-behavior:auto !important;
  -webkit-overflow-scrolling:auto !important;
  padding:
    calc(52px + env(safe-area-inset-top) + 12px)
    5px
    calc(108px + env(safe-area-inset-bottom)) !important;
  background:transparent !important;
}

body.capnatu-events-native-scroll .premium-page-container,
body.capnatu-events-native-scroll .agenda{
  width:100%;
  margin-right:auto;
  margin-left:auto;
}

body.capnatu-events-native-scroll .app-header{
  position:fixed !important;
  top:0 !important;
  right:0 !important;
  left:0 !important;
  z-index:1200 !important;
  padding-top:env(safe-area-inset-top) !important;
  min-height:calc(52px + env(safe-area-inset-top)) !important;
}

body.capnatu-events-native-scroll .bottom-nav{
  position:fixed !important;
  left:50% !important;
  right:auto !important;
  bottom:8px !important;
  transform:translateX(-50%) !important;
  width:min(540px,calc(100% - 16px)) !important;
  margin:0 !important;
  padding:7px !important;
  z-index:1500 !important;
}

@media (display-mode:standalone){
  body.capnatu-events-native-scroll .app{
    padding-bottom:calc(94px + env(safe-area-inset-bottom)) !important;
  }

  body.capnatu-events-native-scroll .bottom-nav{
    bottom:0 !important;
    width:100% !important;
    max-width:560px !important;
    padding:
      7px
      max(8px,env(safe-area-inset-right))
      calc(7px + env(safe-area-inset-bottom))
      max(8px,env(safe-area-inset-left)) !important;
    border-right:0 !important;
    border-bottom:0 !important;
    border-left:0 !important;
    border-radius:22px 22px 0 0 !important;
    background:rgba(247,250,255,.92) !important;
  }
}

@supports (-webkit-touch-callout:none){
  html.capnatu-events-native-scroll,
  body.capnatu-events-native-scroll{
    min-height:-webkit-fill-available;
  }

  body.capnatu-events-native-scroll .app{
    min-height:-webkit-fill-available !important;
  }
}

@media (max-width:390px){
  body.capnatu-events-native-scroll .app{
    padding-right:3px !important;
    padding-left:3px !important;
  }

  body.capnatu-events-native-scroll .bottom-nav{
    width:calc(100% - 12px) !important;
  }
}

@media (display-mode:standalone) and (max-width:390px){
  body.capnatu-events-native-scroll .bottom-nav{
    width:100% !important;
  }
}