/* Phase 2 — cart and checkout on a phone.
   Measured before writing (iPhone 13, 390x844): cart ran 3,184px (4.8 screens)
   for a single line item, checkout 4,676px (7 screens) for eleven fields. The
   pages were not broken, just enormously padded — desktop spacing shipped
   verbatim to a 390px screen. Everything here is vertical compression and
   tap-target sizing; nothing is hidden or restructured. */

@media (max-width:991px){

	/* ── Page shells ─────────────────────────────────────────────────────── */
	.woocommerce-cart .entry-content,
	.woocommerce-checkout .entry-content{ padding-top:10px !important; padding-bottom:14px !important; }
	.woocommerce-cart .woocommerce,
	.woocommerce-checkout .woocommerce{ padding-bottom:16px !important; }

	/* ── Headers: the serif display and trust strip together ate a full
	     screen before a single line item appeared. ─────────────────────────── */
	.bc-cart-head, .bc-co-head{ padding-top:14px !important; padding-bottom:12px !important; }
	.bc-cart-head h1, .bc-co-head h1,
	.bc-cart-title, .bc-co-title{ font-size:27px !important; line-height:1.16 !important; margin:0 0 6px !important; }
	.bc-cart-eyebrow, .bc-co-eyebrow{ font-size:10.5px !important; margin-bottom:6px !important; }

	.bc-cart-trust, .bc-co-trust{
		padding:8px 10px !important; margin:8px 0 0 !important;
		font-size:12px !important; line-height:1.5 !important;
	}
	/* The lock glyph sat on its own line above three wrapped phrases. */
	.bc-cart-trust svg, .bc-co-trust svg{ width:14px; height:14px; vertical-align:-2px; }

	/* ── Line items ──────────────────────────────────────────────────────── */
	.cart-contents-wrapper{ padding:12px !important; margin-bottom:10px !important; }
	.woocommerce-cart-form.form-container{ padding:10px 0 !important; }
	.cart-contents .product-name a,
	.cart-contents .product-name{
		font-size:15px !important; line-height:1.35 !important;
		display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;
	}
	.cart-contents img, .cart_item img{ max-width:76px !important; height:auto !important; border-radius:8px; }

	/* ── Form fields ─────────────────────────────────────────────────────── */
	.woocommerce-billing-fields{ padding-top:14px !important; padding-bottom:4px !important; margin-bottom:10px !important; }
	.woocommerce-billing-fields__field-wrapper{
		padding:14px !important; margin-bottom:14px !important;
	}
	.woocommerce form .form-row{ margin:0 0 12px !important; padding:0 !important; }
	.woocommerce form .form-row label{ font-size:13px !important; margin-bottom:5px !important; display:block; }
	/* 48px keeps every control above the 44px accessible floor with room to
	   spare, and 16px text stops iOS zooming the viewport on focus. */
	.woocommerce form .form-row input.input-text,
	.woocommerce form .form-row textarea,
	.woocommerce form .form-row select,
	.woocommerce-cart .coupon input.input-text,
	.select2-container .select2-selection--single{
		min-height:48px !important; height:48px !important;
		font-size:16px !important; padding:10px 14px !important; box-sizing:border-box;
	}
	.woocommerce form .form-row textarea{ height:auto !important; min-height:84px !important; }

	/* Checkboxes ("Create an account?", terms) were 20px targets on their own
	   card; the row becomes the target instead. */
	.woocommerce form .form-row.create-account,
	.woocommerce-terms-and-conditions-wrapper .form-row{ padding:10px 12px !important; margin-bottom:10px !important; }
	.woocommerce form .form-row-checkbox label,
	.woocommerce-form__label-for-checkbox{
		display:flex !important; align-items:center; gap:10px;
		min-height:44px; font-size:14px !important; cursor:pointer;
	}
	.woocommerce-form__input-checkbox{ width:22px; height:22px; flex:0 0 auto; }

	/* WooCommerce leaves an empty bordered card where the account-password
	   fields would be for a logged-in buyer. */
	.woocommerce-account-fields:empty,
	.woocommerce-additional-fields:empty,
	.woocommerce-additional-fields__field-wrapper:empty{ display:none !important; }

	/* ── Coupon row ──────────────────────────────────────────────────────── */
	.woocommerce-cart .coupon{ display:flex !important; gap:8px; flex-wrap:nowrap; align-items:stretch; }
	.woocommerce-cart .coupon input.input-text{ flex:1 1 auto; min-width:0; }
	.woocommerce-cart .coupon .button{ flex:0 0 auto; min-height:48px !important; padding:0 16px !important; white-space:nowrap; }

	/* ── Totals and the primary action ───────────────────────────────────── */
	.cart_totals, .woocommerce-checkout-review-order{ padding:14px !important; margin-top:10px !important; }
	.cart_totals h2, .woocommerce-checkout-review-order h2,
	#order_review_heading{ font-size:19px !important; margin:0 0 10px !important; }
	.woocommerce-checkout-review-order-table td,
	.woocommerce-checkout-review-order-table th,
	.cart_totals td, .cart_totals th{ padding:9px 6px !important; font-size:14px !important; }

	.wc-proceed-to-checkout{ padding:8px 0 0 !important; }
	.wc-proceed-to-checkout .checkout-button,
	#place_order{
		display:flex !important; align-items:center; justify-content:center;
		width:100% !important; min-height:52px !important;
		font-size:16px !important; border-radius:12px !important; margin:0 !important;
	}

	/* ── Order Details heading on checkout ───────────────────────────────── */
	.checkout-contents h2, .checkout-contents h3{ font-size:20px !important; margin:14px 0 10px !important; }
	.checkout-contents{ padding-bottom:0 !important; }

	/* Notices ("… has been added to your cart") were three lines tall with a
	   button floated into the text. */
	.woocommerce-message, .woocommerce-info, .woocommerce-error{
		display:flex !important; flex-wrap:wrap; align-items:center; gap:8px;
		padding:12px 14px !important; margin:0 0 12px !important;
		font-size:13.5px !important; line-height:1.5 !important;
	}
	.woocommerce-message .button, .woocommerce-info .button{
		margin:0 !important; float:none !important; min-height:40px;
		display:inline-flex; align-items:center; padding:0 14px !important; font-size:13px !important;
	}
}

@media (max-width:400px){
	.bc-cart-head h1, .bc-co-head h1,
	.bc-cart-title, .bc-co-title{ font-size:24px !important; }
	.woocommerce-cart .coupon .button{ padding:0 12px !important; font-size:13px !important; }
}

/* ── The footer on a checkout page ───────────────────────────────────────
 * The full marketing footer measured 1,322px on the cart and 1,427px on
 * checkout — 43% and 34% of each page. On the two screens where the only
 * job is to complete a purchase, the link farm is dropped and the legal
 * bar (copyright, terms, privacy) is kept, which is the row buyers
 * actually need. Every other page keeps the footer in full. */
@media (max-width:991px){
	.woocommerce-cart .biocode-footer__main,
	.woocommerce-checkout .biocode-footer__main{ display:none !important; }
	.woocommerce-cart .biocode-footer__bottom,
	.woocommerce-checkout .biocode-footer__bottom{ padding:16px 0 !important; }
}
