:root {
    --fi-primary: #F79420;
    --fi-gradient: linear-gradient(26.21deg, #5d3cf2 0%, #F79420 108.88%);
    --fi-link-color: #F79420;
    --fi-blue: #F79420;
    --fi-indigo: #F79420;
}

/* بازنویسی کلاس‌های اصلی */
.btn-primary {
    background-color: #F79420 !important;
    border-color: #F79420 !important;
}

.text-primary {
    color: #F79420 !important;
}

.bg-primary {
    background-color: #F79420 !important;
}

/* بازنویسی رنگ‌های آبی */
.text-blue-500,
.text-blue-600,
.text-blue-700,
.text-indigo-500,
.text-indigo-600,
.text-indigo-700 {
    color: #F79420 !important;
}

.bg-blue-500,
.bg-blue-600,
.bg-blue-700,
.bg-indigo-500,
.bg-indigo-600,
.bg-indigo-700 {
    background-color: #F79420 !important;
}

.border-blue-500,
.border-blue-600,
.border-blue-700,
.border-indigo-500,
.border-indigo-600,
.border-indigo-700 {
    border-color: #F79420 !important;
}

/* بازنویسی hover states */
.btn-primary:hover,
.hover\:bg-blue-600:hover,
.hover\:bg-blue-700:hover,
.hover\:bg-indigo-600:hover,
.hover\:bg-indigo-700:hover {
    background-color: #e6861d !important;
    border-color: #e6861d !important;
}

/* بازنویسی active states */
.btn-primary:active,
.active\:bg-blue-600:active,
.active\:bg-blue-700:active,
.active\:bg-indigo-600:active,
.active\:bg-indigo-700:active {
    background-color: #d47a1a !important;
    border-color: #d47a1a !important;
}

/* بازنویسی focus states */
.focus\:ring-blue-500:focus,
.focus\:ring-blue-600:focus,
.focus\:ring-blue-700:focus,
.focus\:ring-indigo-500:focus,
.focus\:ring-indigo-600:focus,
.focus\:ring-indigo-700:focus {
    --tw-ring-color: #F79420 !important;
}

.focus\:border-blue-500:focus,
.focus\:border-blue-600:focus,
.focus\:border-blue-700:focus,
.focus\:border-indigo-500:focus,
.focus\:border-indigo-600:focus,
.focus\:border-indigo-700:focus {
    border-color: #F79420 !important;
}

/* برای جلوگیری از transparent شدن header */
header.navbar.fixed-top {
    background-color: white !important;
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
    z-index: 9999;
    transition: all 0.3s ease;
}

/* اطمینان از اینکه header همیشه پس‌زمینه سفید داشته باشد */
.navbar.fixed-top {
    background: white !important;
}

/* جلوگیری از اسکرول افقی در کل سایت - اسکرول‌بار سمت راست */
html,
html.style-basic,
html[dir="ltr"],
html.style-basic[dir="ltr"] {
    direction: ltr !important;
    overflow-x: hidden !important;
    overflow-y: scroll !important;
    max-width: 100vw !important;
    width: 100% !important;
    scrollbar-width: thin !important;
    scrollbar-color: #F79420 #f1f1f1 !important;
}

/* body نباید اسکرول‌بار داشته باشه - فقط html اسکرول‌بار داره */
body,
body[dir="rtl"],
html.style-basic > body,
html > body {
    direction: rtl !important;
    overflow-x: hidden !important;
    overflow-y: visible !important;
    max-width: 100vw !important;
    width: 100% !important;
}

/* استایل اسکرول‌بار سفارشی - Chrome/Edge/Safari */
html::-webkit-scrollbar {
    width: 8px;
}

html::-webkit-scrollbar-track {
    background: #f1f1f1;
    border-radius: 4px;
}

html::-webkit-scrollbar-thumb {
    background: #F79420;
    border-radius: 4px;
}

html::-webkit-scrollbar-thumb:hover {
    background: #e6861d;
}

/* استایل اسکرول‌بار برای عناصر دارای overflow */
::-webkit-scrollbar {
    width: 6px;
    height: 6px;
}

::-webkit-scrollbar-track {
    background: #f1f1f1;
    border-radius: 3px;
}

::-webkit-scrollbar-thumb {
    background: #F79420;
    border-radius: 3px;
}

::-webkit-scrollbar-thumb:hover {
    background: #e6861d;
}

/* Firefox - اسکرول‌بار نازک و رنگی */
* {
    scrollbar-width: thin !important;
    scrollbar-color: #F79420 #f1f1f1 !important;
}

/* اطمینان از اینکه تمام عناصر داخل صفحه اسکرول افقی ایجاد نکنند */
* {
    box-sizing: border-box !important;
}

/* تنظیم اندازه container - در موبایل عرض کامل، در دسکتاپ Bootstrap پیش‌فرض */
@media (max-width: 767.98px) {
    .container {
        max-width: 100% !important;
        padding-left: 15px !important;
        padding-right: 15px !important;
    }
}

@media (min-width: 768px) {
    .container {
        padding-left: 24px !important;
        padding-right: 24px !important;
    }
}

/* تنظیم اندازه صفحه wrapper */
.page-wrapper {
    max-width: 100vw !important;
    overflow-x: hidden !important;
}

/* تنظیم موقعیت PWA install prompt */
.pwa-install-prompt {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    width: 100%;
    z-index: 999; /* کمی پایین‌تر از bottom navigation که z-index: 1000 دارد */
    margin-bottom: 0;
    transform: translateY(-100%); /* بالا بردن prompt تا بالای bottom navigation */
}

/* فقط در موبایل (جایی که bottom navigation نمایش داده می‌شود) */
@media (max-width: 768px) {
    .pwa-install-prompt {
        position: fixed;
        bottom: 0;
        left: 0;
        right: 0;
        width: 100%;
        z-index: 999;
        margin-bottom: 0;
        /* بالا بردن prompt تا بالای bottom navigation */
        transform: translateY(calc(-100% - env(safe-area-inset-bottom, 0px) - 80px));
        /* اطمینان از اینکه prompt در تمام سایزهای موبایل درست نمایش داده شود */
        max-width: 100vw;
        box-sizing: border-box;
    }
}

/* تنظیمات اضافی برای سایزهای مختلف موبایل */
@media (max-width: 375px) {
    .pwa-install-prompt {
        transform: translateY(calc(-100% - env(safe-area-inset-bottom, 0px) - 70px));
    }
}

@media (min-width: 376px) and (max-width: 768px) {
    .pwa-install-prompt {
        transform: translateY(calc(-100% - env(safe-area-inset-bottom, 0px) - 80px));
    }
}

/* در دسکتاپ (جایی که bottom navigation نمایش داده نمی‌شود) */
@media (min-width: 769px) {
    .pwa-install-prompt {
        position: fixed;
        bottom: 20px;
        left: 50%;
        transform: translateX(-50%);
        width: auto;
        max-width: 400px;
        z-index: 1000;
        margin-bottom: 0;
    }
}