/* Codeon Restaurant V2 — WooCommerce tweaks.
 *
 * CodeOrder owns the ordering flow, so this file stays deliberately small: it
 * aligns the surfaces Woo paints itself (products, cart, checkout tables,
 * notices) with the theme tokens. That alignment is what makes these pages
 * survive dark mode — Woo's own defaults are hard-coded light greys. */

.wc-page { padding: 80px 0; }
.wc-page .woocommerce-products-header { text-align: center; margin-bottom: 48px; }
.wc-page .woocommerce-products-header__title {
	margin: 0;
	color: var(--heading);
	font-family: var(--font-display);
	font-size: clamp(36px, 5vw, 64px);
	font-weight: 500;
}

/* ---------- Buttons ---------- */
.woocommerce ul.products li.product .button,
.woocommerce a.button, .woocommerce button.button,
.woocommerce input.button, .woocommerce #respond input#submit {
	padding: 12px 22px;
	border-radius: 999px;
	background: var(--brand);
	color: var(--on-brand);
	font-size: 12px;
	font-weight: 600;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover,
.woocommerce #respond input#submit:hover { background: var(--brand-deep); }
.woocommerce a.button.alt, .woocommerce button.button.alt, .woocommerce input.button.alt {
	background: var(--brand);
	color: var(--on-brand);
}
.woocommerce a.button.alt:hover, .woocommerce button.button.alt:hover { background: var(--brand-deep); }

/* ---------- Product listings ---------- */
.woocommerce ul.products li.product .woocommerce-loop-product__title {
	color: var(--heading);
	font-family: var(--font-display);
	font-weight: 500;
}
.woocommerce ul.products li.product .price,
.woocommerce div.product p.price,
.woocommerce div.product span.price { color: var(--heading); font-weight: 600; }
.woocommerce div.product .woocommerce-tabs ul.tabs li a { color: var(--ink-soft); }
.woocommerce div.product .product_title { color: var(--heading); font-family: var(--font-display); }

/* ---------- Tables (cart, order review, my account) ---------- */
.woocommerce table.shop_table,
.woocommerce table.shop_attributes {
	border-color: var(--line);
	border-radius: 12px;
	background: var(--surface);
	color: var(--ink);
}
.woocommerce table.shop_table th,
.woocommerce table.shop_table td { border-color: var(--line); color: inherit; }
.woocommerce table.shop_table thead th { color: var(--heading); }
.woocommerce .cart_totals table.shop_table td,
.woocommerce .cart_totals table.shop_table th { background: transparent; }
.woocommerce-cart .cart-collaterals .cart_totals,
.woocommerce .woocommerce-order-details,
.woocommerce .woocommerce-customer-details { color: var(--ink); }

/* ---------- Form fields ---------- */
.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea,
.woocommerce form .form-row select,
.woocommerce .select2-container--default .select2-selection--single {
	border: 1px solid var(--line);
	border-radius: 10px;
	background: var(--surface);
	color: var(--ink);
}
.woocommerce form .form-row label { color: var(--ink-soft); }
.woocommerce .select2-container--default .select2-selection--single .select2-selection__rendered { color: var(--ink); }
.woocommerce-input-wrapper input::placeholder { color: var(--muted); }

/* ---------- Panels & notices ---------- */
.woocommerce-checkout #payment,
.woocommerce .woocommerce-form-login,
.woocommerce .woocommerce-form-coupon,
.woocommerce-account .woocommerce-MyAccount-navigation ul {
	border: 1px solid var(--line);
	border-radius: 14px;
	background: var(--surface);
	color: var(--ink);
}
.woocommerce-checkout #payment div.payment_box {
	background: var(--surface-2);
	color: var(--ink-soft);
}
.woocommerce-checkout #payment div.payment_box::before {
	border-bottom-color: var(--surface-2);
}

.woocommerce-message,
.woocommerce-info,
.woocommerce-error {
	border-top-color: var(--brand);
	background: var(--surface-2);
	color: var(--ink);
}
.woocommerce-error { border-top-color: var(--danger-text); }
.woocommerce-message a, .woocommerce-info a { color: var(--brand-text); }