.espelho-resumo-acoes {
  margin: 12px 0 4px;
}

.dialog-espelho {
  width: min(96vw, 1500px);
  max-height: 88vh;
  border: 1px solid #d7dfeb;
  border-radius: 12px;
  padding: 14px;
}

.dialog-espelho::backdrop {
  background: rgba(9, 30, 66, 0.45);
}

.dialog-espelho .dialog-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 8px;
}

.table-espelho-operacional .col-grupo-op {
  background: #f3f8f4;
  color: #1f5c38;
}

.dialog-faturamento-impressao {
  width: min(96vw, 1100px);
}

.dialog-export-acoes {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 0 0 12px;
}

.table-faturamento-impressao th,
.table-faturamento-impressao td {
  white-space: nowrap;
}

.tabela-faturamento-impressao {
  max-height: 60vh;
  overflow: auto;
}

.lazy-panel__head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
}

.lazy-panel__head h2 {
  margin: 0;
}

.lazy-panel__hint {
  margin: 0.25rem 0 0;
  font-size: 0.875rem;
  max-width: 42rem;
}

.lazy-panel__body {
  display: none;
  margin-top: 0.75rem;
}

.lazy-panel.is-open .lazy-panel__body {
  display: block;
}

.nf-quattror-card.lazy-panel,
.pallets-card.lazy-panel {
  border-style: dashed;
}
:root {
  /* Identidade Carvalho Cosméticos (verde da logo) */
  --brand: #004d26;
  --brand-hover: #003d1f;
  --brand-light: #e8f2ec;
  --bg: #f4f6f9;
  --card: #fff;
  --text: #1a2332;
  --muted: #5c6b7a;
  --accent: var(--brand);
  --accent-hover: var(--brand-hover);
  --border: #dde3ea;
  --ok: #e8f5e9;
  --warn: #fff3e0;
  /* Tipografia compacta — reduz em telas menores via media queries */
  --fs-base: 0.8125rem;
  --fs-sm: 0.75rem;
  --fs-xs: 0.6875rem;
  --lh: 1.38;
  --nav-h: 2.5rem;
}

* { box-sizing: border-box; }
body {
  margin: 0;
  font-family: "Segoe UI", system-ui, sans-serif;
  font-size: var(--fs-base);
  background: var(--bg);
  color: var(--text);
  line-height: var(--lh);
  display: flex;
  flex-direction: column;
  min-height: 100vh;
}
.container { max-width: 1100px; margin: 0 auto; padding: 0 1.25rem; }
.container-main { max-width: 1400px; }
.header {
  background: linear-gradient(180deg, var(--brand) 0%, var(--brand-hover) 100%);
  color: #fff;
  padding: 0.35rem 0;
  margin-bottom: 0.75rem;
  border-bottom: 2px solid rgba(0, 0, 0, 0.12);
}
.header-fixo {
  position: sticky;
  top: 0;
  z-index: 1000;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
}
.header-inner {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  flex-wrap: nowrap;
  gap: 0.35rem 0.5rem;
  min-height: var(--nav-h);
}
.logo { color: #fff; font-weight: 700; text-decoration: none; font-size: 0.95rem; }
.nav-cliente-badge {
  background: var(--accent);
  color: #fff;
  font-size: 0.65rem;
  font-weight: 700;
  padding: 0.15rem 0.45rem;
  border-radius: 4px;
  letter-spacing: 0.04em;
  flex-shrink: 0;
  white-space: nowrap;
}
.nav-principal {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: flex-end;
  gap: 0.1rem 0.25rem;
  flex: 1 1 auto;
  min-width: 0;
  overflow-x: auto;
  overflow-y: hidden;
  scrollbar-width: thin;
  scrollbar-color: rgba(255, 255, 255, 0.35) transparent;
  -webkit-overflow-scrolling: touch;
  padding: 0.1rem 0;
}
.nav-principal::-webkit-scrollbar {
  height: 4px;
}
.nav-principal::-webkit-scrollbar-thumb {
  background: rgba(255, 255, 255, 0.35);
  border-radius: 4px;
}
.nav-toggle {
  display: none;
  flex-direction: column;
  justify-content: center;
  gap: 4px;
  width: 2.25rem;
  height: 2.25rem;
  padding: 0;
  margin-left: auto;
  border: 1px solid rgba(255, 255, 255, 0.35);
  border-radius: 6px;
  background: rgba(0, 0, 0, 0.15);
  cursor: pointer;
  flex-shrink: 0;
}
.nav-toggle-bar {
  display: block;
  width: 1.1rem;
  height: 2px;
  margin: 0 auto;
  background: #fff;
  border-radius: 1px;
  transition: transform 0.2s ease, opacity 0.2s ease;
}
body.nav-open .nav-toggle-bar:nth-child(1) {
  transform: translateY(6px) rotate(45deg);
}
body.nav-open .nav-toggle-bar:nth-child(2) {
  opacity: 0;
}
body.nav-open .nav-toggle-bar:nth-child(3) {
  transform: translateY(-6px) rotate(-45deg);
}
.nav-overlay {
  display: none;
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  top: var(--nav-h);
  z-index: 1001;
  background: rgba(0, 0, 0, 0.12);
  /* sem blur — o conteúdo continua legível ao lado do menu */
}
.clientes-page {
  max-width: 880px;
  margin: 0 auto;
  padding: 1.5rem 0 2rem;
}
.clientes-hero {
  text-align: center;
  margin: 0 auto 2rem;
  padding: 0 1rem;
}
.clientes-kicker {
  margin: 0 0 0.5rem;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--accent);
}
.clientes-hero h1 {
  margin: 0 0 0.65rem;
  font-size: clamp(1.35rem, 3vw, 1.75rem);
  font-weight: 700;
  letter-spacing: -0.02em;
}
.clientes-lead {
  margin: 0 auto;
  max-width: 32rem;
  color: var(--muted);
  font-size: 0.95rem;
  line-height: 1.5;
}
.clientes-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 1.25rem;
}
.cliente-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.65rem;
  text-align: center;
  padding: 1.5rem 1.25rem 1.25rem;
  border: 1px solid var(--border);
  border-radius: 14px;
  background: var(--card);
  box-shadow: 0 4px 24px rgba(26, 35, 50, 0.06);
  transition:
    transform 0.28s cubic-bezier(0.22, 1, 0.36, 1),
    box-shadow 0.28s ease,
    border-color 0.2s ease;
  cursor: pointer;
}
.cliente-card:hover {
  transform: translateY(-4px);
  border-color: var(--accent);
  box-shadow: 0 12px 32px rgba(0, 77, 38, 0.14);
}
.cliente-card h2 { margin: 0; font-size: 1.2rem; font-weight: 700; }
.cliente-desc {
  margin: 0;
  color: var(--muted);
  font-size: 0.85rem;
  line-height: 1.45;
  max-width: 16rem;
}
.btn-cliente {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  margin-top: 0.35rem;
  padding: 0.55rem 1.15rem;
  width: 100%;
  max-width: 14rem;
  justify-content: center;
  transition: background 0.2s ease, gap 0.2s ease;
}
.cliente-card:hover .btn-cliente { gap: 0.75rem; }
.btn-arrow {
  display: inline-block;
  transition: transform 0.25s ease;
}
.cliente-card:hover .btn-arrow { transform: translateX(3px); }
.clientes-animate {
  opacity: 0;
  animation: clientesFadeUp 0.55s cubic-bezier(0.22, 1, 0.36, 1) forwards;
  animation-delay: var(--delay, 0ms);
}
@keyframes clientesFadeUp {
  from {
    opacity: 0;
    transform: translateY(14px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
@media (prefers-reduced-motion: reduce) {
  .clientes-animate { animation: none; opacity: 1; }
  .cliente-card,
  .cliente-card:hover,
  .btn-arrow { transition: none; transform: none; }
}
.cliente-logo-wrap {
  min-height: 88px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 0.35rem;
}
.cliente-logo {
  max-width: 100%;
  max-height: 96px;
  width: auto;
  height: auto;
  object-fit: contain;
}
.cliente-logo-imbecor { max-height: 72px; border-radius: 4px; }
.cliente-logo-prestige { max-height: 100px; }
.logo-link {
  display: flex;
  align-items: center;
  text-decoration: none;
  flex-shrink: 0;
}
.logo-carvalho {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 40px;
  min-height: 36px;
  padding: 3px 6px;
  background: #fff;
  border-radius: 8px;
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.12);
  overflow: hidden;
}
.header-logo-carvalho {
  display: block;
  height: 30px;
  width: auto;
  max-width: 100px;
  object-fit: contain;
  transition: opacity 0.35s ease, transform 0.35s ease;
}
.logo-carvalho-nome {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0 0.5rem;
  font-size: 0.68rem;
  font-weight: 700;
  line-height: 1.15;
  text-align: center;
  color: var(--brand);
  opacity: 0;
  transition: opacity 0.35s ease;
  pointer-events: none;
}
.logo-carvalho:hover .header-logo-carvalho,
.logo-carvalho:focus-visible .header-logo-carvalho {
  opacity: 0;
  transform: scale(0.92);
}
.logo-carvalho:hover .logo-carvalho-nome,
.logo-carvalho:focus-visible .logo-carvalho-nome {
  opacity: 1;
}
@media (prefers-reduced-motion: reduce) {
  .header-logo-carvalho,
  .logo-carvalho-nome { transition: none; }
}
.header-marca-sep {
  width: 1px;
  height: 26px;
  background: rgba(255, 255, 255, 0.35);
  flex-shrink: 0;
}
.header-logo {
  display: block;
  height: 30px;
  width: auto;
  max-width: 110px;
  object-fit: contain;
}
.header-logo-imbecor {
  border-radius: 4px;
  background: #fff;
  padding: 2px 5px;
}
.header-logo-prestige {
  height: 30px;
  max-width: 120px;
  filter: brightness(0) invert(1);
}
.header-fixo .header-logo-prestige {
  filter: none;
  background: #fff;
  padding: 2px 6px;
  border-radius: 4px;
}
.header nav a {
  color: #e2eaf0;
  margin-left: 0;
  text-decoration: none;
  font-size: 0.7rem;
  font-weight: 500;
  padding: 0.28rem 0.45rem;
  white-space: nowrap;
  line-height: 1.15;
  border-radius: 4px;
  flex-shrink: 0;
  transition: background 0.15s ease, color 0.15s ease;
}
.header nav a:hover {
  color: #fff;
  background: rgba(255, 255, 255, 0.12);
}
.header nav a.nav-destaque {
  color: #fff;
  background: var(--accent);
  padding: 0.35rem 0.75rem;
  border-radius: 6px;
  margin-left: 1rem;
}
.header nav a.nav-destaque:hover { background: var(--accent-hover); }
.main { padding-bottom: 1.5rem; flex: 1; }
.site-footer {
  margin-top: auto;
  background: var(--brand-hover);
  color: #c8e6c9;
  padding: 0.35rem 0;
  font-size: 0.68rem;
  text-align: center;
  border-top: 1px solid rgba(0, 0, 0, 0.15);
}
.footer-inner {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 0.25rem 0.4rem;
  line-height: 1.3;
}
.footer-direitos { color: #b8c5d4; }
.footer-empresa { color: #e3eaf2; font-weight: 600; }
.footer-sep { opacity: 0.45; user-select: none; }
.footer-dev a {
  color: #90caf9;
  text-decoration: none;
}
.footer-dev a:hover { text-decoration: underline; }
.header-marca {
  display: flex;
  align-items: center;
  gap: 0.65rem;
  flex-shrink: 0;
}
.header-empresa {
  color: #fff;
  font-weight: 700;
  font-size: 0.82rem;
  text-decoration: none;
  line-height: 1.2;
  border-left: 1px solid rgba(255, 255, 255, 0.25);
  padding-left: 0.65rem;
}
.header-empresa:hover { color: #e3f2fd; }
.empresa-tagline strong { color: var(--text); }
h1 { margin: 0 0 0.2rem; font-size: 1.35rem; }
h2 { margin: 0 0 0.4rem; font-size: 1rem; }
h3 { margin: 0 0 0.35rem; font-size: 0.9rem; }
.subtitle { color: var(--muted); margin: 0 0 1rem; font-size: var(--fs-sm); }
.card {
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: 8px;
  padding: 0.9rem 1rem;
  margin-bottom: 0.9rem;
}
.card.ok { background: var(--ok); }
.card.warn { background: var(--warn); }
.card.empty { text-align: center; padding: 2rem; }
.table { width: 100%; border-collapse: collapse; font-size: var(--fs-sm); }
.table th, .table td {
  text-align: left;
  padding: 0.35rem 0.4rem;
  border-bottom: 1px solid var(--border);
}
.table th { color: var(--muted); font-weight: 600; }
.badge {
  display: inline-block;
  background: #e3f2fd;
  color: #1565c0;
  padding: 0.2rem 0.5rem;
  border-radius: 4px;
  font-size: var(--fs-xs);
}
.btn {
  display: inline-block;
  background: var(--accent);
  color: #fff;
  border: none;
  padding: 0.4rem 0.85rem;
  border-radius: 6px;
  cursor: pointer;
  text-decoration: none;
  font-size: var(--fs-sm);
}
.btn:hover { background: var(--accent-hover); }
.btn-warn { background: #c62828; }
.grid-2 {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1rem;
}
@media (max-width: 700px) { .grid-2 { grid-template-columns: 1fr; } }
.metrics { display: grid; grid-template-columns: 1fr auto; gap: 0.35rem 1rem; }
.metrics dt { color: var(--muted); margin: 0; }
.metrics dd { margin: 0; text-align: right; }
.page-header {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: flex-start;
  gap: 1rem;
  margin-bottom: 1rem;
}
.status-form select { padding: 0.4rem; min-width: 220px; }
.muted { color: var(--muted); }
.hint { font-size: 0.85rem; color: var(--muted); margin-top: 1rem; }
.errors { color: #b71c1c; }
.form-details { margin-top: 1rem; }
.inline-form {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
  gap: 0.75rem;
  margin-top: 0.75rem;
}
.inline-form label { font-size: 0.8rem; color: var(--muted); display: block; }
.inline-form input, .inline-form select, .inline-form textarea {
  width: 100%;
  padding: 0.4rem;
  border: 1px solid var(--border);
  border-radius: 4px;
}
.inline-form .btn { grid-column: 1 / -1; justify-self: start; }

.kanban-header {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: 1rem;
}
.kanban-header h1 { margin: 0 0 0.25rem; }
.kanban-vazio { text-align: center; padding: 2rem; }
.kanban-foot { margin-top: 0.75rem; font-size: 0.78rem; text-align: right; }
.kanban-board {
  display: flex;
  gap: 0.75rem;
  overflow-x: auto;
  padding-bottom: 1rem;
  align-items: flex-start;
}
.kanban-board-moderno .kanban-col {
  min-width: 220px;
  max-width: 260px;
  flex: 1;
}
.kanban-col {
  flex-shrink: 0;
  background: linear-gradient(180deg, #eef2f6 0%, #e8ecf1 100%);
  border-radius: 10px;
  padding: 0.6rem;
  border: 1px solid var(--border);
}
.kanban-col-title {
  font-size: 0.78rem;
  font-weight: 700;
  margin: 0 0 0.55rem;
  color: var(--text);
  line-height: 1.3;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
.kanban-col-title .count {
  background: var(--card);
  padding: 0.12rem 0.4rem;
  border-radius: 10px;
  font-weight: 600;
  margin-left: 0.25rem;
}
.kanban-col-finalizado {
  background: linear-gradient(180deg, #e8f5e9 0%, #e0f2e4 100%);
  border-color: #a5d6a7;
}
.kanban-card {
  display: block;
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: 8px;
  padding: 0.6rem 0.65rem;
  margin-bottom: 0.45rem;
  text-decoration: none;
  color: inherit;
  font-size: 0.85rem;
  transition: border-color 0.2s ease, box-shadow 0.2s ease, transform 0.2s ease;
}
.kanban-card:hover {
  border-color: var(--accent);
  box-shadow: 0 4px 12px rgba(13, 110, 122, 0.1);
  transform: translateY(-1px);
}
.kanban-numero { display: block; font-weight: 700; font-size: 0.9rem; }
.kanban-meta { display: block; color: var(--muted); font-size: 0.72rem; margin-top: 0.15rem; }
.kanban-progress {
  display: inline-block;
  margin-top: 0.35rem;
  font-size: 0.68rem;
  font-weight: 600;
  color: var(--accent);
  background: #e0f2f4;
  padding: 0.1rem 0.35rem;
  border-radius: 4px;
}
.kanban-vazio-col { font-size: 0.75rem; padding: 0.5rem; margin: 0; }
.tag {
  display: inline-block;
  margin-top: 0.25rem;
  font-size: 0.7rem;
  background: #fff3e0;
  padding: 0.1rem 0.3rem;
  border-radius: 3px;
}
.encerrados-list { display: flex; flex-wrap: wrap; gap: 0.5rem; }
.encerrados-list a { font-size: 0.9rem; }

.pedido-bloco {
  border-top: 1px solid var(--border);
  padding-top: 1rem;
  margin-top: 1rem;
}
.pedido-bloco:first-child { border-top: none; padding-top: 0; margin-top: 0; }
.pedido-bloco h3 { margin: 0 0 0.35rem; font-size: 1rem; }

/* Dashboard */
.dashboard-header {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: flex-start;
  gap: 1rem;
  margin-bottom: 1.25rem;
}
.import-shortcuts { display: flex; gap: 0.5rem; flex-wrap: wrap; }
.kpi-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 1rem;
  margin-bottom: 1.25rem;
}
.kpi-card {
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: 1.1rem 1.25rem;
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
}
.kpi-card.kpi-accent {
  background: linear-gradient(135deg, var(--brand) 0%, var(--brand-hover) 100%);
  color: #fff;
  border: none;
}
.kpi-card.kpi-accent .kpi-label,
.kpi-card.kpi-accent .kpi-hint { color: rgba(255,255,255,0.85); }
.kpi-label { font-size: 0.8rem; color: var(--muted); text-transform: uppercase; letter-spacing: 0.04em; }
.kpi-value { font-size: 1.75rem; font-weight: 700; line-height: 1.2; }
.kpi-hint { font-size: 0.8rem; color: var(--muted); }
.dashboard-search {
  display: flex;
  gap: 0.5rem;
  flex-wrap: wrap;
}
.dashboard-search input[type="search"] {
  flex: 1;
  min-width: 220px;
  padding: 0.5rem 0.75rem;
  border: 1px solid var(--border);
  border-radius: 6px;
  font-size: 1rem;
}
.btn-sm { padding: 0.28rem 0.55rem; font-size: var(--fs-xs); }
.btn-outline {
  background: transparent;
  color: var(--accent);
  border: 1px solid var(--accent);
}
.btn-outline:hover { background: #e0f2f4; }
.table-wrap { overflow-x: auto; }
.table-dashboard { font-size: 0.85rem; }
.table-dashboard .num { text-align: right; white-space: nowrap; }
.table-card h2 { margin: 0 0 0.5rem; font-size: 1.15rem; }
.steps-list { text-align: left; max-width: 520px; margin: 1rem auto 0; }
.badge-status-encerrado { background: #e8eaf6; color: #3949ab; }
.badge-status-aguardando_material { background: #fff8e1; color: #f57f17; }
.badge-status-disponivel_producao { background: #e8f5e9; color: #2e7d32; }
.breadcrumb { margin: 0 0 0.5rem; font-size: 0.9rem; }
.breadcrumb a { color: var(--accent); }

/* Dashboard elaborado */
.dashboard-top {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: flex-start;
  gap: 1rem;
  margin-bottom: 1rem;
}
.dash-filters { margin-bottom: 1rem; }
.filter-row {
  display: grid;
  grid-template-columns: minmax(280px, 2fr) auto auto 1fr auto;
  gap: 0.75rem 1rem;
  align-items: end;
}
@media (max-width: 960px) {
  .filter-row { grid-template-columns: 1fr 1fr; }
}
.filter-field span {
  display: block;
  font-size: 0.75rem;
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: 0.03em;
  margin-bottom: 0.25rem;
}
.filter-field select,
.filter-field input {
  width: 100%;
  padding: 0.5rem 0.6rem;
  border: 1px solid var(--border);
  border-radius: 6px;
  font-size: 0.95rem;
}
.filter-actions { display: flex; gap: 0.5rem; padding-bottom: 2px; }
.filter-status {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem;
  margin-top: 1rem;
  padding-top: 1rem;
  border-top: 1px solid var(--border);
}
.filter-status-label {
  font-size: 0.8rem;
  color: var(--muted);
  margin-right: 0.25rem;
}
.chip {
  display: inline-block;
  padding: 0.3rem 0.75rem;
  border-radius: 20px;
  font-size: 0.85rem;
  text-decoration: none;
  color: var(--text);
  background: #eef2f6;
  border: 1px solid var(--border);
}
.chip:hover { border-color: var(--accent); color: var(--accent); }
.chip-active {
  background: var(--accent);
  color: #fff;
  border-color: var(--accent);
}

/* Chips de filtro multi-item (painel) */
.chip-token {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
}
.chip-token-x {
  background: transparent;
  border: none;
  color: inherit;
  cursor: pointer;
  font-weight: 700;
  line-height: 1;
  padding: 0;
}
.filtro-item-tokens {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
  margin-top: 0.45rem;
}
.kpi-grid-compact { margin-bottom: 1rem; }
.kpi-mini .kpi-value { font-size: 1.35rem; }
.kpi-value-sm { font-size: 1.2rem !important; }

.dash-processo { border-left: 4px solid var(--accent); }
.dash-processo-header {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: 1.25rem;
}
.dash-processo-header h2 { margin: 0; font-size: 1.5rem; }
.dash-processo-status {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem;
}
.situacao-badge {
  font-size: 0.75rem;
  font-weight: 600;
  text-transform: uppercase;
  padding: 0.25rem 0.6rem;
  border-radius: 4px;
}
.situacao-em_andamento { background: #e3f2fd; color: #1565c0; }
.situacao-atrasado { background: #ffebee; color: #c62828; }
.situacao-pausado { background: #fff3e0; color: #e65100; }
.situacao-finalizado { background: #e8eaf6; color: #3949ab; }

.metrics-bar {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  gap: 0.75rem;
  margin-bottom: 1.25rem;
}
.metric-box {
  background: #f8fafc;
  border: 1px solid var(--border);
  border-radius: 8px;
  padding: 0.75rem 0.9rem;
}
.metric-label {
  display: block;
  font-size: 0.7rem;
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: 0.04em;
  margin-bottom: 0.35rem;
}
.metric-value {
  font-size: 1.05rem;
  font-weight: 700;
  line-height: 1.3;
  word-break: break-word;
}
.metric-value-sm { font-size: 0.85rem; font-weight: 600; }
.metric-futura { border-left: 3px solid #ff9800; }
.metric-realizado { border-left: 3px solid #2e7d32; }
.metric-saldo { border-left: 3px solid var(--accent); background: #e8f4f6; }

.progress-block { margin-top: 0.5rem; }
.progress-head {
  display: flex;
  justify-content: space-between;
  font-size: 0.9rem;
  margin-bottom: 0.4rem;
}
.progress-track {
  height: 8px;
  background: #e0e6ed;
  border-radius: 4px;
  overflow: hidden;
}
.progress-fill {
  height: 100%;
  background: linear-gradient(90deg, var(--accent), #26a69a);
  border-radius: 4px;
  transition: width 0.3s ease;
}
.progress-steps {
  display: flex;
  flex-wrap: wrap;
  gap: 0.25rem;
  margin-top: 0.6rem;
}
.progress-steps .step {
  font-size: 0.65rem;
  padding: 0.15rem 0.35rem;
  background: #eef2f6;
  border-radius: 3px;
  color: var(--muted);
}
.progress-steps .step-done {
  background: #c8e6c9;
  color: #2e7d32;
}
.progress-steps .step-current {
  background: var(--accent);
  color: #fff;
  font-weight: 600;
}
.progress-hint { margin: 0.5rem 0 0; font-size: 0.8rem; }

.dash-main-grid {
  display: grid;
  grid-template-columns: 1.4fr 1fr;
  gap: 1.25rem;
  margin-bottom: 1.25rem;
}
@media (max-width: 1000px) {
  .dash-main-grid { grid-template-columns: 1fr; }
}
.dash-col-left, .dash-col-right { display: flex; flex-direction: column; gap: 1rem; }
.card-compact { padding: 1rem; }
.card-compact h3 { margin: 0 0 0.75rem; font-size: 1rem; }
.vinculos-list { list-style: none; padding: 0; margin: 0; }
.vinculos-list li {
  padding: 0.5rem 0;
  border-bottom: 1px solid var(--border);
  font-size: 0.9rem;
}
.vinculos-list li:last-child { border-bottom: none; }
.vinculo-valor { float: right; font-weight: 600; }
.table-itens { font-size: var(--fs-xs); }
.table-itens th,
.table-itens td { padding: 0.3rem 0.35rem; }
.badge-item { background: #f3e5f5; color: #6a1b9a; }

.pendencias-card h3 { margin: 0 0 0.75rem; }
.pendencias-list { list-style: none; padding: 0; margin: 0; }

/* Status operacional (pedido → faturamento → finalizado) */
.status-operacional-box { min-width: 12rem; }
.status-operacional {
  display: inline-block;
  padding: 0.45rem 0.85rem;
  border-radius: 8px;
  font-weight: 700;
  font-size: 0.9rem;
  background: #e8f4f6;
  color: var(--brand);
}
.status-operacional.status-pedido-recepcionado { background: #fff8e1; color: #6d4c00; }
.status-operacional.status-faturamento-em-andamento { background: #e3f2fd; color: #0d47a1; }
.status-operacional.status-finalizado { background: #e8f5e9; color: #1b5e20; }
.status-operacional-hint { margin: 0.35rem 0 0; font-size: 0.75rem; }

/* Carrossel de progresso (sidebar) */
.progresso-game {
  margin-top: 0.75rem;
  padding: 0.75rem;
  border-radius: 10px;
  background: linear-gradient(160deg, #f8fcfd 0%, #eef6f8 100%);
  border: 1px solid #c5e4ea;
}
.progresso-game-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 0.4rem;
}
.progresso-game-titulo { font-weight: 700; font-size: 0.82rem; color: var(--brand); }
.progresso-game-pct { font-weight: 800; font-size: 1rem; color: var(--brand); }
.progresso-bar-track {
  height: 8px;
  background: #dceef1;
  border-radius: 99px;
  overflow: hidden;
  margin-bottom: 0.55rem;
}
.progresso-bar-fill {
  height: 100%;
  background: linear-gradient(90deg, var(--brand), #2e7d32);
  border-radius: 99px;
  transition: width 0.35s ease;
}
.progresso-steps-dots {
  display: flex;
  justify-content: space-between;
  gap: 2px;
  margin-bottom: 0.5rem;
}
.progresso-dot {
  flex: 1;
  border: none;
  background: transparent;
  padding: 0;
  cursor: pointer;
}
.progresso-dot-inner {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 1.65rem;
  height: 1.65rem;
  margin: 0 auto;
  border-radius: 50%;
  font-size: 0.7rem;
  font-weight: 700;
  background: #fff;
  border: 2px solid #b0bec5;
  color: #78909c;
  transition: transform 0.2s, border-color 0.2s, background 0.2s;
}
.progresso-dot.done .progresso-dot-inner {
  background: #c8e6c9;
  border-color: #2e7d32;
  color: #1b5e20;
}
.progresso-dot.atual .progresso-dot-inner,
.progresso-dot.ativo-slide .progresso-dot-inner {
  transform: scale(1.12);
  border-color: var(--brand);
  background: var(--brand);
  color: #fff;
  box-shadow: 0 2px 8px rgba(13, 110, 122, 0.35);
}
.progresso-slide-wrap {
  display: flex;
  align-items: stretch;
  gap: 0.25rem;
}
.progresso-nav {
  flex: 0 0 1.5rem;
  border: none;
  background: #fff;
  border-radius: 6px;
  color: var(--brand);
  font-size: 1.1rem;
  cursor: pointer;
  line-height: 1;
}
.progresso-nav:hover { background: #e0f2f1; }
.progresso-slide {
  flex: 1;
  position: relative;
  min-height: 3.2rem;
}
.progresso-pane {
  display: none;
  font-size: 0.78rem;
  line-height: 1.35;
}
.progresso-pane.ativo { display: block; }
.progresso-pane strong { display: block; margin-bottom: 0.2rem; color: #263238; }
.progresso-pane p { margin: 0 0 0.25rem; color: #546e7a; }
.progresso-foot { margin: 0.45rem 0 0; font-size: 0.72rem; text-align: center; }
.pendencia {
  padding: 0.75rem;
  margin-bottom: 0.5rem;
  border-radius: 6px;
  border-left: 4px solid var(--border);
}
.pendencia strong { display: block; font-size: 0.9rem; margin-bottom: 0.2rem; }
.pendencia p { margin: 0; font-size: 0.85rem; color: var(--muted); }
.pendencia-alerta { background: #fff8e1; border-left-color: #f9a825; }
.pendencia-acao { background: #e3f2fd; border-left-color: #1565c0; }
.pendencia-info { background: #f5f5f5; border-left-color: #757575; }
.pendencia-item { background: #fafafa; border-left-color: #9e9e9e; }
.pendencia-ok { background: var(--ok); border-left-color: #2e7d32; }

.timeline-compact li { padding: 0.4rem 0 0.4rem 0.85rem; margin-bottom: 0.35rem; }
.timeline-compact .muted { display: block; font-size: 0.8rem; }
.timeline-card h3 { margin: 0 0 0.5rem; font-size: 1rem; }

.dash-lista h3 { margin: 0 0 0.75rem; font-size: 1.05rem; }
.row-selected { background: #e8f4f6; }
.empty-inline { margin: 0.5rem 0; }
.fat-card { border-left-color: #2e7d32; }
.fat-pct-badge {
  font-size: 0.85rem;
  font-weight: 700;
  padding: 0.35rem 0.65rem;
  background: #e8f5e9;
  color: #2e7d32;
  border-radius: 6px;
}
.row-pendente { background: #fffde7; }
.totais-row td {
  font-weight: 600;
  border-top: 2px solid var(--border);
  background: #f8fafc;
}
.fat-dica-list { margin: 0; padding-left: 1.1rem; font-size: 0.85rem; }
.fat-dica-list li { margin-bottom: 0.35rem; }
.fat-dica h3 { margin: 0 0 0.5rem; font-size: 0.95rem; }

/* Painel de processos — layout principal */
.painel-intro {
  margin-bottom: 1rem;
  padding: 0.85rem 1.1rem;
  font-size: 0.92rem;
  background: #e8f4f6;
  border-color: #b2dfdb;
}
.painel-layout {
  display: grid;
  grid-template-columns: 272px 1fr;
  gap: 0.9rem;
  align-items: start;
}
@media (max-width: 900px) {
  .painel-layout { grid-template-columns: 1fr; }
}
.painel-sidebar {
  position: sticky;
  top: 1rem;
  max-height: calc(100vh - 120px);
  display: flex;
  flex-direction: column;
  padding: 0;
  overflow: hidden;
}
.sidebar-title {
  margin: 0;
  padding: 0.75rem 0.85rem 0.4rem;
  font-size: 0.95rem;
}
.sidebar-title .count { color: var(--muted); font-weight: 400; font-size: var(--fs-xs); }
.sidebar-search {
  display: flex;
  gap: 0.35rem;
  padding: 0 1rem 0.5rem;
}
.sidebar-search input { flex: 1; padding: 0.4rem; border: 1px solid var(--border); border-radius: 4px; }
.sidebar-filtros {
  padding: 0 1rem 0.5rem;
  display: flex;
  flex-wrap: wrap;
  gap: 0.3rem;
}
.chip-sm { font-size: 0.72rem; padding: 0.2rem 0.5rem; }
.processo-lista {
  list-style: none;
  margin: 0;
  padding: 0;
  overflow-y: auto;
  flex: 1;
  border-top: 1px solid var(--border);
}
.processo-link {
  display: block;
  padding: 0.45rem 0.85rem;
  text-decoration: none;
  color: inherit;
  border-bottom: 1px solid var(--border);
}
.processo-link:hover { background: #f0f4f8; }
.processo-link.ativo {
  background: #e0f2f4;
  border-left: 3px solid var(--accent);
  padding-left: calc(1rem - 3px);
}
.pl-numero { display: block; font-weight: 700; font-size: var(--fs-sm); }
.pl-erp { display: block; font-size: var(--fs-xs); color: var(--muted); }
.pl-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem 0.5rem;
  margin-top: 0.35rem;
  font-size: 0.8rem;
  align-items: center;
  line-height: 1.35;
  color: #5a6570;
}
.pl-pct { font-weight: 500; color: #37474f; }
.pl-afat { color: #b71c1c; font-weight: 500; font-size: 0.78rem; }
.pl-saldo { font-size: 0.78rem; font-weight: 500; padding: 0.1rem 0.45rem; border-radius: 999px; }
.pl-saldo-cobrar { background: #fff3e0; color: #e65100; }
.pl-saldo-devolver { background: #e8f5e9; color: #2e7d32; }
.pl-saldo-quitado { color: #607d8b; }
.sidebar-foot { padding: 0.5rem 1rem; font-size: 0.75rem; margin: 0; border-top: 1px solid var(--border); }

.painel-main { min-width: 0; }

/* Filtro por item (painel) */
.painel-filtro-item {
  margin-bottom: 0.65rem;
  padding: 0.65rem 0.85rem;
  background: linear-gradient(180deg, #f8fafb 0%, #fff 100%);
  border-color: #c5d9d0;
}
.painel-filtro-head {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 0.35rem 0.75rem;
  margin-bottom: 0.45rem;
}
.painel-filtro-head label {
  font-size: 0.88rem;
  font-weight: 600;
  color: var(--accent);
  margin: 0;
}
.painel-filtro-hint { font-size: 0.75rem; }
.painel-filtro-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.45rem;
}
.painel-filtro-input {
  flex: 1 1 12rem;
  max-width: 22rem;
  padding: 0.42rem 0.65rem;
  font-size: 0.9rem;
  border: 1px solid var(--border);
  border-radius: 6px;
}
.painel-filtro-input:focus {
  outline: 2px solid rgba(0, 77, 38, 0.25);
  border-color: var(--accent);
}
.painel-filtro-status {
  margin: 0.4rem 0 0;
  font-size: 0.8rem;
}
/* Ordenação por coluna no painel */
.th-sortable {
  cursor: pointer;
  user-select: none;
  white-space: nowrap;
}
.th-sort-btn {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  width: 100%;
  padding: 0;
  margin: 0;
  border: none;
  background: transparent;
  font: inherit;
  font-weight: inherit;
  color: inherit;
  text-align: inherit;
  cursor: pointer;
  line-height: 1.3;
}
.th-sort-btn:focus-visible {
  outline: 2px solid #7c6b9e;
  outline-offset: 2px;
  border-radius: 3px;
}
.th-sort-icon::after {
  content: "↕";
  font-size: 0.65rem;
  opacity: 0.35;
  font-weight: 400;
}
.th-sort-asc .th-sort-icon::after {
  content: "▲";
  opacity: 0.85;
  color: #3949ab;
}
.th-sort-desc .th-sort-icon::after {
  content: "▼";
  opacity: 0.85;
  color: #3949ab;
}
.table-espelho-operacional .esp-sticky.th-sortable .th-sort-btn {
  justify-content: flex-start;
}

/* Faixa fase beta (VPS / domínio) */
.faixa-beta {
  background: linear-gradient(90deg, #fff8e1 0%, #ffecb3 100%);
  color: #5d4037;
  text-align: center;
  font-size: 0.78rem;
  padding: 0.45rem 0.75rem;
  border-bottom: 1px solid #ffe082;
  line-height: 1.4;
}
.faixa-beta strong {
  color: #e65100;
}
.main-com-beta {
  padding-top: 0.25rem;
}
.badge-beta {
  display: inline-block;
  font-size: 0.68rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  padding: 2px 8px;
  border-radius: 4px;
  background: #ff9800;
  color: #fff;
  vertical-align: middle;
}
.login-fase-beta {
  margin: 0 0 1rem;
  font-size: 0.82rem;
  color: #6d4c41;
  text-align: center;
}

.filtro-vazio-msg {
  margin: 0 0 0.4rem;
  font-size: 0.82rem;
  padding: 0.35rem 0.5rem;
  background: #fff8e1;
  border-radius: 6px;
}
.painel-com-filtro-item .linha-filtravel:not([hidden]) {
  box-shadow: inset 3px 0 0 #00796b;
}
.painel-com-filtro-item .tabela-filtravel:has(tr.linha-filtravel:not([hidden])) {
  outline: 1px solid #c8e6c9;
  outline-offset: 2px;
  border-radius: 4px;
}
.painel-header { display: block; }
.painel-header-grid {
  display: grid;
  grid-template-columns: 1fr minmax(200px, 240px) minmax(260px, 320px);
  gap: 1.25rem 1.5rem;
  margin-top: 0.75rem;
  align-items: start;
}
.painel-header-chart {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  padding: 0.65rem 0.85rem;
  background: linear-gradient(145deg, #f8fafb 0%, #f0f4f2 100%);
  border: 1px solid #e4ebe8;
  border-radius: 12px;
}
.header-chart-donut-wrap {
  position: relative;
  width: 72px;
  height: 72px;
  flex-shrink: 0;
}
.header-donut {
  width: 72px;
  height: 72px;
  transform: rotate(-90deg);
}
.donut-bg { stroke: #e8ecef; }
.donut-fg { stroke: #00796b; stroke-linecap: round; transition: stroke-dasharray 0.4s ease; }
.header-chart-center {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  font-size: 0.95rem;
  color: #004d26;
  line-height: 1;
}
.header-chart-center small { font-size: 0.65rem; color: #607d8b; font-weight: 500; }
.header-chart-title { display: block; font-weight: 600; font-size: 0.88rem; color: #263238; }
.header-chart-sub { font-size: 0.72rem; }
.header-chart-legend {
  list-style: none;
  margin: 0.35rem 0 0;
  padding: 0;
  font-size: 0.72rem;
  color: #546e7a;
}
.header-chart-legend li { display: flex; align-items: center; gap: 0.35rem; margin-top: 0.15rem; }
.legend-swatch { width: 8px; height: 8px; border-radius: 2px; display: inline-block; }
.legend-vf { background: #00897b; }
.legend-rem { background: #00897b; }
.legend-vnd { background: #5c6bc0; }
@media (max-width: 960px) {
  .painel-header-grid { grid-template-columns: 1fr; }
  .painel-header-chart { max-width: 320px; }
}

.painel-header-composicao {
  display: grid;
  grid-template-columns: 1.15fr 1fr;
  gap: 1rem;
  margin-top: 1rem;
  padding-top: 1rem;
  border-top: 1px solid #e8ecef;
}
.composicao-panel {
  padding: 0.75rem 0.9rem;
  background: linear-gradient(160deg, #fafcfc 0%, #f4f7f6 100%);
  border: 1px solid #e4ebe8;
  border-radius: 12px;
}
.composicao-head {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: space-between;
  gap: 0.25rem 0.75rem;
  margin-bottom: 0.65rem;
}
.composicao-head strong { font-size: 0.88rem; color: #263238; }
.composicao-head .muted { font-size: 0.72rem; }
.composicao-bar-row {
  display: grid;
  grid-template-columns: 4.5rem 1fr auto;
  gap: 0.5rem;
  align-items: center;
  margin-bottom: 0.45rem;
}
.composicao-label { font-size: 0.78rem; color: #546e7a; font-weight: 500; }
.composicao-track {
  height: 14px;
  background: #eceff1;
  border-radius: 999px;
  overflow: hidden;
  position: relative;
}
.composicao-track-stack { display: flex; flex-direction: row; }
.composicao-fill {
  height: 100%;
  border-radius: 999px;
  transition: width 0.5s ease;
  min-width: 2px;
}
.fill-pedido {
  background: linear-gradient(90deg, #004d26 0%, #00796b 100%);
  box-shadow: inset 0 -1px 0 rgba(0,0,0,0.06);
}
.fill-vf { background: linear-gradient(90deg, #00897b, #26a69a); border-radius: 0; }
.fill-rem { background: linear-gradient(90deg, #00897b, #26a69a); border-radius: 0; }
.fill-venda { background: linear-gradient(90deg, #5c6bc0, #7986cb); border-radius: 0; }
.composicao-track-stack .fill-vf:first-child,
.composicao-track-stack .fill-rem:first-child { border-radius: 999px 0 0 999px; }
.composicao-track-stack .fill-venda:last-child { border-radius: 0 999px 999px 0; }
.composicao-val {
  font-size: 0.75rem;
  font-weight: 600;
  color: #37474f;
  white-space: nowrap;
}
.composicao-legend {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem 1rem;
  margin-top: 0.5rem;
  font-size: 0.72rem;
  color: #607d8b;
}
.composicao-legend .swatch {
  display: inline-block;
  width: 8px;
  height: 8px;
  border-radius: 2px;
  margin-right: 0.2rem;
  vertical-align: middle;
}
.swatch-vf, .swatch-rem { background: #00897b; }
.swatch-venda, .swatch-vnd { background: #5c6bc0; }
.swatch-pedido { background: #004d26; }
.swatch-rup { background: #ef6c00; }
.swatch-pend { background: #bdbdbd; }
.swatch-vf.seg-vf, .stack-seg.seg-vf { background: #80cbc4; }
.composicao-saldo { font-weight: 600; }
.composicao-saldo-cobrar { color: #e65100; }
.composicao-saldo-devolver { color: #2e7d32; }
.composicao-stack-bar {
  display: flex;
  height: 18px;
  border-radius: 999px;
  overflow: hidden;
  background: #eceff1;
  box-shadow: inset 0 1px 2px rgba(0,0,0,0.04);
}
.stack-seg {
  height: 100%;
  transition: width 0.45s ease;
  min-width: 2px;
}
.seg-rem { background: linear-gradient(180deg, #26a69a, #00897b); }
.seg-vnd { background: linear-gradient(180deg, #7986cb, #5c6bc0); }
.seg-rup { background: linear-gradient(180deg, #ffb74d, #ef6c00); }
.seg-pend { background: #cfd8dc; }
.seg-vf { background: #b2dfdb; }
.composicao-stack-legend {
  list-style: none;
  margin: 0.5rem 0 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem 0.85rem;
  font-size: 0.72rem;
  color: #546e7a;
}
.composicao-stack-legend .swatch {
  display: inline-block;
  width: 8px;
  height: 8px;
  border-radius: 2px;
  margin-right: 0.25rem;
  vertical-align: middle;
}
.composicao-rup-hint { font-size: 0.72rem; margin: 0.4rem 0 0; }
@media (max-width: 800px) {
  .painel-header-composicao { grid-template-columns: 1fr; }
}
.painel-abas {
  display: flex;
  gap: 0.35rem;
  border-bottom: 1px solid var(--border);
  padding-bottom: 0.5rem;
  margin-bottom: 0;
}
.painel-abas .aba {
  padding: 0.35rem 0.85rem;
  border-radius: 6px 6px 0 0;
  text-decoration: none;
  color: var(--muted);
  font-size: var(--fs-sm);
  font-weight: 600;
}
.painel-abas .aba-ativa {
  background: #e0f2f4;
  color: var(--accent);
}
.painel-abas .aba-tv {
  background: #0a1628;
  color: #26c6da;
}
.painel-abas-com-acoes {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.35rem 0.5rem;
}
.painel-abas-com-acoes .painel-btn-pdf { margin-left: auto; }
.pagina-conta { max-width: 720px; }
.form-grid-conta {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.75rem 1rem;
  margin: 1rem 0;
}
.gestao-form-full { grid-column: 1 / -1; }
.form-hint { font-size: 0.78rem; margin-top: 0.25rem; }

/* Botão info — explicações em popover */
.ui-info {
  position: relative;
  display: inline-block;
  vertical-align: middle;
  flex-shrink: 0;
}
.ui-info-btn {
  list-style: none;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 1.7rem;
  height: 1.35rem;
  padding: 0 0.4rem;
  font-size: 0.62rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--accent);
  background: #e8f2ec;
  border: 1px solid #b8d4c4;
  border-radius: 4px;
  user-select: none;
  line-height: 1;
}
.ui-info-btn::-webkit-details-marker,
.ui-info-btn::marker { display: none; content: ""; }
.ui-info[open] > .ui-info-btn {
  background: var(--accent);
  border-color: var(--accent);
  color: #fff;
}
.ui-info-panel {
  position: absolute;
  z-index: 50;
  top: calc(100% + 5px);
  left: 0;
  min-width: min(22rem, calc(100vw - 2rem));
  max-width: min(30rem, calc(100vw - 2rem));
  padding: 0.55rem 0.7rem;
  font-size: 0.78rem;
  line-height: 1.45;
  background: #fff;
  border: 1px solid var(--border);
  border-radius: 8px;
  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.12);
  text-align: left;
}
.ui-info-panel strong { font-weight: 600; }
.ui-info-panel ol,
.ui-info-panel ul { margin: 0.35rem 0 0; padding-left: 1.15rem; }
.ui-info-panel li + li { margin-top: 0.25rem; }
.titulo-com-info {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  flex-wrap: wrap;
}
.titulo-com-info h2,
.titulo-com-info h3,
.titulo-com-info label { margin: 0; }
.alerta-compacta {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  margin: 0.35rem 0 0.5rem;
  flex-wrap: wrap;
}
.alerta-compacta-label {
  display: inline-block;
  padding: 0.15rem 0.45rem;
  font-size: 0.68rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  color: #e65100;
  background: #fff3e0;
  border: 1px solid #ffcc80;
  border-radius: 4px;
}
.secao-info-inline {
  margin: 0 0 0.45rem;
}
.espelho-titulo-row .titulo-com-info { flex: 1; min-width: 12rem; }
.radio-card {
  display: flex;
  align-items: flex-start;
  gap: 0.5rem;
  padding: 0.5rem 0.65rem;
  margin-top: 0.35rem;
  border: 1px solid var(--border);
  border-radius: 8px;
  cursor: pointer;
  background: #fafbfc;
}
.radio-card:has(input:checked) {
  border-color: var(--accent);
  background: #f0f8f4;
}
.form-inline-cliente {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  margin-bottom: 1rem;
}
.flash-ok { color: #2e7d32; background: #e8f5e9; padding: 0.5rem 0.75rem; border-radius: 6px; }
.flash-erro { color: #c62828; background: #ffebee; padding: 0.5rem 0.75rem; border-radius: 6px; }
.pagina-conta-foot { margin-top: 1.25rem; display: flex; flex-wrap: wrap; gap: 0.5rem; }
.card-interno {
  margin: 1rem 0;
  padding: 0.75rem 1rem;
  border: 1px solid var(--border);
  border-radius: 10px;
  background: #fafbfc;
}
.card-interno summary { cursor: pointer; font-weight: 600; margin-bottom: 0.5rem; }
.row-inativo { opacity: 0.65; }
.form-inline-toggle { display: inline; margin: 0; }
.h2-compact { font-size: 1rem; margin: 1.25rem 0 0.5rem; }
@media (max-width: 640px) {
  .form-grid-conta { grid-template-columns: 1fr; }
}
.header nav a.nav-tv {
  color: #26c6da;
  font-weight: 600;
}
.row-ok { background: #f1f8f4; }
.atend-item-cell { padding: 0 !important; vertical-align: top; }
.atend-item-linha {
  display: grid;
  grid-template-columns: 4.5rem 5.5rem 1fr repeat(8, minmax(3.2rem, auto));
  gap: 0.35rem;
  align-items: center;
  padding: 0.4rem 0.5rem;
  font-size: var(--fs-sm);
}
@media (max-width: 1100px) {
  .atend-item-linha {
    grid-template-columns: repeat(3, 1fr);
  }
  .atend-desc { grid-column: 1 / -1; }
}
.atend-falta { color: #c62828; }
.atend-nf-detalhe {
  margin: 0 0.5rem 0.5rem;
  padding: 0.35rem 0.5rem;
  background: #f8fafc;
  border-radius: 6px;
  border: 1px solid var(--border);
}
.atend-nf-detalhe summary {
  cursor: pointer;
  font-size: var(--fs-xs);
  color: var(--accent);
  font-weight: 600;
  padding: 0.25rem 0;
}
.table-atend-nfs { font-size: var(--fs-xs); margin-top: 0.35rem; }
.tag-vf { background: #e3f2fd; color: #1565c0; }
.tag-rem { background: #f3e5f5; color: #6a1b9a; }
.tag-vnd { background: #e8f5e9; color: #2e7d32; }
.tag-rjes { background: #fff3e0; color: #e65100; }
.tag-outro { background: #eceff1; color: #546e7a; }
.painel-header h1 { margin: 0 0 0.5rem; font-size: 1.2rem; }
.ident-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
  gap: 0.5rem 1rem;
  margin: 0;
}
.ident-grid dt { font-size: 0.7rem; color: var(--muted); text-transform: uppercase; margin: 0; }
.ident-grid dd { margin: 0; font-weight: 600; font-size: var(--fs-sm); }
.painel-gestao { display: flex; flex-direction: column; gap: 0.75rem; }
.gestao-form label { display: block; font-size: 0.75rem; color: var(--muted); margin-bottom: 0.2rem; }
.gestao-form select,
.gestao-form textarea {
  width: 100%;
  padding: 0.45rem;
  border: 1px solid var(--border);
  border-radius: 4px;
  font-family: inherit;
}
.card-compact {
  padding: 0.65rem 0.85rem;
  margin-bottom: 0.65rem;
}
.card-compact h2 {
  margin: 0 0 0.45rem;
  font-size: 0.95rem;
}
.painel-main-compact .card { margin-bottom: 0.65rem; }
.painel-grid-2-compact {
  gap: 0.65rem;
  margin-bottom: 0.65rem;
}
.ident-grid-compact { gap: 0.35rem 0.75rem; }
.pedido-resumo-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
  gap: 0.5rem 1rem;
  margin: 0;
}
.pedido-resumo-grid dt {
  font-size: 0.68rem;
  color: var(--muted);
  text-transform: uppercase;
  margin: 0;
}
.pedido-resumo-grid dd { margin: 0.1rem 0 0; font-size: 0.88rem; }
.pedido-valor-destaque { font-size: 1rem; font-weight: 700; color: #1565c0; }
.pedido-unico-card { max-width: 100%; }
.table-compact {
  font-size: var(--fs-sm);
  table-layout: fixed;
  width: 100%;
}
.table-compact th,
.table-compact td {
  padding: 0.28rem 0.4rem;
  overflow: hidden;
  text-overflow: ellipsis;
  word-wrap: break-word;
}
/* —— Itens do pedido (painel): colunas alinhadas + cabeçalho fixo —— */
.table-wrap-itens-pedido {
  max-height: min(480px, 62vh);
  overflow: auto;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: thin;
  scrollbar-color: #90a4ae #eceff1;
  border: 1px solid var(--border);
  border-radius: 8px;
}
.table-wrap-itens-pedido::-webkit-scrollbar {
  height: 8px;
  width: 8px;
}
.table-wrap-itens-pedido::-webkit-scrollbar-thumb {
  background: #90a4ae;
  border-radius: 4px;
}
.table-itens-painel {
  table-layout: fixed;
  width: 100%;
  min-width: 58rem;
  border-collapse: separate;
  border-spacing: 0;
}
.table-wrap-itens-pedido .table-itens-painel th,
.table-wrap-itens-pedido .table-itens-painel td {
  overflow: visible;
  text-overflow: clip;
  vertical-align: middle;
}
.table-itens-painel thead.itens-pedido-thead th {
  position: sticky;
  top: 0;
  z-index: 3;
  background: #eef2f5;
  box-shadow: 0 1px 0 #cfd8dc;
}
.table-itens-painel .col-ped { width: 3.25rem; }
.table-itens-painel .col-ln { width: 2.5rem; text-align: center; }
.table-itens-painel .col-cod-ext { width: 5.5rem; }
.table-itens-painel .col-cod-int { width: 7.25rem; }
.table-itens-painel .col-desc { width: auto; min-width: 9rem; }
.table-itens-painel .col-qtd { width: 4.75rem; }
.table-itens-painel .col-fat { width: 4.25rem; }
.table-itens-painel .col-a-fat { width: 7.5rem; }
.table-itens-painel .col-vl-unit { width: 5.25rem; }
.table-itens-painel .col-total { width: 6.25rem; }
.table-itens-painel .col-vl-a-fat { width: 6.25rem; }
.table-itens-painel .col-status {
  width: 8.5rem;
  min-width: 8.5rem;
  padding-right: 0.75rem !important;
}
.table-itens-painel .col-qtd,
.table-itens-painel .col-fat,
.table-itens-painel .col-a-fat,
.table-itens-painel .col-vl-unit,
.table-itens-painel .col-total,
.table-itens-painel .col-vl-a-fat {
  text-align: right;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}
.table-itens-painel .col-a-fat {
  white-space: normal;
  line-height: 1.3;
}
.table-itens-painel .col-a-fat .a-fat-linha {
  display: block;
  text-align: right;
  white-space: nowrap;
}
.table-itens-painel .col-a-fat .a-fat-rem strong { color: #e65100; }
.table-itens-painel .col-status .badge-item {
  display: inline-block;
  max-width: 100%;
  white-space: normal;
  word-break: break-word;
  line-height: 1.2;
  text-align: center;
}
.table-itens .desc-cell,
.table-itens-painel .desc-cell {
  white-space: normal;
  word-break: break-word;
  line-height: 1.3;
  min-width: 6rem;
}
.table-itens .num { white-space: nowrap; }
.acoes-remocao {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem;
  align-items: center;
}
.acoes-remocao .inline-form { display: inline; margin: 0; }
.table-wrap-compact { max-height: 420px; }
.section-hint-tight { margin: 0 0 0.4rem; font-size: 0.8rem; }
.espelho-wrap-compact {
  max-height: min(420px, 55vh);
  overflow-x: auto;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: thin;
  scrollbar-color: #90a4ae #eceff1;
}
.espelho-wrap-compact::-webkit-scrollbar {
  height: 10px;
  width: 10px;
}
.espelho-wrap-compact::-webkit-scrollbar-thumb {
  background: #90a4ae;
  border-radius: 6px;
}
.espelho-wrap-compact::-webkit-scrollbar-track {
  background: #eceff1;
  border-radius: 6px;
}
.espelho-legenda-compact { font-size: 0.78rem; margin: 0.35rem 0 0; }
.table-espelho-pares .col-grupo-nf {
  text-align: center;
  background: #e8f4f6;
  font-size: 0.72rem;
  border-bottom: 1px solid var(--border);
}
.table-espelho-pares .th-sub { font-weight: 400; font-size: 0.65rem; color: var(--muted); }
.cel-nf { line-height: 1.25; white-space: nowrap; }
.esp-qtd { display: block; font-weight: 600; }
.esp-val { display: block; font-size: 0.68rem; color: var(--muted); font-weight: 400; }
.col-resumo { background: #fff8e1; }
.nf-resumo-compact { margin-bottom: 0; }
.resumo-saldo-cobrar { background: #fff8f0; border-color: #ffe0b2; }
.resumo-saldo-devolver { background: #f1f8f4; border-color: #c8e6c9; }
.resumo-saldo-cobrar .rc-value { color: #e65100; }
.resumo-saldo-devolver .rc-value { color: #2e7d32; }
.pedido-saldo-cell { grid-column: 1 / -1; padding: 0.5rem 0.65rem; border-radius: 8px; margin-top: 0.25rem; }
.pedido-saldo-cobrar { background: #fff8f0; }
.pedido-saldo-devolver { background: #f1f8f4; }
.pedido-saldo-hint { font-size: 0.78rem; margin: 0.15rem 0 0; }
.totais-saldo { font-size: 0.88rem; font-weight: 500; }
.totais-saldo-cobrar { color: #e65100; }
.totais-saldo-devolver { color: #2e7d32; }
.totais-row td { padding-top: 0.65rem !important; font-size: 0.92rem; }
.resumo-cards-compact {
  grid-template-columns: repeat(auto-fit, minmax(115px, 1fr));
  gap: 0.5rem;
  margin-bottom: 0.65rem;
}
.resumo-cards-compact .resumo-card { padding: 0.55rem 0.65rem; }
.resumo-cards-compact .rc-label { font-size: 0.78rem; opacity: 0.9; }
.resumo-cards-compact .rc-value { font-size: 1.05rem; font-weight: 600; }
.resumo-cards-compact .rc-value.rc-sm { font-size: 0.9rem; font-weight: 600; }
.resumo-cards-compact .rc-hint { font-size: 0.72rem; opacity: 0.85; }
.resumo-cards {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(130px, 1fr));
  gap: 0.75rem;
  margin-bottom: 1rem;
}
.resumo-card {
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: 8px;
  padding: 0.55rem 0.65rem;
  text-align: center;
}
.resumo-destaque { background: #e8f5e9; border-color: #a5d6a7; }
.resumo-alerta { background: #fff3e0; border-color: #ffcc80; }
.rc-label { display: block; font-size: 0.68rem; color: var(--muted); text-transform: uppercase; }
.rc-value { display: block; font-size: 1.15rem; font-weight: 700; }
.rc-value.rc-sm { font-size: 0.9rem; }
.rc-hint { font-size: 0.72rem; color: var(--muted); }
.painel-grid-2 {
  display: grid;
  grid-template-columns: 1.5fr 1fr;
  gap: 1rem;
  margin-bottom: 1rem;
}
@media (max-width: 900px) {
  .painel-grid-2 { grid-template-columns: 1fr; }
}
.section-hint { margin: -0.25rem 0 0.75rem; font-size: 0.85rem; }
.painel-vazio { text-align: center; padding: 3rem; }
.container-main { max-width: 1600px; }
.flash-msg { margin-bottom: 1rem; }
.nf-quattror-card { border-left: 4px solid #1565c0; margin-bottom: 1rem; }
.nf-quattror-card h2 { margin: 0 0 0.5rem; }
.nf-resumo {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
  gap: 0.5rem 1rem;
  margin: 0 0 1rem;
}
.nf-resumo dt { font-size: 0.7rem; color: var(--muted); text-transform: uppercase; margin: 0; }
.nf-resumo dd { margin: 0; font-weight: 600; }
.nf-chave { grid-column: 1 / -1; }
.nf-chave dd { font-size: 0.8rem; word-break: break-all; font-weight: 400; }
.nf-pendente { color: #c62828; font-weight: 600; margin: 0 0 1rem; }
.xml-upload-form {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
  align-items: center;
  padding-top: 0.75rem;
  border-top: 1px solid var(--border);
}
.xml-file-label input[type="file"] {
  position: absolute;
  width: 0.1px;
  height: 0.1px;
  opacity: 0;
  overflow: hidden;
}
.xml-file-label { position: relative; cursor: pointer; }
.xml-nome { font-size: 0.85rem; max-width: 280px; overflow: hidden; text-overflow: ellipsis; }
.inline-danger { display: inline; margin-left: 1rem; }

.pagina-importar {
  max-width: 640px;
  margin: 0 auto;
  padding: 0 0.5rem 1.5rem;
}
.pagina-importar .flash-msg { margin-bottom: 1rem; }
.anexar-hero {
  text-align: left;
  border-left: 4px solid var(--accent);
  padding: 1rem 1.15rem;
  margin-bottom: 1rem;
}
.anexar-hero h1 { margin: 0 0 0.4rem; font-size: 1.25rem; }
.anexar-hero > p { margin: 0 0 0.65rem; font-size: 0.9rem; line-height: 1.45; }
.anexar-form-card {
  max-width: none;
  margin: 0 0 1rem;
  padding: 1.15rem 1.25rem;
}
.anexar-form {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  align-items: stretch;
}
.anexar-label {
  display: block;
  width: 100%;
  margin: 0;
}
.anexar-label span {
  display: block;
  font-weight: 600;
  margin-bottom: 0.3rem;
  font-size: 0.88rem;
}
.anexar-label select {
  width: 100%;
  padding: 0.5rem 0.55rem;
  border: 1px solid var(--border);
  border-radius: 6px;
  font-size: 0.95rem;
  box-sizing: border-box;
}
.pagina-importar-foot {
  text-align: center;
  margin-top: 0.5rem;
  font-size: 0.88rem;
}
.btn-grande { padding: 0.55rem 1.1rem; font-size: var(--fs-sm); }
.anexar-label.anexar-arquivo {
  width: 100%;
}
.anexar-form .input-arquivo-visivel {
  width: 100%;
  max-width: 100%;
  padding: 0.65rem 0.5rem;
  border: 2px dashed var(--accent);
  border-radius: 8px;
  background: #f8fafc;
  font-size: 0.9rem;
  box-sizing: border-box;
}
.nf-quattror-destaque {
  background: linear-gradient(180deg, #e3f2fd 0%, #fff 100%);
  border: 2px solid #1565c0;
  margin-bottom: 1rem;
}
.nf-destaque-titulo {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
  gap: 0.5rem;
}
.nf-destaque-titulo h2 { margin: 0; color: #0d47a1; }

.espelho-titulo-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
}
.espelho-acoes {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
  align-items: center;
}
.btn-relatorio {
  font-weight: 600;
  border: none;
  color: #fff;
}
.btn-relatorio-pdf {
  background: linear-gradient(135deg, #c62828 0%, #b71c1c 100%);
}
.btn-relatorio-pdf:hover { filter: brightness(1.08); color: #fff; }
.btn-relatorio-xlsx {
  background: linear-gradient(135deg, #2e7d32 0%, #1b5e20 100%);
}
.btn-relatorio-xlsx:hover { filter: brightness(1.08); color: #fff; }
.nf-destaque-texto { margin: 0.5rem 0 1rem; color: #1565c0; }
.xml-upload-destaque { border-top: none; padding-top: 0; }
.ok-inline { color: #2e7d32; font-weight: 600; margin: 0 0 0.75rem; }

.nav-logout { color: #ffb4a9 !important; }

.login-page {
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  background: var(--bg);
  margin: 0;
  padding: 1rem 0;
}
.login-empresa {
  margin: 0 0 0.35rem;
  text-align: center;
  font-size: 0.75rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  color: var(--accent);
}
.site-footer-login {
  width: 100%;
  margin-top: 1rem;
  background: transparent;
  border-top: none;
  color: var(--muted);
  padding: 0.25rem;
  font-size: 0.65rem;
}
.site-footer-login a { color: var(--accent); }
.login-card {
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: 2rem;
  width: 100%;
  max-width: 380px;
  box-shadow: 0 4px 20px rgba(0,0,0,0.06);
}
.login-card h1 { margin: 0 0 0.25rem; text-align: center; font-size: 1.2rem; }
.login-card .subtitle { text-align: center; margin-bottom: 1.5rem; }
.login-card label {
  display: block;
  font-size: 0.85rem;
  color: var(--muted);
  margin-top: 0.75rem;
}
.login-card input {
  width: 100%;
  padding: 0.55rem;
  margin-top: 0.25rem;
  border: 1px solid var(--border);
  border-radius: 6px;
  font-size: 1rem;
}
.btn-block { width: 100%; margin-top: 1.25rem; text-align: center; }
.login-erro {
  background: #ffebee;
  color: #b71c1c;
  padding: 0.5rem 0.75rem;
  border-radius: 6px;
  font-size: 0.9rem;
}

.timeline { list-style: none; padding: 0; margin: 0; }
.timeline li {
  border-left: 3px solid var(--border);
  padding: 0.5rem 0 0.5rem 1rem;
  margin-bottom: 0.5rem;
  position: relative;
}
.timeline li.tipo-fiscal { border-left-color: #1565c0; }
.timeline li.tipo-financeiro { border-left-color: #2e7d32; }
.timeline li.tipo-fisico { border-left-color: #6a1b9a; }
.timeline li.tipo-fechamento { border-left-color: #c62828; }
.timeline li.tipo-pedido { border-left-color: #ef6c00; }
.timeline time { font-size: 0.8rem; color: var(--muted); display: block; }
.timeline strong { font-size: 0.95rem; }

.btn-perigo {
  background: #c62828;
  color: #fff;
  border: none;
}
.btn-perigo:hover { background: #b71c1c; }
.btn-perigo-outline {
  background: transparent;
  color: #c62828;
  border: 1px solid #e57373;
  cursor: pointer;
  list-style: none;
}
.btn-perigo-outline:hover { background: #ffebee; }
.excluir-processo-details {
  margin-top: 0.75rem;
  border-top: 1px dashed var(--border);
  padding-top: 0.75rem;
}
.excluir-processo-details summary {
  display: inline-block;
  margin-bottom: 0.5rem;
}
.excluir-processo-form {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  align-items: flex-end;
}
.excluir-processo-form label {
  width: 100%;
  font-size: 0.85rem;
  color: var(--muted);
}
.excluir-processo-form input[type="password"] {
  flex: 1;
  min-width: 10rem;
  padding: 0.4rem 0.6rem;
  border: 1px solid var(--border);
  border-radius: 6px;
}

.table th.num, .table td.num {
  text-align: right;
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
  padding-left: 0.65rem;
  padding-right: 0.65rem;
}
.table-itens:not(.table-itens-painel) th,
.table-itens:not(.table-itens-painel) td { min-width: 3.5rem; }
.atendimento-card { border-left: 4px solid #2e7d32; }
.nfs-chips { display: flex; flex-wrap: wrap; gap: 0.35rem; margin-bottom: 0.75rem; }
.anexar-form .input-texto {
  width: 100%;
  padding: 0.5rem 0.55rem;
  border: 1px solid var(--border);
  border-radius: 6px;
  font-size: 0.95rem;
  box-sizing: border-box;
}

.import-passos {
  margin: 0;
  padding-left: 1.15rem;
  font-size: 0.84rem;
  line-height: 1.45;
}
.import-passos li { margin-bottom: 0.3rem; }
.anexar-form .form-hint {
  display: block;
  font-size: 0.78rem;
  margin: 0.2rem 0 0;
  color: var(--muted);
  line-height: 1.35;
}
.obrigatorio { color: #c62828; }
.campo-num-processo {
  width: 100%;
  max-width: 100%;
  font-size: 1rem;
  font-weight: 600;
  letter-spacing: 0.05em;
  box-sizing: border-box;
}
.anexar-form .btn-grande {
  width: 100%;
  margin-top: 0.25rem;
}
.sync-maxprod-form {
  margin-top: 1.25rem;
  padding-top: 1.25rem;
  border-top: 1px solid var(--border, #e0e0e0);
}
.sync-maxprod-titulo { margin: 0 0 0.35rem; }
.btn-secundario {
  background: #eceff1;
  color: #263238;
  border: 1px solid #b0bec5;
}
.btn-secundario:hover { background: #cfd8dc; }
.sync-maxprod-form .btn-secundario { width: 100%; margin-top: 0.5rem; }
.campo-num-processo:invalid { border-color: #c62828; }

.espelho-card { border-left: 4px solid #1565c0; }
.espelho-wrap {
  overflow-x: auto;
  overflow-y: visible;
  max-width: 100%;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: thin;
  scrollbar-color: #90a4ae #eceff1;
}
.espelho-wrap::-webkit-scrollbar {
  height: 10px;
}
.espelho-wrap::-webkit-scrollbar-thumb {
  background: #90a4ae;
  border-radius: 6px;
}
/* Espelho: não usar table-layout fixed nem cortar células (table-compact global) */
.espelho-wrap .table-espelho {
  font-size: 0.78rem;
  border-collapse: separate;
  border-spacing: 0;
  table-layout: auto;
  width: max-content;
  min-width: 100%;
}
.espelho-wrap .table-espelho th,
.espelho-wrap .table-espelho td {
  padding: 0.35rem 0.5rem;
  border-bottom: 1px solid var(--border);
  vertical-align: middle;
  overflow: visible;
  text-overflow: clip;
  white-space: nowrap;
}
.table-espelho thead th {
  background: #f5f7fa;
  position: sticky;
  top: 0;
  z-index: 2;
  font-size: 0.72rem;
  line-height: 1.2;
}
.esp-sticky {
  position: sticky;
  left: 0;
  z-index: 1;
  background: #fff;
  min-width: 7.5rem;
  max-width: 11rem;
  white-space: normal;
  box-shadow: 2px 0 4px rgba(0,0,0,0.04);
}
.table-espelho thead .esp-sticky { z-index: 3; background: #f5f7fa; }
.table-espelho-pares .col-grupo-nf { min-width: 8.5rem; }
.table-espelho-pares .cel-nf { min-width: 5.25rem; }
.table-espelho-pares th.num,
.table-espelho-pares td.num { min-width: 4.25rem; }
.table-espelho-pares .col-resumo { min-width: 5.5rem; }
.esp-cod-int { display: block; font-size: 0.68rem; }
.col-vf { background: #fff8e1; }
.col-rem { background: #e8f5e9; }
.col-vnd { background: #e3f2fd; }
.col-falta { background: #fff3e0; color: #e65100; }
.col-refugo { background: #ffebee; color: #c62828; }
.espelho-legenda { font-size: 0.8rem; margin-top: 0.75rem; }

.painel-filtro-inline {
  margin: 0.5rem 0 0.75rem;
  padding: 0.55rem 0.65rem;
  border: 1px solid var(--border, #dde3ea);
  border-radius: 6px;
  background: #fafbfc;
}

.painel-filtro-hint-compact {
  margin: 0.25rem 0 0;
  font-size: 0.72rem;
}

.nf-comparacao-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.85rem;
  align-items: stretch;
}

@media (max-width: 960px) {
  .nf-comparacao-grid {
    grid-template-columns: 1fr;
  }
}

.nf-comparacao-card {
  border: 1px solid var(--border, #dde3ea);
  border-radius: 8px;
  padding: 0.75rem 0.85rem;
  background: #fff;
  display: flex;
  flex-direction: column;
  gap: 0.55rem;
  min-height: 10rem;
}

.nf-card-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.5rem 0.65rem;
}

.nf-card-bloco {
  background: #f8fafb;
  border-radius: 6px;
  padding: 0.45rem 0.55rem;
}

.nf-card-bloco--full {
  grid-column: 1 / -1;
}

.nf-card-bloco--impostos {
  margin-top: 0.15rem;
}

.nf-card-bloco__titulo {
  display: block;
  font-size: 0.68rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: #667;
  margin-bottom: 0.3rem;
}

.nf-kv {
  margin: 0;
  display: grid;
  gap: 0.2rem;
}

.nf-kv > div {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 0.35rem 0.5rem;
  font-size: 0.78rem;
}

.nf-kv dt {
  margin: 0;
  color: #778;
  white-space: nowrap;
}

.nf-kv dd {
  margin: 0;
  word-break: break-word;
}

.nf-chave-texto {
  font-size: 0.68rem;
  margin: 0;
  word-break: break-all;
  line-height: 1.35;
}

.nf-impostos-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.35rem 0.5rem;
}

.nf-imposto-item {
  display: flex;
  justify-content: space-between;
  gap: 0.35rem;
  font-size: 0.78rem;
  padding: 0.2rem 0.35rem;
  background: #fff;
  border-radius: 4px;
}

.nf-imposto-item__tipo {
  color: #556;
  font-weight: 600;
  font-size: 0.72rem;
}

.nf-arquivo-hint {
  font-size: 0.68rem;
  margin: 0;
}

.nf-comparacao-resumo-linha {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem 0.85rem;
  font-size: 0.8rem;
  margin-bottom: 0.5rem;
}

.pedido-valor-hint,
.pedido-fat-hint {
  font-size: 0.68rem;
  margin-top: 0.15rem;
  grid-column: 2;
}

.pedido-rj-es-cell {
  grid-column: span 2;
  padding: 0.35rem 0.5rem;
  background: #f5f8fa;
  border-radius: 6px;
  border-left: 3px solid #90a4ae;
}

.pedido-rj-es-cell dt {
  font-size: 0.72rem;
  color: #667;
}

.pedido-rj-es-cell dd {
  margin: 0.1rem 0 0;
}

.nf-comparacao-card__titulo {
  margin: 0 0 0.5rem;
  font-size: 0.88rem;
  font-weight: 600;
  color: var(--brand, #004d26);
}

.nf-comparacao-resultado {
  margin-top: 0.85rem;
  padding-top: 0.75rem;
  border-top: 1px dashed var(--border, #dde3ea);
}

.nf-comparacao-resultado__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
  flex-wrap: wrap;
  margin-bottom: 0.35rem;
}

.nf-comparacao-produtos {
  margin: 0 0 0.5rem;
  font-size: 0.8rem;
}

.nf-comparacao-tabela .tag-sm {
  font-size: 0.65rem;
  padding: 0.1rem 0.35rem;
}

.nf-upload-form {
  margin-top: 0.65rem;
}

.nf-upload-label {
  display: block;
  font-size: 0.78rem;
  margin-bottom: 0.35rem;
}

.nf-upload-row {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  align-items: center;
}

.nf-upload-row input[type="file"] {
  font-size: 0.75rem;
  max-width: 100%;
}

.nf-estimativa-venda {
  margin-top: 1.25rem;
  padding-top: 1rem;
  border-top: 1px solid var(--border, #e2e8f0);
}

.nf-estimativa-venda__head {
  margin-bottom: 0.75rem;
}

.nf-estimativa-venda__formula {
  margin: 0.25rem 0 0;
  font-size: 0.8rem;
}

.nf-estimativa-kv {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.75rem 1.5rem;
}

@media (min-width: 720px) {
  .nf-estimativa-kv {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

.nf-estimativa-kv.nf-estimativa-kv--base > div,
.nf-estimativa-kv.nf-estimativa-kv--resultado > div {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 0.15rem;
  min-width: 0;
  grid-template-columns: unset;
}

.nf-estimativa-kv--base > div > dt,
.nf-estimativa-kv--resultado > div > dt {
  white-space: normal;
}

.nf-estimativa-valor {
  white-space: nowrap;
  word-break: keep-all;
  font-variant-numeric: tabular-nums;
}

.nf-estimativa-pct-origem {
  font-size: 0.75rem;
  white-space: nowrap;
}

.nf-estimativa-kv--resultado .nf-estimativa-orcamento-row dd {
  font-size: 1.1rem;
  color: var(--primary, #1e40af);
}

.nf-estimativa-acoes {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: 0.75rem 1.25rem;
  margin: 1rem 0;
}

.nf-estimativa-pct-row label {
  display: block;
  font-size: 0.8rem;
  margin-bottom: 0.35rem;
}

.nf-estimativa-pct-inputs {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  align-items: center;
}

.input-pct-ind {
  width: 5.5rem;
  padding: 0.35rem 0.5rem;
  font-size: 0.9rem;
}

.nf-estimativa-resultado {
  background: var(--bg-soft, #f8fafc);
  border: 1px solid var(--border, #e2e8f0);
  border-radius: 8px;
  padding: 0.85rem 1rem;
}

.nf-estimativa-resultado[hidden] {
  display: none;
}

.nf-estimativa-balisamento {
  margin-top: 0.85rem;
  padding-top: 0.75rem;
  border-top: 1px dashed var(--border, #cbd5e1);
}

.nf-estimativa-balisamento__titulo {
  margin: 0 0 0.35rem;
  font-size: 0.88rem;
}

.nf-estimativa-hint {
  font-size: 0.78rem;
  line-height: 1.45;
  margin: 0 0 0.5rem;
}

.nf-estimativa-balisamento-lista {
  margin: 0;
  padding-left: 1.1rem;
  font-size: 0.82rem;
  line-height: 1.55;
}

.nf-estimativa-ipi-detalhe {
  margin: 0.5rem 0 0.75rem;
  font-size: 0.82rem;
}

.nf-estimativa-ipi-detalhe summary {
  cursor: pointer;
  color: var(--muted, #64748b);
}

.nf-estimativa-salvar-form {
  margin: 0;
}

.nf-obs {
  font-size: 0.72rem;
  word-break: break-word;
}

.ok-text { color: #2e7d32; }
.warn-text { color: #c62828; }

.finalizar-atendimento {
  margin: 0.5rem 0 0.65rem;
  padding: 0.45rem 0.65rem;
  border: 1px solid #e6dcc4;
  border-radius: 6px;
  background: #fffdf8;
}

.finalizar-atendimento__row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem 0.75rem;
}

.finalizar-atendimento__texto {
  display: flex;
  flex-direction: column;
  gap: 0.1rem;
  min-width: 12rem;
}

.finalizar-titulo {
  font-size: 0.82rem;
  font-weight: 600;
}

.finalizar-resumo {
  font-size: 0.72rem;
}

.finalizar-form {
  margin: 0;
}

.finalizar-form-row {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem;
  align-items: center;
}

.btn-finalizar {
  white-space: nowrap;
}

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}
.pallets-inline-form {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem;
  align-items: center;
}
.pallets-inline-form .input-pallets {
  width: 5rem;
}

.finalizar-form .input-confirm {
  width: 5rem;
  text-transform: uppercase;
  font-weight: 600;
  letter-spacing: 0.05em;
}

/* Tipografia gradativa */
@media (max-width: 1400px) {
  :root {
    --fs-base: 0.8rem;
    --fs-sm: 0.73rem;
    --fs-xs: 0.66rem;
  }
  .header nav a { font-size: 0.68rem; padding: 0.24rem 0.4rem; }
}
@media (max-width: 1200px) {
  :root {
    --fs-base: 0.78rem;
    --fs-sm: 0.71rem;
    --fs-xs: 0.64rem;
  }
  .header nav a { font-size: 0.65rem; }
}

/* Tablet / mobile — menu lateral */
@media (max-width: 960px) {
  .header-fixo {
    z-index: 1003;
  }
  .nav-toggle {
    display: flex;
  }
  .nav-principal {
    position: fixed;
    top: var(--nav-h);
    right: 0;
    z-index: 1002;
    flex-direction: column;
    align-items: stretch;
    justify-content: flex-start;
    width: min(14.5rem, 72vw);
    height: calc(100dvh - var(--nav-h));
    padding: 0.75rem 0.85rem 1.25rem;
    gap: 0.15rem;
    overflow-x: hidden;
    overflow-y: auto;
    background: linear-gradient(180deg, var(--brand) 0%, var(--brand-hover) 100%);
    box-shadow: -6px 0 20px rgba(0, 0, 0, 0.18);
    transform: translateX(100%);
    transition: transform 0.28s cubic-bezier(0.4, 0, 0.2, 1);
    flex: none;
  }
  body.nav-open .nav-principal {
    transform: translateX(0);
  }
  body.nav-open .nav-overlay {
    display: block;
  }
  body.nav-open {
    overflow: hidden;
  }
  .header nav a {
    font-size: 0.82rem;
    padding: 0.55rem 0.65rem;
    border-radius: 6px;
  }
  .header nav a.nav-logout {
    margin-top: 0.5rem;
    border-top: 1px solid rgba(255, 255, 255, 0.2);
    padding-top: 0.75rem;
  }
  .nav-cliente-badge {
    font-size: 0.62rem;
    max-width: 5rem;
    overflow: hidden;
    text-overflow: ellipsis;
  }
}

/* Mobile — painel */
@media (max-width: 640px) {
  .header-marca {
    flex: 1;
    min-width: 0;
  }
  .logo-carvalho-nome {
    font-size: 0.62rem;
  }
  .container,
  .container-main {
    padding-left: 0.65rem;
    padding-right: 0.65rem;
  }
  .painel-sidebar {
    position: static;
    max-height: none;
  }
  .painel-layout {
    gap: 0.65rem;
  }
  .resumo-cards-compact {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .pedido-resumo-grid {
    grid-template-columns: 1fr;
  }
  .painel-gestao {
    width: 100%;
  }
  .espelho-acoes {
    width: 100%;
  }
  .espelho-acoes .btn {
    flex: 1 1 auto;
    min-width: 0;
    text-align: center;
  }
  .finalizar-form {
    flex-direction: column;
    align-items: stretch;
  }
  .pallets-inline-form {
    flex-direction: column;
    align-items: stretch;
  }
  .pallets-inline-form .input-pallets {
    width: 100%;
  }
  .table-wrap {
    margin-left: -0.35rem;
    margin-right: -0.35rem;
    border-radius: 0;
  }
  .progresso-slide-wrap {
    flex-direction: column;
  }
  .progresso-nav {
    width: 100%;
    flex: none;
  }
  .dialog-espelho,
  .dialog-faturamento-impressao {
    width: calc(100vw - 1rem);
    max-width: calc(100vw - 1rem);
    max-height: 92dvh;
    margin: auto;
    padding: 0.65rem 0.5rem;
  }
  .fin-modal-inner,
  .fin-analise {
    padding: 0;
  }
  .fin-top {
    flex-direction: column;
  }
  .fin-busca-row {
    flex-direction: column;
    align-items: stretch;
  }
  .fin-busca-row .btn {
    width: 100%;
  }
  .fin-metricas-grid {
    grid-template-columns: 1fr;
  }
  .fin-tabs-nav {
    flex-wrap: nowrap;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    gap: 0.35rem;
    padding-bottom: 4px;
  }
  .fin-tab {
    flex-shrink: 0;
    font-size: 0.78rem;
  }
  .fin-col-acao {
    max-width: none;
  }
  .fin-conclusao-form {
    max-width: none;
  }
  .table-espelho-operacional .esp-sticky {
    position: sticky;
    left: 0;
    z-index: 2;
    min-width: 4.5rem;
  }
  .th-sort-btn {
    font-size: 0.68rem;
  }
}

/* Painel financeiro IMBECOR */
.fin-layout {
  max-width: 1100px;
  margin: 0 auto;
}
.fin-top {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 16px;
}
.fin-top h1 {
  margin: 0 0 4px;
}
.fin-top-sync {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}
.fin-forcar-sync {
  font-size: 0.85rem;
  color: #4a5568;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  cursor: pointer;
  user-select: none;
}
.fin-busca {
  margin-bottom: 16px;
  padding: 18px 20px;
  border-left: 4px solid #2e7d4a;
}
.fin-busca-label {
  display: block;
  font-weight: 600;
  font-size: 0.9rem;
  margin-bottom: 8px;
  color: #0f2942;
}
.fin-busca-row {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}
.fin-busca-input {
  flex: 1;
  min-width: 200px;
  max-width: 320px;
  padding: 10px 14px;
  font-size: 1.05rem;
  border: 1px solid #c5d0de;
  border-radius: 8px;
}
.fin-busca-hint {
  margin: 10px 0 0;
  font-size: 0.85rem;
}
.fin-kpis {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  gap: 12px;
  margin-bottom: 20px;
}
.fin-kpis-compact {
  grid-template-columns: repeat(4, 1fr);
}
@media (max-width: 720px) {
  .fin-kpis-compact {
    grid-template-columns: repeat(2, 1fr);
  }
}
.fin-kpi {
  background: #fff;
  border: 1px solid #d7dfeb;
  border-radius: 10px;
  padding: 14px 16px;
  text-align: center;
}
.fin-kpi-alerta {
  border-color: #e8c4a8;
  background: #fffaf5;
}
.fin-kpi-valor {
  display: block;
  font-size: 1.35rem;
  font-weight: 700;
  color: #0f2942;
}
.fin-kpi-label {
  font-size: 0.8rem;
  color: #5a6b7d;
}
.fin-legenda-lista {
  margin: 8px 0 0;
  padding-left: 1.2rem;
  color: #3d4f63;
  font-size: 0.92rem;
}
.fin-ajuda {
  margin-top: 20px;
}
.fin-ajuda summary {
  cursor: pointer;
  font-weight: 600;
  color: #334155;
}
.fin-fila-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
  gap: 10px;
  margin-top: 12px;
}
.fin-fila-card {
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding: 12px 14px;
  border: 1px solid #d7dfeb;
  border-radius: 8px;
  text-decoration: none;
  color: inherit;
  background: #fafbfc;
  transition: border-color 0.15s, box-shadow 0.15s;
}
.fin-fila-card:hover {
  border-color: #2e7d4a;
  box-shadow: 0 2px 8px rgba(15, 41, 66, 0.08);
}
.fin-fila-num {
  font-size: 1.1rem;
  font-weight: 700;
  color: #0f2942;
}
.fin-fila-valores {
  font-size: 0.85rem;
  color: #2d5a3d;
}
.fin-fila-badges {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
}
.fin-lista-processos h2 {
  margin: 0 0 12px;
  font-size: 1.05rem;
}
.fin-tabela-resumo .fin-acao-cell {
  text-align: right;
  white-space: nowrap;
}
.fin-tag-alerta {
  background: #fde8e8;
  color: #9b1c1c;
}
.fin-tag-warn {
  background: #fff3cd;
  color: #856404;
}
/* Análise do processo */
.fin-analise-hero {
  margin-bottom: 16px;
  padding: 20px 22px;
}
.fin-analise-hero-top {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 12px;
  align-items: flex-start;
}
.fin-analise-kicker {
  margin: 0;
  font-size: 0.8rem;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: #5a6b7d;
}
.fin-analise-num {
  margin: 4px 0 6px;
  font-size: 1.75rem;
  color: #0f2942;
}
.fin-analise-meta {
  margin: 0;
}
.fin-situacao {
  font-size: 0.8rem;
  font-weight: 700;
  padding: 6px 12px;
  border-radius: 20px;
  text-transform: uppercase;
  letter-spacing: 0.03em;
}
.fin-situacao-ok {
  background: #e8f4ec;
  color: #1f5c38;
}
.fin-situacao-atencao {
  background: #fff3cd;
  color: #856404;
}
.fin-situacao-critico {
  background: #fde8e8;
  color: #9b1c1c;
}
.fin-analise-tags {
  margin: 12px 0;
}
.fin-insights {
  margin: 0 0 14px;
  padding-left: 1.2rem;
  color: #334155;
  font-size: 0.92rem;
  line-height: 1.5;
}
.fin-analise-acoes {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}
.fin-inline-form {
  display: inline;
  margin: 0;
}
.fin-metricas-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 14px;
  margin-bottom: 16px;
}
.fin-metrica h3 {
  margin: 0 0 8px;
  font-size: 0.9rem;
  color: #5a6b7d;
  font-weight: 600;
}
.fin-metrica-valor {
  margin: 0;
  font-size: 1.5rem;
  font-weight: 700;
  color: #0f2942;
}
.fin-metrica-sub {
  margin: 4px 0 12px;
  font-size: 0.82rem;
}
.fin-metrica-dl {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
  margin: 0;
  font-size: 0.88rem;
}
.fin-metrica-dl dt {
  color: #6b7280;
  font-weight: 500;
}
.fin-metrica-dl dd {
  margin: 0;
  font-weight: 600;
}
.fin-metrica-vinculo {
  border-left: 4px solid #3b82f6;
}
.fin-vinculos-compact {
  margin: 8px 0 0;
  padding-left: 1rem;
  font-size: 0.82rem;
}
.fin-text-alerta {
  color: #b45309;
  font-weight: 700;
}
.fin-alertas-box ul {
  margin: 0;
  padding-left: 1.2rem;
}
.fin-tabs {
  overflow: hidden;
}
.fin-tabs-nav {
  display: flex;
  flex-wrap: wrap;
  gap: 0;
  border-bottom: 1px solid #d7dfeb;
  padding: 0 12px;
  background: #f8fafc;
}
.fin-tab {
  border: none;
  background: transparent;
  padding: 12px 16px;
  font-size: 0.9rem;
  font-weight: 600;
  color: #5a6b7d;
  cursor: pointer;
  border-bottom: 2px solid transparent;
  margin-bottom: -1px;
}
.fin-tab.active {
  color: #0f2942;
  border-bottom-color: #2e7d4a;
  background: #fff;
}
.fin-tab-panel {
  display: none;
  padding: 16px 18px 20px;
}
.fin-tab-panel.active {
  display: block;
}
.fin-tabela-detalhe {
  font-size: 0.88rem;
}
.fin-cell-sub {
  display: block;
  font-size: 0.75rem;
}
.fin-vinculo-intro {
  margin: 0 0 12px;
  font-size: 0.9rem;
}
.fin-tag {
  display: inline-block;
  font-size: 0.72rem;
  font-weight: 600;
  padding: 2px 8px;
  border-radius: 4px;
  background: #eef3f8;
  color: #3d5266;
  margin-left: 4px;
}
.fin-tag-vf {
  background: #e8f4ec;
  color: #1f5c38;
}
.fin-tag-rem {
  background: #eef0fa;
  color: #33408a;
}
.fin-alertas {
  margin: 10px 0;
  padding: 10px 12px;
  background: #fff8e6;
  border-radius: 8px;
  border-left: 4px solid #d4a017;
}
.fin-alerta-linha {
  margin: 4px 0;
  font-size: 0.9rem;
}
.fin-tabela {
  font-size: 0.85rem;
}
.fin-linha-pago,
.fin-linha-liquidada {
  background: #e8f5e9;
}
.fin-linha-vinculado,
.fin-linha-quitado-adiant {
  background: #e0f2f1;
}
.fin-linha-emitido {
  background: #fffde7;
}
.fin-linha-vencida {
  background: #ffebee;
}
.fin-linha-adiant {
  background: #fffaf0;
}
.fin-estado {
  display: inline-block;
  font-size: 0.72rem;
  font-weight: 700;
  text-transform: uppercase;
  padding: 3px 8px;
  border-radius: 6px;
  letter-spacing: 0.02em;
}
.fin-situacao-pago,
.fin-estado-liquidado {
  background: #2e7d32;
  color: #fff;
}
.fin-situacao-vinculado {
  background: #00695c;
  color: #fff;
}
.fin-situacao-emitido {
  background: #fff8e1;
  color: #e65100;
  border: 1px solid #ffcc80;
}
.fin-situacao-vencido {
  background: #ffcdd2;
  color: #b71c1c;
  border: 1px solid #ef9a9a;
}
.fin-estado-emitido {
  color: #e65100;
}
.fin-tag-vinc {
  background: #b2dfdb;
  color: #004d40;
  font-size: 0.68rem;
  padding: 1px 6px;
  border-radius: 4px;
  font-weight: 600;
}
.fin-valor-riscado {
  text-decoration: line-through;
  color: #78909c;
  font-size: 0.82rem;
  margin-right: 6px;
}
.fin-valor-coberto-tag {
  font-size: 0.75rem;
  font-weight: 700;
  color: #00695c;
}
.fin-valor-zero {
  color: #2e7d32;
}
.fin-legenda-fold {
  margin: 12px 0 0;
  font-size: 0.78rem;
  color: #5c6370;
  border: 1px solid #e8eaed;
  border-radius: 8px;
  background: #fafbfc;
}
.fin-legenda-fold-summary {
  cursor: pointer;
  padding: 8px 12px;
  font-weight: 600;
  color: #4a5568;
  list-style: none;
  user-select: none;
}
.fin-legenda-fold-summary::-webkit-details-marker {
  display: none;
}
.fin-legenda-fold[open] .fin-legenda-fold-summary {
  border-bottom: 1px solid #e8eaed;
}
.fin-legenda-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 12px 20px;
  padding: 10px 12px 12px;
}
.fin-legenda-sec-titulo {
  margin: 0 0 6px;
  font-size: 0.72rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: #6b7280;
}
.fin-legenda-lista {
  margin: 0;
  padding: 0;
  list-style: none;
}
.fin-legenda-lista li {
  margin: 0 0 5px;
  line-height: 1.45;
}
.fin-legenda-amostra {
  margin-right: 4px;
  vertical-align: middle;
}
.fin-legenda-nota {
  font-size: 0.72rem;
  color: #6b7280;
  margin-top: 4px !important;
}
.fin-legenda-estados {
  margin: 10px 0 0;
  font-size: 0.78rem;
  line-height: 1.6;
}
.fin-legenda-chip {
  display: inline-block;
  padding: 1px 6px;
  border-radius: 4px;
  font-weight: 600;
  font-size: 0.72rem;
  margin-right: 2px;
}
.fin-chip-pago { background: #2e7d32; color: #fff; }
.fin-chip-vinculado { background: #00695c; color: #fff; }
.fin-chip-emitido { background: #fff8e1; color: #e65100; border: 1px solid #ffcc80; }
.fin-chip-vencido { background: #ffebee; color: #b71c1c; }
.fin-chip-adiant { background: #e3f2fd; color: #1565c0; }
.fin-situacao-adiant,
.fin-linha-adiant-pend .fin-situacao-adiant {
  background: #1976d2;
  color: #fff;
}
.fin-linha-adiant-pend {
  background: #e3f2fd;
}
.fin-col-acao {
  min-width: 7rem;
  max-width: 11rem;
  vertical-align: top;
}
.fin-acao-wrap {
  display: flex;
  flex-direction: column;
  gap: 4px;
  align-items: flex-start;
}
.fin-acao {
  display: inline-block;
  font-size: 0.7rem;
  font-weight: 600;
  padding: 2px 7px;
  border-radius: 5px;
  letter-spacing: 0.01em;
}
.fin-acao--pendente.fin-acao-conciliar,
.fin-acao-conciliar {
  background: #ede7f6;
  color: #4527a0;
  border: 1px solid #d1c4e9;
}
.fin-acao--pendente.fin-acao-compensar,
.fin-acao-compensar {
  background: #e0f2f1;
  color: #00695c;
  border: 1px solid #b2dfdb;
}
.fin-acao--pendente.fin-acao-receber,
.fin-acao-receber,
.fin-acao--pendente.fin-acao-cobrar,
.fin-acao-cobrar {
  background: #e3f2fd;
  color: #1565c0;
  border: 1px solid #bbdefb;
}
.fin-acao--concluido,
.fin-acao-conciliado,
.fin-acao-compensado,
.fin-acao-recebido {
  background: #f1f8e9;
  color: #33691e;
  border: 1px solid #c5e1a5;
}
.fin-acao-vazio {
  font-size: 0.85rem;
}
.fin-conclusao-form {
  display: flex;
  gap: 4px;
  width: 100%;
  max-width: 10.5rem;
}
.fin-conclusao-input {
  flex: 1;
  min-width: 0;
  font-size: 0.72rem;
  padding: 3px 6px;
  border: 1px solid #d1d5db;
  border-radius: 4px;
  background: #fff;
}
.fin-conclusao-input:focus {
  outline: none;
  border-color: #7c6b9e;
  box-shadow: 0 0 0 2px rgba(94, 53, 177, 0.12);
}
.fin-conclusao-btn {
  flex-shrink: 0;
  font-size: 0.75rem;
  padding: 2px 7px;
  border: 1px solid #c5cae9;
  border-radius: 4px;
  background: #f5f5f5;
  cursor: pointer;
  color: #3949ab;
}
.fin-conclusao-btn:hover {
  background: #e8eaf6;
}
.fin-conclusao-lida {
  margin: 0;
  font-size: 0.7rem;
  line-height: 1.3;
  max-width: 10rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.fin-legenda-acoes {
  margin-top: 6px;
  font-size: 0.76rem;
}
.fin-estado-recebido {
  color: #1f5c38;
}
.fin-estado-cancelado {
  color: #6b7280;
}
.fin-estado-pago {
  color: #1f5c38;
}
.fin-kpi-cp {
  background: #f8f6fc;
  border-color: #ddd8eb;
}
.fin-subtitulo {
  margin: 14px 0 8px;
  font-size: 0.95rem;
  color: #334155;
}
.fin-subtitulo-cp {
  color: #4a3d6b;
}
.fin-vinculos {
  margin: 10px 0 14px;
  padding: 10px 12px;
  background: #f0f7ff;
  border-radius: 8px;
  border-left: 4px solid #3b82f6;
}
.card-interno.fin-vinculos {
  background: #f0f7ff;
}
.fin-vinculos-lista {
  margin: 6px 0 0;
  padding-left: 1.1rem;
  font-size: 0.88rem;
}
.fin-vinculo-par_sugerido {
  color: #1e4d8c;
}
.fin-vinculo-sem_par {
  color: #9a3412;
}
.fin-cobranca-cell {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 4px;
  min-width: 88px;
}
.fin-cobranca-meta {
  font-size: 0.75rem;
  display: block;
}
.fin-link-pag {
  font-size: 0.8rem;
  font-weight: 600;
  color: #1d4ed8;
  text-decoration: none;
}
.fin-link-pag:hover {
  text-decoration: underline;
}
.fin-tag-boleto {
  background: #eef6ff;
  color: #1e40af;
}
.fin-tag-link {
  background: #ede9fe;
  color: #5b21b6;
}
.fin-tag-pix {
  background: #e6f7f0;
  color: #047857;
}
.fin-boleto-linha {
  font-size: 0.72rem;
  padding: 2px 4px;
  background: #f1f5f9;
  border-radius: 4px;
  max-width: 120px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.fin-aviso {
  border-left: 4px solid #d4a017;
  margin-bottom: 16px;
}
.fin-foot {
  margin-top: 16px;
}
.fin-vazio {
  padding: 8px 0 12px;
}

.fin-processo-bloco {
  margin-bottom: 16px;
  scroll-margin-top: 72px;
}
.fin-processo-head {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 12px;
}
.fin-processo-head h2 {
  margin: 0 0 4px;
  font-size: 1.1rem;
}
.fin-processo-sub {
  margin: 0;
  font-size: 0.88rem;
}
.fin-processo-acoes {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}
.fin-processo-kpis {
  display: flex;
  flex-wrap: wrap;
  gap: 12px 18px;
  margin-bottom: 10px;
  font-size: 0.9rem;
}
.fin-processo-alerta {
  color: #b45309;
  font-weight: 600;
}
.fin-alertas-compact {
  margin-bottom: 10px;
  padding: 8px 10px;
}
.fin-tabela-compact {
  font-size: 0.8rem;
}

.aba-btn {
  background: none;
  border: none;
  cursor: pointer;
  font: inherit;
  color: inherit;
  padding: 0;
}
.fin-abrir-card {
  margin-bottom: 14px;
  background: linear-gradient(135deg, #f8faf9 0%, #eef6f0 100%);
  border: 1px solid #c5e1d0;
}
.fin-abrir-row {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 12px;
  align-items: center;
}
.fin-abrir-acoes {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.fin-tag-ok {
  background: #c8e6c9;
  color: #1b5e20;
}
.fin-modal-dialog {
  border: none;
  border-radius: 14px;
  padding: 0;
  max-width: min(96vw, 1100px);
  width: 100%;
  box-shadow: 0 20px 50px rgba(0, 77, 38, 0.22);
}
.fin-modal-dialog::backdrop {
  background: rgba(0, 40, 20, 0.45);
}
.fin-modal-shell {
  display: flex;
  flex-direction: column;
  max-height: 90vh;
}
.fin-modal-header {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 12px;
  padding: 16px 20px;
  background: linear-gradient(90deg, #004d26 0%, #006b36 100%);
  color: #fff;
  border-radius: 14px 14px 0 0;
}
.fin-modal-header h2 {
  margin: 0 0 4px;
  font-size: 1.15rem;
  color: #fff;
}
.fin-modal-header .muted {
  color: rgba(255, 255, 255, 0.85);
  margin: 0;
}
.fin-modal-toolbar {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}
.fin-modal-body {
  padding: 16px 20px 20px;
  overflow: auto;
  flex: 1;
}
.fin-modal-kpis {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  gap: 10px;
  margin-bottom: 14px;
}
.fin-modal-kpi {
  background: #fff;
  border: 1px solid #d0e8d8;
  border-radius: 10px;
  padding: 10px 12px;
  box-shadow: 0 2px 8px rgba(0, 77, 38, 0.06);
}
.fin-modal-kpi-label {
  display: block;
  font-size: 0.75rem;
  color: #5a6b62;
  text-transform: uppercase;
  letter-spacing: 0.03em;
}
.fin-modal-kpi strong {
  display: block;
  font-size: 1.05rem;
  color: #004d26;
  margin: 4px 0;
}
.fin-kpi-ok strong {
  color: #2e7d32;
}
.fin-estado-liquidado {
  background: #2e7d32;
  color: #fff;
  font-weight: 700;
  padding: 2px 8px;
  border-radius: 6px;
  font-size: 0.72rem;
}
.fin-linha-liquidada {
  background: #e8f5e9 !important;
}
.fin-notas-arquivos {
  list-style: none;
  padding: 0;
  margin: 8px 0 12px;
  display: flex;
  flex-wrap: wrap;
  gap: 8px 14px;
}
.fin-notas-arquivos li {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 0.85rem;
}
.fin-modal-legenda {
  margin-top: 12px;
  font-size: 0.8rem;
}
.fin-legenda-liq { color: #2e7d32; font-weight: 600; }
.fin-legenda-venc { color: #c62828; font-weight: 600; }
.fin-legenda-adiant { color: #1565c0; font-weight: 600; }