/* ========== AquaVue Checkout: fixes from the Oct 13 UI/UX audit (loads after checkout.css) ========== */

/* H07 Phones/tablets: one column that can never grow wider than the screen (the grid track grew to fit wide content) */
@media (max-width: 960px) {
	.av-wc--cart .woocommerce, .av-wc--checkout form.checkout, .av-wc--account .woocommerce { grid-template-columns: minmax(0, 1fr) !important; }
	.av-wc--checkout #customer_details, .av-wc--checkout #order_review_heading, .av-wc--checkout #order_review { min-width: 0; max-width: 100%; box-sizing: border-box; }
	.av-wc .select2-container { width: 100% !important; max-width: 100%; }
}
.av-wc .form-row .woocommerce-input-wrapper { display: block; min-width: 0; }

/* H08 Place order area: button first, then the reassurance list on full-width rows below it */
body.av-wc-page .av-wc #payment .place-order { display: flex !important; flex-direction: column; align-items: stretch; gap: 16px; }
body.av-wc-page .av-wc #payment .place-order .av-co-trust { width: 100%; margin: 0; }

/* M19 Card form fills its box (no empty strip beside the fields); wallet button lines up with the billing column */
.av-wc #payment div.payment_box.payment_method_poynt { padding: 12px; }
.av-wc #mwc-payments-poynt-hosted-form, .av-wc #poynt-collect-v2-iframe { width: 100% !important; max-width: 100%; }
.av-wc .mwc-external-checkout-buttons, .av-wc #mwc-payments-wallet-buttons, .av-wc #wallet-buttons-container, .av-wc #googlepay-button-container, .av-wc #gpay-button-online-api-id { width: 100% !important; max-width: none !important; }
@media (min-width: 961px) {
	.av-wc--checkout .mwc-external-checkout-buttons { max-width: calc(100% - 420px - clamp(28px, 4vw, 56px)) !important; margin-left: 0 !important; margin-right: auto !important; }
}

/* L41 Cart on phones: keep the product photo in each stacked row */
@media (max-width: 768px) {
	body.av-wc-page .av-wc table.shop_table_responsive tr.cart_item td.product-thumbnail { display: block !important; padding: 12px 0 0 !important; text-align: left !important; }
	body.av-wc-page .av-wc table.shop_table_responsive tr.cart_item td.product-thumbnail::before { display: none !important; }
	body.av-wc-page .av-wc table.shop_table_responsive tr.cart_item td.product-thumbnail img { width: 72px; height: 72px; }
}

/* L43 Login: "Remember me" checkbox centred with its text; no divider lines in the login/register cards */
body.av-wc-page .av-wc label.woocommerce-form-login__rememberme { display: inline-flex !important; align-items: center; gap: 10px; margin: 0; font-weight: 500; vertical-align: middle; }
body.av-wc-page .av-wc label.woocommerce-form-login__rememberme input { margin: 0 !important; position: static; }
.av-wc--login #customer_login h2, .av-wc--login #customer_login form { border: 0 !important; }

/* ========== One-screen checkout (Oct 27): promo-code box above payment, one address only ========== */
.av-wc--checkout #ship-to-different-address, .av-wc--checkout .woocommerce-shipping-fields { display: none !important; }
.av-wc--checkout .av-promo { margin: 0 0 18px; padding: 16px; border: 1px solid var(--av-line, #DCEAF3); border-radius: 12px; background: #F7FBFE; }
.av-wc--checkout .av-promo label { display: block; margin: 0 0 8px; font-size: 14px; font-weight: 600; color: var(--av-navy, #0B1F3A); }
.av-wc--checkout .av-promo-row { display: flex; gap: 8px; }
.av-wc--checkout .av-promo-row input { flex: 1 1 auto; min-width: 0; height: 46px; padding: 0 14px; border: 1px solid #C9D6E2; border-radius: 10px; font-size: 16px; text-transform: uppercase; letter-spacing: .04em; background: #fff; }
.av-wc--checkout .av-promo-row input::placeholder { text-transform: none; letter-spacing: 0; }
.av-wc--checkout .av-promo-apply { flex: 0 0 auto; height: 46px; padding: 0 20px; border: 0; border-radius: 10px; background: var(--av-navy, #0B1F3A); color: #fff; font-weight: 600; font-size: 15px; cursor: pointer; }
.av-wc--checkout .av-promo-apply:hover { background: var(--av-blue, #0A72BB); }
.av-wc--checkout .av-promo-apply:disabled { opacity: .6; cursor: wait; }
.av-wc--checkout .av-promo-msg { margin: 8px 0 0; font-size: 14px; color: #1E7A46; }
.av-wc--checkout .av-promo-msg:empty { display: none; }
.av-wc--checkout .av-promo-msg.is-error { color: #B42318; }
.av-wc--checkout tr.cart-discount td, .av-wc--checkout tr.cart-discount th { color: #1E7A46; }

/* ========== Simpler checkout (Oct 29): card form full width with no boxes around it; open order summary on phones ========== */
/* Card form: no browser fieldset frame, no white panel, no extra padding (it was boxed three deep on phones) */
body.av-wc-page .av-wc #payment fieldset.mwc-payments-payment-form { margin: 0; padding: 0; border: 0; min-width: 0; }
body.av-wc-page .av-wc #payment div.payment_box { margin: 12px 0 0; padding: 0; border-radius: 0; background: transparent; }
body.av-wc-page .av-wc #payment ul.payment_methods { padding: 20px 0 4px; border: 0; }
body.av-wc-page .av-wc #payment ul.payment_methods li { margin: 0; gap: 0; }
body.av-wc-page .av-wc #payment .place-order { padding-left: 0; padding-right: 0; }
/* "Card" + logos on one line: label left, small logos right */
body.av-wc-page .av-wc #payment ul.payment_methods li > label { display: flex; flex-wrap: nowrap; justify-content: space-between; align-items: center; flex: 1 1 100% !important; width: 100%; padding: 0 !important; font-size: 17px; font-weight: 700; color: var(--av-navy, #0B1F3A); }
body.av-wc-page .av-wc #payment .mwc-payments-gateway-card-icons { display: flex; flex-wrap: nowrap; gap: 4px; margin: 0; }
body.av-wc-page .av-wc #payment .mwc-payments-gateway-card-icons img { width: 32px !important; height: 20px !important; max-height: none; margin: 0; }
body.av-wc-page .av-wc #payment .mwc-payments-gateway-card-icons img[alt="diners-club"],
body.av-wc-page .av-wc #payment .mwc-payments-gateway-card-icons img[alt="maestro"] { display: none; }
body.av-wc-page .av-wc #mwc-payments-stripe-form { width: 100%; }
/* Promo code: a plain row, no box */
.av-wc--checkout .av-promo { padding: 0; border: 0; background: transparent; }

@media (max-width: 960px) {
	/* Order summary and payment sit on the page like the address fields, divided by a thin line, not inside a tinted card */
	body.av-wc-page .av-wc--checkout #order_review_heading { margin-top: 32px; padding: 28px 0 4px; border-top: 1px solid var(--av-line, #DCE6EF); border-radius: 0; background: transparent; }
	body.av-wc-page .av-wc--checkout #order_review { padding: 0; border-radius: 0; background: transparent; }
	body.av-wc-page .av-wc #payment .place-order { padding-top: 22px; }
	body.av-wc-page .av-wc--checkout table.woocommerce-checkout-review-order-table thead { display: none; }
}

/* ========== Login page (Oct 29): one centred form, no card frames, full-width button ========== */
.av-wc--login #customer_login { display: block; max-width: 420px; margin: 0 auto; }
.av-wc--login #customer_login .u-column1, .av-wc--login #customer_login .u-column2 { padding: 0; border: 0; border-radius: 0; }
.av-wc--login #customer_login .u-column2 { margin-top: 48px; padding-top: 40px; border-top: 1px solid var(--av-line, #DCE6EF); }
.av-wc--login #customer_login.is-switch .u-column2 { margin-top: 0; padding-top: 0; border-top: 0; }
.av-wc--login #customer_login.is-switch:not(.is-register) .u-column2, .av-wc--login #customer_login.is-switch.is-register .u-column1 { display: none; }
.av-wc--login #customer_login .u-column1 > h2 { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
.av-wc--login #customer_login h2 { margin: 0 0 20px; font-size: 24px; font-weight: 700; }
.av-wc--login .form-row { margin: 0 0 16px; padding: 0; }
.av-wc--login .form-row label { display: block; margin: 0 0 6px; font-size: 14px; font-weight: 600; color: var(--av-navy, #0B1F3A); }
.av-wc--login .form-row label .required { display: none; }
.av-wc--login .form-row input.input-text { width: 100%; height: 50px; padding: 0 14px; border: 1px solid #C9D6E2; border-radius: 10px; font-size: 16px; background: #fff; box-sizing: border-box; }
.av-wc--login .form-row input.input-text:focus { border-color: var(--av-blue, #0A72BB); outline: 0; box-shadow: 0 0 0 3px rgba(10, 114, 187, .15); }
/* Remember me, then a full-width button */
body.av-wc-page .av-wc--login .woocommerce-form-login .form-row:last-of-type { display: flex; flex-direction: column; align-items: stretch; gap: 16px; margin-top: 4px; }
.av-wc--login .woocommerce-form-login__rememberme { order: 1; margin: 0; }
.av-wc--login .woocommerce-form-login__submit, .av-wc--login .woocommerce-form-register__submit { order: 2; width: 100%; min-height: 52px; margin: 0 !important; border-radius: 10px; font-size: 17px; font-weight: 600; }
.av-wc--login .woocommerce-LostPassword { margin: 14px 0 0; text-align: center; font-size: 15px; }
.av-wc--login .av-login-note { order: 3; margin: 24px 0 0; padding: 14px 16px; border-radius: 12px; background: var(--av-bg-alt, #F5F8FB); font-size: 14px; line-height: 1.5; color: var(--av-muted, #5B6B7B); }
.av-wc--login .av-login-switch { margin: 22px 0 0; text-align: center; font-size: 15px; color: var(--av-muted, #5B6B7B); }
.av-wc--login .av-login-switch a { color: var(--av-blue, #0A72BB); font-weight: 600; text-decoration: none; }
.av-wc--login #customer_login:not(.is-switch) .av-login-switch { display: none; }
.av-wc--login .woocommerce-form-register p:not(.form-row):not(.av-login-switch), .av-wc--login .woocommerce-privacy-policy-text p { font-size: 13px; line-height: 1.5; color: var(--av-muted, #5B6B7B); }

/* "Create an account" checkbox under the email (Oct 29) */
body.av-wc-page .av-wc--checkout .av-create-account { margin: -4px 0 18px; }
body.av-wc-page .av-wc--checkout .av-create-account label.checkbox { display: flex !important; align-items: flex-start; gap: 10px; margin: 0; font-size: 14px; font-weight: 400; line-height: 1.45; color: var(--av-muted, #5B6B7B); cursor: pointer; }
body.av-wc-page .av-wc--checkout .av-create-account input[type="checkbox"] { flex: 0 0 18px; width: 18px; height: 18px; margin: 1px 0 0; accent-color: var(--av-blue, #0A72BB); }
body.av-wc-page .av-wc--checkout .av-create-account .optional { display: none; }

/* WooCommerce's own "Create an account?" box: driven by our checkbox, never shown */
.woocommerce-checkout .woocommerce-account-fields { display: none !important; }
/* GoDaddy's "Securely Save to Account" box: ticked for the buyer, never shown (Stripe shows its consent line) */
#payment .form-row:has(> #mwc-payments-stripe-tokenize-payment-method) { display: none !important; }
