/* Cart, checkout, order confirmation and order pay: WooCommerce markup styled to the design. */

/* Notices (base style in wp.css). Checkout errors list one problem per line. */
.woocommerce-NoticeGroup { grid-column: 1 / -1; }
.woocommerce-checkout .woocommerce-error, .woocommerce-cart .woocommerce-error { display: block; }
.woocommerce-checkout .woocommerce-error li + li { margin-top: 6px; }
.woocommerce-checkout .woocommerce-error a, .woocommerce-checkout .woocommerce-info a { text-decoration: underline; text-underline-offset: 3px; }
.woocommerce-checkout .woocommerce-info .showlogin, .woocommerce-checkout .woocommerce-info .showcoupon { font-weight: 600; }

/* Cart rows without color/size. */
.cart-row-info p:empty { display: none; }

/* Checkout login and coupon forms (shown above the layout when enabled). */
.woocommerce-checkout form.login, .woocommerce-checkout form.checkout_coupon { padding: 28px; border: 1px solid #ddd; background: white; margin: 0 0 30px; }
.woocommerce-checkout form.login p, .woocommerce-checkout form.checkout_coupon p { font-size: 14px; line-height: 1.8; color: #666; margin: 0 0 15px; }
.woocommerce-checkout form.checkout_coupon { display: flex; flex-wrap: wrap; gap: 12px; align-items: flex-end; }
.woocommerce-checkout form.checkout_coupon > p:first-child { flex-basis: 100%; }
.woocommerce-checkout form.checkout_coupon .form-row { margin: 0; flex: 1 1 200px; }
.woocommerce-checkout form.checkout_coupon .form-row-last { flex: 0 0 auto; }
.woocommerce-checkout form.login label { display: block; font-size: 14px; margin-bottom: 9px; color: var(--black); }
.woocommerce-checkout form.login .input-text, .woocommerce-checkout form.checkout_coupon .input-text {
	display: block; width: 100%; padding: 13px 12px; font-size: 16px; border: 1px solid #ccc; border-radius: 0; background: white; color: #111; min-height: 48px;
}
.woocommerce-checkout form.login .button, .woocommerce-checkout form.checkout_coupon .button { background: var(--black); color: white; }
.woocommerce-checkout .clear { clear: both; }

/* Checkout fields: WooCommerce's p.form-row wrappers carry the design's .form-field classes. */
.store-form p.form-row { margin-top: 0; font-size: inherit; line-height: inherit; color: inherit; }
.store-form .form-grid > .form-row { margin-bottom: 0; }
.store-form .form-row label .required, .store-form .form-row label .optional, .summary-card .form-row label .required { display: none; }
.store-form .woocommerce-input-wrapper { display: block; }
.form-field select {
	display: block; width: 100%; padding: 13px 12px; font-size: 16px; border: 1px solid #ccc; border-radius: 0; background: white; color: #111; min-height: 48px;
}
.form-field select:focus { outline: 2px solid var(--red); outline-offset: 2px; }
.form-field textarea { min-height: 0; resize: vertical; }
.form-field .woocommerce-input-wrapper > strong { display: block; padding: 13px 0; font-size: 16px; font-weight: 400; }
.form-field .description { display: block; font-size: 13px; color: #666; margin-top: 8px; }

/* Validation states set by WooCommerce's checkout script. */
.form-row.woocommerce-invalid input.input-text, .form-row.woocommerce-invalid select, .form-row.woocommerce-invalid textarea { border-color: var(--red); }
.store-form .checkout-inline-error-message { margin: 8px 0 0; font-size: 13px; line-height: 1.5; color: var(--red); }

/* Account creation and terms checkboxes. */
.woocommerce-account-fields { margin-bottom: 22px; }
.woocommerce-account-fields .create-account .form-row { margin-top: 20px; }
.woocommerce-form__label-for-checkbox { display: flex; gap: 10px; align-items: flex-start; font-size: 14px; line-height: 1.6; color: var(--black); cursor: pointer; }
.woocommerce-form__label-for-checkbox input[type=checkbox] { flex: 0 0 auto; width: 18px; height: 18px; margin: 2px 0 0; accent-color: var(--red); }
.store-form .woocommerce-terms-and-conditions-wrapper p.form-row { margin: 22px 0 0; }
.woocommerce-terms-and-conditions { max-height: 200px; overflow: auto; margin: 15px 0; padding: 18px; border: 1px solid var(--line); font-size: 14px; line-height: 1.8; color: #666; }
.woocommerce-terms-and-conditions-link { text-decoration: underline; text-underline-offset: 3px; }

/* Delivery options. */
.woocommerce-shipping-methods { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--line); }
.woocommerce-shipping-methods li { display: flex; gap: 12px; align-items: center; padding: 15px 0; border-bottom: 1px solid var(--line); font-size: 14px; line-height: 1.6; }
.woocommerce-shipping-methods input[type=radio] { flex: 0 0 auto; width: 18px; height: 18px; margin: 0; accent-color: var(--red); }
.woocommerce-shipping-methods label { cursor: pointer; }
.woocommerce-shipping-methods .tax_label { color: #666; font-size: 12px; }

/* Payment methods. */
.wc_payment_methods { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--line); }
.wc_payment_methods > li { padding: 16px 0; border-bottom: 1px solid var(--line); font-size: 14px; line-height: 1.6; }
.wc_payment_methods > li > input[type=radio] { width: 18px; height: 18px; margin: 0; vertical-align: middle; accent-color: var(--red); }
.wc_payment_methods > li > label { display: inline-flex; flex-wrap: wrap; gap: 8px; align-items: center; margin-inline-start: 10px; font-size: 15px; font-weight: 600; cursor: pointer; vertical-align: middle; }
.wc_payment_methods > li > input[type=radio][style*="none"] + label { margin-inline-start: 0; }
.wc_payment_methods label img { max-height: 24px; width: auto; }
.wc_payment_methods .payment_box { margin-top: 14px; padding: 18px; background: #f7f7f5; border: 1px solid var(--line); font-size: 14px; line-height: 1.8; color: #666; }
.store-form .payment_box p, .summary-card .payment_box p { margin: 0 0 10px; font-size: 14px; }
.store-form .payment_box p:last-child, .summary-card .payment_box p:last-child { margin-bottom: 0; }
.payment_box fieldset { border: 0; margin: 0; padding: 0; }
.payment_box .form-row { margin: 12px 0 0; }
.payment_box label { display: block; font-size: 14px; margin-bottom: 9px; color: var(--black); }
.payment_box .input-text, .payment_box select { width: 100%; padding: 13px 12px; font-size: 16px; border: 1px solid #ccc; border-radius: 0; background: white; color: #111; min-height: 48px; }
.wc_payment_methods .lx-methods-empty { color: #666; font-weight: 400; }

/* Place order / pay button. */
.store-form .place-order { margin-top: 22px; }
.store-form #place_order { margin-top: 15px; }
.store-form .policy-links { margin: 15px 0 0; }
.summary-card #payment { margin-top: 24px; }
.summary-card #payment .form-row { margin-top: 20px; }
.summary-card #place_order { width: 100%; }

/* Order confirmation: items, totals and gateway details inside the panel. */
.confirmation-items { max-width: 650px; margin: 0 0 30px; }
.confirmation-items h3 { font-size: 16px; margin-bottom: 10px; }
.confirmation-items .summary-line:last-child { border-bottom: 0; }
.confirmation-panel h2 + .order-meta { margin-top: 30px; }
.confirmation-panel > section, .confirmation-panel .woocommerce-bacs-bank-details { max-width: 650px; margin: 0 0 30px; }
.confirmation-panel > section h2, .confirmation-panel .wc-bacs-bank-details-heading { font-size: 20px; margin-bottom: 12px; }
.confirmation-panel .wc-bacs-bank-details-account-name { font-size: 16px; margin: 15px 0 8px; }
.confirmation-panel ul.wc-bacs-bank-details, .confirmation-panel ul.order_details { list-style: none; padding: 0; margin: 0; }
.confirmation-panel ul.wc-bacs-bank-details li, .confirmation-panel ul.order_details li { padding: 10px 0; border-bottom: 1px solid var(--line); font-size: 14px; color: #666; }
.confirmation-panel ul.wc-bacs-bank-details strong, .confirmation-panel ul.order_details strong { display: block; color: var(--black); margin-top: 4px; }
.confirmation-panel > p + p { margin-top: 15px; }

/* Order pay. */
.order-pay-items h2 { margin-bottom: 15px; }
.order-pay-items .summary-line:last-child { border-bottom: 0; }
.order-pay-layout .summary-card .summary-total { border-bottom: 1px solid var(--line); }

@media (max-width: 600px) {
	.form-field select { padding: 12px 10px; }
	.woocommerce-checkout form.login, .woocommerce-checkout form.checkout_coupon { padding: 23px; }
	.confirmation-panel > .text-link { margin: 25px 0 0; }
}