/* Zetra sidebar polish layered over ColorAdmin defaults. */
:root {
    --zetra-sidebar-bg: #ffffff;
    --zetra-sidebar-bg-soft: #f6f8fb;
    --zetra-sidebar-border: #dce3ea;
    --zetra-sidebar-text: #334155;
    --zetra-sidebar-muted: #778393;
    --zetra-sidebar-icon: #6b7a8c;
    --zetra-sidebar-hover-bg: #f1f6fb;
    --zetra-sidebar-active-bg: rgba(var(--bs-primary-rgb, 52, 143, 226), .12);
    --zetra-sidebar-active-border: rgba(var(--bs-primary-rgb, 52, 143, 226), .22);
    --zetra-sidebar-active-text: #1f6fb8;
    --zetra-sidebar-line: #d8e1ea;
    --zetra-sidebar-shadow: 12px 0 34px rgba(27, 39, 51, .08);
    --zetra-sidebar-profile-bg: linear-gradient(180deg, #ffffff 0%, #f6f9fc 100%);
    --zetra-sidebar-profile-border: #dce5ee;
    --zetra-sidebar-badge-bg: #e8f2fc;
    --zetra-sidebar-badge-text: #1f6fb8;
    --zetra-header-bg: rgba(255, 255, 255, .94);
    --zetra-header-surface: #f6f9fc;
    --zetra-header-surface-hover: #eef5fc;
    --zetra-header-border: #dce5ee;
    --zetra-header-text: #243447;
    --zetra-header-muted: #627082;
    --zetra-header-shadow: 0 10px 30px rgba(27, 39, 51, .08);
    --zetra-header-brand-bg: linear-gradient(135deg, rgba(0, 172, 172, .12), rgba(52, 143, 226, .10));
    --zetra-header-scroll-edge: rgba(15, 23, 42, .42);
    --zetra-mobile-header-height: 56px;
}

html.dark-mode,
[data-bs-theme="dark"] {
    --zetra-sidebar-bg: #20252a;
    --zetra-sidebar-bg-soft: #262d34;
    --zetra-sidebar-border: rgba(255, 255, 255, .08);
    --zetra-sidebar-text: #dce4ec;
    --zetra-sidebar-muted: #9da8b4;
    --zetra-sidebar-icon: #a5b0ba;
    --zetra-sidebar-hover-bg: rgba(255, 255, 255, .055);
    --zetra-sidebar-active-bg: rgba(var(--bs-primary-rgb, 52, 143, 226), .18);
    --zetra-sidebar-active-border: rgba(var(--bs-primary-rgb, 52, 143, 226), .32);
    --zetra-sidebar-active-text: #8fc5f7;
    --zetra-sidebar-line: rgba(255, 255, 255, .10);
    --zetra-sidebar-shadow: 12px 0 36px rgba(0, 0, 0, .24);
    --zetra-sidebar-profile-bg: linear-gradient(180deg, #252b31 0%, #20252a 100%);
    --zetra-sidebar-profile-border: rgba(255, 255, 255, .10);
    --zetra-sidebar-badge-bg: rgba(var(--bs-primary-rgb, 52, 143, 226), .22);
    --zetra-sidebar-badge-text: #c7e5ff;
    --zetra-header-bg: rgba(32, 37, 42, .96);
    --zetra-header-surface: rgba(255, 255, 255, .055);
    --zetra-header-surface-hover: rgba(255, 255, 255, .09);
    --zetra-header-border: rgba(255, 255, 255, .09);
    --zetra-header-text: #edf3f8;
    --zetra-header-muted: #a5b0ba;
    --zetra-header-shadow: 0 12px 34px rgba(0, 0, 0, .24);
    --zetra-header-brand-bg: linear-gradient(135deg, rgba(0, 172, 172, .18), rgba(52, 143, 226, .14));
    --zetra-header-scroll-edge: rgba(52, 143, 226, .68);
}

#sidebar.app-sidebar,
.app-sidebar-bg {
    background: var(--zetra-sidebar-bg) !important;
    border-right: 1px solid var(--zetra-sidebar-border);
}

#sidebar.app-sidebar {
    box-shadow: var(--zetra-sidebar-shadow);
}

#header.app-header {
    z-index: 1045 !important;
    color: var(--zetra-header-text);
    background: var(--zetra-header-bg) !important;
    border-bottom: 1px solid var(--zetra-header-border);
    box-shadow: var(--zetra-header-shadow);
    backdrop-filter: saturate(150%) blur(12px);
}

#header.app-header .navbar-header {
    align-items: center;
    background: transparent !important;
    border-right: 1px solid var(--zetra-header-border);
}

#header.app-header .navbar-brand {
    height: 40px;
    margin: 5px 8px;
    padding: 0 12px;
    border: 1px solid transparent;
    border-radius: 10px;
    color: var(--zetra-header-text) !important;
    background: var(--zetra-header-brand-bg);
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 16px;
    font-weight: 500;
    letter-spacing: 0;
    text-decoration: none;
    transition: background .16s ease, border-color .16s ease, color .16s ease;
}

#header.app-header .navbar-brand:hover,
#header.app-header .navbar-brand:focus {
    border-color: rgba(var(--bs-primary-rgb, 52, 143, 226), .22);
    background: var(--zetra-header-surface-hover);
}

#header.app-header .navbar-brand b {
    font-weight: 850;
}

#header.app-header .navbar-brand-text {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

#header.app-header .navbar-brand-suffix {
    margin-left: 1px;
    font-weight: 500;
}

#header.app-header .navbar-logo {
    width: 20px;
    height: 20px;
    margin: 0;
    border-radius: 5px;
    background: linear-gradient(135deg, #00acac 0%, #348fe2 100%);
    box-shadow: 0 8px 18px rgba(0, 172, 172, .20);
}

#header.app-header .navbar-mobile-toggler {
    width: 38px;
    height: 38px;
    margin: 6px 4px;
    border: 1px solid var(--zetra-header-border);
    border-radius: 10px;
    background: var(--zetra-header-surface) !important;
    display: inline-flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 4px;
    transition: background .16s ease, border-color .16s ease, color .16s ease;
}

#header.app-header .navbar-mobile-toggler > a {
    width: 100%;
    height: 100%;
    color: inherit;
    display: inline-flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 4px;
    text-decoration: none;
}

#header.app-header .navbar-mobile-toggler:hover,
#header.app-header .navbar-mobile-toggler:focus {
    border-color: rgba(var(--bs-primary-rgb, 52, 143, 226), .28);
    background: var(--zetra-header-surface-hover) !important;
}

#header.app-header .navbar-mobile-toggler .icon-bar {
    width: 18px;
    height: 2px;
    margin: 0 !important;
    border-radius: 999px;
    background: var(--zetra-header-text) !important;
    display: block;
    flex: 0 0 2px;
    opacity: .92;
    transition: width .16s ease, background .16s ease, opacity .16s ease;
}

#header.app-header .navbar-mobile-toggler .icon-bar:nth-child(2) {
    width: 14px;
}

#header.app-header .navbar-mobile-toggler:hover .icon-bar,
#header.app-header .navbar-mobile-toggler:focus .icon-bar {
    background: var(--bs-primary, #348fe2) !important;
    opacity: 1;
}

#header.app-header .navbar-mobile-toggler:hover .icon-bar:nth-child(2),
#header.app-header .navbar-mobile-toggler:focus .icon-bar:nth-child(2) {
    width: 18px;
}

#header.app-header > .navbar-nav {
    align-items: center;
    gap: 6px;
    height: 50px;
    width: auto !important;
    flex: 0 0 auto;
    justify-content: flex-start;
    margin-left: 0 !important;
    margin-right: auto !important;
    padding: 0 12px 0 10px;
}

#header.app-header > .navbar-nav > .navbar-item:has(#headerGlobalScanBtn) {
    order: 10;
}

#header.app-header #notificationBellContainer {
    order: 20;
}

#header.app-header > .navbar-nav > .navbar-item:has(#headerDarkModeToggle) {
    order: 30;
}

#header.app-header #financialYearSelector {
    order: 40;
}

#header.app-header #headerQuickActionsItem.navbar-end-toggler,
#header.app-header > .navbar-nav > .navbar-item:has(> .navbar-link[data-toggle="app-sidebar-end"]) {
    order: 50 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
}

#header.app-header > .navbar-nav > .navbar-item {
    height: 50px;
    display: inline-flex;
    align-items: center;
}

#header.app-header > .navbar-nav > .navbar-item > .navbar-link {
    min-width: 38px;
    height: 38px;
    padding: 0 10px;
    border-radius: 10px;
    justify-content: center;
    color: var(--zetra-header-text) !important;
    background: var(--zetra-header-surface) !important;
    border: 1px solid var(--zetra-header-border);
    box-shadow: none;
    gap: 6px;
    text-decoration: none;
    transition: background .16s ease, color .16s ease, border-color .16s ease, box-shadow .16s ease, transform .16s ease;
}

#header.app-header > .navbar-nav > .navbar-item > .navbar-link i {
    color: var(--zetra-header-muted);
    font-size: 14px;
    transition: color .16s ease;
}

#header.app-header > .navbar-nav > .navbar-item > .navbar-link:hover,
#header.app-header > .navbar-nav > .navbar-item > .navbar-link:focus {
    color: var(--bs-primary, #348fe2) !important;
    border-color: rgba(var(--bs-primary-rgb, 52, 143, 226), .30);
    background: var(--zetra-header-surface-hover) !important;
    box-shadow: 0 8px 18px rgba(27, 39, 51, .08);
    transform: translateY(-1px);
}

#header.app-header > .navbar-nav > .navbar-item > .navbar-link:hover i,
#header.app-header > .navbar-nav > .navbar-item > .navbar-link:focus i {
    color: var(--bs-primary, #348fe2);
}

#header.app-header #financialYearSelector :is(.navbar-link, .dropdown > .btn) {
    min-width: auto;
    height: 38px;
    padding: 0 13px;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center;
    gap: 6px;
    border: 1px solid var(--zetra-header-border) !important;
    border-radius: 10px;
    color: var(--zetra-header-text) !important;
    background: var(--zetra-header-surface) !important;
    box-shadow: none !important;
    font-weight: 800;
    line-height: 1;
    white-space: nowrap;
}

#header.app-header #financialYearSelector :is(.navbar-link, .dropdown > .btn):hover,
#header.app-header #financialYearSelector :is(.navbar-link, .dropdown > .btn):focus {
    color: var(--bs-primary, #348fe2) !important;
    border-color: rgba(var(--bs-primary-rgb, 52, 143, 226), .30) !important;
    background: var(--zetra-header-surface-hover) !important;
}

#header.app-header #financialYearSelector .dropdown > .btn .me-2,
#header.app-header #financialYearSelector .dropdown > .btn .ms-1 {
    margin-left: 0 !important;
    margin-right: 0 !important;
}

#header.app-header #financialYearSelector .dropdown-toggle::after {
    margin-left: 0;
}

#header.app-header:has(#financialYearSelector .dropdown-menu.show) {
    z-index: 1090 !important;
    overflow: visible !important;
}

#header.app-header #financialYearSelector .dropdown-menu {
    inset: auto 0 auto auto !important;
    top: calc(100% + 14px) !important;
    right: 0 !important;
    left: auto !important;
    min-width: 214px;
    margin: 0 !important;
    padding: 8px;
    overflow: hidden;
    border: 1px solid var(--zetra-header-border);
    border-radius: 10px;
    color: var(--zetra-header-text);
    background: var(--zetra-sidebar-bg);
    box-shadow: 0 18px 42px rgba(15, 23, 42, .16);
    transform: none !important;
    z-index: 1095;
}

#header.app-header #financialYearSelector .dropdown-menu li {
    list-style: none;
}

#header.app-header #financialYearSelector .dropdown-header {
    padding: 6px 8px 8px;
    color: var(--zetra-header-muted);
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0;
    line-height: 1.2;
    text-transform: uppercase;
}

#header.app-header #financialYearSelector .dropdown-divider {
    margin: 4px -8px 6px;
    border-color: var(--zetra-header-border);
    opacity: 1;
}

#header.app-header #financialYearSelector .dropdown-item {
    min-height: 36px;
    padding: 0 9px;
    gap: 8px;
    border: 1px solid transparent;
    border-radius: 7px;
    color: var(--zetra-header-text) !important;
    background: transparent;
    font-size: 13px;
    font-weight: 800;
    line-height: 1;
    text-decoration: none;
    transition: background .16s ease, color .16s ease, border-color .16s ease;
}

#header.app-header #financialYearSelector .dropdown-item:hover,
#header.app-header #financialYearSelector .dropdown-item:focus {
    color: var(--bs-primary, #348fe2) !important;
    border-color: rgba(var(--bs-primary-rgb, 52, 143, 226), .26);
    background: var(--zetra-header-surface-hover);
}

#header.app-header #financialYearSelector .dropdown-item.active,
#header.app-header #financialYearSelector .dropdown-item:active {
    color: var(--bs-primary, #348fe2) !important;
    border-color: rgba(var(--bs-primary-rgb, 52, 143, 226), .34);
    background: rgba(var(--bs-primary-rgb, 52, 143, 226), .14) !important;
}

#header.app-header #financialYearSelector .dropdown-item[data-locked="true"] {
    color: var(--zetra-header-muted) !important;
}

#header.app-header #financialYearSelector .dropdown-item[data-locked="true"]:hover,
#header.app-header #financialYearSelector .dropdown-item[data-locked="true"]:focus,
#header.app-header #financialYearSelector .dropdown-item[data-locked="true"].active {
    color: var(--zetra-header-text) !important;
}

#header.app-header #financialYearSelector .dropdown-item .badge {
    height: 20px;
    padding: 0 7px;
    border-radius: 10px;
    display: inline-flex;
    align-items: center;
    color: #fff;
    font-size: 10px;
    font-weight: 800;
    line-height: 1;
}

#header.app-header #financialYearSelector .dropdown-item .fa-lock,
#header.app-header #financialYearSelector .dropdown-item .fa-check {
    width: 22px;
    height: 22px;
    border-radius: 7px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 11px;
}

#header.app-header #financialYearSelector .dropdown-item .fa-lock {
    color: var(--bs-warning, #f59c1a) !important;
    background: rgba(var(--bs-warning-rgb, 245, 156, 26), .14);
}

#header.app-header #financialYearSelector .dropdown-item .fa-check {
    color: var(--bs-success, #00acac) !important;
    background: rgba(var(--bs-success-rgb, 0, 172, 172), .14);
}

#header.app-header #financialYearSelector .dropdown-item .fa-lock + .fa-check {
    margin-left: 4px !important;
}

#header.app-header #financialYearSelector .dropdown-item.active {
    color: var(--bs-primary, #348fe2) !important;
    background-color: rgba(var(--bs-primary-rgb, 52, 143, 226), .14) !important;
}

#header.app-header #currentYearDisplay {
    min-width: 34px;
    text-align: center;
}

#header.app-header #yearLockIcon {
    color: var(--bs-teal, #00acac);
}

#header.app-header .navbar-divider {
    margin: 0 6px;
    opacity: .35;
}

#sidebar.app-sidebar .app-sidebar-content {
    padding: 10px 0 12px;
}

#sidebar.app-sidebar .menu {
    min-height: calc(100% - 2px);
    padding: 0 8px 14px;
    display: flex;
    flex-direction: column;
}

#sidebar.app-sidebar .menu .menu-header {
    margin: 14px 10px 7px;
    padding: 0;
    color: var(--zetra-sidebar-muted) !important;
    font-size: 11px;
    font-weight: 800;
    line-height: 1.2;
    letter-spacing: 0;
    text-transform: uppercase;
}

#sidebar.app-sidebar .menu .menu-divider {
    height: 1px;
    margin: 7px 8px;
    background: var(--zetra-sidebar-line) !important;
}

#sidebar.app-sidebar .menu .menu-item {
    margin: 2px 0;
}

#sidebar.app-sidebar .menu .menu-link {
    position: relative;
    min-height: 38px;
    margin: 0;
    padding: 0 10px !important;
    border-radius: 6px;
    color: var(--zetra-sidebar-text) !important;
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 12px;
    font-weight: 650;
    line-height: 1.25;
    text-decoration: none;
    flex-wrap: nowrap;
    overflow: hidden;
    transition: background-color .15s ease, color .15s ease, box-shadow .15s ease;
}

#sidebar.app-sidebar .menu .menu-link:hover,
#sidebar.app-sidebar .menu .menu-link:focus {
    color: var(--zetra-sidebar-active-text) !important;
    background: var(--zetra-sidebar-hover-bg) !important;
}

#sidebar.app-sidebar .menu .menu-icon,
#sidebar.app-sidebar .menu .menu-icon-img {
    width: 26px !important;
    min-width: 26px !important;
    height: 26px;
    margin: 0 !important;
    border-radius: 6px;
    color: var(--zetra-sidebar-icon) !important;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 13px;
    line-height: 1;
    transition: background-color .15s ease, color .15s ease;
}

#sidebar.app-sidebar .menu .menu-link:hover .menu-icon,
#sidebar.app-sidebar .menu .menu-link:focus .menu-icon,
#sidebar.app-sidebar .menu .menu-link:hover .menu-icon-img,
#sidebar.app-sidebar .menu .menu-link:focus .menu-icon-img {
    color: var(--zetra-sidebar-active-text) !important;
    background: rgba(var(--bs-primary-rgb, 52, 143, 226), .10);
}

#sidebar.app-sidebar .menu .menu-text {
    flex: 1 1 auto;
    min-width: 0;
    max-width: 100%;
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

#sidebar.app-sidebar .menu .menu-caret {
    flex: 0 0 auto;
    margin-left: auto;
    color: var(--zetra-sidebar-muted) !important;
    opacity: .82;
}

#sidebar.app-sidebar .menu .menu-item.active > .menu-link,
#sidebar.app-sidebar .menu .menu-item.expand > .menu-link {
    color: var(--zetra-sidebar-active-text) !important;
    background: var(--zetra-sidebar-active-bg) !important;
    box-shadow: inset 0 0 0 1px var(--zetra-sidebar-active-border);
}

#sidebar.app-sidebar .menu > .menu-item.active > .menu-link::before,
#sidebar.app-sidebar .menu > .menu-item.expand > .menu-link::before {
    content: "";
    position: absolute;
    left: 0;
    top: 9px;
    bottom: 9px;
    width: 3px;
    border-radius: 0 3px 3px 0;
    background: var(--bs-primary, #348fe2);
}

#sidebar.app-sidebar .menu .menu-item.active > .menu-link .menu-icon,
#sidebar.app-sidebar .menu .menu-item.expand > .menu-link .menu-icon {
    color: var(--zetra-sidebar-active-text) !important;
    background: rgba(var(--bs-primary-rgb, 52, 143, 226), .14);
}

#sidebar.app-sidebar .menu .menu-submenu {
    margin: 3px 0 7px 21px;
    padding: 3px 0 3px 9px !important;
    border-left: 1px solid var(--zetra-sidebar-line);
}

#sidebar.app-sidebar .menu .menu-submenu > .menu-item {
    margin: 1px 0;
}

#sidebar.app-sidebar .menu .menu-submenu .menu-link {
    min-height: 34px;
    padding: 0 9px !important;
    font-size: 12px;
    font-weight: 600;
}

#sidebar.app-sidebar .menu .menu-submenu .menu-submenu {
    margin-left: 15px;
}

#sidebar.app-sidebar .menu .menu-submenu > .menu-item:before,
#sidebar.app-sidebar .menu .menu-submenu > .menu-item:after,
#sidebar.app-sidebar .menu .menu-submenu > .menu-item > .menu-link:after,
#sidebar.app-sidebar .menu .menu-submenu > .menu-item.has-sub > .menu-link:before {
    display: none !important;
}

#sidebar.app-sidebar .menu-profile {
    margin: 10px 8px 13px;
    overflow: hidden;
    border: 1px solid var(--zetra-sidebar-profile-border);
    border-radius: 8px;
    background: var(--zetra-sidebar-profile-bg) !important;
}

#sidebar.app-sidebar .menu-profile-cover {
    display: none !important;
}

#sidebar.app-sidebar .menu-profile-link {
    min-height: auto;
    padding: 12px !important;
    display: flex;
    align-items: center;
    gap: 10px;
    color: var(--zetra-sidebar-text) !important;
    background: transparent !important;
    text-decoration: none;
}

#sidebar.app-sidebar .menu-profile-link:hover,
#sidebar.app-sidebar .menu-profile-link:focus {
    background: var(--zetra-sidebar-hover-bg) !important;
}

#sidebar.app-sidebar .menu-profile-avatar {
    width: 38px;
    height: 38px;
    flex: 0 0 38px;
    border-radius: 8px;
    color: #ffffff;
    background: #00acac;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 13px;
    font-weight: 800;
    box-shadow: 0 8px 18px rgba(0, 172, 172, .22);
}

#sidebar.app-sidebar .menu-profile-avatar.attendance-avatar {
    transition: background .2s ease, box-shadow .2s ease, transform .2s ease;
}

#sidebar.app-sidebar .menu-profile-avatar.attendance-active {
    background: linear-gradient(135deg, #00acac 0%, #22c55e 100%) !important;
    box-shadow: 0 10px 22px rgba(34, 197, 94, .28);
}

#sidebar.app-sidebar .menu-profile-avatar.attendance-inactive {
    background: linear-gradient(135deg, #ff5b57 0%, #dc3545 100%) !important;
    box-shadow: 0 10px 22px rgba(255, 91, 87, .28);
}

#sidebar.app-sidebar .menu-profile-avatar.attendance-finished {
    background: linear-gradient(135deg, #f59c1a 0%, #8753de 100%) !important;
    box-shadow: 0 10px 22px rgba(245, 156, 26, .24);
}

#sidebar.app-sidebar .menu-profile-avatar.attendance-unknown {
    background: linear-gradient(135deg, #6c757d 0%, #495057 100%) !important;
    box-shadow: 0 10px 22px rgba(73, 80, 87, .20);
}

#sidebar.app-sidebar .menu-profile-link:hover .menu-profile-avatar.attendance-avatar,
#sidebar.app-sidebar .menu-profile-link:focus .menu-profile-avatar.attendance-avatar {
    transform: translateY(-1px);
}

#sidebar.app-sidebar .menu-profile-info {
    min-width: 0;
    flex: 1 1 auto;
}

#sidebar.app-sidebar .menu-profile-info > .d-flex,
#sidebar.app-sidebar .menu-profile-meta {
    min-width: 0;
    flex-wrap: nowrap;
}

#sidebar.app-sidebar .menu-profile-name {
    flex: 1 1 auto;
    min-width: 0;
    max-width: 100%;
    color: var(--zetra-sidebar-text);
    font-size: 13px;
    font-weight: 800;
    line-height: 1.25;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

#sidebar.app-sidebar .menu-profile-meta {
    margin-top: 4px;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

#sidebar.app-sidebar .menu-profile-role,
#sidebar.app-sidebar .menu-profile-time {
    color: var(--zetra-sidebar-muted);
    font-size: 11px;
    font-weight: 600;
    line-height: 1.25;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

#sidebar.app-sidebar .menu-search {
    margin: 8px 8px 12px !important;
}

#sidebar.app-sidebar .menu-search .form-control {
    min-height: 38px;
    border-radius: 6px;
    border-color: var(--zetra-sidebar-border) !important;
    color: var(--zetra-sidebar-text) !important;
    background: var(--zetra-sidebar-bg-soft) !important;
    box-shadow: none !important;
}

#sidebar.app-sidebar .menu-search .form-control:focus {
    border-color: var(--bs-primary, #348fe2) !important;
    box-shadow: 0 0 0 .18rem rgba(var(--bs-primary-rgb, 52, 143, 226), .16) !important;
}

#sidebar.app-sidebar .sidebar-badge,
#sidebar.app-sidebar .menu-badge {
    flex: 0 0 auto;
    min-width: 22px;
    height: 20px;
    padding: 0 7px;
    border-radius: 10px;
    color: var(--zetra-sidebar-badge-text) !important;
    background: var(--zetra-sidebar-badge-bg) !important;
    font-size: 11px;
    font-weight: 800;
    line-height: 20px;
    text-align: center;
}

#sidebar.app-sidebar .sidebar-parent-alert {
    display: inline-flex !important;
    flex: 0 0 auto;
    margin-left: 6px !important;
}

#sidebar.app-sidebar .sidebar-parent-alert.d-none {
    display: none !important;
}

#sidebar.app-sidebar .app-sidebar-minify-btn {
    width: 36px;
    height: 36px;
    margin: 10px 8px 0 auto !important;
    border-radius: 8px;
    color: var(--zetra-sidebar-muted) !important;
    background: var(--zetra-sidebar-bg-soft) !important;
    border: 1px solid var(--zetra-sidebar-border);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: background-color .15s ease, color .15s ease, border-color .15s ease;
}

#sidebar.app-sidebar .menu > .menu-item.d-flex:last-child {
    margin-top: auto;
    padding-top: 10px;
}

#sidebar.app-sidebar .app-sidebar-minify-btn:hover,
#sidebar.app-sidebar .app-sidebar-minify-btn:focus {
    color: var(--zetra-sidebar-active-text) !important;
    border-color: var(--zetra-sidebar-active-border);
    background: var(--zetra-sidebar-hover-bg) !important;
}

.app-sidebar-float-submenu-container {
    border: 1px solid var(--zetra-sidebar-border) !important;
    border-radius: 8px;
    background: var(--zetra-sidebar-bg) !important;
    box-shadow: 0 18px 42px rgba(15, 23, 42, .16);
    overflow: hidden;
}

.app-sidebar-float-submenu-container .app-sidebar-float-submenu {
    padding: 6px;
}

.app-sidebar-float-submenu-container .app-sidebar-float-submenu .menu-link {
    min-height: 36px;
    border-radius: 6px;
    color: var(--zetra-sidebar-text) !important;
    flex-wrap: nowrap;
    overflow: hidden;
}

.app-sidebar-float-submenu-container .app-sidebar-float-submenu .menu-text {
    flex: 1 1 auto;
    min-width: 0;
    max-width: 100%;
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.app-sidebar-float-submenu-container .app-sidebar-float-submenu .menu-link:hover,
.app-sidebar-float-submenu-container .app-sidebar-float-submenu .menu-link:focus,
.app-sidebar-float-submenu-container .app-sidebar-float-submenu .menu-item.active > .menu-link {
    color: var(--zetra-sidebar-active-text) !important;
    background: var(--zetra-sidebar-active-bg) !important;
}

/* ColorAdmin right sidebar */
#sidebar-right.app-sidebar-end,
.app-sidebar-bg.app-sidebar-end {
    background: var(--zetra-sidebar-bg) !important;
    border-left: 1px solid var(--zetra-sidebar-border);
}

#sidebar-right.app-sidebar-end {
    box-shadow: -12px 0 34px rgba(27, 39, 51, .08);
}

html.dark-mode #sidebar-right.app-sidebar-end,
[data-bs-theme="dark"] #sidebar-right.app-sidebar-end {
    box-shadow: -12px 0 36px rgba(0, 0, 0, .24);
}

#sidebar-right.app-sidebar-end [data-scrollbar="true"] {
    padding: 10px 0 12px;
}

#sidebar-right.app-sidebar-end .p-20px.text-white {
    padding: 14px !important;
    color: var(--zetra-sidebar-text) !important;
}

#sidebar-right.app-sidebar-end p.fw-bold {
    margin-bottom: 10px !important;
    color: var(--zetra-sidebar-text) !important;
    font-size: 12px;
    font-weight: 800 !important;
    letter-spacing: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

#sidebar-right.app-sidebar-end hr {
    height: 1px;
    margin: 12px 0 !important;
    background: var(--zetra-sidebar-line) !important;
    opacity: 1 !important;
}

#sidebar-right.app-sidebar-end .p-20px.text-white > .d-flex {
    min-height: 74px;
    padding: 12px;
    border: 1px solid var(--zetra-sidebar-border);
    border-radius: 8px;
    background: var(--zetra-sidebar-bg-soft);
}

#sidebar-right.app-sidebar-end .fw-bold,
#sidebar-right.app-sidebar-end .text-gray-500,
#sidebar-right.app-sidebar-end .text-gray-600 {
    min-width: 0;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: var(--zetra-sidebar-text) !important;
}

#sidebar-right.app-sidebar-end small {
    min-width: 0;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: var(--zetra-sidebar-muted) !important;
}

#sidebar-right.app-sidebar-end .progress {
    overflow: hidden;
    background: var(--zetra-sidebar-line) !important;
}

#sidebar-right.app-sidebar-end .accordion {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

#sidebar-right.app-sidebar-end .accordion-item {
    overflow: hidden;
    border: 1px solid var(--zetra-sidebar-border) !important;
    border-radius: 8px !important;
    background: var(--zetra-sidebar-bg-soft) !important;
}

#sidebar-right.app-sidebar-end .panel-heading {
    border: 0 !important;
    background: transparent !important;
}

#sidebar-right.app-sidebar-end .accordion-button {
    min-height: 40px;
    padding: 0 12px !important;
    color: var(--zetra-sidebar-text) !important;
    font-size: 12px;
    font-weight: 800;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

#sidebar-right.app-sidebar-end .accordion-button:not(.collapsed) {
    color: var(--zetra-sidebar-active-text) !important;
    background: var(--zetra-sidebar-active-bg) !important;
}

#sidebar-right.app-sidebar-end .accordion-body {
    color: var(--zetra-sidebar-muted) !important;
    background: transparent !important;
    font-size: 12px;
    line-height: 1.5;
}

/* ERP right action sidebar */
.erp-action-sidebar {
    background: var(--zetra-sidebar-bg) !important;
    border-left: 1px solid var(--zetra-sidebar-border) !important;
    box-shadow: -10px 0 28px rgba(27, 39, 51, .06);
}

html.dark-mode .erp-action-sidebar,
[data-bs-theme="dark"] .erp-action-sidebar {
    box-shadow: -10px 0 30px rgba(0, 0, 0, .22);
}

.erp-action-sidebar-inner {
    gap: 6px !important;
    padding: 10px !important;
}

.erp-action-sidebar .erp-action-divider {
    height: 1px;
    margin: 6px 0 !important;
    background: var(--zetra-sidebar-line) !important;
}

.erp-action-item {
    min-height: 38px;
    padding: 0 10px !important;
    gap: 8px !important;
    border: 1px solid transparent !important;
    border-radius: 6px !important;
    color: var(--zetra-sidebar-text) !important;
    background: transparent !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    line-height: 1.25;
    flex-wrap: nowrap;
    overflow: hidden;
    box-shadow: none !important;
    transition: background-color .15s ease, border-color .15s ease, color .15s ease;
}

.erp-action-item i {
    width: 26px !important;
    min-width: 26px;
    flex: 0 0 26px;
    height: 26px;
    border-radius: 6px;
    color: var(--bs-primary, #348fe2);
    background: rgba(var(--bs-primary-rgb, 52, 143, 226), .10);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 13px !important;
}

.erp-action-label {
    flex: 1 1 auto;
    min-width: 0;
    max-width: 100%;
    display: block;
    overflow: hidden;
    color: inherit !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    line-height: 1.25;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.erp-action-item:hover,
.erp-action-item:focus {
    color: var(--zetra-sidebar-active-text) !important;
    border-color: var(--zetra-sidebar-active-border) !important;
    background: var(--zetra-sidebar-hover-bg) !important;
}

.erp-action-item.active,
.erp-action-item:active {
    color: var(--zetra-sidebar-active-text) !important;
    border-color: var(--zetra-sidebar-active-border) !important;
    background: var(--zetra-sidebar-active-bg) !important;
}

.erp-action-item.disabled {
    opacity: .46 !important;
    filter: grayscale(.25);
}

.erp-action-item.erp-action-info i { color: var(--bs-info, #49b6d6); background: rgba(var(--bs-info-rgb, 73, 182, 214), .12); }
.erp-action-item.erp-action-success i { color: var(--bs-success, #00acac); background: rgba(var(--bs-success-rgb, 0, 172, 172), .12); }
.erp-action-item.erp-action-danger i { color: var(--bs-danger, #ff5b57); background: rgba(var(--bs-danger-rgb, 255, 91, 87), .12); }
.erp-action-item.erp-action-warning i { color: var(--bs-warning, #f59c1a); background: rgba(var(--bs-warning-rgb, 245, 156, 26), .13); }
.erp-action-item.erp-action-primary i { color: var(--bs-primary, #348fe2); background: rgba(var(--bs-primary-rgb, 52, 143, 226), .12); }
.erp-action-item.erp-action-purple i { color: var(--bs-purple, #727cb6); background: rgba(var(--bs-purple-rgb, 114, 124, 182), .14); }
.erp-action-item.erp-action-orange i { color: var(--bs-orange, #f59c1a); background: rgba(var(--bs-orange-rgb, 245, 156, 26), .13); }
.erp-action-item.erp-action-teal i { color: var(--bs-teal, #00acac); background: rgba(var(--bs-teal-rgb, 0, 172, 172), .12); }
.erp-action-item.erp-action-dark i { color: var(--bs-gray-700, #495057); background: rgba(var(--bs-secondary-rgb, 108, 117, 125), .12); }

.erp-action-item .erp-action-badge {
    top: 5px !important;
    right: 6px !important;
    min-width: 18px;
    height: 18px;
    padding: 0 6px !important;
    border-radius: 9px !important;
    color: #fff;
    background: var(--bs-danger, #ff5b57) !important;
    font-size: 10px !important;
    font-weight: 800;
    line-height: 18px !important;
}

.erp-action-fiscal-panel {
    width: 100%;
    padding: 8px !important;
    border: 1px solid var(--zetra-sidebar-border) !important;
    border-radius: 6px !important;
    color: var(--zetra-sidebar-text) !important;
    background: rgba(var(--bs-secondary-rgb, 108, 117, 125), .05) !important;
    font-size: 11px;
}

.erp-action-fiscal-panel.is-active {
    border-color: rgba(var(--bs-info-rgb, 73, 182, 214), .45) !important;
    background: rgba(var(--bs-info-rgb, 73, 182, 214), .08) !important;
}

.erp-action-fiscal-title {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-bottom: 6px;
    color: var(--zetra-sidebar-text) !important;
    font-size: 11px;
    font-weight: 800;
    line-height: 1.2;
}

.erp-action-fiscal-title i {
    width: 20px;
    min-width: 20px;
    height: 20px;
    border-radius: 5px;
    color: var(--bs-info, #49b6d6);
    background: rgba(var(--bs-info-rgb, 73, 182, 214), .12);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 11px;
}

.erp-action-fiscal-toggle {
    display: flex !important;
    align-items: center;
    gap: 6px;
    min-height: 20px;
    margin: 0 0 6px !important;
    padding-left: 0 !important;
    color: var(--zetra-sidebar-muted) !important;
    font-size: 11px;
    font-weight: 700;
}

.erp-action-fiscal-toggle .form-check-input {
    float: none;
    flex: 0 0 auto;
    width: 14px;
    height: 14px;
    margin: 0 !important;
}

.erp-action-fiscal-input .form-control,
.erp-action-fiscal-input .input-group-text {
    min-height: 30px;
    border-color: var(--zetra-sidebar-border) !important;
    font-size: 11px !important;
}

.erp-action-fiscal-input .form-control {
    padding: 4px 6px !important;
    text-align: right;
    font-weight: 800;
}

.erp-action-fiscal-input .input-group-text {
    padding: 4px 6px !important;
    color: var(--zetra-sidebar-muted) !important;
    background: var(--zetra-sidebar-bg) !important;
    font-weight: 800;
}

.erp-action-fiscal-meta {
    margin-top: 5px;
    color: var(--zetra-sidebar-muted) !important;
    font-size: 10px;
    font-weight: 600;
    line-height: 1.25;
}

html.dark-mode .erp-action-fiscal-panel,
[data-bs-theme="dark"] .erp-action-fiscal-panel {
    background: rgba(255, 255, 255, .035) !important;
}

.navbar-end-toggler:not(.d-none) {
    width: 38px;
    height: 38px;
    min-width: 38px;
    padding: 0;
    border: 1px solid var(--zetra-header-border) !important;
    border-radius: 10px;
    color: var(--zetra-header-muted);
    background: var(--zetra-header-surface) !important;
    box-shadow: none !important;
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    flex-direction: row !important;
    flex: 0 0 38px;
    gap: 0 !important;
    text-decoration: none;
    transition: background .16s ease, border-color .16s ease, color .16s ease, box-shadow .16s ease, transform .16s ease;
    position: static !important;
    top: auto !important;
    right: auto !important;
    transform: none !important;
}

.navbar-end-toggler:not(.d-none):hover {
    color: var(--bs-primary, #348fe2);
    border-color: rgba(var(--bs-primary-rgb, 52, 143, 226), .30) !important;
    background: var(--zetra-header-surface-hover) !important;
}

.navbar-end-toggler .navbar-end-toggle-icon {
    width: 100%;
    height: 100%;
    color: inherit;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    line-height: 1;
}

.navbar-end-toggler .navbar-end-toggle-icon i,
#header.app-header > .navbar-nav > .navbar-item > .navbar-link[data-toggle="app-sidebar-end"] i {
    color: var(--zetra-header-muted);
    font-size: 15px;
    transition: color .16s ease, transform .16s ease;
}

.navbar-end-toggler:not(.d-none):hover .navbar-end-toggle-icon i,
.navbar-end-toggler:not(.d-none):focus .navbar-end-toggle-icon i,
#header.app-header > .navbar-nav > .navbar-item > .navbar-link[data-toggle="app-sidebar-end"]:hover i,
#header.app-header > .navbar-nav > .navbar-item > .navbar-link[data-toggle="app-sidebar-end"]:focus i {
    color: var(--bs-primary, #348fe2);
}

.navbar-end-toggler.active {
    color: #fff !important;
    background: var(--bs-primary, #348fe2) !important;
    border-color: var(--bs-primary, #348fe2) !important;
}

.navbar-end-toggler.active .navbar-end-toggle-icon i {
    color: #fff !important;
}

.navbar-end-toggler.active .icon-bar {
    background: #fff !important;
}

@media (max-width: 767.98px) {
    #header.app-header {
        display: flex !important;
        height: var(--zetra-mobile-header-height);
        min-height: var(--zetra-mobile-header-height);
        flex-direction: row;
        flex-wrap: nowrap;
        align-items: center;
        overflow-x: auto;
        overflow-y: hidden;
        scrollbar-width: none;
        -webkit-overflow-scrolling: touch;
        transition: box-shadow .16s ease;
    }

    #header.app-header.zetra-header-overflowing.zetra-header-can-scroll-right {
        box-shadow:
            var(--zetra-header-shadow),
            inset -28px 0 22px -24px var(--zetra-header-scroll-edge);
    }

    #header.app-header.zetra-header-overflowing.zetra-header-can-scroll-left {
        box-shadow:
            var(--zetra-header-shadow),
            inset 28px 0 22px -24px var(--zetra-header-scroll-edge);
    }

    #header.app-header.zetra-header-overflowing.zetra-header-can-scroll-left.zetra-header-can-scroll-right {
        box-shadow:
            var(--zetra-header-shadow),
            inset 28px 0 22px -24px var(--zetra-header-scroll-edge),
            inset -28px 0 22px -24px var(--zetra-header-scroll-edge);
    }

    #app.app-header-fixed {
        padding-top: var(--zetra-mobile-header-height) !important;
    }

    #header.app-header::-webkit-scrollbar {
        display: none;
    }

    #header.app-header .navbar-header {
        position: static;
        width: auto !important;
        height: var(--zetra-mobile-header-height);
        min-height: var(--zetra-mobile-header-height);
        flex: 0 0 auto;
        min-width: max-content;
        padding: 0 4px 0 10px;
        justify-content: flex-start;
        border-right: 1px solid var(--zetra-header-border);
        border-bottom: 0;
    }

    #header.app-header .navbar-brand {
        position: static;
        left: auto;
        top: auto;
        transform: none;
        width: auto;
        max-width: clamp(82px, 29vw, 126px);
        height: 38px;
        margin: 0 6px 0 4px;
        padding: 0 10px;
        border-radius: 10px;
        font-size: 14.5px;
    }

    #header.app-header .navbar-logo {
        width: 18px;
        height: 18px;
    }

    #header.app-header .navbar-mobile-toggler {
        position: static;
        top: auto;
        width: 38px;
        height: 38px;
        flex: 0 0 38px;
        margin: 0 4px;
        border-radius: 10px;
    }

    #header.app-header .navbar-mobile-toggler[data-toggle="app-sidebar-mobile"],
    #header.app-header .navbar-mobile-toggler[data-bs-toggle="collapse"] {
        left: auto;
    }

    #header.app-header .navbar-mobile-toggler[data-toggle="app-sidebar-end-mobile"],
    #header.app-header .navbar-mobile-toggler[data-toggle="erp-action-sidebar"] {
        right: auto;
    }

    #header.app-header > .navbar-nav {
        position: static;
        gap: 4px;
        width: auto !important;
        min-width: max-content;
        height: var(--zetra-mobile-header-height);
        flex: 0 0 auto;
        margin-left: 0 !important;
        margin-right: auto !important;
        padding: 0 8px 0 4px;
        justify-content: flex-start;
        background: transparent;
    }

    #header.app-header > .navbar-nav > .navbar-item {
        height: var(--zetra-mobile-header-height);
    }

    #header.app-header > .navbar-nav > .navbar-item > .navbar-link {
        min-width: 36px;
        height: 36px;
        padding: 0 8px;
        border-radius: 9px;
    }

    #header.app-header .navbar-end-toggler:not(.d-none) {
        width: 36px;
        height: 36px;
        min-width: 36px;
        flex-basis: 36px;
        border-radius: 9px;
    }

    #header.app-header #financialYearSelector :is(.navbar-link, .dropdown > .btn) {
        min-width: auto;
        width: auto;
        height: 36px;
        padding: 0 8px;
        gap: 3px;
        border-radius: 9px;
    }

    #header.app-header #currentYearDisplay {
        min-width: 29px;
    }

    #header.app-header:has(#headerQuickActionsItem:not(.d-none)) .navbar-brand {
        max-width: 88px;
    }

    #header.app-header:has(#headerQuickActionsItem:not(.d-none)) .navbar-brand-suffix {
        display: none;
    }

    #header.app-header:has(#headerQuickActionsItem:not(.d-none)) > .navbar-nav {
        gap: 3px;
        padding-left: 3px;
        padding-right: 6px;
    }

    #header.app-header:has(#headerQuickActionsItem:not(.d-none)) #financialYearSelector :is(.navbar-link, .dropdown > .btn) {
        width: 78px;
        min-width: 78px;
        max-width: 78px;
        padding: 0 6px;
    }

    #header.app-header:has(#headerQuickActionsItem:not(.d-none)) #financialYearSelector :is(.caret, .dropdown-toggle::after) {
        display: none;
    }
}

@media (max-width: 389.98px) {
    #header.app-header:has(#headerQuickActionsItem:not(.d-none)) .navbar-brand {
        max-width: 76px;
        padding: 0 7px;
    }

    #header.app-header:has(#headerQuickActionsItem:not(.d-none)) #financialYearSelector :is(.navbar-link, .dropdown > .btn) {
        width: 72px;
        min-width: 72px;
        max-width: 72px;
    }
}

@media (max-width: 374.98px) {
    #header.app-header .navbar-brand {
        max-width: 74px;
        padding: 0 8px;
    }

    #header.app-header:has(#headerQuickActionsItem:not(.d-none)) .navbar-brand {
        max-width: 62px;
        padding: 0 7px;
    }

    #header.app-header .navbar-brand-suffix {
        display: none;
    }

    #header.app-header > .navbar-nav {
        gap: 3px;
        padding-right: 6px;
    }

    #header.app-header > .navbar-nav > .navbar-item > .navbar-link {
        min-width: 34px;
        height: 34px;
        padding: 0 7px;
    }

    #header.app-header:has(#headerQuickActionsItem:not(.d-none)) #financialYearSelector :is(.navbar-link, .dropdown > .btn) {
        width: 72px;
        min-width: 72px;
        max-width: 72px;
    }
}

@media (max-width: 339.98px) {
    #header.app-header .navbar-header {
        padding-left: 7px;
        padding-right: 2px;
    }

    #header.app-header .navbar-mobile-toggler {
        width: 36px;
        height: 36px;
        flex-basis: 36px;
        margin-inline: 3px;
    }

    #header.app-header .navbar-brand {
        width: 34px;
        min-width: 34px;
        height: 36px;
        margin-left: 2px;
        margin-right: 4px;
        padding: 0;
        justify-content: center;
    }

    #header.app-header .navbar-brand-text {
        display: none;
    }

    #header.app-header > .navbar-nav {
        gap: 2px;
        padding-left: 2px;
        padding-right: 4px;
    }

    #header.app-header > .navbar-nav > .navbar-item > .navbar-link,
    #header.app-header .navbar-end-toggler:not(.d-none) {
        min-width: 32px;
        width: 32px;
        height: 34px;
        padding: 0 6px;
    }

    #header.app-header:has(#headerQuickActionsItem:not(.d-none)) #financialYearSelector :is(.navbar-link, .dropdown > .btn) {
        width: 56px;
        min-width: 56px;
        max-width: 56px;
        padding: 0 5px;
    }

    #header.app-header:has(#headerQuickActionsItem:not(.d-none)) #financialYearSelector .fa-calendar-alt {
        display: none;
    }
}

#app.app-sidebar-minified #sidebar.app-sidebar .menu-profile {
    margin: 8px 6px 12px;
    border-color: transparent;
    background: transparent !important;
}

#app.app-sidebar-minified #sidebar.app-sidebar .menu-profile-link {
    justify-content: center;
    padding: 8px !important;
}

#app.app-sidebar-minified #sidebar.app-sidebar .menu-profile-info,
#app.app-sidebar-minified #sidebar.app-sidebar .menu-header,
#app.app-sidebar-minified #sidebar.app-sidebar .menu-text,
#app.app-sidebar-minified #sidebar.app-sidebar .menu-caret,
#app.app-sidebar-minified #sidebar.app-sidebar .sidebar-badge,
#app.app-sidebar-minified #sidebar.app-sidebar .menu-badge {
    display: none !important;
}

#app.app-sidebar-minified #sidebar.app-sidebar .menu .menu-link {
    justify-content: center;
    min-height: 40px;
    padding: 0 !important;
}

#app.app-sidebar-minified #sidebar.app-sidebar .menu .menu-icon {
    width: 32px !important;
    min-width: 32px !important;
    height: 32px;
}

@media (max-width: 767.98px) {
    #sidebar.app-sidebar {
        top: var(--zetra-mobile-header-height);
        height: calc(100dvh - var(--zetra-mobile-header-height));
        z-index: 1040;
        box-shadow: 18px 0 44px rgba(15, 23, 42, .28);
    }

    #sidebar.app-sidebar .app-sidebar-content {
        height: 100% !important;
        padding-top: 14px;
    }

    #sidebar.app-sidebar .menu .menu-link {
        min-height: 44px;
        font-size: 14px;
    }

    #sidebar.app-sidebar .menu .menu-submenu .menu-link {
        min-height: 40px;
        font-size: 13px;
    }
}

@media (max-width: 991.98px) {
    .erp-action-sidebar {
        width: 274px !important;
        max-width: 84vw !important;
        box-shadow: none !important;
    }

    .erp-action-sidebar.open {
        box-shadow: -18px 0 44px rgba(15, 23, 42, .28) !important;
    }

    .erp-action-sidebar.open .erp-action-sidebar-inner {
        padding: 14px !important;
    }

    .erp-action-sidebar.open .erp-action-item {
        min-height: 44px;
        font-size: 14px !important;
    }

    .erp-action-sidebar.open .erp-action-label {
        font-size: 14px !important;
    }

    .erp-action-overlay.active {
        background: rgba(15, 23, 42, .42) !important;
        backdrop-filter: blur(2px);
    }
}
