/*
 * Opranic 2027: neutral WooCommerce styles.
 * Loaded on shop, category, product, cart, checkout and account pages only.
 * Shop, category and tag archives are no longer styled here (they use archive.css and
 * woocommerce/archive-product.php); every ul.products rule below is scoped to .o27-content,
 * which the archive template does not use, so it cannot fight the archive grid.
 * Purpose-built product page and cart templates come in a later version.
 * Nothing here touches elements whose classes start with oprbb-.
 */

/* Centred page wrapper (woocommerce.php provides it; page.php provides the same for cart, checkout, account). */
.o27-shop__inner { padding-top: 64px; }

/* Titles share the look of the default page title. */
.o27-shop :is(.woocommerce-products-header__title, .product_title, h1.entry-title) {
	margin: 0 0 24px;
	font-family: var(--o27-font-head);
	font-weight: 300;
	font-size: 3rem;
	line-height: 1.1;
	letter-spacing: -0.015em;
	color: var(--o27-heading);
}
.o27-shop :is(.woocommerce-result-count, .woocommerce-ordering) { margin: 0 0 24px; font-size: 0.875rem; color: var(--o27-muted); }
.o27-shop .woocommerce-ordering select { width: auto; min-width: 200px; }
.o27-shop .woocommerce-result-count { float: left; line-height: 3rem; margin-bottom: 0; }
.o27-shop .woocommerce-ordering { float: right; margin-bottom: 0; }
.o27-shop ul.products { clear: both; }

/* Responsive product grid */
.o27-content ul.products {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
	gap: 24px;
	margin: 0 0 48px;
	padding: 0;
	list-style: none;
}
.o27-content ul.products::before,
.o27-content ul.products::after { content: none; display: none; }

/* Cards in the o27-card look: radius 24, border, soft shadow, image area, title, price. */
body .o27-content ul.products[class*="columns-"] li.product,
body .o27-content ul.products li.product:not([class*="oprbb-"]) {
	display: flex;
	flex-direction: column;
	float: none;
	width: auto;
	margin: 0;
	padding: 0;
	overflow: hidden;
	border: 1px solid var(--o27-border);
	border-radius: var(--o27-radius-card);
	background: #fff;
	list-style: none;
	box-shadow: 0 1px 2px rgba(21, 24, 28, 0.06), 0 8px 24px rgba(21, 24, 28, 0.06);
	transition: transform 0.35s var(--o27-ease), box-shadow 0.35s ease;
}
.o27-content ul.products li.product:hover {
	transform: translateY(-4px);
	box-shadow: 0 0 0 1px rgba(238, 147, 5, 0.55), 0 10px 30px rgba(238, 147, 5, 0.28), 0 24px 48px rgba(21, 24, 28, 0.14);
}
.o27-content ul.products li.product > a:first-child {
	display: flex;
	flex-direction: column;
	flex: 1;
	text-decoration: none;
	color: inherit;
}
.o27-content ul.products li.product img {
	width: 100%;
	height: auto;
	aspect-ratio: 1 / 1;
	margin: 0;
	object-fit: contain;
	border-radius: 0;
	background: var(--o27-grey);
}
.o27-content ul.products li.product :is(.woocommerce-loop-product__title, h2, h3) {
	margin: 0;
	padding: 20px 24px 4px;
	font-family: var(--o27-font-head);
	font-weight: 400;
	font-size: 1.25rem;
	line-height: 1.25;
	color: var(--o27-heading);
}
.o27-content ul.products li.product .price {
	display: block;
	padding: 0 24px 20px;
	font-weight: 700;
	color: var(--o27-heading);
}
.o27-content ul.products li.product .price del { font-weight: 400; color: var(--o27-muted); }
.o27-content ul.products li.product .price ins { text-decoration: none; }
.o27-content ul.products li.product :is(.button, .added_to_cart) { margin: 0 24px 24px; align-self: flex-start; }
.o27-content ul.products li.product .onsale,
.o27-content span.onsale {
	position: absolute;
	top: 16px;
	left: 16px;
	z-index: 1;
	min-width: 0;
	min-height: 0;
	padding: 4px 12px;
	border-radius: 999px;
	background: var(--o27-orange);
	color: var(--o27-dark);
	font-size: 0.75rem;
	font-weight: 700;
	line-height: 1.4;
}
.o27-content ul.products li.product { position: relative; }

/* Single product: neutral two-column layout above 900px */
.o27-shop div.product { display: block; }
.o27-shop div.product .woocommerce-product-gallery { margin-bottom: 32px; }
.o27-shop div.product .price { font-size: 1.375rem; font-weight: 700; color: var(--o27-heading); }
@media (min-width: 900px) {
	.o27-shop div.product { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 0 56px; align-items: start; }
	.o27-shop div.product > :not(.woocommerce-product-gallery, .summary) { grid-column: 1 / -1; }
	.o27-shop div.product .woocommerce-product-gallery { float: none; width: 100%; }
	.o27-shop div.product .summary { float: none; width: 100%; }
}
.o27-shop .woocommerce-tabs ul.tabs { display: flex; flex-wrap: wrap; gap: 8px 24px; margin: 0 0 24px; padding: 0; list-style: none; border-bottom: 1px solid var(--o27-border); }
.o27-shop .woocommerce-tabs ul.tabs::before,
.o27-shop .woocommerce-tabs ul.tabs::after { content: none; }
.o27-shop .woocommerce-tabs ul.tabs li { margin: 0; padding: 0; border: 0; background: transparent; }
.o27-shop .woocommerce-tabs ul.tabs li a { display: block; padding: 12px 0; font-weight: 600; text-decoration: none; }
.o27-shop .woocommerce-tabs ul.tabs li.active a { box-shadow: inset 0 -3px 0 var(--o27-orange); color: var(--o27-heading); }

/* Cart, checkout and account: let the tables and forms breathe */
.o27-content .woocommerce { max-width: 100%; }
.o27-content .woocommerce table.shop_table { border: 0; border-radius: 0; }
.o27-content .woocommerce table.shop_table :is(th, td) { border-top: 0; border-bottom: 1px solid var(--o27-border); }
.o27-content .woocommerce :is(.woocommerce-message, .woocommerce-info, .woocommerce-error) {
	margin: 0 0 24px;
	padding: 16px 20px;
	border: 1px solid var(--o27-border);
	border-top: 3px solid var(--o27-orange);
	border-radius: 12px;
	background: var(--o27-offwhite);
	color: var(--o27-text);
}
.o27-content .woocommerce :is(.woocommerce-message, .woocommerce-info, .woocommerce-error)::before { content: none; }

@media (max-width: 767px) {
	.o27-shop__inner { padding-top: 40px; }
	.o27-shop :is(.woocommerce-products-header__title, .product_title, h1.entry-title) { font-size: 2rem; }
	.o27-content ul.products { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
	.o27-content ul.products li.product :is(.woocommerce-loop-product__title, h2, h3) { padding: 14px 16px 4px; font-size: 1.0625rem; }
	.o27-content ul.products li.product .price { padding: 0 16px 14px; }
	.o27-content ul.products li.product :is(.button, .added_to_cart) { margin: 0 16px 16px; padding: 0 16px; }
	.o27-shop .woocommerce-result-count,
	.o27-shop .woocommerce-ordering { float: none; }
}