/*
 * PrintLabs cart and mini-cart presentation.
 *
 * WooCommerce normally renders cart-item metadata as narrow dt/dd columns.
 * The final mockup needs a complete row so it cannot be clipped by a drawer.
 */

.mini_cart_item dl.variation,
.woocommerce-mini-cart-item dl.variation {
    display: grid !important;
    grid-template-columns: minmax(110px, auto) minmax(0, 1fr) !important;
    column-gap: 10px !important;
    row-gap: 2px !important;
    width: 100% !important;
    max-width: 100% !important;
}

.mini_cart_item dl.variation > dt,
.mini_cart_item dl.variation > dd,
.woocommerce-mini-cart-item dl.variation > dt,
.woocommerce-mini-cart-item dl.variation > dd {
    float: none !important;
    clear: none !important;
    width: auto !important;
    max-width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: visible !important;
}

.mini_cart_item dl.variation > dd p,
.woocommerce-mini-cart-item dl.variation > dd p {
    margin: 0 !important;
}

.mini_cart_item dl.variation > dt.variation-Finalmockup,
.mini_cart_item dl.variation > dd.variation-Finalmockup,
.woocommerce-mini-cart-item dl.variation > dt.variation-Finalmockup,
.woocommerce-mini-cart-item dl.variation > dd.variation-Finalmockup {
    grid-column: 1 / -1 !important;
    display: block !important;
    width: 100% !important;
}

.mini_cart_item dl.variation > dt.variation-Finalmockup,
.woocommerce-mini-cart-item dl.variation > dt.variation-Finalmockup {
    margin-top: 8px !important;
    margin-bottom: 5px !important;
}

/* :has() also covers themes that replace WooCommerce's generated key class. */
.mini_cart_item dl.variation > dd:has(.plc3-cart-mockup-link),
.woocommerce-mini-cart-item dl.variation > dd:has(.plc3-cart-mockup-link) {
    grid-column: 1 / -1 !important;
    display: block !important;
    width: 100% !important;
}

.plc3-cart-mockup-link {
    display: block !important;
    width: min(180px, 100%) !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
}

.plc3-cart-mockup-image {
    display: block !important;
    width: 100% !important;
    max-width: 180px !important;
    height: auto !important;
    aspect-ratio: 1 / 1 !important;
    object-fit: contain !important;
    object-position: center !important;
    border: 1px solid #dddddd !important;
    border-radius: 8px !important;
}

/* Full cart page: keep the image compact without clipping it. */
.woocommerce-cart-form .plc3-cart-mockup-link {
    width: min(180px, 100%) !important;
}