/* Language switcher — header / offcanvas */
.lang-switch {
    display: inline-flex;
    align-items: center;
    gap: 2px;
    padding: 3px;
    border-radius: 999px;
    background: #f3f8fb;
    border: 1px solid #dbeaf3;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9);
    flex-shrink: 0;
}

.lang-switch__form {
    margin: 0;
    display: inline-flex;
}

.lang-switch__btn {
    appearance: none;
    border: 0;
    background: transparent;
    color: #5b6b7c;
    font-weight: 700;
    font-size: 0.72rem;
    letter-spacing: 0.02em;
    line-height: 1;
    min-width: 30px;
    height: 28px;
    padding: 0 8px;
    border-radius: 999px;
    cursor: pointer;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: background 0.2s ease, color 0.2s ease, box-shadow 0.2s ease;
}

.lang-switch__btn:hover:not(.is-active) {
    color: #0089BF;
    background: rgba(255, 255, 255, 0.85);
}

.lang-switch__btn.is-active {
    background: #fff;
    color: #01305F;
    box-shadow: 0 1px 4px rgba(1, 48, 95, 0.12);
    cursor: default;
    pointer-events: none;
}

.lang-switch__btn[lang="en"] {
    font-family: "Plus Jakarta Sans", "Tajawal", sans-serif;
    font-size: 0.68rem;
    letter-spacing: 0.04em;
}

.lang-switch__btn[lang="ar"] {
    font-family: "Tajawal", sans-serif;
    font-size: 0.8rem;
}

.lang-switch--oc {
    margin: 0;
    align-self: auto;
}

/* ── نسخة الهيدر ── */
.lang-switch--header {
    position: relative;
    align-items: stretch;
    gap: 2px;
    padding: 3px;
    border-radius: 8px;
    background: #eef3f7;
    border: 1px solid #e2ebf1;
    box-shadow: inset 0 1px 1px rgba(1, 48, 95, 0.04);
    overflow: hidden;
}

.lang-switch--header .lang-switch__btn {
    position: relative;
    z-index: 1;
    flex: 1 1 0;
    min-width: 34px;
    height: 28px;
    padding: 0 11px;
    font-size: 0.68rem;
    font-weight: 800;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    color: #708090;
    border-radius: 6px;
    background: transparent;
    box-shadow: none;
    transition:
        color 0.2s ease,
        background 0.2s ease,
        box-shadow 0.2s ease;
}

.lang-switch--header .lang-switch__btn[lang="en"] {
    font-family: "Plus Jakarta Sans", "Tajawal", sans-serif;
    font-size: 0.65rem;
    letter-spacing: 0.07em;
}

.lang-switch--header .lang-switch__btn[lang="ar"] {
    font-family: "Tajawal", sans-serif;
    font-size: 0.76rem;
    letter-spacing: 0.03em;
}

.lang-switch--header .lang-switch__btn:hover:not(.is-active) {
    color: #01305F;
    background: rgba(255, 255, 255, 0.45);
}

.lang-switch--header .lang-switch__btn.is-active {
    background: #fff;
    color: #01305F;
    box-shadow:
        0 1px 3px rgba(1, 48, 95, 0.1),
        0 0 0 1px rgba(1, 48, 95, 0.06);
    pointer-events: none;
    cursor: default;
}

.lang-switch--header .lang-switch__btn:focus-visible {
    outline: 2px solid rgba(0, 137, 191, 0.4);
    outline-offset: 1px;
}

@media (max-width: 991.98px) {
    .lang-switch--header {
        height: 40px;
        padding: 3px;
        align-items: stretch;
        background: #eef3f7;
        border: 1px solid #e4eef4;
        box-shadow: inset 0 1px 1px rgba(1, 48, 95, 0.04);
    }

    .lang-switch--header .lang-switch__btn {
        min-width: 32px;
        height: auto;
        padding: 0 12px;
        align-self: stretch;
    }

    .lang-switch--header .lang-switch__btn.is-active {
        box-shadow:
            0 1px 4px rgba(1, 48, 95, 0.12),
            0 0 0 1px rgba(0, 137, 191, 0.14);
        color: #0089BF;
    }
}

@media (max-width: 400px) {
    .lang-switch--header {
        height: 38px;
        padding: 2px;
    }

    .lang-switch--header .lang-switch__btn {
        min-width: 30px;
        padding: 0 9px;
    }
}

/* Header LTR polish — only when document is English */
html[lang="en"] body {
    font-family: "Plus Jakarta Sans", "Tajawal", Helvetica, Arial, sans-serif;
}

html[lang="en"] .topbar-text {
    font-family: "Plus Jakarta Sans", "Tajawal", Helvetica, Arial, sans-serif;
    letter-spacing: 0.01em;
}

html[lang="en"] .header-nav__actions .badge-notification,
html[lang="en"] .badge-notification,
html[lang="en"] #header-alerts-count {
    inset-inline-end: -2px;
    inset-inline-start: auto;
    right: auto;
    left: auto;
}

/* Chevron: undo LTR outer-edge flip — keep on left of avatar (toward icons) */
html[lang="en"] .header-profile-chevron {
    left: -3px;
    right: auto;
}

html[lang="en"] .nav-link-item {
    letter-spacing: 0.01em;
}

html[lang="en"] .btn-primary-custom,
html[lang="en"] .btn-outline-custom,
html[lang="en"] .btn-header-mobile-auth {
    letter-spacing: 0.015em;
}