/**
 * Neon Court — Swing Artist Week-1 chrome
 * Spec: neon-court-spec.md · Handoff: week1-theme-handoff.md
 * Fonts: Oswald (display) + Inter (UI) — enqueued in functions.php
 */

/* -------------------------------------------------------------------------- */
/* §3 Tokens + fonts                                                          */
/* -------------------------------------------------------------------------- */
:root {
	--font-display: "Oswald", "Impact", "Arial Narrow", sans-serif;
	--font-ui: "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;

	--bg-canvas: #0A0A0A;
	--bg-surface: #121212;
	--bg-surface-raised: #1A1A1A;
	--text-primary: #F5F5F5;
	--text-secondary: #A3A3A3;
	--text-muted: #6B6B6B;
	--text-on-accent: #0A0A0A;
	--accent-cyan: #00E5FF;
	--accent-cyan-dim: #00B8CC;
	--accent-pink: #FF2D95;
	--accent-pink-dim: #D91F7A;
	--border-subtle: #2A2A2A;
	--success: #22C55E;
	--warning: #F59E0B;
	--danger: #EF4444;
	--glow-cyan: 0 0 12px rgba(0, 229, 255, 0.45);
	--glow-pink: 0 0 12px rgba(255, 45, 149, 0.45);
	--radius-card: 14px;
	--overlay-scrim: rgba(0, 0, 0, 0.6);
}

/* -------------------------------------------------------------------------- */
/* Base                                                                       */
/* -------------------------------------------------------------------------- */
body.neon-court,
.neon-court {
	background-color: var(--bg-canvas);
	color: var(--text-primary);
	font-family: var(--font-ui);
	font-size: 16px;
	line-height: 1.5;
}

body.neon-court a {
	color: var(--accent-cyan);
}

body.neon-court a:hover {
	color: var(--accent-cyan-dim);
}

h1,
.hero-title,
.section-shout,
.wp-block-heading.is-style-nc-shout {
	font-family: var(--font-display);
	text-transform: uppercase;
	letter-spacing: 0.03em;
	font-weight: 700;
	line-height: 1.1;
	color: var(--text-primary);
}

h2.section-shout,
.nc-section-title {
	font-family: var(--font-display);
	font-size: clamp(1.5rem, 3vw, 2rem);
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.03em;
}

h3,
.product-title,
ul.products li.product .woocommerce-loop-product__title {
	font-family: var(--font-ui);
	font-weight: 600;
	text-transform: none;
	letter-spacing: 0;
}

body,
nav,
button,
.product-title,
.price,
input,
textarea,
select {
	font-family: var(--font-ui);
}

/* -------------------------------------------------------------------------- */
/* Header · sticky · cyan logo · locked nav                                   */
/* -------------------------------------------------------------------------- */
.nc-site-header,
header.nc-header,
.neon-court .wp-block-template-part[data-area="header"],
.neon-court header.wp-block-template-part {
	position: sticky;
	top: 0;
	z-index: 100;
	background: var(--bg-surface);
	border-bottom: 1px solid var(--border-subtle);
}

.nc-site-header__inner,
.nc-header-inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1.5rem;
	max-width: 1200px;
	margin: 0 auto;
	padding: 0.75rem 1.25rem;
}

/* Custom logo / site logo — cyan on dark; min widths per handoff */
.neon-court .custom-logo-link img,
.neon-court .wp-block-site-logo img,
.nc-logo img {
	display: block;
	width: auto;
	height: auto;
	max-height: 56px;
	min-width: 96px;
	object-fit: contain;
}

@media (max-width: 600px) {
	.neon-court .custom-logo-link img,
	.neon-court .wp-block-site-logo img,
	.nc-logo img {
		min-width: 72px;
		max-height: 44px;
	}
}

/* Nav: Shop · Drops · Tees · Hoodies · About */
.nc-nav,
.neon-court .wp-block-navigation {
	font-family: var(--font-ui);
	font-size: 14px;
	font-weight: 500;
	letter-spacing: 0.06em;
	text-transform: uppercase;
}

.nc-nav a,
.neon-court .wp-block-navigation a {
	color: var(--text-secondary);
	text-decoration: none;
}

.nc-nav a:hover,
.neon-court .wp-block-navigation a:hover,
.nc-nav a[aria-current="page"],
.neon-court .wp-block-navigation .current-menu-item a {
	color: var(--text-primary);
}

.nc-nav-list {
	display: flex;
	flex-wrap: wrap;
	gap: 1.25rem;
	list-style: none;
	margin: 0;
	padding: 0;
}

/* Cart icon + pink count badge when > 0 */
.nc-cart-link {
	position: relative;
	color: var(--accent-cyan);
	text-decoration: none;
	display: inline-flex;
	align-items: center;
}

.nc-cart-badge,
.neon-court .cart-contents .count,
.neon-court .wc-block-mini-cart__badge {
	position: absolute;
	top: -6px;
	right: -10px;
	min-width: 1.1rem;
	height: 1.1rem;
	padding: 0 4px;
	border-radius: 999px;
	background: var(--accent-pink);
	color: #fff;
	font-size: 10px;
	font-weight: 700;
	line-height: 1.1rem;
	text-align: center;
}

.nc-cart-badge:empty,
.nc-cart-badge[data-count="0"] {
	display: none;
}

/* -------------------------------------------------------------------------- */
/* Hero band                                                                  */
/* -------------------------------------------------------------------------- */
.nc-hero {
	position: relative;
	background: var(--bg-canvas);
	padding: clamp(3rem, 8vw, 6rem) 1.25rem;
	text-align: center;
	overflow: hidden;
}

.nc-hero__title {
	font-family: var(--font-display);
	font-size: clamp(2.75rem, 8vw, 4rem);
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	line-height: 1.05;
	margin: 0 0 1.5rem;
}

.nc-hero__title .nc-cyan {
	color: var(--accent-cyan);
	text-shadow: var(--glow-cyan);
}

.nc-hero__title .nc-pink {
	color: var(--accent-pink);
	text-shadow: var(--glow-pink);
}

.nc-hero__rule {
	display: flex;
	justify-content: center;
	gap: 0.5rem;
	margin: 0 auto 1.75rem;
	max-width: 280px;
}

.nc-hero__rule span {
	flex: 1;
	height: 2px;
}

.nc-hero__rule .nc-cyan-line {
	background: var(--accent-cyan);
	box-shadow: var(--glow-cyan);
}

.nc-hero__rule .nc-pink-line {
	background: var(--accent-pink);
	box-shadow: var(--glow-pink);
}

.nc-btn,
.nc-btn--primary,
a.nc-btn--primary {
	display: inline-block;
	padding: 0.85rem 1.75rem;
	background: var(--accent-cyan);
	color: var(--text-on-accent) !important;
	font-family: var(--font-ui);
	font-size: 15px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.06em;
	text-decoration: none;
	border: none;
	border-radius: 4px;
	cursor: pointer;
	transition: background 0.15s ease;
}

.nc-btn--primary:hover,
a.nc-btn--primary:hover {
	background: var(--accent-cyan-dim);
	color: var(--text-on-accent) !important;
}

.nc-btn--outline {
	background: transparent;
	color: var(--accent-cyan) !important;
	border: 1.5px solid var(--accent-cyan);
}

.nc-btn--outline:hover {
	background: var(--accent-cyan);
	color: var(--text-on-accent) !important;
}

/* -------------------------------------------------------------------------- */
/* Featured / Shop grids · Woo ul.products                                    */
/* -------------------------------------------------------------------------- */
.nc-featured,
.nc-shop-section {
	max-width: 1200px;
	margin: 0 auto;
	padding: 2.5rem 1.25rem 3rem;
}

.neon-court ul.products,
.woocommerce ul.products {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 1.5rem;
	list-style: none;
	margin: 0;
	padding: 0;
	clear: both;
}

.neon-court ul.products::before,
.neon-court ul.products::after,
.woocommerce ul.products::before,
.woocommerce ul.products::after {
	display: none !important;
	content: none !important;
}

.neon-court ul.products li.product,
.woocommerce ul.products li.product {
	float: none !important;
	width: 100% !important;
	margin: 0 !important;
	background: var(--bg-surface);
	border: 1px solid var(--border-subtle);
	border-radius: var(--radius-card);
	overflow: hidden;
	padding: 0 0 1rem;
	position: relative;
	transition: background 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease;
}

.neon-court ul.products li.product:hover,
.woocommerce ul.products li.product:hover {
	background: var(--bg-surface-raised);
	border-color: var(--accent-cyan);
	box-shadow: var(--glow-cyan);
}

/* 1:1 product image */
.neon-court ul.products li.product a img,
.woocommerce ul.products li.product a img,
.neon-court .woocommerce-product-gallery__image img {
	aspect-ratio: 1 / 1;
	object-fit: cover;
	width: 100%;
	height: auto;
	display: block;
	margin: 0;
}

.neon-court ul.products li.product .woocommerce-loop-product__title {
	font-size: 1.125rem; /* ~18–20px */
	font-weight: 600;
	color: var(--text-primary);
	padding: 0.75rem 1rem 0.25rem;
	margin: 0;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

.neon-court ul.products li.product .price,
.woocommerce ul.products li.product .price,
.neon-court div.product p.price,
.neon-court div.product span.price {
	color: var(--accent-cyan);
	font-weight: 700;
	font-size: 18px;
	padding: 0 1rem;
	display: block;
}

.neon-court ul.products li.product .price del,
.woocommerce ul.products li.product .price del {
	color: var(--text-muted);
	opacity: 0.85;
	font-weight: 500;
	margin-right: 0.35rem;
}

.neon-court ul.products li.product .price ins {
	color: var(--accent-cyan);
	text-decoration: none;
	background: transparent;
}

/* Quick add / loop add-to-cart — outline cyan */
.neon-court ul.products li.product .button,
.woocommerce ul.products li.product .button,
.neon-court ul.products li.product a.button {
	margin: 0.75rem 1rem 0;
	display: inline-block;
	border: 1.5px solid var(--accent-cyan);
	color: var(--accent-cyan) !important;
	background: transparent !important;
	font-weight: 700;
	text-transform: uppercase;
	font-size: 14px;
	letter-spacing: 0.04em;
	border-radius: 6px;
	padding: 0.55rem 1rem;
	box-shadow: none !important;
}

.neon-court ul.products li.product .button:hover,
.woocommerce ul.products li.product .button:hover {
	background: var(--accent-cyan) !important;
	color: var(--text-on-accent) !important;
}

/* Badges: NEW/HOT/DROP pink · SALE cyan · SOLD OUT muted */
.neon-court .onsale,
.woocommerce span.onsale,
.badge--sale {
	background: var(--accent-cyan) !important;
	color: var(--text-on-accent) !important;
	font-size: 11px;
	font-weight: 700;
	text-transform: uppercase;
	border-radius: 4px;
	padding: 0.25rem 0.45rem;
	min-height: 0;
	line-height: 1.2;
	left: 10px;
	top: 10px;
	right: auto;
}

.badge--new,
.badge--hot,
.badge--drop,
.neon-court .nc-badge-new,
.neon-court .nc-badge-hot,
.neon-court .nc-badge-drop {
	position: absolute;
	top: 10px;
	left: 10px;
	z-index: 2;
	background: var(--accent-pink);
	color: #fff;
	font-size: 11px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	padding: 0.25rem 0.45rem;
	border-radius: 4px;
}

.badge--soldout,
.neon-court .nc-badge-soldout {
	background: var(--text-muted);
	color: #fff;
	font-size: 11px;
	font-weight: 700;
	text-transform: uppercase;
	padding: 0.25rem 0.45rem;
	border-radius: 4px;
}

.product-card.is-soldout .product-card__image,
.neon-court ul.products li.product.outofstock a img,
.neon-court li.product.outofstock img {
	opacity: 0.5;
}

@media (max-width: 900px) {
	.neon-court ul.products,
	.woocommerce ul.products {
		grid-template-columns: repeat(2, 1fr);
		gap: 1rem;
	}
}

@media (max-width: 520px) {
	.neon-court ul.products,
	.woocommerce ul.products {
		grid-template-columns: repeat(2, 1fr);
		gap: 0.75rem;
	}

	.neon-court ul.products li.product .woocommerce-loop-product__title {
		font-size: 0.95rem;
		padding: 0.5rem 0.65rem 0.15rem;
	}

	.neon-court ul.products li.product .price {
		font-size: 16px;
		padding: 0 0.65rem;
	}
}

/* -------------------------------------------------------------------------- */
/* Shop chips (All / Tees / Hoodies / Drops)                                  */
/* -------------------------------------------------------------------------- */
.nc-shop-chips {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem;
	margin: 0 0 1.5rem;
	padding: 0;
	list-style: none;
}

.nc-shop-chips a {
	display: inline-block;
	padding: 0.4rem 0.85rem;
	border: 1px solid var(--border-subtle);
	border-radius: 999px;
	color: var(--text-secondary);
	font-size: 13px;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	text-decoration: none;
	background: var(--bg-surface);
}

.nc-shop-chips a:hover,
.nc-shop-chips a.is-active,
.nc-shop-chips li.is-active a {
	border-color: var(--accent-cyan);
	color: var(--accent-cyan);
}

/* Hide Drops chip until taxonomy ready — toggle by removing .nc-drops-pending */
.nc-shop-chips.nc-drops-pending [data-chip="drops"] {
	display: none;
}

/* -------------------------------------------------------------------------- */
/* PDP                                                                        */
/* -------------------------------------------------------------------------- */
.nc-single-product div.product,
.neon-court.single-product div.product {
	max-width: 1200px;
	margin: 0 auto;
	padding: 2rem 1.25rem 3rem;
}

.neon-court.single-product .woocommerce-product-gallery {
	border-radius: var(--radius-card);
	overflow: hidden;
	border: 1px solid var(--border-subtle);
	background: var(--bg-surface);
}

.neon-court.single-product .woocommerce-product-gallery__image img {
	aspect-ratio: 1 / 1;
	object-fit: cover;
}

.neon-court.single-product .summary .price {
	color: var(--accent-cyan);
	font-size: 1.25rem;
	font-weight: 700;
}

.neon-court.single-product .single_add_to_cart_button,
.neon-court.single-product button.alt {
	background: var(--accent-cyan) !important;
	color: var(--text-on-accent) !important;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.06em;
	border: none !important;
	border-radius: 4px;
	box-shadow: none !important;
}

.neon-court.single-product .single_add_to_cart_button:hover {
	background: var(--accent-cyan-dim) !important;
}

.nc-trust-row {
	display: flex;
	flex-wrap: wrap;
	gap: 1rem;
	margin: 1.5rem 0;
	color: var(--text-secondary);
	font-size: 13px;
}

/* -------------------------------------------------------------------------- */
/* Secondary brand band                                                       */
/* -------------------------------------------------------------------------- */
.nc-secondary-band {
	background: var(--bg-surface);
	border-top: 1px solid var(--border-subtle);
	border-bottom: 1px solid var(--border-subtle);
	padding: 2.5rem 1.25rem;
	text-align: center;
}

.nc-secondary-band p {
	color: var(--text-secondary);
	max-width: 36rem;
	margin: 0.75rem auto 0;
}

.nc-secondary-band .nc-accent-strip {
	width: 64px;
	height: 3px;
	margin: 0 auto 1rem;
	background: linear-gradient(90deg, var(--accent-cyan), var(--accent-pink));
}

/* -------------------------------------------------------------------------- */
/* Footer · white logo · muted links                                          */
/* -------------------------------------------------------------------------- */
.nc-site-footer,
footer.nc-footer,
.neon-court footer.wp-block-template-part {
	background: var(--bg-canvas);
	border-top: 1px solid var(--border-subtle);
	padding: 2rem 1.25rem 2.5rem;
	text-align: center;
}

.nc-footer-logo img {
	max-height: 40px;
	width: auto;
	opacity: 0.9;
	margin: 0 auto 1rem;
}

.nc-footer-links,
.neon-court footer .wp-block-navigation {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 1.25rem;
	list-style: none;
	padding: 0;
	margin: 0;
}

.nc-footer-links a,
.neon-court footer a {
	color: var(--text-muted) !important;
	font-size: 14px;
	text-decoration: none;
}

.nc-footer-links a:hover,
.neon-court footer a:hover {
	color: var(--text-secondary) !important;
}

/* -------------------------------------------------------------------------- */
/* Cart / Checkout / Account — quiet chrome (spec §6 · handoff §5)            */
/* -------------------------------------------------------------------------- */
body.nc-quiet-chrome .nc-nav,
body.nc-checkout .nc-nav-list,
body.woocommerce-checkout .nc-nav {
	/* Prefer slim header: keep logo, reduce mega-nav noise via CSS when class present */
}

body.nc-quiet-chrome {
	background: var(--bg-canvas);
	color: var(--text-primary);
}

body.nc-quiet-chrome .nc-hero,
body.nc-checkout .nc-hero,
body.nc-cart .nc-secondary-band {
	display: none;
}

/* Forms: dark surface, subtle border, cyan focus — no glow blur, no pink */
body.nc-quiet-chrome input.input-text,
body.nc-quiet-chrome textarea,
body.nc-quiet-chrome select,
body.woocommerce-checkout input.input-text,
body.woocommerce-checkout textarea,
body.woocommerce-checkout select,
body.woocommerce-cart input.input-text {
	background: var(--bg-surface) !important;
	border: 1px solid var(--border-subtle) !important;
	color: var(--text-primary) !important;
	border-radius: 6px;
	box-shadow: none !important;
}

body.nc-quiet-chrome input:focus,
body.nc-quiet-chrome textarea:focus,
body.nc-quiet-chrome select:focus,
body.woocommerce-checkout input:focus,
body.woocommerce-checkout textarea:focus,
body.woocommerce-checkout select:focus {
	outline: 2px solid var(--accent-cyan);
	outline-offset: 1px;
	border-color: var(--accent-cyan) !important;
	box-shadow: none !important; /* no neon glow on payment fields */
}

/* Primary Pay / Place order / Checkout — cyan only */
body.nc-quiet-chrome .checkout-button,
body.nc-quiet-chrome #place_order,
body.woocommerce-cart .wc-proceed-to-checkout a.checkout-button,
body.woocommerce-checkout #place_order,
body.nc-cart a.checkout-button {
	background: var(--accent-cyan) !important;
	color: var(--text-on-accent) !important;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.06em;
	border: none !important;
	border-radius: 4px;
	box-shadow: none !important;
}

body.nc-quiet-chrome .checkout-button:hover,
body.woocommerce-checkout #place_order:hover {
	background: var(--accent-cyan-dim) !important;
}

/* Kill pink accents on checkout forms */
body.nc-checkout .badge--hot,
body.nc-checkout .badge--new,
body.woocommerce-checkout .nc-hero__title .nc-pink {
	display: none;
}

body.nc-quiet-chrome .woocommerce-message {
	border-top-color: var(--success);
}

body.nc-quiet-chrome .woocommerce-error {
	border-top-color: var(--danger);
}

/* Order summary card — quiet */
body.nc-quiet-chrome .cart_totals,
body.nc-quiet-chrome .woocommerce-checkout-review-order {
	background: var(--bg-surface);
	border: 1px solid var(--border-subtle);
	border-radius: var(--radius-card);
	padding: 1.25rem;
}

/* -------------------------------------------------------------------------- */
/* Product-card BEM helpers (for patterns / custom markup)                    */
/* -------------------------------------------------------------------------- */
.product-card {
	background: var(--bg-surface);
	border: 1px solid var(--border-subtle);
	border-radius: var(--radius-card);
	overflow: hidden;
}

.product-card:hover {
	background: var(--bg-surface-raised);
	border-color: var(--accent-cyan);
	box-shadow: var(--glow-cyan);
}

.product-card__image {
	aspect-ratio: 1 / 1;
	object-fit: cover;
	width: 100%;
	display: block;
}

.product-card__title {
	font-family: var(--font-ui);
	font-weight: 600;
	font-size: 20px;
	color: var(--text-primary);
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	margin: 0.75rem 1rem 0.25rem;
}

.product-card__price {
	font-weight: 700;
	font-size: 18px;
	color: var(--accent-cyan);
	margin: 0 1rem;
}

.product-card__quick-add {
	border: 1.5px solid var(--accent-cyan);
	color: var(--accent-cyan);
	background: transparent;
	font-weight: 700;
	text-transform: uppercase;
	font-size: 14px;
	margin: 0.75rem 1rem 1rem;
	padding: 0.55rem 1rem;
	border-radius: 6px;
	cursor: pointer;
}

.product-card__quick-add:hover {
	background: var(--accent-cyan);
	color: var(--text-on-accent);
}

/* -------------------------------------------------------------------------- */
/* Utility                                                                    */
/* -------------------------------------------------------------------------- */
.nc-cyan { color: var(--accent-cyan); }
.nc-pink { color: var(--accent-pink); }

@media (max-width: 600px) {
	body.neon-court {
		font-size: 14.5px; /* ~×0.9 */
	}
}