.header,
#siteFooter {
    direction: ltr;
}

.article-language-switcher {
    position: relative;
    display: flex;
    align-items: center;
    gap: 12px;
    width: max-content;
    max-width: 100%;
    margin: 24px auto 0;
    padding: 7px 7px 7px 14px;
    border: 1px solid rgba(255, 255, 255, .14);
    border-radius: 16px;
    background: linear-gradient(135deg, rgba(255, 255, 255, .1), rgba(255, 255, 255, .045));
    box-shadow: 0 12px 35px rgba(0, 0, 0, .2), inset 0 1px rgba(255, 255, 255, .08);
    backdrop-filter: blur(18px);
}

.language-picker-kicker {
    display: flex;
    align-items: center;
    gap: 8px;
    color: rgba(255, 255, 255, .76);
    font: 600 .82rem/1.2 "Inter", sans-serif;
    white-space: nowrap;
}

.language-picker-kicker i {
    color: #F47A52;
    font-size: 1rem;
}

.language-picker {
    position: relative;
    direction: ltr;
}

.language-picker-button {
    display: flex;
    align-items: center;
    gap: 10px;
    min-width: 176px;
    padding: 10px 12px;
    border: 1px solid rgba(255, 255, 255, .12);
    border-radius: 11px;
    background: #fff;
    color: #111827;
    box-shadow: 0 5px 16px rgba(0, 0, 0, .2);
    font: 700 .92rem/1.2 "Inter", sans-serif;
    cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease;
}

.language-picker-button:hover {
    transform: translateY(-1px);
    box-shadow: 0 8px 22px rgba(0, 0, 0, .24);
}

.language-picker-button:focus-visible {
    outline: 3px solid rgba(244, 122, 82, .45);
    outline-offset: 2px;
}

.language-picker-button .fa-globe {
    color: #B84224;
}

.language-current {
    flex: 1;
    text-align: left;
}

.language-picker-button .fa-chevron-down {
    color: #6b7280;
    font-size: .7rem;
    transition: transform .18s ease;
}

.language-picker-button[aria-expanded="true"] .fa-chevron-down {
    transform: rotate(180deg);
}

.language-picker-menu {
    position: absolute;
    z-index: 50;
    top: calc(100% + 9px);
    right: 0;
    width: 250px;
    padding: 7px;
    border: 1px solid rgba(255, 255, 255, .12);
    border-radius: 15px;
    background: #111522;
    box-shadow: 0 20px 50px rgba(0, 0, 0, .42);
    transform-origin: top right;
}

.language-picker-menu[hidden] {
    display: none;
}

.language-option {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    width: 100%;
    padding: 10px 11px;
    border: 0;
    border-radius: 10px;
    background: transparent;
    color: #fff;
    text-align: left;
    cursor: pointer;
    transition: background .16s ease;
}

.language-option:hover,
.language-option:focus-visible {
    background: rgba(217, 82, 45, .18);
    outline: none;
}

.language-option[aria-selected="true"] {
    background: linear-gradient(135deg, rgba(217, 82, 45, .3), rgba(37, 99, 235, .17));
}

.language-option-copy {
    display: grid;
    gap: 2px;
}

.language-option-native {
    font-size: .96rem;
    font-weight: 750;
}

.language-option-english {
    color: #9ca3af;
    font: 500 .72rem/1.2 "Inter", sans-serif;
}

.language-option-check {
    display: grid;
    place-items: center;
    width: 23px;
    height: 23px;
    border-radius: 50%;
    background: #D9522D;
    color: #fff;
    font-size: .68rem;
    opacity: 0;
    transform: scale(.75);
    transition: opacity .16s ease, transform .16s ease;
}

.language-option[aria-selected="true"] .language-option-check {
    opacity: 1;
    transform: scale(1);
}

.language-status {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

html[lang="ar"] .blog-post-content,
html[lang="ar"] .blog-post-header,
html[lang="ar"] .blog-sidebar,
html[lang="ar"] .cta-content {
    font-family: "Noto Sans Arabic", sans-serif;
}

html[lang="ml"] .blog-post-content,
html[lang="ml"] .blog-post-header,
html[lang="ml"] .blog-sidebar,
html[lang="ml"] .cta-content {
    font-family: "Noto Sans Malayalam", sans-serif;
}

html[lang="hi"] .blog-post-content,
html[lang="hi"] .blog-post-header,
html[lang="hi"] .blog-sidebar,
html[lang="hi"] .cta-content {
    font-family: "Noto Sans Devanagari", sans-serif;
}

html[dir="rtl"] .blog-post-content,
html[dir="rtl"] .blog-post-header,
html[dir="rtl"] .blog-sidebar,
html[dir="rtl"] .cta-content {
    text-align: right;
}

html[dir="rtl"] .step-card {
    padding: 20px 68px 20px 20px;
}

html[dir="rtl"] .step-card::before {
    right: 18px;
    left: auto;
}

html[dir="rtl"] .breadcrumb i {
    transform: rotate(180deg);
}

html[dir="rtl"] .blog-post-content ul,
html[dir="rtl"] .blog-post-content ol {
    padding-right: 1.5rem;
    padding-left: 0;
}

@media (max-width: 720px) {
    .article-language-switcher {
        width: 100%;
        padding: 7px 7px 7px 12px;
    }

    .language-picker-button {
        min-width: 172px;
    }

    .language-picker-menu {
        right: auto;
        left: 50%;
        width: min(250px, calc(100vw - 48px));
        transform: translateX(-50%);
        transform-origin: top center;
    }
}