/**
 * SaveTo Wishlist — Blocksy theme compatibility stylesheet.
 *
 * Enqueued only when the active theme (or its parent) is Blocksy, from
 * Frontend_Hooks::frontend_scripts_and_styles(). Blocksy keeps WooCommerce's
 * own loop markup but drives the card from its own custom properties
 * (`--horizontal-alignment`, `--text-horizontal-alignment`, `--badge-top`),
 * puts its sale badge in the card's top-start corner, leaves the single-product
 * wrapper unpositioned, and forces every child of its add-to-cart row to full
 * width. Four wishlist button placements land badly because of that, so this
 * file re-states them in Blocksy's own terms.
 *
 * 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.1.6
 */

/* Shop/archive — inline placements (above_title / below_title / above_button /
 * below_button).
 *
 * Blocksy lays the card out as a column flexbox and drives its alignment from
 * `--text-horizontal-alignment`, set from the customizer on
 * `[data-products] .product`. The plugin's own rule pins these four placements
 * to `text-align: center`, so on a default (left-aligned) Blocksy card the
 * wishlist button is the only element that does not line up with the title,
 * price and Add to Cart. Inherit Blocksy's value instead of enumerating one
 * rule per alignment: the button then follows the customizer for every
 * setting, and falls back to the start edge when the property is unset. All
 * three CSS loading modes ship the centring rule this corrects, and this
 * selector is more specific than every one of them, so the behaviour is the
 * same under full, minimal and none. */
[data-products] .product .stw-wishlist-button-container.stw-wishlist-button-placement-above_title,
[data-products] .product .stw-wishlist-button-container.stw-wishlist-button-placement-below_title,
[data-products] .product .stw-wishlist-button-container.stw-wishlist-button-placement-above_button,
[data-products] .product .stw-wishlist-button-container.stw-wishlist-button-placement-below_button {
    text-align: var(--text-horizontal-alignment, start);
}

/* Shop/archive — top_left overlay.
 *
 * Blocksy puts its sale and out-of-stock badges in the same corner, at
 * `var(--badge-top, 15px)`, and the wishlist overlay sits above them, so the
 * badge is hidden completely. Drop the button below the badge row, and only on
 * a card that actually carries a badge, so a card without one keeps the
 * plugin's normal 10px inset. The offset clears one badge at Blocksy's default
 * badge size; a store with a much larger badge, or with several stacked in the
 * same corner, is documented in the readme as a case for "Top Right of the
 * Product Image" instead. */
[data-products] .product:has(:is(.onsale, .out-of-stock-badge, [class*="ct-woo-badge-"])) .stw-wishlist-button-container.stw-wishlist-button-placement-top_left {
    top: calc(var(--badge-top, 15px) + 2.75rem);
}

/* Single product — top_image_left overlay.
 *
 * This placement renders on `woocommerce_before_single_product_summary`, which
 * puts it beside Blocksy's gallery rather than inside it — and Blocksy leaves
 * `.product-entry-wrapper` unpositioned, so the button's `position: absolute`
 * resolves against the page instead and it lands in the top-left corner of the
 * document, far from the product. Give the wrapper a containing block so the
 * button lands over the gallery column where it belongs. Scoped with `:has()`
 * to the one placement that needs it. Measured on Blocksy 2.1.57: every other
 * absolutely positioned element inside this wrapper (the gallery trigger, the
 * zoom overlay, the quantity steppers) already has a nearer positioned
 * ancestor, so none of them re-anchor, and the related and upsell loops render
 * outside the wrapper entirely. (Its twin, `top_image_right`, renders on
 * `woocommerce_product_thumbnails` — inside the gallery, which Blocksy already
 * positions — so it is unaffected either way.) */
.product-entry-wrapper:has(> .stw-wishlist-button-container.stw-wishlist-button-placement-top_image_left) {
    position: relative;
}

/* Single product — top_image_left over a badged gallery.
 *
 * Same collision as the shop card: Blocksy's gallery badge sits in the
 * top-start corner. The gallery sets `--badge-top` on its own container, which
 * the button is not a descendant of, so the 20px gallery default is restated
 * here rather than read from the property. */
.product-entry-wrapper:has(:is(.onsale, .out-of-stock-badge, [class*="ct-woo-badge-"])) .stw-wishlist-button-container.stw-wishlist-button-placement-top_image_left {
    top: calc(20px + 2.75rem);
}

/* Single product — inline_cart.
 *
 * Blocksy lays its add-to-cart row out as `display: flex` and gives every child
 * it does not know about `width: var(--item-width, 100%)`, which makes the
 * wishlist button take a full row of its own — the one thing this placement
 * exists to avoid. Opt out through Blocksy's own property rather than fighting
 * it with a width declaration, so the button sizes to its content and shares
 * the row. The merchant's Button Spacing value, written inline on the
 * container, still supplies the gap. */
.ct-cart-actions .stw-wishlist-button-container.stw-wishlist-button-placement-inline_cart {
    --item-width: auto;
}