.application-history-list {
  display: flex;
  flex-direction: column;
  gap: 12px;
  max-height: 68vh;
  overflow-y: auto;
  padding-right: 4px;
}

.application-history-item {
  border: 1px solid var(--border, #e5e7eb);
  border-radius: 12px;
  padding: 14px 16px;
  background: var(--surface, #fff);
}

.application-history-head {
  display: flex;
  align-items: flex-start;
  gap: 10px;
}

.application-history-title {
  flex: 1;
  min-width: 0;
  font-size: 14px;
  font-weight: 700;
  color: var(--text, #111827);
}

.application-history-meta {
  margin-top: 3px;
  font-size: 12px;
  font-weight: 400;
  color: var(--text-muted, #667085);
}

.application-history-badge {
  flex: none;
  border-radius: 999px;
  padding: 3px 9px;
  font-size: 12px;
  font-weight: 600;
}

.application-history-badge.create { background: #ecfdf3; color: #027a48; }
.application-history-badge.update { background: #eff6ff; color: #1d4ed8; }
.application-history-badge.delete { background: #fef2f2; color: #b42318; }
.application-history-badge.snapshot { background: #f2f4f7; color: #475467; }

.application-history-changes {
  margin-top: 11px;
  display: grid;
  gap: 7px;
}

.application-history-change {
  display: grid;
  grid-template-columns: 86px minmax(0, 1fr);
  gap: 10px;
  font-size: 13px;
  line-height: 1.55;
}

.application-history-field { color: var(--text-muted, #667085); }
.application-history-value { color: var(--text, #344054); word-break: break-word; }
.application-history-old { color: #98a2b3; text-decoration: line-through; }
.application-history-arrow { padding: 0 6px; color: #98a2b3; }

.application-history-empty {
  padding: 42px 16px;
  text-align: center;
  color: var(--text-muted, #667085);
}

@media (max-width: 640px) {
  .application-history-item { padding: 12px; }
  .application-history-change { grid-template-columns: 72px minmax(0, 1fr); }
}