/* ---------------------------------------------------------------------------
   Cart, checkout and My Account.

   These pages run on WooCommerce's own shortcode markup (a deliberate source
   exception recorded in PROJECT-BRIEF.md — the source's checkout plugins are
   not copied), so this file styles Woo's classes rather than replacing them.
   --------------------------------------------------------------------------- */

.nx-store { padding-bottom: 30px; }

.nx-store__title {
	margin: 0 0 24px;
	font-size: var(--nx-h2);
	color: var(--nx-navy);
}

/* --- Notices ------------------------------------------------------------- */

.woocommerce-message,
.woocommerce-info,
.woocommerce-error {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 10px 16px;
	margin: 0 0 22px;
	padding: 14px 18px;
	border: 0;
	border-left: 4px solid var(--nx-purple);
	border-radius: var(--nx-radius);
	background: var(--nx-pale);
	color: var(--nx-ink);
	font-size: 14.5px;
	line-height: 1.6;
	list-style: none;
}
.woocommerce-message::before,
.woocommerce-info::before,
.woocommerce-error::before { display: none; }

.woocommerce-error { border-left-color: var(--nx-danger); background: #fdf3f3; color: #7a2b28; }
.woocommerce-message { border-left-color: var(--nx-success); background: #f1f8f2; }

.woocommerce-message .button,
.woocommerce-info .button { margin-left: auto; }

/* --- Tables -------------------------------------------------------------- */

.woocommerce table.shop_table {
	width: 100%;
	border: 1px solid var(--nx-rule);
	border-radius: var(--nx-radius-lg);
	border-collapse: separate;
	border-spacing: 0;
	overflow: hidden;
	font-size: 14.5px;
}

.woocommerce table.shop_table th {
	padding: 14px 16px;
	background: var(--nx-pale);
	font-family: var(--nx-font-body);
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--nx-navy);
	text-align: left;
	border: 0;
}

.woocommerce table.shop_table td {
	padding: 16px;
	border: 0;
	border-top: 1px solid var(--nx-rule);
	vertical-align: middle;
}

.woocommerce table.shop_table img { width: 64px; height: auto; border-radius: 4px; }

.woocommerce table.cart td.product-name a { color: var(--nx-ink); font-weight: 500; }
.woocommerce table.cart td.product-name a:hover { color: var(--nx-purple); }

.woocommerce a.remove {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 24px;
	height: 24px;
	border-radius: 50%;
	background: var(--nx-pale);
	color: var(--nx-danger) !important;
	font-size: 16px;
	line-height: 1;
	text-decoration: none;
}
.woocommerce a.remove:hover { background: var(--nx-danger); color: #fff !important; }

/* --- Cart totals --------------------------------------------------------- */

.cart-collaterals { margin-top: 34px; }

.cart_totals h2 {
	margin-bottom: 14px;
	font-size: 22px;
	color: var(--nx-navy);
}

.cart_totals table.shop_table th { width: 45%; background: transparent; }
.cart_totals table.shop_table td { text-align: right; }

.nx-min-order th {
	background: #fdf3f3 !important;
	color: #7a2b28 !important;
	font-size: 13px !important;
	font-weight: 600 !important;
	letter-spacing: 0 !important;
	text-transform: none !important;
	text-align: left;
	border-top: 1px solid var(--nx-rule);
}

.wc-proceed-to-checkout { margin-top: 16px; }
.wc-proceed-to-checkout .checkout-button { width: 100%; }

.woocommerce .cart-collaterals .cart_totals { width: 100%; float: none; max-width: 460px; margin-left: auto; }

.coupon { display: flex; gap: 10px; flex-wrap: wrap; }
.coupon input[type="text"] { flex: 1 1 200px; }

/* --- Checkout ------------------------------------------------------------ */

.woocommerce-checkout .col2-set { display: grid; grid-template-columns: minmax(0, 1fr); gap: 0; }
.woocommerce-checkout .col2-set .col-1,
.woocommerce-checkout .col2-set .col-2 { width: 100%; float: none; }

#customer_details { margin-bottom: 34px; }

.woocommerce-billing-fields h3,
.woocommerce-additional-fields h3,
#order_review_heading {
	margin: 0 0 16px;
	font-size: 22px;
	color: var(--nx-navy);
}

.woocommerce form .form-row {
	display: flex;
	flex-direction: column;
	gap: 5px;
	margin: 0 0 16px;
	padding: 0;
}

.woocommerce form .form-row label {
	font-size: 13px;
	font-weight: 600;
	color: var(--nx-ink);
}

.woocommerce form .form-row .required {
	color: var(--nx-danger);
	text-decoration: none;
	border: 0;
}

.woocommerce form .form-row.woocommerce-invalid input,
.woocommerce form .form-row.woocommerce-invalid select,
.woocommerce form .form-row.woocommerce-invalid .select2-container--default .select2-selection--single {
	border-color: var(--nx-danger);
}

.woocommerce form .form-row-first,
.woocommerce form .form-row-last { width: 100%; float: none; }

@media (min-width: 600px) {
	.woocommerce form .form-row-first,
	.woocommerce form .form-row-last { width: calc(50% - 8px); display: inline-flex; }
	.woocommerce form .form-row-first { margin-right: 16px; }
}

.select2-container--default .select2-selection--single {
	height: auto;
	padding: 6px 4px;
	border: 1px solid var(--nx-rule);
	border-radius: var(--nx-radius);
	font-family: var(--nx-font-form);
}
.select2-container--default .select2-selection--single .select2-selection__arrow { top: 8px; }

/* --- Order review + payment box ------------------------------------------ */

.woocommerce-checkout-review-order {
	padding: 22px;
	border: 1px solid var(--nx-rule);
	border-radius: var(--nx-radius-lg);
	background: var(--nx-white);
}

.woocommerce-checkout-review-order table.shop_table { border: 0; border-radius: 0; }
.woocommerce-checkout-review-order table.shop_table th { background: transparent; }
.woocommerce-checkout-review-order table.shop_table td { text-align: right; }
.woocommerce-checkout-review-order table.shop_table td.product-name { text-align: left; }
/* Measured: the order total is 16px/400 in ink, not a bold navy figure. */
/* Woo ships `.woocommerce table.shop_table tfoot td { font-weight:700 }` at
   (0,3,2); a plainer selector loses and the total stays bold. */
.woocommerce table.shop_table tfoot tr.order-total td,
.woocommerce-checkout-review-order tfoot .order-total td,
.woocommerce .order-total td {
	font-size: 16px;
	font-weight: 400;
	color: var(--nx-ink);
}

/* Woo ships `.woocommerce #payment { background:#ebe9eb }` and
   `.woocommerce #payment div.payment_box { background:#dfdcde }`. Matching its
   selector specificity is required — a bare `#payment` rule loses and the whole
   crypto area keeps painting on Woo's grey. */
.woocommerce #payment,
.woocommerce-page #payment {
	margin-top: 20px;
	padding: 0;
	border-radius: 0;
	background: transparent;
}

.woocommerce #payment ul.payment_methods,
.woocommerce-page #payment ul.payment_methods {
	margin: 0;
	padding: 0 0 18px;
	border: 0;
	border-bottom: 1px solid var(--nx-rule);
	background: transparent;
	list-style: none;
}

#payment ul.payment_methods li { margin: 0; }

#payment ul.payment_methods label {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font-family: var(--nx-font-body);
	font-size: 16px;
	font-weight: 700;
	color: var(--nx-ink);
}

.woocommerce #payment div.payment_box,
.woocommerce-page #payment div.payment_box {
	margin: 14px 0 0;
	padding: 0;
	background: transparent;
	color: inherit;
	font-size: inherit;
	line-height: inherit;
}
.woocommerce #payment div.payment_box::before,
.woocommerce-page #payment div.payment_box::before { display: none; }

.woocommerce #payment .place-order,
.woocommerce-page #payment .place-order { padding: 18px 0 0; background: transparent; }
#payment #place_order { width: 100%; padding: 16px 26px; font-size: 15px; }

.woocommerce-terms-and-conditions-wrapper { margin-bottom: 14px; font-size: 13px; }

/* --- Thank you ----------------------------------------------------------- */

.woocommerce-order { max-width: 900px; }

.woocommerce-thankyou-order-received {
	margin-bottom: 22px;
	font-family: var(--nx-font-heading);
	font-size: 26px;
	color: var(--nx-navy);
}

ul.woocommerce-order-overview {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
	gap: 14px;
	margin: 0 0 30px;
	padding: 20px;
	border: 1px solid var(--nx-rule);
	border-radius: var(--nx-radius-lg);
	background: var(--nx-pale);
	list-style: none;
}
ul.woocommerce-order-overview li {
	border: 0;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--nx-muted);
}
ul.woocommerce-order-overview li strong {
	display: block;
	margin-top: 5px;
	font-size: 15px;
	font-weight: 700;
	letter-spacing: 0;
	text-transform: none;
	color: var(--nx-ink);
}

/* --- My Account ---------------------------------------------------------- */

.woocommerce-account .woocommerce {
	display: grid;
	grid-template-columns: 240px minmax(0, 1fr);
	gap: 34px;
	align-items: start;
}
.woocommerce-account.woocommerce-page:not(.logged-in) .woocommerce { display: block; }

.woocommerce-MyAccount-navigation {
	width: auto;
	float: none;
	padding: 8px;
	border: 1px solid var(--nx-rule);
	border-radius: var(--nx-radius-lg);
	background: var(--nx-white);
}

.woocommerce-MyAccount-navigation ul { margin: 0; padding: 0; list-style: none; }

.woocommerce-MyAccount-navigation li a {
	display: block;
	padding: 11px 14px;
	border-radius: var(--nx-radius);
	font-size: 14.5px;
	font-weight: 600;
	color: var(--nx-ink);
}
.woocommerce-MyAccount-navigation li a:hover { background: var(--nx-pale); color: var(--nx-purple); }
.woocommerce-MyAccount-navigation li.is-active a { background: var(--nx-purple); color: var(--nx-white); }

.woocommerce-MyAccount-content { width: auto; float: none; }

.woocommerce-form-login,
.woocommerce-form-register {
	padding: 26px;
	border: 1px solid var(--nx-rule);
	border-radius: var(--nx-radius-lg);
}

.woocommerce-form-login__rememberme { display: inline-flex; align-items: center; gap: 8px; }

.woocommerce .col2-set#customer_login {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
	gap: 26px;
}

/* --- Breakpoints --------------------------------------------------------- */

@media (max-width: 900px) {
	.woocommerce-account .woocommerce { grid-template-columns: minmax(0, 1fr); gap: 22px; }
}

@media (max-width: 767px) {
	.woocommerce table.shop_table { font-size: 13.5px; }
	.woocommerce table.shop_table th,
	.woocommerce table.shop_table td { padding: 11px 10px; }
	.woocommerce table.shop_table img { width: 48px; }
	.woocommerce .cart-collaterals .cart_totals { max-width: none; }
	.woocommerce-checkout-review-order { padding: 16px; }
}

/* ---------------------------------------------------------------------------
   MEASURED CORRECTIONS  (tools/diff-styles.mjs, against the logged-in capture)

   These sit at the end of the file on purpose: they override the earlier rules
   in this stylesheet and the shared button rule in base.css, which were written
   from judgement rather than measurement.
   --------------------------------------------------------------------------- */

/* --- Cart ---------------------------------------------------------------- */

.woocommerce table.shop_table { font-size: 14px; }

/* Source header cells: 16px ink on a transparent ground, no capitalisation. */
.woocommerce table.shop_table th {
	background: transparent;
	font-size: 16px;
	color: var(--nx-ink);
	letter-spacing: normal;
	text-transform: none;
}

.woocommerce table.cart td.product-name a {
	font-size: 16px;
	color: var(--nx-purple);
}

/* The remove control is a plain round glyph in ink, not a red chip. */
.woocommerce a.remove {
	background: transparent;
	color: var(--nx-ink) !important;
	font-size: 18px;
	border-radius: 100%;
}
.woocommerce a.remove:hover {
	background: var(--nx-purple);
	color: var(--nx-white) !important;
}

.cart_totals h2 {
	font-size: 19px;
	color: var(--nx-purple);
}

/* --- Buttons -------------------------------------------------------------
   Astra's own values: radius 3px, weight 400. base.css had 6px/600 from
   judgement. Sizes are per-context: 18px on the cart's proceed button. */

.woocommerce .checkout-button,
.woocommerce a.button.checkout-button {
	border-radius: 3px;
	font-size: 18px;
	font-weight: 400;
}

.woocommerce #place_order,
.woocommerce #payment #place_order {
	border-radius: 3px;
	font-weight: 400;
}

/* --- Checkout form -------------------------------------------------------- */

.woocommerce-checkout .form-row label,
.woocommerce form .form-row label {
	font-size: 16px;
	font-weight: 400;
}

/* Input sizing/radius/colour live in base.css — see the note there on why. */

/* --- My Account ----------------------------------------------------------
   The source marks the current item with colour alone — accent purple text on
   a transparent ground. The filled purple pill was mine. */

.woocommerce-MyAccount-navigation li a,
.woocommerce-MyAccount-navigation-link a {
	font-size: 16px;
	font-weight: 500;
	color: var(--nx-purple);
}

.woocommerce-MyAccount-navigation li.is-active a,
.woocommerce-MyAccount-navigation-link.is-active a {
	background: transparent;
	color: var(--nx-purple);
	font-weight: 500;
}

.woocommerce-MyAccount-navigation li a:hover,
.woocommerce-MyAccount-navigation-link a:hover {
	background: var(--nx-pale);
	color: var(--nx-purple-deep);
}

.woocommerce-MyAccount-content { color: var(--nx-ink); }
