/* Directional fidelity fixes for mixed RTL text + LTR price/action groups in Cart. */

body.plasko-cart-page {
	--plasko-color-muted: var(--plasko-color-text-muted, #8293ab);
}

.plasko-cart-form__title {
	direction: ltr;
}

.plasko-cart-form__title h1 {
	direction: rtl;
}

/* Product media is the right-most element in both desktop and mobile Figma rows. */
.plasko-cart-item__product {
	flex-direction: row;
	direction: rtl;
}

/* Invoice values stay on the left while Persian labels stay on the right. */
.plasko-cart-invoice__row {
	direction: ltr;
}

.plasko-cart-invoice__row > span,
.plasko-cart-invoice__payable-label,
.plasko-cart-invoice__label-with-icon span {
	direction: rtl;
}

.plasko-cart-invoice__label-with-icon {
	direction: ltr;
}

/* Figma installment logos sit to the left of the Persian copy. */
.plasko-cart-installments {
	direction: ltr;
}

.plasko-cart-installments strong {
	direction: rtl;
}

/* "مشاهده همه" is left and the recommendation heading is right. */
.plasko-cart-recommendations__heading {
	direction: ltr;
}

.plasko-cart-recommendations__heading h2 {
	direction: rtl;
}

.plasko-cart-recommendations__more img {
	width: 12px;
	height: 12px;
	padding: 4px 8px;
	box-sizing: content-box;
	border-radius: 9999px;
}

.plasko-cart-collaterals__extensions:empty {
	display: none;
}

.plasko-cart-collaterals__extensions:not(:empty) {
	margin-top: 24px;
	direction: rtl;
}

/* Empty Cart — same soft khaki surfaces, navy actions and lime accent as the populated Cart. */
.plasko-cart-empty {
	width: 100%;
	padding-top: 24px;
	direction: rtl;
}

.plasko-cart-empty__hero {
	display: flex;
	width: min(680px, calc(100% - 48px));
	min-height: 430px;
	align-items: center;
	justify-content: center;
	flex-direction: column;
	gap: 28px;
	margin: 0 auto 56px;
	padding: 56px 48px;
	border: 1px solid #f4f1ec;
	border-radius: 24px;
	background: #fcfbf9;
	text-align: center;
}

.plasko-cart-empty__illustration {
	position: relative;
	display: grid;
	width: 112px;
	height: 112px;
	place-items: center;
	border: 1px solid #dcf5cc;
	border-radius: 50%;
	background: #f5fdee;
}

.plasko-cart-empty__icon {
	display: grid;
	width: 72px;
	height: 72px;
	place-items: center;
	border-radius: 50%;
	background: #fff;
	box-shadow: 0 8px 24px rgba(4, 38, 86, 0.08);
}

.plasko-cart-empty__icon img {
	display: block;
	width: 36px;
	height: 36px;
}

.plasko-cart-empty__spark {
	position: absolute;
	top: 10px;
	right: 7px;
	width: 18px;
	height: 18px;
	border: 4px solid #f5fdee;
	border-radius: 50%;
	background: var(--plasko-color-accent, #9ce76a);
}

.plasko-cart-empty__copy {
	display: flex;
	max-width: 470px;
	flex-direction: column;
	align-items: center;
	gap: 12px;
}

.plasko-cart-empty__copy h1 {
	margin: 0;
	color: var(--plasko-color-primary, #042656);
	font-size: 22px;
	font-weight: 800;
	line-height: 32px;
}

.plasko-cart-empty__copy p {
	margin: 0;
	color: #687d9a;
	font-size: 14px;
	font-weight: 600;
	line-height: 24px;
}

.plasko-cart-empty__cta {
	display: inline-flex;
	width: 240px;
	height: 56px;
	align-items: center;
	justify-content: center;
	gap: 10px;
	padding: 16px 24px;
	border-radius: 9999px;
	color: #fff;
	background: var(--plasko-color-primary, #042656);
	font-size: 16px;
	font-weight: 800;
	line-height: 24px;
	text-decoration: none;
	transition: transform 160ms ease, box-shadow 160ms ease;
}

.plasko-cart-empty__cta img {
	display: block;
	width: 18px;
	height: 18px;
	filter: brightness(0) invert(1);
}

.plasko-cart-empty__cta:hover {
	color: #fff;
	box-shadow: 0 10px 26px rgba(4, 38, 86, 0.16);
	transform: translateY(-1px);
}

.plasko-cart-empty__cta:focus-visible {
	outline: 3px solid rgba(156, 231, 106, 0.7);
	outline-offset: 3px;
}

.plasko-cart-empty .plasko-cart-recommendations,
.plasko-cart-empty .plasko-related-products.plasko-cart-recommendations {
	margin-top: 0;
}

@media (max-width: 767px) {
	/* The collapsed Figma factor/checkout bar is about 120px tall. */
	body.plasko-cart-page {
		padding-bottom: 132px;
	}

	body.plasko-cart-page.plasko-cart-is-empty {
		padding-bottom: 0;
	}

	.plasko-cart-empty {
		padding-top: 12px;
	}

	.plasko-cart-empty__hero {
		width: calc(100% - 24px);
		min-height: 390px;
		gap: 24px;
		margin-bottom: 28px;
		padding: 40px 20px;
		border-radius: 20px;
	}

	.plasko-cart-empty__illustration {
		width: 96px;
		height: 96px;
	}

	.plasko-cart-empty__icon {
		width: 64px;
		height: 64px;
	}

	.plasko-cart-empty__icon img {
		width: 32px;
		height: 32px;
	}

	.plasko-cart-empty__spark {
		top: 7px;
		right: 5px;
		width: 16px;
		height: 16px;
	}

	.plasko-cart-empty__copy {
		max-width: 320px;
		gap: 8px;
	}

	.plasko-cart-empty__copy h1 {
		font-size: 18px;
		line-height: 28px;
	}

	.plasko-cart-empty__copy p {
		font-size: 12px;
		line-height: 20px;
	}

	.plasko-cart-empty__cta {
		width: min(100%, 320px);
		height: 52px;
		padding: 14px 20px;
		font-size: 14px;
		line-height: 20px;
	}
}

@media (prefers-reduced-motion: reduce) {
	.plasko-cart-empty__cta {
		transition: none;
	}
}
