/*
 Theme Name:   Statement
 Theme URI:    https://generatepress.com/statement/
 Description:  Statement is a GeneratePress child theme. Using GeneratePress you can alter the child theme to your taste in minutes. Statement is mobile responsive, W3C Markup Validated, Schema.org integrated, search engine friendly, cross browser compatible, WooCommerce compatible and 100% translatable. See more about GeneratePress here: http://generatepress.com
 Author:       Thomas Usborne
 Author URI:   http://edge22.com
 Template:     generatepress
 Version:      0.5
 Tags: two-columns, three-columns, one-column, right-sidebar, left-sidebar, footer-widgets, blog, e-commerce, flexible-header, full-width-template, buddypress, custom-header, custom-background, custom-menu, custom-colors, sticky-post, threaded-comments, translation-ready, rtl-language-support, featured-images, theme-options

 Statement, Copyright 2016 Thomas Usborne
 Statement is distributed under the terms of the GNU GPL

 Statement is a child theme of GeneratePress
 
 It's not recommended to add CSS to this file, as it will be lost if you ever update this child theme.
 Instead, use a Custom CSS plugin.
 
 */


.quantity {
	float: none;
	margin: auto;
	display: inline;
	width: 110px;
}

.woocommerce .quantity .qty {
width: 3.631em;
text-align: center;
}

button[name='update_cart'] {
display: none !important;
}

.select2-search__field {
display: none !important;
}



/* Remove the default increment/decrement arrows inside the quantity box on the Shop Page */
body.archive .quantity input.qty::-webkit-outer-spin-button,
body.archive .quantity input.qty::-webkit-inner-spin-button {
    -webkit-appearance: none;  /* For WebKit browsers (Chrome, Safari) */
    margin: 0;  /* Remove extra margin around the input field */
}

body.archive .quantity input.qty[type="number"] {
    -moz-appearance: textfield; /* For Firefox */
}


/* Remove the default arrows for the quantity input field in Shop Page only */
body.archive .quantity input.qty {
    -webkit-appearance: none; /* Ensure the appearance is consistent across browsers */
    -moz-appearance: none;
    appearance: none;
}


/* Style the quantity input box to be consistent with the buttons */
body.archive .quantity input.qty {
    padding: 5px !important; /* Reduced padding */
    font-size: 14px !important; /* Adjust font size */
    text-align: center; /* Center the value in the input */
    width: 50px !important; /* Set width for consistency */
    border: 1px solid #ccc !important; /* Add border for consistency */
}


/* Make the quantity buttons smaller on the Shop Page */
body.archive .quantity .qty-plus, body.archive .quantity .qty-minus {
    font-size: 14px !important;  /* Smaller text size */
    padding: 5px 10px !important; /* Reduced padding */
    width: 24px !important;      /* Set width */
    height: 24px !important;     /* Set height */
    line-height: 1 !important;   /* Ensure text is centered */
    border-radius: 50% !important; /* Circular buttons */
    background-color: #9272d8 !important; /* Light background */
    border: 1px solid #bfbfbf !important; /* Light border */
    color: #ffffff !important;  /* Button text color */
    display: inline-block !important;
    text-align: center !important;
    font-weight: bold !important;
    cursor: pointer !important;
}

/* Hover effect for the + and - buttons */
body.archive .quantity .qty-plus:hover, body.archive .quantity .qty-minus:hover {
    background-color: #000000 !important; /* Darker background on hover */
}

/* Remove the default arrows for the quantity input field on Shop and Checkout pages */
body.archive .quantity input.qty,
body.checkout .quantity input.qty {
    -webkit-appearance: none; /* Ensure the appearance is consistent across browsers */
    -moz-appearance: none;
    appearance: none;
}


/* Hide Fields by Defaults */
#billing_city_field,
#billing_address_1_field,
#billing_lugar_field,
#billing_color_field,
#billing_distancia_field,
additional_time_field,
additional_cambio_field,
order_comments_field {
    display: none;
}



/* Only Target Shop Page Small Button (Not Single Product Page */
.woocommerce ul.products li.product .button {
    font-size: 12px !important;
    padding: 6px 12px !important;
}



/* --- For Rounded Corners (Shop Page + Product Page) --- */
/* --- Global Styles (Works on Desktop & Mobile for most elements) --- */

/* Shop Page Images */
.woocommerce ul.products li.product img,
.woocommerce-page ul.products li.product img {
    border-radius: 10px !important;
}

/* Product Page Main Image & Thumbnails */
.woocommerce div.product div.images img,
.woocommerce div.product div.images .flex-control-thumbs img,
.woocommerce-product-gallery__image img,
.woocommerce-product-gallery__wrapper img {
    border-radius: 10px !important;
}

/* --- Mobile Specific Overrides --- */
/* These target the specific classes themes often add ONLY on mobile */

/* Target mobile grid items */
@media screen and (max-width: 768px) {
    /* Force rounding on mobile grid items if global didn't catch them */
    .woocommerce ul.products li.product img,
    .products li.product img,
    .product img {
        border-radius: 10px !important;
    }

    /* Target mobile gallery images specifically */
    .woocommerce div.product div.images img,
    .woocommerce-product-gallery__image img {
        border-radius: 10px !important;
    }
    
    /* Sometimes themes wrap images in a div on mobile */
    .mobile-image-wrapper img,
    .mobile-product-image img {
        border-radius: 10px !important;
    }
}



/* --- All Devices: Checkout Page Secondary Buttons --- */

/* Target secondary buttons on Checkout page (Apply Coupon, Update Cart, etc.) */
.woocommerce-checkout .button,
.woocommerce-checkout input.button,
.woocommerce-checkout .wc-proceed-to-checkout .button,
.cart-collaterals .button,
.coupon .button,
.shipping-calculator-button {
    
    /* --- COLOR SETTINGS --- */
    background-color: #9272d8 !important; /* Change this to your desired color */
    color: #ffffff !important;            /* Text color */
    border: none !important;              /* Remove default border */
    
    /* --- SHAPE SETTINGS --- */
    border-radius: 20px !important;       /* Rounded corners */
    
    /* --- SIZE & SPACING --- */
    padding: 12px 24px !important;        /* Comfortable size */
    font-size: 14px !important;
    font-weight: 600 !important;
    
    /* --- HOVER & ACTIVE EFFECTS --- */
    transition: all 0.3s ease !important;
}

/* Hover State (Desktop) */
.woocommerce-checkout .button:hover,
.woocommerce-checkout input.button:hover,
.cart-collaterals .button:hover,
.coupon .button:hover {
    background-color: #2980b9 !important; /* Darker shade on hover */
    transform: translateY(-2px);
    box-shadow: 0 4px 8px rgba(0,0,0,0.15) !important;
}

/* Active/Pressed State (Mobile Touch) */
.woocommerce-checkout .button:active,
.woocommerce-checkout input.button:active {
    transform: translateY(0);
    box-shadow: none !important;
    opacity: 0.9;
}

/* --- EXCLUSION: Ensure "Place Order" button stays unique --- */
.woocommerce #payment #place_order,
.woocommerce button.button.alt,
.woocommerce #order_review #place_order {
    background-color: #9272d8 !important; /* Keep your green (or change to your brand color) */
    color: #ffffff !important;
    border-radius: 25px !important;
    font-size: 16px !important;
    padding: 15px 30px !important;
}

/*Para redondear rectangulos de las variaciones*/
/* For variation swatches/buttons */
.variations_form .variations select,
.woocommerce div.product form.cart .button,
.variation-swatches,
.swatch-label {
    border-radius: 50px; /* Adjust value for more/less rounding */
}

/* For individual swatch boxes */
.variation-swatches li,
.color-swatch,
.size-swatch {
    border-radius: 50%; /* Makes them perfectly circular/oval */
}



/* NICE CHECKOUT PAGE

/* Section titles (Billing, Your Order, etc.) */
body.woocommerce-checkout h3 {
    font-weight: 700;
    margin-bottom: 15px;
    padding-bottom: 6px;
    border-bottom: 2px solid #000;
}

/* Labels */
body.woocommerce-checkout label {
    font-weight: 600;
}

/* Inputs */
body.woocommerce-checkout input.input-text,
body.woocommerce-checkout textarea,
body.woocommerce-checkout select {
    border: 1px solid #ddd;
    padding: 10px;
    border-radius: 6px;
    background: #fafafa;
    transition: 0.2s ease;
}

/* Input focus */
body.woocommerce-checkout input.input-text:focus,
body.woocommerce-checkout textarea:focus,
body.woocommerce-checkout select:focus {
    border-color: #000;
    background: #fff;
    outline: none;
}

/* Order summary box */
body.woocommerce-checkout .woocommerce-checkout-review-order {
    background: #ffd9b3;
    padding: 5px;
    border-radius: 10px;
    box-shadow: inset 0 0 5px rgba(0,0,0,0.05);
}



/* Row and Button Size
/* Reduce row height */
.woocommerce-checkout .shop_table tr.cart_item td {
    padding: 8px 10px !important;
    vertical-align: middle;
}

/* Fix product column (remove extra height from flex) */
.woocommerce-checkout .product-name {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 0;
}

/* Make quantity container compact */
.qty-wrapper {
    display: flex;
    align-items: center;
    gap: 5px;
}

/* Smaller input */
.qty-wrapper input.qty {
    width: 45px;
    height: 32px;
    font-size: 14px;
    padding: 2px;
}

/* Smaller buttons */
.qty-wrapper button {
    width: 28px;
    height: 28px;
    font-size: 16px;
    border-radius: 4px;
    padding: 0;
}

/* Remove extra spacing some themes add */
.woocommerce-checkout table.shop_table {
    margin: 0 !important;
}

.woocommerce-checkout .cart_item {
    line-height: 1.2;
}



/*  */
/* Product name and quantity */
.woocommerce-checkout-review-order-table .product-name {
    color: #60008c; /* change to your desired color */
    font-weight: 600;
    display: block;
    margin-bottom: 8px; /* adds space below */
}

/* Variation/meta data */
.woocommerce-checkout-review-order-table .variation {
    color: #777; /* different color for variations */
    margin-top: 5px;
    padding-left: 10px; /* optional indentation */
}






/*