/* ===== FASE 1 — FUNDAÇÃO PREMIUM ===== */
:root{ --r-card:20px; --sombra-suave:0 8px 30px rgba(15,23,42,.06); --sombra-card:0 4px 18px rgba(15,23,42,.05); }
body:not(.escuro){ --papel:#F8FAFC; }
*{ -webkit-tap-highlight-color:transparent; }
body, .aba, .subtab, .olho, .modulo, .modulo-login, .sub-login,
h1,h2,h3,h4, .kpi, .card, input, select, textarea, button, .knum, .krot{
  font-family:"Inter","IBM Plex Sans",system-ui,sans-serif !important;
  letter-spacing:normal !important;
}
.olho{ text-transform:none; font-size:13px; font-weight:600; color:var(--tinta-fraca); }

/* ---- abas do topo ---- */
.abas{ background:transparent; border-bottom:none; padding:14px 14px 8px; gap:10px; }
.aba{
  text-transform:none; font-weight:600; font-size:13px;
  padding:14px 18px; border-radius:16px;
  border:1px solid #ECECEC; background:#fff; color:#111827;
  box-shadow:var(--sombra-card);
  transition:transform .18s ease, box-shadow .18s ease, background .18s ease, color .18s ease;
}
.aba .abicon{ color:#1E40AF; }
.aba[aria-selected="true"]{
  background:#111827; color:#fff; border-color:#111827;
  border-left:1px solid #111827; padding-left:18px;
  box-shadow:0 8px 22px rgba(17,24,39,.18);
}
.aba[aria-selected="true"] .abicon{ color:#fff; }
.aba:active{ transform:scale(.97); }

/* ---- subtabs ---- */
.subnav{ border-bottom:none; padding-bottom:8px; }
.subtab{
  border-radius:22px; padding:9px 16px; background:#fff;
  border:1px solid #ECECEC; color:#6B7280; box-shadow:var(--sombra-card);
  transition:transform .18s ease, background .18s ease, color .18s ease;
}
.subtab[aria-selected="true"]{ background:#111827; color:#fff; border-color:#111827; }
.subtab:active{ transform:scale(.97); }

/* ---- cards ---- */
.kpi,.card{
  border:none !important; border-radius:var(--r-card);
  box-shadow:var(--sombra-suave);
  transition:transform .18s ease, box-shadow .18s ease;
}
.kpi:active,.card:active{ transform:scale(.985); }
.acao{
  border:none !important; border-radius:18px; background:#fff;
  box-shadow:var(--sombra-card); transition:transform .18s ease;
}
.acao:active{ transform:scale(.96); }

/* ---- modo escuro: mantém a paleta, ganha as mesmas formas/sombras ---- */
body.escuro .aba{ background:rgba(22,39,61,.9); color:#e9edf4; border:1px solid #26364e; }
body.escuro .aba .abicon{ color:#e9edf4; }
body.escuro .aba[aria-selected="true"]{ background:var(--amarelo); color:#0d1b2a; border-color:var(--amarelo); }
body.escuro .aba[aria-selected="true"] .abicon{ color:#0d1b2a; }
body.escuro .subtab{ background:rgba(22,39,61,.9); color:var(--tinta-fraca); border-color:#26364e; }
body.escuro .subtab[aria-selected="true"]{ background:var(--amarelo); color:#0d1b2a; border-color:var(--amarelo); }
body.escuro .kpi, body.escuro .card, body.escuro .acao{ box-shadow:0 8px 30px rgba(0,0,0,.30); }

/* ---- card premium de navegação ---- */
.navcard{ display:flex; align-items:center; gap:16px; min-height:110px; padding:24px; margin:20px 0;
  background:#fff; border-radius:28px; box-shadow:0 8px 30px rgba(15,23,42,.06);
  transition:transform .18s ease, box-shadow .18s ease; }
.navcard:active{ transform:scale(.98); box-shadow:0 4px 14px rgba(15,23,42,.05); }
.nc-ic-col{ width:90px; display:flex; justify-content:center; align-items:center; flex-shrink:0; }
.nc-ic{ width:64px; height:64px; border-radius:50%; background:#fff;
  box-shadow:0 8px 18px rgba(0,0,0,.06); display:flex; align-items:center; justify-content:center; }
.nc-div{ width:1px; height:56px; background:#ECECEC; flex-shrink:0; }
.nc-txt{ flex:1; min-width:0; }
.nc-tit{ font-size:17px; font-weight:700; color:#111827; line-height:1.25; }
.nc-desc{ font-size:14px; color:#6B7280; margin-top:4px; line-height:1.35;
  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.nc-arrow{ width:44px; height:44px; border-radius:50%; background:rgba(255,255,255,.72);
  backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px);
  box-shadow:0 10px 25px rgba(15,23,42,.08); display:flex; align-items:center; justify-content:center;
  flex-shrink:0; transition:transform .18s ease; border:1px solid rgba(0,0,0,.04); }
.navcard:active .nc-arrow{ transform:translateX(2px) rotate(6deg); }
body.escuro .navcard{ background:var(--branco); box-shadow:0 8px 30px rgba(0,0,0,.30); }
body.escuro .nc-ic{ background:#0f2035; box-shadow:0 8px 18px rgba(0,0,0,.35); }
body.escuro .nc-tit{ color:#e9edf4; }
body.escuro .nc-div{ background:#26364e; }
body.escuro .nc-arrow{ background:rgba(22,39,61,.6); border-color:rgba(255,255,255,.06); }

/* ---- empty state premium ---- */
.empty-premium{ text-align:center; padding:56px 24px; }
.ep-ic{ width:88px;height:88px;border-radius:50%;background:#fff;box-shadow:0 8px 30px rgba(15,23,42,.06);
  display:flex;align-items:center;justify-content:center;margin:0 auto 20px; }
.ep-tit{ font-size:19px;font-weight:700;color:#111827;margin-bottom:6px; }
.ep-desc{ font-size:14px;color:#6B7280;max-width:320px;margin:0 auto 16px;line-height:1.45; }
.ep-badge{ display:inline-block;font-size:12px;font-weight:600;color:#1E40AF;background:#EEF2FF;padding:6px 14px;border-radius:999px; }
body.escuro .ep-ic{ background:#0f2035;box-shadow:0 8px 30px rgba(0,0,0,.3); }
body.escuro .ep-tit{ color:#e9edf4; }
body.escuro .ep-badge{ background:rgba(30,64,175,.22); color:#9db4ff; }
.kpi .knum{ font-size:clamp(19px,4.5vw,26px); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }

/* ---- perfil ---- */
.perf-av{ width:88px;height:88px;border-radius:50%;background:#EEF2FF;display:flex;align-items:center;justify-content:center;margin:0 auto; }
body.escuro .perf-av{ background:rgba(30,64,175,.18); }
.perf-row{ display:flex;align-items:center;gap:14px;padding:15px 18px;cursor:pointer;font-size:15px;color:var(--tinta);border-bottom:1px solid var(--linha); }
.perf-row:last-child{ border-bottom:none; }
.perf-row b{ flex:1;font-weight:500; }
.perf-row:active{ background:rgba(0,0,0,.03); }
.perf-sair b{ color:#E53935; }

/* ---- menu inferior (mobile) + FAB ---- */
.botnav{ display:none; }
.fab-backdrop{ display:none; position:fixed; inset:0; background:rgba(15,23,42,.45); z-index:9500; }
.fab-sheet{ position:fixed; left:0; right:0; bottom:-110%; z-index:9600; background:#fff;
  border-radius:26px 26px 0 0; padding:18px 20px calc(24px + env(safe-area-inset-bottom,0));
  box-shadow:0 -10px 40px rgba(15,23,42,.16); transition:bottom .3s cubic-bezier(.4,0,.2,1); }
body.escuro .fab-sheet{ background:#16273d; }
body.fab-open .fab-backdrop{ display:block; }
body.fab-open .fab-sheet{ bottom:0; }
.fab-handle{ width:42px;height:4px;border-radius:4px;background:#d5dbe3;margin:0 auto 14px; }
.fab-title{ font-size:17px;font-weight:700;margin-bottom:16px;color:#111827; }
body.escuro .fab-title{ color:#e9edf4; }
.fab-grid{ display:grid;grid-template-columns:repeat(3,1fr);gap:16px; }
.fab-act{ background:none;border:none;display:flex;flex-direction:column;align-items:center;gap:8px;font-size:12px;font-weight:600;color:#374151;cursor:pointer; }
body.escuro .fab-act{ color:#c9d4e3; }
.fab-act .fa-ic{ width:54px;height:54px;border-radius:16px;display:flex;align-items:center;justify-content:center;box-shadow:0 6px 16px rgba(15,23,42,.12); }
@media(max-width:767px){
  .botnav{ display:flex; position:fixed;left:0;right:0;bottom:0;z-index:9000;
    background:rgba(255,255,255,.92);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);
    border-top:1px solid #ECECEC;padding:7px 6px calc(7px + env(safe-area-inset-bottom,0));
    justify-content:space-around;align-items:center; }
  body.escuro .botnav{ background:rgba(13,26,42,.94);border-top-color:#22364e; }
  #tela{ padding-bottom:92px !important; }
  .bn-item{ background:none;border:none;display:flex;flex-direction:column;align-items:center;gap:3px;
    font-size:11px;font-weight:600;color:#9aa4b2;cursor:pointer;flex:1;padding:2px; }
  .bn-item .bn-ic{ color:#9aa4b2;display:flex; }
  .bn-item.on,.bn-item.on .bn-ic{ color:#1E40AF; }
  body.escuro .bn-item.on,body.escuro .bn-item.on .bn-ic{ color:#FFC107; }
  .bn-fab{ width:56px;height:56px;border-radius:50%;background:#1E40AF;border:none;color:#fff;
    display:flex;align-items:center;justify-content:center;margin-top:-26px;
    box-shadow:0 8px 22px rgba(30,64,175,.42);cursor:pointer;flex-shrink:0; }
  .bn-fab:active{ transform:scale(.94); }
}
.busca-btn{ background:transparent;border:1px solid rgba(255,255,255,.28);color:#fff;border-radius:9px;width:38px;height:38px;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;transition:background .15s; }
.busca-btn:hover{ background:rgba(255,255,255,.12); }
.busca-modal{ display:none;position:fixed;inset:0;z-index:9700;background:rgba(15,23,42,.5);backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px);padding-top:12vh; }
body.busca-open .busca-modal{ display:block; }
.busca-box{ width:92%;max-width:600px;margin:0 auto;background:#fff;border-radius:20px;overflow:hidden;box-shadow:0 24px 60px rgba(15,23,42,.35); }
body.escuro .busca-box{ background:#16273d; }
.busca-top{ display:flex;align-items:center;gap:10px;padding:14px 16px;border-bottom:1px solid var(--linha); }
.busca-top input{ flex:1;border:none;outline:none;background:transparent;font-size:16px;color:var(--tinta);font-family:inherit; }
.busca-esc{ background:var(--papel);border:1px solid var(--linha);border-radius:7px;padding:3px 8px;font-size:11px;color:var(--tinta-fraca);cursor:pointer; }
.busca-res{ max-height:56vh;overflow-y:auto;padding:8px; }
.busca-hint{ padding:24px 16px;text-align:center;color:var(--tinta-fraca);font-size:14px; }
.busca-row{ display:flex;align-items:center;gap:12px;padding:12px;border-radius:12px;cursor:pointer; }
.busca-row:hover{ background:var(--papel); }
.busca-row .br-ic{ width:36px;height:36px;border-radius:10px;background:#EEF2FF;display:flex;align-items:center;justify-content:center;flex-shrink:0; }
body.escuro .busca-row .br-ic{ background:rgba(30,64,175,.18); }
.busca-row .br-main{ flex:1;min-width:0; }
.busca-row .br-main b{ display:block;font-size:14px;font-weight:600;color:var(--tinta);white-space:nowrap;overflow:hidden;text-overflow:ellipsis; }
.busca-row .br-main span{ font-size:12px;color:var(--tinta-fraca); }
.sub-side{ display:none; }
.side-foot{ display:none; }
@media(min-width:900px){
  body.logado #abas .sub-side{ display:flex;flex-direction:column;gap:1px;margin:1px 0 8px 12px;padding-left:12px;border-left:2px solid rgba(255,255,255,.08); }
  body.logado #abas .sub-aba{ text-align:left;background:transparent;border:none;color:#8b9bb3;font-size:13px;font-weight:500;padding:7px 10px;border-radius:7px;cursor:pointer;font-family:"Inter",sans-serif; }
  body.logado #abas .sub-aba:hover{ background:rgba(255,255,255,.06);color:#fff; }
  body.logado #abas .sub-aba[aria-selected="true"]{ color:#fff;background:rgba(255,255,255,.10);font-weight:600; }
  body.logado #abas .side-foot{ display:block;margin-top:auto;padding-top:14px; }
  body.logado #abas .side-nova{ width:100%;display:flex;align-items:center;justify-content:center;gap:8px;background:#1E40AF;color:#fff;border:none;border-radius:10px;padding:11px;font-size:14px;font-weight:600;cursor:pointer;font-family:"Inter",sans-serif; }
  body.logado #abas .side-nova:hover{ background:#1b3a9e; }
  body.logado #tela > .subnav{ display:none; }
}

/* ============================================================================
   v20.2.2 — Barra superior no celular: impedir estouro horizontal.
   Apenas visual/responsivo. Nenhum controle é removido (sino, busca, tema,
   Sair permanecem). O logo continua identificando o topo.
   ============================================================================ */
html,body{ overflow-x:hidden; }
@media(max-width:560px){
  .topo{ gap:8px; padding-left:12px; padding-right:12px; }
  .topo .marca{ gap:8px; min-width:0; }
  .topo .marca .modulo{ display:none; }
  .topo .eu{ gap:6px; min-width:0; }
  .topo .eu > div{ max-width:96px; }
  .topo .eu b{ overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
  .topo .tema-btn, .topo .busca-btn{ width:34px; height:34px; flex-shrink:0; }
  .topo .sair{ padding:6px 9px; font-size:12px; flex-shrink:0; white-space:nowrap; }
}
@media(max-width:380px){
  .topo .eu > div{ display:none; }   /* nos aparelhos mais estreitos, prioriza os botões */
}

/* ============================================================================
   v20.2.3 — No celular (onde já existe o menu inferior), removemos a barra
   de abas do topo que rolava para o lado. Nada de navegação é perdido:
   • menu inferior: Início / Almox. / (+) / Compras / Perfil
   • botão ⊞ no topo abre "Buscar ou navegar" com "Ir para…" TODOS os módulos
   Mantida no tablet (768–899px) e como barra lateral no desktop (≥900px).
   ============================================================================ */
@media(max-width:767px){
  body.logado .abas{ display:none; }
}