/* Tooca na Missa v2.8.6
   Regra final do cabeçalho: sempre preso ao viewport, sem dupla margem.
   Este arquivo é carregado depois do app.css para vencer regras antigas. */
:root{
  --tooca-header-h:66px;
  --tooca-header-gap:12px;
}

html{
  scroll-padding-top:calc(var(--tooca-header-h) + 10px)!important;
}

body:not(.performance-mode){
  padding-top:var(--tooca-header-h)!important;
}

header.topbar.topbar-v6{
  position:fixed!important;
  inset:0 0 auto 0!important;
  top:0!important;
  left:0!important;
  right:0!important;
  width:100%!important;
  margin:0!important;
  transform:none!important;
  -webkit-transform:none!important;
  z-index:50000!important;
  background:rgba(247,244,241,.975)!important;
  -webkit-backdrop-filter:blur(18px)!important;
  backdrop-filter:blur(18px)!important;
  border-bottom:1px solid rgba(123,35,52,.10)!important;
  box-shadow:0 5px 18px rgba(54,31,36,.05)!important;
  contain:none!important;
}

/* O conteúdo começa logo abaixo do menu. Remove compensações duplicadas
   deixadas por versões antigas. */
body:not(.performance-mode) .page-shell,
body:not(.performance-mode) .page-shell-v6,
body.app-v21:not(.performance-mode) .page-shell,
body.app-v21:not(.performance-mode) .page-shell-v6{
  margin-top:var(--tooca-header-gap)!important;
}

body.performance-mode{
  padding-top:0!important;
}
body.performance-mode header.topbar.topbar-v6{
  display:none!important;
}

.mobile-menu-backdrop{z-index:50010!important}
.mobile-menu-drawer{z-index:50020!important}
.mobile-menu-toggle{position:relative!important;z-index:50030!important}

/* Modais precisam continuar acima do menu fixo. */
.youtube-review-backdrop{z-index:60000!important}
.youtube-review-panel,
.youtube-review-panel.is-modal-open{z-index:60010!important}

@media (max-width:980px){
  :root{--tooca-header-h:62px;--tooca-header-gap:10px}
  header.topbar.topbar-v6{
    min-height:62px!important;
    height:62px!important;
  }
}

@media (max-width:700px){
  :root{--tooca-header-h:calc(56px + env(safe-area-inset-top));--tooca-header-gap:8px}
  header.topbar.topbar-v6{
    min-height:calc(56px + env(safe-area-inset-top))!important;
    height:calc(56px + env(safe-area-inset-top))!important;
    padding-top:env(safe-area-inset-top)!important;
    padding-bottom:0!important;
    padding-left:max(10px,env(safe-area-inset-left))!important;
    padding-right:max(10px,env(safe-area-inset-right))!important;
  }

  body:not(.performance-mode) .page-shell,
  body:not(.performance-mode) .page-shell-v6,
  body.app-v21:not(.performance-mode) .page-shell,
  body.app-v21:not(.performance-mode) .page-shell-v6{
    margin-top:8px!important;
  }

  /* Drawer não pode começar escondido debaixo do cabeçalho. */
  .mobile-menu-drawer{
    max-height:calc(100dvh - 24px)!important;
  }
}