/* Restyles default WooCommerce markup using the site's own design tokens
   (colors, fonts, button style) defined in main.css, so the store doesn't
   look like a bolted-on plugin. */

.ss-shop-main, .ss-shop-section {
	font-family: var(--tg-body-font-family);
	color: var(--tg-body-color);
}

/* Shop / archive product grid */
ul.products {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
	gap: 30px;
	list-style: none;
	padding: 0;
	margin: 0 0 40px 0;
}
ul.products li.product {
	background: var(--tg-common-color-white);
	border: 1px solid var(--tg-common-color-gray-2);
	border-radius: 16px;
	padding: 20px;
	text-align: center;
	transition: all 0.3s ease-out 0s;
}
ul.products li.product:hover {
	box-shadow: 4px 6px 0px 0px var(--tg-common-color-blue);
	transform: translateY(-4px);
}
ul.products li.product img {
	border-radius: 12px;
	margin-bottom: 15px;
}
ul.products li.product .woocommerce-loop-product__title {
	font-family: var(--tg-heading-font-family);
	color: var(--tg-heading-color);
	font-size: 18px;
	margin: 10px 0;
}
ul.products li.product .price {
	color: var(--tg-theme-primary);
	font-weight: var(--tg-fw-semi-bold);
	font-size: 18px;
}

/* Buttons (Add to Cart, View Cart, Checkout, etc.) reuse the site's .btn look */
.woocommerce a.button,
.woocommerce button.button,
.woocommerce #respond input#submit,
.woocommerce input.button,
.woocommerce a.added_to_cart {
	background: var(--tg-theme-primary);
	border: medium none;
	color: var(--tg-common-color-white) !important;
	cursor: pointer;
	font-weight: var(--tg-fw-semi-bold);
	font-family: var(--tg-heading-font-family);
	padding: 14px 28px;
	border-radius: 50px;
	box-shadow: 4px 6px 0px 0px var(--tg-common-color-blue);
	transition: all 0.3s ease-out 0s;
}
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce #respond input#submit:hover,
.woocommerce input.button:hover {
	background: var(--tg-theme-secondary);
	color: var(--tg-heading-color) !important;
	box-shadow: 0 0 0 0 var(--tg-common-color-blue);
}

/* Single product page */
.woocommerce div.product .product_title {
	font-family: var(--tg-heading-font-family);
	color: var(--tg-heading-color);
}
.woocommerce div.product p.price, .woocommerce div.product span.price {
	color: var(--tg-theme-primary);
	font-size: 24px;
}
.woocommerce div.product .woocommerce-product-details__short-description {
	color: var(--tg-body-color);
	line-height: var(--tg-body-line-height);
}

/* Cart & checkout tables */
.woocommerce table.shop_table {
	border: 1px solid var(--tg-common-color-gray-2);
	border-radius: 12px;
	overflow: hidden;
}
.woocommerce table.shop_table th {
	background: var(--tg-common-color-gray);
	color: var(--tg-heading-color);
	font-family: var(--tg-heading-font-family);
}
.woocommerce-checkout #payment {
	background: var(--tg-common-color-gray);
	border-radius: 12px;
}

/* Star ratings / sale badges tuned to the palette */
.woocommerce span.onsale {
	background: var(--tg-common-color-red);
	border-radius: 50px;
}
.woocommerce .star-rating span::before {
	color: var(--tg-theme-secondary);
}
