@use '../layout' as layout;

.pgh-mat {
  .mat-vertical-content,
  .mat-horizontal-content-container {
    padding: 1.5rem;
  }

  // Responsiveness: better view for vertical stepper in tablet and mobile
  @include layout.media-breakpoint-down(md) {
    [dir='rtl'] .mat-vertical-content-container {
      margin-inline-start: 0;
    }

    [dir='rtl'] .mat-stepper-vertical-line::before {
      right: 2.75rem;
      bottom: initial;
      height: 1.875rem;
    }
  }
}