/* استدعاء الخطوط محمد علاءالدين */
@import url('https://fonts.googleapis.com/css2?family=Cairo:wght@400;700&family=Markazi+Text:wght@400;600&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Alegreya+Sans+SC:wght@400&display=swap');

/* ===========================
   JLPS Metrics Responsive
=========================== */

.jlps-card{
    width:100%;
    box-sizing:border-box;
    overflow:hidden;
}

.jlps-card-header{
    display:flex;
    align-items:center;
    gap:10px;
    margin-bottom:12px;
}

.jlps-card-header img{
    width:34px;
    height:34px;
    object-fit:contain;
    flex-shrink:0;
}

.jlps-card-title{
    flex:1;
    font-weight:700;
}

.jlps-card-body{
    display:flex;
    flex-direction:column;
    gap:8px;
}

.jlps-card-row{
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:12px;
    flex-wrap:wrap;
}

.jlps-card-label{
    flex:1;
    min-width:120px;
}

.jlps-card-value{
    font-weight:700;
    white-space:nowrap;
}

/* الهاتف */

@media (max-width:768px){

    .jlps-card{
        font-size:15px;
    }

    .jlps-card-header{
        flex-direction:column;
        text-align:center;
    }

    .jlps-card-title{
        text-align:center;
    }

    .jlps-card-row{
        flex-direction:column;
        align-items:flex-start;
        gap:3px;
    }

    html[lang="ar"] .jlps-card-row{
        align-items:flex-end;
    }

    .jlps-card-value{
        font-size:17px;
    }

}

.jlps-card-logo{
    width:36px;
    height:36px;

    min-width:36px;
    min-height:36px;

    max-width:36px;
    max-height:36px;

    object-fit:contain;
    display:block;
    flex-shrink:0;
}

/* إصلاح بطاقات الإحصائيات */

.jlps-card{
    width:100%;
    max-width:100%;
    box-sizing:border-box;
}

.jlps-card-body{
    width:100%;
}

.jlps-card-row{
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:10px;
}

.jlps-card-label{
    flex:1 1 auto;
    min-width:0;
    word-break:break-word;
}

.jlps-card-value{
    flex:0 0 auto;
    white-space:normal;
    text-align:end;
}

/* الهاتف */

@media (max-width:768px){

    .jlps-card-row{
        display:block;
    }

    .jlps-card-label,
    .jlps-card-value{
        display:block;
        width:100%;
    }

    .jlps-card-value{
        margin-top:4px;
    }

}

/* هذا هو السطر الذي سيعيد العمود الجانبي */
.article_metrics {
    float: right; /* أو left حسب لغة الموقع */
    width: 60%;   /* تحديد عرض المقال ليترك 30% للعمود الجانبي */
}

/* ضبط حاوية الإحصائيات داخل المقال */
.article-metrics-box {
    width: 100%;
    overflow: hidden;
    clear: both;
}
/* منع السكرول الأفقي */
html, body {
    overflow-x: hidden;
}
p span {
  font-family: inherit !important;
}
/* تثبيت حجم الرسم */
canvas.usageStatsGraph {
  width: 342px !important;
  height: 171px !important;

  min-width: 342px !important;
  max-width: 342px !important;

  min-height: 171px !important;

  display: block !important;
}

/* منع أي عنصر أب من إعادة التمدد */
.usageStatsGraph {
  flex: none !important;
}

/* إذا كان داخل container responsive */
.chart-container,
.usageStatsContainer {
  width: 342px !important;
  height: 171px !important;
  max-width: 342px !important;
}

.pkp_head_wrapper,
.pkp_navigation_primary_wrapper,
.pkp_navigation_primary_row {
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
  overflow-x: clip; /* أو hidden إذا لم يكن clip مدعومًا */
}
.pkp_site_name,
.pkp_site_name_wrapper {
  max-width: 100%;
  box-sizing: border-box;
}
.pkp_navigation_search_wrapper,
.pkp_navigation_primary_wrapper * {
  max-width: 100%;
}
.dropdown-menu {
    min-width: 160px;
}
.dropdown-menu a {
    font-size: 10px;
    color: #000;
}
.dropdown-menu a:hover {
    background: #f1f1f1;
}
.pkp_head_wrapper {
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
  overflow-x: clip; /* أو hidden إذا لم يتوفر clip */
}

overflow-x: clip;

.content img {
  max-width: 90% !important;   /* الصورة ما تتجاوز عرض الحاوية */
  height: auto;      /* يحافظ على التناسب */
  display: inline-block; /* تبقى بمحاذاة النصوص/الصور الأخرى */
  margin: 5px;       /* مسافة صغيرة حول كل شعار */
}

header h1 {
  font-size: 20px !important;
  margin: 0;
}


nav ul li a {
  color: #112964;
  text-decoration: none;
  font-weight: bold;
  transition: 0.3s;
}

nav ul li a:hover {
  color: #112964;
}

/* ====== CONTENT ====== */
main {
  padding: 10px;
}

/* ====== FOOTER ====== */
footer {
  background-color: #004085;
  color: #fff;
  text-align: center;
  padding: 10px;
  margin-top: 10px;
}

.pkp_site_name a.is_text {
    font-size: 24px !important;  /* حجم الخط */
    font-weight: bold; /* سماكة الخط (اختياري) */
    text-decoration: none; /* إزالة الخط السفلي */
font-family: 'Cairo', sans-serif;
  color: #ffffff;
  text-shadow: 2px 2px 4px rgba(0,0,0,0.3);
}
.csl-entry {
    font-size: 16px;   /* حجم الخط */
    text-decoration: none; /* إزالة الخط السفلي */
font-family: 'Cairo', sans-serif;
}
/* ------------------------
   قواعد للعربية
------------------------- */
html[lang="ar"] body {
  line-height: 1.9 !important;
}

/* النصوص بالعربي */
html[lang="ar"] body, 
html[lang="ar"] span {
  font-family: 'Markazi Text', serif; !important;
  font-size: 22px !important;
  direction: rtl;
  text-align: justify;
line-height: 1.8 !important;
}
html[lang="ar"] p {
  font-family: 'Markazi Text', serif; !important;
  font-size: 22px !important;
  direction: rtl;
  text-align: justify;
line-height: 1.8 !important;
}
/* تكبير الخط لقسم المؤلفين */
.authors {
    font-family: 'Markazi Text', serif !important; /* نفس خط النصوص */
    font-size: 18px !important; /* حجم أكبر، عدّل حسب الحاجة */
    line-height: 1.6 !important; /* المسافة بين الأسطر */
    direction: rtl; /* إذا اللغة عربية */
    text-align: right; /* محاذاة صحيحة */
}
html[lang="en"] .authors {
    font-family: 'Markazi Text', serif !important;
    font-size: 22px !important;
    line-height: 1.7 !important;
    direction: ltr;
    text-align: left;
}
/* العناوين بالعربي */
html[lang="ar"] h1,
html[lang="ar"] h2,
html[lang="ar"] h3,
html[lang="ar"] h4,
html[lang="ar"] h5,
html[lang="ar"] h6,
html[lang="ar"] a, 
html[lang="ar"] li {
  font-family: "Cairo", sans-serif !important;
  font-size: 18px ;
  direction: rtl;
  text-align: right;
line-height: 1.9 !important;
}
/* ------------------------
   قواعد للإنكليزية
------------------------- */
html[lang="en"] body {
    direction: ltr;
  text-align: left;
}

/* النصوص + العناوين بالإنكليزي */
html[lang="en"] body,
html[lang="en"] p,
html[lang="en"] span {
line-height: 1.7 !important;
font-family: "Alegreya Sans SC", sans-serif !important;
  font-size: 22px !important;
text-align: justify;
}

html[lang="en"] li {
 font-family: "Alegreya Sans SC", sans-serif !important;
  font-size: 19px !important;
font-weight: bold !important;
line-height: 1.5 !important;
}
html[lang="en"] a,
html[lang="en"] h1,
html[lang="en"] h2,
html[lang="en"] h3,
html[lang="en"] h4,
html[lang="en"] h5,
html[lang="en"] h6 {
  font-family: "Alegreya Sans SC", sans-serif !important;
  font-size: 22px !important;
font-weight: bold !important;
line-height: 1.7 !important;
}

/* أيقونات بطاقات الإحصائيات */

.jlps-card-header img,
.crossref-metric img,
.dimensions-metric img,
#openalex-citations img,
#matomo-dynamic-container img{

    width:32px;
    height:32px;

    min-width:32px;
    min-height:32px;

    max-width:32px;
    max-height:32px;

    object-fit:contain;
    flex-shrink:0;
}
/* =====================================================
   JLPS Metrics Card
===================================================== */

.jlps-card{

    width:100%;
    box-sizing:border-box;

    padding:15px;

    background:#fafafa;

    border:1px solid #d9d9d9;

    border-radius:8px;

}


.jlps-card-header{

    display:flex;

    align-items:center;

    gap:12px;

    margin-bottom:12px;

    padding-bottom:8px;

    border-bottom:1px solid #ddd;

}


.jlps-card-logo{

    width:38px;

    height:38px;

    min-width:38px;

    max-width:38px;

    object-fit:contain;

}


.jlps-card-title{

    font-weight:bold;

    font-size:17px;

}


.jlps-card-body{

    display:flex;

    flex-direction:column;

    gap:8px;

}


.jlps-card-row{

    display:flex;

    justify-content:space-between;

    align-items:center;

    gap:15px;

}


.jlps-card-label{

    flex:1;

}


.views{

    color:#0b78c8;

    font-weight:bold;

}


.downloads{

    color:#1b8f3e;

    font-weight:bold;

}


.reading{

    color:#d67a00;

    font-weight:bold;

}


.engagement{

    color:#8e44ad;

    font-weight:bold;

}


html[lang="ar"] .jlps-card{

    direction:rtl;

}


html[lang="en"] .jlps-card{

    direction:ltr;

}


/* =======================
   Mobile
======================= */

@media(max-width:768px){

.jlps-card-row{

    flex-direction:column;

    align-items:flex-start;

    gap:2px;

}

html[lang="ar"] .jlps-card-row{

    align-items:flex-end;

}

.jlps-card-logo{

    width:32px;

    height:32px;

}

}
.jlps-card-logo{
    width:32px;
    height:32px;
    object-fit:contain;
    flex-shrink:0;
    display:block;
}