/* ========================================================================
   Oficina Portátil V75.27 — APK Bottom Bar estável / somente ícones
   ======================================================================== */

/* A implementação antiga continua no pacote legado, mas fica invisível. */
html.op-apk #op-apk-bottom-bar,
html.op-apk body > #op-apk-bottom-bar {
  display:none!important;
  visibility:hidden!important;
  pointer-events:none!important;
}

#op-apk-bottom-bar-v7527 { display:none; }

html.op-apk #op-apk-bottom-bar-v7527 {
  position:fixed;
  z-index:100020;
  left:0;
  right:0;
  bottom:0;
  height:calc(64px + env(safe-area-inset-bottom, 0px));
  min-height:calc(64px + env(safe-area-inset-bottom, 0px));
  padding:6px max(7px,env(safe-area-inset-left,0px)) max(6px,env(safe-area-inset-bottom,0px)) max(7px,env(safe-area-inset-right,0px));
  display:flex;
  align-items:flex-start;
  justify-content:center;
  gap:3px;
  overflow-x:auto;
  overflow-y:hidden;
  overscroll-behavior-x:contain;
  scrollbar-width:none;
  -webkit-overflow-scrolling:touch;
  touch-action:pan-x;
  border-top:1px solid color-mix(in srgb,var(--text) 10%,transparent);
  background:
    linear-gradient(180deg,
      color-mix(in srgb,var(--panel-solid) 62%,transparent),
      color-mix(in srgb,var(--panel-solid) 84%,transparent));
  -webkit-backdrop-filter:blur(22px) saturate(1.5);
  backdrop-filter:blur(22px) saturate(1.5);
  box-shadow:
    inset 0 1px 0 color-mix(in srgb,#fff 30%,transparent),
    0 -11px 30px rgba(0,20,18,.10);
  contain:layout paint;
}

html.op-apk #op-apk-bottom-bar-v7527::-webkit-scrollbar { display:none; }

html.op-apk .op-apk-bottom-item-v7527 {
  position:relative;
  flex:1 1 0;
  width:clamp(42px,11.5vw,62px);
  min-width:42px;
  max-width:62px;
  height:52px;
  min-height:52px;
  padding:0;
  margin:0;
  border:0;
  border-radius:18px!important;
  display:grid;
  place-items:center;
  color:var(--muted);
  background:transparent;
  -webkit-tap-highlight-color:transparent;
  transition:transform .16s ease,color .16s ease,background .16s ease,box-shadow .16s ease;
}

html.op-apk .op-apk-bottom-item-v7527:active {
  transform:scale(.91);
}

html.op-apk .op-apk-bottom-icon-v7527 {
  width:42px;
  height:42px;
  display:grid;
  place-items:center;
  border-radius:17px;
  color:currentColor;
  overflow:visible;
  transition:transform .16s ease,background .16s ease,color .16s ease,box-shadow .16s ease;
}

html.op-apk .op-apk-bottom-icon-v7527 > svg,
html.op-apk .op-apk-bottom-icon-v7527 > img,
html.op-apk .op-apk-bottom-icon-v7527 .op-overview-orbit-icon,
html.op-apk .op-apk-bottom-icon-v7527 .op-overview-orbit-icon > svg,
html.op-apk .op-apk-bottom-icon-v7527 .op-overview-orbit-icon > img {
  display:block!important;
  width:24px!important;
  height:24px!important;
  max-width:24px!important;
  max-height:24px!important;
  object-fit:contain;
  color:currentColor;
}

/* Sem rótulo visível: acessibilidade continua via aria-label/title. */
html.op-apk .op-apk-bottom-label-v7527,
html.op-apk #op-apk-bottom-bar-v7527 .op-apk-bottom-label,
html.op-apk #op-apk-bottom-bar-v7527 .op-apk-bottom-text {
  display:none!important;
}

html.op-apk .op-apk-bottom-item-v7527.active {
  color:var(--on-accent,#fff);
}

html.op-apk .op-apk-bottom-item-v7527.active .op-apk-bottom-icon-v7527 {
  background:var(--accent);
  color:var(--on-accent,#fff);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.25),
    0 7px 18px color-mix(in srgb,var(--accent) 24%,transparent);
}

/* Form/SAP e outros PNG/SVG que usam cor própria não recebem filtros forçados. */
html.op-apk .op-apk-bottom-icon-v7527 img { filter:none; }

html[data-theme="dark"].op-apk #op-apk-bottom-bar-v7527 {
  background:linear-gradient(180deg,rgba(14,39,36,.72),rgba(8,29,27,.92));
  border-top-color:rgba(226,255,250,.09);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.07),0 -14px 36px rgba(0,0,0,.24);
}

/* Libera mais área útil agora que os textos da barra desapareceram. */
html.op-apk .app-shell > .workspace > main {
  padding-bottom:calc(88px + env(safe-area-inset-bottom,0px))!important;
}
html.op-apk #op-native-root {
  padding-bottom:calc(78px + env(safe-area-inset-bottom,0px))!important;
}

/* Telefones estreitos: os ícones continuam compactos e todos acessíveis. */
@media (max-width:390px) {
  html.op-apk #op-apk-bottom-bar-v7527 { gap:1px; padding-left:4px; padding-right:4px; }
  html.op-apk .op-apk-bottom-item-v7527 { min-width:40px; width:40px; }
  html.op-apk .op-apk-bottom-icon-v7527 { width:39px; height:39px; border-radius:16px; }
  html.op-apk .op-apk-bottom-icon-v7527 > svg,
  html.op-apk .op-apk-bottom-icon-v7527 > img,
  html.op-apk .op-apk-bottom-icon-v7527 .op-overview-orbit-icon,
  html.op-apk .op-apk-bottom-icon-v7527 .op-overview-orbit-icon > svg,
  html.op-apk .op-apk-bottom-icon-v7527 .op-overview-orbit-icon > img {
    width:22px!important;height:22px!important;max-width:22px!important;max-height:22px!important;
  }
}

@media (prefers-reduced-motion:reduce) {
  html.op-apk .op-apk-bottom-item-v7527,
  html.op-apk .op-apk-bottom-icon-v7527 { transition:none!important; }
}
