/* [LAYOUT-SIDEBAR-V1C] cabeçalho único congelado: a faixa do módulo vira o próprio cabeçalho fixo (22/10/2026)
   Como "congelar painéis" do Excel: menu à esquerda e cabeçalho do módulo em cima ficam parados; só o conteúdo rola. */
:root { --lx-hb-h: 104px; } /* [LAYOUT-SIDEBAR-V1E] até o campo de busca do menu; era 88px (V1D) e 76px (V1C) */
.lx-hb { height:var(--lx-hb-h) !important; padding:0 20px 0 22px !important; border-bottom:0 !important; gap:16px !important;
  background:linear-gradient(115deg,#1B1A3F 0%,#2E2B6B 60%,#4F46E5 130%) !important; color:#fff;
  box-shadow:0 1px 0 rgba(255,255,255,.06) inset, 0 6px 18px rgba(30,27,75,.18); }
html[data-tema="escuro"] .lx-hb { background:linear-gradient(115deg,#15142F 0%,#2A2763 60%,#4F46E5 135%) !important; box-shadow:0 6px 18px rgba(0,0,0,.35); }
.lx-hb::after { content:''; position:absolute; inset:0; pointer-events:none; background:repeating-radial-gradient(circle at 108% 50%, transparent 0 18px, rgba(255,255,255,.07) 18px 19px); }
.lx-hb > * { position:relative; z-index:1; }
.lx-hb-esq { flex:1 1 0 !important; min-width:0; gap:12px !important; }

/* módulo dentro do cabeçalho */
.lx-hb #lx-faixa { display:none !important; margin:0 !important; padding:0 !important; min-height:0 !important; background:none !important; border-radius:0 !important; gap:12px !important; min-width:0; flex:1 1 auto; box-shadow:none !important; }
.lx-hb #lx-faixa::after { display:none !important; }
html.lx-on .lx-hb #lx-faixa.on { display:flex !important; align-items:center; }
.lx-hb .lx-fx-ico { width:50px !important; height:50px !important; border-radius:14px !important; }
.lx-hb .lx-fx-ico svg { width:26px !important; height:26px !important; }
.lx-hb .lx-fx-k { font-size:11px !important; letter-spacing:2px !important; margin-bottom:2px !important; }
.lx-hb .lx-fx-t { font-size:25px !important; line-height:1.1 !important; letter-spacing:-.4px !important; font-weight:700 !important; }
.lx-hb .lx-fx-s { font-size:13px !important; margin-top:3px !important; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; opacity:.88 !important; }
.lx-hb .lx-fx-tx { min-width:0; }

/* controles do cabeçalho sobre o índigo */
.lx-hb .lx-chip { background:rgba(255,255,255,.14) !important; border-color:rgba(255,255,255,.22) !important; color:rgba(255,255,255,.85) !important; flex-shrink:0; }
.lx-hb .lx-chip b { color:#fff !important; }
.lx-hb .tema-sw { background:rgba(255,255,255,.14) !important; border-color:rgba(255,255,255,.22) !important; }
.lx-hb .tema-sw button { color:rgba(255,255,255,.8) !important; }
.lx-hb .tema-sw button:hover { color:#fff !important; }
.lx-hb .tema-sw button[aria-pressed="true"] { background:#fff !important; color:#4338CA !important; }
.lx-hb .lx-user { background:rgba(255,255,255,.14) !important; border-color:rgba(255,255,255,.22) !important; }
.lx-hb .lx-user .topbar-user { color:#fff !important; }
.lx-hb .lx-av { background:#fff !important; color:#4338CA !important; }
.lx-hb .topbar-role { background:#fff !important; color:#4338CA !important; }
.lx-hb .topbar-right .btn, .lx-hb .topbar-right .btn-gray { background:rgba(255,255,255,.14) !important; border:1px solid rgba(255,255,255,.22) !important; color:#fff !important; }
.lx-hb .topbar-right .btn:hover { background:rgba(255,255,255,.24) !important; }
.lx-hb .topbar-right [id*="wa"], .lx-hb .topbar-right [class*="wa-"] { color:#fff !important; }
.lx-hb .pendencias-badge { background:rgba(255,255,255,.18) !important; color:#fff !important; border-color:rgba(255,255,255,.3) !important; }
.lx-hb .lx-burger { background:rgba(255,255,255,.14) !important; border-color:rgba(255,255,255,.22) !important; color:#fff !important; }
.lx-hb .topbar-right { flex:0 0 auto !important; width:auto !important; margin-left:auto; }

/* a faixa solta (V1A) não aparece mais no conteúdo */
html.lx-on #screen-app.active > #lx-faixa { display:none !important; }

@media (max-width: 1280px) { .lx-hb .lx-fx-s { display:none; } }
@media (max-width: 900px) {
  :root { --lx-hb-h: 64px; }
  .lx-hb { padding:0 10px !important; gap:8px !important; }
  .lx-hb .lx-fx-ico { width:38px !important; height:38px !important; border-radius:11px !important; }
  .lx-hb .lx-fx-ico svg { width:18px !important; height:18px !important; }
  .lx-hb .lx-fx-k { display:none; }
  .lx-hb .lx-fx-t { font-size:18px !important; }
}
.lx-hb .lx-burger { flex-shrink:0 !important; }
@media (max-width: 520px) {
  .lx-hb .lx-fx-ico, .lx-hb .lx-user { display:none !important; }
  .lx-hb .lx-fx-t { font-size:17px !important; }
  .lx-hb #lx-faixa { min-width:60px; }
}
