// Component: Field

@use '00-config' as *;
@use '01-global/html-elements/13-headings/headings' as *;

.c-field {
  margin-block-end: rem(gesso-spacing(2));
}

.c-field__label {
  @extend %h4;
  display: block;
  margin-block-end: 0;

  &.is-inline {
    @extend %h5;
    display: inline-block;
    margin-block-end: 0;
    margin-inline-end: 0.25rem;

    &::after {
      content: ':';
    }

    + .c-field__content {
      display: inline;
    }
  }
}
