.category-carousel-component {
  margin: 1.5rem 0;

  @media (min-width: 768px) {
    margin: 2.5rem 0;
  }
}

.category-carousel {
  display: block;
  padding: var(--custom-space-size-xsm) 0;
  border-bottom: 2px solid var(--custom-color-gray);

  @media (min-width: 768px) {
    border-top: 2px solid var(--custom-color-gray);
  }
}

.categoryItem {
  width: auto;

  .categoryItem__link {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    padding: var(--custom-space-size-xsm) var(--custom-space-size-sm);
    text-align: center;

    .categoryItem__image {
      width: 100%;
      margin: 0;
    }

    .categoryItem__content {
      width: 100%;
      margin-top: 0.3rem;
      font-size: var(--custom-text-size-xm);
    }
  }

  @media (min-width: 768px) {
    .categoryItem__link {
      padding: var(--custom-space-size-xsm) var(--custom-space-size-m);

      .categoryItem__content {
        margin-top: 0.5rem;
        font-size: var(--custom-text-size-sm);
      }
    }
  }

  @media (min-width: 1024px) {
    .categoryItem__link {
      padding: var(--custom-space-size-xsm) var(--custom-space-size-lg);
    }
  }
}

.category-carousel__arrow {
  background: none;
  color: black;

  &::after {
    font-size: 1rem;
    opacity: 1;
  }

  &.swiper-button-disabled {
    display: none;
  }

  &.arrow--prev {
    left: 0;
  }

  &.arrow--next {
    right: 0;
  }
}