/* نظام التباين العالي الشامل - أمانة منطقة الجوف */

/* التبديل بين الوضعين */
.high-contrast-toggle {
    cursor: pointer;
    padding: 8px 15px;
    border-radius: 5px;
    background: #f8f9fa;
    color: #333;
    border: 2px solid #ddd;
    transition: all 0.3s ease;
    font-weight: bold;
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

.high-contrast-toggle:hover {
    background: #e9ecef;
    border-color: #1B8354;
}

.high-contrast-toggle.active {
    background: #0d121c;
    color: #fff;
    border-color: #fff;
}

.high-contrast-toggle i {
    font-size: 1.2em;
}

/* حالة التباين العالي */
body.high-contrast {
    background: #0d121c !important;
    color: #FFFFFF !important;
    font-weight: bold !important;
}

/* ==================== حدود رفيعة لتقسيم الأجزاء ==================== */

/* 1. خط رفيع بين الشريط العلوي والهيدر */
body.high-contrast .top-bar {
    background: #0d121c !important;
    border-bottom: 1px solid #384250 !important; /* خط رفيع أسفل الشريط العلوي */
}

/* 2. خط رفيع بين الهيدر والمحتوى الرئيسي */
body.high-contrast .modern-header {
    background: #0d121c !important;
    border-bottom: 1px solid #384250 !important; /* خط رفيع أسفل الهيدر */
}

/* 3. خط رفيع بين أقسام المحتوى */
body.high-contrast section:not(.high-contrast-preserve) {
    border-bottom: 1px solid #384250 !important; /* خط رفيع بين الأقسام */
    padding-bottom: 20px !important;
    margin-bottom: 20px !important;
}

body.high-contrast section:last-of-type {
    border-bottom: none !important;
}

/* 4. خط رفيع بين الفوتر والمحتوى */

body.high-contrast footer:not(.high-contrast-preserve),
body.high-contrast footer *:not(.high-contrast-preserve):not(a):not(.btn) {
    background: #384250 !important;
    color: #FFFFFF !important;
}

body.high-contrast footer:not(.high-contrast-preserve) {
    border-top: 1px solid #4caf50 !important;
}
/* 5. خط رفيع حول البطاقات */
body.high-contrast .card:not(.high-contrast-preserve) {
    background: #0d121c !important;
    border: 1px solid #384250 !important; /* خط رفيع حول البطاقات */
}

/* 6. خط رفيع بين عناصر القائمة */
body.high-contrast .nav_dropdown .dropdown-item {
    color: #FFFFFF !important;
    border-bottom: 1px solid #384250 !important; /* خط رفيع بين عناصر القائمة */
}

body.high-contrast .nav_dropdown .dropdown-item:last-child {
    border-bottom: none !important;
}

/* 7. خط رفيع للجداول */
body.high-contrast table:not(.high-contrast-preserve) {
    border: 1px solid #384250 !important; /* خط رفيع حول الجدول */
}

body.high-contrast th:not(.high-contrast-preserve),
body.high-contrast td:not(.high-contrast-preserve) {
    padding: 10px !important;
    background: #0d121c !important;
    color: #FFFFFF !important;
    border-bottom: 1px solid #384250 !important; /* خط رفيع بين صفوف الجدول */
}

body.high-contrast th:not(.high-contrast-preserve) {
    border-bottom: 2px solid #4caf50 !important; /* خط أسمك لعناوين الجدول */
}

/* 8. خط رفيع للفورم */
body.high-contrast .form-group:not(.high-contrast-preserve) {
    border-bottom: 1px solid #384250 !important; /* خط رفيع بين حقول الفورم */
    padding-bottom: 15px !important;
    margin-bottom: 15px !important;
}

body.high-contrast .form-group:last-of-type {
    border-bottom: none !important;
}

/* 9. خط رفيع للمودالات */
body.high-contrast .modal-content:not(.high-contrast-preserve) {
    background: #0d121c !important;
    border: 1px solid #384250 !important; /* خط رفيع حول المودال */
}

body.high-contrast .modal-header {
    border-bottom: 1px solid #384250 !important; /* خط رفيع بين الهيدر والمحتوى */
}

body.high-contrast .modal-footer {
    border-top: 1px solid #384250 !important; /* خط رفيع بين المحتوى والفوتر */
}

/* 10. خط رفيع للتنبيهات */
body.high-contrast .alert:not(.high-contrast-preserve) {
    font-weight: bold !important;
    border-left: 4px solid transparent !important; /* خط جانبي للتنبيهات */
}

body.high-contrast .alert-success {
    background: #0d1c0d !important;
    color: #00FF00 !important;
    border-left-color: #00FF00 !important;
}

body.high-contrast .alert-danger {
    background: #1c0d0d !important;
    color: #FF0000 !important;
    border-left-color: #FF0000 !important;
}

body.high-contrast .alert-warning {
    background: #1c1c0d !important;
    color: #FFFF00 !important;
    border-left-color: #FFFF00 !important;
}

body.high-contrast .alert-info {
    background: #0d1c1c !important;
    color: #4caf50 !important;
    border-left-color: #4caf50 !important;
}

/* ==================== العناصر الأساسية ==================== */

/* النصوص */
body.high-contrast h1,
body.high-contrast h2,
body.high-contrast h3,
body.high-contrast h4,
body.high-contrast h5,
body.high-contrast h6,
body.high-contrast p,
body.high-contrast span,
body.high-contrast div:not(.high-contrast-preserve) {
    color: #FFFFFF !important;
    background: #0d121c !important;
}

/* الروابط */
body.high-contrast a:not(.btn):not(.high-contrast-preserve) {
    color: #4caf50 !important;
    text-decoration: underline !important;
    text-decoration-thickness: 2px !important;
}

body.high-contrast a:hover:not(.high-contrast-preserve) {
    color: #FFFF00 !important;
    background: transparent !important;
}

/* الأزرار */
body.high-contrast .btn:not(.high-contrast-preserve),
body.high-contrast button:not(.high-contrast-preserve) {
    background: #384250 !important;
    color: #FFFFFF !important;
    font-weight: bold !important;
    border: 1px solid #4caf50 !important; /* خط رفيع حول الأزرار */
}

body.high-contrast .btn:hover:not(.high-contrast-preserve),
body.high-contrast button:hover:not(.high-contrast-preserve) {
    background: #4caf50 !important;
    color: #FFFFFF !important;
}

/* الحقول */
body.high-contrast input:not(.high-contrast-preserve),
body.high-contrast textarea:not(.high-contrast-preserve),
body.high-contrast select:not(.high-contrast-preserve) {
    background: #384250 !important;
    color: #FFFFFF !important;
    font-weight: bold !important;
    border: 1px solid #4caf50 !important; /* خط رفيع حول الحقول */
}

body.high-contrast input:focus:not(.high-contrast-preserve),
body.high-contrast textarea:focus:not(.high-contrast-preserve),
body.high-contrast select:focus:not(.high-contrast-preserve) {
    background: #1a202c !important;
    border-color: #FFFF00 !important; /* تغيير لون الحدود عند التركيز */
}

/* الصور */
body.high-contrast img {
    filter: none !important;
}

/* عناصر الشريط العلوي */
body.high-contrast .top-bar .nav-link {
    color: #4caf50 !important;
}

body.high-contrast .top-bar .nav-link:hover {
    background: #1a202c !important;
    color: #FFFFFF !important;
}

/* القوائم */
body.high-contrast .navbar-nav .nav-link {
    color: #4caf50 !important;
}

body.high-contrast .nav_dropdown .dropdown-menu {
    background: #0d121c !important;
    border: 1px solid #384250 !important; /* خط رفيع حول القائمة المنسدلة */
}

body.high-contrast .nav_dropdown .dropdown-item:hover {
    background: #384250 !important;
    color: #FFFFFF !important;
}

/* Offcanvas للجوال */
body.high-contrast #mobileSidebar .offcanvas-header {
    background: #0d121c !important;
    border-bottom: 1px solid #384250 !important; /* خط رفيع أسفل الهيدر */
}

body.high-contrast #mobileSidebar .offcanvas-body {
    background: #0d121c !important;
}

body.high-contrast #mobileSidebar .list-group-item {
    border-bottom: 1px solid #384250 !important; /* خط رفيع بين عناصر القائمة */
}

body.high-contrast #mobileSidebar .list-group-item:last-child {
    border-bottom: none !important;
}

/* ==================== عناصر خاصة ==================== */

/* مؤشر التحديد */
body.high-contrast ::selection {
    background: #FFFF00 !important;
    color: #0d121c !important;
}

body.high-contrast ::-moz-selection {
    background: #FFFF00 !important;
    color: #0d121c !important;
}

/* شريط التمرير */
body.high-contrast ::-webkit-scrollbar {
    width: 10px;
    background: #0d121c;
}

body.high-contrast ::-webkit-scrollbar-track {
    background: #0d121c;
    border-left: 1px solid #384250 !important; /* خط رفيع لشريط التمرير */
}

body.high-contrast ::-webkit-scrollbar-thumb {
    background: #384250;
    border: 1px solid #4caf50 !important; /* خط رفيع لزر التمرير */
}

body.high-contrast ::-webkit-scrollbar-thumb:hover {
    background: #4caf50;
}

/* الأيقونات */
body.high-contrast .fas:not(.high-contrast-preserve),
body.high-contrast .fab:not(.high-contrast-preserve),
body.high-contrast .far:not(.high-contrast-preserve) {
    color: #FFFFFF !important;
}

/* تأثيرات خاصة للتباين العالي */
body.high-contrast .high-contrast-highlight {
    background: transparent !important;
    border: 2px dashed #FFFF00 !important; /* خط منقط للتأكيد */
    animation: highContrastPulse 2s infinite;
}

@keyframes highContrastPulse {
    0%, 100% { border-color: #FFFF00; }
    50% { border-color: #4caf50; }
}

/* الطباعة في وضع التباين العالي */
@media print {
    body.high-contrast {
        -webkit-print-color-adjust: exact !important;
        print-color-adjust: exact !important;
        background: #FFFFFF !important;
        color: #0d121c !important;
    }
    
    body.high-contrast * {
        background: #FFFFFF !important;
        color: #0d121c !important;
        border: 1px solid #CCCCCC !important; /* حدود رفيعة للطباعة */
    }
}

/* استثناءات (عناصر لا نريد تطبيق التباين العالي عليها) */
.high-contrast-preserve {
    /* احتفظ بالمظهر الأصلي */
}

/* ====== ألوان متدرجة ====== */
body.high-contrast .hc-light {
    background: #1a202c !important;
}

body.high-contrast .hc-lighter {
    background: #273143 !important;
}

body.high-contrast .hc-dark {
    background: #080b12 !important;
}

/* ====== حدود إضافية لتقسيم المحتوى ====== */

/* خط رفيع بين المقالات */
body.high-contrast article:not(.high-contrast-preserve) {
    border-bottom: 1px solid #384250 !important;
    padding-bottom: 20px !important;
    margin-bottom: 20px !important;
}

body.high-contrast article:last-of-type {
    border-bottom: none !important;
}

/* خط رفيع للقوائم */
body.high-contrast ul:not(.high-contrast-preserve),
body.high-contrast ol:not(.high-contrast-preserve) {
    border-left: 1px solid #384250 !important; /* خط عمودي للقوائم */
    padding-left: 20px !important;
}

body.high-contrast li:not(.high-contrast-preserve) {
    border-bottom: 1px dashed #384250 !important; /* خط منقط بين عناصر القائمة */
    padding: 8px 0 !important;
}

body.high-contrast li:last-child {
    border-bottom: none !important;
}

/* خط رفيع للأكواد */
body.high-contrast code:not(.high-contrast-preserve),
body.high-contrast pre:not(.high-contrast-preserve) {
    background: #1a202c !important;
    border: 1px solid #384250 !important;
    color: #FFFFFF !important;
}

/* خط رفيع للملاحظات الجانبية */
body.high-contrast aside:not(.high-contrast-preserve) {
    background: #1a202c !important;
    border-left: 3px solid #4caf50 !important; /* خط جانبي سميك */
    padding: 15px !important;
    margin: 15px 0 !important;
}


