/*
Theme Name: Queeny Child Theme
Theme URI: http://queeny.like-themes.com/
Author: Like Themes
Author URI: http://like-themes.com/
Description: Blank Child Theme for Queeny
Template: queeny
Version: 1.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Tags: four-columns, right-sidebar, full-width-template
Text Domain: queeny

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned with others.
*/

[name="attribute_pa_color"][value="black"] + .name {padding: 5px 10px;background-color: black; color: white; }
[name="attribute_pa_color"][value="blue"] + .name {padding: 5px 10px; background-color: blue; color: white; }
[name="attribute_pa_color"][value="red"] + .name { padding: 5px 10px; background-color: red; color: white; }
[name="attribute_pa_color"][value="yellow"] + .name { padding: 5px 10px; background-color: yellow; color: black; }
[name="attribute_pa_color"][value="musterd yellow"] + .name { padding: 5px 10px; background-color: yellow; color: black; }


.two-combo-grid {
    display: grid;
    grid-template-columns: repeat(4,1fr);
    gap:25px;
    margin-top:20px;
}
.two-combo-item {
    background:#fff; border:1px solid #eee; padding:15px; text-align:center; border-radius:8px; transition:all 0.3s;
}
.two-combo-item:hover {
    transform:translateY(-5px);
    box-shadow:0 10px 25px rgba(0,0,0,0.1);
}
.two-combo-item img {width:100%; height:250px; object-fit:cover; border-radius:5px;}
.product-title {font-size:16px;font-weight:600;margin:10px 0 5px;color:#333;}
.product-price {color:#F31979;font-weight:700;font-size:15px;}


@media (max-width: 768px) {
    .woocommerce table.shop_table th, .woocommerce table.shop_table td {
        display: block !important;
    }
}

.woocommerce ul.products li.product-category {
    border: none !important;
    box-shadow: none !important;
    background: transparent !important;
    padding: 0 !important;
}
.woocommerce ul.products li.product-category a {
    display: block;
    text-align: center;
    background: none !important;
}

.woocommerce ul.products li.product img {
    width: 200px;
    height: 200;
    object-fit: cover;
	background-color: #ffffff;
}


.includes_tax .woocommerce-Price-amount {
    display: none !important;
}

.woocommerce table.shop_table_responsive tbody th, .woocommerce-page table.shop_table_responsive tbody th {
        display: block !important;
    }
}



.woocommerce form.cart .variations .swatch label.checked {
    background-color: #111 !important;
    color: white;
}

.lte-content-wrapper {overflow: hidden;}

.div-sidebar{
	max-height: 100vh;
    overflow-y: auto;
    position: sticky;
    top: 0;
    padding-right: 10px;}

.woocommerce form.cart .variations .swatch label.checked .name {
    background-color: transparent;
    color: white;}

.woocommerce form.cart .variations .swatch label.pa_color {
    border: none !important;
}

.lte-btn .lte-btn-inner { background-color: #000;
    color: #fff;
    padding: 10px 5px;}

.elementor-9728 .elementor-element.elementor-element-e87aa8b img {
    height: 51px;
    width: 100%;
}

.woocommerce ul.products li.product .add_to_cart_button span, .woocommerce-page ul.products li.product .add_to_cart_button span, .woocommerce ul.products li.product .product_type_variable span, .woocommerce-page ul.products li.product .product_type_variable span {
    background-color: #000 !important;
    color: #fff;
    padding: 10px;
}
.woocommerce ul.products li.product .lte-image .lte-btn:hover, .woocommerce-page ul.products li.product .lte-image .lte-btn:hover {
    background-color: transparent !important;
}

.woocommerce ul.products li.product .lte-image a, .woocommerce-page ul.products li.product .lte-image a {
    display: inline !important;
}
.woocommerce ul.products li.product .lte-image img, .woocommerce-page ul.products li.product .lte-image img { width: 100% !important;
    height: 250px !important; object-fit: contain;}
.woocommerce ul.products li.product .lte-image, .woocommerce-page ul.products li.product .lte-image {
    background-color: #dedede;
}

.woocommerce ul.products li.product .add_to_cart_button, .woocommerce-page ul.products li.product .add_to_cart_button, .woocommerce ul.products li.product .product_type_variable, .woocommerce-page ul.products li.product .product_type_variable {
    background-color: transparent !important;
}

.lte-navbar-icons li {
    margin-left: 20px !important;
}

.lte-topbar-block .lte-navbar-icons .lte-header {
    display: none !important;
}

/* ---------------------------------------------------- */
/* Targetting Section 94ad04b for Mobile Horizontal Scroll */
/* ---------------------------------------------------- */
@media (max-width: 768px) {
    
    /* 1. Target the inner container and force horizontal arrangement */
    .elementor-element-94ad04b > .elementor-container {
        display: flex;
        flex-direction: row;
        /* Enables horizontal scrolling when content exceeds viewport width */
        overflow-x: auto;
        overflow-y: hidden; 
        flex-wrap: nowrap; /* CRUCIAL: Prevents columns from wrapping/stacking */
        width: 100%;
        padding-left: 0; /* Ensures content starts flush to the left edge */
    }

    /* 2. Target the columns and give them a required width */
    .elementor-element-94ad04b .elementor-column {
        /* Sets the column width to roughly 45% of the viewport width. 
           This shows one full column and part of the next one, indicating scrollability. 
           Adjust this percentage to show more or less of the next item. */
        min-width: 45vw; /* 45% of the Viewport Width */
        width: 45vw; 
        flex-shrink: 0; /* CRUCIAL: Prevents columns from shrinking smaller than min-width */
        margin-left: 10px; /* Add slight spacing between columns */
    }

    /* 3. Optional: Clean up the margins/padding on the very first column */
    .elementor-element-94ad04b .elementor-column:first-child {
        margin-left: 20px; /* Space the first video nicely from the screen edge */
    }

    /* Optional: Hide the scrollbar (for aesthetics) */
    .elementor-element-94ad04b > .elementor-container::-webkit-scrollbar {
        display: none;
    }
}


