/* ==========================================================================
   1. Imports (MUST BE AT THE TOP)
   ========================================================================== */
/* ایمپورت فونت وزیرمتن با اعداد فارسی از CDN آروان */
@import url('https://lib.arvancloud.ir/vazir-font/33.003/Farsi-Digits/Vazirmatn-FD-font-face.css');

/* ==========================================================================
   2. Theme Variables (Nexus overrides + Tailwind inspired)
   ========================================================================== */
:root {
    /* --- تنظیمات پایه و تایپوگرافی --- */
    --font-family-base: 'Vazirmatn FD', Tahoma, system-ui, -apple-system, sans-serif !important;
    --letter-spacing: 0em;
    --disabled-opacity: 40%;
    
    /* --- رنگ‌های مدرن Tailwind (Indigo & Slate) --- */
    --white: #ffffff;
    --tw-primary: #4f46e5;       /* لاجوردی مدرن - Indigo 600 */
    --tw-primary-hover: #4338ca; /* Indigo 700 */
    --tw-surface: #f8fafc;       /* Slate 50 */
    --tw-border: #e2e8f0;        /* Slate 200 */
    
    /* --- اصلاح پالت پیش‌فرض قالب Nexus --- */
    --neutral-50: #f8fafc;
    --neutral-100: #f1f5f9;
    --neutral-200: #e2e8f0;
    --neutral-300: #cbd5e1;
    --neutral-400: #94a3b8;
    --neutral-500: #64748b;
    --neutral-600: #475569;
    --neutral-700: #334155;
    --neutral-800: #1e293b;
    --neutral-900: #0f172a;
    
    /* تنظیم رنگ اصلی قالب Nexus با رنگ جدید */
    --primary: var(--tw-primary);          
    --primary-lifted: var(--tw-primary-hover);   
    --primary-accented: #3730a3; 
    
    /* رنگ وضعیت‌ها */
    --success: #10b981; /* Emerald 500 */
    --info: #0ea5e9;    /* Sky 500 */
    --warning: #f59e0b; /* Amber 500 */
    --error: #ef4444;   /* Red 500 */
    
    /* تنظیم بک‌گراندها و متون */
    --bg: var(--tw-surface);
    --bg-muted: var(--white);
    --text: var(--neutral-800);
    --text-muted: var(--neutral-500);
    --border: var(--tw-border);

    /* --- انحنا و سایه‌ها (Tailwind Modern Look) --- */
    --rounding-sm: 0.5rem;    /* 8px */
    --rounding-md: 0.75rem;   /* 12px */
    --rounding-lg: 1rem;      /* 16px */
    
    --shadow-sm: 0 1px 2px 0 rgb(0 0 0 / 0.05);
    --shadow-md: 0 4px 6px -1px rgb(0 0 0 / 0.08), 0 2px 4px -2px rgb(0 0 0 / 0.08);
    --shadow-lg: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.05);
    --shadow-glow: 0 10px 25px -5px rgba(79, 70, 229, 0.4); /* هاله همرنگ با Indigo */
}

/* ==========================================================================
   3. Global RTL & Typography
   ========================================================================== */
body, html, h1, h2, h3, h4, h5, h6, p, a, span, div, input, button, select, textarea, .text-muted, .text-primary {
    font-family: var(--font-family-base);
}

body {
    background-color: var(--bg);
    color: var(--text);
    direction: rtl !important;
    text-align: right !important;
}

/* ==========================================================================
   4. Modern Forms (Inputs, Selects)
   ========================================================================== */
.form-control, 
.input-group-text,
.custom-select {
    border-radius: var(--rounding-md) !important;
    border: 1.5px solid var(--border) !important;
    background-color: var(--white) !important;
    color: var(--text) !important;
    padding: 0.6rem 1rem;
    font-size: 0.95rem;
    box-shadow: var(--shadow-sm);
    transition: all 0.3s ease;
}

.form-control:focus, .custom-select:focus {
    border-color: var(--primary) !important;
    box-shadow: 0 0 0 4px rgba(79, 70, 229, 0.15) !important; /* حلقه فوکوس */
    outline: none !important;
}

label, .form-control-label {
    font-weight: 600;
    color: var(--neutral-700);
    margin-bottom: 0.5rem;
    font-size: 0.9rem;
}

/* اصلاح Input Group برای حالت راست‌چین */
.input-group {
    flex-direction: row; 
}
.input-group-prepend .input-group-text {
    border-radius: 0 var(--rounding-md) var(--rounding-md) 0 !important;
    border-left: none !important;
    background-color: var(--neutral-50) !important;
    color: var(--neutral-500) !important;
}
.input-group > .form-control:not(:first-child) {
    border-radius: var(--rounding-md) 0 0 var(--rounding-md) !important;
}

/* ==========================================================================
   5. Modern Buttons
   ========================================================================== */
.btn {
    border-radius: var(--rounding-md) !important;
    font-weight: 600 !important;
    padding: 0.6rem 1.5rem;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    border: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
}

.btn-primary {
    background-color: var(--primary) !important;
    color: var(--white) !important;
    box-shadow: var(--shadow-md);
}

.btn-primary:hover, .btn-primary:focus {
    background-color: var(--primary-lifted) !important;
    transform: translateY(-2px);
    box-shadow: var(--shadow-glow) !important;
}

.btn-success { background-color: var(--success) !important; color: var(--white) !important; }
.btn-danger { background-color: var(--error) !important; color: var(--white) !important; }
.btn-warning { background-color: var(--warning) !important; color: var(--white) !important; }
.btn-info { background-color: var(--info) !important; color: var(--white) !important; }

/* ==========================================================================
   6. Modern Cards
   ========================================================================== */
.card, .panel {
    background-color: var(--white) !important;
    border: 1px solid var(--border) !important;
    border-radius: var(--rounding-lg) !important;
    box-shadow: var(--shadow-md) !important;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    overflow: hidden;
}

.card:hover {
    box-shadow: var(--shadow-lg) !important;
}

.card-header, .panel-heading {
    background-color: var(--white) !important;
    border-bottom: 1px solid var(--border) !important;
    padding: 1.25rem 1.5rem !important;
    font-weight: 700 !important;
    color: var(--neutral-800) !important;
}

.card-body, .panel-body {
    padding: 1.5rem !important;
}

/* ==========================================================================
   7. RTL Fixes (Icons, Margins, Padding)
   ========================================================================== */
.mr-1, .mr-2, .mr-3, .mr-4, .mr-auto { margin-right: 0 !important; }
.ml-1, .ml-2, .ml-3, .ml-4, .ml-auto { margin-left: 0 !important; }



/* اصلاح منوها و لیست‌ها */
.float-right { float: left !important; }
.float-left { float: right !important; }
.text-left { text-align: right !important; }
.text-right { text-align: left !important; }
/* ==========================================================================
   8. Modern Navbar & Dropdowns (RTL Fixed)
   ========================================================================== */

/* اصلاح کلی جهت و تراز متن در منوها */
.navbar-nav, .dropdown-menu {
    text-align: right !important;
}

/* استایل‌دهی مدرن به منوی کشویی (Dropdown) */
.dropdown-menu {
    background-color: var(--white) !important;
    border: 1px solid var(--border) !important;
    border-radius: var(--rounding-lg) !important; /* گوشه‌های گرد مدرن */
    box-shadow: var(--shadow-lg) !important; /* سایه نرم و عمیق */
    padding: 0.5rem !important;
    margin-top: 0.5rem !important;
    
    /* حل مشکل راست‌چین شدن باز شدن منو */
    right: 0 !important;
    left: auto !important;
    
    /* انیمیشن باز شدن (Fade in & Slide up) */
    animation: dropdownSlideUp 0.3s cubic-bezier(0.16, 1, 0.3, 1);
    transform-origin: top;
}

/* کلاس مخصوص بوت‌استرپ برای منوهایی که باید سمت چپ باز شوند (مثل پروفایل کاربری) */
.dropdown-menu-right {
    right: auto !important;
    left: 0 !important;
}

/* استایل آیتم‌های داخل منو (لینک‌ها) */
.dropdown-item, .dropdown-menu > li > a {
    color: var(--text) !important;
    border-radius: var(--rounding-sm) !important;
    padding: 0.6rem 1rem !important;
    font-weight: 500 !important;
    transition: all 0.2s ease;
    display: flex;
    align-items: center;
    justify-content: flex-start; /* در RTL به معنی شروع از راست است */
}

/* افکت Hover روی آیتم‌های منو */
.dropdown-item:hover, .dropdown-menu > li > a:hover,
.dropdown-item:focus, .dropdown-menu > li > a:focus {
    background-color: var(--neutral-100) !important;
    color: var(--primary) !important;
    transform: translateX(-4px); /* یک حرکت ریز به سمت چپ (داخل) در حالت RTL */
}

/* جداکننده بین آیتم‌های منو */
.dropdown-divider {
    border-top: 1px solid var(--border) !important;
    margin: 0.5rem 0 !important;
    opacity: 0.7;
}

/* فاصله آیکون‌ها داخل منو در حالت RTL */
.dropdown-item i, .dropdown-menu > li > a i {
    margin-left: 0.75rem !important;
    margin-right: 0 !important;
    color: var(--neutral-500);
    font-size: 1.1em;
}

/* وقتی ماوس روی آیتم می‌رود رنگ آیکون هم عوض شود */
.dropdown-item:hover i, .dropdown-menu > li > a:hover i {
    color: var(--primary) !important;
}

/* اصلاح فلش (Caret) کنار آیتم‌های دارای زیرمنو */
.dropdown-toggle::after {
    margin-right: 0.5rem !important; /* فاصله فلش از متن در راست‌چین */
    margin-left: 0 !important;
    vertical-align: middle;
}

/* انیمیشن نرم باز شدن منو */
@keyframes dropdownSlideUp {
    from {
        opacity: 0;
        transform: translateY(10px) scale(0.95);
    }
    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}
.prepend-icon .field {
    padding-right: 36px;
}
#order-standard_cart .prepend-icon .field-icon {
    line-height: 40px!important;
}

#inputCaptchaImage {
    width: -webkit-fill-available;
    max-width: 200px;
}
        #default-captcha-domainchecker #inputCaptcha {
        
            height: fit-content;
            border-width: 1px;
            border-color: #3770a4;
        }

        @media (max-width: 991px) {
    #default-captcha-domainchecker {
        margin-bottom: 0px;
    }
}

#default-captcha-domainchecker {
    direction: ltr;
}
#default-captcha-domainchecker #inputCaptcha {
    width: 150px;
}

#frmDomainChecker{
direction: ltr;

}
.fa-cpanel {
    font-size: 100px!important;
    color: #f28515;
    padding: 20px;
}