/* ======================================================
   HALAMAN SHOP/ALL PRODUK — tampilan ala Uniqlo.com
   Semua style di bawah ini di-scope ke .uq-shop (hanya
   berlaku di halaman shop ini, tidak mempengaruhi halaman lain)
   ====================================================== */
.uq-shop, .uq-shop *{ box-sizing:border-box; }
.uq-shop{ color:#111; background:#fff; }

/* ---------- Toolbar filter & grid/list toggle ---------- */
.uq-shop .btn-secondary{
	background:#111 !important;
	border:1px solid #111 !important;
	color:#fff !important;
	border-radius:0 !important;
	text-transform:uppercase;
	letter-spacing:1px;
	font-size:12px;
	font-weight:600;
	padding:11px 22px;
}
.uq-shop #viewgrid,
.uq-shop #viewlist{
	border:1px solid #ddd !important;
	border-radius:0 !important;
	color:#111 !important;
	font-size:12px;
	text-transform:uppercase;
	letter-spacing:.5px;
	font-weight:600;
}
.uq-shop .pencarian-btn{
	border-radius:0 !important;
	border:1px solid #ddd !important;
	font-size:12px;
}

/* ---------- Panel kategori ---------- */
.uq-shop #kategori.section{
	border:1px solid #ececec;
	border-radius:0;
	box-shadow:none;
	background:#fafafa;
}
.uq-shop #kategori a.text-primary{
	background:none !important;
	-webkit-text-fill-color:#111 !important;
	color:#111 !important;
	font-weight:600;
	font-size:13px;
	text-transform:uppercase;
	letter-spacing:.5px;
}
.uq-shop #kategori a.sub{
	background:none !important;
	-webkit-text-fill-color:#666 !important;
	color:#666 !important;
	text-transform:none;
	letter-spacing:0;
}

/* ---------- Kartu Produk ---------- */
.uq-shop .block2{
	background:#fff;
	border:none;
	box-shadow:none;
	border-radius:0;
}
.uq-shop .block2-img{
	background-color:#f7f7f7;
	border-radius:0;
	overflow:hidden;
	position:relative;
}
.uq-shop .block2-digital{
	border-radius:0;
	text-transform:uppercase;
	font-size:10px;
	letter-spacing:.5px;
}
.uq-shop .block2-label{
	background:#ff0000 !important;
	color:#fff !important;
	border-radius:0;
	font-size:11px;
	text-transform:uppercase;
}
.uq-shop .block2-txt{ padding-top:14px; }
.uq-shop .block2-name{
	font-size:13px;
	font-weight:500;
	color:#111 !important;
	line-height:1.4;
	text-transform:none;
}
.uq-shop .block2-price{
	font-size:14px;
	font-weight:700;
	color:#111 !important;
}
.uq-shop .block2-price-coret{
	font-size:12px;
	color:#999;
	text-decoration:line-through;
	margin-right:6px;
}
.uq-shop .block2-ulasan{ font-size:12px; color:#666; }

/* ---------- Tombol Load More ---------- */
.uq-shop .uq-loadmore-btn{
	background:#fff !important;
	border:1px solid #111 !important;
	color:#111 !important;
	border-radius:0 !important;
	text-transform:uppercase;
	letter-spacing:1px;
	font-size:12px;
	font-weight:600;
	padding:12px 40px;
	transition:background .2s ease,color .2s ease;
}
.uq-shop .uq-loadmore-btn:hover:not(:disabled){
	background:#111 !important;
	color:#fff !important;
}
.uq-shop .uq-loadmore-btn:disabled{
	opacity:.6;
	cursor:default;
}

/* ---------- Ganti gambar otomatis saat hover (ala Uniqlo) ---------- */
.uq-shop .uq-swap{
	width:100%;
	padding-top:125%; /* rasio potret khas fashion e-commerce */
	background:none !important;
}
.uq-shop .uq-swap img{
	position:absolute;
	top:0; left:0;
	width:100%;
	height:100%;
	object-fit:cover;
	transition:opacity .45s ease;
}
.uq-shop .uq-img-base{ opacity:1; z-index:1; }
.uq-shop .uq-img-hover{ opacity:0; z-index:2; }
.uq-shop .produk-item:hover .uq-img-hover{ opacity:1; }
.uq-shop .produk-item:hover .uq-img-base{ opacity:0; }

/* ---------- Pagination ---------- */
.uq-shop .pagination .item{
	background:none !important;
	background-image:none !important;
	border:1px solid #ddd;
	border-radius:0;
	color:#111;
}
.uq-shop .pagination .item.active,
.uq-shop .pagination .item:hover{
	background:#111 !important;
	background-image:none !important;
	color:#fff !important;
	border-color:#111;
}