/* OFC-UI-069 / 2026-11-03 — correção urgente do dock mobile.
   ANTES: posição fixed dentro do workbench + biblioteca flutuante competiam com a área de leitura.
   DEPOIS: dock é filho direto do body; biblioteca inline; nenhuma gaveta persistente tapa conteúdo.
   Rollback: reverter OFC-UI-069, preservando receitas e permissões. */
@media (max-width:730px) {
  :root { --pd-dock-height: 70px; }
  html, body { max-width:100%; overflow-x:clip; }
  body:has(#workbench:not([hidden])) .app {
    padding-bottom:calc(104px + env(safe-area-inset-bottom,0px))!important;
  }
  /* A navegação é movida do workbench para o body via JS; não fica presa
     a stacking contexts ou containers que rolam. */
  body > nav.mode-tabs.pd-mobile-dock {
    position:fixed!important;
    inset:auto 0 0 0!important;
    top:auto!important;
    width:100%!important;
    max-width:100vw!important;
    height:auto!important;
    min-height:var(--pd-dock-height)!important;
    margin:0!important;
    padding:6px max(7px,env(safe-area-inset-right,0px)) calc(6px + env(safe-area-inset-bottom,0px)) max(7px,env(safe-area-inset-left,0px))!important;
    display:flex!important;
    flex-direction:row!important;
    align-items:stretch!important;
    justify-content:space-around!important;
    gap:4px!important;
    overflow:visible!important;
    background:#101714!important;
    color:#d3ddd1!important;
    border:0!important;
    border-top:1px solid #53674d!important;
    border-radius:14px 14px 0 0!important;
    box-shadow:0 -6px 24px #0007!important;
    z-index:50!important;
    transform:none!important;
    box-sizing:border-box!important;
  }
  body > nav.mode-tabs.pd-mobile-dock[hidden]{display:none!important}
  body > nav.mode-tabs.pd-mobile-dock .mode-tab{
    display:flex!important;
    flex:1 1 0!important;
    flex-direction:column!important;
    justify-content:center!important;
    align-items:center!important;
    min-width:0!important;
    min-height:52px!important;
    height:auto!important;
    gap:3px!important;
    margin:0!important;
    padding:7px 1px!important;
    white-space:nowrap!important;
    line-height:1.12!important;
    font-size:clamp(.63rem,2.6vw,.78rem)!important;
    color:#c1ccbc!important;
    background:transparent!important;
    border:1px solid transparent!important;
    border-radius:11px!important;
    box-shadow:none!important;
    touch-action:manipulation;
  }
  body > nav.mode-tabs.pd-mobile-dock .mode-tab[hidden]{display:none!important}
  body > nav.mode-tabs.pd-mobile-dock .mode-tab[aria-selected="true"]{
    background:#2b402e!important;
    color:#d9ffa8!important;
    border-color:#789a68!important;
  }
  body > nav.mode-tabs.pd-mobile-dock .pd-nav-icon{
    display:block!important;
    font-size:1.18rem!important;
    line-height:1.1!important;
    font-weight:500!important;
  }
  body > nav.mode-tabs.pd-mobile-dock .pd-nav-label{display:block!important}
  body > nav.mode-tabs.pd-mobile-dock .mode-tab:focus-visible{
    outline:2px solid var(--lime)!important;outline-offset:-2px!important;
  }
  /* A biblioteca nunca é fixed no mobile. Sua abertura empurra o conteúdo,
     deixando todas as receitas e seu leitor acessíveis por scroll normal. */
  #workbench .library-layout {
    display:flex!important;
    flex-direction:column!important;
    gap:12px!important;
  }
  #workbench .library-layout > .library-page{
    position:relative!important;
    inset:auto!important;
    top:auto!important;
    left:auto!important;
    right:auto!important;
    bottom:auto!important;
    transform:none!important;
    display:block!important;
    order:0!important;
    width:100%!important;
    max-width:100%!important;
    margin:0!important;
    padding:10px!important;
    z-index:auto!important;
    overflow:visible!important;
    box-shadow:none!important;
  }
  #workbench .library-layout > .library-page:not(.is-open){
    max-height:none!important;
    overflow:visible!important;
  }
  #workbench .library-layout > .library-page.is-open{
    max-height:none!important;
    overflow:visible!important;
    overscroll-behavior:auto!important;
  }
  #workbench .library-layout > .library-reader {
    order:1!important;
    margin:0!important;
    min-width:0!important;
  }
  #workbench .library-page:not(.is-open) > .library-expandable-062{display:none!important}
  #workbench .library-page .other-recipes-toggle{width:100%;min-height:48px;touch-action:manipulation}
  /* Não forçar drawer fixed para Ações: menu ancorado ao botão, de tamanho limitado. */
  #workbench .top-recipe-menu-060 .top-menu-content-060{
    position:absolute!important;
    top:calc(100% + 6px)!important;
    bottom:auto!important;
    right:0!important;
    left:auto!important;
    max-width:min(280px,calc(100vw - 24px))!important;
    width:min(270px,calc(100vw - 24px))!important;
    z-index:65!important;
    box-shadow:0 12px 27px #0008!important;
  }
  #workbench .workbench-top #new-recipe{display:none!important}
  #workbench .floating-save{
    position:static!important;
    inset:auto!important;
    transform:none!important;
    max-width:100%!important;
    margin:12px 0 0!important;
    z-index:auto!important;
  }
}
@media(max-width:360px){
 body > nav.mode-tabs.pd-mobile-dock{gap:1px!important}
 body > nav.mode-tabs.pd-mobile-dock .mode-tab{font-size:.62rem!important}
}
@media(prefers-reduced-motion:reduce){
 body > nav.mode-tabs.pd-mobile-dock .mode-tab{transition:none!important}
}
@media(max-width:730px){
 body[data-theme="light"] > nav.mode-tabs.pd-mobile-dock{
   background:#f5f8ef!important;color:#2a3a2b!important;border-top-color:#9caf91!important;
 }
 body[data-theme="light"] > nav.mode-tabs.pd-mobile-dock .mode-tab{color:#456147!important}
 body[data-theme="light"] > nav.mode-tabs.pd-mobile-dock .mode-tab[aria-selected="true"]{
   background:#dceacb!important;color:#234421!important;border-color:#7e9b6a!important;
 }
}