/* =====================================================================================
   Athir shell (athir-shell.css) - loaded last in _AthirLayout.
   1. Unified font: Tajawal (SIL Open Font License 1.1, files in wwwroot/fonts/tajawal).
      The old family names used by the theme and site.css (Cairo-SemiBold, Rubik, Roboto,
      Montserrat) are mapped to the Tajawal files, so every existing rule shows Tajawal
      without editing the theme. Icon fonts (FontAwesome, feather, DXIcons) are untouched.
   2. Navigation menu: search, current page, collapsible rail saved in the aui_nav cookie.
   3. Branch switcher in the page header.
   ===================================================================================== */

/* ---------- 1. Tajawal font faces (Arabic + Latin subsets) ---------- */
@font-face { font-family: 'Tajawal'; font-style: normal; font-weight: 400; font-display: swap;
    src: url('../fonts/tajawal/tajawal-latin-400-normal.woff2') format('woff2'); unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
@font-face { font-family: 'Tajawal'; font-style: normal; font-weight: 400; font-display: swap;
    src: url('../fonts/tajawal/tajawal-arabic-400-normal.woff2') format('woff2'); unicode-range: U+0600-06FF,U+0750-077F,U+0870-088E,U+0890-0891,U+0897-08E1,U+08E3-08FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE70-FE74,U+FE76-FEFC; }
@font-face { font-family: 'Tajawal'; font-style: normal; font-weight: 500; font-display: swap;
    src: url('../fonts/tajawal/tajawal-latin-500-normal.woff2') format('woff2'); unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
@font-face { font-family: 'Tajawal'; font-style: normal; font-weight: 500; font-display: swap;
    src: url('../fonts/tajawal/tajawal-arabic-500-normal.woff2') format('woff2'); unicode-range: U+0600-06FF,U+0750-077F,U+0870-088E,U+0890-0891,U+0897-08E1,U+08E3-08FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE70-FE74,U+FE76-FEFC; }
@font-face { font-family: 'Tajawal'; font-style: normal; font-weight: 700; font-display: swap;
    src: url('../fonts/tajawal/tajawal-latin-700-normal.woff2') format('woff2'); unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
@font-face { font-family: 'Tajawal'; font-style: normal; font-weight: 700; font-display: swap;
    src: url('../fonts/tajawal/tajawal-arabic-700-normal.woff2') format('woff2'); unicode-range: U+0600-06FF,U+0750-077F,U+0870-088E,U+0890-0891,U+0897-08E1,U+08E3-08FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE70-FE74,U+FE76-FEFC; }
@font-face { font-family: 'Cairo-SemiBold'; font-style: normal; font-weight: 400; font-display: swap;
    src: url('../fonts/tajawal/tajawal-latin-400-normal.woff2') format('woff2'); unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
@font-face { font-family: 'Cairo-SemiBold'; font-style: normal; font-weight: 400; font-display: swap;
    src: url('../fonts/tajawal/tajawal-arabic-400-normal.woff2') format('woff2'); unicode-range: U+0600-06FF,U+0750-077F,U+0870-088E,U+0890-0891,U+0897-08E1,U+08E3-08FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE70-FE74,U+FE76-FEFC; }
@font-face { font-family: 'Cairo-SemiBold'; font-style: normal; font-weight: 500; font-display: swap;
    src: url('../fonts/tajawal/tajawal-latin-500-normal.woff2') format('woff2'); unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
@font-face { font-family: 'Cairo-SemiBold'; font-style: normal; font-weight: 500; font-display: swap;
    src: url('../fonts/tajawal/tajawal-arabic-500-normal.woff2') format('woff2'); unicode-range: U+0600-06FF,U+0750-077F,U+0870-088E,U+0890-0891,U+0897-08E1,U+08E3-08FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE70-FE74,U+FE76-FEFC; }
@font-face { font-family: 'Cairo-SemiBold'; font-style: normal; font-weight: 700; font-display: swap;
    src: url('../fonts/tajawal/tajawal-latin-700-normal.woff2') format('woff2'); unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
@font-face { font-family: 'Cairo-SemiBold'; font-style: normal; font-weight: 700; font-display: swap;
    src: url('../fonts/tajawal/tajawal-arabic-700-normal.woff2') format('woff2'); unicode-range: U+0600-06FF,U+0750-077F,U+0870-088E,U+0890-0891,U+0897-08E1,U+08E3-08FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE70-FE74,U+FE76-FEFC; }
@font-face { font-family: 'Rubik'; font-style: normal; font-weight: 400; font-display: swap;
    src: url('../fonts/tajawal/tajawal-latin-400-normal.woff2') format('woff2'); unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
@font-face { font-family: 'Rubik'; font-style: normal; font-weight: 400; font-display: swap;
    src: url('../fonts/tajawal/tajawal-arabic-400-normal.woff2') format('woff2'); unicode-range: U+0600-06FF,U+0750-077F,U+0870-088E,U+0890-0891,U+0897-08E1,U+08E3-08FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE70-FE74,U+FE76-FEFC; }
@font-face { font-family: 'Rubik'; font-style: normal; font-weight: 500; font-display: swap;
    src: url('../fonts/tajawal/tajawal-latin-500-normal.woff2') format('woff2'); unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
@font-face { font-family: 'Rubik'; font-style: normal; font-weight: 500; font-display: swap;
    src: url('../fonts/tajawal/tajawal-arabic-500-normal.woff2') format('woff2'); unicode-range: U+0600-06FF,U+0750-077F,U+0870-088E,U+0890-0891,U+0897-08E1,U+08E3-08FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE70-FE74,U+FE76-FEFC; }
@font-face { font-family: 'Rubik'; font-style: normal; font-weight: 700; font-display: swap;
    src: url('../fonts/tajawal/tajawal-latin-700-normal.woff2') format('woff2'); unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
@font-face { font-family: 'Rubik'; font-style: normal; font-weight: 700; font-display: swap;
    src: url('../fonts/tajawal/tajawal-arabic-700-normal.woff2') format('woff2'); unicode-range: U+0600-06FF,U+0750-077F,U+0870-088E,U+0890-0891,U+0897-08E1,U+08E3-08FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE70-FE74,U+FE76-FEFC; }
@font-face { font-family: 'Roboto'; font-style: normal; font-weight: 400; font-display: swap;
    src: url('../fonts/tajawal/tajawal-latin-400-normal.woff2') format('woff2'); unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
@font-face { font-family: 'Roboto'; font-style: normal; font-weight: 400; font-display: swap;
    src: url('../fonts/tajawal/tajawal-arabic-400-normal.woff2') format('woff2'); unicode-range: U+0600-06FF,U+0750-077F,U+0870-088E,U+0890-0891,U+0897-08E1,U+08E3-08FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE70-FE74,U+FE76-FEFC; }
@font-face { font-family: 'Roboto'; font-style: normal; font-weight: 500; font-display: swap;
    src: url('../fonts/tajawal/tajawal-latin-500-normal.woff2') format('woff2'); unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
@font-face { font-family: 'Roboto'; font-style: normal; font-weight: 500; font-display: swap;
    src: url('../fonts/tajawal/tajawal-arabic-500-normal.woff2') format('woff2'); unicode-range: U+0600-06FF,U+0750-077F,U+0870-088E,U+0890-0891,U+0897-08E1,U+08E3-08FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE70-FE74,U+FE76-FEFC; }
@font-face { font-family: 'Roboto'; font-style: normal; font-weight: 700; font-display: swap;
    src: url('../fonts/tajawal/tajawal-latin-700-normal.woff2') format('woff2'); unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
@font-face { font-family: 'Roboto'; font-style: normal; font-weight: 700; font-display: swap;
    src: url('../fonts/tajawal/tajawal-arabic-700-normal.woff2') format('woff2'); unicode-range: U+0600-06FF,U+0750-077F,U+0870-088E,U+0890-0891,U+0897-08E1,U+08E3-08FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE70-FE74,U+FE76-FEFC; }
@font-face { font-family: 'Montserrat'; font-style: normal; font-weight: 400; font-display: swap;
    src: url('../fonts/tajawal/tajawal-latin-400-normal.woff2') format('woff2'); unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
@font-face { font-family: 'Montserrat'; font-style: normal; font-weight: 400; font-display: swap;
    src: url('../fonts/tajawal/tajawal-arabic-400-normal.woff2') format('woff2'); unicode-range: U+0600-06FF,U+0750-077F,U+0870-088E,U+0890-0891,U+0897-08E1,U+08E3-08FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE70-FE74,U+FE76-FEFC; }
@font-face { font-family: 'Montserrat'; font-style: normal; font-weight: 500; font-display: swap;
    src: url('../fonts/tajawal/tajawal-latin-500-normal.woff2') format('woff2'); unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
@font-face { font-family: 'Montserrat'; font-style: normal; font-weight: 500; font-display: swap;
    src: url('../fonts/tajawal/tajawal-arabic-500-normal.woff2') format('woff2'); unicode-range: U+0600-06FF,U+0750-077F,U+0870-088E,U+0890-0891,U+0897-08E1,U+08E3-08FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE70-FE74,U+FE76-FEFC; }
@font-face { font-family: 'Montserrat'; font-style: normal; font-weight: 700; font-display: swap;
    src: url('../fonts/tajawal/tajawal-latin-700-normal.woff2') format('woff2'); unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
@font-face { font-family: 'Montserrat'; font-style: normal; font-weight: 700; font-display: swap;
    src: url('../fonts/tajawal/tajawal-arabic-700-normal.woff2') format('woff2'); unicode-range: U+0600-06FF,U+0750-077F,U+0870-088E,U+0890-0891,U+0897-08E1,U+08E3-08FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE70-FE74,U+FE76-FEFC; }

/* ---------- 2. Unified font on DevExtreme widgets (icons keep their own DXIcons font) ---------- */
.dx-widget, .dx-widget input, .dx-widget textarea, .dx-widget button,
.dx-overlay-wrapper, .dx-overlay-wrapper input, .dx-overlay-wrapper textarea {
    font-family: 'Tajawal', 'Segoe UI', Tahoma, sans-serif;
}

/* ---------- 3. Sidebar additions: menu search + collapse button ---------- */
.aui-nav-search {
    position: relative;
    margin: 0 20px 12px;
}
.aui-nav-search .aui-nav-search-btn {
    position: absolute;
    inset-inline-start: 0;
    top: 0;
    width: 40px;
    height: 40px;
    border: 0;
    background: transparent;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #5A6576;
    padding: 0;
    cursor: pointer;
}
.aui-nav-search .aui-nav-search-btn svg { width: 16px; height: 16px; }
.aui-nav-search input {
    width: 100%;
    height: 40px;
    border: 1px solid #CBD4E0;
    border-radius: 10px;
    background: #F3F5F8;
    padding-inline-start: 38px;
    padding-inline-end: 34px;
    font-size: 13px;
    color: #17212F;
    outline: none;
}
.aui-nav-search input:focus { border-color: #1D5C96; background: #FFFFFF; box-shadow: 0 0 0 3px #E8F0F8; }
.aui-nav-search input::-webkit-search-cancel-button { display: none; }
.aui-nav-search .aui-nav-kbd {
    position: absolute;
    inset-inline-end: 10px;
    top: 10px;
    min-width: 20px;
    height: 20px;
    border: 1px solid #CBD4E0;
    border-radius: 5px;
    font-size: 11px;
    line-height: 18px;
    text-align: center;
    color: #5A6576;
    background: #FFFFFF;
    pointer-events: none;
}
.aui-nav-search input:focus ~ .aui-nav-kbd,
.aui-nav-search input:not(:placeholder-shown) ~ .aui-nav-kbd { display: none; }
.aui-nav-empty {
    margin: 4px 20px 0;
    padding: 10px 12px;
    font-size: 13px;
    color: #5A6576;
    background: #F3F5F8;
    border-radius: 8px;
}
.aui-nav-hidden { display: none !important; }

.aui-nav-collapse {
    display: none;
    align-items: center;
    gap: 10px;
    width: calc(100% - 40px);
    margin: 8px 20px 12px;
    height: 40px;
    padding: 0 14px;
    border: 1px solid #E3E8EF;
    border-radius: 10px;
    background: #FFFFFF;
    color: #33404F;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
}
.aui-nav-collapse:hover { background: #F3F5F8; }
.aui-nav-collapse svg { width: 16px; height: 16px; flex: none; }

/* Expanded menu: ignore any flyout position left on a submenu (submenus are position: relative here) */
body:not(.aui-nav-collapsed) #pageWrapper header.main-nav .main-navbar .nav-menu > li > .menu-content { top: auto !important; }

/* User avatar under the logo: always a true circle (theme forces width only via .img-90) */
#pageWrapper header.main-nav .sidebar-user img {
    width: 90px !important;
    height: 90px !important;
    object-fit: cover;
    -webkit-transition: width .25s ease, height .25s ease, border-width .25s ease;
    transition: width .25s ease, height .25s ease, border-width .25s ease;
}

/* Current page inside the menu */
#pageWrapper header.main-nav .main-navbar .nav-menu .nav-submenu li a.aui-current {
    color: #1D5C96 !important;
    font-weight: 700;
    background: #E8F0F8;
    border-radius: 8px;
}

/* ---------- 4. Desktop (>= 992px): full-height column, collapse button, rail mode ---------- */
@media (min-width: 992px) {
    #pageWrapper.compact-wrapper .page-body-wrapper header.main-nav {
        display: flex;
        flex-direction: column;
        height: calc(100vh - 83px);
        -webkit-transition: width .25s ease;
        transition: width .25s ease;
    }
    #pageWrapper.compact-wrapper .page-body-wrapper header.main-nav > .sidebar-user,
    #pageWrapper.compact-wrapper .page-body-wrapper header.main-nav > .aui-nav-search,
    #pageWrapper.compact-wrapper .page-body-wrapper header.main-nav > .aui-nav-empty,
    #pageWrapper.compact-wrapper .page-body-wrapper header.main-nav > .aui-nav-collapse { flex: none; }
    #pageWrapper.compact-wrapper .page-body-wrapper header.main-nav > nav {
        flex: 1 1 auto;
        min-height: 0;
        display: flex;
        flex-direction: column;
    }
    #pageWrapper.compact-wrapper .page-body-wrapper header.main-nav > nav > .main-navbar,
    #pageWrapper.compact-wrapper .page-body-wrapper header.main-nav > nav > .main-navbar > #mainnav {
        flex: 1 1 auto;
        min-height: 0;
        display: flex;
        flex-direction: column;
    }
    #pageWrapper.compact-wrapper .page-body-wrapper header.main-nav .main-navbar .nav-menu {
        height: auto !important;
        flex: 1 1 auto;
        min-height: 0;
    }
    #pageWrapper.compact-wrapper .page-body-wrapper header.main-nav .sidebar-user {
        padding: 18px 20px;
        margin-bottom: 12px;
    }
    #pageWrapper.compact-wrapper .page-body-wrapper header.main-nav .sidebar-user .badge-bottom { display: none; }
    .aui-nav-collapse { display: flex; }

    /* ----- Rail (collapsed) ----- */
    body.aui-nav-collapsed #pageWrapper.compact-wrapper .page-body-wrapper header.main-nav {
        width: 76px;
        -webkit-transform: none !important;
                transform: none !important;
        opacity: 1;
        visibility: visible;
    }
    body.aui-nav-collapsed #pageWrapper.compact-wrapper .page-body-wrapper .page-body { margin-left: 76px; }
    body.aui-nav-collapsed #pageWrapper.compact-wrapper .page-body-wrapper footer { margin-left: 76px; }
    body.rtl.aui-nav-collapsed #pageWrapper.compact-wrapper .page-body-wrapper .page-body,
    body.rtl.aui-nav-collapsed #pageWrapper.compact-wrapper .page-body-wrapper footer {
        margin-left: unset;
        margin-right: 76px;
    }

    body.aui-nav-collapsed #pageWrapper header.main-nav .sidebar-user { padding: 14px 0; text-align: center; }
    body.aui-nav-collapsed #pageWrapper header.main-nav .sidebar-user h6,
    body.aui-nav-collapsed #pageWrapper header.main-nav .sidebar-user p,
    body.aui-nav-collapsed #pageWrapper header.main-nav .sidebar-user .setting-primary,
    body.aui-nav-collapsed #pageWrapper header.main-nav .sidebar-user .badge-bottom { display: none; }
    body.aui-nav-collapsed #pageWrapper header.main-nav .sidebar-user img {
        width: 44px !important;
        height: 44px !important;
        border-width: 3px;
    }

    body.aui-nav-collapsed #pageWrapper header.main-nav .aui-nav-search { margin: 0 18px 10px; }
    body.aui-nav-collapsed #pageWrapper header.main-nav .aui-nav-search input,
    body.aui-nav-collapsed #pageWrapper header.main-nav .aui-nav-search .aui-nav-kbd,
    body.aui-nav-collapsed #pageWrapper header.main-nav .aui-nav-empty { display: none; }
    body.aui-nav-collapsed #pageWrapper header.main-nav .aui-nav-search .aui-nav-search-btn {
        position: static;
        border: 1px solid #CBD4E0;
        border-radius: 10px;
        background: #F3F5F8;
    }

    body.aui-nav-collapsed #pageWrapper header.main-nav .main-navbar .nav-menu { overflow-x: hidden; }
    body.aui-nav-collapsed #pageWrapper header.main-nav .main-navbar .nav-menu > li { padding: 0 14px; }
    body.aui-nav-collapsed #pageWrapper header.main-nav .main-navbar .nav-menu > li.sidebar-main-title { display: none; }
    body.aui-nav-collapsed #pageWrapper header.main-nav .main-navbar .nav-menu > li > a.menu-title {
        display: flex;
        justify-content: center;
        padding: 11px 0;
    }
    body.aui-nav-collapsed #pageWrapper header.main-nav .main-navbar .nav-menu > li > a.menu-title > span,
    body.aui-nav-collapsed #pageWrapper header.main-nav .main-navbar .nav-menu > li > a.menu-title .according-menu { display: none !important; }
    body.aui-nav-collapsed #pageWrapper header.main-nav .main-navbar .nav-menu > li > a.menu-title svg {
        margin: 0 !important;
        float: none !important;
        width: 18px;
        height: 18px;
    }

    /* submenus never open inline in rail mode, they open as a flyout on hover */
    body.aui-nav-collapsed #pageWrapper header.main-nav .main-navbar .nav-menu > li > .menu-content { display: none !important; }
    body.aui-nav-collapsed #pageWrapper header.main-nav .main-navbar .nav-menu > li.aui-flyout-open > .menu-content {
        display: block !important;
        position: fixed !important;
        inset-inline-start: 75px;
        width: 250px !important;
        max-height: calc(100vh - 110px);
        overflow-y: auto;
        background: #FFFFFF;
        border: 1px solid #E3E8EF;
        border-radius: 12px;
        box-shadow: 0 16px 36px rgba(23, 33, 47, .16);
        padding: 6px !important;
        z-index: 30;
    }
    body.aui-nav-collapsed #pageWrapper header.main-nav .main-navbar .nav-menu > li > .menu-content::before {
        content: attr(data-title);
        display: block;
        padding: 8px 10px 8px;
        margin-bottom: 4px;
        border-bottom: 1px solid #E3E8EF;
        font-size: 13px;
        font-weight: 700;
        color: #17212F;
    }
    body.aui-nav-collapsed #pageWrapper header.main-nav .main-navbar .nav-menu > li > .menu-content > li > a {
        padding: 8px 10px !important;
        border-radius: 8px;
        white-space: normal;
    }
    body.aui-nav-collapsed #pageWrapper header.main-nav .main-navbar .nav-menu > li > .menu-content > li > a:hover { background: #F3F5F8; }
    body.aui-nav-collapsed #pageWrapper header.main-nav .main-navbar .nav-menu > li > .menu-content > li > a::after { display: none; }

    body.aui-nav-collapsed #pageWrapper header.main-nav .aui-nav-collapse {
        width: 40px;
        margin: 8px auto 12px;
        padding: 0;
        justify-content: center;
    }
    body.aui-nav-collapsed #pageWrapper header.main-nav .aui-nav-collapse span { display: none; }
}

/* ---------- 5. Mobile (< 992px): the theme keeps its own show / hide behaviour ---------- */
@media (max-width: 991.98px) {
    .aui-nav-collapse { display: none !important; }
    #pageWrapper header.main-nav .main-navbar .nav-menu > li > .menu-content { top: auto !important; }
}

/* ---------- 3. Branch switcher in the page header (wwwroot/js/athir-branch.js) ---------- */
.page-main-header .nav-menus > li.aui-branch { padding: 0 6px; }
.aui-branch-wrap { display: flex; align-items: center; gap: 8px; }
.aui-branch-ico {
    flex: none; width: 34px; height: 34px; border-radius: 10px; display: inline-flex; align-items: center; justify-content: center;
    background: #E8F0F8; color: #1D5C96;
}
.aui-branch-ico svg { width: 17px; height: 17px; }
.aui-branch-text { display: flex; flex-direction: column; line-height: 1.15; min-width: 0; }
.aui-branch-label { display: none; }   /* the icon and the box tooltip say "Branch"; a label above made the header taller */
.aui-branch-box.dx-selectbox { border-radius: 10px; }
.aui-branch-box.dx-editor-outlined { border-color: #D7DFE8; background: #FFFFFF; }
.aui-branch-box.dx-editor-outlined.dx-state-hover { border-color: #1D5C96; }
.aui-branch-box.dx-editor-outlined.dx-state-focused { border-color: #1D5C96; box-shadow: 0 0 0 3px #E8F0F8; }
.aui-branch-box .dx-texteditor-input { font-weight: 700; color: #1F2D3D; font-size: 13.5px; padding-top: 6px; padding-bottom: 6px; }
.aui-branch-static { font-weight: 700; color: #1F2D3D; font-size: 13.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 240px; }
.aui-branch-all .aui-branch-ico { background: #FFF4E0; color: #A15C00; }
.aui-branch-all .aui-branch-box.dx-editor-outlined { border-color: #F0C36D; background: #FFFBF2; }
.aui-branch-none .aui-branch-ico { background: #FDECEC; color: #B42318; }
.aui-branch-none .aui-branch-static { color: #B42318; font-weight: 500; }
.aui-branch-hint { font-size: 11px; color: #A15C00; white-space: nowrap; }
.aui-branch-item { display: flex; align-items: center; gap: 8px; padding: 2px 0; }
.aui-branch-item .aui-branch-dot { flex: none; width: 8px; height: 8px; border-radius: 50%; background: #1D5C96; opacity: .35; }
.aui-branch-item.is-all .aui-branch-dot { background: #A15C00; opacity: 1; }
.aui-branch-item.is-on .aui-branch-dot { opacity: 1; }
.aui-branch-item .aui-branch-sub { display: block; font-size: 11px; color: #6B7A8C; }
.aui-branch-item.is-on strong { color: #1D5C96; }
@media (max-width: 1399px) { .aui-branch-hint { display: none; } }

/* ---------- 3b. Header height: one row, and the page starts below it ---------- */
.page-main-header .nav-right .nav-menus { flex-wrap: nowrap; }
@media (min-width: 992px) {
    /* the search box gives way first, so the branch box and the buttons stay on the same row */
    .page-main-header .main-header-right { flex-wrap: nowrap; }
    .page-main-header .main-header-right .left-menu-header { min-width: 0; flex: 1 1 auto; }
    .page-main-header .main-header-right .nav-right { flex: 0 0 auto; width: auto; }
}
@media (max-width: 1399px) { .aui-branch-box.dx-selectbox { width: 200px !important; } }
.page-main-header .nav-right .nav-menus .btn { white-space: nowrap; }
@media (max-width: 1199px) {
    .page-main-header .nav-right .nav-menus .btn a { font-size: 0; }                 /* sign-out: icon only */
    .page-main-header .nav-right .nav-menus .btn a svg { margin: 0 !important; }
    .aui-branch-box.dx-selectbox { width: 180px !important; }
}
/* athir-shell.js sets --aui-header-h (the real header height) when the header is taller than the theme's 76px */
body.aui-tall-header .page-wrapper .page-body-wrapper .page-body { margin-top: var(--aui-header-h); }
@media (min-width: 992px) {
    body.aui-tall-header #pageWrapper.compact-wrapper .page-body-wrapper header.main-nav {
        top: calc(var(--aui-header-h) + 7px);
        height: calc(100vh - var(--aui-header-h) - 7px);
    }
}

/* ---------- 4. In-screen user guide (wwwroot/js/athir-help.js) ---------- */
.aui-help-btn { display: inline-flex; align-items: center; gap: 6px; height: 36px; padding: 0 12px; border-radius: 10px; border: 1px solid #D7DFE8;
    background: #FFFFFF; color: #1D5C96; font-weight: 700; font-size: 13px; cursor: pointer; }
.aui-help-btn svg { width: 17px; height: 17px; }
.aui-page-actions-auto { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.aui-help-btn:hover { border-color: #1D5C96; background: #E8F0F8; }
.aui-help-btn.is-floating { position: fixed; bottom: 20px; inset-inline-start: 20px; z-index: 1040; box-shadow: 0 6px 20px rgba(29, 92, 150, .18); }
.aui-help { position: fixed; top: 0; bottom: 0; inset-inline-end: 0; width: 460px; max-width: 100vw; z-index: 1600; background: #FFFFFF;
    box-shadow: 0 0 40px rgba(16, 38, 64, .22); display: flex; flex-direction: column; transform: translateX(105%); transition: transform .25s ease; visibility: hidden; }
[dir="rtl"].aui-help { transform: translateX(-105%); }
.aui-help.is-open { transform: none; visibility: visible; }
.aui-help-top { display: flex; align-items: flex-start; gap: 12px; padding: 18px 20px 12px; border-bottom: 1px solid #EEF2F6; }
.aui-help-titles { flex: 1; min-width: 0; }
.aui-help-module { display: block; font-size: 12px; color: #6B7A8C; }
.aui-help-title { margin: 2px 0 0; font-size: 19px; font-weight: 700; color: #1F2D3D; }
.aui-help-size { border: 0; background: #F3F5F8; width: 34px; height: 34px; border-radius: 10px; color: #44546A; cursor: pointer;
    display: inline-flex; align-items: center; justify-content: center; flex: none; }
.aui-help-size svg { width: 17px; height: 17px; }
.aui-help-size:hover, .aui-help-close:hover { background: #E8F0F8; color: #1D5C96; }
/* enlarged panel: wider, larger text and pictures (the choice is kept per browser) */
.aui-help { transition: transform .25s ease, width .2s ease; }
.aui-help.is-wide { width: min(980px, 96vw); }
.aui-help.is-wide .aui-help-body, .aui-help.is-wide .aui-help-results { font-size: 16px; line-height: 1.8; padding-inline: 32px; }
.aui-help.is-wide .aui-help-title { font-size: 22px; }
.aui-help.is-wide .aui-help-topic-head { font-size: 16px; padding: 13px 18px; }
.aui-help.is-wide .aui-help-section > h3 { font-size: 14px; }
.aui-help.is-wide .aui-help-search { padding-inline: 32px; }
.aui-help.is-wide .aui-help-search input { height: 42px; font-size: 15px; }
.aui-help.is-wide .aui-help-fig img { max-width: 760px; }
.aui-help.is-wide .aui-help-fig figcaption { font-size: 13px; }
.aui-help.is-wide .aui-help-topic-body { font-size: 16px; padding: 0 18px 14px; }
.aui-help.is-wide .aui-help-summary { font-size: 16px; padding: 14px 18px; }
.aui-help.is-wide .aui-help-hit strong { font-size: 16px; }
.aui-help.is-wide .aui-help-hit span, .aui-help.is-wide .aui-help-fb, .aui-help.is-wide .aui-help-fb button { font-size: 13px; }
.aui-help.is-wide .aui-help-steps > li { padding-inline-start: 40px; }
.aui-help.is-wide .aui-help-steps > li::before { width: 28px; height: 28px; font-size: 13px; }
.aui-help-close { border: 0; background: #F3F5F8; width: 34px; height: 34px; border-radius: 10px; font-size: 22px; line-height: 1; color: #44546A; cursor: pointer; }
.aui-help-search { padding: 12px 20px 4px; }
.aui-help-search input { width: 100%; height: 38px; border: 1px solid #D7DFE8; border-radius: 10px; padding: 0 12px; font-size: 14px; background: #F8FAFC; }
.aui-help-search input:focus { outline: none; border-color: #1D5C96; background: #FFFFFF; box-shadow: 0 0 0 3px #E8F0F8; }
.aui-help-body, .aui-help-results { flex: 1; overflow-y: auto; padding: 8px 20px 24px; }
.aui-help-hit { display: block; padding: 10px 12px; border-radius: 10px; color: #1F2D3D; text-decoration: none; }
.aui-help-hit:hover { background: #F3F5F8; }
.aui-help-hit strong { display: block; font-size: 14px; }
.aui-help-hit span { font-size: 12px; color: #6B7A8C; }
.aui-help-empty { padding: 24px 4px; color: #6B7A8C; text-align: center; }
.aui-help-summary { background: #F3F7FB; border-radius: 12px; padding: 12px 14px; margin: 8px 0 4px; color: #2E3E52; }
.aui-help-summary p:last-child { margin-bottom: 0; }
.aui-help-section { margin-top: 18px; }
.aui-help-section > h3 { font-size: 13px; font-weight: 700; color: #6B7A8C; letter-spacing: .02em; margin: 0 0 8px; }
.aui-help-topic { border: 1px solid #E3E8EF; border-radius: 12px; margin-bottom: 8px; overflow: hidden; }
.aui-help-topic.is-flash { box-shadow: 0 0 0 3px #F0C36D; }
.aui-help-topic-head { width: 100%; border: 0; background: #FFFFFF; text-align: start; padding: 11px 14px; font-weight: 700; font-size: 14px; color: #1F2D3D;
    display: flex; align-items: center; justify-content: space-between; gap: 8px; cursor: pointer; }
.aui-help-topic-head:not(.is-static)::after { content: '\2304'; color: #6B7A8C; transition: transform .2s; }
.aui-help-topic.is-folded .aui-help-topic-head::after { transform: rotate(90deg); }
[dir="rtl"] .aui-help-topic.is-folded .aui-help-topic-head::after { transform: rotate(-90deg); }
.aui-help-topic-head.is-static { cursor: default; }
.aui-help-topic-body { padding: 0 14px 12px; color: #2E3E52; font-size: 14px; line-height: 1.8; }
.aui-help-topic.is-folded .aui-help-topic-body { display: none; }
.aui-help-topic-body ul { padding-inline-start: 18px; margin: 4px 0 8px; }
.aui-help-steps { counter-reset: aui-step; list-style: none; padding: 0; margin: 4px 0 0; }
.aui-help-steps > li { counter-increment: aui-step; position: relative; padding-inline-start: 34px; margin-bottom: 12px; }
.aui-help-steps > li::before { content: counter(aui-step); position: absolute; inset-inline-start: 0; top: 2px; width: 24px; height: 24px; border-radius: 50%;
    background: #1D5C96; color: #FFFFFF; font-size: 12px; font-weight: 700; display: flex; align-items: center; justify-content: center; }
.aui-help-step-text p { margin: 0 0 6px; }
.aui-help-fig { margin: 6px 0 0; }
.aui-help-fig img { width: 100%; border: 1px solid #E3E8EF; border-radius: 10px; cursor: zoom-in; display: block; }
.aui-help-fig figcaption { font-size: 12px; color: #6B7A8C; margin-top: 4px; }
/* guide videos (2026-10-30): YouTube thumbnail -> player on press, or an uploaded file */
.aui-help-videos { display: grid; gap: 10px; margin: 6px 0 10px; }
.aui-help-video { margin: 0; }
.aui-help-video video, .aui-help-video iframe, .aui-help-video-thumb { width: 100%; aspect-ratio: 16 / 9; border: 1px solid #E3E8EF; border-radius: 10px; display: block; background: #0F1720; }
.aui-help-video-thumb { position: relative; padding: 0; cursor: pointer; overflow: hidden; }
.aui-help-video-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; opacity: .9; }
.aui-help-video-play { position: absolute; inset: 0; margin: auto; width: 56px; height: 40px; border-radius: 10px; background: #B42318; }
.aui-help-video-play::after { content: ''; position: absolute; inset: 0; margin: auto; width: 0; height: 0; border-style: solid; border-width: 9px 0 9px 15px; border-color: transparent transparent transparent #FFFFFF; transform: translateX(2px); }
[dir="rtl"] .aui-help-video-play::after { transform: translateX(2px); }
.aui-help-video-thumb:hover .aui-help-video-play { background: #8F1C13; }
.aui-help-video figcaption { font-size: 12px; color: #6B7A8C; margin-top: 4px; }
.aui-help.is-wide .aui-help-video { max-width: 760px; }
.aui-help-fb { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; margin-top: 10px; padding-top: 10px; border-top: 1px dashed #E3E8EF; font-size: 12px; color: #6B7A8C; }
.aui-help-fb button { border: 1px solid #D7DFE8; background: #FFFFFF; border-radius: 8px; padding: 3px 12px; font-size: 12px; cursor: pointer; color: #1F2D3D; }
.aui-help-fb button:hover, .aui-help-fb button.is-primary { border-color: #1D5C96; color: #1D5C96; }
.aui-help-fb input { flex: 1; min-width: 160px; height: 30px; border: 1px solid #D7DFE8; border-radius: 8px; padding: 0 10px; }
.aui-help-thanks { color: #13703F; font-weight: 700; }
.aui-help-zoom { position: fixed; inset: 0; z-index: 1700; background: rgba(16, 24, 40, .82); display: flex; flex-direction: column; align-items: center;
    justify-content: center; gap: 10px; padding: 24px; cursor: zoom-out; color: #FFFFFF; }
.aui-help-zoom img { max-width: 96vw; max-height: 86vh; border-radius: 10px; background: #FFFFFF; }
@media (max-width: 575px) { .aui-help-btn span { display: none; } }