/* ============================================================
   1. تنسيق النصوص والمحاذاة (تنسيقاتك الأصلية)
   ============================================================ */

/* ضبط المحاذاة في صفحة تفاصيل البحث والمراجع */
.obj_article_details .abstract, 
.obj_article_details .author_bios, 
.obj_article_details .references {
    text-align: justify !important;
}

/* ضبط المحاذاة في صفحات (عن المجلة) والصفحات الثابتة */
.page_about .description,
.page_about .section p,
.page_static .content p,
.pkp_structure_main p,
.pkp_structure_main .content {
    text-align: justify !important;
    text-justify: inter-word;
}

/* منع تقطيع الكلمات بالشرطة العرضية */
body {
    -webkit-hyphens: none;
    -ms-hyphens: none;
    hyphens: none;
}

/* ============================================================
   2. تحسين القوائم المنسدلة (نظام الإطارات والبطاقات المستقلة)
   ============================================================ */

/* الصندوق الرئيسي للقائمة المنسدلة */
.pkp_nav_menu .dropdown-menu {
    background-color: #f8f9fa !important; /* خلفية فاتحة جداً للتباين */
    border: none !important;
    border-top: 5px solid #2D7D63 !important; /* خط علوي أخضر سميك */
    border-radius: 8px !important;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.12) !important;
    padding: 10px !important; /* مساحة حول البطاقات الداخلية */
    min-width: 270px !important;
}

/* تحويل كل رابط في القائمة إلى "إطار" مستقل */
.pkp_nav_menu .dropdown-menu li {
    margin-bottom: 6px !important; /* مسافة فاصلة بين الإطارات */
}

.pkp_nav_menu .dropdown-menu li a {
    color: #444 !important;
    padding: 12px 18px !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    text-decoration: none !important;
    display: block !important;
    background: #ffffff !important; /* كل عنوان له خلفية بيضاء مستقلة */
    border: 1px solid #e9ecef !important; /* إطار خفيف لكل عنوان */
    border-radius: 6px !important; /* زوايا دائرية بسيطة لكل إطار */
    transition: all 0.25s ease-in-out !important;
}

/* تأثير "البطاقة النشطة" عند تمرير الماوس */
.pkp_nav_menu .dropdown-menu li a:hover {
    background-color: #ffffff !important;
    color: #2D7D63 !important;
    border: 1px solid #2D7D63 !important; /* تحول الإطار بالكامل للأخضر */
    border-left: 6px solid #2D7D63 !important; /* تمييز جانبي سميك */
    box-shadow: 3px 3px 10px rgba(45, 125, 99, 0.15) !important;
    padding-left: 22px !important; /* إزاحة خفيفة لإعطاء شعور بالحركة */
}

/* ============================================================
   3. معالجة الصور واستجابة الموبايل (Responsive Support)
   ============================================================ */

/* ضمان عدم خروج الصور عن إطار الشاشة في الهواتف */
.pkp_structure_main img, 
.pkp_structure_main .content img, 
.page_static img,
.obj_article_details img,
.obj_issue_toc img {
    max-width: 100% !important; /* الصورة لن تتجاوز عرض الشاشة أبداً */
    height: auto !important;     /* الحفاظ على تناسب الطول والعرض */
    display: block;
    margin-left: auto;
    margin-right: auto;
}

/* معالجة الجداول والمحتويات العريضة */
.pkp_structure_main .content, 
.obj_article_details .abstract,
.page_static .content {
    overflow-x: auto !important; /* يسمح بالتمرير الأفقي بدلاً من كسر التصميم */
}