﻿:root {
  --cor-900: #08201e;
  --cor-800: #0b3a35;
  --cor-700: #0a655b;
  --cor-600: #0b8579;
  --cor-500: #12b8a4;
  --cor-100: #d3f4ef;
  --cor-50: #eef8f6;
  --texto: #11201e;
  --muted: #5b6f6c;
  --borda: #d3e5e1;

  --bs-primary: var(--cor-600);
  --bs-primary-rgb: 11, 133, 121;
  --bs-link-color: var(--cor-600);
  --bs-link-hover-color: var(--cor-800);
  --bs-body-font-family: 'Inter', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --bs-body-color: var(--texto);
  --bs-border-color: var(--borda);
}

body {
  font-family: var(--bs-body-font-family);
  background: var(--cor-50);
  color: var(--texto);
  font-size: 0.95rem;
}

h1, h2, h3, h4, h5, h6 {
  font-family: 'Poppins', 'Inter', sans-serif;
  font-weight: 600;
  color: var(--cor-900);
  letter-spacing: -0.01em;
}

/* Navbar */
.navbar-app {
  background: linear-gradient(90deg, var(--cor-900), var(--cor-700));
  box-shadow: 0 2px 12px rgba(8, 32, 30, 0.25);
}
.navbar-app .navbar-brand {
  font-family: 'Poppins', sans-serif;
  font-weight: 600;
  letter-spacing: 0.01em;
}
.navbar-app .navbar-brand .marca {
  display: inline-block;
  width: 28px; height: 28px; line-height: 28px;
  text-align: center;
  border-radius: var(--r);
  background: var(--cor-500);
  font-size: 0.9rem;
  margin-right: 8px;
}
.navbar-app .nav-link {
  color: rgba(255, 255, 255, 0.78);
  border-radius: var(--r);
  padding: 0.45rem 0.9rem !important;
  margin: 0 2px;
  font-weight: 500;
}
.navbar-app .nav-link:hover { color: #fff; background: rgba(255, 255, 255, 0.1); }
.navbar-app .nav-link.active { color: #fff; background: rgba(255, 255, 255, 0.18); }

/* Botões */
.btn { border-radius: var(--r); font-weight: 500; }
.btn-primary {
  --bs-btn-bg: var(--cor-600); --bs-btn-border-color: var(--cor-600);
  --bs-btn-hover-bg: var(--cor-700); --bs-btn-hover-border-color: var(--cor-700);
  --bs-btn-active-bg: var(--cor-800); --bs-btn-active-border-color: var(--cor-800);
  box-shadow: 0 2px 6px rgba(11, 133, 121, 0.3);
}
.btn-outline-secondary {
  --bs-btn-color: var(--cor-700); --bs-btn-border-color: var(--borda);
  --bs-btn-hover-bg: var(--cor-100); --bs-btn-hover-color: var(--cor-800);
  --bs-btn-hover-border-color: var(--cor-500);
  --bs-btn-active-bg: var(--cor-100); --bs-btn-active-color: var(--cor-800);
  background: #fff;
}

/* Cards e formulários */
.card {
  border: 1px solid var(--borda);
  border-radius: var(--r);
  box-shadow: 0 1px 3px rgba(8, 32, 30, 0.05);
}
.form-control, .form-select {
  border-radius: var(--r);
  border-color: var(--borda);
  padding: 0.55rem 0.75rem;
}
.form-control:focus, .form-select:focus {
  border-color: var(--cor-500);
  box-shadow: 0 0 0 0.2rem rgba(18, 184, 164, 0.15);
}
.form-label { font-weight: 500; color: var(--cor-800); font-size: 0.85rem; margin-bottom: 0.3rem; }

/* Indicadores do painel */
.stat { position: relative; overflow: hidden; }
.stat::before {
  content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 5px;
  background: linear-gradient(var(--cor-500), var(--cor-700));
}
.stat .numero { font-family: 'Poppins', sans-serif; font-size: 2.2rem; font-weight: 600; color: var(--cor-800); line-height: 1.1; }
.stat .rotulo { color: var(--muted); font-size: 0.85rem; text-transform: uppercase; letter-spacing: 0.04em; }

/* Tabelas */
.table-wrap {
  background: #fff; border: 1px solid var(--borda); border-radius: var(--r);
  overflow: hidden; box-shadow: 0 1px 3px rgba(8, 32, 30, 0.05);
}
.table-wrap .table { margin-bottom: 0; }
.table thead th {
  background: var(--cor-50); color: var(--cor-800);
  font-size: 0.75rem; text-transform: uppercase; letter-spacing: 0.05em;
  font-weight: 600; border-bottom: 1px solid var(--borda); padding: 0.85rem 1rem;
}
.table td { padding: 0.8rem 1rem; border-color: var(--borda); }
.table-hover > tbody > tr:hover > * { background: var(--cor-50); }

/* Status em tons de azul */
.status { display: inline-block; padding: 0.28em 0.7em; border-radius: var(--r); font-size: 0.75rem; font-weight: 600; }
.status-em-analise      { background: #dbeafe; color: #1e4fa0; }

dt { color: var(--muted); font-weight: 500; }

/* Login */
.login-page { min-height: 100vh; background: linear-gradient(135deg, var(--cor-900), var(--cor-600)); }
.login-card { border: 0; border-radius: var(--r); box-shadow: 0 20px 50px rgba(0, 0, 0, 0.3); }
.login-logo {
  width: 56px; height: 56px; line-height: 56px; margin: 0 auto 1rem;
  border-radius: var(--r); background: linear-gradient(135deg, var(--cor-500), var(--cor-700));
  color: #fff; font-size: 1.6rem; text-align: center;
}

/* Layout com menu lateral à direita */
:root { --sidebar-w: 250px; --topbar-h: 58px; }

.topbar {
  position: fixed; top: 0; left: 0; right: 0; height: var(--topbar-h); z-index: 1030;
  background: linear-gradient(90deg, var(--cor-900), var(--cor-700));
  box-shadow: 0 2px 12px rgba(8, 32, 30, 0.25); color: #fff;
}
.topbar-inner { height: 100%; display: flex; align-items: center; gap: 1.5rem; padding: 0 1.25rem; }
.topbar-user { display: flex; align-items: center; gap: 0.6rem; font-weight: 600; font-family: 'Poppins', sans-serif; }
.topbar-user .avatar {
  width: 32px; height: 32px; line-height: 32px; text-align: center; border-radius: var(--r);
  background: var(--cor-500); font-size: 0.9rem;
}
.topbar-info { margin-left: auto; display: flex; gap: 1.5rem; font-size: 0.88rem; color: rgba(255, 255, 255, 0.85); }
.topbar-info span { white-space: nowrap; }
.topbar-info #sessao, .topbar-info #relogio { font-variant-numeric: tabular-nums; font-weight: 500; color: #fff; }

.sidebar {
  position: fixed; top: var(--topbar-h); right: 0; bottom: 0; width: var(--sidebar-w); z-index: 1020;
  background: var(--cor-900); display: flex; flex-direction: column;
  box-shadow: -2px 0 12px rgba(8, 32, 30, 0.15);
  /* começa fechado: fora da tela e fora da ordem de tabulação */
  transform: translateX(100%); visibility: hidden;
  transition: transform 0.25s ease, visibility 0s linear 0.25s;
}
body.menu-aberto .sidebar { transform: none; visibility: visible; transition: transform 0.25s ease, visibility 0s; }
.sidebar-brand {
  display: flex; align-items: center; gap: 0.6rem; padding: 1.2rem 1.25rem; color: #fff;
  font-family: 'Poppins', sans-serif; font-weight: 600; border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}
.sidebar-brand .marca {
  width: 30px; height: 30px; line-height: 30px; text-align: center; border-radius: var(--r); background: var(--cor-500);
}
.sidebar-nav { padding: 0.9rem 0.75rem; display: flex; flex-direction: column; gap: 3px; overflow-y: auto; flex: 1; }
.sidebar a {
  display: flex; align-items: center; gap: 0.75rem; padding: 0.65rem 0.9rem; border-radius: var(--r);
  color: rgba(255, 255, 255, 0.72); text-decoration: none; font-weight: 500;
}
.sidebar a .ico { width: 1.4rem; text-align: center; }
.sidebar a:hover { background: rgba(255, 255, 255, 0.08); color: #fff; }
.sidebar a.active { background: var(--cor-600); color: #fff; box-shadow: 0 2px 8px rgba(11, 133, 121, 0.45); }
.sidebar-footer { padding: 0.75rem; border-top: 1px solid rgba(255, 255, 255, 0.08); }

/* Conteúdo ocupa a tela toda; ao abrir o menu (telas grandes) ele é empurrado para a esquerda */
.conteudo { padding: calc(var(--topbar-h) + 1.5rem) 1.5rem 1.5rem 1.5rem; margin-right: 0; transition: margin-right 0.25s ease; }
@media (min-width: 992px) { body.menu-aberto .conteudo { margin-right: var(--sidebar-w); } }

/* Botão que abre/fecha o menu (na barra superior) */
.btn-menu {
  flex: none; width: 38px; height: 38px; display: inline-flex; align-items: center; justify-content: center;
  border: 1px solid rgba(255, 255, 255, 0.35); border-radius: var(--r); background: rgba(255, 255, 255, 0.08); color: #fff; font-size: 1.3rem;
  transition: background 0.15s;
}
.btn-menu:hover, .btn-menu:focus-visible { background: rgba(255, 255, 255, 0.2); outline: none; }
body.menu-aberto .btn-menu { background: var(--cor-500); border-color: var(--cor-500); }

/* Fundo escurecido atrás do menu (só em telas pequenas, onde o menu cobre o conteúdo) */
.menu-fundo { position: fixed; inset: var(--topbar-h) 0 0 0; z-index: 1010; background: rgba(4, 16, 15, 0.5); opacity: 0; visibility: hidden; transition: opacity 0.25s; }
@media (max-width: 991.98px) {
  body.menu-aberto .menu-fundo { opacity: 1; visibility: visible; }
  .sidebar { width: 270px; }
  .conteudo { padding: calc(var(--topbar-h) + 1rem) 1rem 1rem; }
  .topbar-info { gap: 0.8rem; font-size: 0.75rem; }
  .topbar-user span:not(.avatar) { display: none; }
}
@media (max-width: 575.98px) { .topbar-info span:first-child { display: none; } }
@media (prefers-reduced-motion: reduce) { .sidebar, .conteudo, .menu-fundo { transition: none; } }

.sidebar .sidebar-nav a, .sidebar .sidebar-footer a { color: rgba(255, 255, 255, 0.8); }
.sidebar .sidebar-nav a:hover, .sidebar .sidebar-footer a:hover { color: #fff; background: rgba(255, 255, 255, 0.1); }
.sidebar .sidebar-nav a.active { color: #fff; background: var(--cor-600); }

/* Código do cliente e botões de ação em ícone */
.codigo {
  display: inline-block; font-family: 'Consolas', 'Courier New', monospace; font-weight: 700; font-size: 0.85rem;
  letter-spacing: 0.08em; padding: 0.2em 0.6em; border-radius: var(--r);
  background: var(--cor-100); color: var(--cor-700);
}
h3 .codigo { font-size: 0.9rem; vertical-align: middle; }
.btn-icone {
  display: inline-flex; align-items: center; justify-content: center; width: 34px; height: 34px;
  border-radius: var(--r); color: var(--cor-700); background: transparent; text-decoration: none; font-size: 1.05rem;
  transition: background 0.15s, color 0.15s;
}
.btn-icone:hover { background: var(--cor-600); color: #fff; }

/* Selo PF/PJ ao lado do nome */
.tipo-pessoa {
  display: inline-block; margin-left: 0.4rem; padding: 0.15em 0.55em; border-radius: var(--r);
  font-size: 0.7rem; font-weight: 700; letter-spacing: 0.04em; vertical-align: middle;
}
.tipo-pf { background: var(--cor-100); color: var(--cor-700); }
.tipo-pj { background: var(--cor-800); color: #fff; }

/* Galeria de fotos da OS */
.foto-card { overflow: hidden; }
.foto-thumb { display: block; aspect-ratio: 4 / 3; background: var(--cor-900); }
.foto-thumb img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.2s; }
.foto-thumb:hover img { transform: scale(1.04); }


/* Situações da OS */
.status-aberta     { background: #e2ecea; color: #3f5754; }
.status-em-bancada { background: #bfeee6; color: #0a655b; }
.status-finalizada { background: #dcfce7; color: #166534; }
.status-cancelada  { background: #fde2e2; color: #a12a2a; }

/* Linha do tempo da OS */
.timeline {
  background: #fff; border: 1px solid var(--borda); border-radius: var(--r);
  padding: 1.1rem 1.5rem 1.4rem; margin-bottom: 1.5rem; box-shadow: 0 1px 3px rgba(8, 32, 30, 0.05);
}
.tl-titulo { font-family: 'Poppins', sans-serif; font-weight: 600; color: var(--cor-900); margin-bottom: 1.2rem; display: flex; flex-wrap: wrap; align-items: baseline; gap: 0.25rem 0.75rem; }
.tl-ajuda { font-family: 'Inter', sans-serif; font-weight: 400; font-size: 0.78rem; color: var(--muted); }
.tl-aviso { background: #fde2e2; color: #a12a2a; border-radius: var(--r); padding: 0.55rem 0.9rem; margin-bottom: 1rem; font-size: 0.88rem; font-weight: 500; }
.tl-corpo { position: relative; }
.tl-trilho { position: absolute; top: 25px; left: calc(50% / var(--n, 4)); right: calc(50% / var(--n, 4)); height: 6px; background: var(--borda); border-radius: var(--r); }
.tl-progresso { height: 100%; width: 0; border-radius: var(--r); background: linear-gradient(90deg, var(--cor-500), var(--cor-600)); transition: width 0.6s cubic-bezier(.4, 0, .2, 1); }
.tl-etapas { position: relative; z-index: 1; display: grid; grid-template-columns: repeat(var(--n, 4), 1fr); list-style: none; padding: 0; margin: 0; }
.tl-etapa { display: flex; flex-direction: column; align-items: center; text-align: center; cursor: pointer; outline: none; padding: 0 0.25rem; }
.tl-bolha {
  position: relative; width: 56px; height: 56px; border-radius: var(--r); display: flex; align-items: center; justify-content: center;
  font-size: 1.45rem; background: #fff; border: 3px solid var(--borda); color: #8aa19d;
  transition: transform 0.2s, background 0.3s, border-color 0.3s, color 0.3s, box-shadow 0.3s;
}
.tl-check { display: none; }
.tl-etapa:hover .tl-bolha, .tl-etapa:focus-visible .tl-bolha { transform: translateY(-3px) scale(1.07); border-color: var(--cor-500); color: var(--cor-600); }
.tl-etapa:focus-visible .tl-bolha { box-shadow: 0 0 0 4px rgba(18, 184, 164, 0.25); }
.tl-rotulo { margin-top: 0.6rem; font-weight: 600; font-size: 0.92rem; color: #7e9591; transition: color 0.3s; }
.tl-data { margin-top: 0.1rem; font-size: 0.74rem; color: #8aa19d; line-height: 1.25; }

.tl-etapa.done .tl-bolha { background: var(--cor-600); border-color: var(--cor-600); color: #fff; }
.tl-etapa.done .tl-icone { display: none; }
.tl-etapa.done .tl-check { display: inline; font-size: 1.7rem; }
.tl-etapa.done .tl-rotulo { color: var(--cor-700); }
.tl-etapa.done .tl-data { color: var(--muted); }

.tl-etapa.current .tl-bolha {
  background: linear-gradient(135deg, var(--cor-500), var(--cor-700)); border-color: #fff; color: #fff;
  box-shadow: 0 0 0 3px var(--cor-500), 0 6px 16px rgba(11, 133, 121, 0.4); animation: tl-pulso 2s infinite;
}
.tl-etapa.current .tl-rotulo { color: var(--cor-900); font-size: 1rem; }
.tl-etapa.current .tl-data { color: var(--cor-700); font-weight: 500; }
.tl-etapa.current[data-status="Finalizada"] .tl-bolha, .tl-etapa.current[data-status="Faturada"] .tl-bolha { background: linear-gradient(135deg, #22c55e, #15803d); box-shadow: 0 0 0 3px #22c55e, 0 6px 16px rgba(21, 128, 61, 0.4); animation: none; }
.tl-etapa.current[data-status="Finalizada"] .tl-rotulo, .tl-etapa.current[data-status="Faturada"] .tl-rotulo { color: #166534; }
.tl-etapa.bloqueada { cursor: not-allowed; }
.tl-etapa.bloqueada:hover .tl-bolha { transform: none; border-color: var(--borda); color: #8aa19d; }

.timeline.cancelada .tl-etapa .tl-bolha { filter: grayscale(1); opacity: 0.6; }
.timeline.cancelada .tl-progresso { width: 0 !important; }

@keyframes tl-pulso {
  0%   { box-shadow: 0 0 0 3px var(--cor-500), 0 0 0 3px rgba(18, 184, 164, 0.5); }
  70%  { box-shadow: 0 0 0 3px var(--cor-500), 0 0 0 14px rgba(18, 184, 164, 0); }
  100% { box-shadow: 0 0 0 3px var(--cor-500), 0 0 0 0 rgba(18, 184, 164, 0); }
}
@media (prefers-reduced-motion: reduce) { .tl-etapa.current .tl-bolha { animation: none; } .tl-progresso { transition: none; } }
@media (max-width: 575.98px) {
  .timeline { padding: 1rem 0.5rem 1.2rem; }
  .tl-bolha { width: 44px; height: 44px; font-size: 1.15rem; }
  .tl-trilho { top: 19px; }
  .tl-rotulo { font-size: 0.78rem; }
  .tl-data { font-size: 0.64rem; }
}

/* Autocompletar de cliente */
.autocomplete { position: relative; }
.ac-lista {
  position: absolute; left: 0; right: 0; top: calc(100% + 4px); z-index: 1040; background: #fff; border: 1px solid var(--borda);
  border-radius: var(--r); box-shadow: 0 10px 28px rgba(8, 32, 30, 0.18); overflow: hidden; display: none;
}
.ac-lista.aberta { display: block; }
.ac-item { display: flex; align-items: center; gap: 0.75rem; padding: 0.55rem 0.85rem; cursor: pointer; border-bottom: 1px solid var(--cor-50); }
.ac-item:last-child { border-bottom: 0; }
.ac-item.ativo, .ac-item:hover { background: var(--cor-100); }
.ac-item .ac-nome { font-weight: 500; }
.ac-item .ac-meta { font-size: 0.78rem; color: var(--muted); }
.ac-item mark { background: transparent; color: var(--cor-600); font-weight: 700; padding: 0; }
.ac-vazio { padding: 0.75rem 0.9rem; color: var(--muted); font-size: 0.88rem; }
.ac-selecionado { border-color: #22c55e !important; background-image: none; }

/* Indicador de prazo da OS */
.prazo { display: inline-flex; align-items: center; gap: 0.35rem; padding: 0.22em 0.65em; border-radius: var(--r); font-size: 0.75rem; font-weight: 600; }
.prazo-no-prazo { background: #dcfce7; color: #166534; }
.prazo-vence    { background: #fef0c3; color: #8a5a00; }
.prazo-atrasada { background: #fde2e2; color: #a12a2a; }
.prazo-det { font-size: 0.72rem; color: var(--muted); margin-top: 0.15rem; }


/* Faturamento, retorno e pagamentos */
.status-faturada { background: #166534; color: #fff; }
.status-pagamento-recebido { background: #dcfce7; color: #166534; }
.status-faturamento-cancelado { background: #fde2e2; color: #a12a2a; }
.status-retorno-aberto { background: #fef0c3; color: #8a5a00; }
.status-retorno-encerrado { background: #dcfce7; color: #166534; }
.chip-retorno { display: inline-flex; align-items: center; padding: 0.15em 0.7em; border-radius: var(--r); background: #fef0c3; color: #8a5a00; font-family: 'Inter', sans-serif; font-size: 0.74rem; font-weight: 600; }
.pg { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.3em 0.8em; border-radius: var(--r); font-weight: 700; font-size: 0.85rem; }
.pg-pago { background: #dcfce7; color: #166534; }
.pg-pendente { background: #fef0c3; color: #8a5a00; }
.pg-vencido { background: #fde2e2; color: #a12a2a; }
.garantia-ok { color: #166534; } .garantia-vencida { color: #a12a2a; }
.modal-fat .valor-grande { font-family: 'Poppins', sans-serif; font-size: 1.9rem; font-weight: 600; color: var(--cor-800); line-height: 1.1; }

/* Linha do tempo somente leitura (página pública) */
.timeline.leitura .tl-etapa { cursor: default; }
.timeline.leitura .tl-etapa:hover .tl-bolha { transform: none; border-color: var(--borda); color: #8aa19d; }
.timeline.leitura .tl-etapa.done:hover .tl-bolha { border-color: var(--cor-600); color: #fff; }
.timeline.leitura .tl-etapa.current:hover .tl-bolha { border-color: #fff; color: #fff; }

/* Página pública do cliente */
body.pub, .pub-topo { font-family: 'Inter', sans-serif; }
.pub-topo { background: linear-gradient(90deg, var(--cor-900), var(--cor-700)); color: #fff; padding: 0.9rem 0; box-shadow: 0 2px 12px rgba(8, 32, 30, 0.25); }
.pub-wrap { max-width: 880px; margin: 0 auto; padding-left: 1rem; padding-right: 1rem; }
.pub-marca { font-family: 'Poppins', sans-serif; font-weight: 600; font-size: 1.25rem; line-height: 1.1; }
.pub-sub { font-size: 0.7rem; letter-spacing: 0.1em; text-transform: uppercase; color: rgba(255, 255, 255, 0.7); }
.pub-etq { background: rgba(255, 255, 255, 0.15); padding: 0.25em 0.8em; border-radius: var(--r); font-size: 0.78rem; font-weight: 500; }

/* Impressão a partir do sistema (ex.: etiqueta do QR Code) */
@media print {
  .topbar, .sidebar, .no-print { display: none !important; }
  .conteudo { margin: 0 !important; padding: 0 !important; }
  body { background: #fff !important; }
}
.dropdown-menu { border-radius: var(--r); border-color: var(--borda); }
.dropdown-item { padding: 0.5rem 1rem; font-weight: 500; color: var(--texto); }
.dropdown-item:hover, .dropdown-item:focus { background: var(--cor-100); color: var(--cor-800); }
.qr-box { background: #fff; border: 1px solid var(--borda); border-radius: var(--r); padding: 1.25rem; display: inline-block; }
.qr-box svg { display: block; width: 260px; height: 260px; }

/* Selo de retorno em garantia (lista de OS) */
.selo-retorno {
  display: inline-flex; align-items: center; gap: 0.35rem; padding: 0.22em 0.7em; border-radius: var(--r);
  font-size: 0.72rem; font-weight: 800; letter-spacing: 0.06em; line-height: 1.2;
}
.selo-retorno.aberto { background: linear-gradient(135deg, #f59e0b, #ea580c); color: #fff; box-shadow: 0 2px 6px rgba(234, 88, 12, 0.35); }
.selo-retorno.encerrado { background: #fff; color: #b45309; border: 1.5px solid #f59e0b; }
.table tr.tr-retorno > td:first-child { box-shadow: inset 4px 0 0 #f3c77a; }
.table tr.tr-retorno-aberto > td { background: #fffaf0; }
.table tr.tr-retorno-aberto > td:first-child { box-shadow: inset 4px 0 0 #ea580c; }
.table-hover > tbody > tr.tr-retorno-aberto:hover > * { background: #fff3dc; }
.selo-retorno.concluido { background: #dcfce7; color: #166534; border: 1.5px solid #22c55e; }

/* Quadros do painel */
a.stat { display: block; color: inherit; text-decoration: none; transition: transform 0.15s, box-shadow 0.15s; }
a.stat:hover { transform: translateY(-2px); box-shadow: 0 8px 20px rgba(8, 32, 30, 0.13); }
.stat .ico { position: absolute; right: 1.1rem; top: 0.9rem; font-size: 1.9rem; opacity: 0.22; }
.stat .sub { font-size: 0.78rem; color: var(--muted); margin-top: 0.3rem; }
.stat-verde::before { background: linear-gradient(#22c55e, #15803d); }
.stat-verde .numero, .stat-verde .ico { color: #166534; }
.stat-vermelho::before { background: linear-gradient(#ef4444, #b91c1c); }
.stat-vermelho .numero, .stat-vermelho .ico { color: #b91c1c; }

/* ===== Financeiro ===== */
.fin-abas .nav-link { color: var(--cor-700); font-weight: 500; border-radius: var(--r); padding: 0.45rem 0.95rem; }
.fin-abas .nav-link:hover { background: var(--cor-100); }
.fin-abas .nav-link.active { background: var(--cor-600); color: #fff; box-shadow: 0 2px 8px rgba(11, 133, 121, 0.3); }
.fin-sub .nav-link { font-size: 0.85rem; padding: 0.3rem 0.8rem; background: #fff; border: 1px solid var(--borda); margin-right: 0.3rem; }
.fin-sub .nav-link.active { border-color: var(--cor-600); }
.stat-laranja::before { background: linear-gradient(#f59e0b, #ea580c); }
.stat-laranja .numero, .stat-laranja .ico { color: #c2410c; }

/* situação do lançamento */
.fsit { display: inline-block; padding: 0.25em 0.7em; border-radius: var(--r); font-size: 0.74rem; font-weight: 700; }
.fsit-pago { background: #dcfce7; color: #166534; }
.fsit-parcial { background: #dbeafe; color: #1e4fa0; }
.fsit-vencido { background: #fde2e2; color: #a12a2a; }
.fsit-hoje { background: #fef0c3; color: #8a5a00; }
.fsit-pendente { background: #e2ecea; color: #3f5754; }
.fsit-cancelado { background: #e6eceb; color: #7f918e; text-decoration: line-through; }
.linha-cancelada td { color: #7e9591; }
.mov-entrada { color: #0a7d72; font-weight: 600; } .mov-saida { color: #c2410c; font-weight: 600; }

/* próximos vencimentos */
.mini-lista { display: flex; flex-direction: column; }
.mini-item { display: flex; align-items: center; gap: 0.8rem; padding: 0.55rem 0.4rem; border-bottom: 1px solid var(--cor-50); color: inherit; text-decoration: none; border-radius: var(--r); }
.mini-item:last-child { border-bottom: 0; } .mini-item:hover { background: var(--cor-50); }
.mini-data { flex: none; width: 44px; text-align: center; border-radius: var(--r); padding: 0.25rem 0; line-height: 1.05; }
.mini-data .d { font-weight: 700; font-size: 1.05rem; } .mini-data .m { font-size: 0.62rem; text-transform: uppercase; letter-spacing: 0.05em; }

/* despesas por categoria */
.cat-nome { width: 11rem; flex: none; font-size: 0.9rem; }
.cat-trilho { height: 10px; background: var(--cor-50); border-radius: var(--r); }
.cat-barra { height: 100%; background: #eb6834; border-radius: var(--r); min-width: 3px; }
.cat-valor { width: 10.5rem; flex: none; text-align: right; font-variant-numeric: tabular-nums; font-size: 0.9rem; }
@media (max-width: 575.98px) { .cat-nome { width: 7rem; } .cat-valor { width: 8rem; } }

/* gráfico de colunas (entradas × saídas) — cores: série 1 azul, série 2 laranja */
.viz { --viz-entrada: #0a7d72; --viz-saida: #eb6834; --viz-grade: #e1e0d9; --viz-base: #c3c2b7; --viz-texto: #52514e; --viz-muted: #898781; }
.viz-legenda { display: flex; gap: 1.2rem; font-size: 0.85rem; color: var(--viz-texto); margin-bottom: 0.4rem; }
.viz-chave { display: inline-block; width: 10px; height: 10px; border-radius: var(--r); margin-right: 0.4rem; }
i.viz-chave.viz-entrada { background: var(--viz-entrada); } i.viz-chave.viz-saida { background: var(--viz-saida); }
.viz-area { position: relative; }
.viz svg { width: 100%; height: auto; display: block; }
.viz svg path.viz-entrada { fill: var(--viz-entrada); } .viz svg path.viz-saida { fill: var(--viz-saida); }
.viz-grade { stroke: var(--viz-grade); stroke-width: 1; } .viz-base { stroke: var(--viz-base); stroke-width: 1; }
.viz-eixo { fill: var(--viz-muted); font-size: 11px; font-family: 'Inter', sans-serif; } .viz-eixo-atual { fill: var(--viz-texto); font-weight: 600; }
.viz-atual { fill: rgba(10, 125, 114, 0.06); }
.viz-grupo { cursor: default; } .viz-grupo:hover .viz-atual, .viz-grupo:hover .viz-hit { fill: rgba(10, 125, 114, 0.07); }
.viz-dica { position: absolute; z-index: 5; pointer-events: none; background: #11201e; color: #fff; font-size: 0.78rem; padding: 0.4rem 0.65rem; border-radius: var(--r); box-shadow: 0 6px 18px rgba(0, 0, 0, 0.25); white-space: nowrap; }
.viz-tabela summary { cursor: pointer; color: var(--cor-600); }

/* Quadros financeiros no painel */
.fin-mini { display: block; padding: 0.5rem 0.3rem; border-radius: var(--r); background: var(--cor-50); text-decoration: none; color: var(--texto); }
.fin-mini .v { font-weight: 700; font-size: 0.95rem; font-variant-numeric: tabular-nums; } .fin-mini .l { font-size: 0.7rem; color: var(--muted); }
.fin-mini:hover { background: var(--cor-100); }
.fin-mini-alerta { background: #fde2e2; } .fin-mini-alerta .v { color: #a12a2a; }
.fin-mini-hoje { background: #fef0c3; } .fin-mini-hoje .v { color: #8a5a00; }

/* Quadros em evidência do painel (faturado / despesas do mês) */
.hero-mes { display: block; position: relative; overflow: hidden; border-radius: var(--r); padding: 1.4rem 1.6rem 1.2rem; color: #fff; text-decoration: none;
  box-shadow: 0 8px 24px rgba(8, 32, 30, 0.18); transition: transform 0.15s, box-shadow 0.15s; height: 100%; }
.hero-mes:hover { transform: translateY(-2px); box-shadow: 0 12px 30px rgba(8, 32, 30, 0.25); color: #fff; }
.hero-azul { background: linear-gradient(135deg, #0b8579 0%, #0b3a35 100%); }
.hero-laranja { background: linear-gradient(135deg, #c2410c 0%, #8a2f0a 100%); }
.hero-ico { position: absolute; right: 1.2rem; top: 0.9rem; font-size: 3.2rem; opacity: 0.16; }
.hero-titulo { font-size: 0.82rem; font-weight: 600; text-transform: uppercase; letter-spacing: 0.08em; opacity: 0.85; }
.hero-valor { font-family: 'Poppins', sans-serif; font-weight: 600; font-size: clamp(2rem, 4.2vw, 3rem); line-height: 1.1; margin: 0.25rem 0 0.35rem; font-variant-numeric: tabular-nums; }
.hero-sub { font-size: 0.85rem; opacity: 0.92; display: flex; flex-wrap: wrap; align-items: center; gap: 0.3rem 0.7rem; }
.hero-delta { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.1em 0.6em; border-radius: var(--r); font-size: 0.75rem; font-weight: 600; background: rgba(255, 255, 255, 0.18); }
.hero-delta.bom { background: rgba(34, 197, 94, 0.35); } .hero-delta.ruim { background: rgba(254, 226, 226, 0.28); }
.hero-barra { height: 8px; border-radius: var(--r); background: rgba(255, 255, 255, 0.22); margin: 1rem 0 0.5rem; overflow: hidden; }
.hero-barra > div { height: 100%; background: #fff; border-radius: var(--r); min-width: 0; }
.hero-rodape { display: flex; justify-content: space-between; gap: 1rem; font-size: 0.82rem; opacity: 0.95; }


/* ======================================================================
   TEMA QUADRADO E MODERNO — cantos retos, bordas nítidas, cores chapadas
   ====================================================================== */
:root {
  --r: 2px;                 /* único raio do sistema */
  --borda: #c2d9d4;         /* bordas mais firmes */
  --bs-border-radius: 2px; --bs-border-radius-sm: 2px; --bs-border-radius-lg: 2px;
  --bs-border-radius-xl: 2px; --bs-border-radius-xxl: 2px; --bs-border-radius-pill: 2px;
  --bs-border-color: var(--borda);
}
body { letter-spacing: 0.005em; }
h1, h2, h3, h4, h5, h6 { letter-spacing: -0.015em; }

/* estrutura: barra superior e menu lateral */
.topbar, .navbar-app { background: var(--cor-900); box-shadow: none; border-bottom: 3px solid var(--cor-500); }
.sidebar { box-shadow: none; border-left: 1px solid rgba(255, 255, 255, 0.08); }
.sidebar a.active { background: var(--cor-600); box-shadow: inset 4px 0 0 #7ee6d8; }
.sidebar a { border-radius: 0; }
.sidebar-brand .marca, .navbar-app .navbar-brand .marca { background: var(--cor-500); }
.btn-menu { border-radius: 0; }

/* cartões, tabelas e blocos: planos, só com borda */
.card, .table-wrap, .timeline, .qr-box, .hero-mes { box-shadow: none; }
.card, .table-wrap, .timeline { border: 1px solid var(--borda); }
a.stat:hover, .hero-mes:hover { transform: none; box-shadow: none; }
a.stat:hover { border-color: var(--cor-500); }
.hero-mes:hover { filter: brightness(1.08); }
.stat::before { width: 4px; background: var(--cor-600); }
.stat-verde::before { background: #15803d; }
.stat-vermelho::before { background: #c0392b; }
.stat-laranja::before { background: #d9560b; }
.stat .numero { letter-spacing: -0.02em; }

/* destaques do painel: cor sólida + filete inferior */
.hero-azul { background: var(--cor-700); border-bottom: 5px solid var(--cor-500); }
.hero-laranja { background: #a8380c; border-bottom: 5px solid #f59e0b; }
.hero-barra > div { background: #fff; }

/* botões e campos */
.btn { font-weight: 600; letter-spacing: 0.01em; }
.btn-primary { box-shadow: none; }
.form-control, .form-select { border-color: #a9c7c1; }
.form-control:focus, .form-select:focus { border-color: var(--cor-600); box-shadow: 0 0 0 2px rgba(11, 133, 121, 0.22); }
.form-label { text-transform: uppercase; letter-spacing: 0.04em; font-size: 0.72rem; font-weight: 600; }
.input-group-text { border-color: #a9c7c1; background: var(--cor-50); }

/* tabelas */
.table thead th { background: var(--cor-50); border-bottom: 2px solid var(--cor-700); font-size: 0.7rem; letter-spacing: 0.07em; }
.table-hover > tbody > tr:hover > * { background: var(--cor-50); }

/* etiquetas viram "tags" retangulares */
.status, .fsit { text-transform: uppercase; letter-spacing: 0.05em; font-size: 0.66rem; padding: 0.32em 0.65em; font-weight: 700; }
.selo-retorno.aberto { background: #ea580c; box-shadow: none; }
.codigo { background: var(--cor-100); border: 1px solid #a6dcd3; }
.tipo-pj { background: var(--cor-800); }

/* alertas com filete lateral */
.alert { border-width: 1px 1px 1px 4px; }
.alert-success { border-left-color: #22c55e; } .alert-danger { border-left-color: #c0392b; }
.alert-warning { border-left-color: #f59e0b; } .alert-info { border-left-color: #12b8a4; }

/* menus e popups */
.dropdown-menu { box-shadow: 0 8px 24px rgba(8, 32, 30, 0.18); border-color: #a9c7c1; }
.modal-content { border: 1px solid var(--cor-700); box-shadow: 0 18px 50px rgba(8, 32, 30, 0.35); }
.modal-header { border-bottom: 2px solid var(--cor-900); }
.ac-lista { box-shadow: 0 8px 24px rgba(8, 32, 30, 0.18); border-color: #a9c7c1; }

/* linha do tempo: marcos quadrados, trilho reto e sólido */
.tl-trilho { height: 4px; top: 26px; }
.tl-progresso { background: var(--cor-600); }
.tl-bolha { border-width: 2px; }
.tl-etapa.current .tl-bolha { background: var(--cor-600); border-color: #fff; box-shadow: 0 0 0 3px var(--cor-500); }
.tl-etapa.current[data-status="Finalizada"] .tl-bolha, .tl-etapa.current[data-status="Faturada"] .tl-bolha { background: #15803d; box-shadow: 0 0 0 3px #22c55e; }
.tl-etapa:hover .tl-bolha, .tl-etapa:focus-visible .tl-bolha { transform: none; }

/* login e páginas públicas: fundo azul-marinho com malha */
.login-page {
  background-color: var(--cor-900);
  background-image: linear-gradient(rgba(255, 255, 255, 0.045) 1px, transparent 1px), linear-gradient(90deg, rgba(255, 255, 255, 0.045) 1px, transparent 1px);
  background-size: 34px 34px;
}
.login-card { box-shadow: none; border: 0; border-top: 5px solid var(--cor-500); }
.login-logo { background: var(--cor-600); }
.pub-topo { background: var(--cor-900); box-shadow: none; border-bottom: 3px solid var(--cor-500); }

/* gráfico */
.viz-dica { box-shadow: none; }

@media (prefers-reduced-motion: no-preference) { .btn, .btn-icone, a.stat, .nav-link { transition: background 0.12s, border-color 0.12s, color 0.12s; } }
.viz svg rect.viz-entrada { fill: var(--viz-entrada); } .viz svg rect.viz-saida { fill: var(--viz-saida); }


/* ===== Logo ===== */
.brand-logo { display: block; height: 38px; width: auto; }
.sidebar-brand { padding: 1.05rem 1.25rem; }
.topbar-logo { display: flex; align-items: center; flex: none; padding-right: 1.1rem; border-right: 1px solid rgba(255, 255, 255, 0.16); }
.topbar-logo img { height: 30px; width: auto; display: block; }
.login-marca { display: block; width: min(230px, 70%); height: auto; margin: 0 auto 1.1rem; }
.pub-logo { height: 36px; width: auto; display: block; }
@media (max-width: 575.98px) { .topbar-inner { gap: 0.9rem; } .topbar-logo { padding-right: 0.8rem; } }

/* ===== Paleta da marca nos componentes do Bootstrap (que trazem o azul embutido) ===== */
:root {
  --bs-primary: #0b8579; --bs-primary-rgb: 11, 133, 121;
  --bs-link-color: #0a7d72; --bs-link-color-rgb: 10, 125, 114;
  --bs-link-hover-color: #0a655b; --bs-link-hover-color-rgb: 10, 101, 91;
  --bs-body-bg: #fff;
}
.btn-primary { --bs-btn-focus-shadow-rgb: 11, 133, 121; --bs-btn-disabled-bg: var(--cor-600); --bs-btn-disabled-border-color: var(--cor-600); }
.btn-outline-primary {
  --bs-btn-color: var(--cor-600); --bs-btn-border-color: var(--cor-600);
  --bs-btn-hover-color: #fff; --bs-btn-hover-bg: var(--cor-600); --bs-btn-hover-border-color: var(--cor-600);
  --bs-btn-active-color: #fff; --bs-btn-active-bg: var(--cor-700); --bs-btn-active-border-color: var(--cor-700);
  --bs-btn-focus-shadow-rgb: 11, 133, 121;
}
.text-bg-primary { background-color: var(--cor-600) !important; color: #fff !important; }
.text-primary { color: var(--cor-600) !important; } .bg-primary { background-color: var(--cor-600) !important; }
.form-check-input:checked { background-color: var(--cor-600); border-color: var(--cor-600); }
.form-check-input:focus { border-color: var(--cor-500); box-shadow: 0 0 0 0.2rem rgba(18, 184, 164, 0.25); }
.form-switch .form-check-input:focus { --bs-form-switch-bg: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%2312b8a4'/%3e%3c/svg%3e"); }
.dropdown-menu { --bs-dropdown-link-active-bg: var(--cor-600); --bs-dropdown-link-hover-bg: var(--cor-100); }
::selection { background: rgba(18, 184, 164, 0.28); }


/* ===== Relatórios ===== */
.rel-grupo { text-transform: uppercase; letter-spacing: 0.08em; font-size: 0.72rem; color: var(--muted); border-bottom: 1px solid var(--borda); padding-bottom: 0.4rem; margin-bottom: 0.9rem; }
.rel-card { display: flex; align-items: center; gap: 0.9rem; height: 100%; padding: 1rem 1.1rem; background: #fff; border: 1px solid var(--borda); border-left: 4px solid var(--cor-500); color: inherit; text-decoration: none; }
.rel-card:hover { border-color: var(--cor-600); border-left-color: var(--cor-600); background: var(--cor-50); color: inherit; }
.rel-ico { flex: none; width: 42px; height: 42px; display: flex; align-items: center; justify-content: center; background: var(--cor-100); color: var(--cor-700); font-size: 1.3rem; border-radius: var(--r); }
.rel-titulo { font-weight: 600; font-family: 'Poppins', sans-serif; color: var(--cor-900); }
.rel-desc { font-size: 0.82rem; color: var(--muted); line-height: 1.35; margin-top: 0.15rem; }
.rel-seta { color: var(--muted); } .rel-card:hover .rel-seta { color: var(--cor-600); }
.rel-tag { color: var(--muted); font-size: 0.75rem; }
.rel-filtros { background: #fff; border: 1px solid var(--borda); padding: 0.9rem 1rem 1rem; margin-bottom: 0.9rem; }
.rel-presets { display: flex; flex-wrap: wrap; gap: 0.35rem; margin-bottom: 0.8rem; }
.rel-preset { padding: 0.28rem 0.75rem; border: 1px solid var(--borda); background: #fff; color: var(--cor-700); text-decoration: none; font-size: 0.82rem; font-weight: 600; border-radius: var(--r); }
.rel-preset:hover { background: var(--cor-100); } .rel-preset.ativo { background: var(--cor-600); border-color: var(--cor-600); color: #fff; }
.rel-periodo { font-weight: 600; color: var(--cor-800); margin-bottom: 0.8rem; }
.rel-kpis { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 0.75rem; margin-bottom: 1.1rem; }
.rel-kpi { background: #fff; border: 1px solid var(--borda); border-left: 4px solid var(--cor-600); padding: 0.75rem 0.95rem; min-width: 0; }
.rel-kpi.tom-ok { border-left-color: #15803d; } .rel-kpi.tom-ruim { border-left-color: #c0392b; }
.rk-rotulo { font-size: 0.68rem; text-transform: uppercase; letter-spacing: 0.06em; color: var(--muted); font-weight: 600; }
.rk-valor { font-family: 'Poppins', sans-serif; font-weight: 600; font-size: 1.45rem; color: var(--cor-900); line-height: 1.2; font-variant-numeric: tabular-nums; }
.rk-valor.rk-txt { font-size: 1.05rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.rk-sub { font-size: 0.75rem; color: var(--muted); margin-top: 0.1rem; }
.tom-ok .rk-valor { color: #166534; } .tom-ruim .rk-valor { color: #a12a2a; }
.rel-graf h6 { font-family: 'Poppins', sans-serif; font-size: 0.95rem; }
.rel-tabela .table thead th { white-space: nowrap; }
.rel-sticky { position: sticky; left: 0; background: #fff; z-index: 1; }
thead .rel-sticky { background: var(--cor-50); }
.rel-l-titulo td { background: var(--cor-100) !important; font-weight: 700; text-transform: uppercase; font-size: 0.74rem; letter-spacing: 0.06em; color: var(--cor-800); }
.rel-l-total td { font-weight: 700; border-top: 1px solid var(--cor-700); background: var(--cor-50); }
.rel-l-resultado td { font-weight: 800; background: var(--cor-100) !important; border-top: 2px solid var(--cor-700); border-bottom: 2px solid var(--cor-700); }
.rel-tabela tfoot td { font-weight: 700; background: var(--cor-50); border-top: 2px solid var(--cor-700); }
.rel-notas { font-size: 0.8rem; color: var(--muted); display: grid; gap: 0.25rem; }

/* rosca e ranking */
.rosca { display: flex; align-items: center; gap: 1.2rem; flex-wrap: wrap; }
.rosca svg { width: 190px; height: 190px; flex: none; }
.rosca-total { font-family: 'Poppins', sans-serif; font-weight: 600; font-size: 15px; fill: var(--texto); } .rosca-sub { font-size: 10px; fill: var(--muted); }
.rosca-leg { list-style: none; margin: 0; padding: 0; flex: 1; min-width: 190px; display: grid; gap: 0.35rem; }
.rosca-leg li { display: flex; align-items: center; gap: 0.5rem; font-size: 0.86rem; }
.rosca-leg .rl-nome { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.rosca-leg .rl-val { white-space: nowrap; font-variant-numeric: tabular-nums; }
.barras-h { display: grid; gap: 0.5rem; }
.bh-linha { display: grid; grid-template-columns: minmax(7rem, 38%) 1fr auto; align-items: center; gap: 0.7rem; }
.bh-nome { font-size: 0.86rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.bh-sub { display: block; font-size: 0.7rem; color: var(--muted); }
.bh-trilho { height: 14px; background: var(--cor-50); border: 1px solid var(--cor-100); }
.bh-barra { height: 100%; min-width: 2px; }
.bh-valor { font-size: 0.86rem; font-weight: 600; font-variant-numeric: tabular-nums; white-space: nowrap; }

/* só no papel */
.print-only { display: none; }
.rel-print-cab { align-items: center; justify-content: space-between; gap: 1rem; border-bottom: 3px solid var(--cor-600); padding-bottom: 0.5rem; margin-bottom: 0.8rem; }
.rel-print-tit { text-align: right; font-size: 0.8rem; } .rel-print-tit .t { font-family: 'Poppins', sans-serif; font-weight: 600; font-size: 1.15rem; }
@media print {
  .print-only { display: flex !important; }
  .rel-kpis { grid-template-columns: repeat(4, 1fr); } .rel-kpi, .card, .table-wrap { break-inside: avoid; }
  .rel-sticky { position: static; } .table-responsive { overflow: visible !important; }
  body { font-size: 11px; } .rk-valor { font-size: 1.15rem; }
  @page { margin: 12mm; }
}
/* estorno de pagamento */
.status-pagamento-estornado{background:#fde8e8;color:#9b1c1c}
.chip-estorno{display:inline-block;font-size:.7rem;font-weight:600;color:#9b1c1c;background:#fde8e8;border:1px solid #f5b5b5;padding:0 .4rem;border-radius:var(--r)}
.conta-lista{display:grid;gap:.4rem;max-height:210px;overflow:auto}
.conta-op{display:grid;grid-template-columns:auto 1fr auto;gap:.1rem .6rem;align-items:center;border:1px solid #cfd8d6;border-radius:var(--r);padding:.45rem .65rem;cursor:pointer;margin:0}
.conta-op:hover{background:#f1f7f6}
.conta-op:has(input:checked){border-color:#0b8579;background:#e3f4f1;box-shadow:inset 3px 0 0 #0b8579}
.conta-op .co-nome{font-weight:600}.conta-op .co-tipo{font-size:.75rem;color:#667;grid-column:2;grid-row:2}
.conta-op .co-saldo{grid-column:3;grid-row:1/3;font-size:.85rem;white-space:nowrap}
.estorno-item{display:flex;justify-content:space-between;gap:.75rem;border-top:1px solid #e3e8e7;padding:.35rem 0}
/* OS cancelada */
.selos-cancel{display:flex;flex-wrap:wrap;gap:.25rem;margin-top:.25rem}
.selo-cancelada,.selo-estorno{display:inline-flex;align-items:center;gap:.3rem;font-size:.68rem;font-weight:700;letter-spacing:.04em;padding:.1rem .45rem;border-radius:var(--r);border:1px solid;vertical-align:middle}
.selo-cancelada{background:#fde8e8;color:#9b1c1c;border-color:#f5b5b5}
.selo-estorno.feito{background:#e3f4f1;color:#08655b;border-color:#8fd6cc}
.selo-estorno.nao{background:#fff1dc;color:#9a4d00;border-color:#f3c27f}
/* WhatsApp */
.zap-estado{font-weight:700;font-size:1.05rem}
.zap-estado[data-s=open]{color:#08655b}.zap-estado[data-s=connecting]{color:#9a4d00}.zap-estado[data-s=close],.zap-estado[data-s=inexistente]{color:#9b1c1c}
.zap-qr{display:inline-flex;align-items:center;justify-content:center;width:280px;height:280px;max-width:100%;border:1px solid #cfd8d6;background:#fff;padding:8px}
.zap-qr img{width:100%;height:100%;image-rendering:pixelated}
.zap-lista{position:absolute;z-index:5;left:0;right:0;max-height:240px;overflow:auto;border-radius:var(--r);box-shadow:0 6px 18px rgba(0,0,0,.15)}
.zap-escolhido{background:#e3f4f1;border:1px solid #8fd6cc;padding:.4rem .6rem;border-radius:var(--r)}
.chip-zap{display:inline-flex;align-items:center;gap:.3rem;font-size:.78rem;font-weight:600;color:#08655b;background:#e3f4f1;border:1px solid #8fd6cc;padding:.1rem .5rem;border-radius:var(--r)}
.mes-nav .mes-nome{min-width:9.5rem;text-align:center;font-size:1.05rem}
/* pagamento no cartão */
.cartao-card{border:1px solid #8fd6cc;background:#f1faf8;border-radius:var(--r);padding:.6rem .75rem}
.cartao-card .prev strong{color:#08655b}
.taxas-tab th,.taxas-tab td{white-space:nowrap}
.taxas-form .form-label{font-size:.8rem;margin-bottom:.15rem}
/* tirar foto */
.camera-thumbs{display:flex;flex-wrap:wrap;gap:.4rem;margin-top:.5rem}
.camera-thumb{position:relative;width:72px;height:72px;border:1px solid #cfd8d6;border-radius:var(--r);overflow:hidden;background:#fff}
.camera-thumb img{width:100%;height:100%;object-fit:cover;display:block}
.camera-thumb button{position:absolute;top:0;right:0;border:0;background:rgba(0,0,0,.65);color:#fff;width:22px;height:22px;line-height:20px;padding:0;cursor:pointer}
.cartao-card .conf-box{background:#fff;border:1px dashed #0b8579;padding:.45rem .6rem .45rem 2rem;border-radius:var(--r);margin-top:.15rem}
/* extrato do Asaas no popup da OS */
.as-tabela{max-height:230px;overflow:auto;border:1px solid #cfd8d6;background:#fff}
.as-tabela tbody tr{cursor:pointer}
.as-tabela tr.as-igual{background:#eaf7f3}
.as-tabela tr.as-bloq{opacity:.45;cursor:not-allowed}
.as-tabela thead th{position:sticky;top:0;background:#f1f7f6;font-size:.72rem;text-transform:uppercase;letter-spacing:.04em}
.as-tabela table{font-size:.84rem}
.as-tabela td,.as-tabela th{padding:.3rem .45rem;vertical-align:middle}
.as-tabela tr.as-sel{background:#d6efe9;box-shadow:inset 3px 0 0 #0b8579}
/* prazo prolongado */
.selo-prazo-alt{display:inline-flex;align-items:center;gap:.3rem;font-size:.68rem;font-weight:700;letter-spacing:.04em;padding:.1rem .45rem;border-radius:var(--r);border:1px solid #f3c27f;background:#fff1dc;color:#9a4d00;vertical-align:middle;white-space:nowrap}
h3 .selo-prazo-alt{font-size:.72rem}
.lista-prazos{padding-left:1.1rem}
.pr-atual{display:flex;gap:2rem;flex-wrap:wrap;background:#f1f7f6;border:1px solid #cfd8d6;padding:.6rem .8rem}
/* movimentação dividida */
.ml-soma{border:1px solid #cfd8d6;padding:.5rem .75rem;display:flex;justify-content:space-between;flex-wrap:wrap;gap:.5rem}
.ml-soma-ok{background:#e3f4f1;border-color:#8fd6cc;color:#08655b}
.ml-soma-erro{background:#fff4f0;border-color:#f3b9a4;color:#8a3b17}
.mov-desc{white-space:normal;overflow-wrap:anywhere;line-height:1.3}
