/**
 * iTrust migrated frontend styles.
 *
 * Functional CSS for features ported from the old mg_space theme, re-scoped to
 * Woodmart's markup. mg_space scoped these to `.archive-content .item-thumb` /
 * `.single-product .item-thumb`, which don't exist in Woodmart — so the rules
 * never matched and the elements rendered unstyled (full-size / mispositioned).
 *
 * Baseline only — restyle freely during the redesign.
 */

/* Cart table sale prices: old price greyed on its own line, no underline on
 * the new one. (Moved from the removed itrust-wishlist.css.) */
tr.cart_item ins { text-decoration: none; }
tr.cart_item del { color: #b1b1b1; display: block; }

/* ---------------------------------------------------------------------------
 * Archive / loop product stickers  (Functions::printArchiveStickers)
 * Injected on `woocommerce_before_shop_loop_item_title`, which in Woodmart
 * renders inside `.wd-product-thumb.product-element-top` (position: relative).
 * ------------------------------------------------------------------------- */
.wd-product-thumb .stickers-wrapper {
    display: flex;
    position: absolute;
    bottom: 10px;
    right: 10px;
    z-index: 2;
}

.wd-product-thumb .stickers-wrapper .sticker {
    max-width: 80px;
    height: 80px;
    width: auto;
}

.wd-product-thumb .stickers-wrapper .sticker-wide {
    margin: auto;
    max-width: 150px;
    max-height: 40px;
    width: 100% !important;
    height: auto;
}

@media (min-width: 975px) and (max-width: 1580px) {
    .wd-product-thumb .stickers-wrapper {
        flex-direction: column;
        align-items: flex-end;
        max-width: 40%;
    }
}

@media (max-width: 800px) {
    .wd-product-thumb .stickers-wrapper {
        bottom: 60px;
    }

    .wd-product-thumb .stickers-wrapper .sticker {
        max-width: 60px;
        height: 60px;
    }
}

/* ---------------------------------------------------------------------------
 * Single-product Youtube video  (Functions::printProductVideo)
 * mg_space embedded it in its gallery carousel; here it's a responsive 16:9
 * embed in the product summary. Restyle / reposition freely.
 * ------------------------------------------------------------------------- */
.itr-product-video {
    position: relative;
    width: 100%;
    aspect-ratio: 16 / 9;
    margin: 15px 0;
}

.itr-product-video iframe {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
}

/* "Sold out" / "Ask for" label (loop + single). "Ask for" is Woodmart's "Sold out"
 * label with its text swapped (Functions::swapSoldOutLabelForAskFor), so it keeps
 * the .out-of-stock class and the same navy colour. Woodmart's break-all splits
 * the text mid-word in the 50px round badge; keep it on one line and let the
 * badge grow to fit (beating woo-mod-product-labels-round, which loads later). */
.product-labels .product-label.wd-shape-round.out-of-stock {
    width: auto;
    max-width: none;
    padding-inline: 10px;
    white-space: nowrap;
    word-break: normal;
}

/* Out-of-stock waiting list ("Inform me" CF7 form) on the single product page. */
.only_in_shop_form br {
    display: none;
}

.only_in_shop_form input[type="email"] {
    max-width: 320px;
    display: block;
    margin: 10px 0;
}
