/**
 * iDigital SMS — آیکون لیست انتظار روی کارت محصول در لوپ فروشگاه
 *
 * نکتهٔ موبایل: آیکون باید نسبت به همان بلوکِ لینک/تصویر position بگیرد؛
 * اگر فقط li.product relative باشد و قالب روی موبایل لینک را flex/static عوض کند،
 * گوشه‌ها یکسان دیده می‌شوند. لینک رایج ووکامرس را هم relative می‌کنیم.
 */

.woocommerce ul.products li.product,
ul.products li.product {
	position: relative;
}

/* نزدیک‌ترین جعبهٔ موقعیت‌دهی برای آیکون روی تصویر (کلاس‌های رایج قالب/ووکامرس) */
.woocommerce ul.products li.product > a,
.woocommerce ul.products li.product a.woocommerce-LoopProduct-link,
.woocommerce ul.products li.product a.woocommerce-loop-product__link,
.woocommerce ul.products li.product .woocommerce-LoopProduct-link {
	position: relative;
	display: block;
	width: 100%;
	max-width: 100%;
}

/* گرید بلوکی ووکامرس */
.wc-block-grid__product,
.wc-block-product {
	position: relative;
}

.wc-block-grid__product .wc-block-grid__product-link,
.wc-block-grid__product > a {
	position: relative;
	display: block;
	width: 100%;
	max-width: 100%;
}

.ids-loop-waitlist {
	box-sizing: border-box;
	z-index: 5;
	pointer-events: auto;
}

.ids-loop-waitlist--img-tr,
.ids-loop-waitlist--img-tl,
.ids-loop-waitlist--img-br,
.ids-loop-waitlist--img-bl {
	position: absolute;
}

.ids-loop-waitlist--img-tr {
	top: 8px;
	right: 8px;
	left: auto;
	bottom: auto;
}

.ids-loop-waitlist--img-tl {
	top: 8px;
	left: 8px;
	right: auto;
	bottom: auto;
}

.ids-loop-waitlist--img-br {
	bottom: 8px;
	right: 8px;
	top: auto;
	left: auto;
}

.ids-loop-waitlist--img-bl {
	bottom: 8px;
	left: 8px;
	top: auto;
	right: auto;
}

/*
 * موبایل: بعضی قالب‌ها با اولویت بالاتر position یا inset را عوض می‌کنند —
 * با !important چهار گوشه را جدا نگه می‌داریم.
 */
@media (max-width: 768px) {
	.woocommerce ul.products li.product .ids-loop-waitlist--img-tr,
	ul.products li.product .ids-loop-waitlist--img-tr,
	.wc-block-grid__product .ids-loop-waitlist--img-tr {
		position: absolute !important;
		top: 8px !important;
		right: 8px !important;
		left: auto !important;
		bottom: auto !important;
	}

	.woocommerce ul.products li.product .ids-loop-waitlist--img-tl,
	ul.products li.product .ids-loop-waitlist--img-tl,
	.wc-block-grid__product .ids-loop-waitlist--img-tl {
		position: absolute !important;
		top: 8px !important;
		left: 8px !important;
		right: auto !important;
		bottom: auto !important;
	}

	.woocommerce ul.products li.product .ids-loop-waitlist--img-br,
	ul.products li.product .ids-loop-waitlist--img-br,
	.wc-block-grid__product .ids-loop-waitlist--img-br {
		position: absolute !important;
		bottom: 8px !important;
		right: 8px !important;
		top: auto !important;
		left: auto !important;
	}

	.woocommerce ul.products li.product .ids-loop-waitlist--img-bl,
	ul.products li.product .ids-loop-waitlist--img-bl,
	.wc-block-grid__product .ids-loop-waitlist--img-bl {
		position: absolute !important;
		bottom: 8px !important;
		left: 8px !important;
		top: auto !important;
		right: auto !important;
	}
}

.ids-loop-waitlist--below-title {
	position: static;
	display: block;
	margin-top: 6px;
	clear: both;
}

.ids-loop-waitlist--shortcode {
	display: inline-flex;
	align-items: center;
	vertical-align: middle;
	margin: 4px 0;
}

/* دکمهٔ واقعی لیست انتظار داخل کارت لوپ */
.ids-loop-waitlist .ids-waitlist-wrap {
	display: inline-flex;
	margin: 0;
	vertical-align: middle;
	max-width: 100%;
}

.ids-loop-waitlist .ids-waitlist-btn {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	max-width: 100%;
	text-decoration: none;
	padding: 0;
	line-height: 1.2;
	border: none;
	cursor: pointer;
	font: inherit;
	transition: filter 0.2s ease, transform 0.15s ease;
	box-shadow: 0 1px 4px rgba(0, 0, 0, 0.12);
}

.ids-loop-waitlist .ids-waitlist-btn:hover,
.ids-loop-waitlist .ids-waitlist-btn:focus {
	filter: brightness(1.1);
	outline: none;
}

/* حالت «فقط آیکون» مثل نسخهٔ قبلی لینک */
.ids-loop-waitlist--style-icon .ids-waitlist-btn > span {
	display: none;
}

.ids-loop-waitlist--style-icon-text .ids-waitlist-btn > span {
	font-size: 12px;
	font-weight: 600;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	max-width: 140px;
}