/**
*
*	Name:			IRANYekanX Fonts
*	Version:			2.4
*	Author:			Moslem Ebrahimi (moslemebrahimi.com)
*	Created on:		Aug 02, 2022
*	Updated on:		Aug 02, 2022
*	Website:			http://fontiran.com
*	Copyright:		Commercial/Proprietary Software
--------------------------------------------------------------------------------------
فونت ایران یکان X  یک نرم افزار مالکیتی محسوب می شود. جهت آگاهی از قوانین استفاده از این فونت ها لطفا به وب سایت (فونت ایران دات کام) مراجعه نمایید
--------------------------------------------------------------------------------------
IRANYekanX fonts are considered a proprietary software. To gain information about the laws regarding the use of these fonts, please visit www.fontiran.com 
--------------------------------------------------------------------------------------
This set of fonts are used in this project under the license: (ZX5RZW)
------------------------------------------------------------------------------------- fonts/-
*	
**/


@font-face {
	font-family: "WOFF IRANYekanXFaNum-Thin";
	src: url("../fonts/woff/IRANYekanXFaNum-Thin.woff");
}

@font-face {
	font-family: "WOFF IRANYekanXFaNum-UltraLight";
	src: url("../fonts/woff/IRANYekanXFaNum-UltraLight.woff");
}

@font-face {
	font-family: "WOFF IRANYekanXFaNum-Light";
	src: url("../fonts/woff/IRANYekanXFaNum-Light.woff");
}

@font-face {
	font-family: "WOFF IRANYekanXFaNum-Regular";
	src: url("../fonts/woff/IRANYekanXFaNum-Regular.woff");
}

@font-face {
	font-family: "WOFF IRANYekanXFaNum-Medium";
	src: url("../fonts/woff/IRANYekanXFaNum-Medium.woff");
}

@font-face {
	font-family: "WOFF IRANYekanXFaNum-DemiBold";
	src: url("../fonts/woff/IRANYekanXFaNum-DemiBold.woff");
}

@font-face {
	font-family: "WOFF IRANYekanXFaNum-Bold";
	src: url("../fonts/woff/IRANYekanXFaNum-Bold.woff");
}

@font-face {
	font-family: "WOFF IRANYekanXFaNum-ExtraBold";
	src: url("../fonts/woff/IRANYekanXFaNum-ExtraBold.woff");
}

@font-face {
	font-family: "WOFF IRANYekanXFaNum-Black";
	src: url("../fonts/woff/IRANYekanXFaNum-Black.woff");
}

@font-face {
	font-family: "WOFF IRANYekanXFaNum-ExtraBlack";
	src: url("../fonts/woff/IRANYekanXFaNum-ExtraBlack.woff");
}

@font-face {
	font-family: "WOFF IRANYekanXFaNum-Heavy";
	src: url("../fonts/woff/IRANYekanXFaNum-Heavy.woff");
}

@font-face {
	font-family: "WOFF2 IRANYekanXFaNum-Thin";
	src: url("../fonts/woff2/IRANYekanXFaNum-Thin.woff2");
}

@font-face {
	font-family: "WOFF2 IRANYekanXFaNum-UltraLight";
	src: url("../fonts/woff2/IRANYekanXFaNum-UltraLight.woff2");
}

@font-face {
	font-family: "WOFF2 IRANYekanXFaNum-Light";
	src: url("../fonts/woff2/IRANYekanXFaNum-Light.woff2");
}

@font-face {
	font-family: "WOFF2 IRANYekanXFaNum-Regular";
	src: url("../fonts/woff2/IRANYekanXFaNum-Regular.woff2");
}

@font-face {
	font-family: "WOFF2 IRANYekanXFaNum-Medium";
	src: url("../fonts/woff2/IRANYekanXFaNum-Medium.woff2");
}

@font-face {
	font-family: "WOFF2 IRANYekanXFaNum-DemiBold";
	src: url("../fonts/woff2/IRANYekanXFaNum-DemiBold.woff2");
}

@font-face {
	font-family: "WOFF2 IRANYekanXFaNum-Bold";
	src: url("../fonts/woff2/IRANYekanXFaNum-Bold.woff2");
}

@font-face {
	font-family: "WOFF2 IRANYekanXFaNum-ExtraBold";
	src: url("../fonts/woff2/IRANYekanXFaNum-ExtraBold.woff2");
}

@font-face {
	font-family: "WOFF2 IRANYekanXFaNum-Black";
	src: url("../fonts/woff2/IRANYekanXFaNum-Black.woff2");
}

@font-face {
	font-family: "WOFF2 IRANYekanXFaNum-ExtraBlack";
	src: url("../fonts/woff2/IRANYekanXFaNum-ExtraBlack.woff2");
}

@font-face {
	font-family: "WOFF2 IRANYekanXFaNum-Heavy";
	src: url("../fonts/woff2/IRANYekanXFaNum-Heavy.woff2");
}

@font-face {
	font-family: IRANYekanX;
	font-style: normal;
	font-weight: 100;
	src: url('../fonts/woff/IRANYekanX-Thin.woff') format('woff'),
		url('../fonts/woff2/IRANYekanX-Thin.woff2') format('woff2');
}

@font-face {
	font-family: IRANYekanX;
	font-style: normal;
	font-weight: 200;
	src: url('../fonts/woff/IRANYekanX-UltraLight.woff') format('woff'),
		url('../fonts/woff2/IRANYekanX-UltraLight.woff2') format('woff2');
}

@font-face {
	font-family: IRANYekanX;
	font-style: normal;
	font-weight: 300;
	src: url('../fonts/woff/IRANYekanX-Light.woff') format('woff'),
		url('../fonts/woff2/IRANYekanX-Light.woff2') format('woff2');
}

@font-face {
	font-family: IRANYekanX;
	font-style: normal;
	font-weight: 500;
	src: url('../fonts/woff/IRANYekanX-Medium.woff') format('woff'),
		url('../fonts/woff2/IRANYekanX-Medium.woff2') format('woff2');
}

@font-face {
	font-family: IRANYekanX;
	font-style: normal;
	font-weight: 600;
	src: url('../fonts/woff/IRANYekanX-DemiBold.woff') format('woff'),
		url('../fonts/woff2/IRANYekanX-DemiBold.woff2') format('woff2');
}

@font-face {
	font-family: IRANYekanX;
	font-style: normal;
	font-weight: 800;
	src: url('../fonts/woff/IRANYekanX-ExtraBold.woff') format('woff'),
		url('../fonts/woff2/IRANYekanX-ExtraBold.woff2') format('woff2');
}

@font-face {
	font-family: IRANYekanX;
	font-style: normal;
	font-weight: 900;
	src: url('../fonts/woff/IRANYekanX-Black.woff') format('woff'),
		url('../fonts/woff2/IRANYekanX-Black.woff2') format('woff2');
}

@font-face {
	font-family: IRANYekanX;
	font-style: normal;
	font-weight: 950;
	src: url('../fonts/woff/IRANYekanX-ExtraBlack.woff') format('woff'),
		url('../fonts/woff2/IRANYekanX-ExtraBlack.woff2') format('woff2');
}

@font-face {
	font-family: IRANYekanX;
	font-style: normal;
	font-weight: 1000;
	src: url('../fonts/woff/IRANYekanX-Heavy.woff') format('woff'),
		url('../fonts/woff2/IRANYekanX-Heavy.woff2') format('woff2');
}

@font-face {
	font-family: IRANYekanX;
	font-style: normal;
	font-weight: bold;
	src: url('../fonts/woff/IRANYekanX-Bold.woff') format('woff'),
		url('../fonts/woff2/IRANYekanX-Bold.woff2') format('woff2');
}

@font-face {
	font-family: IRANYekanX;
	font-style: normal;
	font-weight: normal;
	src: url('../fonts/woff/IRANYekanX-Regular.woff') format('woff'),
		url('../fonts/woff2/IRANYekanX-Regular.woff2') format('woff2');
}

@font-face {
	font-family: IRANYekanXNum;
	font-style: normal;
	font-weight: normal;
	src: url('../fonts/woff/IRANYekanXFaNum-Regular.woff') format('woff'),
		url('../fonts/woff2/IRANYekanXFaNum-Regular.woff2') format('woff2');
}

html,
body {
	margin: 0;
	padding: 0;
	height: 100%;
	font-family: IRANYekanXNum !important;
	color: #4d4d4d !important;
	font-size: 11px !important;
	background-color: #F3F3FA !important;
	font-size: 11px;
	 -webkit-overflow-scrolling: touch
}

.app {
	width: 100%;
	height: 100vh;
 -webkit-overflow-scrolling: touch

}

.rs-text {
	font-family: IRANYekanXNum !important;
}

.text-center {
	text-align: center;
}

.text-right {
	text-align: right !important;
}

.text-left {
	text-align: left !important;
}

.center {
	display: flex;
	justify-content: center;
	align-items: center;
}

/* Border Radious**/
.round-10 {
	border-radius: 10px;
}

/* Margins**/
.mt-10 {
	margin-top: 10px;
}

.mt-20 {
	margin-top: 20px;
}

.mt-30 {
	margin-top: 30px;
}

.mt-40 {
	margin-top: 40px;
}

.mb-10 {
	margin-bottom: 10px;
}

.mb-20 {
	margin-bottom: 20px;
}

.mb-30 {
	margin-bottom: 30px;
}

.mb-40 {
	margin-bottom: 40px;
}

.text-discount-decoration {
	text-decoration: line-through;
	font-weight: lighter;
	color: #8c8c8c;
}

/* عکسِ اقلامِ ناموجود/غیرفعال — یک زبانِ واحد در همهٔ لیست‌ها و سوییپرها */
.grayscale {
	filter: grayscale(100%);
}

.overflow-hidden {
	overflow: hidden;
}

.sticky-div {
	bottom: 0px;
	position: sticky;
	width: 100%;
	background-color: white;
}

.FixedCenterPosition {
	margin-right: auto;
	margin-left: auto;
}

/* استایل‌ها برای پنل تخفیف‌ها */
.discounts-panel-container {
	margin: 0 15px 20px;
	overflow: hidden;

}

.discounts-panel {
	box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05);
	overflow: hidden;
}

.discounts-swiper-wrapper {
	padding: 0 10px 15px;

}

.custom-discount-swiper {
	padding: 5px;
	margin: -5px;
}

/* کارتِ سوییپرِ «تخفیف ها» — نام‌فضای مستقل discount-swiper-*؛ کلاسِ عامِ discount-card
   مالِ کارتِ کدِ تخفیفِ Payment.js است و نباید با این یکی قاطی شود */
.discount-swiper-card {
	background: white;
	border-radius: 8px;
	height: 100%;
	overflow: hidden;
	display: flex;
	flex-direction: column;
	transition: all 0.3s ease;
}

.discount-swiper-info {
	padding: 12px;
	flex-grow: 1;
	display: flex;
	flex-direction: column;
}

.discount-swiper-title {
	font-weight: 500;
	margin-bottom: 8px;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
	overflow: hidden;
	text-overflow: ellipsis;
	min-height: 40px;
}

.discount-swiper-prices {
	margin-top: auto;
	margin-bottom: 10px;
	display: flex;
	flex-direction: column;
}

.original-price {
	text-decoration: line-through;
	color: #999;
	font-size: 12px;
	margin-left: 5px;
	display: block;
}

@media (max-width: 767px) {
	.discounts-panel-container {
		margin: 0 10px 15px;
	}

	.discounts-swiper-wrapper {
		padding: 0 5px 10px;
	}

	.discount-swiper-title {
		font-size: 13px;
		min-height: 36px;
	}
}

/* استایل‌ها برای پنل علاقه‌مندی‌ها */
.favorites-panel-container {
	margin: 0 15px 20px;
	overflow: hidden;
}

.favorites-panel {
	box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05);
	overflow: hidden;
}

.favorites-swiper-wrapper {
	padding: 0 10px 15px;
}

.custom-favorite-swiper {
	padding: 5px;
	margin: -5px;
}


/* کارتِ سوییپرِ «خریدهای قبلی» (OrderItem موبایل) — height:100% تا کارت‌ها با تخفیف/ناموجود هم‌قد بمانند */
.favorite {
	height: 100%;
	display: flex;
	flex-direction: column;
	border-radius: 8px;
	overflow: hidden;
}

.favorite-info {
	padding: 12px;
	flex-grow: 1;
	display: flex;
	flex-direction: column;
}

.favorite-title {
	font-weight: 500;
	margin-bottom: 8px;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
	overflow: hidden;
	text-overflow: ellipsis;
	min-height: 40px;
}

/* ارتفاع رزروشده: کارتِ بی‌تخفیف (یک خط) و کارتِ باتخفیف (خط خط‌خورده + قیمت) هم‌تراز می‌مانند */
.favorite-prices {
	margin-top: auto;
	margin-bottom: 10px;
	min-height: 38px;
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
}

/* اسلات اقدام: «ناموجود»، «غیر فعال» و شمارندهٔ افزودن همگی یک ارتفاع می‌گیرند */
.favorite-action {
	min-height: 36px;
	display: flex;
	align-items: center;
}

.favorite-action>* {
	width: 100%;
}

@media (max-width: 767px) {
	.favorites-panel-container {
		margin: 0 10px 15px;
	}

	.favorites-swiper-wrapper {
		padding: 0 5px 10px;
	}

	.favorite-title {
		font-size: 13px;
		min-height: 36px;
	}
}

.rs-progress-line-inner {
	transition: width 0.3s ease-in-out;
}

.icon-star {
	color: #ffc107;
	margin: 0 0.5rem;
}

.icon-gift {
	margin: 0 0.5rem;
}

.discount-main-panel {
	background: white;
	border-radius: 8px;
	border: 1px dashed #eaeaea;
}

.discount-header {
	margin-bottom: 16px;
	padding-bottom: 12px;
	border-bottom: 1px solid #f0f0f0;
}

/* عنوانِ «کوپن های تخفیف» در Payment.js — مصرف‌کنندهٔ واقعیِ این کلاس همین‌جاست */
.discount-title {
	font-weight: 500;
	margin-bottom: 8px;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	overflow: hidden;
	text-overflow: ellipsis;
	min-height: 40px;
}

@media (max-width: 767px) {
	.discount-title {
		font-size: 13px;
		min-height: 36px;
	}
}

.gift-icon {
	color: #e74c3c;
}

.discount-codes-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
	gap: 12px;
}

/* استایل کارت تخفیف */
.discount-card {
	border-radius: 6px;
	display: flex;
	flex-direction: column;
	background: #fff;
	border-left: 3px dashed transparent !important;
	/* حاشیه نامرئی در حالت عادی */
	transition: all 0.2s ease;
	border: 1px dashed #e0e0e0 !important;
}

.discount-card.applied {
	border: 3px solid transparent !important;
	border-left: 3px solid var(--rs-green-500) !important;
	background-color: rgba(46, 204, 113, 0.03);
	/* حاشیه نامرئی در حالت عادی */

}

.card-header {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 10px;
	padding-bottom: 8px;
	border-bottom: 1px dashed #eee;
}

.discount-code {
	font-weight: 700;
	font-size: 0.95rem;
	display: flex;
	align-items: center;
}

.discount-code .gift-icon {
	margin-left: 5px;
	margin-right: 5px;
	font-size: 0.9rem;
}

.discount-value {
	color: var(--rs-blue-700);
	font-size: 1.3rem;
}

.card-details {
	flex-grow: 1;
	margin-bottom: 14px;
}

.detail-row {
	margin: 6px 0;
}

/* دکمه اعمال */
.apply-button {
	margin-top: auto;
	font-weight: 600;
	border-radius: 5px;
}

/* پیام عدم وجود کد تخفیف */
.no-discount-message {
	text-align: center;
	background: #f9f9f9;
	border-radius: 6px;
}

.message-icon {
	font-size: 1.8rem;
	color: #bdc3c7;
}

/* رسپانسیو برای موبایل */
@media (max-width: 768px) {
	.discount-main-panel {
		margin: 8px 0;
	}

	.discount-codes-grid {
		grid-template-columns: 1fr;
	}

	.discount-card {}
}

/* استایل‌های دراور Sillex */
.sillex-drawer {
    border-top-left-radius: 30px !important;
    border-top-right-radius: 30px !important;
}

.sillex-drawer-header {
    background: linear-gradient(to bottom, #87CEEB, #add8e6);
    color: #fff;
    border-top-left-radius: 30px;
    border-top-right-radius: 30px;
    padding: 20px 15px;
}

.sillex-motorcycle-icon {
    position: relative;
}

.sillex-motorcycle {
    color: #fff;
}

.sillex-title {
    font-size: 18px;
    font-weight: bold;
}

.sillex-drawer-body {
    background-color: #f0f8ff;
    padding: 20px 15px;
}

.sillex-panel {
    border: none;
    text-align: center;
    border-radius: 20px;
    background-color: #fff;
    padding: 15px;
}

.sillex-price {
    color: #87CEEB;
    display: block;
    margin-top: 8px;
    margin-bottom: 16px;
}

.sillex-button {
    background-color: #87CEEB;
    color: #fff;
    border-radius: 30px;
    padding: 12px 24px;
    font-weight: bold;

}


/* ===== کارتِ بلیتیِ کد تخفیف (Components/Order/CouponCard.js) — Payment + دراورهای DGMenu =====
   بریدگی‌های دو سرِ خطِ سوراخ‌دار هم‌رنگِ پنلِ والد (سفید) است؛ اگر والد رنگ دیگری دارد --cpn-hole را عوض کن. */
.cpn-card {
	--cpn-hole: #fff;
	background: #f7f8fa;
	border: 1px solid #eceef1;
	border-radius: 18px;
	overflow: hidden;
	direction: rtl;
	text-align: right;
	transition: border-color .2s ease, background .2s ease;
}
.cpn-card.cpn-applied { border: 1.5px solid #16a34a; background: #f3fbf6; }
.cpn-top { padding: 14px 16px 12px; position: relative; }
.cpn-badge {
	position: absolute; top: 14px; left: 14px;
	display: inline-flex; align-items: center; gap: 4px;
	font-size: 11px; font-weight: 700; padding: 3px 10px; border-radius: 999px;
	background: #fff; color: #6b7280; border: 1px solid #eceef1;
}
.cpn-badge-ok { background: #dcfce7; color: #15803d; border-color: #bbf7d0; }
.cpn-hero { display: flex; align-items: baseline; gap: 6px; line-height: 1.1; }
.cpn-hero-num { font-size: 32px; font-weight: 900; color: #111827; letter-spacing: -0.5px; }
.cpn-hero-unit { font-size: 15px; font-weight: 700; color: #111827; }
.cpn-sub { font-size: 13px; color: #6b7280; margin-top: 6px; }
.cpn-sub b { color: #111827; font-weight: 800; }
.cpn-locked .cpn-hero-num, .cpn-locked .cpn-hero-unit { color: #9ca3af; }
.cpn-perf { position: relative; border-top: 1.5px dashed #d9dce1; margin: 0 14px; }
.cpn-perf::before, .cpn-perf::after {
	content: ""; position: absolute; top: -10px; width: 18px; height: 18px; border-radius: 50%;
	background: var(--cpn-hole); border: 1px solid #eceef1;
}
.cpn-perf::before { right: -24px; }
.cpn-perf::after { left: -24px; }
.cpn-applied .cpn-perf::before, .cpn-applied .cpn-perf::after { border-color: #16a34a; }
.cpn-bottom { padding: 12px 16px 14px; }
.cpn-chips { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 12px; }
.cpn-chip {
	display: inline-flex; align-items: center; gap: 4px;
	font-size: 11.5px; padding: 4px 10px; border-radius: 999px;
	background: #fff; color: #4b5563; border: 1px solid #eceef1; white-space: nowrap;
}
.cpn-chip-warn { background: #fff7ed; color: #c2410c; border-color: #fed7aa; }
.cpn-btn {
	width: 100%; height: 44px; border: none; border-radius: 999px;
	color: #fff; font-size: 14px; font-weight: 800;
	display: flex; align-items: center; justify-content: center; gap: 6px;
	transition: transform .1s ease, opacity .2s ease;
}
.cpn-btn:active { transform: scale(.98); }
.cpn-btn:disabled { opacity: .55; }
.cpn-progress-text { display: flex; justify-content: space-between; align-items: baseline; gap: 8px; font-size: 12.5px; font-weight: 700; color: #111827; }
.cpn-progress-of { font-size: 11px; font-weight: 400; color: #9ca3af; white-space: nowrap; }
.cpn-bar { height: 6px; border-radius: 99px; background: #e5e7eb; overflow: hidden; margin-top: 8px; }
.cpn-bar-fill { height: 100%; border-radius: 99px; transition: width .3s ease; }
.cpn-applied-row { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.cpn-applied-text { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; font-weight: 700; color: #15803d; }
.cpn-link { background: none; border: none; padding: 4px 6px; font-size: 13px; color: #6b7280; text-decoration: underline; text-underline-offset: 3px; }
.cpn-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 12px; }
@media (max-width: 767px) { .cpn-list { grid-template-columns: 1fr; } }

/* ===== بلیتِ افقیِ کد تخفیف در دراور سبد دیجیتال‌منو (Components/Order/DgCouponPanel.js) =====
   بریدگی‌های بالا/پایینِ خط عمودی هم‌رنگِ فوترِ سفیدِ دراور است (--cpnx-hole). */
.cpnx-panel { margin-bottom: 14px; direction: rtl; }
.cpnx-toggle {
	width: 100%; display: flex; align-items: center; justify-content: space-between; gap: 8px;
	background: #f7f8fa; border: 1px solid #eceef1; border-radius: 16px; padding: 12px 14px; cursor: pointer;
}
.cpnx-toggle-ok { background: #f0fdf4; border-color: #bbf7d0; }
.cpnx-toggle-label { display: inline-flex; align-items: center; gap: 8px; font-size: 13.5px; font-weight: 800; color: #111827; }
.cpnx-toggle-label svg { color: #dc2626; }
.cpnx-toggle-ok .cpnx-toggle-label, .cpnx-toggle-ok .cpnx-toggle-label svg { color: #15803d; }
.cpnx-count { min-width: 20px; height: 20px; padding: 0 6px; border-radius: 999px; color: #fff; font-size: 11px; display: inline-flex; align-items: center; justify-content: center; }
.cpnx-toggle-hint { display: inline-flex; align-items: center; gap: 5px; font-size: 12px; color: #6b7280; }
.cpnx-list { display: flex; flex-direction: column; gap: 8px; margin-top: 10px; overflow-y: auto; padding: 1px; }
.cpnx-note { background: #fff7ed; border: 1px solid #fed7aa; border-radius: 12px; padding: 8px 12px; font-size: 11.5px; color: #c2410c; text-align: center; }
.cpnx {
	--cpnx-hole: #fff;
	display: flex; align-items: stretch; min-height: 76px; flex-shrink: 0;
	background: #fff; border: 1px solid #e6e8ec; border-radius: 16px; overflow: hidden; text-align: right;
}
.cpnx.cpnx-applied { border: 1.5px solid #16a34a; background: #f3fbf6; }
.cpnx-stub { width: 76px; flex-shrink: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px; background: #f3f4f6; color: #9ca3af; }
.cpnx-applied .cpnx-stub { background: #dcfce7; color: #15803d; }
.cpnx-stub-main { font-weight: 900; line-height: 1.1; white-space: nowrap; }
.cpnx-stub-unit { font-size: 11px; font-weight: 700; }
.cpnx-perf { position: relative; width: 0; border-left: 1.5px dashed #d9dce1; }
.cpnx-perf::before, .cpnx-perf::after {
	content: ""; position: absolute; left: -8px; width: 14px; height: 14px; border-radius: 50%;
	background: var(--cpnx-hole); border: 1px solid #e6e8ec;
}
.cpnx-perf::before { top: -8px; }
.cpnx-perf::after { bottom: -8px; }
.cpnx-applied .cpnx-perf::before, .cpnx-applied .cpnx-perf::after { border-color: #16a34a; }
.cpnx-body { flex: 1; min-width: 0; padding: 10px 12px; display: flex; flex-direction: column; justify-content: center; gap: 3px; }
.cpnx-title { font-size: 13px; font-weight: 800; color: #111827; }
.cpnx-locked .cpnx-title { color: #6b7280; }
.cpnx-meta { font-size: 11.5px; color: #6b7280; line-height: 1.6; overflow: hidden; }
.cpnx-warn { color: #c2410c; font-weight: 700; }
.cpnx-bar { height: 5px; border-radius: 99px; background: #e5e7eb; overflow: hidden; margin-top: 4px; }
.cpnx-bar > div { height: 100%; border-radius: 99px; }
.cpnx-need { font-size: 11px; font-weight: 700; color: #374151; }
.cpnx-ok { display: inline-flex; align-items: center; gap: 4px; font-size: 11.5px; font-weight: 700; color: #15803d; }
.cpnx-act { display: flex; align-items: center; padding-left: 12px; flex-shrink: 0; }
.cpnx-btn { min-width: 62px; height: 34px; padding: 0 14px; border: none; border-radius: 999px; color: #fff; font-size: 12.5px; font-weight: 800; display: inline-flex; align-items: center; justify-content: center; cursor: pointer; }
.cpnx-btn:disabled { opacity: .55; cursor: default; }
.cpnx-btn-ghost { background: #fff; color: #dc2626; border: 1px solid #fecaca; }
.cpnx-pill-ok { display: inline-flex; align-items: center; gap: 4px; font-size: 11.5px; font-weight: 800; color: #15803d; background: #dcfce7; padding: 4px 10px; border-radius: 999px; }
.cpnx-meta-row { display: flex; flex-wrap: wrap; align-items: center; margin-right: -14px; } /* قطعه‌ها nowrap‌اند؛ wrap بین قطعه‌ها + بریدنِ نقطهٔ اول هر خط (DgCouponPanel) */
.cpnx-mi { unicode-bidi: isolate; white-space: nowrap; }
.cpnx-mi::before { content: "\00B7"; display: inline-block; width: 14px; text-align: center; color: #c4c8cf; font-weight: 400; }
.addons-cat-reveal { animation: addonsCatReveal 0.32s ease-out; scroll-margin-bottom: 120px; }
.addons-cat-reveal-hint { display: inline-flex; align-items: center; margin-top: 10px; font-size: 12px; font-weight: 700; color: #15803d; background: #dcfce7; padding: 4px 12px; border-radius: 999px; }
@keyframes addonsCatReveal { from { opacity: 0; transform: translateY(-6px); } to { opacity: 1; transform: translateY(0); } }
@media (prefers-reduced-motion: reduce) { .addons-cat-reveal { animation: none; } }
.aos-drawer .rs-drawer-body { padding: 0 !important; background: #f6f6f8; }
.aos { min-height: 100%; display: flex; flex-direction: column; direction: rtl; }
.aos-head { position: sticky; top: 0; z-index: 3; background: #fff; border-bottom: 1px solid #eeeef2; }
.aos-head-row { display: flex; align-items: center; gap: 12px; padding: 14px 16px 10px; }
.aos-title { flex: 1; min-width: 0; font-size: 16px; font-weight: 800; color: #111; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.aos-chips { display: flex; gap: 6px; overflow-x: auto; padding: 0 16px 12px; scrollbar-width: none; -webkit-overflow-scrolling: touch; }
.aos-chips::-webkit-scrollbar { display: none; }
.aos-jump { flex: none; display: inline-flex; align-items: center; gap: 4px; font: inherit; font-size: 12px; font-weight: 600; color: #333; background: #f2f2f5; border: 0; border-radius: 999px; padding: 6px 12px; white-space: nowrap; -webkit-tap-highlight-color: transparent; touch-action: manipulation; }
.aos-jump.is-done { color: #15803d; background: #e8f6ee; }
.aos-list { flex: 1; padding: 12px 12px 8px; }
.aos-sec { background: #fff; border: 1.5px solid transparent; border-radius: 18px; padding: 14px 14px 8px; margin-bottom: 10px; scroll-margin-top: 120px; scroll-margin-bottom: 110px; transition: border-color .25s ease; }
.aos-sec.is-dep { animation: aosIn .32s ease-out; }
.aos-sec.is-need { border-color: #ef4444; animation: aosNudge .38s ease; }
.aos-dep-hint { display: inline-block; font-size: 11.5px; font-weight: 700; color: #15803d; background: #e8f6ee; border-radius: 999px; padding: 3px 10px; margin-bottom: 10px; }
.aos-sec-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 8px; }
.aos-sec-title { font-size: 15px; font-weight: 800; color: #111; }
.aos-chip { flex: none; display: inline-flex; align-items: center; gap: 3px; font-size: 11px; font-weight: 700; color: #666; background: #f2f2f5; border-radius: 999px; padding: 3px 9px; white-space: nowrap; }
.aos-chip.is-req { color: #b91c1c; background: #fdecec; }
.aos-chip.is-done { color: #15803d; background: #e8f6ee; }
.aos-row { display: flex; align-items: center; gap: 12px; width: 100%; min-height: 52px; padding: 8px 10px; margin: 0 0 6px; border: 0; border-radius: 14px; background: transparent; font: inherit; color: #111; text-align: right; cursor: pointer; -webkit-appearance: none; appearance: none; -webkit-tap-highlight-color: transparent; touch-action: manipulation; transition: background-color .15s ease, transform .1s ease; }
.aos-row:active { transform: scale(.985); }
.aos-row.is-on { background: #f2f2f5; }
.aos-row.is-off { cursor: default; opacity: .55; }
.aos-row.is-full { opacity: .4; }
.aos-mark { flex: none; width: 22px; height: 22px; border-radius: 7px; border: 1.5px solid #c7c7cf; display: inline-flex; align-items: center; justify-content: center; color: #fff; transition: background-color .15s ease, border-color .15s ease; }
.aos-mark.is-radio { border-radius: 50%; }
.aos-row.is-on .aos-mark { background: #111; border-color: #111; }
.aos-name { flex: 1; min-width: 0; font-size: 14px; font-weight: 600; line-height: 1.6; }
.aos-price { flex: none; font-size: 13px; font-weight: 700; color: #111; direction: ltr; unicode-bidi: isolate; }
.aos-price.is-free { color: #15803d; font-weight: 600; }
.aos-tag-off { flex: none; font-size: 11px; font-weight: 700; color: #b91c1c; background: #fdecec; border-radius: 999px; padding: 2px 8px; }
.aos-foot { position: sticky; bottom: 0; z-index: 3; display: flex; align-items: center; gap: 10px; background: #fff; border-top: 1px solid #eeeef2; padding: 12px 12px; padding-bottom: max(12px, env(safe-area-inset-bottom)); }
.aos-cta { flex: 1; min-width: 0; height: 50px; border: 0; border-radius: 999px; background: #111; color: #fff; font: inherit; font-size: 14px; font-weight: 800; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; padding: 0 14px; -webkit-tap-highlight-color: transparent; touch-action: manipulation; transition: background-color .2s ease, color .2s ease, transform .1s ease; }
.aos-cta:active { transform: scale(.98); }
.aos-cta.is-pending { background: #f2f2f5; color: #111; }
.aos-modal-list .aos-list { padding: 0; }
.aos-modal-list .aos-sec { background: #f8f8fa; }
@keyframes aosIn { from { opacity: 0; transform: translateY(-8px); } to { opacity: 1; transform: translateY(0); } }
@keyframes aosNudge { 0%, 100% { transform: translateX(0); } 30% { transform: translateX(-5px); } 60% { transform: translateX(4px); } }
@media (prefers-reduced-motion: reduce) { .aos-sec.is-dep, .aos-sec.is-need { animation: none; } .aos-row, .aos-cta { transition: none; } }
.aos-name { display: flex; flex-direction: column; align-items: flex-start; }
.aos-lead { flex: none; font-size: 12px; color: #a3a3ad; transition: transform .2s ease; }
.aos-nest { margin: 4px 0 6px; padding: 12px 0 0; border-top: 1px dashed #e4e4ea; animation: aosNest .32s ease-out; scroll-margin-top: 120px; scroll-margin-bottom: 110px; }
.aos-nest .aos-sec-title { font-size: 14px; }
.aos-nest.is-need { animation: aosNudge .38s ease; }
.aos-nest.is-need .aos-sec-title { color: #dc2626; }
@keyframes aosNest { from { opacity: 0; transform: translateY(-6px); } to { opacity: 1; transform: translateY(0); } }
@media (prefers-reduced-motion: reduce) { .aos-nest, .aos-nest.is-need { animation: none; } }