/* Team Moon — Installments promo */

.tm-installments {
	--tm-inst-bar: #f2f2f2;
	--tm-inst-tile: #ffffff;
	--tm-inst-border: #e6e6e6;
	--tm-inst-text: #1a1a1a;
	--tm-inst-radius: 16px;
	box-sizing: border-box;
	width: 100%;
	max-width: 100%;
	margin: 0 0 14px;
	color: var(--tm-inst-text);
	font-size: 14px;
	line-height: 1.4;
	font-family: inherit;
}

.tm-installments *,
.tm-installments *::before,
.tm-installments *::after {
	box-sizing: border-box;
}

.tm-installments__providers {
	display: flex;
	align-items: center;
	flex-wrap: nowrap;
	gap: 8px;
	flex-shrink: 0;
	min-width: 0;
}

.tm-installments__cell {
	position: relative;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	padding: 7px 10px;
	min-height: 44px;
	background: var(--tm-inst-tile);
	border-radius: 12px;
	border: 1px solid rgba(0, 0, 0, 0.04);
	flex: 0 0 auto;
	cursor: pointer;
	-webkit-tap-highlight-color: transparent;
}

.tm-installments__visual {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	pointer-events: none;
	position: relative;
	z-index: 1;
}

.tm-installments__logo {
	display: block;
	height: 32px;
	width: auto;
	max-width: 96px;
	object-fit: contain;
	border-radius: 8px;
}

/* Decorative info icon (clicks go to the hit layer above). */
.tm-installments__info {
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	width: 18px !important;
	height: 18px !important;
	color: #1a1a1a !important;
	line-height: 0 !important;
	flex-shrink: 0 !important;
}

.tm-installments__info-icon {
	display: block;
	width: 16px;
	height: 16px;
	pointer-events: none;
}

/*
 * Invisible hit layer over logo + info.
 * Must stay opacity > 0 and visibility visible for iOS touch.
 */
.tm-installments__hit {
	position: absolute !important;
	inset: 0 !important;
	z-index: 5 !important;
	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
	border-radius: inherit !important;
	background: transparent !important;
	opacity: 0.01 !important;
	visibility: visible !important;
	cursor: pointer !important;
	overflow: hidden !important;
	-webkit-tap-highlight-color: transparent;
}

.tm-installments__hit--tabby,
.tm-installments__hit--tamara {
	appearance: none !important;
	display: block !important;
	width: auto !important;
	height: auto !important;
	min-width: 0 !important;
	min-height: 0 !important;
	max-width: none !important;
	max-height: none !important;
	box-shadow: none !important;
	color: transparent !important;
	font-size: 0 !important;
}

/* Design 1: grey bar + white logo tiles */
.tm-installments--bar {
	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	padding: 8px 12px;
	background: var(--tm-inst-bar);
	border-radius: var(--tm-inst-radius);
}

.tm-installments--bar .tm-installments__question {
	display: block;
	flex: 1 1 auto;
	min-width: 0;
	padding: 0;
	background: transparent;
	border: 0;
	font-weight: 500;
	font-size: 14px;
	color: var(--tm-inst-text);
	white-space: normal;
	overflow: visible;
	line-height: 1.35;
}

.tm-installments--bar .tm-installments__providers {
	margin-inline-start: auto;
}

/* Design 2: legend — text centered on the top border (AR + EN) */
.tm-installments--legend .tm-installments__legend-box {
	position: relative;
	margin-top: 14px;
	padding: 20px 12px 12px;
	border: 1.5px solid #d8d8d8;
	border-radius: var(--tm-inst-radius);
	background: #fff;
}

.tm-installments--legend .tm-installments__legend-label {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	width: max-content;
	max-width: calc(100% - 32px);
	margin-left: auto;
	margin-right: auto;
	transform: translateY(-50%);
	padding: 0 12px;
	background: #fff;
	font-weight: 600;
	font-size: 14px;
	line-height: 1.3;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	text-align: center;
	color: var(--tm-inst-text);
	z-index: 2;
}

/* Keep centered on LTR English and RTL Arabic */
.tm-installments--legend[dir="ltr"] .tm-installments__legend-label,
.tm-installments--legend[dir="rtl"] .tm-installments__legend-label {
	left: 0;
	right: 0;
	margin-left: auto;
	margin-right: auto;
	transform: translateY(-50%);
	text-align: center;
}

.tm-installments--legend .tm-installments__providers {
	justify-content: center;
	width: 100%;
}

.tm-installments--legend .tm-installments__cell {
	min-width: 120px;
	background: var(--tm-inst-bar);
	border: none;
}

.tm-installments--legend .tm-installments__logo {
	height: 34px;
	max-width: 104px;
}

/* Design 3: strip */
.tm-installments--strip {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	padding: 8px 12px;
	border-radius: 16px;
	background: var(--tm-inst-bar);
}

.tm-installments--strip .tm-installments__chip {
	display: inline-flex;
	align-items: center;
	padding: 6px 12px;
	border-radius: 999px;
	background: #111;
	color: #fff;
	font-size: 12.5px;
	font-weight: 600;
	white-space: nowrap;
}

.tm-installments--strip .tm-installments__providers {
	gap: 8px;
}

.tm-installments--strip .tm-installments__cell {
	padding: 5px 9px;
	min-height: 40px;
}

.tm-installments--strip .tm-installments__logo {
	height: 28px;
	max-width: 88px;
}

.single-product form.cart {
	margin-top: 0;
}

.tm-installments--product {
	margin: 0 0 12px;
}

/*
 * Product CTA column when installments is enabled:
 * 330px wide, hide qty, button 44px tall.
 */
body.tm-installments-active.single-product .tm-installments--product,
body.tm-installments-active.single-product form.cart,
body.tm-installments-active.single-product .tm-no-return {
	width: min(330px, 100%);
	max-width: 100%;
	box-sizing: border-box;
}

body.tm-installments-active.single-product form.cart {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 10px;
}

body.tm-installments-active.single-product form.cart .quantity {
	display: none !important;
}

body.tm-installments-active.single-product form.cart .single_add_to_cart_button,
body.tm-installments-active.single-product form.cart button.single_add_to_cart_button.button.alt {
	width: min(330px, 100%) !important;
	max-width: 100% !important;
	height: 44px !important;
	min-height: 44px !important;
	line-height: 44px !important;
	padding-top: 0 !important;
	padding-bottom: 0 !important;
	box-sizing: border-box !important;
}

/* Desktop / tablet product bar: one row, compact logos */
body.tm-installments-active.single-product .tm-installments--product.tm-installments--bar {
	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: space-between;
	gap: 8px;
	padding: 8px 10px;
	overflow: visible;
}

body.tm-installments-active.single-product .tm-installments--product.tm-installments--bar .tm-installments__question {
	flex: 1 1 auto;
	min-width: 0;
	font-size: 13px;
	line-height: 1.35;
	font-weight: 500;
	white-space: normal;
	overflow: visible;
	display: block;
}

body.tm-installments-active.single-product .tm-installments--product.tm-installments--bar .tm-installments__providers {
	flex: 0 0 auto;
	display: flex;
	align-items: center;
	gap: 6px;
	margin-inline-start: 0;
}

body.tm-installments-active.single-product .tm-installments--product.tm-installments--bar .tm-installments__cell {
	gap: 5px;
	padding: 4px 7px;
	min-height: 0;
	border-radius: 8px;
}

body.tm-installments-active.single-product .tm-installments--product.tm-installments--bar .tm-installments__logo {
	height: 22px;
	max-width: 68px;
	width: auto;
}

body.tm-installments-active.single-product .tm-installments--product.tm-installments--bar .tm-installments__info,
body.tm-installments-active.single-product .tm-installments--product.tm-installments--bar button.tm-installments__info {
	width: 14px !important;
	height: 14px !important;
	min-width: 14px !important;
	min-height: 14px !important;
	max-width: 14px !important;
	max-height: 14px !important;
}

body.tm-installments-active.single-product .tm-installments--product.tm-installments--bar .tm-installments__info-icon {
	width: 14px;
	height: 14px;
}

body.tm-installments-active.single-product .tm-installments--product.tm-installments--legend .tm-installments__logo,
body.tm-installments-active.single-product .tm-installments--product.tm-installments--strip .tm-installments__logo {
	height: 24px;
	max-width: 72px;
}

.tm-installments-cart-row td {
	padding-top: 14px !important;
	border-top: none !important;
}

/* Provider hosts — TabbyPromo / Tamara widget mount here (same pattern). */
.tm-installments-host,
#tabbyPromo.tm-installments-host,
#tm-tamara-promo-host {
	position: fixed !important;
	left: -10000px !important;
	top: 0 !important;
	width: 360px !important;
	height: 120px !important;
	margin: 0 !important;
	padding: 0 !important;
	overflow: hidden !important;
	opacity: 0 !important;
	visibility: hidden !important;
	pointer-events: none !important;
	z-index: -1 !important;
}

/* WebView-safe arm: briefly hittable during sync open (still nearly invisible). */
.tm-installments-host.tm-installments-host--armed,
#tm-tamara-promo-host.tm-installments-host--armed {
	left: 0 !important;
	top: 0 !important;
	width: 2px !important;
	height: 2px !important;
	opacity: 0.02 !important;
	visibility: visible !important;
	pointer-events: auto !important;
	overflow: visible !important;
	z-index: 2147483000 !important;
	clip: auto !important;
	clip-path: none !important;
}

/* Never hide official provider popups. */
body.tm-installments-active tamara-widget-popup:not([hide]) {
	display: block !important;
	visibility: visible !important;
	opacity: 1 !important;
	z-index: 2147483646 !important;
	clip: auto !important;
	clip-path: none !important;
	left: auto !important;
	pointer-events: auto !important;
}

/* Hide leftover native promo snippets when our banner is active. */
body.tm-installments-active .tabbyPromo:not(#tabbyPromo) {
	display: none !important;
}

body.tm-installments-active tamara-widget {
	display: none !important;
}

body.tm-installments-active #tm-tamara-promo-host tamara-widget {
	display: block !important;
}

/*
 * Mobile (AR + EN):
 * - Center the 330px wrappers only
 * - Stack question above logos so EN text never gets clipped
 */
@media (max-width: 768px) {
	body.tm-installments-active.single-product .tm-installments--product,
	body.tm-installments-active.single-product form.cart,
	body.tm-installments-active.single-product .tm-no-return {
		width: min(330px, calc(100% - 24px)) !important;
		margin-left: auto !important;
		margin-right: auto !important;
		margin-inline: auto !important;
		align-self: center;
		float: none !important;
	}

	body.tm-installments-active.single-product form.cart {
		justify-content: flex-start;
	}

	body.tm-installments-active.single-product form.cart .single_add_to_cart_button,
	body.tm-installments-active.single-product form.cart button.single_add_to_cart_button.button.alt {
		width: 100% !important;
		max-width: 100% !important;
		margin: 0 !important;
	}

	body.tm-installments-active.single-product .tm-installments--product.tm-installments--bar {
		flex-direction: column !important;
		align-items: stretch !important;
		justify-content: flex-start !important;
		gap: 10px !important;
		padding: 12px !important;
		overflow: visible !important;
	}

	body.tm-installments-active.single-product .tm-installments--product.tm-installments--bar .tm-installments__question {
		display: block !important;
		flex: none !important;
		width: 100% !important;
		min-width: 0 !important;
		max-width: none !important;
		font-size: 14px !important;
		line-height: 1.4 !important;
		white-space: normal !important;
		overflow: visible !important;
		text-overflow: unset !important;
		text-align: start !important;
		opacity: 1 !important;
		visibility: visible !important;
		height: auto !important;
		max-height: none !important;
	}

	body.tm-installments-active.single-product .tm-installments--product.tm-installments--bar .tm-installments__providers {
		display: flex !important;
		flex-wrap: wrap !important;
		width: 100% !important;
		max-width: none !important;
		justify-content: flex-start !important;
		gap: 8px !important;
		flex: none !important;
		margin: 0 !important;
	}

	body.tm-installments-active.single-product .tm-installments--product.tm-installments--bar .tm-installments__cell {
		padding: 6px 8px !important;
		min-height: 36px !important;
	}

	body.tm-installments-active.single-product .tm-installments--product.tm-installments--bar .tm-installments__logo {
		height: 26px !important;
		max-width: 78px !important;
	}

	body.tm-installments-active.single-product .tm-installments--product.tm-installments--strip {
		flex-direction: column !important;
		align-items: stretch !important;
	}

	body.tm-installments-active.single-product .tm-installments--product.tm-installments--strip .tm-installments__chip {
		justify-content: flex-start;
		white-space: normal;
	}

	body.tm-installments-active.single-product .tm-installments--product.tm-installments--legend .tm-installments__legend-label {
		left: 0 !important;
		right: 0 !important;
		width: max-content !important;
		max-width: calc(100% - 24px) !important;
		margin-left: auto !important;
		margin-right: auto !important;
		transform: translateY(-50%) !important;
		text-align: center !important;
		white-space: normal !important;
	}

	body.tm-installments-active.single-product .tm-no-return {
		justify-content: flex-start;
		text-align: start;
	}

	/* EN/LTR pages: keep start alignment (left), wrappers still centered */
	body.tm-installments-active.single-product .tm-installments--product[dir="ltr"],
	body.tm-installments-active.single-product .tm-no-return[dir="ltr"] {
		text-align: left;
	}

	body.tm-installments-active.single-product .tm-installments--product[dir="rtl"],
	body.tm-installments-active.single-product .tm-no-return[dir="rtl"] {
		text-align: right;
	}

	/* Optional: center title / price / rating on mobile (Installments settings). */
	body.tm-center-title-mobile.single-product .product_title,
	body.tm-center-title-mobile.single-product h1.product_title,
	body.tm-center-title-mobile.single-product .summary .product_title,
	body.tm-center-title-mobile.single-product .entry-summary .product_title {
		text-align: center !important;
		margin-left: auto !important;
		margin-right: auto !important;
	}

	body.tm-center-price-mobile.single-product .summary > .price,
	body.tm-center-price-mobile.single-product .summary p.price,
	body.tm-center-price-mobile.single-product .entry-summary > .price,
	body.tm-center-price-mobile.single-product .entry-summary p.price,
	body.tm-center-price-mobile.single-product .wd-single-price,
	body.tm-center-price-mobile.single-product .product-image-summary .price,
	body.tm-center-price-mobile.single-product .wd-single-price .price {
		text-align: center !important;
		margin-left: auto !important;
		margin-right: auto !important;
		justify-content: center !important;
	}

	body.tm-center-rating-mobile.single-product .woocommerce-product-rating {
		display: flex !important;
		flex-wrap: wrap !important;
		justify-content: center !important;
		align-items: center !important;
		text-align: center !important;
		margin-left: auto !important;
		margin-right: auto !important;
		width: 100% !important;
	}

	body.tm-center-rating-mobile.single-product .woocommerce-product-rating .star-rating {
		float: none !important;
		margin-left: 0.25em !important;
		margin-right: 0.25em !important;
	}
}