@import url("premium-content-20260930.css?v=1");
/* Complementos do painel Desempenho sobre o gabarito original.
 *
 * O modelo usa um sprite de fotos ficticias.  Aqui o avatar carrega a foto
 * real do usuario Bitrix quando existe e, quando nao existe, mostra as
 * iniciais no mesmo circulo — sem atribuir rosto de terceiro a pessoa real.
 */
.avatar.initials::before {
  content: attr(data-initials);
  display: grid;
  place-items: center;
  width: 100%;
  height: 100%;
  font-size: 10.5px;
  font-weight: 600;
  letter-spacing: .3px;
  color: var(--text);
  background: linear-gradient(180deg, var(--panel3), var(--panel2));
  border-radius: 50%;
}

.profile .avatar.initials::before { font-size: 11.5px; }

/* Vendedor desativado no portal: mesmo ponto, sem brilho de presenca. */
.dot.off { background: var(--soft); box-shadow: none; }

/* Nomes reais sao mais longos que os do modelo: a linha nunca quebra. */
.hrow > span,
.seller-name { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

/* Affordance de interação para alvos que o renderer já expõe por teclado. */
.rank-table tbody tr[role="button"],
.hrow[role="button"],
.ditem[role="button"],
.act[role="button"],
.kpi[role="button"] {
  cursor: pointer;
  transition: background-color .16s ease, outline-color .16s ease, box-shadow .16s ease;
}
.cell[role="gridcell"] {
  cursor: default;
  transition: background-color .16s ease, outline-color .16s ease, box-shadow .16s ease;
}
.rank-table tbody tr[role="button"]:hover,
.hrow[role="button"]:hover,
.ditem[role="button"]:hover,
.act[role="button"]:hover,
.kpi[role="button"]:hover {
  background: color-mix(in srgb, var(--analytics-theme-accent) 7%, transparent) !important;
}
.rank-table tbody tr[role="button"]:focus-visible,
.hrow[role="button"]:focus-visible,
.ditem[role="button"]:focus-visible,
.act[role="button"]:focus-visible,
.cell[role="gridcell"]:focus-visible,
.kpi[role="button"]:focus-visible {
  outline: 2px solid var(--analytics-theme-focus, var(--cyan2));
  outline-offset: -2px;
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--analytics-theme-focus, var(--cyan2)) 30%, transparent);
}
.rank-table tbody tr[role="button"]:active,
.hrow[role="button"]:active,
.ditem[role="button"]:active,
.act[role="button"]:active,
.kpi[role="button"]:active {
  background: color-mix(in srgb, var(--analytics-theme-accent) 13%, transparent) !important;
}

.rank-table .score { white-space: nowrap; }

/* Nomes e valores reais sao mais largos que os do modelo.  Sem largura fixa a
   tabela cresce alem dos 492px do painel e a coluna Score fica cortada. */
.rank-table { table-layout: fixed; width: 100%; }
.rank-table th:nth-child(1), .rank-table td:nth-child(1) { width: 26.7px; }
.rank-table th:nth-child(2), .rank-table td:nth-child(2) { width: 129.6px; }
.rank-table th:nth-child(3), .rank-table td:nth-child(3) { width: 81.2px; }
.rank-table th:nth-child(4), .rank-table td:nth-child(4) { width: 64.6px; }
.rank-table th:nth-child(5), .rank-table td:nth-child(5) { width: 75.7px; }
.rank-table th:nth-child(6), .rank-table td:nth-child(6) { width: 69.7px; }
.rank-table th:nth-child(7), .rank-table td:nth-child(7) { width: 42.5px; }

.rank-table td:nth-child(5) { white-space: nowrap; }
.seller-meta { min-width: 0; }

/* O botao de metrica do heatmap alterna vendas/orcamentos/atendimentos/
   mensagens/ligacoes e precisa caber sem empurrar o titulo do painel. */
.heat-panel .mini-btn { white-space: nowrap; }

/* Rodape da sidebar mantem a altura do gabarito com o rotulo da sessao. */
.profile-name, .profile-role { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

[data-static-metric="true"] {
  cursor: default;
  user-select: none;
  color: var(--muted);
}

.chart-empty-state { pointer-events: none; }
.chart-empty-title {
  fill: var(--text);
  font-size: 12px;
  font-weight: 650;
}
.chart-empty-copy {
  fill: var(--muted);
  font-size: 9.5px;
}

.meta-bar.unavailable {
  border: 1px dashed color-mix(in srgb, var(--muted) 42%, transparent);
  background: color-mix(in srgb, var(--muted) 6%, transparent);
}
.meta-bar.unavailable i { display: none; }
.rank-table .score.empty {
  border-color: var(--soft);
  color: var(--muted);
  background: color-mix(in srgb, var(--muted) 8%, transparent);
}

.side-empty {
  min-height: 74px;
  display: grid;
  place-content: center;
  gap: 5px;
  padding: 14px 16px;
  text-align: center;
}
.side-empty strong {
  color: var(--text);
  font-size: 11px;
  font-weight: 650;
}
.side-empty span {
  max-width: 230px;
  color: var(--muted);
  font-size: 9.5px;
  line-height: 1.4;
}
.heat-empty-state {
  grid-column: 1 / -1;
  grid-row: 1 / -1;
  align-self: stretch;
  display: grid;
  place-content: center;
  gap: 4px;
  padding: 12px;
  text-align: center;
  color: var(--muted);
}
.heat-empty-state strong { color: var(--text); font-size: 11px; }
.heat-empty-state span { max-width: 250px; font-size: 9.5px; line-height: 1.4; }
.more.static-note {
  cursor: default;
  color: var(--muted);
}

html:is([data-analytics-theme="executivo-claro"],[data-analytics-theme="alto-contraste"]) body[data-view="desempenho"] .stage {
  background: radial-gradient(900px 420px at 46% -10%, color-mix(in srgb, var(--analytics-theme-accent) 10%, transparent), transparent 62%), var(--analytics-theme-surface-0) !important;
}
html:is([data-analytics-theme="executivo-claro"],[data-analytics-theme="alto-contraste"]) body[data-view="desempenho"] :is(.panel,.kpi,.footer) {
  color: var(--analytics-theme-text-secondary);
  background: linear-gradient(180deg, var(--analytics-theme-surface-2), var(--analytics-theme-surface-1)) !important;
  border-color: var(--analytics-theme-border) !important;
}
html:is([data-analytics-theme="executivo-claro"],[data-analytics-theme="alto-contraste"]) body[data-view="desempenho"] :is(.ctrl,.mini-btn,.insight,.track,.meta-bar,.donut-track,.cell) {
  color: var(--analytics-theme-text-secondary) !important;
  background: var(--analytics-theme-surface-2) !important;
  border-color: var(--analytics-theme-border) !important;
}
html:is([data-analytics-theme="executivo-claro"],[data-analytics-theme="alto-contraste"]) body[data-view="desempenho"] :is(.title h1,.panel-title,.kpi-value,.seller-name,.rank-table td,.side-title,.alert-main,.act,.donut-center b,.ditem,.chart-tip .tiprow strong,.donut-tip b,.heat-tip b) {
  color: var(--analytics-theme-text) !important;
}
html:is([data-analytics-theme="executivo-claro"],[data-analytics-theme="alto-contraste"]) body[data-view="desempenho"] :is(.title p,.kpi-label,.rank-table th,.seller-status,.rank-footer,.legend,.main-chart-svg text,.ins-body,.alert-sub,.donut-center span,.axis,.days,.times,.scale,.side-empty span) {
  color: var(--analytics-theme-muted) !important;
  fill: var(--analytics-theme-axis) !important;
}
html:is([data-analytics-theme="executivo-claro"],[data-analytics-theme="alto-contraste"]) body[data-view="desempenho"] :is(.rank-table th,.rank-table td,.conv) {
  border-color: var(--analytics-theme-border) !important;
}
html:is([data-analytics-theme="executivo-claro"],[data-analytics-theme="alto-contraste"]) body[data-view="desempenho"] .main-chart-svg .goal {
  stroke: var(--analytics-chart-series-8) !important;
}
html:is([data-analytics-theme="executivo-claro"],[data-analytics-theme="alto-contraste"]) body[data-view="desempenho"] .donut-track {
  stroke: var(--analytics-theme-surface-3) !important;
}
html:is([data-analytics-theme="executivo-claro"],[data-analytics-theme="alto-contraste"]) body[data-view="desempenho"] :is(.fill,.meta-bar i) {
  background: linear-gradient(90deg, var(--analytics-chart-series-1), var(--analytics-theme-accent-strong)) !important;
}
html:is([data-analytics-theme="executivo-claro"],[data-analytics-theme="alto-contraste"]) body[data-view="desempenho"] .score {
  color: var(--analytics-theme-accent) !important;
  border-color: var(--analytics-theme-border-strong) !important;
  background: color-mix(in srgb, var(--analytics-theme-accent) 8%, transparent) !important;
}
html:is([data-analytics-theme="executivo-claro"],[data-analytics-theme="alto-contraste"]) body[data-view="desempenho"] .badge-red {
  color: var(--analytics-theme-surface-0) !important;
  background: var(--analytics-theme-danger) !important;
}
html:is([data-analytics-theme="executivo-claro"],[data-analytics-theme="alto-contraste"]) body[data-view="desempenho"] :is(.kpi-icon,.ins-ico.cyan) {
  color: var(--analytics-theme-accent) !important;
  background: color-mix(in srgb, var(--analytics-theme-accent) 10%, transparent) !important;
}
html:is([data-analytics-theme="executivo-claro"],[data-analytics-theme="alto-contraste"]) body[data-view="desempenho"] .ins-ico.warn {
  color: var(--analytics-theme-warning) !important;
  background: color-mix(in srgb, var(--analytics-theme-warning) 10%, transparent) !important;
}
html[data-analytics-theme="executivo-claro"] body[data-view="desempenho"] .cell { background: var(--analytics-theme-surface-2) !important; }
html[data-analytics-theme="executivo-claro"] body[data-view="desempenho"] .c1 { background: color-mix(in srgb, var(--analytics-chart-series-1) 18%, var(--analytics-theme-surface-2)) !important; }
html[data-analytics-theme="executivo-claro"] body[data-view="desempenho"] .c2 { background: color-mix(in srgb, var(--analytics-chart-series-1) 30%, var(--analytics-theme-surface-2)) !important; }
html[data-analytics-theme="executivo-claro"] body[data-view="desempenho"] .c3 { background: color-mix(in srgb, var(--analytics-chart-series-1) 42%, var(--analytics-theme-surface-2)) !important; }
html[data-analytics-theme="executivo-claro"] body[data-view="desempenho"] .c4 { background: color-mix(in srgb, var(--analytics-chart-series-1) 54%, var(--analytics-theme-surface-2)) !important; }
html[data-analytics-theme="executivo-claro"] body[data-view="desempenho"] .c5 { background: color-mix(in srgb, var(--analytics-chart-series-1) 68%, var(--analytics-theme-surface-2)) !important; }
html[data-analytics-theme="executivo-claro"] body[data-view="desempenho"] .c6 { background: color-mix(in srgb, var(--analytics-chart-series-1) 82%, var(--analytics-theme-surface-2)) !important; }
html[data-analytics-theme="executivo-claro"] body[data-view="desempenho"] .c7 { background: var(--analytics-chart-series-1) !important; }
html[data-analytics-theme="executivo-claro"] body[data-view="desempenho"] .grad {
  background: linear-gradient(90deg, color-mix(in srgb, var(--analytics-chart-series-1) 18%, var(--analytics-theme-surface-2)), var(--analytics-chart-series-1)) !important;
}
html[data-analytics-theme="alto-contraste"] body[data-view="desempenho"] :is(.panel,.kpi,.ctrl,.mini-btn,.insight,.track,.meta-bar,.cell) {
  outline: 1px solid color-mix(in srgb, var(--analytics-theme-text) 34%, transparent) !important;
  outline-offset: -1px !important;
}
html[data-analytics-theme="alto-contraste"] body[data-view="desempenho"] .main-chart-svg .line2 { stroke-dasharray: .055 .025; }
html[data-analytics-theme="alto-contraste"] body[data-view="desempenho"] .main-chart-svg .goal { stroke-dasharray: .012 .018 .05 .018; }
html[data-analytics-theme="alto-contraste"] body[data-view="desempenho"] .cell { border: 1px solid var(--analytics-theme-text) !important; }
html[data-analytics-theme="alto-contraste"] body[data-view="desempenho"] .c1 { background: color-mix(in srgb, var(--analytics-theme-accent) 24%, var(--analytics-theme-bg)) !important; }
html[data-analytics-theme="alto-contraste"] body[data-view="desempenho"] .c2 { background: color-mix(in srgb, var(--analytics-theme-accent) 36%, var(--analytics-theme-bg)) !important; }
html[data-analytics-theme="alto-contraste"] body[data-view="desempenho"] .c3 { background: color-mix(in srgb, var(--analytics-theme-accent) 48%, var(--analytics-theme-bg)) !important; }
html[data-analytics-theme="alto-contraste"] body[data-view="desempenho"] .c4 { background: color-mix(in srgb, var(--analytics-theme-accent) 60%, var(--analytics-theme-bg)) !important; }
html[data-analytics-theme="alto-contraste"] body[data-view="desempenho"] .c5 { background: color-mix(in srgb, var(--analytics-theme-accent) 72%, var(--analytics-theme-bg)) !important; }
html[data-analytics-theme="alto-contraste"] body[data-view="desempenho"] .c6 { background: color-mix(in srgb, var(--analytics-theme-accent) 86%, var(--analytics-theme-bg)) !important; }
html[data-analytics-theme="alto-contraste"] body[data-view="desempenho"] .c7 { background: var(--analytics-theme-accent) !important; }

@media print {
  body[data-view="desempenho"] :is(.panel,.kpi,.footer,.ctrl,.mini-btn,.insight,.track,.meta-bar,.cell) {
    color: var(--analytics-theme-text-secondary) !important;
    background: var(--analytics-theme-surface-1) !important;
    border-color: var(--analytics-theme-border) !important;
  }
  body[data-view="desempenho"] :is(.title h1,.panel-title,.kpi-value,.seller-name,.rank-table td,.side-title,.alert-main,.act,.donut-center b,.ditem,.chart-tip .tiprow strong) {
    color: var(--analytics-theme-text) !important;
  }
  body[data-view="desempenho"] :is(.title p,.kpi-label,.rank-table th,.seller-status,.rank-footer,.legend,.main-chart-svg text,.ins-body,.alert-sub,.donut-center span,.axis,.days,.times,.scale,.side-empty span) {
    color: var(--analytics-theme-muted) !important;
    fill: var(--analytics-theme-axis) !important;
  }
  body[data-view="desempenho"] .donut-track { stroke: var(--analytics-theme-surface-3) !important; }
  body[data-view="desempenho"] :is(.fill,.meta-bar i) { background: var(--analytics-chart-series-1) !important; }
}

@media (forced-colors: active) {
  body[data-view="desempenho"] :is(.kpi,.panel,.insight,.track,.chart-tip,.donut-tip,.heat-tip,.meta-bar,.score) {
    border-color: ButtonText !important;
  }
  body[data-view="desempenho"] .main-chart-svg .line1 {
    stroke: CanvasText !important;
    stroke-dasharray: none !important;
  }
  body[data-view="desempenho"] .main-chart-svg .line2 {
    stroke: CanvasText !important;
    stroke-dasharray: .055 .025 !important;
  }
  body[data-view="desempenho"] .main-chart-svg .goal {
    stroke: CanvasText !important;
    stroke-dasharray: .012 .018 .05 .018 !important;
  }
  body[data-view="desempenho"] .cell { border: 1px solid CanvasText !important; }
  body[data-view="desempenho"] .cell:not(.c1):not(.c2):not(.c3):not(.c4):not(.c5):not(.c6):not(.c7) { background: Canvas !important; }
  body[data-view="desempenho"] :is(.c1,.c2,.c3,.c4,.c5,.c6,.c7) { background: Highlight !important; }
  body[data-view="desempenho"] :is(.main-chart-svg,.cell,.donut-segment,.ditem):focus-visible { outline: 2px solid Highlight !important; outline-offset: 2px !important; }
  body[data-view="desempenho"] :is(.fill,.meta-bar i) { background: Highlight !important; }
}
