/* ==========================================================================
   إطار الموقع — التنقّل الأعلى، روابط التذييل، وتجميعات الصفحة الأولى.
   لا لون مكتوب هنا: كل شيء من رموز tokens.css أو currentColor.
   ========================================================================== */

/* --- التنقّل الرئيسي --- */

.jl-site-nav__list {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--space-3);
    margin: 0;
    padding: 0;
    list-style: none;
}

/*
 * فاصل رفيع بين العناصر لا فراغ وحده — الحدّ المنطقي يقع بين البندين
 * في الاتجاهين، فلا حاجة إلى قاعدة ثانية للإنجليزية.
 */
.jl-site-nav__item + .jl-site-nav__item {
    border-inline-start: 1px solid currentColor;
    padding-inline-start: var(--space-3);
}

.jl-site-nav__link {
    display: inline-block;
    padding: var(--space-1) 0;
    font-size: 14px;
    color: inherit;
    text-decoration: none;
}

.jl-site-nav__link:hover {
    text-decoration: underline;
    text-underline-offset: 3px;
}

/* الصفحة الجارية مُعلَّمة بصريًا كما هي مُعلَّمة لقارئ الشاشة. */
.jl-site-nav__link[aria-current='page'] {
    font-weight: 700;
    text-decoration: underline;
    text-underline-offset: 3px;
}

/* --- «انشر وظيفة»: نداء متمايز، مؤطَّر لا ملوّن --- */

.jl-site-nav__cta {
    display: inline-block;
    border: 1px solid currentColor;
    border-radius: var(--radius);
    padding: 5px 10px;
    font-size: 12px;
    font-weight: 700;
    color: inherit;
    text-decoration: none;
    white-space: nowrap;
}

.jl-site-nav__cta:hover {
    text-decoration: underline;
    text-underline-offset: 3px;
}

/*
 * ‏--accent على ‏--nav-bg تباينه لا يكفي لحلقة تركيز مرئية،
 * فداخل الشريط الحلقة من لون النصّ نفسه.
 */
.jl-site-header a:focus-visible,
.jl-site-header button:focus-visible {
    outline: 2px solid currentColor;
    outline-offset: 2px;
}

/* --- روابط التذييل --- */

.jl-footer-nav {
    margin-block-end: var(--space-4);
    padding-block-end: var(--space-4);
    border-block-end: var(--hairline);
}

.jl-footer-nav__list {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-2) var(--space-3);
    margin: 0;
    padding: 0;
    list-style: none;
}

.jl-footer-nav__item + .jl-footer-nav__item {
    border-inline-start: var(--hairline);
    padding-inline-start: var(--space-3);
}

.jl-footer-nav__link {
    color: inherit;
    text-decoration: none;
}

.jl-footer-nav__link:hover {
    text-decoration: underline;
    text-decoration-color: var(--accent-text);
    text-underline-offset: 3px;
}

/* --- تصفّح سريع: التجميعات المحرَّرة --- */

.jl-collections {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(190px, 1fr));
    gap: 0;
    margin: 0;
    padding: 0;
    list-style: none;
    border-block-start: var(--hairline);
    border-inline-start: var(--hairline);
}

.jl-collections__link {
    display: block;
    padding: var(--space-3);
    border-block-end: var(--hairline);
    border-inline-end: var(--hairline);
    font-size: 14px;
    color: inherit;
    text-decoration: none;
}

.jl-collections__link:hover {
    text-decoration: underline;
    text-decoration-color: var(--accent-text);
    text-underline-offset: 3px;
}
