:host(us-service-grid) {
  display: block;
  height: 100%;

  .simplebar-track.simplebar-vertical {
    width: var(--size-2xs);
    border-radius: var(--border-radius-l);
    right: calc(0px - var(--space-inner-m));
    transform: translateX(100%);
    pointer-events: all;
    height: calc(100% - 20px);

    .simplebar-scrollbar::before {
      width: 4px;
      top: 0px;
      bottom: 0px;
      left: 0;
      right: 0;
      border-radius: var(--border-radius-l);
      background-color: var(--color-neutral-600);
      opacity: 50%;
    }
  }
  .simplebar-track.simplebar-horizontal {
    display: none;
  }
  
  .service-grid-wrapper {
    position: relative;
    height: 100%;
  
    .simplebar-offset {
      width: 100%;
    }
  
    .simplebar-content-wrapper {
      outline: none;
    }
  }
  
  .service-grid {
    position: relative;
    height: 100%;
  
    &.horizontal-small,
    &.horizontal-medium,
    &.horizontal-large {
      height: 100%;
    }
  
    &__container {
      display: grid;
      grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
      gap: var(--space-inline-xl);
  
      &.horizontal-small {
        grid-template-columns: repeat(auto-fill, minmax(128px, 1fr));
        padding-bottom: 0;
      }
  
      &.horizontal-medium,
      &.horizontal-large {
        grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
        padding-bottom: 0;
      }
    }
  
    .indent {
      width: 100%;
      height: 20px;
    }
  }  
}