/* Keep the existing card design; prevent its narrow-screen price column clipping. */
@media (max-width: 560px) {
    .single-product .elementor-element-740e117 > .elementor-widget-container {
        margin-left: 0 !important;
        margin-right: 0 !important;
        max-width: 100%;
    }
    form.variations_form ul[aria-label="Pack"] {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
    }
    form.variations_form ul[aria-label="Pack"] > li {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        box-sizing: border-box;
    }
    form.variations_form ul[aria-label="Pack"] .variable-item-contents {
        flex-wrap: nowrap !important;
        min-width: 0;
    }
    form.variations_form ul[aria-label="Pack"] .pack-first { flex: 0 0 12%; }
    form.variations_form ul[aria-label="Pack"] .pack-middle {
        flex: 1 1 52%; min-width: 0; box-sizing: border-box;
    }
    form.variations_form ul[aria-label="Pack"] .pack-middle img { width: 42px; max-width: 28% !important; }
    form.variations_form ul[aria-label="Pack"] .middle-price-wrapper { width: auto; min-width: 0; }
    form.variations_form ul[aria-label="Pack"] .pack-last {
        flex: 0 0 36%; box-sizing: border-box;
    }
    form.variations_form ul[aria-label="Pack"] .pack-last .single-mount-price {
        font-size: clamp(12px, 3.5vw, 15px) !important;
        white-space: nowrap;
    }
    form.variations_form ul[aria-label="Pack"] .pack-middle .save-percent { font-size: 13px; }
}

.nato-selection-help { font: 500 15px/1.5 Poppins, sans-serif; color: #333; padding: 10px 12px; background: #f0f8fb; border-left: 4px solid #007d9c; border-radius: 4px; margin: 8px 0 12px; }
.nato-selection-help.nato-selection-error { color: #842323; border-color: #b52d2d; background: #fff3f3; }
.nato-total-help { font: 400 13px/1.5 Poppins, sans-serif !important; color: #555; margin: 12px 0; }
#cart_summary .product-info:first-child { gap: 8px; flex-wrap: wrap; }
#cart_summary #product-name { flex: 1 1 180px; line-height: 1.5; }

/* A consistent, readable select on iOS as well as desktop browsers. */
#cart_summary #quantity-dropdown {
    -webkit-appearance: none;
    appearance: none;
    box-sizing: border-box;
    flex: 0 0 64px;
    width: 64px !important;
    min-width: 64px;
    height: 40px;
    margin: 0;
    padding: 0 24px 0 8px !important;
    border: 1px solid #999;
    border-radius: 6px;
    background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='m2 2 4 4 4-4' fill='none' stroke='%23333' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat right 9px center;
    color: #222;
    font: 500 16px/normal Poppins, sans-serif;
    text-align: center;
    text-align-last: center;
    cursor: pointer;
}
#cart_summary #quantity-dropdown:focus-visible { outline: 2px solid #007d9c; outline-offset: 2px; }
#nato-product-applepay.wc_stripe_product_payment_methods {
    width: 100%;
    box-sizing: border-box;
    padding: 0 10px;
    margin: 0 0 10px;
    list-style: none;
}
#nato-product-applepay > li { width: 100%; margin: 0 !important; padding: 0 !important; }

/* Keep the same viewing area when the introductory video becomes a mount image.
   Variation images have different source proportions; contain, never crop them. */
.single-product.postid-14 #prod_img,
.single-product.postid-14 #pro_video {
    width: 100% !important;
    aspect-ratio: 16 / 9;
    height: auto !important;
    min-height: 0;
    overflow: hidden;
    padding: 0 !important;
    box-sizing: border-box;
}
#prod_img > .elementor-widget-container,
#prod_img .woocommerce-product-gallery,
#prod_img .woocommerce-product-gallery__wrapper,
#prod_img .woocommerce-product-gallery__image,
#prod_img .woocommerce-product-gallery__image > a {
    width: 100% !important;
    height: 100% !important;
    min-height: 0;
    margin: 0 !important;
    padding: 0 !important;
    box-sizing: border-box;
}
#prod_img .woocommerce-product-gallery__image > a > img:not(.zoomImg) {
    display: block;
    width: 100% !important;
    height: 100% !important;
    max-height: 100%;
    object-fit: contain;
    object-position: center;
}
.nato-selection-help {
    box-sizing: border-box;
    min-height: 34px;
    padding: 6px 10px;
    margin: 8px 0;
    font-size: 14px;
    line-height: 20px;
}
/* The variation table otherwise adds 15px below Mount and 15px above Pack. */
form.variations_form table.variations td:has(ul[aria-label="Mount"]) { padding-bottom: 0 !important; }
form.variations_form table.variations td:has(ul[aria-label="Pack"]) { padding-top: 0 !important; }
/* These choices already have persistent labels; duplicate hover bubbles obscure
   the selector heading on touch screens. Keep the visible labels and focus ring. */
form.variations_form ul[aria-label="Mount"] li[data-wvstooltip]::before,
form.variations_form ul[aria-label="Mount"] li[data-wvstooltip]::after { display: none !important; }
@media (max-width: 767px) {
    #cart_summary #product-name { min-height: 3em; }
}

/* Three equal, centered choices use the complete row, not fixed-width cards.
   Images previously sat at the left edge of each flex box. */
#prod_con form.variations_form ul[aria-label="Mount"] {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px !important;
    width: 100% !important;
    max-width: 100%;
    padding: 0 !important;
    margin: 0 !important;
}
#prod_con form.variations_form ul[aria-label="Mount"] > li {
    width: 100% !important;
    max-width: none !important;
    min-width: 0;
    height: auto !important;
    margin: 0 !important;
}
#prod_con form.variations_form ul[aria-label="Mount"] .variable-item-contents {
    width: 100%;
    height: auto !important;
    align-items: center !important;
}
#prod_con form.variations_form ul[aria-label="Mount"] .pack-middle {
    display: flex !important;
    width: 100% !important;
    height: clamp(96px, 24vw, 120px) !important;
    box-sizing: border-box;
    padding: 4px !important;
    justify-content: center !important;
    align-items: center !important;
}
#prod_con form.variations_form ul[aria-label="Mount"] .pack-middle img.variation_img {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    max-width: 100% !important;
    max-height: 100% !important;
    margin: auto !important;
    object-fit: contain;
    object-position: center;
}
#prod_con form.variations_form ul[aria-label="Mount"] .pack-first {
    width: 100%;
    min-height: 28px;
    text-align: center;
}

/* Hidden price children left a zero-height flex item taking horizontal space. */
#prod_con form.variations_form ul[aria-label="Mount"] .middle-price-wrapper { display: none !important; }