/* =====================================================================
   HC Gestão de Cobrança — folha de estilo única
   Organização: tokens · base · shell (menu/topo) · componentes
   (card, KPI, tabela, formulário, botão, badge, abas...) · telas
   específicas (espelho, planejamento...) · responsivo.
   ===================================================================== */

:root {
  --hc-950: #04162c;
  --hc-900: #0a2444;
  --hc-800: #0e3560;
  --hc-700: #124580;
  --hc-600: #1857a0;
  --hc-500: #226ebd;
  --hc-400: #4f92d6;
  --hc-100: #e7f0fa;
  --hc-50: #f5f9fd;
  --gold-500: #b7902f;
  --gold-100: #f7efdb;
  --white: #ffffff;
  --gray-50: #f7f8fa;
  --gray-100: #eef0f4;
  --gray-200: #e2e5eb;
  --gray-300: #cdd2dc;
  --gray-400: #9aa2b1;
  --gray-500: #6b7383;
  --gray-600: #545c6c;
  --gray-700: #3a4150;
  --gray-800: #2a303c;
  --gray-900: #171c26;
  --success: #187a4c;
  --success-bg: #e5f4ec;
  --danger: #b23225;
  --danger-bg: #fbeae7;
  --warning: #a4670c;
  --warning-bg: #fbf0dd;
  --info: var(--hc-600);
  --info-bg: var(--hc-100);
  --radius: 10px;
  --radius-lg: 14px;
  --shadow-sm: 0 1px 2px rgba(10, 36, 68, 0.06);
  --shadow: 0 1px 3px rgba(10, 36, 68, 0.06), 0 4px 12px rgba(10, 36, 68, 0.04);
  --shadow-lg: 0 12px 32px rgba(10, 36, 68, 0.14);
  --sidebar-w: 256px;
  --font: "Inter", "Segoe UI", -apple-system, BlinkMacSystemFont, Roboto, Arial, sans-serif;
}

/* ---------- Base ---------- */
* { box-sizing: border-box; }
html, body {
  margin: 0; padding: 0;
  background: var(--gray-50);
  color: var(--gray-900);
  font-family: var(--font);
  font-size: 14px;
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
}
a { color: var(--hc-600); text-decoration: none; }
a:hover { text-decoration: underline; }
h1, h2, h3, h4 { color: var(--hc-900); margin: 0 0 8px; font-weight: 700; letter-spacing: -0.01em; }
h1 { font-size: 20px; }
h2 { font-size: 15.5px; }
h3 { font-size: 14.5px; }
code { font-size: 12px; background: var(--gray-100); padding: 1px 5px; border-radius: 4px; word-break: break-all; }
[hidden] { display: none !important; }
.icon-svg { display: block; flex-shrink: 0; }

.muted { color: var(--gray-500); }
.small { font-size: 12px; }
.text-right { text-align: right; }
.text-center { text-align: center; }
.nowrap { white-space: nowrap; }
.empty-state { text-align: center; padding: 40px 20px; color: var(--gray-400); font-size: 13.5px; }
.section-title { font-size: 11px; text-transform: uppercase; letter-spacing: .06em; color: var(--gray-500); font-weight: 700; margin: 18px 0 8px; }

/* ---------- Login (padrão da apresentação HC: marinho, anéis azuis, título com ponto) ---------- */
.lg-pagina { min-height: calc(100 * var(--vh)); display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(420px, .85fr); background: #fff; }
.lg-marca { position: relative; overflow: hidden; display: flex; flex-direction: column; justify-content: space-between; gap: 40px; padding: 48px 56px; color: #eaeef3; background: #0a1f3d url('../img/rel_fundo.jpg') center / cover; }
.lg-foto { position: absolute; inset: 0 0 0 38%; background-size: cover; background-position: center; opacity: .9; }
.lg-foto::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, #0a1f3d 0%, rgba(10, 31, 61, .7) 40%, rgba(10, 31, 61, .35) 100%); }
.lg-anel { position: absolute; border-radius: 50%; border: 3px solid #2e6bff; pointer-events: none; }
.lg-anel.um { width: 520px; height: 520px; right: -170px; bottom: -230px; }
.lg-anel.dois { width: 130px; height: 130px; right: 34%; top: 60px; border-width: 2px; border-color: rgba(91, 141, 255, .55); }
.lg-marca > :not(.lg-foto):not(.lg-anel) { position: relative; z-index: 1; }
.lg-logo { width: 230px; max-width: 70%; }
.lg-olho { font-size: 13px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: #5b8dff; }
.lg-marca h1 { font-family: "Montserrat", var(--font); font-weight: 800; font-size: 54px; line-height: 1.05; letter-spacing: -.01em; margin: 12px 0 16px; color: #fff; }
.lg-marca h1 b { color: #2e6bff; }
.lg-marca p { margin: 0; max-width: 460px; font-size: 15.5px; line-height: 1.6; color: #c9d6ee; }
.lg-itens { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 26px; }
.lg-itens span { display: inline-flex; align-items: center; gap: 8px; padding: 8px 14px; border-radius: 999px; font-size: 13px; font-weight: 600; background: rgba(255, 255, 255, .08); border: 1px solid rgba(121, 165, 242, .3); }
.lg-itens .icon-svg { color: #79a5f2; }
.lg-rodape { font-size: 12.5px; color: #8ca0c6; }
.lg-rodape b { color: #c9d6ee; font-weight: 700; }

.lg-form { display: flex; flex-direction: column; justify-content: center; padding: 48px clamp(28px, 6vw, 84px); background: #fff; }
.lg-form-in { width: 100%; max-width: 380px; margin: 0 auto; }
.lg-marca-mini { display: none; }
.lg-saudacao { font-size: 13px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: #2e6bff; }
.lg-form h2 { font-family: "Montserrat", var(--font); font-weight: 800; font-size: 30px; color: #0a1f3d; margin: 8px 0 6px; }
.lg-form h2 b { color: #2e6bff; }
.lg-form .lg-sub { color: var(--gray-500); font-size: 14px; margin: 0 0 28px; }
.lg-campo { margin-bottom: 16px; }
.lg-campo label { display: block; font-size: 12.5px; font-weight: 700; color: var(--gray-700); margin-bottom: 6px; }
.lg-input { position: relative; display: flex; align-items: center; }
.lg-input > .icon-svg { position: absolute; left: 14px; color: var(--gray-400); pointer-events: none; }
.lg-input input { width: 100%; height: 48px; padding: 0 44px; border: 1.5px solid var(--gray-200); border-radius: 12px; font-size: 15px; background: var(--gray-50); transition: border-color .15s, background .15s, box-shadow .15s; }
.lg-input input:focus { outline: none; border-color: #2e6bff; background: #fff; box-shadow: 0 0 0 4px rgba(46, 107, 255, .12); }
.lg-input input:focus ~ .icon-svg, .lg-input:focus-within > .icon-svg { color: #2e6bff; }
.lg-olhinho { position: absolute; right: 8px; width: 34px; height: 34px; border: none; background: none; border-radius: 8px; color: var(--gray-400); cursor: pointer; display: inline-flex; align-items: center; justify-content: center; }
.lg-olhinho:hover { background: var(--gray-100); color: var(--gray-700); }
.lg-caps { display: none; font-size: 12px; color: var(--warning); margin-top: 6px; }
.lg-caps.on { display: block; }
.lg-btn { width: 100%; height: 50px; margin-top: 8px; border: none; border-radius: 12px; cursor: pointer; font: inherit; font-size: 15px; font-weight: 700; color: #fff;
  background: linear-gradient(135deg, #2e6bff, #1f4fd1); box-shadow: 0 8px 20px rgba(46, 107, 255, .3); display: inline-flex; align-items: center; justify-content: center; gap: 8px; transition: transform .12s, box-shadow .12s; }
.lg-btn:hover { transform: translateY(-1px); box-shadow: 0 12px 24px rgba(46, 107, 255, .35); }
.lg-btn:disabled { opacity: .7; cursor: wait; transform: none; }
.lg-erro { display: flex; align-items: center; gap: 8px; background: var(--danger-bg); color: var(--danger); border: 1px solid #f1c4bd; border-radius: 12px; padding: 10px 14px; font-size: 13.5px; font-weight: 600; margin-bottom: 18px; }
.lg-seguro { display: flex; align-items: center; justify-content: center; gap: 6px; margin-top: 22px; font-size: 12px; color: var(--gray-400); }
@media (max-width: 900px) {
  .lg-pagina { grid-template-columns: 1fr; }
  .lg-marca { display: none; }
  .lg-form { min-height: calc(100 * var(--vh)); background: #0a1f3d url('../img/rel_fundo.jpg') center / cover; padding: 28px 18px; }
  .lg-form-in { background: #fff; border-radius: 18px; padding: 30px 24px; box-shadow: 0 20px 50px rgba(0, 0, 0, .35); }
  .lg-marca-mini { display: flex; justify-content: center; margin-bottom: 18px; }
  .lg-marca-mini img { width: 56px; height: 56px; }
}

/* ---------- Shell: menu lateral ---------- */
.app { display: flex; min-height: calc(100 * var(--vh)); }
.sidebar {
  width: var(--sidebar-w); flex-shrink: 0;
  background: linear-gradient(190deg, var(--hc-950), var(--hc-900) 55%, var(--hc-800));
  color: var(--white);
  display: flex; flex-direction: column;
  position: fixed; top: 0; bottom: 0; left: 0; z-index: 20;
  border-right: 1px solid rgba(255,255,255,0.06);
  transition: width .2s ease, transform .2s ease;
}
.sidebar-brand { padding: 20px 18px; display: flex; align-items: center; gap: 12px; border-bottom: 1px solid rgba(255,255,255,0.1); }
.brand-mark {
  flex-shrink: 0; width: 42px; height: 42px; background: var(--white); border-radius: 10px;
  display: flex; align-items: center; justify-content: center; box-shadow: var(--shadow-sm); padding: 6px;
}
.brand-mark img { max-width: 100%; max-height: 100%; display: block; }
.brand-text { line-height: 1.25; min-width: 0; }
.brand-name { font-size: 14px; font-weight: 700; color: var(--white); white-space: nowrap; }
.brand-sub { font-size: 10.5px; color: rgba(255,255,255,0.55); text-transform: uppercase; letter-spacing: .06em; margin-top: 2px; white-space: nowrap; }

.sidebar-nav {
  flex: 1; min-height: 0; overflow-y: auto; overflow-x: hidden; padding: 10px 12px; overscroll-behavior: contain;
  /* barra de rolagem fina e discreta, que só "acende" quando o mouse está no menu */
  scrollbar-width: thin; scrollbar-color: transparent transparent; transition: scrollbar-color .2s;
}
.sidebar-nav:hover { scrollbar-color: rgba(121, 165, 242, .45) transparent; }
.sidebar-nav::-webkit-scrollbar { width: 6px; }
.sidebar-nav::-webkit-scrollbar-track { background: transparent; margin: 8px 0; }
.sidebar-nav::-webkit-scrollbar-thumb { background: transparent; border-radius: 99px; }
.sidebar-nav:hover::-webkit-scrollbar-thumb { background: rgba(121, 165, 242, .4); }
.sidebar-nav::-webkit-scrollbar-thumb:hover { background: rgba(121, 165, 242, .7); }
/* esmaece em cima/embaixo quando há mais itens para rolar (classes postas pelo app.js) */
.sidebar-nav.rola-cima { -webkit-mask-image: linear-gradient(to bottom, transparent 0, #000 28px); mask-image: linear-gradient(to bottom, transparent 0, #000 28px); }
.sidebar-nav.rola-baixo { -webkit-mask-image: linear-gradient(to top, transparent 0, #000 28px); mask-image: linear-gradient(to top, transparent 0, #000 28px); }
.sidebar-nav.rola-cima.rola-baixo { -webkit-mask-image: linear-gradient(to bottom, transparent 0, #000 28px, #000 calc(100% - 28px), transparent 100%); mask-image: linear-gradient(to bottom, transparent 0, #000 28px, #000 calc(100% - 28px), transparent 100%); }
.sidebar-section { font-size: 10px; text-transform: uppercase; letter-spacing: .09em; color: rgba(255,255,255,0.38); font-weight: 700; padding: 14px 10px 6px; }
.sidebar-nav a {
  display: flex; align-items: center; gap: 11px;
  padding: 8px 10px; margin-bottom: 2px; border-radius: 8px;
  color: rgba(255,255,255,0.78); font-size: 13.5px; font-weight: 500;
}
.sidebar-nav a .icon { display: flex; opacity: .85; flex-shrink: 0; position: relative; }
.sidebar-nav a:hover { background: rgba(255,255,255,0.07); text-decoration: none; color: var(--white); }
.sidebar-nav a { transition: background .15s, color .15s; }
.sidebar-nav a.active { background: linear-gradient(135deg, #2e6bff, #1f4fd1); color: var(--white); font-weight: 600; box-shadow: 0 4px 12px rgba(46, 107, 255, .35); }
.sidebar-nav a.active .icon { opacity: 1; }
.nav-label { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.nav-badge {
  position: absolute; top: -7px; right: -9px;
  min-width: 17px; height: 17px; padding: 0 4px; border-radius: 999px;
  background: #e0543f; color: #fff; font-size: 10px; font-weight: 800; line-height: 17px; text-align: center;
  box-shadow: 0 0 0 2px var(--hc-900);
}

.sidebar-footer { padding: 14px 16px; border-top: 1px solid rgba(255,255,255,0.1); }
.user-chip { display: flex; align-items: center; gap: 10px; margin-bottom: 10px; min-width: 0; color: inherit; border-radius: 8px; }
a.user-chip:hover { text-decoration: none; background: rgba(255, 255, 255, .06); }
.user-avatar {
  flex-shrink: 0; width: 32px; height: 32px; border-radius: 50%;
  background: var(--hc-600); border: 1px solid rgba(255,255,255,0.25);
  display: flex; align-items: center; justify-content: center;
  font-size: 11.5px; font-weight: 700; color: var(--white);
}
.user-meta { min-width: 0; }
.user-name { font-weight: 600; font-size: 13px; color: var(--white); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.user-email { color: rgba(255,255,255,0.5); font-size: 11.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.logout-link { display: flex; align-items: center; gap: 8px; color: rgba(255,255,255,0.7); font-size: 12.5px; font-weight: 600; padding: 6px 2px; }
.logout-link:hover { color: var(--white); text-decoration: none; }
.sidebar-collapse {
  display: flex; align-items: center; gap: 8px; width: 100%;
  background: rgba(255,255,255,0.06); border: 1px solid rgba(255,255,255,0.08);
  color: rgba(255,255,255,0.7); font: inherit; font-size: 12px; font-weight: 600;
  padding: 7px 10px; border-radius: 8px; cursor: pointer; margin-top: 8px;
}
.sidebar-collapse:hover { background: rgba(255,255,255,0.12); color: #fff; }
.sidebar-collapse .icon-svg { transition: transform .2s ease; }
.nav-tooltip {
  position: fixed; z-index: 200; transform: translateY(-50%);
  background: var(--hc-950); color: #fff; font-size: 12.5px; font-weight: 600;
  padding: 6px 10px; border-radius: 6px; box-shadow: var(--shadow-lg);
  pointer-events: none; opacity: 0; transition: opacity .12s ease; white-space: nowrap;
}
.nav-tooltip.show { opacity: 1; }
.sidebar-backdrop { display: none; }

/* ---------- Shell: área principal e topo ---------- */
.main { margin-left: var(--sidebar-w); flex: 1; min-width: 0; display: flex; flex-direction: column; transition: margin-left .2s ease; }
.topbar {
  background: rgba(255,255,255,0.94);
  backdrop-filter: saturate(180%) blur(6px);
  border-bottom: 1px solid var(--gray-200);
  padding: 14px 28px;
  display: flex; align-items: center; justify-content: space-between; gap: 16px;
  position: sticky; top: 0; z-index: 10;
  min-height: 68px;
}
.topbar-title { display: flex; align-items: center; min-width: 0; }
.topbar h1 { margin: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.topbar .subtitle { color: var(--gray-500); font-size: 12.5px; margin-top: 2px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.page-actions { display: flex; align-items: center; gap: 8px; flex-shrink: 0; flex-wrap: wrap; justify-content: flex-end; }
.menu-toggle {
  display: none; align-items: center; justify-content: center; flex-shrink: 0;
  width: 36px; height: 36px; border-radius: 8px;
  border: 1px solid var(--gray-200); background: var(--white); cursor: pointer;
  margin-right: 12px; font-size: 16px; color: var(--gray-700);
}
/* min-width:0: sem isso, dentro do flex em coluna, a área cresce até a
   largura da tabela mais larga e a página inteira estoura para o lado */
.content { padding: 24px 28px 64px; width: 100%; max-width: 1480px; min-width: 0; }
.main > * { min-width: 0; max-width: 100%; }

/* ---------- Cards e grades ---------- */
.card {
  background: var(--white);
  border: 1px solid var(--gray-200);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow);
  padding: 20px 22px;
  margin-bottom: 20px;
  min-width: 0;
}
.card-header {
  display: flex; align-items: center; justify-content: space-between;
  flex-wrap: wrap; gap: 8px 12px;
  margin-bottom: 14px; padding-bottom: 12px;
  border-bottom: 1px solid var(--gray-100);
}
.card-header h2 { margin: 0; display: flex; align-items: center; gap: 8px; flex: 1 1 auto; min-width: 0; }
.card-header > :not(h2) { flex-shrink: 0; }

.grid-2 { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr); gap: 20px; }
.grid-2.equal { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
.grid-3 { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; }
.grid-2 > *, .grid-3 > * { min-width: 0; }

/* ---------- KPIs ---------- */
/* Flex (e não grid): a última linha se estica — não sobra card "órfão" */
.kpi-grid { display: flex; flex-wrap: wrap; gap: 14px; margin-bottom: 20px; }
.kpi-grid > .kpi-card { flex: 1 1 145px; min-width: 0; }
.kpi-card {
  background: var(--white);
  border: 1px solid var(--gray-200);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-sm);
  padding: 15px 18px;
  position: relative; overflow: hidden;
}
.kpi-card::before {
  content: ""; position: absolute; top: 0; left: 0; right: 0; height: 3px;
  background: linear-gradient(90deg, var(--hc-500), var(--hc-700));
}
.kpi-card.warn::before { background: linear-gradient(90deg, #d79a2e, var(--warning)); }
.kpi-card.danger::before { background: linear-gradient(90deg, #d1564a, var(--danger)); }
.kpi-card.success::before { background: linear-gradient(90deg, #2ea56b, var(--success)); }
.kpi-card .label { font-size: 10.5px; text-transform: uppercase; letter-spacing: .05em; color: var(--gray-500); margin-bottom: 6px; font-weight: 700; line-height: 1.35; }
.kpi-card .value { font-size: clamp(18px, 1.55vw, 22px); font-weight: 800; color: var(--hc-900); letter-spacing: -0.02em; line-height: 1.2; white-space: nowrap; }
/* Card de KPI com valor em R$: ocupa mais espaço na linha */
.kpi-grid > .kpi-card.wide { flex: 1.7 1 210px; }
.kpi-card .value.sm { font-size: 18px; }
.kpi-card .hint { font-size: 11.5px; color: var(--gray-500); margin-top: 5px; line-height: 1.4; }
.kpi-card a.stretched::after { content: ""; position: absolute; inset: 0; }
/* KPI dentro de um card: versão "chapada", sem sombra nem faixa */
.card .kpi-grid { gap: 10px; margin-bottom: 16px; }
.card .kpi-card { box-shadow: none; background: var(--gray-50); border-color: var(--gray-100); padding: 12px 14px; }
.card .kpi-card::before { display: none; }
.card .kpi-card .value { font-size: 18px; }

/* ---------- Tabelas ---------- */
.table-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; }
table { width: 100%; border-collapse: collapse; font-size: 13px; }
thead th {
  text-align: left; font-size: 10.5px; text-transform: uppercase; letter-spacing: .05em;
  font-weight: 700; color: var(--gray-500);
  border-bottom: 1px solid var(--gray-200);
  padding: 0 10px 9px; white-space: nowrap;
}
tbody td { padding: 10px; border-bottom: 1px solid var(--gray-100); vertical-align: middle; color: var(--gray-700); }
tbody td strong { color: var(--gray-900); }
/* Nomes (em negrito ou link) não quebram em 4 linhas: a tabela rola se precisar */
tbody td > strong:first-child, tbody td > a:first-child:not(.btn):not(.badge) { white-space: nowrap; }
tbody tr:hover { background: var(--hc-50); }
tbody tr:last-child td { border-bottom: none; }
tfoot td { padding: 11px 10px; border-top: 2px solid var(--gray-200); color: var(--gray-900); }
td.text-right, th.text-right { white-space: nowrap; }
td input[type=checkbox], th input[type=checkbox] { width: auto; }
td select:not(.badge) { min-width: 170px; }
td input[type=number], td input[type=date] { min-width: 120px; }
.col-nome { min-width: 190px; }

/* Célula de ações: NUNCA display:flex numa <td> (quebra a tabela). */
td.actions-col { white-space: nowrap; text-align: right; width: 1%; }
td.actions-col > * { display: inline-flex; vertical-align: middle; margin: 2px 0 2px 4px; }
td.actions-col > form { display: inline-flex; gap: 4px; }

.row-alert td:first-child { box-shadow: inset 3px 0 0 var(--danger); }
.row-warn td:first-child { box-shadow: inset 3px 0 0 var(--warning); }

/* ---------- Badges ---------- */
.badge {
  display: inline-block; padding: 2px 10px; border-radius: 999px;
  font-size: 11px; font-weight: 700; letter-spacing: .01em; white-space: nowrap; line-height: 1.6;
}
.badge + .badge { margin-left: 3px; }
.badge-success { background: var(--success-bg); color: var(--success); }
.badge-danger { background: var(--danger-bg); color: var(--danger); }
.badge-warning { background: var(--warning-bg); color: var(--warning); }
.badge-info { background: var(--info-bg); color: var(--info); }
.badge-muted { background: var(--gray-100); color: var(--gray-500); }
select.badge { width: auto; border: none; padding: 3px 8px; cursor: pointer; }

/* ---------- Formulários ---------- */
.form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px 18px; }
.form-grid.cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.form-field { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.form-field.span-2 { grid-column: span 2; }
.form-field .help { font-size: 11.5px; color: var(--gray-500); line-height: 1.4; }
label { font-size: 12px; font-weight: 600; color: var(--gray-600); }
input, select, textarea {
  font-family: inherit; font-size: 13.5px;
  padding: 8px 11px; min-height: 36px;
  border: 1px solid var(--gray-300); border-radius: 8px;
  background: var(--white); color: var(--gray-900); width: 100%;
}
input[type=checkbox], input[type=radio] { min-height: 0; width: auto; }
input[type=file] { padding: 6px; }
input:focus, select:focus, textarea:focus { outline: none; border-color: var(--hc-500); box-shadow: 0 0 0 3px var(--hc-100); }
textarea { resize: vertical; min-height: 70px; line-height: 1.45; }
.form-actions { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 18px; padding-top: 16px; border-top: 1px solid var(--gray-100); }
/* Linha "campo(s) + botão" (ex.: adicionar item em Configurações) */
.inline-form { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; margin-bottom: 14px; }
.inline-form > input, .inline-form > select { flex: 1 1 110px; width: auto; min-width: 0; }
.fieldset { border: 1px solid var(--gray-200); border-radius: var(--radius); padding: 16px; margin-bottom: 16px; background: var(--gray-50); }
.fieldset > .legend { font-weight: 700; color: var(--hc-900); font-size: 13.5px; margin-bottom: 12px; display: flex; align-items: center; gap: 8px; }
.chips { display: flex; gap: 6px; flex-wrap: wrap; }
.chip-radio input { display: none; }
.chip-radio span {
  display: inline-block; padding: 6px 12px; border-radius: 999px; border: 1px solid var(--gray-300);
  font-size: 12.5px; font-weight: 600; color: var(--gray-700); cursor: pointer; background: var(--white); white-space: nowrap;
}
.chip-radio input:checked + span { background: var(--hc-700); border-color: var(--hc-700); color: #fff; }
.chip-radio.success input:checked + span { background: var(--success); border-color: var(--success); }
.chip-radio.warning input:checked + span { background: var(--warning); border-color: var(--warning); }
.chip-radio.danger input:checked + span { background: var(--danger); border-color: var(--danger); }

/* ---------- Botões ---------- */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 6px;
  padding: 8px 15px; border-radius: 8px; border: 1px solid transparent;
  font-size: 13px; font-weight: 600; cursor: pointer; text-decoration: none; font-family: inherit;
  white-space: nowrap; line-height: 1.25; flex-shrink: 0; min-height: 36px;
}
.btn:hover { text-decoration: none; }
.btn:disabled { opacity: .5; cursor: not-allowed; }
.btn-primary { background: var(--hc-700); color: var(--white); box-shadow: var(--shadow-sm); }
.btn-primary:hover { background: var(--hc-800); }
.btn-secondary { background: var(--white); border-color: var(--gray-300); color: var(--gray-700); }
.btn-secondary:hover { background: var(--gray-50); border-color: var(--gray-400); }
.btn-danger { background: var(--danger-bg); color: var(--danger); }
.btn-danger:hover { background: #f6d6d1; }
.btn-success { background: var(--success-bg); color: var(--success); }
.btn-success:hover { background: #cdebd9; text-decoration: none; }
.btn-warning { background: var(--warning-bg); color: var(--warning); }
.btn-warning:hover { background: #f5e2bd; text-decoration: none; }
.btn-sm { padding: 5px 10px; font-size: 12px; border-radius: 6px; min-height: 28px; }
.btn-block { width: 100%; }

/* ---------- Barra de filtros ---------- */
.toolbar { display: flex; align-items: center; gap: 8px 10px; flex-wrap: wrap; margin-bottom: 18px; }
.toolbar form { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; flex: 1 1 auto; min-width: 0; }
.toolbar form.no-grow { flex: 0 0 auto; }
.toolbar .search { flex: 1 1 220px; min-width: 180px; width: auto; }
.toolbar select { width: auto; max-width: 240px; }
.toolbar input[type=date], .toolbar input[type=month] { width: auto; }
/* Seletor de credores (Controle de Ações) */
.multi-cart-form { flex: 0 1 auto !important; }
.multi-cart { position: relative; }
.multi-cart > summary { list-style: none; display: flex; align-items: center; gap: 8px; cursor: pointer; padding: 8px 12px; border: 1px solid var(--gray-200);
  border-radius: 8px; background: var(--white); max-width: min(560px, 100%); }
.multi-cart > summary::-webkit-details-marker { display: none; }
.multi-cart > summary::after { content: '▾'; margin-left: 4px; color: var(--gray-500, #6b7280); }
.multi-cart > summary strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.multi-cart[open] > summary { border-color: var(--hc-400); }
.multi-cart-lbl { font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; color: var(--gray-500, #6b7280); }
.multi-cart-painel { position: absolute; z-index: 60; top: calc(100% + 6px); left: 0; width: min(420px, calc(100vw - 32px)); max-height: calc(70 * var(--vh)); overflow: auto;
  background: var(--white); border: 1px solid var(--gray-200); border-radius: 10px; box-shadow: var(--shadow-lg); padding: 10px; }
.multi-cart-topo { display: flex; align-items: center; gap: 6px; margin-bottom: 8px; }
.multi-cart-topo [data-contador] { margin-left: auto; }
.multi-cart-grupo { border-top: 1px solid var(--gray-100); padding: 6px 0; }
.multi-cart-sis { display: flex; align-items: center; gap: 8px; font-size: 11px; font-weight: 800; text-transform: uppercase; letter-spacing: .05em; color: var(--hc-600); padding: 4px 6px; cursor: pointer; }
.multi-cart-item { display: flex; align-items: center; gap: 8px; padding: 5px 6px 5px 22px; border-radius: 6px; font-size: 13px; cursor: pointer; }
.multi-cart-item:hover { background: var(--hc-50); }
.multi-cart-item span { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.multi-cart-item small { color: var(--gray-500, #6b7280); font-variant-numeric: tabular-nums; }
.multi-cart input[type=checkbox] { width: auto; margin: 0; }
.multi-cart-rodape { position: sticky; bottom: -10px; background: var(--white); padding: 8px 0 0; border-top: 1px solid var(--gray-100); display: flex; justify-content: flex-end; }

/* ---------- Mensagens ---------- */
.flash { padding: 11px 15px; border-radius: 8px; margin-bottom: 16px; font-size: 13.5px; font-weight: 500; border: 1px solid transparent; }
.flash-success { background: var(--success-bg); color: var(--success); border-color: #c7e6d5; }
.flash-error { background: var(--danger-bg); color: var(--danger); border-color: #f0c6bf; }
.flash-info { background: var(--info-bg); color: var(--info); border-color: #cfe0f4; }
.flash-warning { background: var(--warning-bg); color: var(--warning); border-color: #efd3a1; }

/* ---------- Abas e pílulas ---------- */
.tabs { display: flex; gap: 2px; border-bottom: 1px solid var(--gray-200); margin-bottom: 16px; flex-wrap: wrap; }
.tabs a, .tabs button {
  background: none; border: none; font: inherit; cursor: pointer;
  padding: 9px 13px; font-size: 13.5px; font-weight: 600; color: var(--gray-500);
  border-bottom: 2px solid transparent; margin-bottom: -1px;
  display: inline-flex; align-items: center; gap: 7px; white-space: nowrap;
}
.tabs a:hover, .tabs button:hover { color: var(--hc-700); text-decoration: none; }
.tabs .active { color: var(--hc-700); border-bottom-color: var(--hc-600); }
.tabs .count { background: var(--gray-100); color: var(--gray-600); border-radius: 999px; padding: 0 7px; font-size: 11px; }
.tabs .active .count { background: var(--hc-100); color: var(--hc-700); }
.tabs .count.danger { background: var(--danger-bg); color: var(--danger); }
.pill-nav { display: flex; gap: 6px; flex-wrap: wrap; margin-bottom: 16px; }
.pill-nav a { padding: 6px 13px; border-radius: 999px; background: var(--white); border: 1px solid var(--gray-200); color: var(--gray-700); font-size: 12.5px; font-weight: 600; white-space: nowrap; }
.pill-nav a:hover { text-decoration: none; border-color: var(--gray-300); }
.pill-nav a.active { background: var(--hc-700); border-color: var(--hc-700); color: var(--white); }

/* ---------- Barras e progresso ---------- */
.bar-row { display: flex; align-items: center; gap: 12px; margin-bottom: 10px; }
.bar-label { width: 150px; font-size: 12.5px; color: var(--gray-700); flex-shrink: 0; font-weight: 500; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.bar-track { flex: 1; background: var(--gray-100); border-radius: 6px; overflow: hidden; height: 14px; min-width: 40px; }
.bar-fill { height: 100%; background: linear-gradient(90deg, var(--hc-500), var(--hc-800)); border-radius: 6px; }
.bar-value { min-width: 60px; text-align: right; font-size: 12.5px; font-weight: 700; color: var(--gray-700); white-space: nowrap; }
.progress { background: var(--gray-100); border-radius: 6px; overflow: hidden; height: 9px; }
.progress > span { display: block; height: 100%; background: linear-gradient(90deg, var(--hc-500), var(--hc-800)); }
.progress.thin { height: 6px; }
.progress-wrap { position: relative; }
.progress-wrap .ideal { position: absolute; top: -3px; bottom: -3px; width: 2px; background: var(--gray-700); border-radius: 2px; }
.pct-pill { display: inline-block; min-width: 48px; text-align: center; padding: 1px 8px; border-radius: 999px; font-weight: 800; font-size: 11.5px; white-space: nowrap; }
.pct-pill.good { background: var(--success-bg); color: var(--success); }
.pct-pill.mid { background: var(--warning-bg); color: var(--warning); }
.pct-pill.bad { background: var(--danger-bg); color: var(--danger); }
.mini-bars { display: flex; align-items: flex-end; gap: 3px; height: 56px; }
.mini-bars span { flex: 1; background: var(--hc-400); border-radius: 3px 3px 0 0; min-height: 2px; }
.mini-bars span:hover { background: var(--hc-700); }

/* ---------- Upload (arrastar e soltar) ---------- */
.upload-block { flex: 1 1 240px; min-width: 0; }
.upload-block-head { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 2px 10px; margin-bottom: 8px; }
.upload-block-head .title { font-weight: 700; color: var(--hc-900); font-size: 13.5px; }
.upload-block-head .hint { color: var(--gray-500); font-size: 11.5px; overflow-wrap: anywhere; }
.upload-drop {
  border: 1.5px dashed var(--gray-300); border-radius: var(--radius); background: var(--gray-50);
  padding: 20px 16px; text-align: center; cursor: pointer;
  transition: border-color .15s ease, background .15s ease;
}
.upload-drop:hover, .upload-drop.dragover { border-color: var(--hc-500); background: var(--hc-100); }
.upload-drop .icon { color: var(--hc-500); margin-bottom: 8px; display: flex; justify-content: center; }
.upload-drop .drop-text { font-size: 13px; color: var(--gray-700); font-weight: 500; }
.upload-drop .drop-text a { font-weight: 700; }
.upload-drop .drop-text .icon-svg { display: inline-block; vertical-align: -3px; }
.upload-drop .drop-sub { font-size: 11.5px; color: var(--gray-500); margin-top: 4px; }
.upload-drop .file-picked { font-size: 12.5px; color: var(--hc-700); font-weight: 600; margin-top: 6px; word-break: break-all; }
.upload-drop[data-auto] { display: block; }
.upload-drop[data-auto] input[type=file] { display: none; }

/* ---------- Modal ---------- */
.modal-overlay {
  position: fixed; inset: 0; z-index: 100;
  background: rgba(10, 24, 44, 0.55);
  display: flex; align-items: center; justify-content: center; padding: 20px;
}
.modal-card {
  background: var(--white); border-radius: var(--radius-lg); box-shadow: var(--shadow-lg);
  width: 100%; max-width: 420px; max-height: calc(calc(100 * var(--vh)) - 40px); overflow-y: auto;
  padding: 26px 24px 22px; text-align: center;
}
.modal-card.lg { max-width: 640px; text-align: left; }
.modal-card .modal-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 14px; }
.modal-card .modal-close { background: none; border: none; font-size: 22px; line-height: 1; cursor: pointer; color: var(--gray-500); }
.modal-card .modal-icon { width: 52px; height: 52px; border-radius: 50%; display: flex; align-items: center; justify-content: center; margin: 0 auto 16px; }
.modal-icon.loading { background: var(--hc-100); color: var(--hc-600); }
.modal-icon.success { background: var(--success-bg); color: var(--success); }
.modal-icon.error { background: var(--danger-bg); color: var(--danger); }
.modal-icon.loading svg { animation: modal-spin 0.9s linear infinite; }
@keyframes modal-spin { to { transform: rotate(360deg); } }
.modal-card h3 { margin-bottom: 6px; }
.modal-card .modal-msg { color: var(--gray-500); font-size: 13px; margin-bottom: 18px; }
.modal-card .progress { margin-bottom: 6px; }
.modal-card .progress-label { font-size: 12px; color: var(--gray-500); margin-bottom: 18px; }
.modal-summary { text-align: left; background: var(--gray-50); border: 1px solid var(--gray-200); border-radius: var(--radius); padding: 14px 16px; margin-bottom: 18px; }
.modal-summary-row { display: flex; justify-content: space-between; gap: 10px; padding: 5px 0; font-size: 13px; color: var(--gray-700); }
.modal-summary-row strong { color: var(--hc-900); }
.modal-summary-row + .modal-summary-row { border-top: 1px solid var(--gray-100); }

/* ---------- Listas de itens, documentos, linha do tempo ---------- */
.doc-list { display: flex; flex-direction: column; gap: 8px; }
.doc-item { display: flex; align-items: center; gap: 10px; padding: 10px 12px; border: 1px solid var(--gray-200); border-radius: var(--radius); background: var(--white); min-width: 0; }
.doc-item > .badge, .doc-item > .btn, .doc-item > form { flex-shrink: 0; }
.doc-item .doc-icon { width: 34px; height: 34px; border-radius: 8px; background: var(--hc-100); color: var(--hc-600); display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.doc-item .doc-meta { flex: 1 1 auto; min-width: 0; }
.alert-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(340px, 1fr)); gap: 10px; }
.badge-list { display: flex; flex-wrap: wrap; gap: 3px; min-width: 120px; }
.badge-list .badge + .badge { margin-left: 0; }
.wrap, td > a.wrap:first-child { white-space: normal !important; }
.doc-item .doc-name { font-weight: 600; color: var(--gray-900); font-size: 13px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.doc-item .doc-sub { font-size: 11.5px; color: var(--gray-500); }
.doc-item > form { display: inline-flex; }
.timeline { position: relative; padding-left: 26px; }
.timeline::before { content: ""; position: absolute; left: 8px; top: 4px; bottom: 4px; width: 2px; background: var(--gray-200); }
.tl-item { position: relative; margin-bottom: 16px; }
.tl-item::before { content: ""; position: absolute; left: -23px; top: 4px; width: 12px; height: 12px; border-radius: 50%; background: var(--white); border: 3px solid var(--hc-500); }
.tl-item.success::before { border-color: var(--success); }
.tl-item.warning::before { border-color: var(--warning); }
.tl-item.danger::before { border-color: var(--danger); }
.tl-head { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; font-size: 13px; }
.tl-head .icon-svg { display: inline-block; vertical-align: -3px; }
.tl-body { margin-top: 6px; background: var(--gray-50); border: 1px solid var(--gray-100); border-radius: var(--radius); padding: 10px 12px; font-size: 13px; color: var(--gray-700); }
.info-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 12px; }
.info-block { border: 1px solid var(--gray-200); border-radius: var(--radius); padding: 12px 14px; background: var(--white); }
.info-block .ib-label { font-size: 10.5px; text-transform: uppercase; letter-spacing: .05em; color: var(--gray-500); font-weight: 700; margin-bottom: 6px; }
.info-block .ib-text { font-size: 13.5px; color: var(--gray-800); white-space: pre-line; }
.info-block.pos { border-left: 3px solid var(--success); }
.info-block.neg { border-left: 3px solid var(--warning); }
.info-block.plan { border-left: 3px solid var(--hc-500); }
.legend-row { display: flex; gap: 14px; flex-wrap: wrap; font-size: 12px; color: var(--gray-600); align-items: center; }
.legend-dot { display: inline-block; width: 10px; height: 10px; border-radius: 3px; margin-right: 5px; vertical-align: -1px; }

/* ---------- Espelho de equipe ---------- */
.espelho-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); gap: 12px; }
.pa-card {
  border-radius: var(--radius); padding: 12px 13px; border: 1px solid var(--gray-200);
  background: var(--white); box-shadow: var(--shadow-sm); cursor: pointer; position: relative;
  transition: transform .12s ease, box-shadow .12s ease; min-width: 0;
}
.pa-card:hover { transform: translateY(-2px); box-shadow: var(--shadow); }
.pa-card .pa-top { display: flex; justify-content: space-between; align-items: center; gap: 6px; }
.pa-card .pa-num { font-weight: 700; color: var(--hc-900); font-size: 14px; white-space: nowrap; }
.pa-card .pa-status { font-size: 9.5px; font-weight: 800; text-transform: uppercase; letter-spacing: .04em; padding: 2px 7px; border-radius: 999px; white-space: nowrap; }
.pa-card.livre { border-top: 3px solid var(--success); }
.pa-card.livre .pa-status { background: var(--success-bg); color: var(--success); }
.pa-card.ocupado { border-top: 3px solid var(--hc-500); }
.pa-card.ocupado .pa-status { background: var(--hc-100); color: var(--hc-700); }
.pa-card.outra { border-top: 3px solid var(--warning); }
.pa-card.outra .pa-status { background: var(--warning-bg); color: var(--warning); }
.pa-card.manutencao { border-top: 3px solid var(--gray-400); background: var(--gray-50); }
.pa-card.manutencao .pa-status { background: var(--gray-200); color: var(--gray-600); }
.pa-card .pa-person { display: flex; align-items: center; gap: 8px; margin-top: 10px; min-height: 34px; }
.pa-card .pa-avatar { width: 30px; height: 30px; border-radius: 50%; background: var(--hc-600); color: #fff; font-size: 11px; font-weight: 700; display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.pa-card .pa-avatar.off { background: var(--gray-300); }
.pa-card .pa-name { font-size: 12.5px; font-weight: 600; color: var(--gray-900); line-height: 1.25; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.pa-card .pa-sub { font-size: 11px; color: var(--gray-500); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pa-card .pa-foot { display: flex; justify-content: space-between; gap: 6px; margin-top: 8px; font-size: 11px; color: var(--gray-500); border-top: 1px dashed var(--gray-200); padding-top: 6px; }
.pa-card.dim { opacity: .3; }
.team-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(290px, 1fr)); gap: 16px; }
.team-card { border: 1px solid var(--gray-200); border-radius: var(--radius-lg); background: var(--white); box-shadow: var(--shadow-sm); overflow: hidden; }
.team-card .team-head { padding: 11px 14px; background: var(--hc-50); border-bottom: 1px solid var(--gray-200); display: flex; justify-content: space-between; align-items: center; gap: 8px; }
.team-card .team-head strong { color: var(--hc-900); }
.team-member { display: flex; align-items: center; gap: 10px; padding: 9px 14px; border-bottom: 1px solid var(--gray-100); font-size: 13px; }
.team-member:last-child { border-bottom: none; }
.team-member .tm-main { flex: 1; min-width: 0; }
.team-member .tm-name { font-weight: 600; color: var(--gray-900); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.team-member .tm-sub { font-size: 11.5px; color: var(--gray-500); }
.presence { width: 9px; height: 9px; border-radius: 50%; background: var(--gray-300); flex-shrink: 0; display: inline-block; }
.presence.on { background: #2ea56b; box-shadow: 0 0 0 3px var(--success-bg); }
.presence.lunch { background: #d79a2e; box-shadow: 0 0 0 3px var(--warning-bg); }

/* ---------- Planejamento ---------- */
.period-nav { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.period-nav .period-label { font-weight: 800; color: var(--hc-900); font-size: 15px; min-width: 170px; text-align: center; white-space: nowrap; }
.cal { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); border: 1px solid var(--gray-200); border-radius: var(--radius); overflow: hidden; }
.cal-head { background: var(--hc-50); font-size: 10.5px; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; color: var(--gray-500); padding: 8px; text-align: center; border-bottom: 1px solid var(--gray-200); }
.cal-day { min-height: 96px; border-right: 1px solid var(--gray-100); border-bottom: 1px solid var(--gray-100); padding: 6px; font-size: 11.5px; background: var(--white); min-width: 0; }
.cal-day:nth-child(7n) { border-right: none; }
.cal-day.out { background: var(--gray-50); color: var(--gray-400); }
.cal-day.weekend { background: #fafbfc; }
.cal-day.today { box-shadow: inset 0 0 0 2px var(--hc-500); }
.cal-day .cal-num { font-weight: 700; color: var(--gray-700); display: flex; justify-content: space-between; align-items: center; gap: 4px; }
.cal-day .cal-num a { color: inherit; }
.cal-ev { display: block; margin-top: 3px; padding: 2px 6px; border-radius: 4px; background: var(--hc-100); color: var(--hc-800); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-weight: 600; }
.cal-ev.acao { background: #efe7fb; color: #5b3a9b; }
.cal-ev.reav { background: var(--warning-bg); color: var(--warning); }
.cal-ev.done { text-decoration: line-through; opacity: .6; }
.cal-ev.alta { box-shadow: inset 3px 0 0 var(--danger); }
.cal-money { font-size: 10px; color: var(--success); font-weight: 700; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.week-board { display: grid; grid-template-columns: repeat(7, minmax(140px, 1fr)); gap: 10px; overflow-x: auto; padding-bottom: 6px; }
.week-col { background: var(--gray-50); border: 1px solid var(--gray-200); border-radius: var(--radius); padding: 10px; min-height: 220px; min-width: 0; }
.week-col.today { border-color: var(--hc-500); box-shadow: 0 0 0 2px var(--hc-100); }
.week-col .wc-head { display: flex; justify-content: space-between; align-items: center; gap: 4px; margin-bottom: 8px; }
.week-col .wc-day { font-weight: 800; color: var(--hc-900); }
.week-col .wc-date { font-size: 11.5px; color: var(--gray-500); }
.week-col .wc-real { font-size: 11px; color: var(--gray-500); margin-bottom: 8px; padding-bottom: 8px; border-bottom: 1px dashed var(--gray-200); line-height: 1.5; }
.task { background: var(--white); border: 1px solid var(--gray-200); border-radius: 8px; padding: 8px 9px; margin-bottom: 7px; font-size: 12.5px; box-shadow: var(--shadow-sm); }
.task.alta { border-left: 3px solid var(--danger); }
.task.media { border-left: 3px solid var(--warning); }
.task.baixa { border-left: 3px solid var(--gray-300); }
.task.done .task-title { text-decoration: line-through; color: var(--gray-400); }
.task .task-title { font-weight: 600; color: var(--gray-900); }
.task .task-sub { font-size: 11px; color: var(--gray-500); margin-top: 2px; }
.task .task-actions { display: flex; flex-wrap: wrap; gap: 4px; margin-top: 6px; }
.task .task-actions form { display: inline-flex; }
.task .task-actions .btn { font-size: 10.5px; padding: 2px 7px; min-height: 22px; }
.task.acao { border-left: 3px solid #7a52c7; }
.task.reav { border-left: 3px solid var(--warning); background: #fffaf0; }
.task.acao-cob { background: #faf7ff; border-top-color: #e3d8f6; border-right-color: #e3d8f6; border-bottom-color: #e3d8f6; }
.acao-opcoes { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px 16px; padding: 12px 14px; border: 1px solid #e3d8f6; border-radius: 10px; background: #faf7ff; }
.acao-opcoes .span-2 { grid-column: 1 / -1; }
@media (max-width: 640px) { .acao-opcoes { grid-template-columns: 1fr; } }
a.task:hover { text-decoration: none; }

/* ---------- Menu recolhido (desktop) ---------- */
@media (min-width: 901px) {
  html.sidebar-collapsed { --sidebar-w: 72px; }
  html.sidebar-collapsed .sidebar-brand { justify-content: center; padding: 18px 10px; }
  html.sidebar-collapsed .brand-text,
  html.sidebar-collapsed .nav-label,
  html.sidebar-collapsed .user-meta { display: none; }
  html.sidebar-collapsed .sidebar-nav { padding: 10px; }
  html.sidebar-collapsed .sidebar-section { padding: 10px 0 4px; margin: 6px 6px 4px; border-top: 1px solid rgba(255,255,255,0.1); }
  html.sidebar-collapsed .sidebar-section span { display: none; }
  html.sidebar-collapsed .sidebar-nav a { justify-content: center; padding: 10px 0; }
  html.sidebar-collapsed .sidebar-footer { padding: 14px 10px; }
  html.sidebar-collapsed .user-chip,
  html.sidebar-collapsed .logout-link { justify-content: center; }
  html.sidebar-collapsed .sidebar-collapse { justify-content: center; padding: 8px 0; }
  html.sidebar-collapsed .sidebar-collapse .icon-svg { transform: rotate(180deg); }
  .menu-toggle { display: inline-flex; }
}

/* ---------- Responsivo ---------- */
@media (max-width: 1200px) {
  .grid-2, .grid-2.equal, .grid-3 { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 900px) {
  .sidebar { transform: translateX(-100%); }
  .sidebar.open { transform: translateX(0); }
  .main { margin-left: 0; }
  .menu-toggle { display: inline-flex !important; }
  .content { padding: 18px 14px 48px; }
  .topbar { padding: 12px 14px; flex-wrap: wrap; }
  .topbar .subtitle { display: none; }
  .sidebar-collapse { display: none; }
  .sidebar-backdrop.show { display: block; position: fixed; inset: 0; background: rgba(4,22,44,.45); z-index: 15; }
  .form-grid, .form-grid.cols-3 { grid-template-columns: minmax(0, 1fr); }
  .kpi-grid > .kpi-card, .kpi-grid > .kpi-card.wide { flex: 1 1 140px; }
  .card .kpi-grid > .kpi-card { flex-basis: 130px; }
  .page-actions .btn { padding: 6px 10px; font-size: 12px; min-height: 30px; }
  .bar-label { width: 100px; }
  .alert-grid { grid-template-columns: minmax(0, 1fr); }
  .card-header > :not(h2) { flex-shrink: 1; min-width: 0; flex-wrap: wrap; }
  .form-field.span-2 { grid-column: span 1; }
  .card { padding: 16px; }
}

/* ---------- Aviso de sincronização em segundo plano ---------- */
.sync-toast {
  position: fixed; right: 18px; bottom: 18px; z-index: 150;
  background: var(--hc-900); color: #fff; font-size: 12.5px; font-weight: 600;
  padding: 9px 14px; border-radius: 999px; box-shadow: var(--shadow-lg);
}
.sync-toast-2 { bottom: 60px; } /* AquiCob, acima do toast do Xprisma */
/* Checkboxes de carteiras no cadastro do operador */
.check-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 6px; }
.check-item { display: flex; align-items: center; gap: 8px; padding: 7px 10px; border: 1px solid var(--gray-200); border-radius: 8px; background: var(--white); font-size: 13px; font-weight: 500; color: var(--gray-800); cursor: pointer; }
.check-item:hover { border-color: var(--hc-400); }
.check-item input { width: auto; min-height: 0; }
.check-item .small { margin-left: auto; }
.check-item.marcado { border-color: var(--hc-500); background: var(--hc-50); }
.steps { display: flex; flex-direction: column; gap: 8px; }
.step { display: flex; gap: 10px; align-items: flex-start; font-size: 13px; }
.step .dot { width: 22px; height: 22px; border-radius: 50%; flex-shrink: 0; display: flex; align-items: center; justify-content: center; font-size: 12px; font-weight: 800; }
.step.ok .dot { background: var(--success-bg); color: var(--success); }
.step.pend .dot { background: var(--warning-bg); color: var(--warning); }

/* ---------- Controle de Ações: casos ouro e listas por canal ---------- */
.camp { --c: var(--hc-600); --c-bg: var(--hc-100); --c-soft: #f4f8fd; }
.camp-ouro { --c: #a86a00; --c-bg: #fff1cc; --c-soft: #fffaeb; }
.camp-mailing { --c: #1857a0; --c-bg: #dde9f8; --c-soft: #f3f8fe; }
.camp-waba { --c: #11875a; --c-bg: #d6f3e5; --c-soft: #f1fbf6; }
.camp-sms { --c: #6d3fc0; --c-bg: #e9e0fa; --c-soft: #f8f5fe; }
.camp-ura { --c: #c2571a; --c-bg: #fde3d2; --c-soft: #fff7f1; }
.card.camp { border-top: 4px solid var(--c); background: linear-gradient(180deg, var(--c-soft) 0, var(--white) 140px); }
.camp-box { border: 1px solid var(--gray-200); border-left: 5px solid var(--c); border-radius: var(--radius-lg); padding: 16px 18px; margin-top: 18px;
  background: linear-gradient(90deg, var(--c-soft) 0, var(--white) 55%); box-shadow: var(--shadow-sm); }
.camp-head { display: flex; align-items: flex-start; gap: 14px; flex-wrap: wrap; }
.camp-icon { width: 44px; height: 44px; border-radius: 12px; display: flex; align-items: center; justify-content: center; flex-shrink: 0;
  background: var(--c-bg); color: var(--c); box-shadow: inset 0 0 0 1px rgba(0,0,0,.04); }
.camp-title { flex: 1; min-width: 220px; }
.camp-title h2, .camp-title h3 { margin: 0; color: var(--c); font-size: 17px; }
.camp-title p { margin: 4px 0 0; font-size: 12.5px; color: var(--gray-500); line-height: 1.45; }
.camp-count { background: var(--c); color: #fff; border-radius: 999px; padding: 6px 14px; font-weight: 800; font-size: 14px; white-space: nowrap; }
.camp-count.zero { background: var(--gray-200); color: var(--gray-500); }
.camp-stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(128px, 1fr)); gap: 10px; margin: 14px 0; }
.camp-stat { background: var(--white); border: 1px solid var(--gray-200); border-radius: var(--radius); padding: 9px 12px; }
.camp-stat .v { font-size: 17px; font-weight: 800; color: var(--c); line-height: 1.2; }
.camp-stat .l { font-size: 11px; color: var(--gray-500); text-transform: uppercase; letter-spacing: .04em; margin-top: 2px; }
.camp-tags { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 10px; }
.camp-tag { background: var(--c-bg); color: var(--c); border-radius: 999px; padding: 3px 10px; font-size: 11.5px; font-weight: 600; }
.camp table th { background: var(--c-soft); }
.camp-rank { width: 26px; height: 26px; border-radius: 50%; background: var(--c-bg); color: var(--c); font-weight: 800; font-size: 12px;
  display: inline-flex; align-items: center; justify-content: center; }
.camp-meter { display: inline-flex; align-items: center; gap: 6px; font-weight: 700; }
.camp-meter i { display: inline-block; width: 42px; height: 6px; border-radius: 3px; background: var(--gray-200); position: relative; overflow: hidden; }
.camp-meter i b { position: absolute; inset: 0 auto 0 0; background: var(--c); border-radius: 3px; }
.camp-export { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-top: 12px; padding: 10px 12px; background: var(--white);
  border: 1px dashed var(--c); border-radius: var(--radius); }
.camp-export label { font-size: 12px; font-weight: 700; color: var(--c); white-space: nowrap; display: inline-flex; align-items: center; gap: 5px; }
.camp-export .pasta-destino { flex: 1; min-width: 220px; font-size: 12.5px; color: var(--gray-700); }
.camp-export .pasta-destino.ok strong { color: var(--c); }
.camp-export .pasta-destino.aviso { color: var(--warning); }
.camp-export .pasta-destino.erro { color: var(--danger); }
.camp-vazio { display: flex; gap: 12px; align-items: flex-start; background: var(--white); border: 1px solid var(--c-bg); border-radius: var(--radius);
  padding: 14px 16px; margin-top: 12px; }
.camp-vazio .ic { color: var(--c); flex-shrink: 0; margin-top: 1px; }
.camp-vazio .titulo { color: var(--c); display: block; margin-bottom: 4px; font-size: 14px; }
.camp-vazio li strong { color: var(--c); }
.camp-vazio ul { margin: 6px 0 0 16px; padding: 0; font-size: 12.5px; color: var(--gray-600, #4b5563); line-height: 1.6; }
.camp-vazio .dica { font-size: 12px; color: var(--gray-500); margin-top: 6px; }
.camp-insights { list-style: none; margin: 0 0 14px; padding: 0; display: grid; gap: 6px; }
.camp-insights li { display: flex; gap: 8px; align-items: flex-start; font-size: 13px; line-height: 1.5; background: var(--gray-50); border-radius: var(--radius); padding: 8px 12px; }
.camp-insights li svg { color: #a86a00; flex-shrink: 0; margin-top: 2px; }

/* ---------- Base de Cobrança: cores por sistema, carteiras em blocos ---------- */
.camp-xprisma { --c: #5b3cc4; --c-bg: #e6defb; --c-soft: #f7f4fe; }
.camp-aquicob { --c: #c2571a; --c-bg: #fde3d2; --c-soft: #fff7f1; }
.camp-cobmais { --c: #11875a; --c-bg: #d6f3e5; --c-soft: #f1fbf6; }
.camp-arquivos { --c: #1857a0; --c-bg: #dde9f8; --c-soft: #f3f8fe; }
.sys-hero { display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: 14px; margin-bottom: 20px; }
.sys-tile { background: var(--white); border: 1px solid var(--gray-200); border-radius: var(--radius-lg); padding: 16px 18px; box-shadow: var(--shadow);
  border-top: 4px solid var(--c, var(--hc-600)); background: linear-gradient(180deg, var(--c-soft, #f3f8fe) 0, var(--white) 70%); }
.sys-total { --c: #0f2d52; --c-bg: #dde6f2; --c-soft: #f2f6fb; }
.sys-tile-top { display: flex; align-items: center; gap: 8px; }
.sys-tile-ic { width: 34px; height: 34px; border-radius: 10px; background: var(--c-bg, var(--hc-100)); color: var(--c, var(--hc-600)); display: flex; align-items: center; justify-content: center; }
.sys-tile-nome { font-weight: 800; color: var(--c, var(--hc-600)); font-size: 14px; }
.sys-tile-tag { margin-left: auto; font-size: 11px; font-weight: 700; color: var(--c); background: var(--c-bg); border-radius: 999px; padding: 2px 8px; }
.sys-tile-v { font-size: 28px; font-weight: 800; color: var(--gray-900, #111827); margin-top: 10px; letter-spacing: -0.02em; line-height: 1.1; }
.sys-tile-l { font-size: 12px; color: var(--gray-500); }
.sys-tile-divida { display: flex; justify-content: space-between; align-items: baseline; gap: 8px; margin-top: 10px; padding-top: 10px; border-top: 1px dashed var(--gray-200); font-size: 12px; color: var(--gray-500); }
.sys-tile-divida strong { color: var(--c, var(--gray-900)); font-size: 14px; white-space: nowrap; }
.sys-tile-barra { height: 6px; border-radius: 3px; background: var(--gray-100); margin-top: 8px; overflow: hidden; }
.sys-tile-barra b { display: block; height: 100%; background: var(--c); border-radius: 3px; }
.sys-card { margin-bottom: 20px; }
.sys-drops { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 16px; margin-top: 14px; }
.sys-drops .upload-block { width: auto; max-width: none; }
.camp .upload-drop { border-color: var(--c-bg); background: var(--c-soft); }
.camp .upload-drop:hover, .camp .upload-drop.dragover { border-color: var(--c); background: var(--white); }
.camp .upload-drop .icon { color: var(--c); }
.camp .upload-block-head .title { color: var(--c); }
.sys-ajuda { margin-top: 12px; font-size: 12.5px; color: var(--gray-500); }
.sys-ajuda summary { cursor: pointer; color: var(--c); font-weight: 600; }
.sys-ajuda p { margin: 8px 0 0; line-height: 1.55; }
.sys-sub { font-size: 11px; text-transform: uppercase; letter-spacing: .06em; font-weight: 800; color: var(--c); margin: 18px 0 10px; }
.cart-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(235px, 1fr)); gap: 12px; }
.cart-tile { border: 1px solid var(--gray-200); border-left: 4px solid var(--c); border-radius: var(--radius); padding: 12px 14px; background: var(--white); box-shadow: var(--shadow-sm); display: flex; flex-direction: column; gap: 8px; }
.cart-tile.vazia { border-left-color: var(--gray-200); background: var(--gray-50); }
.cart-nome { font-weight: 800; color: var(--gray-900, #111827); font-size: 14px; }
.cart-nums { display: flex; gap: 18px; }
.cart-nums b { display: block; font-size: 18px; color: var(--c); line-height: 1.1; }
.cart-tile.vazia .cart-nums b { color: var(--gray-400); }
.cart-nums span { font-size: 11px; color: var(--gray-500); text-transform: uppercase; letter-spacing: .04em; }
.cart-datas { display: flex; flex-direction: column; font-size: 11.5px; color: var(--gray-500); }
.cart-acoes { display: flex; flex-wrap: wrap; gap: 6px; margin-top: auto; }
.cart-acoes .btn { padding: 4px 9px; font-size: 11.5px; }
.arq-nome { display: flex; align-items: center; gap: 10px; }
.arq-ic { font-size: 10px; font-weight: 800; letter-spacing: .04em; color: var(--c); background: var(--c-bg); border-radius: 6px; padding: 6px 7px; flex-shrink: 0; min-width: 44px; text-align: center; }
details.sys-generico > summary { list-style: none; }
details.sys-generico > summary::-webkit-details-marker { display: none; }
details.sys-generico[open] > summary { margin-bottom: 14px; }

/* ---------- Configurações: grade de pastas por carteira × tipo de lista ---------- */
.pastas-regra { background: var(--gray-50); border-radius: var(--radius); padding: 10px 12px; margin-bottom: 12px; line-height: 1.7; color: var(--gray-600, #4b5563); }
.pastas-matriz th { white-space: nowrap; font-size: 11px; }
.pastas-matriz td.pasta-cart { min-width: 170px; }
.pastas-matriz td.pasta-cel { min-width: 96px; font-size: 12px; white-space: nowrap; padding-left: 6px; padding-right: 6px; }
.pastas-matriz .pasta-chip, .pastas-matriz .pasta-herda { max-width: 110px; }
.pastas-grupo td { background: var(--gray-50); font-weight: 800; font-size: 11.5px; text-transform: uppercase; letter-spacing: .05em; color: var(--hc-600); }
.pasta-chip { display: inline-block; max-width: 150px; overflow: hidden; text-overflow: ellipsis; vertical-align: middle; background: var(--success-bg);
  color: var(--success); font-weight: 700; border-radius: 999px; padding: 3px 10px; cursor: pointer; }
.pasta-herda { display: inline-block; max-width: 150px; overflow: hidden; text-overflow: ellipsis; vertical-align: middle; color: var(--gray-500); font-style: italic; }
.pasta-add, .pasta-x { border: 0; background: none; cursor: pointer; font-size: 11.5px; color: var(--hc-600); padding: 2px 4px; margin-left: 2px; }
.pasta-x { color: var(--danger); font-size: 15px; font-weight: 700; line-height: 1; }

/* ---------- Controle de Ações: higienização e seletor por sistema ---------- */
.camp-hig { --c: #0e7490; --c-bg: #d3f0f6; --c-soft: #f0fafc; }
.sel-carteira { min-width: 300px; font-weight: 600; }
.sel-carteira optgroup { font-weight: 800; color: var(--hc-600); font-style: normal; }
.sel-carteira option { font-weight: 500; color: var(--gray-900, #111827); }
.hig-motivos { display: grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); gap: 10px; margin-bottom: 14px; }
.hig-motivo { display: flex; align-items: center; gap: 10px; background: var(--white); border: 1px solid var(--gray-200); border-left: 4px solid var(--c);
  border-radius: var(--radius); padding: 10px 12px; font-size: 13px; }
.hig-motivo-ic { width: 32px; height: 32px; border-radius: 9px; background: var(--c-bg); color: var(--c); display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.hig-motivo-n { margin-left: auto; text-align: right; }
.hig-motivo-n b { display: block; font-size: 17px; color: var(--c); }
.hig-motivo-n span { font-size: 11px; color: var(--gray-500); white-space: nowrap; }

/* ---------- Cobrança → Acordos ---------- */
.camp-acordos { --c: #0f766e; --c-bg: #d5f2ee; --c-soft: #f0fbf9; }
.ac-hoje { --c: #b45309; --c-bg: #fdecc8; --c-soft: #fffaf0; }
.ac-prox3 { --c: #1857a0; --c-bg: #dde9f8; --c-soft: #f3f8fe; }
.ac-prox7 { --c: #3b6fb6; --c-bg: #e3edf9; --c-soft: #f5f9fe; }
.ac-atrasado { --c: #b23225; --c-bg: #fbe0dc; --c-soft: #fff6f4; }
.ac-quebra { --c: #6b2d8f; --c-bg: #efe0f7; --c-soft: #fbf6fe; }
.ac-futuro { --c: #4b5563; --c-bg: #e8eaee; --c-soft: #f7f8fa; }
.ac-atencao { --c: #0f766e; --c-bg: #d5f2ee; --c-soft: #f0fbf9; }
a.ac-tile { text-decoration: none; color: inherit; transition: transform .12s ease, box-shadow .12s ease; }
a.ac-tile:hover { transform: translateY(-2px); box-shadow: var(--shadow-lg); }
.ac-alerta { display: flex; gap: 12px; align-items: flex-start; background: #fff6f4; border: 1px solid #f3c6bf; border-left: 5px solid var(--danger);
  color: #7a2318; border-radius: var(--radius-lg); padding: 14px 16px; margin-bottom: 18px; font-size: 13.5px; line-height: 1.55; }
.ac-alerta svg { flex-shrink: 0; color: var(--danger); margin-top: 1px; }
.ac-alerta a { font-weight: 700; margin-left: 4px; }
.ac-filtros { display: flex; gap: 12px; flex-wrap: wrap; align-items: flex-end; margin: 14px 0 12px; }
.ac-check { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; font-weight: 600; padding-bottom: 9px; }
.ac-check input { width: auto; }
.ac-chips { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 14px; }
.ac-chip { display: inline-flex; align-items: center; gap: 6px; border: 1px solid var(--c-bg); background: var(--c-soft); color: var(--c); border-radius: 999px;
  padding: 6px 12px; font-size: 12.5px; font-weight: 600; text-decoration: none; }
.ac-chip b { background: var(--c); color: #fff; border-radius: 999px; padding: 1px 8px; font-size: 11.5px; }
.ac-chip.ativo { background: var(--c); color: #fff; border-color: var(--c); }
.ac-chip.ativo b { background: #fff; color: var(--c); }
.ac-venc { display: inline-block; background: var(--c-bg); color: var(--c); font-weight: 700; border-radius: 6px; padding: 3px 8px; font-size: 12.5px; }
.ac-tabela tr.ac-sem-acion td:first-child { box-shadow: inset 4px 0 0 var(--danger); }
.ac-hero { grid-template-columns: repeat(auto-fit, minmax(175px, 1fr)); }
.ac-hero .sys-tile-v { font-size: 26px; }
.sys-tile-divida span { white-space: nowrap; }

/* ---------- Espelho de Equipe: Sala 3D ---------- */
.sala-wrap { margin: -4px -2px 0; }
.sala-barra { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; background: linear-gradient(90deg, #0b1830, #12305c); color: #e6eefb;
  border-radius: 14px 14px 0 0; padding: 12px 16px; }
.sala-relogio { display: flex; flex-direction: column; line-height: 1.05; min-width: 86px; }
.sala-relogio span { font-size: 10.5px; text-transform: uppercase; letter-spacing: .08em; color: #8fb3e8; font-weight: 700; }
.sala-relogio strong { font-size: 30px; font-weight: 800; letter-spacing: -0.02em; font-variant-numeric: tabular-nums; color: #fff; }
.sala-linha { flex: 1; min-width: 240px; }
.sala-linha input[type=range] { width: 100%; accent-color: #38bdf8; padding: 0; border: 0; background: transparent; }
.sala-eixo { display: flex; justify-content: space-between; font-size: 10.5px; color: #8fb3e8; margin-top: 2px; }
.sala-barra .btn-secondary { background: rgba(255,255,255,.08); border-color: rgba(255,255,255,.2); color: #e6eefb; }
.sala-palco { position: relative; height: 640px; border-radius: 0 0 14px 14px; overflow: hidden;
  background: radial-gradient(ellipse at 50% 35%, #1d3f73 0%, #0e2342 45%, #081427 100%); }
#sala3d { position: absolute; inset: 0; }
#sala3d canvas { display: block; }
.sala-rotulos { position: absolute; inset: 0; z-index: 2; }
.sala-sem3d { color: #e6eefb; padding: 60px 30px; text-align: center; }
.sala-sem3d a { color: #7dd3fc; }
.sala-tag { pointer-events: auto; cursor: pointer; background: rgba(8, 20, 39, 0.8); backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px);
  border: 1px solid rgba(255,255,255,.14); border-left: 3px solid var(--st); border-radius: 9px; padding: 5px 9px 6px; min-width: 120px; white-space: nowrap;
  color: #eef4ff; font-size: 11px; box-shadow: 0 8px 22px rgba(0,0,0,.35); transition: transform .15s ease, box-shadow .15s ease; transform: translateY(0); }
.sala-tag:hover, .sala-tag.sel { transform: translateY(-3px) scale(1.04); box-shadow: 0 12px 28px rgba(0,0,0,.45), 0 0 0 2px var(--st); }
.sala-tag-top { display: flex; justify-content: space-between; gap: 8px; font-size: 9.5px; text-transform: uppercase; letter-spacing: .06em; color: #9db8e0; margin-bottom: 3px; }
.sala-tag-top b { color: #fff; }
.sala-tag-pessoa { display: flex; align-items: center; gap: 7px; }
.sala-tag-nome { font-weight: 700; font-size: 12px; line-height: 1.2; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 125px; }
.sala-tag-sub { display: flex; align-items: center; gap: 5px; color: #b8cbe8; font-size: 10.5px; margin-top: 1px; white-space: nowrap; }
.sala-tag-sub i, .sala-res i, .sp-pres i { width: 8px; height: 8px; border-radius: 50%; background: var(--st); display: inline-block; box-shadow: 0 0 8px var(--st); }
.sala-av { width: 24px; height: 24px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; color: #fff; font-weight: 800; font-size: 11px; flex-shrink: 0;
  box-shadow: 0 0 0 2px rgba(255,255,255,.25); }
.sala-av.lg { width: 44px; height: 44px; font-size: 15px; }
.sala-av.sm { width: 24px; height: 24px; font-size: 10px; }
.st-on { --st: #22c55e; } .st-lunch { --st: #f59e0b; } .st-off { --st: #3b82f6; } .st-livre { --st: #94a3b8; } .st-outra { --st: #a855f7; } .st-manutencao { --st: #ef4444; }
.sala-resumo { position: absolute; z-index: 6; left: 14px; top: 14px; display: flex; flex-wrap: wrap; gap: 8px; max-width: 60%; }
.sala-res { display: inline-flex; align-items: center; gap: 6px; background: rgba(8,20,39,.7); color: #dbe7fb; border: 1px solid rgba(255,255,255,.12); border-radius: 999px;
  padding: 5px 11px; font-size: 12px; backdrop-filter: blur(6px); }
.sala-res b { color: #fff; }
.sala-vistas { position: absolute; z-index: 6; left: 14px; bottom: 44px; display: flex; flex-direction: column; gap: 6px; }
.sala-vistas button { width: 36px; height: 36px; border-radius: 10px; border: 1px solid rgba(255,255,255,.16); background: rgba(8,20,39,.72); color: #dbe7fb; cursor: pointer;
  display: flex; align-items: center; justify-content: center; backdrop-filter: blur(6px); }
.sala-vistas button:hover, .sala-vistas button.ativo { background: #1d4ed8; border-color: #60a5fa; color: #fff; }
.sala-dica { position: absolute; z-index: 3; left: 50%; bottom: 12px; transform: translateX(-50%); color: rgba(219,231,251,.65); font-size: 11.5px; pointer-events: none; white-space: nowrap; }
.sala-painel { position: absolute; z-index: 10; top: 12px; right: 12px; bottom: 12px; width: 330px; background: rgba(255,255,255,.97); border-radius: 14px; box-shadow: 0 20px 50px rgba(0,0,0,.4);
  padding: 16px; overflow-y: auto; transform: translateX(360px); opacity: 0; transition: transform .35s cubic-bezier(.2,.8,.2,1), opacity .25s ease; font-size: 13px; }
.sala-painel.aberto { transform: translateX(0); opacity: 1; }
.sala-fechar { position: absolute; top: 8px; right: 10px; border: 0; background: none; font-size: 22px; cursor: pointer; color: var(--gray-500); }
.sp-titulo { display: flex; align-items: center; gap: 10px; padding: 4px 0 12px; border-bottom: 1px solid var(--gray-200); margin-bottom: 12px; }
.sp-titulo strong { font-size: 16px; }
.sp-titulo div div { font-size: 12px; color: var(--gray-500); }
.sp-pa { background: var(--st); color: #fff; font-weight: 800; border-radius: 10px; padding: 8px 10px; font-size: 13px; white-space: nowrap; box-shadow: 0 6px 16px -6px var(--st); }
.sp-vazio { color: var(--gray-500); }
.sp-turno { border: 1px solid var(--gray-200); border-radius: 12px; padding: 12px; margin-bottom: 10px; }
.sp-turno-top { display: flex; justify-content: space-between; align-items: center; margin-bottom: 8px; }
.sp-st { font-size: 11.5px; color: var(--gray-500); }
.sp-op { display: flex; gap: 10px; align-items: center; margin-bottom: 10px; }
.sp-pres { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; font-weight: 600; margin-top: 3px; }
.sp-horas { display: grid; grid-template-columns: repeat(3, 1fr); gap: 6px; margin-bottom: 8px; }
.sp-horas div { background: var(--gray-50); border-radius: 8px; padding: 6px 8px; }
.sp-horas span { display: block; font-size: 10px; text-transform: uppercase; letter-spacing: .05em; color: var(--gray-500); }
.sp-horas b { font-size: 13px; }
.bh { position: relative; height: 10px; background: var(--gray-100); border-radius: 5px; overflow: hidden; }
.bh i { position: absolute; top: 0; bottom: 0; }
.bh-trab { background: linear-gradient(90deg, #22c55e, #16a34a); border-radius: 5px; }
.bh-almoco { background: repeating-linear-gradient(45deg, #f59e0b, #f59e0b 3px, #fbbf24 3px, #fbbf24 6px); }
.bh-agora { width: 2px; background: #0f172a; box-shadow: 0 0 0 2px rgba(255,255,255,.8); }
.bh-eixo { display: flex; justify-content: space-between; font-size: 9.5px; color: var(--gray-400); margin-top: 2px; }
.sp-prod { margin-top: 8px; font-size: 12.5px; }
.sp-obs { margin-top: 8px; font-size: 12px; background: var(--warning-bg); color: var(--warning); border-radius: 8px; padding: 6px 8px; }
.sp-hist-t { font-size: 11px; text-transform: uppercase; letter-spacing: .06em; font-weight: 800; color: var(--gray-500); margin: 14px 0 8px; }
.sp-hist { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.sp-hist li { display: flex; gap: 8px; align-items: flex-start; font-size: 12.5px; }
.sp-atual { color: var(--success); font-weight: 700; }
.sp-editar { margin-top: 12px; }
#salaWrap:fullscreen .sala-palco { height: calc(calc(100 * var(--vh)) - 66px); border-radius: 0; }
#salaWrap:fullscreen .sala-barra { border-radius: 0; }
@media (max-width: 760px) { .sala-palco { height: 520px; } .sala-painel { width: auto; left: 12px; } .sala-resumo { max-width: 90%; } }

/* Impressão (Relatório do Dia e demais telas) */
@media print {
  .sidebar, .sidebar-backdrop, .topbar .btn, .no-print, .flash { display: none !important; }
  .main { margin-left: 0 !important; }
  body { background: #fff !important; }
  .card, .kpi-card { box-shadow: none !important; break-inside: avoid; }
  a { color: inherit !important; text-decoration: none !important; }
}
/* ---------- Parciais de Recebimento ---------- */
.rc-barra { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; margin-bottom: 16px; }
.rc-filtros { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }
.rc-filtros select, .rc-filtros .search { width: auto; min-width: 170px; }
.rc-kpis { display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: 14px; margin-bottom: 18px; }
.rc-kpi { display: flex; gap: 14px; align-items: center; padding: 16px 18px; border-radius: var(--radius-lg); color: #fff; box-shadow: var(--shadow); min-width: 0; }
.rc-kpi.verde { background: linear-gradient(135deg, #16a34a, #0f7a3a); }
.rc-kpi.azul { background: linear-gradient(135deg, #2563eb, #1e3a8a); }
.rc-kpi.roxo { background: linear-gradient(135deg, #8b5cf6, #5b21b6); }
.rc-kpi.laranja { background: linear-gradient(135deg, #f59e0b, #c2410c); }
.rc-kpi-ico { font-size: 22px; width: 44px; height: 44px; border-radius: 12px; background: rgba(255,255,255,.18); display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.rc-kpi-lbl { font-size: 11px; text-transform: uppercase; letter-spacing: .06em; font-weight: 700; opacity: .85; }
.rc-kpi-val { font-size: 22px; font-weight: 800; letter-spacing: -.02em; line-height: 1.2; white-space: nowrap; }
.rc-kpi-sub { font-size: 12px; opacity: .9; margin-top: 2px; }
.rc-kpi-sub a { color: #fff; text-decoration: underline; }
.rc-pend { background: var(--warning-bg); border: 1px solid #efd3a1; border-radius: var(--radius); padding: 10px 14px; margin-bottom: 18px; color: var(--gray-800); }
.rc-pend summary { cursor: pointer; }
.rc-pend p { margin: 10px 0 6px; }
.rc-agentes { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 8px; }
.rc-agente { display: flex; gap: 10px; align-items: center; justify-content: space-between; background: #fff; border-radius: 8px; padding: 8px 10px; }
.rc-agente select { width: auto; max-width: 170px; }
.rc-pendente { border-color: var(--warning) !important; }
.rc-secao { display: flex; align-items: baseline; gap: 12px; margin: 4px 0 10px; }
.rc-secao h2 { margin: 0; font-size: 16px; color: var(--hc-900); }
.rc-vazio { text-align: center; padding: 34px 20px; }
.rc-carteiras { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 14px; margin-bottom: 20px; }
.rc-cart { display: block; background: #fff; border: 1px solid var(--gray-200); border-top: 5px solid var(--cor); border-radius: var(--radius-lg); padding: 14px 16px; color: var(--gray-800); box-shadow: var(--shadow-sm); transition: transform .12s, box-shadow .12s, opacity .12s; }
.rc-cart:hover { text-decoration: none; transform: translateY(-2px); box-shadow: var(--shadow); }
.rc-cart.ativo { box-shadow: 0 0 0 2px var(--cor), var(--shadow); }
.rc-cart.apagado { opacity: .5; }
.rc-cart-top { display: flex; justify-content: space-between; gap: 8px; align-items: flex-start; }
.rc-cart-nome { font-weight: 800; color: var(--cor); font-size: 13.5px; text-transform: uppercase; letter-spacing: .02em; }
.rc-cart-orig i { font-style: normal; font-size: 10px; font-weight: 700; background: var(--gray-100); color: var(--gray-500); border-radius: 999px; padding: 1px 7px; margin-left: 3px; white-space: nowrap; }
.rc-cart-val { font-size: 22px; font-weight: 800; color: var(--gray-900); margin: 6px 0 2px; letter-spacing: -.02em; }
.rc-cart-linha, .rc-cart-rod { display: flex; justify-content: space-between; gap: 8px; font-size: 12px; color: var(--gray-500); }
.rc-cart-linha b { color: var(--cor); }
.rc-meta { height: 7px; background: var(--gray-100); border-radius: 99px; overflow: hidden; margin: 9px 0 4px; }
.rc-meta span { display: block; height: 100%; background: var(--cor); border-radius: 99px; }
.rc-cart-rod { margin-top: 6px; font-size: 11.5px; }
.rc-dias { display: flex; align-items: flex-end; gap: 3px; height: 150px; padding-top: 6px; }
.rc-dia { flex: 1; height: 100%; display: flex; flex-direction: column; justify-content: flex-end; align-items: center; min-width: 0; }
.rc-dia span { width: 100%; border-radius: 4px 4px 0 0; background: linear-gradient(180deg, #34d399, #059669); }
.rc-dia.fds span { background: var(--gray-300); }
.rc-dia:hover span { background: linear-gradient(180deg, #60a5fa, #1d4ed8); }
.rc-dia small { font-size: 9.5px; color: var(--gray-400); margin-top: 3px; }
.rc-ops { display: flex; flex-direction: column; gap: 10px; max-height: 260px; overflow-y: auto; }
.rc-op { display: grid; grid-template-columns: minmax(120px, 1.2fr) 2fr auto; gap: 12px; align-items: center; }
.rc-op-nome { display: flex; flex-direction: column; line-height: 1.3; min-width: 0; }
.rc-op-nome a, .rc-op-nome > span:first-child { font-weight: 700; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.rc-op-barra { height: 10px; background: var(--gray-100); border-radius: 99px; overflow: hidden; }
.rc-op-barra span { display: block; height: 100%; border-radius: 99px; background: linear-gradient(90deg, #60a5fa, #2563eb); }
.rc-op-val { font-size: 13px; color: #1d4ed8; white-space: nowrap; }
.rc-pill { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; font-weight: 700; color: var(--gray-800); background: color-mix(in srgb, var(--cor) 12%, #fff); border: 1px solid color-mix(in srgb, var(--cor) 35%, #fff); padding: 2px 10px 2px 8px; border-radius: 999px; white-space: nowrap; vertical-align: middle; }
.rc-pill::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: var(--cor); }
/* Card "Pagamentos" retrátil */
.rc-recolher { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; background: none; border: none; padding: 0; margin: 0; font: inherit; color: inherit; cursor: pointer; text-align: left; }
.rc-recolher h2 { margin: 0; display: inline-flex; align-items: center; gap: 8px; }
.rc-recolher:hover h2 { color: var(--hc-600); }
.rc-recolher-seta { display: inline-flex; align-items: center; justify-content: center; width: 26px; height: 26px; border-radius: 50%; background: var(--gray-100); color: var(--gray-600); font-size: 14px; transition: transform .2s; }
.rc-recolhivel.recolhido .rc-recolher-seta { transform: rotate(-90deg); }
.rc-recolhivel.recolhido .rc-recolhivel-corpo { display: none; }
.rc-recolhivel.recolhido .card-header { margin-bottom: 0; padding-bottom: 0; border-bottom: none; }
.rc-orig { font-size: 10.5px; color: var(--gray-400); }
.rc-com { color: #1d4ed8; font-weight: 700; }
.rc-tabela tbody td { padding-top: 8px; padding-bottom: 8px; }
.rc-acao { display: inline-flex; align-items: center; justify-content: center; width: 28px; height: 28px; border-radius: 8px; border: 1px solid var(--gray-200); background: #fff; color: var(--gray-600); cursor: pointer; font-size: 13px; }
.rc-acao:hover { background: var(--hc-50); text-decoration: none; }
.rc-acao.perigo:hover { background: var(--danger-bg); color: var(--danger); border-color: #f0c4be; }
.rc-hist { display: flex; gap: 12px; align-items: center; padding: 10px 0; border-bottom: 1px solid var(--gray-100); }
.rc-hist-ico { font-size: 20px; }
.rc-hist-nome { font-weight: 700; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
@media (max-width: 760px) { .rc-filtros select, .rc-filtros .search { min-width: 0; flex: 1 1 140px; } .rc-op { grid-template-columns: 1fr auto; } .rc-op-barra { grid-column: 1 / -1; grid-row: 2; } }
/* ---------- Operadores ---------- */
.op-barra { display: flex; gap: 12px; align-items: center; justify-content: space-between; flex-wrap: wrap; margin-bottom: 16px; }
.op-barra .search { max-width: 300px; }
.op-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(290px, 1fr)); gap: 14px; }
.op-card { background: #fff; border: 1px solid var(--gray-200); border-radius: var(--radius-lg); box-shadow: var(--shadow-sm); display: flex; flex-direction: column; transition: box-shadow .12s, transform .12s; }
.op-card:hover { box-shadow: var(--shadow); transform: translateY(-2px); border-color: var(--hc-400); }
.op-card-link { display: block; padding: 16px 16px 10px; color: inherit; flex: 1; }
.op-card-link:hover { text-decoration: none; }
.op-card-top { display: flex; gap: 12px; align-items: center; }
.op-avatar { width: 44px; height: 44px; border-radius: 50%; background: var(--cor); color: #fff; display: inline-flex; align-items: center; justify-content: center; font-weight: 800; font-size: 15px; flex-shrink: 0; letter-spacing: .02em; }
.op-avatar.lg { width: 64px; height: 64px; font-size: 22px; }
.op-nome { font-weight: 800; color: var(--hc-900); font-size: 14.5px; line-height: 1.3; }
.op-card:hover .op-nome { color: var(--hc-600); }
.op-sub { display: flex; gap: 8px; align-items: center; margin-top: 3px; flex-wrap: wrap; }
.op-carts { display: flex; flex-wrap: wrap; gap: 5px; margin: 12px 0 10px; min-height: 22px; }
.op-chip { font-size: 11px; font-weight: 700; background: var(--hc-100); color: var(--hc-700); padding: 2px 9px; border-radius: 999px; }
.op-dados { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px 10px; margin: 0; }
.op-dados dt { font-size: 10px; text-transform: uppercase; letter-spacing: .05em; color: var(--gray-400); font-weight: 700; }
.op-dados dd { margin: 1px 0 0; font-size: 12.5px; color: var(--gray-800); font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.op-card-rod { display: flex; gap: 6px; align-items: center; padding: 10px 16px; border-top: 1px solid var(--gray-100); background: var(--gray-50); border-radius: 0 0 var(--radius-lg) var(--radius-lg); }
.op-perfil { display: flex; gap: 18px; align-items: center; flex-wrap: wrap; }
.op-perfil-info { flex: 1; min-width: 240px; }
.op-perfil-nome { font-size: 20px; font-weight: 800; color: var(--hc-900); display: flex; gap: 10px; align-items: center; flex-wrap: wrap; }
.op-perfil-linha { display: flex; gap: 18px; flex-wrap: wrap; margin-top: 6px; font-size: 13px; color: var(--gray-600); }
.op-perfil-acoes { display: flex; gap: 8px; flex-wrap: wrap; }
.op-pa-ro { padding: 8px 0; font-size: 13px; }
.op-salvar { position: sticky; bottom: 0; z-index: 5; display: flex; gap: 10px; align-items: center; background: rgba(255,255,255,.96); border: 1px solid var(--gray-200); border-radius: var(--radius-lg); padding: 12px 16px; box-shadow: 0 -4px 16px rgba(10,36,68,.08); margin-top: 4px; }
@media (max-width: 560px) { .op-dados { grid-template-columns: repeat(2, 1fr); } }
/* Recebido por dia (Parciais) */
.rc-filtro-dia { background: var(--hc-100); border: 1px solid #c9dcf2; color: var(--hc-900); border-radius: var(--radius); padding: 9px 14px; margin-bottom: 16px; font-size: 13px; }
.rc-legenda { display: flex; gap: 14px; font-size: 12px; color: var(--gray-600); }
.rc-legenda i { display: inline-block; width: 10px; height: 10px; border-radius: 3px; margin-right: 5px; vertical-align: -1px; }
.rc-dia-resumo { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 10px; margin-bottom: 18px; }
.rc-dia-resumo > div { background: var(--gray-50); border: 1px solid var(--gray-100); border-radius: var(--radius); padding: 9px 12px; display: flex; flex-direction: column; }
.rc-dia-resumo span { font-size: 10.5px; text-transform: uppercase; letter-spacing: .05em; font-weight: 700; color: var(--gray-500); }
.rc-dia-resumo strong { font-size: 16px; color: var(--gray-900); margin-top: 2px; }
.rc-dia-resumo small { font-size: 11.5px; color: var(--gray-500); }
.rc-graf { display: flex; gap: 8px; height: 230px; padding-bottom: 30px; }
.rc-graf-eixo { position: relative; width: 62px; flex-shrink: 0; }
.rc-graf-eixo span { position: absolute; right: 0; transform: translateY(50%); font-size: 10.5px; color: var(--gray-500); white-space: nowrap; }
.rc-graf-area { position: relative; flex: 1; display: flex; align-items: flex-end; gap: 3px; border-bottom: 1px solid var(--gray-300); }
.rc-graf-grade { position: absolute; left: 0; right: 0; height: 0; border-top: 1px dashed var(--gray-200); pointer-events: none; }
.rc-graf-col { position: relative; flex: 1; height: 100%; display: flex; flex-direction: column; justify-content: flex-end; align-items: stretch; min-width: 0; border-radius: 6px 6px 0 0; color: inherit; }
.rc-graf-col:hover { background: var(--hc-50); text-decoration: none; }
.rc-graf-col.fds { background: repeating-linear-gradient(135deg, transparent 0 6px, var(--gray-50) 6px 12px); }
.rc-graf-col.sel { background: var(--hc-100); box-shadow: inset 0 0 0 1px var(--hc-400); }
/* Barra = valor recebido (verde); por dentro, a partir da base, a comissão HC (azul) */
.rc-graf-barra { position: relative; display: block; margin: 0 auto; width: min(100%, 22px); background: linear-gradient(180deg, #34d399, #16a34a); border-radius: 5px 5px 0 0; overflow: hidden; }
.rc-graf-barra b { position: absolute; left: 0; right: 0; bottom: 0; min-height: 2px; background: linear-gradient(180deg, #5b8dff, #2e6bff); }
.rc-legenda i.rec { background: #22c55e; }
.rc-legenda i.com { background: #2e6bff; }
.rc-graf-col.futuro small { opacity: .45; }
.rc-graf-col small { position: absolute; bottom: -30px; left: 0; right: 0; text-align: center; font-size: 10.5px; color: var(--gray-600); line-height: 1.15; font-weight: 600; }
.rc-graf-col small em { display: block; font-style: normal; font-weight: 400; color: var(--gray-400); font-size: 9.5px; }
.rc-graf-col.hoje small { color: var(--hc-700); font-weight: 800; }
.rc-graf-col.fds small { color: var(--gray-400); }
.card:has(> .rc-dica) { position: relative; }
.rc-dica { position: absolute; transform: translate(-50%, -100%); background: var(--gray-900); color: #fff; border-radius: 8px; padding: 8px 11px; font-size: 12px; pointer-events: none; z-index: 10; box-shadow: var(--shadow-lg); white-space: nowrap; }
.rc-dica .t { color: #cbd5e1; font-size: 11px; }
.rc-dica .v { font-weight: 800; font-size: 14px; }
.rc-dica .s { color: #cbd5e1; font-size: 11px; }
@media (max-width: 760px) { .rc-graf-eixo { width: 46px; } .rc-graf-col small em { display: none; } .rc-graf-area { gap: 1px; } }

/* Planejamento — abas da visão mensal */
.plan-abas { display: flex; gap: 6px; flex-wrap: wrap; margin-bottom: 14px; }
.plan-abas a { padding: 9px 16px; border-radius: 10px; background: #fff; border: 1px solid var(--gray-200); color: var(--gray-700); font-weight: 700; font-size: 13px; display: inline-flex; gap: 6px; align-items: center; }
.plan-abas a:hover { text-decoration: none; border-color: var(--hc-400); color: var(--hc-700); }
.plan-abas a.active { background: var(--hc-700); border-color: var(--hc-700); color: #fff; box-shadow: var(--shadow); }
.plan-aba-alerta { background: var(--danger); color: #fff; border-radius: 999px; font-size: 10.5px; min-width: 18px; height: 18px; padding: 0 5px; display: inline-flex; align-items: center; justify-content: center; }
.plan-guia { margin: 0 0 16px; padding: 10px 14px; background: var(--hc-50); border-left: 3px solid var(--hc-500); border-radius: 0 var(--radius) var(--radius) 0; font-size: 13px; color: var(--gray-700); }
.plan-metas-guia { display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: 10px; margin-bottom: 12px; }
.plan-metas-guia > div { background: #fff; border: 1px solid var(--gray-200); border-radius: var(--radius); padding: 10px 14px; display: grid; grid-template-columns: auto 1fr; column-gap: 10px; align-items: center; }
.plan-metas-guia span { font-size: 22px; grid-row: span 2; }
.plan-metas-guia strong { color: var(--hc-900); }
.plan-metas-guia small { color: var(--gray-500); font-size: 12px; line-height: 1.35; }
/* ---------- Relatórios (diretoria) ----------
   Segue o modelo de apresentação da HC: "slides" em azul-marinho com textura
   diagonal alternados com slides claros, títulos em Montserrat terminando com
   ponto azul, olho numerado (01, 02...) e anéis azuis como elemento gráfico. */
.rel {
  --rl-navy: #0a1f3d; --rl-navy-2: #172f52; --rl-azul: #2e6bff; --rl-azul-2: #5b8dff; --rl-azul-3: #79a5f2;
  --rl-gelo: #eaeef3; --rl-claro: #f4f6f9; --rl-cinza: #5b6472; --rl-cinza-2: #b8c4d9; --rl-borda: #e1e7f0;
  --rl-titulo: "Montserrat", "Inter", "Segoe UI", sans-serif;
  max-width: 1280px; margin: 0 auto;
}
.rel-slide { position: relative; overflow: hidden; border-radius: 18px; padding: 40px 46px 38px; margin-bottom: 22px; }
.rel-escuro { background: var(--rl-navy) url('../img/rel_fundo.jpg') center / cover; color: var(--rl-gelo); box-shadow: 0 10px 30px rgba(10, 31, 61, .18); }
.rel-claro { background: var(--rl-claro); border: 1px solid var(--rl-borda); color: var(--gray-900); }
.rel-cab { position: relative; z-index: 1; margin-bottom: 26px; padding-right: 80px; }
.rel-olho { display: flex; align-items: center; gap: 12px; font-size: 12.5px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--rl-azul-2); }
.rel-olho span { display: inline-flex; align-items: center; gap: 12px; font-family: var(--rl-titulo); font-weight: 800; letter-spacing: 0; color: var(--rl-azul); }
.rel-olho span::after { content: ""; width: 34px; height: 2px; background: var(--rl-azul); }
.rel-h { font-family: var(--rl-titulo); font-weight: 800; font-size: 34px; line-height: 1.12; letter-spacing: -.01em; margin: 10px 0 0; color: var(--rl-navy); }
.rel-escuro .rel-h { color: var(--rl-gelo); }
.rel-h b, .rel-h span { color: var(--rl-azul); }
.rel-marca { position: absolute; top: 34px; right: 40px; width: 50px; height: 50px; background: var(--rl-navy); -webkit-mask: url('../img/logo_mark.png') center / contain no-repeat; mask: url('../img/logo_mark.png') center / contain no-repeat; opacity: .9; }
.rel-escuro .rel-marca { background: var(--rl-gelo); }
.rel-anel { position: absolute; border-radius: 50%; border: 3px solid var(--rl-azul); pointer-events: none; }
.rel-anel.um { width: 380px; height: 380px; right: -110px; top: -130px; }
.rel-anel.dois { width: 180px; height: 180px; right: 210px; bottom: -80px; border-width: 2px; border-color: rgba(91, 141, 255, .55); }

/* Capa */
.rel-capa { min-height: 560px; display: flex; flex-direction: column; justify-content: space-between; gap: 36px; padding: 44px 56px; }
.rel-capa-foto { position: absolute; top: 0; bottom: 0; left: 46%; right: 0; background-size: cover; background-position: center; }
.rel-capa-foto::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, var(--rl-navy) 0%, rgba(10, 31, 61, .55) 38%, rgba(10, 31, 61, .15) 100%); }
.rel-capa .rel-anel.um { width: 560px; height: 560px; right: -170px; top: auto; bottom: -240px; }
.rel-capa .rel-anel.dois { width: 120px; height: 120px; right: auto; left: 43%; top: 56px; bottom: auto; }
.rel-capa-conteudo { position: relative; z-index: 1; max-width: 640px; }
.rel-capa-logo { position: relative; z-index: 1; display: block; width: 230px; max-width: 60%; }
.rel-capa .rel-h { font-size: 64px; line-height: 1.02; margin: 14px 0 20px; }
.rel-capa-chips { position: relative; z-index: 1; display: flex; flex-wrap: wrap; align-items: center; gap: 12px; font-size: 13px; font-weight: 700; }
.rel-chip { text-transform: uppercase; letter-spacing: .08em; color: #c9d6ee; }
.rel-chip.data { text-transform: none; letter-spacing: 0; font-style: italic; color: var(--rl-azul-3); }
.rel-chip + .rel-chip::before { content: "|"; font-style: normal; color: var(--rl-azul); margin-right: 12px; }
.rel-capa-sub { margin: 18px 0 0; font-size: 13.5px; color: var(--rl-cinza-2); line-height: 1.6; }
.rel-mes { position: absolute; top: 26px; right: 30px; z-index: 2; display: flex; gap: 6px; align-items: center; }
.rel-mes .btn { background: rgba(255, 255, 255, .12); color: #fff; border: 1px solid rgba(255, 255, 255, .28); }
.rel-mes input { width: auto; background: rgba(255, 255, 255, .95); }

/* KPIs (slide escuro) */
.rel-kpis { position: relative; z-index: 1; display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 14px; }
/* Telas largas: grade de 12 colunas — destaque + 2 na 1ª linha, 3 na 2ª */
@media (min-width: 1100px) {
  .rel-kpis { grid-template-columns: repeat(12, 1fr); }
  .rel-kpis .rel-kpi { grid-column: span 4; }
  .rel-kpis .rel-kpi.destaque { grid-column: span 6; }
  .rel-kpis .rel-kpi:nth-child(2), .rel-kpis .rel-kpi:nth-child(3) { grid-column: span 3; }
  .rel-kpis-4 .rel-kpi, .rel-kpis-4 .rel-kpi.destaque, .rel-kpis-4 .rel-kpi:nth-child(n) { grid-column: span 3; }
}
.rel-kpi { background: rgba(78, 128, 187, .14); border: 1px solid rgba(121, 165, 242, .22); border-radius: 14px; padding: 18px 20px; }
.rel-kpi.destaque { grid-column: span 2; background: linear-gradient(135deg, var(--rl-azul), #1f4fd1); border-color: transparent; box-shadow: 0 10px 26px rgba(46, 107, 255, .35); }
.rel-kpi-lbl { font-size: 11px; text-transform: uppercase; letter-spacing: .08em; font-weight: 700; color: var(--rl-azul-3); }
.rel-kpi.destaque .rel-kpi-lbl { color: #dbe6ff; }
.rel-kpi-val { font-family: var(--rl-titulo); font-size: 27px; font-weight: 800; color: #fff; letter-spacing: -.01em; margin: 6px 0 8px; white-space: nowrap; }
.rel-kpi.destaque .rel-kpi-val { font-size: 40px; }
.rel-kpi-sub { font-size: 12px; color: var(--rl-cinza-2); margin-top: 8px; }
.rel-comp { font-size: 11px; color: var(--rl-cinza-2); }
.rel-kpi.destaque .rel-comp { color: #dbe6ff; }
.rel-kpi-meta { margin-top: 14px; font-size: 12.5px; color: #fff; font-weight: 600; }
.rel-kpi.destaque .rel-barra { background: rgba(255, 255, 255, .25); }
.rel-kpi.destaque .rel-barra span { background: #fff; }
.rel-kpi.destaque .rel-barra i { background: var(--rl-navy); }

.rel-delta { display: inline-block; font-size: 12px; font-weight: 800; padding: 2px 9px; border-radius: 999px; }
.rel-delta.sobe { background: var(--success-bg); color: var(--success); }
.rel-delta.desce { background: var(--danger-bg); color: var(--danger); }
.rel-delta.neutro { background: var(--gray-100); color: var(--gray-500); font-weight: 600; }
.rel-escuro .rel-delta.sobe { background: rgba(52, 211, 153, .16); color: #6ee7b7; }
.rel-escuro .rel-delta.desce { background: rgba(248, 113, 113, .16); color: #fca5a5; }
.rel-escuro .rel-delta.neutro { background: rgba(255, 255, 255, .08); color: var(--rl-cinza-2); }
.rel-escuro .rel-kpi.destaque .rel-delta { background: rgba(255, 255, 255, .2); color: #fff; }

/* Barras e gráficos */
.rel-barra { position: relative; height: 10px; background: var(--rl-gelo); border-radius: 99px; margin-bottom: 6px; }
.rel-barra.fina { height: 7px; margin: 0; flex: 1; }
.rel-barra span { display: block; height: 100%; border-radius: 99px; background: var(--rl-azul); }
.rel-barra span.ok { background: var(--success); }
.rel-barra span.atencao { background: #d79a2e; }
.rel-barra span.ruim { background: var(--danger); }
.rel-barra i { position: absolute; top: -3px; bottom: -3px; width: 2px; background: var(--rl-navy); }
.rel-grid-2 { position: relative; z-index: 1; display: grid; grid-template-columns: 1fr 1.3fr; gap: 16px; }
.rel-grid-3 { position: relative; z-index: 1; display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.rel-card { position: relative; z-index: 1; background: #fff; border: 1px solid var(--rl-borda); border-radius: 14px; padding: 20px 22px; box-shadow: 0 1px 2px rgba(10, 31, 61, .05); min-width: 0; }
.rel-card.sem-pad { padding: 0; overflow: hidden; }
.rel-card h3 { font-family: var(--rl-titulo); margin: 0 0 14px; font-size: 15px; font-weight: 700; color: var(--rl-navy); }
.rel-status { display: inline-flex; gap: 6px; align-items: center; font-weight: 800; padding: 5px 12px; border-radius: 999px; margin-bottom: 18px; font-size: 13px; }
.rel-status.ok, .rel-tag.ok { background: var(--success-bg); color: var(--success); }
.rel-status.atencao, .rel-tag.atencao { background: var(--warning-bg); color: var(--warning); }
.rel-status.ruim, .rel-tag.ruim { background: var(--danger-bg); color: var(--danger); }
.rel-status.neutro, .rel-tag.neutro { background: var(--gray-100); color: var(--gray-500); }
.rel-bullet { padding: 22px 0 10px; }
.rel-bullet-trilho { position: relative; height: 26px; background: var(--rl-gelo); border-radius: 6px; }
.rel-bullet-trilho span { position: absolute; left: 0; top: 0; bottom: 0; border-radius: 6px; }
.rel-bullet-trilho span.real { background: var(--rl-azul); }
.rel-bullet-trilho span.proj { background: #bdd0ff; }
.rel-bullet-trilho i.meta { position: absolute; top: -8px; bottom: -8px; width: 3px; background: var(--rl-navy); border-radius: 2px; }
.rel-bullet-trilho i.meta em { position: absolute; bottom: 100%; left: 50%; transform: translateX(-50%); font-style: normal; font-size: 11px; font-weight: 700; white-space: nowrap; color: var(--rl-navy); margin-bottom: 2px; }
.rel-lista { margin: 12px 0 0; }
.rel-lista > div { display: flex; justify-content: space-between; gap: 10px; padding: 8px 0; border-bottom: 1px solid var(--rl-gelo); font-size: 13px; }
.rel-lista dt { color: var(--rl-cinza); }
.rel-lista dd { margin: 0; font-weight: 700; color: var(--rl-navy); }
.sw { display: inline-block; width: 11px; height: 11px; border-radius: 3px; margin-right: 6px; vertical-align: -1px; }
.sw.real { background: var(--rl-azul); }
.sw.proj { background: #bdd0ff; }
.sw.meta { background: var(--rl-navy); height: 3px; vertical-align: 3px; }
.rel-legenda { display: flex; gap: 16px; font-size: 12px; color: var(--rl-cinza); margin-bottom: 8px; }
.rel-colunas { display: flex; gap: 12px; height: 240px; align-items: stretch; padding-top: 10px; }
.rel-col { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.rel-col-area { position: relative; flex: 1; display: flex; flex-direction: column; justify-content: flex-end; align-items: center; border-bottom: 1px solid var(--rl-cinza-2); }
.rel-col-barra { width: min(46px, 70%); background: #c5d5f7; border-radius: 6px 6px 0 0; min-height: 2px; }
.rel-col.atual .rel-col-barra { background: var(--rl-azul); }
.rel-col-val { font-size: 11px; font-weight: 700; color: var(--rl-cinza); margin-bottom: 4px; white-space: nowrap; }
.rel-col.atual .rel-col-val { color: var(--rl-azul); }
.rel-col-meta { position: absolute; left: 8%; right: 8%; height: 3px; background: var(--rl-navy); border-radius: 2px; box-shadow: 0 0 0 2px #fff; }
.rel-col-rot { text-align: center; font-size: 12px; font-weight: 700; color: var(--rl-navy); padding-top: 6px; }
.rel-col-rot small { display: block; font-weight: 500; color: var(--rl-cinza); font-size: 10.5px; }
.rel-col.atual .rel-col-rot { color: var(--rl-azul); }
.rel-nota, .rel-intro { position: relative; z-index: 1; font-size: 12px; color: var(--rl-cinza); margin: 12px 2px 0; }
.rel-intro { font-size: 13.5px; margin: -10px 0 14px; }
.rel-intro strong { color: var(--rl-navy); }

/* Tabelas */
.rel-tabela thead th { background: var(--rl-navy); color: var(--rl-gelo); border-bottom: none; padding: 12px 10px; font-size: 10.5px; }
.rel-tabela thead th small { color: var(--rl-azul-3); }
.rel-tabela td { padding-top: 11px; padding-bottom: 11px; }
.rel-tabela tbody tr:nth-child(even) td { background: #f9fbfd; }
.rel-tabela tfoot td { background: var(--rl-gelo); color: var(--rl-navy); padding: 11px 10px; }
.rel-meta-cel { display: flex; align-items: center; gap: 8px; }
.rel-tag { font-size: 11px; font-weight: 800; padding: 1px 8px; border-radius: 999px; white-space: nowrap; }
.rel-pos { font-family: var(--rl-titulo); font-weight: 800; color: var(--rl-cinza-2); font-size: 14px; width: 44px; text-align: center; }
.rel-pos .podio { display: inline-flex; align-items: center; justify-content: center; width: 28px; height: 28px; border-radius: 50%; color: #fff; }
.rel-pos .podio.p1 { background: linear-gradient(135deg, #e3bd5b, #b8902c); }
.rel-pos .podio.p2 { background: linear-gradient(135deg, #b9c3d0, #8793a3); }
.rel-pos .podio.p3 { background: linear-gradient(135deg, #cf8f5c, #a2653a); }
.rel-status .icon-svg, .rel-tag .icon-svg { vertical-align: -2px; }
/* Evolução de acionamentos e acordos */
.rel-grid-2.igual { grid-template-columns: 1fr 1fr; }
.rel-colunas.baixa { height: 220px; }
.rel-evol-resumo { display: flex; align-items: baseline; flex-wrap: wrap; gap: 6px 10px; margin-bottom: 6px; }
.rel-evol-resumo b { font-family: var(--rl-titulo); font-size: 30px; font-weight: 800; color: var(--rl-navy); line-height: 1.1; }
.rel-evol-resumo span { font-size: 13px; color: var(--rl-cinza); }
.rel-col.atual .rel-col-barra.parcial { background: repeating-linear-gradient(135deg, var(--rl-azul) 0 6px, var(--rl-azul-2) 6px 12px); opacity: .75; }
.rel-evol th.atual { background: var(--rl-azul); }
.rel-evol td.atual { background: rgba(46, 107, 255, .06) !important; }
.rel-evol th small { color: var(--rl-azul-3); font-weight: 600; text-transform: none; letter-spacing: 0; }
.rel-h3-ic { display: inline-flex; align-items: center; justify-content: center; width: 30px; height: 30px; border-radius: 50%; border: 2px solid var(--rl-azul); color: var(--rl-azul); margin-right: 10px; vertical-align: middle; }

/* Ações de cobrança por canal (slide escuro) */
.rel-canais { position: relative; z-index: 1; margin-top: 18px; background: rgba(78, 128, 187, .1); border: 1px solid rgba(121, 165, 242, .2); border-radius: 14px; padding: 4px 22px; }
.rel-canal { display: grid; grid-template-columns: 1.6fr .6fr 2fr .9fr 1.1fr; gap: 18px; align-items: center; padding: 11px 0; border-bottom: 1px solid rgba(255, 255, 255, .07); font-size: 14px; color: #d5ddea; }
.rel-canal:last-child { border-bottom: none; }
.rel-canal.cab { font-size: 11px; text-transform: uppercase; letter-spacing: .08em; font-weight: 700; color: var(--rl-azul-3); padding: 12px 0 8px; }
.rel-canal .num { text-align: right; }
.rel-canal .num small { display: block; font-size: 11px; color: var(--rl-cinza-2); }
.rel-canal .forte { font-weight: 800; color: #fff; }
.rel-canal-nome { display: flex; align-items: center; gap: 12px; font-weight: 700; color: #fff; }
.rel-canal-nome i { flex-shrink: 0; width: 34px; height: 34px; border-radius: 50%; border: 2px solid var(--rl-azul); display: inline-flex; align-items: center; justify-content: center; color: var(--rl-azul-3); }
.rel-canal-barra { display: flex; align-items: center; gap: 10px; }
.rel-canal-barra b { height: 10px; min-width: 3px; border-radius: 99px; background: linear-gradient(90deg, var(--rl-azul), var(--rl-azul-2)); }
.rel-canal-barra em { font-style: normal; font-weight: 700; color: #fff; font-size: 13px; }
.rel-ok { color: var(--success); font-weight: 800; }
.rel-ruim { color: var(--danger); font-weight: 800; }

/* Destaques da equipe (slide escuro) */
.rel-destaques { position: relative; z-index: 1; display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: 14px; }
.rel-destaque { position: relative; overflow: hidden; background: rgba(78, 128, 187, .16); border: 1px solid rgba(121, 165, 242, .24); border-radius: 14px; padding: 20px; }
.rel-destaque-num { position: absolute; right: 12px; top: -10px; font-family: var(--rl-titulo); font-weight: 800; font-size: 72px; line-height: 1; color: rgba(234, 238, 243, .07); }
.rel-destaque-ic { width: 52px; height: 52px; border-radius: 50%; border: 2px solid var(--rl-azul); display: flex; align-items: center; justify-content: center; color: var(--rl-azul-3); }
.rel-destaque-tit { font-size: 11px; text-transform: uppercase; letter-spacing: .08em; font-weight: 700; color: var(--rl-azul-2); margin-top: 14px; }
.rel-destaque-nome { font-family: var(--rl-titulo); font-size: 19px; font-weight: 800; color: #fff; margin-top: 4px; }
.rel-destaque-val { font-size: 13px; color: var(--rl-azul-3); font-weight: 700; margin-top: 2px; }
.rel-faixa { position: relative; z-index: 1; display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; margin-top: 26px; padding-top: 22px; border-top: 1px solid rgba(121, 165, 242, .25); }
.rel-faixa b { display: block; font-family: var(--rl-titulo); font-size: 34px; font-weight: 800; color: #fff; line-height: 1.1; }
.rel-faixa b small { font-size: 16px; color: var(--rl-cinza-2); }
.rel-faixa span { font-size: 13px; color: var(--rl-cinza-2); }

/* Gestão (cards sobre o slide escuro) */
.rel-escuro .rel-card { background: rgba(78, 128, 187, .14); border-color: rgba(121, 165, 242, .22); box-shadow: none; color: var(--rl-gelo); }
.rel-escuro .rel-card h3 { color: #fff; }
.rel-escuro .muted { color: var(--rl-cinza-2); }
.rel-escuro .rel-nota { color: var(--rl-cinza-2); }
.rel-num { font-family: var(--rl-titulo); font-size: 32px; font-weight: 800; color: var(--rl-navy); margin-bottom: 12px; line-height: 1.1; }
.rel-escuro .rel-num { color: #fff; }
.rel-num small { display: block; font-family: var(--font); font-size: 12px; font-weight: 500; color: var(--rl-cinza); margin-top: 2px; }
.rel-escuro .rel-num small { color: var(--rl-cinza-2); }
.rel-linha { display: flex; justify-content: space-between; gap: 10px; padding: 7px 0; border-bottom: 1px solid var(--rl-gelo); font-size: 13px; color: var(--gray-700); }
.rel-escuro .rel-linha { color: #d5ddea; border-bottom-color: rgba(255, 255, 255, .08); }
.rel-linha.forte { border-bottom: none; border-top: 2px solid var(--rl-borda); margin-top: 4px; font-weight: 700; }
.rel-escuro .rel-linha.forte { border-top-color: rgba(121, 165, 242, .3); color: #fff; }
.rel-bola { display: inline-block; width: 9px; height: 9px; border-radius: 50%; margin-right: 7px; }
.rel-bola.ok { background: var(--success); } .rel-bola.atencao { background: #d79a2e; } .rel-bola.ruim { background: var(--danger); }
.rel-escuro .rel-bola.ok { background: #34d399; } .rel-escuro .rel-bola.ruim { background: #f87171; }

/* Encerramento */
.rel-fim { min-height: 420px; display: flex; flex-direction: column; justify-content: center; padding: 56px; }
.rel-fim-conteudo { position: relative; z-index: 1; }
.rel-fim .rel-h { font-size: 56px; line-height: 1.08; }
.rel-fim .rel-capa-logo { width: 210px; margin: 40px 0 0; }
.rel-rodape { position: relative; z-index: 1; font-size: 11.5px; color: #8ca0c6; margin: 44px 0 0; }

/* Modo apresentação: um slide por vez num "palco" 1600x900 (16:9) que o JS
   escala para caber na tela — o layout fica idêntico em qualquer monitor. */
.rel-controles { display: none; }
body.rel-apresentando { background: #050e1c; overflow: hidden; }
body.rel-apresentando .sidebar, body.rel-apresentando .topbar, body.rel-apresentando .sidebar-backdrop, body.rel-apresentando .flash, body.rel-apresentando .rel-mes { display: none !important; }
body.rel-apresentando .rel-slide { display: none; }
body.rel-apresentando .rel-slide.ativo {
  display: flex; flex-direction: column; justify-content: center;
  position: fixed; left: 50%; top: 50%; z-index: 50; width: 1600px; min-height: 900px;
  margin: 0; padding: 70px 96px; border: none; border-radius: 0; box-shadow: none; transform-origin: center center;
}
body.rel-apresentando .rel-capa.ativo { justify-content: space-between; padding: 72px 96px 64px; }
body.rel-apresentando .rel-fim.ativo { padding: 96px; }
body.rel-apresentando .rel-marca { top: 64px; right: 88px; width: 58px; height: 58px; }
body.rel-apresentando .rel-cab { margin-bottom: 36px; }
body.rel-apresentando .rel-olho { font-size: 15px; }
body.rel-apresentando .rel-h { font-size: 48px; }
body.rel-apresentando .rel-capa .rel-h { font-size: 88px; }
body.rel-apresentando .rel-fim .rel-h { font-size: 76px; }
body.rel-apresentando .rel-capa-logo { width: 280px; }
body.rel-apresentando .rel-capa-conteudo { max-width: 860px; }
body.rel-apresentando .rel-capa-sub { font-size: 17px; }
body.rel-apresentando .rel-capa-chips { font-size: 15px; }
body.rel-apresentando .rel-capa .rel-anel.um { width: 760px; height: 760px; right: -220px; bottom: -330px; }
body.rel-apresentando .rel-capa .rel-anel.dois { width: 160px; height: 160px; top: 90px; }
body.rel-apresentando .rel-kpis { grid-template-columns: repeat(12, 1fr); gap: 20px; }
body.rel-apresentando .rel-kpis .rel-kpi { grid-column: span 4; padding: 26px 28px; }
body.rel-apresentando .rel-kpis .rel-kpi.destaque { grid-column: span 6; }
body.rel-apresentando .rel-kpis .rel-kpi:nth-child(2), body.rel-apresentando .rel-kpis .rel-kpi:nth-child(3) { grid-column: span 3; }
body.rel-apresentando .rel-kpis-4 .rel-kpi, body.rel-apresentando .rel-kpis-4 .rel-kpi.destaque, body.rel-apresentando .rel-kpis-4 .rel-kpi:nth-child(n) { grid-column: span 3; }
body.rel-apresentando .rel-kpi-lbl { font-size: 13px; }
body.rel-apresentando .rel-kpi-val { font-size: 36px; }
body.rel-apresentando .rel-kpi.destaque .rel-kpi-val { font-size: 52px; }
body.rel-apresentando .rel-kpi-sub, body.rel-apresentando .rel-kpi-meta { font-size: 14px; }
body.rel-apresentando .rel-delta { font-size: 14px; }
body.rel-apresentando .rel-grid-2, body.rel-apresentando .rel-grid-3 { gap: 24px; }
body.rel-apresentando .rel-card { padding: 28px 30px; }
body.rel-apresentando .rel-card.sem-pad { padding: 0; }
body.rel-apresentando .rel-card h3 { font-size: 19px; }
body.rel-apresentando .rel-lista > div, body.rel-apresentando .rel-linha { font-size: 15px; padding: 9px 0; }
body.rel-apresentando .rel-num { font-size: 42px; }
body.rel-apresentando .rel-colunas { height: 300px; }
body.rel-apresentando .rel-col-val, body.rel-apresentando .rel-col-rot { font-size: 13.5px; }
body.rel-apresentando .rel-tabela { font-size: 15px; }
body.rel-apresentando .rel-tabela thead th { font-size: 12px; padding: 14px 12px; }
body.rel-apresentando .rel-tabela td { padding: 13px 12px; }
body.rel-apresentando .rel-intro, body.rel-apresentando .rel-nota { font-size: 14px; }
body.rel-apresentando .rel-destaque { padding: 28px; }
body.rel-apresentando .rel-destaque-ic { width: 64px; height: 64px; }
body.rel-apresentando .rel-destaque-tit { font-size: 13px; }
body.rel-apresentando .rel-destaque-nome { font-size: 25px; }
body.rel-apresentando .rel-destaque-val { font-size: 16px; }
body.rel-apresentando .rel-faixa b { font-size: 44px; }
body.rel-apresentando .rel-faixa span { font-size: 15px; }
body.rel-apresentando .rel-canal { font-size: 16px; padding: 14px 0; }
body.rel-apresentando .rel-canal.cab { font-size: 12px; }
body.rel-apresentando .rel-controles {
  display: flex; align-items: center; gap: 4px; position: fixed; right: 18px; bottom: 16px; z-index: 60;
  background: rgba(10, 31, 61, .85); border: 1px solid rgba(121, 165, 242, .3); border-radius: 999px; padding: 4px 6px;
  color: #c9d6ee; font-size: 12.5px; font-weight: 700; opacity: .35; transition: opacity .2s;
}
body.rel-apresentando .rel-controles:hover { opacity: 1; }
.rel-controles button { background: none; border: none; color: inherit; font-size: 18px; line-height: 1; width: 30px; height: 30px; border-radius: 50%; cursor: pointer; }
.rel-controles button:hover { background: rgba(255, 255, 255, .1); color: #fff; }
.rel-controles button[data-sair] { font-size: 13px; }
.rel-controles span { min-width: 48px; text-align: center; }

@media (max-width: 1000px) { .rel-grid-2, .rel-grid-2.igual, .rel-grid-3 { grid-template-columns: 1fr; } .rel-kpi.destaque { grid-column: auto; } }
@media (max-width: 700px) {
  .rel-slide { padding: 26px 18px; border-radius: 14px; }
  .rel-cab { padding-right: 52px; }
  .rel-marca { top: 24px; right: 18px; width: 38px; height: 38px; }
  .rel-h { font-size: 26px; }
  .rel-capa { min-height: 480px; padding: 80px 18px 28px; }
  .rel-capa-foto { left: 0; }
  .rel-capa-foto::after { background: linear-gradient(0deg, var(--rl-navy) 20%, rgba(10, 31, 61, .7) 100%); }
  .rel-capa .rel-h, .rel-fim .rel-h { font-size: 36px; }
  .rel-mes { left: 18px; right: auto; top: 18px; }
  .rel-anel.um, .rel-capa .rel-anel.um { width: 240px; height: 240px; right: -80px; bottom: -100px; }
  .rel-capa .rel-anel.dois { display: none; }
  .rel-capa-logo { width: 170px; }
  .rel-faixa { grid-template-columns: 1fr; }
  .rel-fim { padding: 32px 18px; }
  .rel-canais { padding: 4px 14px; }
  .rel-canal { grid-template-columns: 1fr 1fr; gap: 6px 12px; }
  .rel-canal.cab { display: none; }
  .rel-canal-barra { grid-column: span 2; order: 5; }
}
/* No palco da apresentação as grades não colapsam, mesmo em tela menor */
body.rel-apresentando .rel-grid-2 { grid-template-columns: 1fr 1.3fr; }
body.rel-apresentando .rel-grid-2.igual { grid-template-columns: 1fr 1fr; }
body.rel-apresentando .rel-colunas.baixa { height: 330px; }
body.rel-apresentando .rel-evol-resumo b { font-size: 40px; }
body.rel-apresentando .rel-evol-resumo span { font-size: 15px; }
body.rel-apresentando .rel-grid-3, body.rel-apresentando .rel-faixa { grid-template-columns: repeat(3, 1fr); }
body.rel-apresentando .rel-canal { grid-template-columns: 1.6fr .6fr 2fr .9fr 1.1fr; }
body.rel-apresentando .rel-canal.cab { display: grid; }
@media print {
  .rel * { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  .rel-slide { box-shadow: none; overflow: visible; }
  .rel-slide + .rel-slide { break-before: page; page-break-before: always; }
  .topbar { display: none !important; }
}

/* ---------- Relatório ao credor ----------
   Mesmos slides da diretoria, com as cores do credor: a paleta (--rl-*) vem
   do PHP (credor_paleta) no style do .rel-credor. Nos slides escuros a cor de
   destaque troca pela versão legível sobre o fundo do credor. */
.rel-credor .rel-escuro {
  --rl-azul: var(--rl-escuro-azul); --rl-azul-2: var(--rl-escuro-azul-2); --rl-azul-3: var(--rl-escuro-azul-3);
  background: radial-gradient(circle at 88% 0%, var(--rl-navy-2) 0%, transparent 58%),
    repeating-linear-gradient(135deg, rgba(255, 255, 255, .025) 0 2px, transparent 2px 16px), var(--rl-navy);
}
.rel-credor .rel-capa-foto::after { background: linear-gradient(90deg, var(--rl-navy) 0%, color-mix(in srgb, var(--rl-navy) 60%, transparent) 38%, color-mix(in srgb, var(--rl-navy) 18%, transparent) 100%); }
.rel-credor .rel-anel.dois { border-color: color-mix(in srgb, var(--rl-azul) 55%, transparent); }
.rel-credor .rel-kpi, .rel-credor .rel-destaque, .rel-credor .rel-escuro .rel-card { background: color-mix(in srgb, var(--rl-azul) 13%, transparent); border-color: color-mix(in srgb, var(--rl-azul) 24%, transparent); }
.rel-credor .rel-kpi.destaque { background: linear-gradient(135deg, var(--rl-destaque), color-mix(in srgb, var(--rl-destaque) 72%, #000)); border-color: transparent; box-shadow: 0 10px 26px color-mix(in srgb, var(--rl-destaque) 35%, transparent); }
.rel-credor .rel-kpi.destaque .rel-kpi-val, .rel-credor .rel-kpi.destaque .rel-kpi-sub, .rel-credor .rel-kpi.destaque .rel-kpi-sub strong { color: var(--rl-sobre-azul); }
.rel-credor .rel-kpi.destaque .rel-kpi-lbl, .rel-credor .rel-kpi.destaque .rel-comp { color: var(--rl-sobre-azul); opacity: .8; }
.rel-credor .rel-kpi.destaque .rel-delta { background: color-mix(in srgb, var(--rl-sobre-azul) 18%, transparent); color: var(--rl-sobre-azul); }
.rel-credor .rel-canais { background: color-mix(in srgb, var(--rl-azul) 10%, transparent); border-color: color-mix(in srgb, var(--rl-azul) 20%, transparent); }
.rel-credor .rel-canais.sem-comp .rel-canal { grid-template-columns: 1.6fr .6fr 2fr .9fr; }
.rel-credor .rel-faixa { border-top-color: color-mix(in srgb, var(--rl-azul) 25%, transparent); }
.rel-credor .rel-col-barra { background: color-mix(in srgb, var(--rl-azul) 28%, #fff); }
.rel-credor .rel-col.atual .rel-col-barra { background: var(--rl-azul); }
.rel-credor .rel-col.atual .rel-col-barra.parcial { background: repeating-linear-gradient(135deg, var(--rl-azul) 0 6px, var(--rl-azul-2) 6px 12px); }
.rel-credor .rel-cab { padding-right: 190px; }
/* Grade de 4: o destaque tem a mesma largura dos outros, o valor não pode ser gigante */
.rel-credor .rel-kpis-4 .rel-kpi.destaque .rel-kpi-val { font-size: 29px; }
body.rel-apresentando .rel-credor .rel-kpis-4 .rel-kpi.destaque .rel-kpi-val { font-size: 40px; }
/* KPIs em slide claro (acordos, equipe) */
.rel-claro .rel-kpi:not(.destaque) { background: #fff; border-color: var(--rl-borda); box-shadow: 0 1px 2px rgba(10, 31, 61, .05); }
.rel-claro .rel-kpi:not(.destaque) .rel-kpi-val { color: var(--rl-navy); }
.rel-claro .rel-kpi:not(.destaque) .rel-kpi-lbl { color: var(--rl-azul); }
.rel-claro .rel-kpi:not(.destaque) .rel-kpi-sub { color: var(--rl-cinza); }
/* Logo do credor no canto dos slides, na capa e no encerramento */
.rel-marca-logo { position: absolute; top: 30px; right: 40px; z-index: 1; display: flex; align-items: center; justify-content: center; height: 54px; max-width: 160px; }
.rel-marca-logo img { display: block; max-width: 100%; max-height: 100%; object-fit: contain; }
.rel-credor.placa .rel-escuro .rel-marca-logo { background: #fff; border-radius: 10px; padding: 7px 12px; }
.rel-marca-texto { position: absolute; top: 38px; right: 40px; z-index: 1; max-width: 200px; text-align: right; font-family: var(--rl-titulo); font-weight: 800; font-size: 15px; color: var(--rl-navy); }
.rel-escuro .rel-marca-texto { color: var(--rl-gelo); }
.rel-capa-logo.credor { width: auto; max-width: min(300px, 60%); max-height: 110px; object-fit: contain; }
.rel-credor.placa .rel-capa-logo.credor, .rel-credor.placa .rel-fim-logos .credor { background: #fff; padding: 14px 20px; border-radius: 14px; box-shadow: 0 8px 24px rgba(0, 0, 0, .18); }
.rel-capa-nome { position: relative; z-index: 1; font-family: var(--rl-titulo); font-weight: 800; font-size: 30px; color: #fff; letter-spacing: .01em; }
.rel-capa-hc { display: block; height: 30px; width: auto; }
.rel-capa-chips .rel-sep { width: 1px; height: 18px; background: var(--rl-azul); }
.rel-fim-logos { display: flex; align-items: center; flex-wrap: wrap; gap: 28px; margin-top: 40px; }
.rel-fim-logos img { display: block; }
.rel-fim-logos .credor { max-height: 100px; max-width: 280px; object-fit: contain; }
.rel-fim-logos .hc { width: 190px; }
.rel-fim-logos i { width: 1px; height: 60px; background: color-mix(in srgb, var(--rl-azul) 50%, transparent); }
.rel-fim .rel-capa-sub { font-size: 15px; }
/* Mini indicadores (slide claro) */
.rel-mini { position: relative; z-index: 1; display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; margin-bottom: 16px; }
.rel-mini > div { background: #fff; border: 1px solid var(--rl-borda); border-radius: 14px; padding: 14px 18px; min-width: 0; }
.rel-mini span { display: block; font-size: 11px; text-transform: uppercase; letter-spacing: .08em; font-weight: 700; color: var(--rl-azul); }
.rel-mini b { display: block; font-family: var(--rl-titulo); font-size: 24px; font-weight: 800; color: var(--rl-navy); margin: 4px 0 2px; white-space: nowrap; }
.rel-mini small { font-size: 12px; color: var(--rl-cinza); }
.rel-mini > .forte { background: var(--rl-navy); border-color: var(--rl-navy); }
.rel-mini > .forte span { color: var(--rl-azul-3); }
.rel-mini > .forte b { color: #fff; }
.rel-mini > .forte small { color: var(--rl-cinza-2); }
/* Recuperação dia a dia */
.rel-dias { display: flex; align-items: stretch; gap: 4px; height: 290px; padding-top: 84px; }
.rel-dia { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.rel-dia-area { position: relative; flex: 1; display: flex; align-items: flex-end; justify-content: center; border-bottom: 1px solid var(--rl-cinza-2); }
.rel-dia-area span { width: 78%; max-width: 30px; background: var(--rl-azul); border-radius: 4px 4px 0 0; }
.rel-dia.fds .rel-dia-area span { background: var(--rl-cinza-2); }
.rel-dia.futuro .rel-dia-area span { display: none; }
.rel-dia.melhor .rel-dia-area span { background: var(--rl-navy); }
/* Valor de cada dia: texto em pé (de baixo para cima) logo acima da barra */
.rel-dia-area em { position: absolute; left: 50%; transform: translateX(-50%) rotate(180deg); writing-mode: vertical-rl; font-style: normal; font-size: 10.5px; font-weight: 700; line-height: 1; color: var(--rl-cinza); white-space: nowrap; }
.rel-dia.melhor .rel-dia-area em { font-weight: 800; color: var(--rl-navy); }
.rel-dia small { text-align: center; font-size: 10.5px; color: var(--rl-cinza); padding-top: 4px; }
.rel-dia.futuro small { opacity: .45; }
.sw.fds { background: var(--rl-cinza-2); }
/* Barras horizontais (faixas de atraso, estados) */
.rel-hbarras { display: flex; flex-direction: column; gap: 11px; }
.rel-hbarra { display: grid; grid-template-columns: 120px 1fr auto; gap: 12px; align-items: center; font-size: 13px; color: var(--gray-700); }
.rel-hbarra > span:first-child { font-weight: 600; }
.rel-hbarra .trilho { height: 10px; background: color-mix(in srgb, var(--rl-azul) 14%, transparent); border-radius: 99px; overflow: hidden; }
.rel-hbarra .trilho b { display: block; height: 100%; min-width: 3px; border-radius: 99px; background: linear-gradient(90deg, var(--rl-azul), var(--rl-azul-2)); }
.rel-hbarra em { font-style: normal; font-weight: 800; white-space: nowrap; text-align: right; color: var(--rl-navy); }
.rel-hbarra em small { font-weight: 500; margin-left: 8px; color: var(--rl-cinza); }
.rel-escuro .rel-hbarra { color: #d5ddea; }
.rel-escuro .rel-hbarra em { color: #fff; }
.rel-escuro .rel-hbarra em small { color: var(--rl-cinza-2); }
/* Faixa etária: CPFs, saldo devedor e ticket médio por faixa, cada um com a sua barra */
.rel-idades { display: flex; flex-direction: column; }
.rel-idade { display: grid; grid-template-columns: 104px 1fr 1fr 1fr; gap: 16px; align-items: center; padding: 8px 0; border-bottom: 1px solid var(--rl-gelo); font-size: 13px; color: var(--gray-700); }
.rel-idade:last-child { border-bottom: none; }
.rel-idade.cab { font-size: 10.5px; text-transform: uppercase; letter-spacing: .08em; font-weight: 700; color: var(--rl-cinza); padding-top: 0; }
.rel-idade-rot { font-weight: 700; color: var(--rl-navy); }
.rel-idade > span:not(.rel-idade-rot) b { display: block; font-weight: 800; color: var(--rl-navy); white-space: nowrap; margin-bottom: 4px; }
.rel-idade b small { font-weight: 500; margin-left: 6px; color: var(--rl-cinza); }
.rel-idade i { display: block; height: 7px; min-width: 3px; border-radius: 99px; background: linear-gradient(90deg, var(--rl-azul), var(--rl-azul-2)); }
.rel-idade.sem .rel-idade-rot, .rel-idade.sem b { color: var(--rl-cinza); }
.rel-idade.sem i { background: var(--rl-cinza-2); }
body.rel-apresentando .rel-idade { font-size: 16px; padding: 11px 0; grid-template-columns: 130px 1fr 1fr 1fr; }
body.rel-apresentando .rel-idade.cab { font-size: 12px; }
body.rel-apresentando .rel-idade i { height: 9px; }
@media (max-width: 700px) { .rel-idade { grid-template-columns: 78px 1fr 1fr 1fr; gap: 8px; font-size: 12px; } .rel-idade b small { display: none; } }
/* Análise dos recebimentos: dia de vencimento (31 colunas) e à vista × parcelado */
.rel-idades.larga .rel-idade { grid-template-columns: 128px 1fr 1fr 1fr; }
body.rel-apresentando .rel-idades.larga .rel-idade { grid-template-columns: 160px 1fr 1fr 1fr; }
@media (max-width: 700px) { .rel-idades.larga .rel-idade { grid-template-columns: 90px 1fr 1fr 1fr; } }
.rel-dias-venc { height: 300px; gap: 3px; }
.rel-dias-venc .rel-dia-area em { font-size: 10px; }
.rel-forma { padding: 10px 0; border-bottom: 1px solid var(--rl-gelo); }
.rel-forma:last-of-type { border-bottom: none; }
.rel-forma-top { display: flex; align-items: center; gap: 8px; }
.rel-forma-top strong { flex: 1; color: var(--rl-navy); font-size: 14px; }
.rel-forma-top b { font-family: var(--rl-titulo); font-size: 20px; color: var(--rl-navy); }
.rel-forma-num { display: flex; gap: 14px; flex-wrap: wrap; margin: 4px 0 0 18px; font-size: 12.5px; color: var(--rl-cinza); }
body.rel-apresentando .rel-dias-venc { height: 400px; }
body.rel-apresentando .rel-forma-top strong { font-size: 17px; }
body.rel-apresentando .rel-forma-top b { font-size: 26px; }
body.rel-apresentando .rel-forma-num { font-size: 15px; }
/* Imagens das ações e imagem dos slides extras */
.rel-galeria { position: relative; z-index: 1; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.rel-galeria.n1 { grid-template-columns: minmax(0, 1fr); }
.rel-galeria.n2, .rel-galeria.n4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.rel-foto { margin: 0; background: #fff; border: 1px solid var(--rl-borda); border-radius: 14px; padding: 10px; box-shadow: 0 1px 2px rgba(10, 31, 61, .05); min-width: 0; }
.rel-foto-img { height: 210px; display: flex; align-items: center; justify-content: center; background: var(--rl-gelo); border-radius: 9px; overflow: hidden; }
.rel-foto-img img { max-width: 100%; max-height: 100%; object-fit: contain; display: block; }
.rel-galeria.n1 .rel-foto-img { height: 420px; }
.rel-galeria.n2 .rel-foto-img { height: 380px; }
.rel-galeria.n3 .rel-foto-img { height: 330px; }
.rel-foto figcaption { font-size: 12.5px; color: var(--gray-700); padding: 8px 4px 0; line-height: 1.4; }
/* Slides extras (manuais) */
.rel-kpis-n4 .rel-kpi, .rel-kpis-n4 .rel-kpi.destaque { grid-column: auto; }
@media (min-width: 1100px) {
  .rel-kpis-n4 .rel-kpi, .rel-kpis-n4 .rel-kpi.destaque, .rel-kpis-n4 .rel-kpi:nth-child(n) { grid-column: span 3; }
  .rel-kpis-n2 .rel-kpi, .rel-kpis-n2 .rel-kpi.destaque, .rel-kpis-n2 .rel-kpi:nth-child(n) { grid-column: span 6; }
  .rel-kpis-n1 .rel-kpi.destaque { grid-column: span 12; }
}
.rel-extra { position: relative; z-index: 1; display: grid; grid-template-columns: minmax(0, 1fr); gap: 16px; }
.rel-extra.com-kpis { margin-top: 16px; }
.rel-extra.com-img { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: start; }
.rel-extra .rel-foto-img { height: 380px; }
.rel-extra.com-kpis .rel-foto-img { height: 270px; }
.rel-extra:not(.com-img) .rel-foto-img { height: 440px; }
.rel-extra.com-kpis:not(.com-img) .rel-foto-img { height: 300px; }
.rel-texto { font-size: 15px; line-height: 1.6; color: var(--gray-700); }
.rel-texto p { margin: 0 0 10px; }
.rel-texto ul { margin: 0 0 10px; padding-left: 0; list-style: none; }
.rel-texto li { position: relative; padding-left: 22px; margin-bottom: 7px; }
.rel-texto li::before { content: ""; position: absolute; left: 4px; top: .6em; width: 8px; height: 8px; border-radius: 50%; background: var(--rl-azul); }
.rel-texto > :last-child { margin-bottom: 0; }
.rel-escuro .rel-texto { color: #e6ecf5; font-size: 16px; }
.rel-escuro .rel-texto li::before { background: var(--rl-escuro-azul, var(--rl-azul)); }
.rel-escuro .rel-foto { background: rgba(255, 255, 255, .06); border-color: rgba(255, 255, 255, .12); }
.rel-escuro .rel-foto-img { background: rgba(255, 255, 255, .92); }
body.rel-apresentando .rel-foto-img { height: 250px; }
body.rel-apresentando .rel-galeria.n1 .rel-foto-img, body.rel-apresentando .rel-extra:not(.com-img) .rel-foto-img { height: 520px; }
body.rel-apresentando .rel-galeria.n2 .rel-foto-img, body.rel-apresentando .rel-extra .rel-foto-img { height: 460px; }
body.rel-apresentando .rel-galeria.n3 .rel-foto-img { height: 400px; }
body.rel-apresentando .rel-extra.com-kpis .rel-foto-img { height: 330px; }
body.rel-apresentando .rel-texto { font-size: 19px; }
body.rel-apresentando .rel-foto figcaption { font-size: 15px; }
@media (max-width: 1000px) { .rel-extra.com-img { grid-template-columns: minmax(0, 1fr); } .rel-galeria { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 700px) { .rel-galeria, .rel-galeria.n2, .rel-galeria.n4 { grid-template-columns: minmax(0, 1fr); } .rel-foto-img, .rel-galeria .rel-foto-img, .rel-extra .rel-foto-img { height: 240px; } }
/* Compartilhar link (janela na página do relatório ao credor) */
.crl { width: min(760px, calc(100vw - 32px)); max-height: calc(100vh - 48px); border: none; border-radius: 16px; padding: 20px 22px; box-shadow: 0 24px 60px rgba(10, 31, 61, .35); }
.crl::backdrop { background: rgba(5, 14, 28, .55); }
.crl-cab { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 10px; }
.crl-cab h2 { display: flex; align-items: center; gap: 8px; margin: 0; font-size: 18px; color: var(--hc-900); }
.crl-novo { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; padding: 12px 14px; border-radius: 12px; background: var(--hc-50, #eef3ff); margin-bottom: 14px; }
.crl-novo label { margin: 0; font-weight: 600; }
.crl-novo select { width: auto; }
.crl-lista { display: flex; flex-direction: column; gap: 10px; }
.crl-item { padding: 12px 14px; border: 1px solid var(--gray-200); border-radius: 12px; background: #fff; }
.crl-item.inativo { opacity: .6; }
.crl-info { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.crl-info strong { color: var(--hc-900); }
.crl-info small { flex-basis: 100%; color: var(--gray-500); font-size: 12px; }
.crl-tag { font-size: 11px; font-weight: 700; padding: 2px 8px; border-radius: 99px; background: var(--gray-100); color: var(--gray-500); }
.crl-tag.ok { background: var(--success-bg); color: var(--success); }
.crl-url { display: flex; gap: 6px; align-items: center; margin-top: 8px; flex-wrap: wrap; }
.crl-url input { flex: 1; min-width: 200px; font-family: Consolas, monospace; font-size: 12px; }
.crl-url form { margin: 0; }
/* Página aberta pelo link compartilhado (sem login, sem menu) */
.rel-publico-body { background: var(--gray-50, #f4f6f9); margin: 0; }
.rel-publico-topo { position: sticky; top: 0; z-index: 20; display: flex; align-items: center; justify-content: space-between; gap: 14px; flex-wrap: wrap; padding: 12px 24px; background: #fff; border-bottom: 1px solid var(--gray-200); }
.rel-publico-titulo { display: flex; flex-direction: column; min-width: 0; }
.rel-publico-titulo strong { color: var(--hc-900); font-size: 15px; }
.rel-publico-titulo small { color: var(--gray-500); font-size: 12px; }
.rel-publico-conteudo { max-width: 1320px; margin: 0 auto; padding: 22px 24px 40px; }
.rel-publico-aviso { max-width: 460px; margin: 14vh auto; padding: 32px; text-align: center; background: #fff; border-radius: 16px; box-shadow: 0 10px 30px rgba(10, 31, 61, .08); }
.rel-publico-aviso img { width: 56px; }
.rel-publico-aviso h1 { font-size: 20px; color: var(--hc-900); margin: 14px 0 8px; }
.rel-publico-aviso p { color: var(--gray-500); margin: 0; }
body.rel-apresentando .rel-publico-topo { display: none; }
@media (max-width: 700px) { .rel-publico-topo, .rel-publico-conteudo { padding-left: 16px; padding-right: 16px; } }
@media print { .rel-publico-topo { display: none !important; } .rel-publico-conteudo { padding: 0; max-width: none; } }
/* Exportar PDF / PowerPoint: aviso por cima enquanto os slides são desenhados */
.rel-export-aviso { position: fixed; inset: 0; z-index: 3000; display: flex; align-items: center; justify-content: center; background: rgba(5, 14, 28, .92); }
.rel-export-aviso[hidden] { display: none; }
.rel-export-aviso > div { display: flex; align-items: center; gap: 14px; padding: 18px 26px; border-radius: 14px; background: #fff; color: var(--hc-900, #0a1f3d); font-weight: 700; box-shadow: 0 20px 50px rgba(0, 0, 0, .35); }
.rel-export-aviso i { width: 22px; height: 22px; border-radius: 50%; border: 3px solid var(--gray-200, #e5e7eb); border-top-color: var(--hc-500, #2e6bff); animation: relGirar .8s linear infinite; }
@keyframes relGirar { to { transform: rotate(360deg); } }
@media print { .rel-foto, .rel-foto-img { break-inside: avoid; -webkit-print-color-adjust: exact; print-color-adjust: exact; } }
/* Funil de cobrança */
.rel-grid-2.funil { grid-template-columns: 1.5fr 1fr; }
.rel-funil { display: flex; flex-direction: column; gap: 12px; }
.rel-funil-etapa { display: grid; grid-template-columns: 190px 1fr 64px; gap: 14px; align-items: center; }
.rel-funil-lbl b { display: block; font-family: var(--rl-titulo); font-size: 22px; font-weight: 800; color: var(--rl-navy); line-height: 1.1; }
.rel-funil-lbl span { font-size: 12.5px; color: var(--rl-cinza); }
.rel-funil-barra { display: flex; justify-content: center; height: 34px; }
.rel-funil-barra b { height: 100%; border-radius: 8px; background: linear-gradient(90deg, var(--rl-azul), var(--rl-azul-2)); }
.rel-funil-etapa:first-child .rel-funil-barra b { background: var(--rl-navy); }
.rel-funil-etapa em { font-style: normal; font-weight: 800; color: var(--rl-azul); text-align: right; font-size: 14px; }
/* Situação dos acordos (barra empilhada) */
.rel-pilha { display: flex; height: 26px; border-radius: 8px; overflow: hidden; background: var(--rl-gelo); margin: 6px 0 18px; }
.rel-pilha b { height: 100%; }
.rel-pilha .ok { background: var(--success); }
.rel-pilha .atencao { background: #d79a2e; }
.rel-pilha .azul, .rel-bola.azul { background: var(--rl-azul); }
.rel-pilha .cinza, .rel-bola.cinza { background: var(--rl-cinza-2); }
.rel-pilha-leg > div { display: flex; align-items: center; gap: 4px; padding: 7px 0; border-bottom: 1px solid var(--rl-gelo); font-size: 13px; color: var(--gray-700); }
.rel-pilha-leg span { flex: 1; }
.rel-pilha-leg b { color: var(--rl-navy); }
/* Considerações e próximos passos */
.rel-topicos { position: relative; z-index: 1; display: grid; grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)); gap: 14px; list-style: none; margin: 0; padding: 0; counter-reset: topico; }
.rel-topicos li { counter-increment: topico; display: grid; grid-template-columns: 46px 1fr; gap: 12px; align-items: start; padding: 18px 20px; border-radius: 14px; font-size: 15px; line-height: 1.5; color: #e6ecf5;
  background: color-mix(in srgb, var(--rl-azul) 13%, transparent); border: 1px solid color-mix(in srgb, var(--rl-azul) 24%, transparent); }
.rel-topicos li::before { content: counter(topico, decimal-leading-zero); font-family: var(--rl-titulo); font-weight: 800; font-size: 26px; line-height: 1.1; color: var(--rl-azul); }
/* Palco da apresentação */
body.rel-apresentando .rel-credor .rel-cab { padding-right: 250px; }
body.rel-apresentando .rel-marca-logo { top: 56px; right: 88px; height: 66px; max-width: 210px; }
body.rel-apresentando .rel-marca-texto { top: 64px; right: 88px; font-size: 18px; }
body.rel-apresentando .rel-capa-logo.credor { width: auto; max-width: 380px; max-height: 140px; }
body.rel-apresentando .rel-capa-hc { height: 36px; }
body.rel-apresentando .rel-mini { gap: 20px; }
body.rel-apresentando .rel-mini > div { padding: 20px 24px; }
body.rel-apresentando .rel-mini span { font-size: 13px; }
body.rel-apresentando .rel-mini b { font-size: 32px; }
body.rel-apresentando .rel-mini small { font-size: 14px; }
body.rel-apresentando .rel-dias { height: 400px; padding-top: 100px; }
body.rel-apresentando .rel-dia small, body.rel-apresentando .rel-dia-area em { font-size: 13px; }
body.rel-apresentando .rel-hbarra { font-size: 16px; grid-template-columns: 150px 1fr auto; }
body.rel-apresentando .rel-hbarra .trilho { height: 13px; }
body.rel-apresentando .rel-funil-etapa { grid-template-columns: 240px 1fr 80px; }
body.rel-apresentando .rel-funil-lbl b { font-size: 30px; }
body.rel-apresentando .rel-funil-lbl span, body.rel-apresentando .rel-funil-etapa em { font-size: 16px; }
body.rel-apresentando .rel-funil-barra { height: 46px; }
body.rel-apresentando .rel-grid-2.funil { grid-template-columns: 1.5fr 1fr; }
body.rel-apresentando .rel-pilha-leg > div { font-size: 15px; padding: 9px 0; }
body.rel-apresentando .rel-topicos li { font-size: 20px; padding: 24px 28px; grid-template-columns: 60px 1fr; }
body.rel-apresentando .rel-topicos li::before { font-size: 34px; }
body.rel-apresentando .rel-fim-logos .credor { max-height: 130px; max-width: 360px; }
body.rel-apresentando .rel-fim-logos .hc { width: 240px; }
body.rel-apresentando .rel-canais.sem-comp .rel-canal { grid-template-columns: 1.6fr .6fr 2fr .9fr; }
@media (max-width: 1000px) { .rel-grid-2.funil { grid-template-columns: 1fr; } .rel-mini { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 700px) {
  .rel-credor .rel-cab { padding-right: 110px; }
  .rel-marca-logo { top: 20px; right: 16px; height: 38px; max-width: 96px; }
  .rel-marca-texto { top: 24px; right: 16px; font-size: 12px; max-width: 100px; }
  .rel-mini b { font-size: 19px; }
  .rel-dia:nth-child(even) small { visibility: hidden; }
  .rel-dias { gap: 2px; }
  .rel-funil-etapa { grid-template-columns: 1fr 52px; }
  .rel-funil-barra { grid-column: 1 / -1; grid-row: 2; justify-content: flex-start; }
  .rel-hbarra { grid-template-columns: 90px 1fr auto; }
  .rel-topicos { grid-template-columns: 1fr; }
  .rel-credor .rel-canais.sem-comp .rel-canal { grid-template-columns: 1fr 1fr; }
}

/* ---------- Tela de TV da operação (tv.php) ----------
   Tudo em rem, e o rem acompanha a tela: fica proporcional em TV Full HD,
   4K ou monitor comum, sem rolagem. Mesmo azul-marinho dos relatórios. */
html.tv-html { font-size: min(1.04vw, 1.85vh); height: 100%; }
body.tv {
  --tv-fundo: #071528; --tv-card: rgba(78, 128, 187, .12); --tv-borda: rgba(121, 165, 242, .2); --tv-azul: #2e6bff; --tv-azul-2: #79a5f2;
  --tv-texto: #eaeef3; --tv-suave: #9fb0c9; --tv-ok: #34d399; --tv-atencao: #fbbf24; --tv-ruim: #f87171;
  margin: 0; height: 100vh; overflow: hidden; display: grid; grid-template-rows: auto auto 1fr auto; gap: .9rem; padding: 1.1rem 1.4rem .7rem;
  background: radial-gradient(circle at 85% -10%, #16335c 0%, transparent 55%), var(--tv-fundo); color: var(--tv-texto); font-size: 1rem;
}
body.tv.sem-cursor, body.tv.sem-cursor * { cursor: none !important; }
/* Dica "acordos por carteira" ao passar o mouse na quantidade */
.tv [data-dica] { cursor: help; text-decoration: underline dotted rgba(159, 176, 201, .5); text-underline-offset: .25em; }
.tv-dica { position: fixed; z-index: 300; pointer-events: none; min-width: 12rem; max-width: 22rem; background: #0d2240; border: 1px solid var(--tv-borda);
  border-radius: .75rem; padding: .6rem .8rem; box-shadow: 0 12px 30px rgba(0, 0, 0, .45); font-size: .85rem; color: var(--tv-texto); display: flex; flex-direction: column; gap: .3rem; }
.tv-dica[hidden] { display: none; }
.tv-dica b { font-size: .7rem; letter-spacing: .08em; text-transform: uppercase; color: var(--tv-azul-2); }
.tv-dica span { display: flex; justify-content: space-between; gap: 1rem; }
.tv-dica em { font-style: normal; color: var(--tv-suave); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tv-dica strong { font-variant-numeric: tabular-nums; }
.tv-topo { display: grid; grid-template-columns: auto 1fr auto auto; align-items: center; gap: 1.6rem; }
.tv-logo { height: 2.6rem; width: auto; }
.tv-olho { display: flex; align-items: center; gap: .9rem; font-size: .8rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--tv-azul-2); }
.tv-aovivo { display: inline-flex; align-items: center; gap: .4rem; background: rgba(248, 113, 113, .16); color: #fecaca; padding: .15rem .6rem; border-radius: 99px; }
.tv-aovivo i { width: .55rem; height: .55rem; border-radius: 50%; background: var(--tv-ruim); animation: tv-pulso 1.6s infinite; }
@keyframes tv-pulso { 0%, 100% { opacity: 1; } 50% { opacity: .25; } }
.tv-titulo h1 { margin: .15rem 0 0; font-family: "Montserrat", var(--font); font-size: 1.9rem; font-weight: 800; color: #fff; letter-spacing: -.01em; }
.tv-titulo h1 b { color: var(--tv-azul); }
.tv-relogio { font-family: "Montserrat", var(--font); font-size: 3rem; font-weight: 800; color: #fff; font-variant-numeric: tabular-nums; }
.tv-status { display: flex; flex-direction: column; align-items: flex-end; gap: .35rem; font-size: .8rem; color: var(--tv-suave); }
.tv-fontes { display: flex; gap: .4rem; flex-wrap: wrap; justify-content: flex-end; font-size: .72rem; color: #7f93b3; }
.tv-fontes i { font-style: normal; opacity: .5; }
.tv-fonte { white-space: nowrap; }
.tv-fonte b { font-weight: 600; color: var(--tv-suave); }
.tv-fonte.velho b { color: var(--tv-atencao); }
.tv-botoes { display: flex; gap: .4rem; }
.tv-botoes button, .tv-botoes a { background: var(--tv-card); border: 1px solid var(--tv-borda); color: var(--tv-suave); border-radius: .5rem; padding: .25rem .6rem; font: inherit; cursor: pointer; text-decoration: none; }
.tv-botoes button:hover, .tv-botoes a:hover { color: #fff; }
:fullscreen .tv-botoes { opacity: 0; transition: opacity .3s; }
:fullscreen .tv-status:hover .tv-botoes { opacity: 1; }

/* Indicadores */
.tv-kpis { display: grid; grid-template-columns: 1.25fr 1.1fr .85fr .85fr 1.35fr; gap: .9rem; }
.tv-kpi { display: flex; flex-direction: column; gap: .3rem; background: var(--tv-card); border: 1px solid var(--tv-borda); border-radius: 1rem; padding: .9rem 1.1rem; min-width: 0; }
.tv-kpi.destaque { background: linear-gradient(135deg, var(--tv-azul), #1f4fd1); border-color: transparent; box-shadow: 0 .6rem 1.6rem rgba(46, 107, 255, .35); }
.tv-kpi-lbl { font-size: .72rem; font-weight: 700; letter-spacing: .09em; text-transform: uppercase; color: var(--tv-azul-2); }
.tv-kpi.destaque .tv-kpi-lbl { color: #dbe6ff; }
.tv-kpi-val { font-family: "Montserrat", var(--font); font-size: 2.6rem; font-weight: 800; line-height: 1.05; color: #fff; white-space: nowrap; font-variant-numeric: tabular-nums; }
.tv-kpi-val small { font-size: 1.1rem; color: var(--tv-suave); font-weight: 700; }
.tv-kpi.destaque .tv-kpi-val { font-size: 3.2rem; }
.tv-kpi.destaque .tv-kpi-val small { color: #dbe6ff; }
.tv-kpi.mes .tv-kpi-val { font-size: 2.2rem; }
.tv-kpi-rod { font-size: .78rem; color: var(--tv-suave); line-height: 1.45; }
.tv-kpi.destaque .tv-kpi-rod { color: #dbe6ff; }
.tv-alerta { color: var(--tv-ruim); font-weight: 800; }
.tv-delta { font-weight: 800; padding: .05rem .45rem; border-radius: 99px; white-space: nowrap; }
.tv-delta.sobe { background: rgba(52, 211, 153, .16); color: #6ee7b7; }
.tv-delta.desce { background: rgba(248, 113, 113, .16); color: #fca5a5; }
.tv-delta.neutro { background: rgba(255, 255, 255, .08); color: var(--tv-suave); }
.tv-kpi.destaque .tv-delta { background: rgba(255, 255, 255, .2); color: #fff; }
.tv-barra { position: relative; display: block; height: .45rem; border-radius: 99px; background: rgba(255, 255, 255, .12); overflow: visible; }
.tv-barra em { display: block; height: 100%; border-radius: 99px; background: var(--tv-azul-2); transition: width .8s ease; }
.tv-barra em.ok { background: var(--tv-ok); }
.tv-kpi.destaque .tv-barra { background: rgba(255, 255, 255, .25); }
.tv-kpi.destaque .tv-barra em { background: #fff; }
.tv-barra.mes b { position: absolute; top: -.25rem; bottom: -.25rem; width: .15rem; background: #fff; border-radius: 2px; }

/* Corpo: ranking + lateral */
.tv-corpo { display: grid; grid-template-columns: 1fr 26rem; gap: .9rem; min-height: 0; }
.tv-painel { background: var(--tv-card); border: 1px solid var(--tv-borda); border-radius: 1rem; padding: .9rem 1.1rem; min-height: 0; display: flex; flex-direction: column; }
.tv-painel-cab { display: flex; align-items: baseline; gap: .8rem; margin-bottom: .55rem; }
.tv-painel-cab h2 { margin: 0; font-family: "Montserrat", var(--font); font-size: 1.15rem; font-weight: 800; color: #fff; }
.tv-sub { font-size: .75rem; color: var(--tv-suave); }
.tv-paginas { margin-left: auto; display: flex; gap: .35rem; }
.tv-paginas i { width: .55rem; height: .55rem; border-radius: 50%; background: rgba(255, 255, 255, .2); }
.tv-paginas i.on { background: var(--tv-azul-2); }
.tv-ranking { min-height: 0; }
.tv-linhas { flex: 1; min-height: 0; overflow: hidden; display: flex; flex-direction: column; gap: .4rem; }
.tv-linhas-in { display: flex; flex-direction: column; gap: .4rem; width: 100%; transform-origin: 0 0; }
.tv-linha { display: grid; grid-template-columns: 2.4rem minmax(0, 2.2fr) 1.3fr 4.6rem 4.6rem 1.5fr 5.2rem 4.5rem 9.5rem; gap: .9rem; align-items: center; padding: .45rem .7rem; border-radius: .7rem; background: rgba(255, 255, 255, .03); animation: tv-entra .5s ease both; }
@keyframes tv-entra { from { opacity: 0; transform: translateY(.4rem); } to { opacity: 1; transform: none; } }
.tv-linha.cab { background: none; animation: none; padding-top: 0; padding-bottom: .2rem; font-size: .66rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--tv-azul-2); }
.tv-linha.parado { background: rgba(248, 113, 113, .08); box-shadow: inset .2rem 0 0 var(--tv-ruim); }
.tv-linha.apagado { opacity: .5; }
.tv-linha .num { text-align: right; font-size: 1.05rem; font-weight: 700; font-variant-numeric: tabular-nums; }
.tv-linha.cab .num { font-size: inherit; }
.tv-venc b { font-variant-numeric: tabular-nums; }
.tv-venc-vazio { color: var(--tv-suave); font-weight: 500; }
.tv-por-hora small { display: block; font-size: .62rem; font-weight: 500; color: var(--tv-suave); }
.tv-pos { display: inline-flex; align-items: center; justify-content: center; width: 2.1rem; height: 2.1rem; border-radius: 50%; font-family: "Montserrat", var(--font); font-weight: 800; font-size: 1rem; color: var(--tv-suave); }
.tv-pos.p1 { background: linear-gradient(135deg, #e3bd5b, #b8902c); color: #fff; }
.tv-pos.p2 { background: linear-gradient(135deg, #b9c3d0, #8793a3); color: #fff; }
.tv-pos.p3 { background: linear-gradient(135deg, #cf8f5c, #a2653a); color: #fff; }
.tv-op { display: flex; align-items: center; gap: .7rem; min-width: 0; }
.tv-av { flex-shrink: 0; display: inline-flex; align-items: center; justify-content: center; width: 2.3rem; height: 2.3rem; border-radius: 50%; background: hsl(var(--h) 55% 45%); color: #fff; font-style: normal; font-weight: 800; font-size: .85rem; }
.tv-op > span { min-width: 0; display: flex; flex-direction: column; }
.tv-op b { font-size: 1.1rem; color: #fff; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.tv-op small { font-size: .74rem; color: var(--tv-suave); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.tv-acordos, .tv-acion { display: grid; grid-template-columns: auto 1fr; align-items: baseline; column-gap: .35rem; row-gap: .3rem; }
.tv-acordos b, .tv-acion b { font-family: "Montserrat", var(--font); font-size: 1.5rem; font-weight: 800; color: #fff; font-variant-numeric: tabular-nums; }
.tv-acion b { font-size: 1.2rem; }
.tv-acordos small, .tv-acion small { font-size: .85rem; color: var(--tv-suave); font-weight: 700; }
.tv-acordos .tv-barra, .tv-acion .tv-barra, .tv-pips { grid-column: 1 / -1; }
.tv-pips { display: flex; gap: .2rem; flex-wrap: wrap; }
.tv-pips i { width: .6rem; height: .6rem; border-radius: 50%; background: rgba(255, 255, 255, .14); }
.tv-pips i.on { background: var(--tv-ok); }
.tv-pips i.extra { background: #fde047; box-shadow: 0 0 .4rem #fde047; }
.tv-pips i.ref { background: #fb923c; }
.tv-legenda { display: flex; flex-wrap: wrap; gap: .4rem 1.2rem; padding: .5rem .7rem 0; font-size: .72rem; color: var(--tv-suave); }
.tv-legenda span { display: inline-flex; align-items: center; gap: .35rem; }
.tv-legenda i { width: .6rem; height: .6rem; border-radius: 50%; }
.tv-legenda i.on { background: var(--tv-ok); }
.tv-legenda i.extra { background: #fde047; }
.tv-legenda i.ref { background: #fb923c; }
.tv-feed-ref { color: #fb923c; font-style: normal; font-weight: 700; }
.tv-chip { display: inline-block; padding: .25rem .65rem; border-radius: 99px; font-size: .8rem; font-weight: 800; white-space: nowrap; }
.tv-chip.ok { background: rgba(52, 211, 153, .16); color: #6ee7b7; }
.tv-chip.atencao { background: rgba(251, 191, 36, .14); color: #fcd34d; }
.tv-chip.ruim { background: rgba(248, 113, 113, .18); color: #fecaca; animation: tv-pulso 2.4s infinite; }
.tv-chip.muted { background: rgba(255, 255, 255, .07); color: var(--tv-suave); font-weight: 600; }
.tv-vazio { margin: auto; color: var(--tv-suave); font-size: 1.1rem; text-align: center; list-style: none; }

.tv-lado { display: grid; grid-template-rows: auto 1fr; gap: .9rem; min-height: 0; }
.tv-horas { display: flex; align-items: stretch; gap: .25rem; height: 9.5rem; }
.tv-hora { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.tv-hora-area { position: relative; flex: 1; display: flex; flex-direction: column; justify-content: flex-end; align-items: center; border-bottom: 1px solid rgba(255, 255, 255, .15); }
.tv-hora-barra { width: 72%; border-radius: .25rem .25rem 0 0; background: rgba(121, 165, 242, .45); transition: height .8s ease; }
.tv-hora.atual .tv-hora-barra { background: var(--tv-azul); box-shadow: 0 0 .8rem rgba(46, 107, 255, .6); }
.tv-hora.futuro .tv-hora-barra, .tv-hora.futuro .tv-hora-ac { display: none; }
.tv-hora-ac { font-size: .7rem; font-weight: 800; color: var(--tv-ok); margin-bottom: .15rem; }
.tv-hora small { text-align: center; font-size: .62rem; color: var(--tv-suave); padding-top: .2rem; }
.tv-hora.atual small { color: #fff; font-weight: 800; }
.tv-feed { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: .45rem; overflow: hidden; min-height: 0; }
.tv-feed li { display: grid; grid-template-columns: 3.2rem 1.6rem 1fr; align-items: center; gap: .4rem; padding: .45rem .6rem; border-radius: .6rem; background: rgba(255, 255, 255, .04); animation: tv-entra .5s ease both; }
.tv-feed li:first-child { background: rgba(52, 211, 153, .1); }
.tv-feed-hora { font-weight: 800; color: var(--tv-azul-2); font-variant-numeric: tabular-nums; }
.tv-feed b { display: block; color: #fff; font-size: .95rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.tv-feed small { color: var(--tv-suave); font-size: .72rem; }
.tv-rodape { display: flex; justify-content: space-between; gap: 1rem; font-size: .7rem; color: #7f93b3; }
.tv-rodape b { color: var(--tv-suave); }

/* Comemoração de acordo novo */
.tv-comemora { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; background: rgba(4, 12, 26, .55); z-index: 10; animation: tv-aparece .4s ease both; }
.tv-comemora.sai { animation: tv-some .6s ease both; }
.tv-comemora > div { display: flex; flex-direction: column; align-items: center; gap: .5rem; padding: 2.2rem 3.4rem; border-radius: 1.6rem; background: linear-gradient(135deg, #10b981, #047857); box-shadow: 0 1.5rem 4rem rgba(16, 185, 129, .45); animation: tv-pula .6s cubic-bezier(.2, 1.6, .4, 1) both; }
.tv-comemora-ic { font-size: 4.5rem; line-height: 1; }
.tv-comemora strong { font-family: "Montserrat", var(--font); font-size: 3rem; color: #fff; }
.tv-comemora small { font-size: 1.4rem; color: #d1fae5; font-weight: 700; }
@keyframes tv-aparece { from { opacity: 0; } to { opacity: 1; } }
@keyframes tv-some { to { opacity: 0; } }
@keyframes tv-pula { from { transform: scale(.6); opacity: 0; } to { transform: none; opacity: 1; } }
.tv-aviso { position: fixed; left: 50%; bottom: 2.4rem; transform: translateX(-50%); z-index: 11; padding: .7rem 1.2rem; border-radius: .8rem; background: #7c2d12; color: #fff; font-weight: 700; font-size: .9rem; box-shadow: 0 .6rem 1.6rem rgba(0, 0, 0, .4); }
.tv-aviso a { color: #fde68a; }
@media (prefers-reduced-motion: reduce) { body.tv *, body.tv *::before { animation: none !important; transition: none !important; } }

/* Configuração do relatório ao credor */
.crf { display: grid; grid-template-columns: 300px minmax(0, 1fr); gap: 20px; align-items: start; }
.crf-lista { position: sticky; top: 16px; }
.crf-item { display: grid; grid-template-columns: 44px minmax(0, 1fr); gap: 8px 10px; align-items: center; padding: 10px; margin-bottom: 8px; border: 1px solid var(--gray-200); border-left: 4px solid var(--c1); border-radius: 10px; background: #fff; }
.crf-item.ativo { box-shadow: 0 0 0 2px var(--hc-400); }
.crf-item-logo { width: 44px; height: 44px; border-radius: 10px; background: var(--c2); color: #fff; font-weight: 800; font-size: 14px; display: flex; align-items: center; justify-content: center; overflow: hidden; }
.crf-item-logo.img { background: #fff; border: 1px solid var(--gray-200); padding: 4px; }
.crf-item-logo img { max-width: 100%; max-height: 100%; object-fit: contain; }
.crf-item-nome { min-width: 0; line-height: 1.3; }
.crf-item-nome strong { display: block; color: var(--hc-900); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.crf-item-nome small { display: block; color: var(--gray-500); font-size: 11.5px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.crf-item-acoes { grid-column: 1 / -1; display: flex; gap: 6px; }
.crf-item-acoes .btn { flex: 1; }
.crf-form .fieldset:last-of-type { margin-bottom: 0; }
.crf-visual { display: grid; grid-template-columns: minmax(0, 1fr) 320px; gap: 20px; }
.crf-visual > div:first-child { display: flex; flex-direction: column; gap: 14px; }
.crf-cores { display: flex; gap: 16px; flex-wrap: wrap; }
.crf-cor { display: flex; align-items: center; gap: 8px; }
.crf-cor input[type=color] { width: 46px; height: 36px; padding: 2px; cursor: pointer; }
.crf-cor input[type=text] { width: 100px; font-family: Consolas, monospace; }
.crf-cores-acoes { display: flex; gap: 8px; flex-wrap: wrap; }
.crf-placa { display: flex; gap: 8px; align-items: baseline; font-weight: 600; color: var(--gray-700); }
.crf-logo-atual { display: flex; align-items: center; gap: 14px; margin-top: 6px; }
.crf-logo-atual img { max-height: 56px; max-width: 180px; padding: 4px; border: 1px solid var(--gray-200); border-radius: 6px; background: repeating-conic-gradient(#eef0f4 0 25%, #fff 0 50%) 0 0 / 12px 12px; }
.crf-marcar { margin-left: auto; font-weight: 500; font-size: 12px; }
.crf-secoes { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 10px; }
.crf-check { display: grid; grid-template-columns: auto 1fr; gap: 2px 10px; padding: 10px 12px; border: 1px solid var(--gray-200); border-radius: 10px; background: #fff; cursor: pointer; font-weight: 400; }
.crf-check input { grid-row: span 2; margin-top: 3px; }
.crf-check b { font-size: 13px; color: var(--hc-900); }
.crf-check small { font-size: 11.5px; line-height: 1.35; color: var(--gray-500); }
.crf-check:has(input:checked) { border-color: var(--hc-500); background: var(--hc-50); }
/* Taxa de quebra e conteúdo manual do mês */
/* Ações no relatório ao credor: sem a coluna "Ações" (só envios e clientes) */
.rel-credor .rel-canais.sem-acoes .rel-canal { grid-template-columns: 1.6fr 2.6fr .9fr 1.1fr; }
.rel-credor .rel-canais.sem-acoes.sem-comp .rel-canal { grid-template-columns: 1.6fr 2.6fr .9fr; }
@media (max-width: 700px) { .rel-credor .rel-canais.sem-acoes .rel-canal, .rel-credor .rel-canais.sem-acoes.sem-comp .rel-canal { grid-template-columns: 1fr 1fr; } }
body.rel-apresentando .rel-credor .rel-canais.sem-acoes .rel-canal { grid-template-columns: 1.6fr 2.6fr .9fr 1.1fr; }
body.rel-apresentando .rel-credor .rel-canais.sem-acoes.sem-comp .rel-canal { grid-template-columns: 1.6fr 2.6fr .9fr; }
.crf-fontes { margin-bottom: 12px; }
.crf-discador { max-width: 640px; }
.crf-discador input { max-width: 180px; }
.crf-quebra { margin-top: 14px; max-width: 640px; }
.crf-quebra input { max-width: 180px; }
.crf-sub { display: flex; align-items: center; gap: 6px; margin: 18px 0 4px; font-size: 14px; color: var(--hc-900); }
.crf-sub:first-of-type { margin-top: 6px; }
.crf-sub-ajuda { margin: 0 0 10px; }
.crf-man { display: flex; flex-direction: column; gap: 6px; margin-bottom: 8px; }
.crf-man-linha { display: grid; grid-template-columns: minmax(0, 2fr) repeat(2, minmax(0, 1fr)) 38px; gap: 8px; align-items: center; }
.crf-man-linha.cab { font-size: 11px; text-transform: uppercase; letter-spacing: .06em; font-weight: 700; color: var(--gray-500); }
.crf-imgs { display: grid; grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); gap: 10px; margin-bottom: 12px; }
.crf-img { display: flex; flex-direction: column; gap: 6px; padding: 8px; border: 1px solid var(--gray-200); border-radius: 10px; background: #fff; }
.crf-img img { width: 100%; height: 110px; object-fit: contain; background: var(--gray-50, #f8fafc); border-radius: 6px; }
.crf-img:has(input[type=checkbox]:checked) { opacity: .45; }
.crf-slide { padding: 14px; margin-bottom: 10px; border: 1px solid var(--gray-200); border-left: 4px solid var(--hc-500); border-radius: 10px; background: #fff; }
.crf-slide[hidden] { display: none; }
.crf-slide-topo { display: flex; align-items: center; gap: 10px; margin-bottom: 10px; }
.crf-slide-topo strong { color: var(--hc-900); }
.crf-slide-acoes { margin-left: auto; display: flex; gap: 6px; }
@media (max-width: 700px) { .crf-man-linha { grid-template-columns: 1fr 1fr 38px; } .crf-man-linha > input:first-child { grid-column: 1 / -1; } .crf-man-linha.cab { display: none; } }
/* Prévia das cores */
.crf-prev { --p: #2e6bff; --f: #0a1f3d; --sobre: #fff; display: flex; flex-direction: column; gap: 10px; }
.crf-prev-escuro { position: relative; overflow: hidden; min-height: 180px; padding: 16px 18px; border-radius: 12px; background: var(--f); color: #fff; }
.crf-prev-escuro::after { content: ""; position: absolute; width: 170px; height: 170px; right: -60px; bottom: -80px; border-radius: 50%; border: 2px solid var(--p); }
.crf-prev-logo { display: block; max-height: 34px; max-width: 130px; margin-bottom: 14px; object-fit: contain; }
.crf-prev-logo[hidden], .crf-prev-nome[hidden] { display: none; }
.crf-prev.placa .crf-prev-logo { background: #fff; padding: 4px 8px; border-radius: 6px; }
.crf-prev-nome { font-family: "Montserrat", var(--font); font-weight: 800; font-size: 14px; margin-bottom: 14px; }
.crf-prev-olho { font-size: 9px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: color-mix(in srgb, var(--p) 55%, #fff); }
.crf-prev-h { font-family: "Montserrat", var(--font); font-weight: 800; font-size: 21px; line-height: 1.1; margin: 4px 0 12px; }
.crf-prev-h b { color: var(--p); }
.crf-prev-kpi { position: relative; z-index: 1; display: inline-block; padding: 8px 12px; border-radius: 8px; background: var(--p); color: var(--sobre); font-size: 10px; }
.crf-prev-kpi b { display: block; font-family: "Montserrat", var(--font); font-size: 16px; }
.crf-prev-claro { padding: 14px 18px; border-radius: 12px; background: #f4f6f9; border: 1px solid #e1e7f0; }
.crf-prev-claro .crf-prev-olho { color: var(--p); }
.crf-prev-claro .crf-prev-h { color: var(--f); font-size: 16px; margin-bottom: 10px; }
.crf-prev-barras { display: flex; align-items: flex-end; gap: 6px; height: 50px; border-bottom: 1px solid #b8c4d9; }
.crf-prev-barras i { flex: 1; border-radius: 4px 4px 0 0; background: color-mix(in srgb, var(--p) 30%, #fff); }
.crf-prev-barras i:last-child { background: var(--p); }
@media (max-width: 1100px) { .crf { grid-template-columns: 1fr; } .crf-lista { position: static; } .crf-visual { grid-template-columns: 1fr; } }

/* Operadores: alternar cards / lista */
.op-ferramentas { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; }
.op-modo { display: inline-flex; background: var(--gray-100); border-radius: 10px; padding: 3px; }
.op-modo button { border: none; background: transparent; padding: 6px 12px; border-radius: 8px; font-weight: 700; font-size: 12.5px; color: var(--gray-600); cursor: pointer; display: inline-flex; gap: 5px; align-items: center; font-family: inherit; }
.op-modo button.ativo { background: #fff; color: var(--hc-700); box-shadow: var(--shadow-sm); }
.op-tabela tbody tr { cursor: pointer; }
.op-linha-nome { display: flex; gap: 10px; align-items: center; color: inherit; }
.op-linha-nome:hover { text-decoration: none; }
.op-linha-nome:hover strong { color: var(--hc-600); }
.op-avatar.sm { width: 34px; height: 34px; font-size: 12px; }
.op-tabela .op-chip { display: inline-block; margin: 1px 0; }

/* ---------- Recebimentos: cartões por sistema, ordenação e paginação ---------- */
.rc-sis-titulo { display: flex; align-items: center; gap: 10px; margin: 14px 0 8px; font-size: 11px; font-weight: 800; letter-spacing: .07em;
  text-transform: uppercase; color: var(--gray-500); }
.rc-sis-titulo i { flex: 1; height: 1px; background: var(--gray-200); }
.rc-sis-titulo small { font-size: 11px; font-weight: 600; letter-spacing: 0; text-transform: none; color: var(--gray-400); }
.rc-ord { color: inherit; text-decoration: none; white-space: nowrap; display: inline-flex; align-items: center; gap: 4px; }
.rc-ord i { font-style: normal; font-size: 10px; color: var(--gray-400); }
.rc-ord:hover i, .rc-ord.ativo i { color: var(--hc-600); }
.rc-ord.ativo { color: var(--hc-600); }
.rc-paginas { display: flex; align-items: center; justify-content: flex-end; flex-wrap: wrap; gap: 6px; padding: 14px 4px 2px; }
.rc-pag-info { margin-right: auto; font-size: 12.5px; color: var(--gray-500); }
.rc-pag { min-width: 34px; height: 34px; padding: 0 10px; display: inline-flex; align-items: center; justify-content: center; border: 1px solid var(--gray-200);
  border-radius: 8px; background: var(--white); color: var(--gray-700); font-weight: 600; font-size: 13px; text-decoration: none; }
.rc-pag:hover { border-color: var(--hc-600); color: var(--hc-600); }
.rc-pag.atual { background: var(--hc-600); border-color: var(--hc-600); color: #fff; }
.rc-pag.off { opacity: .4; pointer-events: none; }
.rc-pag-gap { color: var(--gray-400); padding: 0 2px; }

/* ---------- Abas de módulo (páginas agrupadas num item do menu) ---------- */
.modulo-abas { display: flex; gap: 4px; flex-wrap: wrap; margin: -4px 0 18px; border-bottom: 1px solid var(--gray-200); }
.modulo-abas a { display: inline-flex; align-items: center; gap: 7px; padding: 10px 14px; color: var(--gray-500); font-weight: 600; font-size: 13.5px;
  border-bottom: 2px solid transparent; margin-bottom: -1px; text-decoration: none; white-space: nowrap; }
.modulo-abas a:hover { color: var(--hc-600); }
.modulo-abas a.ativo { color: var(--hc-600); border-bottom-color: var(--hc-600); }
.modulo-badge { background: var(--danger); color: #fff; border-radius: 999px; font-size: 10.5px; font-weight: 800; padding: 1px 7px; }

/* ---------- Dashboard: objetivos e atividades do mês ---------- */
.dash-bloco { background: var(--gray-50); border-radius: var(--radius); padding: 10px 12px; margin-bottom: 8px; font-size: 13px; }
.dash-bloco strong { display: block; font-size: 11.5px; text-transform: uppercase; letter-spacing: .05em; color: var(--gray-500); margin-bottom: 4px; }
.dash-bloco p { margin: 0; line-height: 1.55; }
.dash-bloco.risco { background: var(--warning-bg); }
.dash-bloco.risco strong { color: var(--warning); }
.dash-tarefas { display: grid; gap: 6px; }
.dash-tarefa { display: flex; align-items: center; gap: 10px; padding: 8px 10px; border: 1px solid var(--gray-200); border-radius: var(--radius); color: inherit; text-decoration: none; }
.dash-tarefa:hover { border-color: var(--hc-400, #5b8fd6); text-decoration: none; }
.dash-tarefa.atrasada { border-left: 3px solid var(--danger); }
.dash-tarefa-data { font-size: 12px; color: var(--gray-500); width: 84px; flex-shrink: 0; }
.dash-tarefa-tit { flex: 1; min-width: 0; font-weight: 600; font-size: 13px; }
.dash-tarefa-tit small { display: block; font-weight: 400; color: var(--gray-500); font-size: 11.5px; }

/* ---------- Tela inicial (Dashboard) ---------- */
.ini-hero {
  position: relative; overflow: hidden; display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(320px, 1fr); gap: 32px; align-items: center;
  background: #0a1f3d url('../img/rel_fundo.jpg') center / cover; color: #eaeef3; border-radius: 18px; padding: 34px 38px; margin-bottom: 16px;
  box-shadow: 0 10px 28px rgba(10, 31, 61, .18);
}
.ini-anel { position: absolute; border-radius: 50%; border: 3px solid #2e6bff; pointer-events: none; }
.ini-anel.um { width: 340px; height: 340px; right: -120px; top: -150px; opacity: .8; }
.ini-anel.dois { width: 130px; height: 130px; left: 46%; bottom: -70px; border-width: 2px; border-color: rgba(91, 141, 255, .5); }
.ini-hero-txt { position: relative; z-index: 1; min-width: 0; }
.ini-data { font-size: 12.5px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: #5b8dff; }
.ini-hero h1 { font-family: "Montserrat", var(--font); font-weight: 800; font-size: 36px; line-height: 1.1; letter-spacing: -.01em; margin: 8px 0 12px; color: #fff; }
.ini-hero h1 b { color: #2e6bff; }
.ini-hero p { margin: 0; font-size: 15px; line-height: 1.6; color: #c9d6ee; max-width: 620px; }
.ini-hero p strong { color: #fff; }
.ini-atalhos { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 20px; }
.ini-atalhos a { display: inline-flex; align-items: center; gap: 7px; padding: 7px 14px; border-radius: 999px; font-size: 13px; font-weight: 600; color: #eaeef3; background: rgba(255, 255, 255, .08); border: 1px solid rgba(121, 165, 242, .3); text-decoration: none; transition: background .15s, border-color .15s; }
.ini-atalhos a:hover { background: rgba(46, 107, 255, .35); border-color: #5b8dff; text-decoration: none; }
.ini-ritmo { position: relative; z-index: 1; background: rgba(10, 31, 61, .55); border: 1px solid rgba(121, 165, 242, .25); border-radius: 16px; padding: 20px 22px; backdrop-filter: blur(3px); }
.ini-ritmo-top { display: flex; justify-content: space-between; align-items: center; gap: 10px; }
.ini-ritmo-top span { display: inline-flex; align-items: center; gap: 7px; font-size: 12px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: #79a5f2; }
.ini-ritmo-top small { font-size: 12px; color: #b8c4d9; }
.ini-ritmo-pct { display: flex; align-items: baseline; gap: 6px; font-family: "Montserrat", var(--font); font-weight: 800; font-size: 46px; line-height: 1; color: #fff; margin: 12px 0 14px; }
.ini-ritmo-pct small { font-size: 24px; color: #5b8dff; }
.ini-ritmo-pct span { font-family: var(--font); font-size: 13px; font-weight: 500; color: #b8c4d9; margin-left: 6px; }
.ini-barra { position: relative; height: 14px; background: rgba(255, 255, 255, .12); border-radius: 99px; }
.ini-barra span { position: absolute; left: 0; top: 0; bottom: 0; border-radius: 99px; }
.ini-barra .real { background: linear-gradient(90deg, #2e6bff, #5b8dff); }
.ini-barra .proj { background: rgba(121, 165, 242, .35); }
.ini-barra i { position: absolute; top: -5px; bottom: -5px; width: 3px; border-radius: 2px; transform: translateX(-50%); }
.ini-barra i.ideal { background: #fff; }
.ini-barra i.meta { background: #f2c14e; }
.ini-ritmo-legenda { display: flex; justify-content: space-between; gap: 10px; font-size: 11.5px; color: #b8c4d9; margin-top: 8px; }
.ini-ritmo-nums { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; margin-top: 16px; padding-top: 14px; border-top: 1px solid rgba(121, 165, 242, .2); }
.ini-ritmo-nums small { display: block; font-size: 11px; color: #b8c4d9; }
.ini-ritmo-nums b { font-size: 14.5px; color: #fff; white-space: nowrap; }
.ini-ritmo-vazio p { color: #c9d6ee; margin: 14px 0 12px; }

.ini-alertas { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-bottom: 16px; }
.ini-alertas-tit { font-size: 11.5px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: var(--gray-500); margin-right: 4px; }
.ini-alerta { display: inline-flex; align-items: center; gap: 7px; padding: 6px 12px; border-radius: 999px; font-size: 12.5px; font-weight: 600; text-decoration: none; border: 1px solid transparent; }
.ini-alerta:hover { text-decoration: none; filter: brightness(.97); }
.ini-alerta.warn { background: var(--warning-bg); color: var(--warning); border-color: #f0d7aa; }
.ini-alerta.danger { background: var(--danger-bg); color: var(--danger); border-color: #f1c4bd; }
.ini-alerta.ok { background: var(--success-bg); color: var(--success); }
.ini-alerta.festa { background: #eef3ff; color: #2e5bd6; border-color: #cfdcff; }

.ini-kpis { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; margin-bottom: 16px; }
.ini-kpi { position: relative; display: grid; grid-template-columns: auto 1fr; grid-template-rows: auto auto auto; column-gap: 14px; row-gap: 2px; align-items: center;
  background: #fff; border: 1px solid var(--gray-200); border-radius: 16px; padding: 18px 18px 16px; color: inherit; text-decoration: none; box-shadow: var(--shadow-sm); transition: transform .15s, box-shadow .15s, border-color .15s; }
.ini-kpi:hover { transform: translateY(-2px); box-shadow: var(--shadow); border-color: #c9d6ee; text-decoration: none; }
.ini-kpi-ic { grid-row: span 2; width: 46px; height: 46px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; border: 2px solid currentColor; }
.ini-kpi-ic.verde { color: #16a34a; background: #effaf3; }
.ini-kpi-ic.azul { color: #2e6bff; background: #eef3ff; }
.ini-kpi-ic.roxo { color: #7c3aed; background: #f4efff; }
.ini-kpi-ic.laranja { color: #ea7a0c; background: #fff4ea; }
.ini-kpi-lbl { font-size: 11.5px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--gray-500); align-self: end; }
.ini-kpi-val { font-family: "Montserrat", var(--font); font-size: clamp(19px, 1.6vw, 24px); font-weight: 800; color: #0a1f3d; letter-spacing: -.01em; white-space: normal; overflow-wrap: anywhere; line-height: 1.2; align-self: start; }
.ini-kpi-rod { grid-column: 1 / -1; display: flex; align-items: center; flex-wrap: wrap; gap: 6px; margin-top: 10px; padding-top: 10px; border-top: 1px solid var(--gray-100); }
.ini-kpi-rod small { font-size: 11.5px; color: var(--gray-500); }

.ini-acoes-tot { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; margin-bottom: 14px; }
.ini-acoes-tot div { background: var(--gray-50); border-radius: 12px; padding: 10px 12px; }
.ini-acoes-tot b { display: block; font-family: "Montserrat", var(--font); font-size: 20px; font-weight: 800; color: #0a1f3d; }
.ini-acoes-tot span { display: flex; align-items: center; flex-wrap: wrap; gap: 6px; font-size: 12px; color: var(--gray-500); }
.ini-canais { display: grid; gap: 4px; }
.ini-canal { display: grid; grid-template-columns: auto minmax(0, 1.2fr) minmax(0, 1fr) auto; gap: 12px; align-items: center; padding: 8px 2px; border-bottom: 1px solid var(--gray-100); }
.ini-canal:last-child { border-bottom: none; }
.ini-canal-ic { width: 32px; height: 32px; border-radius: 50%; border: 2px solid #2e6bff; color: #2e6bff; display: inline-flex; align-items: center; justify-content: center; }
.ini-canal-nome { font-weight: 700; font-size: 13.5px; color: var(--gray-800); min-width: 0; }
.ini-canal-nome small { display: block; font-weight: 400; font-size: 11.5px; color: var(--gray-500); }
.ini-canal-barra { height: 8px; background: var(--gray-100); border-radius: 99px; overflow: hidden; }
.ini-canal-barra b { display: block; height: 100%; border-radius: 99px; background: linear-gradient(90deg, #2e6bff, #5b8dff); }
.ini-canal strong { font-size: 14px; color: #0a1f3d; min-width: 48px; text-align: right; }

.ini-prog { height: 6px; background: var(--gray-100); border-radius: 99px; margin: -4px 0 12px; overflow: hidden; }
.ini-prog span { display: block; height: 100%; background: var(--success); border-radius: 99px; }

.ini-equipe { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; }
.ini-equipe a { background: var(--gray-50); border-radius: 12px; padding: 12px; color: inherit; text-decoration: none; border: 1px solid transparent; }
.ini-equipe a:hover { border-color: #c9d6ee; text-decoration: none; }
.ini-equipe b { display: block; font-family: "Montserrat", var(--font); font-size: 22px; font-weight: 800; color: #0a1f3d; }
.ini-equipe span { font-size: 12px; color: var(--gray-500); }
.ini-aniv { margin-top: 16px; padding-top: 14px; border-top: 1px solid var(--gray-100); }
.ini-aniv strong { display: inline-flex; align-items: center; gap: 6px; font-size: 11.5px; letter-spacing: .06em; text-transform: uppercase; color: var(--gray-500); }
.ini-aniv-lista { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }
.ini-aniv-lista span { font-size: 12.5px; font-weight: 600; background: #eef3ff; color: #1f3f86; padding: 4px 10px; border-radius: 999px; }
.ini-aniv-lista span small { color: #3d5fa8; font-weight: 500; }
.ini-aniv-lista span.hoje { background: #2e6bff; color: #fff; }
.ini-aniv-lista span.hoje small { color: #dbe6ff; }

.ini-feed { display: grid; gap: 4px; }
.ini-feed a { display: flex; align-items: center; gap: 12px; padding: 8px 6px; border-radius: 10px; color: inherit; text-decoration: none; }
.ini-feed a:hover { background: var(--gray-50); text-decoration: none; }
.ini-feed-av { width: 34px; height: 34px; border-radius: 50%; background: #0a1f3d; color: #fff; display: inline-flex; align-items: center; justify-content: center; font-weight: 800; font-size: 13px; flex-shrink: 0; }
.ini-feed-txt { flex: 1; min-width: 0; font-size: 13.5px; }
.ini-feed-txt small { display: block; font-size: 11.5px; color: var(--gray-500); }
.ini-feed-nota { font-weight: 800; font-size: 13px; color: #2e6bff; background: #eef3ff; padding: 3px 10px; border-radius: 999px; }

/* Dashboard: textos auxiliares, foco visível e alvos de clique */
.ini-atrasadas { color: var(--danger); font-weight: 700; }
.ini-vazio { padding: 22px; }
.ini-mais { margin: 8px 0 0; }
.ini-aniv-vazio { margin: 6px 0 0; }
.ini-cal-nav { display: flex; gap: 6px; }
.dash-tarefa:hover { background: var(--hc-50); }
.ini-kpi:focus-visible, .ini-equipe a:focus-visible, .ini-feed a:focus-visible, .dash-tarefa:focus-visible, .ini-alerta:focus-visible {
  outline: 2px solid var(--hc-500); outline-offset: 2px;
}
.ini-atalhos a:focus-visible, .ini-hero a:focus-visible { outline: 2px solid #79a5f2; outline-offset: 2px; }
.ini-ritmo-nums b { white-space: normal; overflow-wrap: anywhere; }

/* ---------- Relatório do Dia ---------- */
.dia-hero { grid-template-columns: minmax(0, 1.3fr) auto; }
.dia-escolher { display: inline-flex; align-items: center; gap: 6px; padding: 3px 6px 3px 12px; border-radius: 999px; background: rgba(255, 255, 255, .08); border: 1px solid rgba(121, 165, 242, .3); color: #eaeef3; }
.dia-escolher input { width: auto; padding: 3px 6px; border: none; border-radius: 999px; background: rgba(255, 255, 255, .92); font-size: 12.5px; }
.dia-medidores { position: relative; z-index: 1; display: flex; gap: 18px; }
.dia-medidor { position: relative; width: 170px; text-align: center; background: rgba(10, 31, 61, .55); border: 1px solid rgba(121, 165, 242, .25); border-radius: 16px; padding: 16px 12px 14px; }
.dia-medidor svg { width: 116px; height: 116px; transform: rotate(-90deg); }
.dia-medidor circle { fill: none; stroke-width: 10; }
.dia-medidor .trilho { stroke: rgba(255, 255, 255, .12); }
.dia-medidor .valor { stroke: #2e6bff; stroke-linecap: round; transition: stroke-dasharray .6s; }
.dia-medidor .valor.ok { stroke: #34d399; }
.dia-medidor-txt { position: absolute; top: 16px; left: 0; right: 0; height: 116px; display: flex; flex-direction: column; align-items: center; justify-content: center; }
.dia-medidor-txt b { font-family: "Montserrat", var(--font); font-size: 28px; font-weight: 800; color: #fff; line-height: 1; }
.dia-medidor-txt small { font-size: 11.5px; color: #b8c4d9; margin-top: 4px; }
.dia-medidor-rot strong { display: block; margin-top: 8px; font-size: 12px; letter-spacing: .08em; text-transform: uppercase; color: #79a5f2; }
.dia-medidor-rot span { font-size: 11.5px; color: #c9d6ee; }
.dia-de { font-size: 14px; color: var(--gray-500); font-weight: 600; }
.ini-atalhos a.dia-png-btn { background: #2e6bff; border-color: #2e6bff; color: #fff; }
.ini-atalhos a.dia-png-btn:hover { background: #1f4fd1; }
.dia-png-prev { max-height: calc(62 * var(--vh)); overflow: auto; border: 1px solid var(--gray-200); border-radius: 12px; background: var(--gray-50); }
.dia-png-prev img { display: block; width: 100%; height: auto; }

.dia-horas { display: flex; gap: 6px; height: 170px; align-items: stretch; padding-top: 8px; }
.dia-hora { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.dia-hora-area { position: relative; flex: 1; display: flex; flex-direction: column; justify-content: flex-end; align-items: center; border-bottom: 1px solid var(--gray-300); }
.dia-hora-barra { width: min(34px, 76%); background: #c5d5f7; border-radius: 6px 6px 0 0; }
.dia-hora.pico .dia-hora-barra { background: linear-gradient(180deg, #5b8dff, #2e6bff); }
.dia-hora.futuro .dia-hora-barra { opacity: .35; }
.dia-hora-ac { margin-bottom: 4px; min-width: 20px; height: 20px; padding: 0 5px; border-radius: 999px; background: #7c3aed; color: #fff; font-size: 11px; font-weight: 800; display: inline-flex; align-items: center; justify-content: center; }
.dia-hora small { text-align: center; font-size: 11px; color: var(--gray-500); padding-top: 5px; }
.dia-horas-leg { display: flex; gap: 16px; font-size: 12px; color: var(--gray-500); margin-top: 10px; }
.dia-horas-leg i { display: inline-block; width: 11px; height: 11px; border-radius: 3px; margin-right: 6px; vertical-align: -1px; }
.dia-horas-leg i.barra { background: #5b8dff; }
.dia-horas-leg i.ac { background: #7c3aed; border-radius: 50%; }

.dia-ops { display: grid; }
.dia-op { display: grid; grid-template-columns: minmax(190px, 1.6fr) minmax(130px, 1fr) minmax(130px, 1fr) minmax(90px, .7fr) 100px 120px; gap: 16px; align-items: center; padding: 11px 6px; border-bottom: 1px solid var(--gray-100); font-size: 13.5px; }
.dia-op:hover:not(.cab) { background: var(--gray-50); }
.dia-op.cab { font-size: 10.5px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--gray-500); padding-top: 4px; }
.dia-op.total { border-bottom: none; border-top: 2px solid var(--gray-200); background: var(--gray-50); border-radius: 0 0 10px 10px; }
.dia-op .num { text-align: right; }
.dia-op .num small { display: block; font-size: 11px; color: var(--gray-500); }
.dia-op-nome { display: flex; align-items: center; gap: 10px; min-width: 0; }
.dia-op-nome small { display: block; font-size: 11.5px; color: var(--gray-500); }
.dia-av { flex-shrink: 0; width: 32px; height: 32px; border-radius: 50%; background: #0a1f3d; color: #fff; font-style: normal; font-weight: 800; font-size: 13px; display: inline-flex; align-items: center; justify-content: center; }
.dia-av.p1 { background: linear-gradient(135deg, #e3bd5b, #b8902c); }
.dia-av.p2 { background: linear-gradient(135deg, #b9c3d0, #8793a3); }
.dia-av.p3 { background: linear-gradient(135deg, #cf8f5c, #a2653a); }
.dia-meta b { font-family: "Montserrat", var(--font); font-size: 16px; color: #0a1f3d; }
.dia-meta small { font-size: 12px; color: var(--gray-500); }
.dia-meta small em { font-style: normal; font-size: 10.5px; background: var(--gray-100); border-radius: 999px; padding: 0 6px; }
.dia-trilho { display: block; height: 6px; background: var(--gray-100); border-radius: 99px; margin-top: 5px; overflow: hidden; max-width: 150px; }
.dia-trilho em { display: block; height: 100%; background: #2e6bff; border-radius: 99px; }
.dia-trilho em.ok { background: var(--success); }
.dia-op-aviso { grid-column: span 4; font-size: 12.5px; }
.dia-op-aviso a { color: var(--gray-500); display: inline-flex; align-items: center; gap: 6px; }
.dia-op.sem-vinculo { opacity: .75; }

/* ---------- Carteiras ---------- */
button.ini-alerta { font: inherit; font-size: 12.5px; font-weight: 600; cursor: pointer; }
.cart-barra { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; margin-bottom: 6px; }
.cart-barra .search { max-width: 340px; flex: 1; }
.cart-seg { display: inline-flex; background: var(--gray-100); border-radius: 12px; padding: 4px; gap: 2px; }
.cart-seg button { border: none; background: none; font: inherit; font-size: 13px; font-weight: 600; color: var(--gray-600); padding: 7px 14px; border-radius: 9px; cursor: pointer; display: inline-flex; align-items: center; gap: 7px; }
.cart-seg button span { font-size: 11px; background: var(--gray-200); color: var(--gray-600); border-radius: 999px; padding: 0 7px; }
.cart-seg button.ativo { background: #fff; color: #0a1f3d; box-shadow: var(--shadow-sm); }
.cart-seg button.ativo span { background: #2e6bff; color: #fff; }
.cart-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(290px, 1fr)); gap: 14px; margin-bottom: 8px; }
.cart-card {
  position: relative; display: flex; flex-direction: column; gap: 12px; text-align: left; width: 100%;
  background: #fff; border: 1px solid var(--gray-200); border-radius: 16px; padding: 16px 18px 14px; font: inherit; color: inherit; cursor: pointer;
  box-shadow: var(--shadow-sm); transition: transform .15s, box-shadow .15s, border-color .15s; overflow: hidden;
}
.cart-card::before { content: ""; position: absolute; top: 0; left: 18px; right: 18px; height: 3px; border-radius: 0 0 4px 4px; background: var(--cor); }
.cart-card:hover { transform: translateY(-2px); box-shadow: var(--shadow); border-color: color-mix(in srgb, var(--cor) 40%, #fff); }
.cart-card.inativa { background: var(--gray-50); opacity: .7; }
.cart-card.inativa::before { background: var(--gray-300); }
.cart-card-top { display: flex; justify-content: space-between; align-items: center; gap: 8px; }
.cart-card-nome { font-family: "Montserrat", var(--font); font-weight: 800; font-size: 15.5px; color: #0a1f3d; }
.cart-card-edit { color: var(--gray-400); opacity: 0; transition: opacity .15s; }
.cart-card:hover .cart-card-edit { opacity: 1; }
.cart-card-tags { display: flex; flex-wrap: wrap; gap: 5px; margin-top: -6px; }
.cart-card-tags:empty { display: none; }
.cart-card-tags i { font-style: normal; font-size: 10.5px; font-weight: 700; letter-spacing: .03em; padding: 2px 8px; border-radius: 999px; background: var(--gray-100); color: var(--gray-600); }
.cart-card-tags i.cod { background: color-mix(in srgb, var(--cor) 12%, #fff); color: color-mix(in srgb, var(--cor) 80%, #000); }
.cart-card-tags i.alerta { background: var(--danger-bg); color: var(--danger); }
.cart-card-resp { display: flex; align-items: center; gap: 10px; padding: 10px 12px; border-radius: 12px; background: var(--gray-50); }
.cart-card-resp strong { display: block; font-size: 13.5px; color: var(--gray-800); }
.cart-card-resp small { display: block; font-size: 11.5px; color: var(--gray-500); }
.cart-card-resp.falta { background: var(--warning-bg); }
.cart-card-resp.falta strong { color: var(--warning); }
.cart-card-resp .dia-av { width: 30px; height: 30px; font-size: 12px; background: var(--cor); }
.cart-card-resp .dia-av.vazio { background: #fff; color: var(--warning); border: 1.5px dashed currentColor; }
.cart-card-meta { display: grid; gap: 8px; }
.cart-card-val { font-family: "Montserrat", var(--font); font-size: 20px; font-weight: 800; color: #0a1f3d; }
.cart-card-val small { display: block; font-family: var(--font); font-size: 11.5px; font-weight: 500; color: var(--gray-500); }
.cart-card-val .muted { font-family: var(--font); font-size: 14px; font-weight: 600; }
.cart-card-prog i { position: relative; display: block; height: 7px; background: var(--gray-100); border-radius: 99px; }
.cart-card-prog em { display: block; height: 100%; border-radius: 99px; background: #2e6bff; }
.cart-card-prog em.ok { background: var(--success); }
.cart-card-prog em.atencao { background: #d79a2e; }
.cart-card-prog em.ruim { background: var(--danger); }
.cart-card-prog b { position: absolute; top: -3px; bottom: -3px; width: 2px; background: #0a1f3d; border-radius: 2px; }
.cart-card-prog small { display: block; font-size: 11.5px; color: var(--gray-500); margin-top: 4px; }
.cart-card-rod { display: flex; flex-wrap: wrap; gap: 6px 14px; padding-top: 10px; border-top: 1px solid var(--gray-100); font-size: 12.5px; font-weight: 700; color: var(--gray-700); }
.cart-card-rod span { display: inline-flex; align-items: center; gap: 5px; }
.cart-card-rod .icon-svg { color: var(--gray-400); }
.cart-card-rod small { font-weight: 500; color: var(--gray-500); }
.cart-ajuda { margin: 8px 0 16px; }
.cart-sugs { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 10px; }
.cart-sug { display: flex; align-items: center; gap: 12px; padding: 10px 12px; border: 1px dashed var(--gray-300); border-radius: 12px; }
.cart-sug-cod { font-family: "Montserrat", var(--font); font-weight: 800; font-size: 13px; color: #0a1f3d; background: #eef3ff; padding: 5px 10px; border-radius: 8px; }
.cart-sug-info { flex: 1; min-width: 0; font-size: 12.5px; color: var(--gray-600); }
.cart-sug-info small { display: block; color: var(--gray-500); }

/* ---------- Parciais (retoques) ---------- */
.rc-kpis-novo { margin-bottom: 14px; }
.rc-secao h2 { display: inline-flex; align-items: center; gap: 8px; }
.rc-vazio-ic { width: 58px; height: 58px; margin: 0 auto 8px; border-radius: 50%; border: 2px solid #2e6bff; color: #2e6bff; display: flex; align-items: center; justify-content: center; }
.rc-cart { border-radius: 16px; }
.rc-cart-val { font-family: "Montserrat", var(--font); }
.rc-pend summary { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }

@media (max-width: 1280px) { .ini-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 1100px) {
  .dia-hero { grid-template-columns: 1fr; }
  .dia-op { grid-template-columns: 1.4fr 1fr 1fr; }
  .dia-op.cab { display: none; }
  .dia-op-aviso { grid-column: span 2; }
}
@media print { .ini-hero, .ini-hero *, .ini-kpi-ic, .dia-av, .dia-trilho em, .dia-hora-barra, .dia-hora-ac { -webkit-print-color-adjust: exact; print-color-adjust: exact; } .ini-kpi, .dia-op { break-inside: avoid; } }
@media (max-width: 560px) { .dia-medidores { flex-wrap: wrap; } .dia-medidor { width: calc(50% - 9px); } .dia-op { grid-template-columns: 1fr 1fr; } }
@media (max-width: 900px) {
  .ini-hero { grid-template-columns: 1fr; padding: 26px 22px; }
  .ini-anel.dois { display: none; }
  .ini-equipe { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 560px) {
  .ini-hero h1 { font-size: 28px; }
  .ini-kpis, .ini-acoes-tot { grid-template-columns: 1fr; }
  .ini-ritmo-nums { grid-template-columns: 1fr 1fr; }
}

/* ---------- Perfil do operador: situações × carteiras ---------- */
.op-prod-grid { gap: 16px; margin-top: 8px; }
.op-sit-label { width: 140px; font-size: 11.5px; }
@media (max-width: 1200px) and (min-width: 601px) { .grid-2.op-prod-grid { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); } }

/* =====================================================================
   Celular (até 600px). Vem por último para valer sobre as regras de
   cada tela — inclusive larguras fixas escritas direto no HTML.
   ===================================================================== */
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
@media (max-width: 600px) {
  /* Campos com 16px: abaixo disso o iPhone dá zoom ao tocar no campo */
  input, select, textarea { font-size: 16px; }
  .lg-input input { font-size: 16px; }

  /* Topo: título numa linha, botões da página logo abaixo, rolando para o lado */
  .topbar { min-height: 56px; padding: 10px 12px; gap: 8px; }
  .topbar h1 { font-size: 17px; }
  .menu-toggle { margin-right: 10px; }
  .page-actions { width: 100%; flex-wrap: nowrap; justify-content: flex-start; overflow-x: auto; -webkit-overflow-scrolling: touch; scrollbar-width: none; padding-bottom: 2px; }
  .page-actions::-webkit-scrollbar { display: none; }
  .content { padding: 14px 12px 40px; }

  /* Abas: uma linha só, rolando para o lado */
  .modulo-abas, .tabs { flex-wrap: nowrap; overflow-x: auto; -webkit-overflow-scrolling: touch; scrollbar-width: none; }
  .modulo-abas::-webkit-scrollbar, .tabs::-webkit-scrollbar { display: none; }
  .modulo-abas a { padding: 9px 11px; font-size: 13px; }

  /* Cards e títulos */
  .card { padding: 14px 12px; border-radius: 12px; margin-bottom: 14px; }
  .card-header { margin-bottom: 12px; padding-bottom: 10px; }
  .card-header > :not(h2) { max-width: 100%; }
  .kpi-grid { gap: 10px; margin-bottom: 14px; }
  .kpi-grid > .kpi-card, .kpi-grid > .kpi-card.wide, .card .kpi-grid > .kpi-card { flex: 1 1 calc(50% - 10px); }
  .kpi-card { padding: 12px 13px; }
  .kpi-card .value { font-size: 18px; white-space: normal; overflow-wrap: anywhere; }

  /* Tabelas: rolam dentro do card, com a borda do card como limite */
  .table-wrap { margin: 0 -12px; padding: 0 12px; }
  table { font-size: 12.5px; }
  tbody td { padding: 9px 8px; }
  thead th { padding: 0 8px 8px; }
  td select:not(.badge) { min-width: 140px; }

  /* Filtros e formulários: um campo por linha (vence larguras fixas do HTML) */
  .toolbar, .toolbar form, .inline-form { align-items: stretch; }
  .toolbar .search, .toolbar select, .toolbar input[type=date], .toolbar input[type=month] { flex: 1 1 100%; min-width: 0; max-width: none; width: 100%; }
  .toolbar .btn, .toolbar form .btn { flex: 1 1 auto; }
  form .form-field[style], .ac-filtros .form-field, .ac-filtros > * { width: 100% !important; min-width: 0 !important; max-width: none !important; flex: 1 1 100%; }
  .search[style], select[style*="min-width"], .upload-block[style] { max-width: none !important; min-width: 0 !important; width: 100%; }
  div[style*="min-width:220px"], div[style*="min-width: 220px"] { min-width: 0 !important; flex-basis: 100% !important; }
  .sel-carteira { min-width: 0; width: 100%; }
  .form-actions .btn { flex: 1 1 auto; }
  .op-barra .search, .cart-barra .search { max-width: none; flex: 1 1 100%; }
  .rc-barra, .op-barra, .cart-barra { align-items: stretch; }
  .rc-filtros { width: 100%; }
  .rc-agente { flex-wrap: wrap; }
  .rc-agente select { max-width: none; flex: 1 1 100%; }

  /* Modais: ocupam quase a tela toda e respeitam a barra do navegador */
  .modal-overlay { padding: 10px; align-items: flex-end; }
  .modal-card { max-height: calc(100dvh - 20px); padding: 20px 16px 16px; border-radius: 16px; }
  .modal-card.lg, .modal-card[style] { max-width: none !important; }

  /* Barras "rótulo — barra — valor" */
  .bar-label, .op-sit-label { width: 96px; }
  .bar-value { min-width: 40px; }

  /* Perfil do operador */
  .op-perfil { gap: 12px; }
  .op-avatar.lg { width: 52px; height: 52px; font-size: 18px; }
  .op-perfil-info { min-width: 0; flex-basis: calc(100% - 64px); }
  .op-perfil-nome { font-size: 17px; }
  .op-perfil-linha { gap: 6px 14px; }
  .op-perfil-acoes { width: 100%; }
  .op-perfil-acoes .btn { flex: 1 1 auto; }
  .op-grid, .team-grid, .cart-grid, .cart-sugs, .rc-carteiras, .rc-agentes { grid-template-columns: minmax(0, 1fr); }
  .op-salvar { flex-wrap: wrap; padding: 10px 12px; }

  /* Controle de Ações / campanhas */
  .camp-box { padding: 14px 12px; }
  .camp-title, .camp-export .pasta-destino { min-width: 0; flex-basis: 100%; }
  .camp-stats, .hig-motivos, .sys-hero, .sys-drops, .plan-metas-guia { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .hig-motivos, .sys-drops, .plan-metas-guia { grid-template-columns: minmax(0, 1fr); }
  .sys-tile-v { font-size: 24px; }

  /* Parciais de recebimento */
  .rc-kpis { grid-template-columns: minmax(0, 1fr); gap: 10px; }
  .rc-kpi { padding: 13px 14px; }
  .rc-graf { height: 190px; }
  .rc-graf-col small { font-size: 9.5px; }
  .rc-dica { white-space: normal; max-width: 220px; }

  /* Dashboard e Relatório do dia */
  .ini-hero { padding: 22px 16px; border-radius: 14px; gap: 18px; }
  .ini-hero p { font-size: 14px; }
  .ini-atalhos { gap: 6px; }
  .ini-atalhos a { padding: 6px 11px; font-size: 12.5px; }
  .ini-ritmo { padding: 16px; }
  .ini-ritmo-pct { font-size: 38px; }
  .ini-canal { grid-template-columns: auto minmax(0, 1fr) auto; }
  .ini-canal-barra { grid-column: 2 / -1; grid-row: 2; }
  .dia-medidores { gap: 10px; }
  .dia-medidor { width: calc(50% - 5px); padding: 12px 8px; }
  .dia-medidor svg { width: 100%; max-width: 116px; height: auto; }
  .dia-medidor-txt { top: 12px; height: auto; aspect-ratio: 1; max-height: 116px; left: 50%; right: auto; width: min(116px, calc(100% - 16px)); transform: translateX(-50%); }
  .dia-medidor-txt b { font-size: 24px; }
  .dia-horas { gap: 2px; height: 150px; }
  .dia-hora small { font-size: 9.5px; }
  .dia-hora-ac { min-width: 16px; height: 16px; font-size: 9.5px; padding: 0 3px; }
  .dia-op { grid-template-columns: 1fr 1fr; gap: 8px 12px; padding: 12px 4px; }
  .dia-op-nome, .dia-op-aviso, .dia-op.total > span:first-child { grid-column: 1 / -1; }
  .dia-op .num { text-align: left; }
  .dia-trilho { max-width: none; }

  /* Planejamento */
  .period-nav .period-label { min-width: 0; flex: 1 1 auto; }
  .dash-tarefa-data { width: 64px; }

  /* Relatórios (slides) */
  .rel-kpi-val { font-size: 22px; white-space: normal; }
  .rel-kpi.destaque .rel-kpi-val { font-size: 30px; }
  .rel-kpi { padding: 14px 16px; }
  .rel-card { padding: 16px 14px; }
  .rel-colunas { gap: 4px; height: 200px; }
  .rel-col-val { font-size: 9.5px; }
  .rel-col-rot { font-size: 10.5px; }
  .rel-destaque-num { font-size: 56px; }
  .rel-faixa b { font-size: 28px; }
  .rel-evol-resumo b { font-size: 24px; }

  /* Espelho (sala 3D) */
  .sala-barra { padding: 10px 12px; gap: 10px; }
  .sala-relogio strong { font-size: 24px; }
  .sala-linha { min-width: 0; flex-basis: 100%; }
  .sala-palco { height: 460px; }
  .sala-painel { left: 8px; right: 8px; top: 8px; bottom: 8px; }
  .sala-dica { display: none; }
  .espelho-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }

  /* Login */
  .lg-form { padding: 20px 14px; }
  .lg-form h2 { font-size: 26px; }

  /* Aviso de sincronização não cobre o conteúdo inteiro */
  .sync-toast { left: 12px; right: 12px; bottom: 12px; text-align: center; border-radius: 12px; }
  .sync-toast-2 { bottom: 58px; }
}
@media (max-width: 380px) {
  .kpi-grid > .kpi-card, .kpi-grid > .kpi-card.wide, .card .kpi-grid > .kpi-card { flex-basis: 100%; }
  .camp-stats, .sys-hero { grid-template-columns: minmax(0, 1fr); }
  .espelho-grid { grid-template-columns: minmax(0, 1fr); }
  .dia-medidor { width: 100%; }
}

/* ---------- Operadores ---------- */
.op-filtros { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; margin: -6px 0 16px; }
.op-filtros .search { flex: 1 1 220px; max-width: 320px; }
.op-filtros select { width: auto; max-width: 230px; }
.op-chip[style*="--cc"] { display: inline-flex; align-items: center; gap: 5px; }
.op-chip[style*="--cc"]::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: var(--cc); }
.op-meta { background: var(--gray-50); border-radius: 10px; padding: 8px 10px; margin-bottom: 10px; }
.op-meta-top { display: flex; justify-content: space-between; align-items: baseline; gap: 8px; margin-bottom: 5px; font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: var(--gray-500); }
.op-meta-top strong { font-size: 14px; color: var(--hc-900); text-transform: none; letter-spacing: 0; }
.op-meta-rod { font-size: 11.5px; color: var(--gray-600); margin-top: 5px; display: flex; align-items: center; gap: 6px; }
.op-meta-rod .pct-pill { min-width: 0; }
.op-dados dd small { font-size: 10.5px; font-weight: 700; }
.op-fb { margin-top: 10px; font-size: 11.5px; color: var(--gray-500); display: flex; align-items: center; gap: 5px; flex-wrap: wrap; }
.op-fb.alerta { color: var(--warning); font-weight: 700; }
/* Cards da equipe: 3 por linha, com o conteúdo lado a lado (menos altura) */
.op-grid.op-vista { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.op-grid .op-card-link { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); column-gap: 14px; align-content: start; }
.op-grid .op-card-top, .op-grid .op-carts, .op-grid .op-fb { grid-column: 1 / -1; }
.op-grid .op-carts { margin: 10px 0 10px; }
.op-grid .op-meta { margin-bottom: 0; align-self: stretch; }
.op-grid .op-dados { grid-template-columns: 1fr; gap: 6px; align-self: center; }
.op-grid .op-dados > div { display: flex; justify-content: space-between; align-items: baseline; gap: 8px; }
.op-grid .op-dados dd { margin: 0; }
@media (max-width: 1200px) { .op-grid.op-vista { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 720px) { .op-grid.op-vista { grid-template-columns: minmax(0, 1fr); } }

/* ---------- Feedback: sugeridos, painel, antes × depois, ocorrências ---------- */
.fb-sugeridos { border-left: 3px solid var(--warning); padding: 12px 16px; }
.fb-sugeridos > summary { cursor: pointer; display: flex; align-items: center; gap: 8px; flex-wrap: wrap; list-style: none; }
.fb-sugeridos > summary::-webkit-details-marker { display: none; }
.fb-sug-lista { display: grid; grid-template-columns: repeat(auto-fill, minmax(340px, 1fr)); gap: 8px; margin-top: 12px; }
.fb-sug { display: flex; align-items: center; gap: 10px; padding: 8px 10px; border: 1px solid var(--gray-200); border-radius: 10px; background: var(--white); min-width: 0; }
.fb-sug-txt { flex: 1; min-width: 0; }
.fb-sug-motivos { display: flex; gap: 4px; flex-wrap: wrap; margin-top: 3px; }
.fb-sug-motivos .plan-chip { font-size: 11px; padding: 1px 8px; }
.fb-painel table td, .fb-painel table th { padding: 6px 8px; font-size: 12.5px; }
.fb-painel-oc { display: flex; gap: 6px 12px; flex-wrap: wrap; align-items: center; margin-top: 10px; padding-top: 10px; border-top: 1px dashed var(--gray-200); font-size: 12px; color: var(--gray-600); }
.fb-veredito { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 8px 12px; border-radius: 8px; margin-bottom: 10px; font-weight: 800; font-size: 13px; background: var(--gray-100); color: var(--gray-700); }
.fb-veredito.ok { background: var(--success-bg); color: var(--success); }
.fb-veredito.ruim { background: var(--danger-bg); color: var(--danger); }
.fb-veredito small { font-weight: 600; opacity: .8; }
.oc-resumo { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; margin-bottom: 12px; }
.oc-bloco { background: var(--gray-50); border-radius: 10px; padding: 10px 12px; }
.oc-bloco-tit { font-size: 11px; font-weight: 800; text-transform: uppercase; letter-spacing: .05em; color: var(--gray-500); margin-bottom: 6px; }
.oc-nums { display: flex; flex-wrap: wrap; gap: 4px 12px; font-size: 12.5px; color: var(--gray-600); }
.oc-nums b { color: var(--hc-900); font-size: 14px; }
.oc-nums .ruim, .oc-nums .ruim b { color: var(--danger); }
@media (max-width: 800px) { .oc-resumo { grid-template-columns: minmax(0, 1fr); } .fb-sug-lista { grid-template-columns: minmax(0, 1fr); } }

/* ---------- Raio-X da base (carteira_base.php) ---------- */
.cart-raiox { color: var(--hc-600); border-radius: 6px; padding: 1px 4px; margin: -1px -4px; }
.cart-raiox:hover { background: var(--hc-100); text-decoration: underline; }
.cb-barra { display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap; margin-bottom: 14px; }
.cb-sel { display: inline-flex; align-items: center; gap: 8px; color: var(--gray-500); }
.cb-sel select { width: auto; min-width: 260px; font-weight: 700; }
.cb-links { display: flex; gap: 6px; flex-wrap: wrap; }
.cb-tab tbody tr { cursor: pointer; }
.cb-tab tbody tr:hover td { background: var(--hc-50); }
.cb-mini { height: 6px; border-radius: 999px; background: var(--gray-100); overflow: hidden; margin-bottom: 3px; }
.cb-mini span { display: block; height: 100%; background: var(--hc-500); border-radius: 999px; }
.cb-contatos { display: flex; gap: 8px 18px; flex-wrap: wrap; font-size: 12.5px; color: var(--gray-600); margin: -2px 0 14px; padding: 8px 12px; background: var(--white); border: 1px solid var(--gray-200); border-radius: 10px; }
.cb-contatos span { display: inline-flex; align-items: center; gap: 5px; }
.cb-contatos b { color: var(--hc-900); }
.cb-faixas td { vertical-align: middle; }
.cb-faixas tr.cb-vazia td { color: var(--gray-400); }
.cb-bar { display: flex; align-items: center; gap: 8px; }
.cb-bar > span { display: block; height: 14px; min-width: 2px; background: #b9d0ee; border-radius: 0 4px 4px 0; overflow: hidden; }
.cb-bar > span i { display: block; height: 100%; background: #1857a0; }
.cb-bar.val > span { background: #7c9fd0; }
.cb-bar b { font-size: 12.5px; white-space: nowrap; }
.cb-duas { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.cb-sub { font-size: 11px; font-weight: 800; text-transform: uppercase; letter-spacing: .05em; color: var(--gray-500); margin-bottom: 6px; }
.cb-lin { display: grid; grid-template-columns: minmax(70px, 110px) minmax(0, 1fr) auto; gap: 8px; align-items: center; font-size: 12.5px; padding: 3px 0; }
.cb-lin span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cb-lin .cb-mini { margin: 0; }
@media (max-width: 640px) { .cb-duas { grid-template-columns: minmax(0, 1fr); } .cb-sel select { min-width: 0; width: 100%; } }

/* ---------- Feedbacks ---------- */
.fb-agenda-resumo { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 12px; }
.fb-ag-chip { display: inline-flex; align-items: center; gap: 6px; padding: 5px 12px; border-radius: 999px; font-size: 12.5px; font-weight: 600; }
.fb-ag-chip:hover { text-decoration: none; filter: brightness(.96); }
.fb-ag-chip strong { font-size: 14px; }
.fb-ag-chip.danger { background: var(--danger-bg); color: var(--danger); }
.fb-ag-chip.warning { background: var(--warning-bg); color: var(--warning); }
.fb-ag-chip.info { background: var(--info-bg); color: var(--info); }
.fb-ag-chip.vazio { opacity: .5; }
tr.fb-ag-grupo td { font-weight: 800; font-size: 12px; text-transform: uppercase; letter-spacing: .05em; padding: 10px 12px 6px; background: var(--white); border-bottom: 2px solid var(--gray-200); }
tr.fb-ag-grupo.danger td { color: var(--danger); border-bottom-color: #f1c4bd; }
tr.fb-ag-grupo.warning td { color: var(--warning); border-bottom-color: #efd7a8; }
tr.fb-ag-grupo.info td { color: var(--info); border-bottom-color: var(--hc-100); }
.fb-op-topo { display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap; margin-bottom: 12px; }
.fb-cad { height: 5px; border-radius: 999px; background: var(--gray-100); overflow: hidden; margin-bottom: 4px; max-width: 160px; }
.fb-cad span { display: block; height: 100%; border-radius: 999px; }
.fb-cad .ok { background: #22a061; }
.fb-cad .mid { background: #e0a030; }
.fb-cad .bad { background: #d0483a; }

/* ---------- Planejamento: resultado do mês ---------- */
.plan-kpis { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 12px; margin-bottom: 12px; }
.plan-kpis.cinco { grid-template-columns: repeat(5, minmax(0, 1fr)); }
.plan-kpis.cinco .plan-kpi-val { font-size: 22px; }
.plan-kpi { position: relative; display: flex; flex-direction: column; gap: 4px; padding: 12px 14px; background: var(--white); border: 1px solid var(--gray-200); border-radius: 12px; box-shadow: var(--shadow-sm); min-width: 0; overflow: hidden; color: inherit; }
.plan-kpi::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 3px; background: var(--gray-200); }
.plan-kpi.ok::before { background: #22a061; }
.plan-kpi.mid::before { background: #e0a030; }
.plan-kpi.bad::before { background: #d0483a; }
a.plan-kpi:hover { text-decoration: none; border-color: var(--hc-400); }
.plan-kpi-top { display: flex; align-items: center; gap: 7px; font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: var(--gray-500); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.plan-kpi-ic { width: 24px; height: 24px; border-radius: 7px; display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; }
.plan-kpi-ic.verde { color: #16a34a; background: #effaf3; }
.plan-kpi-ic.azul { color: #2e6bff; background: #eef3ff; }
.plan-kpi-ic.roxo { color: #7c3aed; background: #f4efff; }
.plan-kpi-ic.laranja { color: #ea7a0c; background: #fff4ea; }
.plan-kpi-val { font-family: "Montserrat", var(--font); font-size: 20px; font-weight: 800; color: #0a1f3d; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; letter-spacing: -.01em; }
.plan-kpi-val small { font-size: 13px; font-weight: 700; color: var(--gray-500); }
.plan-kpi-barra { margin: 2px 0 1px; }
.plan-kpi-rod { font-size: 11.5px; color: var(--gray-500); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.plan-kpi-rod b { color: var(--gray-800); }
.plan-kpi.bad .plan-kpi-rod b { color: var(--danger); }
.plan-kpi.ok .plan-kpi-rod b { color: var(--success); }
.plan-atencao-linha { display: flex; align-items: center; gap: 10px; padding: 6px 10px; margin-bottom: 14px; background: var(--white); border: 1px solid #f1c4bd; border-left: 3px solid var(--danger); border-radius: 10px; min-width: 0; }
.plan-atencao-tit { display: inline-flex; align-items: center; gap: 5px; font-size: 12px; font-weight: 800; color: var(--danger); text-transform: uppercase; letter-spacing: .04em; white-space: nowrap; flex-shrink: 0; }
.plan-atencao-itens { display: flex; gap: 6px; overflow-x: auto; flex-wrap: nowrap; min-width: 0; scrollbar-width: thin; }
.plan-chip { display: inline-flex; align-items: center; gap: 5px; padding: 3px 10px; border-radius: 999px; font-size: 12px; font-weight: 600; white-space: nowrap; flex-shrink: 0; }
.plan-chip:hover { text-decoration: none; filter: brightness(.96); }
.plan-chip.danger { background: var(--danger-bg); color: var(--danger); }
.plan-chip.warn { background: var(--warning-bg); color: var(--warning); }
.plan-kpi-rod b.sobe { color: var(--success); }
.plan-kpi-rod b.desce { color: var(--danger); }
/* Quadro da semana */
.week-col.fds { background: #f3f4f7; }
.week-col .wc-real { color: var(--gray-600); }
.week-col .wc-real .wc-val { font-size: 13px; font-weight: 800; color: var(--hc-900); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.week-col .wc-real .wc-val small { font-size: 11px; font-weight: 600; color: var(--gray-500); }
.week-col .wc-barra { height: 5px; border-radius: 999px; background: var(--gray-200); overflow: hidden; margin: 4px 0 3px; }
.week-col .wc-barra span { display: block; height: 100%; background: var(--hc-500); border-radius: 999px; }
.week-col .wc-real.ok .wc-barra span { background: #22a061; }
.week-col .wc-real.mid .wc-barra span { background: #e0a030; }
.week-col .wc-real.bad .wc-barra span { background: #d0483a; }
.week-col .wc-real.ok .wc-sub b { color: var(--success); }
.week-col .wc-real.bad .wc-sub b { color: var(--danger); }
.week-col .wc-sub { font-size: 11px; }
.wc-vazio { display: block; width: 100%; margin-top: 4px; padding: 8px; border: 1px dashed var(--gray-300); border-radius: 8px; background: transparent; color: var(--gray-500); font-size: 11.5px; cursor: pointer; }
.wc-vazio:hover { border-color: var(--hc-400); color: var(--hc-700); background: var(--white); }
.plan-pend { border-left: 3px solid var(--warning); padding: 12px 16px; }
.plan-pend > summary { cursor: pointer; display: flex; align-items: center; gap: 8px; flex-wrap: wrap; list-style: none; }
.plan-pend > summary::-webkit-details-marker { display: none; }
@media (max-width: 1300px) { .plan-kpis, .plan-kpis.cinco { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 640px) { .plan-kpis.cinco { grid-template-columns: repeat(2, minmax(0, 1fr)); } .plan-kpis.cinco .plan-kpi-val { font-size: 17px; } }
@media (max-width: 640px) { .plan-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); } .plan-kpi-val { font-size: 17px; } }
.plan-leg i { width: 16px !important; height: 3px !important; border-radius: 2px; vertical-align: 3px !important; }
.plan-leg i.real { background: #1857a0; }
.plan-leg i.ideal { background: #8a93a3; }
.plan-leg i.proj { background: repeating-linear-gradient(90deg, #1857a0 0 4px, transparent 4px 7px); }
.plan-ritmo-resumo { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; margin-bottom: 12px; }
.plan-ritmo-resumo > div { background: var(--gray-50); border-radius: 10px; padding: 9px 12px; display: flex; flex-direction: column; min-width: 0; }
.plan-ritmo-resumo span { font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: var(--gray-500); }
.plan-ritmo-resumo strong { font-size: 17px; color: var(--hc-900); white-space: nowrap; }
.plan-ritmo-resumo small { font-size: 11.5px; color: var(--gray-500); }
.plan-ritmo-resumo .ok { background: var(--success-bg); }
.plan-ritmo-resumo .ok strong { color: var(--success); }
.plan-ritmo-resumo .ruim { background: var(--danger-bg); }
.plan-ritmo-resumo .ruim strong { color: var(--danger); }
.plan-ritmo { position: relative; }
.plan-ritmo svg { display: block; width: 100%; height: auto; overflow: visible; }
.plan-fds { fill: var(--gray-50); }
.plan-meta-linha { stroke: var(--gray-400); stroke-width: 1; stroke-dasharray: 2 3; }
.plan-l-ideal { fill: none; stroke: #8a93a3; stroke-width: 2; stroke-linejoin: round; }
.plan-l-real { fill: none; stroke: #1857a0; stroke-width: 2.75; stroke-linejoin: round; stroke-linecap: round; }
.plan-l-proj { fill: none; stroke: #1857a0; stroke-width: 2; stroke-dasharray: 6 5; opacity: .7; }
.plan-p-real { fill: #1857a0; stroke: var(--white); stroke-width: 2; }
.plan-hoje { stroke: var(--gray-800); stroke-width: 1; opacity: .35; }
.muted-txt { fill: var(--gray-500); font-weight: 600; }
.plan-ops { display: flex; flex-direction: column; gap: 2px; }
.plan-op { display: grid; grid-template-columns: minmax(120px, 1.2fr) minmax(80px, 1fr) auto; gap: 12px; align-items: center; padding: 8px 2px; border-bottom: 1px solid var(--gray-100); }
.plan-op:last-child { border-bottom: none; }
.plan-op-nome { display: flex; flex-direction: column; min-width: 0; }
.plan-op-nome a { font-weight: 700; }
.plan-op-fim { display: flex; flex-direction: column; align-items: flex-end; gap: 2px; min-width: 70px; }
.plan-metas-tab tfoot td { font-size: 13px; }
@media (max-width: 900px) { .plan-ritmo-resumo { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 640px) { .plan-op { grid-template-columns: minmax(0, 1fr) auto; } .plan-op-barra { grid-column: 1 / -1; grid-row: 2; } }

/* ---------- Recebimentos: evolução e comparativo ---------- */
.rc-abas { margin-bottom: 14px; }
.ev-periodos { padding: 14px 16px; }
.ev-presets { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 12px; }
.ev-preset { display: inline-flex; flex-direction: column; padding: 6px 12px; border: 1px solid var(--gray-200); border-radius: 10px; font-size: 12.5px; font-weight: 600; color: var(--gray-700); background: var(--white); line-height: 1.25; }
.ev-preset small { font-size: 10.5px; font-weight: 500; color: var(--gray-500); }
.ev-preset:hover { border-color: var(--hc-400); color: var(--hc-700); text-decoration: none; }
.ev-preset.on { background: var(--hc-700); border-color: var(--hc-700); color: #fff; }
.ev-preset.on small { color: #d6e4f5; }
.ev-form { display: flex; align-items: flex-end; gap: 10px 12px; flex-wrap: wrap; }
.ev-per { display: flex; align-items: center; gap: 6px; border: 1px solid var(--gray-200); border-radius: 10px; padding: 4px 10px 8px; margin: 0; min-width: 0; }
.ev-per legend { font-size: 11px; font-weight: 800; text-transform: uppercase; letter-spacing: .05em; color: var(--gray-600); padding: 0 4px; display: flex; align-items: center; gap: 5px; }
.ev-per legend i, .ev-leg i { display: inline-block; width: 14px; height: 3px; border-radius: 2px; }
.ev-per.a legend i, .ev-leg i.a { background: #1857a0; }
.ev-per.b legend i, .ev-leg i.b { background: repeating-linear-gradient(90deg, #8a93a3 0 4px, transparent 4px 6px); }
.ev-per input[type=date] { width: auto; min-width: 0; }
.ev-per span { font-size: 12px; color: var(--gray-500); }
.ev-x { font-weight: 800; color: var(--gray-400); padding-bottom: 10px; }
.ev-met { margin: 0; }
.ev-met select { width: auto; }
.ev-kpis { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; margin-bottom: 16px; }
.ev-graf { position: relative; }
.ev-graf svg { display: block; width: 100%; height: auto; overflow: visible; }
.ev-grade { stroke: var(--gray-100); stroke-width: 1; }
.ev-grade.base { stroke: var(--gray-300); }
.ev-eixo { font-size: 11px; fill: var(--gray-500); }
.ev-linha { fill: none; stroke-width: 2.5; stroke-linejoin: round; stroke-linecap: round; }
.ev-linha.a { stroke: #1857a0; }
.ev-linha.b { stroke: #8a93a3; stroke-dasharray: 6 4; }
.ev-ponto { stroke: var(--white); stroke-width: 2; }
.ev-ponto.a { fill: #1857a0; }
.ev-ponto.b { fill: #8a93a3; }
.ev-rotulo { font-size: 11.5px; font-weight: 700; fill: var(--gray-800); }
.ev-cursor { stroke: var(--gray-400); stroke-width: 1; stroke-dasharray: 3 3; pointer-events: none; }
.ev-dica { transform: translate(-50%, 0); white-space: normal; min-width: 240px; max-width: 320px; }
.ev-dl { display: flex; align-items: center; gap: 5px; margin-top: 3px; font-size: 11.5px; flex-wrap: wrap; }
.ev-dl i { width: 12px; height: 3px; border-radius: 2px; background: #6ea2e0; }
.ev-dl.b i { background: #b8c0cc; }
.ev-dl strong { color: #fff; }
.ev-cart-sel select { width: auto; max-width: 220px; }
.ev-tab td { vertical-align: middle; }
.ev-tab tr.ev-sel td { background: var(--hc-50); }
.ev-dif { position: relative; height: 10px; background: linear-gradient(90deg, transparent calc(50% - 1px), var(--gray-300) calc(50% - 1px), var(--gray-300) calc(50% + 1px), transparent calc(50% + 1px)); }
.ev-dif span { position: absolute; top: 1px; bottom: 1px; }
.ev-dif span.pos { background: #22a061; border-radius: 0 4px 4px 0; }
.ev-dif span.neg { background: #d0483a; border-radius: 4px 0 0 4px; }
.txt-neg { color: var(--danger); }
.ev-total td { border-top: 2px solid var(--gray-200); background: var(--gray-50); }
.ev-grade-tab td.ev-cel { font-variant-numeric: tabular-nums; font-size: 12.5px; white-space: nowrap; }
.ev-grade-tab td.ev-cel.forte { color: #fff; font-weight: 700; }
.ev-spark { width: 84px; height: 24px; display: block; }
.ev-spark path { fill: none; stroke: #1857a0; stroke-width: 1.8; stroke-linejoin: round; }
.ev-spark circle { fill: #1857a0; }
@media (max-width: 1150px) { .ev-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 640px) {
  .ev-kpis { grid-template-columns: minmax(0, 1fr); }
  .ev-per { flex-wrap: wrap; width: 100%; }
  .ev-x { display: none; }
}

/* ---------- Recebimentos: histórico de importações ---------- */
.rc-periodo { border: 1px solid #f1c4bd; background: #fffafa; border-radius: 10px; padding: 12px 14px; margin-bottom: 14px; }
.rc-periodo.pisca { animation: rcPisca 1.2s ease-out; }
@keyframes rcPisca { 0% { box-shadow: 0 0 0 4px rgba(178, 50, 37, .35); } 100% { box-shadow: 0 0 0 0 rgba(178, 50, 37, 0); } }
.rc-periodo-tit { font-weight: 700; color: var(--danger); display: flex; align-items: center; gap: 6px; margin-bottom: 10px; }
.rc-periodo-campos { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.rc-periodo-rodape { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-top: 10px; flex-wrap: wrap; }
.rc-hist-limpar { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 8px 12px; background: var(--gray-50); border-radius: 8px; margin-bottom: 10px; flex-wrap: wrap; }
.rc-hist-meses { max-height: calc(46 * var(--vh)); overflow-y: auto; padding-right: 2px; }
.rc-hist-mes { border: 1px solid var(--gray-200); border-radius: 10px; margin-bottom: 8px; background: var(--white); }
.rc-hist-mes > summary { display: flex; align-items: center; gap: 10px; padding: 10px 12px; cursor: pointer; list-style: none; flex-wrap: wrap; }
.rc-hist-mes > summary::-webkit-details-marker { display: none; }
.rc-hist-mes > summary::before { content: "▸"; color: var(--gray-400); transition: transform .15s; }
.rc-hist-mes[open] > summary::before { transform: rotate(90deg); }
.rc-hist-mes[open] > summary { border-bottom: 1px solid var(--gray-100); }
.rc-hist-mes-del { margin-left: auto; }
.rc-hist-mes .rc-hist { padding: 10px 12px; }
.rc-hist-mes .rc-hist:last-child { border-bottom: none; }
.rc-hist.substituida { opacity: .55; }
.rc-hist .badge { font-size: 10px; padding: 1px 6px; }
@media (max-width: 640px) { .rc-periodo-campos { grid-template-columns: minmax(0, 1fr); } }

/* ---------- Controle de WhatsApp ---------- */
.wpp-ativo { background: #22a061; }
.wpp-restrito { background: #e0a030; }
.wpp-banido { background: #d0483a; }
.wpp-inativo { background: var(--gray-300); }
.wpp-saude { display: flex; align-items: center; gap: 22px; flex-wrap: wrap; }
.wpp-saude-num { min-width: 150px; }
.wpp-saude-pct { font-size: 34px; font-weight: 800; letter-spacing: -0.03em; line-height: 1; margin-bottom: 4px; }
.wpp-saude-pct.ok { color: var(--success); }
.wpp-saude-pct.mid { color: var(--warning); }
.wpp-saude-pct.bad { color: var(--danger); }
.wpp-saude-det { flex: 1 1 320px; min-width: 0; }
.wpp-barra { display: flex; height: 6px; border-radius: 999px; overflow: hidden; background: var(--gray-100); }
.wpp-barra.lg { height: 12px; margin-bottom: 12px; }
.wpp-barra > span { display: block; height: 100%; }
.wpp-filtros { display: flex; flex-wrap: wrap; gap: 6px; }
.wpp-filtro { display: inline-flex; align-items: center; gap: 6px; padding: 5px 11px; border: 1px solid var(--gray-200); border-radius: 999px; font-size: 12.5px; color: var(--gray-700); background: var(--white); }
.wpp-filtro:hover { border-color: var(--hc-400); text-decoration: none; color: var(--hc-700); }
.wpp-filtro.on { background: var(--hc-700); border-color: var(--hc-700); color: #fff; }
.wpp-filtro strong { font-weight: 800; }
.wpp-dot { width: 9px; height: 9px; border-radius: 50%; display: inline-block; }
.wpp-alertas { border-left: 3px solid var(--warning); }
.wpp-alerta-lista { display: flex; flex-wrap: wrap; gap: 8px; }
.wpp-alerta { display: flex; flex-direction: column; gap: 1px; padding: 8px 12px; border-radius: 10px; font-size: 12px; min-width: 190px; border: 1px solid transparent; }
.wpp-alerta:hover { text-decoration: none; filter: brightness(0.97); }
.wpp-alerta strong { font-size: 13.5px; color: var(--gray-900); }
.wpp-alerta span { color: var(--gray-600); }
.wpp-alerta em { font-style: normal; font-weight: 700; font-size: 11px; text-transform: uppercase; letter-spacing: .03em; }
.wpp-alerta.wpp-restrito { background: var(--warning-bg); border-color: #efd7a8; }
.wpp-alerta.wpp-restrito em { color: var(--warning); }
.wpp-alerta.wpp-banido { background: var(--danger-bg); border-color: #f1c4bd; }
.wpp-alerta.wpp-banido em { color: var(--danger); }
.wpp-busca { margin-bottom: 14px; }
.wpp-cart-head { display: flex; align-items: center; gap: 8px 14px; flex-wrap: wrap; margin-bottom: 14px; }
.wpp-cart-head h2 { margin: 0; font-size: 15px; display: flex; align-items: center; gap: 8px; }
.wpp-cart-head .wpp-barra { flex: 1 1 140px; max-width: 260px; margin-left: auto; }
.wpp-cart-cor { width: 10px; height: 10px; border-radius: 3px; display: inline-block; }
.txt-ok { color: var(--success); }
.wpp-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); gap: 10px; }
.wpp-num { position: relative; display: flex; flex-direction: column; gap: 8px; padding: 11px 12px 10px 14px; border: 1px solid var(--gray-200); border-radius: 10px; background: var(--white); box-shadow: var(--shadow-sm); overflow: hidden; transition: box-shadow .15s, border-color .15s; }
.wpp-num::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 4px; }
.wpp-num.wpp-b-ativo::before { background: #22a061; }
.wpp-num.wpp-b-restrito::before { background: #e0a030; }
.wpp-num.wpp-b-banido::before { background: #d0483a; }
.wpp-num.wpp-b-inativo::before { background: var(--gray-300); }
.wpp-num.wpp-b-banido, .wpp-num.wpp-b-inativo { background: var(--gray-50); }
.wpp-num.wpp-b-banido .wpp-num-tel { text-decoration: line-through; color: var(--gray-500); }
.wpp-num:hover { box-shadow: var(--shadow); border-color: var(--gray-300); }
.wpp-num-top { display: flex; align-items: center; gap: 8px; }
.wpp-num-top form { display: inline-flex; }
.wpp-num-ic { width: 26px; height: 26px; border-radius: 8px; display: inline-flex; align-items: center; justify-content: center; color: #fff; flex-shrink: 0; }
.wpp-num-tel { flex: 1 0 auto; font-size: 14.5px; letter-spacing: .01em; white-space: nowrap; }
.wpp-icon-btn { width: 26px; height: 26px; display: inline-flex; align-items: center; justify-content: center; border-radius: 7px; border: 1px solid transparent; background: transparent; color: var(--gray-500); cursor: pointer; font-size: 13px; padding: 0; }
.wpp-icon-btn:hover { background: var(--gray-100); color: var(--hc-700); text-decoration: none; }
.wpp-icon-btn.danger:hover { background: var(--danger-bg); color: var(--danger); }
.wpp-num-info { display: flex; flex-direction: column; gap: 4px; font-size: 12.5px; color: var(--gray-700); min-height: 38px; }
.wpp-num-info > span:not(.wpp-tags) { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.wpp-tags { display: flex; flex-wrap: wrap; gap: 4px; }
.wpp-tags .badge + .badge { margin-left: 0; }
.wpp-num-foot { display: flex; align-items: center; gap: 8px; justify-content: space-between; border-top: 1px dashed var(--gray-200); padding-top: 8px; }
.wpp-num-foot form { display: inline-flex; }
.wpp-status { width: auto; font-size: 11.5px; font-weight: 700; padding: 3px 24px 3px 10px; border-radius: 999px; border: 1px solid transparent; min-height: 0; height: auto; cursor: pointer; }
.wpp-s-ativo { background-color: var(--success-bg); color: var(--success); }
.wpp-s-restrito { background-color: var(--warning-bg); color: var(--warning); }
.wpp-s-banido { background-color: var(--danger-bg); color: var(--danger); }
.wpp-s-inativo { background-color: var(--gray-100); color: var(--gray-600); }
.wpp-hist { text-align: right; font-size: 11px; }
/* Comum x Meta no mesmo quadro da carteira; arrastar número entre carteiras */
.wpp-cor-comum { background: #22a061; }
.wpp-cor-meta { background: #6d4fd8; }
.wpp-filtros-sep { width: 1px; align-self: stretch; background: var(--gray-200); margin: 0 4px; }
.wpp-filtro-meta.on { background: #6d4fd8; border-color: #6d4fd8; }
.wpp-legenda { display: inline-flex; flex-wrap: wrap; gap: 6px 14px; margin-left: auto; }
.wpp-legenda > span { display: inline-flex; align-items: center; gap: 5px; }
.wpp-qtd-meta { color: #5b3fc4; }
.wpp-tag-meta { display: inline-block; font-size: 9.5px; font-weight: 800; letter-spacing: .06em; padding: 2px 6px; border-radius: 5px; background: #6d4fd8; color: #fff; vertical-align: middle; }
.wpp-num.wpp-num-meta { background: #f6f3ff; border-color: #d9d0fa; }
.wpp-num.wpp-num-meta .wpp-num-foot { border-top-color: #ddd4fb; }
.wpp-num.wpp-num-meta.wpp-b-banido, .wpp-num.wpp-num-meta.wpp-b-inativo { background: #f1eff7; }
.wpp-carteiras { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 14px; align-items: start; }
.wpp-carteiras > .wpp-carteira { grid-column: 1 / -1; }
.wpp-carteiras > .wpp-carteira.vazia { grid-column: auto; }
.wpp-sep-vazias { grid-column: 1 / -1; font-weight: 700; font-size: 13px; color: var(--gray-700); margin-top: 6px; }
.wpp-carteiras > .wpp-carteira { margin: 0; transition: box-shadow .15s, outline-color .15s; outline: 2px dashed transparent; outline-offset: -2px; }
.wpp-cart-cont { white-space: nowrap; }
.wpp-cart-barra { flex: 1 1 140px; max-width: 260px; margin-left: auto; }
.wpp-cart-barra .wpp-barra { width: 100%; }
.wpp-cart-add { display: inline-flex; align-items: center; gap: 4px; font-size: 12px; font-weight: 600; padding: 4px 10px; border-radius: 999px; border: 1px solid var(--gray-200); color: var(--gray-700); background: var(--white); }
.wpp-cart-add:hover { border-color: var(--hc-400); color: var(--hc-700); text-decoration: none; }
.wpp-num[draggable] { cursor: grab; }
.wpp-num[draggable] select, .wpp-num[draggable] a, .wpp-num[draggable] button { cursor: pointer; }
.wpp-num.arrastando { opacity: .45; }
.wpp-num.movido { box-shadow: 0 0 0 2px var(--hc-400); }
.wpp-vazio { display: none; grid-column: 1 / -1; padding: 14px; border: 1px dashed var(--gray-300); border-radius: 10px; text-align: center; font-size: 12.5px; color: var(--gray-500); }
.wpp-carteira.vazia .wpp-vazio { display: block; }
.wpp-carteira.vazia { padding: 12px 14px; }
.wpp-carteira.vazia .wpp-cart-head { margin-bottom: 8px; flex-wrap: nowrap; }
.wpp-carteira.vazia .wpp-cart-head h2 { font-size: 13.5px; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; flex: 1; }
.wpp-carteira.vazia .wpp-cart-cont, .wpp-carteira.vazia .wpp-cart-barra { display: none; }
.wpp-carteira.vazia .wpp-cart-add { padding: 3px 8px; font-size: 11.5px; }
.wpp-carteira.vazia .wpp-vazio { padding: 8px; font-size: 11.5px; }
.wpp-carteira.vazia .wpp-grid { grid-template-columns: minmax(0, 1fr); }
.wpp-cart-cor { flex-shrink: 0; }
.wpp-cart-nome { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
/* Grupos de carteiras (ex: Essenciais 1) */
.wpp-novo-grupo { padding: 12px 16px; }
.wpp-novo-grupo > summary { cursor: pointer; font-weight: 700; font-size: 13.5px; color: var(--hc-700); display: flex; align-items: center; gap: 6px; list-style: none; }
.wpp-novo-grupo > summary::-webkit-details-marker { display: none; }
.wpp-novo-grupo[open] > summary { margin-bottom: 12px; }
.wpp-grupo-form .form-field { max-width: 320px; }
.wpp-grupo-form-l { display: block; font-size: 12px; font-weight: 600; color: var(--gray-600); margin: 10px 0 6px; }
.wpp-grupo-checks { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 4px 12px; }
.wpp-grupo-checks small { font-size: 11px; }
.wpp-grupo-form-bt { margin-top: 12px; }
.wpp-grupo { position: relative; margin-bottom: 16px; padding: 14px 16px 16px; border-radius: 14px; background: linear-gradient(180deg, #eef3fb, #f5f8fc); border: 1px solid #d5e0f0; outline: 2px dashed transparent; outline-offset: -2px; transition: outline-color .15s; }
.wpp-grupo-head { display: flex; align-items: center; gap: 8px 14px; flex-wrap: wrap; margin-bottom: 12px; }
.wpp-grupo-head h2 { margin: 0; font-size: 16.5px; display: flex; align-items: center; gap: 7px; color: var(--hc-700); }
.wpp-grupo-edit { margin-left: auto; position: relative; }
.wpp-grupo-edit > summary { cursor: pointer; font-size: 12px; font-weight: 600; padding: 4px 10px; border-radius: 999px; border: 1px solid var(--gray-200); background: var(--white); color: var(--gray-700); list-style: none; }
.wpp-grupo-edit > summary::-webkit-details-marker { display: none; }
.wpp-grupo-edit-painel { position: absolute; right: 0; top: calc(100% + 6px); z-index: 20; width: min(640px, 86vw); padding: 14px; background: var(--white); border: 1px solid var(--gray-200); border-radius: 12px; box-shadow: var(--shadow); display: flex; flex-direction: column; gap: 10px; }
.wpp-grupo .wpp-carteiras > .wpp-carteira { box-shadow: var(--shadow-sm); }
.wpp-grupo-vazio { display: none; grid-column: 1 / -1; padding: 16px; border: 1px dashed #b9c9e2; border-radius: 10px; text-align: center; font-size: 12.5px; color: var(--gray-500); background: rgba(255,255,255,.6); }
.wpp-grupo.vazio .wpp-grupo-vazio { display: block; }
.wpp-sep-soltas { font-weight: 700; font-size: 14px; color: var(--gray-700); margin: 22px 0 10px; }
.wpp-soltas { outline: 2px dashed transparent; outline-offset: 4px; border-radius: 12px; transition: outline-color .15s; }
.wpp-cart-arrastar { cursor: grab; }
.wpp-cart-arrastar:hover .wpp-cart-nome { text-decoration: underline dotted; }
.wpp-carteira.arrastando { opacity: .45; }
body.wpp-arrastando-carteira .wpp-grupo, body.wpp-arrastando-carteira .wpp-soltas { outline-color: #b9c9e2; }
.wpp-grupo.alvo, .wpp-soltas.alvo { outline-color: var(--hc-500) !important; }
.wpp-carteira.movido { box-shadow: 0 0 0 2px var(--hc-400); }
.wpp-grupo-numeros-bloco { margin-bottom: 14px; }
.wpp-grupo-numeros-bloco > .wpp-carteira { margin: 0; border: 1px solid #c7d5ec; background: #fbfcff; }
.wpp-grupo-numeros-bloco > .wpp-carteira.vazia { padding: 12px 14px; }
.wpp-grupo-numeros-bloco > .wpp-carteira.vazia .wpp-cart-head { flex-wrap: wrap; }
.wpp-grupo-numeros-bloco > .wpp-carteira.vazia .wpp-cart-head h2 { flex: 0 1 auto; }
.wpp-grupo-numeros-ic { width: 22px; height: 22px; border-radius: 6px; display: inline-flex; align-items: center; justify-content: center; background: var(--hc-700); color: #fff; flex-shrink: 0; }
.wpp-grupo-numeros .wpp-cart-head h2 { color: var(--hc-700); }
.wpp-grupo-numeros-dica { font-size: 11.5px; }
body.wpp-arrastando .wpp-carteira { outline-color: var(--gray-200); }
.wpp-carteira.alvo { outline-color: var(--hc-500, #2563eb) !important; box-shadow: var(--shadow); }
.wpp-carteira.alvo .wpp-vazio { border-color: var(--hc-400); color: var(--hc-700); }
@media (max-width: 640px) {
  .wpp-saude { gap: 12px; }
  .wpp-grid { grid-template-columns: minmax(0, 1fr); }
  .wpp-cart-head .wpp-barra, .wpp-cart-barra { max-width: none; flex-basis: 100%; margin-left: 0; }
  .wpp-legenda { margin-left: 0; }
}

/* Parciais → Metas por faixa de atraso */
.fx-chips { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 16px; }
.fx-chip { display: inline-flex; align-items: center; gap: 8px; padding: 8px 12px; border-radius: 10px; background: #fff; border: 1px solid var(--gray-200); border-left: 4px solid var(--cor); color: var(--hc-900); text-decoration: none; }
.fx-chip:hover { text-decoration: none; border-color: var(--cor); }
.fx-chip.ativo { box-shadow: 0 0 0 2px var(--cor) inset; }
.fx-chip small { color: var(--gray-500); }
.fx-tabela td { vertical-align: middle; }
.fx-tabela tfoot td { border-top: 2px solid var(--gray-200); }
tr.fx-extra td { color: var(--gray-500); background: var(--gray-50, #fafafa); }
.fx-pgtos > summary { list-style: none; }
.fx-pgtos > summary::-webkit-details-marker { display: none; }
.fx-ou { display: flex; align-items: center; gap: 10px; margin: 16px 0 10px; color: var(--gray-500); font-size: 12px; }
.fx-ou::before, .fx-ou::after { content: ""; flex: 1; border-top: 1px solid var(--gray-200); }
.fx-editor input { width: 100%; min-width: 80px; }
.fx-editor td { padding: 4px 6px; }
/* Controle de Ações → Montar lista (filtros livres) */
.lista-filtros { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 12px; margin-top: 14px; }
.lista-filtros fieldset { border: 1px solid var(--gray-200); border-radius: var(--radius); padding: 10px 14px 12px; margin: 0; background: var(--gray-50); display: grid; gap: 8px; align-content: start; min-width: 0; }
.lista-filtros legend { font-size: 11px; text-transform: uppercase; letter-spacing: .06em; color: var(--gray-500); font-weight: 700; padding: 0 4px; }
.lista-filtros .form-field { margin: 0; }
.lista-par { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.lista-check { display: flex; align-items: center; gap: 6px; font-size: 12.5px; cursor: pointer; }
.lista-segmentos { display: flex; flex-wrap: wrap; gap: 4px 10px; }
.lista-botoes { grid-column: 1 / -1; display: flex; gap: 8px; flex-wrap: wrap; }
.lista-modelos { padding: 12px 16px; }
.lista-modelos-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.lista-modelo { display: inline-flex; align-items: center; border: 1px solid var(--gray-200); border-radius: 999px; background: var(--white); overflow: hidden; }
.lista-modelo a { display: inline-flex; align-items: center; gap: 5px; padding: 5px 4px 5px 12px; font-size: 12.5px; font-weight: 600; text-decoration: none; }
.lista-modelo form { margin: 0; }
.lista-modelo button { border: 0; background: none; color: var(--gray-500); cursor: pointer; padding: 5px 10px 5px 6px; font-size: 11px; }
.lista-modelo button:hover { color: var(--danger); }
.lista-salvar { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-top: 16px; padding-top: 12px; border-top: 1px solid var(--gray-200); }
.lista-salvar label { font-size: 12px; font-weight: 700; display: inline-flex; align-items: center; gap: 5px; }
.lista-salvar input[type=text] { flex: 1; min-width: 200px; max-width: 360px; }
@media (max-width: 640px) { .lista-salvar input[type=text] { max-width: none; flex-basis: 100%; } }


/* Controle de Ações → Painel */
.pn-topo { display: flex; justify-content: space-between; align-items: center; gap: 10px; flex-wrap: wrap; margin-bottom: 14px; }
.pn-topo .pill-nav { margin: 0; }
.pn-kpis { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 12px; margin-bottom: 18px; }
.pn-kpis-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.pn-kpi { background: var(--white); border: 1px solid var(--gray-200); border-radius: var(--radius); padding: 14px 16px; text-decoration: none; color: inherit; display: block; min-width: 0; }
.pn-kpi-link { transition: border-color .15s, box-shadow .15s; }
.pn-kpi-link:hover { border-color: var(--pn-c, var(--gray-400)); box-shadow: 0 2px 10px rgba(15, 23, 42, .06); }
.pn-kpi-destaque { border-color: var(--primary, #1e3a8a); }
.pn-kpi-l { font-size: 11px; text-transform: uppercase; letter-spacing: .05em; color: var(--gray-500); font-weight: 700; display: flex; align-items: center; gap: 6px; }
.pn-kpi-l i { width: 9px; height: 9px; border-radius: 50%; background: var(--pn-c); flex-shrink: 0; }
.pn-kpi-v { font-size: 26px; font-weight: 800; margin: 4px 0 2px; font-variant-numeric: tabular-nums; }
.pn-kpi-s { font-size: 12px; color: var(--gray-500); }
.pn-f1 { --pn-c: #16a34a; } .pn-f2 { --pn-c: #f59e0b; } .pn-f3 { --pn-c: #dc2626; } .pn-f4 { --pn-c: #64748b; }
.pn-barra { display: flex; height: 12px; border-radius: 6px; overflow: hidden; background: var(--gray-100); min-width: 140px; }
.pn-barra span { background: var(--pn-c); }
.pn-dot { display: inline-block; width: 8px; height: 8px; border-radius: 50%; background: var(--pn-c); margin-right: 5px; vertical-align: middle; }
.pn-legenda { display: flex; gap: 12px; flex-wrap: wrap; color: var(--gray-500); }
.pn-legenda i { display: inline-block; width: 10px; height: 10px; border-radius: 3px; background: var(--pn-c); margin-right: 5px; vertical-align: -1px; }
.pn-tabela td { vertical-align: middle; }
.pn-num { font-weight: 700; text-decoration: none; }
.pn-num:hover { text-decoration: underline; }
.pn-grupo td { background: var(--gray-50); font-size: 11px; text-transform: uppercase; letter-spacing: .06em; font-weight: 700; color: var(--gray-500); padding-top: 8px; padding-bottom: 8px; }
.pn-total td { background: var(--gray-50); border-top: 2px solid var(--gray-200); }
.pn-sitbar { height: 8px; background: var(--gray-100); border-radius: 4px; overflow: hidden; }
.pn-sitbar b { display: block; height: 100%; border-radius: 4px; }
.pn-origens { display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); gap: 12px; }
.pn-origem { border: 1px solid var(--gray-200); border-radius: var(--radius); padding: 10px 12px; background: var(--white); min-width: 0; }
.pn-origem-t { margin-bottom: 6px; }
.pn-origem-tab { width: 100%; font-size: 12px; }
.pn-origem-tab td { padding: 3px 4px; border-bottom: 1px solid var(--gray-100); overflow-wrap: anywhere; }
.pn-canais { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }
.lista-modelo-pronto a { padding-right: 12px; }
@media (max-width: 1100px) { .pn-kpis { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 640px) { .pn-kpis, .pn-kpis-3 { grid-template-columns: repeat(2, minmax(0, 1fr)); } .pn-kpi-v { font-size: 21px; } }

/* Controle de Ações → Listas dos operadores */
.lo-hora { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 10px; margin-top: 4px; }
.lo-hora label { font-weight: 600; font-size: 13px; }
.lo-hora input[type=time] { width: auto; }
.lo-pasta code { font-size: 11.5px; word-break: break-all; }
.lo-inativo td { opacity: .6; }
.lo-erro { margin-top: 4px; color: var(--danger); font-size: 12px; }
.lo-aviso { padding: 10px 12px; border-radius: var(--radius); background: var(--warning-bg); color: var(--warning); margin-bottom: 12px; }
.lo-dias { display: inline-flex; flex-wrap: wrap; align-items: center; gap: 4px 10px; color: var(--gray-700); }
.lo-dias label { display: inline-flex; align-items: center; gap: 4px; font-weight: 400; font-size: 13px; }

/* Controle de Ações → Controle de SMS */
.sms-head { flex-wrap: wrap; gap: 8px; }
.sms-head h2 { display: flex; align-items: center; gap: 6px; }
.sms-nome { width: 180px; font-weight: 700; font-size: inherit; }
.sms-tabela th, .sms-tabela td { text-align: center; padding: 4px 6px; white-space: nowrap; }
.sms-tabela th.num, .sms-tabela td.num { text-align: right; }
.sms-tabela thead th.sms-rod { background: var(--gray-50); }
.sms-tabela input { padding: 4px 6px; font-size: 13px; }
.sms-tabela .sms-cart { width: 160px; text-align: left; }
.sms-tabela .sms-n { width: 78px; text-align: right; }
.sms-tabela .sms-data { width: 132px; }
.sms-tabela tfoot td { border-top: 2px solid var(--gray-200); }
.sms-neg { color: var(--danger); font-weight: 700; }
.sms-zero { color: var(--success); font-weight: 700; }
.sms-acoes { display: flex; align-items: center; gap: 10px; margin-top: 10px; }
.sms-novo { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px; }

/* Controle de Ações → Recados da equipe */
.rec-dia { margin: 0; }
.rec-acao { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; }
td.rec-acao { display: table-cell; }
.rec-acao > * { vertical-align: middle; }
.rec-remessa { display: inline-flex; align-items: center; gap: 6px; flex-wrap: wrap; margin-left: 6px; }
.rec-remessa input[type=number] { width: 70px; min-width: 0; padding: 4px 6px; min-height: 0; height: auto; }
.rec-equipe tr.rec-sem td:first-child { box-shadow: inset 3px 0 0 var(--warning); }
.rec-ok { margin-left: 4px; }
.rec-textos { padding: 12px 16px; }
.rec-textos > summary { cursor: pointer; font-weight: 700; font-size: 13.5px; color: var(--hc-700); display: flex; align-items: center; gap: 6px; list-style: none; }
.rec-textos > summary::-webkit-details-marker { display: none; }
.rec-textos[open] > summary { margin-bottom: 12px; }
.rec-textos textarea { width: 100%; }

/* Operadores → De-para */
.dp-resumo { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; margin-bottom: 12px; }
.dp-tabela tr.dp-sem td:first-child { box-shadow: inset 3px 0 0 var(--warning); }
.dp-tabela select { min-width: 240px; }

/* Montar lista: modelo clicado e filtros aplicados */
.lista-modelo.ativo { border-color: var(--hc-700); background: var(--hc-700); }
.lista-modelo.ativo a, .lista-modelo.ativo button { color: #fff; }
.lista-aplicados { margin: 0 0 14px; padding: 10px 12px; border-radius: 10px; background: #eef4fc; border: 1px solid #cfdcf0; }
.lista-aplicados-t { font-size: 12.5px; font-weight: 700; color: var(--hc-700); display: flex; align-items: center; gap: 6px; margin-bottom: 7px; }
.lista-aplicados-chips { display: flex; flex-wrap: wrap; gap: 6px; }
.lista-aplicado { display: inline-block; padding: 3px 10px; border-radius: 999px; background: var(--white); border: 1px solid #cfdcf0; font-size: 12px; color: var(--gray-800); }
.lista-aplicado-cred { background: var(--hc-700); border-color: var(--hc-700); color: #fff; font-weight: 600; }
.lista-filtros .campo-ativo > label { color: var(--hc-700); font-weight: 700; }
.lista-filtros .campo-ativo input, .lista-filtros .campo-ativo select { border-color: var(--hc-500); box-shadow: 0 0 0 2px rgba(34, 110, 189, .15); background: #f7fbff; }
.lista-filtros label.lista-check.campo-ativo { color: var(--hc-700); font-weight: 600; }

/* Recados da equipe → envio automático */
.rec-auto-liga { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 16px; }
.rec-auto-dias { display: flex; flex-wrap: wrap; gap: 4px 12px; margin-top: 8px; color: var(--gray-700); }
.rec-auto-dias label { display: inline-flex; align-items: center; gap: 4px; }
.rec-auto-teste { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 14px; padding-top: 12px; border-top: 1px dashed var(--gray-200); }
.rec-auto-log { margin-top: 12px; }
.rec-auto-log summary { cursor: pointer; color: var(--hc-700); font-weight: 600; }
.rec-auto-log ul { margin: 8px 0 0; padding-left: 18px; line-height: 1.7; }

.rec-conector { padding: 10px 12px; border-radius: 10px; margin-bottom: 12px; font-size: 13px; }
.rec-conector.ok { background: var(--success-bg); border: 1px solid #bfe3cd; }
.rec-conector.off { background: var(--warning-bg); border: 1px solid #efd7a8; }
.rec-fila td { vertical-align: top; padding: 6px 8px; }

/* ================= Chat da equipe ================= */
.chat { display: flex; flex-direction: column; height: 100%; min-height: 0; background: var(--white); }
.chat-topo { display: flex; align-items: center; gap: 8px; padding: 12px 16px; border-bottom: 1px solid var(--gray-200); }
.chat-titulo { font-size: 15px; }
.chat-sub { font-size: 12px; color: var(--success); }
.chat-online { width: 9px; height: 9px; border-radius: 50%; background: var(--gray-300); }
.chat-online.on { background: #22a061; }
.chat-fechar { margin-left: auto; border: 0; background: none; font-size: 20px; color: var(--gray-500); cursor: pointer; line-height: 1; }
.chat-msgs { flex: 1; overflow-y: auto; padding: 14px 16px; background: #f6f8fb; min-height: 0; }
.chat-vazio { color: var(--gray-500); font-size: 13px; text-align: center; padding: 30px 10px; }
.chat-dia { text-align: center; margin: 10px 0; }
.chat-dia span { font-size: 11.5px; font-weight: 700; color: var(--gray-500); background: #e8edf4; padding: 3px 10px; border-radius: 999px; }
.chat-msg { display: flex; flex-direction: column; margin: 4px 0 8px; max-width: 78%; }
.chat-msg.meu { margin-left: auto; align-items: flex-end; }
.chat-msg.dele { margin-right: auto; align-items: flex-start; }
.chat-msg.sistema { margin: 8px auto; align-items: center; max-width: 90%; }
.chat-autor { font-size: 11.5px; font-weight: 700; color: var(--gray-600); margin: 0 4px 2px; }
.chat-balao { padding: 8px 12px; border-radius: 14px; font-size: 14px; line-height: 1.4; word-wrap: break-word; }
.chat-msg.meu .chat-balao { background: var(--hc-700); color: #fff; border-bottom-right-radius: 4px; }
.chat-msg.meu .chat-balao a { color: #fff; }
.chat-msg.dele .chat-balao { background: var(--white); border: 1px solid var(--gray-200); border-bottom-left-radius: 4px; }
.chat-msg.sistema .chat-balao { background: #fff8e6; border: 1px solid #f0dca8; text-align: center; font-size: 13px; }
.chat-info { font-size: 10.5px; color: var(--gray-500); margin: 2px 4px 0; }
.chat-visto.lida { color: var(--hc-500); font-weight: 700; }
.chat-escrever { display: flex; gap: 8px; padding: 10px 12px; border-top: 1px solid var(--gray-200); align-items: flex-end; margin: 0; }
.chat-escrever textarea { flex: 1; resize: none; border: 1px solid var(--gray-300); border-radius: 18px; padding: 9px 14px; font: inherit; font-size: 14px; max-height: 140px; min-height: 0; height: auto; width: auto; }
.chat-escrever button { width: 40px; height: 40px; border-radius: 50%; border: 0; background: var(--hc-700); color: #fff; font-size: 16px; cursor: pointer; flex-shrink: 0; }
.chat-escrever button:hover { background: var(--hc-800); }
.chat-somente-leitura { padding: 12px; text-align: center; font-size: 12.5px; color: var(--gray-500); border-top: 1px solid var(--gray-200); }

/* Tela Chat (gestão) */
.chat-tela { display: grid; grid-template-columns: 320px 1fr; gap: 14px; height: calc(calc(100 * var(--vh)) - 150px); min-height: 460px; }
.chat-tela > .card { margin: 0; padding: 0; overflow: hidden; display: flex; flex-direction: column; }
.chat-lista-busca { padding: 10px; border-bottom: 1px solid var(--gray-200); }
.chat-lista-itens { flex: 1; overflow-y: auto; }
.chat-lista-rodape { padding: 8px 12px; border-top: 1px solid var(--gray-200); text-align: center; }
.chat-item { display: flex; gap: 10px; padding: 11px 12px; border-bottom: 1px solid var(--gray-100); color: inherit; text-decoration: none; }
.chat-item:hover { background: var(--gray-50); text-decoration: none; }
.chat-item.ativo { background: #eaf2fc; }
.chat-av { position: relative; width: 40px; height: 40px; border-radius: 50%; background: var(--hc-500); color: #fff; display: inline-flex; align-items: center; justify-content: center; font-weight: 700; font-size: 14px; flex-shrink: 0; }
.chat-av.geral { background: #f4b740; font-size: 18px; }
.chat-av-on { position: absolute; right: 0; bottom: 0; width: 11px; height: 11px; border-radius: 50%; background: #22a061; border: 2px solid #fff; }
.chat-item-txt { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.chat-item-l1, .chat-item-l2 { display: flex; align-items: center; gap: 6px; }
.chat-item-l1 strong { flex: 1; font-size: 13.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.chat-item-l1 small { color: var(--gray-500); font-size: 11px; }
.chat-prev { flex: 1; font-size: 12.5px; color: var(--gray-600); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.chat-voce { color: var(--hc-500); }
.chat-item.nao-lida .chat-prev { color: var(--gray-900); font-weight: 600; }
.chat-qtd { background: #22a061; color: #fff; font-size: 11px; border-radius: 999px; padding: 1px 7px; }
.chat-conversa .chat-dentro { height: 100%; }
.chat-escolha { margin: auto; text-align: center; display: flex; flex-direction: column; align-items: center; gap: 8px; max-width: 360px; padding: 20px; }
.chat-escolha-ic { color: var(--hc-500); }
@media (max-width: 760px) {
  .chat-tela { grid-template-columns: 1fr; height: auto; }
  .chat-tela .chat-conversa { height: calc(70 * var(--vh)); }
  .chat-tela.com-conversa .chat-lista { display: none; }
}

/* Janelinha flutuante (gestão) */
.chat-flut { position: fixed; right: 18px; bottom: 18px; z-index: 60; display: flex; flex-direction: column; align-items: flex-end; gap: 10px; }
.chat-flut-botao { position: relative; width: 52px; height: 52px; border-radius: 50%; border: 0; background: var(--hc-700); color: #fff; font-size: 22px; box-shadow: 0 4px 14px rgba(0,0,0,.2); cursor: pointer; }
.chat-flut-botao.tem { animation: chatPulse 1.6s ease-in-out 3; }
.chat-flut-botao b { position: absolute; top: -3px; right: -3px; background: #e5484d; color: #fff; font-size: 11px; border-radius: 999px; padding: 2px 6px; }
@keyframes chatPulse { 50% { transform: scale(1.12); } }
.chat-flut-toast { position: relative; width: 300px; background: var(--white); border-radius: 12px; box-shadow: 0 6px 22px rgba(0,0,0,.18); padding: 12px 14px; display: flex; flex-direction: column; gap: 4px; font-size: 13px; cursor: pointer; border-left: 4px solid var(--hc-500); }
.chat-flut-toast span { color: var(--gray-700); }
.chat-flut-toast a { font-weight: 700; font-size: 12.5px; }
.chat-flut-x { position: absolute; top: 4px; right: 8px; border: 0; background: none; font-size: 18px; color: var(--gray-500); cursor: pointer; }
.chat-flut-janela { width: 360px; height: 470px; border-radius: 14px; overflow: hidden; box-shadow: 0 8px 30px rgba(0,0,0,.22); background: var(--white); }
@media (max-width: 480px) { .chat-flut-janela { width: calc(100vw - 24px); height: calc(70 * var(--vh)); } }


/* Operadores → Registro do dia (gestão) */
.rd-topo { display: flex; align-items: center; gap: 10px; margin-bottom: 14px; flex-wrap: wrap; }
.rd-topo input[type=date] { width: auto; margin-left: auto; }
.rd-kpis { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 12px; margin-bottom: 14px; }
.rd-kpi { background: var(--white); border-radius: 14px; box-shadow: var(--shadow-sm); padding: 14px 16px; display: flex; flex-direction: column; gap: 4px; }
.rd-kpi span { font-size: 12.5px; color: var(--gray-600); font-weight: 600; }
.rd-kpi strong { font-size: 26px; font-weight: 800; }
.rd-kpi strong small { font-size: 13px; font-weight: 600; color: var(--gray-500); }
.rd-kpi.rd-alerta { border: 1px solid #f1c4bd; background: #fff6f5; }
.rd-kpi.rd-alerta strong { color: var(--danger); }
.rd-faltam { display: flex; align-items: center; justify-content: space-between; gap: 10px 16px; flex-wrap: wrap; border-left: 4px solid #eda100; }
.rd-falta { display: inline-flex; align-items: center; gap: 4px; margin: 4px 10px 0 0; font-size: 13px; }
.rd-citado { display: grid; grid-template-columns: 240px 1fr 30px; gap: 10px; align-items: center; padding: 5px 0; font-size: 13px; }
.rd-citado-barra { height: 8px; border-radius: 999px; background: var(--gray-100); overflow: hidden; }
.rd-citado-barra i { display: block; height: 100%; background: #eb6834; border-radius: 999px; }
.rd-citado b { text-align: right; }
.rd-grade { display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); gap: 14px; }
.rd-card { margin: 0; display: flex; flex-direction: column; gap: 8px; }
.rd-card header { display: flex; align-items: center; gap: 10px; }
.rd-card header > div { flex: 1; display: flex; flex-direction: column; }
.rd-card header small { color: var(--gray-500); font-size: 12px; }
.rd-emo { font-size: 30px; line-height: 1; }
.rd-nums { display: flex; gap: 6px; flex-wrap: wrap; }
.rd-card p { margin: 0; font-size: 13.5px; line-height: 1.45; }
.rd-card-sis { border: 1px solid #f1c4bd; }
.rd-sis { color: var(--danger); }
@media (max-width: 900px) { .rd-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); } .rd-citado { grid-template-columns: 1fr 80px 24px; } }


/* Controle de Ações → busca de cliente e ficha */
.fc-busca { padding: 14px 16px; }
.fc-busca-form { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.fc-busca-ic { color: var(--hc-500); display: inline-flex; }
.fc-busca-form input[type=search] { flex: 1; min-width: 240px; font-size: 14.5px; padding: 10px 12px; }
.fc-vazio { color: var(--gray-500); font-size: 13px; margin: 10px 0 0; }
.fc-resultados { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 8px; margin-top: 12px; }
.fc-res { display: flex; flex-direction: column; padding: 10px 12px; border: 1px solid var(--gray-200); border-radius: 10px; color: inherit; }
.fc-res:hover { border-color: var(--hc-400); text-decoration: none; }
.fc-res.ativo { border-color: var(--hc-500); background: #eef4fc; }
.fc-res small { color: var(--gray-500); font-size: 12px; }
.fc-res b { font-size: 13px; margin-top: 2px; }
.fc-ficha { margin-top: 14px; border-top: 1px solid var(--gray-200); padding-top: 14px; }
.fc-topo { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; }
.fc-av { width: 52px; height: 52px; border-radius: 50%; background: var(--hc-700); color: #fff; display: inline-flex; align-items: center; justify-content: center; font-weight: 800; font-size: 22px; flex-shrink: 0; }
.fc-quem { flex: 1; min-width: 220px; }
.fc-quem h3 { margin: 0; font-size: 18px; }
.fc-quem > span { font-size: 13px; color: var(--gray-600); }
.fc-tags { display: flex; gap: 6px; flex-wrap: wrap; margin-top: 6px; }
.fc-nums { display: flex; gap: 10px; flex-wrap: wrap; }
.fc-nums > div { background: var(--gray-50); border: 1px solid var(--gray-200); border-radius: 12px; padding: 8px 14px; display: flex; flex-direction: column; min-width: 110px; }
.fc-nums span { font-size: 11.5px; color: var(--gray-500); font-weight: 600; }
.fc-nums strong { font-size: 18px; }
.fc-nums small { font-size: 11.5px; color: var(--gray-500); }
.fc-lista { margin: 14px 0; padding: 10px 14px; border-radius: 10px; font-size: 13.5px; }
.fc-lista.ok { background: var(--success-bg); border: 1px solid #bfe3cd; }
.fc-lista.fora { background: #fff6f5; border: 1px solid #f1c4bd; }
.fc-lista .muted { display: block; font-size: 12px; margin-top: 2px; }
.fc-grade { display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); gap: 12px; }
.fc-grade section { border: 1px solid var(--gray-200); border-radius: 12px; padding: 12px 14px; max-height: 360px; overflow-y: auto; }
.fc-grade h4 { margin: 0 0 8px; font-size: 14px; display: flex; align-items: baseline; gap: 8px; }
.fc-grade h4 small { font-weight: 500; color: var(--gray-500); font-size: 12px; }
.fc-tel { display: flex; align-items: center; gap: 8px; padding: 6px 0; border-bottom: 1px dashed var(--gray-100); font-size: 13.5px; }
.fc-tel small { color: var(--gray-500); }
.fc-st { margin-left: auto; font-size: 11.5px; font-weight: 700; padding: 2px 9px; border-radius: 999px; background: var(--gray-100); color: var(--gray-600); }
.fc-st-ativo { background: var(--success-bg); color: var(--success); }
.fc-st-contato { background: #e3eefc; color: #1c5cab; }
.fc-st-recado { background: var(--warning-bg); color: var(--warning); }
.fc-st-inativo { background: var(--danger-bg); color: var(--danger); }
.fc-item { display: block; padding: 6px 0; border-bottom: 1px dashed var(--gray-100); font-size: 13px; color: inherit; }
a.fc-item:hover { text-decoration: none; background: var(--gray-50); }
.lista-inativo { color: var(--danger); }

/* ---------- Fotos dos operadores (avatar) ---------- */
.op-avatar.com-foto { background: var(--gray-200); overflow: hidden; padding: 0; }
.op-avatar img { width: 100%; height: 100%; object-fit: cover; border-radius: 50%; display: block; }
.op-avatar.xl { width: 96px; height: 96px; font-size: 32px; }
.op-avatar.lg.com-foto, .op-avatar.xl.com-foto { box-shadow: 0 0 0 3px #fff, 0 0 0 5px var(--hc-400), 0 6px 18px rgba(10, 36, 68, .18); }
.op-perfil .op-avatar.lg { width: 76px; height: 76px; }
.op-card .op-avatar.com-foto { box-shadow: 0 0 0 2px #fff, 0 0 0 3.5px var(--hc-100); }
.op-foto-edit { display: flex; align-items: center; gap: 18px; padding: 4px 0 16px; margin-bottom: 14px; border-bottom: 1px solid var(--gray-100); }
.op-foto-preview { position: relative; cursor: pointer; flex-shrink: 0; }
.op-foto-cam { position: absolute; right: 0; bottom: 2px; width: 30px; height: 30px; border-radius: 50%; background: var(--hc-600); color: #fff; display: inline-flex; align-items: center; justify-content: center; box-shadow: 0 0 0 3px #fff; }
.op-foto-preview:hover .op-foto-cam { background: var(--hc-800); }
.op-foto-txt { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.op-foto-botoes { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; margin-top: 4px; }
.op-foto-chk { display: inline-flex; align-items: center; gap: 5px; font-size: 13px; color: var(--gray-600); cursor: pointer; }

/* TV: fotos no ranking, nos últimos acordos e na comemoração */
.tv-av.com-foto { background: #0e3560; overflow: hidden; box-shadow: 0 0 0 2px rgba(255, 255, 255, .25); }
.tv-av img { width: 100%; height: 100%; object-fit: cover; display: block; }
.tv-av-sm { width: 1.7rem; height: 1.7rem; font-size: .62rem; }
.tv-feed li { grid-template-columns: 3.2rem 2rem 1fr; }
.tv-feed-ic { display: inline-flex; align-items: center; justify-content: center; }
.tv-comemora > div { position: relative; overflow: hidden; min-width: 26rem; }
.tv-comemora-fotos { display: flex; justify-content: center; gap: 1rem; margin-bottom: .3rem; }
.tv-comemora-foto { position: relative; animation: tv-pula .7s .15s cubic-bezier(.2, 1.6, .4, 1) both; }
.tv-comemora-foto b { position: absolute; right: -.2rem; bottom: .2rem; min-width: 2rem; height: 2rem; padding: 0 .4rem; border-radius: 1rem; background: #fbbf24; color: #3b2300; font-size: 1.1rem; display: inline-flex; align-items: center; justify-content: center; box-shadow: 0 0 0 3px #047857; }
.tv-av-xl { width: 11rem; height: 11rem; font-size: 3.4rem; box-shadow: 0 0 0 6px #fff, 0 0 0 11px rgba(255, 255, 255, .3), 0 1.2rem 2.5rem rgba(0, 0, 0, .35) !important; }
.tv-comemora-fotos.varios .tv-av-xl { width: 7.5rem; height: 7.5rem; font-size: 2.4rem; }
.tv-comemora-fotos:not(:empty) + .tv-comemora-ic { font-size: 2.6rem; margin-top: -.2rem; }
.tv-comemora-confete { position: absolute; inset: 0; pointer-events: none; }
.tv-comemora-confete i { position: absolute; top: -1rem; width: .6rem; height: 1rem; border-radius: .15rem; background: #fde68a; opacity: .9; animation: tv-confete 2.6s linear infinite; }
.tv-comemora-confete i:nth-child(1) { left: 8%; animation-delay: 0s; }
.tv-comemora-confete i:nth-child(2) { left: 20%; background: #fff; animation-delay: .6s; }
.tv-comemora-confete i:nth-child(3) { left: 33%; background: #a7f3d0; animation-delay: 1.3s; }
.tv-comemora-confete i:nth-child(4) { left: 47%; animation-delay: .3s; }
.tv-comemora-confete i:nth-child(5) { left: 60%; background: #fff; animation-delay: 1.8s; }
.tv-comemora-confete i:nth-child(6) { left: 72%; background: #93c5fd; animation-delay: .9s; }
.tv-comemora-confete i:nth-child(7) { left: 84%; animation-delay: 1.5s; }
.tv-comemora-confete i:nth-child(8) { left: 93%; background: #a7f3d0; animation-delay: .2s; }
@keyframes tv-confete { from { transform: translateY(0) rotate(0); } to { transform: translateY(32rem) rotate(540deg); } }

/* ---------- Metas da equipe (ranking + calendário) ---------- */
.me-mes input { height: 36px; padding: 0 10px; border: 1px solid var(--gray-300); border-radius: 8px; font: inherit; }
.me-kpis { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; margin-bottom: 16px; }
.me-kpi { padding: 14px 16px; display: flex; flex-direction: column; gap: 2px; border-top: 4px solid var(--gray-300); }
.me-kpi span { font-size: 12.5px; font-weight: 700; color: var(--gray-600); }
.me-kpi strong { font-size: 30px; line-height: 1.1; color: var(--hc-900); }
.me-kpi small { font-size: 12px; color: var(--gray-500); }
.me-kpi.me-acima { border-top-color: var(--success); }
.me-kpi.me-perto { border-top-color: #d99a1e; }
.me-kpi.me-abaixo { border-top-color: var(--danger); }
.me-card { margin-bottom: 16px; }
.me-card .card-header { display: flex; align-items: baseline; gap: 12px; flex-wrap: wrap; }
.me-rank { display: flex; flex-direction: column; }
.me-rank-linha { display: grid; grid-template-columns: 44px minmax(190px, 1.3fr) minmax(170px, 1fr) minmax(170px, 1fr) minmax(130px, .7fr) 190px; gap: 14px; align-items: center; padding: 10px 12px; border-radius: 10px; color: inherit; border-bottom: 1px solid var(--gray-100); }
.me-rank-linha.cab { font-size: 11.5px; font-weight: 700; text-transform: uppercase; letter-spacing: .03em; color: var(--gray-500); padding-top: 4px; padding-bottom: 6px; }
a.me-rank-linha:hover { background: var(--hc-50); text-decoration: none; }
.me-rank-linha.ativo { background: var(--hc-100); }
.me-pos { font-size: 20px; font-weight: 800; color: var(--gray-500); text-align: center; }
.me-op { display: flex; align-items: center; gap: 10px; min-width: 0; }
.me-op > span:last-child { display: flex; flex-direction: column; min-width: 0; }
.me-op b { color: var(--hc-900); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.me-op small { color: var(--gray-500); font-size: 12px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.me-bar-txt { font-size: 13px; color: var(--gray-600); display: flex; align-items: baseline; gap: 5px; }
.me-bar-txt b { color: var(--gray-900); font-size: 14px; }
.me-pct { margin-left: auto; font-size: 13px; }
.me-pct.ok { color: var(--success); } .me-pct.quase { color: var(--warning); } .me-pct.nao { color: var(--danger); }
.me-bar { position: relative; height: 8px; border-radius: 4px; background: var(--gray-100); margin-top: 5px; }
.me-bar i { position: absolute; left: 0; top: 0; bottom: 0; border-radius: 4px; }
.me-bar i.ok { background: #2f9e6a; } .me-bar i.quase { background: #e0a632; } .me-bar i.nao { background: #d2533f; }
.me-bar-ideal { position: absolute; left: 83.3%; top: -3px; bottom: -3px; width: 2px; background: var(--gray-700); border-radius: 1px; }
.me-dias { font-size: 13px; color: var(--gray-600); display: flex; flex-direction: column; }
.me-dias b { color: var(--gray-900); font-size: 15px; }
.me-dias small { font-size: 11.5px; color: var(--gray-500); }
.me-faixa { display: inline-flex; align-items: center; gap: 5px; padding: 4px 11px; border-radius: 999px; font-size: 12.5px; font-weight: 700; white-space: nowrap; }
.me-faixa.me-acima { background: var(--success-bg); color: var(--success); }
.me-faixa.me-perto { background: var(--warning-bg); color: var(--warning); }
.me-faixa.me-abaixo { background: var(--danger-bg); color: var(--danger); }
.me-faixa.me-sem { background: var(--gray-100); color: var(--gray-500); }
.me-legenda { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; font-size: 12.5px; color: var(--gray-600); }
.me-legenda span { display: inline-flex; align-items: center; gap: 5px; }
.me-q { display: inline-block; width: 14px; height: 9px; border-radius: 2px; background: var(--gray-200); }
.me-q.sim { background: #2f9e6a; } .me-q.quase { background: #e0a632; } .me-q.nao { background: #d2533f; } .me-q.sem { background: var(--gray-200); }
.me-mapa-wrap { overflow-x: auto; }
.me-mapa { border-collapse: separate; border-spacing: 2px; width: 100%; }
.me-mapa th { font-size: 11.5px; font-weight: 700; color: var(--gray-600); text-align: center; padding: 2px 0; min-width: 24px; }
.me-mapa thead th small { display: block; font-size: 10px; color: var(--gray-400); font-weight: 600; }
.me-mapa th.me-mapa-op { text-align: left; min-width: 150px; position: sticky; left: 0; background: #fff; z-index: 1; padding-right: 8px; }
.me-mapa th.me-mapa-op a { display: inline-flex; align-items: center; gap: 8px; color: var(--hc-900); font-size: 13px; }
.me-mapa th.hoje { color: var(--hc-600); }
.me-mapa td { text-align: center; padding: 3px 1px; border-radius: 5px; }
.me-mapa td a { display: inline-flex; flex-direction: column; gap: 2px; padding: 2px; border-radius: 4px; }
.me-mapa td a:hover { background: var(--hc-100); }
.me-mapa td.fds { background: var(--gray-50); }
.me-mapa td.hoje { box-shadow: inset 0 0 0 2px var(--hc-400); }
.me-mapa tr.ativo th.me-mapa-op, .me-mapa tr.ativo td { background: var(--hc-50); }
.me-mapa td.futuro { background: repeating-linear-gradient(135deg, transparent 0 4px, var(--gray-50) 4px 8px); }
.me-dica { margin: 12px 0 0; }
.me-det { margin-top: 18px; padding-top: 16px; border-top: 1px solid var(--gray-200); }
.me-det-cab { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; margin-bottom: 14px; }
.me-det-cab > div { flex: 1; min-width: 220px; display: flex; flex-direction: column; gap: 5px; align-items: flex-start; }
.me-det-cab h3 { margin: 0; font-size: 18px; color: var(--hc-900); }
.me-cal { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 6px; }
.me-cal-dn { font-size: 11.5px; font-weight: 700; color: var(--gray-500); text-align: center; text-transform: uppercase; }
.me-cal-dia { min-height: 78px; border: 1px solid var(--gray-200); border-radius: 10px; padding: 6px 8px; display: flex; flex-direction: column; gap: 3px; background: #fff; }
.me-cal-dia.fds { background: var(--gray-50); }
.me-cal-dia.hoje { border-color: var(--hc-400); box-shadow: 0 0 0 1px var(--hc-400); }
.me-cal-dia.futuro { background: repeating-linear-gradient(135deg, #fff 0 6px, var(--gray-50) 6px 12px); }
.me-cal-n { font-weight: 800; color: var(--gray-700); font-size: 13px; }
.me-cal-n small { font-weight: 700; color: var(--hc-600); font-size: 10.5px; text-transform: uppercase; }
.me-cal-l { display: flex; align-items: center; gap: 5px; font-size: 12px; color: var(--gray-600); white-space: nowrap; }
.me-cal-l b { color: var(--gray-900); }
.me-cal-l .me-q { width: 9px; height: 9px; border-radius: 50%; }
@media (max-width: 1100px) {
  .me-rank-linha { grid-template-columns: 36px minmax(150px, 1fr) minmax(140px, 1fr) minmax(140px, 1fr); }
  .me-rank-linha > span:nth-child(5), .me-rank-linha > span:nth-child(6) { grid-column: span 2; }
  .me-rank-linha.cab > span:nth-child(5), .me-rank-linha.cab > span:nth-child(6) { display: none; }
}
@media (max-width: 760px) {
  .me-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .me-rank-linha { grid-template-columns: 32px 1fr; }
  .me-rank-linha > span { grid-column: 2; }
  .me-rank-linha > span.me-pos { grid-column: 1; grid-row: span 5; align-self: start; }
  .me-rank-linha.cab { display: none; }
  .me-cal-dia { min-height: 64px; padding: 4px; }
  .me-cal-l { font-size: 10.5px; }
}

/* Recados automáticos: lista na cobrança e variações de texto */
.rec-auto-lista { margin-top: 12px; padding: 12px 14px; border: 1px solid var(--gray-200); border-radius: 10px; background: var(--gray-50); display: flex; flex-direction: column; gap: 8px; font-size: 13.5px; }
.rec-auto-lista input[type=number] { padding: 3px 6px; }
.rec-auto-fonte { display: flex; align-items: center; gap: 8px 14px; flex-wrap: wrap; }
.rec-auto-fonte label { display: inline-flex; align-items: center; gap: 5px; cursor: pointer; }
.rec-auto-fonte select { max-width: 260px; }
.rec-variacoes { border: 1px solid var(--gray-200); border-radius: 10px; padding: 8px 12px 12px; margin: 0 0 12px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.rec-variacoes legend { font-weight: 700; font-size: 13px; padding: 0 6px; color: var(--hc-900); }
.rec-variacoes textarea { width: 100%; font-size: 13px; }
@media (max-width: 760px) { .rec-variacoes { grid-template-columns: 1fr; } }

/* Metas da equipe → Comparativo de períodos (usa também os ev-* da Evolução de Recebimentos) */
.cp-veredito { display: flex; align-items: center; gap: 20px; padding: 16px 20px; margin: 16px 0; border-left: 6px solid var(--gray-300); }
.cp-ver-selo { display: flex; flex-direction: column; align-items: center; min-width: 120px; padding: 10px 14px; border-radius: 12px; background: var(--gray-100); color: var(--gray-600); line-height: 1.1; }
.cp-ver-selo span { font-size: 20px; }
.cp-ver-selo strong { font-size: 26px; font-weight: 800; }
.cp-ver-selo small { font-size: 11.5px; font-weight: 600; opacity: .85; }
.cp-ver-txt p { margin: 0 0 6px; }
.cp-ver-txt p:first-child { font-size: 15px; font-weight: 600; color: var(--gray-900); }
.cp-v-melhor { border-left-color: var(--success); }
.cp-v-melhor .cp-ver-selo { background: var(--success-bg); color: var(--success); }
.cp-v-igual { border-left-color: var(--hc-500); }
.cp-v-igual .cp-ver-selo { background: var(--hc-100); color: var(--hc-700); }
.cp-v-pior { border-left-color: var(--danger); }
.cp-v-pior .cp-ver-selo { background: var(--danger-bg); color: var(--danger); }
.cp-ind { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; margin-bottom: 16px; }
.cp-ind-card { padding: 12px 16px; display: flex; flex-direction: column; gap: 3px; border-top: 4px solid var(--gray-300); }
.cp-ind-card.cp-melhor { border-top-color: var(--success); }
.cp-ind-card.cp-igual { border-top-color: var(--hc-400); }
.cp-ind-card.cp-pior { border-top-color: var(--danger); }
.cp-ind-rot { font-size: 12.5px; font-weight: 700; color: var(--gray-600); }
.cp-ind-val { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.cp-ind-val strong { font-size: 26px; line-height: 1.15; color: var(--hc-900); font-variant-numeric: tabular-nums; }
.cp-ind-b { font-size: 12.5px; color: var(--gray-600); font-variant-numeric: tabular-nums; }
.cp-met { display: inline-flex; border: 1px solid var(--gray-200); border-radius: 8px; overflow: hidden; }
.cp-met a { padding: 5px 12px; font-size: 12.5px; font-weight: 600; color: var(--gray-600); }
.cp-met a + a { border-left: 1px solid var(--gray-200); }
.cp-met a:hover { text-decoration: none; color: var(--hc-700); }
.cp-met a.on { background: var(--hc-700); color: #fff; }
.cp-tab th small { font-weight: 500; color: var(--gray-500); }
.cp-tab td { font-variant-numeric: tabular-nums; }
@media (max-width: 1200px) { .cp-ind { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 640px) { .cp-ind { grid-template-columns: minmax(0, 1fr); } .cp-veredito { flex-direction: column; align-items: stretch; } }
.cp-nota { background: var(--warning-bg); color: var(--warning); border-radius: 8px; padding: 6px 10px; font-weight: 600; }

/* Controle de Ações → Ações registradas: lista compacta (abre para ver a estratégia) */
.rg-filtros { display: flex; gap: 10px; flex-wrap: wrap; align-items: center; justify-content: space-between; margin-bottom: 12px; }
.rg-busca { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; flex: 1 1 320px; }
.rg-busca input[type=search] { flex: 1 1 220px; min-width: 0; max-width: 340px; }
.rg-sel { display: flex; gap: 8px; flex-wrap: wrap; }
.rg-sel select { width: auto; max-width: 220px; }
.rg-achados { background: var(--hc-50); border: 1px solid var(--hc-100); border-radius: var(--radius); padding: 10px 12px; margin-bottom: 12px; }
.rg-lista { border: 1px solid var(--gray-200); border-radius: var(--radius); overflow: hidden; }
.rg-item { border-top: 1px solid var(--gray-200); background: var(--white); }
.rg-item:first-child { border-top: 0; }
.rg-item[hidden] { display: none; }
.rg-item > summary { display: grid; grid-template-columns: 74px minmax(0, 1fr) auto 84px; gap: 12px; align-items: center; padding: 8px 12px; cursor: pointer; list-style: none; }
.rg-item > summary::-webkit-details-marker { display: none; }
.rg-item > summary:hover { background: var(--gray-50); }
.rg-item[open] > summary { background: var(--hc-50); }
.rg-data { font-size: 12.5px; font-weight: 600; font-variant-numeric: tabular-nums; line-height: 1.2; }
.rg-data small { display: block; font-weight: 400; color: var(--gray-500); }
.rg-tit { min-width: 0; line-height: 1.25; }
.rg-tit strong { display: block; font-size: 13.5px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.rg-tit small { display: block; color: var(--gray-500); font-size: 12px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.rg-qtd { text-align: right; font-weight: 700; font-variant-numeric: tabular-nums; line-height: 1.1; }
.rg-qtd small { display: block; font-weight: 400; font-size: 11px; color: var(--gray-500); }
.rg-corpo { padding: 4px 12px 12px 98px; }
.rg-dl { display: grid; grid-template-columns: 120px minmax(0, 1fr); gap: 4px 12px; margin: 0 0 10px; font-size: 13px; }
.rg-dl dt { color: var(--gray-500); font-weight: 600; }
.rg-dl dd { margin: 0; }
.rg-botoes { display: flex; gap: 8px; flex-wrap: wrap; }
.rg-vazio { padding: 10px 12px; margin: 0; }
.rg-pag { display: flex; gap: 6px; flex-wrap: wrap; align-items: center; margin-top: 10px; }
.rg-pag[hidden] { display: none; }
.rg-pag .muted { margin-left: 6px; font-size: 12.5px; }
.rg-cel { display: block; color: inherit; text-decoration: none; border-radius: 6px; padding: 2px 4px; }
.rg-cel:hover { background: var(--hc-50); }
.rg-cel:hover strong { text-decoration: underline; }
@media (max-width: 640px) {
  .rg-item > summary { grid-template-columns: 60px minmax(0, 1fr) 64px; }
  .rg-item > summary .badge { display: none; }
  .rg-corpo { padding-left: 12px; }
  .rg-dl { grid-template-columns: 1fr; }
}

/* Acordos: filtro "Vencimento em" (faixa de datas) */
.ac-venc-campos { display: flex; align-items: center; gap: 6px; }
.ac-venc-campos input { width: 150px; }
.ac-venc-campos span { font-size: 13px; color: var(--gray-500); }
.ac-venc-atalhos { display: flex; gap: 10px; margin-top: 4px; }
@media (max-width: 640px) { .ac-venc-campos input { width: auto; flex: 1 1 0; min-width: 0; } }

/* Listas dos operadores: aviso de volume mínimo e ampliação */
.lo-vol-alerta { display: flex; gap: 10px; align-items: flex-start; background: var(--danger-bg); border: 1px solid #f0c8c2; border-left: 4px solid var(--danger); color: var(--gray-800); border-radius: var(--radius); padding: 10px 14px; margin: 0 0 14px; font-size: 13px; }
.lo-vol-alerta > svg { color: var(--danger); flex-shrink: 0; margin-top: 2px; }
.lo-vol-alerta ul { margin: 4px 0 0; padding-left: 18px; }
.lo-vol-alerta li { margin: 2px 0; }
.lo-ok { color: var(--success); font-weight: 600; }
.lo-falta { color: var(--danger); font-weight: 600; }
.lo-passos td { vertical-align: middle; }
.lo-passos input[type=radio] { width: auto; }
.lo-passo-base td { background: var(--gray-50); }
.lo-passo-sug td { background: var(--success-bg); }

/* ---------- Acordos (layout novo: cards, abas por sistema, coluna lateral) ---------- */
.ack-grid { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 12px; margin-bottom: 14px; }
.ack { display: flex; flex-direction: column; gap: 1px; padding: 12px 14px 10px;
  background: linear-gradient(180deg, var(--c-soft), #fff 70%); border: 1px solid var(--c-bg); border-radius: var(--radius-lg); box-shadow: var(--shadow);
  color: inherit; text-decoration: none; transition: transform .12s ease, box-shadow .12s ease; min-width: 0; }
a.ack:hover { transform: translateY(-2px); box-shadow: var(--shadow-lg); text-decoration: none; }
.ack.ativo { box-shadow: 0 0 0 2px var(--c), var(--shadow); }
.ack-andamento { --c: var(--hc-600); --c-bg: #d4e3f6; --c-soft: #f3f8fe; }
.ack-top { display: flex; align-items: center; gap: 8px; margin-bottom: 6px; }
.ack-ic { display: inline-flex; align-items: center; justify-content: center; width: 28px; height: 28px; border-radius: 8px; background: var(--c-bg); color: var(--c); flex-shrink: 0; }
.ack-nome { font-weight: 700; color: var(--c); font-size: 12.5px; line-height: 1.2; }
.ack-v { font-size: 22px; font-weight: 800; letter-spacing: -.02em; color: var(--gray-900); line-height: 1.1; }
.ack-l { font-size: 11.5px; color: var(--gray-500); line-height: 1.35; }
.ack-valor { margin-top: auto; padding-top: 4px; text-align: right; font-weight: 800; color: var(--c); font-size: 13px; }
.ack-ic svg { width: 16px; height: 16px; }

.ack-layout { width: 100%; }
.ack-main { min-width: 0; }
.ack-alerta { display: flex; align-items: center; gap: 12px; background: #fff8e8; border: 1px solid #f3d9a4; border-radius: var(--radius-lg); padding: 9px 14px; margin-bottom: 12px; font-size: 12.5px; }
.ack-alerta-ic { display: inline-flex; align-items: center; justify-content: center; width: 34px; height: 34px; border-radius: 50%; background: #fbe3b0; color: #a4670c; flex-shrink: 0; }
.ack-alerta a { margin-left: auto; white-space: nowrap; font-weight: 700; font-size: 12.5px; }

.ack-painel { padding: 16px; }
.ack-barra { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; justify-content: space-between; margin-bottom: 14px; }
.ack-sis { display: flex; flex-wrap: wrap; gap: 8px; }
.ack-sis a { display: inline-flex; align-items: center; gap: 7px; padding: 6px 14px; border-radius: 999px; background: var(--gray-100); color: var(--gray-700); font-weight: 600; font-size: 13px; text-decoration: none; }
.ack-sis a:hover { background: var(--gray-200); text-decoration: none; }
.ack-sis a.ativo { background: var(--hc-900); color: #fff; }
.ack-sis a b { font-size: 11.5px; background: rgba(255,255,255,.18); padding: 1px 8px; border-radius: 999px; }
.ack-sis a:not(.ativo) b { background: var(--gray-200); }
.ack-sis-v { font-size: 11.5px; font-weight: 700; opacity: .75; }
.ack-acoes { display: flex; gap: 8px; }

.acs-aquicob { --s: #1d6fd1; --s-bg: #e6f0fc; }
.acs-cobmais { --s: #138a55; --s-bg: #e3f5ec; }
.acs-xprisma { --s: #7a3fc4; --s-bg: #f1e9fb; }
.acs-letra { display: inline-flex; align-items: center; justify-content: center; width: 22px; height: 22px; border-radius: 6px; background: var(--s, var(--gray-500)); color: #fff; font-size: 12px; font-weight: 800; flex-shrink: 0; }
.ack-sis a.ativo .acs-letra { box-shadow: 0 0 0 2px rgba(255,255,255,.6); }

.ack-filtros { display: flex; flex-wrap: wrap; gap: 10px; align-items: flex-start; padding: 10px 12px; background: var(--gray-50); border: 1px solid var(--gray-100); border-radius: var(--radius); margin-bottom: 12px; }
.ack-filtros .form-field { margin: 0; min-width: 180px; flex: 1 1 180px; }
.ack-filtros select, .ack-filtros input[type=date] { padding-top: 6px; padding-bottom: 6px; font-size: 13px; }
.ack-filtros label { font-size: 12px; }
.ack-filtros .ac-venc-campos input { width: 140px; }
.ack-filtros .ack-venc { flex: 0 1 auto; }
.ack-filtros .ac-check { align-self: center; padding: 0; }
.ack-busca { margin-bottom: 14px; }
.ack-busca label { display: block; margin-bottom: 6px; }
.ack-busca textarea { width: 100%; font-family: inherit; font-size: 13px; padding: 8px 10px; border: 1px solid var(--gray-200); border-radius: var(--radius); resize: vertical; }
.ack-busca-acoes { display: flex; flex-wrap: wrap; gap: 8px; margin: 8px 0 4px; }
.ack-busca .ac-chips { margin-top: 10px; }
.ack-busca-sem { margin: 10px 0; }
.ack-busca-sem summary { cursor: pointer; margin-bottom: 6px; }

.ack-tabela thead th { font-size: 11px; text-transform: uppercase; letter-spacing: .04em; color: var(--gray-500); }
.ack-tabela tr.ack-secao td { background: var(--s-bg, var(--gray-100)); padding: 9px 12px; border-top: 8px solid #fff; }
.ack-tabela tr.ack-secao strong { color: var(--s, var(--gray-800)); font-size: 14px; margin-left: 6px; vertical-align: middle; }
.ack-tabela tr.ack-secao .acs-letra { vertical-align: middle; }
.ack-secao-n { float: right; font-size: 12px; font-weight: 700; color: var(--s, var(--gray-600)); }
.ack-cli { min-width: 190px; max-width: 240px; }
.ack-atraso-ant { white-space: normal; max-width: 150px; color: var(--danger); }
.ack-fazer { min-width: 170px; max-width: 240px; color: var(--gray-600); }
.ack-tabela td { vertical-align: top; }

.ack-lado { display: flex; flex-direction: column; gap: 14px; }
.ack-box { padding: 16px; }
.ack-box h3 { display: flex; align-items: center; gap: 6px; margin: 0 0 12px; font-size: 14px; color: var(--hc-900); }
.ack-res { display: flex; align-items: center; gap: 10px; padding: 10px 6px; border-bottom: 1px solid var(--gray-100); color: inherit; text-decoration: none; border-radius: 8px; }
.ack-res:last-child { border-bottom: 0; }
.ack-res:hover, .ack-res.ativo { background: var(--s-bg); text-decoration: none; }
.ack-res .acs-letra { width: 32px; height: 32px; font-size: 15px; border-radius: 8px; }
.ack-res-nome { display: flex; flex-direction: column; min-width: 0; flex: 1; }
.ack-res-nome strong { color: var(--s); font-size: 13px; }
.ack-res-nome small { color: var(--gray-500); font-size: 11.5px; }
.ack-res-v { margin-left: auto; font-weight: 800; font-size: 12.5px; white-space: nowrap; }
.ack-legenda, .ack-dicas { list-style: none; margin: 0; padding: 0; font-size: 12.5px; }
.ack-legenda li { display: flex; align-items: center; gap: 8px; padding: 3px 0; color: var(--gray-700); }
.ack-legenda i { width: 11px; height: 11px; border-radius: 50%; background: var(--c); flex-shrink: 0; }
.ack-dicas li { position: relative; padding: 0 0 8px 14px; color: var(--gray-600); line-height: 1.45; }
.ack-dicas li::before { content: ""; position: absolute; left: 0; top: 7px; width: 5px; height: 5px; border-radius: 50%; background: var(--hc-400); }

@media (max-width: 1000px) { .ack-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }

/* Botão flutuante de ajuda (legenda / como ler) — fica logo acima do botão do chat */
.ajuda-flut { position: fixed; right: 18px; bottom: 80px; z-index: 59; display: flex; flex-direction: column; align-items: flex-end; gap: 10px; }
body:not(:has(#chatFlut)) .ajuda-flut { bottom: 18px; }
.ajuda-flut-botao { width: 52px; height: 52px; border-radius: 50%; border: 0; background: var(--white); color: var(--hc-700); font-size: 22px; font-weight: 800;
  box-shadow: 0 4px 14px rgba(0,0,0,.2); cursor: pointer; border: 2px solid var(--hc-700); }
.ajuda-flut-botao:hover { background: var(--hc-700); color: #fff; }
.ajuda-flut-painel { position: relative; width: 360px; max-height: calc(calc(100 * var(--vh)) - 170px); overflow-y: auto; background: var(--white); border-radius: 14px; box-shadow: 0 8px 30px rgba(0,0,0,.22); padding: 4px 0; }
.ajuda-flut-painel .ack-box + .ack-box { border-top: 1px solid var(--gray-100); }
.ajuda-flut-x { position: absolute; top: 8px; right: 10px; border: 0; background: none; font-size: 20px; color: var(--gray-500); cursor: pointer; }
@media (max-width: 480px) { .ajuda-flut-painel { width: calc(100vw - 36px); } }
@media (max-width: 640px) {
  .ack-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  .ack-andamento { grid-column: 1 / -1; }
  .ack-v { font-size: 24px; }
  .ack-alerta { flex-wrap: wrap; }
  .ack-alerta a { margin-left: 46px; }
  .ack-barra, .ack-acoes { width: 100%; }
  .ack-acoes .btn { flex: 1; justify-content: center; }
  .ack-filtros .form-field { min-width: 0; flex: 1 1 100%; }
}

/* ===== Negociações e Projeção ===== */
.ng-duo { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; margin-bottom: 16px; }
.ng-duo > .card { margin-bottom: 0; }
.ng-barra { fill: #1857a0; }
.ng-barra.atual { fill: #6ea2e0; }
.ng-barra.bruto { fill: #c9d8ee; }
.ng-linha { fill: none; stroke-width: 2.5; stroke-linejoin: round; stroke-linecap: round; }
.ng-linha.tk, .ng-pt.tk { stroke: #7c3aed; }
.ng-linha.en, .ng-pt.en { stroke: #16a34a; }
.ng-pt { fill: var(--white); stroke-width: 2.5; }
.ng-rot-p { font-size: 10.5px; }
.rc-legenda i.ng-tk { background: #7c3aed; }
.rc-legenda i.ng-en { background: #16a34a; }
.rc-legenda i.ng-br { background: #c9d8ee; }
.rc-legenda i.ng-re { background: #1857a0; }
.ng-val { height: 6px; background: var(--gray-100); border-radius: 3px; margin-bottom: 3px; overflow: hidden; }
.ng-val span { display: block; height: 100%; background: #1857a0; border-radius: 3px; }
.ng-faixas { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 12px; }
.ng-faixa { display: flex; flex-direction: column; gap: 3px; padding: 12px; border: 1px solid var(--gray-200); border-radius: 10px; min-width: 0; }
.ng-faixa-lbl { font-size: 11.5px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: var(--gray-600); }
.ng-faixa-sub { font-size: 11px; color: var(--gray-500); }
.ng-faixa strong { font-family: "Montserrat", var(--font); font-size: 18px; color: #0a1f3d; white-space: nowrap; margin-top: 4px; }
.ng-faixa small { font-size: 11px; color: var(--gray-500); }
.ng-faixa.ng-f-atr { border-color: #f5c99b; background: #fff8f0; }
.ng-faixa.ng-f-atr .ng-val span { background: #ea7a0c; }
.ng-faixa.ng-f-hoje { border-color: #9cc0ea; background: var(--hc-50); }
@media (max-width: 1350px) { .ng-faixas { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 1150px) { .ng-duo { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 640px) { .ng-faixas { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.ev-tab .rel-delta { white-space: nowrap; }
.ng-duo-larga { grid-template-columns: minmax(0, 1fr) minmax(0, 1.25fr); }
@media (max-width: 1500px) { .ng-duo-larga { grid-template-columns: minmax(0, 1fr); } }

/* Negociações: clientes negociados A × B */
.cn-filtros { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin-bottom: 14px; }
.cn-busca { display: flex; align-items: center; gap: 6px; flex: 1 1 220px; max-width: 320px; padding: 0 10px; border: 1px solid var(--gray-300); border-radius: 8px; color: var(--gray-500); background: var(--white); }
.cn-busca input { border: none; outline: none; box-shadow: none; padding: 7px 0; flex: 1; min-width: 0; background: transparent; }
.cn-chips { display: flex; flex-wrap: wrap; gap: 6px; }
.cn-chip { border: 1px solid var(--gray-300); background: var(--white); color: var(--gray-600); border-radius: 999px; padding: 4px 12px; font-size: 12px; font-weight: 600; cursor: pointer; }
.cn-chip:hover { border-color: var(--hc-400); color: var(--hc-700); }
.cn-chip.on { background: var(--hc-700); border-color: var(--hc-700); color: #fff; }
#cnOp { width: auto; min-width: 180px; }
.cn-duo { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.cn-col { border: 1px solid var(--gray-200); border-radius: 12px; padding: 0 0 12px; min-width: 0; overflow: hidden; }
.cn-col.a { border-top: 3px solid #1857a0; }
.cn-col.b { border-top: 3px dashed #8a93a3; }
.cn-col > .cn-mais { margin: 4px 14px 0; }
.cn-col-h { display: flex; justify-content: space-between; align-items: flex-end; gap: 10px; padding: 12px 14px; background: var(--gray-50); border-bottom: 1px solid var(--gray-200); }
.cn-col-h > div:first-child { display: flex; flex-direction: column; gap: 3px; }
.cn-tag { font-size: 11px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }
.cn-tag.a { color: #1857a0; }
.cn-tag.b { color: var(--gray-600); }
.cn-col-tot { display: flex; flex-direction: column; align-items: flex-end; text-align: right; }
.cn-col-tot strong { font-family: "Montserrat", var(--font); font-size: 19px; color: #0a1f3d; white-space: nowrap; }
.cn-lista { list-style: none; margin: 0; padding: 0; }
.cn-item { display: grid; grid-template-columns: 22px 36px minmax(0, 1fr) auto; align-items: center; gap: 10px; padding: 10px 14px; border-bottom: 1px solid var(--gray-100); }
.cn-item:hover { background: var(--hc-50); }
.cn-col:not(.cn-todos) .cn-extra, .cn-item.cn-oculto { display: none; }
.cn-pos { font-size: 12px; font-weight: 700; color: var(--gray-400); text-align: right; }
.cn-av { width: 36px; height: 36px; border-radius: 50%; display: grid; place-items: center; color: #fff; font-size: 12.5px; font-weight: 700; letter-spacing: .02em; box-shadow: inset 0 0 0 2px rgba(255,255,255,.35); }
.cn-info { min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.cn-nome { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 6px; }
.cn-nome strong { font-size: 13.5px; color: var(--gray-900); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 100%; }
.cn-nome .badge { font-size: 10px; padding: 0 7px; }
.cn-sub { font-size: 11.5px; color: var(--gray-500); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cn-barra { height: 5px; background: var(--gray-100); border-radius: 3px; overflow: hidden; margin: 3px 0 2px; }
.cn-barra span { display: block; height: 100%; border-radius: 3px; background: linear-gradient(90deg, #4f92d6, #1857a0); }
.cn-col.b .cn-barra span { background: linear-gradient(90deg, #b4bccb, #8a93a3); }
.cn-op { display: inline-flex; align-items: center; gap: 3px; font-weight: 600; color: var(--hc-700); }
.cn-op.sem { color: var(--danger); }
.cn-valor { display: flex; flex-direction: column; align-items: flex-end; text-align: right; }
.cn-valor strong { font-family: "Montserrat", var(--font); font-size: 15px; color: #0a1f3d; white-space: nowrap; }
.cn-valor small { font-size: 11px; color: var(--gray-500); white-space: nowrap; }
.cn-vazio { padding: 24px 14px; text-align: center; color: var(--gray-400); font-size: 13px; }
@media (max-width: 1150px) { .cn-duo { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 520px) { .cn-item { grid-template-columns: 30px minmax(0, 1fr) auto; } .cn-pos { display: none; } }
.flash.flash-warning > svg:first-child { display: inline-block; vertical-align: -2px; margin-right: 2px; }

/* =====================================================================
   Notebook / monitor pequeno: o sistema foi desenhado em px para telas
   grandes e, em 1366×768 com o navegador a 100%, fica tudo grande demais
   (a TV escala sozinha pela tela e não entra aqui). Reduz o conjunto como
   se fosse o zoom do navegador — só a partir de 901px (celular já tem o
   seu layout). As alturas em vh usam var(--vh), que desfaz o zoom; no JS,
   posição medida na tela (getBoundingClientRect, clientX) ÷ hcZoom() antes
   de virar style.left/top.
   ===================================================================== */
@media screen and (min-width: 901px) and (max-width: 1600px), screen and (min-width: 901px) and (max-height: 820px) {
  html:not(.tv-html) { --hc-zoom: .9; }
}
@media screen and (min-width: 901px) and (max-width: 1440px), screen and (min-width: 901px) and (max-height: 700px) {
  html:not(.tv-html) { --hc-zoom: .82; }
}
/* Apresentação de relatório: os slides já se ajustam à tela sozinhos */
html:not(.tv-html):has(body.rel-apresentando) { --hc-zoom: 1; }
html:not(.tv-html) { zoom: var(--hc-zoom, 1); }
/* 1vh "de verdade" dentro do zoom (o zoom encolhe vh junto): use calc(N * var(--vh)) */
:root { --vh: calc(1vh / var(--hc-zoom, 1)); }

/* =====================================================================
   Portal do operador (portal.php) — mesmo layout do sistema: menu lateral
   com as seções dele, topo com busca, e os componentes do Dashboard
   (.ini-hero, .ini-kpis, .ini-alertas, .card). Aqui só o que é do portal.
   ===================================================================== */
.user-avatar.com-foto { overflow: hidden; padding: 0; }
.user-avatar img { width: 100%; height: 100%; object-fit: cover; display: block; }
.ini-kpi-ic.vermelho { color: #dc2626; background: #fef0f0; }
div.ini-kpi:hover { transform: none; box-shadow: var(--shadow-sm); border-color: var(--gray-200); }
.po-kpis-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.po .badge { display: inline-flex; align-items: center; gap: 4px; }

/* Busca no topo (só nos clientes dele) */
.po-busca { position: relative; display: flex; align-items: center; gap: 8px; width: min(380px, 34vw); padding: 0 12px; border: 1px solid var(--gray-200); border-radius: 10px; background: var(--gray-50); color: var(--gray-400); transition: border-color .15s, background .15s, box-shadow .15s; }
.po-busca:focus-within { background: #fff; border-color: var(--hc-400); box-shadow: 0 0 0 3px rgba(34, 110, 189, .12); color: var(--hc-600); }
.po-busca input { flex: 1; min-width: 0; border: 0; background: transparent; padding: 9px 0; font-size: 13.5px; box-shadow: none; }
.po-busca input:focus { outline: none; box-shadow: none; }
.po-busca-res { position: absolute; top: calc(100% + 8px); right: 0; width: 460px; max-width: calc(100vw - 32px); max-height: 420px; overflow-y: auto; z-index: 50; background: #fff; border: 1px solid var(--gray-200); border-radius: 14px; box-shadow: var(--shadow-lg); padding: 6px; }
.po-busca-item { display: flex; align-items: center; gap: 10px; padding: 9px 10px; border-radius: 10px; cursor: pointer; color: var(--gray-800); }
.po-busca-item:hover { background: var(--hc-50); }
.po-busca-item > div { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.po-busca-item strong { font-size: 13px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.po-busca-item small { color: var(--gray-500); font-size: 12px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.po-busca-item a { font-size: 12.5px; font-weight: 600; white-space: nowrap; }
.po-busca-vazio { padding: 14px; text-align: center; color: var(--gray-500); font-size: 13px; }

/* Destaque: números do dia dentro do hero */
.po-hero-nums { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 22px; }
.po-hero-nums > div { display: flex; align-items: center; gap: 9px; padding: 9px 15px; border-radius: 12px; background: rgba(255, 255, 255, .07); border: 1px solid rgba(121, 165, 242, .25); color: #79a5f2; }
.po-hero-nums b { font-family: "Montserrat", var(--font); font-size: 20px; font-weight: 800; color: #fff; line-height: 1; }
.po-hero-nums span { font-size: 12.5px; color: #c9d6ee; }

/* Barrinha de progresso (cartões, lotes) */
.po-prog { display: inline-block; flex: 1; min-width: 60px; height: 7px; border-radius: 99px; background: var(--gray-100); overflow: hidden; vertical-align: middle; }
.po-prog b { display: block; height: 100%; border-radius: 99px; background: linear-gradient(90deg, #2e6bff, #5b8dff); }

/* Vencem hoje — prioridade */
.po-venc { display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); gap: 10px; }
.po-venc-item { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; grid-template-rows: auto auto; column-gap: 12px; row-gap: 6px; align-items: center; padding: 12px 14px; border: 1px solid var(--gray-200); border-left: 3px solid #dc2626; border-radius: 12px; background: #fff; }
.po-venc-av { grid-row: span 2; width: 38px; height: 38px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; background: #fef0f0; color: #dc2626; font-weight: 800; }
.po-venc-quem { display: flex; flex-direction: column; min-width: 0; }
.po-venc-quem strong { font-size: 13.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; color: var(--gray-900); }
.po-venc-quem small { font-size: 12px; color: var(--gray-500); }
.po-venc-valor { font-family: "Montserrat", var(--font); font-size: 16px; font-weight: 800; color: #0a1f3d; white-space: nowrap; }
.po-venc-item .po-tel { grid-column: 2 / -1; }

/* Telefone clicável e linha de apoio nas tabelas */
.po-tel { display: inline-flex; align-items: center; gap: 5px; font-weight: 600; font-size: 12.5px; white-space: nowrap; color: var(--hc-600); }
.po-sub { display: block; font-size: 11.5px; color: var(--gray-500); font-weight: 400; margin-top: 1px; }
.po-linha-hoje td { background: #fff8f7; }
.po-linha-feita td { color: var(--gray-500); }
.po-linha-feita strong { color: var(--gray-600); }

/* Clientes direcionados: barra empilhada */
.po-empilhada { display: flex; gap: 3px; height: 14px; border-radius: 99px; overflow: hidden; background: var(--gray-100); }
.po-empilhada i { display: block; }
.po-empilhada .feito, .po-legenda i.feito { background: #2e6bff; }
.po-empilhada .pend, .po-legenda i.pend { background: #cdd2dc; }
.po-legenda { display: flex; align-items: center; flex-wrap: wrap; gap: 8px 18px; margin-top: 12px; font-size: 13px; color: var(--gray-600); }
.po-legenda span { display: inline-flex; align-items: center; gap: 6px; }
.po-legenda i { width: 10px; height: 10px; border-radius: 50%; display: inline-block; }
.po-legenda a { margin-left: auto; font-weight: 600; }

/* Meus clientes */
.po-barra-acao { display: flex; align-items: center; justify-content: space-between; gap: 12px 20px; flex-wrap: wrap; margin-bottom: 16px; padding: 14px 18px; border-radius: 14px; background: linear-gradient(90deg, #eef3ff, #f7f9ff); border: 1px solid #cfdcff; }
.po-barra-acao > div { display: flex; flex-direction: column; }
.po-barra-acao strong { color: #0a1f3d; }
.po-barra-acao small { color: var(--gray-500); font-size: 12.5px; }
.po-lote > summary { list-style: none; display: flex; align-items: center; gap: 12px; cursor: pointer; }
.po-lote > summary::-webkit-details-marker { display: none; }
.po-lote[open] > summary { margin-bottom: 14px; padding-bottom: 12px; border-bottom: 1px solid var(--gray-100); }
.po-lote-seta { display: inline-flex; color: var(--gray-400); transform: rotate(180deg); transition: transform .15s; }
.po-lote[open] .po-lote-seta { transform: rotate(270deg); }
.po-lote-tit { display: flex; flex-direction: column; min-width: 0; flex: 1; }
.po-lote-tit strong { color: var(--hc-900); font-size: 14.5px; }
.po-lote-tit small { color: var(--gray-500); font-size: 12px; }
.po-lote-prog { display: inline-flex; align-items: center; gap: 10px; font-size: 12.5px; font-weight: 600; color: var(--gray-600); white-space: nowrap; }
.po-lote-prog .po-prog { width: 140px; flex: none; }
.po-nota { margin: 12px 0 0; }

/* Recebimentos: seletor de mês */
.po-mes { display: flex; align-items: center; gap: 10px; margin-bottom: 14px; }
.po-mes strong { font-size: 15px; color: var(--hc-900); min-width: 150px; text-align: center; }

/* Registro do dia */
.po-dia { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(300px, 1fr); gap: 16px; align-items: start; }
.po-registro { display: flex; flex-direction: column; gap: 8px; margin: 0; }
.po-reg-l { font-weight: 700; font-size: 13px; margin-top: 10px; color: var(--hc-900); }
.po-humor { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 8px; }
.po-humor label { cursor: pointer; }
.po-humor input { position: absolute; opacity: 0; pointer-events: none; }
.po-humor span { display: flex; flex-direction: column; align-items: center; gap: 4px; padding: 12px 4px; border: 1.5px solid var(--gray-200); border-radius: 12px; font-size: 12.5px; font-weight: 600; color: var(--gray-600); background: #fff; transition: border-color .12s, background .12s, transform .12s; }
.po-humor span b { font-size: 28px; line-height: 1; filter: grayscale(.35); }
.po-humor label:hover span { border-color: var(--hc-400); }
.po-humor input:checked + span { border-color: #2e6bff; background: #eef3ff; color: #0a1f3d; transform: translateY(-2px); box-shadow: 0 4px 12px rgba(46, 107, 255, .15); }
.po-humor input:checked + span b { filter: none; }
.po-humor input:focus-visible + span { outline: 2px solid #2e6bff; outline-offset: 2px; }
.po-reg-nums { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-top: 6px; }
.po-reg-num { display: flex; gap: 12px; align-items: center; border: 1px solid var(--gray-200); border-radius: 12px; padding: 12px 14px; background: var(--gray-50); }
.po-reg-num .ini-kpi-ic { width: 40px; height: 40px; flex-shrink: 0; }
.po-reg-num > div { flex: 1; display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.po-reg-num label { font-size: 11.5px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; color: var(--gray-500); }
.po-reg-num input { font-family: "Montserrat", var(--font); font-size: 20px; font-weight: 800; padding: 6px 10px; color: #0a1f3d; }
.po-reg-num small { font-size: 11.5px; color: var(--gray-500); }
.po-chips { display: flex; flex-wrap: wrap; gap: 6px; }
.po-chips button { display: inline-flex; align-items: center; gap: 4px; border: 1px solid var(--gray-200); background: #fff; color: var(--gray-700); border-radius: 999px; padding: 5px 11px; font: inherit; font-size: 12.5px; cursor: pointer; transition: all .12s; }
.po-chips button:hover { border-color: var(--hc-400); color: var(--hc-600); }
.po-chips button.usado { background: #eef3ff; border-color: #2e6bff; color: #1f4fd1; }
.po-registro textarea { width: 100%; resize: vertical; }
.po-reg-check { display: flex; align-items: center; gap: 8px; font-size: 13.5px; font-weight: 500; color: var(--gray-700); }
.po-reg-rodape { margin-top: 10px; padding-top: 14px; border-top: 1px solid var(--gray-100); }
.po-hist { margin: 0; }
.po-hist-item { display: flex; gap: 12px; padding: 12px 0; border-bottom: 1px solid var(--gray-100); }
.po-hist-item:last-child { border-bottom: none; padding-bottom: 0; }
.po-hist-emo { font-size: 24px; line-height: 1; }
.po-hist-item > div { flex: 1; min-width: 0; }
.po-hist-top { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; margin-bottom: 4px; }
.po-hist-top strong { margin-right: 4px; color: var(--hc-900); }
.po-hist-item p { margin: 3px 0 0; font-size: 12.5px; color: var(--gray-700); line-height: 1.45; }
.po-hist-item p b { font-weight: 700; }
.po-hist-item b.ok { color: var(--success); }
.po-hist-item b.warn { color: var(--warning); }
.po-hist-item b.danger { color: var(--danger); }

/* Chat com a gestão */
.po-chat-trocar { display: inline-flex; gap: 4px; padding: 4px; margin-bottom: 12px; background: var(--gray-100); border-radius: 12px; flex-wrap: wrap; }
.po-chat-trocar button { display: inline-flex; align-items: center; gap: 7px; border: 0; background: transparent; border-radius: 9px; padding: 8px 14px; font: inherit; font-weight: 600; font-size: 13px; color: var(--gray-600); cursor: pointer; }
.po-chat-trocar button.ativo { background: #fff; color: var(--hc-800); box-shadow: var(--shadow-sm); }
.po-chat-trocar b { background: #e0543f; color: #fff; font-size: 10.5px; border-radius: 999px; padding: 1px 7px; }
.po-chat { height: calc(calc(100 * var(--vh)) - 230px); min-height: 420px; padding: 0; overflow: hidden; margin: 0; }

/* Gráficos de barras (portal_svg_barras) e a dica ao passar o mouse */
.pt-graf { width: 100%; height: auto; display: block; overflow: visible; }
.pt-graf-grade { stroke: var(--gray-100); stroke-width: 1; }
.pt-graf-base { stroke: var(--gray-300); stroke-width: 1; }
.pt-graf-eixo { font-size: 11px; fill: var(--gray-400); font-variant-numeric: tabular-nums; }
.pt-graf-eixo.hoje { fill: #0a1f3d; font-weight: 700; }
.pt-graf-valor { font-size: 12px; font-weight: 700; fill: #0a1f3d; }
.pt-graf-hit { fill: transparent; }
.pt-graf-col.foco .pt-graf-hit { fill: rgba(46, 107, 255, .06); }
.pt-dica-graf { position: fixed; z-index: 80; pointer-events: none; background: #0a1f3d; color: #fff; font-size: 12px; font-weight: 600; padding: 6px 10px; border-radius: 8px; box-shadow: 0 4px 12px rgba(0, 0, 0, .2); white-space: nowrap; }

/* Usados também em Operadores → Registro do dia (registros_dia.php) */
.pt-mini-barra { display: block; height: 7px; border-radius: 999px; background: var(--gray-100); overflow: hidden; margin: 6px 0 2px; }
.pt-mini-barra i { display: block; height: 100%; background: #2e6bff; border-radius: 999px; }
.pt-tag { display: inline-block; padding: 2px 9px; border-radius: 999px; font-size: 11.5px; font-weight: 700; white-space: nowrap; }
.t-prox { background: var(--info-bg); color: var(--info); }
.t-acordo { background: #f4efff; color: #6d28d9; }

@media (max-width: 1200px) {
  .po-dia { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 900px) {
  .po-busca { width: 100%; }
  .po-busca-res { left: 0; right: 0; width: auto; }
}
@media (max-width: 600px) {
  .po-kpis-3 { grid-template-columns: minmax(0, 1fr); }
  .po-hero-nums > div { flex: 1 1 100%; }
  .po-humor span { font-size: 11px; padding: 10px 2px; }
  .po-humor span b { font-size: 24px; }
  .po-reg-nums { grid-template-columns: 1fr; }
  .po-lote > summary { flex-wrap: wrap; }
  .po-lote-prog { width: 100%; }
  .po-lote-prog .po-prog { flex: 1; width: auto; }
}

/* ---------- Portal: CPF copiável ---------- */
.po-cpf { display: inline-flex; align-items: center; gap: 6px; padding: 2px 8px 2px 9px; border: 1px solid var(--gray-200); border-radius: 7px; background: var(--gray-50); font: inherit; font-size: 12px; font-weight: 600; color: var(--gray-700); font-variant-numeric: tabular-nums; letter-spacing: .02em; cursor: pointer; white-space: nowrap; position: relative; transition: border-color .12s, background .12s, color .12s; }
.po-cpf svg { color: var(--gray-400); transition: color .12s; }
.po-cpf:hover { border-color: var(--hc-400); background: var(--hc-50); color: var(--hc-700); }
.po-cpf:hover svg { color: var(--hc-600); }
.po-cpf em { display: none; font-style: normal; }
.po-cpf.ok { border-color: #86d3a8; background: var(--success-bg); color: var(--success); }
.po-cpf.ok span, .po-cpf.ok svg { display: none; }
.po-cpf.ok em { display: inline; }
.po-cpf.ok::before { content: "✓"; font-weight: 800; }
.po-cli-sub { display: flex; align-items: center; flex-wrap: wrap; gap: 4px 8px; margin-top: 4px; font-size: 11.5px; color: var(--gray-500); }

/* ---------- Início: período dos gráficos ---------- */
.po-periodo { display: flex; align-items: center; justify-content: space-between; gap: 10px 16px; flex-wrap: wrap; margin: 4px 0 12px; }
.po-periodo-tit { display: inline-flex; align-items: center; gap: 8px; font-size: 11.5px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: var(--gray-500); }
.po-periodo-opcoes { display: inline-flex; align-items: center; gap: 4px; padding: 4px; background: var(--gray-100); border-radius: 12px; flex-wrap: wrap; }
.po-periodo-opcoes a { padding: 6px 13px; border-radius: 9px; font-size: 12.5px; font-weight: 600; color: var(--gray-600); text-decoration: none; }
.po-periodo-opcoes a:hover { color: var(--hc-700); text-decoration: none; }
.po-periodo-opcoes a.ativo { background: #fff; color: var(--hc-800); box-shadow: var(--shadow-sm); }
.po-periodo-opcoes select { width: auto; min-height: 0; border: 0; background-color: transparent; padding: 6px 28px 6px 12px; font-size: 12.5px; font-weight: 600; color: var(--gray-600); border-radius: 9px; cursor: pointer; box-shadow: none; }
.po-periodo-opcoes select.ativo { background-color: #fff; color: var(--hc-800); box-shadow: var(--shadow-sm); }

/* ---------- Meus acordos: resumo do a receber ---------- */
.po-res { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; margin-bottom: 16px; }
.po-res-card { --c: #2e6bff; --c-bg: #eef3ff; position: relative; overflow: hidden; display: flex; flex-direction: column; gap: 3px; padding: 18px 18px 16px; border-radius: 16px; background: #fff; border: 1px solid var(--gray-200); box-shadow: var(--shadow-sm); }
.po-res-card::before { content: ""; position: absolute; left: 0; top: 0; right: 0; height: 4px; background: var(--c); }
.po-res-card::after { content: ""; position: absolute; right: -36px; top: -36px; width: 110px; height: 110px; border-radius: 50%; background: var(--c-bg); opacity: .8; }
.po-res-card > * { position: relative; z-index: 1; }
.po-res-card.r-atraso { --c: #dc2626; --c-bg: #fef0f0; }
.po-res-card.r-hoje { --c: #ea7a0c; --c-bg: #fff4ea; }
.po-res-card.r-semana { --c: #2e6bff; --c-bg: #eef3ff; }
.po-res-card.r-mes { --c: #16a34a; --c-bg: #effaf3; }
.po-res-ic { width: 36px; height: 36px; border-radius: 10px; display: inline-flex; align-items: center; justify-content: center; background: var(--c-bg); color: var(--c); margin-bottom: 8px; }
.po-res-lbl { font-size: 11.5px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--gray-500); }
.po-res-card strong { font-family: "Montserrat", var(--font); font-size: 24px; font-weight: 800; color: #0a1f3d; letter-spacing: -.01em; white-space: nowrap; }
.po-res-card small { font-size: 12px; color: var(--gray-500); }
.po-res-card small b { color: var(--success); }
.po-res-card .po-prog { flex: none; width: 100%; margin: 8px 0 2px; }
.po-res-card.r-mes .po-prog b { background: linear-gradient(90deg, #16a34a, #4ade80); }

/* Gráficos de Meus acordos */
.po-graf-linha { display: grid; grid-template-columns: minmax(0, 1.55fr) minmax(300px, 1fr); gap: 16px; }
.po-saude { display: flex; gap: 3px; height: 12px; border-radius: 99px; overflow: hidden; background: var(--gray-100); }
.po-saude i { display: block; }
.s-atraso { background: #dc2626; } .s-hoje { background: #ea7a0c; } .s-dia { background: #16a34a; }
.po-saude-leg { margin: 10px 0 14px; }
.po-cart { display: flex; flex-direction: column; gap: 10px; padding-top: 12px; border-top: 1px solid var(--gray-100); }
.po-cart-linha { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr) auto; gap: 12px; align-items: center; }
.po-cart-nome { display: flex; flex-direction: column; min-width: 0; }
.po-cart-nome strong { font-size: 13px; color: var(--gray-900); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.po-cart-nome small { font-size: 11.5px; color: var(--gray-500); }
.txt-atraso { color: #dc2626; font-weight: 600; }
.po-cart-barra { height: 8px; border-radius: 99px; background: var(--gray-100); overflow: hidden; }
.po-cart-barra b { display: block; height: 100%; border-radius: 99px; background: linear-gradient(90deg, #7c3aed, #a78bfa); }
.po-cart-valor { font-size: 12.5px; font-weight: 700; color: #0a1f3d; white-space: nowrap; font-variant-numeric: tabular-nums; }

/* Filtro da lista */
.po-filtro { display: flex; align-items: center; gap: 10px 14px; flex-wrap: wrap; margin: 4px 0 14px; }
.po-filtro-busca { display: flex; align-items: center; gap: 8px; flex: 1 1 280px; max-width: 420px; padding: 0 12px; border: 1px solid var(--gray-200); border-radius: 10px; background: #fff; color: var(--gray-400); }
.po-filtro-busca:focus-within { border-color: var(--hc-400); box-shadow: 0 0 0 3px rgba(34, 110, 189, .12); }
.po-filtro-busca input { border: 0; background: transparent; padding: 9px 0; box-shadow: none; flex: 1; min-width: 0; font-size: 13.5px; }
.po-filtro-busca input:focus { outline: none; box-shadow: none; }
.po-filtro-cart { display: flex; gap: 6px; flex-wrap: wrap; }
.po-filtro-cart button { border: 1px solid var(--gray-200); background: #fff; color: var(--gray-600); border-radius: 999px; padding: 6px 13px; font: inherit; font-size: 12.5px; font-weight: 600; cursor: pointer; }
.po-filtro-cart button:hover { border-color: var(--hc-400); color: var(--hc-700); }
.po-filtro-cart button.ativo { background: var(--hc-800); border-color: var(--hc-800); color: #fff; }

/* Grupos por vencimento */
.po-grupo { --g: #2e6bff; --g-bg: #eef3ff; margin-bottom: 22px; }
.po-grupo.g-atraso { --g: #dc2626; --g-bg: #fef0f0; }
.po-grupo.g-hoje { --g: #ea7a0c; --g-bg: #fff4ea; }
.po-grupo.g-amanha { --g: #ca8a04; --g-bg: #fefbe8; }
.po-grupo.g-semana { --g: #2e6bff; --g-bg: #eef3ff; }
.po-grupo.g-depois { --g: #64748b; --g-bg: #f1f5f9; }
.po-grupo-cab { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-bottom: 10px; padding: 0 2px; }
.po-grupo-pt { width: 12px; height: 12px; border-radius: 50%; background: var(--g); box-shadow: 0 0 0 4px var(--g-bg); }
.po-grupo-cab h3 { margin: 0; font-size: 15px; font-weight: 800; color: #0a1f3d; }
.po-grupo-cab small { font-size: 12.5px; color: var(--gray-500); }
.po-grupo-tot { margin-left: auto; font-size: 12.5px; font-weight: 600; color: var(--g); background: var(--g-bg); padding: 4px 11px; border-radius: 999px; white-space: nowrap; }
.po-grupo-lista { display: flex; flex-direction: column; gap: 10px; }

/* Cartão do acordo */
.po-ac { display: grid; grid-template-columns: 74px minmax(0, 1fr) auto; gap: 18px; align-items: stretch; padding: 14px 18px 14px 14px; background: #fff; border: 1px solid var(--gray-200); border-left: 4px solid var(--g); border-radius: 14px; box-shadow: var(--shadow-sm); transition: box-shadow .15s, transform .15s; }
.po-ac:hover { box-shadow: var(--shadow); transform: translateY(-1px); }
.po-ac[hidden] { display: none; }
.po-ac-data { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 1px; border-radius: 12px; background: var(--g-bg); color: var(--g); padding: 8px 4px; }
.po-ac-data b { font-family: "Montserrat", var(--font); font-size: 24px; font-weight: 800; line-height: 1; }
.po-ac-data span { font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; }
.po-ac-data small { margin-top: 4px; font-size: 10.5px; font-weight: 700; text-align: center; line-height: 1.2; }
.po-ac-main { min-width: 0; display: flex; flex-direction: column; gap: 7px; }
.po-ac-top { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.po-ac-top strong { font-size: 14.5px; color: #0a1f3d; }
.po-ac-tag { font-size: 11px; font-weight: 700; padding: 2px 8px; border-radius: 6px; background: #f4efff; color: #6d28d9; }
.po-ac-tag.t-sis { background: var(--gray-100); color: var(--gray-500); font-weight: 600; }
.po-ac-contato { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.po-ac-neg { display: flex; align-items: center; gap: 6px 16px; flex-wrap: wrap; font-size: 12.5px; color: var(--gray-600); }
.po-ac-neg > span { display: inline-flex; align-items: center; gap: 5px; }
.po-ac-neg svg { color: var(--gray-400); }
.po-ac-neg b { color: #0a1f3d; }
.po-ac-parc { gap: 8px !important; font-weight: 600; }
.po-ac-parc .po-prog { width: 80px; flex: none; height: 6px; }
.po-ac-ult { display: flex; align-items: flex-start; gap: 7px; flex-wrap: wrap; padding: 8px 11px; border-radius: 10px; background: var(--gray-50); border: 1px dashed var(--gray-200); font-size: 12px; color: var(--gray-600); }
.po-ac-ult svg { color: var(--hc-500); margin-top: 1px; flex-shrink: 0; }
.po-ac-ult b { color: var(--gray-800); }
.po-ac-ult em { flex-basis: 100%; padding-left: 20px; font-style: italic; color: var(--gray-500); }
.po-ac-ult.vazio { color: var(--gray-400); }
.po-ac-ult.vazio svg { color: var(--gray-300); }
.po-ac-valor { display: flex; flex-direction: column; align-items: flex-end; justify-content: center; gap: 2px; min-width: 130px; padding-left: 18px; border-left: 1px solid var(--gray-100); text-align: right; }
.po-ac-valor b { font-family: "Montserrat", var(--font); font-size: 20px; font-weight: 800; color: #0a1f3d; white-space: nowrap; }
.po-ac-valor small { font-size: 11.5px; color: var(--gray-500); white-space: nowrap; }

@media (max-width: 1200px) {
  .po-res { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .po-graf-linha { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 700px) {
  .po-res { grid-template-columns: minmax(0, 1fr); }
  .po-ac { grid-template-columns: 58px minmax(0, 1fr); gap: 12px; padding: 12px; }
  .po-ac-valor { grid-column: 1 / -1; flex-direction: row; align-items: baseline; justify-content: space-between; border-left: 0; border-top: 1px solid var(--gray-100); padding: 10px 0 0; }
  .po-grupo-tot { margin-left: 0; }
}
.po-mais { display: flex; align-items: center; justify-content: center; gap: 6px; width: 100%; margin-top: 10px; padding: 10px; border: 1px dashed var(--gray-300); border-radius: 12px; background: #fff; font: inherit; font-size: 13px; font-weight: 600; color: var(--hc-600); cursor: pointer; }
.po-mais:hover { border-color: var(--hc-400); background: var(--hc-50); }
.po-mais svg { transform: rotate(270deg); }

/* ---------- Acordos → Esteira de cobrança (es-*) ---------- */
.es-filtros { display: flex; flex-wrap: wrap; gap: 12px; align-items: flex-start; padding: 12px 14px; margin-bottom: 14px; }
.es-filtros .form-field { margin: 0; min-width: 150px; flex: 1 1 150px; }
.es-filtros .form-field:first-child { flex: 0 1 auto; }
.es-filtros select, .es-filtros input[type=date] { padding-top: 6px; padding-bottom: 6px; font-size: 13px; }
.es-filtros label { font-size: 12px; }
.es-filtros .ac-venc-campos input { width: 140px; }
.es-filtros .ac-venc-atalhos { flex-wrap: wrap; }
.es-filtros .es-regra { flex: 0 1 130px; min-width: 120px; }

.es-funil { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; margin-bottom: 14px; }
.es-etapa { --c: var(--hc-600); --c-bg: var(--hc-100); position: relative; display: flex; flex-direction: column; gap: 6px; padding: 14px 16px 12px;
  background: #fff; border: 1px solid var(--gray-200); border-top: 4px solid var(--c); border-radius: var(--radius-lg); box-shadow: var(--shadow);
  color: inherit; text-decoration: none; transition: transform .12s ease, box-shadow .12s ease; }
.es-etapa:hover { transform: translateY(-2px); box-shadow: var(--shadow-lg); text-decoration: none; }
.es-etapa.bom { --c: var(--success); --c-bg: var(--success-bg); }
.es-etapa.medio { --c: var(--warning); --c-bg: var(--warning-bg); }
.es-etapa.ruim { --c: var(--danger); --c-bg: var(--danger-bg); }
.es-etapa:not(:last-child)::after { content: ""; position: absolute; right: -12px; top: 50%; width: 9px; height: 9px; border-top: 2px solid var(--gray-300); border-right: 2px solid var(--gray-300); transform: translateY(-50%) rotate(45deg); }
.es-etapa-n { position: absolute; top: 12px; right: 14px; width: 24px; height: 24px; border-radius: 50%; background: var(--c-bg); color: var(--c); font-weight: 800; font-size: 12px; display: flex; align-items: center; justify-content: center; }
.es-etapa-cab strong { display: block; font-size: 14px; color: var(--gray-900); }
.es-etapa-cab small { color: var(--gray-500); font-size: 12px; }
.es-etapa-pct { font-size: 30px; font-weight: 800; letter-spacing: -.02em; color: var(--c); line-height: 1; }
.es-barra { display: block; height: 7px; border-radius: 99px; background: var(--gray-100); overflow: hidden; }
.es-barra b { display: block; height: 100%; border-radius: 99px; background: var(--c, var(--hc-600)); }
.es-etapa-det { display: flex; flex-direction: column; gap: 2px; font-size: 12px; }
.es-etapa-det span::before { content: ""; display: inline-block; width: 7px; height: 7px; border-radius: 50%; margin-right: 6px; background: currentColor; vertical-align: 1px; }
.es-etapa-det .ok { color: var(--success); }
.es-etapa-det .ruim { color: var(--danger); }
.es-etapa-det .agora { color: #c2571a; font-weight: 600; }
.es-etapa-det .atencao { color: var(--warning); }
.es-etapa-det .futuro { color: var(--gray-500); }

.es-linha { display: grid; grid-template-columns: minmax(260px, 1fr) 2fr; gap: 14px; margin-bottom: 14px; align-items: start; }
.es-linha .card { margin: 0; }
.es-comp { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.es-comp-item { display: flex; flex-direction: column; gap: 4px; padding: 12px; border-radius: 12px; }
.es-comp-item.ok { --c: var(--success); color: var(--success); background: var(--success-bg); border: 1px solid #cde9da; }
.es-comp-item.ruim { --c: var(--danger); color: var(--danger); background: var(--danger-bg); border: 1px solid #f2d3cd; }
.es-comp-item span { font-size: 12px; font-weight: 600; }
.es-comp-item strong { font-size: 26px; font-weight: 800; line-height: 1; }
.es-comp-item .es-barra { background: rgba(255, 255, 255, .7); }
.es-comp-item small { color: var(--gray-600); font-size: 11.5px; }
.es-conclusao { margin: 10px 0 0; color: var(--gray-700); }
.es-tab-ops { width: 100%; font-size: 13px; }
.es-tab-ops td, .es-tab-ops th { padding: 7px 10px; white-space: nowrap; }
.es-pct { display: inline-block; min-width: 44px; text-align: center; padding: 2px 8px; border-radius: 99px; font-weight: 700; font-size: 12px; background: var(--gray-100); color: var(--gray-600); }
.es-pct.bom { background: var(--success-bg); color: var(--success); }
.es-pct.medio { background: var(--warning-bg); color: var(--warning); }
.es-pct.ruim { background: var(--danger-bg); color: var(--danger); }
.txt-ruim { color: var(--danger); }

.es-lista-cab { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; flex-wrap: wrap; margin-bottom: 4px; }
.es-lista .ac-chip { --c: var(--hc-600); --c-bg: var(--hc-100); --c-soft: var(--hc-50); }
.es-lista .es-chip-fazer_hoje { --c: #c2571a; --c-bg: #fde3d2; --c-soft: #fff7f1; }
.es-lista .es-chip-sem_prev, .es-lista .es-chip-sem_venc, .es-lista .es-chip-sem_acomp, .es-lista .es-chip-abertos { --c: var(--danger); --c-bg: #f5d2cc; --c-soft: var(--danger-bg); }
.es-lista .es-chip-pagos { --c: var(--success); --c-bg: #cde9da; --c-soft: var(--success-bg); }

.es-item { display: grid; grid-template-columns: minmax(250px, 1.1fr) 3fr auto; gap: 14px; align-items: center; padding: 12px 14px; border: 1px solid var(--gray-200); border-radius: 12px; margin-top: 10px; background: #fff; }
.es-item-alerta { box-shadow: inset 4px 0 0 var(--danger); }
.es-item-cli { display: flex; gap: 12px; align-items: center; min-width: 0; }
.es-venc { flex-shrink: 0; width: 58px; text-align: center; border-radius: 10px; background: var(--hc-50); border: 1px solid var(--hc-100); padding: 5px 2px; color: var(--hc-700); }
.es-venc b { display: block; font-size: 20px; line-height: 1; }
.es-venc span { display: block; font-size: 11px; text-transform: uppercase; font-weight: 700; }
.es-venc small { display: block; font-size: 10px; color: var(--gray-500); margin-top: 2px; }
.es-venc.hoje { background: #fff7f1; border-color: #fde3d2; color: #c2571a; }
.es-venc.passado { background: var(--gray-50); border-color: var(--gray-200); color: var(--gray-700); }
.es-cli-txt { display: flex; flex-direction: column; gap: 1px; min-width: 0; }
.es-cli-txt strong { font-size: 14px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

.es-trilha { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); }
.es-passo { --c: var(--gray-400); --c-bg: var(--gray-100); position: relative; display: flex; gap: 8px; align-items: flex-start; padding-right: 8px; min-width: 0; }
.es-passo:not(:last-child)::after { content: ""; position: absolute; left: 30px; right: 0; top: 12px; height: 2px; background: var(--gray-200); z-index: 0; }
.es-passo.es-ok { --c: var(--success); --c-bg: var(--success-bg); }
.es-passo.es-ruim { --c: var(--danger); --c-bg: var(--danger-bg); }
.es-passo.es-agora { --c: #c2571a; --c-bg: #fde3d2; }
.es-passo.es-atencao { --c: var(--warning); --c-bg: var(--warning-bg); }
.es-passo.es-na { --c: var(--gray-300); --c-bg: #fff; }
.es-no { position: relative; z-index: 1; flex-shrink: 0; width: 26px; height: 26px; border-radius: 50%; background: var(--c-bg); color: var(--c); border: 2px solid var(--c); display: flex; align-items: center; justify-content: center; }
.es-na .es-no { border-style: dashed; }
.es-no svg { width: 13px; height: 13px; }
.es-passo-txt { position: relative; z-index: 1; display: flex; flex-direction: column; min-width: 0; padding: 1px 6px 0 0; background: #fff; }
.es-passo-txt b { font-size: 10.5px; text-transform: uppercase; letter-spacing: .03em; color: var(--gray-500); }
.es-passo-txt span { font-size: 12.5px; font-weight: 700; color: var(--c); }
.es-futuro .es-passo-txt span, .es-na .es-passo-txt span { color: var(--gray-500); font-weight: 600; }
.es-passo-txt small { font-size: 11px; color: var(--gray-500); line-height: 1.3; }
.es-item-acoes { display: flex; flex-direction: column; gap: 6px; align-items: stretch; }
.es-hist-bt b { background: var(--gray-100); border-radius: 99px; padding: 0 6px; font-size: 11px; }
.es-hist-bt.ativo { background: var(--hc-50); border-color: var(--hc-400); color: var(--hc-700); }
.es-hist { grid-column: 1 / -1; border-top: 1px dashed var(--gray-200); padding-top: 10px; }
.es-tl { list-style: none; margin: 0; padding: 0 0 0 6px; }
.es-tl li { position: relative; display: grid; grid-template-columns: 92px 1fr; gap: 10px; padding: 5px 0 5px 16px; border-left: 2px solid var(--gray-200); font-size: 12.5px; }
.es-tl li::before { content: ""; position: absolute; left: -7px; top: 9px; width: 12px; height: 12px; border-radius: 50%; background: var(--c, var(--gray-400)); border: 2px solid #fff; box-sizing: border-box; }
.es-tl li > span { color: var(--gray-500); font-variant-numeric: tabular-nums; }
.es-tl li em { color: var(--gray-500); font-style: normal; }
.es-tl li p { margin: 2px 0 0; color: var(--gray-700); }
.es-tl-prev { --c: var(--hc-500); }
.es-tl-venc { --c: #c2571a; }
.es-tl-depois { --c: var(--gray-500); }
.es-tl-marco { --c: var(--gold-500); }
.es-tl-marco b { color: var(--gold-500); }
.es-nota { margin-top: 10px; }

@media (max-width: 1280px) {
  .es-item { grid-template-columns: 1fr auto; }
  .es-trilha { grid-column: 1 / -1; grid-row: 2; }
  .es-item-acoes { flex-direction: row; }
}
@media (max-width: 1100px) {
  .es-funil { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .es-etapa::after { display: none; }
  .es-linha { grid-template-columns: 1fr; }
}
@media (max-width: 700px) {
  .es-funil { grid-template-columns: 1fr; }
  .es-trilha { grid-template-columns: 1fr 1fr; row-gap: 10px; }
  .es-passo::after { display: none; }
  .es-item { grid-template-columns: 1fr; }
}
.es-saidos { padding: 0; margin-bottom: 14px; overflow: hidden; }
.es-saidos summary { cursor: pointer; padding: 11px 16px; font-size: 13px; display: flex; align-items: center; gap: 8px; color: var(--gray-700); list-style: none; }
.es-saidos summary::-webkit-details-marker { display: none; }
.es-saidos summary svg { color: var(--warning); }
.es-saidos[open] summary { border-bottom: 1px solid var(--gray-100); }
.es-saidos .table-wrap { padding: 4px 8px 10px; max-height: 360px; overflow: auto; }

/* Resumo Operacional (public/resumo_operacional.php) */
.ro-dia { display: flex; flex-wrap: wrap; align-items: center; gap: 14px; font-size: 13px; }
.ro-dia form { margin-left: auto; }
.ro-cobrar { margin: 0; padding-left: 18px; font-size: 13px; }
.ro-cobrar > li { margin-bottom: 10px; }
.ro-cobrar ul { margin: 4px 0 0; padding-left: 18px; color: var(--gray-700); }
.ro-carteiras { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 4px; }
.ro-chip { font-size: 12.5px; padding: 5px 10px; border-radius: 999px; background: var(--gray-100); color: var(--gray-700); }
.ro-detalhe { border-top: 1px solid var(--gray-100); padding: 10px 0; }
.ro-detalhe summary { cursor: pointer; font-size: 13.5px; }
.ro-sem-vinculo td { opacity: .6; }