@layer components {
  .entry-form {
    max-width: 960px;
  }

  .admin-heading + .entry-form {
    margin-top: var(--space-4);
  }

  .entry-form__errors {
    background: var(--color-danger-surface);
    border: 1px solid var(--color-danger);
    margin-bottom: var(--space-5);
    padding: var(--space-4);
  }

  .entry-form__errors p {
    margin-top: 0;
  }

  .entry-form__grid {
    display: grid;
    gap: 20px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .entry-form__field--wide {
    grid-column: 1 / -1;
  }

  .entry-form__actions {
    display: flex;
    gap: var(--space-2);
    margin-top: var(--space-5);
  }

  @media (width <= 40rem) {
    .entry-form__grid {
      grid-template-columns: 1fr;
    }

    .entry-form__field--wide {
      grid-column: auto;
    }
  }
}