/*
Theme Name: Neotron Catalogue
Theme URI: https://dutyfree.brussels
Description: Child theme of Twenty Twenty-Five for Neotron SA's diplomatic and duty-free catalogue. Editorial rather than retail: ivory ground, deep tobacco text, a single brass accent, and large photography on a pale field. No badges, no countdowns, no sale styling, no carousel.
Author: Neotron SA
Template: twentytwentyfive
Version: 1.0.0
Requires at least: 6.5
Tested up to: 6.8
Requires PHP: 8.1
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: neotron-catalogue
*/

/*
 * Almost everything lives in theme.json. What remains here is what theme.json cannot
 * express: WooCommerce's own markup, which predates block styling and has to be reached
 * by class name.
 *
 * The rule followed throughout: remove rather than restyle. A duty-free supplier's
 * catalogue looks wrong the moment it grows a sale badge or a star rating, and deleting
 * those is more reliable than trying to make them tasteful.
 */

/* ---------------------------------------------------------------- Foundations */

:root {
	--neotron-ground: var(--wp--preset--color--base, #FCFAF6);
	--neotron-ink: var(--wp--preset--color--contrast, #2C231A);
	--neotron-brass: var(--wp--preset--color--accent, #9A7B3F);
	--neotron-surface: var(--wp--preset--color--surface, #F4EFE6);
	--neotron-line: var(--wp--preset--color--line, #E3DACB);
	--neotron-muted: var(--wp--preset--color--muted, #6B6053);
}

body {
	-webkit-font-smoothing: antialiased;
	text-rendering: optimizeLegibility;
}

/* A visible focus ring everywhere. The default outline disappears against ivory. */
:where(a, button, input, select, textarea, [tabindex]):focus-visible {
	outline: 2px solid var(--neotron-brass);
	outline-offset: 2px;
}

/* ---------------------------------------------------------------- Header */

.neotron-header {
	border-bottom: 1px solid var(--neotron-line);
}

.neotron-header__meta {
	font-size: 0.78rem;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--neotron-muted);
}

/* ---------------------------------------------------------------- Product grid */

.woocommerce ul.products,
.wc-block-grid__products {
	display: grid;
	grid-template-columns: 1fr;
	gap: var(--wp--preset--spacing--40) var(--wp--preset--spacing--30);
	margin: 0;
	padding: 0;
	list-style: none;
}

@media (min-width: 34em) {
	.woocommerce ul.products,
	.wc-block-grid__products {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (min-width: 60em) {
	.woocommerce ul.products,
	.wc-block-grid__products {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}
}

.woocommerce ul.products li.product {
	width: auto;
	margin: 0;
	float: none;
	text-align: left;
}

/* Photography sits on a pale field, never on white, and never cropped to a square that
   cuts the ends off a cigar box. */
.woocommerce ul.products li.product a img,
.woocommerce div.product div.images img {
	background: var(--neotron-surface);
	object-fit: contain;
	aspect-ratio: 1 / 1;
	margin-bottom: 1.1rem;
	transition: opacity 160ms ease;
}

.woocommerce ul.products li.product a:hover img {
	opacity: 0.88;
}

.woocommerce ul.products li.product .woocommerce-loop-product__title {
	font-family: var(--wp--preset--font-family--serif);
	font-size: 1.2rem;
	font-weight: 500;
	line-height: 1.25;
	padding: 0;
	margin: 0 0 0.35rem;
}

.woocommerce ul.products li.product .price {
	display: block;
	color: var(--neotron-ink);
	font-size: 1rem;
	font-weight: 600;
	font-variant-numeric: tabular-nums;
}

/* ---------------------------------------------------------------- Things a duty-free
   catalogue must not have */

.woocommerce span.onsale,
.woocommerce ul.products li.product .onsale,
.woocommerce .star-rating,
.woocommerce .woocommerce-product-rating,
.woocommerce #reviews,
.woocommerce .products .star-rating,
.wc-block-components-product-sale-badge {
	display: none !important;
}

/* Nothing is ever struck through: there are no former prices here. */
.woocommerce del {
	display: none;
}

/* ---------------------------------------------------------------- Single product */

.woocommerce div.product {
	display: grid;
	gap: var(--wp--preset--spacing--40);
}

@media (min-width: 56em) {
	.woocommerce div.product {
		grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr);
		align-items: start;
		gap: var(--wp--preset--spacing--50);
	}

	.woocommerce div.product .woocommerce-product-gallery {
		width: 100%;
		float: none;
		margin: 0;
		position: sticky;
		top: 2rem;
	}

	.woocommerce div.product .summary {
		width: 100%;
		float: none;
		margin: 0;
	}

	.woocommerce div.product .woocommerce-tabs,
	.woocommerce div.product .related {
		grid-column: 1 / -1;
	}
}

.woocommerce div.product .product_title {
	font-size: var(--wp--preset--font-size--x-large);
	margin: 0 0 0.6rem;
}

.woocommerce div.product p.price {
	color: var(--neotron-ink);
	font-size: 1.6rem;
	font-weight: 600;
	font-variant-numeric: tabular-nums;
	margin: 0;
}

.woocommerce div.product form.cart {
	margin: 2rem 0;
	display: flex;
	gap: 0.75rem;
	align-items: stretch;
	flex-wrap: wrap;
}

.woocommerce div.product form.cart .quantity input {
	height: 100%;
	min-height: 3.1rem;
	width: 5rem;
	padding: 0 0.6rem;
	border: 1px solid var(--neotron-line);
	background: #fff;
	text-align: center;
	font: inherit;
	font-variant-numeric: tabular-nums;
}

.woocommerce div.product .stock {
	color: var(--neotron-muted);
	font-size: 0.9rem;
}

.woocommerce div.product .out-of-stock {
	color: #8a1f1f;
	font-weight: 600;
}

/* The tab strip is noise when there is one tab. Our specification table lives in the
   summary instead. */
.woocommerce div.product .woocommerce-tabs ul.tabs {
	padding: 0;
	margin: 0 0 1.5rem;
	border-bottom: 1px solid var(--neotron-line);
}

.woocommerce div.product .woocommerce-tabs ul.tabs::before {
	display: none;
}

.woocommerce div.product .woocommerce-tabs ul.tabs li {
	background: transparent;
	border: 0;
	border-radius: 0;
	margin: 0 1.5rem 0 0;
	padding: 0;
}

.woocommerce div.product .woocommerce-tabs ul.tabs li a {
	padding: 0 0 0.6rem;
	font-size: 0.8rem;
	font-weight: 600;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	text-decoration: none;
	color: var(--neotron-muted);
}

.woocommerce div.product .woocommerce-tabs ul.tabs li.active a {
	color: var(--neotron-ink);
	box-shadow: inset 0 -2px 0 var(--neotron-brass);
}

/* ---------------------------------------------------------------- Buttons */

.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit,
.woocommerce a.button.alt,
.woocommerce button.button.alt {
	padding: 0.9rem 1.8rem;
	border: 0;
	border-radius: 0;
	background: var(--neotron-ink);
	color: var(--neotron-ground);
	font-family: var(--wp--preset--font-family--sans);
	font-size: 0.85rem;
	font-weight: 600;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	line-height: 1.3;
	transition: background-color 140ms ease;
}

.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover,
.woocommerce a.button.alt:hover,
.woocommerce button.button.alt:hover {
	background: var(--neotron-brass);
	color: var(--neotron-ground);
}

.woocommerce a.button.disabled,
.woocommerce button.button:disabled {
	background: var(--neotron-line);
	color: var(--neotron-muted);
	opacity: 1;
}

/* ---------------------------------------------------------------- Notices */

.woocommerce-message,
.woocommerce-info,
.woocommerce-error {
	border-top: 0;
	border-left: 3px solid var(--neotron-brass);
	border-radius: 0;
	background: var(--neotron-surface);
	color: var(--neotron-ink);
	padding: 1rem 1.25rem;
}

.woocommerce-message::before,
.woocommerce-info::before,
.woocommerce-error::before {
	display: none;
}

.woocommerce-error {
	border-left-color: #8a1f1f;
	background: #fbeaea;
}

/* ---------------------------------------------------------------- Cart, checkout, account */

.woocommerce table.shop_table {
	border: 0;
	border-radius: 0;
}

.woocommerce table.shop_table th {
	font-size: 0.78rem;
	font-weight: 600;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--neotron-muted);
	border-bottom: 1px solid var(--neotron-line);
}

.woocommerce table.shop_table td {
	border-top: 1px solid var(--neotron-line);
	font-variant-numeric: tabular-nums;
}

.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea,
.woocommerce form .form-row select,
.woocommerce .select2-container .select2-selection--single {
	padding: 0.7rem 0.85rem;
	border: 1px solid var(--neotron-line);
	border-radius: 0;
	background: #fff;
	font: inherit;
	min-height: 3rem;
}

.woocommerce form .form-row label {
	font-size: 0.8rem;
	font-weight: 600;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	margin-bottom: 0.35rem;
}

.woocommerce .woocommerce-checkout-review-order-table tfoot .order-total td {
	font-size: 1.25rem;
	font-weight: 600;
}

#add_payment_method #payment,
.woocommerce-cart #payment,
.woocommerce-checkout #payment {
	background: var(--neotron-surface);
	border-radius: 0;
}

.woocommerce-checkout #payment ul.payment_methods {
	border-bottom: 1px solid var(--neotron-line);
}

/* ---------------------------------------------------------------- Catalogue layout */

.neotron-catalogue {
	display: grid;
	gap: var(--wp--preset--spacing--40);
}

@media (min-width: 62em) {
	.neotron-catalogue {
		grid-template-columns: 15rem minmax(0, 1fr);
		gap: var(--wp--preset--spacing--50);
		align-items: start;
	}

	.neotron-catalogue__filters {
		position: sticky;
		top: 2rem;
	}
}

/* ---------------------------------------------------------------- Print */

@media print {
	.neotron-header,
	.neotron-footer,
	.neotron-catalogue__filters,
	.woocommerce div.product form.cart {
		display: none;
	}

	body {
		background: #fff;
		color: #000;
	}
}