/* header cart icon styles in functions.php */
.sp-header-cart-content {
    position: relative;
    width:  30px;
    height:  30px;
    display:  block;
}
.sp-header-cart-icon {
    width: 30px;
    height: 30px;
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 576 512"><!--!Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc.--><path d="M0 24C0 10.7 10.7 0 24 0L69.5 0c22 0 41.5 12.8 50.6 32l411 0c26.3 0 45.5 25 38.6 50.4l-41 152.3c-8.5 31.4-37 53.3-69.5 53.3l-288.5 0 5.4 28.5c2.2 11.3 12.1 19.5 23.6 19.5L488 336c13.3 0 24 10.7 24 24s-10.7 24-24 24l-288.3 0c-34.6 0-64.3-24.6-70.7-58.5L77.4 54.5c-.7-3.8-4-6.5-7.9-6.5L24 48C10.7 48 0 37.3 0 24zM128 464a48 48 0 1 1 96 0 48 48 0 1 1 -96 0zm336-48a48 48 0 1 1 0 96 48 48 0 1 1 0-96z"/></svg>');
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center center;
}
span.bs-cart-contents-count {
    position: absolute;
    top: -15px;
    right: -14px;
    background-color: var(--color-main);
    width: 25px;
    height: 25px;
    border-radius: 50%;
    text-align: center;
    color: white;
    z-index: 1;
}
/* add to cart button in WOO LOOP */
.sp-repeater .add_to_cart_button,
button.single_add_to_cart_button,
.sp-repeater-item .button.product_type_simple,
.cart.sp-variation-table-form button {
    padding: var(--button-padding);
    border-radius: var(--border-radius-button);
    background-color: var(--color-main);
    color: var(--color-text-light);
    font-weight: 600;
    text-transform: uppercase;
    display: block;
    cursor: pointer;
    text-align: center;
}
.sp-repeater .add_to_cart_button,
.sp-repeater-item .button.product_type_simple {
    width: 100%;
    position: absolute;
    bottom: 12px;
}
.sp-repeater-item .sp-price-info {
    position: absolute;
    bottom: 75px;   
}
.sp-border .sp-repeater-item .sp-price-info,
.sp-bgcolor .sp-repeater-item .sp-price-info,
.sp-border .sp-repeater .add_to_cart_button,
.sp-bgcolor .sp-repeater .add_to_cart_button,
.sp-border button.single_add_to_cart_button,
.sp-bgcolor button.single_add_to_cart_button,
.sp-border .sp-repeater-item .button.product_type_simple,
.sp-bgcolor .sp-repeater-item .button.product_type_simple
{
    left: var(--text-photo-text-padding);
    width: calc(100% - 2 * var(--text-photo-text-padding));
}
button.single_add_to_cart_button:hover {
    opacity: 0.9;
}
/* Pagination in woo loop */
ul.page-numbers {
    display:  flex;
    gap: 12px;
    list-style: none;
}

ul.page-numbers li .page-numbers {
    padding: var(--button-padding);
    display: block;
    border: var(--default-border);
    border-radius: var(--border-radius-button);
}
ul.page-numbers li .page-numbers.current {
    background-color: var(--color-main);
    color: white;
}
/* product page styling */
.product-template-default .product {
    display: grid;
    gap: 24px;
    grid-template-columns: 1fr;
}
@media (min-width: 768px) {
    .product-template-default .product {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 48px;
    }
}
.sp-product-gallery-images {
    margin-bottom: 12px;
    gap: 8px;
}
.sp-product-gallery-thumbs {
    gap: 8px;
}
.sp-product-gallery-images, .sp-product-gallery-thumbs  {
    display: flex;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    overflow-y: hidden;
    padding-bottom: 24px;
}
.sp-product-gallery-image-container {
    flex: 0 0 100%;
    scroll-snap-align: start;
    margin-bottom: 12px;
    overflow:  hidden;
}
.sp-product-gallery-thumb-container {
    flex: 0 0 calc((100% - 8px * 4) / 5);
    border: var(--default-border);
    cursor: pointer;
    margin-bottom: 20px;
    overflow: hidden;
}
.sp-product-gallery-thumb-container img {
    opacity: 0.5;
}
.sp-product-gallery-thumb-container.active img {
    opacity: 1;
}
@media (min-width: 768px) {
    .sp-product-gallery-images-outer {
        position: relative;
    }
    .sp-prodgallery-prev, .sp-prodgallery-next {
        width: 50px;
        height: 50px;
        position: absolute;
        background-color: var(--color-stroke);
        border-radius: 50%;
        top: 50%;
        transform: translateY(-50%);
        cursor: pointer;
    }
    .sp-prodgallery-prev {
        left: 12px;
        content: "";
    }
    .sp-prodgallery-next {
        right: 12px;
        content: ""; 
    }
    .sp-prodgallery-prev::before, .sp-prodgallery-next::before {
        content: " ";
        width: 100%;
        height: 100%;
        display: block;
        background-repeat: no-repeat;
        background-position: center center;
        display: flex;
        align-items: center;
        justify-content: center;
    }
    .sp-prodgallery-prev::before {
        background-image: url('data:image/svg+xml;utf8,<svg width="15" height="26" viewBox="0 0 15 26" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M13 24L2 13L13 2" stroke="currentColor" stroke-width="3" stroke-linecap="round" stroke-linejoin="round"/></svg>');
    }
    .sp-prodgallery-next::before {
        background-image: url('data:image/svg+xml;utf8,<svg width="15" height="26" viewBox="0 0 15 26" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M2 2L13 13L2 24" stroke="currentColor" stroke-width="3" stroke-linecap="round" stroke-linejoin="round"/></svg>');
    }
}
h1.product_title.entry-title {
    margin-top: 0;
    font: var(--h2-font);
}
.product-template-default .entry-summary {
    width: 100%;
}
.product-template-default .entry-summary .price {
    font: var(--h5-font);
}
.product-template-default .entry-summary .cart {
    margin-top: 24px;
}
.product-template-default .entry-summary .variations_form.cart {
    grid-template-columns: 1fr;
}
.product-template-default .entry-summary .cart input {
    height: 100%;
    text-align: center;
    border: var(--default-border);
    border-radius: var(--border-radius-button);
    padding: var(--button-padding);
    font-weight: 600;
    width: 150px;
    max-width: 40%;
    float: left;
    margin-right: 24px;
}
/* standard WOO Tabs */
ul.tabs.wc-tabs {
    display:  flex;
    gap:  24px;
    list-style: none;
    padding-left: 0;
    overflow-x: auto;
    padding-bottom: 12px;
}
ul.tabs.wc-tabs li {
    border: var(--default-border);
    padding: var(--button-padding);
    flex-shrink: 0;
}
ul.tabs.wc-tabs li.active {
    background-color: var(--color-main);
    color: white;
}
ul.tabs.wc-tabs li.active a {
    color: white;
}
@media (min-width: 768px) {
.woocommerce-tabs, .related.products {
    grid-column: span 2;
}
}
.related.products .product {
    display: block;
}

/* Variation Table Styling */
.sp-variation-table {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    overflow: hidden;
    border-radius: 8px;
}
.sp-variation-table thead {
    background-color: var(--color-stroke);
}

.sp-variation-table th {
    padding: 12px 16px;
    text-align: left;
    font-weight: 600;
    text-transform: uppercase;
    font-size: 0.875rem;
    color: var(--color-text);
    border-bottom: var(--default-border);
}

.sp-variation-table th.sp-var-select {
    width: 50px;
    text-align: center;
}

.sp-variation-table th.sp-var-price {
    text-align: right;
}

.sp-variation-row {
    background-color: var(--color-background);
    transition: background-color 0.2s ease;
    cursor: pointer;
}

.sp-variation-row:nth-child(even) {
    background-color: rgba(0, 0, 0, 0.02);
}

.sp-variation-row:hover:not(.out-of-stock) {
    background-color: rgba(var(--color-primary-rgb, 0, 0, 0), 0.05);
}

.sp-variation-row td {
    padding: 16px;
    border-bottom: 1px solid rgba(0, 0, 0, 0.05);
}

.sp-variation-row:last-child td {
    border-bottom: none;
}

.sp-var-select {
    text-align: center;
    width: 50px;
}

.sp-var-select input[type="radio"] {
    width: 20px;
    height: 20px;
    cursor: pointer;
    margin: 0;
}

.sp-var-attribute-value,
.sp-var-price-value {
    font-size: 0.9375rem;
}

.sp-var-attribute-value label,
.sp-var-price-value label {
    cursor: pointer;
    display: block;
    margin: 0;
}

.sp-var-price-value {
    text-align: right;
    font-weight: 600;
}

/* Selected row styling */
.sp-variation-row:has(input[type="radio"]:checked) {
    background-color: rgba(var(--color-primary-rgb, 100, 150, 200), 0.15) !important;
    box-shadow: inset 3px 0 0 var(--color-primary, #3366cc);
}

/* Out of stock styling */
.sp-variation-row.out-of-stock {
    opacity: 0.5;
    cursor: not-allowed;
}

.sp-variation-row.out-of-stock td {
    text-decoration: line-through;
}

.sp-out-of-stock-icon {
    color: #dc3545;
    font-weight: bold;
    font-size: 1.2rem;
}

/* Mobile responsive */
@media (max-width: 767px) {
    .sp-variation-table th,
    .sp-variation-table td {
        padding: 10px 8px;
        font-size: 0.875rem;
    }
}