/* Navegação do portal · versão 2 (padrão único, sem cores destoantes) */
:root{--nv-ink:#141c2b;--nv-muted:#6b7586;--nv-line:#e7eaf0;--nv-soft:#f3f6fa;--nv-blue:#1555ff;--nv-blue-l:#e8eeff}

/* ícones (svg em <img>): cinza quando inativo, azul quando ativo */
html body#portalVariant #vxNav .vx-navbutton img,
html body#portalVariant #vxNav #vxManage>summary img,
html body#portalVariant #rawTabs button img{opacity:.62!important;filter:none!important;transition:opacity .15s}
html body#portalVariant #vxNav .vx-navbutton.active img,
html body#portalVariant #rawTabs button[aria-selected="true"] img{opacity:1!important;filter:invert(24%) sepia(96%) saturate(3600%) hue-rotate(222deg) brightness(97%)!important}

/* botões da barra: todos iguais, inclusive Matéria-prima */
html body#portalVariant #vxNav .vx-navbutton,
html body#portalVariant #vxNav .vx-navbutton.raw-material-tab,
html body#portalVariant #vxNav #vxManage>summary{background:transparent!important;color:var(--nv-muted)!important;border:0!important;border-top:0!important;box-shadow:none!important;font-weight:600!important}
html body#portalVariant #vxNav .vx-navbutton:hover,
html body#portalVariant #vxNav #vxManage>summary:hover{color:var(--nv-ink)!important;background:var(--nv-soft)!important}
html body#portalVariant #vxNav .vx-navbutton.active,
html body#portalVariant #vxNav .vx-navbutton.raw-material-tab.active{color:var(--nv-blue)!important;background:transparent!important}

/* sub-abas (Operação · Coleta de matéria-prima · Histórico mensal): controle segmentado */
html body#portalVariant #rawTabs{display:inline-flex!important;gap:2px!important;padding:3px!important;background:#fff!important;border:1px solid var(--nv-line)!important;border-radius:11px!important;box-shadow:none!important;max-width:100%!important;overflow-x:auto!important}
html body#portalVariant #rawTabs button,
html body#portalVariant #rawTabs button.raw-material-tab{display:inline-flex!important;align-items:center!important;gap:7px!important;background:transparent!important;color:var(--nv-muted)!important;border:0!important;border-radius:8px!important;box-shadow:none!important;padding:8px 12px!important;font-weight:600!important;font-size:13px!important;white-space:nowrap!important;min-height:0!important}
html body#portalVariant #rawTabs button:hover{background:var(--nv-soft)!important;color:var(--nv-ink)!important}
html body#portalVariant #rawTabs button[aria-selected="true"]{background:var(--nv-ink)!important;color:#fff!important}
html body#portalVariant #rawTabs button[aria-selected="true"] img{filter:invert(1)!important;opacity:1!important}
html body#portalVariant #rawTabs button img{width:16px!important;height:16px!important}
html body#portalVariant #rawTabs button :is(.badge,.count,span[class*=count],b){background:var(--nv-blue)!important;color:#fff!important;border-radius:999px!important;font-size:10.5px!important;padding:1px 6px!important;min-width:0!important}

/* computador: barra superior com sublinhado azul na aba ativa */
@media (min-width:761px){
  html body#portalVariant #vxNav .vx-navbutton,
  html body#portalVariant #vxNav #vxManage>summary{border-radius:0!important;border-bottom:2px solid transparent!important;padding-left:14px!important;padding-right:14px!important}
  html body#portalVariant #vxNav .vx-navbutton:hover{background:transparent!important}
  html body#portalVariant #vxNav .vx-navbutton.active{border-bottom-color:var(--nv-blue)!important;color:var(--nv-ink)!important}
}

/* celular: barra inferior limpa, ícone com pílula na aba ativa */
@media (max-width:760px){
  html body#portalVariant #vxNav{background:#fff!important;border-top:1px solid var(--nv-line)!important;box-shadow:0 -4px 16px #1722350d!important;padding:6px 4px calc(6px + env(safe-area-inset-bottom))!important;gap:0!important}
  html body#portalVariant #vxNav .vx-navbutton,
  html body#portalVariant #vxNav #vxManage>summary{height:54px!important;min-height:54px!important;gap:4px!important;border-radius:10px!important;font-size:10.5px!important;padding:2px 0!important}
  html body#portalVariant #vxNav .vx-navbutton:hover{background:transparent!important}
  html body#portalVariant #vxNav .vx-navbutton img,
  html body#portalVariant #vxNav #vxManage>summary img{width:22px!important;height:22px!important;padding:4px 14px!important;box-sizing:content-box!important;border-radius:999px!important}
  html body#portalVariant #vxNav .vx-navbutton.active img{background:var(--nv-blue-l)!important}
  html body#portalVariant #vxNav .vx-navbutton span{max-width:100%!important;overflow:hidden!important;text-overflow:ellipsis!important}
  html body#portalVariant #rawTabs{display:flex!important;width:100%!important}
  html body#portalVariant #rawTabs button{flex:1 1 0!important;justify-content:center!important;padding:8px 6px!important;font-size:12px!important;white-space:normal!important;text-align:center!important;line-height:1.2!important}
}

/* abas internas da Matéria-prima (Acompanhamento, Agenda...) no mesmo padrão neutro */
html body#portalVariant #rawIntegratedWorkspace>nav button{background:#fff!important;color:var(--nv-muted)!important;border:1px solid var(--nv-line)!important;box-shadow:none!important;font-weight:600!important}
html body#portalVariant #rawIntegratedWorkspace>nav button:hover{color:var(--nv-ink)!important;border-color:#c9d1dd!important}
html body#portalVariant #rawIntegratedWorkspace>nav button:is(.active,[aria-pressed="true"]){background:var(--nv-ink)!important;color:#fff!important;border-color:var(--nv-ink)!important}

@media (max-width:760px){
  html body#portalVariant #rawTabs button,html body#portalVariant #rawTabs button *{white-space:normal!important}
  html body#portalVariant #rawTabs button span{font-size:11.5px!important;line-height:1.2!important;overflow-wrap:anywhere!important}
  html body#portalVariant #rawTabs button{flex-direction:column!important;gap:4px!important;padding:8px 4px!important}
}
@media (max-width:760px){
  html body#portalVariant #vxNav .vx-navbutton.active img{background:transparent!important}
  html body#portalVariant #vxNav .vx-navbutton{position:relative!important}
  html body#portalVariant #vxNav .vx-navbutton.active::before{content:""!important;position:absolute!important;top:3px!important;left:50%!important;width:52px!important;height:30px!important;transform:translateX(-50%)!important;border-radius:999px!important;background:#e8eeff!important;z-index:0!important}
  html body#portalVariant #vxNav .vx-navbutton>*{position:relative!important;z-index:1!important}
}
html body#portalVariant #vxNav>.vx-navbutton[data-model-nav="raw"]:not(.active){background:transparent!important;color:var(--nv-muted)!important}
html body#portalVariant #vxNav>.vx-navbutton[data-model-nav="raw"].active{background:transparent!important;color:var(--nv-blue)!important}

/* Barra inferior: nomes inteiros, em até duas linhas, centralizados */
@media (max-width:760px){
  html body#portalVariant #vxNav .vx-navbutton,html body#portalVariant #vxNav #vxManage>summary{height:58px!important;min-height:58px!important;justify-content:flex-start!important;padding-top:4px!important}
  html body#portalVariant #vxNav .vx-navbutton span,html body#portalVariant #vxNav #vxManage>summary{font-size:10px!important;line-height:1.15!important;letter-spacing:-.01em!important}
  html body#portalVariant #vxNav .vx-navbutton span{white-space:normal!important;overflow:visible!important;text-overflow:clip!important;text-align:center!important;display:-webkit-box!important;-webkit-line-clamp:2!important;-webkit-box-orient:vertical!important;max-width:58px!important;overflow-wrap:normal!important;hyphens:none!important}
}
@media (max-width:760px){
  html body#portalVariant #vxNav .vx-navbutton span,html body#portalVariant #vxNav #vxManage>summary{font-size:9.5px!important;letter-spacing:-.02em!important}
  html body#portalVariant #vxNav .vx-navbutton{padding-left:1px!important;padding-right:1px!important}
}
@media (max-width:360px){html body#portalVariant #vxNav .vx-navbutton span,html body#portalVariant #vxNav #vxManage>summary{font-size:8.5px!important}}

/* Menu Gestão (celular): folha organizada, lista uniforme */
@media (max-width:760px){
  html body#portalVariant #vxNav #vxManage .vx-menu{position:fixed!important;left:8px!important;right:8px!important;bottom:calc(72px + env(safe-area-inset-bottom))!important;top:auto!important;width:auto!important;display:grid!important;grid-template-columns:1fr!important;gap:0!important;padding:6px!important;background:#fff!important;border:1px solid var(--nv-line)!important;border-radius:14px!important;box-shadow:0 -10px 30px #17223526!important;max-height:62dvh!important;overflow:auto!important}
  html body#portalVariant #vxNav #vxManage .vx-menu::before{content:"Gestão";display:block;font:700 10.5px Inter,Arial,sans-serif;letter-spacing:.1em;text-transform:uppercase;color:var(--nv-muted);padding:8px 10px 6px}
  html body#portalVariant #vxNav #vxManage .vx-menu button{display:flex!important;align-items:center!important;justify-content:space-between!important;width:100%!important;min-height:46px!important;height:auto!important;padding:10px 12px!important;margin:0!important;border:0!important;border-top:1px solid var(--nv-line)!important;border-radius:0!important;background:#fff!important;color:var(--nv-ink)!important;font:600 14px Inter,Arial,sans-serif!important;text-align:left!important;white-space:normal!important;box-shadow:none!important}
  html body#portalVariant #vxNav #vxManage .vx-menu button::after{content:"›";color:#9aa4b2;font-size:18px;line-height:1}
  html body#portalVariant #vxNav #vxManage .vx-menu button:active{background:var(--nv-soft)!important}
}
/* Assinatura */
html body#portalVariant .portal-credit-all{color:#6b7586!important;font:500 10.5px/1.3 Inter,Arial,sans-serif!important;letter-spacing:.01em!important}
html body#portalVariant .portal-credit-all strong,html body#portalVariant .portal-credit-all span{color:inherit!important;font-weight:700!important;text-transform:none!important;letter-spacing:inherit!important}
@media (max-width:760px){
  html body#portalVariant #variantNavigation>.portal-credit-all{display:block!important;position:static!important;margin:0!important;padding:2px 8px calc(4px + env(safe-area-inset-bottom))!important;min-height:0!important;border:0!important;background:#fff!important;text-align:center!important;font-size:9.5px!important}
  html body#portalVariant #variantNavigation>#vxNav{padding-bottom:2px!important}
}
/* Assinatura discreta */
html body#portalVariant .portal-credit-all{color:#aab3c0!important;font:400 9px/1.2 Inter,Arial,sans-serif!important;letter-spacing:.02em!important;opacity:.9}
html body#portalVariant .portal-credit-all strong,html body#portalVariant .portal-credit-all span{color:inherit!important;font-weight:600!important}
@media (max-width:760px){html body#portalVariant #variantNavigation>.portal-credit-all{font-size:8.5px!important;padding:0 8px calc(3px + env(safe-area-inset-bottom))!important;background:transparent!important}}
@media (max-width:760px){html body#portalVariant #variantNavigation>.portal-credit-all{padding:7px 8px calc(1px + env(safe-area-inset-bottom))!important;line-height:1!important}}
/* Assinatura em duas linhas, bem abaixo dos ícones */
html body#portalVariant .portal-credit-all .pc-l1,html body#portalVariant .portal-credit-all .pc-l2{display:block!important;font-weight:400!important}
html body#portalVariant .portal-credit-all .pc-l1{font-size:.9em!important;margin-bottom:1px!important}
html body#portalVariant .portal-credit-all .pc-l2 strong{font-weight:600!important}
@media (max-width:760px){html body#portalVariant #variantNavigation>.portal-credit-all{padding:12px 8px calc(4px + env(safe-area-inset-bottom))!important;line-height:1.25!important;border-top:1px solid #f0f2f6!important;margin-top:4px!important}}
/* Barra inferior compacta */
@media (max-width:760px){
  html body#portalVariant #vxNav{padding:3px 2px 0!important}
  html body#portalVariant #vxNav .vx-navbutton,html body#portalVariant #vxNav #vxManage>summary{height:46px!important;min-height:46px!important;gap:2px!important;padding-top:2px!important}
  html body#portalVariant #vxNav .vx-navbutton img,html body#portalVariant #vxNav #vxManage>summary img{width:20px!important;height:20px!important;padding:3px 12px!important}
  html body#portalVariant #vxNav .vx-navbutton.active::before{top:2px!important;height:26px!important;width:46px!important}
  html body#portalVariant #vxNav .vx-navbutton span{-webkit-line-clamp:1!important;max-width:62px!important;font-size:9px!important}
  html body#portalVariant #variantNavigation>.portal-credit-all{padding:3px 8px calc(2px + env(safe-area-inset-bottom))!important;margin:0!important;line-height:1.1!important;font-size:7.5px!important;border-top:1px solid #f0f2f6!important}
  html body#portalVariant #variantNavigation>.portal-credit-all .pc-l1{font-size:.95em!important;margin:0!important}
}
@media (max-width:760px){
  html body#portalVariant #vxNav{min-height:0!important;height:auto!important;grid-template-rows:auto!important;align-items:center!important}
  html body#portalVariant #vxNav #vxManage{height:46px!important;min-height:0!important;display:block!important}
  html body#portalVariant #vxNav #vxManage>summary{height:46px!important;min-height:46px!important;box-sizing:border-box!important}
}
/* Barra inferior ainda mais baixa */
@media (max-width:760px){
  html body#portalVariant #vxNav{padding:2px 2px 0!important}
  html body#portalVariant #vxNav .vx-navbutton,html body#portalVariant #vxNav #vxManage,html body#portalVariant #vxNav #vxManage>summary{height:40px!important;min-height:40px!important;gap:1px!important;padding-top:1px!important;padding-bottom:0!important}
  html body#portalVariant #vxNav .vx-navbutton img,html body#portalVariant #vxNav #vxManage>summary img{width:18px!important;height:18px!important;padding:2px 12px!important}
  html body#portalVariant #vxNav .vx-navbutton.active::before{top:1px!important;height:22px!important;width:44px!important}
  html body#portalVariant #variantNavigation>.portal-credit-all{display:flex!important;justify-content:center!important;gap:4px!important;padding:1px 8px calc(1px + env(safe-area-inset-bottom))!important;border-top:0!important;font-size:7.5px!important;line-height:1.2!important}
  html body#portalVariant #variantNavigation>.portal-credit-all .pc-l1,html body#portalVariant #variantNavigation>.portal-credit-all .pc-l2{display:inline!important}
}
@media (max-width:760px){
  html body#portalVariant #variantNavigation>.portal-credit-all{padding:5px 8px max(1px, calc(env(safe-area-inset-bottom) * .3))!important;align-items:flex-end!important}
}
@media (max-width:760px){
  html body#portalVariant #variantNavigation>.portal-credit-all{padding:7px 8px 0!important;margin-bottom:calc(env(safe-area-inset-bottom) * -.35)!important}
  html body#portalVariant #variantNavigation{padding-bottom:0!important}
}
@media (max-width:760px){
  html body#portalVariant #variantNavigation>.portal-credit-all{padding:5px 8px max(3px, calc(env(safe-area-inset-bottom) * .45))!important;margin-bottom:0!important}
}