/**
 * @file
 * Visual styles for fields.
 * @see css/components/field.css
 */

.field__label {
  font-weight: bold;
}
.field--label-inline .field__label,
.field--label-inline .field__items {
  float: left; /* LTR */
}
.field--label-inline .field__label,
.field--label-inline > .field__item,
.field--label-inline .field__items {
  padding-right: 0.5em;
}
[dir="rtl"]  .field--label-inline .field__label,
[dir="rtl"]  .field--label-inline .field__items {
  padding-right: 0;
  padding-left: 0.5em;
}
.field--label-inline .field__label::after {
  content: ":";
}


/**
 * These apply to fields on display pages and in forms.
 */
.field {
  margin-top: 0.5em;
  margin-bottom: 0.5em;

  * + & {
    margin-top: 1em;
  }
  &[class*="-url"],
  &.field--type-link {
    word-break: break-all;
  }

  & > label,
  & > .label {
    font-weight: bold;
  }
}
.field.label-inline,
.actions.label-inline {
  display: grid;
  grid-template-columns: calc(2em + 20%) 1fr;
  gap: 5%;
}
.field.label-above,
.actions.label-above {
  & > :is(label, .label) {
    display: block;
  }
}


.field--name-body {
  margin-top: 0;
  margin-bottom: 0;
}