/* ============================================================
   PRONTIO – Evolução
   Estilos específicos da página evolucao.html
============================================================ */

/* CARD PRINCIPAL DE EVOLUÇÃO */
.card-evolucao-main {
  background: var(--color-panel);
  border-radius: 14px;
  padding: 1.4rem 1.6rem 1.6rem;
  border: 1px solid var(--color-border);
  box-shadow: var(--shadow-soft);
}

/* LAYOUT INTERNO (duas colunas) */
.evolucao-layout {
  display: grid;
  grid-template-columns: 0.8fr 1.2fr;
  gap: 1.2rem;
}

.evolucao-col {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}

/* Grupo de campo (lado esquerdo e direito) */
.field-group {
  display: flex;
  flex-direction: column;
  gap: 0.2rem;
}

.field-group label {
  font-size: 0.8rem;
  color: var(--color-text-soft);
}

.field-group input,
.field-group textarea {
  border-radius: 8px;
  border: 1px solid #d2d5db;
  padding: 0.55rem 0.6rem;
  font-size: 0.9rem;
}

/* LINHA DE CHIPS (atalhos de texto) */
.chips-row {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
  margin-bottom: 0.5rem;
}

/* AÇÕES DA EVOLUÇÃO (botões) */
.actions-row {
  display: flex;
  justify-content: flex-end;
  gap: 0.5rem;
  margin-top: 0.5rem;
}

/* PAINEL DE HISTÓRICO */
.panel-history {
  margin-top: 1rem;
}

.panel-history h3 {
  margin: 0 0 0.2rem;
  font-size: 0.98rem;
  font-weight: 600;
}

.panel-history .card-subtitle {
  margin: 0 0 0.5rem;
  font-size: 0.82rem;
  color: var(--color-text-soft);
}

/* LISTA DE HISTÓRICO REAPROVEITA .history-list, .history-item
   de components.css – aqui apenas fine tuning */
.history-list-empty {
  font-size: 0.84rem;
  color: var(--color-text-soft);
}

/* CHIP DE RASCUNHO NA TOPBAR */
.chip-status {
  font-size: 0.8rem;
  padding: 0.25rem 0.6rem;
  border-radius: 999px;
  background: #f3f4f6;
  border: 1px solid #e5e7eb;
  color: var(--color-text-soft);
}

/* Responsivo */
@media (max-width: 900px) {
  .evolucao-layout {
    grid-template-columns: 1fr;
  }

  .card-evolucao-main {
    padding: 1rem 1.2rem;
  }
}
