/* ============================================================================
   MODULO 08/8 - app/08-patches-finais.css (ex-app.css linhas 15274-15426). Patches finais change-once: consolidacao da casca, densidade, escala 90/110, speed-dial, responsividade global - VENCEM POR ORDEM, manter por ultimo. A ORDEM DE INCLUSAO 01->08 E CRITICA - nao reordenar.
   ============================================================================ */
/* ===================================================================
   CONSOLIDAÇÃO DA CASCA (change-once) — ponto 2 do ajuste de layout.
   A dívida do app.css deixou .topbar com 3 min-heights conflitantes
   (104 → 88 → 72px, a última vencia) e .sidebar-header em 96px, então
   o botão « e o cabeçalho ficavam em linhas de altura diferentes.
   Fonte ÚNICA de altura via --bm-header-h → topo contínuo e « alinhado.
   Vale nos dois temas (não toca em cor). Última no arquivo = vence por ordem.
   =================================================================== */
:root { --bm-header-h: 54px; }
.sidebar-header { height: var(--bm-header-h) !important; }
.sidebar-scroll { height: calc(100vh - var(--bm-header-h)) !important; }
.topbar, .content > .topbar { min-height: var(--bm-header-h) !important; align-items: center !important; }
.content { scroll-padding-top: calc(var(--bm-header-h) + 28px) !important; }

/* #4 — menu recolhido mantém EXATAMENTE a mesma altura de header (não pula p/ 96px),
   em linha única centrada: o topo do menu segue alinhado ao topbar ao recolher/expandir. */
body.sidebar-collapsed .sidebar-header,
.menu-toggle-check:checked ~ .layout .sidebar-header {
	height: var(--bm-header-h) !important;
	flex-direction: row !important;
	padding: 0 !important;
	gap: 0 !important;
	align-items: center !important;
	justify-content: center !important;
}
body.sidebar-collapsed .sidebar-scroll,
.menu-toggle-check:checked ~ .layout .sidebar-scroll {
	height: calc(100vh - var(--bm-header-h)) !important;
}
body.sidebar-collapsed .tenant-icon-collapsed,
body.sidebar-collapsed .tenant-icon-fallback-collapsed {
	width: 30px !important; height: 30px !important;
	max-width: 30px !important; max-height: 30px !important; min-width: 30px !important;
}

/* ===== Densidade base (change-once) — reduz o espaço vertical p/ caber mais sem depender de zoom do navegador (ver análise scroll/zoom) ===== */
.topbar { margin-bottom: 12px !important; }
.content { padding-top: 0 !important; }
.bm-datatable .ui-datatable-data > tr > td, .ui-datatable tbody td { padding-top: 12px !important; padding-bottom: 12px !important; }
.bm-datatable thead th, .ui-datatable thead th { padding-top: 12px !important; padding-bottom: 12px !important; }
.bm-card, .card, .bm-filter-card { padding: 16px !important; }
.bm-card, .bm-filter-card { margin-bottom: 16px !important; }
.form-header { margin-bottom: 14px !important; }
.form-grid, .form-grid-modern { gap: 14px !important; }

/* ===== Escala da área de trabalho por usuário (90/100/110%) — só o .content escala; o menu permanece.
   `zoom` escala px inclusive (o CSS é quase todo px) sem quebrar sticky/scroll do topbar interno. ===== */
/* Escala aplicada SÓ no .content (comportamento original, comprovadamente sem quebrar
   position:fixed da FAB/overlays nem gerar scroll). O 80% "compacto" fica disponível.
   (Escalar o menu junto exige NÃO usar zoom no ancestral da FAB — fica p/ ajuste dedicado.) */
/* Escala ÚNICA do sistema: zoom no .layout (topbar + menu + conteúdo juntos, mesma proporção),
   com ALTURA COMPENSADA (100vh/escala) → o shell renderiza exatamente 100vh, SEM faixa vazia no
   rodapé. A FAB fica fora do .layout (filha do body) → continua flutuando fixa no canto. */
body.app-body.bm-scale-80  .layout { zoom: 0.80; height: calc((100vh - var(--bm-impers-h, 0px)) / 0.80); }
body.app-body.bm-scale-90  .layout { zoom: 0.90; height: calc((100vh - var(--bm-impers-h, 0px)) / 0.90); }
body.app-body.bm-scale-100 .layout { zoom: 1;    height: calc(100vh - var(--bm-impers-h, 0px)); }
body.app-body.bm-scale-110 .layout { zoom: 1.10; height: calc((100vh - var(--bm-impers-h, 0px)) / 1.10); }
/* .content e .sidebar preenchem o .layout (que agora tem altura compensada), não 100vh fixo. */
body.app-body.bm-scale-80 .content,  body.app-body.bm-scale-80 .sidebar,
body.app-body.bm-scale-90 .content,  body.app-body.bm-scale-90 .sidebar,
body.app-body.bm-scale-110 .content, body.app-body.bm-scale-110 .sidebar { height: 100% !important; }
/* Menu preenche a altura compensada: sidebar = flex-column, área de scroll cresce (não usa 100vh fixo,
   senão o menu para em 100vh e sobra vão abaixo dele quando a altura está compensada). */
body.app-body.bm-scale-80 .sidebar, body.app-body.bm-scale-90 .sidebar, body.app-body.bm-scale-110 .sidebar { display: flex !important; flex-direction: column !important; }
body.app-body.bm-scale-80 .sidebar-scroll, body.app-body.bm-scale-90 .sidebar-scroll, body.app-body.bm-scale-110 .sidebar-scroll { flex: 1 1 auto !important; height: auto !important; min-height: 0 !important; }
/* Overlays body-level (Ctrl+K / busca de atalho) acompanham a escala — ficam fora do .layout, então precisam do zoom próprio. */
/* Só o command palette (#bmCmdk, modal centralizado) escala — zoom em dropdowns/panels ancorados
   do PrimeFaces QUEBRA o posicionamento (PF calcula top/left sem zoom → abre deslocado/na lateral).
   Então overlays ancorados ficam em tamanho nativo (posição correta) — trade-off consciente. */
body.app-body.bm-scale-80  #bmCmdk, body.app-body.bm-scale-80  .ui-dialog.bm-copiloto-dialog { zoom: 0.80; }
body.app-body.bm-scale-90  #bmCmdk, body.app-body.bm-scale-90  .ui-dialog.bm-copiloto-dialog { zoom: 0.90; }
body.app-body.bm-scale-110 #bmCmdk, body.app-body.bm-scale-110 .ui-dialog.bm-copiloto-dialog { zoom: 1.10; }
/* Copiloto (fixo no canto, right:24/bottom:160) escala junto: não é dropdown ancorado, então zoom é seguro. */

/* #4 — botão recolher menu vive no topbar, à esquerda do título/breadcrumb, na mesma linha */
.page-heading { display: flex !important; flex-direction: row !important; align-items: center !important; gap: 12px; }
.bm-topbar-collapse { flex: 0 0 auto; align-self: center; }
/* Título + breadcrumb na MESMA linha (economiza altura; ex.: "Início · Cockpit › Início") */
.page-title-row > div { display: flex !important; flex-direction: row !important; align-items: baseline; gap: 8px; flex-wrap: wrap; }
.page-title-row .breadcrumb-text { margin-top: 0 !important; }
.page-title-row .breadcrumb-text::before { content: "·"; margin-right: 6px; opacity: .5; }
.topbar { padding-top: 6px !important; padding-bottom: 6px !important; }

/* #4 — cronômetro rodando: botão pulsa em vermelho pra sinalizar timer ativo */
.bm-timer-on.ui-button { background: var(--bm-danger, #D64545) !important; border-color: var(--bm-danger, #D64545) !important; animation: bmTimerPulse 1.6s ease-in-out infinite; }
@keyframes bmTimerPulse { 0%,100% { box-shadow: 0 0 0 0 rgba(214,69,69,.5); } 50% { box-shadow: 0 0 0 6px rgba(214,69,69,0); } }

/* ===== #2 — Speed-dial de ações rápidas (canto inferior direito): 1 ponto p/ nova demanda, cronômetro, atendimento, copiloto ===== */
.bm-speeddial { position: fixed; right: 24px; bottom: 24px; z-index: 9998; }
.bm-sd-backdrop { position: fixed; inset: 0; z-index: -1; display: none; }
.bm-speeddial.open .bm-sd-backdrop { display: block; }
.bm-sd-main { position: relative; width: 56px; height: 56px; border-radius: 50%; border: none; cursor: pointer;
	background: var(--bm-action); color: #fff; box-shadow: 0 6px 18px rgba(38,50,122,.32);
	display: flex; align-items: center; justify-content: center; font-size: 22px; transition: transform .2s, background .2s, filter .2s; }
.bm-sd-main:hover { filter: brightness(1.07); }
.bm-speeddial.open .bm-sd-main { background: var(--bm-primary); }
.bm-sd-mainico { transition: transform .2s; }
.bm-speeddial.open .bm-sd-mainico { transform: rotate(45deg); }
.bm-sd-items { position: absolute; right: 4px; bottom: 68px; display: flex; flex-direction: column; align-items: flex-end; gap: 12px;
	opacity: 0; pointer-events: none; transform: translateY(10px); transition: opacity .18s ease, transform .18s ease; }
.bm-speeddial.open .bm-sd-items { opacity: 1; pointer-events: auto; transform: translateY(0); }
.bm-sd-item { display: inline-flex; align-items: center; gap: 10px; border: none; background: transparent; cursor: pointer; padding: 0; }
.bm-sd-lbl { background: var(--bm-surface); color: var(--bm-text); font-size: 13px; font-weight: 600; padding: 6px 12px; border-radius: 8px;
	box-shadow: 0 2px 10px rgba(15,23,42,.12); white-space: nowrap; border: 1px solid var(--bm-border); }
.bm-sd-ic { width: 46px; height: 46px; border-radius: 50%; background: var(--bm-action); color: #fff;
	display: inline-flex; align-items: center; justify-content: center; font-size: 18px; box-shadow: 0 4px 12px rgba(38,50,122,.28); }
.bm-sd-cop .bm-sd-ic { background: linear-gradient(135deg, var(--bm-copiloto,#8b5cf6), var(--bm-copiloto-2,#6d28d9)); }
.bm-sd-item.bm-timer-on .bm-sd-ic { background: var(--bm-danger,#D64545); animation: bmTimerPulse 1.6s ease-in-out infinite; }
/* Cronômetro rodando: ponto vermelho pulsante no FAB principal (visível sem abrir o speed-dial) */
.bm-sd-main.sd-running::after { content:''; position:absolute; top:4px; right:4px; width:13px; height:13px; border-radius:50%;
	background: var(--bm-danger,#D64545); border:2px solid #fff; animation: bmTimerPulse 1.6s ease-in-out infinite; }

/* Login — faixa de "pills" (amplitude da plataforma) sobre o fundo escuro da hero */
.login-pills { display:flex; flex-wrap:wrap; gap:8px; margin-top:24px; }
.login-pills span { font-size:11.5px; font-weight:500; color:#e3e6ff; background:rgba(255,255,255,.08);
	border:1px solid rgba(255,255,255,.18); border-radius:999px; padding:5px 12px; white-space:nowrap; }

/* =====================================================================
   RESPONSIVIDADE — CONSOLIDAÇÃO change-once (auditoria 2026-07-10).
   Aditivo e no FIM do arquivo → vence por ordem. Corrige, de uma vez,
   dezenas de telas que cortavam conteúdo em monitores baixos/estreitos.
   ===================================================================== */

/* (1) MAIOR RETORNO: toda tabela .bm-datatable rola na horizontal quando é mais larga
   que o card (antes só .bm-list-table rolava e .bm-table-card tinha overflow:hidden →
   colunas da direita, incl. Ações/menu, ficavam CLIPADAS sem scrollbar). O card mantém
   o border-radius (overflow:hidden) e a rolagem acontece dentro do wrapper interno. */
.bm-datatable .ui-datatable-tablewrapper,
.ui-datatable .ui-datatable-tablewrapper { overflow-x: auto !important; -webkit-overflow-scrolling: touch; }

/* (2) DIÁLOGOS: o PrimeFaces fixa width em px inline; sem teto global estouram em telas
   pequenas (mobile) e perdem titlebar/rodapé em telas baixas. Capa TODOS de uma vez. */
.ui-dialog { max-width: 96vw !important; max-height: 94vh !important; }
.ui-dialog .ui-dialog-content { max-height: calc(94vh - 62px) !important; overflow-x: auto; overflow-y: auto; }

/* (3) KPIs financeiros: regra antiga forçava 1 card/linha + 3ª trilha vazia (180px) em
   1280/1366/1024. Volta a compactar e herdar 2 colunas de conteúdo. */
@media (max-width: 1320px) {
	.finance-kpi-row { grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)) !important; }
	.finance-kpi-card { grid-template-columns: 42px 1fr !important; }
}

/* (4) Grid de formulário por dicionário: passo intermediário de 2 colunas no tablet
   (antes saltava de 3 direto p/ 1). */
@media (max-width: 1100px) { .bm-dyn-grid.bm-cols-3 { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; } }

/* (5) Grid do "peek" lateral (todas as listas) colapsa p/ 1 coluna no mobile. */
@media (max-width: 520px) { .bm-peek-grid { grid-template-columns: 1fr !important; } }

/* (6) Cinto de segurança global: nada deve gerar rolagem HORIZONTAL da página. */
@media (max-width: 900px) {
	.content, .bm-list-shell, .form-shell { max-width: 100%; overflow-x: hidden; }
}

/* Marcador discreto: valor de relacao que aponta p/ registro na lixeira (soft-delete) — icone esmaecido + tooltip. */
.bm-lixeira-ico { color: var(--bm-muted); opacity: .55; font-size: .8em; margin-left: 5px; vertical-align: baseline; cursor: help; }

/* Hint discreto no FORM: campo de relação cujo valor está na lixeira (soft-deleted). */
.bm-field-lixeira { margin-top: 4px; font-size: 11px; font-weight: 600; color: #b45309; display: inline-flex; align-items: center; gap: 5px; }
.bm-field-lixeira i { font-size: 11px; opacity: .8; }

/* ============================================================
   AJUDA DAS TELAS v2 (dlgAjudaContextual) — visual Tenka.
   Documentação viva por tela: itens tipados + rede de telas conectadas.
   Sobrepõe o legado de 05-contratos (este arquivo carrega por último).
   ============================================================ */
.bm-help-dialog .ui-dialog-content { padding: 22px 24px !important; max-height: 72vh; overflow-y: auto; }
.bm-help-title { margin: 0 0 6px; font-size: 20px; font-weight: 500; color: var(--tenka-navy, #2B2F6E); }
.bm-help-description { color: var(--bm-muted, #64748b); margin: 0 0 18px; line-height: 1.55; }

.bm-help-item { border: 1px solid #E3E5EC; border-left: 3px solid var(--tenka-indigo, #4650D4); border-radius: 12px; padding: 14px 16px; margin-bottom: 10px; background: #fff; }
.bm-help-item h3 { margin: 2px 0 6px; font-size: 14.5px; font-weight: 500; color: var(--bm-text, #0f172a); }
.bm-help-item-body { color: #3f4658; font-size: 13.5px; line-height: 1.6; }
.bm-help-item-body img { max-width: 100%; border: 1px solid #E3E5EC; border-radius: 10px; margin: 8px 0; display: block; }
.bm-help-item-body ul, .bm-help-item-body ol { padding-left: 20px; margin: 6px 0; }
.bm-help-item-type { display: inline-flex; align-items: center; gap: 6px; font-size: 11px; font-weight: 500; color: var(--tenka-indigo, #4650D4); letter-spacing: .02em; margin-bottom: 4px; }
/* acentos por tipo: alerta = âmbar; regra = navy (cor nunca é indicador único — ícone acompanha) */
.bm-help-item-alerta { border-left-color: #B7791F; }
.bm-help-item-alerta .bm-help-item-type { color: #B7791F; }
.bm-help-item-regra { border-left-color: var(--tenka-navy, #2B2F6E); }
.bm-help-item-regra .bm-help-item-type { color: var(--tenka-navy, #2B2F6E); }

/* Rede de telas conectadas: cards clicáveis que navegam pro fluxo vizinho */
.bm-help-conn-head { display: flex; align-items: center; gap: 8px; font-weight: 500; color: var(--tenka-navy, #2B2F6E); margin: 18px 0 10px; font-size: 14px; }
.bm-help-conn-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 10px; }
.bm-help-conn-card { display: flex; flex-direction: column; gap: 3px; border: 1px solid #E3E5EC; border-radius: 12px; padding: 12px 14px; background: #fff; text-decoration: none !important; transition: border-color .15s, box-shadow .15s; }
.bm-help-conn-card:hover { border-color: var(--tenka-indigo, #4650D4); box-shadow: 0 2px 10px rgba(70, 80, 212, .10); }
.bm-help-conn-rel { font-size: 11px; color: var(--bm-muted, #64748b); }
.bm-help-conn-nome { font-size: 13.5px; font-weight: 500; color: var(--tenka-indigo, #4650D4); display: flex; align-items: center; gap: 7px; }
.bm-help-conn-desc { font-size: 12px; color: #3f4658; line-height: 1.45; margin-top: 2px; }

.bm-help-empty { display: flex; align-items: center; gap: 12px; color: var(--bm-muted, #64748b); background: #F7F8FC; border-radius: 12px; padding: 16px 18px; }
.bm-help-actions { display: flex; gap: 10px; justify-content: flex-end; flex-wrap: wrap; margin-top: 14px; }

/* tema escuro */
.theme-dark .bm-help-item, .theme-dark .bm-help-conn-card { background: #171b2e; border-color: #2a3050; }
.theme-dark .bm-help-item h3 { color: #e2e8f0; }
.theme-dark .bm-help-item-body { color: #b6bdd1; }
.theme-dark .bm-help-empty { background: #171b2e; color: #94a3b8; }
.theme-dark .bm-help-title { color: #c7ccf4; }

/* ============================================================
   SSO corporativo no login (Google/Microsoft) — botões secundários abaixo do "Entrar".
   ============================================================ */
.login-sso { margin-top: 18px; }
.login-sso-sep { display: flex; align-items: center; gap: 12px; color: var(--bm-muted, #94a3b8); font-size: 12px; margin-bottom: 12px; }
.login-sso-sep::before, .login-sso-sep::after { content: ""; flex: 1; height: 1px; background: var(--bm-border, #E3E5EC); }
.login-sso-btns { display: flex; gap: 10px; }
.login-sso-btn { flex: 1; display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  height: 44px; border: 1px solid var(--bm-border, #E3E5EC); border-radius: 10px; background: #fff;
  color: var(--bm-text, #0f172a); font-size: 14px; font-weight: 500; text-decoration: none;
  transition: border-color .15s, box-shadow .15s, background .15s; }
.login-sso-btn:hover { border-color: var(--tenka-indigo, #4650D4); box-shadow: 0 2px 10px rgba(70,80,212,.10); text-decoration: none; }
.login-sso-btn i { font-size: 16px; }
.app-body.theme-dark .login-sso-btn, .theme-dark .login-sso-btn { background: #171b2e; color: #e2e8f0; border-color: #2a3050; }

/* ============================================================
   MOBILE (<=768): menu lateral vira GAVETA (off-canvas) em vez de empilhar o menu inteiro no topo.
   Some por padrao; o hamburguer (bmToggleSidebar) abre por cima do conteudo, com backdrop.
   So vale <=768 -> desktop intocado. Carrega por ultimo -> vence o bloco antigo do 02-base.
   ============================================================ */
@media (max-width: 768px) {
	.layout { display: block; }
	.sidebar {
		position: fixed !important; top: 0; left: 0;
		width: 86% !important; max-width: 320px !important; min-width: 0 !important;
		height: 100vh !important; min-height: 100vh;
		transform: translateX(-100%);
		transition: transform .25s ease;
		z-index: 1000; box-shadow: 0 10px 40px rgba(15,23,42,.28);
	}
	body.sidebar-mobile-open .sidebar { transform: translateX(0); }
	.sidebar-scroll { height: calc(100vh - 86px) !important; max-height: none !important; }
	.content { width: 100%; min-height: auto; padding: 14px; }
	.bm-sidebar-backdrop { display: none; }
	body.sidebar-mobile-open .bm-sidebar-backdrop {
		display: block; position: fixed; inset: 0; background: rgba(15,23,42,.45); z-index: 999;
	}
}