/*
 * Cart, checkout and account pages: restyled in the Desert Cream tokens
 * (cream cards, pill buttons, arched thumbnails, bordered radios) but
 * kept as WooCommerce's own standard two-page flow and field layout, as
 * agreed — not a pixel-for-pixel rebuild of the single-page 1f/2c mockup.
 * Targets WooCommerce's documented class names so this survives
 * WooCommerce core updates.
 */

.woocommerce form .form-row { margin-bottom: 12px; }
.woocommerce form .form-row label { font-size: 13px; color: var(--sd-ink); font-weight: 600; margin-bottom: 6px; display: block; }
.woocommerce form .form-row .required { color: var(--sd-primary); text-decoration: none; }

.woocommerce form input.input-text,
.woocommerce form textarea,
.woocommerce form select,
.woocommerce-checkout .select2-container .select2-selection--single {
	background: var(--sd-card);
	border: 1px solid var(--sd-border-2);
	border-radius: var(--sd-radius-input);
	padding: 14px 16px;
	font-size: 14px;
	font-family: var(--sd-font-body);
	color: var(--sd-ink);
	width: 100%;
	height: auto;
}
.woocommerce form input.input-text:focus,
.woocommerce form select:focus { outline: none; border-color: var(--sd-primary); }

.woocommerce-cart .sd-plain-page,
.woocommerce-checkout .sd-plain-page,
.woocommerce-account .sd-plain-page { max-width: 1200px; padding: 40px var(--sd-gutter-desktop) 60px; }

/* Page heading, matching "Your Cart · 2 items" (1f) */
.woocommerce-cart h1.entry-title,
.sd-wc-heading {
	font-family: var(--sd-font-display); font-size: 32px; color: var(--sd-ink); font-weight: 400;
	margin: 0 0 26px;
}
.sd-wc-heading .count { font-size: 15px; color: var(--sd-muted); font-family: var(--sd-font-body); }

/* ── Cart table → card rows ───────────────────────────────────────── */

.woocommerce-cart-form table.cart,
.woocommerce-cart-form table.cart thead { border: none; background: none; }
.woocommerce-cart-form table.cart thead { display: none; }
.woocommerce-cart-form table.cart,
.woocommerce-cart-form table.cart tbody,
.woocommerce-cart-form table.cart tr,
.woocommerce-cart-form table.cart td { display: block; width: 100%; border: none; }

.woocommerce-cart-form table.cart tr.cart_item {
	display: flex; align-items: center; gap: 20px; flex-wrap: wrap;
	background: var(--sd-card); border: 1px solid var(--sd-border-14);
	border-radius: 14px; padding: 16px 20px; margin-bottom: 16px;
}
.woocommerce-cart-form table.cart td.product-remove { order: 5; }
.woocommerce-cart-form table.cart td.product-thumbnail {
	width: 76px; flex: none; padding: 0;
}
.woocommerce-cart-form table.cart td.product-thumbnail img {
	width: 76px; height: 76px; object-fit: cover; border-radius: 38px 38px 8px 8px;
}
.woocommerce-cart-form table.cart td.product-name {
	flex: 1; min-width: 160px; padding: 0;
	font-family: var(--sd-font-display); font-size: 18px; color: var(--sd-ink);
}
.woocommerce-cart-form table.cart td.product-name .variation { font-family: var(--sd-font-body); font-size: 12.5px; color: var(--sd-muted); margin-top: 3px; }
.woocommerce-cart-form table.cart td.product-price { display: none; } /* subtotal column covers it */
.woocommerce-cart-form table.cart td.product-quantity { padding: 0; }
.woocommerce-cart-form table.cart td.product-subtotal {
	width: 110px; text-align: right; font-weight: 700; color: var(--sd-primary); font-size: 16px; padding: 0;
}

.woocommerce-cart-form .actions { display: flex; justify-content: flex-end; gap: 12px; margin-top: 8px; flex-wrap: wrap; }
.woocommerce-cart-form .coupon { display: flex; gap: 8px; flex: 1; }
.woocommerce-cart-form .coupon #coupon_code { max-width: 220px; }
.woocommerce-cart-form .actions button { border-radius: var(--sd-radius-pill); }

/* ── Order summary card (cart totals / checkout review) ──────────── */

.cart_totals, #order_review {
	background: var(--sd-card); border: 1px solid var(--sd-border); border-radius: var(--sd-radius-card-lg);
	padding: 28px; max-width: 380px; margin-left: auto;
}
.cart_totals h2, .woocommerce-checkout-review-order-table + h3,
.woocommerce-checkout .order-review-heading {
	font-family: var(--sd-font-display); font-size: 21px; color: var(--sd-ink); margin: 0 0 20px; font-weight: 400;
}
.cart_totals table, .woocommerce-checkout-review-order-table {
	width: 100%; border: none; background: none;
}
.cart_totals table th, .cart_totals table td,
.woocommerce-checkout-review-order-table th, .woocommerce-checkout-review-order-table td {
	border: none; padding: 0 0 10px; font-size: 14px; color: var(--sd-body);
}
.cart_totals .order-total td, .cart_totals .order-total th,
.woocommerce-checkout-review-order-table .order-total td, .woocommerce-checkout-review-order-table .order-total th {
	font-size: 18px; font-weight: 700; color: var(--sd-ink);
	border-top: 1px solid var(--sd-border); padding-top: 16px;
}
.cart_totals .shipping td, .woocommerce-checkout-review-order-table .shipping td { color: var(--sd-success-text); font-weight: 700; }
.wc-proceed-to-checkout a.checkout-button,
#place_order {
	display: block; width: 100%; text-align: center; background: var(--sd-primary); color: var(--sd-cream) !important;
	font-weight: 700; font-size: 16px; padding: 16px 0; border-radius: var(--sd-radius-pill); border: none; cursor: pointer;
}
.wc-proceed-to-checkout a.checkout-button:hover, #place_order:hover { background: var(--sd-primary-hover); }

/* Free-delivery notice chip, injected by the store plugin */
.sd-free-shipping-notice {
	font-size: 12px; color: var(--sd-primary); background: var(--sd-chip); border-radius: 8px;
	padding: 9px 12px; margin-bottom: 16px;
}
.sd-checkout-microcopy { text-align: center; font-size: 12px; color: var(--sd-muted); margin-top: 14px; }

/* ── Payment methods ──────────────────────────────────────────────── */

ul.wc_payment_methods { list-style: none; margin: 0 0 22px; padding: 0; display: flex; flex-direction: column; gap: 10px; }
li.wc_payment_method { border: 1.5px solid var(--sd-border-25); border-radius: 12px; padding: 13px 16px; }
li.wc_payment_method label { font-size: 14px; font-weight: 600; color: var(--sd-ink); display: flex; align-items: center; gap: 12px; cursor: pointer; }
li.wc_payment_method input[type="radio"] { appearance: none; width: 16px; height: 16px; border: 1.5px solid var(--sd-muted); border-radius: 50%; margin: 0; flex: none; }
li.wc_payment_method input[type="radio"]:checked { border: 5px solid var(--sd-primary); }
li.payment_method_cod,
li.wc_payment_method:has(input:checked) { border: 2px solid var(--sd-primary); background: var(--sd-cream); }
.payment_box { font-size: 13px; color: var(--sd-body); padding: 12px 0 0 28px; }
.woocommerce-checkout-payment { background: none; border: none; padding: 0; }

/* ── Order-status / notices ───────────────────────────────────────── */

.woocommerce-message, .woocommerce-error, .woocommerce-info {
	border-top-color: var(--sd-primary); background: var(--sd-card);
	border-radius: var(--sd-radius-input); padding: 14px 20px; font-size: 14px;
}
.woocommerce-message::before { color: var(--sd-primary); }

@media (max-width: 640px) {
	.woocommerce-cart .sd-plain-page,
	.woocommerce-checkout .sd-plain-page { padding: 16px 16px 100px; }
	.cart_totals, #order_review { max-width: none; margin: 0; }
	.woocommerce-cart-form table.cart td.product-thumbnail,
	.woocommerce-cart-form table.cart td.product-thumbnail img { width: 58px; height: 58px; }
}

/* ── Order confirmation (thank-you) page ──────────────────────────────
   Markup: woocommerce/checkout/thankyou.php. Not a mockup screen - built
   from the same tokens as the rest of the store. */

.sd-ty { max-width: 760px; margin: 0 auto; }

.sd-ty-hero { text-align: center; padding: 8px 0 30px; }
.sd-ty-mark {
	width: 76px; height: 88px; margin: 0 auto 18px;
	border-radius: 38px 38px 10px 10px; background: var(--sd-chip);
	border: 1px solid var(--sd-border-14);
	display: flex; align-items: center; justify-content: center;
	color: var(--sd-gold); font-size: 34px; line-height: 1;
}
.sd-ty-kicker { font-family: var(--sd-font-ar); font-size: 22px; color: var(--sd-gold); }
.sd-ty-title { font-size: 40px; margin: 6px 0 12px; }
.sd-ty-lead { font-size: 16px; line-height: 1.65; color: var(--sd-body); max-width: 520px; margin: 0 auto; }

.sd-ty-overview {
	display: grid; grid-template-columns: repeat(4, 1fr); gap: 1px;
	background: var(--sd-border); border: 1px solid var(--sd-border);
	border-radius: var(--sd-radius-card-lg); overflow: hidden; margin: 0 0 24px;
}
.sd-ty-overview > div { background: var(--sd-card); padding: 16px 18px; min-width: 0; }
.sd-ty-label {
	font-weight: 700; font-size: 11px; letter-spacing: .14em; text-transform: uppercase;
	color: var(--sd-muted); margin-bottom: 6px;
}
.sd-ty-value { font-weight: 700; font-size: 15px; color: var(--sd-ink); overflow-wrap: anywhere; }
.sd-ty-value--total { color: var(--sd-primary); }

.sd-ty-card {
	background: var(--sd-card); border: 1px solid var(--sd-border);
	border-radius: var(--sd-radius-card-lg); padding: 24px 28px; margin-bottom: 20px;
}
.sd-ty-card h2 { font-size: 21px; margin: 0 0 16px; }
.sd-ty-pay p, .sd-ty-pay li { font-size: 14px; color: var(--sd-body); line-height: 1.6; }
.sd-ty-pay p { margin: 0 0 10px; }
.sd-ty-pay p:last-child { margin-bottom: 0; }
.sd-ty-pay h2.wc-bacs-bank-details-heading, .sd-ty-pay .wc-bacs-bank-details-heading { font-size: 16px; margin: 14px 0 8px; }
.sd-ty-pay ul { margin: 0 0 10px; padding-left: 18px; }

.sd-ty-steps { list-style: none; margin: 0; padding: 0; counter-reset: sd-step; }
.sd-ty-steps li { position: relative; padding: 0 0 20px 50px; counter-increment: sd-step; }
.sd-ty-steps li:last-child { padding-bottom: 0; }
.sd-ty-steps li::before {
	content: counter(sd-step); position: absolute; left: 0; top: 0;
	width: 32px; height: 32px; border-radius: 50%; background: var(--sd-chip);
	color: var(--sd-primary); font-weight: 700; font-size: 14px;
	display: flex; align-items: center; justify-content: center;
}
.sd-ty-steps li:not(:last-child)::after {
	content: ""; position: absolute; left: 15.5px; top: 38px; bottom: 6px;
	width: 1px; background: var(--sd-border-2);
}
.sd-ty-steps strong { display: block; color: var(--sd-ink); font-size: 15px; margin-bottom: 2px; }
.sd-ty-steps span { font-size: 14px; color: var(--sd-body); line-height: 1.55; }

/* WooCommerce's own order-details table and address blocks, restyled */
.sd-ty-details section { margin: 0; }
.sd-ty-details .woocommerce-order-details,
.sd-ty-details .woocommerce-customer-details {
	background: var(--sd-card); border: 1px solid var(--sd-border);
	border-radius: var(--sd-radius-card-lg); padding: 24px 28px; margin-bottom: 20px;
}
.sd-ty-details h2 { font-family: var(--sd-font-display); font-weight: 400; font-size: 21px; color: var(--sd-ink); margin: 0 0 16px; }
.sd-ty-details h2.woocommerce-column__title { font-size: 17px; margin-bottom: 8px; }
.sd-ty-details table.shop_table { width: 100%; border: none; border-collapse: collapse; margin: 0; background: none; }
.sd-ty-details table.shop_table th,
.sd-ty-details table.shop_table td {
	border: none; border-top: 1px solid var(--sd-border); padding: 12px 0;
	font-size: 14px; color: var(--sd-body); text-align: left; background: none;
}
.sd-ty-details table.shop_table thead th {
	border-top: none; padding-top: 0; font-size: 11px; letter-spacing: .14em;
	text-transform: uppercase; color: var(--sd-muted);
}
.sd-ty-details table.shop_table td:last-child,
.sd-ty-details table.shop_table th:last-child { text-align: right; }
.sd-ty-details table.shop_table td.product-name a { color: var(--sd-ink); font-family: var(--sd-font-display); font-size: 16px; }
.sd-ty-details table.shop_table tfoot tr:last-child th,
.sd-ty-details table.shop_table tfoot tr:last-child td { font-size: 17px; font-weight: 700; color: var(--sd-ink); }
.sd-ty-details .woocommerce-columns--addresses { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
.sd-ty-details .woocommerce-columns--addresses::before,
.sd-ty-details .woocommerce-columns--addresses::after { display: none; }
.sd-ty-details .woocommerce-column { width: auto; float: none; }
.woocommerce-order .sd-ty-details address { font-style: normal; font-size: 14px; line-height: 1.65; color: var(--sd-body); border: 0; padding: 0; margin: 0; }

.sd-ty-actions { display: flex; gap: 12px; justify-content: center; flex-wrap: wrap; margin-top: 28px; }
.sd-ty-actions .sd-btn { min-width: 210px; }

@media (max-width: 640px) {
	.sd-ty-title { font-size: 30px; }
	.sd-ty-overview { grid-template-columns: 1fr 1fr; }
	.sd-ty-card,
	.sd-ty-details .woocommerce-order-details,
	.sd-ty-details .woocommerce-customer-details { padding: 20px; }
	.sd-ty-details .woocommerce-columns--addresses { grid-template-columns: 1fr; gap: 16px; }
	.sd-ty-actions .sd-btn { width: 100%; }
}
