/*
 * INADIMPLÊNCIA
 * Faixa de KPIs no topo (shared/_metrics) e cards (.delinquency) por contrato
 * em atraso: cabeçalho (locatário + contato + total/badges) e a tabela das
 * parcelas vencidas.
 */

/* Coluna de encargos (multa+juros) da parcela vencida: em vermelho, para
   destacar quanto do total devido é penalidade por atraso. */
.delinquency__charge {
  color: var(--color-danger);
}

/* ---- Faixas de atraso (aging): barra empilhada + legenda ----
   Escala de calor (crítico → grave → atenção) derivada dos tokens semânticos
   via color-mix, para distinguir as 3 faixas sem usar primitivo cru. */
.aging-card { margin-bottom: var(--space-5); }

.aging__bar {
  display: flex;
  height: 0.625rem;
  border-radius: var(--radius-full);
  overflow: hidden;
  background: var(--color-surface-2);
  gap: 2px;
}
.aging__seg { display: block; height: 100%; }
.aging__seg--critical { background: var(--color-danger); }
.aging__seg--high     { background: color-mix(in srgb, var(--color-danger) 55%, var(--color-warning)); }
.aging__seg--recent   { background: var(--color-warning); }

.aging__legend {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-3) var(--space-5);
  margin-top: var(--space-4);
}
.aging__item { display: flex; align-items: baseline; gap: var(--space-2); font-size: var(--text-sm); }
.aging__dot { width: 0.625rem; height: 0.625rem; border-radius: var(--radius-full); flex-shrink: 0; align-self: center; }
.aging__dot--critical { background: var(--color-danger); }
.aging__dot--high     { background: color-mix(in srgb, var(--color-danger) 55%, var(--color-warning)); }
.aging__dot--recent   { background: var(--color-warning); }
.aging__label { font-weight: var(--weight-medium); }
.aging__range { color: var(--color-text-muted); font-weight: var(--weight-normal); }
.aging__val { margin-left: var(--space-1); font-variant-numeric: tabular-nums; font-weight: var(--weight-semibold); }

/* Etiqueta "IPTU" ao lado da competência, distinguindo a cobrança de IPTU
   (repassada ao inquilino) da mensalidade do aluguel na mesma tabela. */
.delinquency__tag {
  margin-left: var(--space-2);
  font-size: var(--text-2xs);
}

.delinquencies {
  display: flex;
  flex-direction: column;
  gap: var(--space-5);
}

.delinquency {
  padding: var(--space-4);
  background-color: var(--color-surface);
  border: var(--border-width) solid var(--color-border);
  border-radius: var(--radius-lg);
  /* Mesmo relevo dos cards/painéis do app: descola do fundo em vez de chapado. */
  box-shadow: var(--shadow-card);
}

/* Barra lateral por faixa de gravidade (priorização da cobrança): âmbar até
   30 dias, vermelha de 31 a 60, vermelha forte acima de 60. Sem tingir o fundo
   do card — só a barra, para o olho saltar primeiro nos piores. A barra (inset)
   compõe com o relevo do card (shadow-card) numa só declaração. */
.delinquency--recent {
  box-shadow: inset 4px 0 0 var(--color-warning), var(--shadow-card);
}

/* 31–60 e +60 dias compartilham a barra vermelha; o que separa o crítico é o
   badge sólido (badge--danger-strong) no cabeçalho. */
.delinquency--high,
.delinquency--critical {
  box-shadow: inset 4px 0 0 var(--color-danger), var(--shadow-card);
}

.delinquency__head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: var(--space-4);
  flex-wrap: wrap;
  margin-bottom: var(--space-4);
}

.delinquency__tenant {
  margin: 0 0 var(--space-1);
  font-size: var(--text-base);
  font-weight: var(--weight-semibold);
}

.delinquency__property {
  font-size: var(--text-sm);
  color: var(--color-text-muted);
  text-decoration: none;
}

.delinquency__property:hover {
  text-decoration: underline;
  text-underline-offset: 2px;
}

.delinquency__who .contact-actions {
  margin-top: var(--space-3);
}

.delinquency__summary {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: var(--space-3);
}

.delinquency__total {
  font-size: var(--text-lg);
  font-weight: var(--weight-semibold);
  color: var(--color-text);
  font-variant-numeric: tabular-nums;
}

.delinquency__badges {
  display: flex;
  gap: var(--space-2);
}

