/* ==========================================================================
   SHAHAZ.COM — Shop Page Header Divider
   ফাইল: assets/css/shop-enhancement.css

   শুধু Shop/Category/Tag আর্কাইভ পেজেই লোড হয় (functions.php-এ
   কন্ডিশনাল enqueue)। Product Card/Grid/Header Layout/Search Bar —
   কিছুরই CSS এখানে touch করা হয়নি; এই ফাইলে শুধু archive hero-এর
   presentation rules রয়েছে।

   ⚠️ ২০২৬-০৮-১৮ রিভিশন: এই ফাইলে আগে "Shop Header Row Action Cards"
   (দুই পাশের Size Chart/Advanced Filter বাটন), "Popup Overlay +
   Panel Base", "Size Chart Content", ও "Advanced Filter Form" —
   এই ৪টা কম্পোনেন্টও ছিল। ব্যবহারকারীর নির্দেশে সেই পুরনো "দুই
   পাশের বাটন + Popup" সিস্টেম সম্পূর্ণ DELETE করা হয়েছে (দেখুন
   woocommerce/archive-product.php-এর কমেন্ট) — Size Chart/Advanced
   Filter-এর কনটেন্ট-স্টাইলিং এখন assets/css/shahaz-full-pages.css-এ
   (দুইটা নতুন, স্বাধীন Full Page-এর জন্য, Light Pink ব্যাকগ্রাউন্ডে
   পুনর্লিখিত)। এই ফাইলে শুধু genuinely এখনো-ব্যবহৃত ডেকোরেটিভ
   ডিভাইডার (Shop টাইটেলের নিচে) বাকি আছে — dead code হিসেবে কিছু
   রাখা হয়নি।
   ========================================================================== */




/*************************************************************
 * COMPONENT NAME: Shop Header Divider
 * Purpose: "সব প্রোডাক্ট"/ক্যাটাগরি টাইটেলের নিচে একটা ছোট,
 *          ডেকোরেটিভ dot—line—sparkle—line—dot ডিভাইডার।
 * CSS Dependency: None
 * WooCommerce Dependency: None
 *************************************************************/
.shahaz-shop-header-divider {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 6px;
	max-width: 220px;
	margin: 0 auto 16px;
}

.shahaz-shop-divider-line {
	flex: 1;
	height: 1px;
	background: linear-gradient(90deg, transparent, var(--shahaz-gold), transparent);
}

.shahaz-shop-divider-dot {
	width: 4px;
	height: 4px;
	border-radius: 50%;
	background: var(--shahaz-magenta);
	flex: 0 0 auto;
}

.shahaz-shop-divider-spark {
	color: var(--shahaz-gold);
	font-size: 12px;
	flex: 0 0 auto;
}



/* ==========================================================================
 * PHASE 83 — COMPACT FULL-WIDTH LUXURY SHOP HERO
 * Rebuilt for the WooCommerce Shop/Category archive only.
 * ========================================================================== */
.shahaz-shop-page {
	max-width: none;
	overflow-x: clip;
	padding-top: 2px !important;
}

.shahaz-shop-live-header {
	position: relative;
	width: 100vw;
	max-width: none;
	min-height: 116px;
	margin: 0 0 12px;
	margin-left: 50%;
	transform: translateX(-50%);
	border: 1px solid rgba(255,92,172,.68);
	border-radius: 0;
	overflow: visible;
	isolation: isolate;
	background:
		radial-gradient(circle at 12% 30%, rgba(255,54,111,.55), transparent 27%),
		radial-gradient(circle at 88% 18%, rgba(255,166,0,.48), transparent 25%),
		radial-gradient(circle at 70% 92%, rgba(255,20,147,.42), transparent 32%),
		linear-gradient(118deg, #7b0a5d 0%, #c90070 36%, #ff164f 68%, #ff8a00 100%);
	box-shadow: 0 16px 34px -22px rgba(107,15,85,.8), 0 0 0 1px rgba(255,215,120,.52) inset, 0 0 28px rgba(255,20,147,.22);
}

.shahaz-shop-live-header::before {
	content: "";
	position: absolute;
	inset: 0;
	border-radius: inherit;
	background:
		repeating-linear-gradient(128deg, transparent 0 44px, rgba(255,255,255,.12) 45px, transparent 46px 88px),
		linear-gradient(110deg, transparent 24%, rgba(255,255,255,.38) 45%, transparent 58%);
	background-size: auto, 220% 100%;
	animation: shahaz-shop-live-sweep 6.5s ease-in-out infinite;
	pointer-events: none;
	z-index: 0;
}

.shahaz-shop-live-header::after {
	content: "";
	position: absolute;
	left: 50%;
	bottom: -26px;
	width: 44%;
	height: 52px;
	transform: translateX(-50%);
	border-radius: 50%;
	background: radial-gradient(ellipse, rgba(255,174,0,.45), transparent 70%);
	filter: blur(8px);
	pointer-events: none;
	z-index: 0;
}

@keyframes shahaz-shop-live-sweep {
	0%, 54% { background-position: 0 0, -90% 0; }
	78%, 100% { background-position: 18px 0, 90% 0; }
}

.shahaz-shop-live-header-inner {
	position: relative;
	z-index: 5;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	text-align: center;
	min-height: 116px;
	padding: 10px 150px 8px;
}

.shahaz-shop-live-kicker {
	font-size: 8px;
	font-weight: 950;
	letter-spacing: .24em;
	color: #ffe8a3;
	text-transform: uppercase;
	text-shadow: 0 2px 8px rgba(77,0,47,.65);
}

.shahaz-shop-live-title {
	margin: 3px 0 2px;
	font-family: 'Playfair Display', Georgia, serif;
	font-size: clamp(26px, 6vw, 44px);
	line-height: .98;
	font-weight: 950;
	letter-spacing: -.02em;
	color: #fff8fb;
	text-shadow: 0 3px 0 rgba(111,0,67,.65), 0 7px 18px rgba(50,0,32,.35);
	text-wrap: balance;
}

.shahaz-shop-live-copy {
	max-width: 520px;
	margin: 0;
	font-size: 9px;
	line-height: 1.2;
	font-weight: 800;
	color: rgba(255,248,252,.9);
}

.shahaz-shop-live-divider {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 5px;
	width: min(220px, 60%);
	margin-top: 4px;
}

.shahaz-shop-live-divider span {
	flex: 1;
	height: 1px;
	background: linear-gradient(90deg, transparent, #ffd45e, transparent);
}

.shahaz-shop-live-divider i {
	font-style: normal;
	font-size: 10px;
	color: #ffe6a1;
	animation: shahaz-shop-live-spark 2.2s ease-in-out infinite;
}

@keyframes shahaz-shop-live-spark {
	0%, 100% { transform: scale(.8) rotate(0deg); opacity: .7; }
	50% { transform: scale(1.25) rotate(90deg); opacity: 1; }
}

.shahaz-shop-live-status {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	margin-top: 3px;
	font-size: 6px;
	font-weight: 950;
	letter-spacing: .14em;
	color: #fff5d8;
}

.shahaz-shop-live-status b {
	width: 5px;
	height: 5px;
	border-radius: 50%;
	background: #ffdf4f;
	box-shadow: 0 0 0 4px rgba(255,223,79,.12), 0 0 12px rgba(255,223,79,.8);
	animation: shahaz-shop-live-dot 1.7s ease-in-out infinite;
}

.shahaz-shop-live-status em {
	width: 20px;
	height: 1px;
	background: #ffd45e;
}

@keyframes shahaz-shop-live-dot {
	0%, 100% { transform: scale(.75); opacity: .65; }
	50% { transform: scale(1.35); opacity: 1; }
}

.shahaz-shop-live-orbit {
	position: absolute;
	border: 1px solid rgba(255,219,105,.42);
	border-radius: 50%;
	pointer-events: none;
	z-index: 1;
}

.shahaz-shop-live-orbit-a {
	width: 250px; height: 105px; left: -60px; top: -46px;
	transform: rotate(-18deg); animation: shahaz-shop-orbit-a 9s ease-in-out infinite;
}

.shahaz-shop-live-orbit-b {
	width: 230px; height: 100px; right: -55px; bottom: -48px;
	transform: rotate(18deg); border-color: rgba(255,111,194,.42);
	animation: shahaz-shop-orbit-b 10s ease-in-out infinite;
}

@keyframes shahaz-shop-orbit-a {
	0%,100% { transform: rotate(-18deg) translate3d(0,0,0); }
	50% { transform: rotate(-10deg) translate3d(22px,7px,0); }
}
@keyframes shahaz-shop-orbit-b {
	0%,100% { transform: rotate(18deg) translate3d(0,0,0); }
	50% { transform: rotate(10deg) translate3d(-20px,-6px,0); }
}

@media (max-width: 767px) {
	.shahaz-shop-page { padding-left: 8px; padding-right: 8px; }
	.shahaz-shop-live-header { min-height: 76px; margin-bottom: 8px; border-radius: 0; }
	.shahaz-shop-live-header-inner { min-height: 76px; padding: 7px 96px 6px; }
	.shahaz-shop-live-kicker { font-size: 5.5px; letter-spacing: .16em; }
	.shahaz-shop-live-title { font-size: clamp(19px, 7vw, 27px); margin: 2px 0 1px; }
	.shahaz-shop-live-copy { font-size: 7px; line-height: 1.05; }
	.shahaz-shop-live-divider { width: min(150px, 58%); margin-top: 2px; gap: 3px; }
	.shahaz-shop-live-divider i { font-size: 8px; }
	.shahaz-shop-live-status { margin-top: 2px; font-size: 4.8px; gap: 3px; }
	.shahaz-shop-live-status b { width: 4px; height: 4px; }
	.shahaz-shop-live-status em { width: 13px; }
}

@media (max-width: 380px) {
	.shahaz-shop-live-title { font-size: 18px; }
}

