﻿.js-playlist-slider-wrapper .video-search-slider {
	--playlist-slider-gap: 16px;
    margin: 0 calc(var(--playlist-slider-gap) * -1);
}

@media (max-width: 767px) {
	.js-playlist-slider-wrapper .video-search-slider {
		--playlist-slider-gap: 8px;
	}
}

.js-playlist-slider-wrapper .video-search-slider .slick-slide {
    padding: 0 var(--playlist-slider-gap);
}

@media (max-width: 1024px) {
    .js-playlist-slider-wrapper .video-search-slider .slick-slide {
        width: 340px;
    }
}

@media (max-width: 768px) {
    .js-playlist-slider-wrapper .video-search-slider .slick-slide {
        width: 260px;
    }
}

.js-playlist-slider-wrapper .slick-list {
	overflow: visible;
}

.js-playlist-slider-wrapper .slider-arrows-container:has(.slick-disabled) {
	gap: 0;
}

.js-playlist-slider-wrapper .slick-arrow {
    display: flex !important;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    padding: 0;
    background: transparent;
    border: none;
    cursor: pointer;
    overflow: hidden;
    transition: 0.2s ease-in-out;
	transition-property: width, opacity, color;
}

.js-playlist-slider-wrapper .slick-arrow:hover {
    color: var(--dds2-bay-600);
}

.js-playlist-slider-wrapper .slick-arrow:focus-visible {
    outline: 2px solid var(--dds2-bay-600);
    outline-offset: 2px;
}

.js-playlist-slider-wrapper .slick-arrow.slick-disabled {
    width: 0;
    opacity: 0;
    pointer-events: none;
}

.js-playlist-slider-wrapper .slick-arrow .slick-arrow-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 75%;
    height: 75%;
}

.js-playlist-slider-wrapper .slick-arrow .slick-arrow-icon svg {
    width: 100%;
    height: 100%;
}

.js-playlist-slider-wrapper .slick-prev .slick-arrow-icon {
    transform: rotate(180deg);
}
