/* _content/MES.Shared/Components/BroadcastEditDialog.razor.rz.scp.css */
/* BroadcastEditDialog — tên file đã chọn để upload. */
.bc-picked[b-iiwirjra3v] {
    display: inline-block;
    font-size: .8rem;
    opacity: .7;
    padding: 0 0 .5rem;
}
/* _content/MES.Shared/Components/ModulePlaceholder.razor.rz.scp.css */
.module-placeholder[b-vcplx8lg13] {
    max-width: 560px;
    margin: 2rem auto;
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.6rem;
}

.module-placeholder-glyph[b-vcplx8lg13] {
    font-size: 3.5rem;
    line-height: 1;
}
/* _content/MES.Shared/Components/OperationNode.razor.rz.scp.css */
.op-node[b-o8qoq0dm16] {
    position: relative;
}

/* Port của ZBD do PortRenderer render (không mang scope) nên cần ::deep. */
.op-node[b-o8qoq0dm16]  .diagram-port {
    width: 16px;
    height: 16px;
    margin: -8px;
    border-radius: 50%;
    background-color: #fff;
    border: 2px solid #d32f2f;
    cursor: pointer;
    position: absolute;
    z-index: 2;
}

.op-node[b-o8qoq0dm16]  .diagram-port.left {
    left: 0;
    top: 50%;
}

.op-node[b-o8qoq0dm16]  .diagram-port.right {
    right: 0;
    top: 50%;
}

.op-node[b-o8qoq0dm16]  .diagram-port.has-links {
    background-color: #d32f2f;
}

.op-node-card[b-o8qoq0dm16] {
    width: 240px;
    padding: 0.6rem 0.75rem;
}

.op-node-body[b-o8qoq0dm16] {
    display: flex;
    gap: 0.6rem;
    align-items: flex-start;
}

.op-node-info[b-o8qoq0dm16] {
    flex: 1 1 auto;
    min-width: 0;
}

.op-node-img[b-o8qoq0dm16] {
    display: block;
    width: 80px;
    height: 120px;
    object-fit: cover;
    border-radius: 0.35rem;
    flex-shrink: 0;
    background-color: #f7f3f3;
}

.op-node-title[b-o8qoq0dm16] {
    font-weight: 700;
    font-size: 1.05rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.op-node-sub[b-o8qoq0dm16] {
    font-size: 0.85rem;
    font-weight: 500;
    opacity: 0.85;
    margin-bottom: 0.4rem;
}

.op-node-mats[b-o8qoq0dm16] {
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
    font-size: 0.88rem;
}

.op-node-mat[b-o8qoq0dm16] {
    display: flex;
    justify-content: space-between;
    gap: 0.5rem;
}

.op-node-empty[b-o8qoq0dm16] {
    opacity: 0.5;
}
/* _content/MES.Shared/Components/RoutingDiagram.razor.rz.scp.css */
.routing-canvas[b-iiz051zpp1] {
    width: 100%;
    height: 520px;
    border: 1px solid var(--rz-border-color);
    border-radius: var(--rz-border-radius);
}

/* Line đỏ chạy liên tục nối các node theo thứ tự (marching ants).
   ::deep bắt buộc vì <path> do ZBD render (không mang scope attribute). */
.routing-canvas[b-iiz051zpp1]  .diagram-link path {
    stroke: #d32f2f !important;
    stroke-width: 3px;
    fill: none;
    stroke-dasharray: 12 8;
    animation: mes-flow-line-b-iiz051zpp1 0.8s linear infinite;
}

@keyframes mes-flow-line-b-iiz051zpp1 {
    to {
        stroke-dashoffset: -20;
    }
}

/* Style cho sequence number trên node */
.op-node-header[b-iiz051zpp1] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 0.25rem;
}

.op-node-seq[b-iiz051zpp1] {
    background: #d32f2f;
    color: white;
    font-weight: 600;
    font-size: 0.75rem;
    padding: 0.125rem 0.5rem;
    border-radius: 0.25rem;
    white-space: nowrap;
    flex-shrink: 0;
}

.op-node-title[b-iiz051zpp1] {
    font-weight: 600;
    font-size: 0.9rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.op-node-sub[b-iiz051zpp1] {
    font-size: 0.75rem;
    opacity: 0.7;
    margin-bottom: 0.25rem;
}

.op-node-mats[b-iiz051zpp1] {
    display: flex;
    flex-direction: column;
    gap: 0.125rem;
    font-size: 0.75rem;
}

.op-node-mat[b-iiz051zpp1] {
    display: flex;
    justify-content: space-between;
    gap: 0.5rem;
}

.op-node-empty[b-iiz051zpp1] {
    opacity: 0.5;
    font-style: italic;
}

.op-node-mat b[b-iiz051zpp1] {
    font-weight: 600;
}
/* _content/MES.Shared/Layout/AccountMenu.razor.rz.scp.css */
.lg-avatar-btn[b-gllm1pcn9s] {
    border: none;
    background: transparent;
    padding: 2px;
    border-radius: 50%;
    cursor: pointer;
}

.lg-avatar-btn:hover .lg-avatar[b-gllm1pcn9s] {
    box-shadow: 0 0 0 2px var(--lg-accent, #007AFF);
}

.lg-companychip[b-gllm1pcn9s] {
    font-size: 13px;
    font-weight: 600;
    opacity: .75;
    white-space: nowrap;
    max-width: 180px;
    overflow: hidden;
    text-overflow: ellipsis;
}

.account-head[b-gllm1pcn9s] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 4px 2px 10px;
    margin-bottom: 8px;
    border-bottom: 1px solid rgba(120, 120, 128, .2);
}

.appmenu-pop .culture-switcher[b-gllm1pcn9s] {
    width: 100%;
    margin: 4px 0 8px;
}

.appmenu-pop .appmenu-row[b-gllm1pcn9s] {
    margin-top: 8px;
}
/* _content/MES.Shared/Layout/BroadcastLayout.razor.rz.scp.css */
/* Broadcast Layout — responsive mobile-first */

/* Base: desktop sidebar fixed 250px */
.bc-side[b-0k6c5whgyj] {
    width: 250px;
    flex: 0 0 250px;
    min-height: 100dvh;
    display: flex;
    flex-direction: column;
    gap: 0;
    padding: 0;
    background: transparent;
    border: none;
    box-shadow: none;
}

/* Toolbar inside Manufacturing layout matches main toolbar */
.lg-window .bc-side ~ .lg-main .lg-toolbar[b-0k6c5whgyj] {
    background: rgba(255, 255, 255, 0.75);
    -webkit-backdrop-filter: blur(28px) saturate(1.8);
    backdrop-filter: blur(28px) saturate(1.8);
    border: 3px solid rgba(255, 255, 255, .85);
    box-shadow: 0 12px 40px rgba(20, 40, 90, .12), inset 0 1px 0 rgba(255, 255, 255, .6);
}
html[data-theme="dark"] .lg-window .bc-side ~ .lg-main .lg-toolbar[b-0k6c5whgyj] {
    background: rgba(36, 36, 40, var(--lg-a));
    border-color: rgba(255, 255, 255, .5);
    box-shadow: 0 12px 40px rgba(0, 0, 0, .45), inset 0 1px 0 rgba(255, 255, 255, .08);
}

/* ===== RESPONSIVE BREAKPOINTS ===== */

/* Tablet (768px - 1024px): sidebar thu hẹp */
@media (max-width: 1024px) {
    .bc-side[b-0k6c5whgyj] {
        width: 200px;
        flex: 0 0 200px;
    }

    .bc-side .lg-brand span:last-child[b-0k6c5whgyj] {
        display: none;
    }
    .bc-side .lg-appicon[b-0k6c5whgyj] {
        width: 28px;
        height: 28px;
        font-size: 16px;
    }
}

/* Mobile (< 768px): sidebar thành thanh nav ngang cuộn ngang */
@media (max-width: 767px) {
    .lg-window[b-0k6c5whgyj] {
        flex-direction: column;
        height: auto;
        min-height: 100dvh;
    }

    .bc-side[b-0k6c5whgyj] {
        width: 100%;
        flex: 0 0 auto;
        min-height: auto;
        max-height: 60dvh;
        border-radius: 0;
        border: none;
        border-bottom: 1px solid rgba(120, 120, 128, .15);
        background: rgba(255, 255, 255, 0.75);
        -webkit-backdrop-filter: blur(28px) saturate(1.6);
        backdrop-filter: blur(28px) saturate(1.6);
        box-shadow: 0 4px 20px rgba(20, 40, 90, .1);
        z-index: 100;
    }
    html[data-theme="dark"] .bc-side[b-0k6c5whgyj] {
        background: rgba(36, 36, 40, var(--lg-a));
        box-shadow: 0 4px 20px rgba(0, 0, 0, .3);
    }

    .bc-side .lg-brand[b-0k6c5whgyj] {
        display: none;
    }

    .bc-nav-vertical[b-0k6c5whgyj] {
        padding: 8px 0 !important;
    }

    .bc-nav-vertical .lg-nav[b-0k6c5whgyj] {
        flex-direction: row;
        flex-wrap: wrap;
        justify-content: center;
        gap: 4px;
    }

    .bc-nav-vertical .lg-link[b-0k6c5whgyj] {
        width: auto;
        flex: 0 0 auto;
        padding: 8px 12px;
        white-space: nowrap;
        font-size: 13px;
    }

    .bc-sidefoot[b-0k6c5whgyj] {
        display: none;
    }

    /* Main content padding on mobile */
    .lg-main[b-0k6c5whgyj] {
        padding: 8px;
    }

    .lg-toolbar[b-0k6c5whgyj] {
        padding: 8px 12px;
        gap: 8px;
        border-radius: 0;
        border: none;
        border-bottom: 1px solid rgba(120, 120, 128, .15);
    }

    .lg-content[b-0k6c5whgyj] {
        padding: 8px;
    }
}

/* Small mobile (< 480px) */
@media (max-width: 479px) {
    .bc-nav-vertical .lg-link[b-0k6c5whgyj] {
        padding: 6px 10px;
        font-size: 12px;
    }

    .lg-toolbar[b-0k6c5whgyj] {
        flex-wrap: wrap;
    }

    .lg-toolbar > *[b-0k6c5whgyj] {
        flex: 1 1 auto;
        min-width: 0;
    }

    /* CultureSwitcher, AppMenu... compact */
    .culture-switcher[b-0k6c5whgyj] {
        min-width: 120px;
    }
}

/* ===== PRINT ===== */
@media print {
    .bc-side[b-0k6c5whgyj],
    .lg-toolbar[b-0k6c5whgyj] {
        display: none;
    }

    .lg-main[b-0k6c5whgyj] {
        width: 100%;
        min-width: 0;
    }
}
/* _content/MES.Shared/Layout/BroadcastNavMenu.razor.rz.scp.css */
/* BroadcastNavMenu — responsive */

/* Base: vertical mode (sidebar) - card style */
.bc-nav.bc-nav-vertical[b-fal97rfyk3] {
    background: transparent;
    border: none;
    box-shadow: none;
    padding: 12px 8px;
    margin-bottom: 0;
}

.bc-nav.bc-nav-vertical .lg-nav[b-fal97rfyk3] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    width: 100%;
    background: transparent;
    border: none;
    padding: 0;
}

.bc-nav-vertical .lg-link[b-fal97rfyk3] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 12px;
    border-radius: 10px;
    color: inherit;
    text-decoration: none;
    font-size: 14px;
    font-weight: 500;
    font-family: inherit;
    background: transparent;
    border: none;
    cursor: pointer;
    width: 100%;
    text-align: left;
    transition: background .12s ease, color .12s ease;
}

.bc-nav-vertical .lg-link:hover[b-fal97rfyk3] {
    background: rgba(120, 120, 128, .16);
    color: inherit;
    text-decoration: none;
}

.bc-nav-vertical .lg-link.lg-active[b-fal97rfyk3] {
    background: var(--lg-accent, #007AFF);
    color: #fff;
    box-shadow: 0 3px 10px rgba(0, 122, 255, .35);
}

.bc-nav-vertical .lg-link.lg-active:hover[b-fal97rfyk3] {
    background: var(--lg-accent-hover, #0A84FF);
    color: #fff;
}

.bc-nav-vertical .lg-link:focus-visible[b-fal97rfyk3] {
    outline: 2px solid var(--lg-accent, #007AFF);
    outline-offset: 1px;
}

/* Gỡ pill active mặc định của FluentNavItem */
.bc-nav-vertical .fluent-navitem.active[b-fal97rfyk3]::after {
    content: none;
}

/* Glyph styling */
.bc-nav-vertical .lg-glyph[b-fal97rfyk3] {
    width: 28px;
    height: 28px;
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: flex-start;
    font-size: 15px;
    border-radius: 7px;
    color: #fff;
    text-shadow: 0 1px 2px rgba(0,0,0,.25);
}

/* ===== HORIZONTAL MODE (dashboard card) ===== */
.bc-nav:not(.bc-nav-vertical)[b-fal97rfyk3] {
    background: rgba(255, 255, 255, 0.75);
    -webkit-backdrop-filter: blur(28px) saturate(1.6);
    backdrop-filter: blur(28px) saturate(1.6);
    border: 3px solid rgba(255, 255, 255, .85);
    box-shadow: 0 8px 28px rgba(20, 40, 90, .1), inset 0 1px 0 rgba(255, 255, 255, .55);
    border-radius: 16px;
    padding: 12px 16px;
    margin-bottom: 16px;
}

html[data-theme="dark"] .bc-nav:not(.bc-nav-vertical)[b-fal97rfyk3] {
    background: rgba(30, 30, 34, 0.85);
    border-color: rgba(255, 255, 255, .5);
    box-shadow: 0 8px 28px rgba(0, 0, 0, .4), inset 0 1px 0 rgba(255, 255, 255, .07);
}

.bc-nav:not(.bc-nav-vertical) .lg-nav[b-fal97rfyk3] {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    gap: 4px;
    width: 100%;
    background: transparent;
    border: none;
    padding: 0;
}

.bc-nav:not(.bc-nav-vertical) .lg-link[b-fal97rfyk3] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 7px 12px;
    border-radius: 10px;
    color: inherit;
    text-decoration: none;
    font-size: 14px;
    font-weight: 500;
    font-family: inherit;
    background: transparent;
    border: none;
    cursor: pointer;
    transition: background .12s ease, color .12s ease;
}

.bc-nav:not(.bc-nav-vertical) .lg-link:hover[b-fal97rfyk3] {
    background: rgba(120, 120, 128, .16);
    color: inherit;
    text-decoration: none;
}

.bc-nav:not(.bc-nav-vertical) .lg-link.lg-active[b-fal97rfyk3] {
    background: var(--lg-accent, #007AFF);
    color: #fff;
    box-shadow: 0 3px 10px rgba(0, 122, 255, .35);
}

.bc-nav:not(.bc-nav-vertical) .lg-link.lg-active:hover[b-fal97rfyk3] {
    background: var(--lg-accent-hover, #0A84FF);
    color: #fff;
}

.bc-nav:not(.bc-nav-vertical) .lg-link:focus-visible[b-fal97rfyk3] {
    outline: 2px solid var(--lg-accent, #007AFF);
    outline-offset: 1px;
}

.bc-nav:not(.bc-nav-vertical) .fluent-navitem.active[b-fal97rfyk3]::after {
    content: none;
}

/* ===== RESPONSIVE ===== */

/* Tablet: horizontal nav wrap */
@media (max-width: 1024px) {
    .bc-nav:not(.bc-nav-vertical)[b-fal97rfyk3] {
        padding: 10px 12px;
    }

    .bc-nav:not(.bc-nav-vertical) .lg-link[b-fal97rfyk3] {
        padding: 6px 10px;
        font-size: 13px;
    }
}

/* Mobile: horizontal mode becomes scrollable */
@media (max-width: 767px) {
    .bc-nav:not(.bc-nav-vertical)[b-fal97rfyk3] {
        padding: 8px;
        border-radius: 12px;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
    }

    .bc-nav:not(.bc-nav-vertical)[b-fal97rfyk3]::-webkit-scrollbar {
        display: none;
    }

    .bc-nav:not(.bc-nav-vertical) .lg-nav[b-fal97rfyk3] {
        flex-wrap: nowrap;
        min-width: max-content;
        padding-bottom: 4px; /* space for scroll hint */
    }

    .bc-nav:not(.bc-nav-vertical) .lg-link[b-fal97rfyk3] {
        flex: 0 0 auto;
        white-space: nowrap;
        padding: 8px 12px;
        font-size: 13px;
        border-radius: 8px;
    }
}

/* Small mobile */
@media (max-width: 479px) {
    .bc-nav:not(.bc-nav-vertical) .lg-link[b-fal97rfyk3] {
        padding: 6px 10px;
        font-size: 12px;
    }

    .bc-nav:not(.bc-nav-vertical) .lg-glyph[b-fal97rfyk3] {
        width: 24px;
        height: 24px;
        font-size: 13px;
    }
}

/* Print: hide nav */
@media print {
    .bc-nav[b-fal97rfyk3] {
        display: none;
    }
}
/* _content/MES.Shared/Layout/CrmLayout.razor.rz.scp.css */
/* CRM Layout — responsive mobile-first */

/* Base: desktop sidebar fixed 250px */
.crm-side[b-p4qkkxw9v7] {
    width: 250px;
    flex: 0 0 250px;
    min-height: 100dvh;
    display: flex;
    flex-direction: column;
    gap: 0;
    padding: 0;
    background: transparent;
    border: none;
    box-shadow: none;
}

/* Toolbar inside CRM layout matches main toolbar */
.lg-window .crm-side ~ .lg-main .lg-toolbar[b-p4qkkxw9v7] {
    background: rgba(255, 255, 255, 0.75);
    -webkit-backdrop-filter: blur(28px) saturate(1.8);
    backdrop-filter: blur(28px) saturate(1.8);
    border: 3px solid rgba(255, 255, 255, .85);
    box-shadow: 0 12px 40px rgba(20, 40, 90, .12), inset 0 1px 0 rgba(255, 255, 255, .6);
}
html[data-theme="dark"] .lg-window .crm-side ~ .lg-main .lg-toolbar[b-p4qkkxw9v7] {
    background: rgba(36, 36, 40, var(--lg-a));
    border-color: rgba(255, 255, 255, .5);
    box-shadow: 0 12px 40px rgba(0, 0, 0, .45), inset 0 1px 0 rgba(255, 255, 255, .08);
}

/* ===== RESPONSIVE BREAKPOINTS ===== */

/* Tablet (768px - 1024px): sidebar thu hẹp */
@media (max-width: 1024px) {
    .crm-side[b-p4qkkxw9v7] {
        width: 200px;
        flex: 0 0 200px;
    }
    
    .crm-side .lg-brand span:last-child[b-p4qkkxw9v7] {
        display: none;
    }
    .crm-side .lg-appicon[b-p4qkkxw9v7] {
        width: 28px;
        height: 28px;
        font-size: 16px;
    }
}

/* Mobile (< 768px): sidebar ẩn, dùng bottom sheet hoặc drawer */
@media (max-width: 767px) {
    .lg-window[b-p4qkkxw9v7] {
        flex-direction: column;
        height: auto;
        min-height: 100dvh;
    }
    
    .crm-side[b-p4qkkxw9v7] {
        width: 100%;
        flex: 0 0 auto;
        min-height: auto;
        max-height: 60dvh;
        border-radius: 0;
        border: none;
        border-bottom: 1px solid rgba(120, 120, 128, .15);
        background: rgba(255, 255, 255, 0.75);
        -webkit-backdrop-filter: blur(28px) saturate(1.6);
        backdrop-filter: blur(28px) saturate(1.6);
        box-shadow: 0 4px 20px rgba(20, 40, 90, .1);
        z-index: 100;
    }
    html[data-theme="dark"] .crm-side[b-p4qkkxw9v7] {
        background: rgba(36, 36, 40, var(--lg-a));
        box-shadow: 0 4px 20px rgba(0, 0, 0, .3);
    }
    
    .crm-side .lg-brand[b-p4qkkxw9v7] {
        display: none;
    }
    
    .crm-nav-vertical[b-p4qkkxw9v7] {
        padding: 8px 0 !important;
    }
    
    .crm-nav-vertical .lg-nav[b-p4qkkxw9v7] {
        flex-direction: row;
        flex-wrap: wrap;
        justify-content: center;
        gap: 4px;
    }
    
    .crm-nav-vertical .lg-link[b-p4qkkxw9v7] {
        width: auto;
        flex: 0 0 auto;
        padding: 8px 12px;
        white-space: nowrap;
        font-size: 13px;
    }
    
    .crm-sidefoot[b-p4qkkxw9v7] {
        display: none;
    }
    
    /* Main content padding on mobile */
    .lg-main[b-p4qkkxw9v7] {
        padding: 8px;
    }
    
    .lg-toolbar[b-p4qkkxw9v7] {
        padding: 8px 12px;
        gap: 8px;
        border-radius: 0;
        border: none;
        border-bottom: 1px solid rgba(120, 120, 128, .15);
    }
    
    .lg-content[b-p4qkkxw9v7] {
        padding: 8px;
    }
}

/* Small mobile (< 480px) */
@media (max-width: 479px) {
    .crm-nav-vertical .lg-link[b-p4qkkxw9v7] {
        padding: 6px 10px;
        font-size: 12px;
    }
    
    .lg-toolbar[b-p4qkkxw9v7] {
        flex-wrap: wrap;
    }
    
    .lg-toolbar > *[b-p4qkkxw9v7] {
        flex: 1 1 auto;
        min-width: 0;
    }
    
    /* AppMenu, CultureSwitcher, etc. compact */
    .culture-switcher[b-p4qkkxw9v7] {
        min-width: 120px;
    }
}

/* ===== PRINT ===== */
@media print {
    .crm-side[b-p4qkkxw9v7],
    .lg-toolbar[b-p4qkkxw9v7] {
        display: none;
    }
    
    .lg-main[b-p4qkkxw9v7] {
        width: 100%;
        min-width: 0;
    }
}
/* _content/MES.Shared/Layout/CrmNavMenu.razor.rz.scp.css */
/* CrmNavMenu — responsive */

/* Base: vertical mode (sidebar) - card style */
.crm-nav.crm-nav-vertical[b-fyi9q8galu] {
    background: transparent;
    border: none;
    box-shadow: none;
    padding: 12px 8px;
    margin-bottom: 0;
}

.crm-nav.crm-nav-vertical .lg-nav[b-fyi9q8galu] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    width: 100%;
    background: transparent;
    border: none;
    padding: 0;
}

.crm-nav-vertical .lg-link[b-fyi9q8galu] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 12px;
    border-radius: 10px;
    color: inherit;
    text-decoration: none;
    font-size: 14px;
    font-weight: 500;
    font-family: inherit;
    background: transparent;
    border: none;
    cursor: pointer;
    width: 100%;
    text-align: left;
    transition: background .12s ease, color .12s ease;
}

.crm-nav-vertical .lg-link:hover[b-fyi9q8galu] {
    background: rgba(120, 120, 128, .16);
    color: inherit;
    text-decoration: none;
}

.crm-nav-vertical .lg-link.lg-active[b-fyi9q8galu] {
    background: var(--lg-accent, #007AFF);
    color: #fff;
    box-shadow: 0 3px 10px rgba(0, 122, 255, .35);
}

.crm-nav-vertical .lg-link.lg-active:hover[b-fyi9q8galu] {
    background: var(--lg-accent-hover, #0A84FF);
    color: #fff;
}

.crm-nav-vertical .lg-link:focus-visible[b-fyi9q8galu] {
    outline: 2px solid var(--lg-accent, #007AFF);
    outline-offset: 1px;
}

/* Gỡ pill active mặc định của FluentNavItem */
.crm-nav-vertical .fluent-navitem.active[b-fyi9q8galu]::after {
    content: none;
}

/* Glyph styling */
.crm-nav-vertical .lg-glyph[b-fyi9q8galu] {
    width: 28px;
    height: 28px;
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: flex-start;
    font-size: 15px;
    border-radius: 7px;
    color: #fff;
    text-shadow: 0 1px 2px rgba(0,0,0,.25);
}

/* Glyph colors */
.g-blue[b-fyi9q8galu] { background: linear-gradient(145deg, #4da3ff, #007AFF); }
.g-purple[b-fyi9q8galu] { background: linear-gradient(145deg, #c86dd7, #AF52DE); }
.g-green[b-fyi9q8galu] { background: linear-gradient(145deg, #5bd97a, #30a34e); }
.g-orange[b-fyi9q8galu] { background: linear-gradient(145deg, #ffb340, #FF9500); }
.g-red[b-fyi9q8galu] { background: linear-gradient(145deg, #ff7a72, #FF3B30); }
.g-teal[b-fyi9q8galu] { background: linear-gradient(145deg, #4fd6d0, #14919b); }
.g-gray[b-fyi9q8galu] { background: linear-gradient(145deg, #b9bcc4, #8E8E93); }

/* ===== HORIZONTAL MODE (dashboard card) ===== */
.crm-nav:not(.crm-nav-vertical)[b-fyi9q8galu] {
    background: rgba(255, 255, 255, 0.75);
    -webkit-backdrop-filter: blur(28px) saturate(1.6);
    backdrop-filter: blur(28px) saturate(1.6);
    border: 3px solid rgba(255, 255, 255, .85);
    box-shadow: 0 8px 28px rgba(20, 40, 90, .1), inset 0 1px 0 rgba(255, 255, 255, .55);
    border-radius: 16px;
    padding: 12px 16px;
    margin-bottom: 16px;
}

html[data-theme="dark"] .crm-nav:not(.crm-nav-vertical)[b-fyi9q8galu] {
    background: rgba(30, 30, 34, 0.85);
    border-color: rgba(255, 255, 255, .5);
    box-shadow: 0 8px 28px rgba(0, 0, 0, .4), inset 0 1px 0 rgba(255, 255, 255, .07);
}

.crm-nav:not(.crm-nav-vertical) .lg-nav[b-fyi9q8galu] {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    gap: 4px;
    width: 100%;
    background: transparent;
    border: none;
    padding: 0;
}

.crm-nav:not(.crm-nav-vertical) .lg-link[b-fyi9q8galu] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 7px 12px;
    border-radius: 10px;
    color: inherit;
    text-decoration: none;
    font-size: 14px;
    font-weight: 500;
    font-family: inherit;
    background: transparent;
    border: none;
    cursor: pointer;
    transition: background .12s ease, color .12s ease;
}

.crm-nav:not(.crm-nav-vertical) .lg-link:hover[b-fyi9q8galu] {
    background: rgba(120, 120, 128, .16);
    color: inherit;
    text-decoration: none;
}

.crm-nav:not(.crm-nav-vertical) .lg-link.lg-active[b-fyi9q8galu] {
    background: var(--lg-accent, #007AFF);
    color: #fff;
    box-shadow: 0 3px 10px rgba(0, 122, 255, .35);
}

.crm-nav:not(.crm-nav-vertical) .lg-link.lg-active:hover[b-fyi9q8galu] {
    background: var(--lg-accent-hover, #0A84FF);
    color: #fff;
}

.crm-nav:not(.crm-nav-vertical) .lg-link:focus-visible[b-fyi9q8galu] {
    outline: 2px solid var(--lg-accent, #007AFF);
    outline-offset: 1px;
}

.crm-nav:not(.crm-nav-vertical) .fluent-navitem.active[b-fyi9q8galu]::after {
    content: none;
}

/* ===== RESPONSIVE ===== */

/* Tablet: horizontal nav wrap */
@media (max-width: 1024px) {
    .crm-nav:not(.crm-nav-vertical)[b-fyi9q8galu] {
        padding: 10px 12px;
    }
    
    .crm-nav:not(.crm-nav-vertical) .lg-link[b-fyi9q8galu] {
        padding: 6px 10px;
        font-size: 13px;
    }
}

/* Mobile: horizontal mode becomes scrollable */
@media (max-width: 767px) {
    .crm-nav:not(.crm-nav-vertical)[b-fyi9q8galu] {
        padding: 8px;
        border-radius: 12px;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
    }
    
    .crm-nav:not(.crm-nav-vertical)[b-fyi9q8galu]::-webkit-scrollbar {
        display: none;
    }
    
    .crm-nav:not(.crm-nav-vertical) .lg-nav[b-fyi9q8galu] {
        flex-wrap: nowrap;
        min-width: max-content;
        padding-bottom: 4px; /* space for scroll hint */
    }
    
    .crm-nav:not(.crm-nav-vertical) .lg-link[b-fyi9q8galu] {
        flex: 0 0 auto;
        white-space: nowrap;
        padding: 8px 12px;
        font-size: 13px;
        border-radius: 8px;
    }
}

/* Small mobile */
@media (max-width: 479px) {
    .crm-nav:not(.crm-nav-vertical) .lg-link[b-fyi9q8galu] {
        padding: 6px 10px;
        font-size: 12px;
    }
    
    .crm-nav:not(.crm-nav-vertical) .lg-glyph[b-fyi9q8galu] {
        width: 24px;
        height: 24px;
        font-size: 13px;
    }
}

/* Print: hide nav */
@media print {
    .crm-nav[b-fyi9q8galu] {
        display: none;
    }
}
/* _content/MES.Shared/Layout/CultureSwitcher.razor.rz.scp.css */
/* Nút ngôn ngữ hiện hành + popover chọn (dùng khung .appmenu-pop của Tahoe) */
.culture-menu .appmenu-item[b-nw04cn1xkr] {
    gap: 8px;
}

.culture-pop[b-nw04cn1xkr] {
    left: auto;
    right: 0;
    min-width: 200px;
    max-height: min(60dvh, 420px);
    overflow-y: auto;
}

.culture-pop .appmenu-row.selected[b-nw04cn1xkr]::part(control) {
    background: rgba(0, 122, 255, .12);
    color: var(--lg-accent, #007AFF);
    font-weight: 600;
}

.culture-pop .appmenu-row-in[b-nw04cn1xkr] {
    justify-content: space-between;
}
/* _content/MES.Shared/Layout/MainLayout.razor.rz.scp.css */
.mes-header-bar[b-fomq72uqz9] {
    padding: 0 1rem;
}

.mes-app-title[b-fomq72uqz9] {
    font-weight: 600;
    font-size: 1.1rem;
}

.lg-bottombar[b-fomq72uqz9] {
    display: flex;
    align-items: center;
    min-height: 32px;
    padding: 0 1rem;
    border-top: 1px solid rgba(120, 120, 128, 0.2);
}

.lg-powered[b-fomq72uqz9] {
    font-size: 0.8rem;
    opacity: 0.65;
}
/* _content/MES.Shared/Layout/ManufacturingLayout.razor.rz.scp.css */
/* Manufacturing Layout — responsive mobile-first */

/* Base: desktop sidebar fixed 250px */
.mfg-side[b-t4nb0230fn] {
    width: 250px;
    flex: 0 0 250px;
    min-height: 100dvh;
    display: flex;
    flex-direction: column;
    gap: 0;
    padding: 0;
    background: transparent;
    border: none;
    box-shadow: none;
}

/* Toolbar inside Manufacturing layout matches main toolbar */
.lg-window .mfg-side ~ .lg-main .lg-toolbar[b-t4nb0230fn] {
    background: rgba(255, 255, 255, 0.75);
    -webkit-backdrop-filter: blur(28px) saturate(1.8);
    backdrop-filter: blur(28px) saturate(1.8);
    border: 3px solid rgba(255, 255, 255, .85);
    box-shadow: 0 12px 40px rgba(20, 40, 90, .12), inset 0 1px 0 rgba(255, 255, 255, .6);
}
html[data-theme="dark"] .lg-window .mfg-side ~ .lg-main .lg-toolbar[b-t4nb0230fn] {
    background: rgba(36, 36, 40, var(--lg-a));
    border-color: rgba(255, 255, 255, .5);
    box-shadow: 0 12px 40px rgba(0, 0, 0, .45), inset 0 1px 0 rgba(255, 255, 255, .08);
}

/* ===== RESPONSIVE BREAKPOINTS ===== */

/* Tablet (768px - 1024px): sidebar thu hẹp */
@media (max-width: 1024px) {
    .mfg-side[b-t4nb0230fn] {
        width: 200px;
        flex: 0 0 200px;
    }

    .mfg-side .lg-brand span:last-child[b-t4nb0230fn] {
        display: none;
    }
    .mfg-side .lg-appicon[b-t4nb0230fn] {
        width: 28px;
        height: 28px;
        font-size: 16px;
    }
}

/* Mobile (< 768px): sidebar thành thanh nav ngang cuộn ngang */
@media (max-width: 767px) {
    .lg-window[b-t4nb0230fn] {
        flex-direction: column;
        height: auto;
        min-height: 100dvh;
    }

    .mfg-side[b-t4nb0230fn] {
        width: 100%;
        flex: 0 0 auto;
        min-height: auto;
        max-height: 60dvh;
        border-radius: 0;
        border: none;
        border-bottom: 1px solid rgba(120, 120, 128, .15);
        background: rgba(255, 255, 255, 0.75);
        -webkit-backdrop-filter: blur(28px) saturate(1.6);
        backdrop-filter: blur(28px) saturate(1.6);
        box-shadow: 0 4px 20px rgba(20, 40, 90, .1);
        z-index: 100;
    }
    html[data-theme="dark"] .mfg-side[b-t4nb0230fn] {
        background: rgba(36, 36, 40, var(--lg-a));
        box-shadow: 0 4px 20px rgba(0, 0, 0, .3);
    }

    .mfg-side .lg-brand[b-t4nb0230fn] {
        display: none;
    }

    .mfg-nav-vertical[b-t4nb0230fn] {
        padding: 8px 0 !important;
    }

    .mfg-nav-vertical .lg-nav[b-t4nb0230fn] {
        flex-direction: row;
        flex-wrap: wrap;
        justify-content: center;
        gap: 4px;
    }

    .mfg-nav-vertical .lg-link[b-t4nb0230fn] {
        width: auto;
        flex: 0 0 auto;
        padding: 8px 12px;
        white-space: nowrap;
        font-size: 13px;
    }

    .mfg-sidefoot[b-t4nb0230fn] {
        display: none;
    }

    /* Main content padding on mobile */
    .lg-main[b-t4nb0230fn] {
        padding: 8px;
    }

    .lg-toolbar[b-t4nb0230fn] {
        padding: 8px 12px;
        gap: 8px;
        border-radius: 0;
        border: none;
        border-bottom: 1px solid rgba(120, 120, 128, .15);
    }

    .lg-content[b-t4nb0230fn] {
        padding: 8px;
    }
}

/* Small mobile (< 480px) */
@media (max-width: 479px) {
    .mfg-nav-vertical .lg-link[b-t4nb0230fn] {
        padding: 6px 10px;
        font-size: 12px;
    }

    .lg-toolbar[b-t4nb0230fn] {
        flex-wrap: wrap;
    }

    .lg-toolbar > *[b-t4nb0230fn] {
        flex: 1 1 auto;
        min-width: 0;
    }

    /* CultureSwitcher, AppMenu... compact */
    .culture-switcher[b-t4nb0230fn] {
        min-width: 120px;
    }
}

/* ===== PRINT ===== */
@media print {
    .mfg-side[b-t4nb0230fn],
    .lg-toolbar[b-t4nb0230fn] {
        display: none;
    }

    .lg-main[b-t4nb0230fn] {
        width: 100%;
        min-width: 0;
    }
}
/* _content/MES.Shared/Layout/ManufacturingNavMenu.razor.rz.scp.css */
/* ManufacturingNavMenu — responsive */

/* Base: vertical mode (sidebar) - card style */
.mfg-nav.mfg-nav-vertical[b-8xezd3ouke] {
    background: transparent;
    border: none;
    box-shadow: none;
    padding: 12px 8px;
    margin-bottom: 0;
}

.mfg-nav.mfg-nav-vertical .lg-nav[b-8xezd3ouke] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    width: 100%;
    background: transparent;
    border: none;
    padding: 0;
}

.mfg-nav-vertical .lg-link[b-8xezd3ouke] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 12px;
    border-radius: 10px;
    color: inherit;
    text-decoration: none;
    font-size: 14px;
    font-weight: 500;
    font-family: inherit;
    background: transparent;
    border: none;
    cursor: pointer;
    width: 100%;
    text-align: left;
    transition: background .12s ease, color .12s ease;
}

.mfg-nav-vertical .lg-link:hover[b-8xezd3ouke] {
    background: rgba(120, 120, 128, .16);
    color: inherit;
    text-decoration: none;
}

.mfg-nav-vertical .lg-link.lg-active[b-8xezd3ouke] {
    background: var(--lg-accent, #007AFF);
    color: #fff;
    box-shadow: 0 3px 10px rgba(0, 122, 255, .35);
}

.mfg-nav-vertical .lg-link.lg-active:hover[b-8xezd3ouke] {
    background: var(--lg-accent-hover, #0A84FF);
    color: #fff;
}

.mfg-nav-vertical .lg-link:focus-visible[b-8xezd3ouke] {
    outline: 2px solid var(--lg-accent, #007AFF);
    outline-offset: 1px;
}

/* Gỡ pill active mặc định của FluentNavItem */
.mfg-nav-vertical .fluent-navitem.active[b-8xezd3ouke]::after {
    content: none;
}

/* Glyph styling */
.mfg-nav-vertical .lg-glyph[b-8xezd3ouke] {
    width: 28px;
    height: 28px;
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: flex-start;
    font-size: 15px;
    border-radius: 7px;
    color: #fff;
    text-shadow: 0 1px 2px rgba(0,0,0,.25);
}

/* ===== HORIZONTAL MODE (dashboard card) ===== */
.mfg-nav:not(.mfg-nav-vertical)[b-8xezd3ouke] {
    background: rgba(255, 255, 255, 0.75);
    -webkit-backdrop-filter: blur(28px) saturate(1.6);
    backdrop-filter: blur(28px) saturate(1.6);
    border: 3px solid rgba(255, 255, 255, .85);
    box-shadow: 0 8px 28px rgba(20, 40, 90, .1), inset 0 1px 0 rgba(255, 255, 255, .55);
    border-radius: 16px;
    padding: 12px 16px;
    margin-bottom: 16px;
}

html[data-theme="dark"] .mfg-nav:not(.mfg-nav-vertical)[b-8xezd3ouke] {
    background: rgba(30, 30, 34, 0.85);
    border-color: rgba(255, 255, 255, .5);
    box-shadow: 0 8px 28px rgba(0, 0, 0, .4), inset 0 1px 0 rgba(255, 255, 255, .07);
}

.mfg-nav:not(.mfg-nav-vertical) .lg-nav[b-8xezd3ouke] {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    gap: 4px;
    width: 100%;
    background: transparent;
    border: none;
    padding: 0;
}

.mfg-nav:not(.mfg-nav-vertical) .lg-link[b-8xezd3ouke] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 7px 12px;
    border-radius: 10px;
    color: inherit;
    text-decoration: none;
    font-size: 14px;
    font-weight: 500;
    font-family: inherit;
    background: transparent;
    border: none;
    cursor: pointer;
    transition: background .12s ease, color .12s ease;
}

.mfg-nav:not(.mfg-nav-vertical) .lg-link:hover[b-8xezd3ouke] {
    background: rgba(120, 120, 128, .16);
    color: inherit;
    text-decoration: none;
}

.mfg-nav:not(.mfg-nav-vertical) .lg-link.lg-active[b-8xezd3ouke] {
    background: var(--lg-accent, #007AFF);
    color: #fff;
    box-shadow: 0 3px 10px rgba(0, 122, 255, .35);
}

.mfg-nav:not(.mfg-nav-vertical) .lg-link.lg-active:hover[b-8xezd3ouke] {
    background: var(--lg-accent-hover, #0A84FF);
    color: #fff;
}

.mfg-nav:not(.mfg-nav-vertical) .lg-link:focus-visible[b-8xezd3ouke] {
    outline: 2px solid var(--lg-accent, #007AFF);
    outline-offset: 1px;
}

.mfg-nav:not(.mfg-nav-vertical) .fluent-navitem.active[b-8xezd3ouke]::after {
    content: none;
}

/* ===== RESPONSIVE ===== */

/* Tablet: horizontal nav wrap */
@media (max-width: 1024px) {
    .mfg-nav:not(.mfg-nav-vertical)[b-8xezd3ouke] {
        padding: 10px 12px;
    }

    .mfg-nav:not(.mfg-nav-vertical) .lg-link[b-8xezd3ouke] {
        padding: 6px 10px;
        font-size: 13px;
    }
}

/* Mobile: horizontal mode becomes scrollable */
@media (max-width: 767px) {
    .mfg-nav:not(.mfg-nav-vertical)[b-8xezd3ouke] {
        padding: 8px;
        border-radius: 12px;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
    }

    .mfg-nav:not(.mfg-nav-vertical)[b-8xezd3ouke]::-webkit-scrollbar {
        display: none;
    }

    .mfg-nav:not(.mfg-nav-vertical) .lg-nav[b-8xezd3ouke] {
        flex-wrap: nowrap;
        min-width: max-content;
        padding-bottom: 4px; /* space for scroll hint */
    }

    .mfg-nav:not(.mfg-nav-vertical) .lg-link[b-8xezd3ouke] {
        flex: 0 0 auto;
        white-space: nowrap;
        padding: 8px 12px;
        font-size: 13px;
        border-radius: 8px;
    }
}

/* Small mobile */
@media (max-width: 479px) {
    .mfg-nav:not(.mfg-nav-vertical) .lg-link[b-8xezd3ouke] {
        padding: 6px 10px;
        font-size: 12px;
    }

    .mfg-nav:not(.mfg-nav-vertical) .lg-glyph[b-8xezd3ouke] {
        width: 24px;
        height: 24px;
        font-size: 13px;
    }
}

/* Print: hide nav */
@media print {
    .mfg-nav[b-8xezd3ouke] {
        display: none;
    }
}
/* _content/MES.Shared/Layout/PwaInstall.razor.rz.scp.css */
.pwa-toast[b-jvbc32c71w] {
    position: fixed;
    top: 55px;
    right: 12px;
    z-index: 10050;
    display: flex;
    align-items: center;
    gap: 0.6rem;
    max-width: 360px;
    padding: 0.6rem 0.75rem;
    border-radius: 12px;
    background: var(--neutral-layer-4, rgba(255, 255, 255, 0.85));
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border: 1px solid rgba(120, 120, 128, 0.25);
    box-shadow: 0 8px 28px rgba(0, 0, 0, 0.18);
}

.pwa-toast-icon[b-jvbc32c71w] {
    font-size: 1.1rem;
    line-height: 1;
}

.pwa-toast-text[b-jvbc32c71w] {
    flex: 1 1 auto;
    font-size: 0.85rem;
}

.pwa-toast-close[b-jvbc32c71w] {
    border: none;
    background: transparent;
    cursor: pointer;
    opacity: 0.6;
    font-size: 0.85rem;
    padding: 0.2rem 0.4rem;
}

.pwa-toast-close:hover[b-jvbc32c71w] {
    opacity: 1;
}
/* _content/MES.Shared/Pages/Boms.razor.rz.scp.css */
/* Boms — thanh chọn/navigating BOM hiện tại (thay cho click-row của table cũ) */
.bom-selectbar[b-8j1oetxb42] {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: .5rem;
    margin: .75rem 0 .25rem;
    font-size: 13.5px;
}

.bom-selectbar > span[b-8j1oetxb42] {
    min-width: 140px;
    text-align: center;
    font-weight: 600;
    font-variant-numeric: tabular-nums;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

@media (max-width: 767px) {
    .bom-selectbar > span[b-8j1oetxb42] {
        min-width: 90px;
    }
}
/* _content/MES.Shared/Pages/Broadcast.razor.rz.scp.css */
/* Broadcast — trang hub module (tổng quan + gallery sub-app). */

/* 4 KPI: 2 cột mobile, 4 cột desktop */
.bc-kpi[b-zrs7sj3pem] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 8px;
}

@media (min-width: 1024px) {
    .bc-kpi[b-zrs7sj3pem] {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }
}

.bc-kpi-card[b-zrs7sj3pem] {
    text-align: center;
    padding: 14px 10px;
    border-top: 4px solid var(--lg-accent, #007AFF);
}

.bc-kpi-label[b-zrs7sj3pem] {
    display: block;
    font-size: .8rem;
    opacity: .75;
}

.bc-kpi-value[b-zrs7sj3pem] {
    display: block;
    font-size: 1.9rem;
    font-weight: 700;
    line-height: 1.2;
    font-variant-numeric: tabular-nums;
}

.bc-kpi-sub[b-zrs7sj3pem] {
    display: block;
    font-size: .75rem;
    opacity: .6;
}

/* Link mở kênh phát ở chế độ toàn màn hình */
.bc-hub-link[b-zrs7sj3pem] {
    margin: 20px 0 0;
    font-size: 13.5px;
}

@media (max-width: 479px) {
    .bc-kpi-value[b-zrs7sj3pem] {
        font-size: 1.5rem;
    }
}
/* _content/MES.Shared/Pages/BroadcastPlaylist.razor.rz.scp.css */
/* Broadcast — trang quản lý danh sách phát (playlist). */

.broadcast-link[b-ln4kcnuyvj] {
    margin-top: .75rem;
    font-size: 13.5px;
}
/* _content/MES.Shared/Pages/Channel.razor.rz.scp.css */
/* Channel — kiosk screen. Full-bleed, no page chrome, theme-agnostic. */

.broadcast[b-m7unouism7] {
    position: fixed;
    inset: 0;
    width: 100vw;
    height: 100dvh;
    background: #000;
    color: #fff;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Media is centred and contained so any aspect ratio stays visible. */
.broadcast-stage[b-m7unouism7] {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}

.broadcast-media[b-m7unouism7] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.broadcast-error[b-m7unouism7],
.broadcast-loading[b-m7unouism7] {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: .75rem;
    padding: 2rem;
    text-align: center;
    font-size: 15px;
}

.broadcast-retry[b-m7unouism7] {
    appearance: none;
    border: 1px solid rgba(255, 255, 255, .35);
    background: rgba(255, 255, 255, .12);
    color: #fff;
    border-radius: 8px;
    padding: .5rem 1rem;
    font: inherit;
    cursor: pointer;
}

.broadcast-retry:hover[b-m7unouism7] {
    background: rgba(255, 255, 255, .22);
}

/* Lớp phủ khi media chưa sẵn sàng / lỗi (ảnh chưa load, video bị chặn
   autoplay, lỗi decode…). Đè lên media, tự sau 10s sẽ chuyển slide. */
.broadcast-media-error[b-m7unouism7] {
    position: absolute;
    inset: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: .75rem;
    padding: 2rem;
    text-align: center;
    font-size: 15px;
    background: rgba(0, 0, 0, .72);
    -webkit-backdrop-filter: blur(6px);
    backdrop-filter: blur(6px);
}

/* Caption + counter: small, out of the way, readable over any media. */
.broadcast-hud[b-m7unouism7] {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: .75rem 1.25rem;
    font-size: 14px;
    background: linear-gradient(to top, rgba(0, 0, 0, .55), transparent);
    color: #fff;
    pointer-events: none;
}

.broadcast-title[b-m7unouism7] {
    font-weight: 600;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.broadcast-count[b-m7unouism7] {
    flex: 0 0 auto;
    font-variant-numeric: tabular-nums;
    opacity: .8;
}

/* Dwell progress for images: CSS-only, restarted per slide by re-mounting. */
.broadcast-timer[b-m7unouism7] {
    position: absolute;
    left: 0;
    bottom: 0;
    height: 3px;
    width: 100%;
    background: #007AFF;
    transform-origin: left center;
    animation: broadcast-dwell-b-m7unouism7 linear 1 forwards;
}

@keyframes broadcast-dwell-b-m7unouism7 {
    from {
        transform: scaleX(0);
    }

    to {
        transform: scaleX(1);
    }
}

@media (prefers-reduced-motion: reduce) {
    .broadcast-timer[b-m7unouism7] {
        animation: none;
        transform: scaleX(1);
    }
}
/* Nút bật tiếng: nổi ở góc phải, trên HUD. Chỉ xuất hiện khi trình duyệt
   chặn autoplay có âm thanh (TV browser) nên video đang bị câm. */
.broadcast-unmute[b-m7unouism7] {
    position: absolute;
    right: 1.25rem;
    bottom: 3.25rem;
    appearance: none;
    border: 1px solid rgba(255, 255, 255, .35);
    background: rgba(0, 0, 0, .55);
    -webkit-backdrop-filter: blur(8px);
    backdrop-filter: blur(8px);
    color: #fff;
    border-radius: 999px;
    padding: .5rem 1rem;
    font: inherit;
    font-size: 14px;
    cursor: pointer;
    z-index: 1;
}

.broadcast-unmute:hover[b-m7unouism7] {
    background: rgba(0, 0, 0, .75);
}
/* _content/MES.Shared/Pages/Home.razor.rz.scp.css */
.module-gallery-card[b-v2kxiyds4f] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.4rem;
    padding: 1.5rem 1rem;
    border-radius: 16px;
    text-align: center;
    text-decoration: none;
    color: inherit;
    background: rgba(255, 255, 255, var(--lg-a));
    -webkit-backdrop-filter: blur(var(--lg-blur)) saturate(1.6);
    backdrop-filter: blur(var(--lg-blur)) saturate(1.6);
    border: 1px solid rgba(255, 255, 255, .55);
    box-shadow: 0 8px 28px rgba(20, 40, 90, .1);
}

.module-gallery-card:hover[b-v2kxiyds4f] {
    text-decoration: none;
    color: inherit;
    border-color: var(--lg-accent);
}

.module-gallery-icon[b-v2kxiyds4f] {
    font-size: 2.5rem;
    line-height: 1;
}

.module-gallery-desc[b-v2kxiyds4f] {
    font-size: 0.8rem;
    opacity: 0.7;
}
/* _content/MES.Shared/Pages/Login.razor.rz.scp.css */
.login-stub[b-twtennwtb7] {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 60vh;
    padding: 2rem 1rem;
}

.login-stub-card[b-twtennwtb7] {
    max-width: 380px;
    width: 100%;
    text-align: center;
    padding: 2rem;
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    align-items: center;
}

.login-stub-icon[b-twtennwtb7] {
    font-size: 2.5rem;
    line-height: 1;
}

.login-stub-card h2[b-twtennwtb7] {
    margin: 0;
}

.login-stub-card p[b-twtennwtb7] {
    margin: 0 0 0.5rem;
    opacity: 0.75;
}
/* _content/MES.Shared/Pages/Manufacturing.razor.rz.scp.css */
.module-gallery-card[b-i3fkfk0wab] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.4rem;
    padding: 1.5rem 1rem;
    border-radius: 16px;
    text-align: center;
    text-decoration: none;
    color: inherit;
    background: rgba(255, 255, 255, var(--lg-a));
    -webkit-backdrop-filter: blur(var(--lg-blur)) saturate(1.6);
    backdrop-filter: blur(var(--lg-blur)) saturate(1.6);
    border: 1px solid rgba(255, 255, 255, .55);
    box-shadow: 0 8px 28px rgba(20, 40, 90, .1);
}

.module-gallery-card:hover[b-i3fkfk0wab] {
    text-decoration: none;
    color: inherit;
    border-color: var(--lg-accent);
}

.module-gallery-icon[b-i3fkfk0wab] {
    font-size: 2.5rem;
    line-height: 1;
}
/* _content/MES.Shared/Pages/ProductionDashboard.razor.rz.scp.css */
/* ProductionDashboard — Tahoe liquid-glass, responsive bằng FluentGrid.
   Dùng biến --lg-* của tahoe.css (không dùng --rz-* vì repo không có Radzen). */

.dash-header[b-ade0r2lb9u] {
    align-items: center;
    margin-bottom: .5rem;
}

.dash-header-title[b-ade0r2lb9u] {
    display: flex;
    align-items: center;
    gap: .5rem;
    flex-wrap: wrap;
}

.dash-header-title h3[b-ade0r2lb9u] {
    margin: 0;
}

.dash-header-controls[b-ade0r2lb9u] {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: .5rem;
    flex-wrap: wrap;
}

.dash-updated[b-ade0r2lb9u] {
    font-size: .8rem;
    opacity: .7;
    white-space: nowrap;
}

.dash-live[b-ade0r2lb9u] {
    background: #30a34e;
    color: #fff;
}

/* ===== KPI row: 2 cot mobile / 3 cot tablet / 6 cot desktop ===== */
.dash-kpi-row[b-ade0r2lb9u] {
    margin-bottom: .25rem;
}

.dash-kpi[b-ade0r2lb9u] {
    text-align: center;
    border-top: 4px solid var(--lg-accent, #007AFF);
}

/* Moi dem trong 1 panel nen bo viet/top de panel goc khong bi "chong" vien */
.dash-panel > .dash-kpi[b-ade0r2lb9u] {
    border-top: none;
}

.dash-state-slice[b-ade0r2lb9u] {
    text-align: center;
    border: 1px solid rgba(120, 120, 128, .18);
    background: rgba(255, 255, 255, .55);
    -webkit-backdrop-filter: blur(12px) saturate(1.4);
    backdrop-filter: blur(12px) saturate(1.4);
}

html[data-theme="dark"] .dash-state-slice[b-ade0r2lb9u] {
    background: rgba(255, 255, 255, .06);
    border-color: rgba(255, 255, 255, .12);
}

.dash-kpi-value[b-ade0r2lb9u] {
    font-size: 1.75rem;
    font-weight: 700;
    line-height: 1.2;
    font-variant-numeric: tabular-nums;
}

/* O nho hon trong bang ByState de 6 o van vua 1/2 panel */
.dash-state-slice .dash-kpi-value[b-ade0r2lb9u] {
    font-size: 1.25rem;
}

.dash-kpi-label[b-ade0r2lb9u] {
    font-size: .8rem;
    opacity: .75;
}

.dash-info[b-ade0r2lb9u] {
    border-top-color: #2196f3;
}

.dash-success[b-ade0r2lb9u] {
    border-top-color: #30a34e;
}

.dash-danger[b-ade0r2lb9u] {
    border-top-color: #ff3b30;
}

/* ===== Panels ===== */
.dash-charts[b-ade0r2lb9u] {
    align-items: stretch;
}

.dash-panel[b-ade0r2lb9u] {
    height: 100%;
    margin-bottom: .75rem;
}

.dash-panel h4[b-ade0r2lb9u] {
    margin: 0 0 .5rem;
}

/* Bang trong panel: gioi han chieu cao + cuon trong panel,
   tranh lam cao trang keo theo so dong */
.dash-table-scroll[b-ade0r2lb9u] {
    max-height: 320px;
    overflow: auto;
}

/* ===== Workcenter load bar =====
   Tu dinh nghia day vi .plan-bar/.plan-fill nam trong ProductionPlan.razor.css
   (CSS isolation) nen khong ap dung duoc sang trang nay. */
.dash-load[b-ade0r2lb9u] {
    display: flex;
    align-items: center;
    gap: .5rem;
    min-width: 160px;
}

.dash-load-bar[b-ade0r2lb9u] {
    position: relative;
    flex: 1;
    height: 14px;
    border-radius: 7px;
    background: rgba(120, 120, 128, .22);
    overflow: hidden;
}

.dash-load-fill[b-ade0r2lb9u] {
    position: absolute;
    inset-block: 0;
    left: 0;
    border-radius: 7px;
    background: linear-gradient(90deg, #30a34e, #4caf50);
}

html[data-theme="dark"] .dash-load-fill[b-ade0r2lb9u] {
    background: linear-gradient(90deg, #2ea043, #4caf50);
}

/* ===== Responsive ===== */
@media (max-width: 767px) {
    .dash-header-controls[b-ade0r2lb9u] {
        justify-content: flex-start;
    }

    .dash-kpi-value[b-ade0r2lb9u] {
        font-size: 1.5rem;
    }

    .dash-state-slice .dash-kpi-value[b-ade0r2lb9u] {
        font-size: 1.1rem;
    }

    .dash-table-scroll[b-ade0r2lb9u] {
        max-height: 240px;
    }
}

@media (max-width: 479px) {
    .dash-updated[b-ade0r2lb9u] {
        display: none;
    }

    .dash-header-controls select[b-ade0r2lb9u] {
        flex: 1;
    }
}
/* _content/MES.Shared/Pages/ProductionPlan.razor.rz.scp.css */
.plan-timeline[b-9greg4det4] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.plan-row[b-9greg4det4] {
    display: flex;
    gap: 1rem;
    align-items: center;
    padding: 0.6rem 0.75rem;
    border: 1px solid var(--rz-border-color);
    border-radius: var(--rz-border-radius);
    cursor: pointer;
}

.plan-row:hover[b-9greg4det4] {
    box-shadow: var(--rz-card-shadow, 0 4px 12px rgba(0, 0, 0, 0.15));
}

.plan-label[b-9greg4det4] {
    flex: 0 0 260px;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    min-width: 0;
}

.plan-sub[b-9greg4det4] {
    font-size: 0.8rem;
    opacity: 0.75;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 100%;
}

.plan-track[b-9greg4det4] {
    flex: 1 1 auto;
    min-width: 0;
}

.plan-bar[b-9greg4det4] {
    position: relative;
    height: 18px;
    border-radius: 9px;
    background-color: var(--rz-base-200, #e0e0e0);
    overflow: hidden;
}

.plan-fill[b-9greg4det4] {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    background-color: var(--rz-success, #4caf50);
}

.plan-delayed[b-9greg4det4] {
    outline: 2px solid var(--rz-danger, #f44336);
}

.plan-dates[b-9greg4det4] {
    font-size: 0.75rem;
    opacity: 0.7;
}