/*
 * ميغانت — مظهر المنصة المشترك (حزمة المظهر قبل النشر، 3 تشرين الأول 2026).
 * تقرؤه القوالب الأساس الثلاثة (base · tech_base · broker_base) في موضع <style> المكرَّر نفسه، فترتيب القواعد كما كان.
 * الألوان كما في العقد، والخطّ من static/fonts (منزَّلٌ في البند 36) — لا شيء من الخارج.
 * ما يخصّ أساساً وحده يبقى في <style> ذلك الأساس.
 */
:root {
    --mn-orange: #E86A17;        /* البارز */
    --mn-orange-dark: #C4530B;   /* العناوين */
    --mn-font: 'MN Plex Arabic', system-ui, sans-serif;   /* نصّ المنصة: الحروف العربية من Plex، واللاتينية والأرقام من خطّ الجهاز */
}

@font-face { font-family: 'IBM Plex Sans Arabic'; font-style: normal; font-weight: 400; font-display: swap;
             src: url('../fonts/ibm-plex-sans-arabic/ibm-plex-sans-arabic-400-arabic.woff2') format('woff2');
             unicode-range: U+0600-06FF, U+0750-077F, U+0870-08FF, U+200C-200E, U+2010-2011, U+FB50-FDFF, U+FE70-FEFC; }
@font-face { font-family: 'IBM Plex Sans Arabic'; font-style: normal; font-weight: 400; font-display: swap;
             src: url('../fonts/ibm-plex-sans-arabic/ibm-plex-sans-arabic-400-latin.woff2') format('woff2');
             unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+20AC, U+2122, U+2212, U+FEFF, U+FFFD; }
@font-face { font-family: 'IBM Plex Sans Arabic'; font-style: normal; font-weight: 500; font-display: swap;
             src: url('../fonts/ibm-plex-sans-arabic/ibm-plex-sans-arabic-500-arabic.woff2') format('woff2');
             unicode-range: U+0600-06FF, U+0750-077F, U+0870-08FF, U+200C-200E, U+2010-2011, U+FB50-FDFF, U+FE70-FEFC; }
@font-face { font-family: 'IBM Plex Sans Arabic'; font-style: normal; font-weight: 500; font-display: swap;
             src: url('../fonts/ibm-plex-sans-arabic/ibm-plex-sans-arabic-500-latin.woff2') format('woff2');
             unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+20AC, U+2122, U+2212, U+FEFF, U+FFFD; }
@font-face { font-family: 'IBM Plex Sans Arabic'; font-style: normal; font-weight: 600; font-display: swap;
             src: url('../fonts/ibm-plex-sans-arabic/ibm-plex-sans-arabic-600-arabic.woff2') format('woff2');
             unicode-range: U+0600-06FF, U+0750-077F, U+0870-08FF, U+200C-200E, U+2010-2011, U+FB50-FDFF, U+FE70-FEFC; }
@font-face { font-family: 'IBM Plex Sans Arabic'; font-style: normal; font-weight: 600; font-display: swap;
             src: url('../fonts/ibm-plex-sans-arabic/ibm-plex-sans-arabic-600-latin.woff2') format('woff2');
             unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+20AC, U+2122, U+2212, U+FEFF, U+FFFD; }
@font-face { font-family: 'IBM Plex Sans Arabic'; font-style: normal; font-weight: 700; font-display: swap;
             src: url('../fonts/ibm-plex-sans-arabic/ibm-plex-sans-arabic-700-arabic.woff2') format('woff2');
             unicode-range: U+0600-06FF, U+0750-077F, U+0870-08FF, U+200C-200E, U+2010-2011, U+FB50-FDFF, U+FE70-FEFC; }
@font-face { font-family: 'IBM Plex Sans Arabic'; font-style: normal; font-weight: 700; font-display: swap;
             src: url('../fonts/ibm-plex-sans-arabic/ibm-plex-sans-arabic-700-latin.woff2') format('woff2');
             unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+20AC, U+2122, U+2212, U+FEFF, U+FFFD; }

/* نصّ المنصة — الحروف العربية وحدها من Plex (الملفات نفسها). اللاتينية والأرقام من خطّ الجهاز كما كانت: أرقام Plex اللاتينية
   أعرض، فتجاوز جدول طلبات التركيب إطاره عند 768 بعشرة بكسل (714 في 704 — رمز الطلب والموبايل والتاريخ، خلايا لا تلتفّ)،
   وعربيّه أضيق. مقيسٌ عموداً عموداً. والعقد وشاشة الدخول بالعائلة الكاملة 'IBM Plex Sans Arabic' كما في مرجعيهما. */
@font-face { font-family: 'MN Plex Arabic'; font-style: normal; font-weight: 400; font-display: swap;
             src: url('../fonts/ibm-plex-sans-arabic/ibm-plex-sans-arabic-400-arabic.woff2') format('woff2');
             unicode-range: U+0600-06FF, U+0750-077F, U+0870-08FF, U+200C-200E, U+2010-2011, U+FB50-FDFF, U+FE70-FEFC; }
@font-face { font-family: 'MN Plex Arabic'; font-style: normal; font-weight: 500; font-display: swap;
             src: url('../fonts/ibm-plex-sans-arabic/ibm-plex-sans-arabic-500-arabic.woff2') format('woff2');
             unicode-range: U+0600-06FF, U+0750-077F, U+0870-08FF, U+200C-200E, U+2010-2011, U+FB50-FDFF, U+FE70-FEFC; }
@font-face { font-family: 'MN Plex Arabic'; font-style: normal; font-weight: 600; font-display: swap;
             src: url('../fonts/ibm-plex-sans-arabic/ibm-plex-sans-arabic-600-arabic.woff2') format('woff2');
             unicode-range: U+0600-06FF, U+0750-077F, U+0870-08FF, U+200C-200E, U+2010-2011, U+FB50-FDFF, U+FE70-FEFC; }
@font-face { font-family: 'MN Plex Arabic'; font-style: normal; font-weight: 700; font-display: swap;
             src: url('../fonts/ibm-plex-sans-arabic/ibm-plex-sans-arabic-700-arabic.woff2') format('woff2');
             unicode-range: U+0600-06FF, U+0750-077F, U+0870-08FF, U+200C-200E, U+2010-2011, U+FB50-FDFF, U+FE70-FEFC; }

/* -- كان مكرَّراً في الأساسات الثلاثة كما هو، إلا الخطّ ولون الإبراز -- */
        body {
            font-family: var(--mn-font);
            background: #f4f6f9;
            overflow-x: hidden;
        }

        /* Sidebar */
        /* الشريط عمودٌ: الشعار ثابتٌ في رأسه والقائمة تحته تُمرَّر وحدها (8 تشرين الأول 2026). كان ارتفاعه ارتفاع
           الشاشة وoverflow مرئياً: ما تحت الحافة لا يُقصّ ولا يُمرَّر، والعنصر fixed فلا يحرّكه تمرير الصفحة — فعند
           375×667 كانت البنود من الحادي عشر («زبائن بلا عقد موقَّع») حتى «الإعدادات» خارج الوصول. يحرسه
           الحارس «الشريط الجانبي يُمرَّر حتى آخر بند» */
        .sidebar {
            height: 100vh;
            height: 100dvh;   /* شريط عنوان متصفح الجوال لا يغطّي آخر البنود — ومتصفحٌ لا يعرف dvh يبقى على 100vh */
            display: flex;
            flex-direction: column;
            background: linear-gradient(180deg, #1f2d3d, #273c55);
            color: #fff;
            position: fixed;
            top: 0;
            right: 0;
            width: 250px;
            z-index: 1050;
            transition: all 0.3s ease;
        }

        .sidebar .logo {
            flex: none;
            font-size: 20px;
            font-weight: bold;
            padding: 20px;
            text-align: center;
            border-bottom: 1px solid rgba(255,255,255,0.1);
        }

        /* القائمة: الارتفاع الباقي، وتُمرَّر داخلها. nowrap — .nav من Bootstrap يلتفّ افتراضياً، فبارتفاعٍ محدود تصير
           البنود الفائضة عموداً ثانياً بدل أن تُمرَّر. وcontain: بلوغ آخرها لا يمرّر الصفحة خلفها */
        .sidebar > .nav {
            flex: 1 1 auto;
            min-height: 0;
            flex-wrap: nowrap;
            overflow-y: auto;
            overscroll-behavior: contain;
            -webkit-overflow-scrolling: touch;
            scrollbar-width: thin;
            scrollbar-color: rgba(255, 255, 255, 0.25) transparent;
        }

        .sidebar .nav-link {
            color: #cfd8dc;
            padding: 12px 20px;
            border-radius: 8px;
            margin: 5px 10px;
            transition: 0.3s;
        }

        .sidebar .nav-link:hover,
        .sidebar .nav-link.active {
            background-color: var(--mn-orange);
            color: #fff;
        }

        /* Overlay */
        .sidebar-overlay {
            position: fixed;
            inset: 0;
            background: rgba(0,0,0,0.4);
            z-index: 1040;
            display: none;
        }

        /* Main Content */
        .main-content {
            margin-right: 250px;
            padding: 20px;
            transition: 0.3s;
        }

        /* Navbar */
        .top-navbar {
            background: white;
            border-radius: 12px;
            padding: 10px 20px;
            box-shadow: 0 4px 12px rgba(0,0,0,0.05);
        }

        /* Cards */
        .modern-card {
            border: none;
            border-radius: 16px;
            box-shadow: 0 6px 18px rgba(0,0,0,0.06);
            transition: 0.3s;
        }

        .modern-card:hover {
            transform: translateY(-5px);
            box-shadow: 0 10px 25px rgba(0,0,0,0.1);
        }

        /* Responsive */
        @media (max-width: 991px) {

            .sidebar {
                right: -250px;
            }

            .sidebar.active {
                right: 0;
            }

            .main-content {
                margin-right: 0;
            }

            .sidebar-overlay.active {
                display: block;
            }
        }


    /* Container */
.zoho-toast-container {
    position: fixed;
    top: 20px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 1100;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 12px;
}


/* Toast Card */
.zoho-toast {
    min-width: 320px;
    max-width: 420px;
    background: #ffffff;
    border-radius: 8px;
    border-left: 4px solid #2563eb;
    box-shadow: 0 8px 24px rgba(0,0,0,0.08);
    padding: 14px 18px;
    animation: zohoSlideDown 0.35s ease;
    font-size: 14px;
}


/* Content Layout */
.zoho-toast-content {
    display: flex;
    align-items: center;
    gap: 10px;
}

/* Icon */
.zoho-toast-icon i {
    font-size: 16px;
    color: #6b7280; /* رمادي مثل Zoho */
}

/* Text */
.zoho-toast-text {
    flex: 1;
    color: #374151;
}

/* Close Button */
.zoho-close {
    background: transparent;
    border: none;
    font-size: 14px;
    color: #9ca3af;
    cursor: pointer;
    padding: 0;
}

.zoho-close:hover {
    color: #111827;
}

/* Variants */
.zoho-success { border-left-color: #22c55e; }
.zoho-error { border-left-color: #ef4444; }
.zoho-warning { border-left-color: #f59e0b; }
.zoho-info { border-left-color: #3b82f6; }

/* Animation */
@keyframes zohoSlideDown {
    from {
        opacity: 0;
        transform: translateY(-20px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}


    /* صندوق أخطاء النموذج */
.zoho-form-errors {
    animation: fadeError 0.3s ease;
}

/* الخطأ العام */
.zoho-error-box {
    background: #fff;
    border-left: 4px solid #ef4444;
    border-radius: 8px;
    padding: 14px 16px;
    box-shadow: 0 6px 18px rgba(0,0,0,0.05);
    margin-bottom: 12px;
}

.zoho-error-title {
    font-weight: 600;
    color: #b91c1c;
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 6px;
}

.zoho-error-title i {
    color: #ef4444;
}

/* أخطاء الحقول */
.zoho-error-field {
    font-size: 13px;
    color: #dc2626;
    background: #fef2f2;
    padding: 8px 12px;
    border-radius: 6px;
    margin-bottom: 6px;
    display: flex;
    align-items: center;
    gap: 4px;
}

.zoho-error-field i {
    font-size: 16px;
    color: #ef4444;
}

/* حركة ظهور */
@keyframes fadeError {
    from {
        opacity: 0;
        transform: translateY(-5px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

        .select2-container .select2-selection--single {
    height: 42px;
    border-radius: 10px;
    padding-top: 6px;
    border: 1px solid #ced4da;
}

.select2-container--default .select2-selection--single .select2-selection__arrow {
    height: 42px;
}

.select2-container--default.select2-container--focus .select2-selection--single {
    border-color: var(--mn-orange);
    box-shadow: 0 0 0 0.15rem rgba(232,106,23,0.2);
}
    
