/*
 * Fabcrush Cart Remove Button Styles
 * Improved mobile-friendly styling for cart item remove buttons (X button)
 * Similar to popup close button styling but adapted for cart context
 */

/* Cart page remove button - larger and more touch-friendly */
#qodef-woo-page.qodef--cart .shop_table td.product-remove a.remove,
.woocommerce-cart .shop_table td.product-remove a.remove {
    font-size: 0 !important;
    position: relative !important;
    width: 44px !important; /* Increased from 10px for better touch target */
    height: 44px !important; /* Increased from 10px for better touch target */
    min-width: 44px !important;
    min-height: 44px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    background: transparent !important;
    border: none !important;
    border-radius: 50% !important;
    cursor: pointer !important;
    transition: all 0.3s ease !important;
    padding: 0 !important;
    margin: 0 auto !important;
    text-decoration: none !important;
}

/* Remove button X icon (using :after pseudo-element) */
#qodef-woo-page.qodef--cart .shop_table td.product-remove a.remove:after,
.woocommerce-cart .shop_table td.product-remove a.remove:after {
    content: "×" !important; /* Use × symbol instead of background image */
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    height: 100% !important;
    font-size: 32px !important; /* Larger font size */
    line-height: 1 !important;
    color: #999 !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    background-image: none !important; /* Remove background image */
    transition: all 0.3s ease !important;
}

/* Hover state - similar to popup close button */
#qodef-woo-page.qodef--cart .shop_table td.product-remove a.remove:hover,
.woocommerce-cart .shop_table td.product-remove a.remove:hover {
    background: rgba(0, 0, 0, 0.05) !important;
}

#qodef-woo-page.qodef--cart .shop_table td.product-remove a.remove:hover:after,
.woocommerce-cart .shop_table td.product-remove a.remove:hover:after {
    color: #333 !important;
    transform: rotate(90deg) !important;
}

/* Active state */
#qodef-woo-page.qodef--cart .shop_table td.product-remove a.remove:active,
.woocommerce-cart .shop_table td.product-remove a.remove:active {
    transform: scale(0.95) !important;
}

#qodef-woo-page.qodef--cart .shop_table td.product-remove a.remove:active:after,
.woocommerce-cart .shop_table td.product-remove a.remove:active:after {
    transform: rotate(90deg) scale(0.9) !important;
}

/* Focus state for accessibility */
#qodef-woo-page.qodef--cart .shop_table td.product-remove a.remove:focus,
.woocommerce-cart .shop_table td.product-remove a.remove:focus {
    outline: 2px solid rgba(102, 126, 234, 0.5) !important;
    outline-offset: 2px !important;
}

/* Adjust the product-remove cell width to accommodate larger button */
#qodef-woo-page.qodef--cart .shop_table td.product-remove,
.woocommerce-cart .shop_table td.product-remove {
    width: 60px !important; /* Keep same width as theme default */
    padding: 10px !important;
    text-align: center !important;
}

/* Mobile-specific improvements */
@media (max-width: 768px) {
    /* Even larger on mobile for easier tapping */
    #qodef-woo-page.qodef--cart .shop_table td.product-remove a.remove,
    .woocommerce-cart .shop_table td.product-remove a.remove {
        width: 48px !important;
        height: 48px !important;
        min-width: 48px !important;
        min-height: 48px !important;
    }
    
    #qodef-woo-page.qodef--cart .shop_table td.product-remove a.remove:after,
    .woocommerce-cart .shop_table td.product-remove a.remove:after {
        font-size: 36px !important;
    }
    
    /* Ensure adequate spacing and centering on mobile */
    #qodef-woo-page.qodef--cart .shop_table td.product-remove,
    .woocommerce-cart .shop_table td.product-remove {
        padding: 15px !important;
        text-align: center !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
    }
    
    #qodef-woo-page.qodef--cart .shop_table td.product-remove a.remove,
    .woocommerce-cart .shop_table td.product-remove a.remove {
        margin: 0 auto !important;
    }
}

/* Very small screens - extra large for easy tapping */
@media (max-width: 480px) {
    #qodef-woo-page.qodef--cart .shop_table td.product-remove a.remove,
    .woocommerce-cart .shop_table td.product-remove a.remove {
        width: 52px !important;
        height: 52px !important;
        min-width: 52px !important;
        min-height: 52px !important;
    }
    
    #qodef-woo-page.qodef--cart .shop_table td.product-remove a.remove:after,
    .woocommerce-cart .shop_table td.product-remove a.remove:after {
        font-size: 40px !important;
    }
    
    /* Extra padding on very small screens for better spacing */
    #qodef-woo-page.qodef--cart .shop_table td.product-remove,
    .woocommerce-cart .shop_table td.product-remove {
        padding: 18px 15px !important;
        text-align: center !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
    }
    
    #qodef-woo-page.qodef--cart .shop_table td.product-remove a.remove,
    .woocommerce-cart .shop_table td.product-remove a.remove {
        margin: 0 auto !important;
    }
}

/* Wishlist tables - apply same styling */
.yith-wcwl-form .shop_table td.product-remove a.remove,
.qwfw-wishlist-table .shop_table td.product-remove a.remove {
    font-size: 0 !important;
    position: relative !important;
    width: 44px !important;
    height: 44px !important;
    min-width: 44px !important;
    min-height: 44px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    background: transparent !important;
    border: none !important;
    border-radius: 50% !important;
    cursor: pointer !important;
    transition: all 0.3s ease !important;
    padding: 0 !important;
    margin: 0 auto !important;
    text-decoration: none !important;
}

.yith-wcwl-form .shop_table td.product-remove a.remove:after,
.qwfw-wishlist-table .shop_table td.product-remove a.remove:after {
    content: "×" !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    height: 100% !important;
    font-size: 32px !important;
    line-height: 1 !important;
    color: #999 !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    background-image: none !important;
    transition: all 0.3s ease !important;
}

.yith-wcwl-form .shop_table td.product-remove a.remove:hover,
.qwfw-wishlist-table .shop_table td.product-remove a.remove:hover {
    background: rgba(0, 0, 0, 0.05) !important;
}

.yith-wcwl-form .shop_table td.product-remove a.remove:hover:after,
.qwfw-wishlist-table .shop_table td.product-remove a.remove:hover:after {
    color: #333 !important;
    transform: rotate(90deg) !important;
}

.yith-wcwl-form .shop_table td.product-remove a.remove:active,
.qwfw-wishlist-table .shop_table td.product-remove a.remove:active {
    transform: scale(0.95) !important;
}

.yith-wcwl-form .shop_table td.product-remove a.remove:active:after,
.qwfw-wishlist-table .shop_table td.product-remove a.remove:active:after {
    transform: rotate(90deg) scale(0.9) !important;
}

/* Mobile improvements for wishlist too */
@media (max-width: 768px) {
    .yith-wcwl-form .shop_table td.product-remove a.remove,
    .qwfw-wishlist-table .shop_table td.product-remove a.remove {
        width: 48px !important;
        height: 48px !important;
        min-width: 48px !important;
        min-height: 48px !important;
    }
    
    .yith-wcwl-form .shop_table td.product-remove a.remove:after,
    .qwfw-wishlist-table .shop_table td.product-remove a.remove:after {
        font-size: 36px !important;
    }
    
    /* Ensure adequate spacing and centering on mobile for wishlist */
    .yith-wcwl-form .shop_table td.product-remove,
    .qwfw-wishlist-table .shop_table td.product-remove {
        padding: 15px !important;
        text-align: center !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
    }
    
    .yith-wcwl-form .shop_table td.product-remove a.remove,
    .qwfw-wishlist-table .shop_table td.product-remove a.remove {
        margin: 0 auto !important;
    }
}

@media (max-width: 480px) {
    .yith-wcwl-form .shop_table td.product-remove a.remove,
    .qwfw-wishlist-table .shop_table td.product-remove a.remove {
        width: 52px !important;
        height: 52px !important;
        min-width: 52px !important;
        min-height: 52px !important;
    }
    
    .yith-wcwl-form .shop_table td.product-remove a.remove:after,
    .qwfw-wishlist-table .shop_table td.product-remove a.remove:after {
        font-size: 40px !important;
    }
    
    /* Extra padding on very small screens for better spacing - wishlist */
    .yith-wcwl-form .shop_table td.product-remove,
    .qwfw-wishlist-table .shop_table td.product-remove {
        padding: 18px 15px !important;
        text-align: center !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
    }
    
    .yith-wcwl-form .shop_table td.product-remove a.remove,
    .qwfw-wishlist-table .shop_table td.product-remove a.remove {
        margin: 0 auto !important;
    }
}