/* ===== Category Grid ===== */
.cce-cat-grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 20px;
}
.cce-cat-grid.cce-cols-2 { grid-template-columns: repeat(2, 1fr); }
.cce-cat-grid.cce-cols-3 { grid-template-columns: repeat(3, 1fr); }
.cce-cat-grid.cce-cols-4 { grid-template-columns: repeat(4, 1fr); }
.cce-cat-grid.cce-cols-5 { grid-template-columns: repeat(5, 1fr); }
.cce-cat-grid.cce-cols-6 { grid-template-columns: repeat(6, 1fr); }

.cce-cat-item {
	display: block;
	text-decoration: none;
	border: 1px solid #eee;
	transition: box-shadow 0.25s ease, transform 0.25s ease;
}
.cce-cat-item:hover { box-shadow: 0 6px 18px rgba(0,0,0,0.08); }
.cce-cat-img-wrap { display: block; overflow: hidden; }
.cce-cat-item.cce-zoom .cce-cat-img { transition: transform 0.35s ease; }
.cce-cat-item.cce-zoom:hover .cce-cat-img { transform: scale(1.08); }
.cce-cat-title { display: block; margin-top: 10px; font-weight: 600; }
.cce-cat-count { font-weight: 400; opacity: 0.7; margin-left: 4px; }

/* Icon + Title footer design (Style 3) */
.cce-cat-item.cce-style_3 { text-align: center; }
.cce-cat-footer {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	margin-top: 14px;
}
.cce-cat-icon-circle {
	width: 40px;
	height: 40px;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
}
.cce-cat-icon-circle i,
.cce-cat-icon-circle svg {
	color: #fff;
	font-size: 16px;
	line-height: 1;
}
.cce-cat-icon-circle img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	border-radius: 50%;
}
.cce-style_3 .cce-cat-title { margin-top: 0; }

/* Style 1 - Bordered Card (default border/shadow already applied via card style controls) */
.cce-style_1 { text-align: center; }

/* Style 2 - Soft Box (image sits inside a padded gray rounded box) */
.cce-style_2 { text-align: center; border-color: transparent; }
.cce-cat-imgbox {
	display: flex;
	align-items: center;
	justify-content: center;
	background-color: #f5f6f7;
	padding: 20px;
	border-radius: 12px;
	overflow: hidden;
}
.cce-cat-imgbox .cce-cat-img { border-radius: 8px; }

/* Style 4 - Image Overlay Title */
.cce-style_4 { padding: 0 !important; }
.cce-cat-overlay-wrap { position: relative; display: block; }
.cce-cat-overlay-caption {
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	padding: 16px;
	background: linear-gradient(to top, rgba(0,0,0,0.55), transparent);
}
.cce-style_4 .cce-cat-title { color: #ffffff; margin-top: 0; }

/* Mobile columns ab Elementor ke responsive "Columns" control se control hoti hain
   (widget panel > Categories > Columns > mobile icon se select karein).
   Yahan koi hardcoded @media rule nahi rakhni, warna woh control ko override kar degi. */

/* ===== Product Widget ===== */
.cce-product-widget { width: 100%; }

.cce-search-row { display: flex; margin-bottom: 20px; }
.cce-search-left { justify-content: flex-start; }
.cce-search-right { justify-content: flex-end; }
.cce-search-box input {
	width: 100%;
	padding: 10px 14px;
	border: 1px solid #ddd;
	outline: none;
	font-size: 14px;
}

.cce-prod-outer { position: relative; }

.cce-prod-grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 20px;
}
.cce-prod-grid.cce-cols-2 { grid-template-columns: repeat(2, 1fr); }
.cce-prod-grid.cce-cols-3 { grid-template-columns: repeat(3, 1fr); }
.cce-prod-grid.cce-cols-4 { grid-template-columns: repeat(4, 1fr); }
.cce-prod-grid.cce-cols-5 { grid-template-columns: repeat(5, 1fr); }
.cce-prod-grid.cce-cols-6 { grid-template-columns: repeat(6, 1fr); }

.cce-prod-track-wrap { overflow: hidden; }
.cce-prod-slider {
	display: flex;
	transition: transform 0.4s ease;
}
.cce-prod-slider .cce-prod-item { flex-shrink: 0; }

.cce-prod-item {
	display: flex;
	flex-direction: column;
	border: 1px solid #eee;
	text-align: center;
	transition: box-shadow 0.25s ease;
}
.cce-prod-item:hover { box-shadow: 0 6px 18px rgba(0,0,0,0.08); }

.cce-prod-img-wrap { position: relative; display: block; }
.cce-badge {
	position: absolute;
	top: 10px;
	right: 10px;
	padding: 4px 12px;
	border-radius: 999px;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.5px;
	text-transform: uppercase;
	z-index: 2;
}

.cce-prod-title {
	display: block;
	margin-top: 12px;
	font-weight: 600;
	text-decoration: none;
	color: inherit;
}

.cce-price { margin-top: 6px; font-size: 16px; }
.cce-price del { text-decoration: line-through; margin-right: 6px; font-size: 0.9em; }
.cce-price ins { text-decoration: none; font-weight: 700; }

.cce-cart-btn {
	display: block;
	margin-top: auto;
	padding-top: 14px;
	text-align: center;
	text-decoration: none;
	font-weight: 600;
	border: none;
	cursor: pointer;
	transition: background-color 0.25s ease, opacity 0.25s ease;
	margin-top: 14px;
}

.cce-cart-btn.loading {
	opacity: 0.65;
	cursor: wait;
	pointer-events: none;
}

.cce-cart-btn.added {
	background-color: #1f8a3d !important;
}

.cce-arrow {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	background: #fff;
	border: 1px solid #ddd;
	width: 38px;
	height: 38px;
	border-radius: 50%;
	cursor: pointer;
	z-index: 3;
	display: flex;
	align-items: center;
	justify-content: center;
}
.cce-arrow-prev { left: -10px; }
.cce-arrow-next { right: -10px; }

.cce-prod-item.cce-hidden { display: none !important; }

@media (max-width: 767px) {
	.cce-prod-grid { grid-template-columns: repeat(2, 1fr) !important; }
	.cce-prod-slider .cce-prod-item { flex: 0 0 80% !important; }
}