.custom-slider .slide.slick-slide{ /*max-height: 400px;*/ overflow: hidden; position: relative;}
.custom-slider .slide.slick-slide img{ object-fit: cover; width: 100%; /* height: 450px;*/}

.custom-slider ul.slick-dots{ display: flex; justify-content: flex-start; margin: 0; padding: 0; list-style: none; /*position: absolute;*/ margin-left: 5px;}
.custom-slider ul.slick-dots li{ /*width: 20px;*/ float: left;}
.custom-slider ul.slick-dots li .custom-dot i{ font-size: 13px; }
/*.custom-slider ul.slick-dots li button{ font-size: 0!important; }*/
/*.slick-dots li button:before{ content: ''; }*/

.slide-overlay-text{ position: absolute; bottom: 0; padding: 10px; display: block; width: 100%; background: rgba(0, 0, 0, 0.3);}

.custom-slider-container{ position: relative;}
.custom-slider-arrows{ position: absolute; bottom: 20px; left: 20px;}

.slick-arrow{ /*/position: absolute;*/ z-index: 1; top: 50%; box-shadow: none;}
/* .slick-arrow img{ display: none;} */
.slick-prev, .slick-next { background-color: transparent; border: none; font-size: 0px; color: #333; width: 50px; height: 50px;}
.slick-next{ right: 0;}
.slick-prev{ left: 0;}
.slick-prev:hover, .slick-next:hover { color: #555;}
.slick-prev:before, .slick-next:before { font-size: 40px; }

button.slick-arrow { /*text-indent: -100px; overflow: hidden;*/ padding: 12px 24px; /*position: relative;*/}
.external-prev{ border-radius: 50px 0 0 50px!important;}
.external-next{ border-radius: 0 50px 50px 0!important;}

/* button.external-prev:after, button.external-next:after{ content:''; display: block; width: 20px; height: 20px; border-top: 2px solid; position: absolute; top: 12px; }
.external-prev:after{ border-left:2px solid; transform: rotate(-45deg); left: 20px;}
.external-next:after{ border-right:2px solid; transform: rotate(45deg); right: 20px;} */

/* button.slick-prev.slick-arrow:before { content: ''; border-top: 4px solid; border-left: 4px solid; width: 30px; height: 30px; display: block; transform: rotate(-45deg);}
button.slick-next.slick-arrow:after { content: ''; border-top: 4px solid; border-right: 4px solid; width: 30px; height: 30px; display: block; transform: rotate(45deg);} */

.slick-dots {
    display: flex !important;
    justify-content: center;
    align-items: center;
    gap: 10px; /* Space between dots and play/pause icon */
}

.slick-control {
    font-size: 20px;
    color: var(--dot-color, #aaaaaa); /* Match dot color */
    cursor: pointer;
    background: none;
    padding: 5px;
    border-radius: 50%;
    transition: color 0.3s ease;
}

.slick-control:hover {
    /*color: var(--active-dot-color, #787d33);*/ /* Match active dot color */
}

ul.slick-dots i#slick-play-pause{ margin-top: 13px; font-size: 15px; color: var(--active-dot-color, #e30689); }

/*-------------------*/


#slick-play-pause { transform: translateX(0); border: none; margin-top: 2px; cursor: pointer; font-size: 16px; padding: 0; width: 20px; text-align: center; /*color: var(--slick-active-dot-color, #000) !important;*/ }
.slick-controls-wrapper{ display:flex; align-items:center; }