@use '../tokens' as t;

.form {
  display: flex;
  flex-direction: column;
  gap: var(--form-gap, #{t.space(5)});
}

.summary:focus {
  outline: t.stroke(thick) solid t.role('danger');
  outline-offset: t.space(1);
}

.actions {
  display: flex;
  flex-wrap: wrap;
  gap: t.space(3);
  align-items: center;
  // Trailing edge in both writing directions.
  justify-content: flex-end;
}
