/* /Components/Layout/HeaderToast.razor.rz.scp.css */
/* ── Header Toast ─────────────────────────────────────────────────────────── */




/* ── Wrapper pill ─────────────────────────────────────────────────────────── */

.ht-wrapper[b-6hd2vlbt3a] {
    position: relative;
    display: flex;
    align-items: center;
    overflow: hidden;
    min-height: 35px;
    max-width: 640px;
    width: 100%;
    border-radius: 4px;
    border: 1px solid var(--ht-border, rgba(255, 255, 255, 0.28));
    box-shadow: none;
    z-index: 10001 !important;
}

/* ── Enter / Leave animations ─────────────────────────────────────────────── */

.ht-enter[b-6hd2vlbt3a] {
    animation: ht-pop-in-b-6hd2vlbt3a 0.26s cubic-bezier(0.22, 1, 0.36, 1) both;
}

.ht-leave[b-6hd2vlbt3a] {
    animation: ht-pop-out-b-6hd2vlbt3a 0.22s cubic-bezier(0.55, 0, 1, 0.45) both;
}

@keyframes ht-pop-in-b-6hd2vlbt3a {
    from { opacity: 0; transform: translateY(-6px); }
    to   { opacity: 1; transform: translateY(0);    }
}

@keyframes ht-pop-out-b-6hd2vlbt3a {
    from { opacity: 1; transform: translateY(0);    }
    to   { opacity: 0; transform: translateY(-6px); }
}

/* ── Style variants ───────────────────────────────────────────────────────── */

/* Info — solid steel blue */
.ht-style-info[b-6hd2vlbt3a] {
    --ht-bg:             #17a2b8;
    --ht-border:         rgba(255, 255, 255, 0.18);
    --ht-icon-bg:        rgba(0, 0, 0, 0.18);
    --ht-icon-sep:       rgba(255, 255, 255, 0.14);
    --ht-title-color:    #ffffff;
    --ht-sep-color:      rgba(255, 255, 255, 0.38);
    --ht-msg-color:      rgba(255, 255, 255, 0.82);
    --ht-progress:       rgba(255, 255, 255, 0.55);
    --ht-progress-track: rgba(0, 0, 0, 0.20);
    --ht-badge-bg:       rgba(0, 0, 0, 0.22);
    --ht-badge-color:    rgba(255, 255, 255, 0.90);
    background: var(--ht-bg);
}

/* Success — solid forest green */
.ht-style-success[b-6hd2vlbt3a] {
    --ht-bg:             #28a745;
    --ht-border:         rgba(255, 255, 255, 0.18);
    --ht-icon-bg:        rgba(0, 0, 0, 0.18);
    --ht-icon-sep:       rgba(255, 255, 255, 0.14);
    --ht-title-color:    #ffffff;
    --ht-sep-color:      rgba(255, 255, 255, 0.38);
    --ht-msg-color:      rgba(255, 255, 255, 0.82);
    --ht-progress:       rgba(255, 255, 255, 0.55);
    --ht-progress-track: rgba(0, 0, 0, 0.20);
    --ht-badge-bg:       rgba(0, 0, 0, 0.22);
    --ht-badge-color:    rgba(255, 255, 255, 0.90);
    background: var(--ht-bg);
}

/* Warning — solid amber, dark text for WCAG contrast */
.ht-style-warning[b-6hd2vlbt3a] {
    --ht-bg:             #ffc107;
    --ht-border:         rgba(0, 0, 0, 0.16);
    --ht-icon-bg:        rgba(0, 0, 0, 0.14);
    --ht-icon-sep:       rgba(0, 0, 0, 0.14);
    --ht-title-color:    #212529;
    --ht-sep-color:      rgba(33, 37, 41, 0.40);
    --ht-msg-color:      rgba(33, 37, 41, 0.75);
    --ht-progress:       rgba(33, 37, 41, 0.40);
    --ht-progress-track: rgba(33, 37, 41, 0.14);
    --ht-badge-bg:       rgba(0, 0, 0, 0.16);
    --ht-badge-color:    rgba(33, 37, 41, 0.88);
    background: var(--ht-bg);
}

/* Danger — solid crimson */
.ht-style-danger[b-6hd2vlbt3a] {
    --ht-bg:             #dc3545;
    --ht-border:         rgba(255, 255, 255, 0.18);
    --ht-icon-bg:        rgba(0, 0, 0, 0.18);
    --ht-icon-sep:       rgba(255, 255, 255, 0.14);
    --ht-title-color:    #ffffff;
    --ht-sep-color:      rgba(255, 255, 255, 0.38);
    --ht-msg-color:      rgba(255, 255, 255, 0.82);
    --ht-progress:       rgba(255, 255, 255, 0.55);
    --ht-progress-track: rgba(0, 0, 0, 0.20);
    --ht-badge-bg:       rgba(0, 0, 0, 0.22);
    --ht-badge-color:    rgba(255, 255, 255, 0.90);
    background: var(--ht-bg);
}

/* ── Icon column ──────────────────────────────────────────────────────────── */

.ht-icon-col[b-6hd2vlbt3a] {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 35px;
    height: 100%;
    
    border-right: 1px solid var(--ht-icon-sep, rgba(255, 255, 255, 0.14));
    border-radius: 3px 0 0 3px;
}

.ht-icon[b-6hd2vlbt3a] {
    font-size: 13px;
    line-height: 1;
    display: block;
    color: var(--ht-title-color, #fff);
}

.ht-icon.icon-info[b-6hd2vlbt3a]::before {
    content: "\e800";
    font-family: 'e-icons';
}

.ht-icon.icon-success[b-6hd2vlbt3a]::before {
    content: "\e72b";
    font-family: 'e-icons';
}

.ht-icon.icon-warning[b-6hd2vlbt3a]::before {
    content: "\e88b";
    font-family: 'e-icons';
}

.ht-icon.icon-danger[b-6hd2vlbt3a]::before {
    content: "\e878";
    font-family: 'e-icons';
}

/* ── Text column ──────────────────────────────────────────────────────────── */

.ht-text-col[b-6hd2vlbt3a] {
    flex: 1;
    min-width: 0;
    padding: 0 10px;
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 5px;
    overflow: hidden;
    padding-top: 2px;
    padding-bottom: 2px;
}

/* Title — full opacity, bold */
.ht-title[b-6hd2vlbt3a] {
    font-size: 0.73rem;
    font-weight: 700;
    line-height: 1.2;
    white-space: nowrap;
    flex-shrink: 0;
    color: var(--ht-title-color, #fff);
    letter-spacing: 0.01em;
}

/* Separator dot */
.ht-sep[b-6hd2vlbt3a] {
    flex-shrink: 0;
    font-size: 0.6rem;
    line-height: 1;
    color: var(--ht-sep-color, rgba(255, 255, 255, 0.45));
    user-select: none;
}

/* Message — clearly readable but visually secondary to title */
.ht-message[b-6hd2vlbt3a] {
    font-size: 0.72rem;
    font-weight: 400;
    line-height: 1.2;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    color: var(--ht-msg-color, rgba(255, 255, 255, 0.88));
}

/* ── Queue badge ──────────────────────────────────────────────────────────── */

.ht-queue-badge[b-6hd2vlbt3a] {
    flex-shrink: 0;
    height: 16px;
    min-width: 20px;
    padding: 0 5px;
    border-radius: 3px;
    background: var(--ht-badge-bg, rgba(0, 0, 0, 0.22));
    color: var(--ht-badge-color, rgba(255, 255, 255, 0.90));
    font-size: 0.60rem;
    font-weight: 600;
    letter-spacing: 0.02em;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-right: 4px;
    border: 1px solid var(--ht-icon-sep, rgba(255, 255, 255, 0.16));
}

/* ── Close button ─────────────────────────────────────────────────────────── */

.ht-close[b-6hd2vlbt3a] {
    flex-shrink: 0;
    width: 28px;
    height: 100%;
    padding: 0;
    background: transparent;
    border: none;
    border-left: 1px solid var(--ht-icon-sep, rgba(255, 255, 255, 0.14));
    cursor: pointer;
    color: var(--ht-title-color, #fff);
    opacity: 0.60;
    font-size: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: opacity 0.15s ease, background 0.15s ease;
    border-radius: 0 3px 3px 0;
}

.ht-close:hover[b-6hd2vlbt3a] {
    opacity: 1;
    background: rgba(0, 0, 0, 0.16);
}

/* ── Auto-close progress bar ──────────────────────────────────────────────── */

.ht-progress-track[b-6hd2vlbt3a] {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 2px;
    background: var(--ht-progress-track, rgba(0, 0, 0, 0.18));
    border-radius: 0;
    overflow: hidden;
}

.ht-progress-bar[b-6hd2vlbt3a] {
    height: 100%;
    width: 100%;
    background: var(--ht-progress, rgba(255, 255, 255, 0.65));
    transform-origin: left center;
    animation: ht-drain-b-6hd2vlbt3a linear forwards;
    /* animation-duration is set inline */
}

@keyframes ht-drain-b-6hd2vlbt3a {
    from { transform: scaleX(1); }
    to   { transform: scaleX(0); }
}

/* /Components/Layout/MainLayoutSF.razor.rz.scp.css */
/* Syncfusion MainLayout Styles */

#sidebar-wrapper[b-1zeffvszq5] {
    --morse-background-color: #07519C;
    
}

.defaultToolbar[b-1zeffvszq5] {
    /*background: linear-gradient(90deg, #07519C 0%, #0860b3 52%, #0a5aa7 100%);*/
    background-color: #07519C;
    color: #fff;
    border-bottom: 1px solid rgba(255, 255, 255, 0.14);
    /*box-shadow: 0 8px 20px rgba(5, 47, 91, 0.18);*/
    padding: 0 10px 0 6px;
    position: relative;
    z-index: 999 !important;
    min-height: 40px;
    display: flex;
    align-items: center;
    overflow: hidden;
}

.toolbar-sidebar-open[b-1zeffvszq5] {
    --layout-sidebar-offset: 264px;
}

.toolbar-sidebar-closed[b-1zeffvszq5] {
    --layout-sidebar-offset: 58px;
}

.layout-toolbar-shell[b-1zeffvszq5] {
    width: 100%;
    min-height: 40px;
    display: flex;
    align-items: center;
    gap: 10px;
    min-width: 0;
}

.layout-toolbar-left-group[b-1zeffvszq5] {
    display: grid;
    grid-template-columns: var(--layout-sidebar-offset, 264px) minmax(0, 1fr);
    align-items: center;
    gap: 0;
    flex-shrink: 0;
    min-width: 0;
    height: 40px;
}

.layout-toolbar-brand[b-1zeffvszq5] {
    display: flex;
    align-items: center;
    gap: 8px;
    grid-column: 2;
    flex: 1 1 auto;
    min-width: 0;
    width: 100%;
}

.layout-toolbar-app[b-1zeffvszq5] {
    display: inline-flex;
    align-items: center;
    padding: 4px 8px;
    border-radius: 999px;
    border: 1px solid rgba(255, 255, 255, 0.14);
    background: rgba(255, 255, 255, 0.10);
    color: rgba(255, 255, 255, 0.96);
    font-size: 0.66rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    white-space: nowrap;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08);
}

.layout-toolbar-breadcrumb-pill[b-1zeffvszq5] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    min-width: 0;
    max-width: min(56vw, 760px);
    padding: 5px 11px;
    border-radius: 999px;
    border: 1px solid rgba(255, 255, 255, 0.16);
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.16), rgba(255, 255, 255, 0.08));
    box-shadow: 0 6px 16px rgba(3, 28, 56, 0.12), inset 0 1px 0 rgba(255, 255, 255, 0.08);
    backdrop-filter: blur(4px);
}

.layout-toolbar-breadcrumb-pill i[b-1zeffvszq5] {
    color: #d7e9ff;
    font-size: 0.75rem;
    flex-shrink: 0;
}

.layout-toolbar-actions[b-1zeffvszq5] {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-shrink: 0;
    height: 40px;
}

.layout-impersonation-picker[b-1zeffvszq5] {
    display: flex;
    align-items: center;
    flex: 0 1 270px;
    width: clamp(190px, 20vw, 270px);
    min-width: 190px;
    height: 30px;
}

#sidebar-wrapper[b-1zeffvszq5]  .layout-impersonation-picker .e-control-wrapper.layout-impersonation-select,
#sidebar-wrapper[b-1zeffvszq5]  .layout-impersonation-picker .layout-impersonation-select.e-input-group {
    min-height: 30px !important;
    height: 30px !important;
    border: 1px solid rgba(255, 255, 255, 0.18) !important;
    border-radius: 8px !important;
    background: rgba(255, 255, 255, 0.11) !important;
    box-shadow: none !important;
}

#sidebar-wrapper[b-1zeffvszq5]  .layout-impersonation-picker .e-input,
#sidebar-wrapper[b-1zeffvszq5]  .layout-impersonation-picker input {
    color: rgba(255, 255, 255, 0.96) !important;
    font-size: 0.72rem !important;
}

#sidebar-wrapper[b-1zeffvszq5]  .layout-impersonation-picker input::placeholder {
    color: rgba(255, 255, 255, 0.72) !important;
    opacity: 1;
}

#sidebar-wrapper[b-1zeffvszq5]  .layout-impersonation-picker .e-ddl-icon,
#sidebar-wrapper[b-1zeffvszq5]  .layout-impersonation-picker .e-clear-icon {
    color: rgba(255, 255, 255, 0.82) !important;
}

.layout-impersonation-option[b-1zeffvszq5] {
    display: flex;
    flex-direction: column;
    gap: 4px;
    width: 100%;
    min-width: 0;
    white-space: normal;
}

.layout-impersonation-option-name[b-1zeffvszq5] {
    color: #1f2937;
    font-size: 0.82rem;
    font-weight: 650;
    line-height: 1.25;
    overflow-wrap: anywhere;
}

.layout-impersonation-option-details[b-1zeffvszq5] {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 3px 8px;
    color: #526173;
    font-size: 0.7rem;
    line-height: 1.3;
}

.layout-impersonation-option-details > span:not(:last-child)[b-1zeffvszq5]::after {
    content: "\2022";
    margin-left: 8px;
    color: #9aa6b2;
}

.layout-impersonation-option-role[b-1zeffvszq5] {
    color: #07519c;
    font-weight: 650;
}

.layout-global-toast-host[b-1zeffvszq5] {
    position: fixed;
    z-index: 2147483000;
    top: max(3px, env(safe-area-inset-top));
    left: 50%;
    width: min(640px, calc(100vw - 24px));
    pointer-events: none;
    transform: translateX(-50%);
}

.layout-global-toast-host[b-1zeffvszq5]  .ht-wrapper {
    max-width: none;
    pointer-events: auto;
}

/* Slot that holds the in-toolbar HeaderToast pill */
.layout-toolbar-toast-slot[b-1zeffvszq5] {
    flex: 1 1 0;
    min-width: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0 10px;
    overflow: hidden;
    height: 40px;
}

/* DEBUG toast test button � distinct amber tint */
.toast-test-btn[b-1zeffvszq5] {
    border-color: rgba(251, 191, 36, 0.45) !important;
    background: rgba(251, 191, 36, 0.14) !important;
}

.toast-test-btn:hover[b-1zeffvszq5] {
    background: rgba(251, 191, 36, 0.28) !important;
    border-color: rgba(251, 191, 36, 0.70) !important;
}

.toast-test-btn i[b-1zeffvszq5] {
    color: #fbbf24;
}

.layout-user-pill[b-1zeffvszq5] {
    display: flex;
    align-items: center;
    gap: 6px;
    flex-shrink: 0;
    min-width: 0;
    padding: 3px 7px 3px 10px;
    border-radius: 999px;
    border: 1px solid rgba(255, 255, 255, 0.14);
    background: rgba(255, 255, 255, 0.09);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.06);
    min-height: 34px;
    box-sizing: border-box;
}

.layout-user-meta[b-1zeffvszq5] {
    display: flex;
    flex-direction: column;
    justify-content: center;
    min-width: 0;
    line-height: 1.05;
    text-align: center;
}

.layout-user-name[b-1zeffvszq5] {
    color: rgba(255, 255, 255, 0.94);
    font-size: 0.7rem;
    font-weight: 600;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.layout-user-email[b-1zeffvszq5] {
    color: rgba(255, 255, 255, 0.68);
    font-size: 0.76rem;
    font-weight: 400;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    margin-top: 1px;
}

.layout-user-divider[b-1zeffvszq5] {
    width: 1px;
    align-self: stretch;
    margin: 4px 0;
    background: rgba(255, 255, 255, 0.18);
    flex-shrink: 0;
}

.layout-company-picker[b-1zeffvszq5] {
    display: flex;
    align-items: center;
    min-width: 0;
    height: 30px;
}

.layout-company-picker > *[b-1zeffvszq5] {
    min-width: 0;
    display: flex;
    align-items: center;
    height: 100%;
}

#sidebar-wrapper[b-1zeffvszq5]  .layout-company-picker .company-dropdown,
#sidebar-wrapper[b-1zeffvszq5]  .layout-company-picker select,
#sidebar-wrapper[b-1zeffvszq5]  .layout-company-picker .e-input-group,
#sidebar-wrapper[b-1zeffvszq5]  .layout-company-picker .e-control-wrapper,
#sidebar-wrapper[b-1zeffvszq5]  .layout-company-picker .rz-dropdown,
#sidebar-wrapper[b-1zeffvszq5]  .layout-company-picker .rz-inputtext,
#sidebar-wrapper[b-1zeffvszq5]  .layout-company-picker .custom-dropdown {
    min-height: 28px !important;
    height: 28px !important;
    font-size: 0.68rem !important;
    line-height: 1.1 !important;
    box-sizing: border-box !important;
}

#sidebar-wrapper[b-1zeffvszq5]  .layout-company-picker .company-dropdown,
#sidebar-wrapper[b-1zeffvszq5]  .layout-company-picker select,
#sidebar-wrapper[b-1zeffvszq5]  .layout-company-picker .rz-dropdown,
#sidebar-wrapper[b-1zeffvszq5]  .layout-company-picker .custom-dropdown {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}

#sidebar-wrapper[b-1zeffvszq5]  .layout-company-picker .e-input,
#sidebar-wrapper[b-1zeffvszq5]  .layout-company-picker input,
#sidebar-wrapper[b-1zeffvszq5]  .layout-company-picker .rz-inputtext {
    font-size: 0.68rem !important;
    line-height: 1.1 !important;
}

.custom-menu-button[b-1zeffvszq5] {
    background: rgba(255, 255, 255, 0.10);
    color: white;
    border: 1px solid rgba(255, 255, 255, 0.14);
    padding: 0;
    border-radius: 9px;
    cursor: pointer;
    transition: all 0.3s ease;
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: 30px;
    width: 30px;
    height: 30px;
    box-shadow: 0 6px 14px rgba(4, 34, 67, 0.14), inset 0 1px 0 rgba(255, 255, 255, 0.06);
    position: relative;
    overflow: hidden;
    flex-shrink: 0;
    grid-column: 1;
    justify-self: start;
    margin-left: 8px;
}

.custom-menu-button[b-1zeffvszq5]::before {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,0.2), transparent);
    transition: left 0.5s;
}

.custom-menu-button:hover[b-1zeffvszq5] {
    background: rgba(255, 255, 255, 0.18);
    box-shadow: 0 10px 20px rgba(4, 34, 67, 0.20);
    transform: translateY(-1px);
}

.custom-menu-button:hover[b-1zeffvszq5]::before {
    left: 100%;
}

.custom-menu-button:active[b-1zeffvszq5] {
    transform: translateY(0);
    box-shadow: 0 4px 10px rgba(4, 34, 67, 0.20);
}

.custom-menu-button i[b-1zeffvszq5] {
    font-size: 12px;
    transition: transform 0.3s ease;
}

.custom-menu-button:hover i[b-1zeffvszq5] {
    transform: scale(1.1);
}

.custom-notification-button[b-1zeffvszq5] {
    background: rgba(255, 255, 255, 0.10);
    color: white;
    border: 1px solid rgba(255, 255, 255, 0.14);
    padding: 0;
    border-radius: 9px;
    cursor: pointer;
    transition: all 0.3s ease;
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: 30px;
    width: 30px;
    height: 30px;
    box-shadow: 0 6px 14px rgba(4, 34, 67, 0.14), inset 0 1px 0 rgba(255, 255, 255, 0.06);
    position: relative;
    overflow: hidden;
    flex-shrink: 0;
}

.custom-notification-button[b-1zeffvszq5]::before {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,0.2), transparent);
    transition: left 0.5s;
}

.custom-notification-button:hover[b-1zeffvszq5] {
    background: rgba(255, 255, 255, 0.18);
    box-shadow: 0 10px 20px rgba(4, 34, 67, 0.20);
    transform: translateY(-1px);
}

.custom-notification-button:hover[b-1zeffvszq5]::before {
    left: 100%;
}

.custom-notification-button.active[b-1zeffvszq5] {
    background: linear-gradient(135deg, #1fb8a5, #2fd4bf);
    border-color: rgba(255, 255, 255, 0.18);
    box-shadow: 0 10px 20px rgba(18, 115, 110, 0.28);
}

.custom-notification-button.active:hover[b-1zeffvszq5] {
    background: linear-gradient(135deg, #25c4b1, #39dec8);
    box-shadow: 0 12px 22px rgba(18, 115, 110, 0.32);
}

.custom-notification-button:active[b-1zeffvszq5] {
    transform: translateY(0);
    box-shadow: 0 4px 10px rgba(4, 34, 67, 0.20);
}

.custom-notification-button.active:active[b-1zeffvszq5] {
    box-shadow: 0 5px 12px rgba(18, 115, 110, 0.24);
}

.custom-notification-button i[b-1zeffvszq5] {
    font-size: 12px;
    transition: transform 0.3s ease;
}

.custom-notification-button:hover i[b-1zeffvszq5] {
    transform: scale(1.1);
}

.custom-notification-button.active i[b-1zeffvszq5] {
    animation: bellRing 0.8s ease-in-out;
}

.notification-indicator[b-1zeffvszq5] {
    position: absolute;
    top: 4px;
    right: 4px;
    width: 8px;
    height: 8px;
    background: #ff4757;
    border-radius: 50%;
    border: 2px solid white;
    animation: pulse 2s infinite;
}

.custom-menu-button:focus[b-1zeffvszq5],
.custom-notification-button:focus[b-1zeffvszq5] {
    outline: 2px solid #fff;
    outline-offset: 2px;
}

.custom-menu-button i[b-1zeffvszq5],
.custom-notification-button i[b-1zeffvszq5] {
    animation: iconFadeIn 0.2s ease-in-out;
}

#sidebar-wrapper[b-1zeffvszq5]  .profile-menu-btn.e-dropdown-btn {
    color: #fff;
    border: 1px solid rgba(255, 255, 255, 0.16);
    background: rgba(255, 255, 255, 0.12);
    padding: 0;
    border-radius: 50%;
    width: 30px;
    height: 30px;
    box-shadow: 0 6px 14px rgba(4, 34, 67, 0.16), inset 0 1px 0 rgba(255, 255, 255, 0.06);
    transition: box-shadow 0.2s ease, transform 0.1s ease;
    position: relative;
    overflow: hidden;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    min-width: 30px;
    line-height: 1;
}

#sidebar-wrapper[b-1zeffvszq5]  .profile-menu-btn.e-dropdown-btn .e-btn-icon,
#sidebar-wrapper[b-1zeffvszq5]  .profile-menu-btn.e-dropdown-btn .e-caret {
    width: 100%;
    height: 100%;
    line-height: 30px;
}

#sidebar-wrapper[b-1zeffvszq5]  .profile-menu-btn.e-dropdown-btn:hover {
    box-shadow: 0 10px 20px rgba(4, 34, 67, 0.22);
    transform: translateY(-1px);
}

#sidebar-wrapper[b-1zeffvszq5]  .profile-menu-btn.e-dropdown-btn:active {
    transform: translateY(0);
    box-shadow: 0 4px 10px rgba(4, 34, 67, 0.18);
}

#sidebar-wrapper[b-1zeffvszq5]  .profile-menu-btn.e-dropdown-btn .e-btn-icon.profile-avatar-icon {
    background: url('images/morse_icon.png') no-repeat center/cover;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    margin: 0;
    border-radius: inherit;
    display: block;
}

#sidebar-wrapper[b-1zeffvszq5]  .profile-menu-btn.e-dropdown-btn .e-btn-icon.profile-avatar-icon::before {
    content: '';
}

#sidebar-wrapper[b-1zeffvszq5]  .e-menu-item .e-menu-icon.profile-avatar-icon {
    background: url('images/morse_icon.png') no-repeat center/cover;
    width: 18px;
    height: 18px;
    border-radius: 50%;
}

#sidebar-wrapper[b-1zeffvszq5]  .e-menu-item .e-menu-icon.profile-avatar-icon::before {
    content: '';
}

.breadcrumb-text[b-1zeffvszq5] {
    color: #ffffff;
    font-size: 0.74rem;
    font-weight: 600;
    letter-spacing: 0;
    opacity: 0.98;
    display: inline-flex;
    align-items: center;
    max-width: 100%;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    margin-left: 0;
}

/* Scoped ::deep selectors - only apply within sidebar-wrapper */
#sidebar-wrapper[b-1zeffvszq5]  .e-sidebar.e-left {
    top: 40px !important;
    background-color: var(--morse-background-color, #07519C);
}

/* Only apply to TreeView in the sidebar */
.default-sidebar[b-1zeffvszq5]  .e-treeview .e-list-text {
    color: #fff !important;
    font-size: 14px;
}

.default-sidebar[b-1zeffvszq5]  .e-treeview .e-list-item.e-active > .e-text-content .e-icon-collapsible,
.default-sidebar[b-1zeffvszq5]  .e-treeview .e-list-item.e-active > .e-text-content .e-icon-expandable {
    color: #fff !important;
}

.default-sidebar[b-1zeffvszq5]  .e-treeview .e-list-item.e-active > .e-fullrow {
    background-color: #f0eded85 !important;
}

.default-sidebar[b-1zeffvszq5]  .e-treeview .e-list-item.e-active.e-hover > .e-fullrow,
.default-sidebar[b-1zeffvszq5]  .e-treeview .e-list-item.e-active.e-node-focus > .e-fullrow {
    background-color: #f0eded85 !important;
    border-color: #f0eded85 !important;
}

.default-sidebar[b-1zeffvszq5] {
    background-color: var(--morse-background-color);
    border-right: 1px solid var(--rz-border-color, #dee2e6);
    box-sizing: border-box;
    position: relative;
    top: 40px;
    /* prevent shrinking/gaps when flex layout changes */
    flex-shrink: 0;
    z-index: 1000 !important; /* keep below toolbar */
}

/* Remove width forcing so SfSidebar can animate open/close properly */
.default-sidebar .e-sidebar[b-1zeffvszq5],
.default-sidebar .e-content-animation[b-1zeffvszq5] {
    margin: 0 !important;
    padding: 0 !important;
    box-sizing: border-box;
    background-color: inherit !important; /* ensure no white track shows */
}

/* Only the actual scroll container should reserve gutter */
.sidebar-scroll[b-1zeffvszq5],
.default-sidebar .e-treeview[b-1zeffvszq5],
.default-sidebar [style*="overflow-y: auto"][b-1zeffvszq5],
.default-sidebar .e-sidebar[b-1zeffvszq5],
.default-sidebar .e-content-animation[b-1zeffvszq5] {
    scrollbar-gutter: stable; /* not both-edges */
    box-sizing: border-box;
}

/* Slight padding so content doesn't sit under the thumb */
.sidebar-scroll[b-1zeffvszq5],
.default-sidebar [style*="overflow-y: auto"][b-1zeffvszq5],
.default-sidebar .e-treeview[b-1zeffvszq5] {
    padding-right: 4px;
    background-clip: padding-box;
}

/* Custom Scrollbar Styles for Sidebar - WebKit browsers */
.default-sidebar[b-1zeffvszq5]::-webkit-scrollbar {
    width: 6px;
}

/* Make the track use the sidebar background so underlying page color cannot show through */
.default-sidebar[b-1zeffvszq5]::-webkit-scrollbar-track {
    background: var(--rz-sidebar-background-color, #f8f9fa);
    margin: 4px 0;
}

.default-sidebar[b-1zeffvszq5]::-webkit-scrollbar-thumb {
    background-color: rgba(7, 81, 156, 0.4);
    border-radius: 3px;
}

.default-sidebar[b-1zeffvszq5]::-webkit-scrollbar-thumb:hover {
    background-color: rgba(7, 81, 156, 0.6);
}

/* Apply to Syncfusion sidebar content wrapper */
.default-sidebar .e-sidebar[b-1zeffvszq5],
.default-sidebar .e-content-animation[b-1zeffvszq5] {
    scrollbar-width: thin;
    scrollbar-color: rgba(7, 81, 156, 0.4) var(--rz-sidebar-background-color, #f8f9fa);
}

.default-sidebar .e-sidebar[b-1zeffvszq5]::-webkit-scrollbar,
.default-sidebar .e-content-animation[b-1zeffvszq5]::-webkit-scrollbar {
    width: 6px;
}

.default-sidebar .e-sidebar[b-1zeffvszq5]::-webkit-scrollbar-track,
.default-sidebar .e-content-animation[b-1zeffvszq5]::-webkit-scrollbar-track {
    background: var(--rz-sidebar-background-color, #f8f9fa);
    margin: 4px 0;
}

.default-sidebar .e-sidebar[b-1zeffvszq5]::-webkit-scrollbar-thumb,
.default-sidebar .e-content-animation[b-1zeffvszq5]::-webkit-scrollbar-thumb {
    background-color: rgba(7, 81, 156, 0.4);
    border-radius: 3px;
}

.default-sidebar .e-sidebar[b-1zeffvszq5]::-webkit-scrollbar-thumb:hover,
.default-sidebar .e-content-animation[b-1zeffvszq5]::-webkit-scrollbar-thumb:hover {
    background-color: rgba(7, 81, 156, 0.6);
}

/* Apply to TreeView container inside sidebar */
.default-sidebar .e-treeview[b-1zeffvszq5],
.default-sidebar [style*="overflow-y: auto"][b-1zeffvszq5] {
    scrollbar-width: thin;
    scrollbar-color: rgba(7, 81, 156, 0.4) var(--rz-sidebar-background-color, #f8f9fa);
}

.default-sidebar .e-treeview[b-1zeffvszq5]::-webkit-scrollbar,
.default-sidebar [style*="overflow-y: auto"][b-1zeffvszq5]::-webkit-scrollbar {
    width: 6px;
}

.default-sidebar .e-treeview[b-1zeffvszq5]::-webkit-scrollbar-track,
.default-sidebar [style*="overflow-y: auto"][b-1zeffvszq5]::-webkit-scrollbar-track {
    background: var(--rz-sidebar-background-color, #f8f9fa);
    margin: 4px 0;
}

.default-sidebar .e-treeview[b-1zeffvszq5]::-webkit-scrollbar-thumb,
.default-sidebar [style*="overflow-y: auto"][b-1zeffvszq5]::-webkit-scrollbar-thumb {
    background-color: rgba(7, 81, 156, 0.4);
    border-radius: 3px;
}

.default-sidebar .e-treeview[b-1zeffvszq5]::-webkit-scrollbar-thumb:hover,
.default-sidebar [style*="overflow-y: auto"][b-1zeffvszq5]::-webkit-scrollbar-thumb:hover {
    background-color: rgba(7, 81, 156, 0.6);
}

/* Remove pseudo border that could contribute to visual gap */
/* .default-sidebar::after { removed } */

.default-sidebar .e-menu-wrapper[b-1zeffvszq5] {
    background-color: transparent;
}

.default-sidebar .e-menu-item[b-1zeffvszq5] {
    padding: 0.75rem 1rem;
}

.default-sidebar .e-menu-item:hover[b-1zeffvszq5] {
    background-color: var(--rz-sidebar-item-hover-background-color, rgba(0, 0, 0, 0.05));
}

.default-sidebar .e-menu-item.e-selected[b-1zeffvszq5] {
    background-color: var(--rz-sidebar-item-selected-background-color, #07519C);
    color: #fff;
}

.maincontent[b-1zeffvszq5] {
    background-color: var(--rz-body-background-color, #fff);
    min-width: 0;
    width: 100%;
    max-width: 100%;
    overflow-x: hidden;
}

.maincontent-body[b-1zeffvszq5] {
    height: 100%;
    min-height: 0;
}

/* Profile Menu Dropdown Styles */
.e-dropdown-btn.e-caret-hide[b-1zeffvszq5]::after {
    content: none;
}

/* Responsive adjustments */
@media (max-width: 768px) {
    .default-sidebar[b-1zeffvszq5] {
        width: 100% !important;
    }
}

/* Alert Console Styles */
.alert[b-1zeffvszq5] {
    padding: 0.75rem 1.25rem;
    margin-bottom: 1rem;
    border: 1px solid transparent;
    border-radius: 0.25rem;
}

.alert-danger[b-1zeffvszq5] {
    color: #721c24;
    background-color: #f8d7da;
    border-color: #f5c6cb;
}

/* Button Styles */
.e-primary[b-1zeffvszq5] {
    background-color: #07519C;
    border-color: #07519C;
    color: #fff;
}

.e-primary:hover[b-1zeffvszq5] {
    background-color: #05407d;
    border-color: #05407d;
}

/* Notification Button States */
.e-info[b-1zeffvszq5] {
    background-color: #17a2b8;
    border-color: #17a2b8;
    color: #fff;
}

.e-outline.e-info[b-1zeffvszq5] {
    background-color: transparent;
    border-color: #17a2b8;
    color: #17a2b8;
}

.e-outline.e-info:hover[b-1zeffvszq5] {
    background-color: #17a2b8;
    color: #fff;
}
/* /Components/Morse/Company/Organization/EmployeeDetail/EmpDetailLeaveManagement.razor.rz.scp.css */
.employee-leave-layout[b-bfyarj76u4] {
    display: flex;
    flex-direction: column;
    gap: 10px;
    height: 100%;
    min-height: 0;
    padding: 4px 8px 10px;
}

.employee-leave-header-card[b-bfyarj76u4],
.employee-leave-history[b-bfyarj76u4] {
    border: 1px solid var(--employees-line, rgba(133, 111, 72, .20));
    border-radius: 14px;
    background: rgba(255, 255, 255, .78);
    box-shadow: 0 7px 18px rgba(57, 49, 37, .06);
}

.employee-leave-header-card[b-bfyarj76u4] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex: 0 0 auto;
    gap: 18px;
    min-height: 58px;
    padding: 9px 14px;
}

.employee-leave-heading[b-bfyarj76u4],
.employee-leave-history-heading[b-bfyarj76u4] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.employee-leave-heading-icon[b-bfyarj76u4] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 32px;
    width: 32px;
    height: 32px;
    border-radius: 9px;
    background: rgba(33, 76, 115, .10);
    color: var(--employees-accent, #214c73);
}

.employee-leave-title[b-bfyarj76u4] {
    color: var(--employees-accent-strong, #12324c);
    font-size: .86rem;
    font-weight: 800;
    line-height: 1.2;
}

.employee-leave-heading small[b-bfyarj76u4],
.employee-leave-history-heading small[b-bfyarj76u4] {
    display: block;
    margin-top: 2px;
    color: var(--employees-muted, #66727d);
    font-size: .7rem;
}

.employee-leave-controls[b-bfyarj76u4] {
    display: flex;
    align-items: flex-end;
    justify-content: flex-end;
    gap: 14px;
    min-width: 0;
}

.employee-leave-year-field[b-bfyarj76u4] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.employee-leave-year-field label[b-bfyarj76u4] {
    color: var(--employees-muted, #66727d);
    font-size: .67rem;
    font-weight: 700;
}

.employee-leave-year-field select[b-bfyarj76u4] {
    min-width: 96px;
    height: 38px;
    padding: 0 30px 0 11px;
    border: 1px solid var(--employees-line, rgba(133, 111, 72, .20));
    border-radius: 9px;
    background: #fff;
    color: var(--employees-ink, #302a23);
}

.employee-leave-balance-field[b-bfyarj76u4] {
    display: grid;
    grid-template-columns: minmax(190px, 230px) auto;
    gap: 8px;
    align-items: end;
}

.employee-leave-balance-field[b-bfyarj76u4]  .e-btn {
    min-width: 92px;
    min-height: 38px;
    border-radius: 9px;
}

.employee-leave-kpis[b-bfyarj76u4] {
    flex: 0 0 auto;
    display: grid;
    grid-template-columns: repeat(4, minmax(145px, 1fr));
    gap: 10px;
}

.employee-leave-kpi[b-bfyarj76u4] {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 3px;
    min-width: 0;
    padding: 11px 14px 11px 17px;
    overflow: hidden;
    border: 1px solid rgba(33, 76, 115, .13);
    border-radius: 13px;
    background: linear-gradient(135deg, rgba(255, 255, 255, .98), rgba(241, 245, 248, .92));
    box-shadow: 0 5px 14px rgba(57, 49, 37, .045);
}

.employee-leave-kpi[b-bfyarj76u4]::before {
    content: "";
    position: absolute;
    inset: 0 auto 0 0;
    width: 4px;
    background: var(--employees-accent, #214c73);
}

.employee-leave-kpi.remaining[b-bfyarj76u4]::before { background: #137333; }
.employee-leave-kpi.used[b-bfyarj76u4]::before { background: #b58838; }
.employee-leave-kpi.new[b-bfyarj76u4]::before { background: #5c6bc0; }
.employee-leave-kpi.total[b-bfyarj76u4]::before { background: #607d8b; }

.employee-leave-kpi span[b-bfyarj76u4] {
    color: var(--employees-muted, #66727d);
    font-size: .68rem;
    font-weight: 700;
    letter-spacing: .05em;
    text-transform: uppercase;
}

.employee-leave-kpi strong[b-bfyarj76u4] {
    overflow: hidden;
    color: var(--employees-accent-strong, #12324c);
    font-size: 1.55rem;
    line-height: 1.15;
    text-overflow: ellipsis;
}

.employee-leave-kpi small[b-bfyarj76u4] {
    color: var(--employees-muted, #66727d);
    font-size: .68rem;
}

.employee-leave-history[b-bfyarj76u4] {
    display: flex;
    flex: 1;
    flex-direction: column;
    min-height: 250px;
    padding: 12px;
    overflow: hidden;
}

.employee-leave-history-heading[b-bfyarj76u4] {
    justify-content: space-between;
    flex: 0 0 auto;
    margin-bottom: 10px;
    padding: 0 2px;
}

.employee-leave-count[b-bfyarj76u4] {
    display: inline-flex;
    align-items: center;
    min-height: 24px;
    padding: 2px 9px;
    border: 1px solid rgba(33, 76, 115, .12);
    border-radius: 999px;
    background: rgba(33, 76, 115, .07);
    color: var(--employees-accent, #214c73);
    font-size: .68rem;
    font-weight: 700;
    white-space: nowrap;
}

.employee-leave-history[b-bfyarj76u4]  .e-grid {
    flex: 1;
    min-height: 0;
    border: 0;
    border-radius: 10px;
}

.employee-leave-status[b-bfyarj76u4] {
    display: inline-flex;
    padding: 3px 9px;
    border-radius: 999px;
    background: rgba(181, 136, 56, .14);
    color: #7a530f;
    font-size: .7rem;
    font-weight: 700;
}

.employee-leave-status.approved[b-bfyarj76u4] { background: rgba(19, 115, 51, .10); color: #137333; }
.employee-leave-status.rejected[b-bfyarj76u4] { background: rgba(197, 34, 31, .10); color: #b42318; }
.employee-leave-status.cancelled[b-bfyarj76u4] { background: rgba(102, 114, 125, .12); color: #66727d; }

@media (max-width: 980px) {
    .employee-leave-header-card[b-bfyarj76u4] {
        align-items: flex-start;
        flex-direction: column;
        gap: 14px;
    }

    .employee-leave-controls[b-bfyarj76u4] {
        width: 100%;
        justify-content: flex-start;
    }

    .employee-leave-kpis[b-bfyarj76u4] {
        grid-template-columns: repeat(2, minmax(145px, 1fr));
    }
}

@media (max-width: 620px) {
    .employee-leave-layout[b-bfyarj76u4] {
        padding-inline: 2px;
    }

    .employee-leave-controls[b-bfyarj76u4],
    .employee-leave-balance-field[b-bfyarj76u4] {
        display: grid;
        grid-template-columns: 1fr;
        width: 100%;
    }

    .employee-leave-year-field select[b-bfyarj76u4],
    .employee-leave-balance-field[b-bfyarj76u4]  .e-btn {
        width: 100%;
    }

    .employee-leave-kpis[b-bfyarj76u4] {
        grid-template-columns: 1fr;
    }

    .employee-leave-history-heading[b-bfyarj76u4] {
        align-items: flex-start;
    }
}
/* /Components/Morse/Company/Organization/EmployeeDetail/EmpDetailTransfers.razor.rz.scp.css */
.employee-transfer-layout[b-nu7fpk404b] {
    display: flex;
    flex-direction: column;
    gap: 14px;
    height: 100%;
    min-height: 0;
    padding: 4px 8px 10px;
}

.employee-transfer-workspace[b-nu7fpk404b] {
    display: grid;
    grid-template-columns: minmax(260px, .62fr) minmax(680px, 2fr);
    gap: 14px;
    align-items: stretch;
}

.employee-transfer-workspace.single-card[b-nu7fpk404b] {
    grid-template-columns: 1fr;
}

.employee-transfer-card[b-nu7fpk404b],
.employee-transfer-history[b-nu7fpk404b] {
    border: 1px solid var(--employees-line, rgba(133, 111, 72, .20));
    border-radius: 14px;
    background: rgba(255, 255, 255, .78);
    box-shadow: 0 7px 18px rgba(57, 49, 37, .06);
}

.employee-transfer-card[b-nu7fpk404b] {
    padding: 14px 16px 16px;
}

.employee-transfer-card-heading[b-nu7fpk404b],
.employee-transfer-history-heading[b-nu7fpk404b] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.employee-transfer-card-heading[b-nu7fpk404b] {
    margin-bottom: 14px;
}

.employee-transfer-heading-icon[b-nu7fpk404b] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 34px;
    width: 34px;
    height: 34px;
    border-radius: 10px;
    background: rgba(33, 76, 115, .10);
    color: var(--employees-accent, #214c73);
}

.employee-transfer-heading-icon.accent[b-nu7fpk404b] {
    background: rgba(181, 136, 56, .14);
    color: #936a20;
}

.employee-transfer-card-title[b-nu7fpk404b] {
    color: var(--employees-accent-strong, #12324c);
    font-size: .86rem;
    font-weight: 800;
    line-height: 1.2;
}

.employee-transfer-card-heading small[b-nu7fpk404b],
.employee-transfer-history-heading small[b-nu7fpk404b] {
    display: block;
    margin-top: 2px;
    color: var(--employees-muted, #66727d);
    font-size: .7rem;
}

.employee-transfer-current[b-nu7fpk404b] {
    background: linear-gradient(145deg, rgba(241, 245, 248, .96), rgba(255, 255, 255, .82));
}

.employee-transfer-current-grid[b-nu7fpk404b] {
    display: grid;
    gap: 9px;
}

.employee-transfer-assignment-item[b-nu7fpk404b] {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 4px;
    min-width: 0;
    padding: 10px 12px 10px 15px;
    overflow: hidden;
    border: 1px solid rgba(33, 76, 115, .10);
    border-radius: 10px;
    background: rgba(255, 255, 255, .76);
}

.employee-transfer-assignment-item[b-nu7fpk404b]::before {
    content: "";
    position: absolute;
    inset: 0 auto 0 0;
    width: 3px;
    background: var(--employees-accent, #214c73);
}

.employee-transfer-assignment-item span[b-nu7fpk404b] {
    color: var(--employees-muted, #66727d);
    font-size: .66rem;
    font-weight: 700;
    letter-spacing: .05em;
    text-transform: uppercase;
}

.employee-transfer-assignment-item strong[b-nu7fpk404b] {
    overflow: hidden;
    color: var(--employees-ink, #302a23);
    font-size: .84rem;
    line-height: 1.35;
    text-overflow: ellipsis;
}

.employee-transfer-form[b-nu7fpk404b] {
    display: grid;
    grid-template-columns: minmax(260px, 1.35fr) minmax(210px, 1fr) minmax(155px, .62fr);
    gap: 12px;
    align-items: end;
}

.employee-transfer-field[b-nu7fpk404b] {
    min-width: 0;
}

.employee-transfer-notes[b-nu7fpk404b] {
    grid-column: 1 / span 2;
}

.employee-transfer-action[b-nu7fpk404b] {
    display: flex;
    align-items: flex-end;
    height: 100%;
}

.employee-transfer-action[b-nu7fpk404b]  .e-btn {
    width: 100%;
    min-height: 38px;
    border-radius: 9px;
    white-space: nowrap;
}

.employee-transfer-notes[b-nu7fpk404b]  textarea.e-input {
    min-height: 44px;
    max-height: 80px;
    resize: vertical;
}

.employee-transfer-notice[b-nu7fpk404b] {
    margin: -2px 0 12px;
    padding: 8px 10px;
    border-radius: 8px;
    background: rgba(181, 136, 56, .12);
    color: #7a530f;
    font-size: .76rem;
}

.employee-transfer-history[b-nu7fpk404b] {
    display: flex;
    flex: 1;
    flex-direction: column;
    min-height: 240px;
    padding: 12px;
    overflow: hidden;
}

.employee-transfer-history-heading[b-nu7fpk404b] {
    justify-content: space-between;
    flex: 0 0 auto;
    margin-bottom: 10px;
    padding: 0 2px;
}

.employee-transfer-count[b-nu7fpk404b] {
    display: inline-flex;
    align-items: center;
    min-height: 24px;
    padding: 2px 9px;
    border: 1px solid rgba(33, 76, 115, .12);
    border-radius: 999px;
    background: rgba(33, 76, 115, .07);
    color: var(--employees-accent, #214c73);
    font-size: .68rem;
    font-weight: 700;
    white-space: nowrap;
}

.employee-transfer-history[b-nu7fpk404b]  .e-grid {
    flex: 1;
    min-height: 0;
    border: 0;
    border-radius: 10px;
}

@media (max-width: 1280px) {
    .employee-transfer-workspace[b-nu7fpk404b] {
        grid-template-columns: 1fr;
    }

    .employee-transfer-current-grid[b-nu7fpk404b] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 900px) {
    .employee-transfer-form[b-nu7fpk404b] {
        grid-template-columns: repeat(2, minmax(220px, 1fr));
    }

    .employee-transfer-date[b-nu7fpk404b] {
        grid-column: auto;
    }

    .employee-transfer-notes[b-nu7fpk404b] {
        grid-column: 1 / -1;
    }

    .employee-transfer-action[b-nu7fpk404b] {
        grid-column: 1 / -1;
        justify-content: flex-end;
    }

    .employee-transfer-action[b-nu7fpk404b]  .e-btn {
        width: auto;
        min-width: 180px;
    }
}

@media (max-width: 620px) {
    .employee-transfer-layout[b-nu7fpk404b] {
        padding-inline: 2px;
    }

    .employee-transfer-current-grid[b-nu7fpk404b],
    .employee-transfer-form[b-nu7fpk404b] {
        grid-template-columns: 1fr;
    }

    .employee-transfer-notes[b-nu7fpk404b],
    .employee-transfer-action[b-nu7fpk404b] {
        grid-column: auto;
    }

    .employee-transfer-action[b-nu7fpk404b]  .e-btn {
        width: 100%;
    }

    .employee-transfer-history-heading[b-nu7fpk404b] {
        align-items: flex-start;
    }
}
/* /Components/Morse/Company/Organization/Employees.razor.rz.scp.css */
.employees-main-tabs[b-0x7oco5wq5] {
    --employees-accent: #214c73;
    --employees-accent-strong: #143450;
    --employees-accent-soft: #dce8f2;
    --employees-gold: #b58838;
    --employees-paper: #f6f1e7;
    --employees-surface: #fffdfa;
    --employees-surface-strong: #ffffff;
    --employees-line: #d9ccb5;
    --employees-line-strong: #c4b08a;
    --employees-ink: #24313d;
    --employees-muted: #66727d;
    position: relative;
    border-radius: 22px;
    border: 1px solid rgba(116, 92, 52, 0.18);
    background: radial-gradient(circle at top right, rgba(181, 136, 56, 0.18), transparent 28%), linear-gradient(180deg, #f8f4ec 0%, #efe7d9 100%);
    box-shadow: 0 24px 54px rgba(54, 47, 36, 0.12);
    overflow: hidden;
    font-family: "Segoe UI Variable Text", "Bahnschrift", "Trebuchet MS", sans-serif;
    max-height: calc(100vh - 80px);
}

.employees-main-tabs[b-0x7oco5wq5]::after {
    content: "";
    position: absolute;
    inset: 62px 0 0 0;
    background: repeating-linear-gradient(
        180deg,
        rgba(181, 136, 56, 0.05) 0,
        rgba(181, 136, 56, 0.05) 1px,
        transparent 1px,
        transparent 46px
    );
    opacity: 0.35;
    pointer-events: none;
}

[b-0x7oco5wq5] .employees-main-tabs > .e-tab-header {
    padding: 10px 12px 0;
    background: linear-gradient(90deg, #12324c 0%, #214c73 54%, #4f7a92 100%);
    border-bottom: none;
}

[b-0x7oco5wq5] .employees-main-tabs > .e-tab-header .e-toolbar-item {
    margin-right: 8px;
}

[b-0x7oco5wq5] .employees-main-tabs > .e-tab-header .e-tab-wrap {
    min-height: 44px;
    padding: 0 18px;
    border-radius: 16px 16px 0 0;
    border: 1px solid rgba(255, 255, 255, 0.12);
    background: rgba(255, 255, 255, 0.08);
    color: rgba(255, 255, 255, 0.82);
    transition: background-color 0.2s ease, color 0.2s ease, transform 0.2s ease;
}

[b-0x7oco5wq5] .employees-main-tabs > .e-tab-header .e-toolbar-item:not(.e-active) .e-tab-wrap:hover {
    transform: translateY(-1px);
    background: rgba(255, 255, 255, 0.14);
}

[b-0x7oco5wq5] .employees-main-tabs > .e-tab-header .e-toolbar-item.e-active .e-tab-wrap {
    background: var(--employees-surface);
    color: var(--employees-accent-strong);
    border-color: rgba(18, 50, 76, 0.12);
    box-shadow: 0 -1px 0 var(--employees-surface), 0 12px 20px rgba(18, 50, 76, 0.16);
}

[b-0x7oco5wq5] .employees-main-tabs > .e-tab-header .e-tab-text,
[b-0x7oco5wq5] .employees-main-tabs > .e-tab-header .e-tab-icon {
    color: inherit;
}

[b-0x7oco5wq5] .employees-main-tabs > .e-content {
    position: relative;
    z-index: 1;
    background: transparent;
    padding: 16px;
}

.employees-grid-panel[b-0x7oco5wq5],
.employees-detail-shell[b-0x7oco5wq5] {
    position: relative;
    border-radius: 20px;
    border: 1px solid var(--employees-line);
    background: linear-gradient(180deg, rgba(255, 253, 249, 0.96), rgba(247, 241, 231, 0.94));
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.72), 0 14px 28px rgba(60, 52, 40, 0.08);
}

.employees-grid-panel[b-0x7oco5wq5] {
    padding: 16px;
}

.employees-grid-panel[b-0x7oco5wq5]::before,
.employees-detail-shell[b-0x7oco5wq5]::before {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: inherit;
    pointer-events: none;
}

.employees-grid-panel[b-0x7oco5wq5]::before {
    background: linear-gradient(135deg, rgba(181, 136, 56, 0.08), transparent 34%);
}

.employees-detail-shell[b-0x7oco5wq5]::before {
    background: linear-gradient(180deg, rgba(33, 76, 115, 0.06), transparent 28%);
}

[b-0x7oco5wq5] .employees-grid-panel .e-toolbar {
    background: transparent;
    border: none;
    padding-bottom: 10px;
}

[b-0x7oco5wq5] .employees-grid-panel .e-toolbar .e-toolbar-items {
    min-height: 54px;
    padding: 8px 10px;
    border-radius: 14px;
    border: 1px solid rgba(133, 111, 72, 0.16);
    background: rgba(255, 255, 255, 0.58);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.7);
}

[b-0x7oco5wq5] .employees-grid-panel .e-btn.e-outline,
[b-0x7oco5wq5] .employees-detail-shell .e-btn.e-outline {
    border-radius: 10px;
    border-color: rgba(33, 76, 115, 0.28);
    background: rgba(255, 255, 255, 0.88);
    color: var(--employees-accent-strong);
    box-shadow: 0 4px 12px rgba(18, 50, 76, 0.08);
}

[b-0x7oco5wq5] .employees-grid-panel .e-btn.e-outline:hover,
[b-0x7oco5wq5] .employees-detail-shell .e-btn.e-outline:hover {
    background: var(--employees-accent);
    border-color: var(--employees-accent);
    color: #ffffff;
}

[b-0x7oco5wq5] .employees-grid-panel .e-grid,
[b-0x7oco5wq5] .employees-detail-tabs .e-grid {
    border: 1px solid var(--employees-line);
    border-radius: 16px;
    overflow: hidden;
    background: rgba(255, 255, 255, 0.92);
}

[b-0x7oco5wq5] .employees-grid-panel .e-gridheader,
[b-0x7oco5wq5] .employees-detail-tabs .e-gridheader {
    border-bottom: 1px solid var(--employees-line);
    background: linear-gradient(180deg, #efe4cf 0%, #e8dbc4 100%);
}

[b-0x7oco5wq5] .employees-grid-panel .e-headercell,
[b-0x7oco5wq5] .employees-detail-tabs .e-headercell {
    border-color: rgba(217, 204, 181, 0.8);
    color: #6b4d1f;
    font-size: 0.74rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

[b-0x7oco5wq5] .employees-grid-panel .e-rowcell,
[b-0x7oco5wq5] .employees-detail-tabs .e-rowcell {
    border-color: rgba(217, 204, 181, 0.72);
    color: var(--employees-ink);
}

[b-0x7oco5wq5] .employees-grid-panel .e-altrow,
[b-0x7oco5wq5] .employees-detail-tabs .e-altrow {
    background: rgba(241, 235, 225, 0.52);
}

[b-0x7oco5wq5] .employees-grid-panel .e-row:hover .e-rowcell,
[b-0x7oco5wq5] .employees-detail-tabs .e-row:hover .e-rowcell {
    background: rgba(33, 76, 115, 0.05);
}

[b-0x7oco5wq5] .employees-grid-panel .e-selectionbackground,
[b-0x7oco5wq5] .employees-grid-panel .e-active .e-rowcell,
[b-0x7oco5wq5] .employees-detail-tabs .e-selectionbackground,
[b-0x7oco5wq5] .employees-detail-tabs .e-active .e-rowcell {
    background: rgba(33, 76, 115, 0.10) !important;
}

[b-0x7oco5wq5] .employees-grid-panel .e-gridpager {
    border-top: 1px solid var(--employees-line);
    background: rgba(255, 250, 242, 0.96);
}

.employees-grid-person-cell[b-0x7oco5wq5] {
    display: flex;
    flex-direction: column;
    gap: 3px;
    line-height: 1.2;
}

.employees-grid-person-name[b-0x7oco5wq5] {
    color: var(--employees-accent-strong);
    font-size: 0.92rem;
    font-weight: 700;
}

.employees-grid-person-meta[b-0x7oco5wq5] {
    color: var(--employees-muted);
    font-size: 0.75rem;
}

.employees-grid-photo-cell[b-0x7oco5wq5] {
    display: flex;
    align-items: center;
    justify-content: center;
}

.employees-grid-photo[b-0x7oco5wq5] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    overflow: hidden;
    border: 1px solid rgba(33, 76, 115, 0.2);
    border-radius: 50%;
    background: #e7eef5;
    color: var(--employees-accent-strong);
    font-size: 0.68rem;
    font-weight: 700;
    letter-spacing: 0.02em;
}

.employees-grid-photo img[b-0x7oco5wq5] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.employees-detail-shell[b-0x7oco5wq5] {
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding: 14px;
}

.employees-detail-header[b-0x7oco5wq5] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 12px 16px;
    border-radius: 16px;
    border: 1px solid rgba(133, 111, 72, 0.18);
    background:
        radial-gradient(circle at top right, rgba(181, 136, 56, 0.12), transparent 30%),
        linear-gradient(135deg, #fffefb 0%, #f4ede1 100%);
    box-shadow: 0 8px 18px rgba(58, 49, 37, 0.08);
}

.employees-detail-header-actions[b-0x7oco5wq5] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
}

.employees-detail-badges[b-0x7oco5wq5] {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 6px;
}

.employees-detail-toolbar[b-0x7oco5wq5] {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 4px;
}

.employees-detail-title[b-0x7oco5wq5] {
    color: var(--employees-accent-strong);
    font-size: 1.05rem;
    font-weight: 800;
    letter-spacing: 0.01em;
}

.employees-detail-subtitle[b-0x7oco5wq5] {
    margin-top: 4px;
    color: var(--employees-muted);
    font-size: 0.82rem;
    max-width: 720px;
}

.employees-detail-summary-strip[b-0x7oco5wq5] {
    display: flex;
    align-items: center;
    gap: 10px;
    min-width: 0;
}

.employees-detail-summary-icon[b-0x7oco5wq5] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    border-radius: 12px;
    background: rgba(33, 76, 115, 0.10);
    color: var(--employees-accent-strong);
    font-size: 1.08rem;
    flex-shrink: 0;
}

.employees-detail-summary-copy[b-0x7oco5wq5] {
    display: flex;
    flex-direction: column;
    gap: 4px;
    min-width: 0;
}

.employees-detail-summary-name[b-0x7oco5wq5] {
    color: var(--employees-accent-strong);
    font-size: 1.06rem;
    font-weight: 800;
    line-height: 1.15;
}

.employees-detail-summary-meta[b-0x7oco5wq5] {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.employees-detail-summary-meta span[b-0x7oco5wq5] {
    padding: 2px 8px;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.72);
    border: 1px solid rgba(133, 111, 72, 0.16);
    color: var(--employees-muted);
    font-size: 0.72rem;
    font-weight: 600;
}

.employees-company-badge[b-0x7oco5wq5] {
    padding: 2px 8px;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.72);
    border: 1px solid rgba(133, 111, 72, 0.16);
    color: var(--employees-muted);
    font-size: 0.72rem;
    font-weight: 600;
}

.employees-company-badge.is-default-company[b-0x7oco5wq5] {
    background: rgba(33, 76, 115, 0.12);
    border-color: rgba(33, 76, 115, 0.35);
    color: var(--employees-accent-strong);
    font-weight: 700;
}



.employees-detail-summary-contact[b-0x7oco5wq5] {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.employees-contact-item[b-0x7oco5wq5] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 3px 9px 3px 7px;
    border-radius: 999px;
    border: 1px solid rgba(133, 111, 72, 0.16);
    background: rgba(255, 255, 255, 0.68);
    width: fit-content;
    max-width: 100%;
    overflow: hidden;
    box-shadow: 0 2px 6px rgba(58, 49, 37, 0.06);
    transition: background 0.18s ease, border-color 0.18s ease, box-shadow 0.18s ease;
}

.employees-contact-item:hover[b-0x7oco5wq5] {
    background: rgba(255, 255, 255, 0.92);
    border-color: rgba(33, 76, 115, 0.28);
    box-shadow: 0 4px 12px rgba(33, 76, 115, 0.10);
}

.employees-contact-icon[b-0x7oco5wq5] {
    flex-shrink: 0;
    font-size: 0.72rem;
    color: var(--employees-accent);
    opacity: 0.82;
}

.employees-contact-link[b-0x7oco5wq5] {
    color: var(--employees-accent-strong);
    font-size: 0.74rem;
    font-weight: 600;
    text-decoration: none;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.employees-contact-link:hover[b-0x7oco5wq5] {
    text-decoration: underline;
    color: var(--employees-accent);
}

.employees-detail-status[b-0x7oco5wq5] {
    flex-shrink: 0;
    padding: 5px 10px;
    border-radius: 999px;
    border: 1px solid rgba(33, 76, 115, 0.16);
    background: rgba(33, 76, 115, 0.08);
    color: var(--employees-accent-strong);
    font-size: 0.68rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.employees-detail-status.is-active[b-0x7oco5wq5] {
    border-color: rgba(19, 115, 51, 0.18);
    background: rgba(19, 115, 51, 0.10);
    color: #137333;
}

.employees-detail-status.is-inactive[b-0x7oco5wq5] {
    border-color: rgba(197, 34, 31, 0.18);
    background: rgba(197, 34, 31, 0.10);
    color: #c5221f;
}

.employees-detail-mode[b-0x7oco5wq5] {
    flex-shrink: 0;
    padding: 5px 10px;
    border-radius: 999px;
    border: 1px solid rgba(33, 76, 115, 0.16);
    background: rgba(33, 76, 115, 0.08);
    color: var(--employees-accent-strong);
    font-size: 0.68rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.employees-detail-mode.is-editing[b-0x7oco5wq5] {
    border-color: rgba(181, 136, 56, 0.28);
    background: rgba(181, 136, 56, 0.14);
    color: #7a530f;
}

.employees-detail-empty[b-0x7oco5wq5] {
    border-radius: 18px;
    border: 1px dashed rgba(133, 111, 72, 0.4);
    background: rgba(255, 255, 255, 0.42);
}

/* ── Prev / Next navigation pill ──────────────────────────────────────── */
.employees-detail-nav[b-0x7oco5wq5] {
    display: inline-flex;
    align-items: center;
    gap: 0;
    padding: 2px;
    border-radius: 999px;
    border: 1px solid rgba(133, 111, 72, 0.22);
    background: rgba(255, 255, 255, 0.72);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.8),
        0 4px 10px rgba(58, 49, 37, 0.08);
    backdrop-filter: blur(4px);
}

.employees-nav-btn[b-0x7oco5wq5] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    border-radius: 999px;
    border: none;
    background: transparent;
    color: var(--employees-accent);
    font-size: 0.72rem;
    cursor: pointer;
    transition: background 0.18s ease, color 0.18s ease, transform 0.15s ease;
    flex-shrink: 0;
}

.employees-nav-btn:hover:not(:disabled)[b-0x7oco5wq5] {
    background: var(--employees-accent);
    color: #fff;
    transform: scale(1.08);
}

.employees-nav-btn:active:not(:disabled)[b-0x7oco5wq5] {
    transform: scale(0.95);
}

.employees-nav-btn:disabled[b-0x7oco5wq5],
.employees-nav-btn.is-disabled[b-0x7oco5wq5] {
    opacity: 0.32;
    cursor: default;
}

.employees-nav-counter[b-0x7oco5wq5] {
    display: inline-flex;
    align-items: baseline;
    gap: 3px;
    padding: 0 8px;
    user-select: none;
    white-space: nowrap;
}

.employees-nav-pos[b-0x7oco5wq5] {
    font-size: 0.76rem;
    font-weight: 700;
    color: var(--employees-accent-strong);
    min-width: 18px;
    text-align: right;
}

.employees-nav-sep[b-0x7oco5wq5] {
    font-size: 0.72rem;
    color: var(--employees-line-strong);
    font-weight: 400;
}

.employees-nav-total[b-0x7oco5wq5] {
    font-size: 0.76rem;
    font-weight: 500;
    color: var(--employees-muted);
}

.employees-nav-page[b-0x7oco5wq5] {
    margin-left: 4px;
    padding: 1px 6px;
    border-radius: 999px;
    background: rgba(33, 76, 115, 0.10);
    border: 1px solid rgba(33, 76, 115, 0.14);
    color: var(--employees-accent);
    font-size: 0.64rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    line-height: 1.6;
}

[b-0x7oco5wq5] .employees-detail-toolbar .e-btn {
    min-height: 30px;
    padding: 0 10px;
}

[b-0x7oco5wq5] .employees-detail-toolbar .e-btn .e-btn-icon,
[b-0x7oco5wq5] .employees-detail-toolbar .e-btn .e-icons {
    font-size: 0.78rem;
}

[b-0x7oco5wq5] .employees-detail-toolbar .e-btn .e-btn-text {
    font-size: 0.76rem;
}

[b-0x7oco5wq5] .employees-detail-tabs {
    display: flex;
    flex-direction: column;
    min-height: 0;
    flex: 1;
}

[b-0x7oco5wq5] .employees-detail-tabs > .e-tab-header {
    padding: 0 6px;
    background: transparent;
    border-bottom: 1px solid rgba(133, 111, 72, 0.18);
    flex-shrink: 0;
}

[b-0x7oco5wq5] .employees-detail-tabs > .e-tab-header .e-toolbar-item {
    margin-right: 6px;
}

[b-0x7oco5wq5] .employees-detail-tabs > .e-tab-header .e-tab-wrap {
    min-height: 38px;
    padding: 0 12px;
    border-radius: 12px 12px 0 0;
    border: 1px solid transparent;
    color: var(--employees-muted);
}

[b-0x7oco5wq5] .employees-detail-tabs > .e-tab-header .e-toolbar-item.e-active .e-tab-wrap {
    border-color: rgba(33, 76, 115, 0.14);
    background: rgba(255, 255, 255, 0.84);
    color: var(--employees-accent-strong);
    box-shadow: 0 -1px 0 rgba(255, 255, 255, 0.9), 0 8px 18px rgba(18, 50, 76, 0.08);
}

[b-0x7oco5wq5] .employees-detail-tabs > .e-content {
    background: transparent;
    padding-top: 12px;
    overflow-y: auto;
    overflow-x: hidden;
    flex: 1;
    min-height: 0;
}

[b-0x7oco5wq5] .employees-detail-tabs > .e-content::-webkit-scrollbar {
    width: 6px;
}

[b-0x7oco5wq5] .employees-detail-tabs > .e-content::-webkit-scrollbar-thumb {
    background: rgba(33, 76, 115, 0.22);
    border-radius: 999px;
}

[b-0x7oco5wq5] .employees-detail-tabs > .e-content::-webkit-scrollbar-track {
    background: transparent;
}

[b-0x7oco5wq5] .employees-detail-tabs .e-card {
    border-radius: 18px;
    border: 1px solid var(--employees-line);
    background: linear-gradient(135deg, #ffffff 0%, #f5efe3 100%);
    box-shadow: 0 12px 24px rgba(57, 49, 37, 0.08);
}

[b-0x7oco5wq5] .employees-detail-tabs .e-input-group,
[b-0x7oco5wq5] .employees-detail-tabs .e-control-wrapper,
[b-0x7oco5wq5] .employees-detail-tabs .e-ddl,
[b-0x7oco5wq5] .employees-detail-tabs .e-ddt,
[b-0x7oco5wq5] .employees-detail-tabs .e-numeric,
[b-0x7oco5wq5] .employees-detail-tabs .e-datepicker {
    border-radius: 12px;
    background: rgba(255, 255, 255, 0.94);
}

[b-0x7oco5wq5] .employees-detail-tabs .e-input-group,
[b-0x7oco5wq5] .employees-detail-tabs .e-control-wrapper {
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.7);
}

[b-0x7oco5wq5] .employees-detail-tabs .e-float-text,
[b-0x7oco5wq5] .employees-detail-tabs .e-input-group .e-float-text.e-label-top {
    color: var(--employees-muted);
}

@media (max-width: 1100px) {
    .employees-detail-header[b-0x7oco5wq5] {
        flex-direction: column;
        align-items: stretch;
    }

    .employees-detail-summary-strip[b-0x7oco5wq5] {
        align-items: flex-start;
    }

    .employees-detail-header-actions[b-0x7oco5wq5],
    .employees-detail-toolbar[b-0x7oco5wq5] {
        align-items: stretch;
        justify-content: flex-start;
    }

    .employees-detail-badges[b-0x7oco5wq5] {
        justify-content: flex-start;
    }

    .employees-detail-mode[b-0x7oco5wq5] {
        align-self: flex-start;
    }
}

@media (max-width: 768px) {
    [b-0x7oco5wq5] .employees-main-tabs > .e-content {
        padding: 12px;
    }

    .employees-grid-panel[b-0x7oco5wq5],
    .employees-detail-shell[b-0x7oco5wq5] {
        padding: 12px;
        border-radius: 16px;
    }

    .employees-detail-header[b-0x7oco5wq5] {
        padding: 14px 16px;
    }

    .employees-detail-summary-strip[b-0x7oco5wq5] {
        flex-direction: column;
        align-items: flex-start;
    }

    .employees-detail-header-actions[b-0x7oco5wq5] {
        width: 100%;
        justify-content: flex-start;
    }

    .employees-detail-summary-contact[b-0x7oco5wq5] {
        flex-direction: column;
        align-items: stretch;
    }

    .employees-detail-title[b-0x7oco5wq5] {
        font-size: 0.96rem;
    }

    .employees-detail-summary-name[b-0x7oco5wq5] {
        font-size: 1.05rem;
    }
}

/* Employee photo, transfer and leave-management detail tabs */
.employees-detail-photo-wrap[b-0x7oco5wq5] { position: relative; flex-shrink: 0; }
.employees-detail-photo-wrap.is-photo-picker[b-0x7oco5wq5] { cursor: pointer; }
.employees-detail-photo-wrap.is-photo-picker:hover .employees-detail-summary-icon[b-0x7oco5wq5] { border-color: var(--employees-accent); box-shadow: 0 0 0 3px rgba(33, 76, 115, .12); }
.employees-detail-summary-icon.has-photo-True[b-0x7oco5wq5] { width: 58px; height: 58px; padding: 0; overflow: hidden; border: 2px solid rgba(33, 76, 115, .24); background: #fff; }
.employees-detail-summary-icon img[b-0x7oco5wq5] { width: 100%; height: 100%; object-fit: cover; }
.employees-photo-picker[b-0x7oco5wq5] { position: absolute; inset: 0; z-index: 4; overflow: hidden; border-radius: 12px; opacity: 0; }
[b-0x7oco5wq5] .employees-photo-picker .e-upload,
[b-0x7oco5wq5] .employees-photo-picker .e-file-select-wrap { width: 100%; height: 100%; min-height: 0; padding: 0; border: 0; background: transparent; }
[b-0x7oco5wq5] .employees-photo-picker .e-file-select-wrap .e-btn { position: absolute; inset: 0; width: 100%; min-width: 100%; height: 100%; min-height: 100%; padding: 0; border: 0; cursor: pointer; }
[b-0x7oco5wq5] .employees-photo-picker .e-file-drop { display: none; }
.employees-photo-delete[b-0x7oco5wq5] { position: absolute; right: -8px; bottom: -8px; z-index: 6; display: inline-flex; align-items: center; justify-content: center; width: 24px; height: 24px; padding: 0; border: 1px solid rgba(197, 34, 31, .28); border-radius: 999px; background: #fff; color: #b42318; cursor: pointer; box-shadow: 0 3px 8px rgba(18, 50, 76, .18); }
.employees-photo-delete .e-icons[b-0x7oco5wq5] { font-size: 11px; }

.employees-detail-empty-content[b-0x7oco5wq5] { display: flex; align-items: center; justify-content: center; min-height: 220px; color: var(--employees-muted); font-style: italic; }
.employee-transfer-layout[b-0x7oco5wq5], .employee-leave-layout[b-0x7oco5wq5] { display: flex; flex-direction: column; gap: 12px; height: 100%; min-height: 0; padding: 4px 8px 8px; }
.employee-transfer-card[b-0x7oco5wq5], .employee-transfer-history[b-0x7oco5wq5], .employee-leave-history[b-0x7oco5wq5] { padding: 12px; border: 1px solid var(--employees-line); border-radius: 14px; background: rgba(255, 255, 255, .74); }
.employee-transfer-card-title[b-0x7oco5wq5] { margin-bottom: 10px; color: var(--employees-accent-strong); font-size: .86rem; font-weight: 800; }
.employee-transfer-current-grid[b-0x7oco5wq5] { display: grid; grid-template-columns: repeat(2, minmax(180px, 1fr)); gap: 10px; }
.employee-transfer-current-grid > div[b-0x7oco5wq5] { display: flex; flex-direction: column; gap: 4px; padding: 10px 12px; border-radius: 10px; background: rgba(33, 76, 115, .06); }
.employee-transfer-current-grid span[b-0x7oco5wq5] { color: var(--employees-muted); font-size: .7rem; text-transform: uppercase; letter-spacing: .05em; }
.employee-transfer-current-grid strong[b-0x7oco5wq5] { color: var(--employees-ink); font-size: .9rem; }
.employee-transfer-form[b-0x7oco5wq5] { display: grid; grid-template-columns: 150px minmax(220px, 1fr) minmax(200px, 1fr) minmax(260px, 1.2fr) auto; gap: 10px; align-items: center; }
.employee-transfer-notes[b-0x7oco5wq5] { min-width: 0; }
.employee-transfer-notice[b-0x7oco5wq5] { margin-bottom: 10px; padding: 8px 10px; border-radius: 8px; background: rgba(181, 136, 56, .12); color: #7a530f; font-size: .8rem; }
.employee-transfer-history[b-0x7oco5wq5], .employee-leave-history[b-0x7oco5wq5] { flex: 1; min-height: 230px; }

.employee-leave-toolbar[b-0x7oco5wq5] { display: flex; align-items: center; gap: 10px; color: var(--employees-muted); font-size: .78rem; }
.employee-leave-toolbar label[b-0x7oco5wq5] { color: var(--employees-accent-strong); font-weight: 700; }
.employee-leave-toolbar select[b-0x7oco5wq5] { min-width: 90px; padding: 6px 10px; border: 1px solid var(--employees-line); border-radius: 9px; background: #fff; color: var(--employees-ink); }
.employee-leave-toolbar span[b-0x7oco5wq5] { margin-left: auto; }
.employee-leave-kpis[b-0x7oco5wq5] { display: grid; grid-template-columns: repeat(4, minmax(150px, 1fr)); gap: 12px; }
.employee-leave-kpi[b-0x7oco5wq5] { position: relative; display: flex; flex-direction: column; gap: 3px; padding: 14px 16px; overflow: hidden; border: 1px solid rgba(33, 76, 115, .14); border-radius: 14px; background: linear-gradient(135deg, #fff, #f1f5f8); }
.employee-leave-kpi[b-0x7oco5wq5]::before { content: ""; position: absolute; inset: 0 auto 0 0; width: 4px; background: var(--employees-accent); }
.employee-leave-kpi.used[b-0x7oco5wq5]::before { background: #b58838; }
.employee-leave-kpi.new[b-0x7oco5wq5]::before { background: #5c6bc0; }
.employee-leave-kpi.total[b-0x7oco5wq5]::before { background: #607d8b; }
.employee-leave-kpi.remaining[b-0x7oco5wq5]::before { background: #137333; }
.employee-leave-kpi span[b-0x7oco5wq5] { color: var(--employees-muted); font-size: .72rem; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; }
.employee-leave-kpi strong[b-0x7oco5wq5] { color: var(--employees-accent-strong); font-size: 1.65rem; line-height: 1.1; }
.employee-leave-kpi small[b-0x7oco5wq5] { color: var(--employees-muted); font-size: .7rem; }
.employee-leave-status[b-0x7oco5wq5] { display: inline-flex; padding: 3px 9px; border-radius: 999px; background: rgba(181, 136, 56, .14); color: #7a530f; font-size: .7rem; font-weight: 700; }
.employee-leave-status.approved[b-0x7oco5wq5] { background: rgba(19, 115, 51, .1); color: #137333; }
.employee-leave-status.rejected[b-0x7oco5wq5] { background: rgba(197, 34, 31, .1); color: #b42318; }
.employee-leave-status.cancelled[b-0x7oco5wq5] { background: rgba(102, 114, 125, .12); color: #66727d; }

@media (max-width: 1100px) {
    .employee-transfer-form[b-0x7oco5wq5] { grid-template-columns: repeat(2, minmax(220px, 1fr)); }
    .employee-leave-kpis[b-0x7oco5wq5] { grid-template-columns: repeat(2, minmax(150px, 1fr)); }
}

@media (max-width: 768px) {
    .employee-transfer-current-grid[b-0x7oco5wq5], .employee-transfer-form[b-0x7oco5wq5], .employee-leave-kpis[b-0x7oco5wq5] { grid-template-columns: 1fr; }
    .employee-leave-toolbar[b-0x7oco5wq5] { align-items: flex-start; flex-wrap: wrap; }
    .employee-leave-toolbar span[b-0x7oco5wq5] { width: 100%; margin-left: 0; }
}

/* Cash Desk-style page states replace the former Employees / Detail tabs. */
.employees-page[b-0x7oco5wq5] {
    --employees-accent: #214c73;
    --employees-accent-strong: #143450;
    --employees-accent-soft: #dce8f2;
    --employees-gold: #b58838;
    --employees-paper: #f6f1e7;
    --employees-surface: #fffdfa;
    --employees-surface-strong: #fff;
    --employees-line: #d7dce2;
    --employees-line-strong: #b9c1cb;
    --employees-ink: #202735;
    --employees-muted: #596273;
    display: flex;
    flex-direction: column;
    gap: 0;
    width: calc(100% + 2rem);
    height: calc(100vh - 45px);
    margin: -1rem;
    min-height: 0;
    font-family: "Segoe UI Variable Text", "Bahnschrift", "Trebuchet MS", sans-serif;
}

.employees-list-page[b-0x7oco5wq5],
.employees-detail-page[b-0x7oco5wq5] {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    gap: 12px;
    min-height: 0;
}

.employees-list-page.is-hidden[b-0x7oco5wq5],
.employees-detail-page.is-hidden[b-0x7oco5wq5] {
    display: none;
}

.employees-page-header[b-0x7oco5wq5] {
    display: flex;
    flex: 0 0 auto;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 8px 0;
}

.employees-page-title[b-0x7oco5wq5] {
    color: #202735;
    font-size: 22px;
    font-weight: 700;
    letter-spacing: 0;
}

.employees-page-subtitle[b-0x7oco5wq5] {
    margin-top: 2px;
    color: #596273;
    font-size: 13px;
}

.employees-page .employees-grid-panel[b-0x7oco5wq5],
.employees-page .employees-detail-shell[b-0x7oco5wq5] {
    flex: 1 1 auto;
    min-height: 0;
    border: 1px solid #dfe5ee;
    border-radius: 10px;
    background: #fff;
    box-shadow: 0 1px 1px rgba(15, 23, 42, .02);
}

.employees-page .employees-grid-panel[b-0x7oco5wq5] {
    padding: 0;
    border: 0;
    border-radius: 0;
    box-shadow: none;
    overflow: hidden;
}

.employees-page .employees-detail-shell[b-0x7oco5wq5] {
    overflow: hidden;
}

[b-0x7oco5wq5] .employees-page .employees-grid-panel > .e-grid {
    width: 100% !important;
    height: 100% !important;
    border: 0 !important;
    border-radius: 0;
    box-shadow: none !important;
}
/* /Components/Morse/Fragments/AppConfirmationDialog.razor.rz.scp.css */
.app-confirmation-backdrop[b-avz40js7b8] {
    position: fixed;
    inset: 0;
    z-index: 10020;
    display: grid;
    place-items: center;
    padding: 20px;
    background: rgba(5, 30, 51, .48);
    backdrop-filter: blur(3px);
}

.app-confirmation-dialog[b-avz40js7b8] {
    display: grid;
    grid-template-columns: 48px minmax(0, 1fr);
    gap: 14px;
    width: min(440px, calc(100vw - 32px));
    padding: 22px;
    border: 1px solid #d7e4ee;
    border-radius: 16px;
    outline: none;
    background: #fff;
    box-shadow: 0 28px 70px rgba(10, 38, 63, .28);
    color: #16354f;
}

.app-confirmation-icon[b-avz40js7b8] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 48px;
    height: 48px;
    border-radius: 14px;
    background: #eaf3fb;
    color: #075aa4;
    font-size: 19px;
}

.app-confirmation-dialog--danger .app-confirmation-icon[b-avz40js7b8] {
    background: #fff0ed;
    color: #d84932;
}

.app-confirmation-copy h2[b-avz40js7b8] {
    margin: 1px 0 7px;
    color: #0b3557;
    font-size: 18px;
    font-weight: 700;
    line-height: 1.3;
}

.app-confirmation-copy p[b-avz40js7b8] {
    margin: 0;
    color: #637c90;
    font-size: 13px;
    line-height: 1.55;
    white-space: pre-line;
}

.app-confirmation-actions[b-avz40js7b8] {
    display: flex;
    grid-column: 1 / -1;
    justify-content: flex-end;
    gap: 9px;
    padding-top: 6px;
}

.app-confirmation-button[b-avz40js7b8] {
    min-height: 38px;
    padding: 0 17px;
    border: 1px solid transparent;
    border-radius: 9px;
    font: inherit;
    font-size: 13px;
    font-weight: 700;
    cursor: pointer;
    transition: border-color .15s ease, background .15s ease, box-shadow .15s ease, transform .15s ease;
}

.app-confirmation-button:hover[b-avz40js7b8] {
    transform: translateY(-1px);
}

.app-confirmation-button:focus-visible[b-avz40js7b8] {
    outline: 3px solid rgba(31, 137, 200, .24);
    outline-offset: 2px;
}

.app-confirmation-button--secondary[b-avz40js7b8] {
    border-color: #cbdce8;
    background: #fff;
    color: #0b5596;
}

.app-confirmation-button--secondary:hover[b-avz40js7b8] {
    border-color: #99bdd6;
    background: #f3f8fc;
}

.app-confirmation-button--primary[b-avz40js7b8] {
    background: #075aa4;
    color: #fff;
    box-shadow: 0 8px 18px rgba(7, 90, 164, .2);
}

.app-confirmation-button--primary:hover[b-avz40js7b8] {
    background: #064d8c;
}

.app-confirmation-button--danger[b-avz40js7b8] {
    background: #c93c29;
    color: #fff;
    box-shadow: 0 8px 18px rgba(201, 60, 41, .2);
}

.app-confirmation-button--danger:hover[b-avz40js7b8] {
    background: #ad301f;
}

@media (max-width: 520px) {
    .app-confirmation-dialog[b-avz40js7b8] {
        grid-template-columns: 42px minmax(0, 1fr);
        padding: 18px;
    }

    .app-confirmation-icon[b-avz40js7b8] {
        width: 42px;
        height: 42px;
    }

    .app-confirmation-actions[b-avz40js7b8] {
        display: grid;
        grid-template-columns: 1fr 1fr;
    }
}
/* /Components/Morse/Fragments/Loading3.razor.rz.scp.css */
.loading3[b-2f1mtcm06n] {
    --loading3-accent: var(--dashboard-blue, #0f5ea8);
    --loading3-ink: var(--dashboard-ink, #18324a);
    --loading3-muted: var(--dashboard-muted, #617287);
    position: relative;
    display: grid;
    place-items: center;
    width: 100%;
    min-height: clamp(8rem, 18vh, 13rem);
    padding: 1rem;
    isolation: isolate;
}

.loading3--compact[b-2f1mtcm06n] {
    min-height: auto;
    padding: 0.25rem 0;
}

.loading3--overlay[b-2f1mtcm06n] {
    position: absolute;
    inset: 0;
    z-index: 20;
    min-height: 0;
    padding: clamp(1rem, 3vw, 2.5rem);
    background: rgba(239, 245, 250, 0.32);
    backdrop-filter: blur(18px) saturate(135%);
    -webkit-backdrop-filter: blur(18px) saturate(135%);
}

.loading3--viewport[b-2f1mtcm06n] {
    position: fixed;
    z-index: 1200;
    min-height: 100vh;
}

.loading3__surface[b-2f1mtcm06n] {
    position: relative;
    display: grid;
    justify-items: center;
    gap: 0.9rem;
    width: min(100%, 28rem);
    padding: 1.4rem 1.5rem;
    border: 1px solid color-mix(in srgb, var(--loading3-accent) 16%, #d8dee8);
    border-radius: 24px;
    background:
        radial-gradient(circle at top center, color-mix(in srgb, var(--loading3-accent) 14%, transparent) 0%, transparent 42%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.84) 0%, rgba(247, 250, 252, 0.76) 100%);
    backdrop-filter: blur(22px) saturate(135%);
    -webkit-backdrop-filter: blur(22px) saturate(135%);
    box-shadow: 0 18px 45px rgba(12, 23, 38, 0.12);
    text-align: center;
}

.loading3--overlay .loading3__surface[b-2f1mtcm06n] {
    width: min(100%, 30rem);
    padding: 1.9rem 2rem;
    box-shadow: 0 24px 60px rgba(12, 23, 38, 0.18);
}

.loading3--compact .loading3__surface[b-2f1mtcm06n] {
    grid-template-columns: auto 1fr;
    justify-items: start;
    align-items: center;
    gap: 0.75rem;
    width: min(100%, 22rem);
    padding: 0.72rem 0.95rem;
    border-radius: 16px;
    text-align: left;
    box-shadow: 0 10px 24px rgba(12, 23, 38, 0.08);
}

.loading3__spinner-wrap[b-2f1mtcm06n] {
    position: relative;
    display: grid;
    place-items: center;
    width: 4.5rem;
    height: 4.5rem;
}

.loading3--compact .loading3__spinner-wrap[b-2f1mtcm06n] {
    width: 2.3rem;
    height: 2.3rem;
}

.loading3__spinner-halo[b-2f1mtcm06n] {
    position: absolute;
    inset: 0.35rem;
    border-radius: 999px;
    background: radial-gradient(circle, color-mix(in srgb, var(--loading3-accent) 30%, white) 0%, transparent 68%);
    filter: blur(6px);
    opacity: 0.9;
    animation: loading3-glow-b-2f1mtcm06n 1.8s ease-in-out infinite;
}

.loading3__spinner[b-2f1mtcm06n] {
    width: 3rem;
    height: 3rem;
    border-radius: 999px;
    border: 4px solid color-mix(in srgb, var(--loading3-accent) 14%, white);
    border-top-color: var(--loading3-accent);
    border-right-color: color-mix(in srgb, var(--loading3-accent) 68%, white);
    animation: loading3-spin-b-2f1mtcm06n 0.9s linear infinite;
}

.loading3--compact .loading3__spinner[b-2f1mtcm06n] {
    width: 1.65rem;
    height: 1.65rem;
    border-width: 3px;
}

.loading3__copy[b-2f1mtcm06n] {
    display: grid;
    gap: 0.25rem;
    justify-items: center;
}

.loading3--compact .loading3__copy[b-2f1mtcm06n] {
    justify-items: start;
}

.loading3__eyebrow[b-2f1mtcm06n] {
    color: var(--loading3-muted);
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.18em;
    text-transform: uppercase;
}

.loading3__label[b-2f1mtcm06n] {
    color: var(--loading3-ink);
    font-size: 1rem;
    font-weight: 700;
    line-height: 1.4;
    max-width: 24rem;
}

.loading3--overlay .loading3__label[b-2f1mtcm06n] {
    font-size: 1.05rem;
}

.loading3--compact .loading3__label[b-2f1mtcm06n] {
    font-size: 0.86rem;
}

@keyframes loading3-spin-b-2f1mtcm06n {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}

@keyframes loading3-glow-b-2f1mtcm06n {
    0% {
        opacity: 0.6;
        transform: scale(0.92);
    }

    50% {
        opacity: 1;
        transform: scale(1);
    }

    100% {
        opacity: 0.6;
        transform: scale(0.92);
    }
}

@media (max-width: 640px) {
    .loading3[b-2f1mtcm06n] {
        min-height: 7rem;
        padding: 0.75rem;
    }

    .loading3__surface[b-2f1mtcm06n] {
        width: 100%;
        padding: 1.2rem 1rem;
        border-radius: 20px;
    }

    .loading3--overlay .loading3__surface[b-2f1mtcm06n] {
        padding: 1.5rem 1.2rem;
    }
}

@media (prefers-reduced-motion: reduce) {
    .loading3__spinner[b-2f1mtcm06n],
    .loading3__spinner-halo[b-2f1mtcm06n] {
        animation: none;
    }
}
/* /Components/Morse/Retail/Stores/ShiftPlanner/AutoShiftSettings.razor.rz.scp.css */
.ass-page[b-kradz2gnva] { min-height: 100%; padding: 28px; color: #123044; background: #f4f7f9; }
.ass-page [hidden][b-kradz2gnva], .ass-page[b-kradz2gnva]  [hidden], .ass-modal-backdrop [hidden][b-kradz2gnva] { display: none !important; }
.ass-header[b-kradz2gnva] { display: flex; justify-content: space-between; gap: 24px; align-items: flex-end; margin-bottom: 22px; }
.ass-header-tools[b-kradz2gnva] { display: flex; flex-wrap: wrap; gap: 10px; align-items: flex-end; justify-content: flex-end; }
.ass-store-picker[b-kradz2gnva] { display: flex; flex-direction: column; gap: 5px; min-width: 220px; color: #38596a; font-size: .76rem; font-weight: 800; }
.ass-store-picker select[b-kradz2gnva] { min-height: 42px; padding: 8px 34px 8px 11px; border: 1px solid #cbd8de; border-radius: 9px; color: #153b4e; background: #fff; font: inherit; font-size: .88rem; }
.ass-button--fill[b-kradz2gnva] { min-height: 42px; color: #fff; border-color: #0d6c77; background: #0d6c77; }
.ass-button--copy[b-kradz2gnva] { min-height: 42px; color: #0d526f; border-color: #9fc4d3; background: #edf7fb; }
.ass-header h1[b-kradz2gnva], .ass-panel h2[b-kradz2gnva] { margin: 4px 0; color: #062d43; }
.ass-header p[b-kradz2gnva] { margin: 0; color: #607381; }
.ass-eyebrow[b-kradz2gnva] { color: #e77716; font-size: .72rem; font-weight: 800; letter-spacing: .13em; text-transform: uppercase; }
.ass-back[b-kradz2gnva] { border: 0; padding: 0; margin-bottom: 14px; color: #315b70; background: transparent; cursor: pointer; }
.ass-back i[b-kradz2gnva] { margin-right: 7px; }
.ass-readiness[b-kradz2gnva] { display: flex; gap: 12px; min-width: 270px; padding: 14px 17px; border: 1px solid #f0c6a4; border-radius: 14px; color: #9a4b0e; background: #fff7ef; }
.ass-readiness--ready[b-kradz2gnva] { border-color: #a9d8c4; color: #176947; background: #f0fbf6; }
.ass-readiness > i[b-kradz2gnva] { margin-top: 3px; }
.ass-readiness span[b-kradz2gnva] { display: flex; flex-direction: column; }
.ass-readiness small[b-kradz2gnva] { margin-top: 3px; color: #657985; }
.ass-loading[b-kradz2gnva], .ass-error[b-kradz2gnva] { display: flex; gap: 12px; align-items: center; padding: 24px; border: 1px solid #dce5ea; border-radius: 16px; background: #fff; }
.ass-error[b-kradz2gnva] { color: #9f2f2f; }
.ass-error p[b-kradz2gnva] { margin: 4px 0 0; }
.ass-spinner[b-kradz2gnva] { width: 20px; height: 20px; border: 3px solid #c9d7de; border-top-color: #ef810e; border-radius: 50%; animation: ass-spin-b-kradz2gnva .7s linear infinite; }
@keyframes ass-spin-b-kradz2gnva { to { transform: rotate(360deg); } }
.ass-tabs[b-kradz2gnva] { display: flex; gap: 6px; padding: 6px; overflow-x: auto; border: 1px solid #dce5ea; border-radius: 14px; background: #fff; }
.ass-tabs[b-kradz2gnva]  button { display: flex; gap: 8px; align-items: center; min-width: max-content; padding: 10px 14px; border: 0; border-radius: 10px; color: #526b79; background: transparent; cursor: pointer; font-weight: 700; }
.ass-tabs[b-kradz2gnva]  button:hover { color: #123f55; background: #edf4f7; }
.ass-tabs[b-kradz2gnva]  button.active { color: #fff; background: #073c57; }
.ass-tabs[b-kradz2gnva]  button.active:hover { color: #fff; background: #073c57; }
.ass-tabs[b-kradz2gnva]  em { padding: 1px 7px; border-radius: 99px; color: inherit; background: rgba(255,255,255,.18); font-size: .72rem; font-style: normal; }
.ass-content[b-kradz2gnva] { margin-top: 16px; }
.ass-panel[b-kradz2gnva] { padding: 24px; border: 1px solid #dce5ea; border-radius: 16px; background: #fff; box-shadow: 0 8px 24px rgba(4,39,57,.04); }
.ass-panel-head[b-kradz2gnva] { display: flex; justify-content: space-between; gap: 20px; align-items: center; margin-bottom: 20px; }
.ass-panel-actions[b-kradz2gnva] { display: flex; flex-wrap: wrap; gap: 10px; justify-content: flex-end; }
.ass-panel h3[b-kradz2gnva] { margin: 25px 0 12px; font-size: 1rem; }
.ass-button[b-kradz2gnva] { display: inline-flex; gap: 7px; align-items: center; justify-content: center; padding: 9px 15px; border: 1px solid #cbd9df; border-radius: 9px; color: #23485b; background: #fff; cursor: pointer; font-weight: 700; }
.ass-button--primary[b-kradz2gnva] { border-color: #ef810e; color: #fff; background: #ef810e; }
.ass-button:disabled[b-kradz2gnva], button:disabled[b-kradz2gnva] { opacity: .48; cursor: not-allowed; }
.ass-note[b-kradz2gnva] { padding: 12px 14px; margin-bottom: 18px; border-radius: 10px; color: #315c72; background: #edf7fc; }
.ass-note i[b-kradz2gnva] { margin-right: 8px; }
.ass-global-settings[b-kradz2gnva] { padding-top: 22px; margin-top: 28px; border-top: 1px solid #dce5ea; }
.ass-global-settings .ass-panel-head[b-kradz2gnva] { margin-bottom: 14px; }
.ass-global-settings h3[b-kradz2gnva] { margin: 3px 0 0; }
.ass-form-grid[b-kradz2gnva] { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 14px; }
.ass-form-grid--three[b-kradz2gnva] { grid-template-columns: repeat(3, minmax(0,1fr)); }
.ass-field[b-kradz2gnva], .ass-form-grid[b-kradz2gnva]  .ass-field { display: flex; flex-direction: column; gap: 6px; color: #38596a; font-size: .82rem; font-weight: 700; }
.ass-field input[b-kradz2gnva], .ass-field select[b-kradz2gnva], .ass-form-grid[b-kradz2gnva]  .ass-field input, .ass-form-grid[b-kradz2gnva]  .ass-field select { box-sizing: border-box; width: 100%; min-height: 40px; padding: 8px 10px; border: 1px solid #cbd8de; border-radius: 8px; color: #153b4e; background: #fff; }
.ass-toggle-grid[b-kradz2gnva] { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 10px; }
.ass-toggle[b-kradz2gnva], .ass-toggle-grid[b-kradz2gnva]  .ass-toggle { display: flex; gap: 10px; align-items: flex-start; min-height: 50px; padding: 12px; border: 1px solid #dce5ea; border-radius: 10px; color: #24495b; background: #fafcfd; }
.ass-toggle input[b-kradz2gnva], .ass-toggle-grid[b-kradz2gnva]  .ass-toggle input { margin-top: 3px; }
.ass-toggle span[b-kradz2gnva], .ass-toggle-grid[b-kradz2gnva]  .ass-toggle span { display: flex; flex-direction: column; }
.ass-toggle small[b-kradz2gnva], .ass-toggle-grid[b-kradz2gnva]  .ass-toggle small { margin-top: 3px; color: #71848e; font-weight: 400; }
.ass-toggle--field[b-kradz2gnva] { align-self: end; }
.ass-table-wrap[b-kradz2gnva] { overflow-x: auto; }
.ass-table[b-kradz2gnva] { width: 100%; border-collapse: collapse; }
.ass-table th[b-kradz2gnva] { padding: 10px 12px; color: #6a7f8b; background: #f5f8fa; font-size: .72rem; letter-spacing: .05em; text-align: left; text-transform: uppercase; }
.ass-table td[b-kradz2gnva] { padding: 12px; border-bottom: 1px solid #e5ecef; color: #345565; }
.ass-table td small[b-kradz2gnva] { display: block; margin-top: 2px; color: #81919a; }
.ass-table input[type=number][b-kradz2gnva] { width: 90px; padding: 7px; border: 1px solid #ccd9df; border-radius: 7px; }
.ass-inline-checks[b-kradz2gnva] { display: flex; flex-wrap: wrap; gap: 8px 14px; }
.ass-inline-checks label[b-kradz2gnva] { display: flex; gap: 5px; align-items: center; font-size: .78rem; }
.ass-row--inactive[b-kradz2gnva] { opacity: .5; }
.ass-badge[b-kradz2gnva] { padding: 4px 8px; border-radius: 99px; color: #1e617b; background: #e8f5fa; font-size: .72rem; font-weight: 800; }
.ass-actions[b-kradz2gnva] { display: flex; justify-content: flex-end; gap: 5px; }
.ass-actions button[b-kradz2gnva], .ass-modal header > button[b-kradz2gnva] { width: 34px; height: 34px; border: 1px solid #d7e1e6; border-radius: 8px; color: #31596c; background: #fff; cursor: pointer; }
.ass-actions button.danger[b-kradz2gnva] { color: #b23b3b; }
.ass-empty[b-kradz2gnva] { padding: 48px 20px; color: #6b7f8a; text-align: center; }
.ass-empty > i[b-kradz2gnva] { color: #ef810e; font-size: 2rem; }
.ass-empty h3[b-kradz2gnva] { margin: 12px 0 4px; color: #294b5c; }
.ass-empty p[b-kradz2gnva] { margin: 0; }
.ass-modal-backdrop[b-kradz2gnva] { position: fixed; z-index: 1200; inset: 0; display: grid; place-items: center; padding: 20px; background: rgba(2,25,37,.58); }
.ass-modal[b-kradz2gnva] { width: min(620px, 100%); max-height: 90vh; overflow: auto; border-radius: 16px; background: #fff; box-shadow: 0 24px 70px rgba(0,0,0,.25); }
.ass-modal header[b-kradz2gnva], .ass-modal footer[b-kradz2gnva] { display: flex; justify-content: space-between; gap: 12px; align-items: center; padding: 18px 20px; border-bottom: 1px solid #e2eaee; }
.ass-modal header h2[b-kradz2gnva] { margin: 3px 0 0; color: #123a4e; }
.ass-modal footer[b-kradz2gnva] { justify-content: flex-end; border-top: 1px solid #e2eaee; border-bottom: 0; }
.ass-modal-body[b-kradz2gnva] { display: flex; flex-direction: column; gap: 14px; padding: 20px; }
@media (max-width: 1100px) { .ass-header[b-kradz2gnva] { align-items: stretch; flex-direction: column; } .ass-header-tools[b-kradz2gnva] { justify-content: flex-start; } }
@media (max-width: 900px) { .ass-page[b-kradz2gnva] { padding: 18px; } .ass-form-grid--three[b-kradz2gnva], .ass-toggle-grid[b-kradz2gnva] { grid-template-columns: repeat(2,minmax(0,1fr)); } }
@media (max-width: 620px) { .ass-form-grid[b-kradz2gnva], .ass-form-grid--three[b-kradz2gnva], .ass-toggle-grid[b-kradz2gnva] { grid-template-columns: 1fr; } .ass-panel[b-kradz2gnva] { padding: 16px; } }
/* /Components/Morse/Retail/Stores/ShiftPlanner/ShiftPlanner.razor.rz.scp.css */
.sp-page[b-c9rw3fsx6j] {
    --sp-navy: #0b3558;
    --sp-blue: #07519c;
    --sp-blue-dark: #063f79;
    --sp-orange: #ff623e;
    --sp-ink: #17324a;
    --sp-muted: #6d8295;
    --sp-line: #dbe5ee;
    --sp-line-soft: #eaf0f5;
    --sp-canvas: #f4f7fa;
    --sp-card: #ffffff;
    display: flex;
    flex-direction: column;
    width: 100%;
    height: calc(100vh - 72px);
    height: calc(100dvh - 72px);
    height: 100%;
    min-height: 0;
    overflow: hidden;
    color: var(--sp-ink);
}

.sp-page *[b-c9rw3fsx6j],
.sp-page *[b-c9rw3fsx6j]::before,
.sp-page *[b-c9rw3fsx6j]::after {
    box-sizing: border-box;
}

.sp-header[b-c9rw3fsx6j] {
    display: flex;
    flex: 0 0 auto;
    align-items: flex-end;
    justify-content: space-between;
    gap: 24px;
    margin-bottom: 14px;
}

.sp-title-block[b-c9rw3fsx6j] {
    min-width: 220px;
}

.sp-eyebrow[b-c9rw3fsx6j] {
    display: block;
    margin-bottom: 4px;
    color: var(--sp-blue);
    font-size: 10px;
    font-weight: 800;
    letter-spacing: .12em;
    text-transform: uppercase;
}

.sp-title-line[b-c9rw3fsx6j] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.sp-title-line h1[b-c9rw3fsx6j] {
    margin: 0;
    color: var(--sp-navy);
    font-size: clamp(23px, 2vw, 30px);
    font-weight: 760;
    letter-spacing: -.035em;
}

.sp-title-block p[b-c9rw3fsx6j] {
    margin: 4px 0 0;
    color: var(--sp-muted);
    font-size: 12px;
    font-weight: 600;
}

.sp-status-pill[b-c9rw3fsx6j] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 5px 9px;
    border: 1px solid #e8d6a5;
    border-radius: 999px;
    background: #fff9e9;
    color: #846515;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: .04em;
    text-transform: uppercase;
}

.sp-status-pill--published[b-c9rw3fsx6j] {
    border-color: #b9decf;
    background: #effaf5;
    color: #176b4a;
}

.sp-status-dot[b-c9rw3fsx6j] {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: currentColor;
}

.sp-toolbar[b-c9rw3fsx6j] {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    justify-content: flex-end;
    gap: 8px;
}

.sp-field[b-c9rw3fsx6j] {
    display: flex;
    flex-direction: column;
    gap: 5px;
    min-width: 0;
}

.sp-field > span[b-c9rw3fsx6j] {
    color: #547087;
    font-size: 10px;
    font-weight: 750;
    letter-spacing: .05em;
    text-transform: uppercase;
}

.sp-field input[b-c9rw3fsx6j],
.sp-field select[b-c9rw3fsx6j],
.sp-field textarea[b-c9rw3fsx6j],
.sp-task-row input[type="text"][b-c9rw3fsx6j],
.sp-document-row input[b-c9rw3fsx6j] {
    width: 100%;
    min-height: 38px;
    border: 1px solid #cbd8e3;
    border-radius: 8px;
    background: #fff;
    color: var(--sp-ink);
    font: inherit;
    font-size: 12px;
    outline: none;
    transition: border-color .15s ease, box-shadow .15s ease;
}

.sp-field input[b-c9rw3fsx6j],
.sp-field select[b-c9rw3fsx6j],
.sp-task-row input[type="text"][b-c9rw3fsx6j],
.sp-document-row input[b-c9rw3fsx6j] {
    padding: 0 10px;
}

.sp-field textarea[b-c9rw3fsx6j] {
    min-height: 78px;
    padding: 9px 10px;
    resize: vertical;
}

.sp-field input:focus[b-c9rw3fsx6j],
.sp-field select:focus[b-c9rw3fsx6j],
.sp-field textarea:focus[b-c9rw3fsx6j],
.sp-task-row input[type="text"]:focus[b-c9rw3fsx6j],
.sp-document-row input:focus[b-c9rw3fsx6j] {
    border-color: var(--sp-blue);
    box-shadow: 0 0 0 3px rgba(7, 81, 156, .11);
}

.sp-field--error input[b-c9rw3fsx6j],
.sp-field--error select[b-c9rw3fsx6j],
.sp-field--error textarea[b-c9rw3fsx6j] {
    border-color: #cf3f3f;
    box-shadow: 0 0 0 3px rgba(207, 63, 63, .1);
}

.sp-field--error input:focus[b-c9rw3fsx6j],
.sp-field--error select:focus[b-c9rw3fsx6j],
.sp-field--error textarea:focus[b-c9rw3fsx6j] {
    border-color: #b42318;
    box-shadow: 0 0 0 3px rgba(180, 35, 24, .15);
}

.sp-field > .sp-field-error[b-c9rw3fsx6j] {
    position: relative;
    display: flex;
    align-items: flex-start;
    gap: 6px;
    width: fit-content;
    max-width: 100%;
    margin-top: 1px;
    padding: 6px 8px;
    border: 1px solid #f1b9b5;
    border-radius: 6px;
    background: #fff2f1;
    color: #a61b14;
    font-size: 10px;
    font-weight: 650;
    line-height: 1.3;
    letter-spacing: 0;
    text-transform: none;
    box-shadow: 0 5px 14px rgba(123, 31, 27, .08);
}

.sp-field > .sp-field-error[b-c9rw3fsx6j]::before {
    position: absolute;
    top: -4px;
    left: 13px;
    width: 7px;
    height: 7px;
    border-top: 1px solid #f1b9b5;
    border-left: 1px solid #f1b9b5;
    background: #fff2f1;
    content: "";
    transform: rotate(45deg);
}

.sp-field-error i[b-c9rw3fsx6j] {
    margin-top: 1px;
    flex: 0 0 auto;
}

.sp-editor-section--error[b-c9rw3fsx6j] {
    border-color: #f1b9b5;
}

.sp-section-error[b-c9rw3fsx6j] {
    display: flex;
    align-items: center;
    gap: 6px;
    margin: 7px 0;
    padding: 7px 9px;
    border: 1px solid #f1b9b5;
    border-radius: 6px;
    background: #fff2f1;
    color: #a61b14;
    font-size: 10px;
    font-weight: 650;
}

.sp-location-field[b-c9rw3fsx6j] {
    min-width: 190px;
}

.sp-period-switcher[b-c9rw3fsx6j] {
    display: inline-grid;
    grid-template-columns: 34px minmax(150px, auto) 34px;
    height: 38px;
    overflow: hidden;
    border: 1px solid #cbd8e3;
    border-radius: 9px;
    background: #fff;
}

.sp-period-switcher button[b-c9rw3fsx6j] {
    border: 0;
    border-right: 1px solid var(--sp-line);
    background: transparent;
    color: var(--sp-blue);
    font-size: 11px;
    font-weight: 750;
    cursor: pointer;
}

.sp-period-switcher button:last-child[b-c9rw3fsx6j] {
    border-right: 0;
}

.sp-period-switcher button:hover:not(:disabled)[b-c9rw3fsx6j] {
    background: #eef5fb;
}

.sp-period-label[b-c9rw3fsx6j] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 0 12px;
    color: var(--sp-navy);
    white-space: nowrap;
}

.sp-period-label strong[b-c9rw3fsx6j] {
    font-size: 11px;
}

.sp-period-label em[b-c9rw3fsx6j] {
    padding-left: 10px;
    border-left: 1px solid var(--sp-line);
    color: var(--sp-blue);
    font-size: 10px;
    font-style: normal;
    font-weight: 800;
}

.sp-button--today[b-c9rw3fsx6j] {
    border-color: #c8dbe4;
    background: #edf6f7;
    color: #0b6974;
}

.sp-view-field[b-c9rw3fsx6j] {
    min-width: 100px;
}

.sp-button[b-c9rw3fsx6j] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    min-height: 38px;
    padding: 0 14px;
    border: 1px solid transparent;
    border-radius: 9px;
    font-size: 11px;
    font-weight: 750;
    cursor: pointer;
    transition: transform .15s ease, box-shadow .15s ease, background .15s ease;
}

.sp-button:hover:not(:disabled)[b-c9rw3fsx6j] {
    transform: translateY(-1px);
}

.sp-button:disabled[b-c9rw3fsx6j],
.sp-period-switcher button:disabled[b-c9rw3fsx6j],
.sp-template-card:disabled[b-c9rw3fsx6j],
.sp-manage-templates:disabled[b-c9rw3fsx6j],
.sp-page[b-c9rw3fsx6j]  .sp-cell-add:disabled,
.sp-page[b-c9rw3fsx6j]  .sp-entry-card:disabled {
    cursor: not-allowed;
    opacity: .48;
}

.sp-button--primary[b-c9rw3fsx6j] {
    background: linear-gradient(135deg, var(--sp-blue), var(--sp-blue-dark));
    box-shadow: 0 8px 16px rgba(7, 81, 156, .18);
    color: #fff;
}

.sp-button--secondary[b-c9rw3fsx6j] {
    border-color: #cbd8e3;
    background: #fff;
    color: var(--sp-blue);
}

.sp-button--danger[b-c9rw3fsx6j] {
    border-color: #f1c7c7;
    background: #fff7f7;
    color: #b42318;
}

.sp-button--danger-solid[b-c9rw3fsx6j] {
    border-color: #bd2c25;
    background: #c9342c;
    box-shadow: 0 8px 16px rgba(185, 40, 34, .16);
    color: #fff;
}

.sp-template-toolbar[b-c9rw3fsx6j] {
    display: grid;
    flex: 0 0 auto;
    grid-template-columns: minmax(132px, auto) minmax(0, 1fr) auto;
    align-items: center;
    gap: 12px;
    margin-bottom: 12px;
    padding: 10px 12px;
    border: 1px solid var(--sp-line);
    border-radius: 12px;
    background: var(--sp-card);
    box-shadow: 0 3px 10px rgba(17, 52, 82, .035);
}

.sp-template-toolbar-heading[b-c9rw3fsx6j] {
    min-width: 0;
}

.sp-template-toolbar-heading h2[b-c9rw3fsx6j] {
    margin: 0;
    color: var(--sp-navy);
    font-size: 13px;
}

.sp-template-toolbar-heading p[b-c9rw3fsx6j] {
    margin: 3px 0 0;
    color: var(--sp-muted);
    font-size: 9px;
    line-height: 1.35;
}

.sp-template-toolbar-list[b-c9rw3fsx6j] {
    display: flex;
    gap: 8px;
    min-width: 0;
    padding: 2px 2px 5px;
    overflow-x: auto;
    scrollbar-color: #b7c9d8 transparent;
    scrollbar-width: thin;
}

.sp-template-toolbar-list .sp-template-card[b-c9rw3fsx6j] {
    min-width: 150px;
    min-height: 50px;
    flex: 1 1 170px;
    max-width: 230px;
}

.sp-template-toolbar > .sp-manage-templates[b-c9rw3fsx6j] {
    width: auto;
    min-height: 38px;
    padding: 0 12px;
    white-space: nowrap;
}

.sp-armed-banner[b-c9rw3fsx6j] {
    display: flex;
    flex: 0 0 auto;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 10px;
    padding: 9px 12px;
    border: 1px solid color-mix(in srgb, var(--sp-accent) 30%, #fff);
    border-left: 4px solid var(--sp-accent);
    border-radius: 9px;
    background: color-mix(in srgb, var(--sp-accent) 7%, #fff);
    color: var(--sp-ink);
    font-size: 11px;
    font-weight: 650;
}

.sp-armed-banner span[b-c9rw3fsx6j] {
    display: flex;
    align-items: center;
    gap: 8px;
}

.sp-armed-banner i[b-c9rw3fsx6j] {
    color: color-mix(in srgb, var(--sp-accent) 70%, #001a26);
}

.sp-armed-banner button[b-c9rw3fsx6j] {
    border: 0;
    background: transparent;
    color: var(--sp-muted);
    cursor: pointer;
}

.sp-workspace[b-c9rw3fsx6j] {
    display: grid;
    flex: 1 1 auto;
    grid-template-columns: minmax(0, 1fr) 224px 258px;
    gap: 10px;
    min-height: 0;
    align-items: stretch;
    overflow: hidden;
}

.sp-workspace--filters-collapsed[b-c9rw3fsx6j] {
    grid-template-columns: minmax(0, 1fr) 224px 30px;
}

.sp-workspace--employees-collapsed[b-c9rw3fsx6j] {
    grid-template-columns: minmax(0, 1fr) 30px 258px;
}

.sp-workspace--employees-collapsed.sp-workspace--filters-collapsed[b-c9rw3fsx6j] {
    grid-template-columns: minmax(0, 1fr) 30px;
    grid-template-rows: 30px 30px minmax(0, 1fr);
    column-gap: 10px;
    row-gap: 6px;
}

.sp-workspace--employees-collapsed.sp-workspace--filters-collapsed .sp-board-card[b-c9rw3fsx6j] {
    grid-column: 1;
    grid-row: 1 / 4;
}

.sp-workspace--employees-collapsed.sp-workspace--filters-collapsed .sp-filter-rail[b-c9rw3fsx6j] {
    grid-column: 2;
    grid-row: 1;
}

.sp-workspace--employees-collapsed.sp-workspace--filters-collapsed .sp-team-rail[b-c9rw3fsx6j] {
    grid-column: 2;
    grid-row: 2;
}

.sp-board-card[b-c9rw3fsx6j],
.sp-team-rail[b-c9rw3fsx6j],
.sp-filter-rail[b-c9rw3fsx6j],
.sp-editor[b-c9rw3fsx6j] {
    border: 1px solid var(--sp-line);
    border-radius: 12px;
    background: var(--sp-card);
    box-shadow: 0 5px 18px rgba(17, 52, 82, .055);
}

.sp-board-card[b-c9rw3fsx6j] {
    display: flex;
    flex-direction: column;
    min-width: 0;
    min-height: 0;
    overflow: hidden;
}

.sp-team-rail[b-c9rw3fsx6j],
.sp-filter-rail[b-c9rw3fsx6j],
.sp-editor[b-c9rw3fsx6j] {
    align-self: start;
}

.sp-board-scroll[b-c9rw3fsx6j] {
    flex: 1 1 auto;
    min-height: 0;
    overflow: auto;
    scrollbar-color: #b7c9d8 #eef3f7;
    scrollbar-width: thin;
}

.sp-coverage-scroll[b-c9rw3fsx6j] {
    min-height: 0;
    overflow: auto;
    scrollbar-color: #b7c9d8 #eef3f7;
    scrollbar-width: thin;
}

.sp-board[b-c9rw3fsx6j] {
    position: relative;
    min-width: var(--sp-grid-min-width, 1050px);
    min-height: 100%;
    background-color: #fff;
    transition: box-shadow .15s ease, background-color .15s ease;
}

.sp-board--employee-drop-target[b-c9rw3fsx6j] {
    background-color: #fbfefd;
    box-shadow: inset 0 0 0 3px #18847b;
}

.sp-board-dividers[b-c9rw3fsx6j] {
    position: absolute;
    inset: 0 0 0 204px;
    display: grid;
    z-index: 1;
    grid-template-columns: repeat(var(--sp-day-count, 7), minmax(0, 1fr));
    pointer-events: none;
}

.sp-board-dividers span[b-c9rw3fsx6j] {
    border-right: 1px solid #d8e3eb;
}

.sp-board-dividers .sp-board-divider--week[b-c9rw3fsx6j] {
    border-left: 3px solid #9db4c5;
}

.sp-board-row[b-c9rw3fsx6j] {
    display: grid;
    grid-template-columns: 204px repeat(var(--sp-day-count, 7), minmax(120px, 1fr));
    min-height: 86px;
    border-bottom: 1px solid var(--sp-line-soft);
}

.sp-board-row--entering[b-c9rw3fsx6j] {
    position: relative;
    z-index: 2;
    animation: sp-employee-row-enter-b-c9rw3fsx6j .92s cubic-bezier(.16, .86, .22, 1) both;
    transform-origin: right center;
}

.sp-board-row--entering .sp-employee-cell[b-c9rw3fsx6j] {
    animation: sp-employee-card-emphasis-b-c9rw3fsx6j .92s cubic-bezier(.16, .86, .22, 1) both;
}

.sp-board-row--entering.sp-board-row--flight-target[b-c9rw3fsx6j],
.sp-board-row--entering.sp-board-row--flight-target .sp-employee-cell[b-c9rw3fsx6j] {
    animation-delay: .72s;
}

.sp-board-row--header[b-c9rw3fsx6j] {
    position: sticky;
    top: 0;
    z-index: 20;
    min-height: 72px;
    border-bottom-color: #cfdae4;
    background-color: #f8fafc;
    isolation: isolate;
    opacity: 1;
}

.sp-board-row--header > .sp-employee-heading[b-c9rw3fsx6j],
.sp-board-row--header > .sp-day-heading[b-c9rw3fsx6j] {
    background-color: #f8fafc;
    opacity: 1;
}

.sp-board-row--header > .sp-employee-heading[b-c9rw3fsx6j] {
    z-index: 2;
}

.sp-board-row--open[b-c9rw3fsx6j] {
    min-height: 72px;
    background: #fbfcfe;
}

.sp-board-group-header[b-c9rw3fsx6j] {
    position: relative;
    z-index: 2;
    display: flex;
    align-items: center;
    gap: 9px;
    min-height: 38px;
    padding: 7px 14px;
    border-bottom: 1px solid #296b72;
    background: linear-gradient(90deg, #0f6871, #32868c);
    color: #fff;
}

.sp-board-group-header--task[b-c9rw3fsx6j] {
    border-bottom-color: #a8560b;
    background: linear-gradient(90deg, #b65b08, #ef810e);
}

.sp-board-group-header--store[b-c9rw3fsx6j] {
    border-bottom-color: #174f80;
    background: linear-gradient(90deg, #07519c, #287bb6);
}

.sp-board-group-header strong[b-c9rw3fsx6j] {
    font-size: 11px;
    font-weight: 800;
}

.sp-board-group-header small[b-c9rw3fsx6j] {
    margin-left: auto;
    color: rgba(255, 255, 255, .78);
    font-size: 8px;
}

.sp-board-group-icon[b-c9rw3fsx6j] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 23px;
    height: 23px;
    border-radius: 7px;
    background: rgba(255, 255, 255, .15);
    font-size: 9px;
}

.sp-employee-heading[b-c9rw3fsx6j],
.sp-employee-cell[b-c9rw3fsx6j] {
    position: sticky;
    left: 0;
    z-index: 1;
    border-right: 1px solid var(--sp-line);
    background: inherit;
}

.sp-employee-heading[b-c9rw3fsx6j] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 14px;
    color: var(--sp-navy);
    font-size: 11px;
    font-weight: 800;
    letter-spacing: .07em;
    text-transform: uppercase;
}

.sp-employee-heading small[b-c9rw3fsx6j] {
    color: var(--sp-muted);
    font-size: 9px;
    font-weight: 650;
    letter-spacing: 0;
    text-transform: none;
}

.sp-day-heading[b-c9rw3fsx6j] {
    position: relative;
    display: grid;
    grid-template-columns: 1fr auto;
    align-content: center;
    column-gap: 6px;
    padding: 0 10px;
    border-right: 1px solid #d8e3eb;
    color: var(--sp-muted);
    text-align: left;
}

.sp-day-heading--week-boundary[b-c9rw3fsx6j] {
    border-left: 3px solid #9db4c5;
    background-image: linear-gradient(90deg, rgba(157, 180, 197, .12), transparent 18px);
}

.sp-month-week-label[b-c9rw3fsx6j] {
    position: absolute;
    top: 5px;
    right: 6px;
    padding: 2px 5px;
    border-radius: 999px;
    background: #e8f0f6;
    color: #58758b;
    font-size: 7px;
    font-style: normal;
    font-weight: 850;
    letter-spacing: .03em;
}

.sp-day-heading span[b-c9rw3fsx6j] {
    align-self: end;
    font-size: 10px;
    font-weight: 750;
    letter-spacing: .06em;
    text-transform: uppercase;
}

.sp-day-heading strong[b-c9rw3fsx6j] {
    grid-row: span 2;
    align-self: center;
    color: var(--sp-navy);
    font-size: 21px;
}

.sp-day-heading small[b-c9rw3fsx6j] {
    font-size: 9px;
}

.sp-day-heading .sp-day-weather[b-c9rw3fsx6j] {
    grid-column: 1 / -1;
    display: flex;
    align-items: center;
    align-self: center;
    gap: 4px;
    min-width: 0;
    overflow: hidden;
    color: #6f9ca5;
    font-size: 8px;
    font-weight: 650;
    letter-spacing: 0;
    text-overflow: ellipsis;
    text-transform: none;
    white-space: nowrap;
}

.sp-day-heading--today[b-c9rw3fsx6j] {
    background: #eaf3fb;
}

.sp-board-row--header > .sp-day-heading--today[b-c9rw3fsx6j] {
    background-color: #eaf3fb;
}

.sp-day-heading--today strong[b-c9rw3fsx6j],
.sp-day-heading--today span[b-c9rw3fsx6j] {
    color: var(--sp-blue);
}

.sp-employee-cell[b-c9rw3fsx6j] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 12px;
}

.sp-avatar[b-c9rw3fsx6j] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    flex: 0 0 36px;
    border: 1px solid #c9d9e6;
    border-radius: 11px;
    background: linear-gradient(145deg, #eaf3fb, #dbeaf6);
    color: var(--sp-blue);
    font-size: 11px;
    font-weight: 850;
    letter-spacing: .03em;
}

.sp-avatar--open[b-c9rw3fsx6j] {
    background: #fff1eb;
    border-color: #ffd2c6;
    color: #d74b2d;
}

.sp-avatar--large[b-c9rw3fsx6j] {
    width: 42px;
    height: 42px;
    flex-basis: 42px;
    border-radius: 13px;
}

.sp-person-copy[b-c9rw3fsx6j] {
    display: flex;
    flex-direction: column;
    min-width: 0;
    flex: 1 1 auto;
    line-height: 1.25;
}

.sp-person-breakdown[b-c9rw3fsx6j] {
    display: flex;
    flex-direction: column;
    gap: 1px;
    margin-top: 4px;
    color: #526d83;
    font-size: 8px;
    font-weight: 650;
    line-height: 1.15;
}

.sp-person-copy strong[b-c9rw3fsx6j] {
    overflow: hidden;
    color: var(--sp-ink);
    font-size: 11px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.sp-person-copy small[b-c9rw3fsx6j] {
    overflow: hidden;
    color: var(--sp-muted);
    font-size: 9px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.sp-person-hours[b-c9rw3fsx6j] {
    margin-left: auto;
    margin-right: 17px;
    padding: 3px 6px;
    border-radius: 999px;
    background: #edf3f8;
    color: #587188;
    font-size: 9px;
    font-weight: 750;
}

.sp-remove-employee[b-c9rw3fsx6j] {
    position: absolute;
    top: 7px;
    right: 6px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 22px;
    height: 22px;
    padding: 0;
    border: 1px solid transparent;
    border-radius: 7px;
    background: transparent;
    color: #8295a5;
    font-size: 9px;
    opacity: .2;
    cursor: pointer;
    transition: opacity .14s ease, color .14s ease, border-color .14s ease, background-color .14s ease;
}

.sp-employee-cell:hover .sp-remove-employee[b-c9rw3fsx6j],
.sp-remove-employee:focus-visible[b-c9rw3fsx6j] {
    opacity: 1;
}

.sp-remove-employee:hover:not(:disabled)[b-c9rw3fsx6j] {
    border-color: #f1c7c7;
    background: #fff3f3;
    color: #c52b25;
}

.sp-remove-employee:disabled[b-c9rw3fsx6j] {
    color: #aebbc5;
    cursor: not-allowed;
}

.sp-page[b-c9rw3fsx6j]  .sp-day-cell {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 5px;
    min-width: 0;
    padding: 6px;
    border-right: 1px solid #d8e3eb;
    background: #fff;
    overflow: visible;
    transition: background-color .14s ease, box-shadow .14s ease;
}

.sp-page[b-c9rw3fsx6j]  .sp-day-cell--today {
    background: #f6faff;
}

.sp-autoshift-diagnostic[b-c9rw3fsx6j] {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: start;
    gap: 12px;
    padding: 13px 15px;
    border: 1px solid #efb7b2;
    border-left: 4px solid #d92d20;
    border-radius: 10px;
    background: #fff5f4;
    color: #6d211d;
    box-shadow: 0 4px 12px rgba(121, 30, 24, .07);
}

.sp-autoshift-diagnostic-icon[b-c9rw3fsx6j] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    border-radius: 8px;
    background: #fee4e2;
    color: #d92d20;
}

.sp-autoshift-diagnostic h2[b-c9rw3fsx6j] {
    margin: 0 0 5px;
    font-size: 13px;
}

.sp-autoshift-diagnostic p[b-c9rw3fsx6j] {
    margin: 0;
    color: #7a302b;
    font-size: 10px;
    line-height: 1.55;
    white-space: pre-line;
}

.sp-autoshift-diagnostic > button[b-c9rw3fsx6j] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 26px;
    height: 26px;
    padding: 0;
    border: 0;
    border-radius: 7px;
    background: transparent;
    color: #a44a44;
    cursor: pointer;
}

.sp-autoshift-diagnostic > button:hover[b-c9rw3fsx6j],
.sp-autoshift-diagnostic > button:focus-visible[b-c9rw3fsx6j] {
    background: #fee4e2;
}

.sp-page[b-c9rw3fsx6j]  .sp-day-cell--leave {
    background-color: #fff9f4;
    background-image: repeating-linear-gradient(
        -45deg,
        rgba(218, 109, 66, .025) 0,
        rgba(218, 109, 66, .025) 6px,
        transparent 6px,
        transparent 12px);
}

.sp-page[b-c9rw3fsx6j]  .sp-day-cell--off {
    background-color: #fbfaff;
}

.sp-page[b-c9rw3fsx6j]  .sp-day-cell--week-boundary {
    border-left: 3px solid #9db4c5;
}

.sp-page[b-c9rw3fsx6j]  .sp-entry-shell {
    position: relative;
}

.sp-page[b-c9rw3fsx6j]  .sp-entry-shell--auto-shift-pending {
    visibility: hidden;
}

.sp-page[b-c9rw3fsx6j]  .sp-entry-card {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    width: 100%;
    min-height: 62px;
    padding: 7px 21px 7px 9px;
    overflow: hidden;
    border: 1px solid color-mix(in srgb, var(--sp-accent) 28%, #dce6ef);
    border-left: 4px solid var(--sp-accent);
    border-radius: 8px;
    background: linear-gradient(120deg, color-mix(in srgb, var(--sp-accent) 9%, #fff), #fff);
    color: var(--sp-ink);
    text-align: left;
    cursor: pointer;
    transition: transform .15s ease, box-shadow .15s ease, border-color .15s ease;
}

.sp-page[b-c9rw3fsx6j]  .sp-entry-copy {
    position: absolute;
    z-index: 2;
    right: 5px;
    bottom: 5px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 22px;
    height: 22px;
    border: 1px solid color-mix(in srgb, var(--sp-accent, #07519c) 25%, #d7e2ea);
    border-radius: 6px;
    background: rgba(255, 255, 255, .94);
    color: color-mix(in srgb, var(--sp-accent, #e5de44) 70%, #001a26);
    font-size: 8px;
    cursor: pointer;
    opacity: .7;
    transform: none;
    transition: opacity .14s ease, transform .14s ease;
}

.sp-page[b-c9rw3fsx6j]  .sp-entry-delete {
    position: absolute;
    z-index: 3;
    top: 5px;
    right: 5px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 20px;
    height: 20px;
    padding: 0;
    border: 0;
    border-radius: 5px;
    background: rgba(255, 255, 255, .92);
    color: #d92d20;
    font-size: 8px;
    cursor: pointer;
    opacity: .72;
    transition: opacity .14s ease, background .14s ease, transform .14s ease;
}

.sp-page[b-c9rw3fsx6j]  .sp-entry-shell:hover .sp-entry-delete,
.sp-page[b-c9rw3fsx6j]  .sp-entry-delete:focus-visible {
    opacity: 1;
}

.sp-page[b-c9rw3fsx6j]  .sp-entry-delete:hover:not(:disabled) {
    background: #fff0ef;
    transform: scale(1.06);
}

.sp-page[b-c9rw3fsx6j]  .sp-entry-delete:disabled {
    cursor: not-allowed;
    opacity: .35;
}

.sp-page[b-c9rw3fsx6j]  .sp-entry-shell:hover .sp-entry-copy,
.sp-page[b-c9rw3fsx6j]  .sp-entry-copy:focus-visible {
    opacity: 1;
}

.sp-page[b-c9rw3fsx6j]  .sp-entry-copy:disabled {
    display: none;
}

.sp-page[b-c9rw3fsx6j]  .sp-entry-card[draggable="true"] {
    cursor: grab;
}

.sp-page[b-c9rw3fsx6j]  .sp-entry-card[draggable="true"]:active:not(:disabled) {
    cursor: grabbing;
}

.sp-page[b-c9rw3fsx6j]  .sp-entry-card--dragging {
    opacity: .35;
    transform: scale(.98);
    box-shadow: none;
}

.sp-page--dragging[b-c9rw3fsx6j]  .sp-day-cell {
    background-color: #fbfdfd;
}

.sp-page--dragging[b-c9rw3fsx6j]  .sp-day-cell--today {
    background-color: #f4f9fc;
}

.sp-page[b-c9rw3fsx6j]  .sp-day-cell--drop-target {
    z-index: 5;
    background: #e5f4f2;
    box-shadow: inset 0 0 0 2px #18847b;
}

.sp-page[b-c9rw3fsx6j]  .sp-day-cell--drop-unavailable {
    background-color: #fbf7f7;
}

.sp-page--dragging[b-c9rw3fsx6j]  .sp-cell-add {
    opacity: 0 !important;
    pointer-events: none;
}

.sp-page[b-c9rw3fsx6j]  .sp-entry-card:hover:not(:disabled) {
    z-index: 1;
    transform: translateY(-1px);
    border-color: color-mix(in srgb, var(--sp-accent) 55%, #dce6ef);
    box-shadow: 0 6px 12px rgba(17, 52, 82, .10);
}

.sp-page[b-c9rw3fsx6j]  .sp-entry-card--training {
    border-style: solid;
}

.sp-page[b-c9rw3fsx6j]  .sp-entry-time {
    color: color-mix(in srgb, var(--sp-accent) 70%, #001a26);
    font-size: 10px;
    font-weight: 850;
    line-height: 1.1;
}

.sp-page[b-c9rw3fsx6j]  .sp-entry-card strong {
    width: 100%;
    overflow: hidden;
    font-size: 10px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.sp-page[b-c9rw3fsx6j]  .sp-entry-card small {
    display: block;
    width: 100%;
    overflow: hidden;
    color: var(--sp-muted);
    font-size: 8px;
    line-height: 1.25;
    white-space: pre-line;
}

.sp-page[b-c9rw3fsx6j]  .sp-entry-published {
    position: absolute;
    top: 7px;
    right: 29px;
    color: #219267;
    font-size: 9px;
}

.sp-page[b-c9rw3fsx6j]  .sp-leave-card {
    --sp-leave-accent: #d97706;
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    width: 100%;
    min-height: 62px;
    padding: 7px 9px;
    overflow: hidden;
    border: 1px solid #f0cfb0;
    border-left: 4px solid var(--sp-leave-accent);
    border-radius: 8px;
    background: linear-gradient(120deg, #fff4e8, #fff);
    color: var(--sp-ink);
    text-align: left;
}

.sp-page[b-c9rw3fsx6j]  .sp-leave-card-time {
    display: flex;
    align-items: center;
    gap: 5px;
    color: #a95812;
    font-size: 10px;
    font-weight: 850;
    line-height: 1.1;
}

.sp-page[b-c9rw3fsx6j]  .sp-leave-card strong {
    width: 100%;
    overflow: hidden;
    font-size: 10px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.sp-page[b-c9rw3fsx6j]  .sp-leave-card small {
    display: block;
    width: 100%;
    overflow: hidden;
    color: #9a6a43;
    font-size: 8px;
    line-height: 1.25;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.sp-page[b-c9rw3fsx6j]  .sp-off-day-card {
    --sp-off-day-accent: #8064c7;
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    width: 100%;
    min-height: 62px;
    padding: 7px 9px;
    overflow: hidden;
    border: 1px solid #d9d0f0;
    border-left: 4px solid var(--sp-off-day-accent);
    border-radius: 8px;
    background: linear-gradient(120deg, #f2edff, #fdfcff);
    color: var(--sp-ink);
    text-align: left;
    cursor: pointer;
    transition: transform .15s ease, border-color .15s ease, box-shadow .15s ease;
}

.sp-page[b-c9rw3fsx6j]  .sp-off-day-card:hover:not(:disabled),
.sp-page[b-c9rw3fsx6j]  .sp-off-day-card:focus-visible:not(:disabled) {
    transform: translateY(-1px);
    border-color: #a996dc;
    box-shadow: 0 6px 12px rgba(91, 65, 150, .12);
}

.sp-page[b-c9rw3fsx6j]  .sp-off-day-card:disabled {
    cursor: default;
}

.sp-page[b-c9rw3fsx6j]  .sp-off-day-card-label {
    display: flex;
    align-items: center;
    gap: 5px;
    color: #6246a5;
    font-size: 10px;
    font-weight: 850;
    line-height: 1.1;
}

.sp-page[b-c9rw3fsx6j]  .sp-off-day-card strong {
    width: 100%;
    overflow: hidden;
    font-size: 10px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.sp-page[b-c9rw3fsx6j]  .sp-off-day-card small {
    display: block;
    width: 100%;
    overflow: hidden;
    color: #766b91;
    font-size: 8px;
    line-height: 1.25;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.sp-page[b-c9rw3fsx6j]  .sp-cell-add {
    border: 0;
    color: #3d8992;
    cursor: pointer;
    transition: opacity .16s ease, background .16s ease, box-shadow .16s ease, transform .16s ease;
}

.sp-page[b-c9rw3fsx6j]  .sp-cell-add--unavailable {
    color: #8998a4;
    cursor: not-allowed;
}

.sp-page[b-c9rw3fsx6j]  .sp-cell-add--empty {
    position: absolute;
    z-index: 3;
    inset: 6px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 9px;
    background: transparent;
    font-size: 14px;
    opacity: 0;
}

.sp-page[b-c9rw3fsx6j]  .sp-day-cell--empty:hover,
.sp-page[b-c9rw3fsx6j]  .sp-day-cell--empty:focus-within {
    z-index: 4;
}

.sp-page[b-c9rw3fsx6j]  .sp-day-cell--empty:hover .sp-cell-add--empty,
.sp-page[b-c9rw3fsx6j]  .sp-cell-add--empty:focus-visible {
    background: #e7f2f2;
    box-shadow: inset 0 0 0 1px rgba(61, 137, 146, .04);
    opacity: 1;
}

.sp-page[b-c9rw3fsx6j]  .sp-cell-add--occupied {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
    width: 100%;
    min-height: 25px;
    margin-top: auto;
    border: 1px dashed transparent;
    border-radius: 7px;
    background: transparent;
    font-size: 9px;
    font-weight: 750;
    opacity: .18;
}

.sp-page[b-c9rw3fsx6j]  .sp-day-cell:hover .sp-cell-add--occupied,
.sp-page[b-c9rw3fsx6j]  .sp-cell-add--occupied:focus-visible {
    border-color: #b9d3d5;
    background: #edf6f6;
    opacity: 1;
}

.sp-board-empty[b-c9rw3fsx6j] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 170px;
    color: var(--sp-muted);
    text-align: center;
}

.sp-board-empty i[b-c9rw3fsx6j] {
    margin-bottom: 8px;
    color: #9eb1c0;
    font-size: 23px;
}

.sp-board-empty strong[b-c9rw3fsx6j] {
    color: var(--sp-ink);
    font-size: 12px;
}

.sp-board-empty span[b-c9rw3fsx6j] {
    margin-top: 4px;
    font-size: 10px;
}

.sp-board-empty--employees[b-c9rw3fsx6j] {
    min-height: 150px;
    margin: 10px;
    border: 1px dashed #b8d3d4;
    border-radius: 10px;
    background: #f7fbfb;
}

.sp-page--dragging-employee .sp-board-empty--employees[b-c9rw3fsx6j] {
    border-color: #18847b;
    background: #e9f6f4;
}

.sp-coverage[b-c9rw3fsx6j] {
    display: flex;
    flex: 0 0 auto;
    flex-direction: column;
    max-height: 34%;
    min-height: 0;
    padding: 13px;
    overflow: hidden;
    background: #fbfcfe;
}

.sp-coverage--collapsed[b-c9rw3fsx6j] {
    padding-bottom: 10px;
}

.sp-section-heading[b-c9rw3fsx6j] {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 9px;
}

.sp-section-heading h2[b-c9rw3fsx6j],
.sp-rail-heading h2[b-c9rw3fsx6j] {
    margin: 0;
    color: var(--sp-navy);
    font-size: 13px;
}

.sp-section-heading > span[b-c9rw3fsx6j],
.sp-coverage-toggle span[b-c9rw3fsx6j] {
    color: var(--sp-muted);
    font-size: 9px;
}

.sp-coverage-toggle[b-c9rw3fsx6j] {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 5px 7px;
    border: 0;
    border-radius: 6px;
    background: transparent;
    color: var(--sp-blue);
    cursor: pointer;
}

.sp-coverage-toggle:hover[b-c9rw3fsx6j],
.sp-coverage-toggle:focus-visible[b-c9rw3fsx6j] {
    background: #eef5fb;
}

.sp-coverage-toggle i[b-c9rw3fsx6j] {
    font-size: 9px;
}

.sp-coverage-grid[b-c9rw3fsx6j] {
    min-width: var(--sp-grid-min-width, 1050px);
}

.sp-coverage-row[b-c9rw3fsx6j] {
    display: grid;
    grid-template-columns: 204px repeat(var(--sp-day-count, 7), minmax(120px, 1fr));
    min-height: 42px;
    border-top: 1px solid var(--sp-line-soft);
}

.sp-coverage-label[b-c9rw3fsx6j] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 6px 9px;
}

.sp-color-dot[b-c9rw3fsx6j] {
    width: 8px;
    height: 8px;
    flex: 0 0 8px;
    border-radius: 50%;
    background: var(--sp-accent);
}

.sp-coverage-label > span:last-child[b-c9rw3fsx6j] {
    display: flex;
    flex-direction: column;
}

.sp-coverage-label strong[b-c9rw3fsx6j] {
    font-size: 10px;
}

.sp-coverage-label small[b-c9rw3fsx6j] {
    color: var(--sp-muted);
    font-size: 8px;
}

.sp-coverage-value[b-c9rw3fsx6j] {
    display: flex;
    align-items: baseline;
    justify-content: center;
    gap: 3px;
    padding: 6px;
    border-left: 1px solid var(--sp-line-soft);
}

.sp-coverage-value strong[b-c9rw3fsx6j] {
    color: var(--sp-ink);
    font-size: 11px;
}

.sp-coverage-value small[b-c9rw3fsx6j] {
    color: var(--sp-muted);
    font-size: 8px;
}

.sp-coverage-value--empty strong[b-c9rw3fsx6j],
.sp-coverage-value--empty small[b-c9rw3fsx6j] {
    color: #b0bfca;
}

.sp-coverage-value--week-boundary[b-c9rw3fsx6j] {
    border-left: 3px solid #9db4c5;
    background: linear-gradient(90deg, rgba(157, 180, 197, .10), transparent 18px);
}

.sp-team-rail[b-c9rw3fsx6j] {
    position: sticky;
    top: 0;
    display: flex;
    flex-direction: column;
    align-self: stretch;
    min-height: 0;
    padding: 13px 10px 10px;
}

.sp-team-rail--collapsed[b-c9rw3fsx6j] {
    display: flex;
    align-self: start;
    justify-content: center;
    height: auto;
    padding: 3px;
    border-radius: 8px;
    overflow: visible;
}

.sp-filter-rail[b-c9rw3fsx6j] {
    position: sticky;
    top: 0;
    min-width: 0;
    min-height: 0;
    height: 100%;
    padding: 12px;
    overflow-y: auto;
    border: 1px solid #cfe0e4;
    border-radius: 12px;
    background: linear-gradient(160deg, #f3f9f9, #e9f3f4);
    box-shadow: 0 5px 18px rgba(17, 52, 82, .055);
    scrollbar-color: #a8c6ca transparent;
    scrollbar-width: thin;
}

.sp-filter-rail--collapsed[b-c9rw3fsx6j] {
    display: flex;
    align-self: start;
    justify-content: center;
    height: auto;
    padding: 3px;
    border-radius: 8px;
    overflow: visible;
}

.sp-filter-collapse[b-c9rw3fsx6j],
.sp-team-collapse[b-c9rw3fsx6j] {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
    width: 22px;
    height: 22px;
    margin: 0;
    padding: 0;
    border: 1px solid #b9d1d5;
    border-radius: 6px;
    background: rgba(255, 255, 255, .82);
    color: #126a73;
    font-size: 8px;
    cursor: pointer;
}

.sp-team-collapse[b-c9rw3fsx6j] {
    align-self: flex-end;
    margin: 4px 5px 8px 0;
}

.sp-filter-collapse[b-c9rw3fsx6j] {
    align-self: flex-start;
    margin: 4px 0 8px 5px;
}

.sp-team-rail--collapsed .sp-team-collapse[b-c9rw3fsx6j],
.sp-filter-rail--collapsed .sp-filter-collapse[b-c9rw3fsx6j] {
    align-self: center;
    margin: 0;
}

.sp-filter-collapse span[b-c9rw3fsx6j] {
    position: absolute;
    top: 3px;
    right: 2px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 15px;
    height: 15px;
    padding: 0 3px;
    border-radius: 999px;
    background: #ef810e;
    color: #fff;
    font-size: 7px;
    font-weight: 800;
}

.sp-filter-header[b-c9rw3fsx6j] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    margin-bottom: 8px;
    padding: 0 2px 9px;
    border-bottom: 1px solid #cfe0e4;
}

.sp-filter-header > span[b-c9rw3fsx6j] {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    color: #155f68;
}

.sp-filter-header strong[b-c9rw3fsx6j] {
    font-size: 16px;
    font-weight: 800;
}

.sp-filter-header em[b-c9rw3fsx6j] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 19px;
    height: 19px;
    padding: 0 5px;
    border-radius: 999px;
    background: #2f858d;
    color: #fff;
    font-size: 8px;
    font-style: normal;
    font-weight: 800;
}

.sp-filter-header button[b-c9rw3fsx6j] {
    border: 0;
    background: transparent;
    color: #078a98;
    font: inherit;
    font-size: 10px;
    font-weight: 750;
    cursor: pointer;
}

.sp-filter-header button:disabled[b-c9rw3fsx6j] {
    opacity: .4;
    cursor: default;
}

.sp-filter-section[b-c9rw3fsx6j] {
    padding: 5px 0 8px;
    border-bottom: 1px solid rgba(176, 204, 208, .65);
}

.sp-filter-section-toggle[b-c9rw3fsx6j] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    width: 100%;
    min-height: 32px;
    padding: 3px 2px;
    border: 0;
    background: transparent;
    color: #126a73;
    font: inherit;
    font-size: 11px;
    font-weight: 800;
    cursor: pointer;
}

.sp-filter-section-toggle span[b-c9rw3fsx6j] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

.sp-filter-section-toggle > i[b-c9rw3fsx6j] {
    color: #78a9ae;
    font-size: 8px;
}

.sp-filter-options[b-c9rw3fsx6j] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    padding: 2px 0 3px;
}

.sp-filter-options label[b-c9rw3fsx6j],
.sp-filter-check[b-c9rw3fsx6j] {
    display: flex;
    align-items: center;
    gap: 7px;
    min-height: 28px;
    padding: 3px 4px;
    border-radius: 7px;
    color: #245d64;
    font-size: 10px;
    cursor: pointer;
}

.sp-filter-options label:hover[b-c9rw3fsx6j],
.sp-filter-check:hover[b-c9rw3fsx6j] {
    background: rgba(255, 255, 255, .62);
}

.sp-filter-options input[b-c9rw3fsx6j],
.sp-filter-check input[b-c9rw3fsx6j] {
    width: 15px;
    height: 15px;
    flex: 0 0 15px;
    accent-color: #147681;
}

.sp-filter-dot[b-c9rw3fsx6j] {
    width: 7px;
    height: 7px;
    flex: 0 0 7px;
    border-radius: 50%;
    background: #0f6871;
}

.sp-filter-dot--none[b-c9rw3fsx6j] { background: #8aa8ad; }
.sp-filter-dot--task[b-c9rw3fsx6j] { background: #ef810e; }

.sp-filter-field[b-c9rw3fsx6j] {
    display: flex;
    flex-direction: column;
    gap: 6px;
    padding: 11px 2px 4px;
    color: #126a73;
    font-size: 10px;
    font-weight: 800;
}

.sp-filter-field select[b-c9rw3fsx6j] {
    width: 100%;
    min-height: 36px;
    padding: 0 9px;
    border: 1px solid #b9d1d5;
    border-radius: 8px;
    background: rgba(255, 255, 255, .66);
    color: #245d64;
    font: inherit;
    font-size: 10px;
    font-weight: 600;
    outline: none;
}

.sp-filter-field .sp-filter-check[b-c9rw3fsx6j] {
    margin-left: -4px;
    font-weight: 600;
}

.sp-employee-picker[b-c9rw3fsx6j] {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    min-width: 0;
    min-height: 0;
}

.sp-employee-listbox[b-c9rw3fsx6j] {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    gap: 5px;
    min-height: 0;
    padding: 8px 2px;
    overflow-y: auto;
    scrollbar-color: #b7c9d8 transparent;
    scrollbar-width: thin;
}

.sp-employee-option[b-c9rw3fsx6j] {
    display: grid;
    grid-template-columns: 20px 30px minmax(0, 1fr);
    align-items: center;
    gap: 7px;
    width: 100%;
    min-height: 48px;
    padding: 6px;
    border: 1px solid var(--sp-line);
    border-radius: 9px;
    background: #fff;
    color: var(--sp-ink);
    text-align: left;
    cursor: grab;
    transition: border-color .14s ease, background-color .14s ease, box-shadow .14s ease;
}

.sp-employee-option:hover[b-c9rw3fsx6j],
.sp-employee-option--selected[b-c9rw3fsx6j] {
    border-color: #8bbfc0;
    background: #edf7f6;
    box-shadow: 0 3px 9px rgba(17, 52, 82, .06);
}

.sp-employee-option:active[b-c9rw3fsx6j] {
    cursor: grabbing;
}

.sp-employee-check[b-c9rw3fsx6j] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 20px;
    height: 20px;
    border: 1px solid #c6d7e2;
    border-radius: 6px;
    background: #f7fafc;
    color: #7c91a2;
    font-size: 8px;
    padding: 0;
    cursor: pointer;
}

.sp-employee-check:hover[b-c9rw3fsx6j] {
    border-color: #18847b;
    background: #18847b;
    color: #fff;
}

.sp-employee-option--selected .sp-employee-check[b-c9rw3fsx6j] {
    border-color: #18847b;
    background: #18847b;
    color: #fff;
}

.sp-avatar--picker[b-c9rw3fsx6j] {
    width: 30px;
    height: 30px;
    flex-basis: 30px;
    border-radius: 9px;
    font-size: 9px;
}

.sp-employee-actions[b-c9rw3fsx6j] {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 6px;
}

.sp-add-selected[b-c9rw3fsx6j] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    width: 100%;
    min-height: 34px;
    padding: 7px 9px;
    border: 1px solid #b8d3d4;
    border-radius: 8px;
    background: #edf7f6;
    color: #116e69;
    font-size: 9px;
    font-weight: 800;
    cursor: pointer;
}

.sp-add-all[b-c9rw3fsx6j] {
    border-color: #c9d9e6;
    background: #f2f7fb;
    color: var(--sp-blue);
}

.sp-add-selected span[b-c9rw3fsx6j] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 18px;
    height: 18px;
    padding: 0 5px;
    border-radius: 999px;
    background: #18847b;
    color: #fff;
}

.sp-add-selected:disabled[b-c9rw3fsx6j] {
    border-color: var(--sp-line);
    background: #f7f9fb;
    color: #9aabb8;
    cursor: not-allowed;
}

.sp-employee-picker-state[b-c9rw3fsx6j] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    min-height: 72px;
    padding: 10px;
    color: var(--sp-muted);
    font-size: 9px;
    text-align: center;
}

.sp-rail-heading[b-c9rw3fsx6j] {
    padding: 2px 3px 11px;
    border-bottom: 1px solid var(--sp-line-soft);
}

.sp-rail-heading p[b-c9rw3fsx6j] {
    margin: 4px 0 0;
    color: var(--sp-muted);
    font-size: 9px;
    line-height: 1.4;
}

.sp-template-card[b-c9rw3fsx6j] {
    position: relative;
    display: grid;
    grid-template-columns: 30px minmax(0, 1fr) 14px;
    align-items: center;
    gap: 7px;
    min-height: 57px;
    padding: 8px;
    overflow: hidden;
    border: 1px solid color-mix(in srgb, var(--sp-accent) 20%, var(--sp-line));
    border-radius: 10px;
    background: linear-gradient(135deg, #fff 20%, color-mix(in srgb, var(--sp-accent) 8%, #fff));
    color: var(--sp-ink);
    text-align: left;
    cursor: pointer;
    transition: transform .15s ease, border-color .15s ease, box-shadow .15s ease;
}

.sp-template-card[b-c9rw3fsx6j]::after {
    position: absolute;
    inset: auto 0 0;
    height: 3px;
    background: var(--sp-accent);
    content: "";
}

.sp-template-card:hover:not(:disabled)[b-c9rw3fsx6j],
.sp-template-card--active[b-c9rw3fsx6j] {
    transform: translateY(-1px);
    border-color: color-mix(in srgb, var(--sp-accent) 52%, var(--sp-line));
    box-shadow: 0 6px 13px rgba(17, 52, 82, .09);
}

.sp-template-card--active[b-c9rw3fsx6j] {
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--sp-accent) 14%, transparent);
}

.sp-template-icon[b-c9rw3fsx6j] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    border-radius: 9px;
    background: color-mix(in srgb, var(--sp-accent) 12%, #fff);
    color: color-mix(in srgb, var(--sp-accent) 70%, #001a26);
}

.sp-template-copy[b-c9rw3fsx6j] {
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.sp-template-copy strong[b-c9rw3fsx6j] {
    overflow: hidden;
    font-size: 10px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.sp-template-copy small[b-c9rw3fsx6j] {
    color: var(--sp-muted);
    font-size: 8px;
}

.sp-template-plus[b-c9rw3fsx6j] {
    color: color-mix(in srgb, var(--sp-accent) 70%, #001a26);
    font-size: 9px;
}

.sp-manage-templates[b-c9rw3fsx6j] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    width: 100%;
    min-height: 32px;
    border: 1px solid var(--sp-line);
    border-radius: 8px;
    background: #f8fafc;
    color: var(--sp-blue);
    font-size: 9px;
    font-weight: 750;
    cursor: pointer;
}

.sp-editor[b-c9rw3fsx6j] {
    position: sticky;
    top: 0;
    max-height: calc(100vh - 92px);
    overflow: hidden;
}

.sp-modal-backdrop[b-c9rw3fsx6j] {
    position: fixed;
    z-index: 1200;
    inset: 0;
    display: grid;
    place-items: center;
    padding: 28px;
    background: rgba(13, 34, 51, .48);
    backdrop-filter: blur(3px);
}

.sp-modal-backdrop .sp-editor--modal[b-c9rw3fsx6j] {
    position: relative;
    inset: auto;
    top: auto;
    width: min(720px, calc(100vw - 40px));
    max-height: calc(100vh - 56px);
    box-shadow: 0 28px 80px rgba(9, 35, 55, .28);
}

.sp-modal-backdrop .sp-editor--modal .sp-editor-body[b-c9rw3fsx6j] {
    max-height: calc(100vh - 220px);
}

.sp-management-backdrop[b-c9rw3fsx6j] {
    z-index: 1300;
    padding: 18px;
}

.sp-copy-backdrop[b-c9rw3fsx6j] {
    z-index: 1350;
    padding: 18px;
}

.sp-copy-modal[b-c9rw3fsx6j] {
    display: flex;
    flex-direction: column;
    width: min(900px, calc(100vw - 36px));
    max-height: min(92vh, 860px);
    overflow: hidden;
    border: 1px solid var(--sp-line);
    border-radius: 16px;
    background: #fff;
    box-shadow: 0 30px 90px rgba(9, 35, 55, .32);
}

.sp-copy-body[b-c9rw3fsx6j] {
    padding: 20px;
    overflow: auto;
}

.sp-copy-calendars[b-c9rw3fsx6j] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 28px;
}

.sp-copy-modal[b-c9rw3fsx6j]  .sp-copy-calendar + .sp-copy-calendar {
    padding-left: 28px;
    border-left: 1px solid var(--sp-line);
}

.sp-copy-modal[b-c9rw3fsx6j]  .sp-copy-calendar h3,
.sp-copy-options h3[b-c9rw3fsx6j] {
    margin: 0 0 14px;
    color: #0d6f78;
    font-size: 19px;
}

.sp-copy-scope[b-c9rw3fsx6j] {
    display: flex;
    align-items: center;
    gap: 7px;
    margin: -5px 0 13px;
    padding: 8px 10px;
    border: 1px solid #cfe1e4;
    border-radius: 8px;
    background: #f0f8f8;
    color: #176f77;
    font-size: 9px;
    font-weight: 700;
}

.sp-copy-modal[b-c9rw3fsx6j]  .sp-copy-month-head {
    display: grid;
    grid-template-columns: 34px minmax(0, 1fr) 34px;
    align-items: center;
    margin-bottom: 8px;
}

.sp-copy-modal[b-c9rw3fsx6j]  .sp-copy-month-head strong {
    color: #237a82;
    font-size: 13px;
    text-align: center;
}

.sp-copy-modal[b-c9rw3fsx6j]  .sp-copy-month-head button {
    width: 30px;
    height: 30px;
    border: 0;
    border-radius: 8px;
    background: transparent;
    color: #0d727c;
    cursor: pointer;
}

.sp-copy-modal[b-c9rw3fsx6j]  .sp-copy-month-head button:hover {
    background: #edf6f6;
}

.sp-copy-modal[b-c9rw3fsx6j]  .sp-copy-calendar-grid {
    display: grid;
    grid-template-columns: repeat(7, minmax(0, 1fr));
    row-gap: 5px;
}

.sp-copy-modal[b-c9rw3fsx6j]  .sp-copy-calendar-weekdays span {
    padding: 5px 0;
    color: #8aa9ad;
    font-size: 9px;
    font-weight: 800;
    text-align: center;
}

.sp-copy-modal[b-c9rw3fsx6j]  .sp-copy-day {
    min-height: 34px;
    border: 0;
    background: transparent;
    color: #6d7781;
    font-size: 11px;
    cursor: pointer;
}

.sp-copy-modal[b-c9rw3fsx6j]  .sp-copy-day:hover {
    background: #edf7f6;
}

.sp-copy-modal[b-c9rw3fsx6j]  .sp-copy-day--outside {
    color: #c3cbd0;
}

.sp-copy-modal[b-c9rw3fsx6j]  .sp-copy-day--selected {
    background: #dceced;
    color: #0f6f78;
}

.sp-copy-modal[b-c9rw3fsx6j]  .sp-copy-day--start,
.sp-copy-modal[b-c9rw3fsx6j]  .sp-copy-day--end {
    border-radius: 999px;
    background: #0d7580;
    color: #fff;
    font-weight: 850;
}

.sp-copy-options[b-c9rw3fsx6j] {
    margin-top: 24px;
    padding-top: 18px;
    border-top: 1px solid var(--sp-line);
}

.sp-copy-option-grid[b-c9rw3fsx6j] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 9px 20px;
}

.sp-copy-option-grid label[b-c9rw3fsx6j] {
    display: flex;
    align-items: center;
    gap: 8px;
    color: var(--sp-ink);
    font-size: 11px;
    cursor: pointer;
}

.sp-copy-option-grid input[b-c9rw3fsx6j] {
    width: 16px;
    height: 16px;
    accent-color: #0d7580;
}

.sp-copy-option-grid .sp-copy-replace[b-c9rw3fsx6j] {
    color: #a33a2f;
}

.sp-copy-options p[b-c9rw3fsx6j] {
    margin: 12px 0 0;
    color: var(--sp-muted);
    font-size: 9px;
}

.sp-copy-footer[b-c9rw3fsx6j] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 12px 16px;
    border-top: 1px solid var(--sp-line);
    background: #f8fbfd;
}

.sp-copy-footer > span[b-c9rw3fsx6j],
.sp-copy-footer > div[b-c9rw3fsx6j] {
    display: flex;
    align-items: center;
    gap: 9px;
}

.sp-copy-footer > span[b-c9rw3fsx6j] {
    color: var(--sp-muted);
    font-size: 9px;
}

.sp-copy-footer > span strong[b-c9rw3fsx6j] {
    color: var(--sp-navy);
}

.sp-management-modal[b-c9rw3fsx6j] {
    display: flex;
    flex-direction: column;
    width: min(1180px, calc(100vw - 36px));
    height: min(92vh, 920px);
    min-height: 520px;
    overflow: hidden;
    border: 1px solid var(--sp-line);
    border-radius: 16px;
    background: #fff;
    box-shadow: 0 30px 90px rgba(9, 35, 55, .32);
}

.sp-management-header[b-c9rw3fsx6j] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    flex: 0 0 auto;
    min-height: 62px;
    padding: 10px 16px;
    border-bottom: 1px solid var(--sp-line);
    background: linear-gradient(145deg, #f8fbfd, #eef5fa);
}

.sp-management-header h2[b-c9rw3fsx6j] {
    margin: 0;
    color: var(--sp-navy);
    font-size: 18px;
}

.sp-management-body[b-c9rw3fsx6j] {
    flex: 1 1 auto;
    min-height: 0;
    padding: 14px;
    overflow: auto;
    scrollbar-color: #b7c9d8 #eef3f7;
    scrollbar-width: thin;
}

.sp-editor-header[b-c9rw3fsx6j] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
    padding: 14px;
    border-bottom: 1px solid var(--sp-line);
    background: linear-gradient(145deg, #f8fbfd, #eef5fa);
}

.sp-editor-person[b-c9rw3fsx6j] {
    display: flex;
    align-items: center;
    gap: 10px;
    min-width: 0;
}

.sp-editor-person > span:last-child[b-c9rw3fsx6j] {
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.sp-editor-person small[b-c9rw3fsx6j] {
    color: var(--sp-blue);
    font-size: 8px;
    font-weight: 800;
    letter-spacing: .09em;
    text-transform: uppercase;
}

.sp-editor-person strong[b-c9rw3fsx6j] {
    overflow: hidden;
    color: var(--sp-navy);
    font-size: 12px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.sp-editor-person em[b-c9rw3fsx6j] {
    color: var(--sp-muted);
    font-size: 9px;
    font-style: normal;
}

.sp-icon-button[b-c9rw3fsx6j] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    flex: 0 0 30px;
    border: 1px solid #cbd8e3;
    border-radius: 8px;
    background: #fff;
    color: var(--sp-muted);
    cursor: pointer;
}

.sp-editor-body[b-c9rw3fsx6j] {
    max-height: calc(100vh - 230px);
    padding: 13px;
    overflow-y: auto;
    scrollbar-color: #b7c9d8 transparent;
    scrollbar-width: thin;
}

.sp-kind-switch[b-c9rw3fsx6j] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 6px;
    margin-bottom: 12px;
    padding: 4px;
    border-radius: 10px;
    background: #edf3f7;
}

.sp-field-help[b-c9rw3fsx6j] {
    color: var(--sp-muted);
    font-size: 8px;
    line-height: 1.3;
}

.sp-kind-switch button[b-c9rw3fsx6j] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    min-height: 34px;
    border: 0;
    border-radius: 7px;
    background: transparent;
    color: var(--sp-muted);
    font-size: 10px;
    font-weight: 750;
    cursor: pointer;
}

.sp-kind-switch button.active[b-c9rw3fsx6j] {
    background: #fff;
    box-shadow: 0 3px 8px rgba(17, 52, 82, .09);
    color: var(--sp-blue);
}

.sp-editor-section[b-c9rw3fsx6j] {
    margin-bottom: 12px;
    padding: 11px;
    border: 1px solid var(--sp-line-soft);
    border-radius: 10px;
    background: #fff;
}

.sp-editor-section-title[b-c9rw3fsx6j] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    margin-bottom: 10px;
    color: var(--sp-navy);
    font-size: 11px;
    font-weight: 800;
}

.sp-editor-section-title small[b-c9rw3fsx6j] {
    color: var(--sp-muted);
    font-size: 8px;
    font-weight: 650;
}

.sp-editor-section-title button[b-c9rw3fsx6j] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 4px 7px;
    border: 1px solid #cbd8e3;
    border-radius: 6px;
    background: #f8fafc;
    color: var(--sp-blue);
    font-size: 8px;
    font-weight: 750;
    cursor: pointer;
}

.sp-upload-button[b-c9rw3fsx6j] {
    position: relative;
    display: inline-flex;
    align-items: center;
    gap: 5px;
    color: var(--sp-blue);
    font-size: 9px;
    font-weight: 750;
    cursor: pointer;
}

.sp-upload-button[b-c9rw3fsx6j]  input[type="file"] {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    opacity: 0;
}

.sp-upload-button.disabled[b-c9rw3fsx6j] { opacity: .45; cursor: not-allowed; }

.sp-editor-section > .sp-field + .sp-field[b-c9rw3fsx6j],
.sp-editor-section > .sp-form-grid + .sp-field[b-c9rw3fsx6j],
.sp-editor-section > .sp-field + .sp-form-grid[b-c9rw3fsx6j],
.sp-editor-section > .sp-form-grid + .sp-form-grid[b-c9rw3fsx6j] {
    margin-top: 9px;
}

.sp-form-grid[b-c9rw3fsx6j] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
}

.sp-form-grid > .sp-field[b-c9rw3fsx6j] {
    margin-top: 0;
}

.sp-recurrence[b-c9rw3fsx6j] {
    margin-top: 9px;
    padding: 10px;
    border: 1px solid #d7e3ec;
    border-radius: 9px;
    background: #f8fbfd;
}

.sp-recurrence--error[b-c9rw3fsx6j] {
    border-color: #f1b9b5;
    background: #fffafa;
}

.sp-recurrence-heading[b-c9rw3fsx6j] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 8px;
}

.sp-recurrence-heading > span[b-c9rw3fsx6j] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
}

.sp-recurrence-heading strong[b-c9rw3fsx6j] {
    color: var(--sp-navy);
    font-size: 10px;
    font-weight: 800;
    letter-spacing: .04em;
    text-transform: uppercase;
}

.sp-recurrence-heading small[b-c9rw3fsx6j] {
    color: var(--sp-muted);
    font-size: 8px;
}

.sp-recurrence-heading button[b-c9rw3fsx6j] {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    flex: 0 0 auto;
    min-height: 28px;
    padding: 0 9px;
    border: 1px solid #bfd0de;
    border-radius: 7px;
    background: #fff;
    color: var(--sp-blue);
    font: inherit;
    font-size: 9px;
    font-weight: 750;
    cursor: pointer;
}

.sp-recurrence-heading button:disabled[b-c9rw3fsx6j] {
    opacity: .5;
    cursor: default;
}

.sp-recurrence-days[b-c9rw3fsx6j] {
    display: grid;
    grid-template-columns: repeat(7, minmax(0, 1fr));
    gap: 6px;
}

.sp-recurrence-days button[b-c9rw3fsx6j] {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 2px;
    min-width: 0;
    min-height: 48px;
    padding: 6px 4px;
    border: 1px solid #cbd9e4;
    border-radius: 8px;
    background: #fff;
    color: #71879a;
    font: inherit;
    cursor: pointer;
    transition: border-color .15s ease, background .15s ease, box-shadow .15s ease, color .15s ease;
}

.sp-recurrence-days button:hover[b-c9rw3fsx6j] {
    border-color: #79a9cf;
    background: #f2f8fc;
    color: var(--sp-blue);
}

.sp-recurrence-days button.selected[b-c9rw3fsx6j] {
    border-color: var(--sp-blue);
    background: #e9f3fb;
    color: var(--sp-blue);
    box-shadow: inset 0 0 0 1px rgba(7, 81, 156, .08);
}

.sp-recurrence-days span[b-c9rw3fsx6j] {
    font-size: 8px;
    font-weight: 750;
    text-transform: uppercase;
}

.sp-recurrence-days strong[b-c9rw3fsx6j] {
    overflow: hidden;
    max-width: 100%;
    font-size: 9px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.sp-recurrence-days i[b-c9rw3fsx6j] {
    position: absolute;
    top: 4px;
    right: 5px;
    font-size: 7px;
}

.sp-inline-empty[b-c9rw3fsx6j] {
    padding: 9px;
    border: 1px dashed #d5e0e8;
    border-radius: 7px;
    background: #fafcfd;
    color: #8aa0b2;
    font-size: 9px;
    text-align: center;
}

.sp-editor-list[b-c9rw3fsx6j] {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.sp-task-row[b-c9rw3fsx6j] {
    display: grid;
    grid-template-columns: 18px minmax(0, 1fr) 26px;
    align-items: center;
    gap: 6px;
}

.sp-task-row input[type="checkbox"][b-c9rw3fsx6j] {
    width: 15px;
    height: 15px;
    accent-color: var(--sp-blue);
}

.sp-task-row select[b-c9rw3fsx6j] {
    width: 100%;
    min-height: 34px;
    padding: 0 8px;
    border: 1px solid #cbd8e3;
    border-radius: 7px;
    background: #fff;
    color: var(--sp-ink);
    font-size: 10px;
}

.sp-task-row button[b-c9rw3fsx6j],
.sp-document-row > button[b-c9rw3fsx6j] {
    width: 26px;
    height: 26px;
    border: 0;
    border-radius: 6px;
    background: #fff2f2;
    color: #b42318;
    cursor: pointer;
}

.sp-document-row[b-c9rw3fsx6j] {
    display: grid;
    grid-template-columns: 28px minmax(0, 1fr) 26px;
    align-items: center;
    gap: 7px;
}

.sp-document-row > span[b-c9rw3fsx6j] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    border-radius: 7px;
    background: #eaf3fb;
    color: var(--sp-blue);
}

.sp-document-row > div[b-c9rw3fsx6j] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.sp-document-row input[b-c9rw3fsx6j] {
    min-height: 32px;
}

.sp-document-row a[b-c9rw3fsx6j] {
    overflow: hidden;
    color: var(--sp-blue);
    font-size: 10px;
    font-weight: 750;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.sp-document-row small[b-c9rw3fsx6j] { color: var(--sp-muted); font-size: 8px; }

.sp-time-preview[b-c9rw3fsx6j] {
    padding: 11px;
    border: 1px solid var(--sp-line-soft);
    border-radius: 10px;
    background: #f8fafc;
}

.sp-time-preview-heading[b-c9rw3fsx6j] {
    display: flex;
    justify-content: space-between;
    margin-bottom: 14px;
    color: var(--sp-muted);
    font-size: 9px;
    font-weight: 700;
}

.sp-time-preview-heading strong[b-c9rw3fsx6j] {
    color: var(--sp-navy);
    font-size: 11px;
}

.sp-time-track[b-c9rw3fsx6j] {
    position: relative;
    height: 12px;
    border-radius: 999px;
    background: #dfe8ef;
}

.sp-time-track > span[b-c9rw3fsx6j] {
    position: absolute;
    bottom: 16px;
    color: #91a3b2;
    font-size: 7px;
    transform: translateX(-50%);
}

.sp-time-block[b-c9rw3fsx6j] {
    position: absolute;
    inset-block: 2px;
    border-radius: 999px;
    background: linear-gradient(90deg, var(--sp-blue), #1683c4);
    box-shadow: 0 2px 5px rgba(7, 81, 156, .22);
}

.sp-editor-footer[b-c9rw3fsx6j] {
    display: grid;
    grid-template-columns: auto 1fr auto auto;
    gap: 7px;
    padding: 11px 13px;
    border-top: 1px solid var(--sp-line);
    background: #f8fafc;
}

.sp-button-spinner[b-c9rw3fsx6j] {
    width: 11px;
    height: 11px;
    border: 2px solid rgba(255, 255, 255, .45);
    border-top-color: #fff;
    border-radius: 50%;
    animation: sp-spin-b-c9rw3fsx6j .75s linear infinite;
}

.sp-loading[b-c9rw3fsx6j],
.sp-state-card[b-c9rw3fsx6j] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    min-height: 260px;
    border: 1px solid var(--sp-line);
    border-radius: 13px;
    background: #fff;
    color: var(--sp-muted);
}

.sp-spinner[b-c9rw3fsx6j] {
    width: 20px;
    height: 20px;
    border: 2px solid #cedbe5;
    border-top-color: var(--sp-blue);
    border-radius: 50%;
    animation: sp-spin-b-c9rw3fsx6j .75s linear infinite;
}

.sp-state-card[b-c9rw3fsx6j] {
    justify-content: flex-start;
    min-height: 130px;
    padding: 24px;
}

.sp-state-card h2[b-c9rw3fsx6j] {
    margin: 0 0 4px;
    color: var(--sp-navy);
    font-size: 16px;
}

.sp-state-card p[b-c9rw3fsx6j] {
    margin: 0 0 8px;
    font-size: 11px;
}

.sp-state-card code[b-c9rw3fsx6j] {
    padding: 4px 7px;
    border-radius: 5px;
    background: #f3f6f8;
    color: #9f3320;
    font-size: 10px;
}

.sp-state-card .sp-button[b-c9rw3fsx6j] {
    margin-left: auto;
}

.sp-state-icon[b-c9rw3fsx6j] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    flex: 0 0 42px;
    border-radius: 11px;
    background: #fff0eb;
    color: #d84c2d;
}

@keyframes sp-spin-b-c9rw3fsx6j {
    to { transform: rotate(360deg); }
}

@keyframes sp-employee-row-enter-b-c9rw3fsx6j {
    0% {
        opacity: .18;
        background: #e8f5f4;
        box-shadow: 28px 0 32px rgba(18, 110, 105, .2);
        transform: translateX(220px) scale(.97);
    }

    72% {
        opacity: 1;
        background: #f1faf9;
        box-shadow: -7px 0 18px rgba(18, 110, 105, .1);
        transform: translateX(-8px) scale(1);
    }

    100% {
        opacity: 1;
        background: transparent;
        box-shadow: none;
        transform: translateX(0) scale(1);
    }
}

@keyframes sp-employee-card-emphasis-b-c9rw3fsx6j {
    0% {
        border-color: #57aaa5;
        background: #dff2f0;
        box-shadow: 0 0 0 4px rgba(24, 132, 123, .18);
    }

    72% {
        border-color: #83bbb7;
        background: #eff9f8;
        box-shadow: 0 5px 16px rgba(24, 132, 123, .13);
    }

    100% {
        border-color: transparent;
        background: #fff;
        box-shadow: none;
    }
}

@media (max-width: 1280px) {
    .sp-header[b-c9rw3fsx6j] {
        align-items: flex-start;
    }
}

@media (max-width: 980px) {
    .sp-header[b-c9rw3fsx6j] {
        flex-direction: column;
    }

    .sp-toolbar[b-c9rw3fsx6j] {
        width: 100%;
        justify-content: flex-start;
    }

    .sp-workspace[b-c9rw3fsx6j] {
        grid-template-columns: minmax(0, 1fr);
        align-content: start;
        overflow-y: auto;
    }

    .sp-workspace--employees-collapsed.sp-workspace--filters-collapsed[b-c9rw3fsx6j] {
        grid-template-columns: minmax(0, 1fr);
        grid-template-rows: auto;
        row-gap: 10px;
    }

    .sp-workspace--employees-collapsed.sp-workspace--filters-collapsed .sp-board-card[b-c9rw3fsx6j],
    .sp-workspace--employees-collapsed.sp-workspace--filters-collapsed .sp-filter-rail[b-c9rw3fsx6j],
    .sp-workspace--employees-collapsed.sp-workspace--filters-collapsed .sp-team-rail[b-c9rw3fsx6j] {
        grid-column: auto;
        grid-row: auto;
    }

    .sp-team-rail[b-c9rw3fsx6j] {
        position: static;
        order: -1;
        height: min(420px, 52dvh);
    }

    .sp-filter-rail[b-c9rw3fsx6j] {
        position: static;
        order: -2;
        width: 100%;
        height: auto;
        max-height: 52dvh;
    }

    .sp-filter-rail--collapsed[b-c9rw3fsx6j] {
        width: 30px;
        height: 30px;
        justify-self: end;
    }

    .sp-board-card[b-c9rw3fsx6j] {
        min-height: min(620px, 70dvh);
    }

    .sp-template-toolbar[b-c9rw3fsx6j] {
        grid-template-columns: 1fr;
    }

    .sp-template-toolbar > .sp-manage-templates[b-c9rw3fsx6j] {
        width: 100%;
    }

    .sp-copy-calendars[b-c9rw3fsx6j] {
        grid-template-columns: 1fr;
    }

    .sp-copy-modal[b-c9rw3fsx6j]  .sp-copy-calendar + .sp-copy-calendar {
        padding-top: 20px;
        padding-left: 0;
        border-top: 1px solid var(--sp-line);
        border-left: 0;
    }

    .sp-editor[b-c9rw3fsx6j] {
        position: fixed;
        z-index: 1001;
        inset: 48px 8px 8px auto;
        width: min(390px, calc(100vw - 16px));
        max-height: calc(100vh - 56px);
        box-shadow: 0 24px 60px rgba(10, 38, 63, .24);
    }
}

@media (max-width: 620px) {
    .sp-location-field[b-c9rw3fsx6j] {
        width: 100%;
    }

    .sp-copy-backdrop[b-c9rw3fsx6j] {
        padding: 6px;
    }

    .sp-copy-modal[b-c9rw3fsx6j] {
        width: calc(100vw - 12px);
        max-height: calc(100vh - 12px);
    }

    .sp-copy-body[b-c9rw3fsx6j] {
        padding: 12px;
    }

    .sp-copy-option-grid[b-c9rw3fsx6j] {
        grid-template-columns: 1fr;
    }

    .sp-copy-footer[b-c9rw3fsx6j] {
        align-items: stretch;
        flex-direction: column;
    }

    .sp-copy-footer > div[b-c9rw3fsx6j] {
        justify-content: flex-end;
    }

    .sp-toolbar .sp-button[b-c9rw3fsx6j] {
        flex: 1 1 auto;
    }

    .sp-form-grid[b-c9rw3fsx6j] {
        grid-template-columns: 1fr;
    }

    .sp-recurrence-days[b-c9rw3fsx6j] {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }

    .sp-recurrence-heading[b-c9rw3fsx6j] {
        align-items: flex-start;
    }

    .sp-editor-footer[b-c9rw3fsx6j] {
        grid-template-columns: 1fr 1fr;
    }

    .sp-editor-footer > span[b-c9rw3fsx6j] {
        display: none;
    }

    .sp-management-backdrop[b-c9rw3fsx6j] {
        padding: 6px;
    }

    .sp-management-modal[b-c9rw3fsx6j] {
        width: calc(100vw - 12px);
        height: calc(100vh - 12px);
        min-height: 0;
        border-radius: 12px;
    }

    .sp-management-body[b-c9rw3fsx6j] {
        padding: 8px;
    }
}
/* /Components/Morse/Retail/Stores/ShiftPlanner/ShiftPlannerTemplates.razor.rz.scp.css */
.spt-page[b-20vmmym2hz] {
    --spt-navy: #0b3558;
    --spt-blue: #07519c;
    --spt-blue-dark: #063f79;
    --spt-ink: #17324a;
    --spt-muted: #6d8295;
    --spt-line: #dbe5ee;
    --spt-line-soft: #eaf0f5;
    min-height: calc(100vh - 72px);
    color: var(--spt-ink);
}

.spt-page--embedded[b-20vmmym2hz] {
    min-height: 0;
    padding: 2px;
}

.spt-page *[b-20vmmym2hz],
.spt-page *[b-20vmmym2hz]::before,
.spt-page *[b-20vmmym2hz]::after {
    box-sizing: border-box;
}

.spt-header[b-20vmmym2hz] {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 20px;
    margin-bottom: 14px;
}

.spt-back[b-20vmmym2hz] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin: 0 0 10px;
    padding: 0;
    border: 0;
    background: transparent;
    color: var(--spt-blue);
    font-size: 10px;
    font-weight: 750;
    cursor: pointer;
}

.spt-eyebrow[b-20vmmym2hz] {
    display: block;
    margin-bottom: 4px;
    color: var(--spt-blue);
    font-size: 9px;
    font-weight: 800;
    letter-spacing: .12em;
    text-transform: uppercase;
}

.spt-header h1[b-20vmmym2hz] {
    margin: 0;
    color: var(--spt-navy);
    font-size: clamp(23px, 2vw, 30px);
    font-weight: 760;
    letter-spacing: -.035em;
}

.spt-header p[b-20vmmym2hz] {
    margin: 4px 0 0;
    color: var(--spt-muted);
    font-size: 11px;
}

.spt-button[b-20vmmym2hz] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    min-height: 38px;
    padding: 0 14px;
    border: 1px solid transparent;
    border-radius: 9px;
    font-size: 10px;
    font-weight: 750;
    cursor: pointer;
    transition: transform .15s ease, box-shadow .15s ease;
}

.spt-button:hover:not(:disabled)[b-20vmmym2hz] {
    transform: translateY(-1px);
}

.spt-button:disabled[b-20vmmym2hz],
.spt-back:disabled[b-20vmmym2hz],
.spt-template-card:disabled[b-20vmmym2hz] {
    cursor: not-allowed;
    opacity: .48;
}

.spt-button--primary[b-20vmmym2hz] {
    background: linear-gradient(135deg, var(--spt-blue), var(--spt-blue-dark));
    box-shadow: 0 8px 16px rgba(7, 81, 156, .18);
    color: #fff;
}

.spt-button--secondary[b-20vmmym2hz] {
    border-color: #cbd8e3;
    background: #fff;
    color: var(--spt-blue);
}

.spt-button--danger[b-20vmmym2hz] {
    border-color: #f1c7c7;
    background: #fff7f7;
    color: #b42318;
}

.spt-summary[b-20vmmym2hz] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
    margin-bottom: 12px;
}

.spt-summary > div[b-20vmmym2hz] {
    display: flex;
    align-items: center;
    gap: 10px;
    min-height: 58px;
    padding: 8px 12px;
    border: 1px solid var(--spt-line);
    border-radius: 11px;
    background: #fff;
    box-shadow: 0 3px 10px rgba(17, 52, 82, .035);
}

.spt-summary-icon[b-20vmmym2hz] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    flex: 0 0 34px;
    border-radius: 9px;
}

.spt-summary-icon--blue[b-20vmmym2hz] { background: #eaf3fb; color: var(--spt-blue); }
.spt-summary-icon--teal[b-20vmmym2hz] { background: #e9f7f3; color: #0f766e; }
.spt-summary-icon--violet[b-20vmmym2hz] { background: #f1edff; color: #6d43ce; }

.spt-summary > div > span:last-child[b-20vmmym2hz] {
    display: flex;
    flex-direction: column;
    color: var(--spt-muted);
    font-size: 9px;
}

.spt-summary strong[b-20vmmym2hz] {
    color: var(--spt-navy);
    font-size: 17px;
    line-height: 1.1;
}

.spt-workspace[b-20vmmym2hz] {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 10px;
    align-items: start;
}

.spt-workspace--editing[b-20vmmym2hz] {
    grid-template-columns: minmax(0, 1fr) minmax(340px, 390px);
}

.spt-catalog[b-20vmmym2hz],
.spt-editor[b-20vmmym2hz],
.spt-loading[b-20vmmym2hz],
.spt-state-card[b-20vmmym2hz] {
    border: 1px solid var(--spt-line);
    border-radius: 12px;
    background: #fff;
    box-shadow: 0 5px 18px rgba(17, 52, 82, .055);
}

.spt-catalog[b-20vmmym2hz] {
    min-height: 390px;
    padding: 15px;
}

.spt-catalog-head[b-20vmmym2hz] {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 13px;
    padding-bottom: 12px;
    border-bottom: 1px solid var(--spt-line-soft);
}

.spt-catalog-head h2[b-20vmmym2hz] {
    margin: 0;
    color: var(--spt-navy);
    font-size: 15px;
}

.spt-toggle[b-20vmmym2hz] {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    color: var(--spt-muted);
    font-size: 9px;
    font-weight: 700;
    cursor: pointer;
}

.spt-toggle input[b-20vmmym2hz],
.spt-check-input input[b-20vmmym2hz] {
    width: 15px;
    height: 15px;
    accent-color: var(--spt-blue);
}

.spt-template-grid[b-20vmmym2hz] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(235px, 1fr));
    gap: 9px;
}

.spt-template-card[b-20vmmym2hz] {
    --spt-accent: #e5de44;
    position: relative;
    display: grid;
    grid-template-columns: 38px minmax(0, 1fr) 16px;
    align-items: center;
    gap: 10px;
    min-height: 104px;
    padding: 13px;
    overflow: hidden;
    border: 1px solid color-mix(in srgb, var(--spt-accent) 22%, var(--spt-line));
    border-radius: 11px;
    background: linear-gradient(135deg, #fff 25%, color-mix(in srgb, var(--spt-accent) 6%, #fff));
    color: var(--spt-ink);
    text-align: left;
    cursor: pointer;
    transition: transform .15s ease, box-shadow .15s ease, border-color .15s ease;
}

.spt-template-card:hover:not(:disabled)[b-20vmmym2hz] {
    transform: translateY(-2px);
    border-color: color-mix(in srgb, var(--spt-accent) 48%, var(--spt-line));
    box-shadow: 0 9px 18px rgba(17, 52, 82, .09);
}

.spt-card-accent[b-20vmmym2hz] {
    position: absolute;
    inset: 0 auto 0 0;
    width: 4px;
    background: var(--spt-accent);
}

.spt-card-icon[b-20vmmym2hz] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    border-radius: 10px;
    background: color-mix(in srgb, var(--spt-accent) 12%, #fff);
    color: color-mix(in srgb, var(--spt-accent) 70%, #001a26);
}

.spt-card-copy[b-20vmmym2hz] {
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.spt-card-title[b-20vmmym2hz] {
    display: flex;
    align-items: center;
    gap: 6px;
}

.spt-card-title strong[b-20vmmym2hz] {
    overflow: hidden;
    color: var(--spt-navy);
    font-size: 12px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.spt-card-title em[b-20vmmym2hz] {
    padding: 2px 5px;
    border-radius: 999px;
    background: #edf1f4;
    color: #7b8995;
    font-size: 7px;
    font-style: normal;
    font-weight: 800;
    text-transform: uppercase;
}

.spt-card-copy > small[b-20vmmym2hz] {
    margin: 1px 0 6px;
    color: #8ca0b1;
    font-size: 8px;
    font-weight: 750;
    letter-spacing: .08em;
}

.spt-card-time[b-20vmmym2hz] {
    color: color-mix(in srgb, var(--spt-accent) 70%, #001a26);
    font-size: 11px;
    font-weight: 850;
}

.spt-card-position[b-20vmmym2hz] {
    overflow: hidden;
    margin-top: 2px;
    color: var(--spt-muted);
    font-size: 8px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.spt-card-tasks[b-20vmmym2hz] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    color: #52738a;
    font-size: 8px;
    font-weight: 750;
}

.spt-task-toolbar[b-20vmmym2hz] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 6px;
}

.spt-task-toolbar small[b-20vmmym2hz] {
    color: var(--spt-muted);
    font-size: 8px;
    font-weight: 700;
}

.spt-task-toolbar > span[b-20vmmym2hz] {
    display: inline-flex;
    gap: 5px;
}

.spt-task-toolbar button[b-20vmmym2hz] {
    padding: 4px 7px;
    border: 1px solid #cbd8e3;
    border-radius: 6px;
    background: #fff;
    color: var(--spt-blue);
    font: inherit;
    font-size: 8px;
    font-weight: 750;
    cursor: pointer;
}

.spt-task-toolbar button:disabled[b-20vmmym2hz] {
    cursor: default;
    opacity: .45;
}

.spt-task-list[b-20vmmym2hz] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 7px;
    padding: 3px;
}

.spt-task-option[b-20vmmym2hz] {
    display: grid;
    grid-template-columns: 17px minmax(0, 1fr);
    align-items: flex-start;
    gap: 7px;
    min-height: 45px;
    padding: 8px;
    border: 1px solid var(--spt-line);
    border-radius: 8px;
    background: #fff;
    color: inherit;
    font: inherit;
    text-align: left;
    cursor: pointer;
}

.spt-task-option--selected[b-20vmmym2hz] {
    border-color: #79aaa8;
    background: #edf7f6;
}

.spt-task-check[b-20vmmym2hz] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 16px;
    height: 16px;
    margin-top: 1px;
    border: 1px solid #b9cad7;
    border-radius: 4px;
    background: #fff;
    color: #fff;
    font-size: 8px;
}

.spt-task-option--selected .spt-task-check[b-20vmmym2hz] {
    border-color: #0f766e;
    background: #0f766e;
}

.spt-task-option > span:last-child[b-20vmmym2hz] {
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.spt-task-option strong[b-20vmmym2hz] {
    overflow: hidden;
    color: var(--spt-ink);
    font-size: 9px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.spt-task-option small[b-20vmmym2hz],
.spt-task-empty[b-20vmmym2hz] {
    color: var(--spt-muted);
    font-size: 8px;
    line-height: 1.35;
}

.spt-task-empty[b-20vmmym2hz] {
    padding: 10px;
    border: 1px dashed var(--spt-line);
    border-radius: 8px;
    text-align: center;
}

.spt-card-arrow[b-20vmmym2hz] {
    color: color-mix(in srgb, var(--spt-accent) 55%, #aebdca);
    font-size: 9px;
}

.spt-template-card--archived[b-20vmmym2hz] {
    filter: grayscale(.65);
    opacity: .7;
}

.spt-empty[b-20vmmym2hz] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 290px;
    color: var(--spt-muted);
    text-align: center;
}

.spt-empty > span[b-20vmmym2hz] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 50px;
    height: 50px;
    margin-bottom: 9px;
    border-radius: 14px;
    background: #eaf3fb;
    color: var(--spt-blue);
    font-size: 20px;
}

.spt-empty h3[b-20vmmym2hz] {
    margin: 0;
    color: var(--spt-navy);
    font-size: 14px;
}

.spt-empty p[b-20vmmym2hz] {
    margin: 5px 0 13px;
    font-size: 10px;
}

.spt-editor[b-20vmmym2hz] {
    position: sticky;
    top: 0;
    max-height: calc(100vh - 86px);
    overflow: hidden;
}

.spt-editor-head[b-20vmmym2hz] {
    --spt-accent: #e5de44;
    display: grid;
    grid-template-columns: 42px minmax(0, 1fr) 30px;
    align-items: center;
    gap: 10px;
    padding: 14px;
    border-bottom: 1px solid var(--spt-line);
    background: linear-gradient(140deg, color-mix(in srgb, var(--spt-accent) 8%, #fff), #f7fafc);
}

.spt-editor-icon[b-20vmmym2hz] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    border-radius: 12px;
    background: color-mix(in srgb, var(--spt-accent) 13%, #fff);
    color: color-mix(in srgb, var(--spt-accent) 70%, #001a26);
}

.spt-editor-head > div[b-20vmmym2hz] {
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.spt-editor-head small[b-20vmmym2hz] {
    color: color-mix(in srgb, var(--spt-accent) 70%, #001a26);
    font-size: 8px;
    font-weight: 800;
    letter-spacing: .09em;
    text-transform: uppercase;
}

.spt-editor-head strong[b-20vmmym2hz] {
    overflow: hidden;
    color: var(--spt-navy);
    font-size: 12px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.spt-editor-head button[b-20vmmym2hz] {
    width: 30px;
    height: 30px;
    border: 1px solid #cbd8e3;
    border-radius: 8px;
    background: #fff;
    color: var(--spt-muted);
    cursor: pointer;
}

.spt-editor-body[b-20vmmym2hz] {
    max-height: calc(100vh - 215px);
    padding: 13px;
    overflow-y: auto;
    scrollbar-color: #b7c9d8 transparent;
    scrollbar-width: thin;
}

.spt-kind-switch[b-20vmmym2hz] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 6px;
    margin-bottom: 12px;
    padding: 4px;
    border-radius: 10px;
    background: #edf3f7;
}

.spt-kind-switch button[b-20vmmym2hz] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    min-height: 34px;
    border: 0;
    border-radius: 7px;
    background: transparent;
    color: var(--spt-muted);
    font-size: 10px;
    font-weight: 750;
    cursor: pointer;
}

.spt-kind-switch button.active[b-20vmmym2hz] {
    background: #fff;
    box-shadow: 0 3px 8px rgba(17, 52, 82, .09);
    color: var(--spt-blue);
}

.spt-editor-section[b-20vmmym2hz] {
    padding: 11px;
    border: 1px solid var(--spt-line-soft);
    border-radius: 10px;
    background: #fff;
}

.spt-field[b-20vmmym2hz] {
    display: flex;
    flex-direction: column;
    gap: 5px;
    min-width: 0;
}

.spt-field > span:first-child[b-20vmmym2hz] {
    color: #547087;
    font-size: 9px;
    font-weight: 750;
    letter-spacing: .05em;
    text-transform: uppercase;
}

.spt-field-help[b-20vmmym2hz],
.spt-card-break[b-20vmmym2hz] {
    color: #6b8296;
    font-size: 8px;
    line-height: 1.3;
}

.spt-card-break[b-20vmmym2hz] {
    display: block;
}

.spt-field input[type="text"][b-20vmmym2hz],
.spt-field input[type="number"][b-20vmmym2hz],
.spt-field input[type="time"][b-20vmmym2hz],
.spt-field select[b-20vmmym2hz] {
    width: 100%;
    min-height: 38px;
    padding: 0 10px;
    border: 1px solid #cbd8e3;
    border-radius: 8px;
    background: #fff;
    color: var(--spt-ink);
    font: inherit;
    font-size: 11px;
    outline: none;
}

.spt-field input:focus[b-20vmmym2hz],
.spt-field select:focus[b-20vmmym2hz] {
    border-color: var(--spt-blue);
    box-shadow: 0 0 0 3px rgba(7, 81, 156, .11);
}

.spt-form-grid[b-20vmmym2hz] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
}

.spt-editor-section .spt-field + .spt-field[b-20vmmym2hz],
.spt-editor-section .spt-form-grid + .spt-field[b-20vmmym2hz],
.spt-editor-section .spt-field + .spt-form-grid[b-20vmmym2hz] {
    margin-top: 9px;
}

.spt-color-input[b-20vmmym2hz],
.spt-check-input[b-20vmmym2hz] {
    display: flex;
    align-items: center;
    gap: 8px;
    min-height: 38px;
    padding: 5px 8px;
    border: 1px solid #cbd8e3;
    border-radius: 8px;
    background: #fff;
}

.spt-color-input input[b-20vmmym2hz] {
    width: 28px;
    height: 26px;
    padding: 0;
    border: 0;
    background: transparent;
}

.spt-color-input code[b-20vmmym2hz] {
    color: var(--spt-muted);
    font-size: 9px;
}

.spt-check-input[b-20vmmym2hz] {
    color: var(--spt-muted);
    font-size: 9px;
    text-transform: none;
}

.spt-preview[b-20vmmym2hz] {
    --spt-accent: #e5de44;
    margin-top: 12px;
    padding: 11px;
    border: 1px solid var(--spt-line-soft);
    border-radius: 10px;
    background: #f8fafc;
}

.spt-preview-card[b-20vmmym2hz] {
    display: flex;
    flex-direction: column;
    min-height: 70px;
    padding: 10px 12px;
    border: 1px solid color-mix(in srgb, var(--spt-accent) 28%, var(--spt-line));
    border-left: 4px solid var(--spt-accent);
    border-radius: 8px;
    background: linear-gradient(120deg, color-mix(in srgb, var(--spt-accent) 9%, #fff), #fff);
}

.spt-preview-time[b-20vmmym2hz] {
    color: color-mix(in srgb, var(--spt-accent) 70%, #001a26);
    font-size: 10px;
    font-weight: 850;
}

.spt-preview-card strong[b-20vmmym2hz] {
    color: var(--spt-navy);
    font-size: 11px;
}

.spt-preview-card small[b-20vmmym2hz] {
    color: var(--spt-muted);
    font-size: 8px;
}

.spt-editor-footer[b-20vmmym2hz] {
    display: grid;
    grid-template-columns: auto 1fr auto auto;
    gap: 7px;
    padding: 11px 13px;
    border-top: 1px solid var(--spt-line);
    background: #f8fafc;
}

.spt-button-spinner[b-20vmmym2hz] {
    width: 11px;
    height: 11px;
    border: 2px solid rgba(255, 255, 255, .45);
    border-top-color: #fff;
    border-radius: 50%;
    animation: spt-spin-b-20vmmym2hz .75s linear infinite;
}

.spt-loading[b-20vmmym2hz],
.spt-state-card[b-20vmmym2hz] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    min-height: 260px;
    color: var(--spt-muted);
}

.spt-spinner[b-20vmmym2hz] {
    width: 20px;
    height: 20px;
    border: 2px solid #cedbe5;
    border-top-color: var(--spt-blue);
    border-radius: 50%;
    animation: spt-spin-b-20vmmym2hz .75s linear infinite;
}

.spt-state-card[b-20vmmym2hz] {
    justify-content: flex-start;
    min-height: 130px;
    padding: 24px;
}

.spt-state-card > span[b-20vmmym2hz] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    flex: 0 0 42px;
    border-radius: 11px;
    background: #fff0eb;
    color: #d84c2d;
}

.spt-state-card h2[b-20vmmym2hz] {
    margin: 0 0 4px;
    color: var(--spt-navy);
    font-size: 15px;
}

.spt-state-card p[b-20vmmym2hz] {
    margin: 0 0 8px;
    font-size: 10px;
}

.spt-state-card code[b-20vmmym2hz] {
    padding: 4px 7px;
    border-radius: 5px;
    background: #f3f6f8;
    color: #9f3320;
    font-size: 9px;
}

.spt-state-card .spt-button[b-20vmmym2hz] {
    margin-left: auto;
}

@keyframes spt-spin-b-20vmmym2hz {
    to { transform: rotate(360deg); }
}

@media (max-width: 980px) {
    .spt-workspace--editing[b-20vmmym2hz] {
        grid-template-columns: minmax(0, 1fr);
    }

    .spt-editor[b-20vmmym2hz] {
        position: fixed;
        z-index: 1001;
        inset: 48px 8px 8px auto;
        width: min(390px, calc(100vw - 16px));
        max-height: calc(100vh - 56px);
        box-shadow: 0 24px 60px rgba(10, 38, 63, .24);
    }
}

@media (max-width: 650px) {
    .spt-header[b-20vmmym2hz] {
        align-items: flex-start;
        flex-direction: column;
    }

    .spt-summary[b-20vmmym2hz],
    .spt-form-grid[b-20vmmym2hz] {
        grid-template-columns: 1fr;
    }

    .spt-header > .spt-button[b-20vmmym2hz] {
        width: 100%;
    }

    .spt-editor-footer[b-20vmmym2hz] {
        grid-template-columns: 1fr 1fr;
    }

    .spt-editor-footer > span[b-20vmmym2hz] {
        display: none;
    }
}
/* /Components/Morse/Workflow/Settings/WorkflowJobDescriptions.razor.rz.scp.css */
.wfj[b-ej5aqe8zrk] { flex: 1 1 0; min-height: 0; height: 100%; display: flex; }
.wfj-grid[b-ej5aqe8zrk] { flex: 1 1 0; min-width: 0; min-height: 0; display: flex; flex-direction: column; }
.wfj-tasks[b-ej5aqe8zrk] { width: 380px; flex: none; min-height: 0; display: flex; flex-direction: column; background: #f5f7fa; border-left: 1px solid #e3e8ef; }
.wfj-tasks__head[b-ej5aqe8zrk] { display: flex; justify-content: space-between; align-items: flex-start; gap: 8px; padding: 12px; background: #fff; border-bottom: 1px solid #eef1f5; }
.wfj-tasks__head h3[b-ej5aqe8zrk] { margin: 0; font-size: 15px; font-weight: 700; color: #1f2937; display: flex; align-items: center; gap: 6px; }
.wfj-tasks__head p[b-ej5aqe8zrk] { margin: 4px 0 0; font-size: 12px; color: #607d8b; }
.wfj-count[b-ej5aqe8zrk] { min-width: 22px; padding: 1px 7px; border-radius: 10px; background: #eceff1; text-align: center; font-size: 11.5px; font-weight: 600; }
.wfj-tasks__items[b-ej5aqe8zrk] { flex: 1 1 0; min-height: 0; overflow: auto; padding: 10px; display: flex; flex-direction: column; gap: 8px; }
.wfj-task[b-ej5aqe8zrk] { padding: 10px 12px; background: #fff; border: 1px solid #e3e8ef; border-left: 4px solid #7e57c2; border-radius: 8px; }
.wfj-task:hover[b-ej5aqe8zrk] { box-shadow: 0 2px 8px rgba(15, 23, 42, .08); }
.wfj-task__top[b-ej5aqe8zrk] { display: flex; justify-content: space-between; align-items: flex-start; gap: 6px; }
.wfj-task__top strong[b-ej5aqe8zrk] { font-size: 13.5px; color: #1f2937; overflow-wrap: anywhere; }
.wfj-task p[b-ej5aqe8zrk] { margin: 6px 0 0; font-size: 12.5px; color: #546e7a; white-space: pre-wrap; overflow-wrap: anywhere; }
.wfj-task__tools[b-ej5aqe8zrk] { display: inline-flex; gap: 2px; flex: none; }
.wfj-icon[b-ej5aqe8zrk] { border: 0; background: transparent; color: #78909c; cursor: pointer; padding: 2px 5px; border-radius: 4px; line-height: 1; }
.wfj-icon:hover[b-ej5aqe8zrk] { background: #eceff1; color: #1f2937; }
.wfj-icon--danger:hover[b-ej5aqe8zrk] { color: #d32f2f; }
.wfj-chips[b-ej5aqe8zrk] { display: flex; flex-wrap: wrap; gap: 4px; margin-top: 6px; }
.wfj-chip[b-ej5aqe8zrk] { padding: 1px 8px; border-radius: 10px; background: #f3e5f5; color: #4a148c; font-size: 11px; }
.wfj-empty[b-ej5aqe8zrk] { margin: 8px 4px; color: #78909c; font-size: 12.5px; }
.wfj-add[b-ej5aqe8zrk] { display: inline-flex; align-items: center; justify-content: center; gap: 6px; min-height: 40px; border: 1px dashed #b0bec5; border-radius: 8px; background: transparent; color: #546e7a; font-size: 12.5px; cursor: pointer; }
.wfj-add:hover[b-ej5aqe8zrk] { border-color: #1e88e5; color: #1e88e5; background: #f0f7ff; }
@media (max-width: 900px) {
    .wfj[b-ej5aqe8zrk] { flex-direction: column; }
    .wfj-tasks[b-ej5aqe8zrk] { width: 100%; max-height: 45vh; border-left: 0; border-top: 1px solid #e3e8ef; }
}
/* /Components/Morse/Workflow/WorkflowGrid.razor.rz.scp.css */
/* Fills the remaining pane height so a filter bar or comment panel can sit above or below the grid. */
.workflow-grid-pane[b-fco2o8jm17] { flex: 1 1 0; height: 100%; min-height: 0; display: flex; flex-direction: column; background: #fff; }
.workflow-grid-pane[b-fco2o8jm17]  .e-grid { border-width: 0; }
.workflow-grid-actions[b-fco2o8jm17] { display: flex; gap: 4px; align-items: center; flex-wrap: wrap; }
/* /Components/Morse/Workflow/WorkflowPageFrame.razor.rz.scp.css */
/* Use the same shell and pane rules as Expenses.razor. */
.expenses-page-shell[b-g13tryu2j7] { height: calc(100vh - 44px); width: calc(100% + 2rem); margin: -1rem; padding: 2px; background: #fff; overflow: hidden; box-sizing: border-box; min-height: 0; }
.expenses-page-frame[b-g13tryu2j7] { height: 100%; min-height: 0; border: 0; border-radius: 0; background: #fff; overflow: hidden; box-shadow: none; }
.expenses-pane[b-g13tryu2j7] { height: 100%; display: flex; flex-direction: column; background: #fff; min-height: 0; }
.expenses-pane--headers[b-g13tryu2j7] { border-bottom: 0; }
.expenses-page-frame[b-g13tryu2j7]  .e-grid { border-width: 0; }
.expenses-page-frame[b-g13tryu2j7]  .e-btn, .expenses-page-frame[b-g13tryu2j7]  .e-css.e-btn { padding: 6px 6px !important; }
/* /Components/Morse/Workflow/WorkflowRecordForm.razor.rz.scp.css */
.workflow-record-form[b-lr19l53h1i] { padding: 8px; height: 100%; overflow: auto; min-height: 0; }
.wf-form[b-lr19l53h1i] { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 12px 18px; padding: 6px 2px 14px; margin: 0; min-width: 0; }
.wf-form[b-lr19l53h1i]  .wf-field { display: flex; flex-direction: column; gap: 6px; font-size: 13px; min-width: 0; }
.wf-form[b-lr19l53h1i]  .wf-label { color: #37474f; }
.wf-form[b-lr19l53h1i]  .wf-wide { grid-column: 1 / -1; }
.wf-form[b-lr19l53h1i]  .wf-span2 { grid-column: span 2; }
/* Section headings group related fields; each section starts on a new row. */
.wf-form[b-lr19l53h1i]  .wf-section { grid-column: 1 / -1; margin: 10px 0 0; padding-bottom: 6px; border-bottom: 1px solid #e3e8ef; font-size: 12px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; color: #546e7a; }
.wf-form[b-lr19l53h1i]  .wf-section:first-child { margin-top: 0; }
/* Budget amount with its currency on the same line. */
.wf-form[b-lr19l53h1i]  .wf-money { display: flex; gap: 6px; align-items: center; min-width: 0; }
.wf-form[b-lr19l53h1i]  .wf-money > .e-input-group, .wf-form[b-lr19l53h1i]  .wf-money > .e-control-wrapper:first-child { flex: 1 1 auto; min-width: 0; }
.wf-form[b-lr19l53h1i]  .wf-money > .e-ddl { flex: none; }
.wf-form[b-lr19l53h1i]  small { color: #78909c; }
.wf-form[b-lr19l53h1i]  .wf-check { flex-direction: row; align-items: center; align-self: end; gap: 8px; min-height: 38px; }
.wf-documents[b-lr19l53h1i],.wf-comments[b-lr19l53h1i] { margin-top: 18px; border-top: 1px solid #ddd; padding-top: 12px; }
.wf-documents h4[b-lr19l53h1i],.wf-comments h4[b-lr19l53h1i] { font-size: 16px; }
.wf-comments article[b-lr19l53h1i] { padding: 10px; background: #f8fbff; margin-bottom: 8px; }
.wf-comments p[b-lr19l53h1i] { white-space: pre-wrap; }
.wf-comment-input[b-lr19l53h1i] { display: block; margin: 10px 0; }
@media(max-width:800px) { .wf-form[b-lr19l53h1i] { grid-template-columns: 1fr 1fr; } }
@media(max-width:500px) { .wf-form[b-lr19l53h1i]  .wf-span2 { grid-column: 1 / -1; } }
@media(max-width:500px) { .wf-form[b-lr19l53h1i] { grid-template-columns: 1fr; } }
/* /Components/Morse/Workflow/WorkflowRecordPanel.razor.rz.scp.css */
.expenses-pane--details[b-yvzank3r4v] { min-height: 0; height: 100%; overflow: auto; background: linear-gradient(180deg,#f8fbff 0%,#fff 42%); }
.workflow-copy-fields[b-yvzank3r4v] { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin-bottom: 18px; }
/* /Components/Morse/Workflow/Workspace/WorkflowActivityCard.razor.rz.scp.css */
.wfa-card[b-5ud8f2ypmv] { position: relative; display: flex; flex-direction: column; gap: 6px; padding: 10px 12px; background: #fff; border: 1px solid #e3e8ef; border-left: 4px solid #cfd8dc; border-radius: 8px; cursor: pointer; transition: box-shadow .15s, border-color .15s; }
.wfa-card:hover[b-5ud8f2ypmv], .wfa-card:focus-visible[b-5ud8f2ypmv] { box-shadow: 0 2px 8px rgba(15, 23, 42, .08); border-color: #c5d3e3; outline: none; }
.wfa-card.is-selected[b-5ud8f2ypmv] { border-color: #1e88e5; box-shadow: 0 0 0 2px rgba(30, 136, 229, .18); }
.wfa-card.is-overdue[b-5ud8f2ypmv] { border-left-color: #d84315; }
.wfa-card.is-cancelled[b-5ud8f2ypmv] { opacity: .6; }
.wfa-card__top[b-5ud8f2ypmv] { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; }
.wfa-card__top[b-5ud8f2ypmv]  span[style] { min-width: 0 !important; }
.wfa-card__id[b-5ud8f2ypmv] { margin-left: auto; font-size: 11px; color: #90a4ae; }
.wfa-card__tag[b-5ud8f2ypmv] { display: inline-flex; align-items: center; gap: 3px; padding: 2px 8px; border-radius: 10px; background: #eceff1; color: #455a64; font-size: 11px; }
.wfa-card__title[b-5ud8f2ypmv] { font-size: 13.5px; font-weight: 600; color: #1f2937; line-height: 1.35; overflow-wrap: anywhere; }
.wfa-card__chips[b-5ud8f2ypmv] { display: flex; flex-wrap: wrap; gap: 4px; }
.wfa-card__chips:empty[b-5ud8f2ypmv] { display: none; }
.wfa-chip[b-5ud8f2ypmv] { padding: 1px 8px; border-radius: 10px; background: #f1f5f9; color: #334155; font-size: 11px; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.wfa-chip--project[b-5ud8f2ypmv] { background: #e3f2fd; color: #0d47a1; }
.wfa-chip--duty[b-5ud8f2ypmv] { background: #f3e5f5; color: #4a148c; }
.wfa-card__foot[b-5ud8f2ypmv] { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 6px; font-size: 12px; color: #546e7a; }
.wfa-person[b-5ud8f2ypmv] { display: inline-flex; align-items: center; gap: 6px; min-width: 0; }
.wfa-avatar[b-5ud8f2ypmv] { display: inline-flex; align-items: center; justify-content: center; width: 22px; height: 22px; border-radius: 50%; background: #607d8b; color: #fff; font-size: 10px; font-weight: 700; flex: none; }
.wfa-due[b-5ud8f2ypmv] { display: inline-flex; align-items: center; gap: 4px; }
.wfa-due.is-late[b-5ud8f2ypmv] { color: #d84315; font-weight: 600; }
.wfa-card__actions[b-5ud8f2ypmv] { display: flex; flex-wrap: wrap; gap: 4px; padding-top: 4px; border-top: 1px dashed #e3e8ef; }
.wfa-card__tools[b-5ud8f2ypmv] { display: inline-flex; gap: 2px; }
.wfa-icon[b-5ud8f2ypmv] { border: 0; background: transparent; color: #78909c; cursor: pointer; padding: 2px 4px; border-radius: 4px; line-height: 1; }
.wfa-icon:hover[b-5ud8f2ypmv] { background: #eceff1; color: #1f2937; }
.wfa-icon--danger:hover[b-5ud8f2ypmv] { color: #d32f2f; }
.wfa-card__meta[b-5ud8f2ypmv] { font-size: 11px; color: #90a4ae; }
/* Completed button: colorless until started, orange in progress, red past the deadline, green when done. */
.wfa-card__actions[b-5ud8f2ypmv]  .wfa-complete { border: 1px solid #b0bec5; background: #fff; color: #546e7a; }
.wfa-card__actions[b-5ud8f2ypmv]  .wfa-complete--active { background: #ff9800; border-color: #ff9800; color: #fff; }
.wfa-card__actions[b-5ud8f2ypmv]  .wfa-complete--late { background: #e53935; border-color: #e53935; color: #fff; }
.wfa-card__actions[b-5ud8f2ypmv]  .wfa-complete--done { background: #43a047; border-color: #43a047; color: #fff; cursor: default; }
.wfa-card__actions[b-5ud8f2ypmv]  .wfa-complete--active .e-btn-icon, .wfa-card__actions[b-5ud8f2ypmv]  .wfa-complete--late .e-btn-icon, .wfa-card__actions[b-5ud8f2ypmv]  .wfa-complete--done .e-btn-icon { color: #fff; }
/* /Components/Pages/Dashboard.razor.rz.scp.css */

.dashboard-store-filter-badge[b-4xg2drkmsj] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 0.45rem 0.8rem;
    margin: 0;
    font-size: 13px;
    font-weight: 600;
    color: var(--dashboard-blue, #004b9b);
    background: rgba(0, 75, 155, 0.08);
    border: 1px solid rgba(0, 75, 155, 0.18);
    border-radius: 16px;
    cursor: pointer;
    appearance: none;
    transition: border-color 0.18s ease, box-shadow 0.18s ease, transform 0.18s ease;
}

.dashboard-store-filter-badge .e-icons[b-4xg2drkmsj] {
    font-size: 14px;
}

.dashboard-store-filter-badge:hover[b-4xg2drkmsj] {
    border-color: color-mix(in srgb, var(--dashboard-blue) 28%, white);
    box-shadow: 0 0 0 4px color-mix(in srgb, var(--dashboard-blue) 10%, transparent);
}

.dashboard-store-filter-badge:focus-visible[b-4xg2drkmsj] {
    outline: none;
    border-color: color-mix(in srgb, var(--dashboard-blue) 32%, white);
    box-shadow: 0 0 0 4px color-mix(in srgb, var(--dashboard-blue) 12%, transparent);
}

.dashboard-meta-row[b-4xg2drkmsj] {
    display: flex;
    justify-content: flex-end;
    margin: 0 0 0.75rem;
}

.dashboard-timezone-badge[b-4xg2drkmsj] {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0.4rem 0.75rem;
    font-size: 0.76rem;
    font-weight: 600;
    color: var(--dashboard-muted, #5b6776);
    background: color-mix(in srgb, var(--dashboard-panel, #ffffff) 92%, white);
    border: 1px solid color-mix(in srgb, var(--dashboard-border, #d8dee8) 88%, white);
    border-radius: 999px;
    box-shadow: 0 8px 24px rgba(12, 23, 38, 0.05);
}

.dashboard-timezone-badge strong[b-4xg2drkmsj] {
    color: var(--dashboard-ink, #1a2633);
    font-weight: 700;
}

.dashboard-refresh-year-dialog__content[b-4xg2drkmsj] {
    display: grid;
    gap: 1rem;
    padding: 0.25rem 0 0;
}

.dashboard-refresh-year-dialog__field[b-4xg2drkmsj] {
    display: grid;
    gap: 0.45rem;
    color: var(--dashboard-ink, #1a2633);
    font-size: 0.84rem;
    font-weight: 700;
}

.dashboard-refresh-year-dialog__field select[b-4xg2drkmsj] {
    width: 100%;
    min-height: 38px;
    padding: 0.45rem 0.65rem;
    color: var(--dashboard-ink, #1a2633);
    background: var(--dashboard-panel, #ffffff);
    border: 1px solid var(--dashboard-border, #d8dee8);
    border-radius: 6px;
}

.dashboard-refresh-year-dialog__actions[b-4xg2drkmsj] {
    display: flex;
    justify-content: flex-end;
    gap: 0.6rem;
}

.dashboard-refresh-year-dialog__button[b-4xg2drkmsj] {
    min-height: 36px;
    padding: 0.45rem 0.8rem;
    border: 1px solid var(--dashboard-border, #d8dee8);
    border-radius: 6px;
    font-weight: 700;
    cursor: pointer;
}

.dashboard-refresh-year-dialog__button--ghost[b-4xg2drkmsj] {
    color: var(--dashboard-muted, #5b6776);
    background: var(--dashboard-panel, #ffffff);
}

.dashboard-refresh-year-dialog__button--primary[b-4xg2drkmsj] {
    color: #ffffff;
    background: var(--dashboard-blue, #004b9b);
    border-color: var(--dashboard-blue, #004b9b);
}

.dashboard-refresh-year-dialog__button:disabled[b-4xg2drkmsj] {
    cursor: not-allowed;
    opacity: 0.65;
}

.dashboard-shell[b-4xg2drkmsj] {
    --dashboard-page-scale: 1;
    --dashboard-visible-height: 100vh;
    --dashboard-visible-height: 100dvh;
    --dashboard-navy: #0f2346;
    --dashboard-blue: #004b9b;
    --dashboard-sky: #2b7abf;
    --dashboard-green: #1f8f5f;
    --dashboard-teal: #1e8f88;
    --dashboard-coral: #d96c4f;
    --dashboard-fuchsia: #8b3364;
    --dashboard-gold: #af7a13;
    --dashboard-amber: #c57f17;
    --dashboard-slate: #51616f;
    --dashboard-graphite: #3f454d;
    --dashboard-darkred: #7f2c2c;
    --dashboard-panel: #ffffff;
    --dashboard-border: #d8dee8;
    --dashboard-border-strong: #c3cfdb;
    --dashboard-ink: #1a2633;
    --dashboard-muted: #5b6776;
    --dashboard-page-bg: transparent;
    --dashboard-card-shadow: 0 10px 30px rgba(12, 23, 38, 0.08);
    --dashboard-shell-shadow: 0 18px 45px rgba(15, 35, 70, 0.12);
    --dashboard-chip-good-bg: rgba(31, 143, 95, 0.14);
    --dashboard-chip-good-text: #0d7a43;
    --dashboard-chip-warn-bg: rgba(196, 78, 43, 0.12);
    --dashboard-chip-warn-text: #a03a1e;
    --dashboard-control-surface: rgba(255, 255, 255, 0.78);
    --dashboard-control-border: rgba(255, 255, 255, 0.55);
    --dashboard-tab-overview-bg: linear-gradient(180deg, color-mix(in srgb, var(--dashboard-blue) 5%, white), color-mix(in srgb, var(--dashboard-green) 3%, white));
    --dashboard-tab-retail-bg: linear-gradient(180deg, color-mix(in srgb, var(--dashboard-amber) 7%, white), color-mix(in srgb, var(--dashboard-blue) 3%, white));
    padding: 0 0.5rem 0.5rem;
    background: var(--dashboard-page-bg);
    color: var(--dashboard-ink);
    box-sizing: border-box;
    margin-top: -20px
}

@supports (zoom: 1) {
    .dashboard-shell[b-4xg2drkmsj] {
        zoom: var(--dashboard-page-scale);
        width: min(100%, calc(100% / var(--dashboard-page-scale)));
    }
}

.dashboard-shell--sunrise-amber[b-4xg2drkmsj] {
    --dashboard-navy: #53311a;
    --dashboard-blue: #b45309;
    --dashboard-fuchsia: #9a3412;
    --dashboard-gold: #b45309;
    --dashboard-amber: #d97706;
    --dashboard-slate: #6b5c4d;
    --dashboard-graphite: #4b3d33;
    --dashboard-darkred: #7c2d12;
    --dashboard-border: #ead7bf;
    --dashboard-border-strong: #d6b691;
    --dashboard-ink: #3f2a1d;
    --dashboard-muted: #7c5b41;
    --dashboard-shell-shadow: 0 18px 45px rgba(120, 53, 15, 0.14);
}

.dashboard-shell--evergreen-slate[b-4xg2drkmsj] {
    --dashboard-navy: #18312b;
    --dashboard-blue: #23695b;
    --dashboard-sky: #3f8f7c;
    --dashboard-green: #2f7d61;
    --dashboard-teal: #2a6f78;
    --dashboard-coral: #8d6e63;
    --dashboard-fuchsia: #5b6b5c;
    --dashboard-gold: #8f7a3f;
    --dashboard-amber: #9b8743;
    --dashboard-slate: #53645d;
    --dashboard-graphite: #34423d;
    --dashboard-darkred: #5c4033;
    --dashboard-border: #d8e2dc;
    --dashboard-border-strong: #bac9c1;
    --dashboard-ink: #20322d;
    --dashboard-muted: #5e716c;
    --dashboard-shell-shadow: 0 18px 45px rgba(24, 49, 43, 0.14);
}

.dashboard-shell--midnight-rose[b-4xg2drkmsj] {
    --dashboard-navy: #2f2438;
    --dashboard-blue: #7c3f8c;
    --dashboard-sky: #a855a2;
    --dashboard-green: #6b8f71;
    --dashboard-teal: #7b5ea7;
    --dashboard-coral: #b85c7a;
    --dashboard-fuchsia: #8f2d56;
    --dashboard-gold: #b28a4a;
    --dashboard-amber: #c08b5c;
    --dashboard-slate: #64576d;
    --dashboard-graphite: #433545;
    --dashboard-darkred: #6e3143;
    --dashboard-border: #e3d8e8;
    --dashboard-border-strong: #cfbdd6;
    --dashboard-ink: #2f2438;
    --dashboard-muted: #6f5f78;
    --dashboard-shell-shadow: 0 18px 45px rgba(47, 36, 56, 0.15);
}

.dashboard-shell--polar-mist[b-4xg2drkmsj] {
    --dashboard-navy: #24425a;
    --dashboard-blue: #3b82a0;
    --dashboard-sky: #7fb7d4;
    --dashboard-green: #5f9c91;
    --dashboard-teal: #4f8c97;
    --dashboard-coral: #d9896a;
    --dashboard-fuchsia: #7c6f91;
    --dashboard-gold: #b7a76a;
    --dashboard-amber: #ccad66;
    --dashboard-slate: #708090;
    --dashboard-graphite: #4f5d69;
    --dashboard-darkred: #8b5e5e;
    --dashboard-border: #dbe7ef;
    --dashboard-border-strong: #c1d1dd;
    --dashboard-ink: #213547;
    --dashboard-muted: #657989;
    --dashboard-shell-shadow: 0 18px 45px rgba(36, 66, 90, 0.12);
}

.dashboard-shell--classic-style[b-4xg2drkmsj] {
    --dashboard-navy: #1a3a5c;
    --dashboard-blue: #0078d4;
    --dashboard-sky: #3b9be0;
    --dashboard-green: #28a745;
    --dashboard-teal: #17a2b8;
    --dashboard-coral: #dc6040;
    --dashboard-fuchsia: #a03070;
    --dashboard-gold: #d4a017;
    --dashboard-amber: #e8a820;
    --dashboard-slate: #6c757d;
    --dashboard-graphite: #495057;
    --dashboard-darkred: #8b3030;
    --dashboard-border: #dee2e6;
    --dashboard-border-strong: #ced4da;
    --dashboard-ink: #212529;
    --dashboard-muted: #6c757d;
    --dashboard-shell-shadow: 0 18px 45px rgba(0, 120, 212, 0.10);
}

.dashboard-shell--classic-style .dashboard-card--target[b-4xg2drkmsj],
.dashboard-shell--classic-style .dashboard-card--budget[b-4xg2drkmsj] {
    background: #ffffff;
    padding: 0.35rem 0.35rem 0.75rem;
    min-height: 300px;
    border-radius: 0;
}

.dashboard-shell--classic-style .dashboard-card--target .dashboard-section-label[b-4xg2drkmsj] {
    color: #0078d4;
}

.dashboard-shell--classic-style .dashboard-card--budget .dashboard-section-label[b-4xg2drkmsj] {
    color: #28a745;
}

.dashboard-shell--classic-style .dashboard-card--target .dashboard-card__header h3[b-4xg2drkmsj] {
    color: #212529;
}

.dashboard-shell--classic-style .dashboard-card--budget .dashboard-card__header h3[b-4xg2drkmsj] {
    color: #212529;
}

.dashboard-shell--classic-style .dashboard-gauge-note[b-4xg2drkmsj] {
    font-size: 0.78rem;
    color: #666;
    line-height: 1.1;
}

.dashboard-shell--classic-style .dashboard-gauge-note--classic[b-4xg2drkmsj] {
    margin-top: 0;
}

.dashboard-classic-gauge-title[b-4xg2drkmsj] {
    margin: 0.25rem 0 0;
    font-size: 1.25rem;
    font-weight: 600;
    line-height: 1.2;
}

.dashboard-classic-gauge-title--target[b-4xg2drkmsj] {
    color: #0078d4;
}

.dashboard-classic-gauge-title--budget[b-4xg2drkmsj] {
    color: #28a745;
}

.dashboard-shell--classic-style .dashboard-summary-grid[b-4xg2drkmsj] {
    gap: 1.5rem;
}

.dashboard-shell--boardroom[b-4xg2drkmsj] {
    --dashboard-page-bg: #f1f5f9;
    --dashboard-panel: #ffffff;
    --dashboard-card-shadow: 0 1px 4px rgba(15, 30, 53, 0.07), 0 2px 8px rgba(15, 30, 53, 0.05);
    --dashboard-shell-shadow: 0 8px 32px rgba(15, 30, 53, 0.14);
    --dashboard-chip-good-bg: rgba(31, 143, 95, 0.12);
    --dashboard-chip-warn-bg: rgba(220, 38, 38, 0.10);
    --dashboard-control-surface: rgba(255, 255, 255, 0.92);
    --dashboard-control-border: rgba(216, 222, 232, 0.9);
    font-family: "Segoe UI", -apple-system, system-ui, sans-serif;
}

.dashboard-shell--retail-compact[b-4xg2drkmsj] {
    --dashboard-card-shadow: 0 6px 18px rgba(12, 23, 38, 0.08);
    --dashboard-shell-shadow: 0 12px 30px rgba(15, 35, 70, 0.10);
    font-size: 0.84rem;
    line-height: 1.3;
}

.dashboard-style-bar__controls[b-4xg2drkmsj] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    justify-content: flex-start;
}

.dashboard-style-bar__controls--modal[b-4xg2drkmsj] {
    padding: 0.25rem;
}

.dashboard-style-bar__field[b-4xg2drkmsj] {
    display: grid;
    gap: 0.35rem;
    padding: 0.8rem 0.85rem;
    border: 1px solid var(--dashboard-control-border);
    border-radius: 16px;
    background: var(--dashboard-control-surface);
    color: var(--dashboard-muted);
    font-size: 0.8rem;
    font-weight: 600;
}

.dashboard-style-bar__field--scale[b-4xg2drkmsj] {
    flex: 1 1 240px;
    min-width: min(100%, 240px);
}

.dashboard-style-bar__label-row[b-4xg2drkmsj] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
}

.dashboard-style-bar__badge[b-4xg2drkmsj] {
    border-radius: 999px;
    background: color-mix(in srgb, var(--dashboard-blue) 10%, white);
    color: var(--dashboard-blue);
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.02em;
}

.dashboard-style-bar__field select[b-4xg2drkmsj] {
    min-height: 38px;
    align-items: stretch;
    border: 1px solid var(--dashboard-border-strong);
    border-radius: 14px;
    background: var(--dashboard-panel);
    color: var(--dashboard-ink);
    font: inherit;
    outline: none;
}

.dashboard-style-bar__field select:focus[b-4xg2drkmsj] {
    border-color: var(--dashboard-blue);
    box-shadow: 0 0 0 4px rgba(0, 75, 155, 0.12);
}

.dashboard-style-bar__slider[b-4xg2drkmsj] {
    width: 100%;
    margin: 0;
    accent-color: var(--dashboard-blue);
    cursor: pointer;
}

.dashboard-style-bar__scale-range[b-4xg2drkmsj] {
    display: flex;
    justify-content: space-between;
    gap: 0.75rem;
    color: var(--dashboard-muted);
    font-size: 0.72rem;
    font-weight: 700;
}

.dashboard-style-bar__palette[b-4xg2drkmsj] {
    display: flex;
    align-items: center;
    gap: 0.4rem;
}

.dashboard-style-bar__swatch[b-4xg2drkmsj] {
    width: 14px;
    height: 14px;
    border: 2px solid rgba(255, 255, 255, 0.85);
    border-radius: 999px;
    box-shadow: 0 0 0 1px rgba(15, 35, 70, 0.08);
}

.dashboard-style-bar__swatch--navy[b-4xg2drkmsj] { background: var(--dashboard-navy); }
.dashboard-style-bar__swatch--blue[b-4xg2drkmsj] { background: var(--dashboard-blue); }
.dashboard-style-bar__swatch--sky[b-4xg2drkmsj] { background: var(--dashboard-sky); }
.dashboard-style-bar__swatch--green[b-4xg2drkmsj] { background: var(--dashboard-green); }

.dashboard-style-bar__hint[b-4xg2drkmsj] {
    color: var(--dashboard-muted);
    font-size: 0.74rem;
    line-height: 1.45;
}

.dashboard-shell--retail-compact .dashboard-style-bar__controls[b-4xg2drkmsj] {
    gap: 0.5rem;
}

.dashboard-shell--retail-compact .dashboard-style-bar__field[b-4xg2drkmsj] {
    min-width: min(100%, 184px);
    padding: 0.4rem 0.5rem;
    border-radius: 11px;
    font-size: 0.68rem;
}

.dashboard-shell--retail-compact .dashboard-style-bar__field--scale[b-4xg2drkmsj] {
    min-width: min(100%, 210px);
}

.dashboard-shell--retail-compact .dashboard-style-bar__badge[b-4xg2drkmsj] {
    min-height: 18px;
    padding: 0.08rem 0.45rem;
    font-size: 0.64rem;
}

.dashboard-shell--retail-compact .dashboard-style-bar__field select[b-4xg2drkmsj] {
    min-height: 28px;
    padding: 0.22rem 0.5rem;
    border-radius: 9px;
}

.dashboard-shell--retail-compact .dashboard-style-bar__scale-range[b-4xg2drkmsj] {
    font-size: 0.62rem;
}

.dashboard-tabs[b-4xg2drkmsj] {
    border-radius: 22px;
    background: var(--dashboard-panel);
    box-shadow: var(--dashboard-shell-shadow);
    overflow: hidden;
}

.dashboard-shell--retail-compact .dashboard-tabs[b-4xg2drkmsj] {
    border-radius: 16px;
}

.dashboard-shell--boardroom .dashboard-tabs[b-4xg2drkmsj] {
    border-radius: 16px;
    background: transparent;
    box-shadow: none;
}

.dashboard-tabs :deep(.e-tab-header)[b-4xg2drkmsj] {
    background: linear-gradient(180deg, #f7f9fc 0%, #eef3f9 100%);
    border-bottom: 1px solid var(--dashboard-border);
}

.dashboard-shell--boardroom .dashboard-tabs :deep(.e-tab-header)[b-4xg2drkmsj] {
    background: transparent;
    border-bottom: none;
    margin-bottom: 1.25rem;
}

.dashboard-tabs :deep(.e-toolbar-item .e-tab-wrap)[b-4xg2drkmsj] {
    padding: 0 1.1rem;
    border: 1px solid transparent;
    border-radius: 999px;
}

.dashboard-shell--retail-compact .dashboard-tabs :deep(.e-toolbar-item .e-tab-wrap)[b-4xg2drkmsj] {
    padding: 0 0.65rem;
}

.dashboard-shell--retail-compact .dashboard-tabs :deep(.e-tab-text)[b-4xg2drkmsj] {
    font-size: 0.8rem;
}

.dashboard-tabs :deep(.e-toolbar-item.e-active)[b-4xg2drkmsj] {
    background: transparent;
}

.dashboard-tabs :deep(.e-toolbar-item.e-active .e-tab-wrap)[b-4xg2drkmsj] {
    border-color: color-mix(in srgb, var(--dashboard-blue) 18%, white);
    background: color-mix(in srgb, var(--dashboard-blue) 8%, white);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.8);
}

.dashboard-tabs :deep(.e-toolbar-item.e-active .e-tab-text)[b-4xg2drkmsj] {
    color: var(--dashboard-blue);
    font-weight: 700;
}

.dashboard-tabs :deep(.e-content .e-item)[b-4xg2drkmsj] {
    padding: 0;
}

.dashboard-tab-content[b-4xg2drkmsj] {
    padding: 1rem;
    border: 1px solid color-mix(in srgb, var(--dashboard-border) 88%, white);
    border-radius: 0px;
    background: var(--dashboard-tab-overview-bg);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.8);
}

.dashboard-tab-content--stacked[b-4xg2drkmsj] {
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
}

.dashboard-shell--retail-compact .dashboard-tab-content[b-4xg2drkmsj] {
    padding: 0.55rem;
    border-radius: 16px;
}

.dashboard-shell--retail-compact .dashboard-tab-content--stacked[b-4xg2drkmsj] {
    gap: 0.65rem;
}

.dashboard-performance-tabs[b-4xg2drkmsj] {
    display: flex;
    align-items: flex-end;
    gap: 0;
    margin-bottom: 0.75rem;
    border-bottom: 1px solid var(--dashboard-border);
}

.dashboard-performance-summary-panel[b-4xg2drkmsj] {
    min-width: 0;
}

.dashboard-performance-tab[b-4xg2drkmsj] {
    min-height: 34px;
    padding: 0.45rem 0.85rem;
    border: 0;
    border-bottom: 2px solid transparent;
    background: transparent;
    color: var(--dashboard-muted);
    font: inherit;
    font-size: 0.82rem;
    cursor: pointer;
}

.dashboard-performance-tab:hover[b-4xg2drkmsj],
.dashboard-performance-tab:focus-visible[b-4xg2drkmsj] {
    color: var(--dashboard-blue);
    background: color-mix(in srgb, var(--dashboard-blue) 7%, transparent);
    outline: none;
}

.dashboard-performance-tab--active[b-4xg2drkmsj] {
    border-bottom-color: var(--dashboard-blue);
    color: var(--dashboard-blue);
    font-weight: 700;
}

.dashboard-shell--retail-compact .dashboard-performance-tabs[b-4xg2drkmsj] {
    margin-bottom: 0.5rem;
}

.dashboard-shell--retail-compact .dashboard-performance-tab[b-4xg2drkmsj] {
    min-height: 28px;
    padding: 0.3rem 0.65rem;
    font-size: 0.72rem;
}

.dashboard-shell--retail-compact .dashboard-tab-content--overview[b-4xg2drkmsj] {
    height: calc((var(--dashboard-visible-height) - 105px) / var(--dashboard-page-scale));
}

.dashboard-shell--retail-compact .dashboard-tab-content--retail[b-4xg2drkmsj] {
    max-height: calc((var(--dashboard-visible-height) - 105px) / var(--dashboard-page-scale));
}

.dashboard-tab-content--overview[b-4xg2drkmsj] {
    background: var(--dashboard-tab-overview-bg);
    height: calc((var(--dashboard-visible-height) - 110px) / var(--dashboard-page-scale));
    overflow-y: auto;
    overflow-x: hidden;
}

.dashboard-tab-content--retail[b-4xg2drkmsj] {
    background: var(--dashboard-tab-retail-bg);
    max-height: calc((var(--dashboard-visible-height) - 110px) / var(--dashboard-page-scale));
    overflow-y: auto;
    overflow-x: hidden;
}

.dashboard-loading-zone[b-4xg2drkmsj] {
    position: relative;
    min-height: clamp(16rem, 32vh, 24rem);
    overflow: hidden;
    border: 1px solid color-mix(in srgb, var(--dashboard-border) 88%, white);
    border-radius: 20px;
    background:
        radial-gradient(circle at top right, color-mix(in srgb, var(--dashboard-blue) 9%, transparent) 0%, transparent 48%),
        linear-gradient(180deg, color-mix(in srgb, var(--dashboard-panel) 94%, white) 0%, color-mix(in srgb, var(--dashboard-blue) 4%, white) 100%);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.78);
    isolation: isolate;
}

.dashboard-loading-zone--page[b-4xg2drkmsj] {
    min-height: calc((var(--dashboard-visible-height) - 110px) / var(--dashboard-page-scale));
}

.dashboard-loading-zone--pane[b-4xg2drkmsj] {
    flex: 1 1 auto;
    min-height: 100%;
}

.dashboard-shell--boardroom .dashboard-tab-content--stacked[b-4xg2drkmsj] {
    gap: 1rem;
    margin-top: 0.25rem;
}

.dashboard-shell--boardroom .dashboard-tab-content[b-4xg2drkmsj] {
    border-radius: 18px;
    background: color-mix(in srgb, var(--dashboard-panel) 95%, var(--dashboard-blue) 5%);
}

.dashboard-shell--boardroom .dashboard-tab-content--retail[b-4xg2drkmsj] {
    background: color-mix(in srgb, var(--dashboard-panel) 92%, var(--dashboard-amber) 8%);
}

.dashboard-summary-grid[b-4xg2drkmsj] {
    display: grid;
    grid-template-columns: minmax(0, 1.9fr) repeat(2, minmax(260px, 1fr));
    align-items: stretch;
    gap: 1rem;
    margin-bottom: 1rem;
}

.dashboard-card--summary[b-4xg2drkmsj],
.dashboard-card--gauge[b-4xg2drkmsj] {
    height: 100%;
    align-self: stretch;
    box-sizing: border-box;
}

.dashboard-shell--retail-compact .dashboard-summary-grid[b-4xg2drkmsj] {
    grid-template-columns: minmax(0, 1.7fr) repeat(2, minmax(210px, 1fr));
    align-items: stretch;
    gap: 0.55rem;
    margin-bottom: 0.55rem;
}

.dashboard-shell--retail-compact .dashboard-card--summary[b-4xg2drkmsj],
.dashboard-shell--retail-compact .dashboard-card--gauge[b-4xg2drkmsj] {
    height: 100%;
    align-self: stretch;
}

.dashboard-card[b-4xg2drkmsj],
.dashboard-grid-card[b-4xg2drkmsj],
.dashboard-accent-card[b-4xg2drkmsj] {
    background: var(--dashboard-panel);
    border: 1px solid var(--dashboard-border);
    border-radius: 0;
    box-shadow: var(--dashboard-card-shadow);
}

.dashboard-shell--boardroom .dashboard-card[b-4xg2drkmsj],
.dashboard-shell--boardroom .dashboard-grid-card[b-4xg2drkmsj],
.dashboard-shell--boardroom .dashboard-accent-card[b-4xg2drkmsj] {
    border-radius: 0;
}

.dashboard-shell--retail-compact .dashboard-card[b-4xg2drkmsj],
.dashboard-shell--retail-compact .dashboard-grid-card[b-4xg2drkmsj],
.dashboard-shell--retail-compact .dashboard-accent-card[b-4xg2drkmsj] {
    border-radius: 0;
}

.dashboard-card[b-4xg2drkmsj],
.dashboard-grid-card[b-4xg2drkmsj] {
    padding: 1.1rem 1.2rem;
}

.dashboard-shell--retail-compact .dashboard-card[b-4xg2drkmsj],
.dashboard-shell--retail-compact .dashboard-grid-card[b-4xg2drkmsj] {
    padding: 0.65rem 0.75rem;
}

.dashboard-shell--retail-compact .dashboard-accent-card[b-4xg2drkmsj] {
    padding: 0.65rem 0.7rem;
}

.dashboard-card__header[b-4xg2drkmsj] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 1rem;
}

.dashboard-shell--retail-compact .dashboard-card__header[b-4xg2drkmsj] {
    gap: 0.55rem;
    margin-bottom: 0.55rem;
}

.dashboard-card__header--compact[b-4xg2drkmsj] {
    margin-bottom: 0;
}

.dashboard-card__header-actions[b-4xg2drkmsj] {
    display: inline-flex;
    align-items: center;
    justify-content: flex-end;
    gap: 0.75rem;
    flex-wrap: wrap;
}

.dashboard-shell--retail-compact .dashboard-card__header-actions[b-4xg2drkmsj] {
    gap: 0.35rem;
}

.dashboard-card__header h3[b-4xg2drkmsj],
.dashboard-grid-card h3[b-4xg2drkmsj],
.dashboard-accent-card h4[b-4xg2drkmsj] {
    margin: 0.15rem 0 0;
    font-size: 1.05rem;
}

.dashboard-shell--retail-compact .dashboard-card__header h3[b-4xg2drkmsj],
.dashboard-shell--retail-compact .dashboard-grid-card h3[b-4xg2drkmsj],
.dashboard-shell--retail-compact .dashboard-accent-card h4[b-4xg2drkmsj] {
    font-size: 0.88rem;
}

.dashboard-section-label[b-4xg2drkmsj] {
    color: var(--dashboard-muted);
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 0.05em;
    text-transform: uppercase;
}

.dashboard-shell--retail-compact .dashboard-section-label[b-4xg2drkmsj] {
    font-size: 0.62rem;
    letter-spacing: 0.07em;
}

.dashboard-shell--boardroom .dashboard-section-label[b-4xg2drkmsj] {
    font-size: 0.72rem;
    letter-spacing: 0.08em;
}

.dashboard-logo[b-4xg2drkmsj] {
    width: 122px;
    max-height: 58px;
    height: auto;
    object-fit: contain;
}

.dashboard-shell--retail-compact .dashboard-logo[b-4xg2drkmsj] {
    width: 72px;
    max-height: 32px;
}

.dashboard-logo-button[b-4xg2drkmsj] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 122px;
    min-height: 58px;
    padding: 0.35rem 0.55rem;
    border: 1px solid color-mix(in srgb, var(--dashboard-border) 92%, white);
    border-radius: 16px;
    background: color-mix(in srgb, var(--dashboard-panel) 88%, white);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.82);
    cursor: pointer;
}

.dashboard-shell--retail-compact .dashboard-logo-button[b-4xg2drkmsj] {
    min-width: 72px;
    min-height: 32px;
    padding: 0.12rem 0.2rem;
    border-radius: 8px;
}

.dashboard-logo-button:hover[b-4xg2drkmsj] {
    border-color: color-mix(in srgb, var(--dashboard-blue) 24%, white);
    box-shadow: 0 0 0 4px color-mix(in srgb, var(--dashboard-blue) 8%, transparent);
}

.dashboard-refresh-actions[b-4xg2drkmsj] {
    display: inline-flex;
    align-items: stretch;
    border: 1px solid color-mix(in srgb, var(--dashboard-border) 88%, white);
    border-radius: 16px;
    overflow: hidden;
    background: color-mix(in srgb, var(--dashboard-panel) 94%, white);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.82);
}

.dashboard-refresh-button[b-4xg2drkmsj] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.45rem;
    padding: 0.55rem 0.9rem;
    border: 0;
    background: transparent;
    color: var(--dashboard-text);
    font-size: 0.76rem;
    font-weight: 700;
    letter-spacing: 0.02em;
    cursor: pointer;
    transition: background-color 0.16s ease, color 0.16s ease;
}

.dashboard-refresh-button + .dashboard-refresh-button[b-4xg2drkmsj] {
    border-left: 1px solid color-mix(in srgb, var(--dashboard-border) 82%, white);
}

.dashboard-refresh-button .e-icons[b-4xg2drkmsj] {
    font-size: 0.9rem;
}

.dashboard-refresh-button--latest[b-4xg2drkmsj] {
    color: color-mix(in srgb, var(--dashboard-green, #1f8f5f) 92%, black);
}

.dashboard-refresh-button--full[b-4xg2drkmsj] {
    color: color-mix(in srgb, var(--dashboard-blue) 82%, black);
}

.dashboard-refresh-button:hover:not(:disabled)[b-4xg2drkmsj] {
    background: color-mix(in srgb, var(--dashboard-blue) 10%, white);
}

.dashboard-refresh-button:disabled[b-4xg2drkmsj] {
    opacity: 0.68;
    cursor: progress;
}

.dashboard-refresh-actions--busy .dashboard-refresh-button .e-icons[b-4xg2drkmsj] {
    animation: dashboard-refresh-spin-b-4xg2drkmsj 0.9s linear infinite;
}

.dashboard-shell--retail-compact .dashboard-refresh-actions[b-4xg2drkmsj] {
    border-radius: 10px;
}

.dashboard-shell--retail-compact .dashboard-refresh-button[b-4xg2drkmsj] {
    gap: 0.3rem;
    padding: 0.2rem 0.45rem;
    font-size: 0.64rem;
}

@keyframes dashboard-refresh-spin-b-4xg2drkmsj {
    from {
        transform: rotate(0deg);
    }

    to {
        transform: rotate(360deg);
    }
}

.dashboard-shell--retail-compact .dashboard-store-filter-badge[b-4xg2drkmsj] {
    gap: 0.35rem;
    padding: 0.2rem 0.5rem;
    border-radius: 10px;
    font-size: 0.68rem;
}

.dashboard-store-scope-dialog :deep(.e-dlg-header-content)[b-4xg2drkmsj] {
    border-bottom: 1px solid var(--dashboard-border);
    background: linear-gradient(180deg, color-mix(in srgb, var(--dashboard-blue) 6%, white), color-mix(in srgb, var(--dashboard-panel) 96%, white));
}

.dashboard-store-scope-dialog :deep(.e-dlg-content)[b-4xg2drkmsj] {
    background: color-mix(in srgb, var(--dashboard-panel) 97%, white);
}

.dashboard-store-scope-dialog__content[b-4xg2drkmsj] {
    display: grid;
    gap: 0.9rem;
}

.dashboard-store-scope-dialog__summary[b-4xg2drkmsj] {
    margin: 0;
    color: var(--dashboard-muted);
    font-size: 0.84rem;
    line-height: 1.45;
}

.dashboard-store-scope-list[b-4xg2drkmsj] {
    display: grid;
    gap: 0.55rem;
    margin: 0;
    padding: 0;
    list-style: none;
    max-height: 320px;
    overflow: auto;
}

.dashboard-store-scope-list li[b-4xg2drkmsj] {
    padding: 0.7rem 0.8rem;
    border: 1px solid var(--dashboard-border);
    border-radius: 12px;
    background: color-mix(in srgb, var(--dashboard-panel) 94%, white);
    color: var(--dashboard-ink);
    font-size: 0.88rem;
    font-weight: 600;
}

.dashboard-style-dialog :deep(.e-dlg-header-content)[b-4xg2drkmsj] {
    border-bottom: 1px solid var(--dashboard-border);
    background: linear-gradient(180deg, color-mix(in srgb, var(--dashboard-blue) 6%, white), color-mix(in srgb, var(--dashboard-panel) 96%, white));
    cursor: move;
}

.dashboard-style-dialog :deep(.e-dlg-content)[b-4xg2drkmsj] {
    background: color-mix(in srgb, var(--dashboard-panel) 96%, white);
}

.dashboard-style-dialog :deep(.e-dlg-overlay)[b-4xg2drkmsj] {
    display: none;
}

.dashboard-style-dialog :deep(.e-dialog)[b-4xg2drkmsj] {
    box-shadow: 0 20px 52px rgba(12, 23, 38, 0.18);
}

.dashboard-summary-values[b-4xg2drkmsj] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.75rem;
    margin-bottom: 1rem;
}

.dashboard-shell--retail-compact .dashboard-summary-values[b-4xg2drkmsj] {
    gap: 0.35rem;
    margin-bottom: 0.55rem;
}

.dashboard-summary-values div[b-4xg2drkmsj] {
    padding: 0.9rem 1rem;
    border-radius: 16px;
    background: linear-gradient(180deg, #f7f9fc 0%, #f1f5fb 100%);
}

.dashboard-shell--retail-compact .dashboard-summary-values div[b-4xg2drkmsj] {
    padding: 0.5rem 0.6rem;
    border-radius: 10px;
}

.dashboard-shell--boardroom .dashboard-summary-values div[b-4xg2drkmsj] {
    border: 1px solid var(--dashboard-border);
    border-radius: 10px;
    background: var(--dashboard-panel);
}

.dashboard-shell--boardroom .dashboard-summary-values--annual div[b-4xg2drkmsj] {
    background: color-mix(in srgb, var(--dashboard-blue) 8%, white);
}

.dashboard-summary-values span[b-4xg2drkmsj] {
    display: block;
    color: var(--dashboard-muted);
    font-size: 0.82rem;
}

.dashboard-shell--retail-compact .dashboard-summary-values span[b-4xg2drkmsj] {
    font-size: 0.68rem;
}

.dashboard-summary-values strong[b-4xg2drkmsj] {
    display: block;
    margin-top: 0.3rem;
    font-size: 1.15rem;
}

.dashboard-shell--retail-compact .dashboard-summary-values strong[b-4xg2drkmsj] {
    margin-top: 0.2rem;
    font-size: 0.92rem;
}

.dashboard-summary-note[b-4xg2drkmsj],
.dashboard-gauge-note[b-4xg2drkmsj] {
    margin-top: 20px;
    color: var(--dashboard-muted);
    line-height: 1.55;
}

.dashboard-shell--retail-compact .dashboard-summary-note[b-4xg2drkmsj],
.dashboard-shell--retail-compact .dashboard-gauge-note[b-4xg2drkmsj],
.dashboard-shell--retail-compact .dashboard-data-line[b-4xg2drkmsj] {
    font-size: 0.76rem;
    line-height: 1.3;
}

.dashboard-shell--retail-compact .dashboard-summary-note[b-4xg2drkmsj],
.dashboard-shell--retail-compact .dashboard-gauge-note[b-4xg2drkmsj] {
    margin-top: 0.15rem;
}

.dashboard-card--gauge[b-4xg2drkmsj] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-between;
    text-align: center;
}

.dashboard-shell--retail-compact .dashboard-card--gauge[b-4xg2drkmsj] {
    gap: 0.35rem;
    justify-content: flex-start;
    padding: 0.5rem 0.55rem;
}

.dashboard-compact-text-gauge[b-4xg2drkmsj] {
    display: flex;
    justify-content: center;
    width: 100%;
    margin: -0.1rem 0 -0.2rem;
    overflow: visible;
}

.dashboard-compact-text-gauge__value[b-4xg2drkmsj] {
    min-width: 62px;
    margin-top: 0.15rem;
    margin-left: -31px;
    font-size: 1rem;
    font-weight: 800;
    line-height: 1;
    text-align: center;
}

.dashboard-compact-text-gauge__value--target[b-4xg2drkmsj] {
    color: var(--dashboard-blue);
}

.dashboard-compact-text-gauge__value--budget[b-4xg2drkmsj] {
    color: var(--dashboard-green);
}

.dashboard-shell--classic-style.dashboard-shell--retail-compact .dashboard-card--target[b-4xg2drkmsj],
.dashboard-shell--classic-style.dashboard-shell--retail-compact .dashboard-card--budget[b-4xg2drkmsj] {
    min-height: 0;
}

.dashboard-card--target[b-4xg2drkmsj] {
    background: linear-gradient(180deg, color-mix(in srgb, var(--dashboard-blue) 10%, white), rgba(255, 255, 255, 0.9));
}

.dashboard-card--budget[b-4xg2drkmsj] {
    background: linear-gradient(180deg, color-mix(in srgb, var(--dashboard-green) 10%, white), rgba(255, 255, 255, 0.9));
}

.dashboard-shell--boardroom .dashboard-card--target[b-4xg2drkmsj],
.dashboard-shell--boardroom .dashboard-card--budget[b-4xg2drkmsj] {
    background: var(--dashboard-panel);
    border-top: 4px solid var(--dashboard-blue);
}

.dashboard-shell--boardroom .dashboard-card--budget[b-4xg2drkmsj] {
    border-top-color: var(--dashboard-green);
}

.dashboard-gauge-value[b-4xg2drkmsj] {
    font-size: 1.5rem;
    font-weight: 700;
}

.dashboard-shell--retail-compact .dashboard-gauge-value[b-4xg2drkmsj] {
    font-size: 1rem;
}

.dashboard-shell--retail-compact .dashboard-gauge-note[b-4xg2drkmsj] {
    font-size: 0.7rem;
    line-height: 1.15;
}

.dashboard-gauge-value--target[b-4xg2drkmsj] {
    color: var(--dashboard-blue);
}

.dashboard-gauge-value--budget[b-4xg2drkmsj] {
    color: var(--dashboard-green);
}

.dashboard-panel-row[b-4xg2drkmsj] {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 1rem;
}

.dashboard-shell--retail-compact .dashboard-panel-row[b-4xg2drkmsj],
.dashboard-shell--retail-compact .dashboard-chart-grid[b-4xg2drkmsj] {
    gap: 0.75rem;
}

.dashboard-performance-compact-row[b-4xg2drkmsj] {
    display: grid;
    grid-template-columns: minmax(0, 1.55fr) minmax(240px, 0.72fr) minmax(0, 1.7fr);
    gap: 0.55rem;
    margin-top: 0.45rem;
    width: 100%;
    min-width: 0;
    align-items: start;
}

.dashboard-shell--retail-compact .dashboard-performance-compact-row > *[b-4xg2drkmsj] {
    min-width: 0;
}

.dashboard-shell--retail-compact .dashboard-panel-row--compact-bottom[b-4xg2drkmsj] {
    grid-template-columns: repeat(5, minmax(0, 1fr));
    grid-template-rows: repeat(2, 200px);
    gap: 0.35rem;
    margin-top: 0;
    width: 100%;
    min-width: 0;
    align-content: start;
    align-self: start;
}

.dashboard-shell--retail-compact .dashboard-panel-row--compact-bottom .dashboard-accent-card[b-4xg2drkmsj] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    min-width: 0;
    height: 160px;
    min-height: 160px;
    padding: 0.65rem 0.7rem;
    overflow: hidden;
}

.dashboard-shell--retail-compact .dashboard-panel-row--compact-bottom .dashboard-accent-card header[b-4xg2drkmsj] {
    margin-bottom: 0.45rem;
}

.dashboard-shell--retail-compact .dashboard-panel-row--compact-bottom .dashboard-accent-card h4[b-4xg2drkmsj] {
    margin: 0.12rem 0 0;
    font-size: 0.88rem;
    line-height: 1.1;
}

.dashboard-shell--retail-compact .dashboard-panel-row--compact-bottom .dashboard-section-label[b-4xg2drkmsj] {
    font-size: 0.62rem;
    line-height: 1;
    letter-spacing: 0.07em;
}

.dashboard-shell--retail-compact .dashboard-panel-row--compact-bottom .dashboard-data-line[b-4xg2drkmsj] {
    margin: 0.12rem 0;
    font-size: 0.76rem;
    line-height: 1.3;
}

.dashboard-shell--retail-compact .dashboard-grid-card--compact-performance-chart[b-4xg2drkmsj],
.dashboard-shell--retail-compact .dashboard-grid-card--compact-performance-donut[b-4xg2drkmsj] {
    min-height: 300px;
}

.dashboard-grid-card--chart[b-4xg2drkmsj],
.dashboard-grid-card--compact-performance-chart[b-4xg2drkmsj] {
    display: flex;
    flex-direction: column;
}

.dashboard-weekly-chart-host[b-4xg2drkmsj] {
    flex: 0 0 auto;
    height: 300px;
    width: 100%;
}

.dashboard-weekly-chart-host :deep(.e-chart)[b-4xg2drkmsj],
.dashboard-shell--retail-compact .dashboard-grid-card--compact-performance-chart :deep(.e-chart)[b-4xg2drkmsj],
.dashboard-shell--retail-compact .dashboard-grid-card--compact-performance-donut :deep(.e-accumulationchart)[b-4xg2drkmsj] {
    height: 300px !important;
}

.dashboard-chart-manual-legend[b-4xg2drkmsj] {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 0.85rem 1.15rem;
    margin-top: 0.7rem;
}

.dashboard-chart-manual-legend--stacked[b-4xg2drkmsj] {
    justify-content: flex-start;
}

.dashboard-chart-manual-legend--region[b-4xg2drkmsj] {
    justify-content: center;
    padding: 0 0.75rem;
}

.dashboard-chart-manual-legend--header[b-4xg2drkmsj] {
    justify-content: flex-start;
    gap: 0.35rem 0.8rem;
    margin-top: 0.45rem;
    padding: 0;
}

.dashboard-chart-manual-legend--header .dashboard-chart-manual-legend__item[b-4xg2drkmsj] {
    font-size: 0.78rem;
}

.dashboard-chart-manual-legend__item[b-4xg2drkmsj] {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    color: var(--dashboard-muted);
    font-size: 0.85rem;
    line-height: 1.2;
}

.dashboard-chart-manual-legend__swatch[b-4xg2drkmsj] {
    width: 0.72rem;
    height: 0.72rem;
    border-radius: 999px;
    flex: 0 0 auto;
}

.dashboard-accent-card[b-4xg2drkmsj] {
    padding: 1rem;
    color: var(--dashboard-ink);
    border-left: 6px solid var(--dashboard-blue);
    background: linear-gradient(135deg, color-mix(in srgb, var(--dashboard-blue) 8%, white) 0%, color-mix(in srgb, var(--dashboard-panel) 96%, white) 68%);
}

.dashboard-shell--classic .dashboard-accent-card[b-4xg2drkmsj] {
    color: #ffffff;
    box-shadow: 0 14px 32px rgba(12, 23, 38, 0.14);
}

.dashboard-accent-card header[b-4xg2drkmsj] {
    margin-bottom: 0.8rem;
}

.dashboard-shell--retail-compact .dashboard-accent-card header[b-4xg2drkmsj] {
    margin-bottom: 0.45rem;
}

.dashboard-accent-card .dashboard-section-label[b-4xg2drkmsj] {
    color: var(--dashboard-muted);
}

.dashboard-shell--classic .dashboard-accent-card .dashboard-section-label[b-4xg2drkmsj] {
    color: rgba(255, 255, 255, 0.78);
}

.dashboard-data-line[b-4xg2drkmsj] {
    margin: 0.3rem 0;
    color: var(--dashboard-muted);
}

.dashboard-shell--classic .dashboard-data-line[b-4xg2drkmsj] {
    color: rgba(255, 255, 255, 0.92);
}

.dashboard-data-line--highlight[b-4xg2drkmsj] {
    font-weight: 700;
    color: var(--dashboard-ink);
}

.dashboard-shell--classic .dashboard-data-line--highlight[b-4xg2drkmsj] {
    color: #ffffff;
}

.dashboard-shell--boardroom .dashboard-accent-card[b-4xg2drkmsj] {
    color: var(--dashboard-ink);
    background: var(--dashboard-panel);
    border-left: 6px solid var(--dashboard-blue);
}

.dashboard-shell--boardroom .dashboard-accent-card .dashboard-section-label[b-4xg2drkmsj] {
    color: var(--dashboard-blue);
}

.dashboard-shell--boardroom .dashboard-data-line[b-4xg2drkmsj] {
    color: var(--dashboard-muted);
    padding: 0.15rem 0;
}

.dashboard-shell--boardroom .dashboard-data-line--highlight[b-4xg2drkmsj] {
    color: var(--dashboard-ink);
}

.dashboard-accent-card--blue[b-4xg2drkmsj] { border-left-color: var(--dashboard-blue); background: linear-gradient(135deg, color-mix(in srgb, var(--dashboard-blue) 10%, white) 0%, var(--dashboard-panel) 70%); }
.dashboard-accent-card--navy[b-4xg2drkmsj] { border-left-color: var(--dashboard-navy); background: linear-gradient(135deg, color-mix(in srgb, var(--dashboard-navy) 10%, white) 0%, var(--dashboard-panel) 70%); }
.dashboard-accent-card--green[b-4xg2drkmsj] { border-left-color: var(--dashboard-green); background: linear-gradient(135deg, color-mix(in srgb, var(--dashboard-green) 10%, white) 0%, var(--dashboard-panel) 70%); }
.dashboard-accent-card--teal[b-4xg2drkmsj] { border-left-color: var(--dashboard-teal); background: linear-gradient(135deg, color-mix(in srgb, var(--dashboard-teal) 10%, white) 0%, var(--dashboard-panel) 70%); }
.dashboard-accent-card--coral[b-4xg2drkmsj] { border-left-color: var(--dashboard-coral); background: linear-gradient(135deg, color-mix(in srgb, var(--dashboard-coral) 10%, white) 0%, var(--dashboard-panel) 70%); }
.dashboard-accent-card--fuchsia[b-4xg2drkmsj] { border-left-color: var(--dashboard-fuchsia); background: linear-gradient(135deg, color-mix(in srgb, var(--dashboard-fuchsia) 10%, white) 0%, var(--dashboard-panel) 70%); }
.dashboard-accent-card--gold[b-4xg2drkmsj] { border-left-color: var(--dashboard-gold); background: linear-gradient(135deg, color-mix(in srgb, var(--dashboard-gold) 10%, white) 0%, var(--dashboard-panel) 70%); }
.dashboard-accent-card--amber[b-4xg2drkmsj] { border-left-color: var(--dashboard-amber); background: linear-gradient(135deg, color-mix(in srgb, var(--dashboard-amber) 10%, white) 0%, var(--dashboard-panel) 70%); }
.dashboard-accent-card--sky[b-4xg2drkmsj] { border-left-color: var(--dashboard-sky); background: linear-gradient(135deg, color-mix(in srgb, var(--dashboard-sky) 10%, white) 0%, var(--dashboard-panel) 70%); }
.dashboard-accent-card--slate[b-4xg2drkmsj] { border-left-color: var(--dashboard-slate); background: linear-gradient(135deg, color-mix(in srgb, var(--dashboard-slate) 10%, white) 0%, var(--dashboard-panel) 70%); }
.dashboard-accent-card--graphite[b-4xg2drkmsj] { border-left-color: var(--dashboard-graphite); background: linear-gradient(135deg, color-mix(in srgb, var(--dashboard-graphite) 10%, white) 0%, var(--dashboard-panel) 70%); }
.dashboard-accent-card--darkred[b-4xg2drkmsj] { border-left-color: var(--dashboard-darkred); background: linear-gradient(135deg, color-mix(in srgb, var(--dashboard-darkred) 10%, white) 0%, var(--dashboard-panel) 70%); }

.dashboard-shell--classic .dashboard-accent-card--blue[b-4xg2drkmsj] { background: var(--dashboard-blue); }
.dashboard-shell--classic .dashboard-accent-card--navy[b-4xg2drkmsj] { background: var(--dashboard-navy); }
.dashboard-shell--classic .dashboard-accent-card--green[b-4xg2drkmsj] { background: var(--dashboard-green); }
.dashboard-shell--classic .dashboard-accent-card--teal[b-4xg2drkmsj] { background: var(--dashboard-teal); }
.dashboard-shell--classic .dashboard-accent-card--coral[b-4xg2drkmsj] { background: var(--dashboard-coral); }
.dashboard-shell--classic .dashboard-accent-card--fuchsia[b-4xg2drkmsj] { background: var(--dashboard-fuchsia); }
.dashboard-shell--classic .dashboard-accent-card--gold[b-4xg2drkmsj] { background: var(--dashboard-gold); }
.dashboard-shell--classic .dashboard-accent-card--amber[b-4xg2drkmsj] { background: var(--dashboard-amber); }
.dashboard-shell--classic .dashboard-accent-card--sky[b-4xg2drkmsj] { background: var(--dashboard-sky); }
.dashboard-shell--classic .dashboard-accent-card--slate[b-4xg2drkmsj] { background: var(--dashboard-slate); }
.dashboard-shell--classic .dashboard-accent-card--graphite[b-4xg2drkmsj] { background: var(--dashboard-graphite); }
.dashboard-shell--classic .dashboard-accent-card--darkred[b-4xg2drkmsj] { background: var(--dashboard-darkred); }

.dashboard-grid-value[b-4xg2drkmsj] {
    font-weight: 700;
}

.dashboard-grid-value--good[b-4xg2drkmsj] {
    color: var(--dashboard-green);
}

.dashboard-grid-value--warn[b-4xg2drkmsj] {
    color: var(--dashboard-coral);
}

.dashboard-chip[b-4xg2drkmsj] {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    padding: 0.12rem 0.45rem;
    border-radius: 999px;
    font-size: 0.8rem;
    font-weight: 700;
}

.dashboard-shell--retail-compact .dashboard-chip[b-4xg2drkmsj] {
    padding: 0.05rem 0.28rem;
    font-size: 0.68rem;
}

.dashboard-chip--good[b-4xg2drkmsj] {
    color: var(--dashboard-chip-good-text);
    background: var(--dashboard-chip-good-bg);
}

.dashboard-chip--warn[b-4xg2drkmsj] {
    color: var(--dashboard-chip-warn-text);
    background: var(--dashboard-chip-warn-bg);
}

.dashboard-chart-grid[b-4xg2drkmsj] {
    display: grid;
    grid-template-columns: minmax(0, 2fr) minmax(320px, 1fr);
    gap: 1rem;
    margin-top: 1rem;
}

.dashboard-grid-card--chart[b-4xg2drkmsj],
.dashboard-grid-card--donut[b-4xg2drkmsj] {
    min-height: 420px;
}

.dashboard-shell--retail-compact .dashboard-grid-card--chart[b-4xg2drkmsj],
.dashboard-shell--retail-compact .dashboard-grid-card--donut[b-4xg2drkmsj] {
    min-height: 240px;
}

.dashboard-shell--retail-compact .dashboard-weekly-chart-host[b-4xg2drkmsj],
.dashboard-shell--retail-compact .dashboard-grid-card--chart :deep(.e-chart)[b-4xg2drkmsj],
.dashboard-shell--retail-compact .dashboard-grid-card--donut :deep(.e-accumulationchart)[b-4xg2drkmsj] {
    min-height: 300px;
}

.dashboard-shell--retail-compact .dashboard-chart-manual-legend[b-4xg2drkmsj] {
    gap: 0.45rem 0.75rem;
    margin-top: 0.45rem;
}

.dashboard-shell--retail-compact .dashboard-chart-manual-legend__item[b-4xg2drkmsj] {
    font-size: 0.72rem;
}

.dashboard-shell--retail-compact .dashboard-chart-manual-legend__swatch[b-4xg2drkmsj] {
    width: 0.58rem;
    height: 0.58rem;
}

.dashboard-shell--retail-compact .dashboard-grid-card--chart :deep(svg text)[b-4xg2drkmsj],
.dashboard-shell--retail-compact .dashboard-grid-card--donut :deep(svg text)[b-4xg2drkmsj] {
    font-size: 9px;
}

.dashboard-shell--retail-compact :deep(.e-grid .e-headercell)[b-4xg2drkmsj],
.dashboard-shell--retail-compact :deep(.e-grid .e-rowcell)[b-4xg2drkmsj] {
    padding: 0.2rem 0.34rem;
    font-size: 0.7rem;
}

.dashboard-shell--retail-compact :deep(.e-grid .e-gridheader)[b-4xg2drkmsj],
.dashboard-shell--retail-compact :deep(.e-grid .e-gridcontent)[b-4xg2drkmsj] {
    border-radius: 12px;
}

.dashboard-shell--retail-compact :deep(.e-grid .e-headercelldiv)[b-4xg2drkmsj],
.dashboard-shell--retail-compact :deep(.e-grid .e-rowcell .e-rowcell)[b-4xg2drkmsj],
.dashboard-shell--retail-compact :deep(.e-grid .e-rowcell span)[b-4xg2drkmsj],
.dashboard-shell--retail-compact :deep(.e-grid .e-rowcell div)[b-4xg2drkmsj],
.dashboard-shell--retail-compact :deep(.e-grid .e-pager)[b-4xg2drkmsj],
.dashboard-shell--retail-compact :deep(.e-grid .e-pager .e-numericitem)[b-4xg2drkmsj],
.dashboard-shell--retail-compact :deep(.e-grid .e-pager .e-parentmsgbar)[b-4xg2drkmsj] {
    font-size: 0.68rem;
}

.dashboard-shell--retail-compact :deep(.e-grid .e-gridpager)[b-4xg2drkmsj] {
    min-height: 30px;
}

.dashboard-empty[b-4xg2drkmsj] {
    margin: 1.25rem;
    padding: 1.25rem 1.4rem;
    border: 1px dashed var(--dashboard-border);
    border-radius: 18px;
    background: #fbfcfe;
}

.dashboard-shell--retail-compact .dashboard-empty[b-4xg2drkmsj] {
    margin: 0.75rem 0;
    padding: 0.75rem 0.8rem;
    border-radius: 14px;
}

.dashboard-shell--boardroom .dashboard-empty[b-4xg2drkmsj] {
    margin: 0;
    border: 1px solid var(--dashboard-border);
    border-radius: 14px;
    background: var(--dashboard-panel);
    box-shadow: var(--dashboard-card-shadow);
}

.dashboard-empty h4[b-4xg2drkmsj] {
    margin: 0 0 0.35rem;
}

.dashboard-empty p[b-4xg2drkmsj] {
    margin: 0;
    color: var(--dashboard-muted);
}

.dashboard-empty--page[b-4xg2drkmsj] {
    margin: 0;
}

@media (max-width: 1200px) {
    .dashboard-summary-grid[b-4xg2drkmsj] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .dashboard-card--summary[b-4xg2drkmsj] {
        grid-column: 1 / -1;
    }

    .dashboard-panel-row[b-4xg2drkmsj] {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .dashboard-performance-compact-row[b-4xg2drkmsj] {
        grid-template-columns: minmax(0, 1.3fr) minmax(220px, 0.75fr) minmax(0, 1.45fr);
    }

    .dashboard-shell--retail-compact .dashboard-panel-row--compact-bottom[b-4xg2drkmsj] {
        grid-template-columns: repeat(5, minmax(0, 1fr));
    }
}

@media (max-width: 900px) {
    .dashboard-shell[b-4xg2drkmsj] {
        padding: 0.75rem;
    }

    .dashboard-style-bar__field[b-4xg2drkmsj] {
        min-width: 100%;
    }

    .dashboard-style-bar__controls[b-4xg2drkmsj] {
        width: 100%;
    }

    .dashboard-style-bar__label-row[b-4xg2drkmsj] {
        align-items: flex-start;
        flex-direction: column;
        gap: 0.35rem;
    }

    .dashboard-tab-content--overview[b-4xg2drkmsj] {
        height: min(70vh, 760px);
    }

    .dashboard-summary-grid[b-4xg2drkmsj],
    .dashboard-panel-row[b-4xg2drkmsj],
    .dashboard-performance-compact-row[b-4xg2drkmsj],
    .dashboard-chart-grid[b-4xg2drkmsj],
    .dashboard-summary-values[b-4xg2drkmsj] {
        grid-template-columns: 1fr;
    }

    .dashboard-logo[b-4xg2drkmsj] {
        width: 96px;
    }
}

/* ══════════════════════════════════════════════════════════════════════════════
   STUDIO LOFT — editorial glassmorphism layout
   ══════════════════════════════════════════════════════════════════════════════ */

.dashboard-shell--studio-loft[b-4xg2drkmsj] {
    --dashboard-page-bg: linear-gradient(145deg, #f0f4fa 0%, #e8ecf4 35%, #f5f0f8 70%, #eef5f2 100%);
    --dashboard-panel: rgba(255, 255, 255, 0.72);
    --dashboard-card-shadow:
        0 2px 8px rgba(15, 25, 50, 0.04),
        0 12px 40px rgba(15, 25, 50, 0.07);
    --dashboard-shell-shadow:
        0 4px 16px rgba(15, 25, 50, 0.05),
        0 24px 64px rgba(15, 25, 50, 0.10);
    --dashboard-control-surface: rgba(255, 255, 255, 0.52);
    --dashboard-control-border: rgba(255, 255, 255, 0.4);
    --sl-glass: rgba(255, 255, 255, 0.58);
    --sl-glass-strong: rgba(255, 255, 255, 0.78);
    --sl-glass-border: rgba(255, 255, 255, 0.5);
    --sl-accent-glow: rgba(0, 75, 155, 0.08);
    --sl-radius-card: 28px;
    --sl-radius-inner: 18px;
    padding: 0.75rem 1rem 1.5rem;
    font-family: "Segoe UI", -apple-system, system-ui, sans-serif;
    background: var(--dashboard-page-bg);
}

/* ─── Tabs ─── */

.dashboard-shell--studio-loft .dashboard-tabs[b-4xg2drkmsj] {
    border-radius: 32px;
    background: var(--sl-glass);
    -webkit-backdrop-filter: blur(24px) saturate(1.6);
    backdrop-filter: blur(24px) saturate(1.6);
    box-shadow: var(--dashboard-shell-shadow);
    border: 1px solid var(--sl-glass-border);
    overflow: hidden;
}

.dashboard-shell--studio-loft .dashboard-tabs :deep(.e-tab-header)[b-4xg2drkmsj] {
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.6) 0%, rgba(245, 248, 252, 0.5) 100%);
    -webkit-backdrop-filter: blur(12px);
    backdrop-filter: blur(12px);
    border-bottom: 1px solid rgba(200, 210, 225, 0.45);
    padding: 0.5rem 0.75rem;
}

.dashboard-shell--studio-loft .dashboard-tabs :deep(.e-toolbar-item .e-tab-wrap)[b-4xg2drkmsj] {
    padding: 0.35rem 1.5rem;
    border: 1px solid transparent;
    border-radius: 999px;
    transition: all 0.3s cubic-bezier(0.22, 0.68, 0, 1);
}

.dashboard-shell--studio-loft .dashboard-tabs :deep(.e-toolbar-item.e-active .e-tab-wrap)[b-4xg2drkmsj] {
    border-color: rgba(255, 255, 255, 0.7);
    background: rgba(255, 255, 255, 0.85);
    box-shadow:
        0 2px 8px rgba(0, 75, 155, 0.10),
        inset 0 1px 0 rgba(255, 255, 255, 0.95);
}

.dashboard-shell--studio-loft .dashboard-tabs :deep(.e-toolbar-item.e-active .e-tab-text)[b-4xg2drkmsj] {
    color: var(--dashboard-blue);
    font-weight: 700;
    letter-spacing: 0.01em;
}

.dashboard-shell--studio-loft .dashboard-tabs :deep(.e-tab-text)[b-4xg2drkmsj] {
    font-size: 0.88rem;
    font-weight: 500;
    letter-spacing: 0.01em;
}

/* ─── Tab content ─── */

.dashboard-shell--studio-loft .dashboard-tab-content[b-4xg2drkmsj] {
    padding: 1.5rem;
    border: none;
    border-radius: var(--sl-radius-card);
    background: transparent;
    box-shadow: none;
}

.dashboard-shell--studio-loft .dashboard-tab-content--stacked[b-4xg2drkmsj] {
    gap: 2rem;
}

.dashboard-shell--studio-loft .dashboard-tab-content--overview[b-4xg2drkmsj] {
    background: transparent;
    height: calc((var(--dashboard-visible-height) - 120px) / var(--dashboard-page-scale));
}

/* ─── Summary grid — asymmetric hero layout ─── */

.dashboard-shell--studio-loft .dashboard-summary-grid[b-4xg2drkmsj] {
    display: grid;
    grid-template-columns: minmax(0, 2.2fr) repeat(2, minmax(240px, 1fr));
    grid-template-rows: auto;
    align-items: stretch;
    gap: 1.5rem;
    margin-bottom: 1.5rem;
}

/* ─── Cards — glass morph with accent glow ─── */

.dashboard-shell--studio-loft .dashboard-card[b-4xg2drkmsj],
.dashboard-shell--studio-loft .dashboard-grid-card[b-4xg2drkmsj],
.dashboard-shell--studio-loft .dashboard-accent-card[b-4xg2drkmsj] {
    position: relative;
    background: var(--sl-glass-strong);
    -webkit-backdrop-filter: blur(16px) saturate(1.4);
    backdrop-filter: blur(16px) saturate(1.4);
    border: 1px solid var(--sl-glass-border);
    border-radius: 0;
    box-shadow: var(--dashboard-card-shadow);
    overflow: hidden;
    transition: box-shadow 0.35s ease, transform 0.35s ease;
}

.dashboard-shell--studio-loft .dashboard-card:hover[b-4xg2drkmsj],
.dashboard-shell--studio-loft .dashboard-grid-card:hover[b-4xg2drkmsj] {
    box-shadow:
        0 4px 12px rgba(15, 25, 50, 0.06),
        0 20px 56px rgba(15, 25, 50, 0.10);
    transform: translateY(-2px);
}

/* Decorative geometric accent — top-left corner notch */
.dashboard-shell--studio-loft .dashboard-card[b-4xg2drkmsj]::before,
.dashboard-shell--studio-loft .dashboard-grid-card[b-4xg2drkmsj]::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 56px;
    height: 4px;
    background: linear-gradient(90deg, var(--dashboard-blue), var(--dashboard-sky));
    border-radius: 0 0 8px 0;
    z-index: 1;
}

.dashboard-shell--studio-loft .dashboard-card[b-4xg2drkmsj],
.dashboard-shell--studio-loft .dashboard-grid-card[b-4xg2drkmsj] {
    padding: 1.5rem 1.6rem;
}

/* ─── Card header ─── */

.dashboard-shell--studio-loft .dashboard-card__header[b-4xg2drkmsj] {
    gap: 1.25rem;
    margin-bottom: 1.25rem;
}

.dashboard-shell--studio-loft .dashboard-card__header h3[b-4xg2drkmsj],
.dashboard-shell--studio-loft .dashboard-grid-card h3[b-4xg2drkmsj] {
    font-size: 1.15rem;
    font-weight: 700;
    letter-spacing: -0.01em;
    line-height: 1.25;
}

.dashboard-shell--studio-loft .dashboard-section-label[b-4xg2drkmsj] {
    font-size: 0.72rem;
    font-weight: 800;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--dashboard-blue);
    opacity: 0.7;
}

/* ─── Summary card ─── */

.dashboard-shell--studio-loft .dashboard-card--summary[b-4xg2drkmsj] {
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.92) 0%, rgba(240, 245, 255, 0.82) 100%);
    border: 1px solid rgba(200, 215, 240, 0.5);
}

.dashboard-shell--studio-loft .dashboard-card--summary[b-4xg2drkmsj]::before {
    width: 80px;
    height: 5px;
    background: linear-gradient(90deg, var(--dashboard-navy), var(--dashboard-blue), var(--dashboard-sky));
}

/* ─── Summary values — frosted pills ─── */

.dashboard-shell--studio-loft .dashboard-summary-values[b-4xg2drkmsj] {
    gap: 1rem;
    margin-bottom: 1.25rem;
}

.dashboard-shell--studio-loft .dashboard-summary-values div[b-4xg2drkmsj] {
    padding: 1rem 1.15rem;
    border-radius: var(--sl-radius-inner);
    background: rgba(247, 249, 252, 0.85);
    -webkit-backdrop-filter: blur(8px);
    backdrop-filter: blur(8px);
    border: 1px solid rgba(220, 228, 240, 0.5);
    transition: background 0.25s ease;
}

.dashboard-shell--studio-loft .dashboard-summary-values div:hover[b-4xg2drkmsj] {
    background: rgba(255, 255, 255, 0.95);
}

.dashboard-shell--studio-loft .dashboard-summary-values--annual div[b-4xg2drkmsj] {
    background: linear-gradient(
        135deg,
        color-mix(in srgb, var(--dashboard-blue) 6%, rgba(255, 255, 255, 0.85)),
        rgba(247, 249, 252, 0.85)
    );
    border-color: color-mix(in srgb, var(--dashboard-blue) 12%, rgba(220, 228, 240, 0.5));
}

.dashboard-shell--studio-loft .dashboard-summary-values span[b-4xg2drkmsj] {
    font-size: 0.78rem;
    font-weight: 600;
    letter-spacing: 0.02em;
    text-transform: uppercase;
    opacity: 0.65;
}

.dashboard-shell--studio-loft .dashboard-summary-values strong[b-4xg2drkmsj] {
    margin-top: 0.4rem;
    font-size: 1.3rem;
    font-weight: 800;
    letter-spacing: -0.02em;
    color: var(--dashboard-ink);
}

.dashboard-shell--studio-loft .dashboard-summary-note[b-4xg2drkmsj] {
    margin-top: 1.25rem;
    padding: 0.85rem 1rem;
    border-radius: 14px;
    background: rgba(245, 247, 250, 0.7);
    border-left: 3px solid var(--dashboard-blue);
    font-size: 0.88rem;
    line-height: 1.65;
    color: var(--dashboard-muted);
}

/* ─── Gauge cards — floating feel ─── */

.dashboard-shell--studio-loft .dashboard-card--gauge[b-4xg2drkmsj] {
    padding: 1.25rem 1rem;
}

.dashboard-shell--studio-loft .dashboard-card--target[b-4xg2drkmsj] {
    background:
        linear-gradient(145deg,
            color-mix(in srgb, var(--dashboard-blue) 8%, rgba(255, 255, 255, 0.88)),
            rgba(255, 255, 255, 0.78)
        );
    border-color: color-mix(in srgb, var(--dashboard-blue) 15%, rgba(255, 255, 255, 0.6));
}

.dashboard-shell--studio-loft .dashboard-card--target[b-4xg2drkmsj]::before {
    background: linear-gradient(90deg, var(--dashboard-blue), var(--dashboard-sky));
}

.dashboard-shell--studio-loft .dashboard-card--budget[b-4xg2drkmsj] {
    background:
        linear-gradient(145deg,
            color-mix(in srgb, var(--dashboard-green) 8%, rgba(255, 255, 255, 0.88)),
            rgba(255, 255, 255, 0.78)
        );
    border-color: color-mix(in srgb, var(--dashboard-green) 15%, rgba(255, 255, 255, 0.6));
}

.dashboard-shell--studio-loft .dashboard-card--budget[b-4xg2drkmsj]::before {
    background: linear-gradient(90deg, var(--dashboard-green), var(--dashboard-teal));
}

.dashboard-shell--studio-loft .dashboard-gauge-note[b-4xg2drkmsj] {
    font-size: 0.82rem;
    line-height: 1.55;
    padding: 0.5rem 0.75rem;
    border-radius: 12px;
    background: rgba(245, 248, 252, 0.6);
}

/* ─── Panel row — accent cards with top-stripe instead of left-border ─── */

.dashboard-shell--studio-loft .dashboard-panel-row[b-4xg2drkmsj] {
    gap: 1.25rem;
}

.dashboard-shell--studio-loft .dashboard-accent-card[b-4xg2drkmsj] {
    padding: 1.25rem 1.3rem;
    border-left: none;
    border-top: 5px solid var(--dashboard-blue);
    border-radius: 0;
    background:
        linear-gradient(165deg, rgba(255, 255, 255, 0.9) 0%, rgba(248, 250, 254, 0.78) 100%);
    color: var(--dashboard-ink);
    -webkit-backdrop-filter: blur(12px);
    backdrop-filter: blur(12px);
}

.dashboard-shell--studio-loft .dashboard-accent-card[b-4xg2drkmsj]::before {
    display: none;
}

.dashboard-shell--studio-loft .dashboard-accent-card header[b-4xg2drkmsj] {
    margin-bottom: 1rem;
}

.dashboard-shell--studio-loft .dashboard-accent-card h4[b-4xg2drkmsj] {
    font-size: 1rem;
    font-weight: 700;
    letter-spacing: -0.01em;
}

.dashboard-shell--studio-loft .dashboard-accent-card .dashboard-section-label[b-4xg2drkmsj] {
    color: var(--dashboard-muted);
    opacity: 0.85;
}

.dashboard-shell--studio-loft .dashboard-data-line[b-4xg2drkmsj] {
    padding: 0.2rem 0;
    color: var(--dashboard-muted);
    font-size: 0.88rem;
    line-height: 1.6;
}

.dashboard-shell--studio-loft .dashboard-data-line--highlight[b-4xg2drkmsj] {
    color: var(--dashboard-ink);
    font-weight: 700;
}

/* Accent card color-coded top stripes */
.dashboard-shell--studio-loft .dashboard-accent-card--blue[b-4xg2drkmsj]   { border-top-color: var(--dashboard-blue);  background: linear-gradient(165deg, color-mix(in srgb, var(--dashboard-blue)  7%, rgba(255,255,255,.9)) 0%, rgba(248,250,254,.78) 100%); }
.dashboard-shell--studio-loft .dashboard-accent-card--navy[b-4xg2drkmsj]   { border-top-color: var(--dashboard-navy);  background: linear-gradient(165deg, color-mix(in srgb, var(--dashboard-navy)  7%, rgba(255,255,255,.9)) 0%, rgba(248,250,254,.78) 100%); }
.dashboard-shell--studio-loft .dashboard-accent-card--green[b-4xg2drkmsj]  { border-top-color: var(--dashboard-green); background: linear-gradient(165deg, color-mix(in srgb, var(--dashboard-green) 7%, rgba(255,255,255,.9)) 0%, rgba(248,250,254,.78) 100%); }
.dashboard-shell--studio-loft .dashboard-accent-card--teal[b-4xg2drkmsj]   { border-top-color: var(--dashboard-teal);  background: linear-gradient(165deg, color-mix(in srgb, var(--dashboard-teal)  7%, rgba(255,255,255,.9)) 0%, rgba(248,250,254,.78) 100%); }
.dashboard-shell--studio-loft .dashboard-accent-card--coral[b-4xg2drkmsj]  { border-top-color: var(--dashboard-coral); background: linear-gradient(165deg, color-mix(in srgb, var(--dashboard-coral) 7%, rgba(255,255,255,.9)) 0%, rgba(248,250,254,.78) 100%); }
.dashboard-shell--studio-loft .dashboard-accent-card--fuchsia[b-4xg2drkmsj]{ border-top-color: var(--dashboard-fuchsia);background: linear-gradient(165deg, color-mix(in srgb, var(--dashboard-fuchsia) 7%, rgba(255,255,255,.9)) 0%, rgba(248,250,254,.78) 100%); }
.dashboard-shell--studio-loft .dashboard-accent-card--gold[b-4xg2drkmsj]   { border-top-color: var(--dashboard-gold);  background: linear-gradient(165deg, color-mix(in srgb, var(--dashboard-gold)  7%, rgba(255,255,255,.9)) 0%, rgba(248,250,254,.78) 100%); }
.dashboard-shell--studio-loft .dashboard-accent-card--amber[b-4xg2drkmsj]  { border-top-color: var(--dashboard-amber); background: linear-gradient(165deg, color-mix(in srgb, var(--dashboard-amber) 7%, rgba(255,255,255,.9)) 0%, rgba(248,250,254,.78) 100%); }
.dashboard-shell--studio-loft .dashboard-accent-card--sky[b-4xg2drkmsj]    { border-top-color: var(--dashboard-sky);   background: linear-gradient(165deg, color-mix(in srgb, var(--dashboard-sky)   7%, rgba(255,255,255,.9)) 0%, rgba(248,250,254,.78) 100%); }
.dashboard-shell--studio-loft .dashboard-accent-card--slate[b-4xg2drkmsj]  { border-top-color: var(--dashboard-slate); background: linear-gradient(165deg, color-mix(in srgb, var(--dashboard-slate) 7%, rgba(255,255,255,.9)) 0%, rgba(248,250,254,.78) 100%); }

/* ─── Chart grid ─── */

.dashboard-shell--studio-loft .dashboard-chart-grid[b-4xg2drkmsj] {
    gap: 1.5rem;
    margin-top: 1.5rem;
}

.dashboard-shell--studio-loft .dashboard-grid-card--chart[b-4xg2drkmsj],
.dashboard-shell--studio-loft .dashboard-grid-card--donut[b-4xg2drkmsj] {
    min-height: 440px;
}

/* ─── Chips — elevated pill ─── */

.dashboard-shell--studio-loft .dashboard-chip[b-4xg2drkmsj] {
    padding: 0.2rem 0.6rem;
    border-radius: 999px;
    font-size: 0.78rem;
    font-weight: 700;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.06);
}

/* ─── Logo button ─── */

.dashboard-shell--studio-loft .dashboard-logo-button[b-4xg2drkmsj] {
    border-radius: 20px;
    background: rgba(255, 255, 255, 0.6);
    -webkit-backdrop-filter: blur(12px);
    backdrop-filter: blur(12px);
    border: 1px solid rgba(255, 255, 255, 0.5);
    transition: all 0.3s ease;
}

.dashboard-shell--studio-loft .dashboard-logo-button:hover[b-4xg2drkmsj] {
    background: rgba(255, 255, 255, 0.85);
    border-color: color-mix(in srgb, var(--dashboard-blue) 24%, rgba(255, 255, 255, 0.7));
    box-shadow: 0 4px 20px rgba(0, 75, 155, 0.12);
}

/* ─── Style bar controls ─── */

.dashboard-shell--studio-loft .dashboard-style-bar__field[b-4xg2drkmsj] {
    border-radius: 20px;
    background: var(--sl-glass);
    -webkit-backdrop-filter: blur(12px);
    backdrop-filter: blur(12px);
    border: 1px solid var(--sl-glass-border);
}

.dashboard-shell--studio-loft .dashboard-style-bar__field select[b-4xg2drkmsj] {
    border-radius: 16px;
    background: rgba(255, 255, 255, 0.85);
}

.dashboard-shell--studio-loft .dashboard-style-bar__badge[b-4xg2drkmsj] {
    background: color-mix(in srgb, var(--dashboard-blue) 8%, rgba(255, 255, 255, 0.7));
    -webkit-backdrop-filter: blur(6px);
    backdrop-filter: blur(6px);
}

/* ─── Empty state ─── */

.dashboard-shell--studio-loft .dashboard-empty[b-4xg2drkmsj] {
    margin: 0;
    padding: 2rem 2.25rem;
    border: 1px dashed color-mix(in srgb, var(--dashboard-border) 60%, transparent);
    border-radius: var(--sl-radius-card);
    background: var(--sl-glass);
    -webkit-backdrop-filter: blur(16px);
    backdrop-filter: blur(16px);
}

/* ─── Style dialog ─── */

.dashboard-shell--studio-loft .dashboard-style-dialog :deep(.e-dlg-header-content)[b-4xg2drkmsj] {
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.8), rgba(245, 248, 252, 0.7));
    -webkit-backdrop-filter: blur(16px);
    backdrop-filter: blur(16px);
}

.dashboard-shell--studio-loft .dashboard-style-dialog :deep(.e-dlg-content)[b-4xg2drkmsj] {
    background: rgba(250, 252, 255, 0.92);
    -webkit-backdrop-filter: blur(12px);
    backdrop-filter: blur(12px);
}

.dashboard-shell--studio-loft .dashboard-style-dialog :deep(.e-dialog)[b-4xg2drkmsj] {
    border-radius: 24px;
    box-shadow:
        0 8px 24px rgba(12, 23, 38, 0.10),
        0 32px 72px rgba(12, 23, 38, 0.16);
}

/* ─── Performance compact row ─── */

.dashboard-shell--studio-loft .dashboard-performance-compact-row[b-4xg2drkmsj] {
    gap: 1.5rem;
    margin-top: 1rem;
}

/* ─── Responsive ─── */

@media (max-width: 1200px) {
    .dashboard-shell--studio-loft .dashboard-summary-grid[b-4xg2drkmsj] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .dashboard-shell--studio-loft .dashboard-card--summary[b-4xg2drkmsj] {
        grid-column: 1 / -1;
    }
}

@media (max-width: 900px) {
    .dashboard-shell--studio-loft[b-4xg2drkmsj] {
        padding: 0.5rem;
    }

    .dashboard-shell--studio-loft .dashboard-summary-grid[b-4xg2drkmsj],
    .dashboard-shell--studio-loft .dashboard-panel-row[b-4xg2drkmsj],
    .dashboard-shell--studio-loft .dashboard-chart-grid[b-4xg2drkmsj] {
        grid-template-columns: 1fr;
    }

    .dashboard-shell--studio-loft .dashboard-card[b-4xg2drkmsj],
    .dashboard-shell--studio-loft .dashboard-grid-card[b-4xg2drkmsj],
    .dashboard-shell--studio-loft .dashboard-accent-card[b-4xg2drkmsj] {
        border-radius: 0;
    }

    .dashboard-shell--studio-loft .dashboard-tabs[b-4xg2drkmsj] {
        border-radius: 22px;
    }

    .dashboard-shell--studio-loft .dashboard-tab-content[b-4xg2drkmsj] {
        padding: 0.75rem;
    }
}

/* ══════════════════════════════════════════════════════════════════════════════
   KINETIC FLOW — bold diagonal-accent layout with staggered cards
   ══════════════════════════════════════════════════════════════════════════════ */

.dashboard-shell--kinetic-flow[b-4xg2drkmsj] {
    --dashboard-page-bg: #0d1117;
    --dashboard-panel: rgba(22, 27, 34, 0.92);
    --dashboard-card-shadow:
        0 2px 6px rgba(0, 0, 0, 0.25),
        0 12px 36px rgba(0, 0, 0, 0.35);
    --dashboard-shell-shadow:
        0 4px 16px rgba(0, 0, 0, 0.30),
        0 24px 64px rgba(0, 0, 0, 0.40);
    --dashboard-border: rgba(48, 54, 61, 0.8);
    --dashboard-border-strong: rgba(56, 63, 71, 0.9);
    --dashboard-ink: #e6edf3;
    --dashboard-muted: #8b949e;
    --dashboard-control-surface: rgba(22, 27, 34, 0.85);
    --dashboard-control-border: rgba(48, 54, 61, 0.7);
    --dashboard-chip-good-bg: rgba(63, 185, 80, 0.18);
    --dashboard-chip-good-text: #3fb950;
    --dashboard-chip-warn-bg: rgba(248, 81, 73, 0.18);
    --dashboard-chip-warn-text: #f85149;
    --kf-accent: linear-gradient(135deg, #58a6ff, #bc8cff, #f778ba);
    --kf-accent-subtle: linear-gradient(135deg, rgba(88, 166, 255, 0.12), rgba(188, 140, 255, 0.12), rgba(247, 120, 186, 0.12));
    --kf-radius: 16px;
    padding: 0.75rem 1rem 1.5rem;
    background: var(--dashboard-page-bg);
    color: var(--dashboard-ink);
    font-family: "Segoe UI", -apple-system, system-ui, sans-serif;
}

/* ─── Tabs ─── */

.dashboard-shell--kinetic-flow .dashboard-tabs[b-4xg2drkmsj] {
    border-radius: 20px;
    background: var(--dashboard-panel);
    border: 1px solid var(--dashboard-border);
    box-shadow: var(--dashboard-shell-shadow);
}

.dashboard-shell--kinetic-flow .dashboard-tabs :deep(.e-tab-header)[b-4xg2drkmsj] {
    background: rgba(22, 27, 34, 0.95);
    border-bottom: 1px solid var(--dashboard-border);
    padding: 0.4rem 0.6rem;
}

.dashboard-shell--kinetic-flow .dashboard-tabs :deep(.e-toolbar-item .e-tab-wrap)[b-4xg2drkmsj] {
    padding: 0.3rem 1.25rem;
    border: 1px solid transparent;
    border-radius: 999px;
    transition: all 0.3s ease;
}

.dashboard-shell--kinetic-flow .dashboard-tabs :deep(.e-tab-text)[b-4xg2drkmsj] {
    font-size: 0.85rem;
    color: var(--dashboard-muted);
}

.dashboard-shell--kinetic-flow .dashboard-tabs :deep(.e-toolbar-item.e-active .e-tab-wrap)[b-4xg2drkmsj] {
    border-color: rgba(88, 166, 255, 0.3);
    background: rgba(88, 166, 255, 0.08);
    box-shadow: 0 0 20px rgba(88, 166, 255, 0.08);
}

.dashboard-shell--kinetic-flow .dashboard-tabs :deep(.e-toolbar-item.e-active .e-tab-text)[b-4xg2drkmsj] {
    color: #58a6ff;
    font-weight: 700;
}

.dashboard-shell--kinetic-flow .dashboard-tabs :deep(.e-content .e-item)[b-4xg2drkmsj] {
    padding: 0;
}

/* ─── Tab content ─── */

.dashboard-shell--kinetic-flow .dashboard-tab-content[b-4xg2drkmsj] {
    padding: 1.25rem;
    border: none;
    border-radius: var(--kf-radius);
    background: transparent;
    box-shadow: none;
}

.dashboard-shell--kinetic-flow .dashboard-tab-content--stacked[b-4xg2drkmsj] {
    gap: 1.75rem;
}

.dashboard-shell--kinetic-flow .dashboard-tab-content--overview[b-4xg2drkmsj] {
    background: transparent;
    height: calc((var(--dashboard-visible-height) - 115px) / var(--dashboard-page-scale));
}

/* ─── Summary grid — two-column hero + side gauges ─── */

.dashboard-shell--kinetic-flow .dashboard-summary-grid[b-4xg2drkmsj] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    grid-template-rows: auto auto;
    gap: 1.25rem;
    margin-bottom: 1.25rem;
}

.dashboard-shell--kinetic-flow .dashboard-card--summary[b-4xg2drkmsj] {
    grid-column: 1 / -1;
}

/* ─── Cards — dark glass with accent border glow ─── */

.dashboard-shell--kinetic-flow .dashboard-card[b-4xg2drkmsj],
.dashboard-shell--kinetic-flow .dashboard-grid-card[b-4xg2drkmsj],
.dashboard-shell--kinetic-flow .dashboard-accent-card[b-4xg2drkmsj] {
    position: relative;
    background: var(--dashboard-panel);
    border: 1px solid var(--dashboard-border);
    border-radius: 0;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
    overflow: hidden;
}

.dashboard-shell--kinetic-flow .dashboard-card:hover[b-4xg2drkmsj],
.dashboard-shell--kinetic-flow .dashboard-grid-card:hover[b-4xg2drkmsj] {
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
}

/* Remove decorative top stripe */
.dashboard-shell--kinetic-flow .dashboard-card[b-4xg2drkmsj]::before,
.dashboard-shell--kinetic-flow .dashboard-grid-card[b-4xg2drkmsj]::before {
    display: none;
}

.dashboard-shell--kinetic-flow .dashboard-card[b-4xg2drkmsj],
.dashboard-shell--kinetic-flow .dashboard-grid-card[b-4xg2drkmsj] {
    padding: 1rem 1.15rem;
}

/* ─── Card headers ─── */

.dashboard-shell--kinetic-flow .dashboard-card__header[b-4xg2drkmsj] {
    margin-bottom: 0.75rem;
}

.dashboard-shell--kinetic-flow .dashboard-card__header h3[b-4xg2drkmsj],
.dashboard-shell--kinetic-flow .dashboard-grid-card h3[b-4xg2drkmsj] {
    font-size: 1rem;
    font-weight: 700;
    color: var(--dashboard-ink);
}

.dashboard-shell--kinetic-flow .dashboard-section-label[b-4xg2drkmsj] {
    font-size: 0.68rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: #58a6ff;
}

/* ─── Summary card ─── */

.dashboard-shell--kinetic-flow .dashboard-card--summary[b-4xg2drkmsj] {
    background: var(--dashboard-panel);
}

/* ─── Summary values — clean rows ─── */

.dashboard-shell--kinetic-flow .dashboard-summary-values[b-4xg2drkmsj] {
    gap: 0.5rem;
    margin-bottom: 0.75rem;
}

.dashboard-shell--kinetic-flow .dashboard-summary-values div[b-4xg2drkmsj] {
    padding: 0.55rem 0.7rem;
    border-radius: 4px;
    background: rgba(13, 17, 23, 0.45);
    border: 1px solid rgba(48, 54, 61, 0.5);
}

.dashboard-shell--kinetic-flow .dashboard-summary-values--annual div[b-4xg2drkmsj] {
    background: rgba(13, 17, 23, 0.35);
    border-color: rgba(48, 54, 61, 0.4);
}

.dashboard-shell--kinetic-flow .dashboard-summary-values span[b-4xg2drkmsj] {
    font-size: 0.72rem;
    font-weight: 600;
    letter-spacing: 0.03em;
    text-transform: uppercase;
    color: var(--dashboard-muted);
}

.dashboard-shell--kinetic-flow .dashboard-summary-values strong[b-4xg2drkmsj] {
    margin-top: 0.2rem;
    font-size: 1.05rem;
    font-weight: 700;
    color: var(--dashboard-ink);
}

.dashboard-shell--kinetic-flow .dashboard-summary-note[b-4xg2drkmsj],
.dashboard-shell--kinetic-flow .dashboard-gauge-note[b-4xg2drkmsj] {
    color: var(--dashboard-muted);
    font-size: 0.82rem;
    line-height: 1.55;
}

.dashboard-shell--kinetic-flow .dashboard-summary-note[b-4xg2drkmsj] {
    padding: 0.5rem 0.65rem;
    border-radius: 4px;
    background: rgba(13, 17, 23, 0.35);
    border-left: 2px solid #58a6ff;
    margin-top: 0.65rem;
}

/* ─── Gauge cards ─── */

.dashboard-shell--kinetic-flow .dashboard-card--target[b-4xg2drkmsj] {
    background: var(--dashboard-panel);
}

.dashboard-shell--kinetic-flow .dashboard-card--budget[b-4xg2drkmsj] {
    background: var(--dashboard-panel);
}

/* ─── Panel row — accent stripe on left with glow ─── */

.dashboard-shell--kinetic-flow .dashboard-panel-row[b-4xg2drkmsj] {
    gap: 1rem;
}

.dashboard-shell--kinetic-flow .dashboard-accent-card[b-4xg2drkmsj] {
    padding: 0.85rem 1rem;
    color: var(--dashboard-ink);
    border-left: 3px solid;
    background: var(--dashboard-panel);
}

.dashboard-shell--kinetic-flow .dashboard-accent-card[b-4xg2drkmsj]::before {
    display: none;
}

.dashboard-shell--kinetic-flow .dashboard-accent-card header[b-4xg2drkmsj] {
    margin-bottom: 0.5rem;
}

.dashboard-shell--kinetic-flow .dashboard-accent-card h4[b-4xg2drkmsj] {
    font-size: 0.88rem;
    font-weight: 700;
    color: var(--dashboard-ink);
}

.dashboard-shell--kinetic-flow .dashboard-accent-card .dashboard-section-label[b-4xg2drkmsj] {
    color: var(--dashboard-muted);
}

.dashboard-shell--kinetic-flow .dashboard-data-line[b-4xg2drkmsj] {
    color: var(--dashboard-muted);
    font-size: 0.82rem;
    line-height: 1.5;
}

.dashboard-shell--kinetic-flow .dashboard-data-line--highlight[b-4xg2drkmsj] {
    color: var(--dashboard-ink);
    font-weight: 700;
}

/* Accent card left-border colors — flat, no glow */
.dashboard-shell--kinetic-flow .dashboard-accent-card--blue[b-4xg2drkmsj]   { border-left-color: #58a6ff; }
.dashboard-shell--kinetic-flow .dashboard-accent-card--navy[b-4xg2drkmsj]   { border-left-color: #388bfd; }
.dashboard-shell--kinetic-flow .dashboard-accent-card--green[b-4xg2drkmsj]  { border-left-color: #3fb950; }
.dashboard-shell--kinetic-flow .dashboard-accent-card--teal[b-4xg2drkmsj]   { border-left-color: #39d2c0; }
.dashboard-shell--kinetic-flow .dashboard-accent-card--coral[b-4xg2drkmsj]  { border-left-color: #f97583; }
.dashboard-shell--kinetic-flow .dashboard-accent-card--fuchsia[b-4xg2drkmsj]{ border-left-color: #bc8cff; }
.dashboard-shell--kinetic-flow .dashboard-accent-card--gold[b-4xg2drkmsj]   { border-left-color: #e3b341; }
.dashboard-shell--kinetic-flow .dashboard-accent-card--amber[b-4xg2drkmsj]  { border-left-color: #d29922; }
.dashboard-shell--kinetic-flow .dashboard-accent-card--sky[b-4xg2drkmsj]    { border-left-color: #79c0ff; }
.dashboard-shell--kinetic-flow .dashboard-accent-card--slate[b-4xg2drkmsj]  { border-left-color: #8b949e; }
.dashboard-shell--kinetic-flow .dashboard-accent-card--graphite[b-4xg2drkmsj]{ border-left-color: #6e7681; }
.dashboard-shell--kinetic-flow .dashboard-accent-card--darkred[b-4xg2drkmsj]{ border-left-color: #f85149; }

/* ─── Chart grid ─── */

.dashboard-shell--kinetic-flow .dashboard-chart-grid[b-4xg2drkmsj] {
    gap: 1.25rem;
    margin-top: 1.25rem;
}

/* ─── Chips ─── */

.dashboard-shell--kinetic-flow .dashboard-chip[b-4xg2drkmsj] {
    font-size: 0.78rem;
    font-weight: 700;
    border-radius: 4px;
}

/* ─── Logo ─── */

.dashboard-shell--kinetic-flow .dashboard-logo-button[b-4xg2drkmsj] {
    border-radius: 6px;
    background: rgba(22, 27, 34, 0.8);
    border: 1px solid var(--dashboard-border);
}

.dashboard-shell--kinetic-flow .dashboard-logo-button:hover[b-4xg2drkmsj] {
    border-color: rgba(88, 166, 255, 0.3);
}

/* ─── Style controls ─── */

.dashboard-shell--kinetic-flow .dashboard-style-bar__field[b-4xg2drkmsj] {
    border-radius: 6px;
    background: rgba(22, 27, 34, 0.8);
    border: 1px solid var(--dashboard-border);
}

.dashboard-shell--kinetic-flow .dashboard-style-bar__field select[b-4xg2drkmsj] {
    border-radius: 4px;
    background: rgba(13, 17, 23, 0.9);
    color: var(--dashboard-ink);
    border-color: var(--dashboard-border);
}

.dashboard-shell--kinetic-flow .dashboard-style-bar__badge[b-4xg2drkmsj] {
    background: rgba(88, 166, 255, 0.12);
    color: #58a6ff;
}

/* ─── Empty state ─── */

.dashboard-shell--kinetic-flow .dashboard-empty[b-4xg2drkmsj] {
    margin: 0;
    border: 1px dashed var(--dashboard-border);
    border-radius: 6px;
    background: rgba(22, 27, 34, 0.6);
}

/* ─── Style dialog ─── */

.dashboard-shell--kinetic-flow .dashboard-style-dialog :deep(.e-dlg-header-content)[b-4xg2drkmsj] {
    background: rgba(22, 27, 34, 0.98);
    border-bottom: 1px solid var(--dashboard-border);
    color: var(--dashboard-ink);
}

.dashboard-shell--kinetic-flow .dashboard-style-dialog :deep(.e-dlg-content)[b-4xg2drkmsj] {
    background: rgba(13, 17, 23, 0.98);
    color: var(--dashboard-ink);
}

.dashboard-shell--kinetic-flow .dashboard-style-dialog :deep(.e-dialog)[b-4xg2drkmsj] {
    border-radius: 8px;
    border: 1px solid var(--dashboard-border);
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.5);
}

/* ─── Grid value colors ─── */

.dashboard-shell--kinetic-flow .dashboard-grid-value--good[b-4xg2drkmsj] {
    color: #3fb950;
}

.dashboard-shell--kinetic-flow .dashboard-grid-value--warn[b-4xg2drkmsj] {
    color: #f85149;
}

/* ─── Tab content — dark backgrounds for ALL tabs ─── */

.dashboard-shell--kinetic-flow .dashboard-tab-content--overview[b-4xg2drkmsj] {
    --dashboard-tab-overview-bg: transparent;
    background: transparent;
}

.dashboard-shell--kinetic-flow .dashboard-tab-content--retail[b-4xg2drkmsj] {
    --dashboard-tab-retail-bg: transparent;
    background: transparent;
}

.dashboard-shell--kinetic-flow .dashboard-tab-content[b-4xg2drkmsj] {
    --dashboard-tab-overview-bg: transparent;
    --dashboard-tab-retail-bg: transparent;
}

/* ─── Scrollbar styling for dark mode ─── */

.dashboard-shell--kinetic-flow .dashboard-tab-content--overview[b-4xg2drkmsj]::-webkit-scrollbar {
    width: 8px;
}

.dashboard-shell--kinetic-flow .dashboard-tab-content--overview[b-4xg2drkmsj]::-webkit-scrollbar-track {
    background: rgba(13, 17, 23, 0.5);
}

.dashboard-shell--kinetic-flow .dashboard-tab-content--overview[b-4xg2drkmsj]::-webkit-scrollbar-thumb {
    background: rgba(48, 54, 61, 0.8);
    border-radius: 4px;
}

.dashboard-shell--kinetic-flow .dashboard-tab-content--overview[b-4xg2drkmsj]::-webkit-scrollbar-thumb:hover {
    background: rgba(88, 166, 255, 0.3);
}

/* ─── Responsive ─── */

@media (max-width: 1200px) {
    .dashboard-shell--kinetic-flow .dashboard-summary-grid[b-4xg2drkmsj] {
        grid-template-columns: 1fr;
    }

    .dashboard-shell--kinetic-flow .dashboard-panel-row[b-4xg2drkmsj] {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 900px) {
    .dashboard-shell--kinetic-flow[b-4xg2drkmsj] {
        padding: 0.5rem;
    }

    .dashboard-shell--kinetic-flow .dashboard-summary-grid[b-4xg2drkmsj],
    .dashboard-shell--kinetic-flow .dashboard-panel-row[b-4xg2drkmsj],
    .dashboard-shell--kinetic-flow .dashboard-chart-grid[b-4xg2drkmsj] {
        grid-template-columns: 1fr;
    }
}

/* ══════════════════════════════════════════════════════════════════════════════
   SPLITTER DECK — resizable split-pane layout with Syncfusion Splitter
   ══════════════════════════════════════════════════════════════════════════════ */

.dashboard-shell--splitter-deck[b-4xg2drkmsj] {
    --dashboard-page-bg: #f8f9fb;
    --dashboard-panel: #ffffff;
    --dashboard-card-shadow: 0 1px 3px rgba(12, 20, 33, 0.06), 0 4px 16px rgba(12, 20, 33, 0.05);
    --dashboard-shell-shadow: 0 2px 8px rgba(12, 20, 33, 0.08);
    --dashboard-control-surface: rgba(255, 255, 255, 0.95);
    --dashboard-control-border: #e1e5eb;
    --sd-radius: 14px;
    --sd-inner-radius: 10px;
    padding: 0.5rem 0.75rem 1rem;
    background: var(--dashboard-page-bg);
    font-family: "Segoe UI", -apple-system, system-ui, sans-serif;
}

/* ─── Tabs ─── */

.dashboard-shell--splitter-deck .dashboard-tabs[b-4xg2drkmsj] {
    border-radius: var(--sd-radius);
    background: var(--dashboard-panel);
    box-shadow: var(--dashboard-shell-shadow);
    border: 1px solid var(--dashboard-control-border);
}

.dashboard-shell--splitter-deck .dashboard-tabs :deep(.e-tab-header)[b-4xg2drkmsj] {
    background: #f4f6f8;
    border-bottom: 1px solid var(--dashboard-control-border);
    padding: 0.25rem 0.5rem;
}

.dashboard-shell--splitter-deck .dashboard-tabs :deep(.e-toolbar-item .e-tab-wrap)[b-4xg2drkmsj] {
    padding: 0.25rem 1rem;
    border-radius: 8px;
}

.dashboard-shell--splitter-deck .dashboard-tabs :deep(.e-toolbar-item.e-active .e-tab-wrap)[b-4xg2drkmsj] {
    background: var(--dashboard-panel);
    border: 1px solid var(--dashboard-control-border);
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06);
}

.dashboard-shell--splitter-deck .dashboard-tabs :deep(.e-toolbar-item.e-active .e-tab-text)[b-4xg2drkmsj] {
    color: var(--dashboard-blue);
    font-weight: 700;
}

.dashboard-shell--splitter-deck .dashboard-tabs :deep(.e-tab-text)[b-4xg2drkmsj] {
    font-size: 0.84rem;
}

/* ─── Tab content ─── */

.dashboard-shell--splitter-deck .dashboard-tab-content[b-4xg2drkmsj] {
    padding: 0;
    border: none;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}

.dashboard-shell--splitter-deck .dashboard-tab-content--stacked[b-4xg2drkmsj] {
    gap: 0;
}

.dashboard-shell--splitter-deck .dashboard-tab-content--overview[b-4xg2drkmsj] {
    background: transparent;
    height: calc((var(--dashboard-visible-height) - 105px) / var(--dashboard-page-scale));
    overflow: hidden;
}

/* ─── Splitter host ─── */

.dashboard-splitter-host[b-4xg2drkmsj] {
    height: 100%;
    width: 100%;
}

.dashboard-splitter-host :deep(.e-splitter)[b-4xg2drkmsj] {
    border: none;
    background: transparent;
}

.dashboard-splitter-host :deep(.e-split-bar)[b-4xg2drkmsj] {
    background: #e8eaef;
    transition: background 0.2s ease;
}

.dashboard-splitter-host :deep(.e-split-bar:hover)[b-4xg2drkmsj],
.dashboard-splitter-host :deep(.e-split-bar.e-split-bar-active)[b-4xg2drkmsj] {
    background: color-mix(in srgb, var(--dashboard-blue) 30%, #e8eaef);
}

.dashboard-splitter-host :deep(.e-navigate-arrow)[b-4xg2drkmsj] {
    display: flex;
}

/* ─── Splitter pane content wrappers ─── */

.dashboard-splitter-pane[b-4xg2drkmsj] {
    padding: 0.75rem;
    overflow-y: auto;
    overflow-x: hidden;
    height: 100%;
    box-sizing: border-box;
}

.dashboard-splitter-pane--left[b-4xg2drkmsj] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.dashboard-splitter-pane--right[b-4xg2drkmsj] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.dashboard-splitter-pane--bottom[b-4xg2drkmsj] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(190px, 1fr));
    gap: 0.75rem;
    align-content: start;
}

/* ─── Cards — clean flat with subtle left accent ─── */

.dashboard-shell--splitter-deck .dashboard-card[b-4xg2drkmsj],
.dashboard-shell--splitter-deck .dashboard-grid-card[b-4xg2drkmsj],
.dashboard-shell--splitter-deck .dashboard-accent-card[b-4xg2drkmsj] {
    background: var(--dashboard-panel);
    border: 1px solid var(--dashboard-control-border);
    border-radius: 0;
    box-shadow: var(--dashboard-card-shadow);
}

.dashboard-shell--splitter-deck .dashboard-card[b-4xg2drkmsj],
.dashboard-shell--splitter-deck .dashboard-grid-card[b-4xg2drkmsj] {
    padding: 1rem 1.1rem;
}

/* ─── Summary grid — vertical stack in left pane ─── */

.dashboard-shell--splitter-deck .dashboard-summary-grid[b-4xg2drkmsj] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    margin-bottom: 0;
}

.dashboard-shell--splitter-deck .dashboard-card__header[b-4xg2drkmsj] {
    margin-bottom: 0.85rem;
}

.dashboard-shell--splitter-deck .dashboard-card__header h3[b-4xg2drkmsj],
.dashboard-shell--splitter-deck .dashboard-grid-card h3[b-4xg2drkmsj] {
    font-size: 1rem;
    font-weight: 700;
}

.dashboard-shell--splitter-deck .dashboard-section-label[b-4xg2drkmsj] {
    font-size: 0.68rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    color: var(--dashboard-blue);
}

/* ─── Summary values ─── */

.dashboard-shell--splitter-deck .dashboard-summary-values[b-4xg2drkmsj] {
    gap: 0.6rem;
    margin-bottom: 0.85rem;
}

.dashboard-shell--splitter-deck .dashboard-summary-values div[b-4xg2drkmsj] {
    padding: 0.65rem 0.8rem;
    border-radius: var(--sd-inner-radius);
    background: #f4f6f8;
    border: 1px solid #eaecf0;
}

.dashboard-shell--splitter-deck .dashboard-summary-values--annual div[b-4xg2drkmsj] {
    background: color-mix(in srgb, var(--dashboard-blue) 4%, #f4f6f8);
    border-color: color-mix(in srgb, var(--dashboard-blue) 10%, #eaecf0);
}

.dashboard-shell--splitter-deck .dashboard-summary-values span[b-4xg2drkmsj] {
    font-size: 0.72rem;
    font-weight: 600;
    color: var(--dashboard-muted);
}

.dashboard-shell--splitter-deck .dashboard-summary-values strong[b-4xg2drkmsj] {
    margin-top: 0.25rem;
    font-size: 1.05rem;
    font-weight: 800;
}

.dashboard-shell--splitter-deck .dashboard-summary-note[b-4xg2drkmsj],
.dashboard-shell--splitter-deck .dashboard-gauge-note[b-4xg2drkmsj] {
    font-size: 0.8rem;
    line-height: 1.5;
    margin-top: 0.65rem;
    color: var(--dashboard-muted);
}

/* ─── Gauge cards ─── */

.dashboard-shell--splitter-deck .dashboard-card--gauge[b-4xg2drkmsj] {
    padding: 0.85rem 0.75rem;
}

.dashboard-shell--splitter-deck .dashboard-card--target[b-4xg2drkmsj] {
    background: color-mix(in srgb, var(--dashboard-blue) 3%, white);
    border-color: color-mix(in srgb, var(--dashboard-blue) 12%, #e1e5eb);
}

.dashboard-shell--splitter-deck .dashboard-card--budget[b-4xg2drkmsj] {
    background: color-mix(in srgb, var(--dashboard-green) 3%, white);
    border-color: color-mix(in srgb, var(--dashboard-green) 12%, #e1e5eb);
}

/* ─── Panel row — compact accent cards ─── */

.dashboard-shell--splitter-deck .dashboard-panel-row[b-4xg2drkmsj] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(190px, 1fr));
    gap: 0.75rem;
}

.dashboard-shell--splitter-deck .dashboard-accent-card[b-4xg2drkmsj] {
    padding: 0.85rem 0.95rem;
    border-left: 4px solid var(--dashboard-blue);
}

.dashboard-shell--splitter-deck .dashboard-accent-card header[b-4xg2drkmsj] {
    margin-bottom: 0.6rem;
}

.dashboard-shell--splitter-deck .dashboard-accent-card h4[b-4xg2drkmsj] {
    font-size: 0.88rem;
    font-weight: 700;
}

.dashboard-shell--splitter-deck .dashboard-accent-card .dashboard-section-label[b-4xg2drkmsj] {
    font-size: 0.62rem;
}

.dashboard-shell--splitter-deck .dashboard-data-line[b-4xg2drkmsj] {
    margin: 0.15rem 0;
    font-size: 0.8rem;
    line-height: 1.4;
}

/* Accent card colors */
.dashboard-shell--splitter-deck .dashboard-accent-card--blue[b-4xg2drkmsj]   { border-left-color: var(--dashboard-blue);  background: color-mix(in srgb, var(--dashboard-blue)  3%, white); }
.dashboard-shell--splitter-deck .dashboard-accent-card--navy[b-4xg2drkmsj]   { border-left-color: var(--dashboard-navy);  background: color-mix(in srgb, var(--dashboard-navy)  3%, white); }
.dashboard-shell--splitter-deck .dashboard-accent-card--green[b-4xg2drkmsj]  { border-left-color: var(--dashboard-green); background: color-mix(in srgb, var(--dashboard-green) 3%, white); }
.dashboard-shell--splitter-deck .dashboard-accent-card--teal[b-4xg2drkmsj]   { border-left-color: var(--dashboard-teal);  background: color-mix(in srgb, var(--dashboard-teal)  3%, white); }
.dashboard-shell--splitter-deck .dashboard-accent-card--coral[b-4xg2drkmsj]  { border-left-color: var(--dashboard-coral); background: color-mix(in srgb, var(--dashboard-coral) 3%, white); }
.dashboard-shell--splitter-deck .dashboard-accent-card--fuchsia[b-4xg2drkmsj]{ border-left-color: var(--dashboard-fuchsia);background: color-mix(in srgb, var(--dashboard-fuchsia) 3%, white); }
.dashboard-shell--splitter-deck .dashboard-accent-card--gold[b-4xg2drkmsj]   { border-left-color: var(--dashboard-gold);  background: color-mix(in srgb, var(--dashboard-gold)  3%, white); }
.dashboard-shell--splitter-deck .dashboard-accent-card--amber[b-4xg2drkmsj]  { border-left-color: var(--dashboard-amber); background: color-mix(in srgb, var(--dashboard-amber) 3%, white); }
.dashboard-shell--splitter-deck .dashboard-accent-card--sky[b-4xg2drkmsj]    { border-left-color: var(--dashboard-sky);   background: color-mix(in srgb, var(--dashboard-sky)   3%, white); }
.dashboard-shell--splitter-deck .dashboard-accent-card--slate[b-4xg2drkmsj]  { border-left-color: var(--dashboard-slate); background: color-mix(in srgb, var(--dashboard-slate) 3%, white); }
.dashboard-shell--splitter-deck .dashboard-accent-card--graphite[b-4xg2drkmsj]{ border-left-color: var(--dashboard-graphite); background: color-mix(in srgb, var(--dashboard-graphite) 3%, white); }
.dashboard-shell--splitter-deck .dashboard-accent-card--darkred[b-4xg2drkmsj]{ border-left-color: var(--dashboard-darkred); background: color-mix(in srgb, var(--dashboard-darkred) 3%, white); }

/* ─── Chart grid — stacked in right pane ─── */

.dashboard-shell--splitter-deck .dashboard-chart-grid[b-4xg2drkmsj] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    margin-top: 0;
}

.dashboard-shell--splitter-deck .dashboard-grid-card--chart[b-4xg2drkmsj],
.dashboard-shell--splitter-deck .dashboard-grid-card--donut[b-4xg2drkmsj] {
    min-height: 280px;
}

/* ─── Chips ─── */

.dashboard-shell--splitter-deck .dashboard-chip[b-4xg2drkmsj] {
    font-size: 0.74rem;
    padding: 0.08rem 0.35rem;
}

/* ─── Logo ─── */

.dashboard-shell--splitter-deck .dashboard-logo-button[b-4xg2drkmsj] {
    border-radius: var(--sd-inner-radius);
    min-width: 90px;
    min-height: 38px;
}

.dashboard-shell--splitter-deck .dashboard-logo[b-4xg2drkmsj] {
    width: 90px;
    max-height: 38px;
}

/* ─── Style controls ─── */

.dashboard-shell--splitter-deck .dashboard-style-bar__field[b-4xg2drkmsj] {
    border-radius: var(--sd-inner-radius);
    padding: 0.5rem 0.6rem;
    font-size: 0.74rem;
}

.dashboard-shell--splitter-deck .dashboard-style-bar__field select[b-4xg2drkmsj] {
    min-height: 32px;
    border-radius: 8px;
}

/* ─── Empty state ─── */

.dashboard-shell--splitter-deck .dashboard-empty[b-4xg2drkmsj] {
    margin: 0;
    border-radius: var(--sd-radius);
}

/* ─── Performance grid in splitter ─── */

.dashboard-shell--splitter-deck :deep(.e-grid .e-headercell)[b-4xg2drkmsj],
.dashboard-shell--splitter-deck :deep(.e-grid .e-rowcell)[b-4xg2drkmsj] {
    padding: 0.22rem 0.4rem;
    font-size: 0.76rem;
}

/* ─── Responsive ─── */

@media (max-width: 900px) {
    .dashboard-shell--splitter-deck[b-4xg2drkmsj] {
        padding: 0.35rem;
    }

    .dashboard-shell--splitter-deck .dashboard-panel-row[b-4xg2drkmsj],
    .dashboard-splitter-pane--bottom[b-4xg2drkmsj] {
        grid-template-columns: 1fr;
    }
}
/* /Components/Pages/DSHB_Retail.razor.rz.scp.css */
.dashboard-retail[b-5w9f199ehd] {
    --retail-ink: var(--dashboard-ink, #1e293b);
    --retail-muted: var(--dashboard-muted, #5b6776);
    --retail-border: var(--dashboard-border, #d8dee8);
    --retail-border-strong: var(--dashboard-border-strong, #c3cfdb);
    --retail-panel: color-mix(in srgb, var(--dashboard-panel, #ffffff) 92%, var(--dashboard-amber, #c57f17) 8%);
    --retail-panel-soft: color-mix(in srgb, var(--dashboard-panel, #ffffff) 82%, var(--dashboard-blue, #004b9b) 18%);
    --retail-shell: color-mix(in srgb, var(--dashboard-panel, #ffffff) 72%, var(--dashboard-amber, #c57f17) 28%);
    --retail-shadow: var(--dashboard-card-shadow, 0 10px 24px rgba(12, 23, 38, 0.06));
    --retail-accent-blue: var(--dashboard-blue, #004b9b);
    --retail-accent-navy: var(--dashboard-navy, #0f2346);
    --retail-accent-green: var(--dashboard-green, #1f8f5f);
    --retail-accent-teal: var(--dashboard-teal, #1e8f88);
    --retail-accent-red: var(--dashboard-darkred, #7f2c2c);
    --retail-accent-coral: var(--dashboard-coral, #d96c4f);
    --retail-accent-gold: var(--dashboard-gold, #af7a13);
    --retail-accent-slate: var(--dashboard-slate, #51616f);
    --retail-card-label-size: 0.68rem;
    --retail-card-primary-size: 0.92rem;
    --retail-card-secondary-size: 0.74rem;
    --retail-card-body-size: 0.82rem;
    --retail-card-compact-label-size: 0.62rem;
    --retail-card-compact-primary-size: 0.86rem;
    --retail-card-compact-secondary-size: 0.72rem;
    --retail-card-compact-body-size: 0.72rem;
    display: flex;
    flex-direction: column;
    gap: 1rem;
    color: var(--retail-ink);
    isolation: isolate;
}

.dashboard-retail__tabs-shell[b-5w9f199ehd] {
    min-width: 0;
    display: flex;
    flex-direction: column;
    min-height: 0;
    height: auto;
    position: relative;
    z-index: 0;
}

.dashboard-retail__tabs-shell :deep(.dashboard-retail__tabs)[b-5w9f199ehd] {
    background: transparent;
    box-shadow: none;
    overflow: visible;
    height: auto;
    display: flex;
    flex-direction: column;
}

.dashboard-retail__tabs-shell :deep(.dashboard-retail__tabs .e-tab-header)[b-5w9f199ehd] {
    background: transparent;
    border-bottom: none;
    margin-bottom: 1rem;
}

.dashboard-retail__tabs-shell :deep(.dashboard-retail__tabs .e-toolbar-item .e-tab-wrap)[b-5w9f199ehd] {
    padding: 0 0.9rem;
    border-radius: 10px 10px 0 0;
}

.dashboard-retail__tabs-shell :deep(.dashboard-retail__tabs .e-toolbar-item.e-active .e-tab-text)[b-5w9f199ehd] {
    color: var(--retail-accent-blue);
    font-weight: 700;
}

.dashboard-retail__tabs-shell :deep(.dashboard-retail__tabs .e-toolbar-item.e-active)[b-5w9f199ehd] {
    border-bottom-color: var(--retail-accent-blue);
}

.dashboard-retail__tabs-shell :deep(.dashboard-retail__tabs .e-content .e-item)[b-5w9f199ehd] {
    padding: 0;
}

.dashboard-retail__tabs-shell :deep(.dashboard-retail__tabs .e-content)[b-5w9f199ehd] {
    flex: 0 0 auto;
    height: auto;
    min-height: 0;
    display: block;
}

.dashboard-retail__tabs-shell :deep(.dashboard-retail__tabs .e-content .e-item.e-active)[b-5w9f199ehd],
.dashboard-retail__tabs-shell :deep(.dashboard-retail__tabs .e-content .e-item)[b-5w9f199ehd] {
    display: block;
    flex: 0 0 auto;
    min-height: 0;
}

.dashboard-retail__tab-panel[b-5w9f199ehd] {
    padding: 0;
    display: block;
    flex: 0 0 auto;
    min-height: 0;
    height: auto !important;
    overflow: visible;
}

.dashboard-retail__service-card[b-5w9f199ehd] {
    padding: 1.5rem;
    border: 1px solid var(--retail-border);
    border-radius: 14px;
    background: var(--retail-panel);
    box-shadow: var(--retail-shadow);
}

.dashboard-retail__tab-panel > :deep(*)[b-5w9f199ehd] {
    min-height: 0;
}

.dashboard-retail__service-card h4[b-5w9f199ehd] {
    margin: 0.5rem 0 0;
    font-size: var(--retail-card-primary-size);
}

.dashboard-retail__service-card p[b-5w9f199ehd] {
    margin: 0.45rem 0 0;
    color: var(--retail-muted);
    font-size: var(--retail-card-secondary-size);
    line-height: 1.45;
}

.dashboard-retail__service-tag[b-5w9f199ehd] {
    display: inline-flex;
    align-items: center;
    padding: 0.22rem 0.6rem;
    border-radius: 6px;
    background: color-mix(in srgb, var(--retail-accent-blue) 12%, white);
    color: var(--retail-accent-blue);
    font-size: 0.7rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.dashboard-retail :deep(.control-section)[b-5w9f199ehd],
.dashboard-retail :deep(.control-section-header)[b-5w9f199ehd] {
    padding: 0;
    margin: 0;
    border: 1px solid var(--retail-border);
    border-radius: 14px;
    background: var(--retail-panel);
    box-shadow: var(--retail-shadow);
    overflow: hidden;
}

.dashboard-retail :deep(.control-section-header)[b-5w9f199ehd] {
    padding: 0.75rem;
}

.dashboard-retail :deep(.label-title-header)[b-5w9f199ehd] {
    display: block;
    margin: 0 0 0.75rem;
    color: var(--retail-muted);
    font-size: var(--retail-card-label-size);
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.dashboard-retail :deep(.span-panel-title)[b-5w9f199ehd],
.dashboard-retail :deep(.label-title)[b-5w9f199ehd],
.dashboard-retail :deep(.label-title-left)[b-5w9f199ehd] {
    color: inherit;
    font-weight: 700;
}

.dashboard-retail :deep(.year-box)[b-5w9f199ehd],
.dashboard-retail :deep(.year-box-right)[b-5w9f199ehd] {
    color: inherit;
    font-size: var(--retail-card-body-size);
}

.dashboard-retail :deep(.year-box p)[b-5w9f199ehd],
.dashboard-retail :deep(.year-box-right p)[b-5w9f199ehd] {
    margin: 0.15rem 0;
}

.dashboard-retail :deep(.panel-header-blue .e-panel-header)[b-5w9f199ehd],
.dashboard-retail :deep(.panel-header-blue2 .e-panel-header)[b-5w9f199ehd] {
    background: linear-gradient(90deg, var(--retail-accent-navy), color-mix(in srgb, var(--retail-accent-blue) 55%, var(--retail-accent-navy) 45%));
    color: #ffffff;
    border-bottom: none;
}

.dashboard-retail :deep(.panel-header-blue .e-panel-content)[b-5w9f199ehd],
.dashboard-retail :deep(.panel-header-blue2 .e-panel-content)[b-5w9f199ehd] {
    background: var(--retail-panel);
}

.dashboard-retail :deep(.target-navy-panel)[b-5w9f199ehd],
.dashboard-retail :deep(.sales-green-panel)[b-5w9f199ehd],
.dashboard-retail :deep(.salesunit-green-panel)[b-5w9f199ehd],
.dashboard-retail :deep(.kpi-darkred-panel)[b-5w9f199ehd],
.dashboard-retail :deep(.stock-blue-panel)[b-5w9f199ehd],
.dashboard-retail :deep(.stores-coral-panel)[b-5w9f199ehd],
.dashboard-retail :deep(.staff-gold-panel)[b-5w9f199ehd],
.dashboard-retail :deep(.gray-panel)[b-5w9f199ehd],
.dashboard-retail :deep(.kpi-sales-panel1)[b-5w9f199ehd] {
    border-radius: 18px;
}

.dashboard-retail :deep(.target-navy-panel)[b-5w9f199ehd] { background: var(--retail-accent-navy); }
.dashboard-retail :deep(.sales-green-panel)[b-5w9f199ehd] { background: var(--retail-accent-green); }
.dashboard-retail :deep(.salesunit-green-panel)[b-5w9f199ehd] { background: var(--retail-accent-teal); }
.dashboard-retail :deep(.kpi-darkred-panel)[b-5w9f199ehd] { background: var(--retail-accent-red); }
.dashboard-retail :deep(.stock-blue-panel)[b-5w9f199ehd] { background: var(--retail-accent-blue); }
.dashboard-retail :deep(.stores-coral-panel)[b-5w9f199ehd] { background: var(--retail-accent-coral); }
.dashboard-retail :deep(.staff-gold-panel)[b-5w9f199ehd] { background: var(--retail-accent-gold); }
.dashboard-retail :deep(.gray-panel)[b-5w9f199ehd] { background: var(--retail-accent-slate); }
.dashboard-retail :deep(.kpi-sales-panel1)[b-5w9f199ehd] {
    overflow: hidden;
    border: 1px solid var(--retail-border);
    box-shadow: var(--dashboard-card-shadow, 0 10px 24px rgba(12, 23, 38, 0.06));
    background: linear-gradient(145deg, color-mix(in srgb, var(--retail-accent-blue) 8%, white) 0%, color-mix(in srgb, var(--dashboard-panel, #ffffff) 94%, white) 100%);
    color: var(--retail-ink);
}

.dashboard-retail :deep(.kpi-sales-panel1 .e-panel-container)[b-5w9f199ehd],
.dashboard-retail :deep(.kpi-sales-panel1 .e-panel-content)[b-5w9f199ehd] {
    border-radius: 18px;
    background: transparent;
    color: inherit;
}

.dashboard-retail :deep(.kpi-sales-panel1 .e-panel-content)[b-5w9f199ehd] {
    display: flex;
    flex-direction: column;
    justify-content: center;
    min-height: 100%;
    padding: 0.9rem 1rem;
}

.dashboard-retail :deep(.kpi-sales-panel1 .label-title-left)[b-5w9f199ehd],
.dashboard-retail :deep(.kpi-sales-panel1 .label-title)[b-5w9f199ehd] {
    display: block;
    margin-bottom: 0.45rem;
    color: var(--retail-accent-navy);
    font-size: var(--retail-card-label-size);
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.dashboard-retail :deep(.kpi-sales-panel1 .year-box)[b-5w9f199ehd],
.dashboard-retail :deep(.kpi-sales-panel1 .year-box-right)[b-5w9f199ehd] {
    font-size: var(--retail-card-body-size);
    line-height: 1.45;
    color: var(--retail-ink);
}

.dashboard-retail :deep(.kpi-sales-panel1 .year-box p)[b-5w9f199ehd],
.dashboard-retail :deep(.kpi-sales-panel1 .year-box-right p)[b-5w9f199ehd] {
    margin: 0;
}

.dashboard-shell--classic .dashboard-retail :deep(.kpi-sales-panel1)[b-5w9f199ehd] {
    border: 1px solid color-mix(in srgb, var(--retail-accent-blue) 30%, black);
    border-left: 12px solid var(--retail-accent-blue);
    background: var(--retail-accent-blue);
    color: #ffffff;
    box-shadow: 0 14px 32px rgba(12, 23, 38, 0.14);
    text-align: left;
}

.dashboard-shell--classic .dashboard-retail :deep(.kpi-sales-panel1 .e-panel-container)[b-5w9f199ehd],
.dashboard-shell--classic .dashboard-retail :deep(.kpi-sales-panel1 .e-panel-content)[b-5w9f199ehd] {
    background: transparent;
}

.dashboard-shell--classic .dashboard-retail :deep(.kpi-sales-panel1 .label-title-left)[b-5w9f199ehd],
.dashboard-shell--classic .dashboard-retail :deep(.kpi-sales-panel1 .label-title)[b-5w9f199ehd] {
    margin-bottom: 0.45rem;
    color: rgba(255, 255, 255, 0.8);
    font-size: var(--retail-card-label-size);
    letter-spacing: 0.05em;
    text-align: left;
}

.dashboard-shell--classic .dashboard-retail :deep(.kpi-sales-panel1 .year-box)[b-5w9f199ehd],
.dashboard-shell--classic .dashboard-retail :deep(.kpi-sales-panel1 .year-box-right)[b-5w9f199ehd] {
    font-size: var(--retail-card-body-size);
    font-weight: 700;
    line-height: 1.55;
    text-align: left;
}

.dashboard-shell--classic .dashboard-retail :deep(.kpi-sales-panel1 .year-box p)[b-5w9f199ehd],
.dashboard-shell--classic .dashboard-retail :deep(.kpi-sales-panel1 .year-box-right p)[b-5w9f199ehd] {
    margin: 0;
    text-align: left;
}

.dashboard-retail :deep(.e-dashboardlayout .e-panel)[b-5w9f199ehd] {
    border-radius: 10px;
    border: 1px solid var(--retail-border);
    box-shadow: none;
}

.dashboard-retail :deep(.e-grid)[b-5w9f199ehd] {
    border-radius: 10px;
}

.dashboard-retail :deep(.e-grid .e-gridheader)[b-5w9f199ehd] {
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
}

.dashboard-shell--retail-compact .dashboard-retail[b-5w9f199ehd] {
    gap: 0.75rem;
    min-height: 0;
    height: 100%;
    font-size: 0.82rem;
}

.dashboard-shell--retail-compact .dashboard-retail__tabs-shell[b-5w9f199ehd] {
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    min-height: 0;
    height: auto;
}

.dashboard-shell--retail-compact .dashboard-retail__tabs-shell :deep(.dashboard-retail__tabs .e-content .e-item.e-active)[b-5w9f199ehd],
.dashboard-shell--retail-compact .dashboard-retail__tabs-shell :deep(.dashboard-retail__tabs .e-content .e-item)[b-5w9f199ehd] {
    display: flex;
    flex: 1 1 auto;
}

.dashboard-shell--retail-compact .dashboard-retail__tabs-shell :deep(.dashboard-retail__tabs .e-tab-header)[b-5w9f199ehd] {
    margin-bottom: 0.75rem;
}

.dashboard-shell--retail-compact .dashboard-retail__tabs-shell :deep(.dashboard-retail__tabs .e-toolbar-item .e-tab-wrap)[b-5w9f199ehd] {
    padding: 0 0.45rem;
}

.dashboard-shell--retail-compact .dashboard-retail__tab-panel[b-5w9f199ehd] {
    display: block;
    flex: 0 0 auto;
    min-height: 0;
    height: auto !important;
    overflow: visible;
}

.dashboard-shell--retail-compact .dashboard-retail__service-card[b-5w9f199ehd] {
    padding: 0.8rem;
}

.dashboard-shell--retail-compact .dashboard-retail__service-card h4[b-5w9f199ehd] {
    font-size: var(--retail-card-compact-primary-size);
}

.dashboard-shell--retail-compact .dashboard-retail__service-card p[b-5w9f199ehd] {
    font-size: var(--retail-card-compact-secondary-size);
}

.dashboard-shell--retail-compact .dashboard-retail :deep(.control-section-header)[b-5w9f199ehd] {
    padding: 0.45rem;
}

.dashboard-shell--retail-compact .dashboard-retail :deep(.panel-header-blue .e-panel-header)[b-5w9f199ehd],
.dashboard-shell--retail-compact .dashboard-retail :deep(.panel-header-blue2 .e-panel-header)[b-5w9f199ehd] {
    min-height: 26px;
    padding: 0.12rem 0.38rem;
}

.dashboard-shell--retail-compact .dashboard-retail :deep(.span-panel-title)[b-5w9f199ehd],
.dashboard-shell--retail-compact .dashboard-retail :deep(.title)[b-5w9f199ehd],
.dashboard-shell--retail-compact .dashboard-retail :deep(.label-title-header)[b-5w9f199ehd] {
    font-size: var(--retail-card-compact-label-size);
}

.dashboard-shell--retail-compact .dashboard-retail :deep(.panel-header-blue .e-panel-content)[b-5w9f199ehd],
.dashboard-shell--retail-compact .dashboard-retail :deep(.panel-header-blue2 .e-panel-content)[b-5w9f199ehd] {
    padding: 0.26rem 0.34rem;
}

.dashboard-shell--retail-compact .dashboard-retail :deep(.e-chart)[b-5w9f199ehd],
.dashboard-shell--retail-compact .dashboard-retail :deep(.e-accumulationchart)[b-5w9f199ehd] {
    min-height: 180px;
}

.dashboard-shell--retail-compact .dashboard-retail :deep(.e-chart svg text)[b-5w9f199ehd],
.dashboard-shell--retail-compact .dashboard-retail :deep(.e-accumulationchart svg text)[b-5w9f199ehd] {
    font-size: 8.5px;
}

.dashboard-shell--retail-compact .dashboard-retail :deep(.e-dashboardlayout .e-panel)[b-5w9f199ehd] {
    border-radius: 8px;
}

.dashboard-shell--retail-compact .dashboard-retail :deep(.e-grid .e-headercell)[b-5w9f199ehd],
.dashboard-shell--retail-compact .dashboard-retail :deep(.e-grid .e-rowcell)[b-5w9f199ehd] {
    padding: 0.16rem 0.28rem;
    font-size: 0.66rem;
}

.dashboard-shell--retail-compact .dashboard-retail :deep(.e-grid .e-gridpager)[b-5w9f199ehd],
.dashboard-shell--retail-compact .dashboard-retail :deep(.e-grid .e-pager)[b-5w9f199ehd],
.dashboard-shell--retail-compact .dashboard-retail :deep(.e-grid .e-pager *)[b-5w9f199ehd] {
    min-height: 28px;
    font-size: 0.64rem;
}

.dashboard-shell--retail-compact .dashboard-retail :deep(.kpi-sales-panel1)[b-5w9f199ehd],
.dashboard-shell--retail-compact .dashboard-retail :deep(.kpi-sales-panel1 .e-panel-container)[b-5w9f199ehd],
.dashboard-shell--retail-compact .dashboard-retail :deep(.kpi-sales-panel1 .e-panel-content)[b-5w9f199ehd] {
    border-radius: 14px;
}

.dashboard-shell--retail-compact .dashboard-retail :deep(.kpi-sales-panel1 .e-panel-content)[b-5w9f199ehd] {
    padding: 0.45rem 0.55rem;
}

.dashboard-shell--retail-compact .dashboard-retail :deep(.kpi-sales-panel1 .label-title-left)[b-5w9f199ehd],
.dashboard-shell--retail-compact .dashboard-retail :deep(.kpi-sales-panel1 .label-title)[b-5w9f199ehd] {
    margin-bottom: 0.3rem;
    font-size: var(--retail-card-compact-label-size);
}

.dashboard-shell--retail-compact .dashboard-retail :deep(.kpi-sales-panel1 .year-box)[b-5w9f199ehd],
.dashboard-shell--retail-compact .dashboard-retail :deep(.kpi-sales-panel1 .year-box-right)[b-5w9f199ehd] {
    font-size: var(--retail-card-compact-body-size);
    line-height: 1.2;
}

/* /Components/Pages/DSHB_Retail_10.razor.rz.scp.css */
.retail-header-shell[b-08lz729g5b] {
    position: sticky;
    top: 0;
    z-index: 20;
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    background: var(--dashboard-tab-retail-bg);
    box-shadow: 0 14px 18px -18px rgba(15, 35, 70, 0.28);
}

.retail-header-shell--loading .retail-filter-shell[b-08lz729g5b],
.retail-kpi-grid--loading[b-08lz729g5b] {
    opacity: 0.9;
}

.retail-header-loading[b-08lz729g5b] {
    position: relative;
    z-index: 1;
    width: 100%;
}

.retail-header-loading :deep(.loading3)[b-08lz729g5b] {
    margin: 0;
}

.retail-filter-shell[b-08lz729g5b] {
    padding: 0.95rem 1rem;
    overflow: visible;
    background: linear-gradient(180deg, color-mix(in srgb, var(--dashboard-panel, #ffffff) 92%, white) 0%, color-mix(in srgb, var(--dashboard-blue, #004b9b) 6%, white) 100%);
    border: none;
    box-shadow: none;
    transition: opacity 0.18s ease, box-shadow 0.18s ease;
}

.retail-filter-shell--loading[b-08lz729g5b] {
    box-shadow: 0 0 0 1px color-mix(in srgb, var(--dashboard-blue, #004b9b) 10%, transparent);
}

.retail-filter-grid[b-08lz729g5b] {
    display: flex;
    flex-wrap: nowrap;
    justify-content: flex-start;
    align-items: flex-end;
    gap: 0.72rem;
    width: 100%;
    max-width: 100%;
    overflow-x: auto;
    overflow-y: hidden;
}

.retail-filter-field[b-08lz729g5b] {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    flex: 1 1 160px;
    gap: 0.42rem;
    min-width: 120px;
    width: auto;
}

.retail-filter-field--period[b-08lz729g5b] {
    flex: 1.35 1 300px;
    min-width: 260px;
    width: auto;
}

.retail-filter-field--year[b-08lz729g5b],
.retail-filter-field--date[b-08lz729g5b] {
    flex: 0.55 1 110px;
    min-width: 90px;
    width: auto;
}

.retail-filter-field > :last-child[b-08lz729g5b] {
    min-height: 31px;
}

.retail-filter-field :deep(.retail-select)[b-08lz729g5b],
.retail-filter-field :deep(.retail-select.e-control-wrapper)[b-08lz729g5b],
.retail-filter-field :deep(.retail-select.e-input-group)[b-08lz729g5b],
.retail-filter-field :deep(.retail-select.e-ddl)[b-08lz729g5b],
.retail-filter-field :deep(.retail-select.e-ddl.e-input-group)[b-08lz729g5b] {    
    min-height: 31px;
    height: 31px;
    box-sizing: border-box;
}

.retail-filter-field label[b-08lz729g5b] {
    color: var(--dashboard-muted, #64748b);
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.retail-period-group[b-08lz729g5b] {
    display: flex;
    align-items: center;
    flex-wrap: nowrap;
    gap: 0.36rem;
    height: 31px;
    min-height: 31px;
    padding: 0.08rem;
    border: 1px solid var(--dashboard-border, #e2e8f0);
    border-radius: 12px;
    background: color-mix(in srgb, var(--dashboard-panel, #ffffff) 90%, white);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.8);
    box-sizing: border-box;
}

.retail-period-option[b-08lz729g5b] {
    display: flex;
    align-items: stretch;
    flex: 1 1 88px;
    min-width: 0;
}

.retail-kpi-grid[b-08lz729g5b] {
    display: grid;
    grid-template-columns: repeat(8, minmax(0, 1fr));
    gap: 1rem;
    padding: 0;
    overflow: visible;
    transition: opacity 0.18s ease;
}

.retail-kpi-card[b-08lz729g5b] {
    --retail-accent: var(--dashboard-blue, #004b9b);
    min-height: 130px;   
    padding: 1rem;
    border-radius: 20px;
    color: var(--dashboard-ink, #1e293b);
    border: 1px solid var(--dashboard-border, #e2e8f0);
    border-left: 6px solid var(--retail-accent);
    background: linear-gradient(135deg, color-mix(in srgb, var(--retail-accent) 8%, white) 0%, color-mix(in srgb, var(--dashboard-panel, #ffffff) 96%, white) 65%);
    box-shadow: var(--dashboard-card-shadow, 0 10px 24px rgba(12, 23, 38, 0.06));
}

.dashboard-shell--classic .retail-kpi-card[b-08lz729g5b] {
    color: #ffffff;
    border-left: 6px solid var(--retail-accent);
    background: var(--retail-accent);
    box-shadow: 0 14px 32px rgba(12, 23, 38, 0.14);
    text-align: left;
}

.retail-kpi-card header[b-08lz729g5b] {
    margin-bottom: 0.8rem;
}

.retail-kpi-card h4[b-08lz729g5b] {
    margin: 0.15rem 0 0;
    font-size: var(--retail-card-primary-size, 0.92rem);
    font-weight: 700;
    color: var(--dashboard-ink, #1e293b);
    letter-spacing: 0;
    font-variant-numeric: tabular-nums;
    overflow-wrap: anywhere;
}

.dashboard-shell--classic .retail-kpi-card h4[b-08lz729g5b] {
    color: #ffffff;
}

.retail-kpi-label[b-08lz729g5b] {
    display: block;
    font-size: var(--retail-card-label-size, 0.68rem);
    font-weight: 700;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    color: var(--dashboard-muted, #64748b);
}

.dashboard-shell--classic .retail-kpi-label[b-08lz729g5b] {
    color: rgba(255, 255, 255, 0.78);
}

.retail-kpi-line[b-08lz729g5b] {
    margin: 0.3rem 0;
    font-size: var(--retail-card-secondary-size, 0.74rem);
    color: var(--dashboard-muted, #64748b);
}

.dashboard-shell--classic .retail-kpi-line[b-08lz729g5b] {
    color: rgba(255, 255, 255, 0.9);
}

.retail-kpi-line--highlight[b-08lz729g5b] {
    font-weight: 700;
    color: var(--dashboard-ink, #1e293b);
}

.dashboard-shell--classic .retail-kpi-line--highlight[b-08lz729g5b] {
    color: #ffffff;
}

.retail-kpi-card--target[b-08lz729g5b] { --retail-accent: var(--dashboard-blue, #004b9b); }
.retail-kpi-card--sales[b-08lz729g5b] { --retail-accent: var(--dashboard-green, #1f8f5f); }
.retail-kpi-card--units[b-08lz729g5b] { --retail-accent: var(--dashboard-teal, #1e8f88); }
.retail-kpi-card--invoice[b-08lz729g5b] { --retail-accent: var(--dashboard-darkred, #7f2c2c); }
.retail-kpi-card--stock[b-08lz729g5b] { --retail-accent: var(--dashboard-navy, #0f2346); }
.retail-kpi-card--stores[b-08lz729g5b] { --retail-accent: var(--dashboard-coral, #d96c4f); }
.retail-kpi-card--staff[b-08lz729g5b] { --retail-accent: var(--dashboard-gold, #af7a13); }
.retail-kpi-card--floor[b-08lz729g5b] { --retail-accent: var(--dashboard-slate, #51616f); }

:deep(.retail-select.e-dropdownlist)[b-08lz729g5b] {    
    height: 31px;
    border: 1px solid var(--dashboard-border, #e2e8f0);
    background: color-mix(in srgb, var(--dashboard-panel, #ffffff) 92%, white);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.8), 0 1px 2px rgba(15, 23, 42, 0.04);
}

:deep(.retail-select.e-dropdownlist:hover)[b-08lz729g5b],
:deep(.retail-select.e-dropdownlist.e-input-focus)[b-08lz729g5b] {
    border-color: color-mix(in srgb, var(--dashboard-blue, #004b9b) 35%, white);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--dashboard-blue, #004b9b) 10%, transparent);
}

:deep(.retail-select.e-dropdownlist .e-input-group-icon)[b-08lz729g5b],
:deep(.retail-select.e-dropdownlist .e-ddl-icon)[b-08lz729g5b] {
    color: var(--dashboard-blue, #004b9b);
}

:deep(.retail-select.e-dropdownlist input.e-input)[b-08lz729g5b],
:deep(.retail-select.e-dropdownlist .e-input-value)[b-08lz729g5b],
:deep(.retail-select.e-dropdownlist .e-input)[b-08lz729g5b] {
    color: var(--dashboard-ink, #1a2633);
    font-size: 0.95rem;
    font-weight: 600;
}

:deep(.retail-select.e-dropdownlist .e-float-text)[b-08lz729g5b],
:deep(.retail-select.e-dropdownlist .e-placeholder)[b-08lz729g5b] {
    color: color-mix(in srgb, var(--dashboard-muted, #64748b) 65%, white);
}

:deep(.retail-radio.e-radio-wrapper)[b-08lz729g5b] {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    width: 100%;
    min-height: 100%;
    height: 100%;
    padding: 0.08rem 0.52rem;
    border: 1px solid transparent;
    border-radius: 10px;
    background: transparent;
    box-sizing: border-box;
    transition: background-color 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease;
}

:deep(.retail-radio.e-radio-wrapper:hover)[b-08lz729g5b] {
    background: color-mix(in srgb, var(--dashboard-blue, #004b9b) 6%, transparent);
}

:deep(.retail-radio.e-radio-wrapper .e-radio + label)[b-08lz729g5b],
:deep(.retail-radio.e-radio-wrapper .e-label)[b-08lz729g5b] {
    color: var(--dashboard-ink, #1a2633);
    font-size: 0.82rem;
    font-weight: 600;
}

:deep(.retail-radio.e-radio-wrapper .e-radio)[b-08lz729g5b] {
    border-color: color-mix(in srgb, var(--dashboard-blue, #004b9b) 35%, white);
}

:deep(.retail-radio.e-radio-wrapper .e-radio:checked + .e-ripple-container + .e-label)[b-08lz729g5b],
:deep(.retail-radio.e-radio-wrapper .e-radio:checked + .e-label)[b-08lz729g5b] {
    color: var(--dashboard-blue, #004b9b);
}

:deep(.retail-radio.e-radio-wrapper:has(.e-radio:checked))[b-08lz729g5b] {
    background: linear-gradient(180deg, color-mix(in srgb, var(--dashboard-blue, #004b9b) 10%, white) 0%, color-mix(in srgb, var(--dashboard-panel, #ffffff) 92%, white) 100%);
    border-color: color-mix(in srgb, var(--dashboard-blue, #004b9b) 22%, white);
    box-shadow: 0 0 0 1px color-mix(in srgb, var(--dashboard-blue, #004b9b) 8%, transparent);
}

.dashboard-shell--retail-compact .retail-header-shell[b-08lz729g5b] {
    gap: 0.7rem;
}

.dashboard-shell--retail-compact .retail-filter-shell[b-08lz729g5b] {
    padding: 0.4rem 0.5rem;
}

.dashboard-shell--retail-compact .retail-filter-grid[b-08lz729g5b] {
    gap: 0.55rem;
}

.dashboard-shell--retail-compact .retail-filter-field[b-08lz729g5b] {
    flex-basis: 168px;
    gap: 0.25rem;
    width: min(100%, 168px);
}

.dashboard-shell--retail-compact .retail-filter-field--period[b-08lz729g5b] {
    flex-basis: 236px;
    width: min(100%, 236px);
}

.dashboard-shell--retail-compact .retail-filter-field--year[b-08lz729g5b],
.dashboard-shell--retail-compact .retail-filter-field--date[b-08lz729g5b] {
    flex-basis: 92px;
    width: min(100%, 92px);
}

.dashboard-shell--retail-compact .retail-filter-field > :last-child[b-08lz729g5b],
.dashboard-shell--retail-compact .retail-filter-field :deep(.retail-select)[b-08lz729g5b],
.dashboard-shell--retail-compact .retail-filter-field :deep(.retail-select.e-control-wrapper)[b-08lz729g5b],
.dashboard-shell--retail-compact .retail-filter-field :deep(.retail-select.e-input-group)[b-08lz729g5b],
.dashboard-shell--retail-compact .retail-filter-field :deep(.retail-select.e-ddl)[b-08lz729g5b],
.dashboard-shell--retail-compact .retail-filter-field :deep(.retail-select.e-ddl.e-input-group)[b-08lz729g5b] {
    min-height: 22px;
    height: 22px;
}

.dashboard-shell--retail-compact .retail-filter-field label[b-08lz729g5b] {
    font-size: 0.54rem;
}

.dashboard-shell--retail-compact .retail-period-group[b-08lz729g5b] {
    gap: 0.35rem;
    height: 22px;
    min-height: 22px;
    padding: 0.05rem;
    border-radius: 8px;
}

.dashboard-shell--retail-compact :deep(.retail-radio.e-radio-wrapper)[b-08lz729g5b] {
    gap: 0.4rem;
    padding: 0.02rem 0.4rem;
    border-radius: 6px;
}

.dashboard-shell--retail-compact :deep(.retail-radio.e-radio-wrapper .e-radio + label)[b-08lz729g5b],
.dashboard-shell--retail-compact :deep(.retail-radio.e-radio-wrapper .e-label)[b-08lz729g5b],
.dashboard-shell--retail-compact :deep(.retail-select.e-dropdownlist input.e-input)[b-08lz729g5b],
.dashboard-shell--retail-compact :deep(.retail-select.e-dropdownlist .e-input-value)[b-08lz729g5b],
.dashboard-shell--retail-compact :deep(.retail-select.e-dropdownlist .e-input)[b-08lz729g5b] {
    font-size: 0.64rem;
}

.dashboard-shell--retail-compact .retail-kpi-grid[b-08lz729g5b] {
    grid-template-columns: repeat(8, minmax(0, 1fr));
    gap: 0.5rem;
}

.dashboard-shell--retail-compact .retail-kpi-card[b-08lz729g5b] {
    min-height: 84px;
    padding: 0.5rem 0.55rem;
    border-radius: 12px;
    border-left-width: 4px;
}

.dashboard-shell--retail-compact .retail-kpi-card header[b-08lz729g5b] {
    margin-bottom: 0.35rem;
}

.dashboard-shell--retail-compact .retail-kpi-card h4[b-08lz729g5b] {
    font-size: var(--retail-card-compact-primary-size, 0.86rem);
}

.dashboard-shell--retail-compact .retail-kpi-label[b-08lz729g5b] {
    font-size: var(--retail-card-compact-label-size, 0.62rem);
}

.dashboard-shell--retail-compact .retail-kpi-line[b-08lz729g5b] {
    margin: 0.12rem 0;
    font-size: var(--retail-card-compact-secondary-size, 0.72rem);
}

@media (max-width: 1100px) {
    .retail-kpi-grid[b-08lz729g5b] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .retail-period-group[b-08lz729g5b] {
        flex-wrap: wrap;
    }
}

@media (max-width: 720px) {
    .retail-header-shell[b-08lz729g5b] {
        top: 0;
    }

    .retail-kpi-grid[b-08lz729g5b] {
        grid-template-columns: 1fr;
        display: grid;
    }

    .retail-filter-grid[b-08lz729g5b] {
        display: flex;
        flex-direction: column;
        align-items: stretch;
    }

    .retail-filter-field[b-08lz729g5b],
    .retail-filter-field--period[b-08lz729g5b],
    .retail-filter-field--year[b-08lz729g5b],
    .retail-filter-field--date[b-08lz729g5b] {
        flex-basis: auto;
        min-width: 0;
        width: 100%;
    }

    .retail-period-option[b-08lz729g5b] {
        flex-basis: 100%;
    }

}
/* /Components/Pages/DSHB_Retail_20.razor.rz.scp.css */
.retail-sales-performance[b-jqnzjdgr8t] {
    width: 100%;
    max-width: 100%;
    overflow: hidden;
    min-width: 0;
}

.retail-sales-performance__loading[b-jqnzjdgr8t] {
    margin-bottom: 0.75rem;
}

.retail-sales-performance--loading[b-jqnzjdgr8t] {
    transition: opacity 0.18s ease;
}

.control-section-header[b-jqnzjdgr8t],
.control-section[b-jqnzjdgr8t] {
    overflow-x: hidden;
}

.retail-sales-performance__section[b-jqnzjdgr8t] {
    padding: 0.75rem;
}

.retail-sales-performance__summary-stack[b-jqnzjdgr8t] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.retail-sales-performance__summary-layout[b-jqnzjdgr8t] {
    display: grid;
    grid-template-columns: minmax(280px, 1fr) minmax(360px, 1.3fr);
    gap: 1rem;
    align-items: stretch;
}

.retail-sales-performance__summary-layout--stacked[b-jqnzjdgr8t] {
    grid-template-columns: 1fr;
}

.retail-sales-performance__chart-with-kpis[b-jqnzjdgr8t] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    min-height: 0;
}

.retail-sales-performance__chart-with-kpis > .retail-sales-card--chart[b-jqnzjdgr8t] {
    flex: 1;
    min-height: 0;
}

.retail-sales-performance__kpi-stack[b-jqnzjdgr8t] {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 0.5rem;
}

.retail-sales-performance__season-layout[b-jqnzjdgr8t] {
    display: grid;
    grid-template-columns: minmax(260px, 0.9fr) minmax(360px, 1.3fr);
    gap: 1rem;
    align-items: stretch;
}

.retail-sales-card[b-jqnzjdgr8t] {
    min-width: 0;
    border: 1px solid var(--dashboard-border, #d8dee8);
    border-radius: 16px;
    background: color-mix(in srgb, var(--dashboard-panel, #ffffff) 90%, var(--dashboard-amber, #c57f17) 10%);
    box-shadow: var(--dashboard-card-shadow, 0 10px 24px rgba(12, 23, 38, 0.06));
}

.retail-sales-card--grid[b-jqnzjdgr8t],
.retail-sales-card--chart[b-jqnzjdgr8t] {
    padding: 0.75rem;
    display: flex;
    flex-direction: column;
    gap: 0.55rem;
}

.retail-sales-card--store-summary[b-jqnzjdgr8t] {
    padding: 0.75rem;
    display: flex;
    flex-direction: column;
}

.retail-sales-card__chart-host[b-jqnzjdgr8t] {
    min-width: 0;
    min-height: 0;
}

.retail-sales-card__chart-host--trend[b-jqnzjdgr8t],
.retail-sales-card__chart-host--store[b-jqnzjdgr8t],
.retail-sales-card__chart-host--season-trend[b-jqnzjdgr8t] {
    height: 340px;
}

.retail-sales-card__chart-host--season-pie[b-jqnzjdgr8t] {
    height: 320px;
}

.retail-sales-card .label-title[b-jqnzjdgr8t] {
    margin-bottom: 0.2rem;
}

.retail-monthly-summary-tabs[b-jqnzjdgr8t] {
    display: flex;
    align-items: flex-end;
    gap: 0;
    border-bottom: 1px solid var(--dashboard-border, #d8dee8);
}

.retail-monthly-summary-tab[b-jqnzjdgr8t] {
    min-height: 34px;
    padding: 0.45rem 0.85rem;
    border: 0;
    border-bottom: 2px solid transparent;
    background: transparent;
    color: var(--dashboard-muted, #5b6776);
    font: inherit;
    font-size: var(--retail-card-body-size, 0.82rem);
    cursor: pointer;
}

.retail-monthly-summary-tab:hover[b-jqnzjdgr8t],
.retail-monthly-summary-tab:focus-visible[b-jqnzjdgr8t] {
    color: var(--dashboard-blue, #004b9b);
    background: color-mix(in srgb, var(--dashboard-blue, #004b9b) 7%, transparent);
    outline: none;
}

.retail-monthly-summary-tab.is-active[b-jqnzjdgr8t] {
    border-bottom-color: var(--dashboard-blue, #004b9b);
    color: var(--dashboard-blue, #004b9b);
    font-weight: 700;
}

.retail-sales-performance__content--compact .retail-monthly-summary-tab[b-jqnzjdgr8t] {
    min-height: 28px;
    padding: 0.3rem 0.65rem;
    font-size: var(--retail-card-compact-body-size, 0.72rem);
}

.retail-sales-card :deep(.e-grid)[b-jqnzjdgr8t],
.retail-sales-card :deep(.e-chart)[b-jqnzjdgr8t],
.retail-sales-card :deep(.e-accumulationchart)[b-jqnzjdgr8t] {
    width: 100%;
}

.retail-sales-card :deep(.e-grid)[b-jqnzjdgr8t] {
    border: none;
}

.retail-sales-performance__kpi-stack .retail-mini-kpi[b-jqnzjdgr8t] {
    min-height: 108px;
    justify-content: flex-start;
    align-items: flex-start;
    gap: 0.42rem;
    padding: 0.9rem 1rem;
    border: 1px solid var(--dashboard-border, #d8dee8);
    border-left: 4px solid var(--retail-mini-accent);
    border-radius: 16px;
    background: color-mix(in srgb, var(--dashboard-panel, #ffffff) 90%, var(--dashboard-amber, #c57f17) 10%);
    box-shadow: var(--dashboard-card-shadow, 0 10px 24px rgba(12, 23, 38, 0.06));
    text-align: left;
}

.retail-sales-performance__kpi-stack .retail-mini-kpi__label[b-jqnzjdgr8t] {
    color: var(--dashboard-muted, #64748b);
    font-size: var(--retail-card-label-size, 0.68rem);
}

.retail-sales-performance__kpi-stack .retail-mini-kpi__values[b-jqnzjdgr8t] {
    align-items: flex-start;
}

.retail-sales-performance-section[b-jqnzjdgr8t] {
    --retail-sales-panel-header-min-height: 30px;
    --retail-sales-panel-header-padding: 0.16rem 0.48rem;
    --retail-sales-panel-content-padding: 0.28rem 0.4rem;
}

.retail-sales-performance-section :deep(.panel-header-blue .e-panel-header)[b-jqnzjdgr8t],
.retail-sales-performance-section :deep(.panel-header-blue2 .e-panel-header)[b-jqnzjdgr8t] {
    min-height: var(--retail-sales-panel-header-min-height);
    padding: var(--retail-sales-panel-header-padding);
}

.retail-sales-performance-section :deep(.panel-header-blue .e-panel-content)[b-jqnzjdgr8t],
.retail-sales-performance-section :deep(.panel-header-blue2 .e-panel-content)[b-jqnzjdgr8t] {
    padding: var(--retail-sales-panel-content-padding);
}

.retail-sales-performance-section :deep(.retail-chart-panel-card .e-panel-content)[b-jqnzjdgr8t] {
    display: flex;
    flex-direction: column;
    min-height: 0;
}

.retail-sales-performance-section :deep(.panel-header-blue2 .e-panel-content)[b-jqnzjdgr8t] {
    overflow: visible;
}

.retail-sales-performance-section :deep(.span-panel-title)[b-jqnzjdgr8t],
.retail-sales-performance-section :deep(.title)[b-jqnzjdgr8t] {
    font-size: var(--retail-card-label-size, 0.68rem);
}

.retail-sales-performance-section :deep(.e-grid .e-headercell)[b-jqnzjdgr8t],
.retail-sales-performance-section :deep(.e-grid .e-rowcell)[b-jqnzjdgr8t] {
    padding-top: 0.18rem;
    padding-bottom: 0.18rem;
}

:deep(.e-dashboardlayout)[b-jqnzjdgr8t] {
    width: 100%;
    min-width: 0;
}

:deep(.e-dashboardlayout .e-panel)[b-jqnzjdgr8t] {
    min-width: 0;
}

:deep(.kpi-sales-panel1)[b-jqnzjdgr8t] {
    overflow: hidden;
    border: none;
    border-radius: 18px;
    background: transparent !important;
    box-shadow: none;
    color: var(--dashboard-ink, #1e293b);
}

:deep(.kpi-sales-panel1 .e-panel-container)[b-jqnzjdgr8t],
:deep(.kpi-sales-panel1 .e-panel-content)[b-jqnzjdgr8t] {
    border-radius: 18px;
    background: transparent !important;
    color: inherit;
}

:deep(.kpi-sales-panel1 .e-panel-content)[b-jqnzjdgr8t] {
    display: flex;
    min-height: 100%;
    padding: 0 !important;
    text-align: initial;
}

.retail-mini-kpi[b-jqnzjdgr8t] {
    --retail-mini-accent: var(--dashboard-blue, #004b9b);
    width: 100%;
    height: 100%;
    min-height: 100%;
    min-width: 0;
    flex: 1 1 auto;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 0.28rem;
    padding: 0.58rem 0.68rem;
    overflow: hidden;
    border: none;
    border-radius: 14px;
    background: linear-gradient(
        180deg,
        color-mix(in srgb, var(--retail-mini-accent) 7%, white) 0%,
        color-mix(in srgb, var(--dashboard-panel, #ffffff) 98%, white) 100%
    );
    box-shadow: none;
    color: var(--dashboard-ink, #1e293b);
    text-align: center;
}

.retail-mini-kpi__label[b-jqnzjdgr8t] {
    display: block;
    color: color-mix(in srgb, var(--retail-mini-accent) 72%, var(--dashboard-ink, #1e293b));
    max-width: 100%;
    font-size: var(--retail-card-label-size, 0.68rem);
    font-weight: 700;
    letter-spacing: 0.035em;
    line-height: 1.2;
    text-transform: uppercase;
    overflow-wrap: anywhere;
}

.retail-mini-kpi__values[b-jqnzjdgr8t] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.12rem;
    width: 100%;
    min-width: 0;
    overflow: hidden;
}

.retail-mini-kpi__primary[b-jqnzjdgr8t],
.retail-mini-kpi__secondary[b-jqnzjdgr8t] {
    display: block;
    width: 100%;
    max-width: 100%;
    line-height: 1.1;
    white-space: normal;
    overflow-wrap: anywhere;
    word-break: break-word;
    font-variant-numeric: tabular-nums;
}

.retail-mini-kpi__primary[b-jqnzjdgr8t] {
    font-size: var(--retail-card-primary-size, 0.92rem);
    font-weight: 800;
    color: var(--dashboard-ink, #1e293b);
}

.retail-mini-kpi__secondary[b-jqnzjdgr8t] {
    font-size: var(--retail-card-secondary-size, 0.74rem);
    font-weight: 600;
    color: var(--dashboard-muted, #64748b);
}

.retail-mini-kpi--navy[b-jqnzjdgr8t] { --retail-mini-accent: var(--dashboard-navy, #0f2346); }
.retail-mini-kpi--blue[b-jqnzjdgr8t] { --retail-mini-accent: var(--dashboard-blue, #004b9b); }
.retail-mini-kpi--green[b-jqnzjdgr8t] { --retail-mini-accent: var(--dashboard-green, #1f8f5f); }
.retail-mini-kpi--teal[b-jqnzjdgr8t] { --retail-mini-accent: var(--dashboard-teal, #1e8f88); }
.retail-mini-kpi--coral[b-jqnzjdgr8t] { --retail-mini-accent: var(--dashboard-coral, #d96c4f); }
.retail-mini-kpi--gold[b-jqnzjdgr8t] { --retail-mini-accent: var(--dashboard-gold, #af7a13); }
.retail-mini-kpi--slate[b-jqnzjdgr8t] { --retail-mini-accent: var(--dashboard-slate, #51616f); }
.retail-mini-kpi--darkred[b-jqnzjdgr8t] { --retail-mini-accent: var(--dashboard-darkred, #7f2c2c); }
.retail-mini-kpi--fuchsia[b-jqnzjdgr8t] { --retail-mini-accent: var(--dashboard-fuchsia, #8b3364); }

.dashboard-shell--classic .retail-mini-kpi[b-jqnzjdgr8t] {
    border: none;
    background: linear-gradient(160deg, color-mix(in srgb, var(--retail-mini-accent) 84%, white) 0%, var(--retail-mini-accent) 100%);
    box-shadow: none;
    color: #ffffff;
}

.dashboard-shell--classic .retail-mini-kpi__label[b-jqnzjdgr8t] {
    color: rgba(255, 255, 255, 0.82);
}

.dashboard-shell--classic .retail-mini-kpi__primary[b-jqnzjdgr8t],
.dashboard-shell--classic .retail-mini-kpi__secondary[b-jqnzjdgr8t] {
    color: #ffffff;
}

.dashboard-shell--retail-compact .retail-mini-kpi[b-jqnzjdgr8t],
.dashboard-shell--retail-compact .dashboard-retail :deep(.kpi-sales-panel1 .retail-mini-kpi)[b-jqnzjdgr8t] {
    gap: 0.28rem;
    padding: 0.58rem 0.68rem;
    border-radius: 12px;
}

.dashboard-shell--retail-compact .retail-mini-kpi__label[b-jqnzjdgr8t] {
    font-size: var(--retail-card-compact-label-size, 0.62rem);
}

.dashboard-shell--retail-compact .retail-mini-kpi__primary[b-jqnzjdgr8t] {
    font-size: var(--retail-card-compact-primary-size, 0.86rem);
}

.dashboard-shell--retail-compact .retail-mini-kpi__secondary[b-jqnzjdgr8t] {
    font-size: var(--retail-card-compact-secondary-size, 0.72rem);
}

/* ========================================================================
   COMPACT SINGLE CAROUSEL
   ======================================================================== */

/* ── Slide wrapper ── */

.r20-slide[b-jqnzjdgr8t] {
    height: 100%;
    width: 100%;
    max-width: 100%;
    padding: 0.3rem 2.2rem 1.4rem 2.2rem;
    overflow: hidden;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    gap: 0.4rem;
    min-width: 0;
}

/* ── Top section that takes remaining space above KPIs / season ── */

.r20-slide-split-top[b-jqnzjdgr8t] {
    flex: 1 1 0;
    min-height: 0;
    display: flex;
    gap: 0.4rem;
}

/* ── Panel card ── */

.r20-panel[b-jqnzjdgr8t] {
    display: flex;
    flex-direction: column;
    border-radius: 12px;
    overflow: hidden;
    border: 1px solid var(--dashboard-border, #d8dee8);
    background: var(--dashboard-panel, #ffffff);
    box-shadow: 0 4px 12px rgba(12, 23, 38, 0.06);
}

.r20-panel-header[b-jqnzjdgr8t] {
    padding: 0.3rem 0.6rem;
    background: linear-gradient(135deg, #0f3e73, #1a5aa0);
    color: #fff;
    min-height: 26px;
    display: flex;
    align-items: center;
}

.r20-panel-header .span-panel-title[b-jqnzjdgr8t],
.r20-panel-header .title[b-jqnzjdgr8t] {
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.04em;
}

.r20-panel-body[b-jqnzjdgr8t] {
    flex: 1 1 auto;
    min-height: 0;
    padding: 0.25rem;
    overflow: hidden;
}

/* ── KPI 5-col grid (bottom of slide 1) ── */

.r20-kpi-grid-5col[b-jqnzjdgr8t] {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 0.4rem;
    flex: 0 0 auto;
}

/* ── Monthly totals bar ── */

.r20-monthly-totals-bar[b-jqnzjdgr8t] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.6rem 1.2rem;
    padding: 0.35rem 0.75rem;
    background: linear-gradient(180deg, #f0f4fa, #e5ecf5);
    border-top: 1px solid var(--dashboard-border, #d8dee8);
    font-size: 0.72rem;
    font-weight: 600;
}

/* ── Store totals bar ── */

.r20-store-totals-bar[b-jqnzjdgr8t] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem 1.5rem;
    padding: 0.4rem 0.75rem;
    background: linear-gradient(180deg, #f7f9fc, #eef3f9);
    border-top: 1px solid var(--dashboard-border, #d8dee8);
    font-size: 0.72rem;
    font-weight: 600;
}

.retail-chart-panel[b-jqnzjdgr8t] {
    display: flex;
    flex-direction: column;
    height: 100%;
    min-height: 0;
}

.retail-chart-panel__host[b-jqnzjdgr8t] {
    flex: 1 1 auto;
    min-height: 0;
    overflow: hidden;
}

.retail-chart-panel__host :deep(.e-chart)[b-jqnzjdgr8t] {
    height: 100% !important;
}

.dashboard-chart-manual-legend[b-jqnzjdgr8t] {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 0.85rem 1.15rem;
    margin-top: 0.7rem;
}

.dashboard-chart-manual-legend--stacked[b-jqnzjdgr8t] {
    justify-content: flex-start;
}

.dashboard-chart-manual-legend__item[b-jqnzjdgr8t] {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    color: var(--dashboard-muted, #5b6776);
    font-size: 0.85rem;
    line-height: 1.2;
}

.dashboard-chart-manual-legend__swatch[b-jqnzjdgr8t] {
    width: 0.72rem;
    height: 0.72rem;
    border-radius: 999px;
    flex: 0 0 auto;
}

.retail-sales-performance__content--compact .dashboard-chart-manual-legend[b-jqnzjdgr8t] {
    gap: 0.45rem 0.75rem;
    margin-top: 0.45rem;
}

.retail-sales-performance__content--compact .dashboard-chart-manual-legend__item[b-jqnzjdgr8t] {
    font-size: 0.72rem;
}

.retail-sales-performance__content--compact .dashboard-chart-manual-legend__swatch[b-jqnzjdgr8t] {
    width: 0.58rem;
    height: 0.58rem;
}

.retail-sales-performance__content--compact .r20-slide[b-jqnzjdgr8t] {
    overflow-y: auto;
    overflow-x: hidden;
}

.retail-sales-performance__content--compact :deep(.r20-carousel)[b-jqnzjdgr8t],
.retail-sales-performance__content--compact :deep(.r20-carousel .e-carousel-items)[b-jqnzjdgr8t],
.retail-sales-performance__content--compact :deep(.r20-carousel .e-carousel-item)[b-jqnzjdgr8t],
.retail-sales-performance__content--compact :deep(.r20-carousel .e-carousel-item .e-blazor-template)[b-jqnzjdgr8t] {
    height: 100%;
}

.retail-sales-performance__content--compact[b-jqnzjdgr8t] {
    --retail-compact-carousel-card-min-height: 84px;
}

.retail-sales-performance__section--compact-summary[b-jqnzjdgr8t] {
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    min-height: 0;
}

.retail-sales-performance__summary-layout--compact-summary[b-jqnzjdgr8t] {
    flex: 1 1 auto;
    min-height: 0;
    grid-template-rows: minmax(0, 1fr) auto;
    align-content: start;
}

.retail-sales-performance__summary-layout--compact-summary > .retail-sales-card[b-jqnzjdgr8t],
.retail-sales-performance__summary-layout--compact-summary > .retail-sales-performance__kpi-stack[b-jqnzjdgr8t] {
    min-height: 0;
}

.retail-sales-performance__content--compact .retail-mini-kpi[b-jqnzjdgr8t],
.retail-sales-performance__content--compact .retail-store-summary-pill[b-jqnzjdgr8t] {
    height: auto;
    min-height: var(--retail-compact-carousel-card-min-height);
}

.retail-sales-performance__kpi-stack.retail-sales-performance__kpi-stack--compact-summary[b-jqnzjdgr8t] {
    grid-column: 1 / -1;
    grid-template-columns: repeat(10, minmax(0, 1fr));
    gap: 0.35rem;
    align-items: start;
}

.retail-sales-performance__kpi-stack.retail-sales-performance__kpi-stack--compact-summary .retail-mini-kpi[b-jqnzjdgr8t] {
    min-height: var(--retail-compact-carousel-card-min-height);
}

.retail-chart-panel :deep(.dashboard-chart-manual-legend)[b-jqnzjdgr8t] {
    flex: 0 0 auto;
}

:deep(.retail-store-summary-panel .e-panel-content)[b-jqnzjdgr8t] {
    height: 100%;
    min-height: 0;
    display: flex;
    flex-direction: column;
    padding: 0.35rem !important;
    overflow: hidden;
    box-sizing: border-box;
}

:deep(.retail-store-summary-panel .e-panel-content > .e-blazor-template)[b-jqnzjdgr8t] {
    flex: 1 1 auto;
    min-height: 0;
    display: flex;
    flex-direction: column;
}

.retail-store-summary-layout[b-jqnzjdgr8t] {
    flex: 1 1 auto;
    height: auto;
    min-height: 0;
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    overflow: visible;
}

.retail-store-summary-layout__grid[b-jqnzjdgr8t] {
    flex: 0 0 auto;
    min-height: 0;
    overflow: visible;
}

.retail-store-summary-layout__grid :deep(.e-grid)[b-jqnzjdgr8t] {
    height: auto !important;
}

.retail-sales-performance-section :deep(#Grid451.e-grid .e-gridcontent)[b-jqnzjdgr8t],
.retail-sales-performance-section :deep(#Grid451.e-grid .e-content)[b-jqnzjdgr8t],
.retail-store-summary-layout__grid :deep(.e-gridcontent)[b-jqnzjdgr8t],
.retail-store-summary-layout__grid :deep(.e-content)[b-jqnzjdgr8t] {
    min-height: 0;
    max-height: none !important;
    overflow-y: visible !important;
    scrollbar-gutter: stable;
}

.retail-store-summary-rail[b-jqnzjdgr8t] {
    flex: 0 0 auto;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
    gap: 0.35rem;
    margin-top: 0.35rem;
    padding-top: 0.4rem;
    border-top: 1px solid var(--dashboard-border, #d8dee8);
}

.retail-store-summary-pill[b-jqnzjdgr8t] {
    --retail-mini-accent: var(--dashboard-blue, #004b9b);
    min-height: var(--retail-compact-carousel-card-min-height);
    min-width: 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.45rem;
    padding: 0.42rem 0.6rem;
    border: 1px solid color-mix(in srgb, var(--retail-mini-accent) 22%, var(--dashboard-border, #d8dee8));
    border-radius: 12px;
    background:
        linear-gradient(180deg, color-mix(in srgb, var(--retail-mini-accent) 10%, white) 0%, color-mix(in srgb, var(--dashboard-panel, #ffffff) 97%, white) 100%);
    box-shadow: 0 3px 10px rgba(12, 23, 38, 0.06);
}

.retail-store-summary-pill__label[b-jqnzjdgr8t] {
    min-width: 0;
    color: color-mix(in srgb, var(--retail-mini-accent) 74%, var(--dashboard-ink, #1e293b));
    font-size: 0.62rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    line-height: 1.05;
    text-transform: uppercase;
}

.retail-store-summary-pill__value[b-jqnzjdgr8t] {
    flex: 0 0 auto;
    color: var(--dashboard-ink, #1e293b);
    font-size: 0.9rem;
    font-weight: 800;
    line-height: 1.05;
    text-align: right;
    white-space: nowrap;
    font-variant-numeric: tabular-nums;
}

/* ── Season grid (bottom of slide 3) ── */

.r20-grid-season[b-jqnzjdgr8t] {
    display: grid;
    grid-template-columns: minmax(0, 3fr) minmax(0, 5fr);
    gap: 0.45rem;
    flex: 0 0 35%;
    min-height: 0;
}

.r20-season-pie[b-jqnzjdgr8t],
.r20-season-trend[b-jqnzjdgr8t] {
    min-height: 0;
}

/* ========================================================================
   COMPACT FONT OVERRIDES
   ======================================================================== */

.r20-slide .span-panel-title[b-jqnzjdgr8t],
.r20-slide .title[b-jqnzjdgr8t] {
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.04em;
}

.r20-slide :deep(.e-grid .e-headercell)[b-jqnzjdgr8t],
.r20-slide :deep(.e-grid .e-rowcell)[b-jqnzjdgr8t] {
    padding: 0.18rem 0.3rem;
    font-size: 0.68rem;
}

.r20-slide :deep(.e-grid .e-headercelldiv)[b-jqnzjdgr8t] {
    font-size: 0.66rem;
    font-weight: 700;
}

.r20-slide :deep(.e-grid .e-rowcell span)[b-jqnzjdgr8t],
.r20-slide :deep(.e-grid .e-rowcell div)[b-jqnzjdgr8t] {
    font-size: 0.68rem;
}

.r20-slide :deep(svg text)[b-jqnzjdgr8t] {
    font-size: 9px;
}

.r20-slide :deep(.e-chart-title)[b-jqnzjdgr8t],
.r20-slide :deep(.e-chart .e-chart-title)[b-jqnzjdgr8t] {
    font-size: 11px !important;
}

.r20-slide .retail-mini-kpi[b-jqnzjdgr8t] {
    gap: 0.25rem;
    padding: 0.32rem 0.4rem;
    border-radius: 12px;
}

.r20-slide .retail-mini-kpi__label[b-jqnzjdgr8t] {
    font-size: 0.6rem;
    letter-spacing: 0.05em;
}

.r20-slide .retail-mini-kpi__primary[b-jqnzjdgr8t] {
    font-size: 0.82rem;
    font-weight: 800;
}

.r20-slide .retail-mini-kpi__secondary[b-jqnzjdgr8t] {
    font-size: 0.7rem;
}

@media (max-width: 1400px) {
    .retail-sales-performance__summary-layout[b-jqnzjdgr8t],
    .retail-sales-performance__season-layout[b-jqnzjdgr8t] {
        grid-template-columns: 1fr;
    }

    .retail-sales-performance__kpi-stack[b-jqnzjdgr8t] {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 768px) {
    .retail-sales-performance__section[b-jqnzjdgr8t] {
        padding: 0.5rem;
    }

    .retail-sales-card[b-jqnzjdgr8t] {
        border-radius: 12px;
    }

    .retail-sales-card--grid[b-jqnzjdgr8t],
    .retail-sales-card--chart[b-jqnzjdgr8t],
    .retail-sales-card--store-summary[b-jqnzjdgr8t] {
        padding: 0.5rem;
    }

    .retail-sales-performance__kpi-stack[b-jqnzjdgr8t] {
        grid-template-columns: 1fr;
    }

    .retail-sales-performance__kpi-stack .retail-mini-kpi[b-jqnzjdgr8t] {
        min-height: 0;
        border-radius: 12px;
    }

    .retail-sales-card__chart-host--trend[b-jqnzjdgr8t],
    .retail-sales-card__chart-host--store[b-jqnzjdgr8t],
    .retail-sales-card__chart-host--season-trend[b-jqnzjdgr8t],
    .retail-sales-card__chart-host--season-pie[b-jqnzjdgr8t] {
        height: 280px;
    }
}
/* /Components/Pages/DSHB_Retail_30.razor.rz.scp.css */
.retail-product[b-smbcwgq5je] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    width: 100%;
    max-width: 100%;
    overflow: hidden;
    min-width: 0;
}

.retail-product__loading[b-smbcwgq5je] {
    margin-bottom: 0.75rem;
}

/* ── Slide wrapper ── */

.r20-slide[b-smbcwgq5je] {
    height: 100%;
    width: 100%;
    max-width: 100%;
    padding: 0.3rem 2.2rem 1.4rem 2.2rem;
    overflow: hidden;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    gap: 0.4rem;
    min-width: 0;
}

.retail-product__section[b-smbcwgq5je] {
    padding: 0.75rem;
}

.retail-product__summary-stack[b-smbcwgq5je] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.retail-product__summary-layout[b-smbcwgq5je] {
    display: grid;
    grid-template-columns: minmax(280px, 1fr) minmax(360px, 1.3fr);
    gap: 1rem;
    align-items: stretch;
}

.retail-product__summary-layout--stacked[b-smbcwgq5je] {
    grid-template-columns: 1fr;
}

.retail-product__category-layout[b-smbcwgq5je] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
    align-items: stretch;
}

.retail-product__chart-with-kpis[b-smbcwgq5je] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    min-height: 0;
}

.retail-product__chart-grid[b-smbcwgq5je] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
    align-items: stretch;
}

.retail-product__chart-grid > .retail-product__card--chart[b-smbcwgq5je] {
    min-height: 0;
}

.retail-product__chart-with-kpis > .retail-product__card--chart[b-smbcwgq5je] {
    flex: 1;
    min-height: 0;
}

.retail-product__kpi-stack[b-smbcwgq5je] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.5rem;
}

.retail-product__card[b-smbcwgq5je],
.retail-product__kpi-card[b-smbcwgq5je] {
    min-width: 0;
    border: 1px solid var(--dashboard-border, #d8dee8);
    border-radius: 16px;
    background: color-mix(in srgb, var(--dashboard-panel, #ffffff) 90%, var(--dashboard-amber, #c57f17) 10%);
    box-shadow: var(--dashboard-card-shadow, 0 10px 24px rgba(12, 23, 38, 0.06));
}

.retail-product__card[b-smbcwgq5je] {
    padding: 0.75rem;
    display: flex;
    flex-direction: column;
}

.retail-product__card--grid[b-smbcwgq5je],
.retail-product__card--bubble[b-smbcwgq5je] {
    overflow: hidden;
    min-height: 0;
}

.retail-product__chart[b-smbcwgq5je] {
    display: flex;
    flex-direction: column;
    height: 100%;
    min-width: 0;
    flex: 1;
    min-height: 0;
    overflow: hidden;
}

.retail-product__chart :deep(.e-chart)[b-smbcwgq5je],
.retail-product__chart :deep(.e-accumulationchart)[b-smbcwgq5je] {
    height: 100% !important;
}

.retail-product__kpi-card[b-smbcwgq5je] {
    padding: 0.9rem 1rem;
}

.retail-product__kpi-body[b-smbcwgq5je] {
    display: flex;
    align-items: center;
    gap: 0.85rem;
    margin-top: 0.55rem;
}

.retail-product__kpi-body > div[b-smbcwgq5je] {
    min-width: 0;
    flex: 1;
}

.retail-product__section--bubble[b-smbcwgq5je] {
    padding: 0.75rem;
}

:deep(.retail-product__card .e-grid)[b-smbcwgq5je],
:deep(.retail-product__card .e-chart)[b-smbcwgq5je],
:deep(.retail-product__card .e-accumulationchart)[b-smbcwgq5je] {
    width: 100%;
}

:deep(.retail-product__card .e-grid)[b-smbcwgq5je] {
    border: none;
}

.dashboard-shell--retail-compact .retail-product[b-smbcwgq5je] {
    gap: 0.75rem;
}

.dashboard-shell--retail-compact .retail-product__section[b-smbcwgq5je],
.dashboard-shell--retail-compact .retail-product__section--bubble[b-smbcwgq5je] {
    padding: 0.45rem;
}

.dashboard-shell--retail-compact .retail-product__summary-layout[b-smbcwgq5je],
.dashboard-shell--retail-compact .retail-product__category-layout[b-smbcwgq5je] {
    gap: 0.35rem;
}

.dashboard-shell--retail-compact .retail-product__kpi-stack[b-smbcwgq5je] {
    gap: 0.35rem;
}

.dashboard-shell--retail-compact .retail-product__card[b-smbcwgq5je],
.dashboard-shell--retail-compact .retail-product__kpi-card[b-smbcwgq5je] {
    border-radius: 10px;
}

.dashboard-shell--retail-compact .retail-product__card[b-smbcwgq5je] {
    padding: 0.35rem;
}

.dashboard-shell--retail-compact .retail-product__card--chart[b-smbcwgq5je] {
    min-height: 0;
}

.dashboard-shell--retail-compact .retail-product__kpi-card[b-smbcwgq5je] {
    padding: 0.5rem 0.55rem;
}

.dashboard-shell--retail-compact .retail-product__kpi-body[b-smbcwgq5je] {
    gap: 0.45rem;
    margin-top: 0.25rem;
}

.dashboard-shell--retail-compact :deep(.retail-product__card .e-chart svg text)[b-smbcwgq5je],
.dashboard-shell--retail-compact :deep(.retail-product__card .e-accumulationchart svg text)[b-smbcwgq5je] {
    font-size: 8.5px;
}

.dashboard-shell--retail-compact :deep(.retail-product__card .e-grid .e-headercell)[b-smbcwgq5je],
.dashboard-shell--retail-compact :deep(.retail-product__card .e-grid .e-rowcell)[b-smbcwgq5je],
.dashboard-shell--retail-compact :deep(.retail-product__card .e-grid .e-pager)[b-smbcwgq5je],
.dashboard-shell--retail-compact :deep(.retail-product__card .e-grid .e-pager *)[b-smbcwgq5je] {
    font-size: 0.68rem;
}

.dashboard-shell--retail-compact :deep(.retail-product__card .e-grid .e-headercell)[b-smbcwgq5je],
.dashboard-shell--retail-compact :deep(.retail-product__card .e-grid .e-rowcell)[b-smbcwgq5je] {
    padding: 0.2rem 0.32rem;
}

@media (max-width: 1400px) {
    .retail-product__summary-layout[b-smbcwgq5je] {
        grid-template-columns: 1fr;
    }

    .retail-product__chart-grid[b-smbcwgq5je] {
        grid-template-columns: 1fr;
    }

    .retail-product__kpi-stack[b-smbcwgq5je] {
        grid-column: 1 / -1;
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 1100px) {
    .retail-product__category-layout[b-smbcwgq5je],
    .retail-product__summary-layout[b-smbcwgq5je],
    .retail-product__kpi-stack[b-smbcwgq5je] {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 768px) {
    .retail-product__section[b-smbcwgq5je],
    .retail-product__section--bubble[b-smbcwgq5je] {
        padding: 0.5rem;
    }

    .retail-product__card[b-smbcwgq5je],
    .retail-product__kpi-card[b-smbcwgq5je] {
        border-radius: 12px;
    }
}
/* /Components/Pages/Index.razor.rz.scp.css */
/* ── Landing page: unified palette ──
   Sidebar = #07519C, toolbar = #07519C
   We anchor the gradient to the same blue family
   and use a warm copper-orange (#e05a33) instead of
   pure red so the accent feels intentional, not jarring.
*/

.morse-landing[b-86abc015gp] {
    display: flex;
    align-items: center;
    justify-content: center;
    height: calc(100vh - 75px);
    overflow: hidden;
    background:
        radial-gradient(ellipse 90% 60% at 50% 20%, rgba(7, 81, 156, 0.35) 0%, transparent 70%),
        radial-gradient(ellipse 70% 50% at 80% 80%, rgba(10, 40, 80, 0.30) 0%, transparent 60%),
        linear-gradient(168deg, #062d5a 0%, #073f7a 30%, #07519C 65%, #0960b0 100%);
    padding: 2rem;
    overflow: hidden;
    position: relative;
}

/* Soft warm bloom – top-right */
.morse-landing[b-86abc015gp]::before {
    content: '';
    position: absolute;
    top: -15%;
    right: -10%;
    width: 550px;
    height: 550px;
    background: radial-gradient(circle, rgba(224, 90, 51, 0.07) 0%, transparent 65%);
    pointer-events: none;
}

/* Cool bloom – bottom-left, ties to sidebar */
.morse-landing[b-86abc015gp]::after {
    content: '';
    position: absolute;
    bottom: -15%;
    left: -8%;
    width: 480px;
    height: 480px;
    background: radial-gradient(circle, rgba(7, 81, 156, 0.20) 0%, transparent 65%);
    pointer-events: none;
}

.morse-landing-inner[b-86abc015gp] {
    position: relative;
    z-index: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 2rem;
    max-width: 560px;
    width: 100%;
    animation: morse-fade-in-b-86abc015gp 0.7s ease-out;
}

@keyframes morse-fade-in-b-86abc015gp {
    from { opacity: 0; transform: translateY(14px); }
    to   { opacity: 1; transform: translateY(0); }
}

/* ── Logo ── */
.morse-landing-logo[b-86abc015gp] {
    display: flex;
    justify-content: center;
}

.morse-landing-logo img[b-86abc015gp] {
    width: 300px;
    height: auto;
    filter: drop-shadow(0 2px 18px rgba(224, 90, 51, 0.12));
}

/* ── Dividers ── */
.morse-landing-divider[b-86abc015gp] {
    width: 60px;
    height: 2px;
    background: linear-gradient(90deg,
        transparent,
        rgba(255, 255, 255, 0.25),
        rgba(224, 90, 51, 0.45),
        rgba(255, 255, 255, 0.25),
        transparent);
    border-radius: 1px;
}

/* ── Acronym rows ── */
.morse-landing-acronym[b-86abc015gp] {
    display: flex;
    flex-direction: column;
    gap: 0.6rem;
    width: 100%;
}

.morse-landing-acronym-row[b-86abc015gp] {
    display: flex;
    align-items: center;
    gap: 0.85rem;
    padding: 0.6rem 1.25rem;
    border-radius: 8px;
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid rgba(255, 255, 255, 0.07);
    backdrop-filter: blur(4px);
    transition: background 0.3s ease, border-color 0.3s ease, box-shadow 0.3s ease;
}

.morse-landing-acronym-row:hover[b-86abc015gp] {
    background: rgba(255, 255, 255, 0.09);
    border-color: rgba(224, 90, 51, 0.30);
    box-shadow: 0 2px 12px rgba(224, 90, 51, 0.08);
}

.morse-landing-letter[b-86abc015gp] {
    font-size: 1.55rem;
    font-weight: 700;
    color: #e05a33;
    min-width: 30px;
    text-align: center;
    line-height: 1;
}

.morse-landing-dash[b-86abc015gp] {
    color: rgba(255, 255, 255, 0.18);
    font-size: 1rem;
}

.morse-landing-meaning[b-86abc015gp] {
    font-size: 1rem;
    font-weight: 400;
    color: rgba(255, 255, 255, 0.82);
    letter-spacing: 0.25px;
}

/* ── ART badge ── */
.morse-landing-art[b-86abc015gp] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.65rem;
}

.morse-landing-art-badge[b-86abc015gp] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 1rem;
    font-weight: 700;
    letter-spacing: 3px;
    color: #fff;
    background: linear-gradient(135deg, #e05a33 0%, #c44a28 100%);
    padding: 0.4rem 1.5rem;
    border-radius: 20px;
    box-shadow: 0 3px 14px rgba(224, 90, 51, 0.28);
}

.morse-landing-art-items[b-86abc015gp] {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    font-size: 0.85rem;
    font-weight: 400;
    color: rgba(255, 255, 255, 0.55);
    letter-spacing: 0.4px;
}

.morse-landing-art-dot[b-86abc015gp] {
    width: 4px;
    height: 4px;
    border-radius: 50%;
    background: rgba(224, 90, 51, 0.45);
    flex-shrink: 0;
}

/* ── Responsive ── */
@media (max-width: 600px) {
    .morse-landing-logo img[b-86abc015gp] {
        width: 210px;
    }

    .morse-landing-letter[b-86abc015gp] {
        font-size: 1.3rem;
    }

    .morse-landing-meaning[b-86abc015gp] {
        font-size: 0.88rem;
    }

    .morse-landing-acronym-row[b-86abc015gp] {
        padding: 0.45rem 0.9rem;
    }

    .morse-landing-art-items[b-86abc015gp] {
        flex-wrap: wrap;
        justify-content: center;
    }
}
/* /Components/Pages/KpiRatioIndicator.razor.rz.scp.css */
.kpi-ratio-indicator[b-hde3xjgo5i] {
    display: inline-flex;
    align-items: center;
    justify-content: flex-end;
    gap: 0.2rem;
    font-weight: 700;
    white-space: nowrap;
}

.kpi-ratio-indicator--positive[b-hde3xjgo5i] {
    color: #008a00;
}

.kpi-ratio-indicator--negative[b-hde3xjgo5i] {
    color: #ff1010;
}
/* /Components/Shared/VersionDisplay.razor.rz.scp.css */
.version-display[b-j6jv56fu7e] {
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}

.version-info-full[b-j6jv56fu7e] {
    padding: 0.5rem;
}

.version-line[b-j6jv56fu7e] {
    margin-bottom: 0.25rem;
    color: var(--rz-text-color, #333);
}

.version-line:last-child[b-j6jv56fu7e] {
    margin-bottom: 0;
}

.version-line small[b-j6jv56fu7e] {
    font-size: 0.875rem;
    color: var(--rz-text-secondary-color, #666);
}

.version-info-compact[b-j6jv56fu7e] {
    font-size: 0.875rem;
    color: var(--rz-text-secondary-color, #666);
}

/* Footer version styling */
.version-display.footer-version[b-j6jv56fu7e] {
    text-align: center;
    padding: 1rem;
    border-top: 1px solid var(--rz-border-color, #ddd);
    margin-top: auto;
}

/* Sidebar version styling */
.version-display.sidebar-version[b-j6jv56fu7e] {
    padding: 0.5rem 1rem;
    font-size: 0.75rem;
    color: var(--rz-text-tertiary-color, #999);
    border-top: 1px solid var(--rz-border-color, #ddd);
}

/* About dialog version styling */
.version-display.about-version[b-j6jv56fu7e] {
    text-align: center;
    padding: 1.5rem;
}