.elementor-9 .elementor-element.elementor-element-8e87bdd:not(.elementor-motion-effects-element-type-background), .elementor-9 .elementor-element.elementor-element-8e87bdd > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#CFBAA6;}.elementor-9 .elementor-element.elementor-element-8e87bdd > .elementor-container{min-height:200px;}.elementor-9 .elementor-element.elementor-element-8e87bdd{transition:background 0.3s, border 0.3s, border-radius 0.3s, box-shadow 0.3s;}.elementor-9 .elementor-element.elementor-element-8e87bdd > .elementor-background-overlay{transition:background 0.3s, border-radius 0.3s, opacity 0.3s;}.elementor-9 .elementor-element.elementor-element-2472f01{text-align:center;}.elementor-9 .elementor-element.elementor-element-ab3e188{padding:20px 50px 50px 20px;}.elementor-9 .elementor-element.elementor-element-4cc688e .cart button, .elementor-9 .elementor-element.elementor-element-4cc688e .cart .button{transition:all 0.2s;}.elementor-9 .elementor-element.elementor-element-4cc688e .quantity .qty{transition:all 0.2s;}:root{--page-title-display:none;}@media(max-width:767px){.elementor-9 .elementor-element.elementor-element-ab3e188{padding:0px 0px 0px 0px;}}/* Start custom CSS for shortcode, class: .elementor-element-e2ec94c *//* -------------------------- */
/* 1. Keep default number input arrows visible */
/* Remove any appearance overrides for arrows */
.woocommerce .quantity input.qty {
    -moz-appearance: textfield; /* keep Firefox arrows */
    appearance: auto;           /* show arrows in modern browsers */
}

/* -------------------------- */
/* 2. Style the quantity input box */
.woocommerce .quantity input.qty {
    width: 100%;             
    height: 20px;            
    text-align: center;      
    font-size: 18px;         
    border: 1px solid #ccc;
    border-radius: 5px;
    margin: 0 5px;           
}

/* -------------------------- */
/* 3. Style the + and - buttons (optional, will not conflict with arrows) */
.woocommerce .quantity .plus,
.woocommerce .quantity .minus {
    width: 40px;
    height: 40px;
    background-color: #000;  
    color: #fff;             
    font-size: 18px;
    font-weight: bold;
    border: none;
    border-radius: 5px;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    pointer-events: auto;
    opacity: 1;
    visibility: visible;
}

/* -------------------------- */
/* 4. Hover effect for buttons */
.woocommerce .quantity .plus:hover,
.woocommerce .quantity .minus:hover {
    background-color: #555;  
}

/* -------------------------- */
/* 5. Align quantity field and buttons nicely */
.woocommerce .quantity {
    display: flex;
    align-items: center;
    justify-content: flex-start; 
}/* End custom CSS */