/*
 * Hotel.Report Academy — shop styles (cart, checkout, order confirmation).
 * Consumes design tokens only; loaded on those pages by includes/assets.php.
 */

.woocommerce-checkout h3,
.woocommerce-checkout #order_review_heading { font-family: var(--hr-font-display); font-weight: 400; color: var(--hr-ink); }

.woocommerce-checkout .form-row label { color: var(--hr-ink); font-weight: 700; }
.woocommerce-checkout .form-row .optional { color: var(--hr-ink-muted); font-weight: 400; }

.woocommerce-checkout .form-row input.input-text,
.woocommerce-checkout .form-row select,
.woocommerce-checkout .select2-container--default .select2-selection--single {
	border: 1px solid var(--hr-border); border-radius: var(--hr-radius); background: var(--hr-canvas); color: var(--hr-ink);
}
.woocommerce-checkout .form-row input.input-text:focus,
.woocommerce-checkout .form-row select:focus { border-color: var(--hr-primary); outline: 2px solid var(--hr-primary); outline-offset: 0; }

/* Order summary and payment methods sit on the surface colour. */
.woocommerce-checkout #order_review,
.woocommerce-checkout #payment { background: var(--hr-surface); border-radius: var(--hr-radius); }
.woocommerce-checkout #payment div.payment_box { background: var(--hr-soft); color: var(--hr-ink-muted); }
.woocommerce-checkout #payment div.payment_box::before { border-bottom-color: var(--hr-soft); }
.woocommerce-checkout #payment ul.payment_methods { border-bottom: 1px solid var(--hr-border); }

.woocommerce-checkout #place_order,
.woocommerce-cart .checkout-button {
	background: var(--hr-primary); color: var(--hr-on-primary); border-radius: var(--hr-radius); font-weight: 700;
}
.woocommerce-checkout #place_order:hover,
.woocommerce-cart .checkout-button:hover { background: var(--hr-primary-hover); color: var(--hr-on-primary); }

/* Order confirmation. */
.hr-thankyou { max-width: 40rem; margin: 0 auto; padding: 2rem 0; }
.hr-thankyou__title { font-family: var(--hr-font-display); font-weight: 400; color: var(--hr-ink); margin: 0 0 1rem; }
.hr-thankyou__text { color: var(--hr-ink-muted); margin: 0 0 1.5rem; }
.hr-thankyou__button {
	display: inline-block; padding: .75rem 1.5rem; border-radius: var(--hr-radius);
	background: var(--hr-primary); color: var(--hr-on-primary); font-weight: 700; text-decoration: none;
}
.hr-thankyou__button:hover,
.hr-thankyou__button:focus { background: var(--hr-primary-hover); color: var(--hr-on-primary); }