@import "../../plugins/slick/slick.css";
@import "../../plugins/slick/slick-theme.css";

.slick-dotted.slick-slider {
    margin: 0;
}
.slick-dots {
    bottom: 0;
}
.slick-dots li {
    margin: 0 0.5rem;
}
.slick-dots li::before {
    display: none;
}
.slick-dots li button {
    padding: 0;
    width: 1rem;
    height: 1rem;
}
.slick-dots li button:before {
    opacity: 1;
    background: transparent;
    content: '';
    border: 2px solid var(--color-primary);
}
.slick-dots li.slick-active button:before {
    opacity: 1;
    background: var(--text-primary);
}
.slick-dots li, .slick-dots li button:before {
    width: 1rem;
    height: 1rem;
    border-radius: 50%;
    transition: all 300ms;
}
/* .slick-dots li.slick-active,
.slick-dots li.slick-active button,
.slick-dots li.slick-active button:before {
    width: 19.33px;
} */


.slick-prev, .slick-next {
    vertical-align: middle;
    width: 2.25rem;
    height: 2.25rem;
    z-index: 1;
    transition: all 300ms ease-out;
}
.slick-prev {
    left: calc(-2.25rem - 0.625rem);
}
.slick-next {
    right: calc(-2.25rem - 0.625rem);
}

.slick-prev:before {
    transform: rotate(180deg);
}
.slick-prev:hover, .slick-prev:focus, .slick-next:hover, .slick-next:focus {
    /* background: var(--color-secondary); */
}
.slick-prev:focus-visible, .slick-next:focus-visible {
    outline: 2px solid var(--color-primary) !important;
}

.slick-disabled {
    opacity: 0.2;
}
.slick-prev.slick-disabled:before, .slick-next.slick-disabled:before {
    opacity: 1;
}

/* Responsive */
@media only screen and (max-width: 1399px) {
    .slick-prev {
        left: -2.25rem;
    }
    .slick-next {
        right: -2.25rem;
    }
}

@media only screen and (max-width: 1199px) {
    .slick-prev {
        left: calc(-2.25rem / 2);
    }
    .slick-next {
        right: calc(-2.25rem / 2);
    }
}

@media only screen and (max-width: 991px) {
  
}