/* =========================================================
   HOME-SCROLL.CSS
   Trame à scroll naturel réservée à la page d'accueil
   Ne modifie aucune autre page de Capnatu.
   ========================================================= */

/* ---------------------------------------------------------
   1. LE DOCUMENT PRINCIPAL DÉFILE
   --------------------------------------------------------- */

html:has(body.capnatu-home-native-scroll){
  min-height:100%;
  height:auto !important;
  overflow-x:hidden !important;
  overflow-y:auto !important;
  background:#536fb2;
}

body.capnatu-home-native-scroll{
  width:100%;
  min-height:100%;
  min-height:100svh;
  min-height:100dvh;
  height:auto !important;

  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;
}

/* Neutralisation des anciens calques fixes de trame.css,
   uniquement sur l'accueil. */
body.capnatu-home-native-scroll::before,
body.capnatu-home-native-scroll::after{
  content:none !important;
  display:none !important;
}

/* ---------------------------------------------------------
   2. LE CONTENU .APP REDEVIENT UN ÉLÉMENT NORMAL
   --------------------------------------------------------- */

body.capnatu-home-native-scroll .app{
  position:relative !important;

  top:auto !important;
  left:auto !important;
  right:auto !important;
  bottom: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;
  overscroll-behavior:auto !important;
  -webkit-overflow-scrolling:auto !important;

  /* Header fixe + espace final pour la navigation */
  padding:
    calc(52px + env(safe-area-inset-top) + 12px)
    5px
    calc(100px + env(safe-area-inset-bottom)) !important;

  background:transparent !important;
}

/* Évite de cumuler le padding du conteneur accueil avec celui de .app */
body.capnatu-home-native-scroll .home-page-container{
  padding-bottom:18px !important;
}

/* ---------------------------------------------------------
   3. HEADER
   --------------------------------------------------------- */

body.capnatu-home-native-scroll .app-header{
  position:fixed !important;
  top:0 !important;
  left:0 !important;
  right:0 !important;
  z-index:1200 !important;

  padding-top:env(safe-area-inset-top) !important;
  min-height:calc(52px + env(safe-area-inset-top)) !important;
}

/* ---------------------------------------------------------
   4. NAVIGATION BASSE
   --------------------------------------------------------- */

/* Navigateur classique :
   navigation flottante proche du bas, sans bloquer le scroll du body. */
body.capnatu-home-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;
}

/* WebApp iPhone :
   la barre descend jusqu'au bord physique de l'écran.
   Le safe-area est intégré DANS le footer au lieu de le soulever. */
@media (display-mode:standalone){
  body.capnatu-home-native-scroll{
    min-height:100dvh !important;
  }

  body.capnatu-home-native-scroll .app{
    padding-bottom:calc(88px + env(safe-area-inset-bottom)) !important;
  }

  body.capnatu-home-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-left:0 !important;
    border-right:0 !important;
    border-bottom:0 !important;

    border-radius:22px 22px 0 0 !important;

    background:rgba(247,250,255,.92) !important;
  }
}

/* Safari iOS */
@supports (-webkit-touch-callout:none){
  html:has(body.capnatu-home-native-scroll),
  body.capnatu-home-native-scroll{
    min-height:-webkit-fill-available;
  }

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

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

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

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