dialog.modals--main-modal.order-details-modal {
  width: 39.25rem;
  outline: solid 1px var(--border-subtle);

  @media screen and (max-width: 576px) {
    width: 100dvw;
  }

  .modals--content {
    padding: 1rem 1.25rem 1.25rem;
  }

  .order-details-modal--studies-row {
    gap: var(--rem-8);
  }
}

.order-details-modal--name {
  display: flex;
  align-items: center;
  gap: var(--rem-12);
}

.order-details-modal--name-text {
  max-width: 22.5rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: var(--rem-16);
  line-height: var(--rem-24);
  font-variation-settings: "wght" var(--text-medium);
  color: var(--text-heading);
}

.order-details-modal--rows {
  display: flex;
  flex-direction: column;
  gap: var(--rem-12);
}

.order-details-modal--studies {
  display: flex;
  flex-direction: column;
  gap: var(--rem-12);
}

.order-details-modal--study {
  display: flex;
  flex-direction: column;
  gap: var(--rem-6);
}

.order-details-modal--study + .order-details-modal--study {
  padding-top: var(--rem-12);
  border-top: 1px solid var(--border-subtle);
}

.order-details-modal--study-name {
  color: var(--text-body);
}

.order-details-modal--study-group {
  display: flex;
  flex-direction: column;
  padding-left: var(--rem-16);
  line-height: normal;
}

.order-details-modal--study-label {
  font-size: var(--rem-13);
  line-height: var(--rem-21);
  color: var(--text-label);
}

.order-details-modal--diagnoses {
  display: flex;
  flex-direction: column;
  gap: var(--rem-4);
}

.order-details-modal--referrals {
  display: flex;
  flex-direction: column;
  gap: var(--rem-8);
}
