/* JOT-2899: núcleo C/D. Escopo local preserva as telas das demais tarefas.
   Os tokens vêm da base visual; nenhum dado da referência é conteúdo da UI. */
.clientes-carteira,
.clientes-ficha,
.clientes-cadastro {
  min-width: 0;
  gap: var(--pv-s-4);
}
.clientes-carteira .page-header h1,
.clientes-cadastro .page-header h1 {
  font-size: 24px;
}
.clientes-carteira .page-header .row-between {
  gap: var(--pv-s-3);
}
.clientes-carteira .page-header .sub,
.clientes-cadastro .page-header .sub {
  margin-top: 0;
  font-size: 13px;
}
.clientes-carteira .wallet-card {
  padding: var(--pv-s-4);
  border: 0;
  border-radius: var(--pv-r-lg);
  background: var(--pv-bg-1);
  box-shadow: none;
  gap: var(--pv-s-2);
}
.clientes-carteira .wallet-title {
  font-size: 15px;
  font-weight: 600;
  letter-spacing: 0;
}
.clientes-carteira .wallet-head {
  gap: var(--pv-s-2);
}
.clientes-carteira .wallet-head .badge {
  font-size: 11px;
  font-weight: 500;
  background: var(--pv-selected);
  color: var(--pv-success);
  border: 0;
}
.clientes-carteira .wallet-copy {
  font-size: 12px;
}
.clientes-carteira .wallet-rules {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.clientes-carteira .wallet-rule {
  border: 0;
  border-radius: var(--pv-r-md);
  background: var(--pv-bg-2);
  padding: 10px;
  min-width: 0;
}
.clientes-carteira .wallet-rule span {
  font-size: 11px;
  font-weight: 400;
}
.clientes-carteira .wallet-rule strong {
  font-size: 12px;
  font-weight: 500;
  overflow-wrap: anywhere;
}
.clientes-busca {
  gap: var(--pv-s-4);
}
.clientes-busca-campo {
  padding: 0 16px;
  border-radius: var(--pv-r-xl);
  background: var(--pv-bg-1);
}
.clientes-busca-controle {
  position: relative;
  padding-left: 24px;
}
.clientes-busca-controle label {
  display: block;
  position: absolute;
  top: 6px;
  left: 24px;
  font-size: 13px;
  line-height: 20px;
  color: var(--pv-fg-0);
}
.clientes-busca-controle .input {
  height: 56px;
  min-height: 56px;
  border: 0;
  border-radius: 0;
  padding: 20px 0 4px;
  background: transparent;
  font-size: 13px;
  box-shadow: none;
}
.clientes-busca-campo:focus-within {
  outline: 2px solid var(--pv-gold);
  outline-offset: 2px;
}
.clientes-carteira .chip-row {
  gap: var(--pv-s-2);
  flex-wrap: wrap;
  overflow: visible;
}
.clientes-carteira .chip {
  min-height: 44px;
  padding: 8px 13px;
  border: 1px solid var(--pv-line);
  background: var(--pv-bg-1);
  font-weight: 400;
}
.clientes-carteira .chip.is-active {
  background: var(--pv-gold);
  border-color: var(--pv-gold);
  color: var(--pv-bg-1);
}
.clientes-carteira .client-list {
  gap: var(--pv-s-4);
  grid-template-columns: minmax(0, 1fr);
}
.clientes-carteira .client-list > .empty,
.clientes-carteira .client-list > .card.empty {
  grid-column: 1 / -1;
  background: var(--pv-bg-1);
}
.clientes-carteira .client-card {
  min-width: 0;
  gap: var(--pv-s-3);
  padding: var(--pv-s-4);
  border-radius: var(--pv-r-lg);
  transition: border-color 140ms;
}
.clientes-carteira .client-card:hover {
  transform: none;
  border-color: var(--pv-gold);
  box-shadow: none;
}
.clientes-carteira .client-card-name {
  font-size: 14px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.clientes-carteira .client-card-city {
  text-transform: none;
  letter-spacing: 0;
}
.clientes-carteira .client-card .badge {
  font-size: 11px;
  font-weight: 400;
  min-height: 26px;
  border: 0;
  border-radius: var(--pv-r-sm);
}
.clientes-carteira .client-card .badge-success {
  background: var(--pv-selected);
  color: var(--pv-success);
}
.clientes-carteira .client-card > .row-between {
  flex-wrap: wrap;
  gap: var(--pv-s-2);
  margin-top: 0;
}
.clientes-carteira .client-card-actions {
  margin-left: auto;
}
.clientes-carteira .client-card-actions .btn {
  min-height: 44px;
  padding: 0 14px;
  font-size: 13px;
  font-weight: 500;
}
.clientes-carteira .client-card-actions .btn-kebab {
  width: 44px;
  padding: 0;
}
.clientes-carteira .card-menu-item {
  min-height: 44px;
}
.clientes-ficha .customer-header {
  padding: 0;
  border: 0;
  background: transparent;
  border-radius: 0;
  gap: var(--pv-s-3);
}
.clientes-ficha-topo {
  flex-direction: column;
  align-items: stretch;
  gap: var(--pv-s-3);
}
.clientes-ficha-topo > .stack-sm {
  min-width: 0;
}
.clientes-ficha .customer-header h1 {
  font-size: 24px;
  line-height: 1.3;
  overflow-wrap: anywhere;
}
.clientes-ficha-badges {
  display: flex;
  flex-wrap: wrap;
  gap: var(--pv-s-2);
  align-items: center;
}
.clientes-ficha .credito-status {
  padding: 0;
  min-height: 0;
  border: 0;
  background: transparent;
  font-weight: 500;
}
.clientes-ficha .customer-tags {
  gap: 6px;
  font-size: 13px;
  color: var(--pv-fg-2);
}
.clientes-ficha .customer-tags > span + span::before {
  content: "·";
  margin-right: 6px;
}
.clientes-gestao-acoes {
  flex-wrap: wrap;
  gap: var(--pv-s-2);
}
.clientes-ficha .tabs-wrap::before {
  background: linear-gradient(to right, var(--pv-bg-0), transparent);
}
.clientes-ficha .tabs-wrap::after {
  background: linear-gradient(to left, var(--pv-bg-0), transparent);
}
.clientes-ficha .tabs {
  border: 0;
  gap: var(--pv-s-2);
}
.clientes-ficha .tab {
  min-width: 100px;
  min-height: 44px;
  padding: 10px 18px;
  flex-shrink: 0;
  border-radius: var(--pv-r-md);
  font-size: 14px;
  font-weight: 400;
}
.clientes-ficha .tab[aria-selected="true"] {
  background: var(--pv-bg-1);
  color: var(--pv-gold);
  font-weight: 600;
}
.clientes-ficha .tab::after {
  display: none;
}
.clientes-painel {
  gap: var(--pv-s-4);
  min-width: 0;
}
.clientes-indicadores,
.clientes-fin-resumo {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  background: var(--pv-bg-1);
  border-radius: var(--pv-r-lg);
  padding: var(--pv-s-4);
  gap: var(--pv-s-6) var(--pv-s-3);
}
.clientes-ficha .stat {
  background: transparent;
  border: 0;
  border-radius: 0;
  padding: 0;
  min-width: 0;
}
.clientes-ficha .stat-label {
  text-transform: none;
  letter-spacing: 0;
  font-size: 12px;
  color: var(--pv-fg-2);
}
.clientes-ficha .stat-value {
  margin-top: var(--pv-s-2);
  font-size: clamp(16px, 4.8vw, 20px);
  font-weight: 600;
  color: var(--pv-fg-0);
  overflow-wrap: anywhere;
  font-variant-numeric: tabular-nums;
}
.clientes-ficha .score-stars {
  color: var(--pv-fg-0);
  letter-spacing: 0;
  white-space: nowrap;
}
.clientes-ficha .score-stars .off {
  color: var(--pv-fg-2);
}
.clientes-ficha .clientes-dados-comerciais {
  border: 0;
  padding: var(--pv-s-4);
}
.clientes-dados-comerciais h2 {
  font-size: 18px;
  margin-bottom: var(--pv-s-5);
}
.clientes-dados-grid {
  display: grid;
  gap: var(--pv-s-5);
}
.clientes-dados-grid .uppercase {
  text-transform: none;
  letter-spacing: 0;
}
.clientes-dados-grid .text-sm {
  font-size: 15px;
  font-weight: 600;
  overflow-wrap: anywhere;
}
.clientes-ficha .clientes-acoes {
  display: flex;
  flex-direction: column;
  gap: var(--pv-s-2);
  left: 0;
  right: 0;
  padding: 12px 12px calc(12px + env(safe-area-inset-bottom, 0px));
  background: var(--pv-bg-1);
}
.clientes-ficha .clientes-acoes .btn {
  min-height: 44px;
  margin: 0;
  font-size: 14px;
}
.clientes-ficha .clientes-acoes .btn-secondary {
  border-color: transparent;
  color: var(--pv-gold);
  background: transparent;
}
/* Reserva a altura real dos dois CTAs para que o último dado seja alcançável. */
.main:has(.clientes-acoes) {
  --sticky-cta-h: 124px;
}
.clientes-fin-resumo {
  display: flex;
  flex-direction: column;
  gap: var(--pv-s-4);
}
.clientes-fin-resumo .stat {
  display: grid;
  grid-template-columns: 1fr 1fr;
  align-items: center;
  gap: var(--pv-s-3);
}
.clientes-fin-resumo .stat-value {
  margin: 0;
  font-size: 17px;
}
.clientes-titulos {
  min-width: 0;
}
.clientes-fin-tabela,
.clientes-fin-tabela tbody {
  display: block;
  width: 100%;
}
.clientes-fin-tabela thead {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip-path: inset(50%);
}
.clientes-fin-tabela tr {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--pv-s-4) var(--pv-s-3);
  padding: var(--pv-s-4);
  margin-bottom: var(--pv-s-4);
  border-radius: var(--pv-r-lg);
  background: var(--pv-bg-1);
}
.clientes-fin-tabela td {
  display: flex;
  flex-direction: column;
  gap: var(--pv-s-2);
  padding: 0;
  border: 0;
  text-align: left;
  min-width: 0;
  overflow-wrap: anywhere;
  font-size: 13px;
  font-weight: 600;
}
.clientes-fin-tabela td::before {
  content: attr(data-label);
  font-size: 12px;
  font-weight: 400;
  color: var(--pv-fg-2);
}
.clientes-fin-tabela td:nth-child(4),
.clientes-fin-tabela td:nth-child(5) {
  text-align: left;
}
.clientes-fin-tabela td:first-child {
  grid-column: 1;
  grid-row: 1;
  font-size: 15px;
}
.clientes-fin-tabela td:first-child::before,
.clientes-fin-tabela td:last-child::before {
  display: none;
}
.clientes-fin-tabela td:last-child {
  grid-column: 2;
  grid-row: 1;
  align-items: flex-end;
}
.clientes-ficha .clientes-historico {
  padding: 0;
  overflow: hidden;
  border: 0;
}
.clientes-ficha .clientes-historico > a {
  display: grid;
  gap: var(--pv-s-4);
}
.clientes-historico > a > .stack-sm:first-child > .mono {
  font-size: 15px;
  font-weight: 600;
}
.clientes-historico .clientes-historico-valor > .mono {
  font-size: 24px;
  font-weight: 600;
  color: var(--pv-fg-0);
}
.clientes-historico-valor .badge {
  background: transparent;
  border: 0;
  padding: 0;
  color: var(--pv-fg-2);
  font-weight: 400;
  align-self: flex-start;
}
.clientes-ficha .clientes-endereco {
  padding: var(--pv-s-4);
  border: 0;
  overflow-wrap: anywhere;
}
.clientes-cadastro > div:not(.page-header),
.clientes-cadastro .panel {
  min-width: 0;
}
.clientes-cadastro .panel {
  background: var(--pv-bg-1);
  border: 0;
  box-shadow: none;
  border-radius: var(--pv-r-lg);
  padding: var(--pv-s-4);
  margin-bottom: var(--pv-s-4);
}
.clientes-cadastro .panel h2 {
  font-size: 18px;
  margin-bottom: var(--pv-s-3);
}
.clientes-cadastro .panel h3 {
  font-size: 15px;
  font-weight: 600;
  margin: var(--pv-s-5) 0 var(--pv-s-3);
}
.clientes-cadastro > .panel {
  margin-bottom: 0;
}
.clientes-cadastro [data-testid="alert-consulta-indisponivel"] {
  padding: 0;
  background: transparent;
  border: 0;
  font-size: 13px;
}
.clientes-cadastro .field {
  margin-top: var(--pv-s-3);
  min-width: 0;
}
.clientes-cadastro .clientes-isento {
  display: flex;
  min-height: 44px;
  margin: 0;
}
.clientes-cadastro .field label {
  display: block;
  font-size: 12px;
  color: var(--pv-fg-2);
  margin-bottom: var(--pv-s-2);
}
.clientes-cadastro .field .clientes-isento {
  display: flex;
}
.clientes-cadastro .input,
.clientes-cadastro .select {
  height: 46px;
  min-height: 44px;
  border-radius: var(--pv-r-sm);
  background: var(--pv-bg-1);
  font-size: 15px;
  min-width: 0;
}
.clientes-cadastro .input:disabled {
  background: var(--pv-bg-0);
}
.clientes-cadastro .field.has-error .input,
.clientes-cadastro .field.has-error .select {
  border-color: var(--pv-danger);
}
.clientes-cadastro .field-error {
  color: var(--pv-danger);
  font-size: 12px;
  margin-top: var(--pv-s-1);
}
.clientes-campos-grid {
  display: grid;
  gap: 0 var(--pv-s-4);
  grid-template-columns: minmax(0, 1fr);
}
.clientes-campos-grid > .alert {
  grid-column: 1 / -1;
}
.clientes-cadastro-acoes {
  display: flex;
  flex-direction: column;
  gap: var(--pv-s-3);
}
.clientes-cadastro-acoes .btn {
  min-height: 44px;
}
.clientes-cadastro .sugestao-cidade {
  min-height: 44px;
}
.clientes-cadastro .panel .alert {
  margin-top: var(--pv-s-3);
}
.clientes-carteira :focus-visible,
.clientes-ficha :focus-visible,
.clientes-cadastro :focus-visible {
  outline: 2px solid var(--pv-gold);
  outline-offset: 3px;
}
@media (min-width: 768px) {
  .main:has(> .clientes-carteira),
  .main:has(> .clientes-ficha),
  .main:has(> .clientes-cadastro) {
    padding: 28px;
  }
  .clientes-carteira .page-header h1,
  .clientes-cadastro .page-header h1,
  .clientes-ficha .customer-header h1 {
    font-size: 28px;
  }
  .clientes-carteira .wallet-rules {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
  .clientes-carteira .client-list {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .clientes-ficha-topo {
    flex-direction: row;
    align-items: flex-start;
  }
  .clientes-ficha .credito-status {
    padding: 10px 28px;
    background: var(--pv-bg-1);
    border-radius: var(--pv-r-lg);
  }
  .clientes-ficha .tab {
    min-width: 130px;
  }
  .clientes-ficha .tab[aria-selected="true"] {
    color: var(--pv-fg-0);
  }
  .clientes-indicadores {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    padding: var(--pv-s-6);
    gap: var(--pv-s-5);
  }
  .clientes-ficha .stat-value {
    font-size: clamp(17px, 1.8vw, 24px);
  }
  .clientes-ficha .clientes-dados-comerciais,
  .clientes-ficha .clientes-endereco {
    padding: var(--pv-s-6);
  }
  .clientes-dados-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .clientes-ficha .clientes-acoes {
    position: static;
    flex-direction: row;
    padding: 0;
    background: transparent;
    gap: var(--pv-s-3);
  }
  .clientes-ficha .clientes-acoes .btn {
    width: 240px;
    min-width: 0;
    max-width: 100%;
    font-weight: 500;
  }
  .clientes-ficha .clientes-acoes .btn-secondary {
    color: var(--pv-fg-0);
    border-color: var(--pv-line);
    background: var(--pv-bg-1);
  }
  .clientes-fin-resumo {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    padding: var(--pv-s-6);
  }
  .clientes-fin-resumo .stat {
    display: block;
  }
  .clientes-fin-resumo .stat-value {
    margin-top: var(--pv-s-2);
  }
  .clientes-titulos {
    padding: var(--pv-s-4);
    background: var(--pv-bg-1);
    border-radius: var(--pv-r-lg);
    overflow-x: auto;
  }
  .clientes-fin-tabela {
    display: table;
  }
  .clientes-fin-tabela tbody {
    display: table-row-group;
  }
  .clientes-fin-tabela thead {
    display: table-header-group;
    position: static;
    width: auto;
    height: auto;
    clip-path: none;
  }
  .clientes-fin-tabela tr {
    display: table-row;
  }
  .clientes-fin-tabela th,
  .clientes-fin-tabela td {
    display: table-cell;
    padding: 16px 8px;
    border: 0;
    white-space: nowrap;
    font-size: 12px;
    font-weight: 400;
  }
  .clientes-fin-tabela td:first-child {
    font-size: 13px;
    font-weight: 600;
  }
  .clientes-fin-tabela td::before {
    display: none;
  }
  .clientes-fin-tabela td:nth-child(4),
  .clientes-fin-tabela td:nth-child(5) {
    text-align: right;
  }
  .clientes-cadastro .panel {
    padding: var(--pv-s-6);
  }
  .clientes-campos-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .clientes-campo-inteiro {
    grid-column: 1 / -1;
  }
  .clientes-cadastro-acoes {
    flex-direction: row;
  }
  .clientes-cadastro-acoes .btn {
    min-width: 170px;
  }
}
@media (min-width: 1200px) {
  .clientes-carteira .client-list {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}
