/* TEMVIO v1.0.4 — Android 16 / API 36 System Bars Hotfix */
:root{
  --temvio-inset-top: env(safe-area-inset-top, 0px);
  --temvio-inset-right: env(safe-area-inset-right, 0px);
  --temvio-inset-bottom: env(safe-area-inset-bottom, 0px);
  --temvio-inset-left: env(safe-area-inset-left, 0px);
}

/* The native bridge overwrites these variables with real Android px values.
   Keep the document canvas edge-to-edge, but inset actual UI surfaces. */
html,body{min-height:100%;}

/* Marketing / public shell */
#marketing .nav{
  padding-top:var(--temvio-inset-top);
  padding-left:max(24px,var(--temvio-inset-left));
  padding-right:max(24px,var(--temvio-inset-right));
  height:calc(76px + var(--temvio-inset-top));
}
#marketing{
  padding-bottom:var(--temvio-inset-bottom);
}

/* Logged-in app shell */
#appShell .app-layout{
  min-height:100dvh;
}
#appShell .sidebar{
  padding-top:var(--temvio-inset-top);
  padding-bottom:var(--temvio-inset-bottom);
}
#appShell .main{
  padding-top:var(--temvio-inset-top);
  padding-left:max(var(--temvio-inset-left),0px);
  padding-right:max(var(--temvio-inset-right),0px);
  padding-bottom:calc(var(--temvio-inset-bottom) + 12px);
}
#appShell .topbar{
  min-height:calc(70px + var(--temvio-inset-top));
  padding-top:var(--temvio-inset-top);
}

/* Fixed mobile controls must be offset from Android navigation / gesture area. */
.bottom-nav{
  bottom:calc(8px + var(--temvio-inset-bottom)) !important;
  left:calc(8px + var(--temvio-inset-left)) !important;
  right:calc(8px + var(--temvio-inset-right)) !important;
}
.fab{
  bottom:calc(88px + var(--temvio-inset-bottom)) !important;
  right:calc(18px + var(--temvio-inset-right)) !important;
}

/* Make enough scroll room so final content is never hidden under the floating nav. */
@media(max-width:900px){
  #appShell .main{
    padding-bottom:calc(112px + var(--temvio-inset-bottom)) !important;
  }
}

/* Modal/bottom-sheet safety */
.modal-wrap,
.market-modal-wrap{
  padding-top:var(--temvio-inset-top);
  padding-bottom:var(--temvio-inset-bottom);
}
.market-modal{
  max-height:calc(100dvh - var(--temvio-inset-top) - var(--temvio-inset-bottom) - 8px) !important;
}

/* On devices with a side cutout/gesture inset */
@media(orientation:landscape){
  body{
    padding-left:var(--temvio-inset-left);
    padding-right:var(--temvio-inset-right);
  }
}