/* SHADA-HEADER-CONTROLS-R8 START */

/*
 * Final approved utility dimensions.
 *
 * Phone:   174px × 45px; text/icon 18px
 * Language: 124px × 35px; text 13px
 * Flag:     23px × 15px
 * Vertical separation: 9px
 */

/* --------------------------------------------------------
   HEADER GRID
   -------------------------------------------------------- */

html body
.container-header
.container-topbar {
    grid-template-columns:
        minmax(0, 1fr)
        174px !important;

    grid-template-rows:
        45px
        35px !important;

    column-gap: 12px !important;
    row-gap: 9px !important;

    align-items: center !important;
    align-content: center !important;

    box-sizing: border-box !important;

    width: 100% !important;
    min-height: 101px !important;
    height: auto !important;

    margin: 0 !important;

    padding:
        6px
        clamp(
            8px,
            2.5vw,
            32px
        ) !important;

    direction: ltr !important;
    overflow: visible !important;
}

/* Do not expand the white header when the menu opens. */

html body
.container-header
.container-topbar:has(
    #shada-language-selector-138
    > .shada-language-selector__menu:not([hidden])
),

html body
.container-header
.container-topbar:has(
    #shada-language-selector-138
    .shada-language-selector__toggle[
        aria-expanded="true"
    ]
) {
    grid-template-rows:
        45px
        35px !important;

    row-gap: 9px !important;
    min-height: 101px !important;
    padding-bottom: 6px !important;
}

/* --------------------------------------------------------
   ENGLISH LOGO
   -------------------------------------------------------- */

html:not([lang^="fa"])
body
.container-header
.shada-header-logo--en {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: flex-start !important;

    grid-column: 1 !important;
    grid-row: 1 / 3 !important;

    justify-self: start !important;
    align-self: center !important;

    position: static !important;

    top: auto !important;
    right: auto !important;
    bottom: auto !important;
    left: auto !important;
    inset: auto !important;

    width: auto !important;
    min-width: 1px !important;
    max-width: calc(100vw - 196px) !important;

    height: auto !important;
    min-height: 1px !important;

    margin: 0 !important;
    padding: 0 !important;

    opacity: 1 !important;
    visibility: visible !important;

    clip: auto !important;
    clip-path: none !important;

    overflow: visible !important;
    transform: none !important;
    filter: none !important;

    z-index: 30 !important;
}

html:not([lang^="fa"])
body
.container-header
.shada-header-logo--en
img {
    display: block !important;

    width: 208px !important;
    min-width: 1px !important;
    max-width: 208px !important;

    height: auto !important;
    min-height: 1px !important;
    max-height: 68px !important;

    margin: 0 !important;
    padding: 0 !important;

    opacity: 1 !important;
    visibility: visible !important;

    clip: auto !important;
    clip-path: none !important;

    object-fit: contain !important;
    transform: none !important;
    filter: none !important;
}

html:not([lang^="fa"])
body
.container-header
.shada-header-logo--fa {
    display: none !important;
}

/* Preserve the approved Persian logo arrangement. */

html[lang^="fa"]
body
.container-header
.shada-header-logo--en {
    display: none !important;
}

html[lang^="fa"]
body
.container-header
.shada-header-logo--fa {
    display: inline-flex !important;
    flex-direction: row-reverse !important;

    grid-column: 1 !important;
    grid-row: 1 / 3 !important;

    justify-self: start !important;
    align-self: center !important;

    direction: ltr !important;

    opacity: 1 !important;
    visibility: visible !important;
}

/* --------------------------------------------------------
   PHONE
   -------------------------------------------------------- */

html body
.container-header
.container-topbar
.shada-header-actions {
    grid-column: 2 !important;
    grid-row: 1 !important;

    justify-self: end !important;
    align-self: center !important;

    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;

    position: static !important;

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

    height: 45px !important;
    min-height: 45px !important;
    max-height: 45px !important;

    margin: 0 !important;
    padding: 0 !important;

    transform: none !important;
}

html body
.container-header
.container-topbar
.shada-phone-button {
    box-sizing: border-box !important;

    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    gap: 7px !important;

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

    height: 45px !important;
    min-height: 45px !important;
    max-height: 45px !important;

    margin: 0 !important;
    padding: 6px 10px !important;

    border-radius: 12px !important;

    direction: ltr !important;
    unicode-bidi: isolate !important;

    font-size: 18px !important;
    font-weight: 700 !important;
    line-height: 1 !important;

    white-space: nowrap !important;

    transform: none !important;
}

/*
 * Covers either the existing literal phone glyph or
 * any nested icon/number spans.
 */

html body
.container-header
.container-topbar
.shada-phone-button
*,

html body
.container-header
.container-topbar
.shada-phone-icon,

html body
.container-header
.container-topbar
.shada-phone-number {
    font-size: 18px !important;
    font-weight: 700 !important;
    line-height: 1 !important;
}

/* --------------------------------------------------------
   LANGUAGE SELECTOR
   -------------------------------------------------------- */

html body
.container-header
.container-topbar
#shada-language-selector-138 {
    --shada-language-r8-width: 124px;
    --shada-language-r8-height: 35px;
    --shada-language-r8-radius: 10px;

    grid-column: 2 !important;
    grid-row: 2 !important;

    justify-self: end !important;
    align-self: center !important;

    position: relative !important;
    inset: auto !important;

    box-sizing: border-box !important;

    width:
        var(--shada-language-r8-width) !important;

    min-width:
        var(--shada-language-r8-width) !important;

    max-width:
        var(--shada-language-r8-width) !important;

    height:
        var(--shada-language-r8-height) !important;

    min-height:
        var(--shada-language-r8-height) !important;

    max-height:
        var(--shada-language-r8-height) !important;

    margin: 0 !important;
    padding: 0 !important;

    overflow: visible !important;
    transform: none !important;

    z-index: 13000 !important;
}

html body
.container-header
.container-topbar
#shada-language-selector-138
> .shada-language-selector__toggle,

html body
.container-header
.container-topbar
#shada-language-selector-138
> .shada-language-selector__menu {
    box-sizing: border-box !important;

    width:
        var(--shada-language-r8-width) !important;

    min-width:
        var(--shada-language-r8-width) !important;

    max-width:
        var(--shada-language-r8-width) !important;

    height:
        var(--shada-language-r8-height) !important;

    min-height:
        var(--shada-language-r8-height) !important;

    max-height:
        var(--shada-language-r8-height) !important;

    margin: 0 !important;
    padding: 0 !important;

    border:
        1.5px solid
        rgba(0, 132, 137, 0.68) !important;

    border-radius:
        var(--shada-language-r8-radius) !important;

    background: #ffffff !important;
    transform: none !important;
}

html body
.container-header
.container-topbar
#shada-language-selector-138
> .shada-language-selector__toggle {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    gap: 5px !important;
    padding: 0 6px !important;

    overflow: hidden !important;

    box-shadow:
        0 0 0 2px
        rgba(0, 132, 137, 0.08) !important;
}

html body
.container-header
.container-topbar
#shada-language-selector-138
> .shada-language-selector__menu {
    position: absolute !important;

    top: 40px !important;
    right: 0 !important;
    bottom: auto !important;
    left: auto !important;

    overflow: hidden !important;

    box-shadow:
        0 6px 13px
        rgba(17, 59, 62, 0.15) !important;

    z-index: 14000 !important;
}

html body
.container-header
.container-topbar
#shada-language-selector-138
> .shada-language-selector__menu[hidden] {
    display: none !important;
}

html body
.container-header
.container-topbar
#shada-language-selector-138
> .shada-language-selector__menu
> li {
    box-sizing: border-box !important;

    display: block !important;

    width: 100% !important;
    height: 100% !important;

    margin: 0 !important;
    padding: 0 !important;

    list-style: none !important;
}

html body
.container-header
.container-topbar
#shada-language-selector-138
> .shada-language-selector__menu
> li
> a {
    box-sizing: border-box !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    gap: 5px !important;

    width: 100% !important;
    height: 100% !important;

    margin: 0 !important;
    padding: 0 6px !important;

    border: 0 !important;
    border-radius: 8px !important;

    background: #ffffff !important;

    text-decoration: none !important;
    white-space: nowrap !important;
}

html body
.container-header
#shada-language-selector-138
.shada-language-selector__current,

html body
.container-header
#shada-language-selector-138
.shada-language-selector__label,

html body
.container-header
#shada-language-selector-138
.shada-language-selector__item,

html body
.container-header
#shada-language-selector-138
.shada-language-selector__item
span {
    font-size: 13px !important;
    font-weight: 700 !important;
    line-height: 1 !important;
}

html body
.container-header
#shada-language-selector-138
img {
    display: block !important;

    box-sizing: border-box !important;

    flex: 0 0 23px !important;

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

    height: 15px !important;
    min-height: 15px !important;
    max-height: 15px !important;

    margin: 0 !important;
    padding: 0 !important;

    object-fit: cover !important;

    border-radius: 2px !important;
}

/* Narrow-screen English-logo scaling. */

@media (max-width: 600px) {

    html:not([lang^="fa"])
    body
    .container-header
    .shada-header-logo--en
    img {
        width:
            clamp(
                110px,
                36vw,
                140px
            ) !important;

        min-width:
            clamp(
                110px,
                36vw,
                140px
            ) !important;

        max-width:
            clamp(
                110px,
                36vw,
                140px
            ) !important;

        max-height: 56px !important;
    }
}

/* SHADA-HEADER-CONTROLS-R8 END */

/* SHADA-HEADER-REFINEMENT-R9D START */

/*
 * Final approved dimensions:
 *
 * Phone:
 *   186px × 50px
 *   text and icon 20px
 *
 * Language selector:
 *   108px × 31px
 *   text 12px
 *   flag 20px × 13px
 *
 * Vertical separation:
 *   10px
 */

/* Header utility grid. */

html body
.container-header
.container-topbar {
    grid-template-columns:
        minmax(0, 1fr)
        186px !important;

    grid-template-rows:
        50px
        31px !important;

    column-gap: 12px !important;
    row-gap: 10px !important;

    align-items: center !important;
    align-content: center !important;

    box-sizing: border-box !important;

    width: 100% !important;
    min-height: 103px !important;
    height: auto !important;

    margin: 0 !important;

    padding:
        6px
        clamp(8px, 2.5vw, 32px) !important;

    direction: ltr !important;
    overflow: visible !important;
}

/* Selector opening must not enlarge the header. */

html body
.container-header
.container-topbar:has(
    #shada-language-selector-138
    > .shada-language-selector__menu:not([hidden])
),

html body
.container-header
.container-topbar:has(
    #shada-language-selector-138
    .shada-language-selector__toggle[
        aria-expanded="true"
    ]
) {
    grid-template-rows:
        50px
        31px !important;

    row-gap: 10px !important;
    min-height: 103px !important;
    padding-bottom: 6px !important;
}

/*
 * English logo:
 * render the verified SVG directly on the English
 * home link rather than relying on its hidden image.
 */

html[lang^="en"]
body
.container-header
.container-topbar
#mod-custom121
.shada-header-logo--en,

html[lang^="en"]
body
.container-header
.container-topbar
.shada-header-logo--en {
    display: block !important;

    grid-column: 1 !important;
    grid-row: 1 / 3 !important;

    justify-self: start !important;
    align-self: center !important;

    position: static !important;

    top: auto !important;
    right: auto !important;
    bottom: auto !important;
    left: auto !important;
    inset: auto !important;

    box-sizing: border-box !important;

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

    height: 72px !important;
    min-height: 72px !important;
    max-height: 72px !important;

    margin: 0 !important;
    padding: 0 !important;

    opacity: 1 !important;
    visibility: visible !important;

    background-image:
        url("/images/branding/Shada-Migration-Logo.svg") !important;

    background-position:
        left center !important;

    background-repeat:
        no-repeat !important;

    background-size:
        contain !important;

    clip: auto !important;
    clip-path: none !important;

    overflow: visible !important;
    transform: none !important;
    filter: none !important;

    z-index: 40 !important;
}

html[lang^="en"]
body
.container-header
.container-topbar
.shada-header-logo--en
img {
    display: none !important;
}

html[lang^="en"]
body
.container-header
.container-topbar
.shada-header-logo--fa {
    display: none !important;
}

html[lang^="fa"]
body
.container-header
.container-topbar
.shada-header-logo--en {
    display: none !important;
}

/* Phone container. */

html body
.container-header
.container-topbar
.shada-header-actions {
    grid-column: 2 !important;
    grid-row: 1 !important;

    justify-self: end !important;
    align-self: center !important;

    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;

    position: static !important;

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

    height: 50px !important;
    min-height: 50px !important;
    max-height: 50px !important;

    margin: 0 !important;
    padding: 0 !important;

    transform: none !important;
}

/* Phone button. */

html body
.container-header
.container-topbar
.shada-phone-button {
    box-sizing: border-box !important;

    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    gap: 7px !important;

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

    height: 50px !important;
    min-height: 50px !important;
    max-height: 50px !important;

    margin: 0 !important;
    padding: 6px 10px !important;

    border-radius: 13px !important;

    font-size: 20px !important;
    font-weight: 700 !important;
    line-height: 1 !important;

    direction: ltr !important;
    unicode-bidi: isolate !important;

    white-space: nowrap !important;
    transform: none !important;
}

html body
.container-header
.container-topbar
.shada-phone-button
*,

html body
.container-header
.container-topbar
.shada-phone-icon,

html body
.container-header
.container-topbar
.shada-phone-number {
    font-size: 20px !important;
    font-weight: 700 !important;
    line-height: 1 !important;
}

/* Language selector container. */

html body
.container-header
.container-topbar
#shada-language-selector-138 {
    --shada-language-r9d-width: 108px;
    --shada-language-r9d-height: 31px;
    --shada-language-r9d-radius: 9px;

    grid-column: 2 !important;
    grid-row: 2 !important;

    justify-self: end !important;
    align-self: center !important;

    position: relative !important;
    inset: auto !important;

    box-sizing: border-box !important;

    width:
        var(--shada-language-r9d-width) !important;

    min-width:
        var(--shada-language-r9d-width) !important;

    max-width:
        var(--shada-language-r9d-width) !important;

    height:
        var(--shada-language-r9d-height) !important;

    min-height:
        var(--shada-language-r9d-height) !important;

    max-height:
        var(--shada-language-r9d-height) !important;

    margin: 0 !important;
    padding: 0 !important;

    overflow: visible !important;
    transform: none !important;

    z-index: 13000 !important;
}

/* Active and alternative language controls. */

html body
.container-header
#shada-language-selector-138
> .shada-language-selector__toggle,

html body
.container-header
#shada-language-selector-138
> .shada-language-selector__menu {
    box-sizing: border-box !important;

    width:
        var(--shada-language-r9d-width) !important;

    min-width:
        var(--shada-language-r9d-width) !important;

    max-width:
        var(--shada-language-r9d-width) !important;

    height:
        var(--shada-language-r9d-height) !important;

    min-height:
        var(--shada-language-r9d-height) !important;

    max-height:
        var(--shada-language-r9d-height) !important;

    margin: 0 !important;
    padding: 0 !important;

    border-radius:
        var(--shada-language-r9d-radius) !important;
}

html body
.container-header
#shada-language-selector-138
> .shada-language-selector__toggle {
    gap: 4px !important;
    padding: 0 5px !important;
}

html body
.container-header
#shada-language-selector-138
> .shada-language-selector__menu {
    position: absolute !important;

    top: 36px !important;
    right: 0 !important;
    bottom: auto !important;
    left: auto !important;

    z-index: 14000 !important;
}

html body
.container-header
#shada-language-selector-138
> .shada-language-selector__menu
> li
> a {
    gap: 4px !important;
    padding: 0 5px !important;
}

/* Language text. */

html body
.container-header
#shada-language-selector-138
.shada-language-selector__current,

html body
.container-header
#shada-language-selector-138
.shada-language-selector__label,

html body
.container-header
#shada-language-selector-138
.shada-language-selector__item,

html body
.container-header
#shada-language-selector-138
.shada-language-selector__item
span {
    font-size: 12px !important;
    font-weight: 700 !important;
    line-height: 1 !important;
}

/* Flags. */

html body
.container-header
#shada-language-selector-138
img {
    display: block !important;

    flex: 0 0 20px !important;

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

    height: 13px !important;
    min-height: 13px !important;
    max-height: 13px !important;

    margin: 0 !important;
    padding: 0 !important;

    object-fit: cover !important;
}

/* Mobile English logo. */

@media (max-width: 600px) {

    html[lang^="en"]
    body
    .container-header
    .container-topbar
    .shada-header-logo--en {
        width:
            clamp(108px, 35vw, 140px) !important;

        min-width:
            clamp(108px, 35vw, 140px) !important;

        max-width:
            clamp(108px, 35vw, 140px) !important;

        height: 58px !important;
        min-height: 58px !important;
        max-height: 58px !important;
    }
}

/* SHADA-HEADER-REFINEMENT-R9D END */

/* SHADA-HEADER-BALANCE-R9E START */

/*
 * Final hierarchy:
 *
 * Logo unchanged.
 * Phone 174px × 45px.
 * Phone text and icon 18px.
 * Language selector remains 108px × 31px.
 * Physical vertical gap 8px.
 */

html body
.container-header
.container-topbar {
    grid-template-columns:
        minmax(0, 1fr)
        174px !important;

    grid-template-rows:
        45px
        31px !important;

    row-gap: 8px !important;

    min-height: 96px !important;
}

/* Prevent selector opening from changing header height. */

html body
.container-header
.container-topbar:has(
    #shada-language-selector-138
    > .shada-language-selector__menu:not([hidden])
),

html body
.container-header
.container-topbar:has(
    #shada-language-selector-138
    .shada-language-selector__toggle[
        aria-expanded="true"
    ]
) {
    grid-template-rows:
        45px
        31px !important;

    row-gap: 8px !important;
    min-height: 96px !important;
}

/* Phone container. */

html body
.container-header
.container-topbar
.shada-header-actions {
    width: 174px !important;
    min-width: 174px !important;
    max-width: 174px !important;

    height: 45px !important;
    min-height: 45px !important;
    max-height: 45px !important;
}

/* Phone button. */

html body
.container-header
.container-topbar
.shada-phone-button {
    width: 174px !important;
    min-width: 174px !important;
    max-width: 174px !important;

    height: 45px !important;
    min-height: 45px !important;
    max-height: 45px !important;

    padding: 6px 9px !important;

    border-radius: 12px !important;

    font-size: 18px !important;
    line-height: 1 !important;

    gap: 6px !important;
}

/* Phone number and icon. */

html body
.container-header
.container-topbar
.shada-phone-button
*,

html body
.container-header
.container-topbar
.shada-phone-icon,

html body
.container-header
.container-topbar
.shada-phone-number {
    font-size: 18px !important;
    line-height: 1 !important;
}

/* SHADA-HEADER-BALANCE-R9E END */

/* SHADA-LANGUAGE-ALIGN-MOBILE-R10 START */

/*
 * Selector:
 *   96px × 28px
 *   text 11px
 *   flag 18px × 12px
 *
 * Desktop:
 *   centred directly beneath the phone control.
 *
 * Mobile:
 *   opened menu is displayed as a viewport-level
 *   portal to prevent header clipping.
 */

html body
.container-header
.container-topbar,

html body
.container-header
.container-topbar
> *,

html body
.container-header
.container-topbar
#mod-languages138 {
    overflow: visible !important;
}

/* Compact selector dimensions at all screen sizes. */

html body
.container-header
#shada-language-selector-138 {
    --shada-language-r10-width: 96px;
    --shada-language-r10-height: 28px;
    --shada-language-r10-radius: 8px;

    box-sizing: border-box !important;

    width:
        var(--shada-language-r10-width) !important;

    min-width:
        var(--shada-language-r10-width) !important;

    max-width:
        var(--shada-language-r10-width) !important;

    height:
        var(--shada-language-r10-height) !important;

    min-height:
        var(--shada-language-r10-height) !important;

    max-height:
        var(--shada-language-r10-height) !important;

    margin: 0 !important;
    padding: 0 !important;

    overflow: visible !important;

    z-index: 15000 !important;
}

html body
.container-header
#shada-language-selector-138
> .shada-language-selector__toggle {
    box-sizing: border-box !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    gap: 4px !important;

    width:
        var(--shada-language-r10-width) !important;

    min-width:
        var(--shada-language-r10-width) !important;

    max-width:
        var(--shada-language-r10-width) !important;

    height:
        var(--shada-language-r10-height) !important;

    min-height:
        var(--shada-language-r10-height) !important;

    max-height:
        var(--shada-language-r10-height) !important;

    margin: 0 !important;
    padding: 0 5px !important;

    border-radius:
        var(--shada-language-r10-radius) !important;

    font-size: 11px !important;
    line-height: 1 !important;

    overflow: hidden !important;
}

html body
.container-header
#shada-language-selector-138
.shada-language-selector__current,

html body
.container-header
#shada-language-selector-138
.shada-language-selector__label,

html body
.container-header
#shada-language-selector-138
.shada-language-selector__item,

html body
.container-header
#shada-language-selector-138
.shada-language-selector__item
span {
    font-size: 11px !important;
    font-weight: 700 !important;
    line-height: 1 !important;
}

/* Matching compact flags. */

html body
.container-header
#shada-language-selector-138
img,

body
> .shada-language-selector__menu--portal
img {
    display: block !important;

    flex: 0 0 18px !important;

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

    height: 12px !important;
    min-height: 12px !important;
    max-height: 12px !important;

    margin: 0 !important;
    padding: 0 !important;

    object-fit: cover !important;

    border-radius: 2px !important;
}

/*
 * Centre the selector beneath the phone column
 * on desktop and larger tablet layouts.
 */

@media (min-width: 992px) {

    html body
    .container-header
    .container-topbar
    #shada-language-selector-138 {
        grid-column: 2 !important;
        grid-row: 2 !important;

        justify-self: center !important;
        align-self: center !important;
    }
}

/*
 * Retain its top-right mobile-header location while
 * using the smaller dimensions.
 */

@media (max-width: 991.98px) {

    html body
    .container-header
    .container-topbar
    #shada-language-selector-138 {
        justify-self: end !important;
        align-self: center !important;
    }
}

/*
 * Mobile portal menu.
 *
 * The script moves the opened UL directly under BODY.
 * It therefore cannot be clipped by the white header,
 * module wrappers, or the teal mobile navigation.
 */

body
> .shada-language-selector__menu--portal {
    box-sizing: border-box !important;

    display: block !important;

    position: fixed !important;

    right: auto !important;
    bottom: auto !important;

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

    height: auto !important;
    min-height: 28px !important;
    max-height: none !important;

    margin: 0 !important;
    padding: 0 !important;

    border:
        1.5px solid
        rgba(0, 132, 137, 0.72) !important;

    border-radius: 8px !important;

    background: #ffffff !important;

    overflow: visible !important;

    opacity: 1 !important;
    visibility: visible !important;

    pointer-events: auto !important;

    box-shadow:
        0 8px 22px
        rgba(15, 65, 68, 0.22) !important;

    transform: none !important;

    z-index: 2147483000 !important;
}

body
> .shada-language-selector__menu--portal[hidden] {
    display: none !important;
}

body
> .shada-language-selector__menu--portal
> li {
    box-sizing: border-box !important;

    display: block !important;

    width: 100% !important;
    height: 28px !important;

    margin: 0 !important;
    padding: 0 !important;

    list-style: none !important;
}

body
> .shada-language-selector__menu--portal
> li
> a {
    box-sizing: border-box !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    gap: 4px !important;

    width: 100% !important;
    height: 28px !important;

    margin: 0 !important;
    padding: 0 5px !important;

    border: 0 !important;
    border-radius: 7px !important;

    background: #ffffff !important;

    color: #087d82 !important;

    font-size: 11px !important;
    font-weight: 700 !important;
    line-height: 1 !important;

    text-align: center !important;
    text-decoration: none !important;
    white-space: nowrap !important;

    pointer-events: auto !important;
}

body
> .shada-language-selector__menu--portal
> li
> a:hover,

body
> .shada-language-selector__menu--portal
> li
> a:focus {
    background:
        rgba(0, 132, 137, 0.08) !important;
}

/* SHADA-LANGUAGE-ALIGN-MOBILE-R10 END */

/* SHADA-MOBILE-BRANDING-R16 START */

/*
 * Mobile-only Persian branding, based on the former live header:
 * large centred wording with the Shada bird/S on the physical right.
 * Desktop begins at 601px and is intentionally untouched.
 */
@media (max-width: 600px) {
    html[lang^="fa"] body
    .container-header
    .container-topbar {
        min-height: 122px !important;
        padding: 14px 12px !important;
        grid-template-columns: minmax(0, 1fr) !important;
        justify-items: center !important;
        align-items: center !important;
    }

    html[lang^="fa"] body
    .container-header
    .container-topbar
    #mod-custom121,

    html[lang^="fa"] body
    .container-header
    .shada-site-header,

    html[lang^="fa"] body
    .container-header
    .shada-site-header-inner {
        box-sizing: border-box !important;
        width: 100% !important;
        max-width: none !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    html[lang^="fa"] body
    .container-header
    .container-topbar
    #mod-custom121 {
        grid-column: 1 / -1 !important;
        justify-self: stretch !important;
    }

    html[lang^="fa"] body
    .container-header
    .shada-site-header-inner {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
    }

    html[lang^="fa"] body
    .container-header
    .shada-header-logo--fa {
        box-sizing: border-box !important;
        display: flex !important;
        flex-direction: row !important;
        align-items: center !important;
        justify-content: center !important;
        gap: clamp(10px, 3.2vw, 16px) !important;

        width: 100% !important;
        max-width: 370px !important;
        min-width: 0 !important;

        margin: 0 auto !important;
        padding: 0 !important;

        direction: ltr !important;
        text-align: center !important;
        transform: none !important;
    }

    html[lang^="fa"] body
    .container-header
    .shada-header-logo--fa
    .shada-header-logo-fa__text {
        order: 1 !important;
        display: block !important;
        flex: 0 1 auto !important;

        margin: 0 !important;
        padding: 0 !important;

        color: #087f83 !important;
        font-family: "ShadaIRANSans", Arial, sans-serif !important;
        font-size: clamp(22px, 6.4vw, 28px) !important;
        font-weight: 700 !important;
        line-height: 1.25 !important;

        direction: rtl !important;
        text-align: center !important;
        white-space: nowrap !important;
    }

    html[lang^="fa"] body
    .container-header
    .shada-header-logo--fa
    .shada-header-logo-fa__icon {
        order: 2 !important;
        display: block !important;
        flex: 0 0 clamp(62px, 17vw, 72px) !important;

        width: clamp(62px, 17vw, 72px) !important;
        min-width: clamp(62px, 17vw, 72px) !important;
        max-width: clamp(62px, 17vw, 72px) !important;

        height: clamp(62px, 17vw, 72px) !important;
        min-height: clamp(62px, 17vw, 72px) !important;
        max-height: clamp(62px, 17vw, 72px) !important;

        margin: 0 !important;
        padding: 0 !important;

        object-fit: contain !important;
        transform: none !important;
    }
}

/* SHADA-MOBILE-BRANDING-R16 END */

/* SHADA-MOBILE-HEADER-R20 START */

/*
 * This rule lives in the established R8 asset, which is present
 * in the rendered page. It affects only screens below 992px.
 */
@media (max-width: 991.98px) {

    html[lang^="fa"] body
    .container-header
    .container-topbar.container-topbar {
        position: relative !important;
        min-height: 122px !important;
        overflow: visible !important;
    }

    html[lang^="fa"] body
    .container-header
    .container-topbar.container-topbar
    .shada-site-header,
    html[lang^="fa"] body
    .container-header
    .container-topbar.container-topbar
    .shada-site-header-inner {
        position: static !important;
    }

    /* Full-width physical positioning, independent of RTL flow. */
    html[lang^="fa"] body
    .container-header
    .container-topbar.container-topbar
    .shada-header-logo.shada-header-logo--fa {
        box-sizing: border-box !important;

        position: absolute !important;
        inset: 0 !important;
        top: 0 !important;
        right: 0 !important;
        bottom: 0 !important;
        left: 0 !important;

        display: block !important;
        width: 100% !important;
        min-width: 0 !important;
        max-width: none !important;
        height: 100% !important;

        margin: 0 !important;
        padding: 0 !important;

        direction: ltr !important;
        transform: none !important;
        overflow: visible !important;
        z-index: 40 !important;
    }

    /* Persian wording is centred in the left/middle brand area. */
    html[lang^="fa"] body
    .container-header
    .container-topbar.container-topbar
    .shada-header-logo.shada-header-logo--fa
    .shada-header-logo-fa__text.shada-header-logo-fa__text {
        box-sizing: border-box !important;

        position: absolute !important;
        top: 50% !important;
        right: auto !important;
        bottom: auto !important;
        left: 41% !important;

        display: block !important;
        width: max-content !important;
        min-width: 0 !important;
        max-width: calc(100vw - 150px) !important;

        margin: 0 !important;
        padding: 0 !important;

        color: #087f83 !important;
        -webkit-text-fill-color: #087f83 !important;

        font-family:
            "ShadaIRANSans",
            Arial,
            sans-serif !important;

        font-size: clamp(18px, 5vw, 42px) !important;
        font-weight: 700 !important;
        line-height: 1.2 !important;

        direction: rtl !important;
        text-align: center !important;
        white-space: nowrap !important;

        float: none !important;
        translate: none !important;
        transform: translate(-50%, -50%) !important;
    }

    /* The S is anchored to the physical right of the viewport. */
    html[lang^="fa"] body
    .container-header
    .container-topbar.container-topbar
    .shada-header-logo.shada-header-logo--fa
    .shada-header-logo-fa__icon.shada-header-logo-fa__icon {
        box-sizing: border-box !important;

        position: absolute !important;
        top: 50% !important;
        right: clamp(20px, 6vw, 60px) !important;
        bottom: auto !important;
        left: auto !important;

        display: block !important;
        width: clamp(64px, 16vw, 126px) !important;
        min-width: clamp(64px, 16vw, 126px) !important;
        max-width: clamp(64px, 16vw, 126px) !important;
        height: clamp(64px, 16vw, 126px) !important;
        min-height: clamp(64px, 16vw, 126px) !important;
        max-height: clamp(64px, 16vw, 126px) !important;

        margin: 0 !important;
        padding: 0 !important;

        float: none !important;
        translate: none !important;
        transform: translateY(-50%) !important;
        object-fit: contain !important;
    }

    /* Retain the close-button clearance using higher specificity. */
    html body
    .shada-mobile-menu-drawer.shada-mobile-menu-drawer {
        position: fixed !important;
        padding-top: 18px !important;
    }

    html body
    .shada-mobile-menu-drawer.shada-mobile-menu-drawer
    .shada-mobile-menu-close.shada-mobile-menu-close {
        position: absolute !important;
        top: 18px !important;
        right: 18px !important;
        left: auto !important;
        margin: 0 !important;
        z-index: 30 !important;
    }

    html body
    .shada-mobile-menu-drawer.shada-mobile-menu-drawer
    .shada-mobile-language-switcher.shada-mobile-language-switcher {
        box-sizing: border-box !important;
        position: relative !important;
        width: 100% !important;
        margin: 76px auto 16px !important;
        clear: both !important;
        z-index: 5 !important;
    }
}

/* SHADA-MOBILE-HEADER-R20 END */

/* SHADA-PERSIAN-DESKTOP-MENU-R23 START */

/*
 * Retain the compact English desktop dropdown proportions while giving the
 * Persian dropdown a very light blue-grey surface and English-style row
 * separators. Persian RTL alignment and single-line labels remain unchanged.
 */
@media (min-width: 992px) {

    html[lang^="fa"] body
    .container-header
    .container-nav > .mod-menu
    .mod-menu__sub {
        box-sizing: border-box !important;
        width: max-content !important;
        min-width: 16rem !important;
        max-width: none !important;
        background-color: #f7fafb !important;
    }

    html[lang^="fa"] body
    .container-header
    .container-nav > .mod-menu
    .mod-menu__sub > li {
        margin: 0 !important;
        border-bottom: 1px solid #e1eaec !important;
    }

    html[lang^="fa"] body
    .container-header
    .container-nav > .mod-menu
    .mod-menu__sub > li:last-child {
        border-bottom: 0 !important;
    }

    html[lang^="fa"] body
    .container-header
    .container-nav > .mod-menu
    .mod-menu__sub > li > a {
        display: block !important;
        box-sizing: border-box !important;
        padding: .5rem 1rem !important;
        font-size: 1rem !important;
        font-weight: 400 !important;
        line-height: 1.5 !important;
        text-align: right !important;
        white-space: nowrap !important;
        background-color: #f7fafb !important;
    }

    html[lang^="fa"] body
    .container-header
    .container-nav > .mod-menu
    .mod-menu__sub > li > a:hover,
    html[lang^="fa"] body
    .container-header
    .container-nav > .mod-menu
    .mod-menu__sub > li > a:focus-visible {
        background-color: #edf4f5 !important;
    }
}

/* SHADA-PERSIAN-DESKTOP-MENU-R23 END */

/* SHADA-FRONTEND-STABILITY-R4 START */

/*
 * Keep the desktop navigation within its full-width header parent. This
 * overrides the audited legacy 100vw rule without global overflow clipping.
 */
@media (min-width: 992px) {

    html body
    .container-header
    .container-nav {
        box-sizing: border-box !important;
        width: 100% !important;
        max-width: 100% !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
    }
}

/*
 * .site-grid is a wrapper below body in the live Cassiopeia markup. Target
 * its direct footer child, neutralise the legacy 100vw margins and span the
 * existing full-start/full-end grid lines.
 */
html body
.site-grid >
.grid-child.container-bottom-a:has(.shada-global-footer) {
    box-sizing: border-box !important;
    grid-column: full-start / full-end !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
}

/* SHADA-FRONTEND-STABILITY-R4 END */
