/* Unified website header */
@font-face {
    font-family: Vazirmatn;
    src: url("/fonts/Vazirmatn/Vazirmatn-Regular.ttf") format("truetype");
    font-display: swap;
    font-style: normal;
    font-weight: 400;
}

:root {
    --website-sidebar-width: 320px;
    --website-sidebar-gap: 5px;
    --website-shell-max-width: 1350px;
    --website-header-desktop-height: 130px;
    --website-page-space-y: 16px;
    --website-breadcrumb-row-height: 23px;
    --website-breadcrumb-gap: 8px;
    --website-breadcrumb-font-size: 15px;
    --website-breadcrumb-line-height: 1.5;
    --website-page-title-height: 55px;
    --website-page-title-font-size: 18px;
    --website-header-icon-size: 36px;
    --website-header-add-post-height: 35px;
    --website-header-categories-font-size: 14px;
    --website-mobile-content-space-y: 8px;
}

.main_website_header,
.website_sidebar {
    box-sizing: border-box;
    font-family: Vazirmatn, sans-serif;
}

.main_website_header *,
.main_website_header *::before,
.main_website_header *::after,
.website_sidebar *,
.website_sidebar *::before,
.website_sidebar *::after {
    box-sizing: border-box;
}

.main_website_header :is(a, button, span, strong, small),
.website_sidebar :is(a, button, span, strong, small) {
    font-family: Vazirmatn, sans-serif !important;
}

.main_website_header :is(ul, ol),
.website_sidebar :is(ul, ol) {
    margin: 0;
    padding: 0;
}

.header_content_container,
.header_categories_container {
    box-sizing: border-box;
    margin-inline: auto;
    padding-inline: 12px;
    width: 100%;
}

/*
 * One title component for every page that uses the shared website shell.
 * Standard legacy title_panner headings inherit the same contract while
 * status/payment variants keep their intentional specialized appearance.
 */
:is(
    .website-page-title,
    .website_page_content h1.title_panner:not(.flex_title_panner):not(.flex_dpan):not(.green_bg):not(.green_red):not(.green_green)
) {
    align-items: center;
    background: #fff;
    box-sizing: border-box;
    color: #002940 !important;
    display: flex;
    font-family: Vazirmatn, sans-serif !important;
    font-size: var(--website-page-title-font-size) !important;
    font-weight: 700 !important;
    line-height: 1.4 !important;
    margin: 0 0 15px !important;
    min-height: var(--website-page-title-height);
    padding: 10px 15px !important;
    text-align: start !important;
    width: 100%;
}

body.conversations_page :is(.chat-page-header, .website-page-title) {
    box-shadow: none !important;
    filter: none !important;
    text-shadow: none !important;
}

/*
 * Shared breadcrumbs
 * Keep every legacy and 2024 breadcrumb visually aligned with the current
 * listing-details breadcrumb: neutral text, slash separators and a home arrow.
 */
:is(.breadcrumbs-links, .breadcrumbs-links-2024) {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    font-family: Vazirmatn !important;
    font-size: var(--website-breadcrumb-font-size) !important;
    font-weight: 400 !important;
    gap: 0;
    list-style: none;
    margin: 15px 0 0 !important;
    padding: 0 !important;
    pointer-events: auto;
    width: 100% !important;
}

:is(.breadcrumbs-links, .breadcrumbs-links-2024) > li {
    align-items: center;
    background: transparent !important;
    color: #595959 !important;
    font-family: Vazirmatn !important;
    font-size: var(--website-breadcrumb-font-size) !important;
    font-weight: 400 !important;
    display: inline-flex;
    height: auto !important;
    justify-content: flex-start;
    margin: 0 !important;
    max-height: none !important;
    min-height: 0 !important;
    min-width: 0;
    padding: 0 !important;
    pointer-events: auto;
    position: static;
}

:is(.breadcrumbs-links, .breadcrumbs-links-2024) > li:not(:last-child)::after {
    border: 0 !important;
    color: #595959;
    content: "/" !important;
    height: auto;
    margin-inline: 14px;
    position: static !important;
    width: auto;
}

:is(.breadcrumbs-links, .breadcrumbs-links-2024) > li:last-child::after {
    border: 0 !important;
    content: none !important;
    margin: 0 !important;
    position: static !important;
}

:is(.breadcrumbs-links, .breadcrumbs-links-2024) > li:first-child {
    margin-inline-end: 0 !important;
    padding: 0 !important;
}

:is(.breadcrumbs-links, .breadcrumbs-links-2024) > li > a,
:is(.breadcrumbs-links, .breadcrumbs-links-2024) > li > span {
    color: #595959 !important;
    display: inline-flex;
    font-family: Vazirmatn !important;
    font-size: var(--website-breadcrumb-font-size) !important;
    font-weight: 400 !important;
    line-height: var(--website-breadcrumb-line-height) !important;
    min-height: 0 !important;
    text-align: start;
    text-decoration: none;
    white-space: nowrap;
    width: auto !important;
}

:is(.breadcrumbs-links, .breadcrumbs-links-2024) > li:first-child > a {
    align-items: center;
    color: #000 !important;
    display: inline-flex;
    font-size: 0 !important;
    font-weight: 400;
    gap: 8px;
}

:is(.breadcrumbs-links, .breadcrumbs-links-2024) > li:first-child > a > img,
:is(.breadcrumbs-links, .breadcrumbs-links-2024) > li:first-child > a > i {
    display: none !important;
}

:is(.breadcrumbs-links, .breadcrumbs-links-2024) > li:first-child > a::before {
    background: url("/assets/icons/right-arrow.svg") center / contain no-repeat;
    content: "";
    display: inline-block;
    flex: 0 0 15px;
    height: 15px;
    width: 15px;
}

:is(.breadcrumbs-links, .breadcrumbs-links-2024) > li:first-child > a::after {
    color: #000;
    content: "Home";
    font-size: var(--website-breadcrumb-font-size);
    font-weight: 400;
}

html[lang="ar"] :is(.breadcrumbs-links, .breadcrumbs-links-2024) > li:first-child > a::after {
    content: "الرئيسية";
}

:is(.breadcrumbs-links, .breadcrumbs-links-2024) > li > a:hover {
    color: #1692d8 !important;
    text-decoration: underline !important;
    text-decoration-color: #1692d8 !important;
    text-underline-offset: 2px;
}

:is(.breadcrumbs-links, .breadcrumbs-links-2024) > li:first-child > a:hover::after {
    color: #1692d8 !important;
    text-decoration: underline !important;
    text-decoration-color: #1692d8 !important;
    text-underline-offset: 2px;
}

.website_page_content :is(.shared-breadcrumb, .chat-page-breadcrumb) {
    margin: 0 !important;
}

/* Normalize breadcrumbs that previously had page-specific blog/chat styles. */
:is(.website_page_breadcrumb, .website_page_content) :is(.blog-show-breadcrumbs, .chat-page-breadcrumb > ol) {
    align-items: center !important;
    display: flex !important;
    flex-wrap: wrap !important;
    font-family: Vazirmatn, sans-serif !important;
    font-size: var(--website-breadcrumb-font-size) !important;
    font-weight: 400 !important;
    gap: 0 !important;
    height: auto !important;
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
    width: 100% !important;
}

:is(.website_page_breadcrumb, .website_page_content) :is(.blog-show-breadcrumbs, .chat-page-breadcrumb > ol) > li {
    align-items: center !important;
    color: #595959 !important;
    display: inline-flex !important;
    font-family: Vazirmatn, sans-serif !important;
    font-size: var(--website-breadcrumb-font-size) !important;
    font-weight: 400 !important;
    gap: 0 !important;
    height: auto !important;
    margin: 0 !important;
    padding: 0 !important;
}

:is(.website_page_breadcrumb, .website_page_content) :is(.blog-show-breadcrumbs, .chat-page-breadcrumb > ol) > li::before {
    content: none !important;
    margin: 0 !important;
}

:is(.website_page_breadcrumb, .website_page_content) :is(.blog-show-breadcrumbs, .chat-page-breadcrumb > ol) > li:not(:last-child)::after {
    color: #595959 !important;
    content: "/" !important;
    margin-inline: 14px !important;
}

:is(.website_page_breadcrumb, .website_page_content) :is(.blog-show-breadcrumbs, .chat-page-breadcrumb > ol) > li:last-child::after {
    content: "" !important;
    margin: 0 !important;
}

:is(.website_page_breadcrumb, .website_page_content) :is(.blog-show-breadcrumbs, .chat-page-breadcrumb > ol) > li:first-child {
    margin-inline-end: 0 !important;
}

:is(.website_page_breadcrumb, .website_page_content) :is(.blog-show-breadcrumbs, .chat-page-breadcrumb > ol) > li > :is(a, span),
:is(.website_page_breadcrumb, .website_page_content) .chat-page-breadcrumb > ol > li[aria-current="page"] {
    color: #595959 !important;
    font-family: Vazirmatn, sans-serif !important;
    font-size: var(--website-breadcrumb-font-size) !important;
    font-weight: 400 !important;
    line-height: var(--website-breadcrumb-line-height) !important;
    text-decoration: none !important;
    white-space: nowrap;
}

:is(.website_page_breadcrumb, .website_page_content) :is(.blog-show-breadcrumbs, .chat-page-breadcrumb > ol) > li:first-child > a {
    align-items: center;
    color: #000 !important;
    display: inline-flex;
    font-size: 0 !important;
    gap: 8px;
}

:is(.website_page_breadcrumb, .website_page_content) :is(.blog-show-breadcrumbs, .chat-page-breadcrumb > ol) > li:first-child > a > :is(img, i) {
    display: none !important;
}

:is(.website_page_breadcrumb, .website_page_content) :is(.blog-show-breadcrumbs, .chat-page-breadcrumb > ol) > li:first-child > a::before {
    background: url("/assets/icons/right-arrow.svg") center / contain no-repeat;
    content: "";
    display: inline-block;
    flex: 0 0 15px;
    height: 15px;
    width: 15px;
}

:is(.website_page_breadcrumb, .website_page_content) :is(.blog-show-breadcrumbs, .chat-page-breadcrumb > ol) > li:first-child > a::after {
    color: #000;
    content: "Home";
    font-size: var(--website-breadcrumb-font-size);
    font-weight: 400;
}

html[lang="ar"] :is(.website_page_breadcrumb, .website_page_content) :is(.blog-show-breadcrumbs, .chat-page-breadcrumb > ol) > li:first-child > a::after {
    content: "الرئيسية";
}

:is(.website_page_breadcrumb, .website_page_content) :is(.blog-show-breadcrumbs, .chat-page-breadcrumb > ol) > li > a:hover {
    color: #1692d8 !important;
    text-decoration: underline !important;
    text-decoration-color: #1692d8 !important;
    text-underline-offset: 2px;
}

:is(.website_page_breadcrumb, .website_page_content) :is(.blog-show-breadcrumbs, .chat-page-breadcrumb > ol) > li:first-child > a:hover::after {
    color: #1692d8 !important;
    text-decoration: underline !important;
    text-decoration-color: #1692d8 !important;
    text-underline-offset: 2px;
}

/* Compatibility with the cached classic listing breadcrumb. */
.classic-breadcrumb {
    align-items: center;
    color: #595959 !important;
    display: flex;
    flex-wrap: wrap;
    font-family: Vazirmatn, sans-serif !important;
    font-size: var(--website-breadcrumb-font-size) !important;
    font-weight: 400 !important;
    gap: 0 !important;
    line-height: var(--website-breadcrumb-line-height) !important;
}

.classic-breadcrumb > a,
.classic-breadcrumb > span {
    color: #595959 !important;
    font-family: Vazirmatn, sans-serif !important;
    font-size: var(--website-breadcrumb-font-size) !important;
    font-weight: 400 !important;
    line-height: var(--website-breadcrumb-line-height) !important;
    text-decoration: none;
}

.classic-breadcrumb > a:first-child {
    align-items: center;
    color: #000 !important;
    display: inline-flex;
    gap: 8px;
}

.classic-breadcrumb > a:first-child::before {
    background: url("/assets/icons/right-arrow.svg") center / contain no-repeat;
    content: "";
    display: inline-block;
    flex: 0 0 15px;
    height: 15px;
    width: 15px;
}

.classic-breadcrumb > span:first-of-type {
    font-size: 0 !important;
    margin-inline: 14px;
}

.classic-breadcrumb > span:first-of-type::before {
    color: #595959;
    content: "/";
    font-size: var(--website-breadcrumb-font-size);
}

.classic-breadcrumb > a:hover {
    color: #1692d8 !important;
    text-decoration: underline !important;
    text-decoration-color: #1692d8 !important;
    text-underline-offset: 2px;
}

/*
 * Shared top search
 * The legacy, home and blog templates use different class names for the same
 * search row. Keep all of them full-width and visually consistent.
 */
:is(.search_tabbo_form, .search_form_container, .blog-show-search, .classic-search) {
    align-items: stretch;
    display: flex !important;
    gap: 8px;
    height: 43px !important;
    max-width: none !important;
    width: 100% !important;
}

:is(.search_tabbo_form, .search_form_container, .blog-show-search, .classic-search) input {
    background: #fff !important;
    border: 0.5px solid #f3f2ef !important;
    border-radius: 5px !important;
    box-sizing: border-box;
    flex: 1 1 auto !important;
    height: 43px !important;
    min-width: 0;
    width: 100% !important;
}

:is(.search_tabbo_form, .search_form_container, .blog-show-search, .classic-search) input:focus,
:is(.search_tabbo_form, .search_form_container, .blog-show-search, .classic-search) input:focus-visible,
:is(.search_tabbo_form, .search_form_container, .blog-show-search, .classic-search) input:active {
    border: 0.5px solid #f3f2ef !important;
    box-shadow: none !important;
    outline: none !important;
}

:is(.search_tabbo_form, .search_form_container, .blog-show-search, .classic-search) button {
    align-items: center;
    background: #1692d8 !important;
    border: 0 !important;
    border-radius: 5px;
    color: #fff !important;
    display: inline-flex;
    flex: 0 0 102px !important;
    gap: 8px;
    height: 43px !important;
    inset: auto !important;
    justify-content: center;
    line-height: 1 !important;
    padding: 0 16px !important;
    position: static !important;
    width: 102px !important;
}

:is(.search_tabbo_form, .search_form_container, .blog-show-search, .classic-search) button i,
:is(.search_tabbo_form, .search_form_container, .blog-show-search, .classic-search) button img {
    color: inherit;
    flex: 0 0 auto;
}

.classic-search,
.classic-search input,
.classic-search button {
    font-family: Vazirmatn, sans-serif !important;
}

.classic-search input {
    font-size: 15px;
    padding-inline: 14px !important;
}

.classic-search button {
    font-size: 15px;
    margin: 0 !important;
}

.classic-search button i {
    margin: 0 !important;
}

.main_website_header {
    background: #fff;
    border: 0;
    color: #002940;
    padding: 0 0 0;
    position: sticky !important;
    top: 0;
    transform: none !important;
    transition: none !important;
    z-index: 1000;
}

.scrolling .main_website_header {
    background: #fff;
    padding: 0;
    position: sticky !important;
    top: 0;
    transform: none !important;
    transition: none !important;
}

.main_website_header
    + .website_sidebar
    + .website_sidebar_backdrop
    + .web_header_space,
.main_website_header + .web_header_space,
.scrolling
    .main_website_header
    + .website_sidebar
    + .website_sidebar_backdrop
    + .web_header_space,
.scrolling .main_website_header + .web_header_space {
    display: none !important;
    height: 0 !important;
}

.main_website_header_inner,
.header_brand_group,
.header_location_group {
    align-items: flex-end;
    display: flex;
}

.header_actions_group .header_actions_top {
    align-items: flex-end;
    display: flex;
    justify-content: end;
}

.header_actions_bottom {
    align-items: center;
    display: flex;
}

.main_website_header_inner {
    justify-content: space-between;
    min-height: 85px !important;
}

.header_brand_group {
    gap: 14px;
}

.header_location_group {
    align-items: center;
    gap: 10px;
    white-space: nowrap;
}

.header_country,
.header_city_dropdown button {
    font-size: 15px !important;
    font-weight: 400 !important;
    line-height: 22px !important;
}

.header_country,
.header_city_dropdown {
    align-items: center;
    height: 22px !important;
}

.header_country {
    color: #002940;
    display: flex;
    gap: 5px;
    text-decoration: none;
}

.header_country img {
    border: 1px solid #d7d7d7;
    border-radius: 50%;
    flex: 0 0 18px;
    object-fit: cover;
}

.header_location_separator {
    align-self: center;
    background: #b9b9b9;
    display: block;
    flex: 0 0 1px;
    height: 18px;
    width: 1px;
}

.header_city_dropdown button {
    align-items: center;
    background: transparent;
    border: 0;
    color: #002940;
    direction: ltr;
    display: inline-flex;
    gap: 5px;
    height: 22px;
    padding: 0 !important;
}

.header_city_dropdown .dropdown-toggle::before,
.header_city_dropdown .dropdown-toggle::after {
    content: none !important;
    display: none !important;
}

.header_city_arrow {
    border-left: 3px solid transparent;
    border-right: 3px solid transparent;
    border-top: 5px solid currentColor;
    display: block;
    flex: 0 0 auto;
    height: 0;
    order: 1;
    width: 0;
}

.header_city_label {
    direction: rtl;
    order: 2;
    unicode-bidi: isolate;
}

html[dir="ltr"] .header_city_label {
    direction: ltr;
    order: 1;
}

html[dir="ltr"] .header_city_arrow {
    order: 2;
}

.header_city_dropdown {
    display: flex;
}

.header_city_dropdown .dropdown-menu {
    max-height: 360px;
    overflow-y: auto;
    text-align: start;
}

.header_actions_group {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.header_actions_top {
    font-size: 18px !important;
    gap: 18px;
    justify-content: flex-start;
}

.header_help_link,
.header_language_link {
    color: #002940;
    text-decoration: none;
}

.header_help_link {
    align-items: center;
    display: flex;
    gap: 10px;
}

.header_help_link i {
    font-size: 27px;
}

.header_actions_separator {
    background: #b9b9b9;
    height: 33px;
    width: 1px;
}

.header_actions_bottom {
    gap: 4px;
    justify-content: flex-start;
}

.main_website_header .header_action_icon {
    align-items: center;
    background: transparent;
    border: 0;
    border-radius: 50%;
    color: #002940;
    display: inline-flex;
    flex: 0 0 var(--website-header-icon-size) !important;
    font-size: 27px !important;
    height: var(--website-header-icon-size) !important;
    justify-content: center;
    padding: 0 !important;
    position: relative;
    text-decoration: none;
    transition: background-color 0.2s ease;
    width: var(--website-header-icon-size) !important;
}

.header_actions_bottom .header_action_icon:hover,
.header_actions_bottom .header_action_icon:focus-visible {
    background-color: #c1f82863;
}

.notifications_list > [data-bs-toggle="dropdown"]::before,
.notifications_list > [data-bs-toggle="dropdown"]::after,
.notifications_list > [data-notifications-toggle]::before,
.notifications_list > [data-notifications-toggle]::after {
    border: 0 !important;
    content: none !important;
    display: none !important;
    height: 0 !important;
    margin: 0 !important;
    width: 0 !important;
}

.main_website_header .notifications_list {
    max-width: none;
    position: relative;
}

.main_website_header .notifications_list > .header_notifications_list {
    background: #f3f2ef;
    border: 1px solid #dedede;
    border-radius: 8px;
    box-shadow: 0 12px 30px rgba(0, 41, 64, 0.18);
    display: none;
    list-style: none;
    margin: 0;
    max-height: min(412px, calc(100vh - 150px));
    min-width: min(360px, calc(100vw - 24px));
    overflow-x: hidden;
    overflow-y: auto;
    padding: 15px;
    position: absolute;
    top: calc(100% + 10px) !important;
    transform: none !important;
    width: min(360px, calc(100vw - 24px));
    z-index: 1300;
}

.main_website_header .notifications_list > .header_notifications_list.show {
    display: block;
}

.main_website_header .header_notifications_list > .append_after {
    display: none;
}

.main_website_header .header_notifications_list > .noti_li {
    list-style: none;
    margin: 0 0 12px !important;
    padding: 0 !important;
    width: 100%;
}

.main_website_header .header_notifications_list > .noti_li:last-of-type {
    margin-bottom: 0 !important;
}

.main_website_header .header_notifications_list .noti_time {
    color: #002940;
    display: block;
    font-size: 11px;
    font-weight: 500;
    line-height: 1.4;
    padding: 0 4px 4px;
    text-align: end;
}

.main_website_header .header_notifications_list .noti_div {
    background: #fff;
    border-radius: 8px;
    cursor: pointer;
    margin: 0;
    min-width: 0;
    padding: 28px 14px 10px;
    position: relative;
    width: 100%;
}

.main_website_header .header_notifications_list .notification_logo {
    border-radius: 4px;
    height: 30px;
    inset-inline-start: 12px;
    object-fit: contain;
    position: absolute;
    top: -8px;
    width: 30px;
}

.main_website_header .header_notifications_list .noti_title {
    color: #002940;
    font-size: 15px;
    font-weight: 600;
    line-height: 1.5;
    margin: 0 0 4px;
    overflow-wrap: anywhere;
    text-align: start;
}

.main_website_header .header_notifications_list .noti_budy {
    color: #002940;
    font-size: 13px;
    line-height: 1.6;
    margin: 0;
    overflow-wrap: anywhere;
    text-align: start;
}

.main_website_header .header_notifications_list .notification_image {
    background-position: center !important;
    background-repeat: no-repeat !important;
    background-size: cover !important;
    border-radius: 6px;
    height: 150px;
    margin: 8px 0 0;
    max-width: 100%;
    width: 100%;
}

.main_website_header .header_notifications_list .notification_link {
    color: #1692d8 !important;
    display: block;
    font-size: 13px;
    margin-top: 7px;
    text-align: end;
}

.main_website_header .header_notifications_list .no_notifications {
    background: #fff;
    border-radius: 8px;
    color: #002940;
    display: block;
    font-size: 15px;
    padding: 24px 12px;
    text-align: center;
}

.main_website_header .header_notifications_list > .noti_show_all {
    background: #002940;
    border-radius: 6px;
    bottom: -15px;
    list-style: none;
    margin: 0 !important;
    padding: 0;
    position: sticky;
    width: 100%;
}

.main_website_header .header_notifications_list > .noti_show_all .show_all {
    background: transparent;
    color: #fff !important;
    display: block;
    font-size: 14px;
    line-height: 36px;
    min-width: 0;
    padding: 0 12px;
    text-align: center;
    text-decoration: none;
    width: 100%;
}

html[dir="rtl"] .main_website_header .notifications_list > .header_notifications_list {
    left: 0 !important;
    right: auto !important;
}

html[dir="ltr"] .main_website_header .notifications_list > .header_notifications_list {
    left: auto !important;
    right: 0 !important;
}

.header_action_icon .fa-heart {
    color: #8eb429;
}

.header_action_icon_marked::after,
.header_notification_dot {
    background: #8eb429;
    border-radius: 50%;
    content: "";
    height: 6px;
    position: absolute;
    right: -1px;
    top: -1px;
    width: 6px;
}

.main_website_header .header_add_post {
    align-items: center;
    background: #8eb429;
    border: 0;
    border-radius: 7px;
    color: #fff;
    display: inline-flex;
    font-size: 20px !important;
    gap: 7px;
    height: var(--website-header-add-post-height) !important;
    max-height: var(--website-header-add-post-height) !important;
    min-height: var(--website-header-add-post-height) !important;
    margin-inline-start: 12px;
    padding: 5px 12px !important;
    text-decoration: none;
}

.main_website_header .header_add_post i {
    font-size: 18px !important;
}

.main_website_header .website_header_logo {
    aspect-ratio: 800 / 259;
    background-image: url("/assets/images/6abbo-logo2024.webp") !important;
    background-position: center !important;
    background-repeat: no-repeat !important;
    background-size: contain !important;
    display: block;
    flex: 0 0 auto;
    height: auto;
    margin: 0;
    transition: none !important;
    width: 170px;
}

.scrolling .main_website_header .website_header_logo {
    aspect-ratio: 800 / 259;
    background-image: url("/assets/images/6abbo-logo2024.webp") !important;
    background-position: center !important;
    background-repeat: no-repeat !important;
    background-size: contain !important;
    height: auto;
    transform: none !important;
    transition: none !important;
    width: 170px;
}

.header_mobile_inner {
    display: none;
}

.header_categories_nav {
    background: #002940;
    margin-top: 12px;
    width: 100%;
}

.header_categories_scroller {
    overflow-x: auto;
    overscroll-behavior-inline: contain;
    scrollbar-width: none;
    width: 100%;
}

.header_categories_scroller::-webkit-scrollbar {
    display: none;
}

.header_categories_list {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    gap: 34px;
    justify-content: space-between;
    list-style: none;
    margin: 0;
    min-width: 100%;
    padding: 0 0px;
    width: max-content;
}

.header_categories_item {
    flex: 0 0 auto;
}

.header_categories_link {
    border-bottom: 2px solid transparent;
    color: #fff;
    display: block;
    font-size: var(--website-header-categories-font-size) !important;
    font-weight: 500 !important;
    line-height: 20px !important;
    padding: 6px 0 5px !important;
    text-decoration: none;
    white-space: nowrap;
}

.header_categories_link:hover,
.header_categories_link:focus-visible,
.header_categories_link.active {
    border-bottom-color: #fff;
    color: #fff;
}

.website_sidebar {
    background: #f3f2ef;
    color: #252525;
    font-size: 12px !important;
    font-weight: 400 !important;
    inset-inline-start: 0;
    line-height: 1.5 !important;
    overflow-y: auto;
    position: fixed;
    width: var(--website-sidebar-width);
    z-index: 1080;
}

.website_sidebar_inner {
    display: flex;
    flex-direction: column;
    min-height: 100%;
    padding: 12px 6px 0px;
}

.website_sidebar_close {
    align-items: center;
    background: transparent;
    border: 0;
    color: #002940;
    display: none;
    font-size: 20px !important;
    font-weight: 400 !important;
    height: 38px;
    justify-content: center;
    left: 8px;
    padding: 0;
    position: absolute;
    top: 8px;
    width: 38px;
    z-index: 2;
}

html[dir="ltr"] .website_sidebar_close {
    left: auto;
    right: 8px;
}

.website_sidebar_profile_card {
    background: #fff;
    border-radius: 5px;
    overflow: hidden;
}

.website_sidebar_profile {
    align-items: center;
    color: #252525;
    display: flex;
    font-size: 12px !important;
    font-weight: 400 !important;
    gap: 7px;
    line-height: 1.5 !important;
    min-height: 46px;
    padding: 6px 9px;
    text-decoration: none;
}

.website_sidebar_avatar_wrap {
    flex: 0 0 32px;
    height: 32px;
    position: relative;
    width: 32px;
}

.website_sidebar_avatar {
    background: #e4e7e9;
    border-radius: 50%;
    height: 32px;
    object-fit: cover;
    width: 32px;
}

.website_sidebar_edit {
    align-items: center;
    background: #002940;
    border-radius: 50%;
    bottom: -1px;
    color: #fff;
    display: flex;
    font-size: 6px;
    height: 12px;
    justify-content: center;
    position: absolute;
    right: -1px;
    width: 12px;
}

html[dir="ltr"] .website_sidebar_edit {
    left: auto;
    right: -1px;
}

.website_sidebar_profile_text {
    display: flex;
    flex: 1;
    flex-direction: column;
    font-size: 16px !important;
    font-weight: 400 !important;
    line-height: 1.5 !important;
    min-width: 0;
}

.website_sidebar_profile_text strong {
    font-size: 16px !important;
    font-weight: 400 !important;
    line-height: 1.5 !important;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.website_sidebar_profile_text small {
    color: #1692d8;
    font-size: 16px !important;
    font-weight: 400 !important;
    line-height: 1.5 !important;
}

.website_sidebar_refresh {
    color: #333;
    font-size: 10px;
}

.website_sidebar_navigation {
    background: #fff;
    border-radius: 5px;
    flex: 1;
    margin-top: 10px;
    overflow: hidden;
    padding-top: 18px;
}

.website_sidebar_list {
    list-style: none;
    margin: 0;
    padding: 0;
}

.website_sidebar_item {
    border-bottom: 1px solid #dcecf4;
}

.website_sidebar_item:last-child {
    border-bottom: 0;
}

.website_sidebar_item_section_start {
    margin-top: 29px;
}

.website_sidebar_link {
    align-items: center;
    background: #fff;
    border: 0;
    color: #252525;
    display: flex;
    font-size: 16px !important;
    font-weight: 400 !important;
    gap: 8px;
    line-height: 1.5 !important;
    min-height: 35px;
    padding: 4px 9px;
    text-align: start;
    text-decoration: none;
    transition: background-color 0.2s ease;
    width: 100%;
}

.website_sidebar_link > span {
    font-size: 16px !important;
    font-weight: 400 !important;
    line-height: 1.5 !important;
}

.website_sidebar_link:hover,
.website_sidebar_link:focus-visible {
    background: #eef8fd;
    color: #002940;
}

.website_sidebar_icon {
    flex: 0 0 22px;
    height: 22px;
    object-fit: contain;
    width: 22px;
}

.website_sidebar_backdrop {
    display: none;
}

@media (min-width: 1025px) {
    html {
        scrollbar-gutter: stable;
    }

    body.gridbody:has(> .website_page_shell) {
        display: flex !important;
        flex-direction: column;
        min-height: 100vh;
    }

    body.gridbody:has(> .website_page_shell) > .website_page_shell {
        flex: 1 0 auto;
    }

    body.gridbody:has(> .website_page_shell) > :is(
        .main_website_header,
        .website_main_footer,
        .d_app_new_banner_in_footer
    ) {
        flex: 0 0 auto;
    }

    .website_header_main_region,
    .website_main_footer,
    .d_app_new_banner_in_footer {
        box-sizing: border-box;
        margin-inline: 0;
        max-width: none;
        width: 100%;
    }

    .website_page_shell {
        align-items: start;
        box-sizing: border-box;
        display: flex;
        column-gap: var(--website-sidebar-gap);
        flex-wrap: wrap;
        margin-inline: auto;
        max-width: calc(
            var(--website-shell-max-width) +
            var(--website-sidebar-width) + var(--website-sidebar-gap) +
            var(--website-sidebar-width) + var(--website-sidebar-gap)
        );
        min-height: calc(100vh - var(--website-header-desktop-height));
        padding-block: var(--website-page-space-y);
        row-gap: var(--website-breadcrumb-gap);
        width: 100%;
    }

    .website_page_breadcrumb {
        align-items: center;
        box-sizing: border-box;
        display: flex;
        flex: 0 0 100%;
        min-height: var(--website-breadcrumb-row-height);
        min-width: 0;
        order: -2;
        padding-inline: calc(
            var(--website-sidebar-width) + var(--website-sidebar-gap) + 12px
        );
        width: 100%;
    }

    .website_page_breadcrumb > * {
        box-sizing: border-box;
        margin: 0 !important;
        max-width: none !important;
        width: 100% !important;
    }

    .website_page_breadcrumb :is(
        .breadcrumbs-links,
        .breadcrumbs-links-2024,
        .blog-show-breadcrumbs,
        .chat-page-breadcrumb > ol
    ) {
        margin: 0 !important;
    }

    .website_page_breadcrumb .post-details-breadcrumb,
    .website_page_breadcrumb .post-details-breadcrumb > .breadcrumbs-links {
        height: var(--website-breadcrumb-row-height) !important;
        min-height: var(--website-breadcrumb-row-height) !important;
        overflow: hidden !important;
    }

    .website_page_breadcrumb .post-details-breadcrumb > .breadcrumbs-links {
        flex-wrap: nowrap !important;
    }

    .website_page_breadcrumb .post-details-breadcrumb > .breadcrumbs-links > li {
        flex: 0 0 auto;
    }

    .website_page_breadcrumb .post-details-breadcrumb > .breadcrumbs-links > li:last-child {
        flex: 1 1 auto;
        min-width: 0;
        overflow: hidden;
    }

    .website_page_breadcrumb .post-details-breadcrumb > .breadcrumbs-links > li:last-child > span {
        display: block;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    /*
     * The shell stylesheet marks the document as pending in <head>. Hide the
     * breadcrumb's source node from the content flow until the synchronous
     * shell script moves it into the reserved row. This prevents first-paint
     * layout shifts between routes.
     */
    html.website-shell-pending .website_page_content :is(
        .shared-breadcrumb,
        .classic-breadcrumb,
        .breadcrumbs-links-2024,
        .breadcrumbs-links,
        .chat-page-breadcrumb,
        nav:has(> .blog-show-breadcrumbs)
    ) {
        height: 0 !important;
        margin: 0 !important;
        overflow: hidden !important;
        pointer-events: none !important;
        position: absolute !important;
        visibility: hidden !important;
    }

    /* Reserve the breadcrumb row before JavaScript relocates its content. */
    .website_page_shell::before {
        content: "";
        flex: 0 0 100%;
        min-height: var(--website-breadcrumb-row-height);
        order: -2;
        width: 100%;
    }

    .website_page_shell:has(> .website_page_breadcrumb)::before {
        display: none;
    }

    .website_page_shell::after {
        content: "";
        flex: 0 0 var(--website-sidebar-width);
        order: 1;
    }

    .website_header_main_region {
        padding-top: 0;
    }

    .header_content_container,
    .header_categories_container,
    .website_main_footer > .footer_container2,
    .d_app_new_banner_in_footer > .container {
        box-sizing: border-box;
        margin-inline: auto;
        max-width: var(--website-shell-max-width) !important;
        min-width: 0;
        padding-inline: 12px !important;
        width: calc(
            100% - var(--website-sidebar-width) - var(--website-sidebar-gap) -
                var(--website-sidebar-width) - var(--website-sidebar-gap)
        );
    }

    .website_page_shell > .website_page_layout {
        box-sizing: border-box;
        flex: 1 1 0;
        margin-inline: auto;
        max-width: var(--website-shell-max-width) !important;
        min-width: 0;
        order: 0;
        width: auto;
    }

    .website_page_content {
        box-sizing: border-box;
        margin-inline: auto;
        max-width: var(--website-shell-max-width) !important;
        min-width: 0;
        padding-inline: 12px !important;
        width: 100%;
    }

    /*
     * The shell owns the page's outer spacing. Only neutralize the first
     * Bootstrap row gutter; later rows keep each page's original spacing.
     */
    .website_page_content > :is(
        .container,
        .container-fluid,
        .container-sm,
        .container-md,
        .container-lg,
        .container-xl,
        .container-xxl
    ):first-child > .row:first-child,
    .website_page_content > #app:first-child > :is(
        .container,
        .container-fluid,
        .container-sm,
        .container-md,
        .container-lg,
        .container-xl,
        .container-xxl
    ):first-child > .row:first-child {
        margin-top: 0 !important;
    }

    .website_page_content > :is(
        .container,
        .container-fluid,
        .container-sm,
        .container-md,
        .container-lg,
        .container-xl,
        .container-xxl
    ):first-child > .row:first-child > :first-child,
    .website_page_content > #app:first-child > :is(
        .container,
        .container-fluid,
        .container-sm,
        .container-md,
        .container-lg,
        .container-xl,
        .container-xxl
    ):first-child > .row:first-child > :first-child {
        margin-top: 0 !important;
    }

    .website_page_content > :is(
        .container,
        .container-fluid,
        .container-sm,
        .container-md,
        .container-lg,
        .container-xl,
        .container-xxl
    ):first-child :is(.breadcrumbs-links, .breadcrumbs-links-2024):first-child {
        margin-top: 0;
    }

    .website_page_content > .container,
    .website_page_content > .container-fluid,
    .website_page_content > .container-sm,
    .website_page_content > .container-md,
    .website_page_content > .container-lg,
    .website_page_content > .container-xl,
    .website_page_content > .container-xxl,
    .website_page_content > #app > .container,
    .website_page_content > #app > .container-fluid,
    .website_page_content > #app > .container-sm,
    .website_page_content > #app > .container-md,
    .website_page_content > #app > .container-lg,
    .website_page_content > #app > .container-xl,
    .website_page_content > #app > .container-xxl {
        max-width: 100% !important;
        padding-inline: 0 !important;
    }

    .website_page_content > :is(
        .container,
        .container-fluid,
        .container-sm,
        .container-md,
        .container-lg,
        .container-xl,
        .container-xxl
    ):first-child,
    .website_page_content > #app:first-child > :is(
        .container,
        .container-fluid,
        .container-sm,
        .container-md,
        .container-lg,
        .container-xl,
        .container-xxl
    ):first-child {
        margin-top: 0 !important;
        padding-top: 0 !important;
    }

    .website_page_shell > .website_sidebar {
        align-self: start;
        bottom: auto;
        flex: 0 0 var(--website-sidebar-width);
        height: calc(
            100vh - var(--website-header-desktop-height) -
            var(--website-page-space-y) - var(--website-page-space-y) -
            var(--website-breadcrumb-row-height) - var(--website-breadcrumb-gap)
        );
        inset-inline-start: auto;
        max-height: calc(
            100vh - var(--website-header-desktop-height) -
            var(--website-page-space-y) - var(--website-page-space-y) -
            var(--website-breadcrumb-row-height) - var(--website-breadcrumb-gap)
        );
        min-width: 0;
        order: -1;
        position: sticky;
        top: calc(
            var(--website-header-desktop-height) + var(--website-page-space-y)
        );
        width: var(--website-sidebar-width);
        z-index: 900;
    }

    .website_sidebar_inner {
        padding-top: 0;
    }

    /*
     * Compatibility for pages still rendered from an older Blade cache.
     * These rules preserve the previous fixed-sidebar shell until the cached
     * view starts emitting .website_page_shell.
     */
    body > .website_page_layout {
        box-sizing: border-box;
        min-height: calc(100vh - var(--website-header-desktop-height));
        padding-block: var(--website-page-space-y);
        width: 100%;
    }

    body > .website_page_layout > .website_page_content {
        margin-inline: auto;
        max-width: var(--website-shell-max-width) !important;
        padding-inline: 12px !important;
        width: calc(
            100% - var(--website-sidebar-width) - var(--website-sidebar-gap) -
                var(--website-sidebar-width) - var(--website-sidebar-gap)
        );
    }

    body > .website_sidebar {
        bottom: 0;
        inset-inline-start: 0;
        max-height: none;
        position: fixed;
        top: calc(
            var(--website-header-desktop-height) + var(--website-page-space-y)
        );
        width: var(--website-sidebar-width);
        z-index: 900;
    }
}

@media (min-width: 1025px) and (max-width: 1400px) {
    .main_website_header .website_header_logo,
    .scrolling .main_website_header .website_header_logo {
        height: auto;
        width: 121px;
    }
}

@media (max-width: 1024px) {
    :is(
        .website-page-title,
        .website_page_content h1.title_panner:not(.flex_title_panner):not(.flex_dpan):not(.green_bg):not(.green_red):not(.green_green)
    ) {
        margin-bottom: 8px !important;
    }

    .website_page_shell {
        box-sizing: border-box;
        margin-top: 0 !important;
        padding-top: 0 !important;
    }

    .website_page_layout {
        margin-top: 0 !important;
        max-width: 100% !important;
        padding-inline: 0 !important;
        padding-top: 0 !important;
    }

    .website_page_content {
        box-sizing: border-box;
        margin-top: 0 !important;
        min-width: 0;
        padding-inline: 12px !important;
        padding-top: var(--website-mobile-content-space-y) !important;
        width: 100%;
    }

    .website_page_content > :is(.mobile_header_space, .web_header_space):first-child {
        display: none !important;
        height: 0 !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    .website_page_content > .container,
    .website_page_content > .container-fluid,
    .website_page_content > .container-sm,
    .website_page_content > .container-md,
    .website_page_content > .container-lg,
    .website_page_content > .container-xl,
    .website_page_content > .container-xxl,
    .website_page_content > #app > .container,
    .website_page_content > #app > .container-fluid,
    .website_page_content > #app > .container-sm,
    .website_page_content > #app > .container-md,
    .website_page_content > #app > .container-lg,
    .website_page_content > #app > .container-xl,
    .website_page_content > #app > .container-xxl {
        max-width: 100% !important;
        padding-inline: 0 !important;
    }

    .website_page_content :is(
        .breadcrumbs-links,
        .breadcrumbs-links-2024,
        .blog-show-breadcrumbs,
        .chat-page-breadcrumb > ol
    ),
    .website_page_content .classic-breadcrumb {
        margin-bottom: 8px !important;
        margin-top: 0 !important;
    }

    .header_desktop_inner {
        display: none !important;
    }

    .header_mobile_inner {
        align-items: center;
        display: flex !important;
        height: 72px !important;
        justify-content: space-between;
        padding: 0 12px !important;
    }

    .header_mobile_menu_button {
        align-items: stretch;
        background: transparent;
        border: 0;
        display: flex;
        flex: 0 0 46px !important;
        flex-direction: column;
        gap: 8px;
        justify-content: center;
        padding: 4px !important;
        width: 46px !important;
    }

    .header_mobile_menu_button span {
        background: #002940;
        border-radius: 2px;
        display: block;
        height: 3px;
        width: 100%;
    }

    .header_mobile_logo {
        align-items: center;
        display: flex;
        justify-content: center;
    }

    .header_mobile_logo img {
        display: block;
        height: auto;
        width: 132px !important;
    }

    .header_mobile_tools {
        align-items: center;
        display: flex;
        flex: 0 0 auto;
        gap: 18px;
    }

    .header_mobile_notification {
        align-items: center;
        background: transparent;
        border: 0;
        color: #002940;
        display: flex;
        font-size: 30px !important;
        justify-content: center;
        padding: 0 !important;
        text-decoration: none;
        position: relative;
    }

    .main_website_header .header_mobile_tools .notifications_list > .header_notifications_list {
        left: 12px !important;
        max-height: calc(100dvh - var(--notifications-menu-top, 112px) - 12px);
        max-width: none;
        min-width: 0;
        position: fixed;
        right: 12px !important;
        top: var(--notifications-menu-top, 112px) !important;
        width: auto;
    }

    .header_mobile_country,
    .header_mobile_country img {
        border-radius: 50%;
        display: block;
        height: 32px;
        width: 32px;
    }

    .header_mobile_country img {
        border: 1px solid #d7d7d7;
        object-fit: cover;
    }

    .header_categories_nav {
        margin-top: 0;
    }

    .header_categories_container {
        max-width: 100%;
        padding-inline: 12px;
    }

    .header_categories_list {
        gap: 24px;
    }

    .header_categories_link {
        font-size: 13px !important;
        padding-bottom: 6px !important;
        padding-top: 6px !important;
    }

    .main_website_header
        + .website_sidebar
        + .website_sidebar_backdrop
        + .web_header_space,
    .main_website_header + .web_header_space {
        display: none;
    }

    .website_sidebar {
        bottom: 0;
        box-shadow: 0 0 18px rgba(0, 41, 64, 0.2);
        max-width: 86vw;
        top: 0;
        transform: translateX(105%);
        transition: transform 0.25s ease;
        visibility: hidden;
        width: 290px;
        z-index: 1200;
    }

    html[dir="ltr"] .website_sidebar {
        transform: translateX(-105%);
    }

    .website_sidebar.is-open {
        transform: translateX(0);
        visibility: visible;
    }

    .website_sidebar_close {
        display: flex;
    }

    .website_sidebar_inner {
        padding-top: 46px;
    }

    .website_sidebar_backdrop {
        background: rgba(0, 0, 0, 0.3);
        border: 0;
        bottom: 0;
        display: block;
        inset-inline-start: 0;
        opacity: 0;
        pointer-events: none;
        position: fixed;
        top: 0;
        transition: opacity 0.25s ease;
        width: 100%;
        z-index: 1190;
    }

    .website_sidebar.is-open + .website_sidebar_backdrop {
        opacity: 1;
        pointer-events: auto;
    }

    body.website_sidebar_open {
        overflow: hidden;
    }
}
