@import '_content/Blazored.Modal/Blazored.Modal.bundle.scp.css';
@import '_content/Havit.Blazor.Components.Web.Bootstrap/Havit.Blazor.Components.Web.Bootstrap.628fccizqu.bundle.scp.css';
@import '_content/Opsyte.BlazorDateRangePicker/Opsyte.BlazorDateRangePicker.twpxxyougk.bundle.scp.css';
@import '_content/Opsyte.Portal.Stock/Opsyte.Portal.Stock.hiecaojhft.bundle.scp.css';
@import '_content/Opsyte.Portal.UX/Opsyte.Portal.UX.kp1v63aihn.bundle.scp.css';

/* /Pages/ReconnectModal.razor.rz.scp.css */
.components-reconnect-first-attempt-visible[b-e1v6pba3mr],
.components-reconnect-repeated-attempt-visible[b-e1v6pba3mr],
.components-reconnect-failed-visible[b-e1v6pba3mr],
.components-pause-visible[b-e1v6pba3mr],
.components-resume-failed-visible[b-e1v6pba3mr],
.components-rejoining-animation[b-e1v6pba3mr] {
    display: none;
}

#components-reconnect-modal.components-reconnect-show .components-reconnect-first-attempt-visible[b-e1v6pba3mr],
#components-reconnect-modal.components-reconnect-show .components-rejoining-animation[b-e1v6pba3mr],
#components-reconnect-modal.components-reconnect-paused .components-pause-visible[b-e1v6pba3mr],
#components-reconnect-modal.components-reconnect-resume-failed .components-resume-failed-visible[b-e1v6pba3mr],
#components-reconnect-modal.components-reconnect-retrying[b-e1v6pba3mr],
#components-reconnect-modal.components-reconnect-retrying .components-reconnect-repeated-attempt-visible[b-e1v6pba3mr],
#components-reconnect-modal.components-reconnect-retrying .components-rejoining-animation[b-e1v6pba3mr],
#components-reconnect-modal.components-reconnect-failed[b-e1v6pba3mr],
#components-reconnect-modal.components-reconnect-failed .components-reconnect-failed-visible[b-e1v6pba3mr] {
    display: block;
}


#components-reconnect-modal[b-e1v6pba3mr] {
    background-color: white;
    width: 20rem;
    margin: 20vh auto;
    padding: 2rem;
    border: 0;
    border-radius: 0.5rem;
    box-shadow: 0 3px 6px 2px rgba(0, 0, 0, 0.3);
    opacity: 0;
    transition: display 0.5s allow-discrete, overlay 0.5s allow-discrete;
    animation: components-reconnect-modal-fadeOutOpacity-b-e1v6pba3mr 0.5s both;
    &[open]

{
    animation: components-reconnect-modal-slideUp-b-e1v6pba3mr 1.5s cubic-bezier(.05, .89, .25, 1.02) 0.3s, components-reconnect-modal-fadeInOpacity-b-e1v6pba3mr 0.5s ease-in-out 0.3s;
    animation-fill-mode: both;
}

}

#components-reconnect-modal[b-e1v6pba3mr]::backdrop {
    background-color: rgba(0, 0, 0, 0.4);
    animation: components-reconnect-modal-fadeInOpacity-b-e1v6pba3mr 0.5s ease-in-out;
    opacity: 1;
}

@keyframes components-reconnect-modal-slideUp-b-e1v6pba3mr {
    0% {
        transform: translateY(30px) scale(0.95);
    }

    100% {
        transform: translateY(0);
    }
}

@keyframes components-reconnect-modal-fadeInOpacity-b-e1v6pba3mr {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

@keyframes components-reconnect-modal-fadeOutOpacity-b-e1v6pba3mr {
    0% {
        opacity: 1;
    }

    100% {
        opacity: 0;
    }
}

.components-reconnect-container[b-e1v6pba3mr] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1rem;
}

#components-reconnect-modal p[b-e1v6pba3mr] {
    margin: 0;
    text-align: center;
}

#components-reconnect-modal button[b-e1v6pba3mr] {
    border: 0;
    background-color: #6b9ed2;
    color: white;
    padding: 4px 24px;
    border-radius: 4px;
}

    #components-reconnect-modal button:hover[b-e1v6pba3mr] {
        background-color: #3b6ea2;
    }

    #components-reconnect-modal button:active[b-e1v6pba3mr] {
        background-color: #6b9ed2;
    }

.components-rejoining-animation[b-e1v6pba3mr] {
    position: relative;
    width: 80px;
    height: 80px;
}

    .components-rejoining-animation div[b-e1v6pba3mr] {
        position: absolute;
        border: 3px solid #0087ff;
        opacity: 1;
        border-radius: 50%;
        animation: components-rejoining-animation-b-e1v6pba3mr 1.5s cubic-bezier(0, 0.2, 0.8, 1) infinite;
    }

        .components-rejoining-animation div:nth-child(2)[b-e1v6pba3mr] {
            animation-delay: -0.5s;
        }

@keyframes components-rejoining-animation-b-e1v6pba3mr {
    0% {
        top: 40px;
        left: 40px;
        width: 0;
        height: 0;
        opacity: 0;
    }

    4.9% {
        top: 40px;
        left: 40px;
        width: 0;
        height: 0;
        opacity: 0;
    }

    5% {
        top: 40px;
        left: 40px;
        width: 0;
        height: 0;
        opacity: 1;
    }

    100% {
        top: 0px;
        left: 0px;
        width: 80px;
        height: 80px;
        opacity: 0;
    }
}
/* /Shared/AuthLayout.razor.rz.scp.css */
.content-noscroll[b-m1wsemiscs] {
    background-color: hsla(187, 0%, 88%, 1);
    background-image: radial-gradient(at var(--g-1-x) var(--g-1-y), hsla(32, 86%, 79%, .7) 0px, transparent 50%), radial-gradient(at var(--g-2-x) var(--g-2-y), hsla(267, 99%, 78%, .7) 0px, transparent 50%), radial-gradient(at var(--g-3-x) var(--g-3-y), hsla(143, 77%, 66%, .7) 0px, transparent 50%), radial-gradient(at var(--g-4-x) var(--g-4-y), hsla(179, 76%, 62%, .7) 0px, transparent 50%);
    animation: 41s g-1-x-b-m1wsemiscs infinite, 21s g-1-y-b-m1wsemiscs infinite, 34s g-2-x-b-m1wsemiscs infinite, 42s g-2-y-b-m1wsemiscs infinite, 28s g-3-x-b-m1wsemiscs infinite, 50s g-3-y-b-m1wsemiscs infinite, 36s g-4-x-b-m1wsemiscs infinite, 47s g-4-y-b-m1wsemiscs infinite;
}

@property --g-1-x {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 7%;
}

@property --g-1-y {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 80%;
}

@property --g-2-x {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 99%;
}

@property --g-2-y {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 91%;
}

@property --g-3-x {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 56%;
}

@property --g-3-y {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 12%;
}

@property --g-4-x {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 1%;
}

@property --g-4-y {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 14%;
}

@keyframes g-1-x-b-m1wsemiscs {
    50% {
        --g-1-x: 93%;
    }
}

@keyframes g-1-y-b-m1wsemiscs {
    50% {
        --g-1-y: 1%;
    }
}

@keyframes g-2-x-b-m1wsemiscs {
    50% {
        --g-2-x: 30%;
    }
}

@keyframes g-2-y-b-m1wsemiscs {
    50% {
        --g-2-y: 1%;
    }
}

@keyframes g-3-x-b-m1wsemiscs {
    25% {
        --g-3-x: 89%;
    }

    75% {
        --g-3-x: 8%;
    }
}

@keyframes g-3-y-b-m1wsemiscs {
    50% {
        --g-3-y: 98%;
    }
}

@keyframes g-4-x-b-m1wsemiscs {
    50% {
        --g-4-x: 98%;
    }
}

@keyframes g-4-y-b-m1wsemiscs {
    50% {
        --g-4-y: 98%;
    }
}
/* /Shared/AuthorizingSplash.razor.rz.scp.css */
.authorizing-page[b-qer7wzydut] {
    width: 100%;
    height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: hsla(187, 0%, 88%, 1);
    background-image: radial-gradient( at var(--g-1-x) var(--g-1-y), hsla(32, 86%, 79%, .7) 0px, transparent 50% ), radial-gradient( at var(--g-2-x) var(--g-2-y), hsla(267, 99%, 78%, .7) 0px, transparent 50% ), radial-gradient( at var(--g-3-x) var(--g-3-y), hsla(143, 77%, 66%, .7) 0px, transparent 50% ), radial-gradient( at var(--g-4-x) var(--g-4-y), hsla(179, 76%, 62%, .7) 0px, transparent 50% );
    animation: 41s g-1-x-b-qer7wzydut infinite, 21s g-1-y-b-qer7wzydut infinite, 34s g-2-x-b-qer7wzydut infinite, 42s g-2-y-b-qer7wzydut infinite, 28s g-3-x-b-qer7wzydut infinite, 50s g-3-y-b-qer7wzydut infinite, 36s g-4-x-b-qer7wzydut infinite, 47s g-4-y-b-qer7wzydut infinite;
}

.authorizing-content[b-qer7wzydut] {
    text-align: center;
}

.authorizing-logo[b-qer7wzydut] {
    width: 200px;
    margin: 0 auto 2rem;
}

@property --g-1-x {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 7%;
}

@property --g-1-y {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 80%;
}

@property --g-2-x {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 99%;
}

@property --g-2-y {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 91%;
}

@property --g-3-x {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 56%;
}

@property --g-3-y {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 12%;
}

@property --g-4-x {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 1%;
}

@property --g-4-y {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 14%;
}

@keyframes g-1-x-b-qer7wzydut {
    50% {
        --g-1-x: 93%;
    }
}

@keyframes g-1-y-b-qer7wzydut {
    50% {
        --g-1-y: 1%;
    }
}

@keyframes g-2-x-b-qer7wzydut {
    50% {
        --g-2-x: 30%;
    }
}

@keyframes g-2-y-b-qer7wzydut {
    50% {
        --g-2-y: 1%;
    }
}

@keyframes g-3-x-b-qer7wzydut {
    25% {
        --g-3-x: 89%;
    }

    75% {
        --g-3-x: 8%;
    }
}

@keyframes g-3-y-b-qer7wzydut {
    50% {
        --g-3-y: 98%;
    }
}

@keyframes g-4-x-b-qer7wzydut {
    50% {
        --g-4-x: 98%;
    }
}

@keyframes g-4-y-b-qer7wzydut {
    50% {
        --g-4-y: 98%;
    }
}
/* /Shared/Header.razor.rz.scp.css */
.large-date-picker[b-qhzno5jrgf] {
    display: block;
}

.small-date-picker[b-qhzno5jrgf] {
    display: none;
}

[b-qhzno5jrgf] .weekpicker .hx-calendar-week:has(.hx-calendar-day-selected) .hx-calendar-day {
    color: var(--hx-calendar-day-selected-color);
    background: var(--hx-calendar-day-selected-background);
    border: var(--hx-calendar-day-selected-border);
}

[b-qhzno5jrgf] .weekpicker .hx-calendar-week:has(.hx-calendar-day:hover) .hx-calendar-day {
    background: var(--hx-calendar-day-hover-background);
    color: unset;
}

/* Remove any gaps between day buttons in HxCalendar weeks */
[b-qhzno5jrgf] .weekpicker .hx-calendar-week {
    display: flex !important;
    gap: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    border-collapse: collapse !important;
}

    [b-qhzno5jrgf] .weekpicker .hx-calendar-week .hx-calendar-day {
        margin: 0 !important;
        padding: 0 !important;
        border: none !important;
        border-radius: 0 !important;
        box-sizing: border-box !important;
        flex: 1 1 0 !important;
    }


@media (max-width: 991.98px) { /* Bootstrap 'md' breakpoint and below */
    .large-date-picker[b-qhzno5jrgf] {
        display: none;
    }

    .small-date-picker[b-qhzno5jrgf] {
        display: block;
    }
}

@media (max-width: 575.98px) { /* Bootstrap 'xs' breakpoint and below */
    .large-date-picker[b-qhzno5jrgf] {
        display: none;
    }

    .small-date-picker[b-qhzno5jrgf] {
        display: none;
    }

    [b-qhzno5jrgf] .hidden-small {
        display: none !important;
    }
}
/* /Shared/MainLayout.razor.rz.scp.css */
@media screen and (min-width: 992px) {
    .sidebar-l.sidebar-o.sidebar-mini[b-28vjy2zv5j]  #sidebar {
        -webkit-transform: translateX(-120px) translateY(0) translateZ(0);
        -ms-transform: translateX(-120px) translateY(0);
        transform: translateX(-120px) translateY(0) translateZ(0)
    }

    .sidebar-r.sidebar-o.sidebar-mini[b-28vjy2zv5j]  #sidebar {
        -webkit-transform: translateX(120px) translateY(0) translateZ(0);
        -ms-transform: translateX(120px) translateY(0);
        transform: translateX(120px) translateY(0) translateZ(0)
    }

    .sidebar-o.sidebar-mini[b-28vjy2zv5j]  #sidebar .sidebar-content {
        width: 180px;
    }

    .sidebar-l.sidebar-o.sidebar-mini[b-28vjy2zv5j]  #sidebar .sidebar-content {
        -webkit-transform: translateX(120px) translateY(0) translateZ(0);
        -ms-transform: translateX(120px) translateY(0);
        transform: translateX(120px) translateY(0) translateZ(0)
    }

    .sidebar-o.sidebar-mini[b-28vjy2zv5j]  .sidebar-mini-hide {
        opacity: 0;
        -webkit-transition: opacity .28s ease-out;
        transition: opacity .28s ease-out;
    }

    .sidebar-o:not(.sidebar-mini)[b-28vjy2zv5j]  .sidebar-shown-hide {
        display: none !important;
    }

    .sidebar-o.sidebar-mini[b-28vjy2zv5j]  #sidebar .nav-main > li.open > ul {
        display: none;
    }

    .sidebar-o.sidebar-mini[b-28vjy2zv5j]  #sidebar:hover .nav-main > li.open > ul {
        display: block;
    }

    #page-container.sidebar-l.sidebar-o[b-28vjy2zv5j] {
        padding-left: 180px
    }

        #page-container.sidebar-l.sidebar-o.sidebar-mini[b-28vjy2zv5j] {
            padding-left: 60px;
        }

    #page-container.header-navbar-fixed.sidebar-l.sidebar-o[b-28vjy2zv5j]  #header-navbar {
        left: 180px;
    }

    #page-container.header-navbar-fixed.sidebar-l.sidebar-o.sidebar-mini[b-28vjy2zv5j]  #header-navbar {
        left: 60px;
    }

    /* Stock keeps the wider workspace sidebar; all other modules retain the standard 180px layout. */
    #page-container.stock-mode.sidebar-l.sidebar-o:not(.sidebar-mini)[b-28vjy2zv5j] {
        padding-left: 210px;
    }

    #page-container.stock-mode.header-navbar-fixed.sidebar-l.sidebar-o:not(.sidebar-mini)[b-28vjy2zv5j]  #header-navbar {
        left: 210px;
    }

    #page-container.stock-mode.sidebar-l.sidebar-o.sidebar-mini[b-28vjy2zv5j]  #sidebar {
        -webkit-transform: translateX(-150px) translateY(0) translateZ(0);
        -ms-transform: translateX(-150px) translateY(0);
        transform: translateX(-150px) translateY(0) translateZ(0);
    }

    #page-container.stock-mode.sidebar-r.sidebar-o.sidebar-mini[b-28vjy2zv5j]  #sidebar {
        -webkit-transform: translateX(150px) translateY(0) translateZ(0);
        -ms-transform: translateX(150px) translateY(0);
        transform: translateX(150px) translateY(0) translateZ(0);
    }

    #page-container.stock-mode.sidebar-o.sidebar-mini[b-28vjy2zv5j]  #sidebar .sidebar-content {
        width: 210px;
    }

    #page-container.stock-mode.sidebar-l.sidebar-o.sidebar-mini[b-28vjy2zv5j]  #sidebar .sidebar-content {
        -webkit-transform: translateX(150px) translateY(0) translateZ(0);
        -ms-transform: translateX(150px) translateY(0);
        transform: translateX(150px) translateY(0) translateZ(0);
    }
}

div.header-navbar-fixed:not(.sidebar-mini)[b-28vjy2zv5j]  #sidebar:hover ul.nav-header.pull-right.side-bar-btn li {
    float: right !important;
}

div.sidebar-mini[b-28vjy2zv5j]  ul.nav-header.pull-right.side-bar-btn {
    float: left !important;
}

    div.sidebar-mini[b-28vjy2zv5j]  ul.nav-header.pull-right.side-bar-btn li {
        float: left !important;
        margin-left: 0px !important;
    }

.sidebar-o.sidebar-mini[b-28vjy2zv5j]  #sidebar:hover, .sidebar-o.sidebar-mini[b-28vjy2zv5j]  #sidebar:hover .sidebar-content {
    -webkit-transform: translateX(0) translateY(0) translateZ(0);
    -ms-transform: translateX(0) translateY(0);
    transform: translateX(0) translateY(0) translateZ(0);
}

    .sidebar-o.sidebar-mini[b-28vjy2zv5j]  #sidebar:hover .sidebar-mini-hide:not(.hide-even-on-hover) {
        opacity: 1 !important;
    }


.sidebar-mini[b-28vjy2zv5j]  #sidebar {
    box-shadow: 2px 0px 5px #888;
}

#page-container[b-28vjy2zv5j] {
    margin: 0 auto;
    width: 100%;
    min-width: 320px;
    background-color: #2c343f;
}
/* /Shared/Sidebar.razor.rz.scp.css */
#sidebar[b-o13bfkls9q] {
    width: 180px;
    background-color: #23282D;
    overflow: hidden;
}

@media screen and (min-width: 992px) {
    #sidebar[b-o13bfkls9q] {
        width: 180px;
    }
}

.sidebar-logo[b-o13bfkls9q] {
    width: 80%;
    -webkit-transition: -webkit-transform .25s ease-in-out;
    transition: transform .25s ease-in-out;
}

    .sidebar-logo:hover[b-o13bfkls9q] {
        -webkit-transform: scale(1.05);
        transform: scale(1.05);
    }

.operator-view-btn.sidebar-o[b-o13bfkls9q] {
    margin: 4px;
    padding-inline-start: 0px;
    padding-right: 0px !important;
}

    .operator-view-btn.sidebar-o a[b-o13bfkls9q] {
        padding-top: 6px;
        padding-bottom: 6px;
        padding-inline-start: 14px !important;
    }

.operator-view-btn[b-o13bfkls9q] {
    --operator-background: #23282D;
    transition: all 0.28s ease-out;
    will-change: transform;
    width: 172px;
}

    .operator-view-btn a[b-o13bfkls9q] {
        overflow: hidden;
    }

.sidebar-l.sidebar-o.sidebar-mini #sidebar:not(:hover) .operator-view-btn[b-o13bfkls9q] {
    width: 50px;
}

.sidebar-l.sidebar-o.sidebar-mini #sidebar .operator-view-btn a[b-o13bfkls9q] {
    width: 180px;
}

#sidebar:not(:hover) .hide-on-no-sidebar-hover[b-o13bfkls9q] {
    opacity: 0;
}

.pin-button:hover[b-o13bfkls9q] {
    color: white !important;
}


.company-group-name[b-o13bfkls9q] {
    color: var(--bs-primary);
    text-align: center;
}

.company-name[b-o13bfkls9q] {
    font-size: 13px;
    color: var(--bs-primary);
    text-align: center;
}

.nav-main a > img.sidebar-icon[b-o13bfkls9q] {
    display: inline-block;
    min-width: 14px;
    width: 14px;
    height: 14px;
    margin-right: 15px;
    vertical-align: -0.125em;
}

/* ---------- grouped Stock sub-navigation ---------- */
.stock-subnav-group[b-o13bfkls9q] {
    list-style: none;
    padding: 0 .5rem 0 1rem;
    margin: .55rem 0 .12rem;
    color: rgba(255, 255, 255, .34);
    font-size: .56rem;
    font-weight: 700;
    letter-spacing: .09em;
    text-transform: uppercase;
    line-height: 1.2;
}

    .stock-subnav-group:first-child[b-o13bfkls9q] {
        margin-top: .1rem;
    }

.stock-subnav-soon[b-o13bfkls9q] {
    list-style: none;
    display: flex;
    align-items: center;
    gap: .5rem;
    margin: 1px .45rem;
    padding: .3rem .55rem;
    color: rgba(255, 255, 255, .28);
    font-size: .82rem;
    cursor: default;
}

    .stock-subnav-soon > i[b-o13bfkls9q] {
        opacity: .55;
        font-size: .82rem;
    }

/* ::deep so the pill also styles when rendered inside SidebarItemLink (e.g. the AI Queue "Preview" badge). */
.stock-subnav-badge[b-o13bfkls9q],
[b-o13bfkls9q] .stock-subnav-badge {
    margin-left: auto;
    padding: .02rem .35rem;
    border-radius: 999px;
    background: rgba(255, 255, 255, .09);
    color: rgba(255, 255, 255, .5);
    font-size: .52rem;
    font-weight: 700;
    letter-spacing: .05em;
    text-transform: uppercase;
}

/* Red exception counter (StockNeedsMappingBadge): unmapped till lines on Setup & data → PLU mapping.
   ::deep because it renders inside a child component — SidebarMenuItem's header fragment on the group
   row, SidebarItemLink's row on the page link. Both rows are flex (see .nav-stock-ws ::deep li > a), so
   margin-left:auto parks it on the right; on the group row that lands just inside the chevron's 30px. */
.stock-nav-alert-count[b-o13bfkls9q],
[b-o13bfkls9q] .stock-nav-alert-count {
    flex: 0 0 auto;
    margin-left: auto;
    min-width: 1.15rem;
    padding: .05rem .3rem;
    border-radius: 999px;
    background: #d9384a;
    color: #fff;
    font-size: .62rem;
    font-weight: 800;
    line-height: 1.35;
    text-align: center;
}

/* opsyte_custom.css greys every span inside an open group (`li.menu.open span {color:#646464}`), which
   out-specifies the colour set above and leaves the counter grey-on-red on the page rows — the group
   header row only escapes it because of the explicit `> a.nav-submenu > span` rule further down. Pin
   the counter white (and hold its weight) wherever inside an open group it renders. */
.nav-stock-ws[b-o13bfkls9q]  li.menu.open .stock-nav-alert-count {
    color: #fff;
    font-weight: 800;
}

/* ---------- Stock workspace mode: stacked "opsyte / stock" wordmark ---------- */
.stock-wordmark[b-o13bfkls9q] {
    margin-top: -.6rem;
    margin-bottom: .1rem;
    font-size: 1.55rem;
    font-weight: 800;
    line-height: 1;
    letter-spacing: -.02em;
    color: #fff;
    /* Same grow-on-hover as .sidebar-logo above — driven by .sidebar-brand-lockup.is-stock below. */
    -webkit-transition: -webkit-transform .25s ease-in-out;
    transition: transform .25s ease-in-out;
}

/* In the Stock workspace the logo and the "stock" wordmark are one stacked lockup, so hovering
   either half expands and contracts both together. Outside Stock the wrapper carries no .is-stock
   and the logo keeps its own independent hover (.sidebar-logo:hover, above) unchanged. */
.sidebar-brand-lockup.is-stock:hover .sidebar-logo[b-o13bfkls9q],
.sidebar-brand-lockup.is-stock:hover .stock-wordmark[b-o13bfkls9q] {
    -webkit-transform: scale(1.05);
    transform: scale(1.05);
}

/* Compact, modern link rows — pierces into SidebarItemLink's <li> > <a>.
   Operator AI is <li> > <div> > <a>, so it is deliberately untouched. */
.nav-stock-ws[b-o13bfkls9q]  li > a {
    display: flex;
    align-items: center;
    margin: 2px .45rem;
    padding: .42rem .6rem;
    border-radius: 7px;
    font-size: .82rem;
    line-height: 1.3;
    color: rgba(255, 255, 255, .66);
    transition: background .15s ease, color .15s ease;
}

/* Operator AI is <li> > <div> > <a>, so the row rule above deliberately misses it and it kept its own
   rhythm (margin 4px / padding 6px) — leaving an uneven gap above Overview. Match it to the stock rows
   so Operator AI · Overview · the first flyout are evenly spaced. Horizontal margin stays 4px:
   .operator-view-btn has a fixed 202px width tied to the sidebar-mini collapse animation. */
.nav-stock-ws[b-o13bfkls9q]  .operator-view-btn.sidebar-o {
    margin: 2px 4px;
}

    .nav-stock-ws[b-o13bfkls9q]  .operator-view-btn.sidebar-o a {
        padding-top: .42rem;
        padding-bottom: .42rem;
    }

.nav-stock-ws[b-o13bfkls9q]  li > a > i {
    margin-right: .5rem !important;
    font-size: .82rem;
    opacity: .6;
    transition: opacity .15s ease, color .15s ease;
}

.nav-stock-ws[b-o13bfkls9q]  li > a:hover {
    background: rgba(255, 255, 255, .07);
    color: #fff;
}

    .nav-stock-ws[b-o13bfkls9q]  li > a:hover > i {
        opacity: .9;
    }

.nav-stock-ws[b-o13bfkls9q]  li > a.active {
    background: rgba(255, 255, 255, .1);
    color: #fff;
    font-weight: 600;
    box-shadow: inset 2px 0 0 var(--bs-primary);
}

    .nav-stock-ws[b-o13bfkls9q]  li > a.active > i {
        opacity: 1;
        color: var(--bs-primary);
    }

/* ---------- Stock workspace: collapsible flyout groups (SidebarMenuItem) ---------- */
/* Leave room on the right for the FontAwesome chevron the global .nav-submenu:before draws. */
.nav-stock-ws[b-o13bfkls9q]  a.nav-submenu {
    padding-right: 1.7rem;
}

    .nav-stock-ws[b-o13bfkls9q]  a.nav-submenu:before {
        right: .55rem;
        color: rgba(255, 255, 255, .38);
    }

/* opsyte_custom.css themes an OPEN group for the LIGHT main-portal sidebar — it paints the whole group
   `.menu.open {background:#f5f5f5; border-radius:20px 0 0 20px}` and greys the labels
   (`li.menu.open span{color:#646464}`, `.nav-main li.open a{color:#646464}`, near-black on hover/active).
   On the dark stock sidebar that renders white-on-near-white. Re-theme the open group for dark chrome. */
.nav-stock-ws[b-o13bfkls9q]  li.menu.open {
    background-color: transparent;
    border-radius: 0;
}

    /* Open group header — the label sits in its own <span>, which the global rule greys out, so colour the
   span too or the heading stays #646464 regardless of the colour set on the <a>. */
    .nav-stock-ws[b-o13bfkls9q]  li.menu.open > a.nav-submenu,
    .nav-stock-ws[b-o13bfkls9q]  li.menu.open > a.nav-submenu > i,
    .nav-stock-ws[b-o13bfkls9q]  li.menu.open > a.nav-submenu > span {
        color: #fff;
    }

        .nav-stock-ws[b-o13bfkls9q]  li.menu.open > a.nav-submenu > i {
            opacity: .95;
        }

        .nav-stock-ws[b-o13bfkls9q]  li.menu.open > a.nav-submenu:before {
            color: rgba(255, 255, 255, .55);
        }

        /* opsyte_custom.css bolds an open group's label (li.menu.open span {font-weight:bold}), which
       widens "Products & recipes" past the row and wraps it onto two lines. In the dark stock nav the
       open state is already signalled by the white colour, so pin the weight so opening never reflows
       the label. */
        .nav-stock-ws[b-o13bfkls9q]  li.menu.open > a.nav-submenu > span:not(.stock-nav-alert-count) {
            font-weight: 400;
        }

/* Guard: whatever a future label's length or weight, a top-level row never wraps — it ellipsizes.
   The row <a> is flex, so the span needs min-width:0 to be allowed to shrink. */
.nav-stock-ws[b-o13bfkls9q]  li > a > span {
    min-width: 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* Uniform vertical rhythm for the top-level rows. A closed flyout still keeps its sub-list <ul> in
   flow as height:0; overflow:hidden (OneUI), and that overflow:hidden BFC traps the header row's 2px
   bottom margin instead of letting it collapse the way the plain Overview/Guide rows do — so
   flyout→flyout gaps came out at 4px against 2px for Overview→first-flyout. Drop closed sub-lists out
   of flow so every top-level <a> is the last in-flow child of its <li> and collapses its margins the
   same way → even spacing between Overview, all five flyouts, and Guide. */
.nav-stock-ws[b-o13bfkls9q]  li.menu:not(.open) > ul {
    display: none;
}

/* Sub-items: tighter indent than the global 50px, faint inset rail under the open group. */
.nav-stock-ws[b-o13bfkls9q]  li.menu > ul {
    padding: .15rem 0 .3rem 1.25rem;
    background-color: rgba(0, 0, 0, .16);
}

/* Sub-item rows: beat `.nav-main li.open a{color:#646464}` and the global near-black hover/active. */
.nav-stock-ws[b-o13bfkls9q]  li.menu.open > ul > li > a {
    color: rgba(255, 255, 255, .74);
}

    .nav-stock-ws[b-o13bfkls9q]  li.menu.open > ul > li > a:hover,
    .nav-stock-ws[b-o13bfkls9q]  li.menu.open > ul > li > a:focus {
        background-color: rgba(255, 255, 255, .07);
        color: #fff;
        font-weight: 400; /* global sets bold on hover, which reflows the row */
    }

    .nav-stock-ws[b-o13bfkls9q]  li.menu.open > ul > li > a.active {
        background-color: rgba(255, 255, 255, .1);
        color: #fff;
        font-weight: 600;
    }

/* Standalone divider that separates the Guide link at the foot of the nav. */
.nav-stock-ws[b-o13bfkls9q]  .stock-ws-divider {
    list-style: none;
    height: 1px;
    margin: .5rem .7rem;
    background: rgba(255, 255, 255, .08);
}
/* /Shared/SidebarMenuItem.razor.rz.scp.css */
.nav-submenu[b-80jj2kszyy] {
    cursor: pointer;
}