/* NAVEX HUB · navex-fluid.css · rev479 · ADR-478
   Camada GLOBAL e ADITIVA de fluidez e responsividade. Carrega por último em todas as telas.
   Regra de ouro: nada aqui redefine cor, tipografia ou layout de um módulo; só corrige o que
   é comum a todos (toque, rolagem, tabela estreita, texto longo, foco, telas altas/curtas).
   Tudo condicionado por media query ou por seletor que não colide com os módulos.
   Sem hex. Sem !important fora do bloco de toque (onde o alvo é o próprio hover residual). */

/* ── 1 · base de rolagem e toque ─────────────────────────────────────────── */
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;scroll-padding-top:5rem}
@media(prefers-reduced-motion:no-preference){html{scroll-behavior:smooth}}
body{overscroll-behavior-y:none;-webkit-tap-highlight-color:transparent}
button,[role="button"],a,select,input,textarea,summary,label{touch-action:manipulation}
button,summary{-webkit-user-select:none;user-select:none}
input,textarea{-webkit-user-select:text;user-select:text}
/* rolagem interna com inércia e sem "vazar" para a página */
.m-body,.nvx-dialog-body,.hu-list,.nvx-body,[class*="-list"],[class*="-log"],[class*="scroll"]{-webkit-overflow-scrolling:touch;overscroll-behavior:contain}
/* barras de rolagem discretas nos containers (não some, só emagrece) */
.m-body,.nvx-dialog-body,.hu-list,.nvx-body{scrollbar-width:thin;scrollbar-color:var(--line-2) transparent}

/* ── 2 · foco visível uniforme (teclado) ─────────────────────────────────── */
:where(button,a,select,input,textarea,summary,[tabindex]):focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:.375rem}
:where(button,a,select,input,textarea):focus:not(:focus-visible){outline:none}

/* ── 3 · mídia e texto nunca estouram o contêiner ────────────────────────── */
.shell :where(img,video,canvas,svg,iframe){max-width:100%;height:auto}
.shell :where(p,li,td,th,dd,small,blockquote){overflow-wrap:anywhere}
.shell :where(pre,code){overflow-wrap:anywhere;white-space:pre-wrap}

/* ── 4 · ponteiro grosso (toque): alvo mínimo e sem hover residual ───────── */
@media(pointer:coarse){
  .minibtn,.nvx-mini,.dev-ib,.nv2-ib,.n-it,.hu-btn,.tab,[class*="-tab"]{min-height:2.75rem}
  select,input:not([type="checkbox"]):not([type="radio"]),.field-i{min-height:2.75rem}
}
@media(hover:none){
  a:hover,button:hover,[class*="card"]:hover,[class*="-it"]:hover{transform:none!important}
}

/* ── 5 · viewport estreito: tabelas viram rolagem horizontal, modais ocupam a tela ── */
@media(max-width:720px){
  .shell table{display:block;max-width:100%;overflow-x:auto;white-space:nowrap;-webkit-overflow-scrolling:touch;scrollbar-width:thin}
  .overlay>.modal{width:calc(100vw - 1rem);max-width:none;max-height:calc(100dvh - 1rem);border-radius:1rem}
  .overlay>.modal .m-foot{flex-wrap:wrap;gap:.5rem}
  .overlay>.modal .m-foot .lanc-btn{flex:1 1 12rem}
  .page-head{align-items:flex-start}
  .page-head h1{font-size:clamp(1.375rem,6vw,1.625rem)}
}
@media(max-width:520px){
  .shell{padding-left:1rem;padding-right:1rem}
  .overlay{padding:.5rem}
  .overlay>.modal{width:100vw;max-height:100dvh;border-radius:1rem 1rem 0 0;align-self:flex-end}
}

/* ── 6 · barra inferior (rail no celular): respeita a área segura do iPhone ── */
@media(max-width:860px){
  #nvxSide{padding-bottom:env(safe-area-inset-bottom,0)}
  .shell{padding-bottom:calc(5rem + env(safe-area-inset-bottom,0))}
  .toast{bottom:calc(4.5rem + env(safe-area-inset-bottom,0))}
}

/* ── 7 · telas curtas (notebook 13" com barra do navegador): menos ar vertical ── */
@media(max-height:760px) and (min-width:861px){
  .shell{padding-top:1.125rem}
  .page-head{padding-bottom:.875rem;margin-bottom:1rem}
}

/* ── 8 · telas largas: conteúdo não vira uma linha infinita (o shell já limita; isto é o respiro) ── */
@media(min-width:1920px){.shell{padding-left:clamp(2rem,4vw,4rem);padding-right:clamp(2rem,4vw,4rem)}}

/* ── 9 · impressão: sem rail, sem header, sem sombras ────────────────────── */
@media print{
  #nvxSide,#nvxTog,#nvxUser,#nvxFoot,.toast,.overlay{display:none!important}
  body{padding:0!important;background:none}
  .shell{max-width:none;padding:0}
  *{box-shadow:none!important}
}
