:root {
  --bs-heading-color: var(--content-primary);
}

@include media-breakpoint-up(sm) {
  .modal-dialog {
    @include modal-md();
  }

  .modal-sm {
    @include modal-sm();
  }
}

@include media-breakpoint-up(md) {
  .modal-md {
    @include modal-md();
  }
}

@include media-breakpoint-up(lg) {
  .modal-lg {
    @include modal-lg();
  }
}

.modal-content {
  @include shadow-lg();
  border-radius: var(--border-radius-base);

  .modal-header {
    .modal-title {
      @include heading-sm;

      line-height: 35px;
    }
    .btn-close {
      margin-right: 0;
    }
  }

  .modal-footer {
    padding: var(--spacing-06);
    gap: var(--spacing-04);
    > * {
      margin: 0;
    }
  }
}