/* WooCommerce cart and mini-cart layout. Loaded only when the feature is enabled. */

/* Preserve the configured width; override intrinsic/theme heights for a square frame. */
body.woocommerce-cart .woocommerce-cart-form .product-thumbnail img,
.woocommerce-mini-cart .woocommerce-mini-cart-item img,
.elementor-menu-cart__product-image img {
    aspect-ratio: 1 / 1 !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    object-fit: contain !important;
}

/*
 * Product-title typography is intentionally not declared here. Elementor remains
 * the only authority for family, size, weight, line height, spacing and color.
 */

/*
 * Elementor applies typography to the link, while its parent keeps WooCommerce's
 * taller line box. A block link removes that parent strut so Elementor's line
 * height becomes the sole visual value.
 */
.elementor-menu-cart__product-name > a {
    display: block;
}

body.woocommerce-cart .woocommerce-cart-form td.product-name > dl.variation,
.woocommerce-mini-cart-item dl.variation,
.elementor-menu-cart__product-name dl.variation {
    display: flex !important;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 0;
    width: 100%;
    margin: 4px 0 0 !important;
    padding: 0 !important;
    color: inherit;
    font-family: inherit;
    font-size: 0.86em;
    font-style: normal;
    line-height: 1.35;
}

body.woocommerce-cart .woocommerce-cart-form td.product-name > dl.variation > dt,
body.woocommerce-cart .woocommerce-cart-form td.product-name > dl.variation > dd,
.woocommerce-mini-cart-item dl.variation > dt,
.woocommerce-mini-cart-item dl.variation > dd,
.elementor-menu-cart__product-name dl.variation > dt,
.elementor-menu-cart__product-name dl.variation > dd {
    display: inline !important;
    float: none !important;
    clear: none !important;
    width: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    color: inherit;
    font: inherit;
}

body.woocommerce-cart .woocommerce-cart-form td.product-name > dl.variation > dt,
.woocommerce-mini-cart-item dl.variation > dt,
.elementor-menu-cart__product-name dl.variation > dt {
    font-weight: 600;
}

body.woocommerce-cart .woocommerce-cart-form td.product-name > dl.variation > dt:not(:first-of-type)::before,
.woocommerce-mini-cart-item dl.variation > dt:not(:first-of-type)::before,
.elementor-menu-cart__product-name dl.variation > dt:not(:first-of-type)::before {
    display: inline-block;
    margin: 0 6px;
    color: currentColor;
    font-weight: 400;
    content: "|";
}

body.woocommerce-cart .woocommerce-cart-form td.product-name > dl.variation > dd,
.woocommerce-mini-cart-item dl.variation > dd,
.elementor-menu-cart__product-name dl.variation > dd {
    margin-inline-start: 3px !important;
}

body.woocommerce-cart .woocommerce-cart-form td.product-name > dl.variation > dd p,
.woocommerce-mini-cart-item dl.variation > dd p,
.elementor-menu-cart__product-name dl.variation > dd p {
    display: inline !important;
    margin: 0 !important;
    padding: 0 !important;
    color: inherit;
    font: inherit;
}

/* Menu Cart: move the visible quantity from the price line onto the image. */
.elementor-menu-cart__main .elementor-menu-cart__products {
    padding-block-start: 8px;
}

.elementor-menu-cart__product-image {
    position: relative;
    overflow: visible !important;
}

.elementor-menu-cart__product-image .xw-mini-cart-product-quantity {
    position: absolute;
    z-index: 2;
    top: -7px;
    inset-inline-end: -7px;
    display: grid;
    place-items: center;
    min-width: 22px;
    height: 22px;
    padding: 0 5px;
    box-sizing: border-box;
    border-radius: 999px;
    background: #111;
    color: #fff;
    font-size: 12px;
    font-weight: 700;
    line-height: 1;
    white-space: nowrap;
    pointer-events: none;
}

/* Keep the remove control clear of the products scrollbar. */
.elementor-menu-cart__main .elementor-menu-cart__product-remove {
    inset-inline-end: 10px;
}

/* Keep the original quantity available to assistive technology without duplicating it visually. */
.elementor-menu-cart__product-price .product-quantity {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    margin: -1px !important;
    padding: 0 !important;
    overflow: hidden !important;
    clip: rect(0 0 0 0) !important;
    clip-path: inset(50%) !important;
    border: 0 !important;
    white-space: nowrap !important;
}
