/**
* Theme Name: Reebox Child
* Author: Theme Sky Team
* Template: reebox
* Text Domain: reebox-child
* Description: A Premium and Responsive WordPress theme, designed for E-Commerce websites
*/
.ct-rmv-var .stock{
color: #61b1ca!important;
font-size: 18px!important;
}
/* Slider */
.slick-slide {
margin: 0px 10px;
}
.slick-slide img {
width: 100%;
}
.woocommerce-checkout #gift-card-input .woocommerce-input-wrapper{
width: 100%;
max-width: 100%!important;
}
.woocommerce-checkout .cfw-promo-row .col-8 .cfw-input-wrap span.woocommerce-input-wrapper input.input-text{
line-height: 30px!important;
font-size: 1em!important;
}
.woocommerce-checkout .cfw-promo-row .col-4 .cfw-button-input button.cfw-secondary-btn{
margin: 0px!important;
}
.woocommerce-checkout .cfw-quantity-stepper .cfw-quantity-stepper-btn-minus, .woocommerce-checkout .cfw-quantity-stepper .cfw-quantity-stepper-btn-plus{
margin: 0px;
border-radius: 0px;
}
#shipping_postcode{
height: 52.54px!important;
}
.slick-slider
{
position: relative;
display: block;
box-sizing: border-box;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
-webkit-touch-callout: none;
-khtml-user-select: none;
-ms-touch-action: pan-y;
touch-action: pan-y;
-webkit-tap-highlight-color: transparent;
}
.slick-list
{
position: relative;
display: block;
overflow: hidden;
margin: 0;
padding: 0;
}
.slick-list:focus
{
outline: none;
}
.slick-list.dragging
{
cursor: pointer;
cursor: hand;
}
.slick-slider .slick-track,
.slick-slider .slick-list
{
-webkit-transform: translate3d(0, 0, 0);
-moz-transform: translate3d(0, 0, 0);
-ms-transform: translate3d(0, 0, 0);
-o-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
.slick-track
{
position: relative;
top: 0;
left: 0;
display: block;
}
.slick-track:before,
.slick-track:after
{
display: table;
content: '';
}
.slick-track:after
{
clear: both;
}
.slick-loading .slick-track
{
visibility: hidden;
}
.slick-slide
{
display: none;
float: left;
height: 100%;
min-height: 1px;
}
[dir='rtl'] .slick-slide
{
float: right;
}
.slick-slide img
{
display: block;
}
.slick-slide.slick-loading img
{
display: none;
}
.slick-slide.dragging img
{
pointer-events: none;
}
.slick-initialized .slick-slide
{
display: block;
}
.slick-loading .slick-slide
{
visibility: hidden;
}
.slick-vertical .slick-slide
{
display: block;
height: auto;
border: 1px solid transparent;
}
.slick-arrow.slick-hidden {
display: none;
}
/* Ensure Font Awesome is loaded on the page */
/* Add this to the of your HTML if Font Awesome isn't already loaded:
*/
/* Hide the default text on arrows */
.slick-prev,
.slick-next {
font-size: 0; /* Hide the default text */
background: none; /* Remove default background */
border: none; /* Remove default border */
padding: 0; /* Remove padding */
z-index: 1; /* Ensure arrows are above images */
position: absolute; /* Position the arrows absolutely */
top: 50%; /* Center the arrows vertically */
transform: translateY(-50%); /* Center arrows vertically */
background-color: rgba(0, 0, 0, 0.5); /* Optional: add a semi-transparent background */
border-radius: 50%; /* Optional: make arrows circular */
padding: 10px; /* Add some padding around the arrows */
}
/* Left arrow */
.slick-prev {
left: 10px; /* Position the left arrow closer to the slider */
}
.slick-prev::before {
content: "\f104"; /* Font Awesome left arrow */
font-family: "Font Awesome 5 Free"; /* Use the Font Awesome font */
font-weight: 900; /* Make sure the icon is bold */
font-size: 30px; /* Size of the arrow */
color: #fff; /* Arrow color */
}
/* Right arrow */
.slick-next {
right: 10px; /* Position the right arrow closer to the slider */
}
.slick-next::before {
content: "\f105"; /* Font Awesome right arrow */
font-family: "Font Awesome 5 Free"; /* Use the Font Awesome font */
font-weight: 900; /* Make sure the icon is bold */
font-size: 30px; /* Size of the arrow */
color: #fff; /* Arrow color */
}
/* Adjust the width of the slick-track to make space for the arrows */
.slick-track {
width: calc(100% - 80px); /* Adjust to make space for the arrows */
display: flex; /* Make the track behave like a flex container */
gap: 0; /* Ensure no gap between slides */
justify-content: flex-start; /* Align slides to the left */
}
/* Reduce the size of the images inside the */
.slick-slide img {
width: 100%; /* Make images fill the slide */
height: auto; /* Maintain aspect ratio */
display: block; /* Ensure images are displayed as block elements */
object-fit: cover; /* Ensure images fit well without distortion */
}
/* Optional: adjust padding on the slider container */
.slick-slide {
margin: 0; /* Remove default margin between slides */
}
/* Optional: reduce the size of the */
.slick-slide span {
display: block; /* Ensure the takes up the full width */
width: 100%; /* Make the take up 100% of the space */
text-align: center; /* Center images inside the span */
}
/* Add a plus sign for the Color category */
#bapf_1_288 > label:after {
content: " + ";
font-weight: bold;
margin-right: 5px;
}
/* Change to minus sign when Color category is checked */
#bapf_1_288 input:checked + label:after {
content: " - ";
}
/* Hide child categories (subcategories under Color) by default */
#bapf_1_288 > ul {
display: none;
}
/* Show child categories when Color checkbox is checked */
#bapf_1_288 input:checked + label + ul {
display: block;
}
/* Optional: Adding some styles for better spacing */
li > label {
cursor: pointer;
}
/* OH NO KYLE IS IN THE CSS - SOMEONE MAKE THIS BETTER ASAP */
.wcapf-nav-item-text {
font-size: 1.2em !important;
}
.ts-sidebar {
background-color: #eff7fa;
}
.hierarchy-list:not(.hierarchy-toggle-at-end) .wcapf-hierarchy-accordion-toggle {
position: absolute;
right: 10px;
}