/* index.less */

.productImages {
  padding: 16px;

  .mainImage {
    margin-bottom: 16px;
    text-align: center;

    .largeImage {
      border: 1px solid #f0f0f0;
      border-radius: 4px;
    }
  }

  .thumbnailList {
    .thumbnail {
      padding: 2px;
      border: 2px solid transparent;
      border-radius: 4px;
      cursor: pointer;
      transition: all 0.3s;

      &:hover {
        border-color: #d9d9d9;
      }

      &.active {
        border-color: #ff4d4f;
      }
    }
  }
}

.advancedGallery {
  .mainImageContainer {
    margin-bottom: 16px;
    text-align: center;
  }

  .thumbnailContainer {
    display: flex;
    align-items: center;
    gap: 8px;

    .scrollBtn {
      flex-shrink: 0;
    }

    .thumbnailWrapper {
      display: flex;
      gap: 8px;
      overflow-x: auto;
      scroll-behavior: smooth;

      &::-webkit-scrollbar {
        display: none;
      }
    }

    .thumbnailItem {
      flex-shrink: 0;
      padding: 2px;
      border: 2px solid transparent;
      border-radius: 4px;
      cursor: pointer;

      &.active {
        border-color: #1890ff;
      }
    }
  }
}
