/**
 * SaveTo Wishlist — Woostify theme compatibility stylesheet.
 *
 * Enqueued only when the active theme (or its parent) is Woostify, from
 * Frontend_Hooks::frontend_scripts_and_styles(). Woostify rebuilds the
 * WooCommerce product loop into its own markup (.product-loop-wrapper /
 * .product-loop-image-wrapper / .product-loop-content / .product-loop-meta)
 * and ships a custom single-product gallery, so the wishlist button — which
 * renders through the standard WooCommerce hooks — needs a few Woostify-aware
 * adjustments to sit natively in those layouts.
 *
 * These rules only touch positioning, spacing and alignment. The button's
 * configured colors, size and style are left untouched, so this file is safe
 * alongside every "Frontend CSS Loading" mode (full / minimal / none).
 *
 * @since 1.0.8
 */

/* Shop/archive — corner overlay (top_right / top_left).
 *
 * Woostify reserves the card's top-right corner for its own hover action
 * strip (.product-loop-action, z-index: 2) and the top-left for the sale
 * flash. The wishlist overlay container ships with z-index: 10 on most
 * themes, but Woostify's action strip sits in the same stacking context and
 * can cover it, so re-assert the wishlist button above Woostify's layers to
 * keep it visible and clickable. */
.woocommerce ul.products li.product .stw-wishlist-button-placement-top_right,
.woocommerce ul.products li.product .stw-wishlist-button-placement-top_left {
    z-index: 3;
}

/* Shop/archive — inline placements (above_title / below_title / above_button).
 *
 * Inline buttons render inside Woostify's .product-loop-content, whose text
 * alignment is driven by a text-{left|center|right} class from the customizer.
 * Woostify's flex layout stops the plugin's default text-align:center from
 * centring the button, so align it explicitly to match the card and give it
 * consistent spacing from the surrounding title/price. */
.product-loop-content .stw-wishlist-button-container {
    display: flex;
    flex-direction: column;
    margin: 10px 0 0;
}

.product-loop-content.text-left .stw-wishlist-button-container {
    align-items: flex-start;
}

.product-loop-content.text-center .stw-wishlist-button-container {
    align-items: center;
}

.product-loop-content.text-right .stw-wishlist-button-container {
    align-items: flex-end;
}

/* Single product — cart/title placements.
 *
 * Woostify's .summary column is tightly packed; add breathing room above the
 * button so it does not crowd the add-to-cart row or the product title. */
.single-product div.summary .stw-wishlist-button-container {
    margin-top: 12px;
}