.product-detail-v2-autoplay-swiper {
    background-color: var(--gray-7, #FFFFFF);
    overflow: hidden;

    .product-detail-v2-autoplay-swiper__container {
        .product-detail-v2-autoplay-swiper__title {
            width: 100%;
            max-width: var(--text-max-width, 720px);
            color: var(--gray-1, #1A1A1A);
            font-size: var(--detail-font-h3, 40px);
            font-weight: var(--font-weight-detail-semibold, 500);
            line-height: var(--line-height-headings, 1.2);
            padding-bottom: var(--grid-l, 48px);
            margin: 0;
        }

        .product-detail-v2-autoplay-swiper__swiper {
            overflow: visible;

            &.no-autoplay-swiper {
                .swiper-pagination-bullet-active {
                    .bar-fill {
                        width: 100% !important;
                    }
                }
            }

            &.autoplay-swiper {
                .swiper-pagination-bullet-active {
                    .bar-fill {
                        transition: width 0.15s linear;
                    }
                }
            }

            .swiper-wrapper {
                .product-detail-v2-autoplay-swiper__card {
                    position: relative;
                    width: 50%;
                    overflow: hidden;

                    .product-detail-v2-autoplay-swiper__card-image,
                    .product-detail-v2-autoplay-swiper__card-video {
                        display: block;
                        width: 100%;
                        height: 100%;
                        border-radius: 8px;
                        overflow: hidden;

                        img,
                        video {
                            width: 100%;
                            height: 100%;
                            object-fit: cover;
                        }
                    }

                    .product-detail-v2-autoplay-swiper__card-text {
                        position: absolute;
                        display: flex;
                        flex-direction: column;
                        gap: var(--grid-xxs, 8px);
                        padding: var(--grid-s, 24px);

                        &.text-top {
                            top: 0;
                        }

                        &.text-bottom {
                            bottom: 0;
                        }

                        .product-detail-v2-autoplay-swiper__card-title {
                            color: var(--gray-1, #1A1A1A);
                            font-size: var(--detail-font-h6, 24px);
                            font-weight: var(--font-weight-detail-semibold, 500);
                            line-height: var(--line-height-content, 1.4);
                            margin: 0;
                        }

                        .product-detail-v2-autoplay-swiper__card-desc {
                            color: var(--gray-3, #aaaaaa);
                            font-size: var(--detail-font-b3, 16px);
                            font-weight: var(--font-weight-detail-medium, 400);
                            line-height: var(--line-height-content, 1.4);
                            margin: 0;
                        }
                    }
                }
            }

            .product-detail-v2-autoplay-swiper__controls {
                display: flex;
                justify-content: space-between;
                align-items: center;
                margin-top: var(--grid-l, 32px);

                .product-detail-v2-autoplay-swiper__controls-left {
                    display: flex;
                    align-items: center;
                    gap: var(--grid-xxs, 8px);

                    @media screen and (max-width: 810px) {
                        width: 100%;
                        justify-content: center;
                    }

                    .swiper-pagination {
                        width: auto;
                        height: 40px;
                        display: flex;
                        align-items: center;
                        gap: 12px;
                        position: relative;
                        top: 0;
                        left: 0;
                        bottom: auto;
                        z-index: 1;
                        padding: 0 32px;
                        background-color: var(--gray-10, rgba(26, 26, 26, 0.10));
                        border-radius: var(--rounded-capsule, 999px);

                        .swiper-pagination-bullet {
                            width: 8px;
                            height: 8px;
                            background: var(--gray-20, rgba(26, 26, 26, 0.20));
                            margin: 0;
                            opacity: 1;
                            position: relative;
                            border-radius: var(--rounded-capsule, 999px);
                            overflow: hidden;

                            &.swiper-pagination-bullet-active {
                                width: 32px;

                                .bar-fill {
                                    background: var(--gray-1, #1A1A1A);
                                }
                            }

                            .bar-fill {
                                width: 0%;
                                height: 100%;
                                position: absolute;
                                left: 0;
                                top: 0;
                            }
                        }
                    }

                    .product-detail-v2-autoplay-swiper__autoplay-btn {
                        width: 40px;
                        height: 40px;
                        background: var(--gray-10, rgba(26, 26, 26, 0.10));
                        backdrop-filter: blur(5.5px);
                        display: flex;
                        justify-content: center;
                        align-items: center;
                        border-radius: var(--rounded-capsule, 999px);
                        cursor: pointer;

                        svg {
                            width: 16px;
                            height: 16px;
                            
                            path {
                                fill: var(--gray-1, #1A1A1A);
                            }
                        }

                        .svg-pause {
                            display: block;
                        }

                        .svg-play {
                            display: none;
                        }
                    }
                }

                .product-detail-v2-autoplay-swiper__nav-buttons {
                    display: flex;
                    gap: var(--grid-xs, 16px);

                    @media screen and (max-width: 810px) {
                        display: none;
                    }

                    .custom-swiper-button-prev,
                    .custom-swiper-button-next {
                        width: 40px;
                        height: 40px;
                        background: var(--gray-10, rgba(26, 26, 26, 0.10));
                        backdrop-filter: blur(5.5px);
                        display: flex;
                        justify-content: center;
                        align-items: center;
                        border-radius: var(--rounded-capsule, 999px);
                        cursor: pointer;

                        &.swiper-button-disabled {
                            opacity: 0.6;
                        }

                        svg {
                            width: 24px;
                            height: 24px;
                            
                            path {
                                fill: var(--gray-1, #1A1A1A);
                            }
                        }
                    }
                }
            }
        }
    }

    &.paused {
        .swiper-pagination-bullet-active {
            .bar-fill {
                width: 100% !important;
            }
        }

        .svg-pause {
            display: none !important;
        }

        .svg-play {
            display: block !important;
        }
    }
}