/* WooCommerce product and shop pages in pmitheme (includes/woocommerce.php). Same tokens as the course page.
   Overrides WooCommerce's default floats, purple buttons and olive prices. */
#pwc {
	--pwc-panel: #253f6c;
	--pwc-line: rgba(255, 255, 255, .14);
	--pwc-muted: #c9d6ea;
	--pwc-orange: var(--orange, #ff8300);
	--pwc-pink: var(--pink, #b00060);
	--pwc-light: var(--lightblue, #00b2e2);
	--pwc-radius: 4px;

	color: #fff;
	font-family: "Work Sans", Helvetica, Arial, sans-serif;
	font-size: 16px;
	line-height: 1.6;
	padding: 160px 0 96px; /* the theme's header is fixed */
}
#pwc *, #pwc *::before, #pwc *::after { box-sizing: border-box; }
#pwc .pwc__inner { max-width: 1240px; }
#pwc a { color: #fff; }
#pwc a:focus-visible, #pwc button:focus-visible { outline: 2px solid var(--pwc-light); outline-offset: 3px; }
#pwc .woocommerce-notices-wrapper:not(:empty) { margin-bottom: 32px; }

/* ---- buttons ---- */
#pwc .button,
#pwc button.button,
#pwc a.button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 45px;
	padding: 8px 20px;
	border: 0;
	border-radius: 5px; /* the theme's .orange-button */
	background: var(--pwc-orange);
	color: #fff;
	font: 600 16px/1.2 "Work Sans", Helvetica, Arial, sans-serif;
	text-transform: none;
	letter-spacing: 0;
	transition: background-color .3s ease-in-out;
}
#pwc .button:hover, #pwc .button:focus-visible { background: var(--pwc-pink); color: #fff; }
#pwc .button.added::after { margin-left: 8px; }
#pwc a.added_to_cart { display: inline-block; margin: 12px 0 0 16px; color: var(--pwc-muted); text-decoration: underline; text-underline-offset: 3px; }

/* ---- single product: image | summary, then the description ---- */
#pwc div.product {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
	gap: 56px 64px;
	align-items: start;
	position: relative;
}
#pwc div.product > * { grid-column: 1 / -1; }
#pwc div.product > div.images,
#pwc div.product > div.summary { grid-column: auto; float: none; width: auto; margin: 0; }
#pwc div.product div.images {
	background: var(--pwc-panel);
	border-radius: var(--pwc-radius);
	padding: 40px;
	opacity: 1 !important; /* WooCommerce fades the gallery in with its own script */
}
#pwc div.product div.images img { display: block; width: 100%; height: auto; border-radius: 2px; }
#pwc div.product div.images .flex-control-thumbs { display: flex; gap: 12px; margin: 16px 0 0; padding: 0; list-style: none; }
#pwc div.product div.images .flex-control-thumbs li { width: 80px; float: none; }

#pwc .product_title {
	font: 800 44px/1.08 "Work Sans", Helvetica, Arial, sans-serif;
	letter-spacing: -.01em;
	text-transform: none;
	color: #fff;
	margin: 0 0 24px;
	padding: 0;
	max-width: none;
}
#pwc .product_title::before { content: ""; display: block; width: 64px; height: 4px; background: var(--pwc-orange); margin-bottom: 24px; }
#pwc div.product p.price,
#pwc div.product span.price {
	color: #fff;
	font: 700 32px/1.2 "Work Sans", Helvetica, Arial, sans-serif;
	margin: 0 0 24px;
	max-width: none;
}
#pwc div.product p.price del { color: var(--pwc-muted); font-size: .6em; opacity: 1; }
#pwc div.product p.price ins { text-decoration: none; }
#pwc .woocommerce-product-details__short-description { color: var(--pwc-muted); margin-bottom: 24px; }
#pwc .woocommerce-product-details__short-description p { max-width: none; margin: 0 0 12px; }
#pwc div.product form.cart { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; margin: 0 0 24px; }
#pwc div.product form.cart::before, #pwc div.product form.cart::after { display: none; }
#pwc div.product form.cart .quantity:has(input[type="hidden"]) { display: none; } /* sold individually */
#pwc div.product form.cart .quantity { float: none; margin: 0; }
#pwc div.product form.cart .quantity .qty { width: 72px; height: 52px; border: 0; border-radius: var(--pwc-radius); text-align: center; font: 600 16px "Work Sans", Helvetica, Arial, sans-serif; }
#pwc div.product form.cart .button { float: none; }
#pwc .stock { color: var(--pwc-muted); }
#pwc .stock.out-of-stock { color: #ffb3c9; }
#pwc .product_meta { color: var(--pwc-muted); font-size: 15px; padding-top: 20px; border-top: 1px solid var(--pwc-line); }
#pwc .product_meta > span { display: block; }
#pwc .product_meta a { color: var(--pwc-muted); text-decoration: underline; text-underline-offset: 3px; }
#pwc .product_meta a:hover { color: #fff; }
#pwc .onsale {
	position: absolute; top: 16px; left: 16px; z-index: 2; min-width: 0; min-height: 0; margin: 0;
	padding: 6px 12px; border-radius: var(--pwc-radius); background: var(--pwc-pink); color: #fff;
	font: 700 14px/1.2 "Work Sans", Helvetica, Arial, sans-serif;
}

/* tabs: a single Description tab reads as a section heading */
#pwc .woocommerce-tabs { margin: 0; padding: 0; }
#pwc .woocommerce-tabs ul.tabs {
	display: flex; gap: 8px; margin: 0 0 32px; padding: 0; list-style: none;
	border-bottom: 1px solid var(--pwc-line); overflow: visible;
}
#pwc .woocommerce-tabs ul.tabs::before, #pwc .woocommerce-tabs ul.tabs::after,
#pwc .woocommerce-tabs ul.tabs li::before, #pwc .woocommerce-tabs ul.tabs li::after { display: none; }
#pwc .woocommerce-tabs ul.tabs li { margin: 0; padding: 0; border: 0; border-radius: 0; background: none; }
#pwc .woocommerce-tabs ul.tabs li a {
	display: block; padding: 0 4px 14px; color: var(--pwc-muted); font: 600 18px/1.2 "Work Sans", Helvetica, Arial, sans-serif;
	text-decoration: none; border-bottom: 3px solid transparent; margin-bottom: -1px;
}
#pwc .woocommerce-tabs ul.tabs li.active a { color: #fff; border-bottom-color: var(--pwc-orange); }
#pwc .woocommerce-tabs .panel { margin: 0; padding: 0; color: var(--pwc-muted); font-size: 17px; line-height: 1.7; }
#pwc .woocommerce-tabs .panel > h2:first-child { display: none; } /* repeats the tab name */
#pwc .woocommerce-tabs .panel h2, #pwc .woocommerce-tabs .panel h3 { font: 800 28px/1.2 "Work Sans", Helvetica, Arial, sans-serif; color: #fff; text-transform: none; margin: 32px 0 12px; }
#pwc .woocommerce-tabs .panel p { max-width: 900px; margin: 0 0 18px; }
#pwc .woocommerce-tabs .panel ul, #pwc .woocommerce-tabs .panel ol { max-width: 900px; margin: 0 0 18px; padding-left: 1.25em; }
#pwc .woocommerce-tabs .panel table { border-collapse: collapse; }
#pwc .woocommerce-tabs .panel th, #pwc .woocommerce-tabs .panel td { padding: 10px 16px 10px 0; border-bottom: 1px solid var(--pwc-line); text-align: left; }

/* ---- product lists (shop, categories, upsells) ---- */
#pwc .woocommerce-products-header__title,
#pwc .upsells > h2 {
	font: 800 56px/1 "Work Sans", Helvetica, Arial, sans-serif; text-transform: none; color: #fff; margin: 0 0 32px;
}
#pwc .upsells > h2 { font-size: 32px; }
#pwc .term-description, #pwc .page-description { color: var(--pwc-muted); margin-bottom: 32px; }
#pwc .term-description p, #pwc .page-description p { max-width: 900px; }
#pwc .woocommerce-result-count { color: var(--pwc-muted); margin: 0 0 24px; float: none; }
#pwc .woocommerce-ordering { display: none; }
#pwc ul.products {
	display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 24px;
	margin: 0; padding: 0; list-style: none;
}
#pwc ul.products::before, #pwc ul.products::after { display: none; }
#pwc ul.products li.product {
	display: flex; flex-direction: column; float: none; width: auto; margin: 0; padding: 0 0 24px;
	background: var(--pwc-panel); border-radius: var(--pwc-radius); overflow: hidden; text-align: left;
}
#pwc ul.products li.product a img { display: block; width: 100%; height: auto; margin: 0 0 20px; }
#pwc ul.products li.product .woocommerce-loop-product__title {
	font: 700 19px/1.3 "Work Sans", Helvetica, Arial, sans-serif; color: #fff; text-transform: none; padding: 0 24px; margin: 0 0 8px;
}
#pwc ul.products li.product .price { display: block; color: var(--pwc-muted); font: 600 17px/1.3 "Work Sans", Helvetica, Arial, sans-serif; padding: 0 24px; margin: 0 0 20px; }
#pwc ul.products li.product .button { margin: auto 24px 0; }
#pwc ul.products li.product .woocommerce-LoopProduct-link { text-decoration: none; }
#pwc ul.products li.product .woocommerce-LoopProduct-link:hover .woocommerce-loop-product__title { text-decoration: underline; text-underline-offset: 3px; }
#pwc .woocommerce-pagination ul { display: flex; gap: 8px; border: 0; margin: 40px 0 0; padding: 0; list-style: none; }
#pwc .woocommerce-pagination ul li { border: 0; }
#pwc .woocommerce-pagination ul li a, #pwc .woocommerce-pagination ul li span { display: block; padding: 10px 16px; border-radius: var(--pwc-radius); background: var(--pwc-panel); color: #fff; }
#pwc .woocommerce-pagination ul li span.current { background: var(--pwc-orange); }

@media (max-width: 960px) {
	#pwc { padding-top: 130px; }
	#pwc div.product { grid-template-columns: minmax(0, 1fr); gap: 32px; }
	#pwc .product_title { font-size: 34px; }
	#pwc .woocommerce-products-header__title { font-size: 40px; }
}
@media (max-width: 600px) {
	#pwc { padding: 112px 0 64px; } /* the header is about 83px tall here */
	#pwc div.product div.images { padding: 20px; }
	#pwc .product_title { font-size: 28px; }
	#pwc div.product p.price { font-size: 26px; }
	#pwc div.product form.cart .button { width: 100%; }
}