/* =========================================
   Single Product Page Styles (Desktop Only)
========================================= */

/* 1. استایل 4 باکس ویژگی سمت راست */
.rst-single-product-page .rst-feature-glass-box {
    background: linear-gradient(51deg, rgba(58, 41, 121, 1) 0%, rgba(56, 55, 75, 0.66) 48%);
    backdrop-filter: blur(15px);
    box-shadow: 0 25px 50px rgba(0, 0, 0, 0.3);
    /*border: 0.5px solid;*/
    /*border-image-source: linear-gradient(143.54deg, #FFFFFF -1.92%, #0A0815 61.54%, #FFFFFF 102.01%);*/
    border-radius: var(--box-radius);
    transition: all 0.3s ease;
}

.rst-single-product-page .rst-feature-glass-box:hover {
    transform: translateY(-5px);
    background: rgba(255, 255, 255, 0.04);
    border-color: rgba(93, 93, 255, 0.3);
}

/* وضعیت اولیه باکس‌ها (مخفی و پایین‌تر از جای اصلی) */
.rst-animate-up {
    opacity: 0;
    transform: translateY(40px);
    animation: rstFadeUp 0.6s ease-out forwards;
}

.rst-animate-up:nth-child(1) {
    animation-delay: 0.10s;
}

.rst-animate-up:nth-child(2) {
    animation-delay: 0.25s;
}

.rst-animate-up:nth-child(3) {
    animation-delay: 0.40s;
}

.rst-animate-up:nth-child(4) {
    animation-delay: 0.55s;
}

/* تعریف فریم‌های انیمیشن حرکت به سمت بالا */
@keyframes rstFadeUp {
    0% {
        opacity: 0;
        transform: translateY(40px);
    }
    100% {
        opacity: 1;
        transform: translateY(0);
    }
}

.rst-single-product-page .rst-icon-wrapper {
    color: #5D5DFF;
    filter: drop-shadow(0 0 8px rgba(93, 93, 255, 0.5));
}

/* 2. استایل باکس اصلی بزرگ سمت چپ */
.rst-single-product-page .rst-main-product-box {
    background: linear-gradient(51deg, rgba(58, 41, 121, 1) 0%, rgba(56, 55, 75, 0.66) 48%);
    backdrop-filter: blur(15px);
    box-shadow: 0 25px 50px rgba(0, 0, 0, 0.3);
    /*border: 0.5px solid;*/
    /*border-image-source: linear-gradient(143.54deg, #FFFFFF -1.92%, #0A0815 61.54%, #FFFFFF 102.01%);*/
    border-radius: var(--box-radius);
}

/* حاشیه و سایه عکس گرد محصول */
.rst-single-product-page .rst-product-avatar {
    border: 2px solid rgba(255, 255, 255, 0.1);
    padding: 2px;
    background: rgba(255, 255, 255, 0.05);
}

/* تگ ریسک (زیر تعداد کاربران) */
.rst-single-product-page .rst-tag-warning {
    border: 1px solid rgba(197, 160, 89, 0.5);
    border-radius: var(--box-radius);
    color: #C5A059;
    background: rgba(197, 160, 89, 0.05);
}

/* 3. استایل سطرهای شیشه‌ای داخلی (Max drawdown و ...) */
.rst-single-product-page .rst-inner-glass-row {
    background: rgba(255, 255, 255, 0.03);
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: var(--box-radius);
    box-shadow: 0px 0px 15px 0px #FFFFFF40 inset;
    backdrop-filter: blur(8px);
}

/* رنگ‌های متمایز برای برآیند کل و وین‌ریت (بر اساس تم راستاد) */
.rst-single-product-page .rst-text-accent-1 {
    color: #00FBFF;
}

/* 4. دکمه پایین سمت چپ */
.rst-single-product-page .btn-primary-gradient {
    background: linear-gradient(180deg, #3F4DE3 13.94%, #8189DF 100%);
    border-radius: var(--box-radius);
    transition: all 0.3s ease;
}

.rst-single-product-page .btn-primary-gradient:hover {
    box-shadow: 0px 0px 11.5px 0px #4250E2;
    color: #fff;
    transform: translateY(-2px);
}

.mb-feature:first-child {
    margin-bottom: 12px;
}

.mb-feature:nth-child(2) {
    margin-bottom: 12px;
}

/* ======================================================== */
/* استایل‌های ریسپانسیو (مخصوص موبایل) برای سکشن عملکرد محصول */
/* ======================================================== */
@media (max-width: 768px) {

    /* کوچک کردن عنوان اصلی (از 24px به حدود 19px) */
    .rst-product-performance .font-size-24 {
        font-size: 1.2rem !important;
    }

    /* کوچک کردن اعداد و عناوین بزرگ مثل برآیند و وین‌ریت (از 20px به 16px) */
    .rst-product-performance .font-size-20 {
        font-size: 1rem !important;
    }

    /* کوچک کردن عناوین باکس‌ها و متون معمولی (از 16px به 13px) */
    .rst-product-performance .font-size-16 {
        font-size: 0.85rem !important;
    }

    /* کوچک کردن متون ریزتر و دکمه‌ها (از 14px به 12px) */
    .rst-product-performance .font-size-14 {
        font-size: 0.75rem !important;
    }

    /* تگ ریسک و جزئیات خیلی ریز */
    .rst-product-performance .font-size-12 {
        font-size: 0.7rem !important;
    }

    /* ---------------------------------------------------- */
    /* اصلاحات ظاهری مکمل برای موبایل (جلوگیری از بیرون‌زدگی) */
    /* ---------------------------------------------------- */
    /* کوچک کردن آیکون‌های SVG در 4 باکس ویژگی تا فضای کمتری بگیرند */
    .rst-product-performance .rst-icon-wrapper svg {
        width: 48px !important;
        height: auto !important;
    }

    /* کاهش پدینگ (فاصله داخلی) باکس‌های شیشه‌ای برای جا شدن بهتر متن در موبایل */
    .rst-product-performance .rst-feature-glass-box.p-4 {
        padding: 1rem !important;
    }

    /* کاهش پدینگ باکس بزرگ عملکرد در موبایل */
    .rst-product-performance .rst-main-product-box.p-4 {
        padding: 1.25rem !important;
    }

    /* کوچک کردن عکس پروفایل محصول در موبایل */
    .rst-product-performance .rst-product-avatar {
        width: 45px !important;
        height: 45px !important;
    }
}

/* برای موبایل‌های خیلی کوچک (مثل آیفون SE یا گلکسی‌های مینی) */
@media (max-width: 380px) {
    .rst-product-performance .font-size-16 {
        font-size: 0.75rem !important; /* در صفحه‌های خیلی کوچک‌تر، فونت بازم ریزتر بشه */
    }

    .rst-product-performance .rst-icon-wrapper svg {
        width: 40px !important;
    }
}

/* ==========================================
   اورراید رنگ‌های صفحه جزئیات محصول (Light Mode)
========================================== */

/* ۵. تمامی عنوان‌ها و متون به رنگ سرمه‌ای (#1B1256) */
[data-bs-theme="light"] .rst-product-performance h2,
[data-bs-theme="light"] .rst-product-performance h3,
[data-bs-theme="light"] .rst-product-performance p,
[data-bs-theme="light"] .rst-product-performance span:not(.rst-text-accent-1) {
    color: #1B1256 !important;
}

/* ۱. استایل ۴ باکس ویژگی (سمت راست) */
[data-bs-theme="light"] .rst-product-performance .rst-feature-glass-box {
    background: linear-gradient(227.67deg, #FFFFFF 33.49%, #AFB5F3 113%) !important;
    backdrop-filter: blur(25.8px) !important;
    -webkit-backdrop-filter: blur(25.8px) !important;

    /* جایگزینی border-image برای حفظ گردی گوشه‌ها */
    border: 1px solid rgba(81, 97, 201, 0.4) !important;
    box-shadow: inset 0px 0px 11.5px 0px rgba(255, 255, 255, 0.6) !important; /* معادل #FFFFFF99 */
}

/* ۲. تغییر رنگ ایمن و دقیق آیکون‌های SVG ویژگی‌ها به #8B92E6 */
[data-bs-theme="light"] .rst-product-performance .rst-feature-glass-box svg [fill]:not([fill="none"]) {
    fill: #8B92E6 !important;
}

[data-bs-theme="light"] .rst-product-performance .rst-feature-glass-box svg [stroke]:not([stroke="none"]) {
    stroke: #8B92E6 !important;
}

/* برای آیکون‌هایی که از رنگ والد ارث‌بری می‌کنند */
[data-bs-theme="light"] .rst-product-performance .rst-feature-glass-box svg {
    color: #8B92E6 !important;
}

/* ۳. استایل باکس عملکرد اخیر (باکس بزرگ سمت چپ) */
[data-bs-theme="light"] .rst-product-performance .rst-main-product-box {
    background: linear-gradient(227.67deg, #FFFFFF 33.49%, rgba(175, 181, 243, 74%) 113%) !important;
    backdrop-filter: blur(16.4px) !important;
    -webkit-backdrop-filter: blur(16.4px) !important;

    /* جایگزینی border-image برای حفظ گردی گوشه‌ها */
    border: 1px solid rgba(81, 97, 201, 0.3) !important;
    box-shadow: 0 15px 40px rgba(0, 0, 0, 0.03) !important; /* سایه ملایم بیرونی */
}

/* 🟢 ۶. استایل اختصاصی برای باکس‌های وین‌ریت و برآیند کل 🟢 */

/* ابتدا یک استایل شیشه‌ای ملایم به همه باکس‌های داخلی می‌دهیم تا بی‌رنگ نمانند */
[data-bs-theme="light"] .rst-product-performance .rst-inner-glass-row {
    box-shadow: 0px 0px 7.6px 0px #AFB5F3 inset;
    border: 1px solid rgba(27, 18, 86, 0.1) !important;
}

/* حالا استایل نئونی و اختصاصی شما را فقط به ردیف "وین‌ریت و برآیند" اعمال می‌کنیم */
[data-bs-theme="light"] .rst-product-performance .rst-main-product-box > .row:nth-child(3) .rst-inner-glass-row {
    background: #ffffff !important;
    box-shadow: 0px 0px 67.6px 0px rgba(129, 137, 223, 0.5) inset !important; /* معادل #8189DF80 */
}

/* تغییر رنگ مقادیر داخل این دو باکس به #8B92E6 */
[data-bs-theme="light"] .rst-product-performance .rst-text-accent-1 {
    color: #8B92E6 !important;
}

/* ==========================================
   ریزنکات برای تمیزی بیشتر لایت مود
========================================== */

/* تغییر رنگ آیکون «کاربر فعال» به تیره */
[data-bs-theme="light"] .rst-product-performance .rst-main-product-box > div:first-child svg {
    stroke: #1B1256 !important;
}

/* تیره کردن خطوط جداکننده بالا و پایین در باکس بزرگ */
[data-bs-theme="light"] .rst-product-performance .border-secondary {
    border-color: rgba(27, 18, 86, 0.1) !important;
}

/* اصلاح رنگ حاشیه آواتار محصول */
[data-bs-theme="light"] .rst-product-performance .rst-product-avatar {
    border-color: rgba(27, 18, 86, 0.1) !important;
}

[data-bs-theme="light"] .rst-single-product-page .rst-tag-warning {
    background-color: #E1A21921;
}

/* =========================================
   Philosophy Video Section
========================================= */

.rst-video-placeholder {
    background-color: #1a1733; /* رنگ پس‌زمینه تیره در صورت لود نشدن عکس */
    border-radius: var(--box-radius);
    border: 1px solid rgba(255, 255, 255, 0.05);
    cursor: pointer;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3);
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

/* افکت هاور روی کل باکس ویدیو */
.rst-video-placeholder:hover {
    transform: translateY(-5px);
    box-shadow: 0 15px 40px rgba(0, 0, 0, 0.5);
}

/* استایل عکس کاور (تا کل باکس رو بپوشونه) */
.rst-video-cover {
    object-fit: cover;
    opacity: 0.8; /* کمی تیره کردن عکس برای دیده شدن بهتر دکمه پلی */
    transition: opacity 0.3s ease;
}

.rst-video-placeholder:hover .rst-video-cover {
    opacity: 1;
}

/* استایل دکمه Play */
.rst-play-btn-overlay {
    transition: transform 0.3s ease;
    /* ایجاد سایه ملایم پشت آیکون برای دیده شدن روی عکس‌های روشن */
    filter: drop-shadow(0px 8px 15px rgba(0, 0, 0, 0.6));
}

.rst-video-placeholder:hover .rst-play-btn-overlay {
    transform: translate(-50%, -50%) scale(1.15); /* بزرگ شدن دکمه موقع هاور */
}

/* ==========================================
   اورراید رنگ‌های سکشن ویدیو (دستیار ترید) - Light Mode
========================================== */

/* ۱. تغییر رنگ عنوان اصلی (به رنگ بنفش/سرمه‌ای درخواستی قبلی) */
[data-bs-theme="light"] .rst-philosophy-section h2.text-white {
    color: #30248E !important;
}

/* ۲. تغییر رنگ توضیحات زیر عنوان */
[data-bs-theme="light"] .rst-philosophy-section p.text-white-50 {
    color: #1B1256 !important;
}

/* ۳. برداشتن کاور تیره از روی عکس/ویدیو (شفافیت کامل) */
[data-bs-theme="light"] .rst-video-placeholder .rst-video-cover {
    opacity: 1 !important;
}

/* روشن کردن کادر دور ویدیو و ملایم کردن سایه‌ها برای لایت‌مود */
[data-bs-theme="light"] .rst-video-placeholder {
    border: 2px solid;
    background-color: #f8f9fa !important;
    border-color: rgba(27, 18, 86, 0.1) !important;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.05) !important;
}

[data-bs-theme="light"] .rst-video-placeholder:hover {
    box-shadow: 0 15px 40px rgba(0, 0, 0, 0.1) !important;
}

/* ۴. تغییر رنگ دکمه پلی ویدیو به سرمه‌ای تیره */
[data-bs-theme="light"] .rst-play-btn-overlay svg,
[data-bs-theme="light"] .rst-play-btn-overlay svg path {
    fill: #1B1256 !important;
}

/* تنظیم سایه زیر دکمه پلی برای هماهنگی با رنگ جدید */
[data-bs-theme="light"] .rst-play-btn-overlay {
    filter: drop-shadow(0px 8px 15px rgba(27, 18, 86, 0.2)) !important;
}

/* ======================================= */
/* کانتینر اصلی و چیدمان Grid */
/* ======================================= */

.pricing-grid-container {
    display: grid;
    gap: 2rem;
    align-items: stretch;
}

/* حالت دو روش پرداخت */
.pricing-grid-container.pricing-double {
    grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
}

/* حالت تک روش پرداخت (وسط‌چین) */
.pricing-grid-container.pricing-single {
    grid-template-columns: 1fr;
    max-width: 450px;
    margin: 0 auto;
}

/* ======================================= */
/* استایل بدنه باکس‌ها (شیشه‌ای تاریک) */
/* ======================================= */
.pricing-card {
    background: radial-gradient(247.67% 534.56% at -9.29% 117.49%, #1B1256 29.81%, #0C0A1A 97.12%);
    border-radius: var(--box-radius);
    display: flex;
    flex-direction: column;
    overflow: hidden; /* بسیار مهم: برای برش خوردن هدر در لبه‌های گرد */
    transition: transform 0.3s ease, border-color 0.3s ease, box-shadow 0.3s ease;
    padding: 0; /* پدینگ صفر برای تمام‌عرض شدن هدر */
}

.pricing-card:hover {
    border-color: rgba(59, 130, 246, 0.4);
    transform: translateY(-5px);
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.4), inset 0 0 0 1px rgba(255, 255, 255, 0.1);
}

/* ======================================= */
/* هدر کارت (گرادینت آبی تمام‌عرض) */
/* ======================================= */
.pricing-card-header.blue-gradient-bg {
    background: #B7ADFF1A;
    box-shadow: 0px 0px 10px 0px #AFB5F3 inset;
    width: 100%;
    padding: 1.25rem 1rem;
    text-align: center;
}

.pricing-card-header .pricing-title {
    font-size: 29px;
    font-weight: 800;
}

/* ======================================= */
/* بدنه داخلی کارت (محتوای زیر هدر) */
/* ======================================= */
.pricing-card-body {
    padding: 2rem;
    display: flex;
    flex-direction: column;
    flex-grow: 1; /* هم‌ارتفاع شدن دکمه‌های پایین کارت‌ها */
}

/* تیترها و متون داخلی */
.pricing-subtitle {
    color: #cbd5e1;
    font-size: 1rem;
    margin-bottom: 1rem;
}

.pricing-desc {
    color: #94a3b8;
    font-size: 0.85rem;
    line-height: 1.8;
    margin-bottom: 1.5rem;
}

/* ======================================= */
/* دکمه‌ها */
/* ======================================= */

.btn-custom-gray {
    color: white;
    background: #CCCCCC26;
    padding: 0.8rem;
    border-radius: var(--box-radius);
    transition: background 0.3s ease;
}

.btn-custom-gray:hover {
    background-color: #fff;
    color: #000;
}

.btn-primary {
    padding: 0.8rem;
    border-radius: 12px;
    font-weight: bold;
}

/* ======================================= */
/* فرم و اینپوت سفید خالص */
/* ======================================= */
.solid-white-input {
    background: #ffffff !important;
    color: #1e293b !important;
    border-radius: var(--box-radius);
    padding: 0.85rem 1rem;
    text-align: center;
    letter-spacing: 2px;
    font-weight: bold;
    transition: all 0.3s ease;
}

.solid-white-input::placeholder {
    color: #94a3b8 !important;
    font-weight: normal;
    letter-spacing: normal;
}

.solid-white-input:focus {
    border-color: #3b82f6 !important;
    box-shadow: 0 0 0 4px rgba(59, 130, 246, 0.2) !important;
    outline: none;
}

/* ======================================= */
/* باکس پولی: دکمه‌های انتخاب زمان (Toggle) */
/* ======================================= */
.duration-toggles {
    background: rgba(0, 0, 0, 0.4);
    border-radius: 14px;
    padding: 0.4rem;
    gap: 0.4rem;
}

.duration-btn {
    flex: 1;
    background: transparent;
    color: #94a3b8;
    border: none;
    border-radius: var(--box-radius);
    padding: 0.6rem 0;
    font-weight: 600;
    transition: all 0.3s ease;
}

.duration-btn.active {
    background: #5D5DFF;
    color: #ffffff;
    box-shadow: 0 4px 12px rgba(59, 130, 246, 0.3);
}

/* ======================================= */
/* استایل باکس شیشه‌ای قیمت (بدون پس‌زمینه) */
/* ======================================= */
.glass-price-box {
    padding: 1.5rem 1rem;
    background: #B7ADFF1A;
    border-radius: var(--box-radius);
    box-shadow: 0px 0px 10px 0px #AFB5F3 inset;

}

.price-value .amount {
    font-size: 2.5rem;
    font-weight: 900;
    color: #ffffff; /* رنگ قیمت سفید خالص */
}

.price-value .currency {
    font-size: 1.1rem;
    color: #cbd5e1; /* رنگ واحد پول (تومان) کمی ملایم‌تر برای زیبایی */
    margin-right: 0.3rem;
}

/* ======================================= */
/* دکمه‌های انتخاب زمان (زیر باکس قیمت) */
/* ======================================= */
.duration-toggles {
    background: rgba(0, 0, 0, 0.4);
    border-radius: 14px;
    padding: 0.4rem;
    gap: 0.4rem;
}

/* ==========================================
   اورراید رنگ‌های سکشن قیمت‌گذاری (Light Mode)
========================================== */

/* ۵. تمامی عنوان‌ها و متون اصلی به رنگ سرمه‌ای (#1B1256) */
[data-bs-theme="light"] .rastad-pricing-wrapper h2,
[data-bs-theme="light"] .rastad-pricing-wrapper h3,
[data-bs-theme="light"] .rastad-pricing-wrapper h6,
[data-bs-theme="light"] .rastad-pricing-wrapper p,
[data-bs-theme="light"] .rastad-pricing-wrapper label,
[data-bs-theme="light"] .rastad-pricing-wrapper .price-value .amount,
[data-bs-theme="light"] .rastad-pricing-wrapper .price-value .currency {
    color: #1B1256 !important;
}

/* ۱. استایل هدرِ کارت‌ها (باکس عنوان) */
[data-bs-theme="light"] .pricing-card-header.blue-gradient-bg {
    background: rgba(183, 173, 255, 0.1) !important; /* معادل #B7ADFF1A */
    box-shadow: 0px 0px 10px 0px #AFB5F3 inset !important;
    border-bottom: 1px solid rgba(139, 146, 230, 0.2) !important; /* کادر ظریف زیر هدر */
}

/* ۲. استایل اختصاصی باکس "خرید اشتراک" (کارت سمت راست) */
[data-bs-theme="light"] .pricing-grid-container > div:first-child {
    background: linear-gradient(201.27deg, #EAEBF7 27.77%, #D5D8F3 103.48%) !important;
    box-shadow: 0px 4px 5px 0px rgba(0, 0, 0, 0.25) !important; /* معادل #00000040 */
    border: none !important;
}

/* ۳. استایل اختصاصی باکس "عضویت رایگان" (کارت سمت چپ) */
[data-bs-theme="light"] .pricing-grid-container > div:last-child {
    background: linear-gradient(14.15deg, #5D68E5 -47.31%, #F9F9FE 88.9%) !important;
    backdrop-filter: blur(47.8px) !important;
    -webkit-backdrop-filter: blur(47.8px) !important;
    box-shadow: 0px 4px 15px 0px rgba(93, 104, 229, 0.2) !important; /* یک سایه ملایم هماهنگ با گرادینت */
    border: none !important;
}

/* 🟢 بهینه‌سازی دکمه‌های انتخاب زمان (Toggle Buttons) برای لایت‌مود 🟢 */
[data-bs-theme="light"] .duration-toggles {
    background: rgba(255, 255, 255, 0.5) !important; /* پس‌زمینه شیشه‌ای روشن برای کادر دکمه‌ها */
    border: 1px solid rgba(27, 18, 86, 0.1) !important;
}

[data-bs-theme="light"] .duration-btn {
    color: #1B1256 !important;
}

[data-bs-theme="light"] .duration-btn.active {
    background: #5D5DFF !important; /* رنگ دکمه فعال */
    color: #ffffff !important; /* متن دکمه فعال سفید می‌ماند */
    box-shadow: 0 4px 12px rgba(93, 93, 255, 0.3) !important;
}

/* بهینه‌سازی باکس قیمت */
[data-bs-theme="light"] .glass-price-box {
    background: rgba(183, 173, 255, 0.2) !important; /* کمی پررنگ‌تر از دارک‌مود برای تفکیک بهتر روی زمینه روشن */
    border: 1px solid rgba(175, 181, 243, 0.5) !important;
}

/* ۴. دکمه «بررسی و فعال سازی» شفاف (Transparent) شود */
[data-bs-theme="light"] #verifyUidBtn {
    background: transparent !important;
    border: 1px solid #1B1256 !important; /* یک کادر سرمه‌ای به آن می‌دهیم تا دکمه دیده شود */
    color: #1B1256 !important;
    box-shadow: none !important;
}

[data-bs-theme="light"] #verifyUidBtn:hover {
    background-color: #fff !important;
}

/* تغییر رنگ متن‌های دکمه پرداخت آنلاین / ارتباط با ادمین در لایت‌مود */
[data-bs-theme="light"] #socialPaymentBtn {
    border-color: #1B1256 !important;
    color: #1B1256 !important;
}

[data-bs-theme="light"] #socialPaymentBtn:hover {
    background: #1B1256 !important;
    color: #ffffff !important;
}

/* اینپوت UID (کادر سفید و متن تیره) */
[data-bs-theme="light"] .solid-white-input {
    border: 1px solid rgba(27, 18, 86, 0.2) !important;
}

/* ==========================================
   اصلاح رنگ مقدار حداقل موجودی (USDT) در لایت‌مود
========================================== */

[data-bs-theme="light"] .rastad-pricing-wrapper p strong.text-warning,
[data-bs-theme="light"] .rastad-pricing-wrapper p strong.text-warning span {
    color: #3F4DE3 !important; /* رنگ آبی جذاب و خوانا برای تم روشن */
    font-weight: 900 !important;
}

/* ======================================= */
/* باکس جدول با پس‌زمینه Radial Gradient */
/* ======================================= */
.rastad-gradient-table-box {
    background: radial-gradient(116.41% 374.54% at 19.1% 108.66%, #1B1256 12.5%, #0C0A1A 97.12%);
    border-radius: var(--box-radius);
    padding: 1.5rem;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3);
}

/* ======================================= */
/* تنظیمات اصلی جدول و فاصله‌گذاری رکوردها */
/* ======================================= */
.performance-table {
    border-collapse: separate;
    border-spacing: 0 12px; /* فاصله بین ردیف‌ها برای اعمال درست سایه شیشه‌ای */
    width: 100%;
}

.performance-table thead th {
    /* گرادینت اختصاصی شما */
    background: #0E0A2B;
    border-bottom: none;
    color: #ffffff;
    font-size: 0.9rem;
    font-weight: 600;
    padding: 1rem;
    white-space: nowrap;
}

.performance-table thead th:first-child {
    border-top-right-radius: var(--box-radius);
    border-bottom-right-radius: var(--box-radius);
}

/* گرد کردن گوشه چپِ آخرین سلول از هدر */
.performance-table thead th:last-child {
    border-top-left-radius: var(--box-radius);
    border-bottom-left-radius: var(--box-radius);
}

/* ======================================= */
/* استایل سلول‌های جدول و ایجاد Inset Shadow */
/* ======================================= */
.performance-table tbody td {
    padding: 1.15rem 1rem;
    vertical-align: middle;
    background: rgba(255, 255, 255, 0.02); /* شیشه‌ای بسیار ملایم */
    border: none;
    font-size: 0.var(--box-radius);
    color: #f1f5f9;
    /* سایه بالا و پایین برای همه سلول‌ها */
    box-shadow: inset 0 15px 15px -15px rgba(255, 255, 255, 0.25),
    inset 0 -15px 15px -15px rgba(255, 255, 255, 0.25);
}

/* اولین سلول هر سطر (راست‌ترین سلول در حالت RTL) */
.performance-table tbody td:first-child {
    border-top-right-radius: var(--box-radius);
    border-bottom-right-radius: var(--box-radius);
    box-shadow: inset -15px 0 15px -15px rgba(255, 255, 255, 0.25),
    inset 0 15px 15px -15px rgba(255, 255, 255, 0.25),
    inset 0 -15px 15px -15px rgba(255, 255, 255, 0.25);
}

/* آخرین سلول هر سطر (چپ‌ترین سلول در حالت RTL) */
.performance-table tbody td:last-child {
    border-top-left-radius: var(--box-radius);
    border-bottom-left-radius: var(--box-radius);
    box-shadow: inset 15px 0 15px -15px rgba(255, 255, 255, 0.25),
    inset 0 15px 15px -15px rgba(255, 255, 255, 0.25),
    inset 0 -15px 15px -15px rgba(255, 255, 255, 0.25);
}

/* افکت هاور برای کل یک رکورد */
.performance-table tbody tr {
    transition: transform 0.2s ease;
}

.performance-table tbody tr:hover {
    transform: scale(1.01);
}

/* ======================================= */
/* استایل بج‌های وضعیت (تارگت، استاپ و...) */
/* ======================================= */
.dynamic-badge-base {
    padding: 0.4rem 0.8rem;
    border-radius: var(--box-radius);
    font-size: 0.8rem;
    font-weight: bold;
    display: inline-block;
    color: green;
}

/* ======================================= */
/* استایل پاپ‌آپ آرشیو ماه‌ها */
/* ======================================= */
.glass-modal-archive {
    background: rgba(15, 23, 42, 0.9) !important;
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    border: 1px solid rgba(255, 255, 255, 0.15);
    border-radius: var(--box-radius);
}

/* گرید ماه‌ها (۳ ستون در دسکتاپ، ۲ ستون در موبایل) */
.archive-months-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 0.85rem;
}

@media (max-width: 576px) {
    .archive-months-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

/* استایل دکمه هر ماه داخل آرشیو */
.month-archive-btn {
    background: rgba(255, 255, 255, 0.04);
    border: 1px solid rgba(255, 255, 255, 0.1);
    color: #cbd5e1;
    padding: 0.75rem 0.5rem;
    border-radius: var(--box-radius);
    font-weight: 600;
    text-decoration: none;
    transition: all 0.25s ease;
}

.month-archive-btn:hover {
    background: rgba(59, 130, 246, 0.1);
    border-color: rgba(59, 130, 246, 0.4);
    color: #ffffff;
}

/* استایل دکمه ماه فعال/انتخاب شده */
.month-archive-btn.active {
    background: #3b82f6;
    border-color: #3b82f6;
    color: #ffffff;
    box-shadow: 0 4px 15px rgba(59, 130, 246, 0.3);
}

/* ======================================= */
/* تنظیمات اسکرول برای پاپ‌آپ آرشیو ماه‌ها */
/* ======================================= */
.glass-modal-archive .modal-body {
    max-height: 60vh; /* حداکثر ارتفاع باکس؛ اگر بیشتر شد اسکرول می‌خورد */
    overflow-y: auto; /* فعال‌سازی اسکرول عمودی */
    padding-right: 15px; /* کمی فاصله تا اسکرول‌بار به محتوا نچسبد */
}

/* استایل‌دهی اختصاصی به نوار اسکرول (متناسب با تم شیشه‌ای) */
.glass-modal-archive .modal-body::-webkit-scrollbar {
    width: 6px;
}

.glass-modal-archive .modal-body::-webkit-scrollbar-track {
    background: rgba(255, 255, 255, 0.02);
    border-radius: var(--box-radius);
}

.glass-modal-archive .modal-body::-webkit-scrollbar-thumb {
    background: rgba(255, 255, 255, 0.15);
    border-radius: var(--box-radius);
    transition: background 0.3s ease;
}

.glass-modal-archive .modal-body::-webkit-scrollbar-thumb:hover {
    background: rgba(255, 255, 255, 0.3); /* در زمان هاور کمی روشن‌تر می‌شود */
}

/* ==========================================
   کد کامل و نهایی: جدول عملکرد و پاپ‌آپ (Light Mode)
========================================== */

/* 🟢 متون بالای جدول و لینک آرشیو 🟢 */
[data-bs-theme="light"] .rastad-performance-wrapper h2,
[data-bs-theme="light"] .rastad-performance-wrapper p,
[data-bs-theme="light"] .rastad-performance-wrapper a.text-white {
    color: #1B1256 !important;
}

[data-bs-theme="light"] .rastad-performance-wrapper a.text-white svg path {
    fill: #1B1256 !important;
}

/* 🟢 استایل باکس کلی جدول 🟢 */
[data-bs-theme="light"] .rastad-gradient-table-box {
    background: #FFFFFF !important;
    border: 0.5px solid #BEBEBF !important;
    backdrop-filter: blur(47.8px) !important;
    -webkit-backdrop-filter: blur(47.8px) !important;
    box-shadow: 0 15px 40px rgba(0, 0, 0, 0.04) !important; /* سایه بیرونی بسیار ملایم */
}

/* 🟢 هدر جدول (th) 🟢 */
[data-bs-theme="light"] .performance-table thead th {
    background: #CCCCCC26 !important; /* پس‌زمینه طوسی بسیار ملایم برای هدر */
    color: #1B1256 !important;
    border: none !important;
}

/* 🟢 استایل رکوردهای جدول (بدون خطوط عمودی بین فیلدها) 🟢 */

/* حذف بردرهای پیش‌فرض بوت‌استرپ که ممکن است باعث ایجاد خط شوند */
[data-bs-theme="light"] .performance-table th,
[data-bs-theme="light"] .performance-table td {
    border: none !important;
}

/* سلول‌های میانی: اعمال سایه فقط در لبه‌ی بالا و پایین */
[data-bs-theme="light"] .performance-table tbody td {
    background: #ffffff !important;
    color: #1B1256 !important;
    box-shadow: inset 0 10px 10px -10px #AFB5F3,
    inset 0 -10px 10px -10px #AFB5F3 !important;
}

/* سلول اول (راست‌ترین فیلد در زبان فارسی): سایه در بالا، پایین و لبه سمت راست */
[data-bs-theme="light"] .performance-table tbody td:first-child {
    box-shadow: inset -10px 0 10px -10px #AFB5F3,
    inset 0 10px 10px -10px #AFB5F3,
    inset 0 -10px 10px -10px #AFB5F3 !important;
}

/* سلول آخر (چپ‌ترین فیلد در زبان فارسی): سایه در بالا، پایین و لبه سمت چپ */
[data-bs-theme="light"] .performance-table tbody td:last-child {
    box-shadow: inset 10px 0 10px -10px #AFB5F3,
    inset 0 10px 10px -10px #AFB5F3,
    inset 0 -10px 10px -10px #AFB5F3 !important;
}

/* متن زمانی که جدول خالی است (هنوز رکوردی ثبت نشده است) */
[data-bs-theme="light"] .performance-table tbody td.text-white-50 {
    color: #1B1256 !important;
}

/* 🟢 استایل پاپ‌آپ (Modal) آرشیو عملکرد 🟢 */
[data-bs-theme="light"] .glass-modal-archive {
    background: rgba(255, 255, 255, 0.95) !important; /* سفید شیشه‌ای */
    backdrop-filter: blur(20px) !important;
    -webkit-backdrop-filter: blur(20px) !important;
    border: 1px solid #BEBEBF !important;
    box-shadow: 0 20px 50px rgba(0, 0, 0, 0.1) !important;
}

/* متون داخل پاپ‌آپ */
[data-bs-theme="light"] .glass-modal-archive .modal-title,
[data-bs-theme="light"] .glass-modal-archive p {
    color: #1B1256 !important;
}

/* تیره کردن دکمه ضربدر (بستن پاپ‌آپ) برای دیده شدن روی زمینه سفید */
[data-bs-theme="light"] .glass-modal-archive .btn-close {
    filter: invert(1) grayscale(100%) brightness(0) !important;
}

/* دکمه‌های دانلود ماه‌ها داخل آرشیو */
[data-bs-theme="light"] .month-archive-btn {
    background: #ffffff !important;
    border: 1px solid rgba(139, 146, 230, 0.4) !important;
    color: #1B1256 !important;
    box-shadow: 0px 0px 5px 0px rgba(175, 181, 243, 0.3) inset !important;
}

/* هاورِ دکمه‌های ماه‌ها */
[data-bs-theme="light"] .month-archive-btn:hover {
    background: linear-gradient(180deg, #3F4DE3 23.56%, #8990DF 100%) !important;
    color: #ffffff !important;
    border-color: #3F4DE3 !important;
    box-shadow: 0 4px 15px rgba(93, 93, 255, 0.3) !important;
}

/* استایل اسکرول‌بارِ داخل پاپ‌آپ در لایت‌مود */
[data-bs-theme="light"] .glass-modal-archive .modal-body::-webkit-scrollbar-track {
    background: rgba(27, 18, 86, 0.05) !important;
}

[data-bs-theme="light"] .glass-modal-archive .modal-body::-webkit-scrollbar-thumb {
    background: rgba(27, 18, 86, 0.2) !important;
}

[data-bs-theme="light"] .glass-modal-archive .modal-body::-webkit-scrollbar-thumb:hover {
    background: rgba(27, 18, 86, 0.4) !important;
}
/* ========================================================
   استایل کارت‌های موبایل (عملکرد) در حالت لایت (Light Mode)
======================================================== */

/* ۱. پس‌زمینه کارت موبایل در حالت لایت */
[data-bs-theme="light"] .rst-mobile-perf-card {
    background-color: #FFFFFF !important;
    border: 1px solid rgba(27, 18, 86, 0.1);
    box-shadow: 0 8px 24px rgba(27, 18, 86, 0.04);
}

/* ۲. تغییر رنگ متون سفید به سرمه‌ای تیره */
[data-bs-theme="light"] .rst-mobile-perf-card .text-white {
    color: #1B1256 !important;
}

/* ۳. تغییر رنگ متون کم‌رنگ (مثل لیبل‌های تاریخ، نوع و...) */
[data-bs-theme="light"] .rst-mobile-perf-card .text-white-50 {
    color: rgba(27, 18, 86, 0.7) !important;
}

/* ۴. تغییر رنگ خط جداکننده زیر عنوان جفت‌ارز */
[data-bs-theme="light"] .rst-mobile-perf-card .border-secondary {
    border-color: rgba(27, 18, 86, 0.1) !important;
}

/* ==========================================
   استایل‌های پایه (Dark Mode) - آکاردئون
========================================== */
.rst-accordion .accordion-item {
    background: #1B1256;
    border-radius: var(--box-radius);
    border: none;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

.rst-accordion .accordion-button {
    background: rgba(30, 25, 60, 0.5);
    color: white;
    box-shadow: none;
    border-radius: var(--box-radius) !important;
    font-size: 14px;
    font-weight: bold;
}

.rst-accordion .accordion-button:not(.collapsed) {
    background: rgba(40, 35, 80, 0.8);
    color: #5D6CFF;
}

/* 🟢 حل مشکل فلش (Arrow) در حالت دارک (سفید خالص) 🟢 */
.rst-accordion .accordion-button::after {
    margin-right: auto !important;
    margin-left: 0 !important;
    /* حذف فیلتر قبلی و جایگزینی با آیکون SVG سفید خالص */
    filter: none !important;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23ffffff'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e") !important;
}

/* تغییر رنگ فلش به آبی هنگام باز شدن در حالت دارک */
.rst-accordion .accordion-button:not(.collapsed)::after {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%235D6CFF'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e") !important;
}

.rst-accordion .accordion-body {
    background: transparent;
    font-size: 13px;
    line-height: 1.6;
    padding-top: 15px;
}

/* ==========================================
   اورراید رنگ‌های سوالات متداول (Light Mode)
========================================== */
[data-bs-theme="light"] .rst-accordion .accordion-item {
    background: #ffffff !important;
    border: 1px solid #BEBEBF !important;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.03) !important;
}

[data-bs-theme="light"] .rst-accordion .accordion-button {
    background: #ffffff !important;
    color: #1B1256 !important;
}

[data-bs-theme="light"] .rst-accordion .accordion-button:not(.collapsed) {
    background: #f8f9fa !important;
    color: #3F4DE3 !important;
}

[data-bs-theme="light"] .rst-accordion .accordion-body.text-white-50 {
    color: #1B1256 !important;
}

/* 🟢 حل مشکل فلش (Arrow) در حالت لایت (سرمه‌ای و آبی) 🟢 */
/* فلش در حالت بسته (سرمه‌ای) */
[data-bs-theme="light"] .rst-accordion .accordion-button::after {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%231B1256'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e") !important;
}

/* فلش در حالت باز (آبی روشن) */
[data-bs-theme="light"] .rst-accordion .accordion-button:not(.collapsed)::after {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%233F4DE3'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e") !important;
}

/* تنظیمات آیکون علامت‌سوال */
[data-bs-theme="light"] .rst-accordion .accordion-button svg [fill="white"],
[data-bs-theme="light"] .rst-accordion .accordion-button svg [fill="#ffffff"],
[data-bs-theme="light"] .rst-accordion .accordion-button svg [fill="#fff"] {
    fill: #1B1256 !important;
}

[data-bs-theme="light"] .rst-accordion .accordion-button:not(.collapsed) svg [fill] {
    fill: #3F4DE3 !important;
}