/* ============================================================
   Brasgelo Intranet — folha de plataforma (uma so).
   Tokens do prototipo, shell, Bootstrap derivado dos tokens,
   componentes de CRM (.crm-visual) e Pessoas (.pessoas-visual).
   Norma: intra-vault/10 plataforma/50 Padrões/10 a-regra-da-tela.md
   Fontes: SIL OFL, servidas em static/fontes/ (so latim).

   2026-10-05 -- #tblBlocosAvulso .row-bloco-inutil (numeracao id_lote=-1).

   2026-10-01 -- quatro entradas, todas da campanha de revisao das UIs a
   norma (nenhuma regra nova, nenhum token novo):
     * .painel-filtro-grupo.alinhado -- rotulo em coluna fixa, para a borda
       esquerda dos campos do filtro parar de serrilhar;
     * .chip-x -- o X do chip de filtro (hoje a rota, na Carteira) vinha de
       style inline no JS, que a regra 1 so admite com valor dado;
     * #tblConc linha conciliada -- ganhou hover e selecionado, para a marca
       de selecao nao sumir no verde (regra 11); o outline .row-sel saiu,
       porque a conciliacao passou a usar .row-selected da norma;
     * #tblCart .cel-vcto-atraso -- #fff virou var(--bs-white) (regra 1: sem
       hexadecimal fora dos tokens).
   ============================================================ */

@font-face {
  font-family: "Bricolage Grotesque";
  font-style: normal;
  font-weight: 600 800;
  font-stretch: 100%;
  font-display: swap;
  src: url("../fontes/bricolage-grotesque-600-800.woff2") format("woff2");
}
@font-face {
  font-family: "IBM Plex Mono";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../fontes/ibm-plex-mono-400.woff2") format("woff2");
}
@font-face {
  font-family: "IBM Plex Mono";
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("../fontes/ibm-plex-mono-500.woff2") format("woff2");
}
@font-face {
  font-family: "IBM Plex Mono";
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("../fontes/ibm-plex-mono-600.woff2") format("woff2");
}
@font-face {
  font-family: "IBM Plex Sans";
  font-style: normal;
  font-weight: 400 700;
  font-stretch: 100%;
  font-display: swap;
  src: url("../fontes/ibm-plex-sans-400-700.woff2") format("woff2");
}

/* ============================================================
   Brasgelo Intranet - shell (topbar + sidebar)
   Tokens claro/escuro: intra-vault/10 plataforma/50 Padrões/ui-tema-escuro.md
   ============================================================ */

:root {
  /* Papel do legado (fr3): as mesmas nos dois temas -- papel e sempre branco */
  --papel-linha: #cccccc;     /* Frame.Color 13421772 das linhas do rel. 103 */
  --papel-linha-2: #d8d8d8;   /* Frame.Color 14211288: Line5 (cabecalho) e Line10 (item) */
  /* Superficie e tinta (claro) */
  --bg: #e9eef2;
  --surface: #fbfcfd;
  --surface-2: #f2f5f8;
  --ink: #101820;
  --ink-2: #47555f;
  --ink-3: #6d7b86;
  --line: #d8e0e7;
  --line-2: #c3ced8;
  --accent: #14506b;
  --accent-soft: #dbe9f0;

  /* Estado — fixos */
  --good: #0ca30c;
  --warning: #fab219;
  --serious: #ec835a;
  --critical: #d03b3b;

  /* Series de grafico (claro) */
  --chart-1: #2a78d6;
  --chart-2: #eb6834;
  --chart-3: #1baf7a;
  --chart-4: #eda100;
  --chart-5: #e87ba4;
  --chart-6: #008300;
  --chart-7: #7a5af8;

  /* Shell legado — convivem com os tokens acima */
  --brasgelo-blue: #0d47a1;
  --brasgelo-light: #e3f2fd;
  --brasgelo-dark: #1a237e;
  --bg-side: #0d1b2a;
  --bg-side-2: #12263a;
  --bg-side-text: #edf2f6;
  --bg-side-muted: #b0bec8;
  --bg-accent: #64b5f6;
  --bg-accent-soft: rgba(100, 181, 246, 0.28);
  --bg-side-w: 248px;
  --bg-side-w-collapsed: 64px;
  --bg-top-h: 58px;

  /* Topbar claro: degradê azul */
  --bg-topbar-bg: linear-gradient(180deg, var(--brasgelo-blue) 0%, var(--brasgelo-dark) 100%);
  --bg-topbar-fg: #fff;
  --bg-topbar-border: rgba(255, 255, 255, 0.06);
  --bg-topbar-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
  --bg-user-bg: rgba(255, 255, 255, 0.08);
  --bg-user-border: rgba(255, 255, 255, 0.1);
  --bg-user-hover: rgba(255, 255, 255, 0.14);
  --bg-side-border: rgba(255, 255, 255, 0.05);
  --bg-nav-hover: rgba(255, 255, 255, 0.1);

  /* Bootstrap 5.3 le estes nomes. --bs-body-bg e --surface (controle, modal,
     dropdown): o body ja pinta --bg, e .form-control usa --bs-body-bg.
     .btn-primary do CSS compilado nao le --bs-primary (fica #0d6efd). */
  --bs-body-bg: var(--surface);
  --bs-body-bg-rgb: 251, 252, 253;
  --bs-body-color: var(--ink);
  --bs-body-color-rgb: 16, 24, 32;
  --bs-emphasis-color: var(--ink);
  --bs-emphasis-color-rgb: 16, 24, 32;
  --bs-secondary-color: var(--ink-2);
  --bs-tertiary-color: var(--ink-3);
  --bs-primary: var(--accent);
  --bs-primary-rgb: 20, 80, 107;
  --bs-border-color: var(--line);
  --bs-secondary-bg: var(--surface-2);
  --bs-secondary-bg-rgb: 242, 245, 248;
  --bs-tertiary-bg: var(--surface-2);
  --bs-tertiary-bg-rgb: 242, 245, 248;
  --bs-heading-color: var(--ink);
  --radius: 10px;

  /* Tipografia (D5, Anexo A.2): titulo, corpo, numero */
  --font-titulo: "Bricolage Grotesque", "IBM Plex Sans", sans-serif;
  --font-sans: "IBM Plex Sans", ui-sans-serif, system-ui, sans-serif;
  --font-mono: "IBM Plex Mono", ui-monospace, monospace;
}

/* Escuro via SO — so se o usuario nao forcou claro */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --bg: #0d1318;
    --surface: #161e25;
    --surface-2: #1c262e;
    --ink: #edf3f7;
    --ink-2: #a9b8c3;
    --ink-3: #8394a1;
    --line: #26323b;
    --line-2: #35444f;
    --accent: #6fb6d8;
    --accent-soft: #17303d;

    --chart-1: #3987e5;
    --chart-2: #d95926;
    --chart-3: #199e70;
    --chart-4: #c98500;
    --chart-5: #d55181;
    --chart-6: #008300;
    --chart-7: #7a5af8;

    --brasgelo-blue: #6fb6d8;
    --brasgelo-light: #17303d;
    --brasgelo-dark: #14506b;
    /* Sidebar um degrau acima do --bg (painel), nao fundida na pagina */
    --bg-side: #161e25;
    --bg-side-2: #1c262e;
    --bg-side-text: #edf3f7;
    --bg-side-muted: #a9b8c3;
    --bg-accent: #8ec8e4;
    --bg-accent-soft: rgba(111, 182, 216, 0.32);

    --bg-topbar-bg: var(--surface);
    --bg-topbar-fg: var(--ink);
    --bg-topbar-border: var(--line);
    --bg-topbar-shadow: none;
    --bg-user-bg: var(--surface-2);
    --bg-user-border: var(--line-2);
    --bg-user-hover: var(--accent-soft);
    --bg-side-border: #35444f;
    --bg-nav-hover: rgba(111, 182, 216, 0.16);

    --bs-body-bg: var(--surface);
    --bs-body-bg-rgb: 22, 30, 37;
    --bs-body-color: var(--ink);
    --bs-body-color-rgb: 237, 243, 247;
    --bs-emphasis-color: var(--ink);
    --bs-emphasis-color-rgb: 237, 243, 247;
    --bs-secondary-color: var(--ink-2);
    --bs-tertiary-color: var(--ink-3);
    --bs-primary: var(--accent);
    --bs-primary-rgb: 111, 182, 216;
    --bs-border-color: var(--line);
    --bs-secondary-bg: var(--surface-2);
    --bs-secondary-bg-rgb: 28, 38, 46;
    --bs-tertiary-bg: var(--surface-2);
    --bs-tertiary-bg-rgb: 28, 38, 46;
    --bs-heading-color: var(--ink);  }
}

/* Escuro explicito */
:root[data-theme="dark"] {
  --bg: #0d1318;
  --surface: #161e25;
  --surface-2: #1c262e;
  --ink: #edf3f7;
  --ink-2: #a9b8c3;
  --ink-3: #8394a1;
  --line: #26323b;
  --line-2: #35444f;
  --accent: #6fb6d8;
  --accent-soft: #17303d;

  --chart-1: #3987e5;
  --chart-2: #d95926;
  --chart-3: #199e70;
  --chart-4: #c98500;
  --chart-5: #d55181;
  --chart-6: #008300;
  --chart-7: #7a5af8;

  --brasgelo-blue: #6fb6d8;
  --brasgelo-light: #17303d;
  --brasgelo-dark: #14506b;
  --bg-side: #161e25;
  --bg-side-2: #1c262e;
  --bg-side-text: #edf3f7;
  --bg-side-muted: #a9b8c3;
  --bg-accent: #8ec8e4;
  --bg-accent-soft: rgba(111, 182, 216, 0.32);

  --bg-topbar-bg: var(--surface);
  --bg-topbar-fg: var(--ink);
  --bg-topbar-border: var(--line);
  --bg-topbar-shadow: none;
  --bg-user-bg: var(--surface-2);
  --bg-user-border: var(--line-2);
  --bg-user-hover: var(--accent-soft);
  --bg-side-border: #35444f;
  --bg-nav-hover: rgba(111, 182, 216, 0.16);

  --bs-body-bg: var(--surface);
  --bs-body-bg-rgb: 22, 30, 37;
  --bs-body-color: var(--ink);
  --bs-body-color-rgb: 237, 243, 247;
  --bs-emphasis-color: var(--ink);
  --bs-emphasis-color-rgb: 237, 243, 247;
  --bs-secondary-color: var(--ink-2);
  --bs-tertiary-color: var(--ink-3);
  --bs-primary: var(--accent);
  --bs-primary-rgb: 111, 182, 216;
  --bs-border-color: var(--line);
  --bs-secondary-bg: var(--surface-2);
  --bs-secondary-bg-rgb: 28, 38, 46;
  --bs-tertiary-bg: var(--surface-2);
  --bs-tertiary-bg-rgb: 28, 38, 46;
  --bs-heading-color: var(--ink);
}

body {
  background: var(--bg);
  color: var(--ink);
  font-family: var(--font-sans);
  margin: 0;
  min-height: 100vh;
}

.bg-num,
.num {
  font-family: var(--font-mono);
  font-variant-numeric: tabular-nums;
}

.card[id] { scroll-margin-top: calc(var(--bg-top-h) + 8px); }
.grade-num th.num,
.grade-num td.num,
.grade-num td.num .form-control { text-align: right; }

.campo-grade:not(:disabled) {
  background-color: color-mix(in srgb, var(--warning) 16%, var(--surface));
  border-color: color-mix(in srgb, var(--warning) 65%, var(--line-2));
  font-weight: 600;
}

:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    transition-duration: 0.01ms !important;
    animation-duration: 0.01ms !important;
  }
}

/* Topbar */
.bg-topbar {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  height: var(--bg-top-h);
  background: var(--bg-topbar-bg);
  color: var(--bg-topbar-fg);
  display: flex;
  align-items: center;
  gap: 0.65rem;
  padding: 0 1.1rem;
  z-index: 1030;
  border-bottom: 1px solid var(--bg-topbar-border);
  box-shadow: var(--bg-topbar-shadow);
}

.bg-brand {
  color: var(--bg-topbar-fg);
  text-decoration: none;
  font-weight: 700;
  letter-spacing: 1px;
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  min-width: 0;
}
.bg-brand:hover { color: var(--bg-topbar-fg); opacity: 0.95; }
.bg-brand small { font-weight: 500; letter-spacing: 0; }

.bg-toggle {
  background: none;
  border: 0;
  color: var(--bg-topbar-fg);
  font-size: 1.3rem;
  cursor: pointer;
  display: block;
  padding: 0.2rem 0.35rem;
  line-height: 1;
}
.bg-toggle .bi-layout-sidebar-inset,
html.bg-side-collapsed .bg-toggle .bi-list { display: none; }
html.bg-side-collapsed .bg-toggle .bi-layout-sidebar-inset { display: inline-block; }
html.filtro-memoria-restaurando { visibility: hidden; } /* regra 14: a tela padrão não pisca enquanto o base.html troca pelo último filtro */

.bg-user {
  background: var(--bg-user-bg);
  border: 1px solid var(--bg-user-border);
  color: var(--bg-topbar-fg);
  border-radius: 999px;
  padding: 0.35rem 0.85rem;
  font-weight: 500;
  font-size: 0.9rem;
}
.bg-user:hover,
.bg-user:focus {
  background: var(--bg-user-hover);
  color: var(--bg-topbar-fg);
}

.bg-tema-group .btn.active {
  background-color: var(--accent);
  border-color: var(--accent);
  color: #fff;
}
:root[data-theme="dark"] .bg-tema-group .btn.active,
[data-bs-theme="dark"] .bg-tema-group .btn.active {
  color: #0d1318;
}

/* Sidebar */
.bg-sidebar {
  position: fixed;
  top: var(--bg-top-h);
  bottom: 0;
  left: 0;
  width: var(--bg-side-w);
  background: linear-gradient(180deg, var(--bg-side) 0%, var(--bg-side-2) 100%);
  border-right: 1px solid var(--bg-side-border);
  padding: 0.85rem 0.55rem;
  overflow-y: auto;
  overflow-x: hidden;
  z-index: 1020;
  transition: width 0.2s ease;
}

/* Desktop: trilho de icones — libera area de trabalho.
   So acima do corte mobile: a classe fica no <html> em qualquer largura (o
   boot do base.html le o localStorage antes do paint), e o drawer mobile tem
   que abrir inteiro, com rotulos. */
@media (min-width: 861px) {
  html.bg-side-collapsed {
    --bg-side-w: var(--bg-side-w-collapsed);
  }
  html.bg-side-collapsed .bg-sidebar {
    padding: 0.55rem 0.3rem;
  }
  html.bg-side-collapsed .bg-nav-label,
  html.bg-side-collapsed .bg-nav-section-label,
  html.bg-side-collapsed .bg-nav-chevron,
  html.bg-side-collapsed .bg-nav-sub-label,
  html.bg-side-collapsed .bg-nav-sub-chevron {
    display: none;
  }
  html.bg-side-collapsed .bg-nav-group-toggle {
    display: none;
  }
  /* Sem o titulo do grupo, um filete separa um modulo do outro no trilho. */
  html.bg-side-collapsed .bg-nav-group {
    border-top: 1px solid var(--bg-side-border);
    margin-top: 4px;
    padding-top: 4px;
  }
  html.bg-side-collapsed .bg-nav-group.is-collapsed .bg-nav-group-body {
    max-height: none;
    opacity: 1;
    pointer-events: auto;
  }
  html.bg-side-collapsed .bg-nav-item {
    justify-content: center;
    gap: 0;
    padding: 0.55rem 0.25rem;
  }
  html.bg-side-collapsed .bg-nav-group-body .bg-nav-item {
    padding-left: 0.25rem;
  }
  html.bg-side-collapsed .bg-nav-sub-toggle {
    justify-content: center;
    padding: 0.4rem 0.25rem;
  }
  html.bg-side-collapsed .bg-nav-sub .bg-nav-item {
    padding-left: 0.25rem;
  }
}

.bg-nav {
  display: flex;
  flex-direction: column;
  gap: 0.12rem;
}

.bg-nav-item {
  display: flex;
  align-items: center;
  gap: 0.7rem;
  padding: 0.58rem 0.8rem;
  border-radius: 11px;
  color: var(--bg-side-text);
  text-decoration: none;
  font-weight: 600;
  font-size: 0.99rem;
  transition: background 0.15s ease, color 0.15s ease;
  border: 0;
  background: transparent;
  width: 100%;
  text-align: left;
  cursor: pointer;
}
.bg-nav-item:hover {
  background: var(--bg-nav-hover);
  color: #fff;
}
.bg-nav-item.active {
  background: var(--bg-accent-soft);
  color: #fff;
  font-weight: 700;
  box-shadow: inset 3px 0 0 var(--bg-accent);
}
.bg-nav-item i {
  font-size: 1.12rem;
  color: var(--bg-accent);
  flex-shrink: 0;
  opacity: 1;
}
.bg-nav-item.active i { opacity: 1; color: var(--bg-accent); }
.bg-nav-label {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.bg-nav-item.is-disabled {
  opacity: 0.55;
  color: #cfd8dc;
  cursor: not-allowed;
  pointer-events: none;
}
.bg-nav-item.is-disabled i { color: #90a4ae; }
.bg-nav-item.is-disabled:hover {
  background: transparent;
  color: #cfd8dc;
}

.bg-nav-group { margin-bottom: 2px; }
.bg-nav-group-toggle {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  margin: 8px 0 2px;
  padding: 0.4rem 0.8rem;
  background: transparent;
  border: none;
  cursor: pointer;
  text-align: left;
  border-radius: 8px;
}
.bg-nav-group-toggle:hover { background: rgba(255, 255, 255, 0.08); }
.bg-nav-section-label {
  font-size: 0.72rem;
  font-weight: 700;
  color: var(--bg-side-muted);
  letter-spacing: 0.08em;
  text-transform: uppercase;
}
.bg-nav-chevron {
  font-size: 0.75rem;
  color: var(--bg-side-muted);
  transition: transform 0.2s ease;
}
.bg-nav-group-toggle[aria-expanded="true"] .bg-nav-chevron {
  transform: rotate(180deg);
  color: var(--bg-accent);
}
.bg-nav-group-body {
  overflow: hidden;
  /* Alto o bastante para o grupo Configuracao com um submenu aberto (o
     recolher continua sendo a transicao de max-height). */
  max-height: 900px;
  opacity: 1;
  transition: max-height 0.25s ease, opacity 0.2s ease;
}
.bg-nav-group.is-collapsed .bg-nav-group-body {
  max-height: 0;
  opacity: 0;
  pointer-events: none;
}
.bg-nav-group-body .bg-nav-item {
  padding-left: 1.05rem;
  font-size: 0.95rem;
}

/* Submenu dentro de um grupo (Configuracao > NFe / WhatsApp / Integracoes).
   <details> nativo: abre e fecha sem JS, e o Jinja marca `open` quando a tela
   atual esta dentro do bloco. */
.bg-nav-sub { margin: 2px 0; }
.bg-nav-sub-toggle {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.35rem 0.8rem 0.35rem 1.05rem;
  cursor: pointer;
  list-style: none;
  border-radius: 8px;
  color: var(--bg-side-muted);
}
.bg-nav-sub-toggle::-webkit-details-marker { display: none; }
.bg-nav-sub-toggle:hover { background: rgba(255, 255, 255, 0.06); }
.bg-nav-sub-label {
  flex: 1;
  font-size: 0.74rem;
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}
.bg-nav-sub-chevron {
  font-size: 0.7rem;
  transition: transform 0.2s ease;
}
.bg-nav-sub[open] > .bg-nav-sub-toggle { color: var(--bg-accent); }
.bg-nav-sub[open] > .bg-nav-sub-toggle .bg-nav-sub-chevron { transform: rotate(180deg); }
.bg-nav-sub .bg-nav-item { padding-left: 2.1rem; }

/* Main content */
.bg-main {
  margin-left: var(--bg-side-w);
  margin-top: var(--bg-top-h);
  padding: 1.25rem 1.4rem 2rem;
  min-height: calc(100vh - var(--bg-top-h));
  /* Aqui e nao no estado recolhido: senao so o recolher anima e o expandir salta. */
  transition: margin-left 0.2s ease;
}

.bg-footer {
  text-align: center;
  padding: 1rem 0 0.5rem;
  color: var(--ink-3);
  font-size: 11px;
}

/* Cards / stats (kept from old base inline) */
.card {
  border: none;
  border-radius: 12px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
  transition: 0.2s;
  background: var(--surface);
  color: var(--ink);
}
.card:hover { box-shadow: 0 4px 16px rgba(0, 0, 0, 0.1); }
.stat-card { text-align: center; padding: 20px; }
.stat-card .value {
  font-size: 27px;
  font-weight: 700;
  color: var(--brasgelo-blue);
  font-family: var(--font-mono);
  font-variant-numeric: tabular-nums;
}
.stat-card .label {
  font-size: 12px;
  color: var(--ink-2);
  margin-top: 4px;
}
.badge-entregue { background: #d4edda; color: #155724; }
.badge-nao-entregue { background: #f8d7da; color: #721c24; }
.badge-avulsa { background: #d1ecf1; color: #0c5460; }
.badge-parcial { background: #fff3cd; color: #856404; }
.badge-processado { background: #d4edda; color: #155724; }
.badge-pendente { background: #fff3cd; color: #856404; }

[data-bs-theme="dark"] .badge-entregue,
[data-bs-theme="dark"] .badge-processado {
  background: rgba(12, 163, 12, 0.22);
  color: #75b798;
}
[data-bs-theme="dark"] .badge-nao-entregue {
  background: rgba(208, 59, 59, 0.22);
  color: #ea868f;
}
[data-bs-theme="dark"] .badge-avulsa {
  background: rgba(110, 168, 254, 0.18);
  color: #6ea8fe;
}
[data-bs-theme="dark"] .badge-parcial,
[data-bs-theme="dark"] .badge-pendente {
  background: rgba(250, 178, 25, 0.2);
  color: #ffda6a;
}

.flash-messages {
  position: fixed;
  top: calc(var(--bg-top-h) + 12px);
  right: 20px;
  z-index: 9999;
  min-width: 300px;
}

.bg-overlay {
  display: none;
  position: fixed;
  inset: var(--bg-top-h) 0 0 0;
  background: rgba(7, 20, 26, 0.45);
  z-index: 1015;
  backdrop-filter: blur(2px);
}

@media (max-width: 860px) {
  .bg-sidebar {
    transform: translateX(-100%);
    transition: transform 0.22s ease;
  }
  .bg-sidebar.open { transform: translateX(0); }
  .bg-main { margin-left: 0; padding: 1.1rem; }
  .bg-toggle .bi-layout-sidebar-inset { display: none !important; }
  .bg-toggle .bi-list { display: inline-block !important; }
  .bg-overlay.open { display: block; }
}

/* ============================================================
   Brasgelo Intranet - padrao visual global (todos os modulos)
   Carregado em base.html apos o Bootstrap.
   ============================================================ */

/* ── Raiz 15px: o corpo do Anexo A.2 (Bootstrap usaria 16px) ── */
html { font-size: 15px; }

/* ── Titulos: h1-h4 em Bricolage (h4 e o titulo de tela); secao de card
   (h5, h6) e titulo de modal no corpo. Tamanho: o do Bootstrap. ── */
h1, h2, h3, h4,
.h1, .h2, .h3, .h4 {
  font-family: var(--font-titulo);
  font-weight: 800;
  letter-spacing: -.015em;
  text-wrap: balance;
}
h5, h6,
.h5, .h6,
.modal-title {
  font-family: var(--font-sans);
  font-weight: 600;
}

/* ── Botoes: mesmo tamanho/estilo em todas as telas ───────── */
.btn {
  font-size: 13px;
  padding: 0.25rem 0.6rem;
  border-radius: 6px;
}
.btn .bi { font-size: 13px; }
.btn-group-sm > .btn, .btn-sm {
  font-size: 13px;
  padding: 0.25rem 0.6rem;
  border-radius: 6px;
}

/* ── Grids: mesma fonte em todos ──────────────────────────── */
.table { font-size: 12.5px; } /* F5: a Plex Sans e mais larga; 12,5px ocupa o que a Segoe ocupava em 13px */
.table thead th {
  font-size: 12px;
  text-transform: uppercase;
  color: var(--ink-3, #666);
  font-weight: 600;
  border-top: none;
}
.table .badge { font-size: 11px; font-weight: 500; }

/* ── Ordenacao de colunas (asc/desc) ──────────────────────── */
.table thead th.sortable,
.table thead th[data-sort] {
  cursor: pointer;
  user-select: none;
  white-space: nowrap;
}
.table thead th.sortable:hover,
.table thead th[data-sort]:hover { background: var(--surface-2, #e2e6ea); }
.table thead th.no-sort { cursor: default; }
.table thead th .sort-icon {
  font-style: normal;
  font-size: 0.75em;
  margin-left: 3px;
  opacity: 0.4;
}
.table thead th:not(.sort-asc):not(.sort-desc):not(.sorted-asc):not(.sorted-desc) .sort-icon::after { content: '\2195'; }
.table thead th.sort-asc .sort-icon,
.table thead th.sorted-asc .sort-icon,
.table thead th.sort-desc .sort-icon,
.table thead th.sorted-desc .sort-icon { opacity: 1; }
.table thead th.sort-asc .sort-icon::after,
.table thead th.sorted-asc .sort-icon::after { content: '\25B2'; }
.table thead th.sort-desc .sort-icon::after,
.table thead th.sorted-desc .sort-icon::after { content: '\25BC'; }

/* ── Mensagens: erro vermelho, alerta amarelo, confirmacao verde ── */
.flash-messages .alert,
.alert.alert-flash {
  font-size: 13px;
  font-weight: 500;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
}
.flash-messages .alert-danger {
  background: #dc3545;
  border-color: #b02a37;
  color: #fff;
}
.flash-messages .alert-warning {
  background: #ffc107;
  border-color: #d39e00;
  color: #212529;
}
.flash-messages .alert-success {
  background: #198754;
  border-color: #146c43;
  color: #fff;
}
.flash-messages .alert-danger .btn-close,
.flash-messages .alert-success .btn-close { filter: invert(1) grayscale(100%) brightness(200%); }

/* ── Inbox SAC: tint pela 1a etiqueta — so cards/lista (esquerda) ── */
.inbox-item.has-etiqueta {
  border-left: 3px solid var(--et-cor, #6c757d);
  background: color-mix(in srgb, var(--et-cor, #6c757d) 12%, #f8f9fa);
}
.inbox-item.has-etiqueta.active {
  background: color-mix(in srgb, var(--et-cor, #6c757d) 18%, #dbeafe);
  border-left-color: var(--et-cor, #0d6efd);
}
.inbox-msg.inbound { background: #f8f9fa; }
.inbox-msg.outbound {
  background: rgba(13, 110, 253, 0.1);
  border-left: 3px solid #0d6efd;
}
.inbox-row-et {
  border-left: 3px solid var(--et-cor, #6c757d);
  background: color-mix(in srgb, var(--et-cor, #6c757d) 10%, #fff);
}

/* Historico do cliente (offcanvas somente leitura) */
.hist-item {
  display: block;
  border: 0;
  border-bottom: 1px solid var(--line, #dee2e6);
  background: var(--surface, #fff);
  padding: .5rem .75rem;
  color: var(--ink, inherit);
}
.hist-item:hover { background: var(--surface-2, #f1f3f5); }
.hist-leitura .inbox-msg { max-width: 100%; }

/* ── Tema escuro: contraste global (Bootstrap + utilitarios legados) ──
   .text-danger/.text-warning e bg-light/btn-outline-dark NAO acompanham
   data-bs-theme sozinhos — texto some ou fica ilegivel. */
[data-bs-theme="dark"] {
  /* Status em texto: tons claros (equivalente aos *-emphasis do BS) */
  --bs-danger-rgb: 234, 134, 143;
  --bs-warning-rgb: 255, 218, 106;
  --bs-success-rgb: 117, 183, 152;
  --bs-info-rgb: 110, 168, 254;
}
[data-bs-theme="dark"] .text-danger,
[data-bs-theme="dark"] .link-danger {
  color: #ea868f !important;
}
[data-bs-theme="dark"] .text-warning,
[data-bs-theme="dark"] .link-warning {
  color: #ffda6a !important;
}
[data-bs-theme="dark"] .text-success,
[data-bs-theme="dark"] .link-success {
  color: #75b798 !important;
}
/* .text-muted e .text-body-secondary seguem --bs-secondary-color.
   .text-secondary usa --bs-secondary-rgb (nao mapeado: recoloriria .bg-secondary). */
[data-bs-theme="dark"] .text-secondary {
  color: var(--ink-2, #a9b8c3) !important;
}
[data-bs-theme="dark"] .text-dark {
  color: var(--ink, #edf3f7) !important;
}
[data-bs-theme="dark"] .text-black {
  color: var(--ink, #edf3f7) !important;
}

/* Fundos "claros" fixos viram superficie — senao herdam tinta clara e somem */
[data-bs-theme="dark"] .bg-light,
[data-bs-theme="dark"] .bg-white,
[data-bs-theme="dark"] .table-light {
  background-color: var(--surface-2, #1c262e) !important;
  color: var(--ink, #edf3f7) !important;
}
[data-bs-theme="dark"] .text-bg-light {
  background-color: var(--surface-2, #1c262e) !important;
  color: var(--ink, #edf3f7) !important;
}
[data-bs-theme="dark"] .border-light {
  border-color: var(--line, #26323b) !important;
}

/* Botoes: outline-dark some no escuro; light/dark precisam contraste */
[data-bs-theme="dark"] .btn-outline-dark {
  --bs-btn-color: var(--ink, #edf3f7);
  --bs-btn-border-color: var(--line-2, #35444f);
  --bs-btn-hover-color: #0d1318;
  --bs-btn-hover-bg: var(--ink, #edf3f7);
  --bs-btn-hover-border-color: var(--ink, #edf3f7);
  --bs-btn-active-color: #0d1318;
  --bs-btn-active-bg: var(--ink, #edf3f7);
  --bs-btn-active-border-color: var(--ink, #edf3f7);
  --bs-btn-disabled-color: var(--ink-3, #8394a1);
  --bs-btn-disabled-border-color: var(--line, #26323b);
}
[data-bs-theme="dark"] .btn-outline-secondary {
  --bs-btn-color: var(--ink-2, #a9b8c3);
  --bs-btn-border-color: var(--line-2, #35444f);
  --bs-btn-hover-color: #0d1318;
  --bs-btn-hover-bg: var(--ink-2, #a9b8c3);
  --bs-btn-hover-border-color: var(--ink-2, #a9b8c3);
  --bs-btn-active-color: #0d1318;
  --bs-btn-active-bg: var(--ink, #edf3f7);
  --bs-btn-active-border-color: var(--ink, #edf3f7);
  --bs-btn-disabled-color: var(--ink-3, #8394a1);
  --bs-btn-disabled-border-color: var(--line, #26323b);
}
[data-bs-theme="dark"] .btn-outline-warning {
  --bs-btn-color: #ffda6a;
  --bs-btn-border-color: #ffda6a;
  --bs-btn-hover-color: #0d1318;
  --bs-btn-hover-bg: #ffda6a;
  --bs-btn-hover-border-color: #ffda6a;
  --bs-btn-active-color: #0d1318;
  --bs-btn-active-bg: #ffda6a;
  --bs-btn-active-border-color: #ffda6a;
}
[data-bs-theme="dark"] .btn-outline-danger {
  --bs-btn-color: #ea868f;
  --bs-btn-border-color: #ea868f;
  --bs-btn-hover-color: #0d1318;
  --bs-btn-hover-bg: #ea868f;
  --bs-btn-hover-border-color: #ea868f;
  --bs-btn-active-color: #0d1318;
  --bs-btn-active-bg: #ea868f;
  --bs-btn-active-border-color: #ea868f;
}
[data-bs-theme="dark"] .btn-outline-primary {
  --bs-btn-color: #6ea8fe;
  --bs-btn-border-color: #6ea8fe;
  --bs-btn-hover-color: #0d1318;
  --bs-btn-hover-bg: #6ea8fe;
  --bs-btn-hover-border-color: #6ea8fe;
  --bs-btn-active-color: #0d1318;
  --bs-btn-active-bg: #6ea8fe;
  --bs-btn-active-border-color: #6ea8fe;
}
[data-bs-theme="dark"] .btn-light {
  --bs-btn-color: #0d1318;
  --bs-btn-bg: #e9eef2;
  --bs-btn-border-color: #e9eef2;
  --bs-btn-hover-color: #0d1318;
  --bs-btn-hover-bg: #d8e0e7;
  --bs-btn-hover-border-color: #d8e0e7;
  --bs-btn-active-color: #0d1318;
  --bs-btn-active-bg: #c3ced8;
  --bs-btn-active-border-color: #c3ced8;
}
[data-bs-theme="dark"] .btn-dark {
  --bs-btn-color: #edf3f7;
  --bs-btn-bg: #26323b;
  --bs-btn-border-color: #35444f;
  --bs-btn-hover-color: #edf3f7;
  --bs-btn-hover-bg: #35444f;
  --bs-btn-hover-border-color: #47555f;
  --bs-btn-active-color: #edf3f7;
  --bs-btn-active-bg: #35444f;
  --bs-btn-active-border-color: #47555f;
}
[data-bs-theme="dark"] .btn-warning {
  --bs-btn-color: #0d1318;
  --bs-btn-bg: #ffda6a;
  --bs-btn-border-color: #ffda6a;
  --bs-btn-hover-color: #0d1318;
  --bs-btn-hover-bg: #ffcd39;
  --bs-btn-hover-border-color: #ffcd39;
}
[data-bs-theme="dark"] .btn-close {
  filter: invert(1) grayscale(100%);
  opacity: 0.75;
}

/* Badges warning/light: texto legivel */
[data-bs-theme="dark"] .badge.bg-warning,
[data-bs-theme="dark"] .badge.text-bg-warning {
  color: #0d1318 !important;
}
[data-bs-theme="dark"] .badge.bg-light,
[data-bs-theme="dark"] .badge.text-bg-light {
  background-color: var(--surface-2, #1c262e) !important;
  color: var(--ink, #edf3f7) !important;
  border: 1px solid var(--line-2, #35444f);
}

/* Inbox / historico no escuro */
[data-bs-theme="dark"] .inbox-item.has-etiqueta {
  background: color-mix(in srgb, var(--et-cor, #6c757d) 18%, var(--surface, #161e25));
}
[data-bs-theme="dark"] .inbox-item.has-etiqueta.active {
  background: color-mix(in srgb, var(--et-cor, #0d6efd) 22%, var(--surface-2, #1c262e));
}
[data-bs-theme="dark"] .inbox-msg.inbound {
  background: var(--surface-2, #1c262e);
  color: var(--ink, #edf3f7);
}
[data-bs-theme="dark"] .inbox-msg.outbound {
  background: rgba(110, 168, 254, 0.16);
  border-left-color: #6ea8fe;
}
[data-bs-theme="dark"] .inbox-row-et {
  background: color-mix(in srgb, var(--et-cor, #6c757d) 14%, var(--surface, #161e25));
}

/* ── F3: classes que moravam em varios templates. Uma definicao cada. ── */
.vlr-col { text-align: right; font-family: var(--font-mono); font-variant-numeric: tabular-nums; }
.serie-col { font-family: var(--font-mono); font-variant-numeric: tabular-nums; font-size: .78rem; }
tbody tr.row-inativo td { background: var(--surface-2); color: var(--ink-3); }

/* Selecao e acoes na grade (regra 11, 50 Padrões/10 a-regra-da-tela.md). Generico: grade
   com acao por linha marca e age pelo botao direito, sem botao repetido. */
tbody tr.row-selected > td { background-color: var(--accent-soft) !important; }
.barra-selecao {
  display: flex; align-items: center; gap: .4rem;
  padding: .35rem .75rem; margin-bottom: .5rem;
  background: var(--surface-2); border: 1px solid var(--line);
  border-radius: 6px; font-size: 12.5px; color: var(--ink-2);
}
.barra-selecao .num { color: var(--ink); font-weight: 600; }
.menu-contexto {
  display: none; position: fixed; z-index: 2000; min-width: 210px;
  box-shadow: 0 4px 12px rgba(0, 0, 0, .15);
  /* menu com dois niveis (unitario + grupo) passa de 595px: rola dentro da janela */
  max-height: calc(100vh - 8px); overflow-y: auto;
}
.menu-contexto.show { display: block; }

/* Painel de filtro recolhivel (50 Padrões/10 a-regra-da-tela.md, AJ-18). Generico: painel
   a esquerda da grade, 340px aberto e 40px recolhido; estado por classe. */
.painel-filtro-layout { display: flex; flex-direction: column; gap: .6rem; }
.painel-filtro-conteudo { min-width: 0; flex: 1 1 0; }
.painel-filtro {
  background: var(--surface); border: 1px solid var(--line);
  border-radius: 6px; overflow: hidden;
}
.painel-filtro-faixa {
  display: flex; align-items: center; gap: .4rem; width: 100%;
  padding: .4rem .6rem; background: var(--surface-2); color: var(--ink-2);
  border: 0; border-bottom: 1px solid var(--line); text-align: left;
}
.painel-filtro-faixa:hover { color: var(--ink); }
.painel-filtro-titulo { flex: 1 1 auto; font-weight: 600; }
.painel-filtro-ativos { min-width: 1.4rem; }
.painel-filtro-ativos:empty { display: none; }
.painel-filtro-corpo { padding: .5rem .6rem; overflow-y: auto; max-height: calc(100vh - 11rem); }
.painel-filtro-grupo { padding-bottom: .5rem; margin-bottom: .5rem; border-bottom: 1px solid var(--line); }
.painel-filtro-grupo:last-child { border-bottom: 0; margin-bottom: 0; }
.painel-filtro-grupo-titulo {
  margin: 0 0 .3rem; font-size: 11px; font-weight: 600;
  letter-spacing: .04em; text-transform: uppercase; color: var(--ink-3);
}
.painel-filtro-linha { display: flex; flex-wrap: wrap; align-items: center; gap: .3rem .75rem; margin-bottom: .3rem; }
/* Grupo com os campos alinhados: o rotulo ocupa uma coluna fixa e os campos
   comecam todos no mesmo x. Sem isso a borda esquerda fica serrilhada, porque
   cada campo nasce onde o seu rotulo acabou (Lote x=308, Orcamento x=345). */
.painel-filtro-grupo.alinhado .painel-filtro-linha > .form-label {
  flex: 0 0 5rem;
}
.painel-filtro-busca { display: flex; align-items: center; gap: .5rem; margin-bottom: .5rem; }
.painel-filtro-busca .form-control { flex: 1 1 0; width: auto; min-width: 0; }
.painel-filtro.recolhido .painel-filtro-corpo,
.painel-filtro.recolhido .painel-filtro-titulo,
.painel-filtro.recolhido .painel-filtro-seta { display: none; }
@media (min-width: 861px) {
  .painel-filtro-layout { flex-direction: row; align-items: flex-start; }
  .painel-filtro { flex: 0 0 340px; width: 340px; }
  .painel-filtro.recolhido { flex-basis: 40px; width: 40px; }
  .painel-filtro.recolhido .painel-filtro-faixa {
    flex-direction: column; justify-content: flex-start; padding: .5rem 0; border-bottom: 0;
    align-items: center;
  }
}

/* Modal movel: arrasta so na vertical pelo cabecalho (50 Padrões/10 a-regra-da-tela.md).
   Componente generico: qualquer .modal com esta classe fica arrastavel. */
.modal-movel .modal-header {
  cursor: move;
  touch-action: none;
  user-select: none;
}
.modal-backdrop-movel {
  --bs-backdrop-opacity: .35;
}

/* Box de pesquisa: o modal nao e travado (owner, 2026-09-28).
   O usuario arrasta pelo cabecalho, nos DOIS eixos, e estica pelo canto
   inferior direito. Nao usa o .modal-movel acima: aquele anda so na
   vertical, e a grade do box de pessoa tem 11 colunas.
   Quem manda no tamanho e o inline que o box-pesquisa.js escreve -- por isso
   max-width cai, senao o teto do modal-lg/xl travaria o esticar.
   Doc: intra-vault/10 plataforma/50 Padrões/ui-box-pesquisa.md */
#bpModal .modal-dialog {
  max-width: none;
  /* O Bootstrap anima `transform` no .modal.fade .modal-dialog. Como o arraste
     escreve transform a cada pointermove, a animacao faria a janela chegar
     300 ms depois do cursor. */
  transition: none;
}
#bpModal .modal-header {
  cursor: move;
  touch-action: none;
  user-select: none;
}
#bpModal .modal-content {
  height: 100%;
  overflow: hidden;
}
#bpModal .bp-esticar {
  position: absolute;
  right: 1px;
  bottom: 1px;
  z-index: 2;
  width: 16px;
  height: 16px;
  cursor: nwse-resize;
  touch-action: none;
  opacity: .55;
  background: linear-gradient(135deg,
      transparent 48%, var(--ink-3) 48% 60%,
      transparent 60% 72%, var(--ink-3) 72% 84%, transparent 84%);
}
#bpModal .bp-esticar:hover {
  opacity: 1;
}

/* Carregando dos dashboards */
.loading-overlay {
  display: none; position: absolute; inset: 0; z-index: 10;
  align-items: center; justify-content: center; border-radius: 8px;
  background: color-mix(in srgb, var(--surface) 75%, transparent);
}
.loading-overlay.active { display: flex; }
.loading-spinner {
  width: 32px; height: 32px; border-radius: 50%;
  border: 4px solid var(--accent-soft); border-top-color: var(--brasgelo-blue);
  animation: bg-spin .7s linear infinite;
}
@keyframes bg-spin { to { transform: rotate(360deg); } }

/* Historico de mensagens (Whats) */
.log-item { font-size: 11px; border-left: 3px solid var(--line); padding-left: 8px; margin-bottom: 8px; }
.log-item.out { border-color: var(--good); }
.log-item.in { border-color: var(--chart-1); }

/* Lista de documentos com trilho de acoes (NF-e, manifestacao, MDF-e) */
.doc-wrap { display: flex; gap: .75rem; align-items: flex-start; }
.doc-main { flex: 1; min-width: 0; }
.doc-rail { width: 190px; flex: 0 0 190px; position: sticky; top: 70px; }
.doc-rail .card-header {
  font-size: 11px; text-transform: uppercase; letter-spacing: .04em;
  padding: .4rem .6rem; font-weight: 700;
}
.doc-rail .card-body { padding: .4rem; }
.doc-rail .btn { width: 100%; text-align: left; margin-bottom: .28rem; }
.doc-rail .btn:last-child { margin-bottom: 0; }
.doc-sel { font-size: 11px; color: var(--ink-3); padding: .15rem .35rem .45rem; word-break: break-all; }
.doc-grid tbody tr { cursor: pointer; }
.doc-grid tbody tr.table-active { outline: 2px solid var(--brasgelo-blue); outline-offset: -2px; }

/* Relatorios (D6): pagina, cabecalho, totais e tabela */
.rel-wrap { max-width: 21cm; margin: 0 auto; padding: 10px; font-size: 11px; }
.rel-wrap.paisagem { max-width: 29.7cm; page: paisagem; }
.rel-toolbar { max-width: 210mm; margin: 0 auto 8px; padding: 8px 10px; }
.rel-toolbar.paisagem { max-width: 297mm; }
.rel-shell { width: 100%; border-collapse: collapse; }
.rel-shell > thead > tr > td,
.rel-shell > tbody > tr > td { padding: 0; border: 0; vertical-align: top; }
.rel-cab {
  border-bottom: 2px solid var(--ink); padding-bottom: 6px; margin-bottom: 10px;
  display: flex; justify-content: space-between; align-items: flex-end;
}
.rel-cab .titulo { font-size: 15px; font-weight: 700; }
.rel-cab .meta { font-size: 11px; color: var(--ink-2); text-align: right; }
.totais {
  display: grid; grid-template-columns: repeat(6, 1fr); gap: 6px;
  margin-bottom: 12px; border: 1px solid var(--line-2); padding: 8px;
}
.totais .tot-label { font-size: .7rem; color: var(--ink-3); display: block; }
.totais .tot-valor { font-variant-numeric: tabular-nums; font-weight: 700; }
.sec { margin-top: 14px; }
.sec h6 {
  font-size: 12px; font-weight: 700; margin: 0 0 4px;
  border-left: 3px solid var(--accent); padding-left: 6px; break-after: avoid;
}
.rel-tbl { width: 100%; border-collapse: collapse; font-size: 10px; margin-bottom: 8px; }
.rel-tbl th { background: var(--surface-2); text-align: left; padding: 3px 6px; border-bottom: 1px solid var(--line-2); }
.rel-tbl td { padding: 3px 6px; border-bottom: 1px solid var(--line); }
.rel-tbl .num { text-align: right; }
.rel-tbl tfoot td { font-weight: 700; border-top: 1px solid var(--ink); }
.rel-tbl tr { break-inside: avoid; }
/* 2026-09-30: linhas de grupo/subtotal dentro do tbody (varios grupos por
   tabela -- so um tfoot cabe por tabela, reservado ao total geral). */
.rel-tbl tr.rel-grupo td { background: var(--surface-2); font-weight: 700; }
.rel-tbl tr.rel-subtotal td { background: var(--surface-2); font-weight: 700; border-top: 1px solid var(--line-2); }
.total-geral-row { font-size: 1.1rem; font-weight: 700; }
tfoot.total-exp td { background: var(--accent-soft); font-weight: 700; }
tfoot.total-motivo td { background: color-mix(in srgb, var(--critical) 8%, var(--surface)); font-weight: 700; }
tfoot.total-forma td { background: color-mix(in srgb, var(--good) 14%, var(--surface)); font-weight: 700; }
.motivo-header {
  background: color-mix(in srgb, var(--critical) 16%, var(--surface));
  border-left: 4px solid var(--critical);
  padding: 6px 12px; font-weight: 600; font-size: .9rem; margin-bottom: 6px;
}
.forma-header {
  background: var(--surface-2); border-left: 4px solid var(--brasgelo-blue);
  padding: 6px 12px; font-weight: 600; font-size: .9rem; margin-bottom: 6px;
}
.forma-header.especie { border-left-color: var(--chart-3); }
.forma-header.pix { border-left-color: var(--chart-1); }
.forma-header.transferencia { border-left-color: var(--chart-5); }
.forma-header.prazo { border-left-color: var(--chart-2); }

/* ── Impressao (D6): uma regra para todas as paginas da intranet ── */
@page paisagem { size: A4 landscape; margin: 10mm; }
@media print {
  /* Papel e sempre claro, mesmo com o tema escuro escolhido */
  :root, :root[data-theme="dark"], :root:not([data-theme="light"]) {
    --bg: #fff; --surface: #fff; --surface-2: #f2f5f8;
    --ink: #101820; --ink-2: #47555f; --ink-3: #6d7b86;
    --line: #d8e0e7; --line-2: #c3ced8;
    --accent: #14506b; --accent-soft: #dbe9f0; --brasgelo-blue: #0d47a1;
    color-scheme: light;
  }
  html, body {
    background: #fff !important; height: auto !important;
    min-height: 0 !important; overflow: visible !important;
  }
  .no-print, .bg-topbar, .bg-sidebar, .bg-overlay, .bg-toggle,
  .bg-footer, .flash-messages { display: none !important; }
  .bg-main { margin: 0 !important; padding: 0 !important; min-height: 0 !important; height: auto !important; }
  .card { box-shadow: none !important; border: 1px solid var(--line) !important; }
  .table thead th .sort-icon { display: none; }
  .rel-wrap, .rel-wrap.paisagem { max-width: 100%; margin: 0; padding: 0; }
  .rel-shell > thead, .rel-tbl thead { display: table-header-group; }
  .rel-shell > tbody, .rel-tbl tbody { display: table-row-group; }
  .sec, .totais, .rel-tbl { break-inside: auto; }
  .motivo-header, .forma-header { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
}

/* ---- CRM: componentes. Tokens vem de :root, nao daqui. ---- */
.crm-visual .card {
  background: var(--surface);
  border-color: var(--line);
  border-radius: var(--radius);
}
.crm-visual .table > :not(caption) > * > * { border-bottom-color: var(--line); }
.crm-visual .table-light > th {
  background: var(--surface-2); color: var(--ink-3); border-color: var(--line);
  font-size: 11px; letter-spacing: .06em; text-transform: uppercase;
}
.crm-visual #tbCarteira tr:hover td,
.crm-visual #tbCarteira tr.sel td { background: var(--accent-soft); }

/* ---- botoes do prototipo ---- */
.crm-visual .crm-opts { display: flex; flex-wrap: wrap; gap: 6px; }
.crm-visual .crm-opt {
  font: inherit; font-size: 13px; font-weight: 600;
  border: 1px solid var(--line-2); background: var(--surface-2); color: var(--ink);
  border-radius: 8px; padding: 8px 12px; cursor: pointer;
}
.crm-visual .crm-opt:hover { border-color: var(--accent); }
.crm-visual .crm-opt[aria-pressed="true"] {
  background: var(--accent); border-color: var(--accent); color: #fff;
}
:root[data-theme="dark"] .crm-visual .crm-opt[aria-pressed="true"] { color: #0d1318; }
.crm-visual .crm-opt small {
  display: block; font-weight: 400; font-size: 11px; opacity: .78;
}

.crm-visual .crm-pills { display: flex; flex-wrap: wrap; gap: 6px; }
.crm-visual .crm-pill {
  border: 1px solid var(--line-2); background: var(--surface-2); color: var(--ink-2);
  border-radius: 999px; padding: 7px 14px;
  font: inherit; font-size: 13.5px; font-weight: 600; cursor: pointer;
  text-decoration: none;
}
.crm-visual .crm-pill:hover { border-color: var(--accent); color: var(--ink); }
.crm-visual .crm-pill[aria-pressed="true"],
.crm-visual a.crm-pill.active {
  background: var(--accent); border-color: var(--accent); color: #fff;
}

.crm-visual .crm-btn {
  font: inherit; font-size: 12.5px; font-weight: 600;
  border: 1px solid var(--accent); background: transparent; color: var(--accent);
  border-radius: 7px; padding: 5px 11px; cursor: pointer; white-space: nowrap;
  text-decoration: none; display: inline-block;
}
.crm-visual .crm-btn:hover { background: var(--accent-soft); color: var(--accent); }
.crm-visual .crm-btn.solid {
  background: var(--accent); color: #fff; border-color: var(--accent);
}
.crm-visual .crm-btn.ghost { border-color: var(--line-2); color: var(--ink-3); }
.crm-visual .crm-btn.miudo { font-size: 11px; }

/* ---- score em card ---- */
.crm-visual .crm-semaforos { display: flex; gap: 8px; flex-wrap: wrap; }
.crm-visual .crm-sem {
  flex: 1 1 90px; border: 1px solid var(--line); border-radius: 8px;
  padding: 8px 10px; display: flex; flex-direction: column; gap: 3px;
  background: var(--surface-2);
}
.crm-visual .crm-sem span {
  font-size: 11px; color: var(--ink-3); letter-spacing: .04em; text-transform: uppercase;
}
.crm-visual .crm-sem b {
  font-size: 13px; display: flex; align-items: center; gap: 6px; color: var(--ink);
}
.crm-visual .crm-sem b i {
  width: 9px; height: 9px; border-radius: 50%; display: inline-block;
  background: var(--line-2);
}
.crm-visual .crm-sem.ok b i { background: var(--good); }
.crm-visual .crm-sem.atencao b i { background: var(--warning); }
.crm-visual .crm-sem.risco b i { background: var(--serious); }
.crm-visual .crm-sem.inativo b i,
.crm-visual .crm-sem.critico b i { background: var(--critical); }

.crm-visual .feitos-item {
  border-bottom: 1px solid var(--line); padding: 8px 0; font-size: 13px;
}
.crm-visual .feitos-item:last-child { border-bottom: 0; }

/* ---- Pessoas: componentes. Tokens vem de :root, nao daqui. ---- */
/* ---------- cartao e tabela, re-tokenizados (continuam Bootstrap) ---------- */

.pessoas-visual .card {
  background: var(--surface);
  border-color: var(--line);
  border-radius: var(--radius);
}

.pessoas-visual .table > :not(caption) > * > * {
  border-bottom-color: var(--line);
}

.pessoas-visual .table-light > th {
  background: var(--surface-2);
  color: var(--ink-3);
  border-color: var(--line);
}

/* hover e linha inativa -- antes hex fixo (#f0f4ff / #f5f5f5), ilegivel no
   tema escuro. Tokens fazem a mesma leitura nos dois temas. */
.pessoas-visual #tblPessoas tbody tr:hover td {
  background: var(--accent-soft);
  cursor: pointer;
}

.doc-col {
  font-family: var(--font-mono);
  font-variant-numeric: tabular-nums;
  font-size: .78rem;
  white-space: nowrap;
}

/* ---------- estado vazio da pesquisa ---------- */

.pessoas-visual .busca-vazia {
  color: var(--ink-3);
}
.pessoas-visual .busca-vazia i {
  font-size: 2rem;
  opacity: .35;
}

#tblPessoas thead th,
#tblFunc thead th,
#tblBol thead th,
#tblCart thead th,
#tblNfe thead th,
#tblCP thead th,
#tblCom thead th,
#tblManut thead th { white-space: nowrap; }
#qBusca,
#qBuscaAliq { font-size: 1rem; padding: .5rem .9rem; }
#cpfCnpj { font-size: 1.05rem; letter-spacing: .02em; }
#cnpjStatus { min-height: 1.2rem; }
#tblFunc tbody tr:hover td,
#tblBens tbody tr:hover td,
#tblProdutos tbody tr:hover td,
#tblCom tbody tr:hover td,
#tblNfe tbody tr:not(.row-agendada):hover td { background: var(--accent-soft); cursor: pointer; }
#tblSint td { vertical-align: middle; }
.ficha-rotulo {
  font-size: .72rem; text-transform: uppercase; letter-spacing: .03em; color: var(--ink-3);
}
.ficha-valor { font-size: .9rem; }
body:has(.ficha-rotulo) .tab-pane .card-body,
body:has(#frmProduto) .tab-pane .card-body { padding-top: .75rem; }
body:has(.ficha-rotulo) .form-label-sm,
body:has(#tblSint) .form-label-sm,
body:has(#frmProduto) .form-label-sm,
body:has(#frmProdutoNovo) .form-label-sm {
  font-size: .78rem; margin-bottom: .15rem; color: var(--ink-3);
}
.val-atual { color: var(--ink-3); }
.val-novo { font-weight: 600; }

/* ---- Componentes de dado (Anexo A.3) e os quatro niveis ----
   .st-* pinta texto, fundo e borda com o mesmo token.
   Atencao e --warning; em risco e --serious. */

.st-good,
.st-warning,
.st-serious,
.st-critical {
  --st: var(--ink-3);
  color: color-mix(in srgb, var(--st) 78%, var(--ink));
  background: color-mix(in srgb, var(--st) 16%, var(--surface));
  border: 1px solid color-mix(in srgb, var(--st) 55%, transparent);
}
.st-good { --st: var(--good); }
.st-warning { --st: var(--warning); }
.st-serious { --st: var(--serious); }
.st-critical { --st: var(--critical); }

.chip {
  display: inline-flex; align-items: center; gap: 5px;
  font-size: 11.5px; font-weight: 600;
  border-radius: 999px; padding: 2px 9px 2px 6px;
  border: 1px solid var(--line-2); color: var(--ink-2);
  white-space: nowrap; background: var(--surface);
}
.chip i {
  width: 8px; height: 8px; border-radius: 50%;
  background: var(--line-2); display: inline-block;
}
.chip.ok i { background: var(--good); }
.chip.atencao i { background: var(--warning); }
.chip.risco i { background: var(--serious); }
.chip.inativo i { background: var(--critical); }
.chip.whats { border-style: dashed; }
/* X do chip removivel (chip de filtro; hoje a rota, na Carteira). Entrou
   porque o tamanho do X vinha de style inline no JS, que a regra 1 so
   admite quando o valor e dado. Norma: 50 Padrões/10 a-regra-da-tela.md, "Pecas". */
.chip-x {
  margin-left: 2px; padding: 0 1px; border: 0; background: none;
  color: var(--ink-3); font-size: 13px; line-height: 1; cursor: pointer;
}
.chip-x:hover { color: var(--critical); }

.tag {
  display: inline-block;
  font-family: var(--font-mono);
  font-size: 10.5px; letter-spacing: .06em; text-transform: uppercase;
  border: 1px solid var(--line-2); border-radius: 4px;
  padding: 1px 6px; color: var(--ink-3);
}
.tag.medido { border-color: var(--good); color: var(--good); }
.tag.estudo { border-color: var(--serious); color: var(--serious); }
.tag.critical { border-color: var(--critical); color: var(--critical); }

.eyebrow {
  font-family: var(--font-mono);
  font-size: 11px; font-weight: 500; letter-spacing: .14em;
  text-transform: uppercase; color: var(--ink-3);
  display: block; margin-bottom: .25rem;
}
.nota { font-size: 12.5px; color: var(--ink-3); line-height: 1.45; }
.nota b { color: var(--ink-2); font-weight: 600; }
.aviso {
  border-left: 3px solid var(--warning);
  background: var(--surface-2);
  padding: 10px 12px; border-radius: 0 8px 8px 0;
  font-size: 12.5px; color: var(--ink-2); line-height: 1.5;
}
.aviso b { color: var(--ink); }

.tiles { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; }
.tiles-auto { grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); }
.tiles-1 { grid-template-columns: 1fr; }
@media (max-width: 860px) {
  .tiles { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 460px) {
  .tiles, .tiles-auto { grid-template-columns: 1fr; }
}
.tile {
  background: var(--surface); border: 1px solid var(--line);
  border-radius: var(--radius); padding: 14px;
  display: flex; flex-direction: column; gap: 4px; min-width: 0;
}
.tile .rot { font-size: 12px; color: var(--ink-3); }
.tile .val {
  font-family: var(--font-mono);
  font-variant-numeric: tabular-nums;
  font-size: 27px; font-weight: 600; letter-spacing: -.02em;
  line-height: 1.1; color: var(--ink);
}
.tile .val.menor { font-size: 22px; }
.tile .val.curto { font-size: 18px; }
.tile .sub { font-size: 12px; color: var(--ink-3); }
.tile.destaque { border-color: var(--accent); box-shadow: inset 3px 0 0 var(--accent); }
.tile.vazio .val { color: var(--ink-3); }

.hbar-row {
  display: grid; grid-template-columns: minmax(88px, 27%) 1fr auto;
  gap: 10px; align-items: center; margin-bottom: .25rem;
}
.hbar-lab { font-size: 12.5px; color: var(--ink-2); min-width: 0; }
.hbar-lab .st-good,
.hbar-lab .st-warning,
.hbar-lab .st-serious,
.hbar-lab .st-critical {
  background: transparent; border: 0; padding: 0; color: var(--st);
}
.hbar-track {
  height: 16px; background: var(--surface-2);
  border-radius: 3px; overflow: hidden;
}
.hbar-fill {
  height: 100%; border-radius: 0 4px 4px 0;
  background: var(--line-2); min-width: 0;
}
.hbar-fill.marca { background: var(--accent); }
.hbar-fill.st-good,
.hbar-fill.st-warning,
.hbar-fill.st-serious,
.hbar-fill.st-critical { background: var(--st); border: 0; }
.hbar-val {
  font-family: var(--font-mono);
  font-variant-numeric: tabular-nums;
  font-size: 12.5px; min-width: 46px; text-align: right;
}

.col-plot {
  display: grid; grid-auto-flow: column; grid-auto-columns: 1fr;
  gap: 8px; align-items: end; height: 132px;
  border-bottom: 1px solid var(--line-2);
}
.col-plot.baixo { height: 90px; }
.col-plot > .col {
  display: flex; flex-direction: column; justify-content: flex-end;
  height: 100%; gap: 4px; align-items: center; min-width: 0;
  flex: none; width: auto; max-width: none; padding: 0;
}
.col-val {
  font-family: var(--font-mono);
  font-variant-numeric: tabular-nums;
  font-size: 11px; color: var(--ink-2);
}
.col-fill {
  width: 70%; border-radius: 4px 4px 0 0; min-height: 2px;
  background: var(--accent);
}
.col-fill.parcial { opacity: .5; }
.col-lab {
  font-size: 11px; color: var(--ink-3); text-align: center;
  font-family: var(--font-mono);
}
.escala {
  display: flex; justify-content: space-between;
  font-family: var(--font-mono);
  font-variant-numeric: tabular-nums;
  font-size: 11px; color: var(--ink-3); margin-top: .25rem;
}

.sem-dot {
  width: 9px; height: 9px; border-radius: 50%;
  display: inline-block; background: var(--line-2);
  border: 0; padding: 0; vertical-align: middle;
}
.sem-dot.st-good,
.sem-dot.st-warning,
.sem-dot.st-serious,
.sem-dot.st-critical { background: var(--st); }

.ink-2 { color: var(--ink-2); }
.ink-3 { color: var(--ink-3); }
.clicavel { cursor: pointer; }
.sticky-1 { position: sticky; top: 1rem; }
.alerta-miudo { font-size: 12.5px; }
.w-3rem { width: 3rem; }
.w-4rem { width: 4rem; }
.w-55rem { width: 5.5rem; }
.w-65rem { width: 6.5rem; }
.w-7rem { width: 7rem; }
.w-9rem { width: 9rem; }
.w-22 { width: 22%; }
.w-26 { width: 26%; }
.w-34 { width: 34%; }
.mw-12 { max-width: 12rem; }
.mw-36 { max-width: 36rem; }
.ig-330 { max-width: 330px; }
.minw-250 { min-width: 250px; }
.minw-290 { min-width: 290px; }
.minw-74 { min-width: 74px; }
.minw-78 { min-width: 78px; }
.scroll-20 { max-height: 20rem; }
.scroll-26 { max-height: 26rem; }
.scroll-200 { max-height: 200px; }
.scroll-220 { max-height: 220px; }
.scroll-260 { max-height: 260px; }
.thead-fixo th { position: sticky; top: 0; z-index: 1; }
/* F4: medidas que eram style= fixo nos templates dos modulos */
.fs-05rem { font-size: .5rem; }
.fs-075rem { font-size: .75rem; }
.fs-8pt { font-size: 8pt; }
.fs-06rem { font-size: .6rem; }
.fs-10px { font-size: 10px; }
.fs-11px { font-size: 11px; }
.fs-12px { font-size: 12px; }
.fs-125px { font-size: 12.5px; }
.mt-3px { margin-top: 3px; }
.mt-6px { margin-top: 6px; }
.mb-12px { margin-bottom: 12px; }
.py-12px { padding-top: 12px; padding-bottom: 12px; }
.pre-line { white-space: pre-line; }
.pre-wrap { white-space: pre-wrap; }
.quebra-tudo { word-break: break-all; }
.z-topo { z-index: 9999; }
.ico-vazio { font-size: 2rem; opacity: .4; }
.w-2rem { width: 2rem; }
.w-5rem { width: 5rem; }
.w-6rem { width: 6rem; }
.w-8rem { width: 8rem; }
.w-10rem { width: 10rem; }
.w-11rem { width: 11rem; }
.w-12rem { width: 12rem; }
.w-14rem { width: 14rem; }
.w-18rem { width: 18rem; }
.w-45rem { width: 4.5rem; }
.w-95rem { width: 9.5rem; }
.w-36px { width: 36px; }
.w-40px { width: 40px; }
.w-48px { width: 48px; }
.w-50px { width: 50px; }
.w-52px { width: 52px; }
.w-56px { width: 56px; }
.w-60px { width: 60px; }
.w-64px { width: 64px; }
.w-70px { width: 70px; }
.w-72px { width: 72px; }
.w-76px { width: 76px; }
.w-80px { width: 80px; }
.w-90px { width: 90px; }
.w-100px { width: 100px; }
.w-108px { width: 108px; }
.w-110px { width: 110px; }
.w-120px { width: 120px; }
.w-130px { width: 130px; }
.w-140px { width: 140px; }
.w-160px { width: 160px; }
.w-170px { width: 170px; }
.w-180px { width: 180px; }
.w-190px { width: 190px; }
.w-200px { width: 200px; }
.w-12 { width: 12%; }
.w-14 { width: 14%; }
.w-16 { width: 16%; }
.w-17 { width: 17%; }
.w-18 { width: 18%; }
.w-20 { width: 20%; }
.w-48 { width: 48%; }
.w-55 { width: 55%; }
.mw-16 { max-width: 16rem; }
.mw-18 { max-width: 18rem; }
.mw-20 { max-width: 20rem; }
.mw-22 { max-width: 22rem; }
.mw-32 { max-width: 32rem; }
.mw-160px { max-width: 160px; }
.mw-180px { max-width: 180px; }
.mw-200px { max-width: 200px; }
.mw-220px { max-width: 220px; }
.mw-240px { max-width: 240px; }
.mw-260px { max-width: 260px; }
.mw-320px { max-width: 320px; }
.mw-900px { max-width: 900px; }
.mw-920px { max-width: 920px; }
.minw-120 { min-width: 120px; }
.minw-160 { min-width: 160px; }
.minw-170 { min-width: 170px; }
.minw-180 { min-width: 180px; }
.minw-200 { min-width: 200px; }
.minw-210 { min-width: 210px; }
.minw-220 { min-width: 220px; }
.minh-230 { min-height: 230px; }
.minh-320 { min-height: 320px; }
.minh-340 { min-height: 340px; }
.scroll-320 { max-height: 320px; }
.scroll-360 { max-height: 360px; }
.scroll-420 { max-height: 420px; }
.scroll-22vh { max-height: 22vh; }
.scroll-40vh { max-height: 40vh; }
.scroll-42vh { max-height: 42vh; }
.scroll-60vh { max-height: min(60vh, 700px); }
.scroll-70vh { max-height: 70vh; }
.scroll-tela { max-height: calc(100vh - 16rem); }
.midia-200 { max-width: 200px; max-height: 200px; border-radius: 6px; }
.midia-220 { max-width: 220px; max-height: 220px; border-radius: 6px; }
.midia-240 { max-width: 240px; max-height: 240px; border-radius: 6px; }

/* Conferencia tributaria. Cores proprias so em .ct-wrap — nao pisa :root.
   Banner .ui-msg: 500pt x 100pt, 50 Padrões/70 mensagens-e-confirmacao.md. */
.ct-wrap {
  --ct-card: #fff; --ct-ink: #1a2b24; --ct-muted: #5c6f66; --ct-line: #d5e0da;
  --ct-ok: #1b7f4a; --ct-crit: #b42318; --ct-accent: #0f6b4c;
  max-width: 1100px; margin: 0 auto; color: var(--ct-ink);
}
.ct-wrap .top {
  display: flex; justify-content: space-between; gap: 24px; flex-wrap: wrap;
  padding: 20px 28px; margin-bottom: 12px;
  background: var(--ct-card); border: 1px solid var(--ct-line); border-radius: 12px;
}
.ct-wrap h1 { margin: 0; font-size: 1.45rem; letter-spacing: -.02em; }
.ct-wrap .sub { margin: 4px 0 0; color: var(--ct-muted); font-size: .9rem; }
.ct-wrap .filters { display: flex; gap: 12px; align-items: end; flex-wrap: wrap; }
.ct-wrap label { display: flex; flex-direction: column; gap: 4px; font-size: .75rem; color: var(--ct-muted); }
.ct-wrap select, .ct-wrap input, .ct-wrap button {
  font: inherit; padding: 8px 10px; border-radius: 8px;
  border: 1px solid var(--ct-line); background: var(--ct-card); color: var(--ct-ink);
}
.ct-wrap button.primary, .ct-wrap #btnCarregar {
  background: var(--ct-accent); color: #fff; border-color: var(--ct-accent); cursor: pointer;
}
.ct-wrap button:disabled { opacity: .65; cursor: wait; }
.ct-wrap main { padding: 16px 28px 40px; }
.ct-wrap .tab { display: none; }
.ct-wrap .tab.active { display: block; }
.ui-msg {
  width: 500pt; height: 100pt; max-width: 100%; margin: 0 auto 12px; box-sizing: border-box;
  display: flex; align-items: center; justify-content: center; text-align: center;
  padding: 12px 20px; font-size: 1.15rem; font-weight: 650; letter-spacing: .01em;
  border-radius: 8px; border: 1px solid transparent;
}
.ui-msg[hidden] { display: none !important; }
.ui-msg--processando { background: #1b7f4a; border-color: #145c36; color: #fff; }
.ui-msg--alerta { background: #e6b800; border-color: #b38f00; color: #1a2b24; }
.ui-msg--erro { background: #b42318; border-color: #8a1a12; color: #fff; }
.ct-wrap .grid {
  width: 100%; border-collapse: collapse; overflow: hidden;
  background: var(--ct-card); border: 1px solid var(--ct-line); border-radius: 12px;
}
.ct-wrap .grid th, .ct-wrap .grid td { padding: 8px 10px; border-bottom: 1px solid var(--ct-line); font-size: .88rem; }
.ct-wrap .grid th { text-align: left; background: #f7faf8; color: var(--ct-muted); font-weight: 600; }
.ct-wrap .grid .num { text-align: right; font-variant-numeric: tabular-nums; font-family: inherit; }
.ct-wrap .grid tbody tr { cursor: default; }
.ct-wrap .grid tbody tr:hover, .ct-wrap .grid tbody tr.sel { background: #eef8f2; }
.ct-wrap .grid.compact { font-size: .8rem; }
.ct-wrap .grid tfoot th { background: #eef5f1; font-weight: 650; }
.ct-wrap .badge { display: inline-block; padding: 3px 8px; border-radius: 999px; font-size: .75rem; font-weight: 600; }
.ct-wrap .badge.ok { background: #e4f7ec; color: var(--ct-ok); }
.ct-wrap .hint { color: var(--ct-muted); font-size: .82rem; margin: 8px 0 0; }
.ct-wrap .seg {
  display: inline-flex; margin: 0 0 14px; overflow: hidden; background: var(--ct-card);
  border: 1px solid var(--ct-line); border-radius: 10px;
}
.ct-wrap .seg button { border: none; border-radius: 0; background: transparent; padding: 8px 14px; color: var(--ct-muted); cursor: pointer; }
.ct-wrap .seg button + button { border-left: 1px solid var(--ct-line); }
.ct-wrap .seg button.active { background: var(--ct-accent); color: #fff; font-weight: 600; }
.ct-wrap .memoria-duo { display: grid; grid-template-columns: 1fr; gap: 16px; margin-bottom: 20px; }
@media (min-width: 900px) { .ct-wrap .memoria-duo { grid-template-columns: 1fr 1fr; } }
@media (min-width: 1100px) { .ct-wrap .memoria-duo { grid-template-columns: repeat(3, 1fr); } }
.ct-wrap .mem-card { background: var(--ct-card); border: 1px solid var(--ct-line); border-radius: 12px; padding: 14px 16px; }
.ct-wrap .mem-card.wide { max-width: none; }
.ct-wrap .mem-card header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 10px; }
.ct-wrap .mem-card h2 { margin: 0; font-size: 1.05rem; letter-spacing: -.02em; }
.ct-wrap .mem-linha { display: flex; justify-content: space-between; gap: 12px; padding: 5px 0; border-bottom: 1px solid #eef2f0; font-size: .9rem; }
.ct-wrap .mem-linha:last-child { border-bottom: none; }
.ct-wrap .mem-linha .num { font-variant-numeric: tabular-nums; font-weight: 600; font-family: inherit; }
.ct-wrap .mem-linha.devido { font-weight: 650; color: var(--ct-accent); }
.ct-wrap .mem-linha.credito .num { color: var(--ct-ok); }
.ct-wrap .mem-linha.debito .num { color: var(--ct-ink); }
.ct-wrap .mem-linha.ok .num { color: var(--ct-ok); }
.ct-wrap .mem-linha.dif .num { color: var(--ct-crit); }
.ct-wrap .guia-edit { align-items: center; flex-wrap: wrap; }
.ct-wrap .guia-actions { display: flex; gap: 8px; align-items: center; }
.ct-wrap .guia-input { width: 110px; text-align: right; font-variant-numeric: tabular-nums; padding: 6px 8px; }
.ct-wrap .btn-save-guia { background: var(--ct-accent); color: #fff; border-color: var(--ct-accent); padding: 6px 10px; cursor: pointer; font-size: .85rem; }
.ct-wrap .resumo-bloco { background: var(--ct-card); border: 1px solid var(--ct-line); border-radius: 12px; padding: 14px 16px; margin-bottom: 16px; }
.ct-wrap .bloco-head { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; margin-bottom: 12px; }
.ct-wrap .bloco-head h3 { margin: 0; flex: 1; font-size: 1rem; }
.ct-wrap .bloco-head a { color: var(--ct-accent); font-size: .88rem; }

/* ============================================================
   F4: telas dos modulos. Um bloco por modulo; o que era <style>
   no template mora aqui. Cor e token (neutro, status ou serie).
   ============================================================ */

/* Acesso: grade da aba Acessos -- verde no que esta autorizado
   (owner, 2026-09-25), no mesmo tom das demais grades. */
#tblAcessos tbody tr.row-acesso-ok > td { background-color: color-mix(in srgb, var(--good) 16%, var(--surface)) !important; }
#tblAcessos tbody tr.row-acesso-ok:hover > td { background-color: color-mix(in srgb, var(--good) 22%, var(--surface)) !important; }

/* Cobranca */
#mdlHist .table { font-size: .85rem; }
#somaSelBox { min-width: 9rem; }
/* AJ-25: o dropdown de Relatorios fica na faixa acima da grade, que tem
   thead.sticky-top (z-index 1020 do Bootstrap) — maior que o do
   .dropdown-menu (1000) e por isso pintava por cima quando aberto. */
.dropdown-sobre-grade { z-index: 1030; }
/* Grade dos boletos: a leitura do legado (Cbr_Gestao,
   DBGridBoletosDrawColumnCell) — cinza o que voltou para a carteira, verde o
   liquidado, vermelho o vencido em aberto, branco o resto. A variante
   .row-selected mantem visivel o que esta marcado (regra 11). */
#tblBol tbody tr.row-bol-retornado > td { background-color: var(--surface-2) !important; color: var(--ink-3); }
#tblBol tbody tr.row-bol-retornado:hover > td { background-color: color-mix(in srgb, var(--line) 60%, var(--surface-2)) !important; }
#tblBol tbody tr.row-bol-retornado.row-selected > td { background-color: var(--line-2) !important; }
#tblBol tbody tr.row-bol-liquidado > td { background-color: color-mix(in srgb, var(--good) 16%, var(--surface)) !important; }
#tblBol tbody tr.row-bol-liquidado:hover > td { background-color: color-mix(in srgb, var(--good) 22%, var(--surface)) !important; }
#tblBol tbody tr.row-bol-liquidado.row-selected > td { background-color: color-mix(in srgb, var(--good) 32%, var(--surface)) !important; }
#tblBol tbody tr.row-bol-atrasado > td { background-color: color-mix(in srgb, var(--critical) 14%, var(--surface)) !important; }
#tblBol tbody tr.row-bol-atrasado:hover > td { background-color: color-mix(in srgb, var(--critical) 20%, var(--surface)) !important; }
#tblBol tbody tr.row-bol-atrasado.row-selected > td { background-color: color-mix(in srgb, var(--critical) 30%, var(--surface)) !important; }
/* Grade da carteira: a leitura do legado (DBGridCarteiraDrawColumnCell) —
   cinza o que esta em cobranca bancaria, verde o pago, branco o resto. La o
   atraso nao pinta a linha: pinta so a celula do vencimento, em vermelho com
   letra branca (a regra da celula vem depois, para vencer a da linha). */
#tblCart tbody tr.row-cart-bancaria > td { background-color: var(--surface-2) !important; color: var(--ink-3); }
#tblCart tbody tr.row-cart-bancaria:hover > td { background-color: color-mix(in srgb, var(--line) 60%, var(--surface-2)) !important; }
#tblCart tbody tr.row-cart-bancaria.row-selected > td { background-color: var(--line-2) !important; }
#tblCart tbody tr.row-cart-pago > td { background-color: color-mix(in srgb, var(--good) 16%, var(--surface)) !important; }
#tblCart tbody tr.row-cart-pago:hover > td { background-color: color-mix(in srgb, var(--good) 22%, var(--surface)) !important; }
#tblCart tbody tr.row-cart-pago.row-selected > td { background-color: color-mix(in srgb, var(--good) 32%, var(--surface)) !important; }
#tblCart tbody td.cel-vcto-atraso { background-color: var(--critical) !important; color: var(--bs-white); font-weight: 600; }
#tblCart tbody tr.row-selected > td.cel-vcto-atraso { background-color: color-mix(in srgb, var(--critical) 85%, var(--ink)) !important; }

/* Compras */
.chave-mono { font-family: monospace; font-size: .8rem; word-break: break-all; }
.chave-col { font-family: monospace; font-size: .75rem; }
.tbl-xml tbody td,
#tblParc input { font-size: .85rem; }
.card-xml { border-left: 3px solid var(--ink-3); }
.soma-ok { color: color-mix(in srgb, var(--good) 78%, var(--ink)); }
.soma-dif { color: color-mix(in srgb, var(--warning) 78%, var(--ink)); font-weight: 600; }
#tblNfe tbody tr.row-agendada td,
#tblCP tbody tr.row-liquidado td,
#tblCom tbody tr.row-cinza td { background: var(--surface-2); color: var(--ink-3); }

/* Contas a pagar */
#parcelas-grid th { font-size: 11px; text-transform: uppercase; color: var(--ink-3); }
#parcelas-grid td { vertical-align: middle; }
.liq-resumo { background: var(--surface-2); border-left: 4px solid var(--brasgelo-blue); }
.vlr-destaque { font-size: 1.4rem; font-weight: 700; color: var(--brasgelo-blue); }
#vlrDevido { font-size: 1.1rem; font-weight: 600; }
#tblCP tbody tr { cursor: default; }
#tblCP tbody tr.row-atrasado td { background: color-mix(in srgb, var(--warning) 16%, var(--surface)); }
#tblCP tbody tr:not(.row-liquidado):hover td { background: var(--accent-soft); }

/* Bens */
.aba-vazia { color: var(--ink-3); font-size: .85rem; }
#tblCom tbody tr.row-encerrado td { color: var(--ink-3); }
.num-col { text-align: right; font-family: var(--font-mono); font-variant-numeric: tabular-nums; }

/* Produtos */
#tblAliq { font-size: .85rem; }
#tblAliq .bp-campo { min-width: 9rem; }
#tblAliq input.aliq-num { width: 4.5rem; }
#tblAliq td { vertical-align: middle; white-space: nowrap; }

/* NF-e: linha liberada (amarelo do legado) e com XML; trilhos de largura propria */
.nfe-row-liberada { --bs-table-bg: color-mix(in srgb, var(--warning) 20%, var(--surface)); }
.mnf-row-xml { --bs-table-bg: color-mix(in srgb, var(--good) 12%, var(--surface)); }
.nfe-chk-td,
.mnf-chk-td,
.mdfe-chk-td { width: 2.2rem; text-align: center; }
.nfe-chk-td .chk-nfe,
.mnf-chk-td .chk-manif,
.mdfe-chk-td .chk-mdfe { cursor: pointer; }
.mnf-rail { width: 210px; flex: 0 0 210px; }
.mdfe-rail { width: 168px; flex: 0 0 168px; }

/* Atendimento: inbox (lista + conversa), etiqueta e previa de modelo */
.inbox-wrap { max-width: 1500px; }
/* Split ocupa a altura util da janela (adapta a qualquer tela) em vez de vh fixo. */
.inbox-split {
  height: calc(100dvh - 200px); min-height: 440px; overflow: hidden;
  border: 1px solid var(--line); border-radius: .375rem; background: var(--surface);
}
.inbox-list-pane { border-right: 1px solid var(--line); height: 100%; overflow-y: auto; background: var(--surface-2); }
.inbox-thread-pane { height: 100%; display: flex; flex-direction: column; background: var(--surface); min-height: 0; }
.inbox-thread-body { flex: 1; min-height: 0; }
.inbox-item { cursor: pointer; border-bottom: 1px solid var(--line); padding: .75rem 1rem; }
.inbox-item:hover { background: color-mix(in srgb, var(--accent-soft) 50%, var(--surface-2)); }
.inbox-item.active { background: var(--accent-soft); border-left: 3px solid var(--accent); }
.inbox-item .preview { color: var(--ink-3); font-size: .85rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.inbox-chat { flex: 1 1 auto; overflow-y: auto; padding: .75rem; background: var(--surface-2); min-height: 0; }
/* Acoes tem altura limitada e rolagem propria: nada e clipado pelo pane. */
.inbox-actions {
  border-top: 1px solid var(--line); padding: .75rem; background: var(--surface);
  flex: 0 0 auto; max-height: 55%; overflow-y: auto;
}
/* Resolver/Encerrar SEMPRE visivel: fixo no rodape do painel de acoes. */
.inbox-actions .resolver-pin {
  position: sticky; bottom: -.75rem; background: var(--surface); padding: .5rem 0 .25rem;
  margin-top: .25rem; box-shadow: 0 -6px 8px -6px rgba(0, 0, 0, .15); z-index: 3;
}
.inbox-empty { color: var(--ink-3); padding: 2rem 1rem; text-align: center; }
.inbox-row-click { cursor: pointer; }
@media (max-width: 767.98px) {
  .inbox-split { height: calc(100dvh - 150px); min-height: 70dvh; }
  .inbox-list-pane, .inbox-thread-pane { height: 100%; border-right: 0; }
  .inbox-split.mobile-thread .inbox-list-pane { display: none !important; }
  .inbox-split:not(.mobile-thread) .inbox-thread-pane { display: none !important; }
}
/* A cor vem da etiqueta (style de dado); sem cor, fica a da classe. */
.et-badge { background: var(--ink-3); }
.tpl-preview-fundo { background: color-mix(in srgb, var(--good) 12%, var(--surface)); }
.tpl-preview-corpo { white-space: pre-wrap; word-break: break-word; color: var(--ink); }
/* F5: com a Plex, o nome do modelo empurrava a grade 12px para fora em 1366 */
body:has(.tpl-preview-corpo) .table code { word-break: break-word; }

/* Assistencia tecnica: pagina avulsa, aberta pelo cliente (tema claro fixo) */
body.pg-astec { background: var(--surface-2); }
.pg-astec .header { background: var(--brasgelo-blue); color: #fff; padding: 1rem 0; margin-bottom: 1.5rem; }
.pg-astec .header h1 { font-size: 1.25rem; margin: 0; font-weight: 700; }
.pg-astec footer { text-align: center; padding: 1.5rem; color: var(--ink-3); font-size: .85rem; }

/* Contabilidade: modal de liquidacao (compacto para 1366x768) */
/* Compacto para 1366x768 — cabe com topbar + pouco scroll interno */
#ctbLiqModal .modal-dialog {
  max-width: min(820px, calc(100vw - 1rem));
  margin: .4rem auto;
}
#ctbLiqModal .modal-content {
  max-height: calc(100vh - .8rem);
}
#ctbLiqModal .modal-body {
  padding: .55rem .75rem;
  overflow-y: auto;
}
#ctbLiqModal .modal-header,
#ctbLiqModal .modal-footer {
  padding-top: .35rem;
  padding-bottom: .35rem;
}
#ctbLiqModal .ctb-liq-bloco {
  border: 1px solid var(--bs-border-color);
  border-radius: .25rem;
  padding: .4rem .55rem .5rem;
  margin-bottom: .45rem;
}
#ctbLiqModal .ctb-liq-sec {
  font-size: .65rem;
  font-weight: 600;
  letter-spacing: .04em;
  text-transform: uppercase;
  color: var(--bs-secondary-color);
  margin-bottom: .3rem;
}
#ctbLiqModal .form-label {
  margin-bottom: .1rem;
  font-size: .72rem;
}
#ctbLiqModal .form-control-sm,
#ctbLiqModal .form-select-sm {
  min-height: calc(1.4em + .4rem + 2px);
  padding-top: .15rem;
  padding-bottom: .15rem;
}
#ctbLiqModal .row.g-ctb { --bs-gutter-x: .45rem; --bs-gutter-y: .3rem; }
#ctbLiqModal .ctb-liq-grade-wrap {
  max-height: 6.5rem;
  overflow: auto;
  border: 1px solid var(--bs-border-color);
  border-radius: .25rem;
}
#ctbLiqModal .ctb-liq-grade-wrap table {
  font-size: .78rem;
  margin-bottom: 0;
}
#ctbLiqModal .ctb-liq-grade-wrap th {
  position: sticky;
  top: 0;
  background: var(--bs-tertiary-bg);
  z-index: 1;
  white-space: nowrap;
  font-size: .72rem;
}
#ctbLiqExtModal .modal-dialog {
  max-width: min(1100px, calc(100vw - 1rem));
  margin: .4rem auto;
}
#ctbLiqExtModal .modal-content {
  max-height: calc(100vh - .8rem);
}
#ctbLiqExtModal .modal-title {
  min-width: 0;
}
#ctbLiqExtModal .ctb-liq-ext-wrap {
  max-height: calc(100vh - 5.5rem);
  overflow: auto;
}

/* Contabilidade: consulta de recebimento, so leitura (50 Padrões/10 a-regra-da-tela.md, AJ-20) */
#ctbRecModal .modal-dialog {
  max-width: min(900px, calc(100vw - 1rem));
  margin: .4rem auto;
}
#ctbRecModal .modal-content { max-height: calc(100vh - .8rem); }
#ctbRecModal .modal-body { padding: .55rem .75rem; }
#ctbRecModal .modal-header,
#ctbRecModal .modal-footer { padding-top: .35rem; padding-bottom: .35rem; }
.rec-secao { margin-top: .6rem; }
#ctbRecModal .rec-tabela thead th { background: var(--surface-2); color: var(--ink-3); font-weight: 600; white-space: nowrap; }
.rec-explicacao {
  border-left: 3px solid var(--accent); background: var(--surface-2);
  padding: .45rem .75rem; border-radius: 0 8px 8px 0;
  font-size: 13px; color: var(--ink); line-height: 1.5;
}
.rec-explicacao p { margin: 0 0 .15rem; }
.rec-explicacao p:last-child { margin-bottom: 0; }
.rec-confere {
  margin-top: .5rem; padding: .4rem .7rem; border-radius: 6px;
  font-size: 13px; font-weight: 600;
}
.rec-lanc > summary { cursor: pointer; font-size: 12.5px; color: var(--ink-2); margin-bottom: .3rem; }

/* Financeiro: fluxo de caixa (grade, modal, grafico) */
#grade-wrap { overflow-x: auto; }
#grade-table { border-collapse: separate; border-spacing: 2px; min-width: 600px; width: 100%; font-size: 12px; }
#grade-table thead th {
  padding: 6px 10px; text-align: center; font-size: 10px; text-transform: uppercase;
  color: var(--ink-2); background: var(--surface-2); border-radius: 6px; white-space: nowrap; font-weight: 600;
}
#grade-table thead th.col-atras {
  background: color-mix(in srgb, var(--warning) 22%, var(--surface));
  color: color-mix(in srgb, var(--warning) 45%, var(--ink));
}
#grade-table thead th.col-hoje { background: var(--brasgelo-light); color: var(--brasgelo-blue); }
td.row-label {
  font-size: 11px; font-weight: 600; color: var(--ink-2); padding: 5px 10px;
  white-space: nowrap; background: var(--surface-2); border-radius: 6px; min-width: 130px;
}
td.cell-val {
  text-align: right; padding: 5px 10px; border-radius: 6px; background: var(--surface);
  white-space: nowrap; cursor: pointer; transition: .12s;
}
td.cell-val:hover { background: var(--accent-soft); box-shadow: 0 2px 6px rgba(0, 0, 0, .1); }
td.cell-val.vazio { color: var(--line-2); cursor: default; }
td.cell-val.vazio:hover { background: var(--surface); box-shadow: none; }
td.cell-carteira { border-left: 3px solid var(--chart-3); }
td.cell-boleto { border-left: 3px solid var(--chart-1); }
td.cell-vista { border-left: 3px solid var(--chart-7); }
td.cell-pagar { border-left: 3px solid var(--critical); }
td.cell-atras { background: color-mix(in srgb, var(--warning) 6%, var(--surface)); }
.cor-carteira { color: var(--chart-3); }
.cor-boleto { color: var(--chart-1); }
.cor-vista { color: var(--chart-7); }
.cor-pagar { color: var(--critical); }
tr.linha-sep td { padding: 0; height: 4px; background: transparent; }
tr.linha-saldo td.cell-val,
tr.linha-saldo td.cell-val:hover { background: var(--surface-2); cursor: default; font-weight: 600; box-shadow: none; }
tr.linha-saldo td.row-label { background: color-mix(in srgb, var(--line) 50%, var(--surface-2)); }
.saldo-pos { color: var(--brasgelo-blue); }
.saldo-neg { color: var(--critical); }
.cnt { font-size: 10px; color: var(--ink-3); margin-left: 4px; }
#modal-detalhe .modal-header { background: var(--brasgelo-blue); color: #fff; }
#modal-detalhe .modal-header .btn-close { filter: invert(1); }
#modal-thead th[data-col] { cursor: pointer; user-select: none; white-space: nowrap; }
#modal-thead th[data-col]:hover { background: var(--surface-2); }
.sort-ico { font-size: 10px; margin-left: 3px; }
/* Origem e prazo no detalhe: texto e fundo do mesmo token (como .st-*) */
.badge-origem {
  --o: var(--ink-3);
  font-size: 10px; padding: 2px 6px; border-radius: 4px; white-space: nowrap;
  color: color-mix(in srgb, var(--o) 78%, var(--ink));
  background: color-mix(in srgb, var(--o) 14%, var(--surface));
}
.badge-cp { --o: var(--accent); }
.badge-carteira { --o: var(--chart-3); }
.badge-boleto { --o: var(--chart-1); }
.badge-vista { --o: var(--chart-7); }
.badge-atrasado { --o: var(--critical); }
.badge-ok { --o: var(--good); }
.badge-hoje { --o: var(--warning); }
#toast-erro {
  position: fixed; bottom: 20px; left: 50%; transform: translateX(-50%);
  background: var(--critical); color: #fff; padding: 10px 20px; border-radius: 8px;
  font-size: 12px; z-index: 9999; display: none; box-shadow: 0 4px 12px rgba(0, 0, 0, .2);
}

/* Financeiro: extrato BB (lista e baixa) -- pilula de status e numero */
.ext-st {
  --o: var(--ink-3);
  display: inline-flex; align-items: center; gap: 6px;
  font-size: 12px; font-weight: 600; padding: 2px 8px;
  border-radius: 999px; border: 1px solid var(--bs-border-color);
  color: color-mix(in srgb, var(--o) 78%, var(--ink));
  background: color-mix(in srgb, var(--o) 12%, var(--surface));
}
.ext-st i { width: 8px; height: 8px; border-radius: 50%; display: inline-block; background: var(--o); }
.ext-st-sucesso { --o: var(--good); }
.ext-st-info { --o: var(--accent); }
.ext-st-atencao { --o: var(--warning); }
.ext-st-neutro { --o: var(--ink-3); }
.ext-num,
th.ext-num,
td.ext-num { font-variant-numeric: tabular-nums; text-align: right !important; white-space: nowrap; }
tr.ext-sel td { background: var(--accent-soft); }

/* Financeiro: creditos de clientes, pagina de impressao (tema claro fixo) */
body.pg-creditos { font-family: Arial, sans-serif; font-size: 11px; color: var(--ink); margin: 16px; background: #fff; }
.pg-creditos h1 { font-family: inherit; font-size: 16px; font-weight: 700; margin: 0 0 4px; }
.pg-creditos .meta { color: var(--ink-2); margin-bottom: 12px; }
.pg-creditos table { width: 100%; border-collapse: collapse; }
.pg-creditos th,
.pg-creditos td { border: 1px solid var(--line-2); padding: 3px 5px; }
.pg-creditos th { background: var(--surface-2); text-align: left; }
.pg-creditos .num { text-align: right; font-family: Consolas, monospace; }
@media print {
  body.pg-creditos { margin: 0; }
}

/* MDF-e: lista */
#gridMdfe tbody tr.mdfe-cstat-erro > td { background-color: color-mix(in srgb, var(--critical) 12%, var(--surface)) !important; }
#gridMdfe tbody tr.mdfe-cstat-erro:hover > td { background-color: color-mix(in srgb, var(--critical) 20%, var(--surface)) !important; }
#gridMdfe tbody tr.mdfe-cstat-erro.table-active { outline-color: var(--critical); }
#mdfeChecagens { font-size: 12px; max-height: 140px; overflow: auto; }
#mdfeChecagens .ok,
.mdfe-chk-ok { color: color-mix(in srgb, var(--good) 78%, var(--ink)); }
#mdfeChecagens .err,
.mdfe-chk-fail { color: var(--critical); }
#mdfeMunLista { max-height: 180px; overflow: auto; }
#mdfeMunLista button { font-size: 12px; }
.mdfe-nova-box { background: var(--surface-2); border-radius: 6px; padding: .6rem .75rem; }

/* MDF-e: previa da nova interface */
.mdfe-preview-banner {
  border: 1px dashed var(--brasgelo-blue); background: var(--brasgelo-light);
  padding: .6rem .85rem; margin-bottom: 1rem; font-size: .875rem;
}
body:has(.mdfe-preview-banner) .mdfe-nova-box { border: 1px solid var(--line); border-radius: .25rem; padding: .5rem .75rem; }
.mdfe-preview-state { display: none; }
.mdfe-preview-state.active { display: block; }

/* MDF-e: manual operacional, uma folha A4 (pagina avulsa, tema claro fixo) */
@page manual { size: A4 portrait; margin: 10mm; }
body.pg-manual {
  margin: 0; padding: 0; background: #fff; color: var(--ink);
  font-family: "Segoe UI", Calibri, Arial, sans-serif; font-size: 9.2pt; line-height: 1.28;
}
.pg-manual, .pg-manual * { box-sizing: border-box; }
.pg-manual .sheet { width: 190mm; min-height: 277mm; margin: 0 auto; padding: 0; page: manual; }
.pg-manual h1 {
  font-family: inherit; font-weight: 700; margin: 0 0 2mm; font-size: 14pt; letter-spacing: .02em;
  border-bottom: 2.5px solid var(--brasgelo-blue); padding-bottom: 1.5mm;
}
.pg-manual h1 span { font-weight: 400; font-size: 9pt; color: var(--ink-2); margin-left: 4mm; }
.pg-manual h2 {
  font-family: inherit; font-weight: 700; margin: 2.8mm 0 1.2mm; font-size: 9.5pt;
  color: var(--brasgelo-blue); text-transform: uppercase; letter-spacing: .04em;
}
.pg-manual p { margin: 0 0 1.4mm; }
.pg-manual ul, .pg-manual ol { margin: 0 0 1.5mm; padding-left: 4.5mm; }
.pg-manual li { margin-bottom: .6mm; }
.pg-manual .grid2 { display: grid; grid-template-columns: 1fr 1fr; gap: 3mm; }
.pg-manual .box {
  --o: var(--brasgelo-blue);
  border: 1px solid color-mix(in srgb, var(--o) 25%, #fff); border-radius: 2px;
  padding: 2mm 2.5mm; background: color-mix(in srgb, var(--o) 3%, #fff);
}
.pg-manual .box.warn { --o: var(--warning); background: color-mix(in srgb, var(--o) 10%, #fff); border-color: color-mix(in srgb, var(--o) 70%, #fff); }
.pg-manual .box.ok { --o: var(--good); background: color-mix(in srgb, var(--o) 7%, #fff); border-color: color-mix(in srgb, var(--o) 45%, #fff); }
.pg-manual .box strong.t { display: block; margin-bottom: .8mm; font-size: 9pt; color: color-mix(in srgb, var(--o) 60%, var(--ink)); }
.pg-manual .box:not(.warn):not(.ok) strong.t { color: var(--brasgelo-blue); }
.pg-manual .steps { counter-reset: passo; list-style: none; padding-left: 0; }
.pg-manual .steps li { position: relative; padding-left: 7mm; margin-bottom: 1.3mm; }
.pg-manual .steps li::before {
  counter-increment: passo; content: counter(passo);
  position: absolute; left: 0; top: 0; width: 4.5mm; height: 4.5mm; border-radius: 50%;
  background: var(--brasgelo-blue); color: #fff;
  font-size: 7.5pt; font-weight: 700; text-align: center; line-height: 4.5mm;
}
.pg-manual .fluxo {
  display: flex; align-items: center; justify-content: space-between;
  gap: 1mm; margin: 1.5mm 0 2mm; flex-wrap: nowrap;
}
.pg-manual .fluxo .p {
  flex: 1; text-align: center; border: 1px solid var(--brasgelo-blue); border-radius: 2px;
  padding: 1.2mm 1mm; font-size: 7.8pt; font-weight: 600; background: var(--brasgelo-light);
}
.pg-manual .fluxo .a { color: var(--brasgelo-blue); font-weight: 700; font-size: 11pt; flex: 0; }
.pg-manual table { width: 100%; border-collapse: collapse; font-size: 8.2pt; margin: 1mm 0 0; }
.pg-manual th,
.pg-manual td {
  border: 1px solid color-mix(in srgb, var(--brasgelo-blue) 25%, #fff);
  padding: 1mm 1.5mm; text-align: left; vertical-align: top;
}
.pg-manual th { background: var(--brasgelo-blue); color: #fff; font-weight: 600; }
.pg-manual .foot {
  margin-top: 2.5mm; padding-top: 1.5mm; border-top: 1px solid var(--line-2);
  font-size: 7.5pt; color: var(--ink-2); display: flex; justify-content: space-between;
}
.pg-manual .no-print { max-width: 190mm; margin: 8px auto 12px; text-align: center; }
.pg-manual .no-print button {
  font-size: 14px; padding: 8px 18px; cursor: pointer;
  background: var(--brasgelo-blue); color: #fff; border: 0; border-radius: 4px;
}
@media print {
  body.pg-manual { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
}

/* Gerenciamento Whats: cadastro (grade editavel de telefones) */
#tblCadWhats { table-layout: fixed; width: 100%; }
#tblCadWhats thead th { letter-spacing: .02em; padding: .35rem .45rem; line-height: 1.2; }
#tblCadWhats tbody td { padding: .3rem .45rem; line-height: 1.25; vertical-align: middle; }
#tblCadWhats th { overflow: hidden; resize: horizontal; min-width: 48px; }
#tblCadWhats td { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#tblCadWhats td.col-wrap { white-space: normal; }
#tblCadWhats .tel-cell { display: flex; align-items: center; gap: 2px; }
#tblCadWhats .tel-cell .inp-tel { flex: 1; min-width: 0; }
.btn-tel-del {
  border: none; background: transparent; color: var(--ink-3);
  font-size: 14px; line-height: 1; padding: 0 3px; cursor: pointer;
}
.btn-tel-del:hover { color: var(--critical); }
#tblCadWhats input.inp-tel {
  width: 100%; border: 1px solid var(--line); border-radius: 4px;
  padding: 2px 4px; font-size: inherit; background: var(--surface);
}
#tblCadWhats th.no-sort { cursor: default; resize: none; }
#tblCadWhats tbody tr.row-selected > td { background-color: var(--accent-soft) !important; }
#tblCadWhats tbody tr.row-formato-invalido > td { background-color: color-mix(in srgb, var(--warning) 16%, var(--surface)) !important; }
#tblCadWhats tbody tr.row-formato-invalido:hover > td { background-color: color-mix(in srgb, var(--warning) 26%, var(--surface)) !important; }
#tblCadWhats tbody tr.row-consentido > td { background-color: color-mix(in srgb, var(--good) 16%, var(--surface)) !important; }
#tblCadWhats tbody tr.row-consentido:hover > td { background-color: color-mix(in srgb, var(--good) 22%, var(--surface)) !important; }
#tblCadWhats tbody tr.row-normal > td { background-color: var(--surface) !important; }
#tblCadWhats input.inp-tel.tel-bloqueado,
#tblTel .inp-tel.tel-bloqueado { background-color: var(--surface-2) !important; cursor: not-allowed; }

/* Gerenciamento Whats: telefones e consentimento do cliente */
#tblTel .inp-tel { width: 100%; border: 1px solid var(--line); border-radius: 4px; padding: 2px 6px; font-size: inherit; }
#tblTel .inp-tel.tel-invalido,
#tblTel td.tel-invalido { background-color: color-mix(in srgb, var(--warning) 16%, var(--surface)) !important; }
body:has(#cliWhatsTopo) { background: var(--surface-2); }

/* Dashboards (financeiro, Whats e vendas): filtros e totais com filete de cor */
#fin-toolbar label,
#dw-toolbar label,
#vd-toolbar label { font-size: 12px; color: var(--ink-2); margin-bottom: 2px; display: block; }
/* F5: a rota se mede pela opcao mais longa; com a Plex empurrava Atualizar para baixo */
#dw-toolbar #sel-rota { max-width: 22rem; }
.dw-totais .card,
.vd-totais .card { border-left: 4px solid var(--line-2); }
.dw-totais .k-disparos,
.vd-totais .o1 { border-left-color: var(--ink-3); }
.dw-totais .k-nao_entregue { border-left-color: var(--critical); }
.dw-totais .k-entregue_nao_lido,
.vd-totais .o3 { border-left-color: var(--serious); }
.dw-totais .k-entregue_lido { border-left-color: var(--chart-1); }
.dw-totais .k-conversao,
.vd-totais .o4 { border-left-color: var(--good); }
.vd-totais .o2 { border-left-color: var(--chart-7); }
.dw-totais .n,
.vd-totais .n { font-size: 1.4rem; font-weight: 700; line-height: 1.2; }
.dw-totais .l,
.vd-totais .l { font-size: 11px; color: var(--ink-3); }

/* Gerenciamento Whats: log de envios */
#tblLogEnvios { font-size: 12.5px; }
#tblLogEnvios thead th { letter-spacing: .02em; padding: .35rem .45rem; white-space: nowrap; }
#tblLogEnvios tbody td { padding: .28rem .45rem; vertical-align: middle; }
#tblLogEnvios td.col-detalhe { max-width: 360px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#tblLogEnvios td.col-wamid {
  max-width: 150px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  font-family: monospace; font-size: 11px; color: var(--ink-3);
}
.badge-dir-saida { background: var(--chart-1); }
.badge-dir-callback,
.badge-tipo-I { background: var(--ink-3); }
.badge-dir-entrada { background: color-mix(in srgb, var(--chart-1) 45%, var(--surface)); color: var(--ink); }
.badge-tipo-E { background: var(--critical); }
.badge-tipo-W { background: var(--warning); color: #000; }

/* Gerenciamento Whats: Raio-X (tela e o canal embutido no inbox do SAC).
   Origem de cada evento: cliente, bot, operador, sistema, Meta. */
.rx-cartao .card-body { padding: .65rem .85rem; }
.rx-cartao .rx-fato-titulo {
  font-size: 10.5px; text-transform: uppercase; letter-spacing: .03em;
  color: var(--ink-3); margin-bottom: .15rem;
}
.rx-cartao .rx-fato-corpo { font-size: 13px; line-height: 1.3; }
.rx-cartao .rx-fato-corpo .text-muted.small { font-size: 11.5px; }
.rx-sinal { font-weight: 600; }
.rx-tempo-cartao { font-size: 10.5px; color: var(--ink-3); }
.rx-tl { list-style: none; padding-left: 0; margin: 0; }
.rx-tl > li { display: flex; gap: .75rem; }
.rx-tl .rx-hora {
  flex: 0 0 74px; text-align: right; font-variant-numeric: tabular-nums;
  font-size: 12px; color: var(--ink-3); padding-top: .85rem; white-space: nowrap;
}
.rx-tl .rx-trilho { flex: 0 0 14px; position: relative; display: flex; justify-content: center; }
.rx-tl .rx-trilho::before {
  content: ""; position: absolute; top: 0; bottom: 0; width: 1px; background: var(--line);
}
.rx-tl > li:first-child .rx-trilho::before { top: 1.1rem; }
.rx-tl > li:last-child .rx-trilho::before { bottom: calc(100% - 1.1rem); }
.rx-ponto {
  position: relative; width: 9px; height: 9px; border-radius: 50%;
  margin-top: 1.1rem; box-shadow: 0 0 0 3px var(--surface);
}
.rx-o-cliente { background: var(--chart-7); }
.rx-o-bot { background: var(--chart-1); }
.rx-o-operador { background: var(--chart-3); }
.rx-o-sistema { background: var(--chart-2); }
.rx-o-meta { background: var(--ink-3); }
.rx-card {
  flex: 1 1 auto; border: 1px solid var(--line); border-radius: .25rem;
  padding: .5rem .7rem; margin: .3rem 0; background: var(--surface);
}
.rx-card.rx-falha { border-left: 3px solid var(--critical); }
.rx-card.rx-lacuna { border-left: 3px solid var(--warning); }
.rx-corpo {
  font-size: 12.5px; border-left: 3px solid var(--line); padding-left: .6rem;
  margin: .35rem 0 0; white-space: pre-wrap;
}
.rx-confirm { margin-top: .4rem; font-size: 11.5px; color: var(--ink-3); }
.rx-confirm .badge { font-weight: 500; }
.rx-fonte { font-size: 11px; color: var(--ink-3); font-family: monospace; }
.rx-placar .card-body { padding: .6rem .8rem; }
.rx-placar .rx-n { font-size: 1.6rem; font-weight: 600; line-height: 1; }
.rx-canal-cap .card-header { background: var(--surface-2); }
.rx-canal-vazio { opacity: .72; }
#tblLogTecnico { font-size: 11.5px; }
#tblLogTecnico td { padding: .2rem .4rem; }
/* Impressao (botao Imprimir do CRM abre com ?print=1): so o relatorio. */
@media print {
  body:has(.rx-cartao) .card, .rx-cartao, body:has(.rx-cartao) table { break-inside: avoid; }
  .rx-secao h5 { break-after: avoid; }
}

/* Vendas: orcamento impresso -- rel. 103 do legado, duas vias por folha A4 deitada
   (papel: preto no branco). Cada objeto fica na coordenada do fr3
   (fr3/103_Ven_OrcamentoLoteA4.20260918.fr3): o px do FastReport (96 dpi) e o px
   do CSS. Area util 291 x 203 mm = 1099,84 x 767,24 px. Via esquerda de 0 a
   563,15; via direita de 566,93 (a divisoria dupla fica entre as duas), com as
   coordenadas relativas a cada via. O endereco e a unica peca em fluxo: quando
   quebra linha, o resto do cabecalho daquela via desce, como a banda esticavel
   do fr3. Corpo de letra = Font.Height do fr3 em px (papel: o 9px do endereco
   da empresa e excecao a letra minima, como no extrato impresso). */
@page orcamento { size: A4 landscape; margin: 5mm 2mm 2mm 4mm; }
.folha {
  page: orcamento;
  position: relative;
  box-sizing: content-box;
  width: 1099.84px;
  min-height: 767px;
  margin: 0 auto 12px;
  padding: 5mm 2mm 2mm 4mm;   /* as margens do papel, so na tela */
  background: #fff;
  color: #000;
  font-family: Arial, Helvetica, sans-serif;
  line-height: 1.15;
  border: 1px solid #ccc;
  overflow: hidden;           /* o fr3 corta na borda; sem isto o Chrome encolhe a folha */
}

/* Bandas: MasterData (cabecalho), DetailData (item), Footer1 (total + recibo/PIX) */
.orc-mestre, .orc-item, .orc-rodape, .orc-col, .orc-a, .orc-b { position: relative; }
.orc-mestre { display: flex; min-height: 336.38px; }
.orc-mestre .orc-esq { flex: 0 0 563.15px; }
.orc-mestre .orc-dir { flex: 0 0 532.91px; margin-left: 3.78px; }
.orc-esq .orc-a { height: 146.98px; }
.orc-dir .orc-a { height: 146.6px; }
.orc-esq .orc-b { height: 174.28px; }
.orc-dir .orc-b { height: 174.66px; }
.orc-item { height: 27.54px; }
.orc-rodape { height: 155.64px; }
.orc-item .orc-col, .orc-rodape .orc-col { position: absolute; top: 0; bottom: 0; }
.orc-item .orc-esq, .orc-rodape .orc-esq { left: 0; width: 563.15px; }
.orc-item .orc-dir, .orc-rodape .orc-dir { left: 566.93px; width: 532.91px; }

/* Divisoria dupla entre as vias (Line8/9, Line28/34, Line24/25 do fr3): uma
   peca so, da altura da folha -- so as margens do papel ficam de fora (owner,
   2026-09-26). Na tela a folha tem as margens como padding; no papel, zero. */
.orc-dupla {
  position: absolute;
  top: 5mm;
  bottom: 2mm;
  left: calc(4mm + 562.65px);
  width: 4.78px;
  box-sizing: border-box;
  border-left: 1px solid #000;
  border-right: 1px solid #000;
}

/* Memo do fr3: recuo 2px a esquerda/direita e 1px no topo (GapX/GapY), espaco
   duplo preservado, quebra de linha e corte na altura da caixa -- como o
   FastReport ("Cobranca bancaria:" e "Vlr Unitario:" saem cortados no legado
   e aqui tambem). Fogem a regra: endereco da empresa (WordWrap=False) e a
   assinatura, que cresce em vez de sair cortada ao meio. */
.o-m { position: absolute; box-sizing: border-box; padding: 1px 2px 0; white-space: pre-wrap; overflow: hidden; }
.o-emp { white-space: pre; line-height: 1.25; }
.o-assina { overflow: visible; }
.o-r { text-align: right; }
.o-b { font-weight: 700; }
/* no 9px e no 13px o GDI arredonda o avanco de cada letra para cima e o
   texto do fr3 sai ~3% mais largo que o do navegador: o .02em compensa
   (medido por sobreposicao com o PDF do legado; 11px e 12px ja batem) */
.folha .o-f9, .folha .o-f13 { letter-spacing: .02em; }
.folha .o-f9 { font-size: 9px; }
.folha .o-f11 { font-size: 11px; }
.folha .o-f12 { font-size: 12px; }
.folha .o-f13 { font-size: 13px; }
.folha .o-f16 { font-size: 16px; }
.o-l { position: absolute; height: 0; border-top: 1px solid var(--papel-linha); }
.o-l5, .o-l10 { border-top-color: var(--papel-linha-2); }
.o-logo, .o-pix-qr { position: absolute; object-fit: contain; }
.o-logo { object-position: left top; }
.o-end { box-sizing: border-box; min-height: 15.12px; padding: 1px 2px 0; white-space: pre-wrap; font-size: 11px; }
.orc-esq .o-end { width: 529.13px; }
.orc-dir .o-end { width: 491.34px; margin-left: 24.02px; }

/* MasterData, do topo ao endereco */
.orc-esq .o-logo { left: 3.78px; top: 0px; width: 151.18px; height: 64.25px; }
.orc-dir .o-logo { left: 24.02px; top: 0px; width: 151.18px; height: 64.25px; }
.orc-esq .o-emp { left: 3.78px; top: 68.97px; width: 315.87px; height: 26.34px; }
.orc-dir .o-emp { left: 24.02px; top: 68.97px; width: 315.87px; height: 26.34px; }
.orc-esq .o-orc-l { left: 311.86px; top: 0px; width: 113.39px; height: 22.68px; }
.orc-dir .o-orc-l { left: 290.18px; top: 0px; width: 113.39px; height: 22.68px; }
.orc-esq .o-orc-v { left: 397.13px; top: 0px; width: 137.72px; height: 22.68px; }
.orc-dir .o-orc-v { left: 375.45px; top: 0px; width: 137.72px; height: 22.68px; }
.orc-esq .o-vct-l { left: 238.03px; top: 25.17px; width: 187.21px; height: 22.68px; }
.orc-dir .o-vct-l { left: 216.35px; top: 25.17px; width: 187.21px; height: 22.68px; }
.orc-esq .o-vct-v { left: 425.24px; top: 25.17px; width: 109.61px; height: 22.68px; }
.orc-dir .o-vct-v { left: 403.57px; top: 25.17px; width: 109.61px; height: 22.68px; }
.orc-esq .o-emi-l { left: 234.91px; top: 49.69px; width: 190.33px; height: 15.12px; }
.orc-dir .o-emi-l { left: 213.23px; top: 49.69px; width: 190.33px; height: 15.12px; }
.orc-esq .o-emi-v { left: 448.72px; top: 49.69px; width: 86.13px; height: 15.12px; }
.orc-dir .o-emi-v { left: 427.05px; top: 49.69px; width: 86.13px; height: 15.12px; }
.orc-esq .o-l5 { left: 0px; top: 104.88px; width: 559.37px; }
.orc-dir .o-l5 { left: 26.46px; top: 104.88px; width: 506.46px; }
.orc-esq .o-cod { left: 0px; top: 108.21px; width: 37.8px; height: 18.9px; }
.orc-dir .o-cod { left: 24.02px; top: 107.83px; width: 37.8px; height: 18.9px; }
.orc-esq .o-nome { left: 38.13px; top: 108.21px; width: 491.34px; height: 18.9px; }
.orc-dir .o-nome { left: 62.15px; top: 107.83px; width: 491.34px; height: 18.9px; }
.orc-esq .o-cnpj { left: 0px; top: 129.72px; width: 491.34px; height: 15.12px; }
.orc-dir .o-cnpj { left: 24.02px; top: 129.34px; width: 491.34px; height: 15.12px; }
/* MasterData, abaixo do endereco (origem = fim do endereco) */
.orc-esq .o-cid { left: 0px; top: 0.88px; width: 491.34px; height: 15.12px; }
.orc-dir .o-cid { left: 24.02px; top: 0.87px; width: 491.34px; height: 15.12px; }
.orc-esq .o-fone { left: 0px; top: 16.49px; width: 491.34px; height: 15.12px; }
.orc-dir .o-fone { left: 24.02px; top: 16.87px; width: 491.34px; height: 15.12px; }
.orc-esq .o-l29 { left: 0px; top: 38.22px; width: 559.37px; }
.orc-dir .o-l29 { left: 26.46px; top: 38.6px; width: 506.46px; }
.orc-esq .o-cfop-l { left: 3.78px; top: 51.88px; width: 83.15px; height: 15.12px; }
.orc-dir .o-cfop-l { left: 24.02px; top: 52.26px; width: 83.15px; height: 15.12px; }
.orc-esq .o-cfop-v { left: 94.49px; top: 51.88px; width: 313.7px; height: 15.12px; }
.orc-dir .o-cfop-v { left: 113.38px; top: 52.26px; width: 313.7px; height: 15.12px; }
.orc-esq .o-l31 { left: 0px; top: 68.45px; width: 559.37px; }
.orc-dir .o-l31 { left: 25.49px; top: 68.83px; width: 453.54px; }
.orc-esq .o-nfe-l { left: 3.78px; top: 70.02px; width: 83.15px; height: 15.12px; }
.orc-dir .o-nfe-l { left: 24.02px; top: 70.4px; width: 83.15px; height: 15.12px; }
.orc-esq .o-nfe-v { left: 94.49px; top: 70.02px; width: 79.37px; height: 15.12px; }
.orc-dir .o-nfe-v { left: 113.38px; top: 70.4px; width: 79.37px; height: 15.12px; }
.orc-esq .o-l30 { left: 0px; top: 87.35px; width: 559.37px; }
.orc-dir .o-l30 { left: 25.49px; top: 87.73px; width: 453.54px; }
.orc-esq .o-ped-l { left: 3.78px; top: 88.17px; width: 83.15px; height: 15.12px; }
.orc-dir .o-ped-l { left: 24.02px; top: 88.55px; width: 83.15px; height: 15.12px; }
.orc-esq .o-ped-v { left: 94.49px; top: 88.17px; width: 313.7px; height: 15.12px; }
.orc-dir .o-ped-v { left: 113.38px; top: 88.55px; width: 313.7px; height: 15.12px; }
.orc-esq .o-l32 { left: 0px; top: 105.47px; width: 559.37px; }
.orc-dir .o-l32 { left: 25.49px; top: 105.85px; width: 453.54px; }
.orc-esq .o-cob-l { left: 3.78px; top: 106.32px; width: 83.15px; height: 15.12px; }
.orc-dir .o-cob-l { left: 24.02px; top: 106.7px; width: 83.15px; height: 15.12px; }
.orc-esq .o-cob-v { left: 94.49px; top: 106.32px; width: 120.94px; height: 15.12px; }
.orc-dir .o-cob-v { left: 113.38px; top: 106.7px; width: 120.94px; height: 15.12px; }
.orc-esq .o-l33 { left: 0px; top: 123.36px; width: 559.37px; }
.orc-dir .o-l33 { left: 25.49px; top: 123.74px; width: 453.54px; }
.orc-esq .o-lote-l { left: 3.78px; top: 125.14px; width: 83.15px; height: 15.12px; }
.orc-dir .o-lote-l { left: 24.02px; top: 125.52px; width: 83.15px; height: 15.12px; }
.orc-esq .o-lote-v { left: 94.49px; top: 125.14px; width: 359.06px; height: 15.12px; }
.orc-dir .o-lote-v { left: 113.38px; top: 125.52px; width: 359.06px; height: 15.12px; }
.orc-esq .o-l7 { left: 0px; top: 144.04px; width: 559.37px; }
.orc-dir .o-l7 { left: 26.46px; top: 144.42px; width: 506.46px; }
.orc-esq .o-h-prod { left: 3.78px; top: 152.39px; width: 70.49px; height: 15.12px; }
.orc-dir .o-h-prod { left: 21.71px; top: 152.77px; width: 70.49px; height: 15.12px; }
.orc-esq .o-h-qtd { left: 204.75px; top: 152.39px; width: 84.4px; height: 15.12px; }
.orc-dir .o-h-qtd { left: 183.07px; top: 152.77px; width: 84.4px; height: 15.12px; }
.orc-esq .o-h-vu { left: 344.44px; top: 152.39px; width: 60.49px; height: 15.12px; }
.orc-dir .o-h-vu { left: 341.44px; top: 152.77px; width: 60.49px; height: 15.12px; }
.orc-esq .o-h-tot { left: 486.9px; top: 152.39px; width: 43.49px; height: 15.12px; }
.orc-dir .o-h-tot { left: 474.32px; top: 152.77px; width: 43.49px; height: 15.12px; }
.orc-esq .o-l6 { left: 0px; top: 170.5px; width: 559.37px; }
.orc-dir .o-l6 { left: 26.46px; top: 170.88px; width: 506.46px; }
/* DetailData */
.orc-esq .o-i-prod { left: 0px; top: 2.5px; width: 164.39px; height: 15.12px; }
.orc-dir .o-i-prod { left: 21.71px; top: 2.5px; width: 164.39px; height: 15.12px; }
.orc-esq .o-i-qtd { left: 242.67px; top: 2.5px; width: 42.7px; height: 15.12px; }
.orc-dir .o-i-qtd { left: 220.99px; top: 2.5px; width: 42.7px; height: 15.12px; }
.orc-esq .o-i-vu { left: 336.9px; top: 2.5px; width: 64.25px; height: 15.12px; }
.orc-dir .o-i-vu { left: 333.89px; top: 2.5px; width: 64.25px; height: 15.12px; }
.orc-esq .o-i-tot { left: 466.13px; top: 2.5px; width: 64.25px; height: 15.12px; }
.orc-dir .o-i-tot { left: 453.56px; top: 2.5px; width: 64.25px; height: 15.12px; }
.orc-esq .o-l10 { left: 0px; top: 20.46px; width: 559.37px; }
.orc-dir .o-l10 { left: 26.46px; top: 20.68px; width: 506.46px; }
/* Footer1 */
.orc-esq .o-t-l { left: 328.24px; top: 4.24px; width: 72.91px; height: 15.12px; }
.orc-dir .o-t-l { left: 325.24px; top: 4.24px; width: 72.91px; height: 15.12px; }
.orc-esq .o-t-v { left: 424.56px; top: 4.24px; width: 105.83px; height: 15.12px; }
.orc-dir .o-t-v { left: 411.98px; top: 4.24px; width: 105.83px; height: 15.12px; }
.orc-esq .o-decl { left: 11.34px; top: 45.35px; width: 461.1px; height: 15.12px; }
.orc-esq .o-assina { left: 105.83px; top: 105.83px; width: 332.6px; }
/* QR do Pix 8% maior e o rotulo ABAIXO dele (owner, 2026-09-26).
   O fr3 punha "Pague com PIX:" a esquerda do QR e a caixa em 49x38 mm
   (185,2 x 143,62 px). Como o QR e quadrado com object-fit: contain, a ALTURA
   e que limitava: sobravam 41,58 px de largura e so 7,56 px de altura na banda.
   Crescer 8% (143,62 -> 155,11) passa 3,93 px da banda, e o rotulo abaixo passa
   mais 20 -- cabe porque a folha tem 767 px e as bandas somam
   336,38 + 27,54 x itens + 155,64: com 7 itens (o maximo real da base, em 5 de
   196.768 orcamentos) ainda sobram 82 px no pe. O ponto de ruptura e 10 itens,
   que nao existe hoje -- e ali a folha corta, como o fr3 corta.
   Ganho: o modulo impresso vai de 0,58 mm para 0,63 mm, que e o que decide se o
   celular le. O PNG nasce com 390 px, entao continua sendo REDUZIDO: nao estica. */
.orc-dir .o-pix-qr { left: 133.25px; top: 4.46px; width: 185.2px; height: 155.11px; }
/* centralizado sob o QR: a mesma caixa horizontal, para o texto ficar no eixo
   do desenho (o QR fica centrado nos 185,2 px pelo object-fit) */
.orc-dir .o-pix-l { left: 133.25px; top: 160.5px; width: 185.2px; height: 15.12px;
                    text-align: center; }

/* PageFooter1: no pe da folha; data/hora de cada via e "Via Cliente".
   A hora da via direita fica ao lado da data (no fr3 ela esta 32px para a
   esquerda e cai em cima da data). */
.o-pe {
  position: absolute;
  left: 4mm;
  right: 2mm;
  bottom: 2mm;
  height: 26.46px;
  border-top: 1px solid var(--papel-linha);
}
.o-pe-dt-e { left: 0; top: 3.78px; width: 79.37px; height: 18.9px; }
.o-pe-hr-e { left: 79.37px; top: 3.78px; width: 49.13px; height: 18.9px; }
.o-pe-dt-d { left: 598.64px; top: 3.78px; width: 79.37px; height: 18.9px; }
.o-pe-hr-d { left: 678.01px; top: 3.78px; width: 49.13px; height: 18.9px; }
.o-pe-via { left: 1029.51px; top: 7.76px; width: 70.49px; height: 15.12px; }

@media print {
  .folha {
    width: auto;
    margin: 0;
    padding: 0;
    border: none;
    break-after: page;
  }
  .folha:last-child { break-after: auto; }
  .o-pe { left: 0; right: 0; bottom: 0; }
  .orc-dupla { top: 0; bottom: 0; left: 562.65px; }
}

/* Vendas: previa do lote, A4 em letra grande (papel: preto no branco) */
@page previa { size: A4 portrait; margin: 12mm; }
.rel-wrap.a4 {
  page: previa;
  max-width: 210mm;
  margin: 0 auto;
  padding: 12mm 14mm;
  background: #fff;
  color: #000;
  font-family: Arial, Helvetica, sans-serif;
  box-sizing: border-box;
}

.prev-titulo {
  text-align: center;
  font-size: 22pt;
  font-weight: 700;
  background: #e9ecef;
  border: 1px solid #bbb;
  padding: 8px 10px;
  margin: 0 0 14mm;
}

.prev-meta {
  font-size: 16pt;
  line-height: 1.55;
  margin-bottom: 10mm;
}
.prev-meta .lbl { display: inline-block; min-width: 4.5em; }

.prev-itens {
  width: 100%;
  border-collapse: collapse;
  font-size: 18pt;
  line-height: 1.35;
}
.prev-itens thead th {
  border-top: 1.5px solid #000;
  border-bottom: 1.5px solid #000;
  padding: 4px 2px 6px;
  font-weight: 400;
  font-size: 18pt;
}
.prev-itens th.prod, .prev-itens td.prod { text-align: left; }
.prev-itens th.qtd, .prev-itens td.qtd { text-align: right; width: 28%; }
.prev-itens tbody td {
  padding: 8px 2px;
  border-bottom: 1px dotted #666;
  vertical-align: top;
}
.prev-itens tbody tr:last-child td { border-bottom: none; }

.prev-rodape {
  margin-top: 18mm;
  padding-top: 4px;
  border-top: 1px solid #000;
  font-size: 14pt;
}

@media print {
  .rel-wrap.a4 { max-width: 100%; margin: 0; padding: 0; }
}

@media screen {
  .rel-wrap.a4 { border: 1px solid #ccc; min-height: 260mm; }
}

/* Cobranca: orcamento assinado (2026-10-02, owner) -- clone do rel. 103 com a
   assinatura do recebedor no app, para provar a entrega; impresso pela Carteira.
   Nao e reproducao de .fr3: uma via por folha, A4 retrato, em fluxo, no papel da
   previa (.rel-wrap.a4). O 103 (.folha, .o-*) nao muda. Norma: 50 Padrões/00-indice,
   "Impressao". */
.oa-folha { font-size: 12px; line-height: 1.3; }
.oa-cab {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 12px;
  padding-bottom: 8px;
  border-bottom: 1px solid var(--papel-linha);
}
.oa-emp { display: flex; flex-direction: column; gap: 4px; }
.oa-logo { width: 151px; height: 64px; object-fit: contain; object-position: left top; }
.rel-wrap.a4 .oa-emp-txt { font-size: 9px; letter-spacing: .02em; }   /* papel: o 9px do 103 */
.oa-num { text-align: right; font-size: 13px; }
.oa-num-v { font-size: 16px; font-weight: 700; margin-bottom: 4px; }
.oa-cliente { padding: 8px 0; border-bottom: 1px solid var(--papel-linha); }
.oa-cli-nome { font-size: 13px; font-weight: 700; }
.oa-dados {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 2px 16px;
  padding: 8px 0;
  border-bottom: 1px solid var(--papel-linha);
}
.oa-lbl { font-weight: 700; }
.oa-itens { width: 100%; border-collapse: collapse; margin-top: 10px; }
.oa-itens th { text-align: left; font-weight: 700; padding: 3px 2px; border-bottom: 1px solid #000; }
.oa-itens td { padding: 4px 2px; border-bottom: 1px solid var(--papel-linha-2); }
.oa-itens .oa-n { text-align: right; white-space: nowrap; }
.oa-itens tfoot td { font-size: 13px; font-weight: 700; border-top: 1px solid #000; border-bottom: none; }
.oa-receb { margin-top: 24px; text-align: center; break-inside: avoid; }
.oa-ass-img { display: block; max-width: 320px; max-height: 130px; margin: 8px auto 0; object-fit: contain; }
.oa-ass-vazia { margin: 28px auto 8px; font-style: italic; }
.oa-ass-linha { width: 340px; margin: 4px auto 0; padding-top: 3px; border-top: 1px solid #000; }
.oa-pe { margin-top: 16px; font-size: 11px; text-align: right; }

@media print {
  .oa-folha { break-after: page; }
  .oa-folha:last-child { break-after: auto; }
}

@media screen {
  .oa-folha { margin-bottom: 12px; }
}

/* Vendas: gestao de lotes -- linhas, menu de fases e trilho recolhivel */
#tblLotes tbody tr.lote-row,
#tblConc tbody tr.orc-row,
#tblFat tbody tr.orc-row { cursor: pointer; }
#tblConc tbody tr.row-conciliado > td { background-color: color-mix(in srgb, var(--good) 16%, var(--surface)) !important; }
/* conciliacao (2026-10-01): a linha marcada usa o fundo de selecionado da norma
   (regra 11); conciliada e marcada escurece o verde, para nao sumir a marca. */
#tblConc tbody tr.row-conciliado:hover > td { background-color: color-mix(in srgb, var(--good) 22%, var(--surface)) !important; }
#tblConc tbody tr.row-conciliado.row-selected > td { background-color: color-mix(in srgb, var(--good) 32%, var(--surface)) !important; }
/* lotes (owner, 2026-09-24): fechado verde; fechado e conciliado cinza; aberto branco */
#tblLotes tbody tr.row-lote-fechado > td { background-color: color-mix(in srgb, var(--good) 16%, var(--surface)) !important; }
#tblLotes tbody tr.row-lote-fechado:hover > td { background-color: color-mix(in srgb, var(--good) 22%, var(--surface)) !important; }
#tblLotes tbody tr.row-lote-conciliado > td { background-color: color-mix(in srgb, var(--ink-3) 26%, var(--surface)) !important; }
#tblLotes tbody tr.row-lote-conciliado:hover > td { background-color: color-mix(in srgb, var(--ink-3) 34%, var(--surface)) !important; }
#tblLotes tbody tr.row-lote-selecionada > td { outline: 2px solid var(--brasgelo-blue); outline-offset: -2px; }
/* faturamento: orcamento faturado (st_faturado = 1) em verde, como as outras grades de lote (2026-09-29) */
#tblFat tbody tr.row-faturado > td { background-color: color-mix(in srgb, var(--good) 16%, var(--surface)) !important; }
#tblFat tbody tr.row-faturado:hover > td { background-color: color-mix(in srgb, var(--good) 22%, var(--surface)) !important; }
/* faturamento: varias linhas marcadas (2026-09-29) -- fundo de selecionado da norma, nao contorno por celula */
#tblFat tbody tr.row-sel > td { background-color: var(--accent-soft) !important; }
#tblFat tbody tr.row-faturado.row-sel > td { background-color: color-mix(in srgb, var(--good) 30%, var(--surface)) !important; }
#menuLote .list-group-item[aria-disabled="true"] { color: var(--ink-3); background-color: transparent; cursor: not-allowed; }
#menuLote .menu-lote-ico { line-height: 1; text-decoration: none; box-shadow: none !important; }
#menuLote .menu-lote-ico:hover,
#menuLote .menu-lote-ico:focus { color: var(--bs-primary); }
/* ~60% da antiga col-4 (~20% da linha); filtros ficam fora, full-width */
#lotesMenuCol {
  flex: 0 0 20%; max-width: 20%; width: 20%;
  transition: flex-basis .2s ease, max-width .2s ease, width .2s ease;
}
#lotesListaCol { flex: 1 1 0; max-width: 80%; min-width: 0; }
/* Toggle: mesmos icones da sidebar (bi-list / bi-layout-sidebar-inset) */
#menuLoteToggle {
  background: none; border: 0; padding: .15rem .25rem;
  line-height: 1; font-size: 1.25rem; color: inherit; cursor: pointer;
}
#menuLoteToggle .bi-layout-sidebar-inset,
#lotesLayout.menu-collapsed #menuLoteToggle .bi-list { display: none; }
#lotesLayout.menu-collapsed #menuLoteToggle .bi-layout-sidebar-inset { display: inline-block; }
/* Trilho colapsado: so icones */
#lotesLayout.menu-collapsed #lotesListaCol { max-width: calc(100% - 3.5rem); }
#lotesLayout.menu-collapsed #lotesMenuCol { flex: 0 0 3.25rem; max-width: 3.25rem; width: 3.25rem; }
#lotesLayout.menu-collapsed #menuLote .card-header { justify-content: center; padding: .45rem .2rem; }
#lotesLayout.menu-collapsed #menuLote .menu-lote-titulo,
#lotesLayout.menu-collapsed #menuLote .menu-lote-meta,
#lotesLayout.menu-collapsed #menuLote .menu-lote-sec,
#lotesLayout.menu-collapsed #menuLote .menu-lote-label,
#lotesLayout.menu-collapsed #menuLote input[type="date"],
#lotesLayout.menu-collapsed #menuLote .menu-lote-ok { display: none !important; }
#lotesLayout.menu-collapsed #menuLote .card-body { padding: .3rem .15rem; }
#lotesLayout.menu-collapsed #menuLote .list-group-item {
  position: relative; justify-content: center; gap: 0; padding: .55rem .15rem; border: 0;
}
#lotesLayout.menu-collapsed #menuLote .list-group-item > i,
#lotesLayout.menu-collapsed #menuLote .menu-lote-ico { margin: 0; font-size: 1.1rem; }
/* Hover no trilho: tip com o rotulo a esquerda */
#lotesLayout.menu-collapsed #menuLote .list-group-item[data-tip]:hover::after {
  content: attr(data-tip); position: absolute; right: calc(100% + 6px); top: 50%;
  transform: translateY(-50%); white-space: nowrap;
  background: var(--ink); color: var(--surface);
  font-size: .75rem; font-weight: 600; padding: .3rem .55rem; border-radius: 6px;
  z-index: 1080; pointer-events: none; box-shadow: 0 2px 8px rgba(0, 0, 0, .2);
}
@media (max-width: 991.98px) {
  #lotesListaCol, #lotesMenuCol,
  #lotesLayout.menu-collapsed #lotesListaCol,
  #lotesLayout.menu-collapsed #lotesMenuCol { flex: 0 0 100%; max-width: 100%; width: 100%; }
  #lotesLayout.menu-collapsed #menuLote .card-header { justify-content: space-between; padding: .5rem 1rem; }
  #lotesLayout.menu-collapsed #menuLoteBody { display: none; }
  #lotesLayout.menu-collapsed #menuLote .list-group-item[data-tip]:hover::after { display: none; }
}

/* Vendas: conciliacao */
#tblConc td { vertical-align: top; }
#painelTotais .tot-label { font-size: .75rem; color: var(--ink-3); display: block; }
#painelTotais .tot-valor { font-variant-numeric: tabular-nums; font-weight: 600; font-size: 1rem; }

/* Vendas: grade do lote (clientes, telefones e orcamento) */
#tblClientes { table-layout: fixed; width: 100%; }
#tblClientes .form-check-input:not(:checked) { border: 2px solid var(--ink-3); background-color: var(--surface); }
#tblClientes .form-check-input:checked { border-width: 2px; }
#tblClientes td { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#tblClientes td.col-wrap { white-space: normal; }
#tblClientes td.col-telefones { white-space: normal; overflow: visible; vertical-align: middle; }
#tblClientes .tel-linha { line-height: 1.35; padding: 1px 3px; border-radius: 2px; display: block; }
#tblClientes .tel-linha.tel-ok { background-color: color-mix(in srgb, var(--good) 16%, var(--surface)); }
#tblClientes .tel-linha.tel-sem-consent { background-color: color-mix(in srgb, var(--critical) 16%, var(--surface)); }
#tblClientes .tel-linha.tel-invalido { background-color: color-mix(in srgb, var(--warning) 16%, var(--surface)); }
#tblClientes tbody tr.row-orc .tel-linha.tel-ok,
#tblClientes tbody tr.row-orc .tel-linha.tel-sem-consent,
#tblClientes tbody tr.row-orc .tel-linha.tel-invalido,
#tblClientes tbody tr.row-hoje-nao:not(.row-orc) .tel-linha.tel-ok,
#tblClientes tbody tr.row-hoje-nao:not(.row-orc) .tel-linha.tel-sem-consent,
#tblClientes tbody tr.row-hoje-nao:not(.row-orc) .tel-linha.tel-invalido { background-color: transparent; }
#tblClientes tbody tr.row-orc > td { background-color: color-mix(in srgb, var(--good) 16%, var(--surface)) !important; }
#tblClientes tbody tr.row-orc:hover > td { background-color: color-mix(in srgb, var(--good) 22%, var(--surface)) !important; }
#tblClientes tbody tr.row-orc.row-selected > td { background-color: color-mix(in srgb, var(--good) 30%, var(--surface)) !important; }
#tblClientes tbody tr.row-hoje-nao:not(.row-orc) > td { background-color: color-mix(in srgb, #000 30%, var(--surface-2)) !important; }
#tblClientes tbody tr.row-hoje-nao:not(.row-orc):hover > td { background-color: color-mix(in srgb, var(--line) 60%, color-mix(in srgb, #000 30%, var(--surface-2))) !important; }
#tblClientes tbody tr.row-hoje-nao:not(.row-orc).row-selected > td { background-color: var(--line-2) !important; }
#tblClientes tbody tr.row-selected:not(.row-orc):not(.row-hoje-nao) > td { background-color: var(--accent-soft) !important; }
#tblClientes td.col-orcamento { cursor: pointer; text-decoration: underline; text-decoration-style: dotted; }
#tblClientes td.col-orcamento.no-orc { cursor: not-allowed; text-decoration: none; opacity: .65; }
/* #ctxMenu saiu (2026-09-29): o menu da grade do lote usa .menu-contexto. */
#modalPainelFrame { width: 100%; border: none; display: block; }

/* Vendas: inclusao de orcamento */
#tblProd td { vertical-align: middle; }
#tblProd input.qtd { max-width: 5.5rem; }
#tblProd input.preco { max-width: 6.5rem; }
.aba-painel { display: none; }
.aba-painel.ativa { display: block; }
.card-inc .form-label { font-size: .75rem; margin-bottom: .15rem; }
.card-inc .form-control-sm, .card-inc .form-control { font-size: .875rem; }

/* Vendas: relatorio de lotes impresso */
.lotes-tbl { width: 100%; border-collapse: collapse; font-size: 11px; }
.lotes-tbl th { background: var(--surface-2); text-align: left; padding: 4px 8px; border-bottom: 1px solid var(--line-2); }
.lotes-tbl td { padding: 4px 8px; border-bottom: 1px solid var(--line); }
/* nowrap: 'R$' e o valor ficavam em linhas separadas quando a coluna
   apertava (owner, 2026-09-26) */
.lotes-tbl .num { text-align: right; white-space: nowrap; }
.lotes-tbl tfoot td { font-weight: 700; border-top: 1px solid var(--ink); padding-top: 6px; }

/* Simulador de conversa Whats (teste de fluxo) */
.msg-out { background: color-mix(in srgb, var(--good) 22%, var(--surface)); border-radius: 8px; padding: 8px 12px; margin: 4px 0 4px 20%; }
.msg-in { background: var(--surface); border: 1px solid var(--line); border-radius: 8px; padding: 8px 12px; margin: 4px 20% 4px 0; }
.msg-meta { font-size: 10px; color: var(--ink-3); }
.chat-box { max-height: 420px; overflow-y: auto; background: var(--surface-2); padding: 12px; border-radius: 8px; }
pre.msg-body { white-space: pre-wrap; margin: 0; font-family: inherit; font-size: 13px; }
/* F5: com a Plex, os quatro botoes do menu de pre-venda nao cabiam numa linha em 1366 */
body:has(.chat-box) form > .d-flex > .btn { font-size: 12.5px; padding-inline: .5rem; }

/* Expedicao: mapa de hoje (tela cheia dentro do shell) */
/* Tela cheia dentro do shell: sem padding nem rodapé do .bg-main */
body:has(.mh) .bg-main { padding: 0; }
body:has(.mh) .bg-main > .bg-footer { display: none; }

.mh {
  --parado: #8a97a1; --radius: 10px;
  --shadow: 0 1px 2px rgba(16,24,32,.06), 0 8px 24px -18px rgba(16,24,32,.5);
  height: calc(100vh - var(--bg-top-h));
  display: grid; grid-template-rows: auto 1fr auto;
  background: var(--bg); color: var(--ink); font-size: 13px; line-height: 1.4;
}
:root[data-theme="dark"] .mh { --parado: #5d6b76; --shadow: 0 1px 2px rgba(0,0,0,.5), 0 10px 30px -20px rgba(0,0,0,.9); }
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) .mh { --parado: #5d6b76; --shadow: 0 1px 2px rgba(0,0,0,.5), 0 10px 30px -20px rgba(0,0,0,.9); }
}
.mh .mono { font-family: var(--font-mono); font-variant-numeric: tabular-nums; }
.mh button { font: inherit; color: inherit; cursor: pointer; }

/* topo */
.mh-top { display: flex; align-items: center; gap: 16px; padding: 8px 14px; background: var(--surface); border-bottom: 1px solid var(--line); }
.mh-top h1 { font-size: 15px; margin: 0; font-weight: 700; }
.mh-top .sub { color: var(--ink-3); font-size: 11.5px; }
.mh-kpis { display: flex; gap: 6px; margin-left: auto; flex-wrap: wrap; }
.mh-kpi { display: flex; align-items: baseline; gap: 6px; padding: 4px 9px; border: 1px solid var(--line); border-radius: 8px; background: var(--surface-2); }
.mh-kpi b { font: 600 14px var(--font-mono); }
.mh-kpi span { color: var(--ink-2); font-size: 11px; }
.mh-kpi i { width: 8px; height: 8px; border-radius: 50%; align-self: center; }
.mh-vivo { display: flex; align-items: center; gap: 7px; padding: 4px 10px; border-radius: 999px; border: 1px solid var(--line-2); background: var(--surface-2); font-weight: 600; white-space: nowrap; font-size: 12px; }
.mh-vivo .pulso { width: 8px; height: 8px; border-radius: 50%; background: var(--ink-3); }
.mh.live .mh-vivo .pulso { background: var(--critical); animation: mhPulso 1.6s infinite; }
.mh.erro .mh-vivo .pulso { background: var(--serious); animation: none; }
.mh.passado .mh-vivo .pulso { background: var(--ink-3); animation: none; }
@keyframes mhPulso { 0% { box-shadow: 0 0 0 0 color-mix(in srgb, var(--critical) 60%, transparent); } 100% { box-shadow: 0 0 0 9px transparent; } }

/* corpo */
.mh-corpo { display: grid; grid-template-columns: 290px 1fr; min-height: 0; }
.mh-lista { overflow-y: auto; background: var(--surface); border-right: 1px solid var(--line); padding: 6px 8px 16px; }
.mh-grupo { font-size: 10.5px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--ink-3); margin: 10px 6px 6px; display: flex; justify-content: space-between; }
.mh-card { display: block; width: 100%; text-align: left; border: 1px solid var(--line); background: var(--surface); border-radius: var(--radius);
           padding: 8px 10px 8px 12px; margin-bottom: 6px; border-left: 4px solid var(--cor, var(--line-2)); }
.mh-card:hover { background: var(--surface-2); }
.mh-card.sel { outline: 2px solid var(--accent); outline-offset: -1px; background: var(--accent-soft); }
.mh-card .l1 { display: flex; align-items: center; gap: 6px; }
.mh-card .nome { font-weight: 600; flex: 1; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mh-card .l2 { color: var(--ink-2); font-size: 11.5px; margin-top: 2px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mh-card .l3 { display: flex; align-items: center; gap: 8px; margin-top: 6px; font-size: 11.5px; }
.mh-barra { flex: 1; height: 5px; border-radius: 3px; background: var(--line); overflow: hidden; }
.mh-barra > div { height: 100%; background: var(--cor, var(--accent)); }
.mh-alerta { margin-top: 6px; font-size: 11.5px; padding: 5px 7px; border-radius: 6px; background: color-mix(in srgb, var(--warning) 16%, transparent); }
.mh-alerta ul { margin: 2px 0 0; padding-left: 15px; }
.mh-vazio-lista { color: var(--ink-3); padding: 20px 10px; text-align: center; }

.mh-chip { font-size: 10.5px; font-weight: 600; padding: 1px 7px; border-radius: 999px; white-space: nowrap; border: 1px solid transparent; }
.st-rota    { background: color-mix(in srgb, var(--good) 15%, transparent); color: color-mix(in srgb, var(--good) 75%, var(--ink)); }
.st-parado  { background: var(--surface-2); color: var(--ink-2); border-color: var(--line-2); }
.st-sinal   { background: color-mix(in srgb, var(--serious) 18%, transparent); color: color-mix(in srgb, var(--serious) 70%, var(--ink)); }
.st-sinal2  { background: color-mix(in srgb, var(--critical) 16%, transparent); color: color-mix(in srgb, var(--critical) 80%, var(--ink)); }
.st-atencao { background: color-mix(in srgb, var(--warning) 22%, transparent); color: color-mix(in srgb, var(--warning) 45%, var(--ink)); }
.st-pend    { background: color-mix(in srgb, var(--warning) 10%, transparent); color: color-mix(in srgb, var(--warning) 50%, var(--ink)); border-color: color-mix(in srgb, var(--warning) 45%, transparent); }
.st-aguard  { background: var(--surface-2); color: var(--ink-3); border-color: var(--line); }
.st-fim     { background: var(--accent-soft); color: var(--accent); }

.mh-mapa { position: relative; min-height: 0; }
#mhMap { position: absolute; inset: 0; background: var(--bg); }

.mh-det { position: absolute; top: 10px; right: 10px; bottom: 10px; width: 290px; z-index: 500; background: var(--surface);
          border: 1px solid var(--line); border-radius: 12px; box-shadow: var(--shadow); display: flex; flex-direction: column; overflow: hidden; }
.mh-det[hidden] { display: none; }
.mh-det .topo { padding: 11px 14px 10px; border-bottom: 1px solid var(--line); border-top: 4px solid var(--cor); }
.mh-det .x { float: right; border: 0; background: none; font-size: 18px; line-height: 1; color: var(--ink-3); }
.mh-det h2 { margin: 0; font-size: 15px; font-weight: 700; }
.mh-det .meta { color: var(--ink-2); font-size: 11.5px; margin-top: 2px; }
.mh-nums { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; background: var(--line); border-bottom: 1px solid var(--line); }
.mh-nums div { background: var(--surface); padding: 7px 10px; }
.mh-nums b { display: block; font: 600 14px var(--font-mono); }
.mh-nums span { color: var(--ink-3); font-size: 10.5px; }
.mh-paradas { overflow-y: auto; flex: 1; padding: 4px 0 10px; }
.mh-paradas h3 { font-size: 10.5px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--ink-3); margin: 10px 14px 4px; }
.mh-pa { display: grid; grid-template-columns: 16px 1fr auto; gap: 8px; align-items: start; padding: 5px 14px; font-size: 12px; }
.mh-pa:hover { background: var(--surface-2); }
.mh-pa .m { width: 10px; height: 10px; border-radius: 50%; margin-top: 3px; border: 2px solid var(--cor); }
.mh-pa.ok .m { background: var(--cor); }
.mh-pa.av .m { border-radius: 2px; transform: rotate(45deg); width: 9px; height: 9px; }
.mh-pa.nao .m { background: var(--critical); border-color: var(--critical); }
.mh-pa.pend { color: var(--ink-2); }
.mh-av-marca {
  width: 10px; height: 10px; margin: -5px 0 0 -5px; transform: rotate(45deg);
  background: var(--surface); border: 2.5px solid var(--cor);
}
.mh-pa .v { text-align: right; color: var(--ink-2); font-size: 11px; }
.mh-pa .c { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mh-vazio { color: var(--ink-3); padding: 6px 14px; font-size: 12px; }

/* marcadores */
.mh-veic { position: relative; }
.mh-veic .dot { position: absolute; left: -9px; top: -9px; width: 18px; height: 18px; border-radius: 50%; background: var(--c); border: 3px solid var(--bs-white); box-shadow: 0 1px 4px rgba(0,0,0,.45); }
.mh-veic.live .dot::after { content: ""; position: absolute; inset: -3px; border-radius: 50%; animation: mhPulsoV 1.8s infinite; }
@keyframes mhPulsoV { 0% { box-shadow: 0 0 0 0 color-mix(in srgb, var(--c) 70%, transparent); } 100% { box-shadow: 0 0 0 16px transparent; } }
.mh-veic.stale .dot { background: var(--surface); border-color: var(--c); border-style: dashed; }
.mh-veic .lbl { position: absolute; left: 13px; top: -10px; white-space: nowrap; font: 600 11px system-ui, sans-serif; background: var(--surface); color: var(--ink);
                border: 1px solid var(--line-2); border-left: 3px solid var(--c); padding: 1px 6px; border-radius: 5px; box-shadow: 0 1px 3px rgba(0,0,0,.2); }
.mh-veic.dim { opacity: .3; }
.mh-base { width: 26px; height: 26px; margin: -13px 0 0 -13px; border-radius: 6px; background: var(--ink); color: var(--surface); display: grid; place-items: center;
           font: 700 10px system-ui, sans-serif; box-shadow: 0 1px 4px rgba(0,0,0,.4); }
.mh .leaflet-tooltip { font-size: 12px; background: var(--surface); color: var(--ink); border-color: var(--line-2); }

.mh-legenda { position: absolute; left: 10px; bottom: 10px; z-index: 500; background: var(--surface); border: 1px solid var(--line); border-radius: 8px;
              padding: 5px 10px; font-size: 11px; color: var(--ink-2); display: flex; gap: 12px; box-shadow: var(--shadow); }
.mh-legenda span { display: inline-flex; align-items: center; gap: 5px; }
.lg-dot { width: 9px; height: 9px; border-radius: 50%; background: var(--ink-2); }
.lg-oco { width: 9px; height: 9px; border-radius: 50%; border: 2px solid var(--ink-2); }
.lg-av  { width: 8px; height: 8px; border: 2px solid var(--ink-2); transform: rotate(45deg); }
.lg-base { width: 10px; height: 10px; border-radius: 2px; background: var(--ink); }
.mh-rastro { position: absolute; left: 10px; top: 10px; z-index: 500; display: flex; background: var(--surface); border: 1px solid var(--line); border-radius: 8px; overflow: hidden; box-shadow: var(--shadow); }
.mh-rastro button { border: 0; background: none; padding: 5px 10px; font-size: 11.5px; color: var(--ink-2); }
.mh-rastro button.on { background: var(--accent-soft); color: var(--accent); font-weight: 600; }
.mh .leaflet-top.leaflet-left { top: 40px; }

/* linha do tempo */
.mh-tempo { display: flex; align-items: center; gap: 12px; padding: 7px 14px; background: var(--surface); border-top: 1px solid var(--line); }
.mh-play { width: 32px; height: 32px; border-radius: 50%; border: 0; background: var(--accent); color: var(--surface); display: grid; place-items: center; }
.mh-vel { border: 1px solid var(--line); background: var(--surface-2); color: var(--ink); border-radius: 6px; padding: 4px 6px; }
.mh-relogio { font: 600 17px var(--font-mono); min-width: 60px; }
.mh-trilho { flex: 1; }
.mh-trilho input { width: 100%; accent-color: var(--accent); margin: 0; }
.mh-marcas { display: flex; justify-content: space-between; color: var(--ink-3); font-size: 10.5px; margin-top: 1px; }
.mh-btn-vivo { border: 1px solid var(--line-2); background: var(--surface-2); border-radius: 8px; padding: 6px 12px; font-weight: 600; }
.mh.live .mh-btn-vivo { background: var(--accent); border-color: var(--accent); color: var(--surface); }

/* Expedicao: relatorio de entrega por cliente (papel: preto no branco) */
.grupo-titulo {
  background: #0d47a1; color: #fff; font-weight: 700;
  padding: 8px 14px; margin: 0 0 6px 0; font-size: 14px;
  letter-spacing: 1px; border-radius: 4px;
}

.bloco-cliente {
  border: 1px solid #333;
  margin-bottom: 10px;
  padding: 8px 12px;
  font-size: 11px;
  line-height: 1.35;
  page-break-inside: avoid;
  background: #fff;
  box-sizing: border-box;
  display: flex; flex-direction: column;
}

.bc-header {
  border-bottom: 1px solid #999; padding-bottom: 3px; margin-bottom: 6px;
  font-size: 10px; color: #333; display: flex; justify-content: space-between;
}

.bc-sec { padding: 5px 0; border-bottom: 1px dashed #bbb; }
.bc-sec:last-child { border-bottom: none; }

.bc-ident { display: flex; justify-content: space-between; font-weight: 600; }
.bc-ident .lbl { color: #666; font-weight: 400; font-size: 10px; }

.bc-cliente .nome { font-size: 13px; font-weight: 700; }
.bc-cliente .end  { color: #444; }
.bc-cliente .lbl  { color: #666; font-size: 10px; }

.bc-oper span { display: inline-block; margin-right: 14px; }
.bc-oper .lbl { color: #666; font-size: 10px; }

.bc-prod-table { width: 100%; border-collapse: collapse; font-size: 11px; }
.bc-prod-table th { background: #f0f0f0; text-align: left; padding: 3px 6px; border-bottom: 1px solid #999; }
.bc-prod-table td { padding: 3px 6px; border-bottom: 1px solid #eee; }
.bc-prod-table .num { text-align: right; }
.bc-prod-table tfoot td { font-weight: 700; border-top: 1px solid #333; border-bottom: none; padding-top: 5px; }

.bc-receb { display: flex; justify-content: space-between; align-items: flex-end; }
.bc-receb .info { font-size: 11px; }
.bc-receb .lbl { color: #666; font-size: 10px; }
.bc-receb .ass-img {
  max-height: 50px; max-width: 220px;
  border: 1px solid #ddd; background: #fafafa;
}

.bc-motivo {
  background: #fff3cd; border: 1px solid #ffc107;
  padding: 8px 12px; font-weight: 600; color: #856404;
  text-align: center; font-size: 13px;
}

@page entrega { size: A4 portrait; margin: 1cm; }
body:has(.bloco-cliente) .rel-wrap { page: entrega; }
@media print {
  .grupo-titulo { page-break-after: avoid; }
}

/* Expedicao: painel de expedicoes */
.linha2-disabled { opacity: .4; pointer-events: none; }
#tblExpedicoes tbody tr[data-tela] { cursor: pointer; }
#tblExpedicoes tbody tr[data-tela]:hover { background-color: var(--accent-soft); }
#tblExpedicoes tbody tr.row-fechada td, #tblExpedicoes tbody tr.row-encerrada td { background-color: color-mix(in srgb, var(--good) 12%, var(--surface)); }
#tblExpedicoes tbody tr.row-fechada:hover td, #tblExpedicoes tbody tr.row-encerrada:hover td { background-color: color-mix(in srgb, var(--good) 22%, var(--surface)); }
#tblExpedicoes tbody tr.row-na-rua td { background-color: color-mix(in srgb, var(--warning) 14%, var(--surface)); } /* Logistica: iniciada e em entrega */
#tblExpedicoes tbody tr.row-na-rua:hover td { background-color: color-mix(in srgb, var(--warning) 24%, var(--surface)); }

/* Expedicao — Financeiro e fechamento automatico (grade por lote) */
#secFinanceiro .tbl-fin-lote tbody tr.row-fin-ok td, #secPreFechamento .tbl-fin-lote tbody tr.row-fin-ok td{
  background-color: color-mix(in srgb, var(--good) 12%, var(--surface));
}
#secFinanceiro .tbl-fin-lote tbody tr.row-fin-alerta td, #secPreFechamento .tbl-fin-lote tbody tr.row-fin-alerta td{
  background-color: color-mix(in srgb, var(--warning) 14%, var(--surface));
}
#secFinanceiro .lote-fin, #secPreFechamento .lote-fin{ border-left: 3px solid var(--ink-3); padding-left: .5rem; }
#secFinanceiro .lote-fin.lote-fin-ok, #secPreFechamento .lote-fin.lote-fin-ok{ border-left-color: var(--good); }
#secFinanceiro .lote-fin.lote-fin-alerta, #secPreFechamento .lote-fin.lote-fin-alerta{ border-left-color: var(--warning); }
#secFinanceiro .avista-ok .num, #secPreFechamento .avista-ok .num{ color: var(--good); }
#secFinanceiro .avista-dif .num, #secPreFechamento .avista-dif .num{ color: var(--warning); }
#secFinanceiro input.avista-ok, #secPreFechamento input.avista-ok{ border-color: var(--good); }
#secFinanceiro input.avista-dif, #secPreFechamento input.avista-dif{ border-color: var(--warning); }
/* Label a esquerda, valor a direita do label (mesma linha). */
#secFinanceiro .fin-val, #secPreFechamento .fin-val{
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  gap: .5rem;
}
#secFinanceiro .fin-val .nota, #secPreFechamento .fin-val .nota,
#secFinanceiro .fin-val .form-label, #secPreFechamento .fin-val .form-label{
  flex: 0 0 auto;
  margin-bottom: 0;
  white-space: nowrap;
  text-align: left;
}
#secFinanceiro .fin-val .num, #secPreFechamento .fin-val .num,
#secFinanceiro .fin-val input.num, #secPreFechamento .fin-val input.num,
#secFinanceiro .fin-val .form-select, #secPreFechamento .fin-val .form-select{
  flex: 0 0 auto;
  width: 7.5rem;
  min-width: 7.5rem;
  text-align: right;
}
#secFinanceiro .fin-val .form-select, #secPreFechamento .fin-val .form-select{ text-align: left; }
#secFinanceiro .tbl-fin-prod th.num, #secPreFechamento .tbl-fin-prod th.num,
#secFinanceiro .tbl-fin-prod td.num, #secPreFechamento .tbl-fin-prod td.num,
#secFinanceiro .tbl-fin-lote th.num, #secPreFechamento .tbl-fin-lote th.num,
#secFinanceiro .tbl-fin-lote td.num, #secPreFechamento .tbl-fin-lote td.num{
  text-align: right;
}
#secFinanceiro .btn-conciliar-orc, #secPreFechamento .btn-conciliar-orc{ padding: .1rem .35rem; font-size: 11px; line-height: 1.2; }
#secFinanceiro .mini-produtos, #secPreFechamento .mini-produtos,
#secFinanceiro .mini-fin, #secPreFechamento .mini-fin{
  border-left: 3px solid var(--ink-3);
  padding-left: .5rem;
}
#secFinanceiro .mini-fin, #secPreFechamento .mini-fin{ border-left-color: var(--ink-2); }
#secFinanceiro .mini-produtos.prod-ok, #secPreFechamento .mini-produtos.prod-ok{ border-left-color: var(--good); }
#secFinanceiro .mini-produtos.prod-dif, #secPreFechamento .mini-produtos.prod-dif{ border-left-color: var(--warning); }
#secFinanceiro .fin-sub, #secPreFechamento .fin-sub{
  border-left: 3px solid var(--good);
  padding-left: .5rem;
}
#abaRetorno .card-toggle-seta {
  color: inherit;
  font-size: inherit;
  line-height: inherit;
  border: 0;
  box-shadow: none;
}
#abaRetorno .card-toggle-seta:hover,
#abaRetorno .card-toggle-seta:focus {
  color: var(--ink);
}
#abaRetorno .card-toggle-icos .bi-chevron-down { display: none; }
#abaRetorno .card-toggle-seta[aria-expanded="false"] .bi-chevron-up { display: none; }
#abaRetorno .card-toggle-seta[aria-expanded="false"] .bi-chevron-down { display: inline; }
#secFinanceiro .tbl-fin-prod tbody tr.row-prod-ok td, #secPreFechamento .tbl-fin-prod tbody tr.row-prod-ok td{
  background-color: color-mix(in srgb, var(--good) 12%, var(--surface));
}
#secFinanceiro .tbl-fin-prod tbody tr.row-prod-dif td, #secPreFechamento .tbl-fin-prod tbody tr.row-prod-dif td{
  background-color: color-mix(in srgb, var(--warning) 14%, var(--surface));
}
#listaCascataPassos li { margin-bottom: .25rem; }
#tblExpedicoes tbody tr.row-selected td { background-color: var(--accent-soft); }

/* Expedicao: processamento */
.ico-ok-grande { font-size: 48px; color: var(--good); }

/* Expedicao: mapa de uma expedicao (Google Maps) */
#map { height: calc(100vh - 200px); border-radius: 12px; box-shadow: 0 2px 8px rgba(0, 0, 0, .1); }
.map-info { background: var(--surface); border-radius: 12px; padding: 16px; box-shadow: 0 2px 8px rgba(0, 0, 0, .06); margin-bottom: 16px; }
.map-legend { display: flex; gap: 20px; flex-wrap: wrap; }
.legend-item { display: flex; align-items: center; gap: 6px; font-size: 12px; }
.legend-dot { width: 12px; height: 12px; border-radius: 50%; }
.legend-dot.mapa-transito { background: var(--chart-1); }
.legend-dot.mapa-entrega { background: var(--good); }
.legend-dot.mapa-nao-entregue { background: var(--critical); }
.legend-dot.mapa-avulsa { background: var(--warning); }
.info-window { font-size: 12px; line-height: 1.6; }
.info-window strong,
#stats .stat strong { color: var(--brasgelo-blue); }
#stats { display: flex; gap: 16px; flex-wrap: wrap; }
#stats .stat { background: var(--surface-2); padding: 8px 16px; border-radius: 8px; font-size: 12px; }
.controls { display: flex; gap: 8px; margin-bottom: 8px; }

/* Expedicao: listas de entregas e recebimentos */
.exp-header {
  background: var(--brasgelo-blue); color: #fff; padding: 6px 14px;
  border-radius: 6px; margin-bottom: 8px; font-weight: 600; font-size: .95rem;
}
.rota-header {
  background: var(--brasgelo-light); border-left: 3px solid var(--brasgelo-blue);
  padding: 4px 10px; font-size: .85rem; font-weight: 600; margin-bottom: 4px;
}
.exp-subheader {
  background: var(--brasgelo-light); padding: 3px 10px; font-size: .82rem; font-weight: 600;
  border-bottom: 1px solid var(--line); color: var(--brasgelo-blue);
}
.exp-selo { background: var(--brasgelo-light); font-size: .95rem; }
.assinatura-img { max-height: 40px; }
tfoot.total-rota td { background: var(--surface-2); font-weight: 600; }
@media print {
  .exp-header, .rota-header { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  body:has(.exp-bloco) a.btn { display: none !important; }
  .exp-bloco { page-break-inside: avoid; }
}

/* Inicio (painel de modulos) */
.landing-wrap { max-width: 1200px; margin: 0 auto; }
.landing-header { margin-bottom: 1.25rem; }
.landing-title { font-size: 1.125rem; font-weight: 600; margin: 0; }
.landing-subtitle { font-size: .8125rem; color: var(--ink-3); margin: .25rem 0 0; }
.module-grid {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 280px));
  gap: 1rem; justify-content: start; align-items: start;
}
.module-card {
  width: 280px; min-height: 200px; max-height: 220px;
  display: flex; flex-direction: column; align-items: center; text-align: center; padding: 1.25rem;
}
.module-card .icon { font-size: 2rem; line-height: 1; margin-bottom: .75rem; }
.module-card .icon--blue { color: var(--brasgelo-blue); }
.module-card .icon--green,
.module-card .icon--success { color: var(--good); }
.module-card .icon--muted { color: var(--ink-3); }
.module-card .title { font-size: .9375rem; font-weight: 600; margin: 0 0 .375rem; }
.module-card .desc {
  font-size: .8125rem; color: var(--ink-3); margin: 0 0 .75rem; line-height: 1.35;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.module-card .btn { margin-top: auto; }
.module-card--disabled { opacity: .55; }
.module-card--disabled:hover { box-shadow: 0 2px 8px rgba(0, 0, 0, .06); }
.module-card--atendimento { border: 1px solid var(--good); }
@media (max-width: 575px) {
  .module-grid { grid-template-columns: 1fr; justify-items: center; }
  .module-card { width: 100%; max-width: 280px; }
}

/* Login (pagina avulsa, tema claro fixo) */
html:has(> body.pg-login) { font-size: 16px; } /* a pagina nunca teve a raiz de 15px */
body.pg-login {
  background: linear-gradient(135deg, var(--brasgelo-blue) 0%, var(--brasgelo-dark) 100%);
  min-height: 100vh; display: flex; align-items: center; justify-content: center;
}
.pg-login .login-card {
  background: #fff; border-radius: 16px; padding: 40px;
  box-shadow: 0 20px 60px rgba(0, 0, 0, .3); max-width: 400px; width: 100%;
}
.pg-login .login-logo { text-align: center; margin-bottom: 30px; }
.pg-login .login-logo i { font-size: 48px; color: var(--brasgelo-blue); }
.pg-login .login-logo h1 { font-size: 23px; font-weight: 700; color: var(--brasgelo-blue); margin-top: 8px; }
.pg-login .login-logo p { color: var(--ink-3); font-size: 13px; }
.pg-login .form-control { border-radius: 10px; padding: 12px 16px; border: 2px solid var(--line); }
.pg-login .form-control:focus { border-color: var(--brasgelo-blue); box-shadow: 0 0 0 3px rgba(13, 71, 161, .15); }
.pg-login .btn-login {
  background: var(--brasgelo-blue); border: none; border-radius: 10px;
  padding: 12px; font-size: 15px; font-weight: 600; width: 100%;
}
.pg-login .btn-login:hover { background: var(--brasgelo-dark); }

/* Pagina publica do dominio (sem Bootstrap; tema claro fixo) */
body.pg-landing { --landing-navy: #003366; margin: 0; font-family: Arial, sans-serif; background: #fff; }
.pg-landing .top-bar {
  background: var(--landing-navy); height: 60px; display: flex;
  justify-content: flex-end; align-items: center; padding: 0 20px;
  box-shadow: 0 2px 4px rgba(0, 0, 0, .1);
}
.pg-landing .intranet-btn {
  background: #fff; color: var(--landing-navy); padding: 10px 16px; border-radius: 8px;
  text-decoration: none; font-weight: bold; display: inline-flex; align-items: center; gap: 8px;
}
.pg-landing .intranet-btn:hover { background: var(--line); }
.pg-landing .intranet-btn svg { width: 18px; height: 18px; fill: currentColor; }
.pg-landing .main-banner { display: flex; justify-content: center; align-items: center; padding: 40px 0; }
.pg-landing .main-banner img { max-width: 100%; height: auto; border-radius: 12px; box-shadow: 0 4px 12px rgba(0, 0, 0, .1); }
.pg-landing .rodape {
  background: var(--surface-2); color: var(--ink); text-align: center; padding: 15px 10px;
  font-size: 14px; border-top: 1px solid var(--line);
}
@media (max-width: 600px) { .pg-landing .rodape { font-size: 13px; padding: 12px 8px; } }

/* Termos, privacidade e exclusao de dados (paginas publicas, tema claro fixo) */
body.pg-legal {
  --legal-text: #1e293b; --legal-text-2: #475569; --legal-border: #e2e8f0;
  font-family: 'Segoe UI', Tahoma, sans-serif; color: var(--legal-text);
  background: #f5f7fa; margin: 0; line-height: 1.65;
}
.pg-legal .legal-nav {
  background: linear-gradient(145deg, var(--brasgelo-dark) 0%, var(--brasgelo-blue) 100%);
  color: #fff; padding: 14px 0;
}
.pg-legal .legal-nav a { color: rgba(255, 255, 255, .85); text-decoration: none; }
.pg-legal .legal-nav a:hover { color: #fff; }
.pg-legal .legal-nav .brand { font-weight: 700; color: #fff; }
.pg-legal .legal-wrap { max-width: 720px; margin: 0 auto; padding: 40px 20px 64px; }
.pg-legal .legal-card {
  background: #fff; border: 1px solid var(--legal-border); border-radius: 12px;
  padding: 36px 40px; box-shadow: 0 4px 24px rgba(13, 71, 161, .06);
}
.pg-legal .legal-card h1 { font-size: 1.75rem; font-weight: 700; color: var(--brasgelo-dark); margin-bottom: 8px; }
.pg-legal .legal-meta {
  font-size: .875rem; color: var(--legal-text-2); margin-bottom: 28px;
  padding-bottom: 20px; border-bottom: 1px solid var(--legal-border);
}
.pg-legal .legal-card h2 { font-size: 1.1rem; font-weight: 600; margin-top: 28px; margin-bottom: 10px; color: var(--brasgelo-blue); }
.pg-legal .legal-card p,
.pg-legal .legal-card li { font-size: .95rem; color: var(--legal-text-2); }
.pg-legal .legal-card ul { padding-left: 1.25rem; }
.pg-legal .legal-card a { color: var(--brasgelo-blue); }
.pg-legal .legal-footer { text-align: center; font-size: .8rem; color: var(--legal-text-2); margin-top: 32px; }
.pg-legal .legal-footer a { color: var(--brasgelo-blue); margin: 0 8px; }
@media (max-width: 576px) { .pg-legal .legal-card { padding: 24px 20px; } }

/* Intranet instalavel (F6, D13): convite no computador. Norma: 50 Padrões/10 a-regra-da-tela.md */
.bg-pwa-convite {
  position: fixed; right: 1rem; bottom: 1rem; z-index: 1040; max-width: 22rem;
  background: var(--surface); color: var(--ink); border: 1px solid var(--line);
  border-radius: var(--radius); box-shadow: 0 8px 24px rgba(0, 0, 0, .18); padding: .75rem .9rem;
}
.bg-pwa-convite p { font-size: 12.5px; color: var(--ink-2); margin: .2rem 0 .6rem; }

/* Gelo — assistente flutuante. Norma: 50 Padrões/10 a-regra-da-tela.md, secao Gelo. */
.gelo-root {
  position: fixed; right: 1rem; bottom: 1rem; z-index: 1060;
  font-family: var(--font-sans);
}
.gelo-root.gelo-sobe { bottom: 11rem; }
.gelo-fab {
  width: 64px; height: 64px; padding: 0; border-radius: 50%; cursor: pointer;
  border: 2px solid var(--accent); background: var(--accent-soft);
  box-shadow: 0 8px 24px rgba(0, 0, 0, .18);
  display: flex; align-items: center; justify-content: center; overflow: hidden;
  /* entrada ao carregar a pagina: sobe, da um balanco e para (so CSS, uma vez) */
  animation: gelo-entrada 1.2s cubic-bezier(.2, .8, .3, 1) 1 both;
}
.gelo-fab:hover { transform: translateY(-2px); }
@keyframes gelo-entrada {
  0%   { transform: translateY(90px) scale(.7); opacity: 0; }
  55%  { transform: translateY(-10px) rotate(-8deg); opacity: 1; }
  72%  { transform: translateY(0) rotate(7deg); }
  86%  { transform: rotate(-4deg); }
  100% { transform: none; }
}
@media (prefers-reduced-motion: reduce) { .gelo-root .gelo-fab { animation: none; } }
.gelo-fab-img { width: 118%; height: 118%; object-fit: cover; object-position: center 42%; display: block; }
.gelo-panel {
  position: absolute; right: 0; bottom: 76px;
  width: min(22rem, calc(100vw - 2rem));
  height: min(26rem, calc(100vh - 7.5rem));
  background: var(--surface); color: var(--ink);
  border: 1px solid var(--line); border-radius: var(--radius);
  box-shadow: 0 16px 48px rgba(0, 0, 0, .18);
  display: flex; flex-direction: column; overflow: hidden;
}
.gelo-panel[hidden] { display: none !important; }
/* Ampliar: botao do cabecalho alterna .gelo-grande; cabe na janela 1333x595 (altura segue 100vh) */
.gelo-panel.gelo-grande {
  width: min(46rem, calc(100vw - 2rem));
  height: min(44rem, calc(100vh - 7.5rem));
}
.gelo-panel.gelo-grande .gelo-msg { font-size: 14px; max-width: 88%; }
.gelo-panel-head {
  display: flex; align-items: center; justify-content: space-between; gap: 10px;
  padding: 12px 14px; background: var(--bg-topbar-bg); color: var(--bg-topbar-fg);
}
.gelo-panel-brand { display: flex; align-items: center; gap: 10px; min-width: 0; }
.gelo-panel-brand img {
  width: 36px; height: 36px; border-radius: 50%; object-fit: cover; object-position: center 42%;
  background: var(--accent-soft);
}
.gelo-panel-brand strong { display: block; font-family: var(--font-titulo); font-size: 15px; }
.gelo-panel-sub { display: block; font-size: 11px; opacity: .85; }
.gelo-panel-acoes { display: flex; align-items: center; gap: 2px; }
.gelo-close, .gelo-ampliar, .gelo-limpar {
  border: none; background: transparent; color: var(--bg-topbar-fg);
  width: 36px; height: 36px; border-radius: 8px; cursor: pointer;
}
.gelo-close:hover, .gelo-ampliar:hover, .gelo-limpar:hover { background: var(--bg-user-hover); }
.gelo-messages {
  flex: 1; overflow-y: auto; padding: 14px;
  display: flex; flex-direction: column; gap: 10px; background: var(--bg);
}
.gelo-msg {
  max-width: 92%; padding: 10px 12px; border-radius: var(--radius);
  font-size: 13px; line-height: 1.45; white-space: pre-wrap;
}
.gelo-msg-bot {
  align-self: flex-start; background: var(--surface); border: 1px solid var(--line);
}
.gelo-msg-user { align-self: flex-end; background: var(--accent-soft); }
.gelo-msg-links { display: flex; flex-direction: column; gap: 6px; margin-top: 8px; }
.gelo-link {
  display: inline-flex; align-items: center; padding: 8px 10px; border-radius: 8px;
  background: var(--accent); color: var(--surface); font-weight: 600;
  font-size: 12px; text-decoration: none;
}
.gelo-link:hover { filter: brightness(1.08); color: var(--surface); }
.gelo-form {
  display: flex; gap: 8px; padding: 10px 12px;
  border-top: 1px solid var(--line); background: var(--surface);
}
.gelo-input {
  flex: 1; border: 1px solid var(--line); border-radius: 10px;
  padding: 10px 12px; font-size: 13px; font-family: var(--font-sans);
  color: var(--ink); background: var(--surface); outline: none;
}
.gelo-input:focus { border-color: var(--accent); }
.gelo-send {
  width: 42px; height: 42px; border: none; border-radius: 10px; cursor: pointer;
  background: var(--accent); color: var(--surface);
}
.gelo-send:disabled { opacity: .55; cursor: wait; }
.gelo-typing { font-size: 11px; color: var(--ink-2); align-self: flex-start; }

/* ============================================================
   F4b: densidade no computador (D9-D12), na janela real de um
   notebook 1366x768 (1333x595). Norma: 50 Padrões/10 a-regra-da-tela.md, secao
   "Densidade no computador". Toda regra aqui dentro e comeca por
   html.bg-painel (o <html> do base.html): celular, login, paginas
   avulsas, embed e impressao nao mudam.
   ============================================================ */
@media screen and (min-width: 861px) {
  /* D10: escala. O que e rem acompanha. */
  html.bg-painel { font-size: 14px; }

  /* D11: nenhum texto de tela abaixo de 11px */
  html.bg-painel .small,
  html.bg-painel small { font-size: max(.875em, 11px); }
  html.bg-painel .badge { font-size: max(.75em, 11px); }
  html.bg-painel code { font-size: max(.875em, 11px); }
  html.bg-painel #grade-table thead th,
  html.bg-painel .badge-origem,
  html.bg-painel .cnt,
  html.bg-painel .fs-10px,
  html.bg-painel .mh-base,
  html.bg-painel .msg-meta,
  html.bg-painel #ctbLiqModal .ctb-liq-grade-wrap th,
  html.bg-painel #ctbLiqModal .form-label,
  html.bg-painel .bg-nav-section-label,
  html.bg-painel .ficha-rotulo,
  html.bg-painel .bg-nav-sub-label,
  html.bg-painel #lotesLayout.menu-collapsed #menuLote .list-group-item[data-tip]:hover::after,
  html.bg-painel #painelTotais .tot-label,
  html.bg-painel .card-inc .form-label,
  html.bg-painel .chave-col,
  html.bg-painel .ct-wrap .badge,
  html.bg-painel .ct-wrap label,
  html.bg-painel .fs-075rem,
  html.bg-painel .mh-chip,
  html.bg-painel .mh-grupo,
  html.bg-painel .mh-marcas,
  html.bg-painel .mh-nums span,
  html.bg-painel .mh-paradas h3,
  html.bg-painel .rx-cartao .rx-fato-titulo,
  html.bg-painel .rx-tempo-cartao,
  html.bg-painel .tag,
  html.bg-painel #ctbLiqModal .ctb-liq-grade-wrap table,
  html.bg-painel .doc-col,
  html.bg-painel .serie-col,
  html.bg-painel body:has(#frmProduto) .form-label-sm,
  html.bg-painel body:has(#frmProdutoNovo) .form-label-sm,
  html.bg-painel body:has(#tblSint) .form-label-sm,
  html.bg-painel body:has(.ficha-rotulo) .form-label-sm,
  html.bg-painel .fs-06rem,
  html.bg-painel #ctbLiqModal .ctb-liq-sec { font-size: 11px; }

  /* Respiro da pagina e cabecalho numa linha */
  html.bg-painel .bg-main:not(:has(.mh)) { padding: .9rem 1.2rem 1.5rem; } /* o mapa de hoje e tela cheia */
  html.bg-painel .bg-cabecalho { margin-bottom: .6rem !important; }
  html.bg-painel .bg-cabecalho h4 { font-size: 1.25rem; }

  /* Filtro numa linha: rotulo ao lado do campo */
  html.bg-painel .card:has(.bg-filtro) { margin-bottom: .6rem !important; }
  html.bg-painel .card-body:has(> .bg-filtro),
  html.bg-painel .card-body.bg-filtro { padding: .4rem .75rem !important; }
  html.bg-painel .bg-filtro.row,
  html.bg-painel .bg-filtro > .row { align-items: center !important; row-gap: .4rem; }
  html.bg-painel .bg-filtro > .col,
  html.bg-painel .bg-filtro > .col-auto,
  html.bg-painel .bg-filtro > .row > .col,
  html.bg-painel .bg-filtro > .row > .col-auto { display: flex; align-items: center; gap: .35rem; }
  html.bg-painel .bg-filtro .form-label { margin-bottom: 0 !important; font-size: 12px; white-space: nowrap; }
  html.bg-painel .bg-filtro br { display: none; }
  html.bg-painel .bg-filtro input[type="date"] { width: 9.6rem; }
  html.bg-painel .bg-filtro hr { margin: .35rem 0 !important; }

  /* Tabela densa; texto da celula em no maximo 3 linhas (inteiro no title) */
  html.bg-painel .bg-densa > :not(caption) > * > * { padding: .2rem .4rem; }
  html.bg-painel .bg-densa td > .btn { padding: .12rem .45rem; }
  html.bg-painel .linha-3 {
    display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; overflow: hidden;
  }
}

/* ---- Relatorios do legado (.fr3): 860 controle de NF-e e 857 romaneio ----
   Casca do FastReport: cabecalho na pagina, rodape com data e "pag / total". */
@page paisagem-num {
  size: A4 landscape; margin: 10mm 10mm 14mm;
  @bottom-left { content: var(--rel-agora); font-size: 11px; }
  @bottom-right { content: counter(page) " / " counter(pages); font-size: 11px; }
}
@page retrato-num {
  size: A4 portrait; margin: 10mm 10mm 14mm;
  @bottom-left { content: "Data/hora da impressão: " var(--rel-agora); font-size: 11px; }
  @bottom-right { content: "Página: " counter(page) "/" counter(pages); font-size: 11px; }
}
.rel-wrap.paisagem.rel-pag { page: paisagem-num; }
.rel-wrap.rel-pag:not(.paisagem) { page: retrato-num; }
.rel-cab-fr { display: flex; align-items: flex-start; gap: 8px; padding-bottom: 6px; }
.rel-logo { width: 112px; height: 62px; flex: none; }
.rel-cab-titulo { flex: 1; font-size: 15px; font-weight: 700; padding-top: 15px; }
.rel-cab-exp { font-size: 13px; font-weight: 700; padding-top: 15px; text-align: right; }
.rel-860 { font-size: 11px; }
.rel-860 td { padding: 1px 4px; }
.rel-860 .num { text-align: right; }
.rel-860 .rel-grupo-xprod { font-weight: 700; padding-top: 12px; font-size: 12px; break-after: avoid; }
.rel-860 .rel-grupo-tit td { border-bottom: 1px solid var(--ink); break-after: avoid; }
.rel-860 tr { break-inside: avoid; }
.ctl-liquida, .ctl-saidas, .ctl-ajustada { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
.ctl-liquida { background: color-mix(in srgb, var(--warning) 45%, var(--surface)); }
.ctl-saidas { background: color-mix(in srgb, var(--accent) 14%, var(--surface)); }
.ctl-ajustada { background: var(--surface-2); }

/* 857 romaneio: mesmas posicoes do .fr3 (718 px de pagina = 190 mm) */
.rom-wrap { font-size: 11px; }
.rom-rotulo { color: color-mix(in srgb, var(--critical) 75%, var(--ink)); font-weight: 700; }
.rom-neg { font-weight: 700; }
.rom-it { font-style: italic; }
.rom-titulo { display: flex; gap: 8px; align-items: flex-start; }
.rom-logo { width: 112px; height: 53px; }
.rom-titulo-txt {
  flex: 1; margin-top: 21px; height: 23px; line-height: 23px; text-align: center;
  font-size: 16px; font-weight: 700; color: var(--surface);
  background: color-mix(in srgb, var(--ink) 52%, var(--surface));
  -webkit-print-color-adjust: exact; print-color-adjust: exact;
}
.rom-exp { font-size: 19px; margin: 4px 0 6px 0; padding-left: 121px; }
.rom-exp-data { margin-left: 32px; }
.rom-lbl { font-weight: 400; margin-top: 4px; }
.rom-box { border: 1px solid var(--line-2); padding: 3px 4px; min-height: 38px; font-size: 13px; }
.rom-quatro .rom-box { font-size: 11px; font-weight: 700; }
.rom-tres .rom-box { font-size: 11px; }
.rom-vazio { border: 0 !important; }
.rom-faixa {
  margin-top: 8px; text-align: center; font-weight: 700; padding: 2px 0;
  background: var(--line); -webkit-print-color-adjust: exact; print-color-adjust: exact;
}
.rom-faixa-caixa { border: 1px solid var(--line-2); margin-top: 6px; }
.rom-quatro { display: grid; grid-template-columns: 26.3% 26.3% 26.3% 21.1%; }
.rom-tres { display: grid; grid-template-columns: 1fr 1fr 1fr; }
.rom-tab { width: 100%; border-collapse: collapse; margin-top: 8px; }
.rom-tab td { padding: 0; border: 0; }
.rom-tab thead td { border-bottom: 1px solid var(--ink); }
.rom-cols { display: grid; grid-template-columns: 10% 52.6% 1fr; column-gap: 1%; }
.rom-cols-cab { font-size: 13px; padding: 8px 0 2px; }
.rom-lote {
  text-align: center; font-size: 13px; font-weight: 700; padding: 8px 0; margin-top: 4px;
  background: var(--surface-2); break-after: avoid;
  -webkit-print-color-adjust: exact; print-color-adjust: exact;
}
.rom-orc { padding: 5px 0 6px; border-bottom: 1px solid var(--line-2); break-inside: avoid; }
.rom-id { border: 1px solid var(--line); text-align: center; font-size: 13px; padding: 6px 0; margin-top: 3px; }
.rom-pag-forma { margin-top: 6px; }
.rom-quadro { display: inline-block; width: 20px; height: 14px; border: 1px solid var(--line-2); vertical-align: middle; margin-left: 12px; }
.rom-total { display: flex; justify-content: space-between; font-size: 12px; }
.rom-itens-cab { display: flex; justify-content: space-between; margin-top: 6px; border-bottom: 1px solid var(--line-2); }
.rom-item { display: flex; justify-content: space-between; }
.rom-total-orc { display: inline-block; margin-top: 8px; padding: 10px 6px; min-height: 0; border-color: var(--ink-3); }
/* Extrato impresso: as 20 colunas do razao do legado numa folha A4 deitada */
.rel-extrato { font-size: 9px; table-layout: auto; }
.table.rel-extrato thead th { font-size: 9px; letter-spacing: 0; padding: 2px 3px; }
.rel-extrato td { padding: 2px 3px; overflow-wrap: break-word; }
.rel-extrato td.num, .rel-extrato td.nw { white-space: nowrap; }
.rel-extrato tr { break-inside: avoid; }
/* Relatorio montado do .fr3 (modules/relatorios/fr3.py): pagina A4 e objetos na posicao do layout */
.fr3-pag { position: relative; box-sizing: border-box; margin: 0 auto 12px; background: var(--surface); color: var(--ink); box-shadow: 0 1px 4px rgba(0, 0, 0, .25); overflow: hidden; font-family: Arial, sans-serif; page: fr3-retrato; }
.fr3-pag.paisagem { page: fr3-paisagem; }
.fr3-area { position: relative; width: 100%; height: 100%; overflow: hidden; }
.fr3-obj { position: absolute; box-sizing: border-box; overflow: hidden; padding: 0 2px; white-space: pre-wrap; line-height: 1.15; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
.fr3-obj.va-c, .fr3-obj.va-b { display: flex; flex-direction: column; justify-content: center; }
.fr3-obj.va-b { justify-content: flex-end; }
.fr3-obj.ha-c { text-align: center; } .fr3-obj.ha-r { text-align: right; } .fr3-obj.fb { font-weight: 700; }
.fr3-obj > img { width: 100%; height: 100%; object-fit: contain; }
/* 2026-10-06 (owner): canto superior direito de toda pagina .fr3 — codigo do
   relatorio (identidade SIGLA-NNN) e numeracao pagina/total; e o rodape da
   norma de relatorios, com Rel. SIGLA-NNN e a pagina. */
.fr3-canto { position: absolute; top: 2mm; right: 3mm; font-size: 11px; line-height: 1; opacity: .85; z-index: 1; }
.fr3-rodape { position: absolute; bottom: 2mm; right: 3mm; font-size: 11px; line-height: 1; opacity: .85; z-index: 1; }
/* Hierarquia das linhas (regra 4): a que separa o cabecalho e a forte, as do
   corpo sao leves. O .fr3 tras todas iguais, entao a diferenca mora aqui. */
.fr3-obj.fr3-linha-forte { border-top: 2px solid var(--ink); }
.fr3-obj.fr3-linha-leve { border-top: 1px solid var(--line); }
@page fr3-retrato { size: A4 portrait; margin: 0; } @page fr3-paisagem { size: A4 landscape; margin: 0; }
@media print { .fr3-pag { margin: 0; box-shadow: none; break-after: page; } .fr3-pag:last-child { break-after: auto; } }
/* Blocos avulsos: cinza a numeracao inutilizada (id_lote = -1). */
#tblBlocosAvulso tbody tr.row-bloco-inutil > td { background-color: var(--surface-2) !important; color: var(--ink-3); }
#tblBlocosAvulso tbody tr.row-bloco-inutil:hover > td { background-color: color-mix(in srgb, var(--line) 60%, var(--surface-2)) !important; }
#tblBlocosAvulso tbody tr.row-bloco-inutil.row-selected > td { background-color: var(--line-2) !important; }

/* DFC cadastro (F4 Contabilidade, 2026-10-06): arvore da DFC na grade #tblDfc. Secao (nivel 0) e
   grupo (nivel 1) ganham peso e fundo para a analitica ler-se como filha; o recuo e por nivel. */
#tblDfc tbody tr.row-dfc-n0 > td { background-color: var(--surface-2); font-weight: 600; }
#tblDfc tbody tr.row-dfc-n1 > td { font-weight: 600; }
#tblDfc tbody tr.row-selected > td { background-color: var(--accent-soft) !important; }
.dfc-rec-1 { padding-left: 1rem; }
.dfc-rec-2 { padding-left: 2rem; }

/* DRE demonstrativo (F10 Contabilidade, 2026-10-06): grade #tblDre, conta x 12 meses. Total (nivel 0)
   e subtotal (nivel 1) ganham peso para a analitica ler-se como filha; so a analitica tem drill, e a
   celula dela mostra o cursor de clique. Valor negativo reaproveita .saldo-neg. */
#tblDre tbody tr.row-dre-n0 > td { background-color: var(--surface-2); font-weight: 600; }
#tblDre tbody tr.row-dre-n1 > td { font-weight: 600; }
#tblDre tbody tr.row-selected > td { background-color: var(--accent-soft) !important; }
#tblDre td.num-col { white-space: nowrap; padding-left: 3px; padding-right: 3px; font-size: 11px; }
#tblDre td.dre-cel-drill { cursor: pointer; }
#tblDre td.dre-cel-drill:hover { box-shadow: inset 0 0 0 1px var(--accent); }
/* coluna Ano = total do exercicio (vlr_total do relatorio CTB-810); borda separa de dezembro */
#tblDre th.num-col:last-child, #tblDre td.dre-col-ano { border-left: 2px solid var(--border); font-weight: 600; }

/* Balanco (F12 Contabilidade, 2026-10-06): grade #tblBal. Total (nivel 0) e grupo (nivel 1) ganham peso
   e a analitica le-se como filha; o recuo por nivel e a classe ps-* do Bootstrap. Saldo negativo reaproveita .saldo-neg. */
#tblBal tbody tr.row-bal-n0 > td { background-color: var(--surface-2); font-weight: 600; }
#tblBal tbody tr.row-bal-n1 > td { font-weight: 600; }
#tblBal tbody tr.row-selected > td { background-color: var(--accent-soft) !important; }
#tblBal td.num-col { white-space: nowrap; }

/* DFC demonstrativo (F11 Contabilidade, 2026-10-06): grade #tblDfcDem, conta x 12 meses + total.
   Total (nivel 0) e grupo (nivel 1) ganham peso para a analitica ler-se como filha; so a analitica
   tem drill, e a celula dela mostra o cursor de clique. Valor negativo reaproveita .saldo-neg. */
#tblDfcDem tbody tr.row-dfd-n0 > td { background-color: var(--surface-2); font-weight: 600; }
#tblDfcDem tbody tr.row-dfd-n1 > td { font-weight: 600; }
#tblDfcDem tbody tr.row-selected > td { background-color: var(--accent-soft) !important; }
#tblDfcDem td.num-col { white-space: nowrap; padding-left: 3px; padding-right: 3px; font-size: 11px; }
#tblDfcDem td.dfc-cel-drill { cursor: pointer; }
#tblDfcDem td.dfc-cel-drill:hover { box-shadow: inset 0 0 0 1px var(--accent); }

/* Saldos e fechamento (F14 Contabilidade, 2026-10-06): grade #tblSaldoMes, conta x ano + 12 meses, e a lista
   #tblFechamentos. Mesmo aperto de coluna da DRE para caber em 1333 px com a sidebar aberta; so leitura. */
#tblSaldoMes td.num-col { white-space: nowrap; padding-left: 3px; padding-right: 3px; font-size: 11px; }
#tblSaldoMes th.num-col { padding-left: 3px; padding-right: 3px; }
#tblFechamentos td.num-col { white-space: nowrap; }

/* Custos: demonstrativo (F3, 2026-10-06): grade #tblCusto, Jan..Dez + Ano em quatro blocos. Peca por peca
   na norma (50 Padrões/00-indice, "Demonstrativo de custos"). Aperto de coluna como o da DRE para caber em 1333 px. */
#tblCusto { table-layout: fixed; width: 100%; }
#tblCusto th:first-child { width: 11rem; }
#tblCusto th.cus-ano { width: 5.5rem; }
#tblCusto td:first-child { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#tblCusto td.num-col, #tblCusto th.num-col { white-space: nowrap; padding-left: 2px; padding-right: 3px; font-size: 11px; }
#tblCusto tr.row-bloco > td { background-color: var(--surface-2); font-weight: 600; letter-spacing: .04em; }
#tblCusto tr.row-total > td { font-weight: 600; }
#tblCusto .cus-ano { border-left: 2px solid var(--line-2); font-weight: 600; }
#tblCusto .cus-calc { font-size: 11px; font-weight: 400; color: var(--ink-3); }
#tblCusto .cus-cel-comp { cursor: pointer; }
#tblCusto td.cus-cel-comp:hover { box-shadow: inset 0 0 0 1px var(--accent); }
@page custos-demo { size: A4 landscape; margin: 8mm; }
@media print {
  .custos-demo { page: custos-demo; }
  .custos-demo .scroll-tela { max-height: none; overflow: visible; }
  .custos-demo #tblCusto { font-size: 10px; }
  .custos-demo #tblCusto td.num-col, .custos-demo #tblCusto th.num-col, .custos-demo #tblCusto .cus-calc { font-size: 10px; }
  .custos-demo #tblCusto thead { display: table-header-group; position: static; }
  .custos-demo #tblCusto tr { break-inside: avoid; }
  .custos-demo #tblCusto .st-warning, .custos-demo #tblCusto tr.row-bloco > td { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
}

/* Detalhe da expedicao (Logistica 9019, 2026-10-07): os cards de clientes
   (prazo, PIX, especie, bonificacao, troca, nao visitados) e os cards de
   produtos movimentacao passaram a ter a MESMA grade dentro de cada grupo -- a
   largura vem do colgroup do template e o table-layout fixo a faz valer, para
   a coluna cair no mesmo lugar em todos os cards. A rota nao e mais coluna nem
   linha de grupo: ela subiu para cima dos cards (cada rota e um lote). */
.grade-clientes, .grade-movim { table-layout: fixed; }
/* entrega lancada em outro dia leva a data junto ("01/10 08:30"): nao quebra em duas linhas */
.grade-clientes td.bg-num { white-space: nowrap; }

/* EXP-858 Produtos movimentacao impresso (2026-10-07): espelho do card do
   detalhe da expedicao, na mesma casca do 857/860 (.rel-wrap.rel-pag). O que
   mora aqui e so o que o impresso precisa e aquela casca nao tem: a grade de
   11px, a linha forte que separa o cabecalho (regra 4 da norma de relatorios,
   as do corpo sao leves), o grupo por produto e o rodape com Rel. EXP-858 --
   que repete por pagina porque o tfoot do .rel-shell passou a ser
   table-footer-group na impressao. */
.rel-movim { font-size: 11px; }
/* 6px de cada lado: a coluna Codigo e alinhada a direita e a Cliente a
   esquerda -- sem isso o codigo cola no nome ("9009EMPRESA TESTE"). Precisa
   vencer o `.rel-shell > tbody > tr > td { padding: 0 }` da casca, que e mais
   especifico que um `.rel-movim td` */
.rel-movim .rel-shell > tbody > tr > td { padding: 1px 6px; }
.rel-movim .num { text-align: right; }
.rel-movim .rel-ident { font-size: 11px; padding: 2px 0 5px; }
.rel-movim .rel-sep { border-top: 2px solid var(--ink); }
.rel-movim .rel-rodape { font-size: 11px; padding-top: 6px; color: var(--ink-2); }
.rel-movim .rel-cancel { font-weight: 700; color: var(--critical); }
.rel-movim .rel-movim-prod td { font-weight: 700; font-size: 12px; padding-top: 11px; }
.rel-movim .rel-movim-prod, .rel-movim .rel-movim-tit, .rel-movim .rel-movim-ini { break-after: avoid; }
.rel-movim .rel-movim-tit td { border-bottom: 1px solid var(--line-2); }
.rel-movim .rel-movim-ini td, .rel-movim .rel-movim-tot td { font-weight: 700; }
.rel-movim .rel-movim-tot td { border-top: 1px solid var(--line-2); }
.rel-movim .rel-movim-saldo td { border-bottom: 1px solid var(--line-2); }
.rel-movim tr { break-inside: avoid; }
@media print { .rel-shell > tfoot { display: table-footer-group; } }

/* VEN-112/113 Resumo do lote - Orcamentos (2026-10-10): so o rodape de
   identidade falta na casca ja usada pelos resumos da conciliacao
   (.rel-wrap/.rel-shell/.rel-cab/.sec/.rel-tbl/.rel-grupo, todos acima). */
.rel-lote-orc .rel-rodape { font-size: 11px; padding-top: 6px; color: var(--ink-2); }
/* Pedido do owner (2026-10-10): o detalhe por produto (VEN-113) ficava
   espalhado na largura inteira -- table-layout fixed faz o colgroup valer
   (1a coluna em branco de respiro + produto/qtd/valores confinados na
   metade direita), como o colgroup do EXP-858 acima. */
.rel-lote-orc-itens { table-layout: fixed; }