/* CWD Archive Widget */

.cwd-archive-wrap { width: 100%; }

/* ─── Archive Title ────────────────────────────── */
.cwd-archive-title { margin: 0 0 8px; }
.cwd-archive-title-count { font-size: 0.7em; opacity: 0.6; font-weight: 400; }
.cwd-archive-description { font-size: 14px; line-height: 1.6; }

.cwd-archive-grid {
	display: grid;
	grid-template-columns: repeat(var(--cwd-cols, 3), 1fr);
	column-gap: 20px;
	row-gap: 20px;
}

/* Masonry */
.cwd-layout-masonry {
	column-count: var(--cwd-cols, 3);
	display: block;
	column-gap: 20px;
}
.cwd-layout-masonry .cwd-product-card {
	break-inside: avoid;
	display: inline-block;
	width: 100%;
	margin-bottom: 20px;
}

/* ─── Product Card ─────────────────────────────── */
.cwd-product-card {
	background: #fff;
	border: 1px solid #e5e5e5;
	border-radius: 4px;
	overflow: hidden;
	position: relative; /* required for badge overlay */
	transition: box-shadow 0.3s ease;
}
.cwd-product-card:hover { box-shadow: 0 4px 20px rgba(0,0,0,0.1); }

/* ─── Badges (archive cards) ───────────────────── */
.cwd-badge-wrap {
	position: absolute;
	top: 10px;
	left: 10px;
	z-index: 3;
	display: flex;
	flex-direction: column;
	gap: 4px;
	pointer-events: none;
}

.cwd-badge {
	display: inline-block;
	padding: 3px 8px;
	border-radius: 3px;
	font-size: 11px;
	font-weight: 700;
	line-height: 1.4;
	text-transform: uppercase;
	letter-spacing: 0.5px;
}

.cwd-badge-sale {
	background: #e53935;
	color: #fff;
}

.cwd-badge-new {
	background: #43a047;
	color: #fff;
}

.cwd-product-image { overflow: hidden; line-height: 0; position: relative; }
.cwd-product-image img {
	width: 100%;
	height: auto;
	display: block;
	transition: transform 0.3s ease;
}

/* ─── Gallery hover image (real <img> overlay) ──── */
.cwd-product-image a { display: block; position: relative; line-height: 0; }

/* Selector specificity (img.class) must beat the base ".cwd-product-image img" rule */
.cwd-product-image img.cwd-product-image__hover {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	opacity: 0;
	transition: opacity 0.35s ease, transform 0.35s ease;
	z-index: 2;
	pointer-events: none; /* clicks fall through to the <a> */
}

.cwd-product-card:hover img.cwd-product-image__hover {
	opacity: 1;
}

.cwd-product-info { padding: 16px; }

.cwd-product-category {
	font-size: 12px;
	color: #888;
	margin-bottom: 6px;
}
.cwd-product-category a { color: inherit; text-decoration: none; }

.cwd-product-title { margin-bottom: 8px; font-size: 16px; font-weight: 600; }
.cwd-product-title a { color: #333; text-decoration: none; }

.cwd-product-excerpt { font-size: 14px; color: #666; margin-bottom: 10px; }

.cwd-product-price { font-size: 16px; font-weight: 700; margin-bottom: 12px; }
.cwd-product-price .price del { color: #aaa; font-weight: 400; margin-right: 6px; }
.cwd-product-price .price ins { text-decoration: none; color: #e44; }

/* ─── Action buttons ───────────────────────────── */
.cwd-product-actions { display: flex; gap: 8px; flex-wrap: wrap; }

.cwd-btn-cart,
.cwd-btn-quick-view {
	padding: 8px 16px;
	border: none;
	border-radius: 4px;
	cursor: pointer;
	font-size: 14px;
	transition: background-color 0.3s ease, color 0.3s ease;
}
.cwd-btn-cart         { background: #333; color: #fff; text-decoration: none; }
.cwd-btn-cart:hover   { background: #555; color: #fff; }
.cwd-btn-quick-view   { background: #f5f5f5; color: #333; }
.cwd-btn-quick-view:hover { background: #e5e5e5; }

.cwd-btn-cart.cwd-added::after   { content: ' ✓'; }
.cwd-btn-cart.cwd-loading        { opacity: 0.7; }

.cwd-no-products { grid-column: 1 / -1; text-align: center; padding: 40px; color: #888; }

/* ─── Pagination ───────────────────────────────── */
.cwd-pagination {
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	gap: 6px;
	margin-top: 32px;
}
.cwd-pagination .page-numbers {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 36px;
	height: 36px;
	padding: 0 8px;
	border: 1px solid #ddd;
	border-radius: 4px;
	color: #333;
	text-decoration: none;
	font-size: 14px;
	transition: background 0.2s ease, color 0.2s ease;
}
.cwd-pagination .page-numbers:hover { background: #333; color: #fff; border-color: #333; }
.cwd-pagination .page-numbers.current { background: #333; color: #fff; border-color: #333; }
.cwd-pagination .page-numbers.dots { border: none; cursor: default; }

/* ─── Prev / Next ──────────────────────────────── */
.cwd-pagination-prevnext {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	margin-top: 32px;
}

.cwd-prev-link,
.cwd-next-link {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	color: #333;
	text-decoration: none;
	font-size: 15px;
	font-weight: 500;
	transition: opacity 0.2s ease, color 0.2s ease;
}
.cwd-prev-link:hover,
.cwd-next-link:hover { opacity: 0.65; }

.cwd-prev-link i,
.cwd-prev-link svg,
.cwd-next-link i,
.cwd-next-link svg {
	display: inline-flex;
	width: 1em;
	height: 1em;
	flex-shrink: 0;
}

/* ─── Load More ────────────────────────────────── */
.cwd-load-more-wrap { text-align: center; margin-top: 32px; }

.cwd-load-more-btn {
	display: inline-block;
	padding: 12px 36px;
	background: #333;
	color: #fff;
	border: none;
	border-radius: 4px;
	cursor: pointer;
	font-size: 15px;
	font-weight: 600;
	transition: background 0.3s ease, opacity 0.3s ease;
}
.cwd-load-more-btn:hover   { background: #555; }
.cwd-load-more-btn.cwd-loading { opacity: 0.6; cursor: wait; }

/* ─── Modal (archive) ──────────────────────────── */
.cwd-modal {
	display: none;
	position: fixed;
	inset: 0;
	z-index: 99999;
}
.cwd-modal.is-open { display: flex; }

.cwd-modal__overlay {
	position: fixed;
	inset: 0;
	background: rgba(0,0,0,0.6);
	display: flex;
	align-items: center;
	justify-content: center;
}
.cwd-modal__container {
	background: #fff;
	border-radius: 6px;
	max-width: 640px;
	width: 90%;
	max-height: 90vh;
	overflow-y: auto;
	position: relative;
	padding: 32px;
}
.cwd-modal__close {
	position: absolute;
	top: 12px; right: 16px;
	background: none; border: none;
	font-size: 20px; cursor: pointer; color: #555;
}
.cwd-modal__close:hover { color: #000; }

/* Quick View */
.cwd-quick-view-inner  { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
.cwd-qv-title          { margin: 0 0 12px; font-size: 20px; }
.cwd-qv-price          { font-size: 18px; font-weight: 700; margin-bottom: 12px; }
.cwd-qv-excerpt        { font-size: 14px; color: #555; margin-bottom: 16px; }
.cwd-qv-view-full      { display: inline-block; padding: 10px 20px; background: #333; color: #fff; text-decoration: none; border-radius: 4px; }

@media (max-width: 768px) {
	.cwd-quick-view-inner { grid-template-columns: 1fr; }
}