/*
 * School Store styles — loaded on store pages only (inc/bw-store.php).
 * Colours come from the site's Kadence palette: palette1 is Brentwood red,
 * palette3 the body grey.
 */

/* ---- Shop banner (Kadence's product archive hero) ---- */
.product-archive-hero-section .archive-title {
	font-weight: 300;
	letter-spacing: 0.02em;
}
.product-archive-hero-section .archive-description,
.product-archive-hero-section .archive-description p {
	max-width: 38rem;
	margin-inline: auto;
	font-size: 1.1rem;
	line-height: 1.6;
}

/* ---- Breathing room: the site's containers have no side padding; its pages
   get it from Kadence rows, which the product templates don't use ---- */
.bw-store-page.woocommerce .content-container.site-container {
	--bw-store-gutter: clamp(1rem, 3vw, 2rem);
	padding-inline: var(--bw-store-gutter);
}

/* The site footer, fired by inc/bw-store.php on shop and product pages: back to
   full width, out of the store gutter, on the light-blue wash it has at the foot
   of every other page (there it's the boxed page's own background, which
   Kadence's Additional CSS scopes to body.page). */
.bw-store-footer {
	margin: 4rem calc(-1 * var(--bw-store-gutter, 0px)) 0;
	background: linear-gradient(180deg, transparent 0%, var(--global-palette7, #dcf2fa) 40%, var(--global-palette9, #fff) 100%);
}

/* ---- Shop intro (top) and promises (under the products) ---- */
.bw-store-page.post-type-archive-product .content-area {
	margin-top: 2.5rem;
}
.bw-store-intro {
	max-width: 46rem;
	margin: 0 auto 2rem;
	text-align: center;
}
.bw-store-intro__lede {
	margin: 0;
	font-size: 1.15rem;
	color: var(--global-palette3);
}
.bw-store-below {
	margin-top: 3.5rem;
}
.bw-store-below .bw-store-promises-wrap {
	max-width: 64rem;
	margin-inline: auto;
}
ul.bw-store-promises {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	margin: 0;
	padding: 0;
	list-style: none;
	background: #fff;
	border-radius: 8px;
	box-shadow: 0 1px 2px rgba(17, 24, 39, 0.05), 0 6px 18px rgba(17, 24, 39, 0.06);
}
ul.bw-store-promises li {
	margin: 0;
	padding: 1.75rem 1.5rem;
	text-align: center;
	font-size: 0.92rem;
	color: var(--global-palette4);
}
ul.bw-store-promises li + li {
	border-left: 1px solid var(--global-palette8);
}
ul.bw-store-promises li::before {
	content: "";
	display: block;
	width: 30px;
	height: 30px;
	margin: 0 auto 0.75rem;
	background: center / contain no-repeat;
}
ul.bw-store-promises li:nth-child(1)::before { /* campus pickup: bag */
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23c8272c' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 2 3 6v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2V6l-3-4z'/%3E%3Cline x1='3' y1='6' x2='21' y2='6'/%3E%3Cpath d='M16 10a4 4 0 0 1-8 0'/%3E%3C/svg%3E");
}
ul.bw-store-promises li:nth-child(2)::before { /* shipping: truck */
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23c8272c' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='1' y='3' width='15' height='13'/%3E%3Cpolygon points='16 8 20 8 23 11 23 16 16 16 16 8'/%3E%3Ccircle cx='5.5' cy='18.5' r='2.5'/%3E%3Ccircle cx='18.5' cy='18.5' r='2.5'/%3E%3C/svg%3E");
}
ul.bw-store-promises li:nth-child(3)::before { /* returns: arrow back */
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23c8272c' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='1 4 1 10 7 10'/%3E%3Cpath d='M3.51 15a9 9 0 1 0 2.13-9.36L1 10'/%3E%3C/svg%3E");
}
ul.bw-store-promises strong {
	display: block;
	margin-bottom: 0.25rem;
	font-family: Oswald, sans-serif;
	font-weight: 400;
	font-size: 1.05rem;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--global-palette3);
}
@media (max-width: 719px) {
	ul.bw-store-promises {
		grid-template-columns: 1fr;
	}
	ul.bw-store-promises li + li {
		border-left: 0;
		border-top: 1px solid var(--global-palette8);
	}
}

/* ---- Product cards (shop, categories, related products) ----
   Kadence shows the button always, with no slide-up, and fades to the product's
   second photo on hover (55-theme.php). The long selector outranks Kadence's
   loop rules, which strip the card's shadow and padding on product pages. */
.bw-store-page ul.products li.product.entry.loop-entry {
	position: relative;
	display: flex;
	flex-direction: column;
	overflow: hidden;
	border-radius: 8px;
	background: #fff;
	box-shadow: 0 1px 2px rgba(17, 24, 39, 0.06), 0 6px 18px rgba(17, 24, 39, 0.07);
	transition: box-shadow 0.25s ease, transform 0.25s ease;
}
/* A Brentwood-red line draws across the foot of the card on hover. */
.bw-store-page ul.products li.product.entry.loop-entry::after {
	content: "";
	position: absolute;
	inset: auto 0 0;
	height: 3px;
	background: var(--global-palette1);
	transform: scaleX(0);
	transform-origin: left;
	transition: transform 0.35s ease;
}
.bw-store-page ul.products li.product.entry.loop-entry:focus-within::after {
	transform: scaleX(1);
}
.bw-store-page ul.products li.product.entry.loop-entry .woocommerce-loop-image-link {
	display: block;
	overflow: hidden;
	background: var(--global-palette8);
}
.bw-store-page ul.products li.product.entry.loop-entry .woocommerce-loop-image-link img {
	transition: transform 0.6s ease, opacity 0.3s ease; /* opacity: Kadence's photo fade */
}

/* Text: category, name, then price with the colour dots beside it, and the
   button pinned to the foot so every card in a row lines up. The padding needs
   !important because the child theme zeroes every .entry-content-wrap with it. */
.bw-store-page ul.products li.product.entry.loop-entry .product-details {
	flex: 1;
	display: grid;
	grid-template-columns: 1fr auto;
	grid-template-rows: auto auto auto 1fr;
	align-items: center;
	column-gap: 0.75rem;
	margin: 0;
	padding: 1.15rem 1.35rem 1.2rem !important;
	background: none;
	box-shadow: none;
}
.bw-loop-category {
	grid-area: 1 / 1 / 2 / -1;
	margin-bottom: 0.35rem;
	font-size: 0.7rem;
	font-weight: 700;
	letter-spacing: 0.14em;
	line-height: 1.2;
	text-transform: uppercase;
	color: var(--global-palette5);
}
.bw-store-page ul.products li.product.entry.loop-entry .woocommerce-loop-product__title {
	grid-area: 2 / 1 / 3 / -1;
	margin: 0 0 0.6rem;
	padding: 0;
	font-size: 1.2rem;
	font-weight: 500;
	line-height: 1.25;
}
.bw-store-page ul.products li.product.entry.loop-entry .woocommerce-loop-product__title a {
	color: var(--global-palette3);
	transition: color 0.2s ease;
}
.bw-store-page ul.products li.product.entry.loop-entry .price {
	grid-area: 3 / 1;
	margin: 0;
	font-size: 1.05rem;
	font-weight: 700;
	color: var(--global-palette3);
}
.bw-loop-colours {
	grid-area: 3 / 2;
	display: flex;
	align-items: center;
	gap: 0.35rem;
}
.bw-loop-colour {
	position: relative;
	width: 14px;
	height: 14px;
	border-radius: 50%;
	background: var(--bw-dot);
	box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.2);
}
/* A colour with nothing left in stock: faded and crossed out. */
.bw-loop-colour--sold-out {
	opacity: 0.55;
}
.bw-loop-colour--sold-out::after {
	content: "";
	position: absolute;
	top: calc(50% - 0.75px);
	left: -2px;
	right: -2px;
	height: 1.5px;
	background: var(--global-palette3);
	transform: rotate(-45deg);
}
.bw-store-page ul.products li.product.entry.loop-entry .product-action-wrap {
	grid-area: 4 / 1 / 5 / -1;
	align-self: end;
	position: static;
	margin: 1.1rem 0 0;
	padding: 0.9rem 0 0;
	border-top: 1px solid var(--global-palette8);
	background: none;
	opacity: 1;
	transform: none;
}
.bw-store-page ul.products li.product.entry.loop-entry .product-action-wrap .button {
	padding: 0;
	background: none;
	border: 0;
	color: var(--global-palette1);
	font-size: 0.78rem;
	font-weight: 700;
	letter-spacing: 0.1em;
	text-transform: uppercase;
}
.bw-store-page ul.products li.product.entry.loop-entry .product-action-wrap .button .kadence-arrow-right-alt-svg {
	transition: transform 0.2s ease;
}

/* Hover only where there's a mouse: on phones a tap would leave the card lifted. */
@media (hover: hover) {
	.bw-store-page ul.products li.product.entry.loop-entry:hover {
		box-shadow: 0 4px 10px rgba(17, 24, 39, 0.08), 0 20px 40px rgba(17, 24, 39, 0.15);
		transform: translateY(-4px);
	}
	.bw-store-page ul.products li.product.entry.loop-entry:hover::after {
		transform: scaleX(1);
	}
	.bw-store-page ul.products li.product.entry.loop-entry:hover .woocommerce-loop-image-link img {
		transform: scale(1.04);
	}
	.bw-store-page ul.products li.product.entry.loop-entry:hover .woocommerce-loop-product__title a {
		color: var(--global-palette1);
	}
	.bw-store-page ul.products li.product.entry.loop-entry:hover .product-action-wrap .button .kadence-arrow-right-alt-svg {
		transform: translateX(5px);
	}
}

/* Phones show two cards across: tighter text so names don't break word by word. */
@media (max-width: 599px) {
	.bw-store-page ul.products li.product.entry.loop-entry .product-details {
		padding: 0.85rem 0.9rem 0.95rem !important;
	}
	.bw-store-page ul.products li.product.entry.loop-entry .woocommerce-loop-product__title {
		font-size: 1.02rem;
	}
	.bw-store-page ul.products li.product.entry.loop-entry .price {
		font-size: 0.95rem;
	}
	.bw-store-page ul.products li.product.entry.loop-entry .product-action-wrap {
		margin-top: 0.8rem;
		padding-top: 0.7rem;
	}
	.bw-store-page ul.products li.product.entry.loop-entry .product-action-wrap .button {
		font-size: 0.7rem;
		letter-spacing: 0.06em;
	}
	.bw-loop-category {
		font-size: 0.64rem;
		letter-spacing: 0.1em;
	}
}

/* ---- Product page: colour and size buttons (assets/bw-store-options.js) ---- */
.single-product table.variations,
.single-product table.variations tbody,
.single-product table.variations tr,
.single-product table.variations th,
.single-product table.variations td {
	display: block;
	width: 100%;
	padding: 0;
	border: 0;
	background: none;
}
.single-product table.variations tr {
	margin-bottom: 1.1rem;
}
.single-product table.variations th.label label {
	display: block;
	margin-bottom: 0.45rem;
	font-size: 0.8rem;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--global-palette3);
}
.bw-options {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem;
}
.bw-option {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.45rem;
	min-width: 2.9rem;
	padding: 0.6rem 0.95rem;
	border: 1px solid var(--global-palette6);
	border-radius: 4px;
	background: #fff;
	color: var(--global-palette3);
	font-size: 0.9rem;
	font-weight: 600;
	line-height: 1;
	cursor: pointer;
	transition: border-color 0.15s ease, box-shadow 0.15s ease, color 0.15s ease;
}
.bw-option:hover {
	border-color: var(--global-palette3);
}
.bw-option[aria-pressed="true"] {
	border-color: var(--global-palette1);
	box-shadow: inset 0 0 0 1px var(--global-palette1);
	color: var(--global-palette1);
}
.bw-option:focus-visible {
	outline: 2px solid var(--global-palette12);
	outline-offset: 2px;
}
.bw-option:disabled {
	opacity: 0.35;
	cursor: not-allowed;
	text-decoration: line-through;
}
/* Sold out: still shown, and still choosable to see it, but plainly unavailable. */
.bw-option--sold-out {
	border-style: dashed;
	color: var(--global-palette5);
}
.bw-option--sold-out .bw-option__swatch {
	opacity: 0.45;
}
.bw-option--sold-out[aria-pressed="true"] {
	border-color: var(--global-palette5);
	box-shadow: inset 0 0 0 1px var(--global-palette5);
	color: var(--global-palette4);
}
.bw-option__note {
	font-size: 0.68rem;
	font-weight: 700;
	letter-spacing: 0.06em;
	text-transform: uppercase;
}
.bw-option__swatch {
	width: 0.95rem;
	height: 0.95rem;
	border-radius: 50%;
	box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.25);
}
select.bw-options__select {
	position: absolute !important;
	width: 1px !important;
	height: 1px !important;
	opacity: 0;
	pointer-events: none;
}
.single-product .reset_variations {
	display: inline-block;
	margin-top: 0.25rem;
	font-size: 0.85rem;
}
.single-product .summary .price {
	color: var(--global-palette1);
	font-size: 1.5rem;
	font-weight: 600;
}

/* ---- Checkout: shown until a payment method is switched on ---- */
.bw-store-preview-note {
	margin: 0 0 1.5rem;
	padding: 1rem 1.25rem;
	border-left: 4px solid var(--global-palette15);
	background: #fff8e6;
	color: var(--global-palette3);
}

/* ---- Cart, checkout, account and Shipping & Returns on live ----
   These pages reached the live site with each Kadence column's saved class
   still carrying its staging page number (kadence-column39852_… and so on),
   while Kadence writes its column styles for the live page number. Without
   them the columns lose their padding and each page's heading slides under
   the menu. These are Kadence's own rules for exactly those columns: on a
   page built fresh, or once the live pages' content is corrected, they match
   nothing and can go. */
.kadence-column39852_241b90-55 > .kt-inside-inner-col,
.kadence-column39853_844d85-20 > .kt-inside-inner-col,
.kadence-column39854_e6eabc-71 > .kt-inside-inner-col,
.kadence-column39855_b6772b-91 > .kt-inside-inner-col {
	padding: var(--global-kb-spacing-md, 2rem);
}
.kadence-column39852_241b90-55,
.kadence-column39853_844d85-20,
.kadence-column39854_e6eabc-71,
.kadence-column39855_b6772b-91 {
	margin-top: 0;
}
.kadence-column39852_241b90-55 > .kt-inside-inner-col,
.kadence-column39853_844d85-20 > .kt-inside-inner-col,
.kadence-column39854_e6eabc-71 > .kt-inside-inner-col,
.kadence-column39855_b6772b-91 > .kt-inside-inner-col,
.kadence-column39855_d7e9ef-22 > .kt-inside-inner-col {
	column-gap: var(--global-kb-gap-sm, 1rem);
	flex-direction: column;
}
.kadence-column39852_241b90-55 > .kt-inside-inner-col > .aligncenter,
.kadence-column39853_844d85-20 > .kt-inside-inner-col > .aligncenter,
.kadence-column39854_e6eabc-71 > .kt-inside-inner-col > .aligncenter,
.kadence-column39855_b6772b-91 > .kt-inside-inner-col > .aligncenter,
.kadence-column39855_d7e9ef-22 > .kt-inside-inner-col > .aligncenter {
	width: 100%;
}
@media (max-width: 1024px) {
	.kadence-column39852_241b90-55 > .kt-inside-inner-col,
	.kadence-column39853_844d85-20 > .kt-inside-inner-col,
	.kadence-column39854_e6eabc-71 > .kt-inside-inner-col,
	.kadence-column39855_b6772b-91 > .kt-inside-inner-col,
	.kadence-column39855_d7e9ef-22 > .kt-inside-inner-col {
		justify-content: center;
	}
}

@media (prefers-reduced-motion: reduce) {
	.bw-option,
	.bw-store-page ul.products li.product.entry.loop-entry,
	.bw-store-page ul.products li.product.entry.loop-entry::after,
	.bw-store-page ul.products li.product.entry.loop-entry .woocommerce-loop-image-link img,
	.bw-store-page ul.products li.product.entry.loop-entry .product-action-wrap .button .kadence-arrow-right-alt-svg {
		transition: none;
	}
	.bw-store-page ul.products li.product.entry.loop-entry:hover,
	.bw-store-page ul.products li.product.entry.loop-entry:hover .woocommerce-loop-image-link img,
	.bw-store-page ul.products li.product.entry.loop-entry:hover .product-action-wrap .button .kadence-arrow-right-alt-svg {
		transform: none;
	}
}