/*
 * Solid Series — WooCommerce styling.
 *
 * WC ships its own default CSS for cart, checkout, my-account, and
 * single-product pages. This layer overrides the visual defaults so
 * the conversion path stays on-brand. We do not override WC's templates
 * (PHP) — only the styles. If specific markup needs to change, add
 * a /woocommerce/ template override at that point.
 *
 * Targets pages identifiable by body class: .woocommerce-cart,
 * .woocommerce-checkout, .woocommerce-account, .single-product.
 */

/* ──────── Layout container ──────── */
.woocommerce-cart .wp-block-post-content,
.woocommerce-checkout .wp-block-post-content,
.woocommerce-account .wp-block-post-content,
.single-product .wp-block-post-content {
	max-width: 1280px;
	margin: 0 auto;
	padding: 64px 32px;
	font-family: var(--wp--preset--font-family--hanken-grotesk);
	color: var(--wp--preset--color--ink-black);
}

/* ──────── Page titles ──────── */
.woocommerce-cart .wp-block-post-title,
.woocommerce-checkout .wp-block-post-title,
.woocommerce-account .wp-block-post-title,
.single-product .wp-block-post-title,
.woocommerce h1.entry-title,
.woocommerce h2 {
	font-family: var(--wp--preset--font-family--hanken-grotesk);
	font-weight: 900;
	text-transform: uppercase;
	letter-spacing: -0.02em;
	line-height: 0.95;
	color: var(--wp--preset--color--ink-black);
}

/* ──────── Buttons ──────── */
.woocommerce a.button,
.woocommerce-page a.button,
.woocommerce button.button,
.woocommerce-page button.button,
.woocommerce input.button,
.woocommerce-page input.button,
.woocommerce #respond input#submit,
.woocommerce-page #respond input#submit,
.woocommerce #content input.button,
.woocommerce-page #content input.button {
	background: var(--wp--preset--color--solid-navy);
	color: var(--wp--preset--color--mat-white);
	font-family: var(--wp--preset--font-family--hanken-grotesk);
	font-weight: 800;
	text-transform: uppercase;
	letter-spacing: 0.18em;
	font-size: 13px;
	border: 0;
	border-radius: 0;
	padding: 16px 26px;
	box-shadow: 5px 5px 0 0 var(--wp--preset--color--ink-black);
	transition: background 120ms;
	text-decoration: none;
	display: inline-flex;
	align-items: center;
	justify-content: center;
}
.woocommerce a.button:hover,
.woocommerce-page a.button:hover,
.woocommerce button.button:hover,
.woocommerce-page button.button:hover,
.woocommerce input.button:hover,
.woocommerce-page input.button:hover {
	background: var(--wp--preset--color--deep-navy);
	color: var(--wp--preset--color--mat-white);
}

.woocommerce a.button.alt,
.woocommerce-page a.button.alt,
.woocommerce button.button.alt,
.woocommerce-page button.button.alt,
.woocommerce input.button.alt,
.woocommerce-page input.button.alt,
.woocommerce #respond input#submit.alt,
.woocommerce-page #respond input#submit.alt {
	background: var(--wp--preset--color--ink-black);
	color: var(--wp--preset--color--mat-white);
	box-shadow: 5px 5px 0 0 var(--wp--preset--color--solid-navy);
}
.woocommerce a.button.alt:hover,
.woocommerce-page a.button.alt:hover,
.woocommerce button.button.alt:hover,
.woocommerce-page button.button.alt:hover {
	background: var(--wp--preset--color--solid-navy);
}

/* ──────── Inputs ──────── */
.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea,
.woocommerce form .form-row select,
.woocommerce-page form .form-row input.input-text,
.woocommerce-page form .form-row textarea,
.woocommerce-page form .form-row select,
.woocommerce input[type="text"],
.woocommerce input[type="email"],
.woocommerce input[type="tel"],
.woocommerce input[type="password"],
.woocommerce input[type="number"],
.woocommerce textarea,
.woocommerce select {
	background: var(--wp--preset--color--mat-white);
	border: 2px solid var(--wp--preset--color--ink-black);
	border-radius: 0;
	padding: 14px 18px;
	font-family: var(--wp--preset--font-family--hanken-grotesk);
	font-size: 16px;
	font-weight: 600;
	color: var(--wp--preset--color--ink-black);
	min-height: 52px;
	box-sizing: border-box;
	transition: border-color 120ms;
}
.woocommerce form .form-row input.input-text:focus,
.woocommerce form .form-row textarea:focus,
.woocommerce form .form-row select:focus {
	outline: none;
	border-color: var(--wp--preset--color--solid-navy);
}

.woocommerce form .form-row label {
	font-family: var(--wp--preset--font-family--hanken-grotesk);
	font-weight: 800;
	font-size: 12px;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	color: var(--wp--preset--color--ink-black);
	margin-bottom: 8px;
	display: block;
}

/* ──────── Notices ──────── */
.woocommerce-notices-wrapper .woocommerce-message,
.woocommerce-notices-wrapper .woocommerce-info,
.woocommerce-notices-wrapper .woocommerce-error,
.woocommerce .woocommerce-message,
.woocommerce .woocommerce-info,
.woocommerce .woocommerce-error {
	background: var(--wp--preset--color--bone);
	border-top: 2px solid var(--wp--preset--color--solid-navy);
	border-left: 0;
	border-right: 0;
	border-bottom: 0;
	border-radius: 0;
	padding: 18px 24px;
	font-family: var(--wp--preset--font-family--hanken-grotesk);
	font-weight: 600;
	color: var(--wp--preset--color--ink-black);
}
.woocommerce .woocommerce-error {
	border-top-color: #B91C1C;
}
.woocommerce-message::before,
.woocommerce-info::before,
.woocommerce-error::before {
	color: var(--wp--preset--color--solid-navy);
}

/* ──────── Cart + checkout tables ──────── */
.woocommerce table.shop_table,
.woocommerce-page table.shop_table {
	border: 0;
	border-top: 2px solid var(--wp--preset--color--ink-black);
	border-collapse: collapse;
	border-radius: 0;
	font-family: var(--wp--preset--font-family--hanken-grotesk);
}
.woocommerce table.shop_table th {
	font-weight: 900;
	font-size: 12px;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	padding: 18px 12px;
	border-bottom: 1px solid var(--wp--preset--color--ink-black);
	color: var(--wp--preset--color--ink-black);
}
.woocommerce table.shop_table td {
	padding: 18px 12px;
	border-top: 1px solid rgba(11, 14, 20, 0.18);
	font-weight: 600;
}
.woocommerce table.shop_table tfoot th,
.woocommerce table.shop_table tfoot td {
	border-top: 2px solid var(--wp--preset--color--ink-black);
	background: var(--wp--preset--color--bone);
}

/* ──────── Single product page ──────── */
.single-product div.product .product_title {
	font-family: var(--wp--preset--font-family--hanken-grotesk);
	font-weight: 900;
	font-size: clamp(36px, 5vw, 56px);
	text-transform: uppercase;
	letter-spacing: -0.02em;
	line-height: 0.95;
	color: var(--wp--preset--color--ink-black);
	margin-bottom: 18px;
}
.single-product div.product p.price,
.single-product div.product span.price {
	font-family: var(--wp--preset--font-family--hanken-grotesk);
	font-weight: 900;
	font-size: 36px;
	color: var(--wp--preset--color--solid-navy);
	font-feature-settings: "tnum" 1, "lnum" 1;
	letter-spacing: -0.02em;
}
.single-product .quantity input.qty {
	width: 80px;
	text-align: center;
}

/* ──────── My Account ──────── */
.woocommerce-account .woocommerce-MyAccount-navigation ul {
	list-style: none;
	padding: 0;
	margin: 0 0 32px;
	border-top: 2px solid var(--wp--preset--color--ink-black);
}
.woocommerce-account .woocommerce-MyAccount-navigation ul li {
	border-bottom: 1px solid rgba(11, 14, 20, 0.18);
}
.woocommerce-account .woocommerce-MyAccount-navigation ul li a {
	display: block;
	padding: 16px 0;
	font-family: var(--wp--preset--font-family--hanken-grotesk);
	font-weight: 800;
	font-size: 13px;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	color: var(--wp--preset--color--ink-black);
	text-decoration: none;
}
.woocommerce-account .woocommerce-MyAccount-navigation ul li.is-active a {
	color: var(--wp--preset--color--solid-navy);
}

/* ──────── Coupon, payment, etc. fine details ──────── */
.woocommerce ul.payment_methods {
	border-top: 2px solid var(--wp--preset--color--ink-black);
	padding-top: 18px;
}
.woocommerce ul.payment_methods li {
	margin-bottom: 14px;
}
.woocommerce ul.payment_methods li label {
	font-family: var(--wp--preset--font-family--hanken-grotesk);
	font-weight: 800;
	font-size: 14px;
	letter-spacing: 0.06em;
	text-transform: uppercase;
}

.woocommerce-checkout #payment {
	background: var(--wp--preset--color--bone);
	padding: 24px;
	border-radius: 0;
}
.woocommerce-checkout #payment div.payment_box {
	background: var(--wp--preset--color--mat-white);
	border: 1px solid var(--wp--preset--color--ink-black);
	border-radius: 0;
	font-family: var(--wp--preset--font-family--hanken-grotesk);
	font-size: 14px;
}
.woocommerce-checkout #payment div.payment_box::before {
	display: none;
}

/* ──────── Single product — layout + breathing room ────────
 * Earlier passes tried to flip this page to a navy bg with white text,
 * but the rules targeted legacy WC markup (.related.products, .product_title,
 * .wp-block-post-content) that the modern block-based WC product template
 * doesn't render — so the bg never painted while .wp-block-post-title still
 * matched the card <h3>s, leaving white-on-white card titles. Page stays
 * on the theme.json default (white bg / ink-black text); these rules just
 * add brand polish and fix the bits theme.json can't reach. */
.single-product .wp-block-group.product {
	padding-top: clamp(40px, 6vw, 80px);
	padding-bottom: clamp(40px, 6vw, 96px);
}

/* Main product price — modern block markup. */
.single-product .wp-block-woocommerce-product-price .wc-block-components-product-price,
.single-product .wp-block-woocommerce-product-price .woocommerce-Price-amount {
	font-family: var(--wp--preset--font-family--hanken-grotesk);
	font-weight: 900;
	font-size: 36px;
	color: var(--wp--preset--color--solid-navy);
	letter-spacing: -0.02em;
	font-feature-settings: "tnum" 1, "lnum" 1;
}
.single-product .wp-block-woocommerce-product-price {
	margin: 12px 0 8px;
}

/* Short description sits between the price and the Add to Cart. */
.single-product .wp-block-post-excerpt {
	margin: 12px 0 28px;
}
.single-product .wp-block-post-excerpt p {
	font-size: var(--wp--preset--font-size--body-large);
	line-height: 1.45;
	color: var(--wp--preset--color--ink-black);
	margin: 0;
}

/* Spectator-ticket variation <select> — match the input system. */
.single-product table.variations select {
	background: var(--wp--preset--color--mat-white);
	color: var(--wp--preset--color--ink-black);
	border: 2px solid var(--wp--preset--color--ink-black);
	border-radius: 0;
	padding: 10px 14px;
	min-height: 44px;
	font-family: var(--wp--preset--font-family--hanken-grotesk);
	font-weight: 700;
}

/* ──────── Strip noise these two minimal products don't need ──────── */
/* "Home / Uncategorized / ..." breadcrumb — middle term is empty noise. */
.single-product .wp-block-breadcrumbs,
.single-product .wc-block-breadcrumbs {
	display: none;
}
/* "Category: Uncategorized" line under Add to Cart. */
.single-product .wp-block-woocommerce-product-meta {
	display: none;
}
/* Reviews tab + panel — reviews aren't enabled for these products,
 * so the tabs strip collapses to "Description" only (the H2 inside the
 * panel is enough on its own). */
.single-product .woocommerce-tabs ul.tabs {
	display: none;
}
.single-product #tab-reviews {
	display: none;
}

/* ──────── Related products — heading + cards (modern block markup) ──────── */
/* The block hardcodes "Related products" and ignores the
 * woocommerce_product_related_products_heading filter. We just style
 * the heading; the H2 text is left as-is. */
.single-product .wp-block-woocommerce-product-collection h2.wp-block-heading {
	color: var(--wp--preset--color--ink-black);
	font-family: var(--wp--preset--font-family--hanken-grotesk);
	font-weight: 900;
	text-transform: uppercase;
	letter-spacing: -0.02em;
	font-size: clamp(24px, 3vw, 32px) !important;
	line-height: 1.1 !important;
	margin-top: 56px;
	margin-bottom: 24px;
}
/* Card title + link. Card uses .wp-block-post-title, not the legacy
 * .woocommerce-loop-product__title. */
.single-product .wc-block-product-template .wp-block-post-title,
.single-product .wc-block-product-template .wp-block-post-title a {
	color: var(--wp--preset--color--ink-black);
	text-decoration: none;
}
.single-product .wc-block-product-template .wp-block-post-title a:hover {
	color: var(--wp--preset--color--solid-navy);
}
/* Card price. */
.single-product .wc-block-product-template .wc-block-components-product-price,
.single-product .wc-block-product-template .woocommerce-Price-amount {
	color: var(--wp--preset--color--solid-navy);
	font-weight: 800;
}

/* ──────── MT product only — hide the quantity field ────────
 * MT registration is sold_individually (qty input is already type=hidden
 * with max=1), so the .quantity wrapper adds nothing for the customer.
 * is-mt-product body class is added via body_class filter in
 * woocommerce-flows.php so this survives a product-ID change between
 * local / staging. */
body.is-mt-product .wp-block-woocommerce-add-to-cart-form .quantity {
	display: none;
}
/* Collapse the WC default 3-col grid so the button sits flush left
 * instead of leaving an empty quantity column. */
body.is-mt-product .wp-block-woocommerce-add-to-cart-form form.cart {
	display: block;
}
body.is-mt-product .wp-block-woocommerce-add-to-cart-form form.cart > .single_add_to_cart_button {
	justify-self: start;
}