/* =====================================================================
   ODEM Vendas App 33.7.0 — Revisão Integral de Interface
   Fundação visual global para desktop e mobile.
   Objetivo: legibilidade, nitidez, densidade consistente e responsividade.
   Nenhuma regra de negócio é alterada neste arquivo.
   ===================================================================== */

:root {
  /* Escala tipográfica mínima do produto. */
  --fs-xs: 0.8125rem;  /* 13px */
  --fs-sm: 0.875rem;   /* 14px */
  --fs-md: 0.9375rem;  /* 15px */
  --fs-lg: 1.0625rem;  /* 17px */
  --fs-xl: 1.625rem;   /* 26px */
  --fs-2xl: 2.125rem;  /* 34px */
  --fs-3xl: 2.625rem;  /* 42px */

  /* Pesos padronizados: evita síntese de 650/750/850 em fontes do sistema. */
  --fw-regular: 400;
  --fw-medium: 500;
  --fw-semibold: 600;
  --fw-bold: 700;

  --lh-tight: 1.22;
  --lh-normal: 1.5;
  --content-max: 1760px;
  --content-pad-x: clamp(18px, 2.3vw, 38px);
  --content-pad-y: clamp(16px, 1.7vw, 28px);
}

html {
  font-size: 16px;
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

body {
  font-family: var(--font-ui);
  font-size: var(--fs-md);
  font-weight: var(--fw-regular);
  line-height: var(--lh-normal);
  letter-spacing: 0;
  text-rendering: auto;
  -webkit-font-smoothing: auto;
  -moz-osx-font-smoothing: auto;
  font-kerning: normal;
}

/* Evita textos visualmente apagados nos dois temas. */
[data-theme="dark"] {
  --text-2: #D2D8E2;
  --text-3: #B2BBC8;
}
[data-theme="light"] {
  --text-2: #536071;
  --text-3: #667386;
}

/* ---------------------------------------------------------------------
   Shell / navegação
   --------------------------------------------------------------------- */
.content {
  max-width: var(--content-max);
  padding: var(--content-pad-y) var(--content-pad-x) 48px;
}

body:has(.ios-shell):not(.odem-tv-mode) .nav-item,
.nav-item {
  font-size: 14px;
  font-weight: 500;
  line-height: 1.3;
  min-height: 44px;
}

body:has(.ios-shell):not(.odem-tv-mode) .nav-group-toggle,
.nav-group-toggle {
  font-size: 12px;
  font-weight: 600;
  line-height: 1.3;
  letter-spacing: .065em;
  min-height: 38px;
}

.sidebar-section-label {
  font-size: 11px !important;
  font-weight: 700;
  letter-spacing: .1em;
}

.sidebar-brand-copy strong { font-size: 15px !important; font-weight: 700 !important; }
.sidebar-brand-copy span { font-size: 12px !important; }
.sidebar-user-copy strong { font-size: 13px !important; font-weight: 600 !important; }
.sidebar-user-copy span { font-size: 12px !important; }
.sidebar-action { font-size: 13px !important; min-height: 40px; }

#topbar-titulo { font-size: 18px !important; font-weight: 700 !important; line-height: 1.25; }
.topbar-eyebrow { font-size: 11px !important; font-weight: 600 !important; letter-spacing: .08em; }
.topbar-account-copy strong { font-size: 13px !important; font-weight: 600 !important; }
.topbar-account-copy small { font-size: 12px !important; line-height: 1.3; }
.topbar-action { font-size: 13px !important; min-height: 40px; }

/* ---------------------------------------------------------------------
   Títulos / texto / metadados
   --------------------------------------------------------------------- */
h1 { font-size: clamp(25px, 2.15vw, 34px); }
h2 { font-size: clamp(20px, 1.7vw, 27px); }
h3 { font-size: clamp(16px, 1.25vw, 20px); }
h4 { font-size: 15px; }

body small { font-size: 13px !important; line-height: 1.45; }

:where(p,td,th,.card,.modal-box,.ios-page-panel) { overflow-wrap: break-word; }

:where(.ios-eyebrow,.ind-eyebrow,.rep-page-eyebrow,.hc3-eyebrow,.rel-eyebrow,.ge-eyebrow) {
  font-size: 12px !important;
  font-weight: 700 !important;
  letter-spacing: .075em !important;
  line-height: 1.3;
}

:where(.ios-page-description,.rep-muted,.pc-muted,.ge-panel-note,.rel-section-head p,.card-subtitle) {
  font-size: 14px !important;
  line-height: 1.5 !important;
}

/* ---------------------------------------------------------------------
   Controles / formulários / botões
   --------------------------------------------------------------------- */
.field-label,
label > span:first-child:not(.badge):not(.gf-sync-dot) {
  font-size: 13px;
  font-weight: 600;
  line-height: 1.35;
}

.input,.select,.textarea,
input:not([type="checkbox"]):not([type="radio"]),
select,textarea {
  font-size: 14px;
  line-height: 1.4;
}

.input,.select,
input:not([type="checkbox"]):not([type="radio"]),select {
  min-height: 42px;
}

textarea { min-height: 96px; }

::placeholder { opacity: 1; color: var(--placeholder); }

.btn,button[class*="btn"] {
  font-size: 13px;
  font-weight: 600;
  line-height: 1.2;
}
.btn { min-height: 40px; }
.btn-sm { min-height: 36px !important; height: 36px !important; font-size: 12.5px !important; }

.badge,
[class*="status-pill"],
[class*="-state"] {
  font-size: 12px;
  font-weight: 600;
  line-height: 1.25;
}

/* ---------------------------------------------------------------------
   Cards / painéis / KPI
   --------------------------------------------------------------------- */
.card-title { font-size: 16px !important; font-weight: 700 !important; }
.card p,.card small { line-height: 1.5; }
.kpi-label { font-size: 13px !important; font-weight: 600 !important; line-height: 1.3; }
.kpi-value { font-size: clamp(20px, 1.7vw, 28px); line-height: 1.15; }

:is(.ios-page-panel,.ind-panel,.vr-panel,.rel-section,.ge-panel,.pc-panel,.pc-table-card,.gf-payments-shell,.gf-pending-shell) {
  border-radius: 14px;
}

/* ---------------------------------------------------------------------
   Tabelas globais
   --------------------------------------------------------------------- */
.table-wrap,
[class*="table-wrap"] {
  max-width: 100%;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

table,
.table {
  font-size: 14px;
  line-height: 1.45;
}

table th,
.table th {
  font-size: 12.5px !important;
  font-weight: 700 !important;
  line-height: 1.35;
  letter-spacing: .015em;
  padding-top: 11px;
  padding-bottom: 11px;
}

table td,
.table td {
  font-size: 14px;
  line-height: 1.45;
  padding-top: 12px;
  padding-bottom: 12px;
}

/* ---------------------------------------------------------------------
   Gestão Financeira — preservar desenho aprovado e tornar leitura nítida
   --------------------------------------------------------------------- */
.gf-page { gap: 18px !important; }
.gf-filter-controls label>span,
.gf-last-update>span { font-size: 13px !important; }
.gf-filter-controls select { font-size: 14px !important; min-height: 42px; }
.gf-last-update { font-size: 13px !important; }
.gf-last-update b { font-size: 14px !important; }

.gf-sync-panel-head>div:first-child>span { font-size: 13px !important; font-weight: 700 !important; }
.gf-sync-panel-head>div:first-child>small { font-size: 13px !important; }
.gf-sync-unit-copy strong { font-size: 14px !important; font-weight: 700 !important; }
.gf-sync-unit-copy small { font-size: 12.5px !important; }
.gf-sync-unit-btn { font-size: 13px !important; min-height: 38px; }
.gf-auto-state { font-size: 12.5px !important; }

.gf-period-banner strong { font-size: 16px !important; }
.gf-payment-unit h3 { font-size: 15px !important; }
.gf-payment-unit>header>div:first-child>span:not(.gf-consolidated-kicker),
.gf-payment-unit>header>small { font-size: 12.5px !important; }
.gf-payment-metric strong { font-size: clamp(19px, 1.55vw, 24px) !important; }
.gf-payment-metric small { font-size: 13px !important; line-height: 1.35 !important; }
.gf-consolidated-kicker { font-size: 11.5px !important; }
.gf-reconcile-state { font-size: 12px !important; }

.gf-pending-header>div:first-child>span { font-size: 12px !important; font-weight: 700 !important; }
.gf-pending-header h2 { font-size: 20px !important; }
.gf-pending-header p { font-size: 14px !important; line-height: 1.5 !important; }
.gf-pending-summary strong { font-size: 14px !important; }
.gf-pending-summary span { font-size: 12.5px !important; }
.gf-pending-statuses button { font-size: 13px !important; min-height: 38px; }
.gf-pending-actions select,
.gf-pending-search input { font-size: 14px !important; }
.gf-pending-columns span { font-size: 12px !important; font-weight: 700 !important; }
.gf-pending-row { min-height: 86px; }
.gf-pending-title strong { font-size: 14px !important; line-height: 1.35 !important; }
.gf-origin-pill { font-size: 11.5px !important; font-weight: 700 !important; }
.gf-pending-general p { font-size: 13px !important; line-height: 1.45 !important; }
.gf-pending-detail,
.gf-pending-detail span,
.gf-pending-detail b { font-size: 12.5px !important; line-height: 1.4 !important; }
.gf-pending-dates span { font-size: 12px !important; }
.gf-pending-dates b { font-size: 13px !important; }
.gf-pending-value strong { font-size: 16px !important; }
.gf-pending-value small { font-size: 12px !important; }
.gf-status-pill { font-size: 12px !important; }
.gf-pending-status small { font-size: 12px !important; }
.gf-pending-bank,
.gf-pending-bank span { font-size: 12.5px !important; line-height: 1.45 !important; }
.gf-pending-pagination,
.gf-pending-pagination button { font-size: 13px !important; }

/* Resultado Gerencial: tabela precisa continuar densa, porém legível. */
.gf-managerial-table,
.gf-result-table,
.gf-gerencial-table { font-size: 14px !important; }
.gf-managerial-table th,.gf-managerial-table td,
.gf-result-table th,.gf-result-table td,
.gf-gerencial-table th,.gf-gerencial-table td { font-size: 13.5px !important; line-height: 1.4 !important; }

/* ---------------------------------------------------------------------
   Planejamento de Compras — neutraliza modo compacto ilegível
   --------------------------------------------------------------------- */
.pc-density-compact .pc-kpi-copy span,
.pc-density-compact .pc-kpi-copy small,
.pc-density-compact .pc-panel-note,
.pc-density-compact .pc-table-head p,
.pc-density-compact .pc-legend>div,
.pc-density-compact .pc-legend b,
.pc-density-compact .pc-quality-row,
.pc-density-compact .pc-quality-row b,
.pc-density-compact .pc-product small { font-size: 12px !important; }
.pc-density-compact .pc-search input,
.pc-density-compact .pc-table-tools select,
.pc-density-compact .pc-table { font-size: 13px !important; }
.pc-density-compact .pc-table th { font-size: 12px !important; }
.pc-density-compact .pc-product strong { font-size: 13px !important; }

.pc-tabs button { font-size: 13px !important; }
.pc-kpi-copy span { font-size: 13px !important; }
.pc-kpi-copy small { font-size: 12.5px !important; }
.pc-panel-note,.pc-table-head p { font-size: 13px !important; }
.pc-table { font-size: 13.5px !important; }
.pc-table th { font-size: 12.5px !important; }
.pc-product strong { font-size: 14px !important; }
.pc-product small { font-size: 12px !important; }
.pc-status { font-size: 12.5px !important; }
.pc-callout p { font-size: 13px !important; }
.pc-loading small { font-size: 12.5px !important; }

/* ---------------------------------------------------------------------
   Gestão Executiva / Relatórios / Indicadores
   --------------------------------------------------------------------- */
.ge-kpi strong { line-height: 1.15; }
.ge-kpi span,.ge-kpi small { font-size: 12.5px !important; line-height: 1.4; }
.ge-detail-grid .ge-kpi strong { font-size: 20px !important; }
.ge-id-tags span { font-size: 12px !important; }
.ge-history { font-size: 13px !important; }

.rel-primary-kpis .rel-kpi span { font-size: 13px !important; }
.rel-primary-kpis .rel-kpi small { font-size: 12px !important; }
.rel-support-strip span { font-size: 12.5px !important; }
.rel-section-head>small { font-size: 12px !important; }
.rel-rep-grid b { font-size: 13.5px !important; }
.rel-rep-grid span { font-size: 12.5px !important; }
.rel-order-main b { font-size: 13.5px !important; }
.rel-order-main span,.rel-order-main small { font-size: 12.5px !important; }
.rel-timeline-item time { font-size: 12px !important; }
.rel-timeline-item b,.rel-timeline-item span { font-size: 12.5px !important; }

.ind-origin { font-size: 12px !important; }
.ind-order-status .badge { font-size: 12px !important; }

/* ---------------------------------------------------------------------
   Importação Gerencial / Configuração / usuários
   --------------------------------------------------------------------- */
.ig-tabs button { font-size: 13px !important; min-height: 40px !important; }
.ig-panel-title>div>span { font-size: 12px !important; }
.ig-panel-title h3 { font-size: 17px !important; }
.ig-panel-title p { font-size: 13px !important; line-height: 1.45; }
.ig-row-code { font-size: 12px !important; }
.ig-row-main strong { font-size: 14px !important; }
.ig-row-main span,.ig-row-meta { font-size: 12.5px !important; line-height: 1.4; }
.ig-empty { font-size: 13px !important; }
.ig-advanced summary { font-size: 13px !important; }
.ig-advanced-grid strong { font-size: 13.5px !important; }
.ig-advanced-grid span { font-size: 12px !important; line-height: 1.4; }

.cfg-history-last small,.cfg-history-count small { font-size: 12px !important; }
.cfgx-empty { font-size: 13px; }

/* ---------------------------------------------------------------------
   Pedidos / representantes / Home Centers
   --------------------------------------------------------------------- */
.ped-family-state,
.ped-family-values span,
.ped-family-branch-line>div:nth-child(2) span,
.ped-family-composition,
.ped-item-saldo-note,
.ped-item-saldo-current { font-size: 12.5px !important; }

.rep-filter-grid label { font-size: 13px !important; }
.rep-maino-line code { font-size: 12px !important; }

:where(.hc7-data-missing,.hc7-empty,.hc9-order-flow,.hc18-section-body) {
  font-size: 13px;
  line-height: 1.45;
}

/* ---------------------------------------------------------------------
   Login — mantém composição, melhora leitura
   --------------------------------------------------------------------- */
.login-brand-kicker,.login-brand-foot,.login-eyebrow,
.login-help-row>span,.login-footer-note { font-size: 12.5px !important; }
.login-card .field-label { font-size: 13px !important; }

/* ---------------------------------------------------------------------
   Responsividade integral
   --------------------------------------------------------------------- */
@media (max-width: 1180px) {
  :root { --content-pad-x: clamp(16px, 2vw, 26px); }
  .content { width: 100%; max-width: none; }
  .topbar { min-width: 0; }

  .gf-pending-columns,.gf-pending-row {
    grid-template-columns: minmax(280px,1.55fr) minmax(150px,.7fr) minmax(120px,.55fr) minmax(140px,.65fr) minmax(190px,.85fr) !important;
  }
}

@media (max-width: 900px) {
  :root {
    --content-pad-x: 16px;
    --content-pad-y: 16px;
  }

  body { font-size: 15px; }
  .content { padding: 16px 16px 36px; overflow-x: hidden; }

  .btn { min-height: 42px; }
  .input,.select,input:not([type="checkbox"]):not([type="radio"]),select { min-height: 44px; }

  /* Financeiro: cards continuam compactos e tabela vira cartões legíveis. */
  .gf-sync-units { grid-template-columns: 1fr !important; }
  .gf-payment-metrics { grid-template-columns: repeat(2,minmax(0,1fr)) !important; }
  .gf-payment-metric { min-height: 92px; }
  .gf-payment-metric strong { font-size: 20px !important; }

  .gf-pending-columns { display: none !important; }
  .gf-pending-row {
    display: grid !important;
    grid-template-columns: minmax(0,1fr) auto !important;
    gap: 12px 18px !important;
    padding: 16px !important;
  }
  .gf-pending-row>div { min-width: 0; border-left: 0 !important; padding-left: 0 !important; }
  .gf-pending-general { grid-column: 1 / -1; }
  .gf-pending-dates { grid-column: 1; }
  .gf-pending-value { grid-column: 2; grid-row: 2; text-align: right; }
  .gf-pending-status { grid-column: 1; }
  .gf-pending-bank { grid-column: 2; text-align: right; }

  .gf-pending-tools { grid-template-columns: 1fr !important; gap: 10px !important; }
  .gf-pending-actions { width: 100%; display: grid !important; grid-template-columns: 1fr 1fr; }
  .gf-pending-search { width: 100%; }

  /* Tabelas genéricas permanecem úteis por scroll em vez de esmagar colunas. */
  .table-wrap,[class*="table-wrap"] { overflow-x: auto; }
  table { min-width: max-content; }
}

@media (max-width: 620px) {
  :root {
    --fs-xs: 0.8125rem;
    --fs-sm: 0.875rem;
    --fs-md: 0.9375rem;
    --fs-lg: 1.0625rem;
  }

  .content { padding: 14px 12px 32px; }
  #topbar-titulo { font-size: 17px !important; }
  .topbar-action { min-width: 42px; min-height: 42px; }

  h1 { font-size: 25px; }
  h2 { font-size: 21px; }

  .gf-filterline,.gf-filter-controls { grid-template-columns: 1fr !important; width: 100%; }
  .gf-filter-controls label { width: 100%; }
  .gf-filter-controls select { width: 100%; }

  .gf-payment-metrics { grid-template-columns: 1fr !important; }
  .gf-payment-metric { min-height: 78px; }
  .gf-payment-metric+.gf-payment-metric:before { display: none !important; }
  .gf-payment-unit>header { align-items: flex-start; gap: 7px; }
  .gf-payment-unit>header>small { text-align: left !important; }

  .gf-pending-header { display: grid !important; gap: 10px; }
  .gf-pending-summary { justify-self: start; }
  .gf-pending-statuses { display: grid !important; grid-template-columns: 1fr 1fr; gap: 7px; }
  .gf-pending-statuses button { width: 100%; }
  .gf-pending-actions { grid-template-columns: 1fr !important; }
  .gf-pending-row { grid-template-columns: 1fr !important; }
  .gf-pending-general,.gf-pending-dates,.gf-pending-value,.gf-pending-status,.gf-pending-bank {
    grid-column: 1 !important;
    grid-row: auto !important;
    text-align: left !important;
  }
  .gf-pending-value { padding-top: 2px; }

  .pc-tabs,.ig-tabs { width: 100%; overflow-x: auto; }
  .pc-tabs button,.ig-tabs button { flex: 0 0 auto; min-width: max-content; }

  .modal-box,.ig-modal,.pc-drawer { max-width: 100%; }
}

@media (max-width: 390px) {
  .content { padding-left: 10px; padding-right: 10px; }
  .gf-pending-statuses { grid-template-columns: 1fr; }
  .btn,.btn-sm { width: auto; }
}

@media (prefers-reduced-motion: reduce) {
  *,*::before,*::after {
    scroll-behavior: auto !important;
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
}
\n\n/* 33.8.13 — padronização visual definitiva de status + Varejo compacto/TV */\n:root{--odem-status-h:28px}\n.badge.badge-orcamento,.badge.badge-gerado,.badge.badge-aguard-mercadoria,.badge.badge-separacao,.badge.badge-faturado,.badge.badge-parcial,.badge.badge-nf-transp,.badge.badge-concluido,.badge.badge-cancelado{\n  display:inline-flex!important;align-items:center!important;justify-content:center!important;gap:6px!important;\n  min-height:var(--odem-status-h)!important;height:var(--odem-status-h)!important;max-width:100%!important;\n  padding:0 10px!important;border-radius:8px!important;box-sizing:border-box!important;\n  font-size:11px!important;line-height:1!important;font-weight:650!important;white-space:nowrap!important;text-align:center!important;vertical-align:middle!important;\n}\n.badge.badge-orcamento::before,.badge.badge-gerado::before,.badge.badge-aguard-mercadoria::before,.badge.badge-separacao::before,.badge.badge-faturado::before,.badge.badge-parcial::before,.badge.badge-nf-transp::before,.badge.badge-concluido::before,.badge.badge-cancelado::before{\n  width:6px!important;height:6px!important;min-width:6px!important;flex:0 0 6px!important;margin:0!important;align-self:center!important;\n}\n#ped-raiz .ios-order-status,.vr-orders-table td:has(.badge),.vr-orders-mobile article>div:first-child{align-items:center!important}\n#ped-raiz .ios-order-status .badge{margin:0!important}\n\nbody:has(.ios-shell):not(.odem-tv-mode) .vr-kpis{gap:12px!important}\nbody:has(.ios-shell):not(.odem-tv-mode) .vr-kpi{min-height:104px!important;padding:16px!important;border-radius:17px!important}\nbody:has(.ios-shell):not(.odem-tv-mode) .vr-executive-row{grid-template-columns:minmax(0,1.05fr) minmax(360px,.95fr)!important;gap:16px!important}\nbody:has(.ios-shell):not(.odem-tv-mode) .vr-evolution,body:has(.ios-shell):not(.odem-tv-mode) .vr-executive-row>.vr-panel{min-height:330px!important;height:auto!important}\nbody:has(.ios-shell):not(.odem-tv-mode) .vr-evolution-body{min-height:240px!important}\nbody:has(.ios-shell):not(.odem-tv-mode) .vr-flow-full{margin-top:16px!important}\nbody:has(.ios-shell):not(.odem-tv-mode) .vr-flow-full .vr-flow-list{display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:10px!important}\nbody:has(.ios-shell):not(.odem-tv-mode) .vr-flow-card{min-width:0;padding:12px;border:1px solid var(--border);border-radius:14px;background:var(--surface-2);display:grid;gap:9px}\nbody:has(.ios-shell):not(.odem-tv-mode) .vr-flow-card-head{display:flex;align-items:center;justify-content:space-between;gap:8px;min-width:0}\nbody:has(.ios-shell):not(.odem-tv-mode) .vr-flow-card-head .badge{min-width:0;overflow:hidden;text-overflow:ellipsis}\nbody:has(.ios-shell):not(.odem-tv-mode) .vr-flow-card-head>strong{font-size:18px;line-height:1;font-variant-numeric:tabular-nums}\nbody:has(.ios-shell):not(.odem-tv-mode) .vr-flow-card-value{font-size:12px;color:var(--text-2);font-weight:650;font-variant-numeric:tabular-nums}\nbody:has(.ios-shell):not(.odem-tv-mode) .vr-flow-card .vr-progress{height:5px;margin:0}\n\n@media(max-width:1050px){body:has(.ios-shell):not(.odem-tv-mode) .vr-executive-row{grid-template-columns:1fr!important}body:has(.ios-shell):not(.odem-tv-mode) .vr-flow-full .vr-flow-list{grid-template-columns:repeat(2,minmax(0,1fr))!important}}\n@media(max-width:620px){body:has(.ios-shell):not(.odem-tv-mode) .vr-flow-full .vr-flow-list{grid-template-columns:1fr!important}.badge.badge-orcamento,.badge.badge-gerado,.badge.badge-aguard-mercadoria,.badge.badge-separacao,.badge.badge-faturado,.badge.badge-parcial,.badge.badge-nf-transp,.badge.badge-concluido,.badge.badge-cancelado{white-space:normal!important;height:auto!important;min-height:28px!important;padding-top:6px!important;padding-bottom:6px!important}}\n\nbody.odem-tv-mode .vr-page{padding:clamp(8px,.7vw,14px)!important}\nbody.odem-tv-mode .vr-head{margin-bottom:clamp(6px,.6vh,12px)!important}\nbody.odem-tv-mode .vr-kpis{grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:clamp(6px,.5vw,10px)!important}\nbody.odem-tv-mode .vr-kpi{min-height:clamp(76px,9vh,102px)!important;padding:clamp(8px,.7vw,13px)!important}\nbody.odem-tv-mode .vr-executive-row{grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr)!important;gap:clamp(8px,.7vw,12px)!important}\nbody.odem-tv-mode .vr-evolution,body.odem-tv-mode .vr-executive-row>.vr-panel{min-height:0!important;height:auto!important}\nbody.odem-tv-mode .vr-flow-full{margin-top:clamp(7px,.6vh,12px)!important}\nbody.odem-tv-mode .vr-flow-full .vr-flow-list{display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:clamp(5px,.45vw,8px)!important}\nbody.odem-tv-mode .vr-flow-card{padding:clamp(7px,.55vw,10px)!important;border:1px solid var(--border);border-radius:10px;background:var(--surface-2);display:grid;gap:5px;min-width:0}\nbody.odem-tv-mode .vr-flow-card-head{display:flex;align-items:center;justify-content:space-between;gap:5px;min-width:0}\nbody.odem-tv-mode .vr-flow-card-head .badge{min-height:24px!important;height:24px!important;font-size:clamp(8px,.55vw,10px)!important;padding:0 7px!important;overflow:hidden;text-overflow:ellipsis}\nbody.odem-tv-mode .vr-flow-card-head>strong{font-size:clamp(14px,1vw,19px);line-height:1}\nbody.odem-tv-mode .vr-flow-card-value{font-size:clamp(9px,.6vw,11px);color:var(--text-2);font-weight:650}\nbody.odem-tv-mode .vr-flow-card .vr-progress{height:4px!important;margin:0!important}\nbody.odem-tv-mode .vr-recent-panel,body.odem-tv-mode .vr-history-panel{margin-top:clamp(7px,.6vh,12px)!important}\n

/* 33.8.14 — fluxo operacional compacto e alinhado (Gestor + Vendedor + TV) */

/* Gestor: cards compactos e proporcionais, sem lista vertical gigante */
body:has(.ios-shell):not(.odem-tv-mode) .vr-flow-full{padding:18px!important}
body:has(.ios-shell):not(.odem-tv-mode) .vr-flow-full .vr-panel-head{margin-bottom:12px!important;padding-bottom:11px!important}
body:has(.ios-shell):not(.odem-tv-mode) .vr-flow-full .vr-flow-list{display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:10px!important}
body:has(.ios-shell):not(.odem-tv-mode) .vr-flow-card{display:grid!important;grid-template-rows:auto auto 4px!important;gap:8px!important;min-height:96px!important;padding:11px 12px!important;border:1px solid var(--border)!important;border-radius:13px!important;background:var(--surface)!important;box-shadow:none!important;overflow:hidden!important}
body:has(.ios-shell):not(.odem-tv-mode) .vr-flow-card-head{display:flex!important;align-items:center!important;justify-content:space-between!important;gap:8px!important;min-width:0!important}
body:has(.ios-shell):not(.odem-tv-mode) .vr-flow-card-head .badge{max-width:calc(100% - 40px)!important;overflow:hidden!important;text-overflow:ellipsis!important}
body:has(.ios-shell):not(.odem-tv-mode) .vr-flow-card-head>strong{font-size:18px!important;line-height:1!important;font-weight:750!important;min-width:26px;text-align:right;font-variant-numeric:tabular-nums}
body:has(.ios-shell):not(.odem-tv-mode) .vr-flow-card-value{font-size:12px!important;line-height:1.25!important;font-weight:650!important;color:var(--text-2)!important;font-variant-numeric:tabular-nums}
body:has(.ios-shell):not(.odem-tv-mode) .vr-flow-card .vr-progress{height:4px!important;margin:0!important;background:var(--surface-3)!important}

/* Vendedor: operação pessoal compacta, sem copiar o Varejo */
.dc-operation-compact{padding:18px!important}
.dc-operation-compact .dc-panel-head{margin-bottom:12px!important}
.dc-operation-summary{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-bottom:12px}
.dc-operation-summary-item{display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"label qty" "value value";gap:4px 8px;align-items:center;padding:11px 12px;border:1px solid var(--border,#e4e7ec);border-radius:12px;background:var(--surface-2,#f7f8fa);min-width:0}
.dc-operation-summary-item span{grid-area:label;font-size:10.5px;color:var(--text-muted,#667085);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dc-operation-summary-item strong{grid-area:qty;font-size:19px;line-height:1;font-weight:760;font-variant-numeric:tabular-nums}
.dc-operation-summary-item b{grid-area:value;font-size:11.5px;font-weight:650;font-variant-numeric:tabular-nums}
.dc-status-map.dc-status-map-compact{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:8px!important;margin-top:0!important}
.dc-status-map-compact .dc-status-card{display:grid!important;grid-template-columns:minmax(0,1fr) auto!important;grid-template-areas:"badge count" "value value"!important;gap:5px 8px!important;align-items:center!important;padding:9px 10px!important;border:1px solid var(--border,#e4e7ec)!important;border-radius:11px!important;min-width:0!important;background:var(--surface,#fff)!important}
.dc-status-map-compact .dc-status-card .badge{grid-area:badge;justify-self:start;max-width:100%;overflow:hidden;text-overflow:ellipsis}
.dc-status-map-compact .dc-status-count{grid-area:count;font-size:10px!important;color:var(--text-muted,#667085)!important;white-space:nowrap!important}
.dc-status-map-compact .dc-status-card>strong{grid-area:value;font-size:11px!important;line-height:1.2!important;font-weight:680!important;font-variant-numeric:tabular-nums!important}

/* Badge único: alinhamento profissional e consistente */
.badge.badge-orcamento,.badge.badge-gerado,.badge.badge-aguard-mercadoria,.badge.badge-separacao,.badge.badge-faturado,.badge.badge-parcial,.badge.badge-nf-transp,.badge.badge-concluido,.badge.badge-cancelado{
  display:inline-flex!important;align-items:center!important;justify-content:flex-start!important;gap:6px!important;
  min-height:28px!important;height:28px!important;padding:0 9px!important;border-radius:8px!important;
  box-sizing:border-box!important;font-size:10.5px!important;line-height:1!important;font-weight:650!important;
  white-space:nowrap!important;text-align:left!important;vertical-align:middle!important;
}
.badge.badge-orcamento::before,.badge.badge-gerado::before,.badge.badge-aguard-mercadoria::before,.badge.badge-separacao::before,.badge.badge-faturado::before,.badge.badge-parcial::before,.badge.badge-nf-transp::before,.badge.badge-concluido::before,.badge.badge-cancelado::before{
  width:6px!important;height:6px!important;min-width:6px!important;flex:0 0 6px!important;margin:0!important;align-self:center!important;
}

/* TV: tudo cabe sem alongar verticalmente */
body.odem-tv-mode .vr-flow-full{padding:clamp(8px,.6vw,12px)!important;margin-top:clamp(6px,.5vh,10px)!important}
body.odem-tv-mode .vr-flow-full .vr-panel-head{padding-bottom:clamp(5px,.4vh,8px)!important;margin-bottom:clamp(5px,.4vh,8px)!important}
body.odem-tv-mode .vr-flow-full .vr-flow-list{display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:clamp(5px,.4vw,8px)!important}
body.odem-tv-mode .vr-flow-card{min-height:clamp(64px,8vh,82px)!important;padding:clamp(6px,.45vw,9px)!important;gap:4px!important;border-radius:9px!important;background:var(--surface)!important}
body.odem-tv-mode .vr-flow-card-head .badge{height:22px!important;min-height:22px!important;padding:0 6px!important;font-size:clamp(7.5px,.5vw,9px)!important}
body.odem-tv-mode .vr-flow-card-head>strong{font-size:clamp(13px,.9vw,17px)!important}
body.odem-tv-mode .vr-flow-card-value{font-size:clamp(8.5px,.55vw,10px)!important}
body.odem-tv-mode .vr-flow-card .vr-progress{height:3px!important}

@media(max-width:1050px){
  body:has(.ios-shell):not(.odem-tv-mode) .vr-flow-full .vr-flow-list{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .dc-operation-summary{grid-template-columns:1fr 1fr 1fr}
}
@media(max-width:720px){
  body:has(.ios-shell):not(.odem-tv-mode) .vr-flow-full .vr-flow-list{grid-template-columns:1fr 1fr!important}
  .dc-operation-summary{grid-template-columns:1fr}
  .dc-status-map.dc-status-map-compact{grid-template-columns:1fr!important}
}
@media(max-width:460px){
  body:has(.ios-shell):not(.odem-tv-mode) .vr-flow-full .vr-flow-list{grid-template-columns:1fr!important}
}

/* 33.8.15 — Indicadores unificados: ranking mensal, busca e evolução compacta */
body:has(.ios-shell):not(.odem-tv-mode) .vr-rank-search{margin:-2px 0 12px;display:flex}
body:has(.ios-shell):not(.odem-tv-mode) .vr-rank-search .input{width:100%;height:38px;min-height:38px;border-radius:10px}
body:has(.ios-shell):not(.odem-tv-mode) .vr-evolution,body:has(.ios-shell):not(.odem-tv-mode) .vr-executive-row>.vr-panel{min-height:280px!important}
body:has(.ios-shell):not(.odem-tv-mode) .vr-evolution-body{min-height:185px!important}
body:has(.ios-shell):not(.odem-tv-mode) .vr-evolution-body .ind-chart-bars-v2{height:175px!important;gap:10px!important;padding-inline:8px}
body:has(.ios-shell):not(.odem-tv-mode) .vr-evolution-body .ind-day{min-width:0}
body:has(.ios-shell):not(.odem-tv-mode) .vr-evolution-body .ind-day>span{font-size:9px;max-width:none}
body:has(.ios-shell):not(.odem-tv-mode) .vr-rep-list.is-expanded{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:0 18px!important;max-height:none!important;overflow:visible!important}
body:has(.ios-shell):not(.odem-tv-mode) .vr-rep-list.is-expanded .vr-rep-row{min-width:0}
body:has(.ios-shell):not(.odem-tv-mode) .vr-filterbar #ind-rep{min-width:0}
body.odem-tv-mode .vr-rank-search{display:none!important}
body.odem-tv-mode .vr-rep-list.is-expanded{display:flex!important;flex-direction:column!important}
@media(max-width:900px){body:has(.ios-shell):not(.odem-tv-mode) .vr-rep-list.is-expanded{grid-template-columns:1fr!important}}
/* VF04 — alvos identificados de Importação; nenhum seletor fora da rota. */
@media(max-width:760px),(pointer:coarse){
 .ig-page :is(.ig-tabs>button,[data-ig-select],[data-hv-select],[data-hv-reset],[data-ig-refresh],.of-filter-pin,.of-filter-toggle,.of-filter-clear,.of-filter-chip){
  min-width:44px!important;min-height:44px!important;
 }
}