/*
 * WooCommerce-specific styles.
 * Enqueued only on shop/product/cart/checkout views (see inc/enqueue.php).
 * Depends on custom properties defined in style.css.
 */

.tpm-shop-layout {
	display: grid;
	grid-template-columns: 1fr 280px;
	gap: var(--tpm-space-5);
	padding: var(--tpm-space-6) 0;
	align-items: start;
}
.tpm-product-grid { grid-column: 1; }
.tpm-shop-sidebar { grid-column: 2; }

.tpm-product-card .tpm-card-price {
	display: block;
	margin-top: var(--tpm-space-1);
}
.tpm-product-card .tpm-add-to-cart {
	margin-top: auto;
	text-align: center;
	width: 100%;
	transition: opacity 0.15s ease, background-color 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}
.tpm-product-card .tpm-add-to-cart.is-loading {
	opacity: 0.65;
	pointer-events: none;
	cursor: default;
}
.tpm-product-card .tpm-add-to-cart.is-added {
	background: var(--tpm-color-success);
	border-color: var(--tpm-color-success);
	color: #0f172a;
}
.tpm-product-card .tpm-add-to-cart.is-added::after {
	content: " \2713";
}
.tpm-card-rating { margin-top: var(--tpm-space-1); }

/* Core WooCommerce selectors — retheme rather than replace */
.woocommerce-message,
.woocommerce-info,
.woocommerce-error {
	border-top-color: var(--tpm-color-primary);
	background: var(--tpm-color-bg-alt);
	color: var(--tpm-color-text);
	border-radius: var(--tpm-radius);
	padding: var(--tpm-space-3);
}
.woocommerce-error { border-top-color: var(--tpm-color-danger); }

.price { color: var(--tpm-color-text); font-weight: 700; }
.price ins { color: var(--tpm-color-primary); text-decoration: none; }
.price del { color: var(--tpm-color-text-muted); }

.star-rating { color: var(--tpm-color-primary); }

.woocommerce div.product .woocommerce-tabs ul.tabs li a { color: var(--tpm-color-text); }
.woocommerce div.product .woocommerce-tabs ul.tabs li.active a { color: var(--tpm-color-primary); }

.woocommerce #respond input#submit,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button {
	background: var(--tpm-color-primary);
	color: #fff;
	border-radius: var(--tpm-radius);
	border: none;
	padding: var(--tpm-space-2) var(--tpm-space-4);
}
.woocommerce #respond input#submit:hover,
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover {
	background: var(--tpm-color-primary-dark);
}

@media (max-width: 782px) {
	.tpm-shop-layout { grid-template-columns: 1fr; }
	.tpm-shop-sidebar { grid-column: 1; }
}
@media (max-width: 480px) {
	.tpm-shop-layout { gap: var(--tpm-space-3); }
}