/* =====================================================
   Portal BKon — Fase 5: BKon OS (Carteira + Faturamento)
   Telas: Faturas/Contratos (cliente) · Produtos/Contratos/
   Faturas (admin). Usa só tokens e componentes existentes
   (badge, admin-proj-row, report-item, modal, form-input) —
   nenhuma cor/raio novo foi inventado aqui.
   ===================================================== */

/* ── Acessibilidade: font-size >= 16px em TODO input ──
   Previne zoom automático do iOS Safari. Mesma especificidade
   de .form-input (portal.css) e .login-card .form-input
   (portal.css) — carregado depois, vence no empate de
   especificidade. Correção de alcance geral (toda tela com
   formulário do portal), não só as telas desta fase. */
.form-input,
.login-card .form-input {
  font-size: max(16px, 1rem);
}

/* ── Filtros (admin: Contratos e Faturas) ───────────── */
.filter-bar {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}
.filter-bar .form-select {
  min-width: 170px;
  width: auto;
}
.filter-bar__label {
  font-family: var(--font-mono);
  font-size: 11px;
  font-weight: 500;
  color: var(--text-muted);
  text-transform: uppercase;
  letter-spacing: 0.08em;
  white-space: nowrap;
}

@media (max-width: 640px) {
  .filter-bar { width: 100%; }
  .filter-bar .form-select { flex: 1; min-width: 0; }
}

/* ── Valores monetários — tabular, sem "tremedeira" ─── */
.money {
  font-family: var(--font-mono);
  font-variant-numeric: tabular-nums;
  font-weight: 600;
  color: var(--text-primary);
  white-space: nowrap;
  letter-spacing: 0.01em;
}
.money--muted { color: var(--text-muted); font-weight: 500; }

/* Coluna de valor nas linhas de admin (reaproveita admin-proj-row) */
.admin-proj-row__value {
  flex-shrink: 0;
  text-align: right;
  min-width: 96px;
}

/* ── Input de dinheiro — prefixo "R$" fixo ──────────── */
.money-input-wrap {
  position: relative;
}
.money-input-wrap .form-input {
  padding-left: 34px;
}
.money-input-wrap__prefix {
  position: absolute;
  left: 12px;
  top: 50%;
  transform: translateY(-50%);
  font-size: 13px;
  font-weight: 500;
  color: var(--text-muted);
  pointer-events: none;
}

/* ── Linha de lista estática (Contratos do cliente) ──
   Mesma anatomia do .report-item, sem affordance de clique. */
.report-item--static {
  cursor: default;
}
.report-item--static:hover {
  background: none;
}

/* ── Link de pagamento (detalhe de fatura do cliente) ─
   Reaproveita .invite-link-block (já com copiar + estilo
   dual-theme pronto) — só muda o texto do label via JS. */
.carteira-detail-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 14px;
  margin-top: 16px;
}
@media (min-width: 640px) {
  .carteira-detail-grid { grid-template-columns: 1fr 1fr; }
}
.carteira-detail-field__label {
  font-family: var(--font-mono);
  font-size: 11px;
  font-weight: 500;
  color: var(--text-muted);
  text-transform: uppercase;
  letter-spacing: 0.08em;
  margin-bottom: 4px;
  display: block;
}
.carteira-detail-field__value {
  font-size: 14px;
  color: var(--text-primary);
}

/* ── Linha de catálogo/contrato/fatura — ativo/inativo ─ */
.admin-proj-row__actions .btn[disabled] {
  opacity: 0.45;
  cursor: not-allowed;
}

/* ── Responsivo — mobile ─────────────────────────────── */
@media (max-width: 640px) {
  .admin-proj-row__value { order: 2; width: 100%; text-align: left; }
}