.layout-slider .slick-list {
padding-top: 5px;
padding-bottom: 20px;
padding-right: 0 !important;
}
.layout-slider .slick-track {
height: 100%;
} .layout-slider ul.slick-dots {
padding: 0;
margin: 30px 0 0;
list-style: none;
display: flex;
justify-content: center;
gap: 6px;
position: absolute;
bottom: 0;
left: 50%;
transform: translateX(-50%);
}
.layout-slider ul.slick-dots li {
display: inline-block;
width: 6px;
height: 6px;
border-radius: 50px;
overflow: hidden;
transition: all 300ms ease-in-out;
background-color: #d1d5db;
}
.layout-slider ul.slick-dots li button {
text-indent: -99999px;
width: 100%;
height: 100%;
}
.layout-slider ul.slick-dots li.slick-active {
width: 12px;
background-color: var(--light-text-color);
} .layout-slider .slick-arrow {
position: absolute;
top: 50%;
transform: translateY(-50%);
width: 30px;
height: 30px;
z-index: 1;
display: none !important;
border-radius: 50%;
background-color: var(--background-color);
align-items: center;
justify-content: center;
box-shadow: 0px 2px 15px rgba(64, 77, 103, 0.25);
}
.layout-slider .slick-arrow:hover {
background-color: var(--brand-color);
color: var(--background-color);
}
.layout-slider .slick-prev {
inset-inline-start: 20px;
}
.layout-slider .slick-next {
inset-inline-end: 20px;
}
.layout-slider .slick-prev.slick-disabled,
.layout-slider .slick-next.slick-disabled {
opacity: 0;
visibility: hidden;
}
.layout-slider .slick-arrow svg {
width: 8px;
} @media screen and (min-width: 640px) { .layout-slider {
padding-bottom: 20px;
}
.layout-slider .slick-list {
height: 100%;
} }
@media screen and (min-width: 1024px) { .layout-slider {
padding-bottom: 0;
}
.layout-slider .slick-list {
padding-inline-end: 60px !important;
} .layout-slider ul.slick-dots {
display: none !important;
} .layout-slider .slick-arrow {
display: flex !important;
} }
@media screen and (min-width: 1280px) { .layout-slider .slick-list {
padding-inline-end: 120px !important;
} .layout-slider .slick-arrow {
width: 40px;
height: 40px;
}
.layout-slider .slick-prev {
inset-inline-start: 36px;
}
.layout-slider .slick-next {
inset-inline-end: 40px;
} }
@media screen and (min-width: 1440px) { .layout-slider .slick-list {
padding-inline-start: 20px;
}
.layout-slider .slick-slide {
margin: 0;
margin-inline-end: 32px;
} }   body.rtl .layout-slider .slick-prev {
transform: rotate(180deg);
}
body.rtl .layout-slider .slick-next {
transform: rotate(180deg);
}    .layout-slider-alt {
position: relative;
overflow: hidden;
}
.layout-slider-alt .slick-slide:not(.slick-active.slick-center) {
opacity: 0.3;
}
.layout-slider-alt .slick-slide:not(.slick-active.slick-center) .product-footer {
display: none;
} .layout-slider-alt ul.slick-dots {
padding: 0;
margin: 30px 0 0;
list-style: none;
display: flex;
justify-content: center;
gap: 6px;
}
.layout-slider-alt ul.slick-dots li {
display: inline-block;
width: 6px;
height: 6px;
border-radius: 50px;
overflow: hidden;
transition: all 300ms ease-in-out;
background-color: #d1d5db;
}
.layout-slider-alt ul.slick-dots li button {
text-indent: -99999px;
width: 100%;
height: 100%;
}
.layout-slider-alt ul.slick-dots li.slick-active {
width: 12px;
background-color: var(--light-text-color);
} .layout-slider-alt .slick-next,
.layout-slider-alt .slick-prev {
position: absolute;
top: 0;
width: 24.2%;
height: 100%;
z-index: 1;
display: none !important;
}
.layout-slider-alt .slick-prev {
inset-inline-start: 0px;
}
.layout-slider-alt .slick-next {
inset-inline-end: 0px;
}
.layout-slider-alt .slick-arrow svg {
display: none;
} @media screen and (min-width: 768px) {  .layout-slider-alt ul.slick-dots {
margin: 50px 0 0;
} }
@media screen and (min-width: 1024px) { .layout-slider-alt .slick-list {
margin: 0 -300px !important;
} .layout-slider-alt ul.slick-dots {
display: none !important;
} .layout-slider-alt .slick-next,
.layout-slider-alt .slick-prev {
display: block !important;
} }
@media screen and (min-width: 1280px) {  .layout-slider-alt ul.slick-dots li {
width: 8px;
height: 8px;
}
.layout-slider-alt ul.slick-dots li.slick-active {
width: 16px;
} .layout-slider-alt .slick-next,
.layout-slider-alt .slick-prev {
width: 26.2%;
} }    .layout-tab-grid a.button {
background: var(--brand-color);
padding: 12px 16px;
border-radius: 6px;
position: relative;
overflow: hidden;
}
.layout-tab-grid a.button.product_type_variable,
.layout-tab-grid a.button.product_type_grouped {
padding: 8px 16px;
}
.layout-tab-grid a.button.loading::after {
font-family: WooCommerce;
content: "\e01c";
position: absolute;
inset: 0;
display: flex;
justify-content: center;
align-items: center;
z-index: 20;
animation: spin 2s linear infinite;
}
.layout-tab-grid a.button.loading::before {
content: "";
position: absolute;
inset: 0;
background-color: var(--brand-color);
z-index: 10;
}
.layout-tab-grid a.button.added {
display: flex;
align-items: center;
gap: 8px;
}
.layout-tab-grid a.button.added::after {
font-family: WooCommerce;
content: "\e017";
margin-bottom: -6px;
}
@keyframes spin {
100% {
transform: rotate(360deg);
}
}