/* Silvera Cart Widget UI Fixes
   Targets common WooCommerce, Elementor and Silvera cart widget quantity/remove selectors. */

/* Quantity wrapper */
.silvera-cart-widget .quantity,
.silvera-elementor-cart .quantity,
.elementor-widget-silvera_cart .quantity,
.elementor-widget-silvera_woocommerce_cart .quantity,
.elementor-widget-silvera_cart_widget .quantity,
.sil-woo-cart .quantity,
.woocommerce-cart-form .quantity,
.woocommerce-mini-cart .quantity,
.woocommerce .quantity {
    display: inline-flex;
    align-items: stretch;
    justify-content: center;
    line-height: 1;
    gap: 0;
}

/* Minus / Plus controls */
.silvera-cart-widget .quantity button,
.silvera-elementor-cart .quantity button,
.elementor-widget-silvera_cart .quantity button,
.elementor-widget-silvera_woocommerce_cart .quantity button,
.elementor-widget-silvera_cart_widget .quantity button,
.sil-woo-cart .quantity button,
.woocommerce .quantity .minus,
.woocommerce .quantity .plus,
button.silvera-cart-qty-minus,
button.silvera-cart-qty-plus,
.silvera-qty-minus,
.silvera-qty-plus {
    width: var(--silvera-cart-qty-height, 31px) !important;
    min-width: var(--silvera-cart-qty-height, 31px) !important;
    height: var(--silvera-cart-qty-height, 31px) !important;
    min-height: var(--silvera-cart-qty-height, 31px) !important;
    padding: 0 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    box-sizing: border-box !important;
    line-height: 1 !important;
}

/* Quantity input: removes heavy horizontal padding so value is visible */
.silvera-cart-widget input.qty,
.silvera-elementor-cart input.qty,
.elementor-widget-silvera_cart input.qty,
.elementor-widget-silvera_woocommerce_cart input.qty,
.elementor-widget-silvera_cart_widget input.qty,
.sil-woo-cart input.qty,
.woocommerce .quantity input.qty,
.woocommerce-cart-form .quantity input.qty,
.woocommerce-mini-cart .quantity input.qty,
input.silvera-cart-qty-input,
input[type="number"].qty {
    width: var(--silvera-cart-qty-width, 42px) !important;
    min-width: var(--silvera-cart-qty-width, 42px) !important;
    max-width: var(--silvera-cart-qty-width, 42px) !important;
    height: var(--silvera-cart-qty-height, 31px) !important;
    min-height: var(--silvera-cart-qty-height, 31px) !important;
    padding-left: var(--silvera-cart-qty-padding-x, 2px) !important;
    padding-right: var(--silvera-cart-qty-padding-x, 2px) !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    margin: 0 !important;
    text-align: center !important;
    line-height: var(--silvera-cart-qty-height, 31px) !important;
    font-size: var(--silvera-cart-qty-font-size, 14px) !important;
    box-sizing: border-box !important;
    overflow: visible !important;
    appearance: textfield !important;
    -moz-appearance: textfield !important;
}

.silvera-cart-widget input.qty::-webkit-outer-spin-button,
.silvera-cart-widget input.qty::-webkit-inner-spin-button,
.silvera-elementor-cart input.qty::-webkit-outer-spin-button,
.silvera-elementor-cart input.qty::-webkit-inner-spin-button,
.woocommerce .quantity input.qty::-webkit-outer-spin-button,
.woocommerce .quantity input.qty::-webkit-inner-spin-button,
input[type="number"].qty::-webkit-outer-spin-button,
input[type="number"].qty::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

/* Remove/bin icon: replaces hard-coded basket/trash text/image with a customizable SVG mask */
.silvera-cart-widget .remove,
.silvera-elementor-cart .remove,
.elementor-widget-silvera_cart .remove,
.elementor-widget-silvera_woocommerce_cart .remove,
.elementor-widget-silvera_cart_widget .remove,
.sil-woo-cart .remove,
.silvera-cart-remove,
.silvera-remove-item,
.silvera-cart-widget .cart-remove,
.woocommerce a.remove,
.woocommerce-cart-form a.remove,
.woocommerce-mini-cart a.remove,
.product-remove a.remove,
a.remove_from_cart_button {
    width: var(--silvera-cart-remove-button-size, 32px) !important;
    height: var(--silvera-cart-remove-button-size, 32px) !important;
    min-width: var(--silvera-cart-remove-button-size, 32px) !important;
    min-height: var(--silvera-cart-remove-button-size, 32px) !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 0 !important;
    margin: 0 !important;
    border-radius: var(--silvera-cart-remove-radius, 0) !important;
    background: var(--silvera-cart-remove-bg, transparent) !important;
    color: var(--silvera-cart-remove-color, #6f8792) !important;
    font-size: 0 !important;
    line-height: 1 !important;
    text-indent: -9999px !important;
    overflow: hidden !important;
    border: 0 !important;
    text-decoration: none !important;
    transition: color .2s ease, background-color .2s ease, transform .2s ease !important;
}

.silvera-cart-widget .remove::before,
.silvera-elementor-cart .remove::before,
.elementor-widget-silvera_cart .remove::before,
.elementor-widget-silvera_woocommerce_cart .remove::before,
.elementor-widget-silvera_cart_widget .remove::before,
.sil-woo-cart .remove::before,
.silvera-cart-remove::before,
.silvera-remove-item::before,
.silvera-cart-widget .cart-remove::before,
.woocommerce a.remove::before,
.woocommerce-cart-form a.remove::before,
.woocommerce-mini-cart a.remove::before,
.product-remove a.remove::before,
a.remove_from_cart_button::before {
    content: "" !important;
    width: var(--silvera-cart-remove-icon-size, 18px) !important;
    height: var(--silvera-cart-remove-icon-size, 18px) !important;
    display: block !important;
    flex: 0 0 auto !important;
    background-color: currentColor !important;
    -webkit-mask: var(--silvera-cart-remove-icon) center / contain no-repeat !important;
    mask: var(--silvera-cart-remove-icon) center / contain no-repeat !important;
    text-indent: 0 !important;
}

.silvera-cart-widget .remove:hover,
.silvera-elementor-cart .remove:hover,
.elementor-widget-silvera_cart .remove:hover,
.elementor-widget-silvera_woocommerce_cart .remove:hover,
.elementor-widget-silvera_cart_widget .remove:hover,
.sil-woo-cart .remove:hover,
.silvera-cart-remove:hover,
.silvera-remove-item:hover,
.silvera-cart-widget .cart-remove:hover,
.woocommerce a.remove:hover,
.woocommerce-cart-form a.remove:hover,
.woocommerce-mini-cart a.remove:hover,
.product-remove a.remove:hover,
a.remove_from_cart_button:hover {
    color: var(--silvera-cart-remove-hover-color, #111111) !important;
    background: var(--silvera-cart-remove-hover-bg, transparent) !important;
    transform: translateY(-1px);
}

/* In case the old icon was an img/svg inside the remove link */
.silvera-cart-widget .remove > img,
.silvera-cart-widget .remove > svg,
.silvera-elementor-cart .remove > img,
.silvera-elementor-cart .remove > svg,
.woocommerce a.remove > img,
.woocommerce a.remove > svg,
.product-remove a.remove > img,
.product-remove a.remove > svg,
a.remove_from_cart_button > img,
a.remove_from_cart_button > svg {
    display: none !important;
}

@media (max-width: 480px) {
    .silvera-cart-widget input.qty,
    .silvera-elementor-cart input.qty,
    .woocommerce .quantity input.qty,
    input[type="number"].qty {
        width: var(--silvera-cart-qty-width, 42px) !important;
        min-width: var(--silvera-cart-qty-width, 42px) !important;
    }
}
