/**
 * Fixes the gift card form being squeezed into the theme's single-row,
 * non-wrapping add-to-cart flex layout (seen on Ecomus: form.cart and
 * .ecomus-product-atc-group are "display:flex" with no flex-wrap, sized
 * for just a quantity input + button + a couple of icons).
 *
 * Scoped to .sgc_giftcard_product (added by the base plugin to gift card
 * product containers) so non-gift-card products are never affected.
 */

.sgc_giftcard_product form.cart,
.sgc_giftcard_product .ecomus-product-atc-group {
	flex-wrap: wrap;
}

.sgc_giftcard_product .sgc_send_as_gift_wrapper,
.sgc_giftcard_product .shop_gc_giftcard_form_wrapper,
.sgc_giftcard_product .shop_gc_giftcard_form,
.sgc_giftcard_product .sgc_field {
	flex: 1 1 100%;
	width: 100%;
	max-width: 100%;
	/* Flex items default to min-width:auto, which can refuse to shrink
	   below the intrinsic width of their content (long email placeholder
	   text, etc.) and silently overflow the viewport on narrow screens. */
	min-width: 0;
	box-sizing: border-box;
}

.sgc_giftcard_product .sgc_field input,
.sgc_giftcard_product .sgc_field textarea,
.sgc_giftcard_product .sgc_field select {
	max-width: 100%;
	box-sizing: border-box;
}

/* The recipient/message/delivery/amount fields stack as their own block,
   not squeezed alongside each other or the add-to-cart controls. */
.sgc_giftcard_product .shop_gc_giftcard_form {
	display: flex;
	flex-direction: column;
	gap: 1em;
	margin: 0.5em 0 1em;
}

.sgc_giftcard_product .shop_gc_giftcard_form .sgc_field {
	margin: 0;
}

.sgc_giftcard_product .sgc_send_as_gift_wrapper {
	margin: 0.5em 0;
}

/* Quantity / Add to cart / wishlist row: give it room of its own below the
   form instead of trying to share a row with it. */
.sgc_giftcard_product .ecomus-product-atc-group {
	margin-top: 0.5em;
}