/**
 * DWD Supply Co. — Additional Styles
 * Overrides, WooCommerce deep, utilities
 */

/* ==========================================
   WooCommerce Deep Overrides
========================================== */

/* Reset WC floats */
.woocommerce::after,
.woocommerce-page::after { content: ''; display: table; clear: both; }

/* Product summary */
.woocommerce div.product div.summary {
	float: none; width: 100%;
}
.woocommerce div.product div.images {
	float: none; width: 100%;
}

/* Product layout via CSS Grid */
.woocommerce div.product {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 4rem;
	align-items: start;
	padding: 2rem 0 3rem;
}
.woocommerce div.product div.images { grid-row: 1; }
.woocommerce div.product div.summary { grid-row: 1; }
.woocommerce div.product .woocommerce-tabs { grid-column: 1 / -1; }
.woocommerce div.product .related { grid-column: 1 / -1; }
.woocommerce div.product .upsells { grid-column: 1 / -1; }

/* Product title */
.woocommerce div.product .product_title {
	font-family: var(--font-heading);
	font-size: clamp(1.5rem, 3vw, 2.2rem);
	color: var(--color-white);
	text-transform: uppercase;
	letter-spacing: 0.03em;
	margin-bottom: 0.75rem;
}

/* Price */
.woocommerce div.product p.price,
.woocommerce div.product span.price {
	font-family: var(--font-heading);
	font-size: 2rem;
	color: var(--color-gold);
	margin-bottom: 1.25rem;
	display: block;
}
.woocommerce div.product p.price del,
.woocommerce div.product span.price del {
	font-size: 1.2rem;
	color: var(--color-text-muted);
	margin-right: 0.5rem;
}

/* Product description */
.woocommerce div.product div.summary .woocommerce-product-details__short-description {
	color: var(--color-text-muted);
	font-size: 0.95rem;
	line-height: 1.8;
	margin-bottom: 1.5rem;
}

/* Add to cart */
.woocommerce div.product form.cart {
	margin-bottom: 1.5rem;
}
.woocommerce div.product form.cart .quantity {
	display: inline-flex; align-items: center;
	background: var(--color-bg-3);
	border: 1px solid var(--color-border);
	border-radius: var(--radius-md);
	overflow: hidden; margin-right: 0.75rem;
}
.woocommerce div.product form.cart .qty {
	width: 60px; height: 50px;
	text-align: center; background: transparent;
	border: none; color: var(--color-white); font-size: 1rem; font-weight: 700;
}
.woocommerce div.product form.cart button[type="submit"] {
	height: 50px; padding: 0 2rem;
}

/* Meta */
.woocommerce div.product .product_meta {
	font-size: 0.82rem; color: var(--color-text-muted);
	padding-top: 1.25rem;
	border-top: 1px solid var(--color-border);
}
.woocommerce div.product .product_meta a {
	color: var(--color-gold);
}
.woocommerce div.product .product_meta span.sku { color: var(--color-text-muted); }

/* Star rating */
.woocommerce .star-rating {
	color: var(--color-gold);
	font-size: 1rem;
}
.woocommerce .star-rating span { color: var(--color-gold); }
.woocommerce .woocommerce-product-rating {
	display: flex; align-items: center; gap: 0.5rem;
	margin-bottom: 1rem;
}
.woocommerce .woocommerce-review-link { color: var(--color-text-muted); font-size: 0.82rem; }

/* Gallery */
.woocommerce div.product div.images .woocommerce-product-gallery__wrapper {
	margin: 0;
}
.woocommerce div.product div.images .flex-viewport {
	border-radius: var(--radius-xl);
	overflow: hidden;
	background: var(--color-bg-2);
}
.woocommerce div.product div.images ol.flex-control-nav {
	margin: 0.75rem 0 0;
	display: flex; gap: 0.5rem;
}
.woocommerce div.product div.images ol.flex-control-nav li {
	width: 70px; height: 70px; margin: 0;
}
.woocommerce div.product div.images ol.flex-control-nav li img {
	border-radius: var(--radius-md);
	border: 2px solid transparent;
	transition: border-color var(--transition);
	cursor: pointer;
	width: 100%; height: 100%; object-fit: cover;
}
.woocommerce div.product div.images ol.flex-control-nav li img:hover,
.woocommerce div.product div.images ol.flex-control-nav li img.flex-active {
	border-color: var(--color-gold);
}

/* Tabs */
.woocommerce div.product .woocommerce-tabs ul.tabs {
	padding: 0;
	display: flex; gap: 0;
	border-bottom: 1px solid var(--color-border);
	margin-bottom: 0;
	background: none;
}
.woocommerce div.product .woocommerce-tabs ul.tabs::before { display: none; }
.woocommerce div.product .woocommerce-tabs ul.tabs li {
	background: none; border: none; border-radius: 0;
	padding: 0; margin: 0;
}
.woocommerce div.product .woocommerce-tabs ul.tabs li a {
	display: block; padding: 0.85rem 1.5rem;
	color: var(--color-text-muted);
	font-size: 0.82rem; font-weight: 700; letter-spacing: 0.08em;
	text-transform: uppercase; border-bottom: 2px solid transparent;
	margin-bottom: -1px; transition: all var(--transition);
}
.woocommerce div.product .woocommerce-tabs ul.tabs li.active a,
.woocommerce div.product .woocommerce-tabs ul.tabs li a:hover {
	color: var(--color-gold); border-bottom-color: var(--color-gold);
}
.woocommerce div.product .woocommerce-tabs .panel {
	padding: 2rem 0;
	background: none;
	border: none;
	color: var(--color-text-muted);
	line-height: 1.8;
}
.woocommerce div.product .woocommerce-tabs .panel h2 {
	font-size: 1.1rem; margin-bottom: 1rem;
}

/* Reviews */
.woocommerce #reviews #comments ol.commentlist li {
	background: var(--color-bg-2); border: 1px solid var(--color-border);
	border-radius: var(--radius-lg); padding: 1.5rem; margin-bottom: 1rem;
}
.woocommerce #reviews #comments ol.commentlist li img.avatar {
	display: none;
}
.woocommerce #reviews #comments ol.commentlist li .comment-text {
	margin: 0;
}
.woocommerce #reviews .comment-reply-title {
	font-size: 1.1rem; margin-bottom: 1rem; color: var(--color-white);
}

/* Related & Upsells */
.woocommerce .related,
.woocommerce .upsells {
	padding: 2rem 0 0;
	border-top: 1px solid var(--color-border);
}
.woocommerce .related h2,
.woocommerce .upsells h2 {
	font-size: 1.4rem;
	margin-bottom: 1.5rem;
}

/* Cart */
.woocommerce .woocommerce-cart-form table.cart td.product-thumbnail img {
	width: 80px; height: 80px; object-fit: cover; border-radius: var(--radius-md);
}
.woocommerce .woocommerce-cart-form table.cart td.product-name a {
	color: var(--color-white); font-weight: 600;
}
.woocommerce .woocommerce-cart-form table.cart td.product-name a:hover { color: var(--color-gold); }
.woocommerce .woocommerce-cart-form table.cart td.product-remove a {
	color: var(--color-danger); font-size: 1.2rem; font-weight: 700;
}
.woocommerce .woocommerce-cart-form .coupon input.input-text {
	background: var(--color-bg-3); border: 1px solid var(--color-border);
	border-radius: var(--radius-md); padding: 0.7rem 1rem;
	color: var(--color-text); margin-right: 0.5rem;
}
.woocommerce .woocommerce-cart-form .coupon .button {
	background: transparent; border: 1px solid var(--color-border);
	color: var(--color-text); padding: 0.7rem 1.25rem;
}
.woocommerce .woocommerce-cart-form .coupon .button:hover {
	border-color: var(--color-gold); color: var(--color-gold);
}

/* Checkout layout */
.woocommerce-checkout .woocommerce {
	display: grid; grid-template-columns: 1fr 380px; gap: 2.5rem;
	align-items: start;
}
.woocommerce-checkout .woocommerce #customer_details { }
.woocommerce-checkout .woocommerce #order_review_heading,
.woocommerce-checkout .woocommerce #order_review {
	background: var(--color-bg-2); border: 1px solid var(--color-border);
	border-radius: var(--radius-lg); padding: 1.5rem;
}

/* Account layout */
.woocommerce-account .woocommerce {
	display: grid; grid-template-columns: 240px 1fr; gap: 2rem;
	align-items: start;
}

/* ==========================================
   PRODUCT CARD — WooCommerce native
========================================== */
.woocommerce ul.products li.product .woocommerce-loop-product__link {
	display: block;
}
.woocommerce ul.products li.product a img {
	aspect-ratio: 1 / 1;
	width: 100%;
	object-fit: cover;
	display: block;
}
.woocommerce ul.products li.product .woocommerce-loop-category__title,
.woocommerce ul.products li.product .woocommerce-loop-product__title {
	padding: 0 1.25rem; margin: 0.75rem 0 0.25rem;
}

/* ==========================================
   CONTENT STYLES (for page content)
========================================== */
.entry-content h1, .entry-content h2, .entry-content h3,
.entry-content h4, .entry-content h5, .entry-content h6 {
	color: var(--color-white); margin: 2rem 0 1rem;
}
.entry-content p { margin-bottom: 1.25rem; }
.entry-content ul, .entry-content ol {
	padding-left: 1.5rem; margin-bottom: 1.25rem; color: var(--color-text-muted);
}
.entry-content ul li { list-style: disc; margin-bottom: 0.4rem; }
.entry-content ol li { list-style: decimal; margin-bottom: 0.4rem; }
.entry-content a { color: var(--color-gold); text-decoration: underline; }
.entry-content blockquote {
	border-left: 3px solid var(--color-gold);
	padding: 1rem 1.5rem; margin: 1.5rem 0;
	background: rgba(255,193,7,0.05);
	border-radius: 0 var(--radius-md) var(--radius-md) 0;
	color: var(--color-text);
	font-style: italic;
}
.entry-content table {
	margin-bottom: 1.5rem; border-radius: var(--radius-md); overflow: hidden;
}
.entry-content table th {
	background: var(--color-bg-3); padding: 0.75rem 1rem;
	font-size: 0.8rem; text-transform: uppercase; letter-spacing: 0.08em;
	color: var(--color-white); border-bottom: 1px solid var(--color-border);
}
.entry-content table td {
	padding: 0.75rem 1rem; border-bottom: 1px solid var(--color-border);
	color: var(--color-text); background: var(--color-bg-2);
}
.entry-content img { border-radius: var(--radius-md); margin: 1.5rem auto; }
.entry-content .wp-block-image figcaption {
	text-align: center; font-size: 0.82rem; color: var(--color-text-muted); margin-top: 0.5rem;
}

/* ==========================================
   GUTENBERG BLOCKS
========================================== */
.wp-block-button__link {
	background: var(--color-gold); color: #000;
	border-radius: var(--radius-md); font-weight: 700; letter-spacing: 0.05em;
	transition: all var(--transition);
}
.wp-block-button__link:hover { background: var(--color-gold-dark); color: #000; }
.wp-block-separator { border-color: var(--color-border); }
.wp-block-quote { border-left-color: var(--color-gold); }
.wp-block-code, pre {
	background: var(--color-bg-3); border: 1px solid var(--color-border);
	border-radius: var(--radius-md); padding: 1.25rem;
	color: var(--color-gold); font-size: 0.88rem;
	overflow-x: auto;
}

/* ==========================================
   RESPONSIVE — SINGLE PRODUCT
========================================== */
@media (max-width: 860px) {
	.woocommerce div.product {
		grid-template-columns: 1fr;
		gap: 2rem;
	}
	.woocommerce-checkout .woocommerce {
		grid-template-columns: 1fr;
	}
	.woocommerce-account .woocommerce {
		grid-template-columns: 1fr;
	}
}

/* ==========================================
   SCROLLBAR
========================================== */
::-webkit-scrollbar { width: 8px; height: 8px; }
::-webkit-scrollbar-track { background: var(--color-bg-2); }
::-webkit-scrollbar-thumb { background: var(--color-bg-4); border-radius: 4px; }
::-webkit-scrollbar-thumb:hover { background: var(--color-gold); }

/* ==========================================
   SELECTION
========================================== */
::selection { background: rgba(255,193,7,0.3); color: var(--color-white); }
::-moz-selection { background: rgba(255,193,7,0.3); color: var(--color-white); }

/* ==========================================
   FOCUS RING
========================================== */
:focus-visible {
	outline: 2px solid var(--color-gold);
	outline-offset: 2px;
	border-radius: var(--radius-sm);
}

/* ==========================================
   LOADING / SPINNER
========================================== */
.woocommerce .blockUI.blockOverlay::before {
	border-color: var(--color-gold) transparent transparent !important;
}

/* ==========================================
   ADMIN BAR ADJUSTMENTS
========================================== */
@media screen and (min-width: 601px) {
	body.admin-bar .site-header { top: calc(32px + 0px); }
	body.admin-bar { --header-height: 70px; }
}

/* ==========================================
   PRINT
========================================== */
@media print {
	.site-header,
	.site-footer,
	.sidebar,
	.hero-scroll,
	#back-to-top,
	.product-actions,
	.newsletter { display: none !important; }
}