/* ==========================================================================
   LAH Woo — BASE (load on all WooCommerce pages, before the page files)
   Tokens, typography, buttons, forms, notices, badges, shared bits.
   Source of truth: design pack assets/css/style.css · Style Guide v1.1
   ========================================================================== */

:root {
	--lah-navy: #0A1422;
	--lah-navy2: #0E1B2C;
	--lah-card: #13243B;
	--lah-card2: #172B45;
	--lah-border: #21364F;
	--lah-border2: #1B2D45;
	--lah-blue: #2BA4E8;
	--lah-blue-deep: #0677BA;
	--lah-orange: #F0912C;
	--lah-orange-deep: #EE7325;
	--lah-grad-top: #F2A743;
	--lah-text: #EAF1F8;
	--lah-muted: #9DB2C8;
	--lah-muted2: #7E95AD;
	--lah-faint: #5E7794;
	--lah-green: #7FD77F;
	--lah-red: #E86A5A;
	--lah-on-accent: #06121F;
}

/* --------------------------------------------------------------------------
   Typography on Woo pages
   -------------------------------------------------------------------------- */
.woocommerce,
.woocommerce-page .woocommerce {
	font-family: 'Barlow', system-ui, sans-serif;
	color: var(--lah-text);
	line-height: 1.5;
}

.woocommerce h1, .woocommerce h2, .woocommerce h3, .woocommerce h4 {
	font-family: 'Saira', sans-serif;
	color: var(--lah-text);
	line-height: 1.1;
}

.woocommerce a { text-decoration: none; }

.woocommerce-page h1.page-title,
.woocommerce h1.page-title {
	font-family: 'Saira', sans-serif;
	font-size: 42px;
	font-weight: 800;
	font-style: italic;
	margin-bottom: 24px;
}

.woocommerce .woocommerce-breadcrumb {
	margin-bottom: 20px;
	font-size: 13px;
	color: var(--lah-muted2);
	letter-spacing: .04em;
}

.woocommerce .woocommerce-breadcrumb a { color: var(--lah-muted2); }
.woocommerce .woocommerce-breadcrumb a:hover { color: var(--lah-text); }

/* --------------------------------------------------------------------------
   Buttons — LAH system (Saira, radius 10, .15s, hover brightness)
   Default = Ghost. Primary = the one main action per view.
   -------------------------------------------------------------------------- */
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit,
.woocommerce button[type="submit"],
.woocommerce-page a.button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	font-family: 'Saira', sans-serif;
	font-weight: 700;
	font-size: 14px;
	letter-spacing: .04em;
	border: 1px solid var(--lah-blue);
	border-radius: 10px;
	padding: 12px 20px;
	cursor: pointer;
	white-space: nowrap;
	text-decoration: none;
	background: transparent;
	color: var(--lah-blue);
	transition: filter .15s, transform .15s, background .15s, color .15s;
}

.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover,
.woocommerce button[type="submit"]:hover {
	filter: brightness(1.07);
	background: transparent;
	color: var(--lah-blue);
}

.woocommerce a.button:active,
.woocommerce button.button:active,
.woocommerce button[type="submit"]:active {
	transform: translateY(1px);
}

/* Primary — gradient, navy text, one per view */
.woocommerce a.checkout-button,
.woocommerce button.single_add_to_cart_button,
.woocommerce button#place_order,
.woocommerce button.woocommerce-form-login__submit,
.woocommerce button.woocommerce-form-register__submit,
.woocommerce .return-to-shop a.button {
	background: linear-gradient(180deg, var(--lah-grad-top), var(--lah-orange-deep));
	color: var(--lah-navy);
	border-color: transparent;
}

.woocommerce a.checkout-button:hover,
.woocommerce button.single_add_to_cart_button:hover,
.woocommerce button#place_order:hover,
.woocommerce .return-to-shop a.button:hover {
	background: linear-gradient(180deg, var(--lah-grad-top), var(--lah-orange-deep));
	color: var(--lah-navy);
}

/* Large primaries (uppercase, per guide) */
.woocommerce a.checkout-button,
.woocommerce button#place_order,
.woocommerce .return-to-shop a.button {
	padding: 15px 26px;
	font-size: 15px;
	text-transform: uppercase;
}

.woocommerce button:disabled,
.woocommerce a.button.disabled,
.woocommerce button.button:disabled[disabled] {
	opacity: .55;
	cursor: not-allowed;
	background: transparent;
	color: var(--lah-blue);
}

.woocommerce button.single_add_to_cart_button:disabled {
	background: linear-gradient(180deg, var(--lah-grad-top), var(--lah-orange-deep));
	color: var(--lah-navy);
}

.woocommerce a.added_to_cart {
	color: var(--lah-blue);
	font-weight: 600;
	font-size: 13px;
	padding: 8px 4px;
}

/* --------------------------------------------------------------------------
   Notices
   -------------------------------------------------------------------------- */
.woocommerce-message,
.woocommerce-info,
.woocommerce-error,
.woocommerce-noreviews,
p.no-comments {
	background: var(--lah-navy2);
	border: 1px solid var(--lah-border);
	border-left-width: 4px;
	border-radius: 12px;
	color: var(--lah-text);
	padding: 16px 20px;
}

.woocommerce-message { border-left-color: var(--lah-green); }
.woocommerce-info,
.woocommerce-noreviews,
p.no-comments { border-left-color: var(--lah-blue); }
.woocommerce-error { border-left-color: var(--lah-red); }

.woocommerce-message::before { color: var(--lah-green); }
.woocommerce-info::before { display: none; }
.woocommerce-error::before { color: var(--lah-red); }

.woocommerce-message .button,
.woocommerce-info .button,
.woocommerce-error .button {
	padding: 8px 14px;
	font-size: 13px;
}

/* --------------------------------------------------------------------------
   Forms & inputs (navy fill, 9px radius, blue focus — guide §05)
   -------------------------------------------------------------------------- */
.woocommerce form .form-row label {
	font-size: 13px;
	color: var(--lah-muted2);
	margin-bottom: 6px;
}

.woocommerce form .form-row .required {
	color: var(--lah-orange);
	text-decoration: none;
}

.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea,
.woocommerce form .form-row select,
.woocommerce .input-text {
	background: var(--lah-navy);
	border: 1px solid var(--lah-border);
	border-radius: 9px;
	padding: 12px 14px;
	color: var(--lah-text);
	font-size: 15px;
	font-family: 'Barlow', sans-serif;
	line-height: 1.4;
}

.woocommerce form .form-row input.input-text:focus,
.woocommerce form .form-row textarea:focus,
.woocommerce form .form-row select:focus,
.woocommerce .input-text:focus {
	outline: none;
	border-color: var(--lah-blue);
}

.woocommerce form .form-row ::placeholder { color: var(--lah-faint); }

/* select2 (country/state) — closed control */
.woocommerce-page .select2-container .select2-selection--single {
	height: auto;
	background: var(--lah-navy);
	border: 1px solid var(--lah-border);
	border-radius: 9px;
	padding: 12px 14px;
}

.woocommerce-page .select2-container .select2-selection--single .select2-selection__rendered {
	color: var(--lah-text);
	line-height: 1.4;
	padding: 0;
}

.woocommerce-page .select2-container .select2-selection--single .select2-selection__arrow {
	height: 100%;
}

/* select2 open dropdown attaches to <body>, so it must be unscoped */
.select2-dropdown {
	background: var(--lah-navy2);
	border: 1px solid var(--lah-border);
	border-radius: 9px;
	color: var(--lah-text);
}

.select2-container--default .select2-search--dropdown .select2-search__field {
	background: var(--lah-navy);
	border: 1px solid var(--lah-border);
	border-radius: 7px;
	color: var(--lah-text);
}

.select2-container--default .select2-results__option--highlighted.select2-results__option--selectable {
	background: var(--lah-card2);
	color: var(--lah-text);
}

.select2-container--default .select2-results__option[aria-selected="true"] {
	background: var(--lah-card);
	color: var(--lah-blue);
}

/* --------------------------------------------------------------------------
   Quantity input (design .qty)
   -------------------------------------------------------------------------- */
.woocommerce .quantity .qty {
	width: 72px;
	height: 44px;
	text-align: center;
	font-weight: 700;
	font-size: 15px;
	font-family: 'Saira', sans-serif;
	background: var(--lah-navy);
	border: 1px solid var(--lah-border);
	border-radius: 9px;
	color: var(--lah-text);
}

.woocommerce .quantity .qty:focus {
	outline: none;
	border-color: var(--lah-blue);
}

/* --------------------------------------------------------------------------
   Sale badge → design .badge-new (blue chip)
   -------------------------------------------------------------------------- */
.woocommerce span.onsale {
	position: absolute;
	top: 10px;
	left: 10px;
	right: auto;
	min-width: 0;
	min-height: 0;
	line-height: 1.4;
	background: var(--lah-blue);
	color: var(--lah-on-accent);
	font-size: 11px;
	font-weight: 800;
	letter-spacing: .06em;
	text-transform: uppercase;
	padding: 3px 9px;
	border-radius: 6px;
	margin: 0;
	z-index: 2;
}

/* --------------------------------------------------------------------------
   Star ratings
   -------------------------------------------------------------------------- */
.woocommerce .star-rating,
.woocommerce .star-rating span::before {
	color: var(--lah-orange);
}

.woocommerce .star-rating::before {
	color: var(--lah-faint);
}

/* --------------------------------------------------------------------------
   Shared table base (cart/checkout/account refine per page)
   -------------------------------------------------------------------------- */
.woocommerce table.shop_table {
	border: 1px solid var(--lah-border);
	border-radius: 14px;
	border-collapse: separate;
	border-spacing: 0;
	background: var(--lah-navy2);
	overflow: hidden;
	margin: 0 0 24px;
}

.woocommerce table.shop_table th {
	background: var(--lah-card);
	font-family: 'Saira', sans-serif;
	font-weight: 700;
	font-size: 13px;
	color: var(--lah-muted2);
	letter-spacing: .06em;
	text-transform: uppercase;
	padding: 14px 20px;
	border: none;
}

.woocommerce table.shop_table td {
	padding: 16px 20px;
	border: none;
	border-top: 1px solid var(--lah-border2);
	background: transparent;
	font-size: 14px;
	color: var(--lah-text);
	vertical-align: middle;
}

/* --------------------------------------------------------------------------
   Price amounts (orange, Saira — guide: price is always orange)
   -------------------------------------------------------------------------- */
.woocommerce .price,
.woocommerce .woocommerce-Price-amount {
	color: var(--lah-orange);
	font-family: 'Saira', sans-serif;
	font-weight: 800;
}

.woocommerce .price del {
	color: var(--lah-faint);
	opacity: 1;
	font-weight: 600;
}

.woocommerce .price del .woocommerce-Price-amount {
	color: var(--lah-faint);
	font-weight: 600;
}

.woocommerce .price ins {
	text-decoration: none;
}