/**
 * ERTEL — CSS próprio do módulo Plataforma (Fase 2: Comercialização).
 * Nunca compartilhado com outro módulo (mesmo classe com nome parecido
 * em outro CSS) — convenção do projeto, ver CLAUDE.md seção 2.
 */

.ertel-plataforma-header h1 {
  font-size: var(--ertel-text-xl);
  margin-bottom: 4px;
}

.ertel-plataforma-subtitulo {
  color: var(--ertel-muted);
  font-size: var(--ertel-text-sm);
  margin: 0 0 var(--ertel-space-5);
}

.ertel-plataforma-toolbar {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: var(--ertel-space-4);
  margin-bottom: var(--ertel-space-5);
}

.ertel-plataforma-toolbar h2 {
  font-size: var(--ertel-text-lg);
  margin: 0 0 4px;
}

.ertel-plataforma-loading,
.ertel-plataforma-erro {
  color: var(--ertel-muted);
  font-size: var(--ertel-text-sm);
  padding: var(--ertel-space-5);
}

.ertel-plataforma-erro {
  color: var(--ertel-danger);
}

.ertel-plataforma-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
  gap: var(--ertel-space-4);
}

.ertel-plataforma-card {
  background: var(--ertel-surface);
  border: 1px solid var(--ertel-border);
  border-radius: var(--ertel-radius-lg, 10px);
  padding: var(--ertel-space-5);
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.ertel-plataforma-card__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--ertel-space-2);
  min-width: 0;
}

.ertel-plataforma-card__header strong {
  overflow-wrap: anywhere;
}

.ertel-plataforma-card__slug {
  color: var(--ertel-muted);
  font-size: var(--ertel-text-xs);
  margin: 0;
}

.ertel-plataforma-card__info {
  font-size: var(--ertel-text-sm);
  margin: 0;
}

.ertel-plataforma-card .ertel-btn {
  margin-top: var(--ertel-space-2);
  align-self: flex-start;
}

.ertel-plataforma-badge {
  font-size: var(--ertel-text-xs);
  padding: 2px 8px;
  border-radius: 999px;
  background: var(--ertel-success);
  color: #fff;
  white-space: nowrap;
}

.ertel-plataforma-badge--inativo {
  background: var(--ertel-muted);
}

/* Gestão de Clientes (Fase 2) — status financeiro do tenant (vencimento/
   pagamento), independente do badge de status ativo/suspenso acima. */
.ertel-plataforma-badge--sucesso {
  background: var(--ertel-success);
}

.ertel-plataforma-badge--aviso {
  background: var(--ertel-warning);
}

.ertel-plataforma-badge--perigo {
  background: var(--ertel-danger);
}

.ertel-plataforma-badge--info {
  background: var(--ertel-info);
}

.ertel-plataforma-form__secao {
  font-size: var(--ertel-text-sm);
  font-weight: 600;
  margin: var(--ertel-space-5) 0 var(--ertel-space-2);
}

.ertel-plataforma-checklist {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap: var(--ertel-space-2);
  max-height: 300px;
  overflow-y: auto;
  padding-right: var(--ertel-space-2);
}

.ertel-plataforma-check {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: var(--ertel-text-sm);
}