/* /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;
}

/* 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;
}

/* 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/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-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;
    }
}
/* /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/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-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: wrap;
    justify-content: flex-start;
    align-items: flex-end;
    gap: 0.72rem;
    width: 100%;
    max-width: 100%;
    overflow: hidden;
}

.retail-filter-field[b-08lz729g5b] {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    flex: 0 1 340px;
    gap: 0.42rem;
    min-width: 0;
    width: min(100%, 340px);
}

.retail-filter-field--period[b-08lz729g5b] {
    flex-basis: 400px;
    width: min(100%, 400px);
}

.retail-filter-field--year[b-08lz729g5b] {
    flex-basis: 150px;
    width: min(100%, 150px);
}

.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 > :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] {
        flex-basis: auto;
        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-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/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;
}