/* /Components/Layout/MainLayout.razor.rz.scp.css */
.page[b-cf0k0zxsop] {
    display: flex;
    flex-direction: row;
    height: 100dvh; /* ใช้ dvh เพื่อให้พอดีจอมือถือจริง */
    overflow: hidden;
    width: 100%;
}

.sidebar[b-cf0k0zxsop] {
    width: 260px;
    min-width: 260px;
    height: 100dvh;
    background: linear-gradient(180deg, #1a1a1b 0%, #121212 100%) !important;
    border-right: 1px solid #2d2d2d;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    display: flex;
    flex-direction: column;
    overflow: hidden;
    z-index: 1050;
}

.sidebar[b-cf0k0zxsop]::-webkit-scrollbar { display: none; }
.sidebar[b-cf0k0zxsop] { -ms-overflow-style: none; scrollbar-width: none; }

.sidebar.collapsed[b-cf0k0zxsop] { width: 70px; min-width: 70px; }

/* ส่วน Top Bar ของมือถือ */
.mobile-top-bar[b-cf0k0zxsop] {
    height: 60px;
    min-height: 60px;
    border-bottom: 1px solid #eee;
    z-index: 1000;
}

main[b-cf0k0zxsop] {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    background-color: #f4f7f6;
    height: 100dvh;
    overflow-y: auto; /* ให้เลื่อนได้ทั้งหน้า เพื่อให้เห็น Footer */
}

.content[b-cf0k0zxsop] {
    width: 100%;
    padding-top: 1rem;
}

/* จัดการ Sidebar ในมือถือ (จอเล็กกว่า 768px) */
@media (max-width: 767.98px) {
    .sidebar[b-cf0k0zxsop] {
        position: fixed;
        left: -260px;
        visibility: hidden;
    }

    .sidebar.mobile-open[b-cf0k0zxsop] {
        left: 0;
        visibility: visible;
    }

    .sidebar.collapsed[b-cf0k0zxsop] { left: -260px; width: 260px; min-width: 260px; }

    .sidebar-backdrop[b-cf0k0zxsop] {
        position: fixed;
        top: 0; left: 0; width: 100vw; height: 100vh;
        background: rgba(0,0,0,0.5); z-index: 1040;
        backdrop-filter: blur(2px);
    }
}

.admin-footer[b-cf0k0zxsop] {
    background-color: #ffffff;
    border-top: 1px solid #eeeeee;
    width: 100%;
}

.admin-footer span[b-cf0k0zxsop] {
    letter-spacing: 0.5px;
}

button[b-cf0k0zxsop], .btn[b-cf0k0zxsop] {
    touch-action: manipulation; /* ช่วยให้ตอบสนองการกดในมือถือไวขึ้น */
    cursor: pointer;
}

/* -------------------------------------- */
/* ระบบจัดการหน้าจอตอนสั่งปริ้น (Print Mode) */
/* -------------------------------------- */
@media print {
    /* ซ่อนทุกอย่างที่ไม่ใช่เนื้อหาหลัก */
    .mobile-top-bar[b-cf0k0zxsop],
    .sidebar[b-cf0k0zxsop],
    .sidebar-backdrop[b-cf0k0zxsop],
    .admin-footer[b-cf0k0zxsop],
    button[b-cf0k0zxsop],
    .btn[b-cf0k0zxsop] {
        display: none !important;
        visibility: hidden !important;
        opacity: 0 !important;
        height: 0 !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    /* ขยายพื้นที่หน้ากระดาษให้เต็ม */
    .page[b-cf0k0zxsop], main[b-cf0k0zxsop] {
        display: block !important;
        position: relative !important;
        height: auto !important;
        width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
        background-color: white !important;
        overflow: visible !important;
    }

    .content[b-cf0k0zxsop] {
        padding: 0 !important;
        margin: 0 !important;
    }
}
/* /Components/Layout/NavMenu.razor.rz.scp.css */
.nav-container[b-9vdcz2fpdl] {
    display: flex;
    flex-direction: column;
    height: 100%; /* เปลี่ยนจาก 100vh เป็น 100% */
    background-color: #ffffff;
}

.top-row[b-9vdcz2fpdl] {
    height: 70px;
    min-height: 70px;
    background-color: #121212 !important;
    border-bottom: 3px solid #d92121 !important;
    position: relative; 
}

.btn-toggle[b-9vdcz2fpdl] {
    background: none; border: none; color: white !important;
    width: 60px; height: 70px; display: flex;
    align-items: center; justify-content: center;
    cursor: pointer; outline: none;
}

.btn-right[b-9vdcz2fpdl] { position: absolute; right: 5px; top: 0; }
.btn-toggle i[b-9vdcz2fpdl] { font-size: 1.8rem; }

.user-profile-sidebar[b-9vdcz2fpdl] {
    background-color: #f8f9fa !important;
    border-bottom: 1px solid #eeeeee;
}

.user-profile-sidebar .badge[b-9vdcz2fpdl] {
    text-transform: none !important;
    font-family: 'Prompt', sans-serif;
}

.avatar-border[b-9vdcz2fpdl] {
    border: 2px solid #d92121;
    background-color: #fff;
    box-shadow: 0 4px 10px rgba(0,0,0,0.1);
}

.menu-scroll[b-9vdcz2fpdl] {
    overflow-y: auto;
    overflow-x: hidden;
}

.nav-item[b-9vdcz2fpdl] { width: 100%; }

[b-9vdcz2fpdl] .nav-link {
    display: flex; align-items: center;
    padding: 0.8rem 1.5rem !important;
    color: #444 !important; text-decoration: none;
    transition: all 0.2s;
}

[b-9vdcz2fpdl] .nav-link:hover {
    background-color: #fff4f4 !important;
    color: #d92121 !important;
}

[b-9vdcz2fpdl] .nav-link.active {
    background-color: #d92121 !important;
    color: white !important;
    font-weight: 600;
}

[b-9vdcz2fpdl] .nav-link i {
    font-size: 1.4rem; width: 1.5rem;
    margin-right: 1rem; display: flex; justify-content: center;
}

.logout-section[b-9vdcz2fpdl] {
    margin-top: auto;
    border-top: 1px solid #eee;
    padding-bottom: 1rem;
}

.collapsed-menu .top-row[b-9vdcz2fpdl] { justify-content: center; }
.collapsed-menu .nav-item[b-9vdcz2fpdl]  .nav-link { justify-content: center !important; padding: 0.8rem 0 !important; }
.collapsed-menu .nav-item[b-9vdcz2fpdl]  .nav-link i { margin-right: 0 !important; }

/* Container รูปภาพ */
.avatar-wrapper[b-9vdcz2fpdl] {
    position: relative;
    display: inline-block;
    transition: all 0.3s ease;
}

/* ✅ Class ใหม่สำหรับออร่าแดงแบบมีพลังเฉพาะ Super Admin */
.super-admin-avatar-aura[b-9vdcz2fpdl] {
    /* กรอบแดงโทนเดิมของคุณ Game */
    border: 3px solid #d92121 !important;
    /* ✅ เทคนิค box-shadow ซ้อนกัน 3 ชั้นเพื่อให้ได้ออร่าเรืองแสง */
    box-shadow: 0 0 5px #d92121, /* ชั้นในสุด: แสงเข้มชิดขอบ */
    0 0 15px #ff4d4d, /* ชั้นกลาง: แสงเริ่มฟุ้งออกโทนแดงสว่าง */
    0 0 25px rgba(217, 33, 33, 0.3) !important; /* ชั้นนอกสุด: แสงฟุ้งกว้างๆ บางๆ */

    transition: all 0.3s ease;
}

/* --- ส่วนของโล่แปะบนรูป (Idea 1 เดิม ปรับขนาดเล็กน้อยให้เข้ากับกรอบที่หนาขึ้น) --- */
.admin-verified-shield[b-9vdcz2fpdl] {
    position: absolute;
    bottom: 5px;
    right: 5px;
    /* เปลี่ยนโล่เป็นแดงเข้ม-แดงสว่าง เพื่อให้ตัดกับออร่า */
    background: linear-gradient(135deg, #b31b1b, #d92121);
    color: white;
    width: 26px;
    height: 26px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
    border: 2px solid #fff;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);
    z-index: 10;
    transition: all 0.3s ease;
}

/* ✅ 2. ปรับแต่งตอนย่อเมนู (Collapsed) เพื่อให้ออร่าดูไม่ฟุ้งจนกลบรูป */
.collapsed-menu .super-admin-avatar-aura[b-9vdcz2fpdl] {
    border-width: 2px !important; /* ลดความหนากรอบ */
    /* ✅ ลดความฟุ้งของออร่าลงให้สมส่วน */
    box-shadow: 0 0 3px #d92121, 0 0 10px #ff4d4d, 0 0 15px rgba(217, 33, 33, 0.4) !important;
}

/* ✅ 3. ปรับขนาดโล่ตอนย่อเมนู (Collapsed) - โค้ดเดิมที่ทำให้ไม่ดูแปลก */
.collapsed-menu .admin-verified-shield[b-9vdcz2fpdl] {
    width: 18px;
    height: 18px;
    bottom: 1px; /* ปรับตำแหน่งเล็กน้อย */
    right: 1px;
    font-size: 10px;
    border-width: 1.5px;
}
/* /Components/Layout/ReconnectModal.razor.rz.scp.css */
.components-reconnect-first-attempt-visible[b-aqc5hwav9r],
.components-reconnect-repeated-attempt-visible[b-aqc5hwav9r],
.components-reconnect-failed-visible[b-aqc5hwav9r],
.components-pause-visible[b-aqc5hwav9r],
.components-resume-failed-visible[b-aqc5hwav9r],
.components-rejoining-animation[b-aqc5hwav9r] {
    display: none;
}

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


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

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

}

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

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

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

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

    100% {
        opacity: 1;
    }
}

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

    100% {
        opacity: 0;
    }
}

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

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

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

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

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

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

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

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

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

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

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

    100% {
        top: 0px;
        left: 0px;
        width: 80px;
        height: 80px;
        opacity: 0;
    }
}
/* /Components/Pages/Admin/Analytics/AnalyticsUpload.razor.rz.scp.css */
/* =========================================================
   ANALYTICS UPLOAD CENTER — DRILLDOWN V1
   Theme: FakeDev / iHAVECPU
========================================================= */

.analytics-upload-page[b-erzf9pxrf9] {
    --au-red: #e31b2b;
    --au-red-soft: rgba(227, 27, 43, .10);
    --au-red-border: rgba(227, 27, 43, .32);

    --au-green: #20a464;
    --au-green-soft: rgba(32, 164, 100, .11);
    --au-green-border: rgba(32, 164, 100, .32);

    --au-amber: #d88b16;
    --au-amber-soft: rgba(216, 139, 22, .12);
    --au-amber-border: rgba(216, 139, 22, .32);

    --au-blue: #3976d4;
    --au-violet: #7b56c9;

    --au-slate: #68707c;
    --au-slate-soft: rgba(104, 112, 124, .10);
    --au-slate-border: rgba(104, 112, 124, .25);

    --au-border: rgba(120, 126, 140, .18);
    --au-surface: rgba(127, 127, 127, .045);
    --au-surface-2: rgba(127, 127, 127, .075);
    --au-shadow: 0 12px 28px rgba(0, 0, 0, .055);

    max-width: 1600px;
    margin: 0 auto;
    padding: 28px;
}

.page-head[b-erzf9pxrf9] {
    margin-bottom: 22px;
}

.page-head h1[b-erzf9pxrf9] {
    margin: 4px 0 8px;
    font-size: 30px;
    font-weight: 800;
    letter-spacing: -.025em;
}

.page-head p[b-erzf9pxrf9] {
    margin: 0;
    opacity: .68;
}

.eyebrow[b-erzf9pxrf9],
.section-eyebrow[b-erzf9pxrf9] {
    font-size: 11px;
    font-weight: 800;
    letter-spacing: .14em;
    opacity: .55;
}

.upload-card[b-erzf9pxrf9],
.panel[b-erzf9pxrf9],
.metric[b-erzf9pxrf9] {
    border: 1px solid var(--au-border);
    background: var(--au-surface);
    border-radius: 16px;
}

.upload-card[b-erzf9pxrf9] {
    padding: 18px;
    margin-bottom: 18px;
}

.upload-zone[b-erzf9pxrf9] {
    display: grid;
    grid-template-columns: 50px 1fr minmax(220px, 350px);
    gap: 16px;
    align-items: center;
}

.upload-icon[b-erzf9pxrf9] {
    width: 50px;
    height: 50px;
    display: grid;
    place-items: center;
    border-radius: 13px;
    background: var(--au-green-soft);
    color: var(--au-green);
    font-size: 22px;
}

.upload-copy strong[b-erzf9pxrf9] {
    font-size: 15px;
}

.hint[b-erzf9pxrf9] {
    margin-top: 4px;
    font-size: 12px;
    opacity: .58;
}

.status[b-erzf9pxrf9] {
    margin-top: 14px;
    padding: 11px 13px;
    border-radius: 10px;
    font-size: 13px;
}

.status.info[b-erzf9pxrf9] {
    background: rgba(57, 118, 212, .10);
}

.status.error[b-erzf9pxrf9] {
    background: var(--au-red-soft);
    color: var(--au-red);
}

.status.success[b-erzf9pxrf9] {
    background: var(--au-green-soft);
    color: var(--au-green);
}

/* =========================================================
   FILE SUMMARY
========================================================= */

.summary-grid[b-erzf9pxrf9] {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 18px;
}

.metric[b-erzf9pxrf9] {
    min-height: 104px;
    padding: 15px;
    display: grid;
    grid-template-columns: 42px minmax(0, 1fr);
    gap: 12px;
    align-items: center;
}

.metric-icon[b-erzf9pxrf9] {
    width: 42px;
    height: 42px;
    display: grid;
    place-items: center;
    border-radius: 11px;
    font-size: 17px;
}

.metric-icon.red[b-erzf9pxrf9] {
    background: var(--au-red-soft);
    color: var(--au-red);
}

.metric-icon.green[b-erzf9pxrf9] {
    background: var(--au-green-soft);
    color: var(--au-green);
}

.metric-icon.amber[b-erzf9pxrf9] {
    background: var(--au-amber-soft);
    color: var(--au-amber);
}

.metric-icon.blue[b-erzf9pxrf9] {
    background: rgba(57, 118, 212, .10);
    color: var(--au-blue);
}

.metric-icon.violet[b-erzf9pxrf9] {
    background: rgba(123, 86, 201, .10);
    color: var(--au-violet);
}

.metric span[b-erzf9pxrf9] {
    display: block;
    font-size: 11px;
    font-weight: 700;
    opacity: .58;
    margin-bottom: 4px;
}

.metric strong[b-erzf9pxrf9] {
    display: block;
    font-size: 18px;
    line-height: 1.2;
    overflow-wrap: anywhere;
}

.metric small[b-erzf9pxrf9] {
    display: block;
    margin-top: 5px;
    font-size: 11px;
    opacity: .55;
}

/* =========================================================
   PANEL
========================================================= */

.panel[b-erzf9pxrf9] {
    padding: 18px;
    margin-bottom: 18px;
}

.panel-title[b-erzf9pxrf9] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 20px;
    margin-bottom: 16px;
}

.panel-title h2[b-erzf9pxrf9],
.drill-panel-head h2[b-erzf9pxrf9] {
    margin: 2px 0 4px;
    font-size: 19px;
    font-weight: 800;
    letter-spacing: -.015em;
}

.panel-title p[b-erzf9pxrf9],
.drill-panel-head p[b-erzf9pxrf9] {
    margin: 0;
    font-size: 12px;
    opacity: .58;
}

.preview-shell[b-erzf9pxrf9] {
    box-shadow: var(--au-shadow);
}

.preview-title[b-erzf9pxrf9] {
    margin-bottom: 18px;
}

.confirm-btn[b-erzf9pxrf9] {
    border: 1px solid var(--au-red);
    background: var(--au-red);
    color: #fff;
    border-radius: 10px;
    padding: 10px 16px;
    font-weight: 800;
    font-size: 13px;
    cursor: pointer;
    transition: transform .15s ease, opacity .15s ease, box-shadow .15s ease;
    box-shadow: 0 6px 16px rgba(227, 27, 43, .18);
}

.confirm-btn:hover:not(:disabled)[b-erzf9pxrf9] {
    transform: translateY(-1px);
    box-shadow: 0 8px 20px rgba(227, 27, 43, .25);
}

.confirm-btn:disabled[b-erzf9pxrf9] {
    cursor: not-allowed;
    opacity: .4;
    box-shadow: none;
}

.secondary-btn[b-erzf9pxrf9] {
    min-height: 44px;
    padding: 0 18px;
    border: 1px solid var(--au-border);
    border-radius: 12px;
    background: var(--au-surface-2);
    color: inherit;
    font-weight: 800;
    cursor: pointer;
}

.secondary-btn:hover:not(:disabled)[b-erzf9pxrf9] {
    border-color: var(--au-blue);
}

.secondary-btn:disabled[b-erzf9pxrf9] {
    cursor: not-allowed;
    opacity: .55;
}

/* =========================================================
   CLICKABLE KPI
========================================================= */

.drill-kpi-grid[b-erzf9pxrf9] {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 10px;
}

.drill-kpi-card[b-erzf9pxrf9] {
    appearance: none;
    width: 100%;
    min-width: 0;
    text-align: left;
    border: 1px solid var(--au-border);
    background: var(--au-surface-2);
    border-radius: 13px;
    padding: 13px;
    color: inherit;
    cursor: pointer;
    transition: transform .15s ease,
                border-color .15s ease,
                background .15s ease,
                box-shadow .15s ease;
}

.drill-kpi-card:hover[b-erzf9pxrf9] {
    transform: translateY(-2px);
    box-shadow: var(--au-shadow);
}

.drill-kpi-card.active[b-erzf9pxrf9] {
    transform: translateY(-2px);
    box-shadow: var(--au-shadow);
}

.drill-kpi-top[b-erzf9pxrf9] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 12px;
}

.drill-icon[b-erzf9pxrf9] {
    width: 30px;
    height: 30px;
    border-radius: 9px;
    display: grid;
    place-items: center;
    font-size: 13px;
}

.drill-arrow[b-erzf9pxrf9] {
    font-size: 11px;
    opacity: .35;
}

.drill-label[b-erzf9pxrf9] {
    display: block;
    font-size: 11px;
    font-weight: 800;
    opacity: .62;
    margin-bottom: 4px;
}

.drill-kpi-card > strong[b-erzf9pxrf9] {
    display: block;
    font-size: 20px;
    line-height: 1.1;
    letter-spacing: -.025em;
}

.drill-kpi-card > small[b-erzf9pxrf9] {
    display: block;
    margin-top: 6px;
    font-size: 10px;
    opacity: .52;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.drill-icon.neutral[b-erzf9pxrf9] {
    background: var(--au-slate-soft);
    color: var(--au-slate);
}

.drill-icon.completed[b-erzf9pxrf9] {
    background: var(--au-green-soft);
    color: var(--au-green);
}

.drill-icon.draft[b-erzf9pxrf9] {
    background: var(--au-amber-soft);
    color: var(--au-amber);
}

.drill-icon.excluded[b-erzf9pxrf9] {
    background: var(--au-slate-soft);
    color: var(--au-slate);
}

.drill-icon.upsale[b-erzf9pxrf9] {
    background: var(--au-red-soft);
    color: var(--au-red);
}

.drill-icon.sales[b-erzf9pxrf9] {
    background: rgba(25, 25, 28, .09);
    color: currentColor;
}

.drill-relevant.active[b-erzf9pxrf9] {
    border-color: rgba(104, 112, 124, .55);
}

.drill-completed.active[b-erzf9pxrf9] {
    border-color: var(--au-green);
    background: var(--au-green-soft);
}

.drill-draft.active[b-erzf9pxrf9] {
    border-color: var(--au-amber);
    background: var(--au-amber-soft);
}

.drill-excluded.active[b-erzf9pxrf9] {
    border-color: rgba(104, 112, 124, .55);
    background: var(--au-slate-soft);
}

.drill-upsale.active[b-erzf9pxrf9] {
    border-color: var(--au-red);
    background: var(--au-red-soft);
}

.drill-sales.active[b-erzf9pxrf9] {
    border-color: rgba(40, 40, 44, .35);
    background: rgba(40, 40, 44, .065);
}

/* =========================================================
   DRILL PANEL
========================================================= */

.drill-panel[b-erzf9pxrf9] {
    border-top: 3px solid var(--au-red);
    box-shadow: var(--au-shadow);
}

.drill-panel-head[b-erzf9pxrf9] {
    display: flex;
    justify-content: space-between;
    gap: 20px;
    align-items: center;
    padding-bottom: 15px;
    margin-bottom: 15px;
    border-bottom: 1px solid var(--au-border);
}

.drill-panel-count[b-erzf9pxrf9] {
    min-width: 62px;
    text-align: right;
    font-size: 28px;
    font-weight: 900;
    letter-spacing: -.04em;
}

.overview-grid[b-erzf9pxrf9],
.draft-summary-grid[b-erzf9pxrf9],
.upsale-summary[b-erzf9pxrf9] {
    display: grid;
    gap: 10px;
    margin-bottom: 16px;
}

.overview-grid[b-erzf9pxrf9] {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.overview-item[b-erzf9pxrf9] {
    appearance: none;
    color: inherit;
    text-align: left;
    border: 1px solid var(--au-border);
    border-radius: 12px;
    background: var(--au-surface-2);
    padding: 14px;
    cursor: pointer;
}

.overview-item span[b-erzf9pxrf9],
.draft-summary-card span[b-erzf9pxrf9],
.upsale-summary span[b-erzf9pxrf9] {
    display: block;
    font-size: 11px;
    font-weight: 800;
    opacity: .62;
}

.overview-item strong[b-erzf9pxrf9],
.draft-summary-card strong[b-erzf9pxrf9],
.upsale-summary strong[b-erzf9pxrf9] {
    display: block;
    margin-top: 4px;
    font-size: 22px;
}

.overview-item small[b-erzf9pxrf9],
.draft-summary-card small[b-erzf9pxrf9] {
    display: block;
    margin-top: 4px;
    font-size: 10px;
    opacity: .52;
}

.overview-item.completed[b-erzf9pxrf9] {
    border-color: var(--au-green-border);
    background: var(--au-green-soft);
}

.overview-item.draft[b-erzf9pxrf9] {
    border-color: var(--au-amber-border);
    background: var(--au-amber-soft);
}

.overview-item.excluded[b-erzf9pxrf9] {
    border-color: var(--au-slate-border);
    background: var(--au-slate-soft);
}

.detail-subsection[b-erzf9pxrf9] {
    padding-top: 4px;
}

.detail-subtitle[b-erzf9pxrf9] {
    font-size: 12px;
    font-weight: 800;
    margin-bottom: 9px;
}

.chip-row[b-erzf9pxrf9] {
    display: flex;
    gap: 7px;
    flex-wrap: wrap;
}

.mb-space[b-erzf9pxrf9] {
    margin-bottom: 14px;
}

.type-chip[b-erzf9pxrf9],
.type-pill[b-erzf9pxrf9] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    border-radius: 999px;
    background: var(--au-surface-2);
    border: 1px solid var(--au-border);
    padding: 5px 9px;
    font-size: 10px;
    white-space: nowrap;
}

.type-chip b[b-erzf9pxrf9] {
    font-size: 11px;
}

/* =========================================================
   DRAFT CLASSIFICATION
========================================================= */

.draft-summary-grid[b-erzf9pxrf9] {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.draft-summary-card[b-erzf9pxrf9] {
    border: 1px solid var(--au-border);
    border-radius: 12px;
    padding: 13px;
    background: var(--au-surface-2);
}

.draft-summary-card.draft-no-customer[b-erzf9pxrf9] {
    border-color: var(--au-amber-border);
    background: var(--au-amber-soft);
}

.draft-summary-card.pending-payment[b-erzf9pxrf9] {
    border-color: rgba(57, 118, 212, .28);
    background: rgba(57, 118, 212, .09);
}

.draft-summary-card.customer-incomplete[b-erzf9pxrf9] {
    border-color: var(--au-red-border);
    background: var(--au-red-soft);
}

.draft-summary-card.incomplete[b-erzf9pxrf9] {
    border-color: var(--au-slate-border);
    background: var(--au-slate-soft);
}

.rejection-pill[b-erzf9pxrf9],
.excluded-pill[b-erzf9pxrf9] {
    display: inline-flex;
    border-radius: 999px;
    padding: 4px 8px;
    font-size: 9px;
    font-weight: 800;
    white-space: nowrap;
}

.rejection-pill.draft-no-customer[b-erzf9pxrf9] {
    color: var(--au-amber);
    background: var(--au-amber-soft);
}

.rejection-pill.pending-payment[b-erzf9pxrf9] {
    color: var(--au-blue);
    background: rgba(57, 118, 212, .10);
}

.rejection-pill.customer-incomplete[b-erzf9pxrf9] {
    color: var(--au-red);
    background: var(--au-red-soft);
}

.rejection-pill.incomplete[b-erzf9pxrf9],
.excluded-pill[b-erzf9pxrf9] {
    color: var(--au-slate);
    background: var(--au-slate-soft);
}

/* =========================================================
   UPSALE
========================================================= */

.upsale-summary[b-erzf9pxrf9] {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.upsale-summary > div[b-erzf9pxrf9] {
    border: 1px solid var(--au-red-border);
    background: var(--au-red-soft);
    padding: 13px;
    border-radius: 12px;
}

.upsale-value[b-erzf9pxrf9] {
    color: var(--au-red);
    font-weight: 900;
}

/* =========================================================
   TABLES
========================================================= */

.table-wrap[b-erzf9pxrf9] {
    width: 100%;
    overflow-x: auto;
}

table[b-erzf9pxrf9] {
    width: 100%;
    border-collapse: collapse;
    font-size: 12px;
}

th[b-erzf9pxrf9],
td[b-erzf9pxrf9] {
    padding: 9px 8px;
    text-align: left;
    border-bottom: 1px solid var(--au-border);
    vertical-align: top;
}

th[b-erzf9pxrf9] {
    font-size: 9px;
    text-transform: uppercase;
    letter-spacing: .06em;
    font-weight: 800;
    opacity: .55;
    white-space: nowrap;
}

td small[b-erzf9pxrf9] {
    opacity: .52;
}

tbody tr:hover[b-erzf9pxrf9] {
    background: rgba(127, 127, 127, .04);
}

.num[b-erzf9pxrf9] {
    text-align: right;
    white-space: nowrap;
}

.empty-state[b-erzf9pxrf9] {
    min-height: 160px;
    display: grid;
    place-items: center;
    align-content: center;
    gap: 8px;
    opacity: .6;
}

.empty-state i[b-erzf9pxrf9] {
    font-size: 28px;
}

/* =========================================================
   TECHNICAL AUDIT
========================================================= */

.technical-audit[b-erzf9pxrf9] {
    padding: 0;
    overflow: hidden;
}

.technical-audit > summary[b-erzf9pxrf9] {
    list-style: none;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 14px 18px;
    cursor: pointer;
    font-size: 12px;
    font-weight: 800;
}

.technical-audit > summary[b-erzf9pxrf9]::-webkit-details-marker {
    display: none;
}

.technical-audit > summary strong[b-erzf9pxrf9] {
    min-width: 36px;
    text-align: center;
    border-radius: 999px;
    padding: 4px 8px;
    background: var(--au-slate-soft);
}

.audit-body[b-erzf9pxrf9] {
    border-top: 1px solid var(--au-border);
    padding: 16px 18px 18px;
}

.audit-body > p[b-erzf9pxrf9] {
    margin: 0 0 12px;
    font-size: 11px;
    opacity: .55;
}

.warning-panel[b-erzf9pxrf9] {
    border-style: dashed;
}

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

@media (max-width: 1300px) {
    .drill-kpi-grid[b-erzf9pxrf9] {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 1050px) {
    .summary-grid[b-erzf9pxrf9] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .draft-summary-grid[b-erzf9pxrf9] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 700px) {
    .analytics-upload-page[b-erzf9pxrf9] {
        padding: 16px;
    }

    .upload-zone[b-erzf9pxrf9] {
        grid-template-columns: 50px 1fr;
    }

    .upload-zone input[b-erzf9pxrf9] {
        grid-column: 1 / -1;
    }

    .summary-grid[b-erzf9pxrf9],
    .drill-kpi-grid[b-erzf9pxrf9],
    .overview-grid[b-erzf9pxrf9],
    .draft-summary-grid[b-erzf9pxrf9],
    .upsale-summary[b-erzf9pxrf9] {
        grid-template-columns: 1fr;
    }

    .panel-title[b-erzf9pxrf9],
    .drill-panel-head[b-erzf9pxrf9] {
        align-items: flex-start;
        flex-direction: column;
    }

    .confirm-btn[b-erzf9pxrf9] {
        width: 100%;
    }

    .drill-panel-count[b-erzf9pxrf9] {
        text-align: left;
    }
}


/* =========================================================
   UI POLISH V1.2
   - KPI desktop = 3 x 2
   - clearer visual hierarchy
   - money values never collide
   - cleaner drilldown summary
========================================================= */

.preview-shell[b-erzf9pxrf9] {
    padding: 20px;
}

.preview-title[b-erzf9pxrf9] {
    margin-bottom: 20px;
}

.drill-kpi-grid[b-erzf9pxrf9] {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
}

.drill-kpi-card[b-erzf9pxrf9] {
    min-height: 126px;
    padding: 15px 16px;
    position: relative;
    overflow: hidden;
}

.drill-kpi-card[b-erzf9pxrf9]::after {
    content: "";
    position: absolute;
    inset: auto 0 0 0;
    height: 3px;
    opacity: 0;
    transition: opacity .15s ease;
}

.drill-kpi-card.active[b-erzf9pxrf9]::after {
    opacity: 1;
}

.drill-relevant[b-erzf9pxrf9]::after {
    background: var(--au-slate);
}

.drill-completed[b-erzf9pxrf9]::after {
    background: var(--au-green);
}

.drill-draft[b-erzf9pxrf9]::after {
    background: var(--au-amber);
}

.drill-excluded[b-erzf9pxrf9]::after {
    background: var(--au-slate);
}

.drill-upsale[b-erzf9pxrf9]::after {
    background: var(--au-red);
}

.drill-sales[b-erzf9pxrf9]::after {
    background: #22252a;
}

.drill-kpi-top[b-erzf9pxrf9] {
    margin-bottom: 10px;
}

.drill-label[b-erzf9pxrf9] {
    margin-bottom: 7px;
    font-size: 11px;
    letter-spacing: .025em;
}

.drill-kpi-card > strong[b-erzf9pxrf9] {
    font-size: clamp(22px, 2vw, 30px);
    line-height: 1;
    white-space: nowrap;
    overflow: visible;
    text-overflow: clip;
}

.drill-kpi-card > small[b-erzf9pxrf9] {
    margin-top: 9px;
    font-size: 10.5px;
    line-height: 1.35;
    white-space: normal;
    overflow: visible;
    text-overflow: clip;
}

.drill-upsale[b-erzf9pxrf9] {
    background:
        linear-gradient(135deg, var(--au-red-soft), rgba(227, 27, 43, .025));
}

.drill-upsale > strong[b-erzf9pxrf9] {
    color: var(--au-red);
}

.drill-completed[b-erzf9pxrf9] {
    background:
        linear-gradient(135deg, var(--au-green-soft), rgba(32, 164, 100, .02));
}

.drill-draft[b-erzf9pxrf9] {
    background:
        linear-gradient(135deg, var(--au-amber-soft), rgba(216, 139, 22, .02));
}

.drill-sales[b-erzf9pxrf9] {
    background:
        linear-gradient(135deg, rgba(35, 38, 43, .075), rgba(35, 38, 43, .02));
}

.drill-panel[b-erzf9pxrf9] {
    padding: 20px;
}

.drill-panel-head[b-erzf9pxrf9] {
    min-height: 72px;
}

.drill-panel-count[b-erzf9pxrf9] {
    min-width: 90px;
    font-size: 34px;
    line-height: 1;
}

.overview-grid[b-erzf9pxrf9] {
    gap: 12px;
}

.overview-item[b-erzf9pxrf9] {
    min-height: 118px;
    padding: 16px 18px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.overview-item span[b-erzf9pxrf9] {
    margin-bottom: 7px;
}

.overview-item strong[b-erzf9pxrf9] {
    margin: 0;
    font-size: 31px;
    line-height: 1;
    letter-spacing: -.035em;
}

.overview-item small[b-erzf9pxrf9] {
    margin-top: 8px;
    font-size: 11px;
    font-weight: 700;
    opacity: .60;
}

.overview-item.completed strong[b-erzf9pxrf9] {
    color: var(--au-green);
}

.overview-item.draft strong[b-erzf9pxrf9] {
    color: var(--au-amber);
}

.draft-summary-card[b-erzf9pxrf9] {
    min-height: 105px;
}

.draft-summary-card strong[b-erzf9pxrf9] {
    font-size: 28px;
    line-height: 1;
}

.upsale-summary > div[b-erzf9pxrf9] {
    min-height: 105px;
}

.upsale-summary strong[b-erzf9pxrf9] {
    font-size: clamp(20px, 2vw, 28px);
    line-height: 1.1;
    color: var(--au-red);
    white-space: nowrap;
}

.type-chip[b-erzf9pxrf9] {
    padding: 6px 10px;
}

.table-wrap[b-erzf9pxrf9] {
    margin-top: 2px;
}

table[b-erzf9pxrf9] {
    font-size: 12.5px;
}

th[b-erzf9pxrf9] {
    padding-top: 11px;
    padding-bottom: 11px;
}

td[b-erzf9pxrf9] {
    padding-top: 11px;
    padding-bottom: 11px;
}

.technical-audit[b-erzf9pxrf9] {
    margin-top: 4px;
    opacity: .92;
}

/* Make primary action feel separate from exploration */
.confirm-btn[b-erzf9pxrf9] {
    min-width: 150px;
}

/* Desktop wide: keep the six KPI cards balanced */
@media (min-width: 1450px) {
    .drill-kpi-grid[b-erzf9pxrf9] {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .drill-kpi-card[b-erzf9pxrf9] {
        min-height: 132px;
    }
}

/* Medium screens remain 2 columns instead of squeezing 3 */
@media (max-width: 1050px) {
    .drill-kpi-grid[b-erzf9pxrf9] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

/* Mobile */
@media (max-width: 700px) {
    .drill-kpi-grid[b-erzf9pxrf9] {
        grid-template-columns: 1fr;
    }

    .drill-kpi-card[b-erzf9pxrf9] {
        min-height: 112px;
    }

    .drill-kpi-card > strong[b-erzf9pxrf9] {
        font-size: 27px;
    }

    .overview-item[b-erzf9pxrf9] {
        min-height: 100px;
    }
}


/* =========================================================
   UI POLISH V1.3 — FINAL TARGET
   Matched to approved mockup
========================================================= */

/* ---------- Store Sales shell ---------- */
.preview-shell[b-erzf9pxrf9] {
    padding: 20px 18px 16px;
}

.preview-title[b-erzf9pxrf9] {
    align-items: center;
    margin-bottom: 18px;
}

/* ---------- KPI 3 x 2 ---------- */
.drill-kpi-grid[b-erzf9pxrf9] {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 12px !important;
}

.drill-kpi-card[b-erzf9pxrf9] {
    min-height: 138px;
    padding: 16px 18px;
    display: grid;
    grid-template-columns: 64px minmax(0, 1fr);
    grid-template-rows: auto auto auto;
    column-gap: 16px;
    align-items: center;
    border-radius: 14px;
    overflow: hidden;
}

.drill-kpi-top[b-erzf9pxrf9] {
    grid-column: 1;
    grid-row: 1 / span 3;
    margin: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}

.drill-icon[b-erzf9pxrf9] {
    width: 58px;
    height: 58px;
    border-radius: 18px;
    font-size: 27px;
}

.drill-arrow[b-erzf9pxrf9] {
    display: none;
}

.drill-label[b-erzf9pxrf9] {
    grid-column: 2;
    grid-row: 1;
    margin: 0 0 3px;
    font-size: 15px;
    line-height: 1.2;
    font-weight: 850;
    letter-spacing: -.01em;
    opacity: .96;
    text-align: center;
}

.drill-kpi-card > strong[b-erzf9pxrf9] {
    grid-column: 2;
    grid-row: 2;
    display: block;
    margin: 0;
    font-size: clamp(34px, 3vw, 46px);
    line-height: 1;
    font-weight: 900;
    letter-spacing: -.045em;
    text-align: center;
    white-space: nowrap;
}

.drill-kpi-card > small[b-erzf9pxrf9] {
    grid-column: 2;
    grid-row: 3;
    margin-top: 7px;
    font-size: 12px;
    line-height: 1.25;
    font-weight: 650;
    text-align: center;
    opacity: .72;
    white-space: normal;
}

/* ---------- Card surfaces ---------- */
.drill-relevant[b-erzf9pxrf9] {
    background: linear-gradient(135deg, rgba(104,112,124,.09), rgba(104,112,124,.025));
}

.drill-completed[b-erzf9pxrf9] {
    border-color: rgba(32,164,100,.25);
    background: linear-gradient(135deg, rgba(32,164,100,.10), rgba(32,164,100,.025));
}

.drill-draft[b-erzf9pxrf9] {
    border-color: rgba(235,132,16,.28);
    background: linear-gradient(135deg, rgba(235,132,16,.105), rgba(235,132,16,.025));
}

.drill-excluded[b-erzf9pxrf9] {
    background: linear-gradient(135deg, rgba(104,112,124,.09), rgba(104,112,124,.025));
}

.drill-upsale[b-erzf9pxrf9] {
    border-color: rgba(227,27,43,.24);
    background: linear-gradient(135deg, rgba(227,27,43,.10), rgba(227,27,43,.025));
}

.drill-sales[b-erzf9pxrf9] {
    background: linear-gradient(135deg, rgba(40,44,50,.09), rgba(40,44,50,.02));
}

/* ---------- Strong status colors ---------- */
.drill-completed > strong[b-erzf9pxrf9] {
    color: var(--au-green);
}

.drill-draft > strong[b-erzf9pxrf9] {
    color: #ef6c00;
}

.drill-upsale > strong[b-erzf9pxrf9] {
    color: var(--au-red);
    font-size: clamp(31px, 2.7vw, 42px);
}

.drill-sales > strong[b-erzf9pxrf9] {
    color: #15191f;
    font-size: clamp(31px, 2.7vw, 42px);
}

.drill-completed .drill-icon[b-erzf9pxrf9] {
    background: rgba(32,164,100,.14);
    color: var(--au-green);
}

.drill-draft .drill-icon[b-erzf9pxrf9] {
    background: rgba(235,132,16,.14);
    color: #ef6c00;
}

.drill-upsale .drill-icon[b-erzf9pxrf9] {
    background: rgba(227,27,43,.13);
    color: var(--au-red);
}

.drill-sales .drill-icon[b-erzf9pxrf9] {
    background: rgba(52,58,66,.10);
    color: #3f4852;
}

/* ---------- Selected card ---------- */
.drill-kpi-card.active[b-erzf9pxrf9] {
    box-shadow: 0 8px 22px rgba(0,0,0,.065);
}

.drill-completed.active[b-erzf9pxrf9] {
    border-color: rgba(32,164,100,.62);
}

.drill-draft.active[b-erzf9pxrf9] {
    border-color: #ef9200;
}

.drill-upsale.active[b-erzf9pxrf9] {
    border-color: var(--au-red);
}

.drill-sales.active[b-erzf9pxrf9] {
    border-color: rgba(30,34,40,.45);
}

/* ---------- Detail panel dynamic accent ---------- */
.drill-panel[b-erzf9pxrf9] {
    border-top-width: 3px;
    border-top-style: solid;
}

.drill-panel.accent-relevant[b-erzf9pxrf9] {
    border-top-color: var(--au-slate);
}

.drill-panel.accent-completed[b-erzf9pxrf9] {
    border-top-color: var(--au-green);
}

.drill-panel.accent-draft[b-erzf9pxrf9] {
    border-top-color: #ef6c00;
}

.drill-panel.accent-excluded[b-erzf9pxrf9] {
    border-top-color: var(--au-slate);
}

.drill-panel.accent-upsale[b-erzf9pxrf9] {
    border-top-color: var(--au-red);
}

.drill-panel.accent-sales[b-erzf9pxrf9] {
    border-top-color: #22272e;
}

/* Detail top number follows active state */
.accent-completed .drill-panel-count[b-erzf9pxrf9] {
    color: var(--au-green);
}
.accent-draft .drill-panel-count[b-erzf9pxrf9] {
    color: #ef6c00;
}
.accent-upsale .drill-panel-count[b-erzf9pxrf9] {
    color: var(--au-red);
}

/* ---------- Open/Draft summary ---------- */
.draft-summary-grid[b-erzf9pxrf9] {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
}

.draft-summary-card[b-erzf9pxrf9] {
    min-height: 110px;
    padding: 14px 16px;
}

.draft-summary-card span[b-erzf9pxrf9] {
    font-size: 12px;
    font-weight: 800;
}

.draft-summary-card strong[b-erzf9pxrf9] {
    margin-top: 5px;
    font-size: 30px;
    font-weight: 900;
}

.draft-summary-card small[b-erzf9pxrf9] {
    margin-top: 6px;
    font-size: 11px;
}

/* ---------- Technical audit ---------- */
.technical-audit > summary[b-erzf9pxrf9] {
    min-height: 48px;
}

/* ---------- Responsive ---------- */
@media (max-width: 1100px) {
    .drill-kpi-grid[b-erzf9pxrf9] {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 700px) {
    .drill-kpi-grid[b-erzf9pxrf9] {
        grid-template-columns: 1fr !important;
    }

    .drill-kpi-card[b-erzf9pxrf9] {
        min-height: 126px;
        grid-template-columns: 56px minmax(0, 1fr);
        column-gap: 13px;
    }

    .drill-icon[b-erzf9pxrf9] {
        width: 52px;
        height: 52px;
        font-size: 23px;
    }

    .drill-kpi-card > strong[b-erzf9pxrf9] {
        font-size: 34px;
    }

    .draft-summary-grid[b-erzf9pxrf9] {
        grid-template-columns: 1fr;
    }
}
/* /Components/Pages/Admin/Analytics/AreaAnalytics.razor.rz.scp.css */
.area-page[b-bkhj5gvh8k]{min-height:100vh;padding:22px;background:#10131a;color:#f4f7fb;font-family:'Prompt',sans-serif}.area-hero[b-bkhj5gvh8k]{display:flex;justify-content:space-between;padding:28px 32px;border:1px solid #2c3342;border-radius:20px;background:radial-gradient(circle at 82% 5%,rgba(181,30,255,.28),transparent 42%),#080a0f}.area-hero span[b-bkhj5gvh8k],.geo-panel header span[b-bkhj5gvh8k]{color:#25e5ea;font:.7rem Consolas;letter-spacing:.14em}.area-hero h1[b-bkhj5gvh8k]{margin:5px 0;font-size:2.3rem}.area-hero p[b-bkhj5gvh8k]{margin:0;color:#9aa3b2}.area-hero a[b-bkhj5gvh8k]{color:#fff;text-decoration:none}.area-filter[b-bkhj5gvh8k]{display:flex;align-items:end;gap:12px;padding:14px;margin:15px 0;border:1px solid #2d3442;border-radius:14px;background:#191d26}.area-filter label[b-bkhj5gvh8k]{display:grid;gap:5px;color:#adb5c3;font-size:.78rem}.area-filter input[b-bkhj5gvh8k]{padding:8px;border:1px solid #3a4253;border-radius:7px;background:#0d1016;color:#fff}.area-filter button[b-bkhj5gvh8k]{padding:10px 18px;border:0;border-radius:8px;background:linear-gradient(90deg,#ff27bc,#812dff,#13dce6);color:#fff;font-weight:900}.area-kpis[b-bkhj5gvh8k]{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.area-kpis article[b-bkhj5gvh8k],.geo-panel[b-bkhj5gvh8k]{border:1px solid #2d3442;border-radius:16px;background:#07090d;box-shadow:0 14px 28px rgba(0,0,0,.18)}.area-kpis article[b-bkhj5gvh8k]{padding:18px;background:linear-gradient(145deg,#090b11,#171325)}.area-kpis span[b-bkhj5gvh8k],.area-kpis small[b-bkhj5gvh8k]{display:block;color:#9099aa;font-size:.7rem}.area-kpis strong[b-bkhj5gvh8k]{display:block;margin:6px 0;font-size:1.65rem}.area-grid[b-bkhj5gvh8k]{display:grid;grid-template-columns:1.55fr 1fr;gap:14px;margin-top:14px}.geo-panel[b-bkhj5gvh8k]{padding:18px;overflow:hidden}.geo-panel h2[b-bkhj5gvh8k]{margin:4px 0 14px}.map-panel[b-bkhj5gvh8k]{min-height:640px}
.thai-map[b-bkhj5gvh8k]{position:relative;height:720px;border:1px solid #263044;border-radius:16px;overflow:hidden;background:radial-gradient(circle at 50% 43%,rgba(37,229,234,.11),transparent 30%),radial-gradient(circle at 65% 24%,rgba(174,41,255,.1),transparent 28%),linear-gradient(rgba(36,48,67,.24) 1px,transparent 1px),linear-gradient(90deg,rgba(36,48,67,.24) 1px,transparent 1px),#090c13;background-size:auto,auto,34px 34px,34px 34px}.thai-map[b-bkhj5gvh8k]:after{content:"THAILAND DATA TERRAIN";position:absolute;right:14px;bottom:10px;color:#354157;font:.65rem Consolas;letter-spacing:.18em}.thai-map[b-bkhj5gvh8k]  .province-map-svg{display:block;width:100%;height:100%}.thai-map[b-bkhj5gvh8k]  .province-land{stroke:#44516c;stroke-width:.7;vector-effect:non-scaling-stroke;transition:fill .2s,filter .2s}.thai-map[b-bkhj5gvh8k]  .province-land:hover{stroke:#fff;stroke-width:1.5;filter:url(#provinceGlow)}.thai-map[b-bkhj5gvh8k]  .province-land.has-data{stroke:#1edce7}.thai-map[b-bkhj5gvh8k]  .bubble-wave{fill:none;stroke:#25e5ea;stroke-width:1;opacity:.45;animation:geo-pulse-b-bkhj5gvh8k 2.2s ease-out infinite}.thai-map[b-bkhj5gvh8k]  .bubble-core{fill:#ff2abd;stroke:#fff;stroke-width:1.2;filter:url(#provinceGlow)}.thai-map[b-bkhj5gvh8k]  .province-datum{cursor:pointer}.thai-map[b-bkhj5gvh8k]  .bubble-label{fill:#fff;font:700 11px 'Prompt',sans-serif;paint-order:stroke;stroke:#080b12;stroke-width:3px}.thai-map[b-bkhj5gvh8k]  .bubble-count{fill:#25e5ea;font:9px Consolas;paint-order:stroke;stroke:#080b12;stroke-width:3px}.thai-map[b-bkhj5gvh8k]  .map-watermark{fill:#536078;font:10px Consolas;letter-spacing:2px}@keyframes geo-pulse-b-bkhj5gvh8k{0%{opacity:.7}100%{r:38px;opacity:0}}
.province-bubble[b-bkhj5gvh8k]{position:absolute;z-index:2;width:var(--bubble);height:var(--bubble);padding:0;transform:translate(-50%,-50%);border:1px solid rgba(255,255,255,.85);border-radius:50%;background:radial-gradient(circle at 32% 26%,#fff 0 6%,#21e5e8 11%,#792cff 57%,#ff22b8);box-shadow:0 0 0 5px rgba(44,224,230,.11),0 0 22px #7f2cff;cursor:pointer}.province-bubble i[b-bkhj5gvh8k]{position:absolute;inset:0;border-radius:50%;animation:pulse-map-b-bkhj5gvh8k 2.4s infinite}.province-bubble span[b-bkhj5gvh8k],.province-bubble b[b-bkhj5gvh8k]{position:absolute;left:50%;opacity:0;pointer-events:none;white-space:nowrap;transform:translate(-50%,6px);transition:.18s}.province-bubble span[b-bkhj5gvh8k]{bottom:calc(100% + 24px);padding:6px 9px;border:1px solid #3b4760;border-radius:7px;background:#080b12;color:#fff;font-weight:800}.province-bubble b[b-bkhj5gvh8k]{bottom:calc(100% + 7px);color:#24e5e8}.province-bubble:hover[b-bkhj5gvh8k]{z-index:8;transform:translate(-50%,-50%) scale(1.18)}.province-bubble:hover span[b-bkhj5gvh8k],.province-bubble:hover b[b-bkhj5gvh8k]{opacity:1;transform:translate(-50%,0)}@keyframes pulse-map-b-bkhj5gvh8k{70%{box-shadow:0 0 0 18px rgba(40,224,230,0)}}
.map-note[b-bkhj5gvh8k]{display:block;margin-top:8px;color:#778193}.area-rank[b-bkhj5gvh8k]{display:grid;grid-template-columns:30px minmax(0,1fr) 110px;gap:9px;align-items:center;margin:10px 0}.area-rank>b[b-bkhj5gvh8k]{color:#d52cff}.area-rank span[b-bkhj5gvh8k]{display:grid;min-width:0}.area-rank strong[b-bkhj5gvh8k]{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.area-rank span:last-child[b-bkhj5gvh8k]{text-align:right}.area-rank i[b-bkhj5gvh8k],.channel span[b-bkhj5gvh8k]{height:6px;border-radius:8px;background:#222838;overflow:hidden}.area-rank em[b-bkhj5gvh8k],.channel i[b-bkhj5gvh8k]{display:block;height:100%;background:linear-gradient(90deg,#ff24bc,#7e2cff,#1edee6)}.area-rank small[b-bkhj5gvh8k]{color:#8993a4}.spark-bars[b-bkhj5gvh8k]{display:flex;align-items:end;gap:5px;height:180px;padding-top:20px}.spark-bars>i[b-bkhj5gvh8k]{flex:1;min-width:3px;background:linear-gradient(#1de5eb,#8b2cff 60%,#ff29b7);border-radius:5px 5px 0 0}.spark-bars b[b-bkhj5gvh8k]{display:block;height:22%;background:#ffb316}.channel>div[b-bkhj5gvh8k]{display:grid;grid-template-columns:120px 1fr 55px;gap:8px;margin:13px 0;font-size:.78rem}.channel span[b-bkhj5gvh8k]{height:13px}.districts[b-bkhj5gvh8k]{grid-column:1/-1}.districts>div[b-bkhj5gvh8k]{display:grid;grid-template-columns:1fr 100px 130px;padding:9px;border-bottom:1px solid #242a36}.districts small[b-bkhj5gvh8k]{color:#7e8898}.quality[b-bkhj5gvh8k]{text-align:center}.quality-ring[b-bkhj5gvh8k]{display:grid;place-content:center;width:180px;height:180px;margin:20px auto;border-radius:50%;background:radial-gradient(circle,#090b10 58%,transparent 59%),conic-gradient(#20e3cf calc(var(--quality)*1%),#272c38 0)}.quality-ring strong[b-bkhj5gvh8k]{font-size:2rem}.quality-ring span[b-bkhj5gvh8k]{color:#8c96a6}.area-error[b-bkhj5gvh8k]{padding:15px;color:#ff7185}@media(max-width:900px){.area-kpis[b-bkhj5gvh8k]{grid-template-columns:1fr 1fr}.area-grid[b-bkhj5gvh8k]{grid-template-columns:1fr}.districts[b-bkhj5gvh8k]{grid-column:auto}}@media(max-width:600px){.area-page[b-bkhj5gvh8k]{padding:9px}.area-filter[b-bkhj5gvh8k]{flex-wrap:wrap}.area-kpis[b-bkhj5gvh8k]{grid-template-columns:1fr 1fr}.map-panel[b-bkhj5gvh8k]{min-height:500px}.thai-map[b-bkhj5gvh8k]{height:440px}}
.area-filter select[b-bkhj5gvh8k]{padding:8px;min-width:180px;border:1px solid #3a4253;border-radius:7px;background:#0d1016;color:#fff}.region-tabs[b-bkhj5gvh8k]{display:grid;grid-template-columns:repeat(7,1fr);gap:8px;margin:0 0 14px}.region-tabs button[b-bkhj5gvh8k],.map-toolbar button[b-bkhj5gvh8k]{border:1px solid #30394b;border-radius:10px;background:#0a0d14;color:#929daf;padding:10px;cursor:pointer}.region-tabs button b[b-bkhj5gvh8k]{display:block;margin-top:3px;color:#fff}.region-tabs button.active[b-bkhj5gvh8k]{border-color:#23dfe8;color:#23dfe8;background:linear-gradient(145deg,rgba(34,225,231,.15),rgba(135,42,255,.14));box-shadow:0 0 20px rgba(35,223,232,.12)}.map-toolbar[b-bkhj5gvh8k]{display:flex;gap:6px;margin:-4px 0 10px}.map-toolbar button[b-bkhj5gvh8k]{padding:6px 11px}.product-panel[b-bkhj5gvh8k],.category-panel[b-bkhj5gvh8k]{min-height:340px}.product-row[b-bkhj5gvh8k]{display:grid;grid-template-columns:minmax(0,1fr) 90px 120px;gap:12px;align-items:center;padding:10px 0;border-bottom:1px solid #202735}.product-row span[b-bkhj5gvh8k]{display:grid;min-width:0}.product-row strong[b-bkhj5gvh8k]{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.product-row small[b-bkhj5gvh8k]{color:#7f899b}.product-row em[b-bkhj5gvh8k]{color:#24e1e7;font-style:normal;text-align:right}.category-panel>div[b-bkhj5gvh8k]{display:grid;grid-template-columns:130px 1fr 55px;gap:10px;align-items:center;margin:14px 0}.category-panel i[b-bkhj5gvh8k]{height:14px;border-radius:9px;background:#202636;overflow:hidden}.category-panel em[b-bkhj5gvh8k]{display:block;height:100%;background:linear-gradient(90deg,#ff26bd,#7e2cff,#20dfe7)}@media(max-width:900px){.region-tabs[b-bkhj5gvh8k]{grid-template-columns:repeat(4,1fr)}}
/* /Components/Pages/Admin/Analytics/DerivedSalesAnalytics.razor.rz.scp.css */
.derived-page[b-fex55c3r3s] {
    min-height: 100vh;
    padding: 22px;
    color: #20242a;
    font-family: 'Prompt', sans-serif;
}

/* HQ revision: dense neon analysis modules */
.replacement-gallery[b-fex55c3r3s] { grid-template-columns: 1fr !important; }
.bill-area[b-fex55c3r3s] { fill: rgba(255,194,29,.12); }
.bill-line[b-fex55c3r3s] { fill:none;stroke:#ffc21d;stroke-width:3;filter:drop-shadow(0 0 6px rgba(255,194,29,.45)); }
.wave-legend i[b-fex55c3r3s] { display:inline-block;width:22px;height:3px;background:#ffc21d;margin-left:18px;vertical-align:middle; }
.hq-analysis-grid[b-fex55c3r3s] { display:grid;grid-template-columns:1fr 1fr;gap:14px;margin:14px 0; }
.price-range-list[b-fex55c3r3s] { display:grid;gap:16px;padding:8px 0; }
.price-range-list>div[b-fex55c3r3s] { display:grid;grid-template-columns:150px 1fr 82px 48px 110px;gap:12px;align-items:center;font-size:12px; }
.price-range-list i[b-fex55c3r3s] { height:9px;background:#161e30;border-radius:99px;overflow:hidden; }
.price-range-list em[b-fex55c3r3s] { display:block;height:100%;background:linear-gradient(90deg,#37e8ff,#8b5cf6,#ff32bd);box-shadow:0 0 12px #8b5cf6; }
.price-range-list strong[b-fex55c3r3s] { color:#38e8ff;font-size:18px; }.price-range-list small[b-fex55c3r3s]{text-align:right;color:#8995aa}
.thai-map-layout[b-fex55c3r3s] { display:grid;grid-template-columns:230px 1fr;gap:22px;align-items:center; }
.thai-silhouette[b-fex55c3r3s] { position:relative;height:300px;margin:auto;width:155px;background:linear-gradient(150deg,#293452,#11182a);clip-path:polygon(43% 0,65% 9%,72% 24%,94% 35%,72% 48%,65% 60%,76% 75%,61% 100%,46% 83%,45% 65%,27% 54%,7% 38%,24% 21%);filter:drop-shadow(0 0 18px #19dfff55); }
.thai-silhouette span[b-fex55c3r3s] { position:absolute;padding:4px 7px;border:1px solid #31e5ff;border-radius:20px;background:#070c16;color:#eafcff;font-size:9px;box-shadow:0 0 10px #31e5ff66; }
.thai-silhouette .north[b-fex55c3r3s]{top:10%;left:28%}.thai-silhouette .north-east[b-fex55c3r3s]{top:30%;right:2%}.thai-silhouette .central[b-fex55c3r3s]{top:46%;left:30%}.thai-silhouette .east[b-fex55c3r3s]{top:53%;right:0}.thai-silhouette .west[b-fex55c3r3s]{top:38%;left:0}.thai-silhouette .south[b-fex55c3r3s]{bottom:12%;left:40%}
.region-list[b-fex55c3r3s]{display:grid;gap:8px}.region-list>div[b-fex55c3r3s]{display:grid;grid-template-columns:10px 1fr 80px 44px;gap:10px;align-items:center;padding:10px;border-bottom:1px solid #172238}.region-list i[b-fex55c3r3s]{width:9px;height:9px;border-radius:50%}.region-list strong[b-fex55c3r3s]{color:#38e8ff;font-size:17px}.region-list span[b-fex55c3r3s]{color:#8490a4}
.top-bills-card[b-fex55c3r3s],.all-category-top5[b-fex55c3r3s]{margin-top:14px}.top-bill-grid[b-fex55c3r3s]{display:grid;grid-template-columns:repeat(5,1fr);gap:10px}.top-bill-grid article[b-fex55c3r3s]{display:grid;gap:8px;padding:16px;border:1px solid #24324a;border-radius:14px;background:linear-gradient(145deg,#11192a,#080c14)}.top-bill-grid article>span[b-fex55c3r3s]{color:#ff32bd;font-weight:900}.top-bill-grid strong[b-fex55c3r3s]{font-size:22px;color:#38e8ff}.top-bill-grid small[b-fex55c3r3s]{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:#8b96aa}.top-bill-grid em[b-fex55c3r3s]{font-style:normal;color:#ffc21d;font-size:11px}
.category-top5-grid[b-fex55c3r3s]{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.category-top5-grid article[b-fex55c3r3s]{border:1px solid #1b2940;border-radius:14px;background:#090f1a;padding:12px}.category-top5-grid h3[b-fex55c3r3s]{display:flex;gap:9px;align-items:center;margin:0 0 8px;color:#fff}.category-top5-grid article>div[b-fex55c3r3s]{display:grid;grid-template-columns:22px minmax(0,1fr) 65px 88px;gap:8px;padding:8px 0;border-top:1px solid #172238;align-items:center}.category-top5-grid b[b-fex55c3r3s]{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.category-top5-grid small[b-fex55c3r3s]{color:#8995aa}.category-top5-grid strong[b-fex55c3r3s]{text-align:right;color:#38e8ff}
.hq-command-page .channel-donut[b-fex55c3r3s]{filter:drop-shadow(0 0 12px rgba(56,232,255,.28));border:5px solid #0a101b}
.hq-command-page .channel-donut>div[b-fex55c3r3s]{display:none}.hq-command-page .channel-donut[b-fex55c3r3s]{box-shadow:inset 0 0 0 3px #080d17,0 0 22px #38e8ff33}
.revenue-flow-card[b-fex55c3r3s]{border:1px solid #17321d;border-radius:18px;background:radial-gradient(circle at 75% 50%,#152715 0,#080d0a 42%,#050807 100%);padding:16px;overflow:hidden}.revenue-flow-card header[b-fex55c3r3s]{display:flex;gap:12px;align-items:baseline}.revenue-flow-card h3[b-fex55c3r3s]{margin:0;color:#efffe8}.revenue-flow-card header small[b-fex55c3r3s]{margin-left:auto;color:#6e876e}.revenue-flow-layout[b-fex55c3r3s]{display:grid;grid-template-columns:190px minmax(360px,1fr) 240px;align-items:center;min-height:300px}.flow-labels[b-fex55c3r3s]{display:grid;gap:5px}.flow-labels>div[b-fex55c3r3s]{display:grid;grid-template-columns:24px 1fr;gap:8px;padding:6px 8px;border:1px solid #294024;border-radius:7px;color:#a8ff55;background:#071007}.flow-labels strong[b-fex55c3r3s]{grid-column:2;color:#68a83e;font-size:11px}.flow-lines[b-fex55c3r3s]{width:100%;height:300px;overflow:visible}.flow-lines path[b-fex55c3r3s]{fill:none;stroke-width:1.25;opacity:.55;filter:url(#flowGlow)}.flow-total[b-fex55c3r3s]{width:205px;height:205px;border:3px solid #72ff27;border-radius:50%;display:flex;flex-direction:column;align-items:center;justify-content:center;box-shadow:0 0 18px #72ff2766,inset 0 0 24px #72ff2722;outline:1px solid #72ff2766;outline-offset:10px}.flow-total span[b-fex55c3r3s]{color:#a7c699;font-size:11px}.flow-total strong[b-fex55c3r3s]{color:#8cff43;font-size:28px;text-shadow:0 0 12px #71ff28}
.bill-volume-card[b-fex55c3r3s]{margin-top:14px;border:1px solid #163252;border-radius:18px;background:linear-gradient(180deg,#090e1b,#061126);padding:16px}.bill-volume-card header[b-fex55c3r3s]{display:flex;justify-content:space-between}.bill-volume-card h3[b-fex55c3r3s]{margin:2px 0;color:#fff}.bill-volume-card header>strong[b-fex55c3r3s]{color:#38e8ff;font-size:20px}.bill-bars[b-fex55c3r3s]{display:flex;align-items:end;gap:5px;height:210px;padding-top:26px;border-bottom:1px solid #1e68a3;background:repeating-linear-gradient(to bottom,transparent 0,transparent 48px,#18304a55 49px)}.bill-bars>div[b-fex55c3r3s]{flex:1;height:100%;display:flex;flex-direction:column;justify-content:flex-end;align-items:center;min-width:5px}.bill-bars i[b-fex55c3r3s]{position:relative;width:min(18px,75%);min-height:4px;background:linear-gradient(#8dffff,#16dfff 45%,#1478ff);box-shadow:0 0 12px #19dfff88;border-radius:3px 3px 0 0}.bill-bars i span[b-fex55c3r3s]{display:none;position:absolute;bottom:calc(100% + 5px);left:50%;transform:translateX(-50%);font-style:normal;color:#dffcff;font-size:9px}.bill-bars i:hover span[b-fex55c3r3s]{display:block}.bill-bars small[b-fex55c3r3s]{height:18px;margin-top:5px;color:#71839b;font-size:8px}
.platform-pie-wrap[b-fex55c3r3s]{min-height:300px}.platform-pie[b-fex55c3r3s]{width:100%;height:300px;overflow:visible}.platform-pie path:not(.pie-leader)[b-fex55c3r3s]{stroke:#080d17;stroke-width:4;filter:drop-shadow(0 0 8px rgba(40,220,255,.3));transition:transform .2s}.platform-pie path:not(.pie-leader):hover[b-fex55c3r3s]{filter:drop-shadow(0 0 14px #fff8)}.platform-pie .pie-leader[b-fex55c3r3s]{fill:none;stroke:#8fa1ba;stroke-width:1}.platform-pie text[b-fex55c3r3s]{fill:#94a2b8;font-size:9px}.platform-pie .pie-percent[b-fex55c3r3s]{fill:#38e8ff;font-size:15px;font-weight:900}
.hq-analysis-grid .full-span[b-fex55c3r3s]{grid-column:1/-1}.thai-region-map[b-fex55c3r3s]{height:390px;width:260px;overflow:visible;filter:drop-shadow(0 0 14px #1edfff44)}.map-region[b-fex55c3r3s]{stroke:#07101c;stroke-width:5;transition:filter .2s,transform .2s;transform-origin:center}.map-region:hover[b-fex55c3r3s]{filter:brightness(1.45) drop-shadow(0 0 9px currentColor);transform:scale(1.02)}.map-region.north[b-fex55c3r3s]{fill:#38e8ff}.map-region.northeast[b-fex55c3r3s]{fill:#8b5cf6}.map-region.central[b-fex55c3r3s]{fill:#ff32bd}.map-region.east[b-fex55c3r3s]{fill:#2ee6b8}.map-region.west[b-fex55c3r3s]{fill:#ff8a3d}.map-region.south[b-fex55c3r3s]{fill:#ffc21d}.map-labels text[b-fex55c3r3s]{fill:#04101b;font-size:12px;font-weight:900;text-anchor:middle;pointer-events:none}
.top-bill-grid article[b-fex55c3r3s]{padding:0;overflow:hidden}.top-bill-grid article>button[b-fex55c3r3s]{border:0;background:transparent;color:inherit;text-align:left;padding:16px;display:grid;gap:8px;width:100%;cursor:pointer}.top-bill-grid article>button>span[b-fex55c3r3s]{color:#ff32bd;font-weight:900}.top-bill-grid article>button>strong[b-fex55c3r3s]{font-size:22px;color:#38e8ff}.top-bill-grid article>button>small[b-fex55c3r3s]{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:#8b96aa}.top-bill-grid article>button>em[b-fex55c3r3s]{font-style:normal;color:#ffc21d;font-size:11px}.top-bill-grid article>button>i[b-fex55c3r3s]{position:absolute;right:12px;top:12px}.top-bill-grid article.expanded[b-fex55c3r3s]{grid-column:span 2}.top-bill-items[b-fex55c3r3s]{padding:0 12px 12px;display:grid;gap:4px}.top-bill-items>div[b-fex55c3r3s]{display:grid;grid-template-columns:80px minmax(0,1fr) 55px 80px;gap:7px;padding:7px;border-top:1px solid #1b2940}.top-bill-items b[b-fex55c3r3s]{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.top-bill-items small[b-fex55c3r3s]{color:#8794a7}.top-bill-items strong[b-fex55c3r3s]{text-align:right;color:#38e8ff}
@media(max-width:1100px){.revenue-flow-layout[b-fex55c3r3s]{grid-template-columns:170px 1fr}.flow-total[b-fex55c3r3s]{grid-column:1/-1;margin:20px auto}.hq-analysis-grid[b-fex55c3r3s]{grid-template-columns:1fr}.top-bill-grid[b-fex55c3r3s]{grid-template-columns:repeat(2,1fr)}.category-top5-grid[b-fex55c3r3s]{grid-template-columns:repeat(2,1fr)}}
@media(max-width:700px){.price-range-list>div[b-fex55c3r3s]{grid-template-columns:110px 1fr 60px}.price-range-list strong[b-fex55c3r3s],.price-range-list small[b-fex55c3r3s]{display:none}.thai-map-layout[b-fex55c3r3s]{grid-template-columns:1fr}.top-bill-grid[b-fex55c3r3s],.category-top5-grid[b-fex55c3r3s]{grid-template-columns:1fr}}

/* HQ refinement */
.flow-lines path[b-fex55c3r3s]{stroke-width:1.4;opacity:.65;stroke-dasharray:10 8;animation:flow-energy-b-fex55c3r3s 2.4s linear infinite,flow-blink-b-fex55c3r3s 3s ease-in-out infinite}.flow-total[b-fex55c3r3s]{animation:flow-pulse-b-fex55c3r3s 2.2s ease-in-out infinite}@keyframes flow-energy-b-fex55c3r3s{to{stroke-dashoffset:-72}}@keyframes flow-blink-b-fex55c3r3s{50%{opacity:1;stroke-width:2}}@keyframes flow-pulse-b-fex55c3r3s{50%{box-shadow:0 0 34px #72ff2799,inset 0 0 34px #72ff2733}}
.platform-pie-wrap[b-fex55c3r3s]{min-height:390px}.platform-pie[b-fex55c3r3s]{height:390px}.platform-pie .pie-leader[b-fex55c3r3s]{display:none}
.thai-region-map[b-fex55c3r3s]{height:390px;width:260px;overflow:hidden;filter:drop-shadow(0 0 14px #1edfff44)}.thai-region-map[b-fex55c3r3s]  .hq-region-svg{width:100%;height:100%;display:block}.thai-region-map[b-fex55c3r3s]  .hq-region-province{stroke:#07101c;stroke-width:1.1;vector-effect:non-scaling-stroke;opacity:.88;transition:opacity .18s,filter .18s}.thai-region-map[b-fex55c3r3s]  .hq-region-province:hover{opacity:1;stroke:#fff;stroke-width:1.8;filter:url(#regionGlow)}
.hq-command-page .reference-dashboard-grid.hq-layout .channel-panel[b-fex55c3r3s]{grid-column:1/-1;order:1}.hq-command-page .reference-dashboard-grid.hq-layout .sale-mix-panel[b-fex55c3r3s]{grid-column:span 6;order:2}.hq-command-page .reference-dashboard-grid.hq-layout .customer-panel[b-fex55c3r3s]{grid-column:span 6;order:2}.hq-command-page .reference-dashboard-grid.hq-layout .product-panel[b-fex55c3r3s]{grid-column:1/-1;order:3}.hq-command-page .reference-dashboard-grid.hq-layout .top-product-panel[b-fex55c3r3s]{grid-column:1/-1;order:4}
.hq-analysis-grid .top-bills-card[b-fex55c3r3s]{margin-top:0}.hq-analysis-grid .top-bill-grid[b-fex55c3r3s]{grid-template-columns:1fr 1fr}.hq-analysis-grid .top-bill-grid article.expanded[b-fex55c3r3s]{grid-column:1/-1}.hq-analysis-grid .top-bill-grid article:last-child[b-fex55c3r3s]{grid-column:1/-1}
.trend-grid line[b-fex55c3r3s]{stroke:#263147;stroke-width:1}.wave-line.smooth[b-fex55c3r3s]{fill:none;stroke:url(#hqWaveStroke);stroke-width:4;filter:drop-shadow(0 0 8px #38e8ff77)}.key-point[b-fex55c3r3s]{fill:#07101c;stroke:#38e8ff;stroke-width:4;filter:drop-shadow(0 0 7px #38e8ff)}
.bill-peak-row[b-fex55c3r3s]{display:grid;grid-template-columns:minmax(0,3fr) minmax(230px,1fr);gap:14px;align-items:stretch}.bill-peak-row .bill-volume-card[b-fex55c3r3s]{margin-top:14px}.command-peak.restored[b-fex55c3r3s]{margin-top:14px;min-height:250px;display:flex;flex-direction:column;justify-content:center}.command-peak.restored strong[b-fex55c3r3s]{font-size:35px}.command-peak.restored b[b-fex55c3r3s]{font-size:28px}
@media(max-width:900px){.bill-peak-row[b-fex55c3r3s]{grid-template-columns:1fr}.hq-command-page .reference-dashboard-grid.hq-layout .sale-mix-panel[b-fex55c3r3s],.hq-command-page .reference-dashboard-grid.hq-layout .customer-panel[b-fex55c3r3s]{grid-column:1/-1}.hq-analysis-grid .top-bill-grid[b-fex55c3r3s]{grid-template-columns:1fr}}

.revenue-flow-layout[b-fex55c3r3s]{min-height:442px}.flow-labels[b-fex55c3r3s]{gap:6px}.flow-labels>div[b-fex55c3r3s]{height:58px;align-content:center;box-sizing:border-box}.flow-lines[b-fex55c3r3s]{height:442px}.thai-region-map[b-fex55c3r3s]  .hq-region-svg{transform:translateX(-24px) scale(1.08);transform-origin:center}
.sales-25d-chart[b-fex55c3r3s]{display:flex;align-items:flex-end;gap:7px;height:280px;padding:34px 10px 0;border-bottom:1px solid #1d314a;background:repeating-linear-gradient(to bottom,transparent 0,transparent 58px,#20304766 59px);overflow-x:auto}.sales-25d-column[b-fex55c3r3s]{flex:1;min-width:18px;height:100%;display:grid;grid-template-rows:22px 1fr 20px;align-items:end;justify-items:center}.sales-25d-column>strong[b-fex55c3r3s]{color:#8190a7;font-size:8px;opacity:0;transition:opacity .15s}.sales-25d-column:hover>strong[b-fex55c3r3s],.sales-25d-column.peak>strong[b-fex55c3r3s]{opacity:1;color:#63f5d0}.sales-25d-stage[b-fex55c3r3s]{height:100%;width:100%;display:flex;align-items:flex-end;justify-content:center;perspective:160px}.sales-25d-stage i[b-fex55c3r3s]{position:relative;width:min(18px,48%);min-height:4px;border-radius:3px 3px 1px 1px;background:linear-gradient(180deg,#65f5d4,#22c39a 58%,#10836d);box-shadow:0 10px 19px #19c49a33;transform-style:preserve-3d}.sales-25d-stage i[b-fex55c3r3s]:before{content:"";position:absolute;left:5px;right:-8px;top:-8px;height:8px;border-radius:3px 3px 1px 1px;background:linear-gradient(90deg,#9affea,#46dcb8);transform:skewX(-45deg);transform-origin:left bottom}.sales-25d-stage i[b-fex55c3r3s]:after{content:"";position:absolute;top:-4px;bottom:3px;right:-8px;width:8px;border-radius:1px 3px 3px 1px;background:linear-gradient(#159f82,#096b5b);transform:skewY(-45deg);transform-origin:left top}.sales-25d-column.peak .sales-25d-stage i[b-fex55c3r3s]{background:linear-gradient(#ffd65b,#ff8b37,#e44868);box-shadow:0 0 18px #ff5c74aa}.sales-25d-column.peak .sales-25d-stage i[b-fex55c3r3s]:before{background:#ffe58b}.sales-25d-column.peak .sales-25d-stage i[b-fex55c3r3s]:after{background:#c94a45}.sales-25d-column>small[b-fex55c3r3s]{color:#74849b;font-size:8px;padding-top:5px}

.derived-hero[b-fex55c3r3s] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 20px;
    margin-bottom: 14px;
    padding: 0;
    color: #20242a;
    background: transparent;
}

.derived-hero .eyebrow[b-fex55c3r3s],
.card-eyebrow[b-fex55c3r3s] {
    color: #8b9098;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: .14em;
}

.derived-hero h1[b-fex55c3r3s] {
    margin: 4px 0 0;
    font-size: 32px;
    font-weight: 850;
    letter-spacing: -.03em;
}

.derived-hero p[b-fex55c3r3s] {
    margin: 6px 0 0;
    color: #737982;
}

.scope-badge[b-fex55c3r3s] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 9px 12px;
    border: 1px solid #d8dde3;
    border-radius: 999px;
    background: #fff;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: .04em;
    white-space: nowrap;
}

.pulse[b-fex55c3r3s] {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #20aa72;
    box-shadow: 0 0 0 4px rgba(32, 170, 114, .12);
}

.analytics-switcher[b-fex55c3r3s] { display: flex; gap: 8px; margin: 0 0 14px; }
.analytics-switcher a[b-fex55c3r3s] { padding: 9px 18px; border: 1px solid #dfe3e8; border-radius: 10px; background: #fff; color: #6b7280; text-decoration: none; font-weight: 800; }
.analytics-switcher a.active[b-fex55c3r3s] { border-color: #20242a; background: #20242a; color: #fff; }

.filter-panel[b-fex55c3r3s] {
    display: grid;
    grid-template-columns: 175px 175px auto;
    align-items: end;
    gap: 12px;
    margin-bottom: 16px;
    padding: 16px;
    border: 1px solid #dfe3e8;
    border-radius: 18px;
    background: #f7f8fa;
}

.filter-item[b-fex55c3r3s] { display: grid; gap: 7px; }
.filter-item span[b-fex55c3r3s] { color: #666d76; font-size: 12px; font-weight: 800; }
.filter-item input[b-fex55c3r3s] { width: 100%; min-height: 44px; padding: 9px 12px; border: 1px solid #cfd5dc; border-radius: 11px; background: #fff; color: #22272e; }
.refresh-btn[b-fex55c3r3s] { height: 44px; padding: 0 18px; border: 0; border-radius: 11px; background: #ed1b2f; color: #fff; font-weight: 800; box-shadow: 0 8px 18px rgba(237, 27, 47, .16); }
.refresh-btn i[b-fex55c3r3s] { margin-right: 6px; }
.refresh-btn:disabled[b-fex55c3r3s] { opacity: .55; box-shadow: none; }
.hq-compare-link[b-fex55c3r3s] { height:44px;display:inline-flex;align-items:center;gap:7px;padding:0 17px;border:1px solid #7d52ff;border-radius:11px;color:#efeaff;text-decoration:none;font-size:11px;font-weight:850;background:linear-gradient(90deg,#6f3bde,#b72fc7);box-shadow:0 8px 20px rgba(117,54,225,.2); }

.status[b-fex55c3r3s],
.loading-state[b-fex55c3r3s] { margin-bottom: 16px; padding: 14px 16px; border-radius: 12px; }
.status.error[b-fex55c3r3s] { border: 1px solid #f0c1c6; background: #fff0f2; color: #b6232f; }
.loading-state[b-fex55c3r3s] { border: 1px solid #dde1e6; background: #f6f7f9; }

.scope-note[b-fex55c3r3s] { display: flex; justify-content: space-between; gap: 16px; margin-bottom: 14px; padding: 12px 16px; border: 1px solid #dfe3e8; border-radius: 16px; background: #fff; color: #737982; }
.scope-note strong[b-fex55c3r3s] { color: #20242a; }

.kpi-grid[b-fex55c3r3s] { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 12px; margin-bottom: 14px; }
.kpi-card[b-fex55c3r3s] { display: flex; align-items: center; gap: 12px; min-width: 0; min-height: 118px; padding: 16px; border: 1px solid #dfe3e8; border-radius: 18px; background: #fff; }
.kpi-icon[b-fex55c3r3s] { width: 46px; height: 46px; flex: 0 0 46px; display: grid; place-items: center; border-radius: 14px; background: #eef1f4; font-size: 20px; }
.kpi-card > div:last-child[b-fex55c3r3s] { min-width: 0; }
.kpi-card span[b-fex55c3r3s] { display: block; color: #6c737c; font-size: 11px; font-weight: 800; }
.kpi-card strong[b-fex55c3r3s] { display: block; margin-top: 4px; font-size: clamp(19px, 1.45vw, 27px); line-height: 1.05; font-weight: 850; letter-spacing: -.035em; }
.kpi-card small[b-fex55c3r3s] { display: block; margin-top: 7px; color: #8b9199; font-size: 10px; }
.kpi-card.sales[b-fex55c3r3s] { border-color: #9bdabc; background: linear-gradient(135deg, #effaf5, #fff); }
.kpi-card.sales .kpi-icon[b-fex55c3r3s] { color: #18a66d; background: #d8f3e7; }
.kpi-card.money[b-fex55c3r3s] { background: linear-gradient(135deg, #f3f5f7, #fff); }
.kpi-card.disabled-kpi[b-fex55c3r3s] { border-style: dashed; background: #f5f5f6; color: #71717a; }

.quality-panel[b-fex55c3r3s],
.data-card[b-fex55c3r3s] { border: 1px solid #dfe3e8; border-radius: 18px; background: #fff; }
.quality-panel[b-fex55c3r3s] { display: grid; gap: 12px; margin-bottom: 14px; padding: 18px; }
.quality-panel header[b-fex55c3r3s],
.data-card header[b-fex55c3r3s] { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
.quality-panel h2[b-fex55c3r3s],
.data-card h2[b-fex55c3r3s] { margin: 3px 0 0; font-size: 20px; font-weight: 850; }
.quality-panel header > strong[b-fex55c3r3s] { padding: 6px 10px; border-radius: 999px; font-size: 11px; }
.quality-panel.quality-ok[b-fex55c3r3s] { border-color: #9bdabc; background: linear-gradient(135deg, #effaf5, #fff); }
.quality-panel.quality-ok header > strong[b-fex55c3r3s] { background: #d8f3e7; color: #16734e; }
.quality-panel.quality-review[b-fex55c3r3s] { border-color: #efc988; background: #fffaf0; }
.quality-panel.quality-review header > strong[b-fex55c3r3s] { background: #ffedd5; color: #9a3412; }
.quality-panel > small[b-fex55c3r3s] { color: #7b818a; font-size: 10px; }
.quality-grid[b-fex55c3r3s] { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 9px; }
.quality-grid > div[b-fex55c3r3s] { display: grid; gap: 3px; padding: 11px 12px; border: 1px solid rgba(148, 163, 184, .24); border-radius: 10px; background: rgba(255, 255, 255, .74); }
.quality-grid span[b-fex55c3r3s] { color: #7b818a; font-size: 10px; }
.quality-grid strong[b-fex55c3r3s] { font-size: 14px; }

.reference-overview-grid[b-fex55c3r3s],
.reference-middle-grid[b-fex55c3r3s],
.reference-bottom-grid[b-fex55c3r3s] { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 14px; margin-bottom: 14px; }
.reference-overview-grid[b-fex55c3r3s] { grid-template-columns: minmax(0, 1.25fr) minmax(310px, .75fr); }
.reference-dashboard-grid[b-fex55c3r3s] { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 14px; margin-bottom: 14px; }
.reference-dashboard-grid .channel-panel[b-fex55c3r3s] { grid-column: span 7; order: 1; }
.reference-dashboard-grid .sale-mix-panel[b-fex55c3r3s] { grid-column: span 5; order: 4; }
.reference-dashboard-grid .trend-panel[b-fex55c3r3s] { grid-column: span 7; order: 3; }
.reference-dashboard-grid .product-panel[b-fex55c3r3s] { grid-column: span 7; order: 5; }
.reference-dashboard-grid .top-product-panel[b-fex55c3r3s] { grid-column: span 5; order: 2; }
.reference-dashboard-grid .payment-panel[b-fex55c3r3s] { grid-column: span 5; order: 6; }
.reference-dashboard-grid.b2b-layout .product-panel[b-fex55c3r3s] { grid-column: span 5; order: 2; }
.reference-dashboard-grid.b2b-layout .top-product-panel[b-fex55c3r3s] { grid-column: span 6; order: 5; }
.reference-dashboard-grid.b2b-layout .payment-panel[b-fex55c3r3s] { grid-column: span 6; order: 6; }
.reference-dashboard-grid .customer-panel[b-fex55c3r3s] { grid-column: span 5; order: 4; }
.dashboard-grid[b-fex55c3r3s] { display: grid; grid-template-columns: 1fr; gap: 14px; }
.data-card[b-fex55c3r3s] { min-width: 0; overflow: hidden; padding: 18px 20px; }
.data-card header[b-fex55c3r3s] { padding-bottom: 14px; border-bottom: 1px solid #e5e8ec; }
.data-card header p[b-fex55c3r3s] { margin: 5px 0 0; color: #8b9199; font-size: 11px; }
.wide-card[b-fex55c3r3s],
.recent-card[b-fex55c3r3s] { grid-column: 1 / -1; }
.panel-stat[b-fex55c3r3s] { display: grid; text-align: right; }
.panel-stat strong[b-fex55c3r3s] { font-size: 27px; line-height: 1; font-weight: 850; }
.panel-stat small[b-fex55c3r3s] { margin-top: 5px; color: #8d9299; font-size: 10px; }

.channel-mix-layout[b-fex55c3r3s] { display: grid; grid-template-columns: 190px minmax(0, 1fr); gap: 16px; align-items: center; padding: 16px 0 4px; }
.donut-wrap[b-fex55c3r3s] { display: grid; place-items: center; min-height: 190px; }
.channel-donut[b-fex55c3r3s] { position: relative; width: 158px; height: 158px; display: grid; place-items: center; border-radius: 50%; box-shadow: 0 13px 22px rgba(31, 76, 96, .12); }
.channel-donut[b-fex55c3r3s]::after { content: ""; position: absolute; inset: 25px; border-radius: 50%; background: radial-gradient(circle at 36% 28%, #fff, #f8fbfc); box-shadow: inset 0 0 0 1px #e2e9ed; }
.channel-donut > div[b-fex55c3r3s] { position: relative; z-index: 2; display: grid; place-items: center; }
.channel-donut strong[b-fex55c3r3s] { font-size: 30px; line-height: 1; font-weight: 900; }
.channel-donut span[b-fex55c3r3s] { margin-top: 6px; color: #7d878e; font-size: 10px; font-weight: 800; }
.channel-table[b-fex55c3r3s] { min-width: 0; }
.channel-table > div[b-fex55c3r3s] { display: grid; grid-template-columns: 9px minmax(90px, 1fr) auto minmax(100px, auto); gap: 9px; align-items: center; padding: 10px 3px; border-top: 1px solid #edf0f2; font-size: 11px; }
.tone-dot[b-fex55c3r3s] { width: 9px; height: 9px; border-radius: 50%; box-shadow: 0 2px 5px rgba(40, 70, 80, .15); }
.channel-table small[b-fex55c3r3s] { color: #8a9099; }
.channel-table b[b-fex55c3r3s] { text-align: right; }
.channel-scope-note[b-fex55c3r3s] { margin: 10px 0 0; padding: 9px 11px; border-radius: 10px; background: #f4f0ff; color: #6542aa; font-size: 11px; font-weight: 650; }

.sale-mix-layout[b-fex55c3r3s] { display: grid; grid-template-columns: 170px minmax(0, 1fr); gap: 14px; align-items: center; padding: 18px 0 5px; }
.sale-mix-cake[b-fex55c3r3s] { width: 154px; height: 154px; justify-self: center; border: 7px solid #fff; border-radius: 50%; box-shadow: 0 13px 24px rgba(31, 76, 96, .15), inset 0 0 0 1px rgba(255,255,255,.55); }
.sale-mix-table[b-fex55c3r3s] { min-width: 0; }
.sale-mix-table > div[b-fex55c3r3s] { display: grid; grid-template-columns: 9px minmax(130px, 1fr) auto minmax(92px, auto); gap: 8px; align-items: center; padding: 10px 2px; border-top: 1px solid #edf0f2; font-size: 10px; }
.sale-mix-table strong[b-fex55c3r3s] { line-height: 1.25; }
.sale-mix-table small[b-fex55c3r3s] { color: #8a9099; white-space: nowrap; }
.sale-mix-table b[b-fex55c3r3s] { text-align: right; white-space: nowrap; }
.sale-mix-note[b-fex55c3r3s] { margin: 11px 0 0; padding: 9px 11px; border-radius: 10px; background: #eef6ff; color: #315f96; font-size: 10px; font-weight: 650; }

.vertical-chart[b-fex55c3r3s] { min-height: 330px; display: flex; align-items: flex-end; gap: 10px; overflow-x: auto; padding: 42px 12px 8px; background: linear-gradient(rgba(48, 182, 194, .07) 1px, transparent 1px), linear-gradient(90deg, rgba(48, 182, 194, .07) 1px, transparent 1px), linear-gradient(180deg, #fbffff, #f3fbfc); background-size: 100% 65px, 65px 100%, auto; }
.chart-day[b-fex55c3r3s] { min-width: 57px; flex: 1 0 57px; display: flex; flex-direction: column; align-items: center; }
.bar-stage[b-fex55c3r3s] { position: relative; width: 34px; height: 245px; display: flex; align-items: flex-end; justify-content: center; }
.bar-stage[b-fex55c3r3s]::after { content: ""; position: absolute; left: 4px; right: -5px; bottom: -5px; height: 10px; border-radius: 3px; background: rgba(32, 196, 166, .18); transform: skewX(-40deg); }
.sales-vbar[b-fex55c3r3s] { position: relative; z-index: 2; width: 22px; min-height: 3px; border-radius: 4px 4px 2px 2px; background: linear-gradient(180deg, #4ee7bf, #1fc18b 58%, #159c79); box-shadow: 0 12px 20px rgba(24, 181, 137, .20); transition: transform .18s ease; }
.sales-vbar[b-fex55c3r3s]::before { content: ""; position: absolute; left: 4px; right: -7px; top: -7px; height: 7px; border-radius: 3px; background: linear-gradient(90deg, #75f2d2, #45dcb7); transform: skewX(-45deg); }
.sales-vbar[b-fex55c3r3s]::after { content: ""; position: absolute; top: -3px; bottom: 3px; right: -7px; width: 7px; border-radius: 1px 3px 3px 1px; background: linear-gradient(180deg, #159c79, #0d806c); transform: skewY(-45deg); }
.chart-day:hover .sales-vbar[b-fex55c3r3s] { transform: translateY(-3px); }
.chart-date[b-fex55c3r3s] { min-height: 50px; margin-top: 13px; text-align: center; line-height: 1.1; }
.chart-date strong[b-fex55c3r3s] { color: #2c525b; font-size: 13px; }
.chart-date span[b-fex55c3r3s] { margin-left: 2px; color: #73a4ad; font-size: 9px; text-transform: uppercase; }
.chart-date small[b-fex55c3r3s] { display: block; margin-top: 5px; color: #9aaeb2; font-size: 9px; }

.product-panel[b-fex55c3r3s] { padding: 0; }
.product-panel > header[b-fex55c3r3s] { padding: 18px 20px 14px; }
.product-panel h2 small[b-fex55c3r3s] { color: #8b9199; font-size: 11px; font-weight: 650; }
.product-card-grid[b-fex55c3r3s] { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 9px; padding: 10px; }
.product-category-card[b-fex55c3r3s] { position: relative; width: 100%; min-width: 0; min-height: 178px; display: grid; grid-template-rows: 20px 64px 44px 23px 4px; place-items: center; overflow: hidden; padding: 10px 8px 8px; border: 1px solid; border-radius: 15px; color: inherit; font: inherit; text-align: center; cursor: pointer; transition: transform .18s ease, box-shadow .18s ease; }
.product-category-card:hover[b-fex55c3r3s] { transform: translateY(-3px); box-shadow: 0 12px 22px rgba(38, 72, 88, .12); }
.product-category-card.selected[b-fex55c3r3s] { transform: translateY(-3px); box-shadow: 0 0 0 2px #fff, 0 0 0 4px currentColor, 0 13px 24px rgba(38, 72, 88, .14); }
.product-category-card[b-fex55c3r3s]::after { content: ""; position: absolute; width: 58px; height: 58px; right: -25px; top: -24px; border-radius: 50%; background: rgba(255, 255, 255, .55); }
.product-category-name[b-fex55c3r3s] { z-index: 1; width: 100%; overflow: hidden; font-size: 10px; font-weight: 900; text-overflow: ellipsis; white-space: nowrap; }
.product-art[b-fex55c3r3s] { width: 62px; height: 54px; display: grid; place-items: center; border-radius: 14px; background: rgba(255, 255, 255, .6); box-shadow: 0 9px 15px rgba(45, 75, 90, .12); font-size: 29px; transform: perspective(260px) rotateX(4deg) rotateY(-6deg); }
.product-card-middle[b-fex55c3r3s] { display: grid; place-items: center; width: 100%; padding-top: 4px; border-top: 1px solid rgba(120, 135, 145, .10); }
.product-card-middle strong[b-fex55c3r3s] { font-size: 13px; font-weight: 900; white-space: nowrap; }
.product-card-middle span[b-fex55c3r3s] { color: #66747d; font-size: 8px; font-weight: 800; }
.product-card-bottom[b-fex55c3r3s] { width: 100%; padding-top: 5px; border-top: 1px solid rgba(120, 135, 145, .08); color: #78848c; font-size: 8px; font-weight: 800; white-space: nowrap; }
.product-card-progress[b-fex55c3r3s] { width: 100%; height: 4px; overflow: hidden; border-radius: 99px; background: rgba(90, 105, 115, .12); }
.product-card-progress > div[b-fex55c3r3s] { height: 100%; min-width: 2px; border-radius: inherit; }
.category-drilldown[b-fex55c3r3s] { margin: 0 10px 12px; overflow: hidden; border: 1px solid #dfe4e9; border-radius: 15px; background: #fff; }
.category-drilldown > header[b-fex55c3r3s] { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 13px 15px; border-bottom: 1px solid #e7eaee; background: #fafbfc; }
.category-drilldown h3[b-fex55c3r3s] { margin: 3px 0 0; font-size: 16px; }
.category-drilldown h3 small[b-fex55c3r3s] { margin-left: 7px; color: #8b9199; font-size: 10px; font-weight: 650; }
.drilldown-close[b-fex55c3r3s] { padding: 7px 11px; border: 1px solid #d6dce2; border-radius: 9px; background: #fff; color: #59616b; font-weight: 800; cursor: pointer; }
.drilldown-close:hover[b-fex55c3r3s] { border-color: #ed1b2f; color: #ed1b2f; }
.category-product-list[b-fex55c3r3s] { max-height: 390px; overflow: auto; padding: 4px 14px 10px; }
.category-product-list > div[b-fex55c3r3s] { display: grid; grid-template-columns: 26px 40px minmax(0, 1fr) auto; gap: 10px; align-items: center; padding: 10px 2px; border-bottom: 1px solid #edf0f2; }
.category-rank[b-fex55c3r3s] { color: #9aa2ab; font-size: 10px; font-weight: 800; text-align: center; }
.category-product-icon[b-fex55c3r3s] { width: 36px; height: 36px; display: grid; place-items: center; border: 1px solid currentColor; border-radius: 10px; background: #fff; font-size: 17px; box-shadow: 0 5px 10px rgba(45, 75, 90, .08); }
.category-product-name[b-fex55c3r3s] { min-width: 0; display: grid; gap: 3px; }
.category-product-name strong[b-fex55c3r3s] { overflow: hidden; font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }
.category-product-name small[b-fex55c3r3s] { color: #9299a2; font-size: 9px; }
.category-product-list b[b-fex55c3r3s] { font-size: 11px; white-space: nowrap; }
.category-dual-drilldown[b-fex55c3r3s] { display:grid;grid-template-columns:repeat(2,minmax(0,1fr)); }
.category-drill-column + .category-drill-column[b-fex55c3r3s] { border-left:1px solid #e7eaee; }
.category-drill-column h4[b-fex55c3r3s] { display:flex;justify-content:space-between;margin:0;padding:10px 16px;border-bottom:1px solid #edf0f2;font-size:11px; }
.category-drill-column h4 small[b-fex55c3r3s] { color:#9299a2;font-size:9px;font-weight:600; }
.breakdown-list[b-fex55c3r3s],
.rank-list[b-fex55c3r3s] { display: grid; gap: 10px; margin-top: 15px; }
.breakdown-row[b-fex55c3r3s] { display: grid; grid-template-columns: minmax(135px, .55fr) 1fr minmax(105px, .35fr); gap: 12px; align-items: center; }
.breakdown-label[b-fex55c3r3s] { display: grid; }
.breakdown-label span[b-fex55c3r3s],
.rank-list small[b-fex55c3r3s] { color: #8a9099; font-size: 11px; }
.bar-track[b-fex55c3r3s] { height: 8px; overflow: hidden; border-radius: 99px; background: #eef0f3; }
.bar-track span[b-fex55c3r3s] { display: block; height: 100%; border-radius: 99px; background: linear-gradient(90deg, #ed1b2f, #ff7182); }
.breakdown-row > strong[b-fex55c3r3s] { text-align: right; }
.rank-list > div[b-fex55c3r3s] { display: grid; grid-template-columns: 1fr auto auto; gap: 12px; align-items: center; padding-bottom: 9px; border-bottom: 1px solid #eef0f2; }
.daily-grid[b-fex55c3r3s],
.payment-grid[b-fex55c3r3s] { display: grid; grid-template-columns: repeat(auto-fit, minmax(145px, 1fr)); gap: 9px; margin-top: 15px; }
.daily-grid > div[b-fex55c3r3s],
.payment-grid > div[b-fex55c3r3s] { display: grid; gap: 4px; padding: 12px; border: 1px solid #eceef1; border-radius: 11px; background: #fafbfc; }
.daily-grid span[b-fex55c3r3s],
.daily-grid small[b-fex55c3r3s],
.payment-grid span[b-fex55c3r3s],
.payment-grid small[b-fex55c3r3s] { color: #818791; font-size: 11px; }
.product-rank span[b-fex55c3r3s] { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

.table-wrap[b-fex55c3r3s] { max-height: 520px; overflow: auto; margin-top: 12px; }
table[b-fex55c3r3s] { width: 100%; border-collapse: collapse; font-size: 12px; white-space: nowrap; }
th[b-fex55c3r3s],
td[b-fex55c3r3s] { padding: 11px 10px; border-bottom: 1px solid #eceef1; text-align: left; }
th[b-fex55c3r3s] { position: sticky; top: 0; background: #fff; color: #737983; font-size: 10px; text-transform: uppercase; }
.num[b-fex55c3r3s] { text-align: right; }
.platform-pill[b-fex55c3r3s] { display: inline-flex; padding: 4px 8px; border-radius: 999px; background: #eef2f7; color: #374151; font-size: 10px; font-weight: 800; }
.expand-btn[b-fex55c3r3s] { width: 26px; height: 26px; padding: 0; border: 1px solid #d9dee5; border-radius: 7px; background: #fff; color: #111827; font-weight: 900; }
.expand-btn:hover:not(:disabled)[b-fex55c3r3s] { border-color: #ed1b2f; color: #ed1b2f; }
.expand-btn:disabled[b-fex55c3r3s] { opacity: .28; }
.item-detail-row td[b-fex55c3r3s] { padding: 0 10px 12px; background: #fafbfc; }
.item-detail-list[b-fex55c3r3s] { display: grid; gap: 6px; padding: 10px; border: 1px solid #e6e9ed; border-radius: 10px; background: #fff; }
.item-detail-list > div[b-fex55c3r3s] { display: grid; grid-template-columns: 110px minmax(240px, 1fr) 70px 110px; gap: 10px; align-items: center; padding: 6px 4px; border-bottom: 1px solid #f0f1f3; }
.item-detail-list > div:last-child[b-fex55c3r3s] { border-bottom: 0; }
.item-detail-list small[b-fex55c3r3s] { color: #818791; }
.item-detail-list b[b-fex55c3r3s] { text-align: right; }
.empty[b-fex55c3r3s] { padding: 35px; border: 1px dashed #d7dbe0; border-radius: 12px; color: #9298a1; text-align: center; }

/* HQ is intentionally a distinct executive command surface. B2B keeps the neutral theme above. */
.hq-command-page[b-fex55c3r3s] {
    --hq-panel: rgba(11, 15, 25, .94);
    --hq-line: rgba(72, 224, 255, .17);
    margin: 0;
    color: #f5f7ff;
    background:
        radial-gradient(circle at 88% 7%, rgba(116, 36, 255, .22), transparent 28%),
        radial-gradient(circle at 8% 34%, rgba(0, 219, 255, .11), transparent 26%),
        linear-gradient(rgba(68, 211, 255, .035) 1px, transparent 1px),
        linear-gradient(90deg, rgba(68, 211, 255, .035) 1px, transparent 1px),
        #070a11;
    background-size: auto, auto, 34px 34px, 34px 34px, auto;
}
.hq-command-page .derived-hero[b-fex55c3r3s] { position: relative; overflow: hidden; min-height: 155px; align-items: center; padding: 27px 31px; border: 1px solid rgba(56, 221, 255, .22); border-radius: 24px; color: #fff; background: linear-gradient(118deg, rgba(5,9,17,.98), rgba(27,9,57,.96)); box-shadow: 0 22px 60px rgba(0,0,0,.3); }
.hq-command-page .derived-hero[b-fex55c3r3s]::after { content: "HQ"; position: absolute; right: 17%; top: -45px; color: rgba(255,255,255,.025); font-size: 190px; line-height: 1; font-weight: 950; transform: skewX(-10deg); }
.hq-command-page .derived-hero .eyebrow[b-fex55c3r3s], .hq-command-page .card-eyebrow[b-fex55c3r3s] { color: #32e4ff; }
.hq-command-page .derived-hero h1[b-fex55c3r3s] { font-size: clamp(34px, 4vw, 58px); text-shadow: 0 0 26px rgba(43,218,255,.28); }
.hq-command-page .derived-hero p[b-fex55c3r3s] { color: #9ba7bc; }
.hq-command-page .scope-badge[b-fex55c3r3s] { z-index: 1; border-color: rgba(60,229,255,.35); background: rgba(11,18,29,.75); color: #dffaff; box-shadow: 0 0 24px rgba(0,210,255,.1); }
.hq-command-page .pulse[b-fex55c3r3s] { background: #2fffd0; box-shadow: 0 0 0 4px rgba(47,255,208,.13), 0 0 18px #2fffd0; }
.hq-command-page .analytics-switcher a[b-fex55c3r3s] { border-color: #273244; background: #101621; color: #8794aa; }
.hq-command-page .analytics-switcher a.active[b-fex55c3r3s] { border-color: #31dcff; color: #061018; background: linear-gradient(90deg,#35f0d0,#35caff); box-shadow: 0 0 22px rgba(52,220,255,.24); }
.hq-command-page .filter-panel[b-fex55c3r3s], .hq-command-page .scope-note[b-fex55c3r3s] { border-color: var(--hq-line); background: rgba(12,17,27,.88); color: #8f9caf; }
.hq-command-page .filter-item span[b-fex55c3r3s] { color: #91a0b7; }
.hq-command-page .filter-item input[b-fex55c3r3s] { border-color: #2a3649; background: #090e17; color: #fff; color-scheme: dark; }
.hq-command-page .refresh-btn[b-fex55c3r3s] { background: linear-gradient(90deg,#ff237d,#8a3fff); box-shadow: 0 0 24px rgba(255,35,125,.22); }
.hq-command-page .scope-note strong[b-fex55c3r3s] { color: #45e9ff; }
.hq-command-page .kpi-card[b-fex55c3r3s], .hq-command-page .data-card[b-fex55c3r3s], .hq-command-page .quality-panel[b-fex55c3r3s] { border-color: var(--hq-line); color: #f4f7ff; background: linear-gradient(145deg,rgba(14,20,32,.98),rgba(7,10,17,.98)); box-shadow: 0 18px 45px rgba(0,0,0,.22); }
.hq-command-page .kpi-card[b-fex55c3r3s] { border-top-color: rgba(56,224,255,.48); }
.hq-command-page .kpi-card:nth-child(2)[b-fex55c3r3s] { border-top-color: #8d5cff; }
.hq-command-page .kpi-card:nth-child(3)[b-fex55c3r3s] { border-top-color: #ff35a4; }
.hq-command-page .kpi-card:nth-child(4)[b-fex55c3r3s] { border-top-color: #ffb21d; }
.hq-command-page .kpi-card span[b-fex55c3r3s], .hq-command-page .kpi-card small[b-fex55c3r3s], .hq-command-page .data-card header p[b-fex55c3r3s], .hq-command-page .panel-stat small[b-fex55c3r3s] { color: #8390a5; }
.hq-command-page .kpi-icon[b-fex55c3r3s] { color: #43e3ff; background: rgba(49,214,255,.1); box-shadow: inset 0 0 0 1px rgba(54,222,255,.18),0 0 18px rgba(54,222,255,.08); }
.hq-command-page .kpi-card.sales[b-fex55c3r3s], .hq-command-page .kpi-card.money[b-fex55c3r3s], .hq-command-page .kpi-card.disabled-kpi[b-fex55c3r3s] { background: linear-gradient(145deg,rgba(14,20,32,.98),rgba(7,10,17,.98)); }
.hq-command-page .quality-panel.quality-ok[b-fex55c3r3s] { border-color: rgba(46,255,199,.28); background: linear-gradient(120deg,rgba(9,35,33,.8),rgba(9,13,22,.98)); }
.hq-command-page .quality-panel.quality-review[b-fex55c3r3s] { border-color: rgba(255,177,30,.3); background: linear-gradient(120deg,rgba(45,30,8,.8),rgba(9,13,22,.98)); }
.hq-command-page .quality-grid > div[b-fex55c3r3s] { border-color: rgba(72,224,255,.12); background: rgba(5,9,16,.6); }
.hq-command-page .quality-grid span[b-fex55c3r3s], .hq-command-page .quality-panel > small[b-fex55c3r3s] { color: #8290a4; }

.hq-command-deck[b-fex55c3r3s] { margin-bottom: 14px; padding: 22px; border: 1px solid rgba(61,225,255,.2); border-radius: 22px; background: linear-gradient(145deg,rgba(12,17,29,.97),rgba(8,10,18,.97)); box-shadow: 0 22px 54px rgba(0,0,0,.28); }
.command-heading[b-fex55c3r3s] { display: flex; justify-content: space-between; gap: 16px; align-items: center; margin-bottom: 20px; }
.command-heading h2[b-fex55c3r3s] { margin: 3px 0 0; font-size: 25px; }
.command-heading p[b-fex55c3r3s] { margin: 4px 0 0; color: #8190a7; font-size: 11px; }
.command-period[b-fex55c3r3s] { padding: 8px 12px; border: 1px solid rgba(57,224,255,.22); border-radius: 999px; color: #5ceaff; background: rgba(41,211,255,.06); font-size: 10px; font-weight: 800; }
.command-pulse-grid[b-fex55c3r3s] { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 13px; }
.hq-stat-ribbon[b-fex55c3r3s] { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:1px; margin:14px 0; overflow:hidden; border:1px solid rgba(52,222,255,.16); border-radius:15px; background:rgba(52,222,255,.12); }
.hq-stat-ribbon article[b-fex55c3r3s] { min-width:0; padding:13px 14px; background:linear-gradient(145deg,rgba(11,18,30,.98),rgba(7,10,18,.98)); }
.hq-stat-ribbon span[b-fex55c3r3s],.hq-stat-ribbon small[b-fex55c3r3s] { display:block; overflow:hidden; color:#6f8098; font-size:9px; font-weight:850; letter-spacing:.06em; text-overflow:ellipsis; white-space:nowrap; }
.hq-stat-ribbon strong[b-fex55c3r3s] { display:block; overflow:hidden; margin:5px 0 4px; color:#f4f8ff; font-size:clamp(14px,1.35vw,21px); line-height:1; text-overflow:ellipsis; white-space:nowrap; }
.hq-stat-ribbon article:nth-child(1) strong[b-fex55c3r3s],.hq-stat-ribbon article:nth-child(3) strong[b-fex55c3r3s] { color:#44f0cf; }
.hq-stat-ribbon article:nth-child(2) strong[b-fex55c3r3s],.hq-stat-ribbon article:nth-child(4) strong[b-fex55c3r3s] { color:#47dfff; }
.hq-stat-ribbon article:nth-child(5) strong[b-fex55c3r3s] { color:#ffbd38; }
.pulse-orbit[b-fex55c3r3s] { display: flex; align-items: center; gap: 13px; min-width: 0; padding: 15px; border: 1px solid rgba(255,255,255,.075); border-radius: 17px; background: rgba(255,255,255,.025); }
.pulse-orbit .orbit[b-fex55c3r3s] { --ring:#37e5ff; width: 78px; height: 78px; flex: 0 0 78px; display: grid; place-items: center; border-radius: 50%; background: radial-gradient(circle at center,#0b101b 57%,transparent 59%),conic-gradient(var(--ring) calc(var(--pulse) * 1%),#242a38 0); box-shadow: 0 0 22px color-mix(in srgb,var(--ring) 24%,transparent),inset 0 0 12px rgba(0,0,0,.5); }
.pulse-orbit.magenta .orbit[b-fex55c3r3s] { --ring:#ff32bd; }.pulse-orbit.amber .orbit[b-fex55c3r3s] { --ring:#ffc21d; }.pulse-orbit.violet .orbit[b-fex55c3r3s] { --ring:#895cff; }
.pulse-orbit .orbit strong[b-fex55c3r3s] { font-size: 17px; text-shadow: 0 0 12px var(--ring); }
.pulse-orbit > div:last-child[b-fex55c3r3s] { min-width: 0; display: grid; gap: 4px; }
.pulse-orbit b[b-fex55c3r3s] { font-size: 12px; }.pulse-orbit span[b-fex55c3r3s] { overflow: hidden; color: #7f8da2; font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }
.command-insight-grid[b-fex55c3r3s] { display: grid; grid-template-columns: minmax(0,1.6fr) minmax(230px,.4fr); gap: 13px; margin-top: 13px; }
.command-bars[b-fex55c3r3s],.command-peak[b-fex55c3r3s] { padding: 16px; border: 1px solid rgba(255,255,255,.075); border-radius: 17px; background: rgba(3,7,14,.55); }
.command-bars header[b-fex55c3r3s] { display: flex; justify-content: space-between; margin-bottom: 11px; color: #dce6f7; font-size: 10px; letter-spacing: .08em; }.command-bars header small[b-fex55c3r3s] { color:#647188; }
.command-bar-row[b-fex55c3r3s] { display: grid; grid-template-columns: 115px minmax(80px,1fr) 105px; gap: 10px; align-items: center; margin-top: 8px; font-size: 9px; }
.command-bar-row > div[b-fex55c3r3s] { height: 7px; overflow: hidden; border-radius: 99px; background: #1b2230; }.command-bar-row > div span[b-fex55c3r3s] { display:block;height:100%;border-radius:inherit;box-shadow:0 0 12px currentColor; }.command-bar-row strong[b-fex55c3r3s] { text-align:right; }
.command-peak[b-fex55c3r3s] { display: flex; flex-direction: column; justify-content: center; background: radial-gradient(circle at 80% 15%,rgba(255,48,174,.15),transparent 45%),rgba(3,7,14,.55); }
.command-peak > strong[b-fex55c3r3s] { margin-top: 9px; color: #ff4fc3; font-size: 28px; }.command-peak > b[b-fex55c3r3s] { margin-top: 2px; font-size: 21px; }.command-peak > div[b-fex55c3r3s] { display:flex;gap:12px;margin-top:12px;color:#8290a5;font-size:9px; }
.command-wave[b-fex55c3r3s] { margin-top:13px;overflow:hidden;padding:16px 18px 11px;border:1px solid rgba(255,255,255,.075);border-radius:17px;background:linear-gradient(180deg,rgba(15,13,30,.78),rgba(3,7,14,.72)); }
.command-wave header[b-fex55c3r3s] { display:flex;justify-content:space-between;align-items:flex-end; }.command-wave h3[b-fex55c3r3s] { margin:3px 0 0;font-size:17px; }.wave-legend[b-fex55c3r3s] { color:#7f8ca1;font-size:9px; }.wave-legend span[b-fex55c3r3s] { display:inline-block;width:22px;height:3px;margin-right:6px;border-radius:4px;background:linear-gradient(90deg,#38e8ff,#ff32bd); }.wave-legend b[b-fex55c3r3s] { margin-left:8px;color:#e9f5ff;font-size:12px; }
.command-wave svg[b-fex55c3r3s] { width:100%;height:210px;margin-top:8px;overflow:visible;background:repeating-linear-gradient(0deg,transparent 0,transparent 43px,rgba(73,220,255,.065) 44px); }
.wave-area[b-fex55c3r3s] { fill:url(#hqWaveFill); }.wave-line[b-fex55c3r3s] { fill:none;stroke:url(#hqWaveStroke);stroke-width:4;stroke-linejoin:round;stroke-linecap:round;filter:drop-shadow(0 0 7px rgba(255,50,189,.45)); }.command-wave circle[b-fex55c3r3s] { fill:#090d16;stroke:#42eaff;stroke-width:3;cursor:pointer; }.command-wave circle:hover[b-fex55c3r3s] { r:8;fill:#ff32bd;stroke:#fff; }.wave-axis[b-fex55c3r3s] { display:flex;justify-content:space-between;color:#68758a;font-size:9px; }.wave-axis span:nth-child(2)[b-fex55c3r3s] { color:#ff57c7;font-weight:800; }
.hq-command-page .category-drill-column + .category-drill-column[b-fex55c3r3s],.hq-command-page .category-drill-column h4[b-fex55c3r3s] { border-color:rgba(72,224,255,.12); }.hq-command-page .category-drill-column h4[b-fex55c3r3s] { color:#dce8fa;background:rgba(255,255,255,.02); }
.hq-quality-footer[b-fex55c3r3s] { margin-top:14px;opacity:.82; }
.hq-infographic-row[b-fex55c3r3s] { display:grid;grid-template-columns:minmax(0,1.35fr) minmax(300px,.65fr);gap:13px;margin-top:13px; }
.hq-podium[b-fex55c3r3s],.hq-efficiency[b-fex55c3r3s] { min-height:285px;padding:16px 18px;border:1px solid rgba(255,255,255,.075);border-radius:17px;background:radial-gradient(circle at 50% 100%,rgba(104,49,255,.13),transparent 55%),rgba(3,7,14,.55); }
.hq-podium header[b-fex55c3r3s],.hq-efficiency header[b-fex55c3r3s] { display:flex;justify-content:space-between;align-items:flex-start; }.hq-podium h3[b-fex55c3r3s],.hq-efficiency h3[b-fex55c3r3s] { margin:3px 0 0;font-size:17px; }.hq-podium header small[b-fex55c3r3s] { color:#66748a;font-size:9px; }
.podium-stage[b-fex55c3r3s] { height:210px;display:flex;align-items:flex-end;justify-content:center;gap:10%;padding:20px 7% 0; }
.podium-item[b-fex55c3r3s] { width:22%;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:flex-end; }.podium-item > strong[b-fex55c3r3s] { margin-bottom:7px;color:#cbd6e8;font-size:9px;white-space:nowrap; }.podium-item > b[b-fex55c3r3s] { margin-top:9px;color:#9da9bb;font-size:9px;white-space:nowrap; }
.podium-bar[b-fex55c3r3s] { position:relative;width:100%;min-height:48px;display:grid;place-items:center;border-radius:5px 5px 2px 2px;background:linear-gradient(90deg,color-mix(in srgb,var(--tone) 72%,#111),var(--tone));box-shadow:0 0 25px color-mix(in srgb,var(--tone) 28%,transparent);transform:perspective(250px) rotateY(-5deg); }.podium-bar[b-fex55c3r3s]::before { content:"";position:absolute;left:7px;right:-9px;top:-10px;height:11px;background:color-mix(in srgb,var(--tone) 72%,white);transform:skewX(-40deg); }.podium-bar[b-fex55c3r3s]::after { content:"";position:absolute;right:-9px;top:-5px;bottom:4px;width:10px;background:color-mix(in srgb,var(--tone) 68%,black);transform:skewY(-45deg); }.podium-bar span[b-fex55c3r3s] { z-index:2;color:#fff;font-size:22px;font-weight:900;text-shadow:0 2px 10px rgba(0,0,0,.5); }
.hq-efficiency[b-fex55c3r3s] { display:grid;align-content:start;gap:17px; }.signal-row[b-fex55c3r3s] { display:grid;grid-template-columns:1fr auto;gap:5px;color:#aab5c7;font-size:10px; }.signal-row b[b-fex55c3r3s] { color:#3ce7ff;font-size:13px; }.signal-row i[b-fex55c3r3s] { grid-column:1/-1;height:8px;overflow:hidden;border-radius:99px;background:#1c2331; }.signal-row i em[b-fex55c3r3s] { display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,#1bbfd8,#4af0ff);box-shadow:0 0 14px #2eddf5; }.signal-row.pink b[b-fex55c3r3s] { color:#ff4fc3; }.signal-row.pink i em[b-fex55c3r3s] { background:linear-gradient(90deg,#863eff,#ff38b8);box-shadow:0 0 14px #ff38b8; }.signal-row.amber b[b-fex55c3r3s] { color:#ffc62c; }.signal-row.amber i em[b-fex55c3r3s] { background:linear-gradient(90deg,#ff7425,#ffe02e);box-shadow:0 0 14px #ffad25; }.signal-summary[b-fex55c3r3s] { display:grid;grid-template-columns:auto 1fr auto 1fr;gap:7px;align-items:baseline;margin-top:2px;padding-top:14px;border-top:1px solid rgba(72,224,255,.1); }.signal-summary strong[b-fex55c3r3s] { color:#fff;font-size:22px; }.signal-summary span[b-fex55c3r3s] { color:#66748a;font-size:9px; }
.reference-chart-gallery[b-fex55c3r3s] { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:13px;margin-top:13px; }
.reference-chart-gallery > article[b-fex55c3r3s] { min-height:300px;padding:16px 18px;border:1px solid rgba(255,255,255,.075);border-radius:17px;background:radial-gradient(circle at 70% 35%,rgba(119,48,255,.11),transparent 48%),rgba(3,7,14,.58); }
.reference-chart-gallery header[b-fex55c3r3s] { display:grid;grid-template-columns:1fr auto; }.reference-chart-gallery header h3[b-fex55c3r3s] { grid-column:1;margin:3px 0 0;font-size:17px; }.reference-chart-gallery header small[b-fex55c3r3s] { grid-column:2;grid-row:1/3;align-self:center;color:#66748a;font-size:9px; }
.strategy-layout[b-fex55c3r3s] { height:225px;display:grid;grid-template-columns:minmax(150px,.8fr) minmax(190px,1.2fr);align-items:center;gap:20px; }.strategy-labels[b-fex55c3r3s] { display:grid;gap:12px; }.strategy-labels > div[b-fex55c3r3s] { display:flex;align-items:center;justify-content:space-between;padding:9px 10px 9px 14px;border-radius:4px 24px 24px 4px;color:#071018;background:linear-gradient(90deg,var(--tone),color-mix(in srgb,var(--tone) 62%,white)); }.strategy-labels b[b-fex55c3r3s] { font-size:10px; }.strategy-labels span[b-fex55c3r3s] { width:29px;height:29px;display:grid;place-items:center;border:1px solid rgba(255,255,255,.8);border-radius:50%;color:#fff;background:rgba(8,12,20,.55);font-size:9px; }
.multi-orbit[b-fex55c3r3s] { position:relative;width:205px;height:205px;justify-self:center;display:grid;place-items:center; }.multi-orbit i[b-fex55c3r3s] { position:absolute;border-radius:50%;background:radial-gradient(circle at center,#080d16 62%,transparent 63%),conic-gradient(var(--tone) calc(var(--value)*1%),#242937 0);filter:drop-shadow(0 0 8px color-mix(in srgb,var(--tone) 30%,transparent)); }.multi-orbit .orbit-1[b-fex55c3r3s] { inset:0; }.multi-orbit .orbit-2[b-fex55c3r3s] { inset:19px; }.multi-orbit .orbit-3[b-fex55c3r3s] { inset:38px; }.multi-orbit > div[b-fex55c3r3s] { z-index:2;text-align:center; }.multi-orbit strong[b-fex55c3r3s] { display:block;font-size:26px; }.multi-orbit span[b-fex55c3r3s] { color:#718097;font-size:8px;letter-spacing:.12em; }
.disc-grid[b-fex55c3r3s] { min-height:225px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));align-items:center;gap:13px; }.disc-item[b-fex55c3r3s] { min-width:0;display:grid;place-items:center;text-align:center; }.disc-3d[b-fex55c3r3s] { position:relative;width:min(115px,90%);aspect-ratio:1;border-radius:50%;background:conic-gradient(var(--tone) calc(var(--value)*1%),#313542 0);box-shadow:0 15px 0 #20232d,0 20px 25px rgba(0,0,0,.45);transform:rotateX(58deg) rotateZ(-18deg); }.disc-3d[b-fex55c3r3s]::after { content:"";position:absolute;inset:35%;border-radius:50%;background:#111621; }.disc-item strong[b-fex55c3r3s] { margin-top:17px;color:#ff4fc3;font-size:20px; }.disc-item span[b-fex55c3r3s] { min-height:30px;color:#adb8ca;font-size:9px;line-height:1.3; }.disc-item small[b-fex55c3r3s] { color:#647187;font-size:8px; }
.spike-chart-card[b-fex55c3r3s] { grid-column:1/-1; }.spike-stage[b-fex55c3r3s] { height:245px;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:7%;align-items:end;padding:17px 7% 0;border-bottom:1px solid rgba(255,255,255,.13); }.spike-item[b-fex55c3r3s] { height:100%;display:grid;grid-template-rows:18px 1fr 46px 18px 22px;place-items:center; }.spike-item > b[b-fex55c3r3s] { color:var(--tone);font-size:14px; }.spike[b-fex55c3r3s] { align-self:end;width:66%;min-height:25px;clip-path:polygon(50% 0,100% 100%,0 100%);background:linear-gradient(90deg,color-mix(in srgb,var(--tone) 55%,#10131d),var(--tone),color-mix(in srgb,var(--tone) 65%,white));filter:drop-shadow(0 0 12px color-mix(in srgb,var(--tone) 32%,transparent)); }.mini-pie[b-fex55c3r3s] { width:38px;height:38px;margin-top:8px;border:3px solid #424755;border-radius:50%;background:conic-gradient(var(--tone) calc(var(--value)*1%),#202532 0); }.spike-item strong[b-fex55c3r3s] { color:var(--tone);font-size:11px; }.spike-item span[b-fex55c3r3s] { color:#68768b;font-size:8px;white-space:nowrap; }
.hq-command-page .data-card header[b-fex55c3r3s] { border-bottom-color: rgba(69,222,255,.13); }
.hq-command-page .channel-donut[b-fex55c3r3s]::after { background: radial-gradient(circle at 36% 28%,#151b2a,#080c14); box-shadow: inset 0 0 0 1px rgba(72,224,255,.14); }
.hq-command-page .channel-table > div[b-fex55c3r3s], .hq-command-page .sale-mix-table > div[b-fex55c3r3s], .hq-command-page .rank-list > div[b-fex55c3r3s] { border-color: rgba(72,224,255,.1); }
.hq-command-page .channel-table small[b-fex55c3r3s], .hq-command-page .sale-mix-table small[b-fex55c3r3s], .hq-command-page .rank-list small[b-fex55c3r3s] { color:#77859b; }
.hq-command-page .vertical-chart[b-fex55c3r3s] { background: linear-gradient(rgba(48,220,255,.08) 1px,transparent 1px),linear-gradient(90deg,rgba(48,220,255,.08) 1px,transparent 1px),linear-gradient(180deg,#090f1a,#060a11); background-size:100% 65px,65px 100%,auto; }
.hq-command-page .product-category-card[b-fex55c3r3s] { background-color:#0a0f19 !important; color:#fff; }.hq-command-page .product-category-card[b-fex55c3r3s]::after { background:rgba(255,255,255,.025); }.hq-command-page .product-art[b-fex55c3r3s] { background:rgba(255,255,255,.045); }.hq-command-page .product-card-middle span[b-fex55c3r3s],.hq-command-page .product-card-bottom[b-fex55c3r3s] { color:#7d899b; }
.hq-command-page .payment-grid > div[b-fex55c3r3s],.hq-command-page .daily-grid > div[b-fex55c3r3s] { border-color:rgba(72,224,255,.12);background:#090e17; }
.hq-command-page .category-drilldown[b-fex55c3r3s],.hq-command-page .category-drilldown > header[b-fex55c3r3s],.hq-command-page .item-detail-list[b-fex55c3r3s] { border-color:rgba(72,224,255,.14);background:#090e17; }
.hq-command-page .category-product-list > div[b-fex55c3r3s],.hq-command-page th[b-fex55c3r3s],.hq-command-page td[b-fex55c3r3s] { border-color:rgba(72,224,255,.1); }.hq-command-page th[b-fex55c3r3s] { background:#0b111c;color:#8090a7; }.hq-command-page .item-detail-row td[b-fex55c3r3s] { background:#080d16; }.hq-command-page .platform-pill[b-fex55c3r3s],.hq-command-page .expand-btn[b-fex55c3r3s],.hq-command-page .drilldown-close[b-fex55c3r3s] { border-color:#2c394d;background:#111827;color:#dce8fa; }

/* Readability pass: real ranking bars, denser channel context and cleaner comparison charts. */
.podium-stage[b-fex55c3r3s] { min-height:210px;height:auto;display:grid;align-content:center;gap:18px;padding:20px 2% 0; }
.podium-item[b-fex55c3r3s] { width:auto;height:auto;display:grid;grid-template-columns:34px 95px minmax(90px,1fr) 110px;gap:12px;align-items:center; }
.podium-item > span[b-fex55c3r3s] { width:30px;height:30px;display:grid;place-items:center;border:1px solid #526075;border-radius:50%;color:#fff;background:#111827;font-size:9px; }
.podium-item > b[b-fex55c3r3s] { margin:0;color:#bac5d6;font-size:10px; }.podium-item > strong[b-fex55c3r3s] { margin:0;color:#f2f6ff;font-size:10px;text-align:right;white-space:nowrap; }
.podium-bar[b-fex55c3r3s] { width:auto;height:13px;min-height:0;overflow:hidden;border-radius:99px;background:#1a2230;transform:none;box-shadow:none; }
.podium-bar[b-fex55c3r3s]::before,.podium-bar[b-fex55c3r3s]::after { display:none; }.podium-bar i[b-fex55c3r3s] { display:block;width:var(--width);height:100%;border-radius:inherit;background:linear-gradient(90deg,color-mix(in srgb,var(--tone) 55%,#111),var(--tone));box-shadow:0 0 16px var(--tone); }
.strategy-layout[b-fex55c3r3s] { min-height:225px;height:auto;grid-template-columns:minmax(220px,1fr) minmax(190px,.8fr); }.strategy-labels[b-fex55c3r3s] { gap:7px; }
.strategy-labels > div[b-fex55c3r3s] { padding:7px 8px 7px 14px; }.strategy-labels b[b-fex55c3r3s] { display:grid; }.strategy-labels b small[b-fex55c3r3s] { margin-top:2px;color:rgba(4,12,18,.62);font-size:7px;font-weight:700; }.strategy-labels span[b-fex55c3r3s] { width:27px;height:27px; }
.multi-orbit .orbit-1[b-fex55c3r3s] { inset:0; }.multi-orbit .orbit-2[b-fex55c3r3s] { inset:15px; }.multi-orbit .orbit-3[b-fex55c3r3s] { inset:30px; }.multi-orbit .orbit-4[b-fex55c3r3s] { inset:45px; }.multi-orbit .orbit-5[b-fex55c3r3s] { inset:60px; }
.disc-3d[b-fex55c3r3s] { width:min(125px,90%);background:radial-gradient(circle,#0b111b 0 46%,transparent 48%),conic-gradient(var(--tone) calc(var(--value)*1%),#292f3d 0);box-shadow:inset 0 0 0 2px rgba(255,255,255,.05),0 0 28px color-mix(in srgb,var(--tone) 20%,transparent);transform:rotate(-35deg); }
.disc-3d[b-fex55c3r3s]::after { inset:8px;background:transparent;border:1px solid rgba(255,255,255,.08); }
.spike[b-fex55c3r3s] { width:38%;border-radius:12px 12px 2px 2px;clip-path:none;background:linear-gradient(90deg,color-mix(in srgb,var(--tone) 50%,#10131d),var(--tone));box-shadow:0 0 18px color-mix(in srgb,var(--tone) 28%,transparent); }
.hq-command-page .product-category-card[b-fex55c3r3s] { background-color:transparent;color:#fff; }

@media (max-width: 1200px) {
    .kpi-grid[b-fex55c3r3s] { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .quality-grid[b-fex55c3r3s] { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .reference-overview-grid[b-fex55c3r3s],
    .reference-middle-grid[b-fex55c3r3s],
    .reference-bottom-grid[b-fex55c3r3s] { grid-template-columns: 1fr; }
    .reference-dashboard-grid[b-fex55c3r3s] { grid-template-columns: 1fr; }
    .reference-dashboard-grid .channel-panel[b-fex55c3r3s],
    .reference-dashboard-grid .sale-mix-panel[b-fex55c3r3s],
    .reference-dashboard-grid .trend-panel[b-fex55c3r3s],
    .reference-dashboard-grid .product-panel[b-fex55c3r3s],
    .reference-dashboard-grid .customer-panel[b-fex55c3r3s],
    .reference-dashboard-grid .top-product-panel[b-fex55c3r3s],
    .reference-dashboard-grid .payment-panel[b-fex55c3r3s] { grid-column: auto; }
    .product-card-grid[b-fex55c3r3s] { grid-template-columns: repeat(5, minmax(110px, 1fr)); }
    .command-pulse-grid[b-fex55c3r3s] { grid-template-columns: repeat(2,minmax(0,1fr)); }
    .hq-stat-ribbon[b-fex55c3r3s] { grid-template-columns:repeat(3,minmax(0,1fr)); }
}

@media (max-width: 900px) {
    .dashboard-grid[b-fex55c3r3s] { grid-template-columns: 1fr; }
    .wide-card[b-fex55c3r3s],
    .recent-card[b-fex55c3r3s] { grid-column: auto; }
}

@media (max-width: 700px) {
    .derived-page[b-fex55c3r3s] { padding: 12px; }
    .derived-hero[b-fex55c3r3s] { flex-direction: column; }
    .scope-badge[b-fex55c3r3s] { white-space: normal; }
    .filter-panel[b-fex55c3r3s],
    .kpi-grid[b-fex55c3r3s],
    .quality-grid[b-fex55c3r3s] { grid-template-columns: 1fr; }
    .channel-mix-layout[b-fex55c3r3s] { grid-template-columns: 1fr; }
    .sale-mix-layout[b-fex55c3r3s] { grid-template-columns: 1fr; }
    .sale-mix-table > div[b-fex55c3r3s] { grid-template-columns: 9px minmax(100px, 1fr) auto; }
    .sale-mix-table b[b-fex55c3r3s] { grid-column: 2 / -1; text-align: left; }
    .product-card-grid[b-fex55c3r3s] { grid-template-columns: repeat(2, minmax(110px, 1fr)); }
    .scope-note[b-fex55c3r3s] { flex-direction: column; }
    .breakdown-row[b-fex55c3r3s] { grid-template-columns: 1fr; }
    .breakdown-row > strong[b-fex55c3r3s] { text-align: left; }
    .rank-list > div[b-fex55c3r3s] { grid-template-columns: 1fr auto; }
    .rank-list > div strong[b-fex55c3r3s] { grid-column: 1 / -1; }
    .item-detail-list > div[b-fex55c3r3s] { grid-template-columns: 1fr; }
    .item-detail-list b[b-fex55c3r3s] { text-align: left; }
    .category-dual-drilldown[b-fex55c3r3s] { grid-template-columns:1fr; }
    .category-drill-column + .category-drill-column[b-fex55c3r3s] { border-left:0;border-top:1px solid #e7eaee; }
    .command-heading[b-fex55c3r3s] { align-items:flex-start;flex-direction:column; }
    .command-pulse-grid[b-fex55c3r3s],.command-insight-grid[b-fex55c3r3s],.hq-infographic-row[b-fex55c3r3s],.reference-chart-gallery[b-fex55c3r3s] { grid-template-columns:1fr; }
    .hq-stat-ribbon[b-fex55c3r3s] { grid-template-columns:repeat(2,minmax(0,1fr)); }
    .spike-chart-card[b-fex55c3r3s] { grid-column:auto; }.spike-stage[b-fex55c3r3s] { gap:3%;padding-inline:2%; }
    .command-bar-row[b-fex55c3r3s] { grid-template-columns:85px minmax(60px,1fr) 88px; }
}

/* Final HQ layout overrides. */
.hq-command-page .reference-dashboard-grid.hq-layout .channel-panel[b-fex55c3r3s],
.hq-command-page .reference-dashboard-grid.hq-layout .sale-mix-panel[b-fex55c3r3s]{grid-column:span 6;order:1;min-width:0;min-height:480px}
.hq-command-page .reference-dashboard-grid.hq-layout .product-panel[b-fex55c3r3s]{grid-column:1/-1;order:2}
.hq-command-page .reference-dashboard-grid.hq-layout .top-product-panel[b-fex55c3r3s]{grid-column:1/-1;order:3}
.hq-command-page .channel-mix-layout[b-fex55c3r3s],.hq-command-page .sale-mix-layout[b-fex55c3r3s]{align-content:center;min-height:365px}
.thailand-region-card .thai-map-layout[b-fex55c3r3s]{grid-template-columns:minmax(285px,1.1fr) minmax(205px,.9fr);gap:12px}
.thailand-region-card .thai-region-map[b-fex55c3r3s]{width:100%;max-width:340px;height:410px;justify-self:start;overflow:visible}
.thai-region-map[b-fex55c3r3s]  .hq-region-svg{transform:none}
.thailand-region-card .region-list>div[b-fex55c3r3s]{grid-template-columns:9px minmax(0,1fr) 68px 38px;gap:7px;padding:9px 4px}
.thailand-region-card .region-list b[b-fex55c3r3s]{font-size:11px;white-space:nowrap}
.thailand-region-card .region-list span[b-fex55c3r3s]{font-size:10px;white-space:nowrap}
.thailand-region-card .region-list strong[b-fex55c3r3s]{font-size:15px}
@media(max-width:1200px){.hq-command-page .reference-dashboard-grid.hq-layout .channel-panel[b-fex55c3r3s],.hq-command-page .reference-dashboard-grid.hq-layout .sale-mix-panel[b-fex55c3r3s]{grid-column:auto}.thailand-region-card .thai-map-layout[b-fex55c3r3s]{grid-template-columns:minmax(270px,.9fr) minmax(220px,1.1fr)}}
@media(max-width:700px){.thailand-region-card .thai-map-layout[b-fex55c3r3s]{grid-template-columns:1fr}.thailand-region-card .thai-region-map[b-fex55c3r3s]{justify-self:center;max-width:310px}}

/* Current-year HQ sales goal meter. */
.hq-command-page .derived-hero[b-fex55c3r3s]{min-height:205px}
.hq-command-page .derived-hero .hero-title[b-fex55c3r3s]{position:relative;z-index:2;max-width:34%}
.ytd-goal-meter[b-fex55c3r3s]{position:absolute;z-index:2;left:50%;bottom:12px;width:390px;height:180px;transform:translateX(-50%);color:#dce9f8}
.goal-arc[b-fex55c3r3s]{position:absolute;left:45px;bottom:18px;width:300px;height:150px;border-radius:300px 300px 0 0;background:conic-gradient(from 270deg at 50% 100%,#e4525b 0deg,#f68a29 38deg,#f2cf42 78deg,#7cbdb5 124deg,#55ad4c 180deg,transparent 180deg);-webkit-mask:radial-gradient(circle at 50% 100%,transparent 0 113px,#000 114px 138px,transparent 139px);mask:radial-gradient(circle at 50% 100%,transparent 0 113px,#000 114px 138px,transparent 139px);filter:drop-shadow(0 0 9px rgba(61,225,255,.22))}
.goal-needle[b-fex55c3r3s]{position:absolute;left:194px;bottom:30px;width:4px;height:122px;border-radius:99px;background:linear-gradient(#fff,#38e8ff 55%,#111);box-shadow:0 0 10px #38e8ff;transform-origin:50% 100%;transition:transform .8s cubic-bezier(.2,.8,.2,1)}
.ytd-goal-meter>i[b-fex55c3r3s]{position:absolute;left:185px;bottom:20px;width:22px;height:22px;border:4px solid #92fbff;border-radius:50%;background:#09111d;box-shadow:0 0 15px #38e8ff}
.goal-value[b-fex55c3r3s]{position:absolute;left:50%;bottom:0;display:grid;justify-items:center;transform:translateX(-50%);line-height:1.05}.goal-value small[b-fex55c3r3s]{color:#7c8da6;font-size:8px;letter-spacing:.12em}.goal-value strong[b-fex55c3r3s]{color:#fff;font-size:18px;text-shadow:0 0 10px #38e8ff}.goal-value span[b-fex55c3r3s]{margin-top:3px;color:#55efb1;font-size:8px}
.goal-tick[b-fex55c3r3s]{position:absolute;color:#71839b;font-size:7px;font-weight:800;white-space:nowrap}.goal-tick.t0[b-fex55c3r3s]{left:23px;bottom:13px}.goal-tick.t1[b-fex55c3r3s]{left:52px;top:68px}.goal-tick.t2[b-fex55c3r3s]{left:118px;top:20px}.goal-tick.t3[b-fex55c3r3s]{right:103px;top:20px}.goal-tick.t4[b-fex55c3r3s]{right:42px;top:68px;color:#ffd34d}.goal-tick.t5[b-fex55c3r3s]{right:8px;bottom:13px;color:#66e59b}
@media(max-width:1250px){.ytd-goal-meter[b-fex55c3r3s]{width:330px;transform:translateX(-50%) scale(.86)}.hq-command-page .derived-hero .hero-title[b-fex55c3r3s]{max-width:31%}}
@media(max-width:900px){.hq-command-page .derived-hero[b-fex55c3r3s]{padding-bottom:205px}.hq-command-page .derived-hero .hero-title[b-fex55c3r3s]{max-width:none}.ytd-goal-meter[b-fex55c3r3s]{bottom:8px}.hq-command-page .scope-badge[b-fex55c3r3s]{align-self:flex-end}}
/* /Components/Pages/Admin/Analytics/HqComparison.razor.rz.scp.css */
.hq-compare-page[b-erbdx5z0fn]{min-height:100vh;padding:22px;color:#f4f7ff;font-family:'Prompt',sans-serif;background:radial-gradient(circle at 80% 5%,#241054 0,transparent 30%),linear-gradient(rgba(54,221,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(54,221,255,.035) 1px,transparent 1px),#070a11;background-size:auto,32px 32px,32px 32px,auto}.compare-hero[b-erbdx5z0fn]{display:flex;justify-content:space-between;align-items:center;padding:26px 30px;border:1px solid rgba(65,223,255,.2);border-radius:22px;background:linear-gradient(120deg,#090d16,#21104b)}.compare-hero span[b-erbdx5z0fn],.radar-panel header span[b-erbdx5z0fn],.delta-panel header span[b-erbdx5z0fn]{color:#36e5ff;font-size:10px;font-weight:900;letter-spacing:.15em}.compare-hero h1[b-erbdx5z0fn]{margin:4px 0;font-size:38px}.compare-hero p[b-erbdx5z0fn]{margin:0;color:#8794aa;font-size:11px}.compare-hero a[b-erbdx5z0fn]{padding:10px 14px;border:1px solid #344156;border-radius:10px;color:#ddecff;text-decoration:none;background:#111825}.compare-filter[b-erbdx5z0fn]{display:grid;grid-template-columns:220px 100px 220px auto;gap:13px;align-items:end;margin:14px 0;padding:15px 18px;border:1px solid rgba(65,223,255,.14);border-radius:17px;background:#0c111c}.compare-filter label[b-erbdx5z0fn]{display:grid;gap:6px;color:#8997ac;font-size:10px}.compare-filter input[b-erbdx5z0fn]{height:42px;padding:0 12px;border:1px solid #2d394d;border-radius:9px;color:#fff;background:#080d16;color-scheme:dark}.compare-filter button[b-erbdx5z0fn]{height:42px;padding:0 22px;border:0;border-radius:9px;color:#061018;font-weight:900;background:linear-gradient(90deg,#34efd1,#37cfff)}.versus[b-erbdx5z0fn]{align-self:center;color:#68768c;text-align:center;font-size:10px}.versus i[b-erbdx5z0fn]{margin:0 7px;color:#ff42bd;font-style:normal;font-weight:900}.error[b-erbdx5z0fn]{padding:14px;border:1px solid #772f47;border-radius:12px;color:#ff9ab7;background:#2c101b}.period-title[b-erbdx5z0fn]{display:flex;justify-content:center;gap:28px;margin:13px 0;color:#aeb9c9;font-size:11px}.period-title span[b-erbdx5z0fn]{color:#ff42bd}.summary-grid[b-erbdx5z0fn]{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:10px}.summary-grid article[b-erbdx5z0fn]{position:relative;padding:14px;border:1px solid rgba(63,220,255,.14);border-radius:14px;background:linear-gradient(145deg,#101725,#090d16)}.summary-grid span[b-erbdx5z0fn],.summary-grid small[b-erbdx5z0fn]{display:block;color:#758399;font-size:9px}.summary-grid strong[b-erbdx5z0fn]{display:block;margin:5px 0;font-size:18px}.summary-grid b[b-erbdx5z0fn]{position:absolute;right:12px;bottom:12px;font-size:9px}.up[b-erbdx5z0fn]{color:#31e6a2}.down[b-erbdx5z0fn]{color:#ff4f7d}.performance-layout[b-erbdx5z0fn]{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(280px,.45fr);gap:13px;margin-top:13px}.radar-panel[b-erbdx5z0fn],.delta-panel[b-erbdx5z0fn]{padding:18px;border:1px solid rgba(63,220,255,.16);border-radius:18px;background:rgba(5,8,15,.86)}.radar-panel header[b-erbdx5z0fn]{display:flex;justify-content:space-between}.radar-panel h2[b-erbdx5z0fn],.delta-panel h2[b-erbdx5z0fn]{margin:3px 0 0}.radar-panel p[b-erbdx5z0fn]{margin:4px 0;color:#728096;font-size:9px}.legend[b-erbdx5z0fn]{color:#8491a4;font-size:9px}.legend i[b-erbdx5z0fn]{display:inline-block;width:16px;height:3px;margin:0 5px 0 12px;background:#48f0ab}.legend i:nth-of-type(2)[b-erbdx5z0fn]{background:#8755ff}.radar-wrap[b-erbdx5z0fn]{display:grid;place-items:center}.radar-wrap svg[b-erbdx5z0fn]{width:min(100%,880px);height:570px;overflow:visible}.grid[b-erbdx5z0fn]{fill:rgba(107,72,255,.025);stroke:#343e52;stroke-width:1}.axis[b-erbdx5z0fn]{stroke:#273246;stroke-width:1}.shape-b[b-erbdx5z0fn]{fill:rgba(111,70,255,.26);stroke:#8b5cff;stroke-width:3}.shape-a[b-erbdx5z0fn]{fill:rgba(57,238,167,.38);stroke:#43f0aa;stroke-width:4;filter:drop-shadow(0 0 10px rgba(67,240,170,.3))}.node-a[b-erbdx5z0fn]{fill:#07100d;stroke:#56f4b5;stroke-width:3}.node-b[b-erbdx5z0fn]{fill:#0b0815;stroke:#9a75ff;stroke-width:3}.radar-wrap text[b-erbdx5z0fn]{fill:#aab6c9;font-size:12px;font-weight:800}.radar-wrap .a-value[b-erbdx5z0fn]{fill:#51efae;font-size:10px}.radar-wrap .b-value[b-erbdx5z0fn]{fill:#9a78ff;font-size:10px}.delta-panel header[b-erbdx5z0fn]{padding-bottom:13px;border-bottom:1px solid #202a3a}.delta-row[b-erbdx5z0fn]{display:grid;grid-template-columns:1fr auto;gap:7px;margin-top:20px;color:#aab5c7;font-size:10px}.delta-row i[b-erbdx5z0fn]{grid-column:1/-1;height:7px;overflow:hidden;border-radius:99px;background:#202736}.delta-row em[b-erbdx5z0fn]{display:block;height:100%;border-radius:inherit;background:#31e6a2;box-shadow:0 0 12px currentColor}.delta-row em.down[b-erbdx5z0fn]{background:#ff4f7d}@media(max-width:1100px){.summary-grid[b-erbdx5z0fn]{grid-template-columns:repeat(3,1fr)}.performance-layout[b-erbdx5z0fn]{grid-template-columns:1fr}}@media(max-width:700px){.hq-compare-page[b-erbdx5z0fn]{padding:11px}.compare-hero[b-erbdx5z0fn]{align-items:flex-start;flex-direction:column;gap:15px}.compare-filter[b-erbdx5z0fn]{grid-template-columns:1fr}.summary-grid[b-erbdx5z0fn]{grid-template-columns:repeat(2,1fr)}.radar-wrap svg[b-erbdx5z0fn]{height:auto}.performance-layout[b-erbdx5z0fn]{overflow:hidden}}

.performance-layout[b-erbdx5z0fn]{grid-template-columns:repeat(2,minmax(0,1fr))}.radar-panel[b-erbdx5z0fn],.daily-panel[b-erbdx5z0fn]{min-width:0}.delta-panel[b-erbdx5z0fn]{grid-column:1/-1;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));column-gap:24px}.delta-panel header[b-erbdx5z0fn]{grid-column:1/-1}.daily-panel[b-erbdx5z0fn]{padding:18px;border:1px solid rgba(63,220,255,.16);border-radius:18px;background:rgba(5,8,15,.86)}.daily-panel header[b-erbdx5z0fn]{display:flex;justify-content:space-between}.daily-panel header span[b-erbdx5z0fn]{color:#36e5ff;font-size:10px;font-weight:900;letter-spacing:.15em}.daily-panel h2[b-erbdx5z0fn]{margin:3px 0 0}.daily-panel p[b-erbdx5z0fn]{margin:4px 0;color:#728096;font-size:9px}.daily-chart-wrap[b-erbdx5z0fn]{position:relative}.daily-chart-wrap svg[b-erbdx5z0fn]{width:100%;height:570px;overflow:visible}.daily-grid-line[b-erbdx5z0fn]{stroke:#243044;stroke-width:1}.daily-area-a[b-erbdx5z0fn]{fill:url(#hqCompareAreaA)}.daily-line-a[b-erbdx5z0fn],.daily-line-b[b-erbdx5z0fn]{fill:none;stroke-width:4;stroke-linejoin:round;stroke-linecap:round}.daily-line-a[b-erbdx5z0fn]{stroke:#43f0aa;filter:drop-shadow(0 0 6px rgba(67,240,170,.35))}.daily-line-b[b-erbdx5z0fn]{stroke:#955fff;filter:drop-shadow(0 0 6px rgba(149,95,255,.3))}.daily-node-a[b-erbdx5z0fn]{fill:#07100d;stroke:#43f0aa;stroke-width:3}.daily-node-b[b-erbdx5z0fn]{fill:#0b0815;stroke:#955fff;stroke-width:3}.daily-value-a[b-erbdx5z0fn],.daily-value-b[b-erbdx5z0fn]{font-size:10px;font-weight:800}.daily-value-a[b-erbdx5z0fn]{fill:#53efb0}.daily-value-b[b-erbdx5z0fn]{fill:#a17dff}.daily-axis[b-erbdx5z0fn]{position:absolute;left:2.5%;right:2.5%;bottom:4px;display:flex;justify-content:space-between;color:#65738a;font-size:9px}@media(max-width:1100px){.performance-layout[b-erbdx5z0fn]{grid-template-columns:1fr}.delta-panel[b-erbdx5z0fn]{grid-column:auto;grid-template-columns:1fr}.delta-panel header[b-erbdx5z0fn]{grid-column:auto}.daily-chart-wrap svg[b-erbdx5z0fn]{height:auto}}

.compare-breakdown-grid[b-erbdx5z0fn]{display:grid;grid-template-columns:1fr;gap:14px;margin-top:14px}.paired-panel[b-erbdx5z0fn]{padding:18px;border:1px solid rgba(63,220,255,.16);border-radius:18px;background:rgba(5,8,15,.9)}.paired-panel header[b-erbdx5z0fn]{display:flex;justify-content:space-between}.paired-panel header span[b-erbdx5z0fn]{color:#36e5ff;font-size:10px;font-weight:900;letter-spacing:.15em}.paired-panel h2[b-erbdx5z0fn]{margin:3px 0;color:#f4f7ff}.paired-panel p[b-erbdx5z0fn]{margin:3px 0;color:#728096;font-size:9px}.paired-chart[b-erbdx5z0fn]{display:flex;align-items:end;gap:14px;min-height:310px;padding:24px 8px 0;border-bottom:1px solid #263249;overflow-x:auto;background:repeating-linear-gradient(to bottom,transparent 0,transparent 66px,#1d2a4055 67px)}.paired-item[b-erbdx5z0fn]{flex:1;min-width:86px;height:286px;display:grid;grid-template-rows:24px 1fr 28px 18px;align-items:end;text-align:center}.paired-values[b-erbdx5z0fn]{display:flex;justify-content:center;gap:12px;font-size:9px}.paired-values b:first-child[b-erbdx5z0fn]{color:#55efb1}.paired-values b:last-child[b-erbdx5z0fn]{color:#a784ff}.paired-stage[b-erbdx5z0fn]{height:100%;display:flex;align-items:end;justify-content:center;gap:5px}.paired-stage i[b-erbdx5z0fn]{display:block;width:22px;min-height:2px;border-radius:5px 5px 1px 1px;box-shadow:0 0 13px currentColor;transition:filter .2s}.paired-stage i:hover[b-erbdx5z0fn]{filter:brightness(1.35)}.paired-stage .bar-a[b-erbdx5z0fn]{color:#43f0aa;background:linear-gradient(#74ffd0,#24c98d 60%,#10815e)}.paired-stage .bar-b[b-erbdx5z0fn]{color:#955fff;background:linear-gradient(#c4a5ff,#8755ff 60%,#5530b8)}.paired-item>strong[b-erbdx5z0fn]{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#dbe5f5;font-size:10px}.paired-item>small[b-erbdx5z0fn]{color:#7d8ca2;font-size:9px}.category-pairs[b-erbdx5z0fn]{gap:9px}.category-pairs .paired-item[b-erbdx5z0fn]{min-width:72px}.category-pairs .paired-stage i[b-erbdx5z0fn]{width:18px}@media(max-width:700px){.paired-chart[b-erbdx5z0fn]{min-height:270px}.paired-item[b-erbdx5z0fn]{min-width:74px}}

/* Keep comparison charts inside the content viewport. */
.hq-compare-page[b-erbdx5z0fn]{width:100%;max-width:100%;overflow-x:hidden;box-sizing:border-box}.hq-compare-page *[b-erbdx5z0fn]{box-sizing:border-box}.compare-breakdown-grid[b-erbdx5z0fn],.paired-panel[b-erbdx5z0fn]{min-width:0;max-width:100%}.paired-chart[b-erbdx5z0fn]{display:grid;align-items:end;overflow:hidden;max-width:100%}.sale-types[b-erbdx5z0fn],.channel-types[b-erbdx5z0fn]{grid-template-columns:repeat(auto-fit,minmax(120px,1fr))}.category-pairs[b-erbdx5z0fn]{grid-template-columns:repeat(13,minmax(0,1fr));gap:8px}.paired-item[b-erbdx5z0fn]{min-width:0;width:100%}.category-pairs .paired-item[b-erbdx5z0fn]{min-width:0}.paired-item>strong[b-erbdx5z0fn]{padding:0 2px;font-size:9px}.paired-values[b-erbdx5z0fn]{gap:6px}.category-pairs .paired-stage i[b-erbdx5z0fn]{width:min(18px,34%)}
@media(max-width:900px){.category-pairs[b-erbdx5z0fn]{grid-template-columns:repeat(7,minmax(72px,1fr));overflow-x:auto}.paired-chart[b-erbdx5z0fn]{overflow-x:auto}.hq-compare-page[b-erbdx5z0fn]{overflow-x:hidden}}
/* /Components/Pages/Admin/Analytics/SalesBranchPicker.razor.rz.scp.css */
.branch-picker[b-2xpor9a5lg] { position:relative; width:100%; min-width:190px; }
.branch-picker summary[b-2xpor9a5lg] { display:flex; justify-content:space-between; align-items:center; gap:8px; min-height:44px; padding:9px 12px; border:1px solid #cfd5dc; border-radius:11px; background:#fff; color:#22272e; cursor:pointer; list-style:none; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.branch-picker summary[b-2xpor9a5lg]::-webkit-details-marker { display:none; }
.branch-picker summary span[b-2xpor9a5lg] { flex:none; }
.branch-options[b-2xpor9a5lg] { position:absolute; z-index:30; top:calc(100% + 4px); left:0; min-width:100%; max-height:320px; overflow:auto; padding:7px; border:1px solid #cfd5dc; border-radius:11px; background:#fff; box-shadow:0 14px 32px #18212b25; }
.branch-options label[b-2xpor9a5lg] { display:flex; align-items:center; gap:9px; min-height:34px; padding:5px 7px; margin:0; color:#242b31; font-size:12px; font-weight:600; white-space:nowrap; cursor:pointer; }
.branch-options label:hover[b-2xpor9a5lg] { background:#f5f7f9; }
.branch-options input[b-2xpor9a5lg] { width:16px; height:16px; accent-color:#ed1b2f; }
.all-branches[b-2xpor9a5lg] { display:block; width:100%; padding:8px; margin-bottom:4px; border:0; border-radius:7px; background:#f1f3f5; text-align:left; font-weight:800; cursor:pointer; }
/* /Components/Pages/Admin/Analytics/SalesComparison.razor.rz.scp.css */
.compare-page[b-95ds7toffx]{min-height:100vh;padding:22px;background:#f4f6f8;color:#20242a;font-family:'Prompt',sans-serif}.compare-hero[b-95ds7toffx]{display:flex;justify-content:space-between;gap:20px;padding:26px 30px;border-radius:22px;background:linear-gradient(110deg,#17191e,#471421);color:#fff}.compare-hero span[b-95ds7toffx],.neon-panel header span[b-95ds7toffx]{color:#ff6677;font:.72rem Consolas;letter-spacing:.15em}.compare-hero h1[b-95ds7toffx]{margin:6px 0;font-size:2.15rem}.compare-hero p[b-95ds7toffx]{margin:0;color:#c8cbd1}.compare-hero button[b-95ds7toffx],.compare-filter button[b-95ds7toffx]{border:1px solid #555d65;border-radius:10px;background:#20242a;color:#fff;padding:10px 15px;height:max-content}.compare-filter[b-95ds7toffx]{display:flex;flex-wrap:wrap;gap:12px;align-items:end;margin:16px 0;padding:15px;border:1px solid #dfe3e8;border-radius:16px;background:#fff}.compare-filter label[b-95ds7toffx]{display:flex;flex-direction:column;gap:6px;color:#687079;font-size:.75rem;font-weight:750}.compare-filter input[b-95ds7toffx],.compare-filter select[b-95ds7toffx]{min-height:39px;border:1px solid #cfd5dc;border-radius:8px;background:#fff;color:#20242a;padding:8px 10px}.compare-filter input:disabled[b-95ds7toffx]{background:#f1f3f5;color:#7f8790}.compare-filter button[b-95ds7toffx]{background:#ed1b2f;border-color:#ed1b2f;font-weight:900}.period-strip[b-95ds7toffx]{display:flex;justify-content:center;gap:22px;padding:11px;color:#59616a}.period-strip span[b-95ds7toffx]{color:#ed1b2f;font-weight:900}.compare-kpis[b-95ds7toffx]{display:grid;grid-template-columns:repeat(6,1fr);gap:12px}.compare-kpi[b-95ds7toffx],.neon-panel[b-95ds7toffx]{border:1px solid #dfe3e8;border-radius:16px;background:#fff;box-shadow:0 10px 28px rgba(30,40,50,.06)}.compare-kpi[b-95ds7toffx]{position:relative;padding:17px}.compare-kpi span[b-95ds7toffx],.compare-kpi small[b-95ds7toffx]{display:block;color:#858c95;font-size:.72rem}.compare-kpi strong[b-95ds7toffx]{display:block;margin:7px 0;font-size:1.25rem}.compare-kpi b[b-95ds7toffx]{position:absolute;right:14px;top:17px;font-size:.7rem}.up[b-95ds7toffx]{color:#18a66d}.down[b-95ds7toffx]{color:#ed1b2f}.compare-grid[b-95ds7toffx]{display:grid;grid-template-columns:1.6fr 1fr;gap:14px;margin-top:14px}.neon-panel[b-95ds7toffx]{padding:20px;overflow:hidden}.neon-panel header h2[b-95ds7toffx]{margin:3px 0 15px}.wide[b-95ds7toffx]{grid-column:1/-1}.trend-panel svg[b-95ds7toffx]{width:100%;height:310px;overflow:visible;background:repeating-linear-gradient(0deg,transparent 0 55px,#edf0f2 56px)}.trend-panel polyline[b-95ds7toffx]{fill:none;stroke-width:3;vector-effect:non-scaling-stroke}.line-a[b-95ds7toffx]{stroke:#10b8c3}.line-b[b-95ds7toffx]{stroke:#e23d8f}.point-a[b-95ds7toffx]{fill:#10b8c3;stroke:#fff;stroke-width:2;vector-effect:non-scaling-stroke}.point-b[b-95ds7toffx]{fill:#e23d8f;stroke:#fff;stroke-width:2;vector-effect:non-scaling-stroke}.value-a[b-95ds7toffx],.value-b[b-95ds7toffx]{font-size:9px;font-weight:800;text-anchor:middle;paint-order:stroke;stroke:#fff;stroke-width:3px;stroke-linejoin:round}.value-a[b-95ds7toffx]{fill:#087d85}.value-b[b-95ds7toffx]{fill:#b3226b}.line-legend[b-95ds7toffx]{font-size:.75rem;color:#727a83}.line-legend i[b-95ds7toffx]{display:inline-block;width:16px;height:3px;margin:0 5px 0 14px}.cyan[b-95ds7toffx]{background:#10b8c3}.purple[b-95ds7toffx]{background:#e23d8f}.dual-row[b-95ds7toffx]{display:grid;grid-template-columns:110px 1fr 1fr;gap:8px;align-items:center;margin:11px 0;font-size:.76rem}.dual-row div[b-95ds7toffx],.category-bars span[b-95ds7toffx]{position:relative;display:block;height:24px;background:#edf0f3;border-radius:5px;overflow:hidden}.dual-row i[b-95ds7toffx],.category-bars i[b-95ds7toffx]{display:block;height:100%;background:linear-gradient(90deg,#18aa83,#35cbd5)}.dual-row .b i[b-95ds7toffx],.category-bars .b i[b-95ds7toffx]{background:linear-gradient(90deg,#ed1b2f,#ff7a86)}.dual-row em[b-95ds7toffx],.category-bars b[b-95ds7toffx]{position:absolute;right:7px;top:3px;color:#20242a;font-style:normal}.category-bars[b-95ds7toffx]{display:grid;grid-template-columns:repeat(2,1fr);gap:10px 24px}.category-bars>div[b-95ds7toffx]{display:grid;grid-template-columns:140px 1fr 1fr;gap:8px;align-items:center;font-size:.72rem}.compare-error[b-95ds7toffx]{padding:15px;color:#c82235;background:#fff0f2;border-radius:12px}@media(max-width:1200px){.compare-kpis[b-95ds7toffx]{grid-template-columns:repeat(3,1fr)}}@media(max-width:1000px){.compare-grid[b-95ds7toffx]{grid-template-columns:1fr}.wide[b-95ds7toffx]{grid-column:auto}}@media(max-width:650px){.compare-page[b-95ds7toffx]{padding:10px}.compare-kpis[b-95ds7toffx]{grid-template-columns:1fr 1fr}.compare-filter label[b-95ds7toffx]{width:100%}.category-bars[b-95ds7toffx]{grid-template-columns:1fr}.dual-row[b-95ds7toffx],.category-bars>div[b-95ds7toffx]{grid-template-columns:90px 1fr 1fr}.period-strip[b-95ds7toffx]{flex-direction:column;align-items:center;gap:5px}}
/* /Components/Pages/Admin/Analytics/UsageV2.razor.rz.scp.css */
.usage-v2-page[b-lcko05a28c]{
min-height:100vh;
padding:22px;
background:transparent;
color:#111827;
font-family:'Prompt',sans-serif}
.calculation-stat-grid[b-lcko05a28c]{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin:16px 0}
.calculation-stat[b-lcko05a28c]{position:relative;display:grid;gap:5px;padding:18px 20px;border:1px solid #dfe4ea;border-top:4px solid var(--accent);border-radius:14px;background:#fff;box-shadow:0 8px 22px rgba(20,30,45,.07)}
.calculation-stat span[b-lcko05a28c]{color:#7b8490;font-size:.78rem}.calculation-stat strong[b-lcko05a28c]{font-size:1.65rem;line-height:1;color:#151922}.calculation-stat b[b-lcko05a28c]{position:absolute;right:20px;top:28px;color:#667080;font-size:.9rem}.calculation-stat.upgrade[b-lcko05a28c]{--accent:#20aa72}.calculation-stat.replace[b-lcko05a28c]{--accent:#4387ef}.calculation-stat.downgrade[b-lcko05a28c]{--accent:#f2a414}
@media(max-width:700px){.calculation-stat-grid[b-lcko05a28c]{grid-template-columns:1fr}.calculation-stat[b-lcko05a28c]{padding:15px 17px}}
.usage-hero[b-lcko05a28c]{
display:flex;
align-items:flex-start;
justify-content:space-between;
gap:20px;
padding:0 0 12px;
color:#20242a;
background:transparent}
.eyebrow[b-lcko05a28c]{
font-size:.69rem;
font-weight:800;
letter-spacing:.14em;
opacity:.68}
.eyebrow.dark[b-lcko05a28c]{
color:#6b7280;
opacity:1}
.usage-hero h1[b-lcko05a28c]{
margin:5px 0;
font-size:2rem;
font-weight:850;
letter-spacing:-.03em}
.usage-hero p[b-lcko05a28c]{
margin:0;
color:#737982}
.hero-badge[b-lcko05a28c]{
display:flex;
align-items:center;
gap:8px;
padding:9px 14px;
border:1px solid #d8dde3;
border-radius:999px;
background:#fff;
font-size:.78rem;
font-weight:800;
white-space:nowrap}
.live-dot[b-lcko05a28c]{width:8px;height:8px;border-radius:50%;background:#20aa72;box-shadow:0 0 0 4px rgba(32,170,114,.12)}
.usage-filter[b-lcko05a28c]{
display:flex;
align-items:end;
flex-wrap:wrap;
gap:12px;
margin-top:16px;
padding:16px;
border:1px solid #e2e5e9;
border-radius:15px;
background:#f7f8fa}
.usage-filter label[b-lcko05a28c]{
display:grid;
gap:5px}
.usage-filter label span[b-lcko05a28c]{
font-size:.75rem;
font-weight:800;
color:#6b7280}
.usage-filter input[b-lcko05a28c]{
min-width:175px;
padding:10px 12px;
border:1px solid #d7dce2;
border-radius:10px;
background:#fff}
.usage-filter button[b-lcko05a28c]{
padding:11px 20px;
border:0;
border-radius:10px;
background:#ef233c;
color:#fff;
font-weight:800}
.usage-filter button i[b-lcko05a28c]{margin-right:6px}
.usage-filter button:disabled[b-lcko05a28c]{
opacity:.55}
.usage-status[b-lcko05a28c],.period-note[b-lcko05a28c]{
margin-top:14px;
padding:14px 16px;
border-radius:12px}
.usage-status.error[b-lcko05a28c]{
background:#fee2e2;
color:#b91c1c}
.usage-status.loading[b-lcko05a28c]{
background:#e8eef7;
color:#475569}
.period-note[b-lcko05a28c]{
display:flex;
justify-content:space-between;
gap:14px;
border:1px solid #e2e5e9;
background:#fff;
color:#6b7280;
font-size:.78rem}
.period-note strong[b-lcko05a28c]{
color:#111827}
.lifetime-card[b-lcko05a28c]{
margin-top:14px;
padding:18px;
border:1px solid #d9dee5;
border-radius:16px;
background:#fff;
box-shadow:0 8px 22px rgba(31,41,55,.04)}
.lifetime-card header[b-lcko05a28c]{
display:flex;
align-items:start;
justify-content:space-between;
gap:14px;
margin-bottom:14px}
.lifetime-card h2[b-lcko05a28c]{
margin:3px 0;
font-size:1.15rem}
.lifetime-card header small[b-lcko05a28c]{
color:#7b818a;
font-size:.72rem}
.lifetime-kpi-grid[b-lcko05a28c]{
display:grid;
grid-template-columns:repeat(5,minmax(0,1fr));
gap:10px}
.lifetime-kpi-grid>div[b-lcko05a28c]{
display:grid;
gap:5px;
padding:15px;
border:1px solid #e4e7eb;
border-radius:13px;
background:linear-gradient(145deg,#fafbfc,#fff)}
.lifetime-kpi-grid>div:nth-child(1)[b-lcko05a28c]{border-color:#a9dfc5;background:linear-gradient(145deg,#eefaf4,#fff)}
.lifetime-kpi-grid>div:nth-child(3)[b-lcko05a28c]{border-color:#a9d7ef;background:linear-gradient(145deg,#eff8fd,#fff)}
.lifetime-kpi-grid>div:nth-child(4)[b-lcko05a28c]{border-color:#f5c3c9;background:linear-gradient(145deg,#fff2f4,#fff)}
.lifetime-kpi-grid>div:nth-child(5)[b-lcko05a28c]{border-color:#b9e1cf;background:linear-gradient(145deg,#effaf5,#fff)}
.lifetime-kpi-grid span[b-lcko05a28c],.lifetime-kpi-grid small[b-lcko05a28c]{
font-size:.7rem;
color:#7b818a}
.lifetime-kpi-grid strong[b-lcko05a28c]{
font-size:1.3rem}
.name-match-note[b-lcko05a28c]{
display:grid;
grid-template-columns:auto 1fr;
gap:4px 12px;
margin-top:10px;
padding:12px 14px;
border:1px solid #f0cf96;
border-radius:11px;
background:#fff8e8;
color:#92400e;
font-size:.72rem}
.name-match-note small[b-lcko05a28c]{
grid-column:2;
opacity:.8}
.usage-kpi-grid[b-lcko05a28c]{
display:grid;
grid-template-columns:repeat(4,minmax(0,1fr));
gap:12px;
margin-top:12px}
.usage-kpi-grid article[b-lcko05a28c]{
display:flex;
align-items:center;
gap:13px;
min-height:116px;
padding:18px;
border:1px solid #e2e5e9;
border-radius:15px;
background:#fff}
.usage-kpi>div:last-child[b-lcko05a28c]{min-width:0;display:grid;gap:5px}
.usage-kpi-icon[b-lcko05a28c]{width:48px;height:48px;flex:0 0 48px;display:grid;place-items:center;border-radius:14px;background:#eef1f4;color:#52606d;font-size:21px}
.usage-kpi.spec[b-lcko05a28c]{border-color:#a9dfc5;background:linear-gradient(145deg,#effaf5,#fff)}
.usage-kpi.spec .usage-kpi-icon[b-lcko05a28c]{background:#d9f3e7;color:#16a66d}
.usage-kpi.calculator[b-lcko05a28c]{border-color:#b9d4f5;background:linear-gradient(145deg,#f1f7ff,#fff)}
.usage-kpi.calculator .usage-kpi-icon[b-lcko05a28c]{background:#deecff;color:#347fdc}
.usage-kpi.quotation[b-lcko05a28c]{border-color:#e2d1fa;background:linear-gradient(145deg,#f8f3ff,#fff)}
.usage-kpi.quotation .usage-kpi-icon[b-lcko05a28c]{background:#ede3fb;color:#8358d8}
.usage-kpi.invoice[b-lcko05a28c]{border-color:#f5c3c9;background:linear-gradient(145deg,#fff2f4,#fff)}
.usage-kpi.invoice .usage-kpi-icon[b-lcko05a28c]{background:#ffe0e4;color:#ed1b2f}
.usage-kpi-grid span[b-lcko05a28c],.usage-kpi-grid small[b-lcko05a28c]{
font-size:.74rem;
color:#7b818a}
.usage-kpi-grid strong[b-lcko05a28c]{
font-size:1.55rem}
.usage-visual-grid[b-lcko05a28c]{
display:grid;
grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr);
gap:14px;
margin-top:14px}
.visual-card[b-lcko05a28c]{
padding:18px;
border:1px solid #e2e5e9;
border-radius:16px;
background:#fff;
box-shadow:0 8px 22px rgba(31,41,55,.035)}
.visual-card header[b-lcko05a28c]{
display:flex;
align-items:flex-start;
justify-content:space-between;
gap:14px;
margin-bottom:15px}
.visual-card h2[b-lcko05a28c]{
margin:3px 0 0;
font-size:1.1rem}
.visual-card header>strong[b-lcko05a28c]{
font-size:1.55rem}
.activity-mix-body[b-lcko05a28c]{
display:grid;
grid-template-columns:185px minmax(0,1fr);
align-items:center;
gap:24px}
.activity-donut[b-lcko05a28c]{
width:176px;
height:176px;
display:grid;
place-items:center;
border-radius:50%;
box-shadow:0 13px 28px rgba(31,41,55,.12)}
.activity-donut[b-lcko05a28c]:before{
content:"";
grid-area:1/1;
width:108px;
height:108px;
border-radius:50%;
background:#fff;
box-shadow:inset 0 0 0 1px #edf0f3}
.activity-donut>div[b-lcko05a28c]{
grid-area:1/1;
z-index:1;
display:grid;
place-items:center}
.activity-donut strong[b-lcko05a28c]{
font-size:1.65rem;
line-height:1}
.activity-donut span[b-lcko05a28c]{
margin-top:5px;
font-size:.68rem;
color:#8a9098}
.activity-legend[b-lcko05a28c]{
display:grid}
.activity-legend>div[b-lcko05a28c]{
display:grid;
grid-template-columns:10px minmax(0,1fr) auto auto;
align-items:center;
gap:9px;
padding:10px 0;
border-bottom:1px solid #eef0f2}
.activity-legend i[b-lcko05a28c],.daily-chart-legend i[b-lcko05a28c]{
width:9px;
height:9px;
display:inline-block;
border-radius:50%}
.activity-legend span[b-lcko05a28c]{
font-size:.78rem;
font-weight:750}
.activity-legend small[b-lcko05a28c]{
color:#8a9098;
font-size:.69rem}
.activity-legend strong[b-lcko05a28c]{
min-width:48px;
text-align:right}
.spec-dot[b-lcko05a28c]{background:#20b997}
.calc-dot[b-lcko05a28c]{background:#347fdc}
.quote-dot[b-lcko05a28c]{background:#8b5cf6}
.invoice-dot[b-lcko05a28c]{background:#ef233c}
.pulse-badge[b-lcko05a28c]{
padding:6px 10px;
border-radius:999px;
background:#e9f8f1;
color:#16815b;
font-size:.68rem;
font-weight:800}
.conversion-metric[b-lcko05a28c]{
display:grid;
gap:7px;
margin-bottom:15px}
.conversion-metric>div:first-child[b-lcko05a28c]{
display:flex;
align-items:center;
justify-content:space-between;
gap:12px}
.conversion-metric span[b-lcko05a28c]{
font-size:.78rem;
font-weight:750}
.conversion-metric strong[b-lcko05a28c]{
font-size:1.2rem}
.conversion-metric small[b-lcko05a28c]{
color:#858b94;
font-size:.69rem}
.metric-track[b-lcko05a28c]{
height:12px;
overflow:hidden;
border-radius:999px;
background:#edf0f3}
.metric-track i[b-lcko05a28c]{
height:100%;
display:block;
min-width:2px;
border-radius:inherit}
.invoice-rate[b-lcko05a28c]{background:linear-gradient(90deg,#347fdc,#59a4f5)}
.paid-rate[b-lcko05a28c]{background:linear-gradient(90deg,#20b997,#45d1a5)}
.conversion-times[b-lcko05a28c]{
display:grid;
grid-template-columns:1fr 1fr;
gap:9px;
margin-top:4px}
.conversion-times>div[b-lcko05a28c]{
display:grid;
gap:4px;
padding:12px;
border-radius:11px;
background:#f3f5f7}
.conversion-times span[b-lcko05a28c]{
font-size:.68rem;
color:#7b818a}
.conversion-times strong[b-lcko05a28c]{
font-size:.92rem}
.link-quality-grid[b-lcko05a28c]{
display:grid;
grid-template-columns:1fr 1fr;
gap:12px;
margin-top:12px}
.link-quality-grid article[b-lcko05a28c]{
display:grid;
gap:4px;
padding:15px 17px;
border-radius:14px}
.link-quality-grid span[b-lcko05a28c],.link-quality-grid small[b-lcko05a28c]{
font-size:.72rem}
.link-quality-grid strong[b-lcko05a28c]{
font-size:.95rem}
.exact-link[b-lcko05a28c]{
border:1px solid #a7e3c4;
background:#ecfdf5;
color:#166534}
.missing-link[b-lcko05a28c]{
border:1px solid #f0cf96;
background:#fff8e8;
color:#92400e}
.funnel-card[b-lcko05a28c],.usage-card[b-lcko05a28c]{
margin-top:14px;
padding:18px;
border:1px solid #e2e5e9;
border-radius:16px;
background:#fff}
.funnel-card header[b-lcko05a28c],.usage-card header[b-lcko05a28c]{
display:flex;
align-items:start;
justify-content:space-between;
gap:14px;
margin-bottom:15px}
.funnel-card h2[b-lcko05a28c],.usage-card h2[b-lcko05a28c]{
margin:3px 0;
font-size:1.1rem}
.funnel-card header small[b-lcko05a28c],.usage-card header small[b-lcko05a28c]{
color:#858b94;
font-size:.72rem}
.funnel-grid[b-lcko05a28c]{
display:grid;
grid-template-columns:1fr 50px 1fr 50px 1fr;
align-items:center;
gap:10px}
.funnel-grid>div:not(.arrow)[b-lcko05a28c]{
display:grid;
gap:4px;
padding:17px;
border:1px solid #e5e7eb;
border-radius:13px;
background:#fafbfc}
.funnel-grid>div:nth-child(1)[b-lcko05a28c]{border-color:#a9dfc5;background:linear-gradient(145deg,#effaf5,#fff)}
.funnel-grid>div:nth-child(3)[b-lcko05a28c]{border-color:#b9d4f5;background:linear-gradient(145deg,#f1f7ff,#fff)}
.funnel-grid>div:nth-child(5)[b-lcko05a28c]{border-color:#f5c3c9;background:linear-gradient(145deg,#fff2f4,#fff)}
.funnel-grid span[b-lcko05a28c],.funnel-grid small[b-lcko05a28c],.duration-grid span[b-lcko05a28c]{
color:#7b818a;
font-size:.73rem}
.funnel-grid strong[b-lcko05a28c]{
font-size:1.5rem}
.funnel-grid .arrow[b-lcko05a28c]{
text-align:center;
color:#ef233c;
font-size:1.5rem;
font-weight:900}
.duration-grid[b-lcko05a28c]{
display:grid;
grid-template-columns:repeat(3,minmax(0,1fr));
gap:9px;
margin-top:10px}
.duration-grid>div[b-lcko05a28c]{
display:flex;
align-items:center;
justify-content:space-between;
gap:10px;
padding:11px 13px;
border-radius:10px;
background:#f2f4f7}
.usage-dashboard-grid[b-lcko05a28c]{
display:grid;
grid-template-columns:1fr 1fr;
gap:14px}
.wide-card[b-lcko05a28c]{
grid-column:1/-1}
.daily-activity-list[b-lcko05a28c]{
display:grid;
grid-template-columns:repeat(auto-fit,minmax(190px,1fr));
gap:8px}
.daily-activity-list>div[b-lcko05a28c]{
display:grid;
grid-template-columns:1fr auto;
gap:4px 10px;
padding:11px 12px;
border:1px solid #eceef1;
border-radius:11px;
background:linear-gradient(145deg,#f8fbfc,#fff);
box-shadow:inset 0 3px 0 #dceff1}
.daily-activity-list>div strong[b-lcko05a28c]{
grid-column:1/-1}
.daily-activity-list span[b-lcko05a28c]{
font-size:.7rem;
color:#7e848d}
.daily-activity-list b[b-lcko05a28c]{
grid-column:2;
grid-row:2/6;
align-self:center;
font-size:1.2rem}
.daily-chart-legend[b-lcko05a28c]{
display:flex;
justify-content:flex-end;
flex-wrap:wrap;
gap:13px;
margin:-3px 0 13px}
.daily-chart-legend span[b-lcko05a28c]{
display:flex;
align-items:center;
gap:5px;
font-size:.68rem;
color:#737982}
.daily-chart-scroll[b-lcko05a28c]{
overflow-x:auto;
padding:4px 2px 8px}
.daily-activity-chart[b-lcko05a28c]{
height:285px;
min-width:max(100%,calc(var(--day-count, 14) * 66px));
display:flex;
align-items:stretch;
gap:8px;
padding:12px 10px 0;
border:1px solid #e7edf1;
border-radius:13px;
background:repeating-linear-gradient(to bottom,#fff 0,#fff 53px,#edf2f5 54px)}
.daily-column[b-lcko05a28c]{
min-width:58px;
flex:1;
display:grid;
grid-template-rows:22px 1fr 28px;
align-items:end;
text-align:center}
.daily-column>b[b-lcko05a28c]{
align-self:start;
font-size:.72rem;
color:#5d6671}
.daily-column>strong[b-lcko05a28c]{
align-self:center;
white-space:nowrap;
font-size:.68rem;
color:#6f7781}
.bar-cluster[b-lcko05a28c]{
height:205px;
display:flex;
align-items:flex-end;
justify-content:center;
gap:3px;
border-bottom:1px solid #cfd7de}
.bar-cluster>i[b-lcko05a28c]{
position:relative;
width:9px;
min-height:2px;
border-radius:4px 4px 1px 1px;
transition:height .2s ease}
.bar-cluster>i span[b-lcko05a28c]{
display:none;
position:absolute;
left:50%;
bottom:calc(100% + 4px);
transform:translateX(-50%);
padding:2px 4px;
border-radius:4px;
background:#111827;
color:#fff;
font:normal .58rem 'Prompt',sans-serif;
z-index:3}
.bar-cluster>i:hover span[b-lcko05a28c]{display:block}
.spec-bar[b-lcko05a28c]{background:linear-gradient(180deg,#48d8ae,#20b997)}
.calc-bar[b-lcko05a28c]{background:linear-gradient(180deg,#65aff9,#347fdc)}
.quote-bar[b-lcko05a28c]{background:linear-gradient(180deg,#ad85f5,#8b5cf6)}
.invoice-bar[b-lcko05a28c]{background:linear-gradient(180deg,#ff6375,#ef233c)}
.status-list[b-lcko05a28c],.ranking-list[b-lcko05a28c]{
display:grid;
gap:8px}
.status-list>div[b-lcko05a28c],.ranking-list>div[b-lcko05a28c]{
display:grid;
grid-template-columns:1fr auto;
gap:4px 12px;
align-items:center;
padding:9px 2px;
border-bottom:1px solid #eef0f2}
.ranking-list>div[b-lcko05a28c]{
grid-template-columns:1fr auto}
.ranking-list small[b-lcko05a28c]{
grid-column:1;
color:#8a9098;
font-size:.68rem}
.ranking-list strong[b-lcko05a28c]{
grid-column:2;
grid-row:1/3}
.status-list>div>i[b-lcko05a28c],.ranking-list>div>i[b-lcko05a28c]{
grid-column:1/-1;
height:5px;
overflow:hidden;
border-radius:999px;
background:#edf0f3}
.status-list>div>i b[b-lcko05a28c],.ranking-list>div>i b[b-lcko05a28c]{
height:100%;
display:block;
border-radius:inherit;
background:linear-gradient(90deg,#ef233c,#ff6c7d)}
.ranking-list>div>i b[b-lcko05a28c]{
background:linear-gradient(90deg,#347fdc,#20b997)}
.empty[b-lcko05a28c]{
padding:35px;
border:1px dashed #d7dbe0;
border-radius:12px;
text-align:center;
color:#9298a1}
@media(max-width:1050px){
.usage-visual-grid[b-lcko05a28c]{
grid-template-columns:1fr}
.lifetime-kpi-grid[b-lcko05a28c]{
grid-template-columns:repeat(2,minmax(0,1fr))}
.usage-kpi-grid[b-lcko05a28c]{
grid-template-columns:repeat(2,minmax(0,1fr))}
.funnel-grid[b-lcko05a28c]{
grid-template-columns:1fr}
.funnel-grid .arrow[b-lcko05a28c]{
transform:rotate(90deg)}
.duration-grid[b-lcko05a28c]{
grid-template-columns:1fr}
}
@media(max-width:760px){
.usage-v2-page[b-lcko05a28c]{
padding:12px}
.usage-hero[b-lcko05a28c]{
align-items:flex-start;
flex-direction:column}
.usage-kpi-grid[b-lcko05a28c],.link-quality-grid[b-lcko05a28c],.usage-dashboard-grid[b-lcko05a28c]{
grid-template-columns:1fr}
.activity-mix-body[b-lcko05a28c]{
grid-template-columns:1fr;
justify-items:center;
width:100%}
.activity-legend[b-lcko05a28c]{
width:100%}
.conversion-times[b-lcko05a28c]{
grid-template-columns:1fr}
.wide-card[b-lcko05a28c]{
grid-column:auto}
.period-note[b-lcko05a28c]{
flex-direction:column}
.lifetime-card header[b-lcko05a28c]{
flex-direction:column}
.lifetime-kpi-grid[b-lcko05a28c]{
grid-template-columns:1fr}
.name-match-note[b-lcko05a28c]{
grid-template-columns:1fr}
.name-match-note small[b-lcko05a28c]{
grid-column:auto}
}
/* /Components/Pages/Admin/InventoryLab/InventoryAccessDenied.razor.rz.scp.css */
.inventory-denied-page[b-853x6njroh] { max-width: 1600px; margin: 0 auto; padding: 0 16px; }

.inventory-access-denied[b-853x6njroh] {
    min-height: min(68vh, 620px);
    display: grid;
    place-items: center;
    padding: clamp(18px, 4vw, 48px);
    background: #f5f7f9;
}

.inventory-access-denied-card[b-853x6njroh] {
    display: grid;
    grid-template-columns: minmax(150px, 220px) minmax(0, 1fr);
    align-items: center;
    gap: clamp(22px, 4vw, 44px);
    width: min(100%, 760px);
    padding: clamp(20px, 4vw, 38px);
    border: 1px solid #dce2e7;
    border-top: 4px solid #dc3545;
    border-radius: 20px;
    background: #fff;
    box-shadow: 0 16px 45px #1f293714;
}

.inventory-access-denied-card img[b-853x6njroh] {
    display: block;
    width: 100%;
    max-height: 300px;
    aspect-ratio: 3 / 4;
    object-fit: cover;
    object-position: center;
    border-radius: 14px;
    background: #17191d;
}

.inventory-access-denied-content[b-853x6njroh] { min-width: 0; }
.inventory-access-denied-eyebrow[b-853x6njroh] { color: #d92f45; font-size: .72rem; font-weight: 800; letter-spacing: .13em; }
.inventory-access-denied-eyebrow i[b-853x6njroh] { margin-right: 5px; }
.inventory-access-denied h1[b-853x6njroh] { margin: 12px 0 8px; color: #17212b; font-size: clamp(1.7rem, 3vw, 2.5rem); font-weight: 800; }
.inventory-access-denied p[b-853x6njroh] { margin: 0 0 6px; color: #25323d; font-size: 1rem; font-weight: 600; line-height: 1.5; }
.inventory-access-denied small[b-853x6njroh] { display: block; color: #687680; line-height: 1.6; }
.inventory-access-denied a[b-853x6njroh] { display: inline-flex; align-items: center; gap: 8px; margin-top: 24px; padding: 10px 15px; border-radius: 9px; background: #20252a; color: #fff; font-size: .85rem; font-weight: 700; text-decoration: none; }
.inventory-access-denied a:hover[b-853x6njroh] { background: #dc3545; color: #fff; }

@media (max-width: 620px) {
    .inventory-access-denied[b-853x6njroh] { min-height: 0; }
    .inventory-access-denied-card[b-853x6njroh] { grid-template-columns: 1fr; justify-items: center; text-align: center; }
    .inventory-access-denied-card img[b-853x6njroh] { width: min(48vw, 170px); max-height: none; }
}
/* /Components/Pages/Admin/InventoryLab/InventoryHome.razor.rz.scp.css */
.ich-shell[b-u082lm36vw]{min-height:100vh;padding:24px;background:#f4f6f8;color:#162026}.ich-hero[b-u082lm36vw]{display:flex;justify-content:space-between;align-items:center;padding:30px 34px;border-radius:25px;color:#fff;background:radial-gradient(circle at 80% 0,#22554b 0,transparent 35%),linear-gradient(120deg,#14181c,#1d2827)}.ich-hero>div>small[b-u082lm36vw]{color:#42dfbd;font-weight:900;letter-spacing:.15em}.ich-hero h1[b-u082lm36vw]{font-size:2.5rem;font-weight:900;margin:5px 0 0}.ich-hero p[b-u082lm36vw]{margin:2px 0;color:#bac6c3}.ich-hero>span[b-u082lm36vw]{display:grid;grid-template-columns:28px auto;gap:0 8px;background:#ffffff0e;border:1px solid #ffffff20;border-radius:14px;padding:11px 14px;font-size:.65rem;color:#b8c3c0}.ich-hero>span i[b-u082lm36vw]{grid-row:1/3;font-size:1.5rem;color:#39dfa9}.ich-hero>span b[b-u082lm36vw]{color:#fff}.ich-stats[b-u082lm36vw]{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin:15px 0}.ich-stats article[b-u082lm36vw]{position:relative;overflow:hidden;display:flex;flex-direction:column;background:#fff;border:1px solid #e0e5e7;border-radius:17px;padding:17px 19px}.ich-stats article[b-u082lm36vw]:before{content:"";position:absolute;inset:0 auto 0 0;width:3px;background:#14b690}.ich-stats article.amber[b-u082lm36vw]:before{background:#ffac22}.ich-stats article.blue[b-u082lm36vw]:before{background:#4188f0}.ich-stats small[b-u082lm36vw]{color:#75808a;font-size:.65rem;font-weight:900}.ich-stats strong[b-u082lm36vw]{font-size:1.8rem}.ich-stats span[b-u082lm36vw]{font-size:.68rem;color:#979ea5}.ich-board[b-u082lm36vw]{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(300px,.65fr);gap:14px}.ich-actions[b-u082lm36vw]{display:grid;grid-template-columns:1fr 1fr;gap:12px}.ich-actions button[b-u082lm36vw]{display:grid;grid-template-columns:48px 1fr 20px;gap:12px;align-items:center;text-align:left;border:1px solid #dee4e6;background:#fff;border-radius:18px;padding:18px;transition:.18s}.ich-actions button:hover:not(.disabled)[b-u082lm36vw]{transform:translateY(-2px);border-color:#18b696;box-shadow:0 12px 25px #173c3514}.ich-actions button>i:first-child[b-u082lm36vw]{font-size:1.25rem;width:46px;height:46px;display:grid;place-items:center;border-radius:13px;color:#07856d;background:#e3f9f4}.ich-actions button>span[b-u082lm36vw]{display:flex;flex-direction:column}.ich-actions small[b-u082lm36vw]{color:#0a9c81;font-size:.6rem;font-weight:900;letter-spacing:.1em}.ich-actions b[b-u082lm36vw]{font-size:.94rem}.ich-actions em[b-u082lm36vw]{font-style:normal;color:#8b949c;font-size:.68rem}.ich-actions button.disabled[b-u082lm36vw]{opacity:.55}.ich-board aside[b-u082lm36vw]{background:#171c21;color:#fff;border-radius:19px;padding:19px}.queue-head small[b-u082lm36vw]{color:#42dcb9;font-weight:900;letter-spacing:.1em}.queue-head h2[b-u082lm36vw]{font-size:1.15rem;margin:2px 0 12px}.ich-board aside article[b-u082lm36vw]{display:grid;grid-template-columns:34px 1fr auto;gap:9px;align-items:center;border-top:1px solid #ffffff12;padding:12px 0}.ich-board aside article>i[b-u082lm36vw]{color:#41d7b6}.ich-board aside article.urgent>i[b-u082lm36vw]{color:#ffb32b}.ich-board aside article.rma>i[b-u082lm36vw]{color:#ef5a6d}.ich-board aside article span[b-u082lm36vw]{display:flex;flex-direction:column}.ich-board aside article small[b-u082lm36vw]{color:#8f999f;font-size:.63rem}.ich-board aside article strong[b-u082lm36vw]{font-size:1.25rem}.connection[b-u082lm36vw]{display:flex;flex-direction:column;gap:6px;background:#ffffff09;border-radius:12px;padding:11px;margin-top:8px;font-size:.68rem}.connection span[b-u082lm36vw]{color:#aeb7bc}.connection i[b-u082lm36vw]{margin-right:5px;color:#3cd4b1}.ich-flow[b-u082lm36vw]{display:flex;align-items:center;gap:10px;background:#fff;border:1px solid #e0e5e7;border-radius:18px;padding:15px;margin-top:14px}.ich-flow>div[b-u082lm36vw]{display:flex;align-items:center;gap:9px;flex:1}.ich-flow>div>b[b-u082lm36vw]{width:30px;height:30px;display:grid;place-items:center;border-radius:9px;background:#e4f9f4;color:#087c68}.ich-flow span[b-u082lm36vw]{display:flex;flex-direction:column;font-weight:800;font-size:.76rem}.ich-flow small[b-u082lm36vw]{font-weight:400;color:#9299a0}.ich-flow>i[b-u082lm36vw]{color:#c7cdd1}.ich-loading[b-u082lm36vw]{min-height:300px;display:flex;flex-direction:column;gap:10px;align-items:center;justify-content:center;color:#839098}@media(max-width:1000px){.ich-board[b-u082lm36vw]{grid-template-columns:1fr}.ich-stats[b-u082lm36vw]{grid-template-columns:1fr 1fr}}@media(max-width:700px){.ich-shell[b-u082lm36vw]{padding:12px}.ich-hero[b-u082lm36vw]{align-items:flex-start;gap:14px;flex-direction:column}.ich-actions[b-u082lm36vw],.ich-stats[b-u082lm36vw]{grid-template-columns:1fr}.ich-flow[b-u082lm36vw]{align-items:flex-start;overflow:auto}.ich-flow>div[b-u082lm36vw]{min-width:120px}}
/* /Components/Pages/Admin/InventoryLab/InventoryLab.razor.rz.scp.css */
.inv-shell[b-8n9lipn0zw]{min-height:100vh;padding:24px;background:#f4f6f8;color:#172028}.inv-hero[b-8n9lipn0zw]{display:flex;align-items:center;justify-content:space-between;border-radius:24px;padding:28px 32px;color:#fff;background:linear-gradient(120deg,#15191d,#182b29 58%,#075c50)}.inv-hero small[b-8n9lipn0zw]{font-weight:900;letter-spacing:.14em;color:#38dfbf}.inv-hero h1[b-8n9lipn0zw]{font-size:2.2rem;margin:5px 0 0;font-weight:900}.inv-hero p[b-8n9lipn0zw]{margin:3px 0;color:#c1ccc9}.lab[b-8n9lipn0zw]{display:flex;align-items:center;gap:10px;background:#ffffff12;border:1px solid #ffffff20;border-radius:15px;padding:11px 15px}.lab i[b-8n9lipn0zw]{font-size:1.7rem;color:#45e0a8}.lab span[b-8n9lipn0zw]{display:flex;flex-direction:column}.lab small[b-8n9lipn0zw]{letter-spacing:0;color:#bdc8c5}.inv-tabs[b-8n9lipn0zw]{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:15px 0}.inv-tabs button[b-8n9lipn0zw]{display:flex;align-items:center;gap:11px;text-align:left;padding:14px;border:1px solid #e0e4e7;border-radius:16px;background:#fff}.inv-tabs button>i[b-8n9lipn0zw]{font-size:1.35rem;width:40px;height:40px;display:grid;place-items:center;border-radius:11px;background:#edf1f2}.inv-tabs span[b-8n9lipn0zw]{display:flex;flex-direction:column}.inv-tabs small[b-8n9lipn0zw]{color:#89929b}.inv-tabs button.active[b-8n9lipn0zw]{border-color:#12b997;box-shadow:inset 0 -3px #12b997}.inv-tabs button.active>i[b-8n9lipn0zw]{background:#ddfaf4;color:#05846b}.inv-grid[b-8n9lipn0zw]{display:grid;grid-template-columns:minmax(0,1.65fr) minmax(320px,.75fr);gap:14px}.form-card[b-8n9lipn0zw],.list-card[b-8n9lipn0zw],.movement-preview[b-8n9lipn0zw]{background:#fff;border:1px solid #e0e4e7;border-radius:19px;padding:18px}.title[b-8n9lipn0zw]{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:14px}.title small[b-8n9lipn0zw]{font-size:.63rem;color:#0ba98b;font-weight:900;letter-spacing:.12em}.title h2[b-8n9lipn0zw]{font-size:1.15rem;margin:2px 0;font-weight:900}.title>span[b-8n9lipn0zw]{font-size:.68rem;padding:6px 9px;background:#e8faf6;color:#087a64;border-radius:99px}.fields[b-8n9lipn0zw]{display:grid;gap:10px;margin-bottom:10px}.fields.two[b-8n9lipn0zw]{grid-template-columns:1fr 1fr}.form-card label[b-8n9lipn0zw]{display:flex;flex-direction:column;gap:4px;font-size:.68rem;font-weight:800}.form-card input[b-8n9lipn0zw],.form-card select[b-8n9lipn0zw],.form-card textarea[b-8n9lipn0zw]{width:100%;min-height:39px;border:1px solid #dce1e5;border-radius:10px;padding:8px;background:#fff}.form-card textarea[b-8n9lipn0zw]{min-height:58px}.full[b-8n9lipn0zw]{margin-top:10px}.line-box[b-8n9lipn0zw]{border:1px solid #e2e6e9;background:#f8f9fa;border-radius:14px;padding:11px}.line-head[b-8n9lipn0zw]{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}.line-head button[b-8n9lipn0zw]{border:0;background:#1e252b;color:#fff;border-radius:8px;padding:6px 9px;font-size:.68rem}.edit-line[b-8n9lipn0zw]{display:grid;grid-template-columns:145px minmax(180px,1fr) 65px 70px 34px;gap:7px;padding:9px 0;border-top:1px solid #e3e7ea}.edit-line:first-of-type[b-8n9lipn0zw]{border-top:0}.check[b-8n9lipn0zw]{justify-content:center;align-items:center!important;flex-direction:row!important}.check input[b-8n9lipn0zw]{width:auto;min-height:auto}.remove[b-8n9lipn0zw]{align-self:end;height:39px;border:0;border-radius:9px;color:#d52c3e;background:#feecef}.serials[b-8n9lipn0zw]{grid-column:1/6}.serials small[b-8n9lipn0zw]{font-weight:400;color:#8c949b}.primary[b-8n9lipn0zw]{width:100%;margin-top:12px;border:0;border-radius:11px;padding:11px;background:#10ae8d;color:#fff;font-weight:900}.primary.blue[b-8n9lipn0zw]{background:#397ee8}.list-card article[b-8n9lipn0zw]{display:grid;grid-template-columns:minmax(0,1fr) auto auto;align-items:center;gap:9px;padding:12px 2px;border-top:1px solid #edf0f2}.list-card article>div[b-8n9lipn0zw]{display:flex;flex-direction:column;min-width:0}.list-card article small[b-8n9lipn0zw]{font-size:.66rem;color:#8a929a;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.list-card article code[b-8n9lipn0zw]{font-size:.64rem;color:#e22f44}.list-card article>strong[b-8n9lipn0zw]{font-size:.72rem}.pill[b-8n9lipn0zw]{font-size:.64rem;font-weight:900;padding:5px 7px;border-radius:99px}.pill.amber[b-8n9lipn0zw]{background:#fff3d9;color:#9c6200}.pill.blue[b-8n9lipn0zw]{background:#e8f0ff;color:#2667c7}.inv-message[b-8n9lipn0zw]{display:flex;gap:8px;align-items:center;border-radius:12px;padding:10px 13px;margin-bottom:12px;font-size:.78rem;font-weight:700}.inv-message.success[b-8n9lipn0zw]{background:#e5faf3;color:#087559}.inv-message.error[b-8n9lipn0zw]{background:#ffedef;color:#b62536}.movement-preview[b-8n9lipn0zw]{display:flex;justify-content:space-between;align-items:center;margin-top:14px;background:#181d22;color:#fff}.movement-preview small[b-8n9lipn0zw]{color:#38dabe;letter-spacing:.12em;font-weight:900}.movement-preview h3[b-8n9lipn0zw]{font-size:1rem;margin:3px 0}.moves[b-8n9lipn0zw]{display:flex;gap:8px;flex-wrap:wrap}.moves span[b-8n9lipn0zw]{display:flex;flex-direction:column;background:#ffffff10;border:1px solid #ffffff12;border-radius:11px;padding:8px 10px;font-size:.65rem}.moves i[b-8n9lipn0zw]{color:#47dcbd}.moves b[b-8n9lipn0zw]{font-size:.72rem}@media(max-width:1000px){.inv-grid[b-8n9lipn0zw]{grid-template-columns:1fr}.movement-preview[b-8n9lipn0zw]{align-items:flex-start;gap:14px;flex-direction:column}}@media(max-width:700px){.inv-shell[b-8n9lipn0zw]{padding:12px}.inv-hero[b-8n9lipn0zw]{align-items:flex-start;gap:14px;flex-direction:column}.inv-tabs[b-8n9lipn0zw]{grid-template-columns:1fr}.fields.two[b-8n9lipn0zw]{grid-template-columns:1fr}.edit-line[b-8n9lipn0zw]{grid-template-columns:1fr 70px}.product-name[b-8n9lipn0zw]{grid-column:1/3}.serials[b-8n9lipn0zw]{grid-column:1/3}.remove[b-8n9lipn0zw]{grid-column:2}.check[b-8n9lipn0zw]{grid-column:1}}
/* /Components/Pages/Admin/InventoryLab/InventoryLineEditor.razor.rz.scp.css */
.line-box[b-wj0jyow8ov]{border:1px solid #e2e6e9;background:#f8f9fa;border-radius:14px;padding:11px}.line-head[b-wj0jyow8ov]{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}.line-head button[b-wj0jyow8ov]{border:0;background:#1e252b;color:#fff;border-radius:8px;padding:6px 9px;font-size:.68rem}.edit-line[b-wj0jyow8ov]{display:grid;grid-template-columns:145px minmax(180px,1fr) 65px 70px 34px;gap:7px;padding:9px 0;border-top:1px solid #e3e7ea}.edit-line:first-of-type[b-wj0jyow8ov]{border-top:0}label[b-wj0jyow8ov]{display:flex;flex-direction:column;gap:4px;font-size:.68rem;font-weight:800}input[b-wj0jyow8ov],textarea[b-wj0jyow8ov]{width:100%;min-height:39px;border:1px solid #dce1e5;border-radius:10px;padding:8px;background:#fff}textarea[b-wj0jyow8ov]{min-height:58px}.check[b-wj0jyow8ov]{justify-content:center;align-items:center;flex-direction:row}.check input[b-wj0jyow8ov]{width:auto;min-height:auto}.remove[b-wj0jyow8ov]{align-self:end;height:39px;border:0;border-radius:9px;color:#d52c3e;background:#feecef}.serials[b-wj0jyow8ov]{grid-column:1/6}.serials small[b-wj0jyow8ov]{font-weight:400;color:#8c949b}@media(max-width:700px){.edit-line[b-wj0jyow8ov]{grid-template-columns:1fr 70px}.product-name[b-wj0jyow8ov]{grid-column:1/3}.serials[b-wj0jyow8ov]{grid-column:1/3}.remove[b-wj0jyow8ov]{grid-column:2}.check[b-wj0jyow8ov]{grid-column:1}}
.serial-chip-box[b-wj0jyow8ov]{min-height:65px;max-height:260px}.serial-show-all[b-wj0jyow8ov]{border:0;border-radius:8px;margin-top:6px;padding:5px 9px;background:#e6f7f2;color:#08745c;font-size:.7rem;font-weight:800}.serial-bulk[b-wj0jyow8ov]{margin-top:9px;padding:9px;border:1px dashed #b8d6cc;border-radius:9px;background:#f6fcfa}.serial-bulk summary[b-wj0jyow8ov]{cursor:pointer;color:#08745c;font-size:.72rem;font-weight:800}.serial-bulk textarea[b-wj0jyow8ov]{margin-top:8px;font-family:monospace}.serial-bulk button[b-wj0jyow8ov]{border:0;border-radius:8px;padding:7px 10px;background:#087e64;color:#fff;font-size:.72rem;font-weight:800}
/* /Components/Pages/Admin/InventoryLab/InventoryModuleHeader.razor.rz.scp.css */
.inventory-module-header[b-m597xethx3] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    width: 100%;
    min-height: 150px;
    box-sizing: border-box;
    padding: 26px 30px;
    border: 1px solid #ffffff12;
    border-radius: 20px;
    background: radial-gradient(ellipse at 100% 0, #0b5d50 0, transparent 65%), linear-gradient(120deg, #14181c, #1d2827);
    color: #fff;
}

.inventory-module-heading[b-m597xethx3] { min-width: 0; }
.inventory-module-brand[b-m597xethx3] {
    display: block;
    color: #42dfbd;
    font-size: .7rem;
    font-weight: 900;
    letter-spacing: .12em;
    line-height: 1.5;
}
.inventory-module-title[b-m597xethx3] {
    margin: 6px 0 8px;
    color: #fff;
    font-size: 2.25rem;
    font-weight: 900;
    line-height: 1.2;
}
.inventory-module-description[b-m597xethx3] {
    margin: 0;
    color: #bccfc9;
    font-size: .85rem;
    line-height: 1.6;
}
.inventory-module-description strong[b-m597xethx3] { color: #d9eee7; font-weight: 800; }
.inventory-module-actions[b-m597xethx3] {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 14px;
    flex-wrap: wrap;
    flex-shrink: 0;
    max-width: 45%;
}
.inventory-module-actions[b-m597xethx3]  .inventory-header-sync { color: #fff; text-align: right; font-size: .85rem; font-weight: 800; }
.inventory-module-actions[b-m597xethx3]  .inventory-header-sync small { display: block; color: #bccfc9; font-size: .75rem; font-weight: 400; }
.inventory-module-actions[b-m597xethx3]  .inventory-header-link {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 9px 14px;
    border: 1px solid #ffffff40;
    border-radius: 9px;
    background: #ffffff12;
    color: #fff;
    text-decoration: none;
    font-size: .8rem;
    font-weight: 800;
}
.inventory-module-actions[b-m597xethx3]  .inventory-header-link:hover { background: #ffffff25; }
.inventory-module-actions[b-m597xethx3]  .inventory-header-link:focus-visible { outline: 2px solid #42dfbd; outline-offset: 3px; }

@media (max-width: 800px) {
    .inventory-module-header[b-m597xethx3] { align-items: flex-start; flex-direction: column; gap: 16px; padding: 22px; }
    .inventory-module-title[b-m597xethx3] { font-size: 1.9rem; }
    .inventory-module-actions[b-m597xethx3] { justify-content: flex-start; max-width: 100%; }
    .inventory-module-actions[b-m597xethx3]  .inventory-header-sync { text-align: left; }
}
/* /Components/Pages/Admin/InventoryLab/InventoryWorkspaceNav.razor.rz.scp.css */
.inventory-workspace-nav[b-ssj58njvm5]{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px;margin:14px 0 18px}.inventory-workspace-nav a[b-ssj58njvm5]{display:flex;align-items:center;gap:10px;min-width:0;padding:12px 14px;border:1px solid #dce4e4;border-radius:15px;background:#fff;color:#20302e;text-decoration:none;box-shadow:0 5px 16px #142b2510;transition:transform .15s,border-color .15s,box-shadow .15s}.inventory-workspace-nav a:hover[b-ssj58njvm5]{transform:translateY(-2px);border-color:#13a98c;box-shadow:0 9px 20px #087b5d20}.inventory-workspace-nav a.active[b-ssj58njvm5]{border-color:#10a98b;background:#eafaf5;box-shadow:inset 0 -3px #12b795}.inventory-workspace-nav i[b-ssj58njvm5]{display:grid;place-items:center;flex:none;width:36px;height:36px;border-radius:10px;background:#e9f6f2;color:#078c72;font-size:1.1rem}.inventory-workspace-nav span[b-ssj58njvm5]{display:flex;flex-direction:column;min-width:0}.inventory-workspace-nav b[b-ssj58njvm5]{font-size:.84rem;white-space:nowrap}.inventory-workspace-nav small[b-ssj58njvm5]{font-size:.66rem;color:#778b86;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}@media(max-width:1000px){.inventory-workspace-nav[b-ssj58njvm5]{grid-template-columns:repeat(3,minmax(0,1fr))}}@media(max-width:600px){.inventory-workspace-nav[b-ssj58njvm5]{display:flex;overflow-x:auto;padding-bottom:5px;scroll-snap-type:x mandatory}.inventory-workspace-nav a[b-ssj58njvm5]{min-width:145px;scroll-snap-align:start}}
/* /Components/Pages/Admin/Onsite/OnsiteDesk.razor.rz.scp.css */
.onsite-page[b-4l8936g5tf]{padding:24px;background:#f5f7fb;min-height:100vh;color:#202b40}.onsite-hero[b-4l8936g5tf]{padding:28px 32px;background:radial-gradient(circle at 85% 10%,#22778e,transparent 45%),linear-gradient(120deg,#101b30,#354c93);color:white;border-radius:22px;display:flex;justify-content:space-between;align-items:center;gap:20px}.onsite-hero small[b-4l8936g5tf]{color:#71ead2;letter-spacing:.15em;font-weight:700}.onsite-hero h1[b-4l8936g5tf]{font-weight:800;font-size:32px;margin:8px 0}.onsite-hero p[b-4l8936g5tf]{margin:0;color:#d4dff1}.onsite-card[b-4l8936g5tf]{background:white;padding:24px;border-radius:18px;border:1px solid #e0e6ef}.onsite-card h2[b-4l8936g5tf]{font-size:21px;font-weight:750}.onsite-card h3[b-4l8936g5tf]{font-size:16px;font-weight:700}.onsite-stats[b-4l8936g5tf]{display:grid;grid-template-columns:repeat(5,1fr);gap:12px;margin:18px 0}.stat[b-4l8936g5tf]{border:1px solid #dce5ef;background:white;border-radius:16px;padding:18px;text-align:left;color:#354b74}.stat strong[b-4l8936g5tf]{display:block;font-size:28px}.onsite-toolbar[b-4l8936g5tf]{display:flex;gap:12px;align-items:center;margin-bottom:15px}.onsite-toolbar select[b-4l8936g5tf]{max-width:200px}.onsite-job[b-4l8936g5tf]{display:flex;gap:16px;padding:20px 0;border-bottom:1px solid #e8edf4;text-decoration:none;color:inherit;align-items:center}.onsite-job>div:nth-child(2)[b-4l8936g5tf]{flex:1;min-width:0}.onsite-job p[b-4l8936g5tf]{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:600px;margin:4px 0;color:#768399}.onsite-job small[b-4l8936g5tf]{color:#74839a}.onsite-job h3[b-4l8936g5tf]{margin:5px 0}.job-symbol[b-4l8936g5tf]{width:48px;height:48px;border-radius:14px;background:#eaf4ff;display:grid;place-items:center;color:#2864cb;font-size:22px}.onsite-badge[b-4l8936g5tf]{display:inline-block;border-radius:30px;background:#edf3fc;color:#375b91;font-size:12px;padding:6px 10px;font-weight:500}.onsite-detail-grid[b-4l8936g5tf]{display:grid;grid-template-columns:minmax(280px,0.8fr) minmax(0,1.2fr);gap:16px}.onsite-form[b-4l8936g5tf]{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:16px}.onsite-form label[b-4l8936g5tf]{font-size:13px;color:#50617a}.onsite-form .form-control[b-4l8936g5tf],.onsite-form .form-select[b-4l8936g5tf]{margin-top:5px}.wide[b-4l8936g5tf]{grid-column:1/-1}.paste-box[b-4l8936g5tf]{padding:18px;background:#f3f8ff;border:1px solid #d8e7f7;border-radius:12px}.service-options[b-4l8936g5tf]{display:flex;gap:10px;flex-wrap:wrap;padding:10px}.lookup-result[b-4l8936g5tf]{display:block;width:100%;padding:12px;border:1px solid #dce5ef;background:#f8fbff;text-align:left;border-radius:8px;margin-top:8px}.item-row[b-4l8936g5tf]{padding:12px;border-bottom:1px solid #edf0f5}.item-row small[b-4l8936g5tf]{display:block;color:#78869a}.visit-card[b-4l8936g5tf]{padding:18px;border:1px solid #dee7f1;border-radius:14px;margin:12px 0}.visit-card small[b-4l8936g5tf]{color:#7b8798}.timeline-entry[b-4l8936g5tf]{border-left:2px solid #d5e3f5;padding-left:14px;margin-top:12px}.timeline-entry small[b-4l8936g5tf]{color:#7b8798}.source-text[b-4l8936g5tf]{white-space:pre-wrap;overflow-wrap:anywhere;font-family:inherit}.attachment-link[b-4l8936g5tf]{font-size:12px;padding:6px 10px;border-radius:8px;background:#edf4fc;overflow-wrap:anywhere}.empty-state[b-4l8936g5tf]{text-align:center;padding:60px 20px;color:#8390a2}.report-overlay[b-4l8936g5tf]{position:fixed;inset:0;background:#15243c88;z-index:1100;display:flex;justify-content:center;align-items:flex-start;padding:24px;overflow:auto}.report-panel[b-4l8936g5tf]{width:760px;max-width:100%;margin:auto}.report-panel label[b-4l8936g5tf]{font-size:13px}@media(max-width:850px){.onsite-page[b-4l8936g5tf]{padding:12px}.onsite-hero[b-4l8936g5tf]{padding:22px;flex-direction:column;align-items:flex-start}.onsite-detail-grid[b-4l8936g5tf]{grid-template-columns:1fr}.onsite-stats[b-4l8936g5tf]{grid-template-columns:repeat(2,1fr)}.onsite-toolbar[b-4l8936g5tf]{flex-wrap:wrap}.onsite-job[b-4l8936g5tf]{flex-wrap:wrap}.onsite-form[b-4l8936g5tf]{grid-template-columns:1fr}.onsite-card[b-4l8936g5tf]{padding:18px}.report-overlay[b-4l8936g5tf]{padding:10px}.onsite-job p[b-4l8936g5tf]{max-width:65vw}}
.onsite-detail-grid[b-4l8936g5tf]{grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);align-items:start;grid-template-areas:"prepare details" "cases details"}.onsite-detail-grid>section:first-child[b-4l8936g5tf]{grid-area:prepare}.onsite-cases[b-4l8936g5tf]{grid-area:cases}.onsite-details[b-4l8936g5tf]{grid-area:details}.onsite-detail-grid>section[b-4l8936g5tf]{min-width:0}.onsite-detail-grid h3[b-4l8936g5tf]{font-size:1.15rem}@media(max-width:850px){.onsite-detail-grid[b-4l8936g5tf]{grid-template-columns:minmax(0,1fr);grid-template-areas:"prepare" "cases" "details"}}
.hero-pills[b-4l8936g5tf]{display:flex;gap:8px;flex-wrap:wrap;margin-top:18px}.hero-pills span[b-4l8936g5tf]{padding:6px 10px;border:1px solid #ffffff30;border-radius:999px;background:#ffffff12;font-size:12px;color:#d9f8f0}.hero-pills i[b-4l8936g5tf]{margin-right:4px}.hero-actions[b-4l8936g5tf]{display:flex;gap:9px;flex-wrap:wrap}.onsite-shortcuts[b-4l8936g5tf]{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin:14px 0}.onsite-shortcuts a[b-4l8936g5tf]{display:flex;align-items:center;gap:11px;padding:13px 15px;border:1px solid #dfe6ee;border-radius:14px;background:#fff;color:#26364e;text-decoration:none;transition:.18s ease}.onsite-shortcuts a:hover[b-4l8936g5tf]{transform:translateY(-2px);border-color:#80b8df;box-shadow:0 8px 20px #25466a13}.onsite-shortcuts i[b-4l8936g5tf]{display:grid;place-items:center;width:39px;height:39px;border-radius:11px;background:#eaf5fb;color:#19718e;font-size:18px}.onsite-shortcuts span[b-4l8936g5tf]{min-width:0}.onsite-shortcuts b[b-4l8936g5tf],.onsite-shortcuts small[b-4l8936g5tf]{display:block}.onsite-shortcuts b[b-4l8936g5tf]{font-size:13px}.onsite-shortcuts small[b-4l8936g5tf]{font-size:11px;color:#8490a0;margin-top:2px}.stat[b-4l8936g5tf]{display:flex;align-items:center;gap:12px;padding:15px 16px;transition:.18s ease;box-shadow:0 4px 14px #263c5b08}.stat:hover[b-4l8936g5tf],.stat.active[b-4l8936g5tf]{transform:translateY(-2px);border-color:#72a7cf;box-shadow:0 9px 22px #263c5b15}.stat-icon[b-4l8936g5tf]{width:39px;height:39px;display:grid;place-items:center;border-radius:12px;background:#eef5fb;color:#2864a2;font-size:18px}.stat span:last-child[b-4l8936g5tf]{flex:1}.stat strong[b-4l8936g5tf]{line-height:1;font-size:25px;margin-top:5px}.status-new .stat-icon[b-4l8936g5tf]{background:#fff1df;color:#d2780a}.status-scheduled .stat-icon[b-4l8936g5tf]{background:#e9f2ff;color:#2771ca}.status-inprogress .stat-icon[b-4l8936g5tf]{background:#e5f9f3;color:#078266}.status-followup .stat-icon[b-4l8936g5tf]{background:#f2edff;color:#7651c8}.status-pendingreview .stat-icon[b-4l8936g5tf]{background:#ffedf4;color:#c42e68}.jobs-panel[b-4l8936g5tf]{padding:0;overflow:hidden}.panel-heading[b-4l8936g5tf]{display:flex;align-items:center;justify-content:space-between;padding:19px 21px 8px}.panel-heading small[b-4l8936g5tf]{color:#2489a0;font-size:10px;letter-spacing:.14em;font-weight:800}.panel-heading h2[b-4l8936g5tf]{margin:3px 0 0}.panel-heading>span[b-4l8936g5tf]{padding:6px 10px;border-radius:999px;background:#eef3f7;color:#637286;font-size:12px}.jobs-panel .onsite-toolbar[b-4l8936g5tf]{padding:11px 20px 17px;margin:0;border-bottom:1px solid #e8edf3}.search-box[b-4l8936g5tf]{position:relative;flex:1}.search-box i[b-4l8936g5tf]{position:absolute;left:13px;top:50%;transform:translateY(-50%);z-index:1;color:#8491a0}.search-box input[b-4l8936g5tf]{padding-left:38px}.mine-toggle[b-4l8936g5tf]{display:flex;align-items:center;gap:7px;padding:9px 11px;border:1px solid #dce4eb;border-radius:9px;background:#f9fbfd;font-size:12px}.onsite-job-grid[b-4l8936g5tf]{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;padding:18px 20px}.onsite-job[b-4l8936g5tf]{display:block;padding:16px;border:1px solid #e2e8ef;border-radius:15px;background:linear-gradient(145deg,#fff,#fafcff);transition:.18s ease}.onsite-job:hover[b-4l8936g5tf]{transform:translateY(-2px);border-color:#7db5db;box-shadow:0 10px 26px #244b7014}.job-top[b-4l8936g5tf]{display:flex;align-items:center;gap:11px}.job-top>div:nth-child(2)[b-4l8936g5tf]{min-width:0;flex:1}.job-top h3[b-4l8936g5tf]{font-size:16px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.job-top .onsite-badge[b-4l8936g5tf]{align-self:flex-start}.onsite-job>p[b-4l8936g5tf]{max-width:none;margin:12px 0;min-height:38px;white-space:normal;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}.job-meta[b-4l8936g5tf]{display:flex;gap:7px;flex-wrap:wrap}.job-meta span[b-4l8936g5tf]{padding:5px 7px;border-radius:7px;background:#f0f4f8;color:#65748a;font-size:10px}.job-footer[b-4l8936g5tf]{display:flex;justify-content:space-between;align-items:center;margin-top:13px;padding-top:11px;border-top:1px solid #edf1f5;color:#8995a5;font-size:10px}.job-footer b[b-4l8936g5tf]{color:#2677a8;font-size:11px}.badge-new[b-4l8936g5tf]{background:#fff1df;color:#b56200}.badge-scheduled[b-4l8936g5tf]{background:#e8f2ff;color:#2269b8}.badge-inprogress[b-4l8936g5tf]{background:#e2f8f1;color:#08775f}.badge-followup[b-4l8936g5tf]{background:#f0ebff;color:#6947b4}.badge-pendingreview[b-4l8936g5tf]{background:#ffeaf2;color:#b72860}@media(max-width:1100px){.onsite-shortcuts[b-4l8936g5tf]{grid-template-columns:repeat(2,1fr)}.onsite-job-grid[b-4l8936g5tf]{grid-template-columns:1fr}}@media(max-width:650px){.onsite-shortcuts[b-4l8936g5tf]{grid-template-columns:1fr 1fr}.onsite-shortcuts small[b-4l8936g5tf]{display:none}.onsite-job-grid[b-4l8936g5tf]{padding:12px}.panel-heading[b-4l8936g5tf],.jobs-panel .onsite-toolbar[b-4l8936g5tf]{padding-left:12px;padding-right:12px}.hero-actions[b-4l8936g5tf]{width:100%}.hero-actions .btn[b-4l8936g5tf]{flex:1}.mine-toggle[b-4l8936g5tf]{width:100%}}
/* /Components/Pages/Admin/PromoSet/PromoSetManage.razor.rz.scp.css */
/* ==========================================================================
   Red Tech Theme & Compact UI Styles
   ========================================================================== */

@keyframes redPulse-b-ba5wj066eg {
    0% {
        box-shadow: 0 0 0 0 rgba(220, 53, 69, 0.4);
    }

    70% {
        box-shadow: 0 0 0 8px rgba(220, 53, 69, 0);
    }

    100% {
        box-shadow: 0 0 0 0 rgba(220, 53, 69, 0);
    }
}

@keyframes greenPulse-b-ba5wj066eg {
    0% {
        box-shadow: 0 0 0 0 rgba(25, 135, 84, 0.5);
    }

    70% {
        box-shadow: 0 0 0 7px rgba(25, 135, 84, 0);
    }

    100% {
        box-shadow: 0 0 0 0 rgba(25, 135, 84, 0);
    }
}

.live-dot[b-ba5wj066eg] {
    width: 8px;
    height: 8px;
    background-color: #10b981;
    border-radius: 50%;
    display: inline-block;
    animation: greenPulse-b-ba5wj066eg 2s infinite;
}

.offline-dot[b-ba5wj066eg] {
    width: 8px;
    height: 8px;
    background-color: #ef4444;
    border-radius: 50%;
    display: inline-block;
    animation: redPulse-b-ba5wj066eg 2s infinite;
}

/* 🟢 ปรับการ์ดสรุป 2 ใบด้านบนให้กะทัดรัด พอดี ไม่เปลืองพื้นที่แนวตั้ง */
.summary-stat-card[b-ba5wj066eg] {
    background: #ffffff;
    border: 1.5px solid #fee2e2;
    border-radius: 14px;
    padding: 10px 16px;
    box-shadow: 0 2px 10px -2px rgba(220, 38, 38, 0.05);
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

/* 🟢 ปรับการ์ดกลุ่มโปรโมชั่นให้กระชับ ไม่เปลืองพื้นที่แนวตั้ง */
.promo-group-card[b-ba5wj066eg] {
    background: #ffffff;
    border: 1.5px solid #e2e8f0;
    border-radius: 14px;
    padding: 12px 14px;
    cursor: pointer;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
    position: relative;
    overflow: hidden; /* 🟢 ตัดขอบที่เกินออกจากมุมโค้งมน */
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

    .promo-group-card:hover[b-ba5wj066eg] {
        transform: translateY(-2px);
        border-color: #f87171;
        box-shadow: 0 8px 18px -3px rgba(220, 38, 38, 0.12);
    }

    /* 🟢 แก้ไขบั๊กแถบแดงล้นกรอบของการ์ดที่ถูกเลือก */
    .promo-group-card.selected[b-ba5wj066eg] {
        border-color: #dc2626 !important;
        background: linear-gradient(145deg, #ffffff, #fff5f5);
        box-shadow: 0 8px 22px -3px rgba(220, 38, 38, 0.16);
    }

        .promo-group-card.selected[b-ba5wj066eg]::before {
            content: '';
            position: absolute;
            top: 0;
            left: 0;
            width: 4px;
            height: 100%;
            background: #dc2626;
        }

.group-code-badge[b-ba5wj066eg] {
    background: #18181b;
    color: #ffffff;
    font-family: Consolas, monospace;
    font-weight: 700;
    font-size: 0.8rem;
    padding: 3px 8px;
    border-radius: 6px;
    border: 1px solid #27272a;
    letter-spacing: 0.5px;
    display: inline-block;
}

.promo-group-card.selected .group-code-badge[b-ba5wj066eg] {
    background: #dc2626;
    border-color: #b91c1c;
}

/* สวิตช์สีแดง */
.red-switch .form-check-input:checked[b-ba5wj066eg] {
    background-color: #dc2626 !important;
    border-color: #b91c1c !important;
    box-shadow: 0 0 6px rgba(220, 38, 38, 0.35);
}

/* 🟢 แถบ Web Online HUD แบบประหยัดพื้นที่ */
.web-online-hud[b-ba5wj066eg] {
    background: #09090b;
    border-radius: 8px;
    padding: 5px 10px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    border: 1px solid #27272a;
}

.hud-label[b-ba5wj066eg] {
    color: #a1a1aa;
    font-size: 0.72rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    display: flex;
    align-items: center;
    gap: 6px;
}

.hud-count[b-ba5wj066eg] {
    font-family: 'JetBrains Mono', Consolas, monospace;
    font-weight: 800;
    font-size: 0.84rem;
    color: #4ade80;
    text-shadow: 0 0 8px rgba(74, 222, 128, 0.35);
}

    .hud-count.offline[b-ba5wj066eg] {
        color: #f87171;
        text-shadow: 0 0 8px rgba(248, 113, 113, 0.35);
    }

/* Buttons & Navigation Pills */
.btn-red-action[b-ba5wj066eg] {
    background: #dc2626;
    color: #ffffff;
    border: none;
    border-radius: 999px;
    padding: 6px 16px;
    font-weight: 700;
    font-size: 0.8rem;
    transition: all 0.15s ease;
    box-shadow: 0 3px 10px rgba(220, 38, 38, 0.22);
    /* 🟢 บังคับระยะห่างระหว่างไอคอนกับข้อความไม่ให้ทับกัน */
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    white-space: nowrap;
}

    .btn-red-action:hover[b-ba5wj066eg] {
        background: #b91c1c;
        color: #ffffff;
        transform: translateY(-1px);
    }

.btn-soft-red[b-ba5wj066eg] {
    background: #fff1f2;
    color: #e11d48;
    border: 1.5px solid #fecdd3;
    border-radius: 999px;
    padding: 5px 14px;
    font-weight: 700;
    font-size: 0.8rem;
    transition: all 0.15s ease;
}

    .btn-soft-red:hover[b-ba5wj066eg] {
        background: #ffe4e6;
        border-color: #fda4af;
        color: #be123c;
    }

.btn-soft-dark[b-ba5wj066eg] {
    background: #f4f4f5;
    color: #27272a;
    border: 1.5px solid #e4e4e7;
    border-radius: 999px;
    padding: 5px 14px;
    font-weight: 700;
    font-size: 0.8rem;
    transition: all 0.15s ease;
}

    .btn-soft-dark:hover[b-ba5wj066eg] {
        background: #e4e4e7;
        color: #09090b;
    }

.pill-tab[b-ba5wj066eg] {
    border: 1.5px solid #e2e8f0;
    background: #fff;
    color: #475569;
    border-radius: 999px;
    padding: 4px 12px;
    font-size: 0.78rem;
    font-weight: 700;
    cursor: pointer;
    transition: 0.12s;
}

    .pill-tab:hover[b-ba5wj066eg] {
        border-color: #f87171;
        color: #dc2626;
        background: #fff5f5;
    }

    .pill-tab.active[b-ba5wj066eg] {
        background: #dc2626;
        border-color: #dc2626;
        color: #fff;
        box-shadow: 0 2px 8px rgba(220, 38, 38, 0.25);
    }

/* Professional Table */
.table-psc[b-ba5wj066eg] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.85rem;
    background: #fff;
    border-radius: 14px;
    overflow: hidden;
    border: 1px solid #fee2e2;
}

    .table-psc th[b-ba5wj066eg] {
        background: #18181b !important;
        color: #f4f4f5 !important;
        padding: 10px 12px;
        text-align: left;
        font-size: 0.78rem;
        white-space: nowrap;
        border-bottom: 3px solid #dc2626;
    }

    .table-psc td[b-ba5wj066eg] {
        border-top: 1px solid #f8fafc;
        padding: 8px 12px;
        vertical-align: middle;
    }

    .table-psc tbody tr[b-ba5wj066eg] {
        cursor: pointer;
        transition: background 0.12s ease;
    }

        .table-psc tbody tr:hover[b-ba5wj066eg] {
            background: #fff5f5 !important;
        }

    /* Badge System */
    .st-badge[b-ba5wj066eg] {
        display: inline-flex;
        align-items: center;
        gap: 4px;
        border-radius: 999px;
        padding: 2px 9px;
        font-size: 0.74rem;
        font-weight: 800;
        white-space: nowrap;
    }

    .st-live[b-ba5wj066eg] {
        background: #dcfce7;
        color: #15803d;
        border: 1px solid #bbf7d0;
    }

    .st-missing[b-ba5wj066eg] {
        background: #fee2e2;
        color: #b91c1c;
        border: 1px solid #fecaca;
    }

    /* Modals */
    .stg-backdrop[b-ba5wj066eg] {
        position: fixed;
        inset: 0;
        background: rgba(15, 23, 42, 0.6);
        backdrop-filter: blur(3px);
        z-index: 1065;
    }

    .stg-modal[b-ba5wj066eg] {
        position: fixed;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        background: #fff;
        border-radius: 20px;
        z-index: 1066;
        box-shadow: 0 24px 70px rgba(0, 0, 0, 0.28);
        border: 1px solid #fee2e2;
    }

    .stg-head[b-ba5wj066eg] {
        padding: 16px 20px;
        border-bottom: 1px solid #f1f5f9;
        display: flex;
        align-items: center;
        justify-content: space-between;
        background: #fafafa;
        border-top-left-radius: 20px;
        border-top-right-radius: 20px;
    }

    .stg-body[b-ba5wj066eg] {
        padding: 18px 20px;
        max-height: 72vh;
        overflow: auto;
    }

    /* 🟢 กล่องครอบรูปภาพสินค้าพร้อมไอคอนแว่นขยายตอนชี้เมาส์ (เหมือน ReplaceCalc.razor) */
    .rc-img-container[b-ba5wj066eg] {
        position: relative;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        cursor: pointer;
        border-radius: 6px;
        overflow: hidden;
        flex-shrink: 0;
    }

        .rc-img-container:hover .rc-img-overlay[b-ba5wj066eg] {
            opacity: 1;
            visibility: visible;
        }

    .rc-img-overlay[b-ba5wj066eg] {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background-color: rgba(0, 0, 0, 0.45);
        display: flex;
        align-items: center;
        justify-content: center;
        color: #ffffff;
        opacity: 0;
        visibility: hidden;
        transition: all 0.2s ease-in-out;
        border-radius: 6px;
    }

    /* 🟢 กล่อง Placeholder สำหรับกรณีที่เซ็ตโปรยังไม่มีรูปภาพ */
    .rc-thumb-placeholder[b-ba5wj066eg] {
        width: 42px;
        height: 42px;
        border-radius: 6px;
        background-color: #f8fafc;
        border: 1.5px dashed #cbd5e1;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        color: #94a3b8;
        transition: all 0.15s ease-in-out;
        flex-shrink: 0;
    }

    .table-psc tbody tr:hover .rc-thumb-placeholder[b-ba5wj066eg] {
        background-color: #ffffff;
        border-color: #fca5a5;
        color: #ef4444;
    }

    /* 🟢 Badge สีน้ำเงินสำหรับไอคอนจอมอนิเตอร์แยกเดี่ยว */
    .monitor-badge-blue[b-ba5wj066eg] {
        background: #2563eb;
        color: #ffffff;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        padding: 3px 6px;
        border-radius: 6px;
        border: 1px solid #1d4ed8;
        box-shadow: 0 1px 3px rgba(37, 99, 235, 0.25);
        line-height: 1;
    }

    .promo-group-card.selected .monitor-badge-blue[b-ba5wj066eg] {
        background: #1d4ed8;
        border-color: #1e40af;
    }

    /* 🟢 ปุ่มลำดับจอทดแทน (สีน้ำเงิน #2563eb สอดคล้องกับ Badge จอ) */
    .btn-blue-action[b-ba5wj066eg] {
        background: #2563eb;
        color: #ffffff;
        border: 1px solid #1d4ed8;
        border-radius: 999px;
        padding: 5px 14px;
        font-weight: 700;
        font-size: 0.8rem;
        display: inline-flex;
        align-items: center;
        gap: 6px;
        box-shadow: 0 2px 6px rgba(37, 99, 235, 0.25);
        transition: all 0.15s ease-in-out;
        cursor: pointer;
    }

        .btn-blue-action:hover:not(:disabled)[b-ba5wj066eg] {
            background: #1d4ed8;
            border-color: #1e40af;
            transform: translateY(-1px);
            box-shadow: 0 4px 10px rgba(37, 99, 235, 0.35);
        }

        .btn-blue-action:disabled[b-ba5wj066eg] {
            opacity: 0.6;
            cursor: not-allowed;
        }

    /* 🟢 Segmented Control แบบ Modern สำหรับกรองสถานะ */
    .filter-segmented-control[b-ba5wj066eg] {
        display: inline-flex;
        align-items: center;
        background: #f1f5f9;
        border: 1px solid #e2e8f0;
        border-radius: 999px;
        padding: 3px;
        gap: 2px;
    }

    .filter-tab[b-ba5wj066eg] {
        display: inline-flex;
        align-items: center;
        gap: 6px;
        padding: 4px 12px;
        border-radius: 999px;
        border: none;
        background: transparent;
        color: #64748b;
        font-size: 0.78rem;
        font-weight: 700;
        cursor: pointer;
        transition: all 0.15s ease;
        white-space: nowrap;
    }

        .filter-tab:hover:not(.active)[b-ba5wj066eg] {
            color: #1e293b;
            background: rgba(255, 255, 255, 0.5);
        }

        /* ปุ่มที่ถูกเลือก (Active Tab) */
        .filter-tab.active[b-ba5wj066eg] {
            background: #ffffff;
            color: #0f172a;
            box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08), 0 1px 2px rgba(0, 0, 0, 0.04);
        }

        /* Badge เม็ดกลมนับจำนวน */
        .filter-tab .count-pill[b-ba5wj066eg] {
            background: #e2e8f0;
            color: #475569;
            font-family: 'JetBrains Mono', Consolas, monospace;
            font-size: 0.72rem;
            font-weight: 800;
            padding: 1px 7px;
            border-radius: 999px;
        }

        .filter-tab.active .count-pill[b-ba5wj066eg] {
            background: #0f172a;
            color: #ffffff;
        }

    /* จุดสถานะสีเขียว / แดง */
    .status-dot[b-ba5wj066eg] {
        width: 7px;
        height: 7px;
        border-radius: 50%;
        display: inline-block;
    }

    .dot-active[b-ba5wj066eg] {
        background-color: #10b981;
    }

    .dot-inactive[b-ba5wj066eg] {
        background-color: #ef4444;
    }

    /* 🟢 แถบ Toolbar จัดระเบียบหัวตาราง */
    .promo-table-toolbar[b-ba5wj066eg] {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        justify-content: space-between;
        gap: 12px;
    }

    .toolbar-title-dot[b-ba5wj066eg] {
        width: 6px;
        height: 16px;
        background-color: #dc2626;
        border-radius: 999px;
        display: inline-block;
    }

    /* 🟢 ช่องพิมพ์ค้นหาทรง Modern Pill */
    .search-pill-box[b-ba5wj066eg] {
        position: relative;
        display: inline-flex;
        align-items: center;
        background: #ffffff;
        border: 1.5px solid #e2e8f0;
        border-radius: 999px;
        padding: 2px 10px 2px 12px;
        width: 250px;
        transition: all 0.2s ease-in-out;
        box-shadow: 0 1px 2px rgba(0, 0, 0, 0.03);
    }

        .search-pill-box:focus-within[b-ba5wj066eg] {
            border-color: #dc2626;
            box-shadow: 0 0 0 3px rgba(220, 38, 38, 0.12);
            width: 290px; /* ขยายกว้างขึ้นอัตโนมัติขณะพิมพ์ */
        }

        .search-pill-box .search-icon[b-ba5wj066eg] {
            font-size: 1.05rem;
            margin-right: 6px;
            flex-shrink: 0;
        }

        .search-pill-box .search-input[b-ba5wj066eg] {
            border: none;
            outline: none;
            background: transparent;
            font-size: 0.82rem;
            color: #1e293b;
            width: 100%;
            padding: 3px 0;
        }

            .search-pill-box .search-input[b-ba5wj066eg]::placeholder {
                color: #94a3b8;
                font-size: 0.8rem;
            }

    /* ปุ่มลบคำค้นหา (X) */
    .search-clear-btn[b-ba5wj066eg] {
        border: none;
        background: #f1f5f9;
        color: #64748b;
        border-radius: 50%;
        width: 18px;
        height: 18px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        padding: 0;
        margin-left: 6px;
        cursor: pointer;
        transition: all 0.15s ease;
        flex-shrink: 0;
    }

        .search-clear-btn:hover[b-ba5wj066eg] {
            background: #e2e8f0;
            color: #0f172a;
        }
/* /Components/Pages/Admin/PromoSet/PromoSetUpload.razor.rz.scp.css */
.file-chip[b-5kvlb59oum] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    border: 1.5px solid #bfdbfe;
    background: #eff6ff;
    color: #1e40af;
    border-radius: 10px;
    padding: 6px 12px;
    font-size: .8rem;
    font-weight: 700;
}

.upl-dropzone[b-5kvlb59oum] {
    display: block;
    border: 2px dashed #93c5fd;
    background: #f8fbff;
    border-radius: 16px;
    padding: 36px 20px;
    text-align: center;
    margin-bottom: 16px;
    transition: .15s;
    cursor: pointer;
}

    .upl-dropzone:hover[b-5kvlb59oum] {
        border-color: #2563eb;
        background: #eff6ff;
        transform: translateY(-1px);
    }

.dz-busy[b-5kvlb59oum] {
    border-style: solid;
    border-color: #c7d2fe;
    opacity: .85;
    pointer-events: none;
}

.dz-icon[b-5kvlb59oum] {
    font-size: 2.6rem;
    margin-bottom: 8px;
}

.warn-line[b-5kvlb59oum] {
    border-left: 4px solid #f59e0b;
    background: #fffbeb;
    padding: 6px 12px;
    border-radius: 8px;
    font-size: .8rem;
    margin-bottom: 6px;
    word-break: break-word;
}

.err-line[b-5kvlb59oum] {
    border-left-color: #dc2626;
    background: #fef2f2;
}

.info-line[b-5kvlb59oum] {
    border-left-color: #3b82f6;
    background: #eff6ff;
}

/* 🟢 Red Tech Summary Card */
.promo-result-card[b-5kvlb59oum] {
    border-radius: 16px;
    border: 1px solid #fee2e2;
    background: #ffffff;
    padding: 20px;
    box-shadow: 0 4px 16px rgba(220, 38, 38, 0.04);
}

.result-header-badge[b-5kvlb59oum] {
    width: 44px;
    height: 44px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

    .result-header-badge.badge-updated[b-5kvlb59oum] {
        background: #fef2f2;
        color: #dc2626;
        border: 1px solid #fecaca;
    }

    .result-header-badge.badge-clean[b-5kvlb59oum] {
        background: #f8fafc;
        color: #16a34a;
        border: 1px solid #dcfce7;
    }

.tech-stat-tile[b-5kvlb59oum] {
    background: #fafafa;
    border: 1px solid #f1f5f9;
    border-radius: 12px;
    padding: 12px 14px;
    transition: all 0.15s ease;
}

    .tech-stat-tile.primary-red[b-5kvlb59oum] {
        background: #fffafa;
        border-color: #fee2e2;
    }

    .tech-stat-tile.success-green[b-5kvlb59oum] {
        background: #f0fdf4;
        border-color: #dcfce7;
    }

    .tech-stat-tile.danger-soft[b-5kvlb59oum] {
        background: #fef2f2;
        border-color: #fecaca;
    }

.tile-label[b-5kvlb59oum] {
    font-size: 0.72rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: #64748b;
    margin-bottom: 2px;
}

.tile-val[b-5kvlb59oum] {
    font-family: Consolas, monospace;
    font-size: 1.15rem;
    font-weight: 800;
    line-height: 1.2;
}
/* /Components/Pages/Admin/PromoSet/PromoSetView.razor.rz.scp.css */
.psc-drawer-backdrop[b-ttimldjssr] {
    position: fixed;
    inset: 0;
    background: rgba(15,23,42,.45);
    z-index: 1060
}

.psc-drawer[b-ttimldjssr] {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    width: min(920px,96vw);
    background: #fff;
    z-index: 1061;
    box-shadow: -18px 0 50px rgba(15,23,42,.28);
    overflow: auto
}

.psc-drawer-head[b-ttimldjssr] {
    position: sticky;
    top: 0;
    background: #fff;
    border-bottom: 1px solid #e2e8f0;
    padding: 14px 20px;
    z-index: 3
}

/* Header Badges & Meta */
.st-badge[b-ttimldjssr] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    border-radius: 999px;
    padding: 3px 10px;
    font-size: 0.74rem;
    font-weight: 700;
    white-space: nowrap;
}

.st-live[b-ttimldjssr] {
    background: #dcfce7;
    color: #15803d;
    border: 1px solid #bbf7d0;
}

.st-missing[b-ttimldjssr] {
    background: #fee2e2;
    color: #b91c1c;
    border: 1px solid #fecaca;
}

/* 🟢 เลย์เอาต์: รูปภาพฝั่งซ้าย (ยึดพื้นที่ที่เหลือ) + แผงราคาฝั่งขวา (พอดีข้อมูล) */
.promo-hero-section[b-ttimldjssr] {
    display: flex;
    gap: 20px;
    align-items: stretch;
    margin-bottom: 20px;
}

.promo-hero-img-col[b-ttimldjssr] {
    flex: 1;
    min-width: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #f8fafc;
    border: 1.5px solid #d6d6d6;
    border-radius: 14px;
    padding: 12px;
}

.promo-hero-price-col[b-ttimldjssr] {
    width: 240px;
    min-width: 240px;
    max-width: 260px;
    display: flex;
    flex-direction: column;
    gap: 8px;
    justify-content: space-between;
}

/* 🟢 ราคาหน้าเว็บ (โดดเด่นที่สุด) */
.web-price-card[b-ttimldjssr] {
    background: linear-gradient(135deg, #fff1f2 0%, #ffe4e6 100%);
    border: 1.5px solid #fecdd3;
    border-radius: 12px;
    padding: 12px 14px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

    .web-price-card .label[b-ttimldjssr] {
        font-size: 0.8rem;
        font-weight: 700;
        color: #9f1239;
        margin-bottom: 2px;
    }

    .web-price-card .price[b-ttimldjssr] {
        font-size: 1.55rem;
        font-weight: 800;
        color: #e11d48;
        font-family: Consolas, monospace;
        line-height: 1.2;
    }

/* 🟢 ราคารอง 3 ช่อง: Shopee, TikTok, Lazada สีพื้นเดียวกัน */
.price-cell-sub[b-ttimldjssr] {
    border: 1px solid #e2e8f0;
    border-radius: 9px;
    padding: 8px 12px;
    background: #f8fafc;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

    .price-cell-sub span[b-ttimldjssr] {
        font-size: .75rem;
        color: #64748b;
        font-weight: 700;
    }

    .price-cell-sub b[b-ttimldjssr] {
        font-size: .95rem;
        color: #1e293b;
        font-family: Consolas, monospace;
    }

/* 🟢 Item Card สไตล์ Red Tech */
.item-card[b-ttimldjssr] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px 14px;
    border: 1px solid #f1f5f9;
    border-radius: 12px;
    background: #ffffff;
    margin-bottom: 8px;
    transition: all 0.15s ease-in-out;
}

    .item-card:hover[b-ttimldjssr] {
        background: #fffafa;
        border-color: #fecaca;
        box-shadow: 0 2px 8px rgba(220, 38, 38, 0.05);
    }

/* 🟢 ป้าย ItemRole โทนดำ-แดง Tech Badge */
.role-badge-tech[b-ttimldjssr] {
    flex-shrink: 0;
    width: 62px;
    text-align: center;
    border-radius: 8px;
    background: #18181b;
    color: #ffffff;
    border-left: 3px solid #dc2626;
    font-family: Consolas, monospace;
    font-size: 1rem;
    font-weight: 800;
    letter-spacing: 0.5px;
    padding: 6px 2px;
    line-height: 1.1;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12);
}

.role-badge-gift[b-ttimldjssr] {
    background: #dc2626 !important;
    border-left-color: #991b1b !important;
    color: #ffffff !important;
}

/* 2-line height image */
.thumb-2line[b-ttimldjssr] {
    width: 48px;
    height: 48px;
    object-fit: cover;
    border-radius: 8px;
    border: 1px solid #e2e8f0;
    background: #ffffff;
    flex-shrink: 0;
}

.thumb-placeholder[b-ttimldjssr] {
    width: 48px;
    height: 48px;
    border-radius: 8px;
    border: 1.5px dashed #cbd5e1;
    background: #f8fafc;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #94a3b8;
    font-size: 0.75rem;
    flex-shrink: 0;
}

.item-details[b-ttimldjssr] {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 3px;
}

    .item-details .line-1[b-ttimldjssr] {
        font-size: 0.88rem;
        font-weight: 600;
        color: #0f172a;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    .item-details .line-2[b-ttimldjssr] {
        font-size: 0.8rem;
        color: #64748b;
        display: flex;
        align-items: center;
        gap: 6px;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    /* 🟢 กรอบ ProductCode คุมโทนระบบ (พื้นแดงอ่อน กรอบแดงจาง) */
    .item-details .code-pill[b-ttimldjssr] {
        font-family: Consolas, monospace;
        font-weight: 600;
        color: #334155;
        background: #e2e8f0;
        padding: 1px 7px;
        border-radius: 4px;
        display: inline-flex;
        align-items: center;
        gap: 4px;
    }

    /* 🟢 Icon แว่นขยายแสดงผลตอนชี้เมาส์ */
    .rc-img-container[b-ttimldjssr] {
        position: relative;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        cursor: pointer;
        border-radius: 10px;
        overflow: hidden;
    }

        .rc-img-container:hover .rc-img-overlay[b-ttimldjssr] {
            opacity: 1 !important;
            visibility: visible !important;
        }

    .rc-img-overlay[b-ttimldjssr] {
        position: absolute;
        inset: 0;
        background-color: rgba(0, 0, 0, 0.45);
        display: flex;
        align-items: center;
        justify-content: center;
        color: #ffffff;
        opacity: 0;
        visibility: hidden;
        transition: all 0.2s ease-in-out;
        border-radius: 10px;
    }

    /* 🟢 ป้ายจำนวนชิ้นส่วน (>1) ใช้โทนแดงเด่นชัด ไม่หลุดธีม */
    .qty-pill-highlight[b-ttimldjssr] {
        font-family: Consolas, monospace;
        font-size: 0.8rem;
        font-weight: 600;
        color: #ffffff;
        background: #dc2626;
        padding: 1px 7px;
        border-radius: 6px;
        display: inline-flex;
        align-items: center;
        gap: 3px;
        box-shadow: 0 1px 3px rgba(220, 38, 38, 0.3);
    }
/* /Components/Pages/Admin/Sales/SbSalesDesk.razor.rz.scp.css */
.sbdesk-shell[b-ffccql8ohx]{min-height:100vh;padding:24px;background:#f4f6f8;color:#17202a}.sbdesk-hero[b-ffccql8ohx]{display:flex;justify-content:space-between;align-items:center;padding:28px 32px;border-radius:24px;background:linear-gradient(120deg,#16191e 0%,#231820 58%,#401318 100%);color:#fff;box-shadow:0 18px 46px #2b111629}.sbdesk-eyebrow[b-ffccql8ohx]{font-size:.7rem;font-weight:900;letter-spacing:.14em;color:#ff5967}.sbdesk-hero h1[b-ffccql8ohx]{font-size:2.35rem;margin:6px 0 2px;font-weight:900}.sbdesk-hero p[b-ffccql8ohx]{margin:0;color:#c9cbd0}.sbdesk-safe[b-ffccql8ohx]{display:flex;gap:12px;align-items:center;background:#ffffff12;border:1px solid #ffffff20;border-radius:16px;padding:12px 16px}.sbdesk-safe i[b-ffccql8ohx]{font-size:1.8rem;color:#45e09b}.sbdesk-safe span[b-ffccql8ohx]{display:flex;flex-direction:column}.sbdesk-safe small[b-ffccql8ohx]{color:#b9bec6}.sbdesk-flow[b-ffccql8ohx]{display:flex;align-items:center;gap:12px;margin:16px 0;background:#fff;border:1px solid #e3e6ea;border-radius:18px;padding:14px 18px}.sbdesk-flow>div[b-ffccql8ohx]{display:grid;grid-template-columns:34px auto;column-gap:10px;flex:1;padding:8px;border-radius:12px}.sbdesk-flow>div>span[b-ffccql8ohx]{grid-row:1/3;width:32px;height:32px;display:grid;place-items:center;border-radius:10px;background:#eef0f3;font-size:.7rem;font-weight:900}.sbdesk-flow b[b-ffccql8ohx]{font-size:.84rem}.sbdesk-flow small[b-ffccql8ohx]{font-size:.68rem;color:#8a929c}.sbdesk-flow .active[b-ffccql8ohx]{background:#fff0f2}.sbdesk-flow .active>span[b-ffccql8ohx]{background:#f2384b;color:#fff}.sbdesk-flow>i[b-ffccql8ohx]{color:#c8cdd3}.sbdesk-toolbar[b-ffccql8ohx]{display:flex;gap:10px;align-items:center;background:#fff;border:1px solid #e3e6ea;border-radius:18px;padding:12px;margin-bottom:14px}.search[b-ffccql8ohx]{flex:1;display:flex;align-items:center;gap:8px;padding:0 12px;background:#f5f6f8;border-radius:11px}.search input[b-ffccql8ohx],.sbdesk-toolbar select[b-ffccql8ohx]{height:42px;border:0;outline:0;background:transparent}.sbdesk-toolbar select[b-ffccql8ohx]{padding:0 12px;background:#f5f6f8;border-radius:11px}.segmented[b-ffccql8ohx]{display:flex;background:#f1f2f4;padding:3px;border-radius:11px}.segmented button[b-ffccql8ohx],.refresh[b-ffccql8ohx]{height:36px;border:0;border-radius:8px;padding:0 13px;font-weight:700;background:transparent}.segmented button.on[b-ffccql8ohx]{background:#fff;color:#e52f42;box-shadow:0 2px 8px #1112}.refresh[b-ffccql8ohx]{height:42px;background:#1d2227;color:#fff}.sbdesk-summary[b-ffccql8ohx]{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:14px}.sbdesk-summary article[b-ffccql8ohx]{background:#fff;border:1px solid #e1e5e9;border-radius:17px;padding:16px 18px;display:grid;grid-template-columns:auto 1fr;align-items:end}.sbdesk-summary small[b-ffccql8ohx]{grid-column:1/3;color:#7c8490;font-weight:700}.sbdesk-summary strong[b-ffccql8ohx]{font-size:1.8rem}.sbdesk-summary span[b-ffccql8ohx]{font-size:.7rem;text-align:right;color:#9299a2}.sbdesk-grid[b-ffccql8ohx]{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.sb-card[b-ffccql8ohx]{background:#fff;border:1px solid #e0e4e8;border-radius:19px;padding:17px;cursor:pointer;transition:.18s;box-shadow:0 5px 18px #1b243008}.sb-card:hover[b-ffccql8ohx]{transform:translateY(-2px);border-color:#f15a68;box-shadow:0 12px 26px #4c182014}.sb-card.confirmed[b-ffccql8ohx]{box-shadow:inset 4px 0 #2cc98d}.sb-card header[b-ffccql8ohx],.sb-card footer[b-ffccql8ohx]{display:flex;justify-content:space-between;align-items:center}.sb-card header>div[b-ffccql8ohx]{display:flex;flex-direction:column}.specno[b-ffccql8ohx]{font-size:1rem;font-weight:900;color:#e63246}.sb-card header small[b-ffccql8ohx]{color:#9aa0a8}.status[b-ffccql8ohx]{font-size:.67rem;font-weight:800;border-radius:99px;padding:5px 8px}.status.ready[b-ffccql8ohx]{color:#087b54;background:#e9fbf4}.status.warn[b-ffccql8ohx]{color:#b66c00;background:#fff6dc}.customer[b-ffccql8ohx]{display:flex;justify-content:space-between;margin:15px 0 8px}.customer span[b-ffccql8ohx]{color:#68717d;font-size:.8rem}.meta[b-ffccql8ohx]{display:flex;gap:12px;color:#7c8590;font-size:.72rem;border-bottom:1px solid #edf0f2;padding-bottom:12px}.meta i[b-ffccql8ohx]{margin-right:4px}.line-preview[b-ffccql8ohx]{min-height:120px;padding:11px 0}.line-preview>div[b-ffccql8ohx]{display:flex;align-items:center;gap:7px;font-size:.75rem;margin:6px 0}.line-preview .name[b-ffccql8ohx]{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;flex:1}.line-preview .dot[b-ffccql8ohx]{width:7px;height:7px;background:#ffb02e;border-radius:50%}.line-preview .dot.ok[b-ffccql8ohx]{background:#27c58b}.line-preview small[b-ffccql8ohx]{color:#9097a0}.sb-card footer[b-ffccql8ohx]{border-top:1px solid #edf0f2;padding-top:12px}.sb-card footer>div[b-ffccql8ohx]{display:flex;flex-direction:column}.sb-card footer small[b-ffccql8ohx]{color:#8d949d}.sb-card footer button[b-ffccql8ohx]{border:0;background:#1d2227;color:#fff;padding:8px 12px;border-radius:9px;font-weight:700;font-size:.75rem}.sbdesk-state[b-ffccql8ohx]{min-height:260px;display:flex;flex-direction:column;gap:12px;align-items:center;justify-content:center;color:#87909b}.sbdesk-state>i[b-ffccql8ohx]{font-size:2.5rem}.sbdesk-state.error[b-ffccql8ohx]{color:#d62f41}.sb-modal-backdrop[b-ffccql8ohx]{position:fixed;inset:0;background:#10131899;backdrop-filter:blur(5px);z-index:1100;display:flex;justify-content:flex-end}.sb-modal[b-ffccql8ohx]{width:min(780px,94vw);height:100%;overflow:auto;background:#f8f9fb;box-shadow:-20px 0 50px #0003;padding:24px}.sb-modal>header[b-ffccql8ohx]{display:flex;justify-content:space-between;align-items:flex-start;background:#181c21;color:#fff;border-radius:18px;padding:20px 22px}.sb-modal>header small[b-ffccql8ohx]{color:#ff5362;font-weight:900;letter-spacing:.12em}.sb-modal h2[b-ffccql8ohx]{margin:4px 0 0;font-weight:900}.sb-modal>header span[b-ffccql8ohx]{color:#bec3ca}.sb-modal>header button[b-ffccql8ohx]{border:0;background:#ffffff12;color:#fff;border-radius:9px;width:38px;height:38px}.modal-flags[b-ffccql8ohx]{display:flex;gap:8px;flex-wrap:wrap;margin:13px 0}.modal-flags span[b-ffccql8ohx]{background:#fff;border:1px solid #e1e5e9;border-radius:10px;padding:8px 10px;font-size:.75rem;font-weight:700}.item-head[b-ffccql8ohx]{display:flex;justify-content:space-between;align-items:end;margin:18px 2px 8px}.item-head small[b-ffccql8ohx]{color:#8c949e}.items[b-ffccql8ohx]{display:flex;flex-direction:column;gap:8px}.item-row[b-ffccql8ohx]{display:grid;grid-template-columns:34px minmax(0,1fr) 58px 70px 155px;gap:10px;align-items:center;background:#fff;border:1px solid #e1e5e9;border-radius:14px;padding:11px}.item-icon[b-ffccql8ohx]{display:grid;place-items:center;width:30px;height:30px;border-radius:9px;background:#fff3d8;color:#b46d00}.item-icon.ok[b-ffccql8ohx]{background:#e5f9f1;color:#087e56}.item-main[b-ffccql8ohx]{min-width:0;display:flex;flex-direction:column}.item-main small[b-ffccql8ohx]{color:#89919b;font-size:.64rem}.item-main b[b-ffccql8ohx]{font-size:.78rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.item-main code[b-ffccql8ohx]{color:#ce3041;font-size:.66rem}.qty[b-ffccql8ohx],.serial[b-ffccql8ohx]{display:flex;flex-direction:column}.qty small[b-ffccql8ohx],.serial small[b-ffccql8ohx]{font-size:.6rem;color:#8c949d}.qty b[b-ffccql8ohx]{font-size:1rem}.qty.ok b[b-ffccql8ohx]{color:#0a8b60}.qty.warn b[b-ffccql8ohx]{color:#d28100}.serial b[b-ffccql8ohx]{font-size:.68rem;overflow:hidden;text-overflow:ellipsis}.serial span[b-ffccql8ohx]{font-size:.6rem;color:#888}.modal-warning[b-ffccql8ohx]{display:flex;gap:10px;background:#fff3d9;color:#925a00;border:1px solid #ffd78b;border-radius:13px;padding:12px;margin:13px 0}.modal-warning span[b-ffccql8ohx]{display:flex;flex-direction:column}.note[b-ffccql8ohx]{display:flex;flex-direction:column;gap:5px;margin-top:14px;font-size:.72rem;font-weight:800}.note textarea[b-ffccql8ohx]{min-height:72px;border:1px solid #dfe3e7;border-radius:12px;padding:10px;resize:vertical}.sb-modal>footer[b-ffccql8ohx]{display:flex;justify-content:flex-end;gap:8px;margin-top:15px}.sb-modal>footer button[b-ffccql8ohx]{border:0;border-radius:11px;padding:11px 18px;font-weight:800}.ghost[b-ffccql8ohx]{background:#e8ebee}.confirm[b-ffccql8ohx]{background:#ef3347;color:#fff}.confirm:disabled[b-ffccql8ohx]{opacity:.55}@media(max-width:1100px){.sbdesk-grid[b-ffccql8ohx]{grid-template-columns:repeat(2,1fr)}.sbdesk-flow[b-ffccql8ohx]{overflow-x:auto}.sbdesk-flow>div[b-ffccql8ohx]{min-width:145px}.sbdesk-summary[b-ffccql8ohx]{grid-template-columns:repeat(2,1fr)}}@media(max-width:720px){.sbdesk-shell[b-ffccql8ohx]{padding:12px}.sbdesk-hero[b-ffccql8ohx]{align-items:flex-start;gap:16px;flex-direction:column}.sbdesk-toolbar[b-ffccql8ohx]{align-items:stretch;flex-direction:column}.sbdesk-grid[b-ffccql8ohx],.sbdesk-summary[b-ffccql8ohx]{grid-template-columns:1fr}.item-row[b-ffccql8ohx]{grid-template-columns:30px minmax(0,1fr) 48px 58px}.serial[b-ffccql8ohx]{grid-column:2/5}.sb-modal[b-ffccql8ohx]{padding:12px}}
/* /Components/Pages/Admin/SpecBuilderV2/BranchFulfillmentModal.razor.rz.scp.css */
/* Branch fulfillment modal — one compact layout, no duplicate rule sets. */

.branch-modal-backdrop[b-kibxuvodzp] {
    position: fixed;
    inset: 0;
    z-index: 2000;
    background: rgba(15,23,42,.42);
    backdrop-filter: blur(2px);
}

.branch-modal[b-kibxuvodzp] {
    z-index: 3000;
}

    .branch-modal .modal-dialog[b-kibxuvodzp] {
        max-width: 700px;
        margin: 1.25rem auto;
    }

.branch-modal-content[b-kibxuvodzp], .sub-modal-content[b-kibxuvodzp] {
    overflow: hidden;
    border: 0;
    border-radius: 14px;
    box-shadow: 0 20px 50px rgba(15,23,42,.16);
}

.branch-modal-header[b-kibxuvodzp], .branch-toolbar[b-kibxuvodzp], .branch-modal-footer[b-kibxuvodzp], .sub-modal-header[b-kibxuvodzp], .sub-modal-footer[b-kibxuvodzp] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    background: #fff;
}

.branch-modal-header[b-kibxuvodzp] {
    padding: 10px 14px; /* <--- เปลี่ยนกลับเป็น 14px เท่ากันทั้งซ้ายและขวา */
    background-color:#1e293b;
    border-bottom: 2px solid #dc2626;
}

    .branch-modal-header h6[b-kibxuvodzp] {
        font-size: 1.2rem;
        color:#ffffff !important;
    }

.branch-modal-header .extra-small[b-kibxuvodzp] {
    color:#cbd5e1 !important;
}

.branch-title-icon[b-kibxuvodzp] {
    display: grid;
    width: 40px; /* <--- ขยายความกว้างกล่องโลโก้ */
    height: 40px; /* <--- ขยายความสูงกล่องโลโก้ */
    place-items: center;
    border-radius: 10px; /* เพิ่มความโค้งมนให้สมส่วนกับขนาดที่ใหญ่ขึ้น */
    background:#dc2626;
    color:#ffffff;
    font-size: 1.2rem; /* <--- ปรับเพิ่มขนาดตัวไอคอนด้านใน (ค่าเริ่มต้นปกติจะอยู่ที่ประมาณ 0.95rem ถึง 1rem) */
}

.branch-total-badge[b-kibxuvodzp] {
    padding: 3px 7px;
    border-radius: 999px;
    background:#dc2626;
    color:#ffffff;
    font-size: .62rem;
    font-weight: 700;
}

.branch-toolbar[b-kibxuvodzp] {
    padding: 5px 14px; /* <--- ตรวจสอบให้แน่ใจว่าตัวหลังเป็น 14px เพื่อให้บาลานซ์กับจุดอื่น */
    border-bottom: 1px solid #cbd5e1;
}

/*ช่องพิมพ์ค้นหาซื่อสาขา*/
.branch-search-wrap[b-kibxuvodzp] {
    position: relative;
    flex: 0 1 260px; /* เปลี่ยนเลขตัวแรกเป็น 0 เพื่อไม่ให้ช่องมันพยายามยืดขยายเอง */
    max-width: 300px; /* <--- ปรับลดขนาดความกว้างสูงสุดตรงนี้ (ลองปรับระหว่าง 160px - 210px ดูความพอดีได้ครับ) */
}

/*ช่องพิมพ์ค้นหาซื่อสาขา*/
.branch-search[b-kibxuvodzp] {
    height: 28px; /* ปรับลดความสูงของช่องลงที่นี่ (แนะนำช่วง 26px - 30px) */
    padding-right: 35px; /* บีบระยะขอบขวาเข้าตามความสูงที่ลดลง */
    padding-left: 35px; /* บีบระยะขอบซ้ายเข้าตามความสูงที่ลดลง */
    border-color: #94a3b8;
    border-radius: 6px; /* ปรับความโค้งมนให้เหลี่ยมขึ้นเล็กน้อยเพื่อให้เข้ากับช่องที่เตี้ยลง */
    font-size: .68rem; /* ลดขนาดฟอนต์ลงเล็กน้อยเพื่อไม่ให้ตัวหนังสือติดขอบบนขอบล่าง */
}


    .branch-search:focus[b-kibxuvodzp] {
        border-color: #7dd3fc;
        box-shadow: 0 0 0 .16rem rgba(14,165,233,.12);
    }

.branch-search-icon[b-kibxuvodzp], .branch-search-clear[b-kibxuvodzp] {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    color: #94a3b8;
}

.branch-search-icon[b-kibxuvodzp] {
    left: 11px;
    font-size: .8rem;
}

.branch-search-clear[b-kibxuvodzp] {
    right: 8px;
    padding: 0;
    border: 0;
    background: transparent;
    line-height: 1;
}

.branch-summary-pills[b-kibxuvodzp] {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 6px;
}

.pill-stat[b-kibxuvodzp] {
    display: inline-flex;
    align-items: center;
    gap: 3px;
    padding: 5px 8px;
    border: 1px solid #e2e8f0;
    border-radius: 6px;
    color: #64748b;
    font-size: .64rem;
}

.pill-success[b-kibxuvodzp] {
    border-color: #bbf7d0;
    color: #15803d;
}

/* 🟢 ปุ่มฟิลเตอร์สลับดูสถานะสาขา */
.btn-pill[b-kibxuvodzp] {
    background: #fff;
    cursor: pointer;
    border: 1px solid #e2e8f0;
    transition: all 0.15s ease-in-out;
    user-select: none;
}

.btn-pill:hover[b-kibxuvodzp] {
    background: #f8fafc;
    border-color: #cbd5e1;
}

/* ปุ่มสถานะเปิดใช้งาน (Active States) */
.btn-pill.active[b-kibxuvodzp] {
    background: #0f172a;
    color: #ffffff !important;
    border-color: #0f172a;
}

.btn-pill.active strong[b-kibxuvodzp] {
    color: #ffffff !important;
}

.pill-success.active[b-kibxuvodzp] {
    background: #16a34a;
    color: #ffffff !important;
    border-color: #16a34a;
}

.pill-warning[b-kibxuvodzp] {
    border-color: #fed7aa;
    color: #c2410c;
}

.pill-warning.active[b-kibxuvodzp] {
    background: #ea580c;
    color: #ffffff !important;
    border-color: #ea580c;
}

.branch-modal-body[b-kibxuvodzp] {
    max-height: 65vh;
    /* เรียงสเกล: บน(10px) ขวา(14px) ล่าง(14px) ซ้าย(14px) */
    padding: 10px 14px 14px 14px; /* <--- ตรวจสอบให้มั่นใจว่าเป็น 14px เท่ากันทุกล้าน เพื่อดึงรายชื่อขยายออกขวา */
    overflow-y: auto;
    background: #f8fafc;
}

.branch-list[b-kibxuvodzp] {
    overflow: hidden;
    border: 1px solid #94a3b8;
    border-radius: 10px;
    background: #fff;
}


/* [ คอลัมน์ที่ 1: ชื่อสาขา ] | [ คอลัมน์ที่ 2: เส้นโปรเกรสบาร์ ] | [ คอลัมน์ที่ 3: ปุ่มเลือก ] */
/* minmax(150px, 200px) | minmax(220px, 1fr) | 92px */
.branch-row[b-kibxuvodzp] {
    /* 1. กำหนดให้ตำแหน่งของวัตถุข้างในอ้างอิงกับกรอบของแถวนี้ (เช่น เส้นแถบสีเขียว/ส้มแนวตั้งด้านซ้ายสุด) */
    position: relative;
    /* 2. เปิดใช้งานระบบ Grid แบ่งพื้นที่ในแถวออกเป็นช่องตาราง (ซ้าย กลาง ขวา) */
    display: grid;
    /* 3. จุดสำคัญที่สุด: การแบ่ง "คอลัมน์" (แนวตั้ง) ออกเป็น 3 ส่วน */
    grid-template-columns: minmax(120px, 180px) minmax(180px, 1fr) 86px;
    /* 4. การแบ่ง "แถว" (แนวนอน) ภายใน 1 สาขา ออกเป็น 2 ชั้น (ชั้นบนโชว์ชื่อและเส้นโปรเกรส, ชั้นล่างโชว์สินค้าที่ขาด) */
    grid-template-rows: 30px auto;
    /* 5. ระยะห่างระหว่างคอลัมน์แนวตั้ง (ช่องไฟระหว่าง คอลัมน์ 1 | คอลัมน์ 2 | คอลัมน์ 3) */
    column-gap: 12px;
    /* 6. ระยะห่างระหว่างชั้นแนวนอน (ช่องไฟระหว่าง ชื่อสาขา กับ รายชื่อสินค้าที่ขาดด้านล่าง) */
    row-gap: 2px;
    /* 7. ความสูงขั้นต่ำของแต่ละสาขา (ต่อให้ไม่มีสินค้าขาด ก็จะสูงอย่างน้อย 62px เพื่อความสวยงาม) */
    min-height: 62px;
    /* 8. ระยะเยื้องจากขอบสี่เหลี่ยมด้านนอกเข้ามาหาเนื้อหาด้านใน (บน ขวา ล่าง ซ้าย) */
    padding: 7px 12px 7px 16px;
    /* 9. เส้นคั่นบางๆ สีเทาระหว่างแต่ละสาขา */
    border-bottom: 1px solid #cbd5e1;
    /* 10. สีพื้นหลังของแถวเป็นสีขาว */
    background: #fff;
    /* 11. ตั้งค่าแอนิเมชันตอนเอาเมาส์ไปชี้ (Hover) ให้สีพื้นหลังเปลี่ยนแบบนุ่มนวลภายใน 0.12 วินาที */
    transition: background .12s ease;
}

    .branch-row:last-child[b-kibxuvodzp] {
        border-bottom: 0;
    }

    .branch-row:hover[b-kibxuvodzp] {
        background: #fafcff;
    }

    .branch-row[b-kibxuvodzp]::before {
        position: absolute;
        top: 0;
        bottom: 0;
        left: 0;
        width: 3px;
        content: "";
        background: #cbd5e1;
    }

.row-ready[b-kibxuvodzp]::before {
    background: #22c55e;
}

.row-partial[b-kibxuvodzp]::before {
    background: #f59e0b;
}

.row-active[b-kibxuvodzp] {
    background: #f8fafc;
}

    .row-active[b-kibxuvodzp]::before {
        background: #0f172a;
    }

/* These two wrappers are only layout containers; their children join the row grid. */
.branch-main[b-kibxuvodzp], .branch-main-bottom[b-kibxuvodzp] {
    display: contents;
}

.branch-main-top[b-kibxuvodzp] {
    grid-column: 1;
    grid-row: 1;
    display: flex;
    align-items: center;
    min-width: 0;
    gap: 7px;
}

.branch-id-badge[b-kibxuvodzp] {
    flex: 0 0 auto;
    height: 20px;
    padding: 0 6px;
    border: 1px solid #dbe3ec;
    border-radius: 5px;
    background: #f8fafc;
    color: #64748b;
    font-size: .62rem;
    font-weight: 600;
    white-space: nowrap;
}

.branch-name[b-kibxuvodzp] {
    min-width: 0;
    overflow: hidden;
    color: #1e293b;
    font-size: .78rem;
    font-weight: 700;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.badge-current[b-kibxuvodzp] {
    display: inline-flex;
    flex: 0 0 auto;
    align-items: center;
    gap: 3px;
    height: 19px;
    padding: 0 6px;
    border-radius: 5px;
    background: #0f172a;
    color: #ffffff;
    font-size: .6rem;
    font-weight: 700;
    white-space: nowrap;
}

/* 🟢 1. ขยายขนาดกล่องป้ายสต๊อก (ทั้งป้ายสินค้าครบ และ ป้ายขาด X รายการ) */
.stock-badge[b-kibxuvodzp] {
    grid-column: 1;
    grid-row: 2;
    display: inline-flex;
    justify-self: start;
    align-items: center;
    gap: 5px; /* เพิ่มระยะห่างระหว่างไอคอนกับตัวอักษร */
    height: 22px; /* 🟢 เพิ่มความสูงของป้าย (เดิม 19px) */
    padding: 0 8px; /* 🟢 ขยายระยะขอบซ้าย-ขวา (เดิม 0 6px) */
    border: 1px solid;
    border-radius: 6px; /* เพิ่มความโค้งมนให้สมส่วน (เดิม 5px) */
    font-size: .72rem; /* 🟢 เพิ่มขนาดตัวหนังสือ (เดิม .59rem) */
    font-weight: 700;
    white-space: nowrap;
}

.badge-ready[b-kibxuvodzp] {
    border-color: #bbf7d0;
    background: #f0fdf4;
    color: #15803d;
}

.badge-partial[b-kibxuvodzp] {
    border-color: #fdba74;
    background: #ffffff !important;
    color: #000000 !important;
    cursor: pointer;
    transition: box-shadow .12s ease, background .12s ease;
}

    .badge-partial:hover[b-kibxuvodzp] {
        background: #f8fafc !important;
        box-shadow: 0 1px 4px rgba(15, 23, 42, .12);
    }

/* เส้นขอบแยกสถานะของป้ายสินค้าขาด */
.badge-border-warning[b-kibxuvodzp] { border: 1px solid #fdba74 !important; } /* สินค้าไม่พออย่างเดียว */
.badge-border-danger[b-kibxuvodzp] { border: 1px solid #fca5a5 !important; }  /* หมดสต๊อกอย่างเดียว */
.badge-border-mixed[b-kibxuvodzp] { border: 1px solid #cbd5e1 !important; }   /* มีทั้งสองแบบ */

/* 🟢 2. ปรับขนาดไอคอนลูกศรเล็กๆ ด้านขวาของป้ายให้ใหญ่ขึ้นตาม */
.missing-open-icon[b-kibxuvodzp] {
    font-size: .65rem; /* 🟢 เดิม .55rem */
    opacity: .72;
}

/* Each available missing-name has its own line; Razor renders at most two. */
.missing-preview[b-kibxuvodzp] {
    grid-column: 2 / -1;
    grid-row: 2;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 3px;
    min-width: 0;
    cursor: pointer;
}

/* 🟢 รายการสินค้าแถวขวา: ปรับแต่งสไตล์แยกสถานะ */
.missing-preview-item[b-kibxuvodzp] {
    display: flex;
    align-items: center;
    min-width: 0;
    height: 20px;
    padding: 0 7px;
    border-radius: 5px;
    font-size: .68rem;
    font-weight: 600;
}

/* 🔴 กรณีสินค้าหมด (0 ชิ้น) */
.missing-item-out[b-kibxuvodzp] {
    background: #fef2f2 !important;
    border: 1px solid #fecaca;
    color: #991b1b !important;
}

/* 🟠 กรณีสินค้าไม่พอ (มีแต่ไม่ครบ) */
.missing-item-low[b-kibxuvodzp] {
    background: #fffbe6 !important;
    border: 1px solid #ffe58f;
    color: #d46b08 !important;
}

    .missing-preview-item i[b-kibxuvodzp] {
        flex: 0 0 auto;
        margin-right: 3px;
    }

    .missing-preview-item span[b-kibxuvodzp] {
        min-width: 0;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
/* The status badge already shows the total missing count, so the detail area stays two lines. */
.missing-more[b-kibxuvodzp] {
    display: none;
}

.branch-stock[b-kibxuvodzp] {
    grid-column: 2;
    grid-row: 1;
    display: flex;
    align-items: center;
    min-width: 0;
    gap: 9px;
}

.branch-stock-header[b-kibxuvodzp] {
    order: 2;
    flex: 0 0 auto;
}

.branch-stock-label[b-kibxuvodzp] {
    display: none;
}

.branch-stock-count[b-kibxuvodzp] {
    display: block;
    color: #15803d;
    font-size: .7rem;
    font-weight: 700;
    white-space: nowrap;
}

.stock-incomplete[b-kibxuvodzp] {
    color: #c2410c;
}

.branch-progress[b-kibxuvodzp] {
    order: 1;
    flex: 1 1 auto;
    height: 4px;
    overflow: hidden;
    border-radius: 999px;
    background: #e9eef4;
}

.branch-progress-fill[b-kibxuvodzp] {
    height: 100%;
    border-radius: inherit;
    transition: width .25s ease;
}

.progress-ready[b-kibxuvodzp] {
    background: #22c55e;
}

.progress-partial[b-kibxuvodzp] {
    background: #f59e0b;
}

.branch-action[b-kibxuvodzp] {
    grid-column: 3;
    grid-row: 1;
    display: flex;
    align-items: center;
    justify-content: flex-end;
}

.branch-select-btn[b-kibxuvodzp] {
    display: inline-flex;
    width: 86px;
    height: 30px;
    align-items: center;
    justify-content: center;
    gap: 4px;
    padding: 0 8px;
    border-radius: 7px;
    font-size: .65rem;
    font-weight: 700;
    line-height: 1;
}

    .branch-select-btn i[b-kibxuvodzp] {
        font-size: .62rem;
    }

.branch-select-ready[b-kibxuvodzp] {
    border: 1px solid #16a34a;
    background: #16a34a;
    color: #fff;
}

    .branch-select-ready:hover[b-kibxuvodzp] {
        border-color: #15803d;
        background: #15803d;
    }

.branch-select-normal[b-kibxuvodzp] {
    border: 1px solid #cbd5e1;
    background: #fff;
    color: #0f172a;
}

    .branch-select-normal:hover[b-kibxuvodzp] {
        border-color: #0f172a;
        background: #0f172a;
        color: #ffffff;
    }

.branch-current-btn[b-kibxuvodzp] {
    border: 1px solid #e2e8f0;
    background: #f8fafc;
    color: #94a3b8;
}

.branch-state-box[b-kibxuvodzp] {
    display: grid;
    min-height: 150px;
    place-content: center;
    text-align: center;
}

.branch-modal-footer[b-kibxuvodzp] {
    min-height: 44px;
    padding: 8px 18px;
    border-top: 1px solid #cbd5e1;
}

    .branch-modal-footer .btn[b-kibxuvodzp] {
        font-size: .7rem;
    }

.sub-modal-backdrop[b-kibxuvodzp] {
    position: fixed;
    inset: 0;
    z-index: 4000;
    background: rgba(15,23,42,.38);
}

.sub-modal[b-kibxuvodzp] {
    z-index: 5000;
}

.sub-modal-header[b-kibxuvodzp] {
    align-items: flex-start;
    padding: 13px 15px;
    background-color:#1e293b;
    border-bottom: 2px solid #dc2626;
}

.sub-modal-header h6[b-kibxuvodzp] {
    color:#ffffff !important;
}

.sub-modal-header .extra-small[b-kibxuvodzp] {
    color:#cbd5e1 !important;
}

.sub-modal-body[b-kibxuvodzp] {
    max-height: 55vh;
    padding: 10px 15px;
    overflow-y: auto;
    background: #f8fafc;
}

.sub-modal-footer[b-kibxuvodzp] {
    padding: 9px 15px;
    border-top: 1px solid #e2e8f0;
}

.missing-list[b-kibxuvodzp] {
    display: flex;
    flex-direction: column;
    gap: 5px;
    padding: 0;
    margin: 0;
    list-style: none;
}

    .missing-list li[b-kibxuvodzp] {
        display: flex;
        gap: 7px;
        padding: 7px 9px;
        border: 1px solid #e2e8f0;
        border-radius: 6px;
        background: #fff;
        color: #334155;
        font-size: .72rem;
    }

/* เพิ่มคลาสนี้ไว้ท้ายสุดของไฟล์ CSS เพื่อควบคุมขนาดข้อความย่อย */
.extra-small[b-kibxuvodzp] {
    font-size: 0.62rem !important; /* ปรับลดขนาดตัวอักษรลงตามต้องการ (เช่น 0.6rem หรือ 0.62rem) */
    opacity: 0.85; /* ปรับให้ตัวอักษรบางและจางลงเล็กน้อยเพื่อความสวยงาม */
}


@media (max-width: 760px) {
    .branch-modal .modal-dialog[b-kibxuvodzp] {
        max-width: calc(100% - 12px);
        margin: .5rem auto;
    }

    .branch-toolbar[b-kibxuvodzp] {
        align-items: stretch;
        flex-direction: column;
        padding: 8px 13px;
    }

    .branch-search-wrap[b-kibxuvodzp] {
        max-width: none;
    }

    .branch-summary-pills[b-kibxuvodzp] {
        justify-content: flex-start;
    }

    .branch-modal-body[b-kibxuvodzp] {
        padding: 8px 10px 12px;
    }

    .branch-row[b-kibxuvodzp] {
        grid-template-columns: minmax(0,1fr) 86px;
        grid-template-rows: auto auto auto auto;
        column-gap: 10px;
        padding: 8px 10px 8px 13px;
    }

    .branch-main-top[b-kibxuvodzp] {
        grid-column: 1;
        grid-row: 1;
    }

    .branch-stock[b-kibxuvodzp] {
        grid-column: 1 / -1;
        grid-row: 2;
    }

    .branch-action[b-kibxuvodzp] {
        grid-column: 2;
        grid-row: 1;
    }

    .stock-badge[b-kibxuvodzp] {
        grid-column: 1;
        grid-row: 3;
    }

    .missing-preview[b-kibxuvodzp] {
        grid-column: 1 / -1;
        grid-row: 4;
        margin-top: 1px;
    }

    .branch-select-btn[b-kibxuvodzp] {
        width: 86px;
    }
}

@media (max-width: 450px) {
    .branch-modal-header[b-kibxuvodzp] {
        padding: 10px 11px;
    }

    .branch-total-badge[b-kibxuvodzp], .badge-current[b-kibxuvodzp] {
        display: none;
    }

    .branch-modal-footer[b-kibxuvodzp] {
        padding: 8px 12px;
    }

        .branch-modal-footer .extra-small[b-kibxuvodzp] {
            max-width: 65%;
            line-height: 1.35;
        }

    .branch-name[b-kibxuvodzp] {
        font-size: .72rem;
    }

    .branch-row[b-kibxuvodzp] {
        grid-template-columns: minmax(0,1fr) 78px;
        column-gap: 7px;
    }

    .branch-select-btn[b-kibxuvodzp] {
        width: 78px;
        font-size: .61rem;
    }
}

@media (prefers-reduced-motion: reduce) {
    .branch-row[b-kibxuvodzp], .branch-progress-fill[b-kibxuvodzp] {
        transition: none;
    }
}
/* /Components/Pages/Admin/SpecBuilderV2/QuotationPrintA6.razor.rz.scp.css */
/* ==========================================================================
   📄 1. การตั้งค่าหน้ากระดาษ และ โหมดการพิมพ์ (Print / Screen)
   ========================================================================== */

/* 🖨️ กำหนดขนาดกระดาษ A6 สำหรับเครื่องพิมพ์ */
@page {
    size: A6 portrait; /* ทรงตั้งขนาด A6 (105mm x 148mm) */
    margin: 0; /* ตัดขอบขาวของเครื่องพิมพ์ออก */
}

/* 🖨️ สไตล์ที่จะทำงานเฉพาะเวลา "สั่งพิมพ์จริง" (Ctrl+P) */
@media print {
    body[b-3cg1r30be4] {
        margin: 0;
        background: #fff;
        -webkit-print-color-adjust: exact;
        print-color-adjust: exact;
    }

    /* 🟢 Wrapper — ตอนพิมพ์ไม่ต้องจัดอะไรเพิ่ม (layout จัดจาก .a6-container ตัวต่อตัว) */
    .a6-print-layout[b-3cg1r30be4] {
        display: block !important;
        transform: none !important;
        padding: 0 !important;
        gap: 0 !important;
    }

    /* ซ่อนแถบเครื่องมือปรับแต่งข้อมูลเวลาพิมพ์จริง */
    .no-print[b-3cg1r30be4] {
        display: none !important;
    }

    /* แต่ละใบ A6 = block สูงคงที่ 148mm + break-after — กัน flexbox ทำลาย page-break */
    .a6-container[b-3cg1r30be4] {
        display: block !important;
        transform: none !important;
        margin: 0 !important;
        border: none !important;
        box-shadow: none !important;
        width: 105mm !important;
        height: 148mm !important; /* ล็อกความสูงคงที่ = กระดาษ A6 เต็มแผ่น */
        overflow: hidden !important;
        padding: 3mm 3mm 14mm 3mm !important;
        page-break-after: always;
        break-after: page;
    }

    /* 🟢 แทน flex gap ด้วย margin — เพราะตอนพิมพ์เป็น block layout แล้ว */
    .a6-container > div[b-3cg1r30be4] {
        margin-bottom: 1.2mm !important;
    }

    .a6-container > div:last-child[b-3cg1r30be4],
    .a6-container > div.footer-card[b-3cg1r30be4] {
        margin-bottom: 0 !important;
    }

    /* 🟢 บังคับให้แผ่นที่ 2 ขึ้นหน้ากระดาษใหม่เสมอ (ซ้อนกับ break-after ของใบแรก) */
    .page-two[b-3cg1r30be4] {
        page-break-before: always !important;
        break-before: page !important;
    }

    /* 🟢 ป้องกันกล่องโดนตัดหั่นครึ่ง หากพื้นที่ไม่พอจะยกไปทั้งกล่องในหน้าถัดไป */
    .header-card[b-3cg1r30be4], .info-bar[b-3cg1r30be4], .specs-card[b-3cg1r30be4], .addon-card[b-3cg1r30be4],
    .freebie-inline-bar[b-3cg1r30be4], .price-card[b-3cg1r30be4], .benefits-box[b-3cg1r30be4], .footer-card[b-3cg1r30be4] {
        page-break-inside: avoid;
        break-inside: avoid;
    }
}

/* 🖥️ สไตล์สำหรับการ "แสดงผลพรีวิวบนหน้าจอคอมพิวเตอร์" */
@media screen {
    body[b-3cg1r30be4] {
        background: #e2e8f0; /* สีพื้นหลังของจอพรีวิว (เทาอ่อน) */
        padding-bottom: 150px;
    }

    /* 🟢 Wrapper รับหน้าที่ zoom ทั้งหมด — แต่ละใบ A6 เป็นการ์ดแยกกันเรียงกลางจอ */
    .a6-print-layout[b-3cg1r30be4] {
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 25px; /* ระยะห่างระหว่างแผ่นในพรีวิว */
        padding-top: 30px;
        padding-bottom: 250px;
        transform: scale(1.5); /* ขยายพรีวิวบนจอให้ใหญ่ขึ้น 150% เพื่ออ่านเนื้องานง่ายขึ้น */
        transform-origin: top center;
    }

    /* Containers กลายเป็นการ์ดใบแยก — เงารอบการ์ดพรีวิว */
    .a6-container[b-3cg1r30be4] {
        box-shadow: 0 8px 25px rgba(0,0,0,0.18) !important;
    }
}

/* ฟอนต์หลักของทั้งเอกสาร - โทนขาว-ดำ 100% สำหรับ Thermal */
body[b-3cg1r30be4], .a6-print-layout[b-3cg1r30be4], .a6-print-layout *[b-3cg1r30be4] {
    font-family: 'Sarabun', sans-serif;
    color: #000000 !important;
    letter-spacing: 0 !important;
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
}


/* ==========================================================================
   🖼️ 2. กล่องหลักควบคุมทั้งใบเสนอราคา (Main Container)
   ========================================================================== */

.a6-container[b-3cg1r30be4] {
    width: 105mm; /* ความกว้างใบ A6 */
    height: 148mm !important; /* ล็อกความสูงเป๊ะ 148mm */
    overflow: hidden !important; /* ตัดส่วนเกินขอบกระดาษ */
    padding: 3mm !important;
    background: #ffffff !important;
    box-sizing: border-box;
    border: 1px solid #000000 !important; /* กรอบนอกสีดำคมบาง */
    display: flex !important;
    flex-direction: column !important;
    justify-content: flex-start;
    gap: 1mm !important;
}

    .a6-container > *[b-3cg1r30be4] {
        flex-shrink: 0 !important;
    }

    .a6-container > div[b-3cg1r30be4] {
        margin-bottom: 0 !important;
    }

    .a6-container > div.footer-card[b-3cg1r30be4] {
        margin-bottom: 0 !important;
    }

/* ซ่อน Emoji ในโหมดกระดาษความร้อน */
.emoji[b-3cg1r30be4] {
    display: none !important;
}


/* ==========================================================================
   📍 [ส่วนที่ 1] แถบหัวกระดาษ (Header Card) - โลโก้ & ชื่อเอกสาร
   ========================================================================== */

.header-card[b-3cg1r30be4] {
    background: #ffffff !important;
    color: #000000 !important;
    padding: 1px 2px 1px 2px !important;
    border-radius: 0 !important;
    border-bottom: none !important; /* เอาเส้นขีดยาวส่วนหัวออก */
    margin-bottom: -0.5mm !important; /* 🟢 ดึงช่องข้อมูลลูกค้าขึ้นมาใกล้ส่วนหัวมากขึ้น */
}

/* ชื่อแบรนด์ "iHAVECPU" */
.brand-title[b-3cg1r30be4] {
    font-size: calc(13pt * var(--a6-scale, 1.1));
    font-weight: 800;
    letter-spacing: -0.3px;
    line-height: 1;
    color: #000000 !important;
}

/* ชื่อสาขาต่อท้ายโลโก้ iHAVECPU */
.brand-branch[b-3cg1r30be4] {
    font-size: calc(8.5pt * var(--a6-scale, 1.1));
    font-weight: 600;
    color: #000000 !important;
    margin-left: 0px;
}

/* สโลแกนใต้โลโก้ "CUSTOM PC & GAMING GEAR" */
.brand-sub[b-3cg1r30be4] {
    font-size: calc(5pt * var(--a6-scale, 1.1));
    color: #000000 !important;
    font-weight: 700;
    letter-spacing: 0.4px;
    margin-top: 1px;
}

/* ชื่อหัวเอกสาร "ใบเสนอสเปกคอมพิวเตอร์" (ฝั่งขวา) */
.doc-type-title[b-3cg1r30be4] {
    font-size: calc(9pt * var(--a6-scale, 1.1));
    font-weight: 800;
    color: #000000 !important;
    line-height: 1;
}

/* ชื่อภาษาอังกฤษ "PC SPECIFICATION PROPOSAL" */
.doc-type-sub[b-3cg1r30be4] {
    font-size: calc(5pt * var(--a6-scale, 1.1));
    color: #000000 !important;
    margin-top: 1px;
}


/* ==========================================================================
   📍 [ส่วนที่ 2] แถบข้อมูลลูกค้า & รหัสชุดเซต (Info Bar)
   ========================================================================== */

.info-bar[b-3cg1r30be4] {
    background-color: #ffffff !important;
    border: 1px solid #000000 !important; /* กรอบบางคม 1px */
    border-radius: 3px;
    padding: 3px 6px;
    font-size: calc(6.2pt * var(--a6-scale, 1.1));
}

.info-label[b-3cg1r30be4] {
    color: #000000 !important;
    font-weight: 500;
}

.info-val[b-3cg1r30be4] {
    color: #000000 !important;
    font-weight: 700;
}


/* ==========================================================================
   📍 [ส่วนที่ 3] ตารางรายละเอียดสเปกเครื่อง (Specs Table)
   ========================================================================== */

/* กรอบรอบตารางสเปก - คมบาง ไม่มีพื้นเทา */
.specs-card[b-3cg1r30be4] {
    background-color: #ffffff !important;
    border: 1px solid #000000 !important;
    border-radius: 3px;
    overflow: hidden;
}

/* แถบหัวตาราง: ตัวหนา พื้นขาว เส้นคั่นล่างดำ */
.specs-card-header[b-3cg1r30be4] {
    background-color: #ffffff !important;
    color: #000000 !important;
    padding: 3px 6px;
    font-weight: 800;
    font-size: calc(6.5pt * var(--a6-scale, 1.1));
    border-bottom: 1px solid #000000 !important;
}

.header-price-tag[b-3cg1r30be4] {
    color: #000000 !important;
    font-weight: 800;
    font-size: calc(6.5pt * var(--a6-scale, 1.1));
}

/* โครงสร้างตารางสเปก */
.spec-table[b-3cg1r30be4] {
    width: 100%;
    border-collapse: collapse;
}

    /* 🟢 เอาเส้นแนวนอนในตาราง CPU/MB/RAM/SSD/PSU/CASE ออกทั้งหมด */
    .spec-table tr[b-3cg1r30be4] {
        border-bottom: none !important;
    }

    /* ช่องเซลล์ตัวหนังสือสเปกสินค้าทุกช่องในตาราง */
    .spec-table td[b-3cg1r30be4] {
        padding: 1.8px 3px 1.8px 3px !important;
        font-size: calc(6.1pt * var(--a6-scale, 1.1));
        line-height: 1.25 !important;
        vertical-align: middle !important;
    }

    /* เว้นระยะฝั่งขวาสุดของตาราง ไม่ให้ตัวหนังสือ/วงเล็บชนทับเส้นขอบ (ขยับออกขวาพอดีๆ) */
    .spec-table td:last-child[b-3cg1r30be4] {
        padding-right: 2px !important;
    }

/* 🌟 คอลัมน์ที่ 1: หมวดหมู่อุปกรณ์ (CPU, MB, VGA, RAM) - ไม่มีเส้นแนวตั้ง, พื้นขาวโปร่ง, ตัวหนา */
.spec-cat[b-3cg1r30be4] {
    width: 3%;
    font-weight: 800 !important;
    color: #000000 !important;
    background-color: transparent !important;
    border-right: none !important; /* 🟢 เอาเส้นแนวตั้งออก */
    text-align: center;
    vertical-align: middle !important;
}

/* 🌟 คอลัมน์ที่ 2: ชื่อรุ่นสินค้าอุปกรณ์ */
.spec-detail[b-3cg1r30be4] {
    width: 80%;
    color: #000000 !important;
    font-weight: 500;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 0;
    font-size: calc(6.4pt * var(--a6-scale, 1.1)) !important;
    vertical-align: middle !important;
}

/* 🌟 คอลัมน์ที่ 3: ช่องป้ายสถานะ/ราคา (ฝั่งขวาสุดของแต่ละแถว) */
.spec-badge[b-3cg1r30be4] {
    width: 17%;
    text-align: right;
    font-size: calc(5.4pt * var(--a6-scale, 1.1));
    font-weight: 700;
    color: #000000 !important;
    vertical-align: middle !important;
}

/* ป้ายสถานะทุกแบบ: พื้นขาว ตัวหนังสือดำ ไม่มีพื้นสี ไม่มีกรอบ */
.tag-upg[b-3cg1r30be4],
.tag-rep[b-3cg1r30be4],
.tag-down[b-3cg1r30be4],
.tag-std[b-3cg1r30be4] {
    color: #000000 !important;
    background-color: transparent !important;
    border: none !important;
    padding: 0 !important;
    display: inline-block;
    transform: none !important; /* 🟢 ไม่เลื่อนทับเส้นขอบ */
}


/* ==========================================================================
   📍 [ส่วนที่ 4] รายการสินค้าและอุปกรณ์เสริม (Products & Accessories)
   ========================================================================== */

/* กล่องรายการสินค้าและอุปกรณ์เสริม: มีกรอบคงไว้ */
.addon-card[b-3cg1r30be4] {
    background-color: #ffffff !important;
    border: 1px solid #000000 !important;
    border-radius: 3px;
    padding: 3px 6px;
    font-size: calc(6.2pt * var(--a6-scale, 1.1));
}

.addon-header-title[b-3cg1r30be4] {
    font-size: calc(6pt * var(--a6-scale, 1.1));
    font-weight: 800;
    color: #000000 !important;
    border-bottom: 1px solid #000000 !important;
    padding-bottom: 2px;
    margin-bottom: 2px;
}

.addon-title[b-3cg1r30be4] {
    color: #000000 !important;
    font-size: calc(5.2pt * var(--a6-scale, 1.1));
}

.addon-price[b-3cg1r30be4] {
    font-weight: 800;
    color: #000000 !important;
    font-size: calc(5.7pt * var(--a6-scale, 1.1));
    white-space: nowrap;
}

/* รายการสินค้าเสริม (ไม่มีเส้นกั้นแถวตามเดิม) */
.addon-row[b-3cg1r30be4] {
    padding: 0.5px 0;
}

/* กรณี Standalone Mode */
.addon-card.standalone[b-3cg1r30be4] {
    padding: 4px 6px;
}

.addon-card.standalone .addon-header-title[b-3cg1r30be4] {
    font-size: calc(6.5pt * var(--a6-scale, 1.1));
    padding-bottom: 2px;
    margin-bottom: 3px !important;
}

.addon-card.standalone .addon-title[b-3cg1r30be4] {
    font-size: calc(5.5pt * var(--a6-scale, 1.1));
    font-weight: 600;
}

.addon-card.standalone .addon-price[b-3cg1r30be4] {
    font-size: calc(6pt * var(--a6-scale, 1.1));
    font-weight: 800;
}

.addon-card.standalone .addon-row[b-3cg1r30be4] {
    min-height: calc(11pt * var(--a6-scale, 1.1));
}

.addon-card.standalone .addon-empty-row[b-3cg1r30be4] {
    min-height: calc(11pt * var(--a6-scale, 1.1));
}


/* ==========================================================================
   📍 อุปกรณ์ของแถมพิเศษ (Free Gifts Card)
   ========================================================================== */

/* กล่องของแถม: ใช้เส้นประสีดำคมบาง (1px dashed) */
.freebie-inline-bar[b-3cg1r30be4] {
    background-color: #ffffff !important;
    border: 1px dashed #000000 !important; /* 🟢 เส้นประบางคมชัด */
    border-radius: 3px;
    padding: 2.5px 5px;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 2px 3px;
}

.freebie-label[b-3cg1r30be4] {
    font-size: calc(5.5pt * var(--a6-scale, 1.1));
    font-weight: 800;
    color: #000000 !important;
    white-space: nowrap;
    display: inline-flex;
    align-items: center;
    gap: 2px;
    margin-right: 2px;
}

.freebie-pill[b-3cg1r30be4] {
    font-size: calc(4.6pt * var(--a6-scale, 1.1));
    font-weight: 500;
    color: #000000 !important;
    background-color: #ffffff !important;
    border: 0.5px solid #000000 !important; /* เส้นขอบบางคม */
    padding: 1px 3px;
    border-radius: 4px;
    white-space: nowrap;
}


/* ==========================================================================
   📍 [ส่วนที่ 5] กล่องสรุปยอดเงินรวมสุทธิ (Price Summary Box)
   ========================================================================== */

/* กล่องสรุปยอดเงิน: คงกรอบไว้ 1.5px คมชัด พื้นขาว ตัวหนังสือดำ */
.price-card[b-3cg1r30be4] {
    background: #ffffff !important;
    color: #000000 !important;
    border: 1.5px solid #000000 !important; /* 🟢 คงกรอบเด่นชัด */
    border-radius: 3px;
    padding: 3px 6px;
}

.price-card .border-bottom[b-3cg1r30be4] {
    border-bottom: 1px solid #000000 !important;
}

.price-total-label[b-3cg1r30be4] {
    font-size: calc(7pt * var(--a6-scale, 1.1));
    font-weight: 800;
    color: #000000 !important;
    line-height: 1.1;
}

.price-sub-row[b-3cg1r30be4] {
    font-size: calc(5.8pt * var(--a6-scale, 1.1));
    color: #000000 !important;
    margin-top: 1px;
}

.price-total-val[b-3cg1r30be4] {
    font-size: calc(11pt * var(--a6-scale, 1.1));
    font-weight: 800;
    color: #000000 !important;
    line-height: 1;
}


/* ==========================================================================
   📍 [ส่วนที่ 6] เงื่อนไขการเคลม (Benefits Box) - ตัดกรอบออกทั้งหมด
   ========================================================================== */

.benefits-box[b-3cg1r30be4] {
    background-color: transparent !important;
    border: none !important; /* 🟢 เอาเส้นกรอบออกทั้งหมด */
    border-radius: 0;
    padding: 1px 2px;
}

.benefits-title[b-3cg1r30be4] {
    font-size: calc(5.4pt * var(--a6-scale, 1.1));
    font-weight: 800;
    color: #000000 !important;
    margin-bottom: 1px;
    text-transform: uppercase;
}

.benefits-list[b-3cg1r30be4] {
    margin: 0;
    padding-left: 4px !important; /* ขยับเยื้องขวามานิดนึง */
    list-style: none; /* เอา bullet เดิมของ browser ที่เว้นห่างออก */
    font-size: calc(5pt * var(--a6-scale, 1.1));
    color: #000000 !important;
    line-height: 1.25;
}

.benefits-list li[b-3cg1r30be4] {
    color: #000000 !important;
    position: relative;
    padding-left: 9px; /* ระยะห่างจากจุดถึงข้อความกระชับพอดี */
}

.benefits-list li[b-3cg1r30be4]::before {
    content: "•";
    position: absolute;
    left: 0px;
    font-size: 1.1em;
    line-height: 1;
}


/* ==========================================================================
   📍 [ส่วนที่ 7] ส่วนท้ายกระดาษ - ข้อมูลติดต่อสาขา (Footer Contacts)
   ========================================================================== */

.footer-card[b-3cg1r30be4] {
    border-top: 1px solid #000000 !important;
    padding-top: 2px;
    text-align: center;
    font-size: calc(5.1pt * var(--a6-scale, 1.1));
    color: #000000 !important;
    line-height: 1.2;
    margin-top: auto !important; /* ดันลงล่าง */
    position: relative !important;
}

.page-two .footer-card[b-3cg1r30be4] {
    margin-top: 2mm !important;
    position: relative !important;
    bottom: auto !important;
}

.location-link[b-3cg1r30be4] {
    font-size: calc(4.8pt * var(--a6-scale, 1.1));
    color: #000000 !important;
    text-decoration: underline;
    word-break: break-all;
}


/* ==========================================================================
   🟢 5. โหมดจัมโบ้ (+30%) & ขนาดใหญ่ (+20%)
   ========================================================================== */

.a6-jumbo .brand-branch[b-3cg1r30be4] {
    display: block;
}

.a6-jumbo .benefits-title[b-3cg1r30be4] {
    font-size: 5.22pt !important;
}

.a6-jumbo .benefits-list[b-3cg1r30be4] {
    font-size: 4.95pt !important;
}

.a6-large .benefits-title[b-3cg1r30be4] {
    font-size: 5.742pt !important;
}

.a6-large .benefits-list[b-3cg1r30be4] {
    font-size: 5.445pt !important;
}
/* /Components/Pages/Admin/Tracking/GlobalTracking.razor.rz.scp.css */
.global-monitor[b-2888628ol8]{display:grid;grid-template-columns:340px minmax(0,1fr);height:calc(100dvh - 80px);min-height:600px;background:#f4f7fa;color:#1f2937}.monitor-list[b-2888628ol8]{background:#fff;padding:16px;display:flex;flex-direction:column;min-height:0;box-shadow:2px 0 10px #0001;z-index:1}.monitor-list header small[b-2888628ol8]{color:#058a80;font-weight:700;letter-spacing:.1em}.monitor-list h1[b-2888628ol8]{font-size:24px;margin:6px 0}.monitor-list p[b-2888628ol8],.monitor-list small[b-2888628ol8]{font-size:12px;color:#64748b}.monitor-tabs[b-2888628ol8]{display:flex;flex-wrap:wrap;gap:4px;margin:12px 0}.monitor-tabs button[b-2888628ol8]{border:0;background:#f1f5f9;padding:7px;border-radius:6px;font-size:12px}.monitor-tabs .active[b-2888628ol8]{background:#dbeafe;color:#1d4ed8}.monitor-tools[b-2888628ol8]{display:flex;gap:8px;margin-bottom:8px}.monitor-scroll[b-2888628ol8]{overflow:auto;flex:1;margin-top:12px}.monitor-row[b-2888628ol8]{width:100%;border:0;border-bottom:1px solid #e2e8f0;background:white;text-align:left;display:flex;align-items:center;gap:10px;padding:13px 4px}.monitor-row.selected[b-2888628ol8]{background:#eff6ff}.monitor-row>span:nth-child(2)[b-2888628ol8]{flex:1;min-width:0}.monitor-row small[b-2888628ol8]{display:block;overflow-wrap:anywhere}.dot[b-2888628ol8]{width:9px;height:9px;background:#94a3b8;border-radius:50%;flex-shrink:0}.dot.online[b-2888628ol8]{background:#10b981}.monitor-map-shell[b-2888628ol8]{position:relative;min-width:0}.monitor-map[b-2888628ol8]{height:100%;width:100%;background:#e2e8f0}.monitor-refresh[b-2888628ol8]{position:absolute;top:12px;left:12px;background:#ffffffed;padding:8px 12px;border-radius:7px;font-size:12px}.monitor-error[b-2888628ol8]{position:absolute;top:55px;left:12px;right:12px;background:#fff1f2;padding:12px;color:#9f1239}.monitor-info[b-2888628ol8]{position:absolute;bottom:24px;left:24px;background:white;padding:22px;width:320px;max-width:calc(100% - 48px);border-radius:15px;box-shadow:0 8px 28px #0003}.monitor-info h2[b-2888628ol8]{font-size:19px}.monitor-info p[b-2888628ol8]{font-size:13px;overflow-wrap:anywhere}@media(max-width:800px){.global-monitor[b-2888628ol8]{grid-template-columns:1fr;height:auto}.monitor-list[b-2888628ol8]{max-height:360px}.monitor-map-shell[b-2888628ol8]{height:65dvh;min-height:450px}}
.branch-controls[b-2888628ol8]{flex-shrink:0;font-size:12px;max-height:300px;overflow:auto}.branch-controls details[b-2888628ol8]{max-height:160px;overflow:auto}.branch-controls button[b-2888628ol8]{font-size:12px}@media(max-width:800px){.monitor-list[b-2888628ol8]{max-height:65dvh;overflow:auto}.monitor-scroll[b-2888628ol8]{flex:none;max-height:220px}.branch-controls[b-2888628ol8]{max-height:240px}}
/* /Components/Pages/Public/OnsiteTracking.razor.rz.scp.css */
.onsite-public[b-rhax8xw6e7]{max-width:1100px;margin:auto;padding:24px;color:#17243d;font-family:Prompt,sans-serif}header[b-rhax8xw6e7]{display:flex;align-items:center;justify-content:space-between;margin-bottom:24px}header img[b-rhax8xw6e7]{width:160px}a[b-rhax8xw6e7]{color:#263d67}.hero[b-rhax8xw6e7]{background:linear-gradient(120deg,#162239,#345ead);border-radius:24px;color:white;padding:36px}.hero small[b-rhax8xw6e7]{color:#65eed5;letter-spacing:2px}.hero h1[b-rhax8xw6e7]{margin:12px 0;font-size:clamp(26px,5vw,40px);font-weight:700}.lookup[b-rhax8xw6e7]{padding:28px;background:#f3f6fb;border-radius:20px;margin:20px 0}.lookup>div[b-rhax8xw6e7]{display:flex;gap:12px;margin:10px 0}input[b-rhax8xw6e7]{min-width:0;flex:1;border:1px solid #ccd7e7;border-radius:10px;padding:14px;font-size:18px}button[b-rhax8xw6e7]{border:0;background:#ed2841;color:white;border-radius:10px;padding:12px 20px;font-weight:600}button:disabled[b-rhax8xw6e7]{opacity:.5}.job-list[b-rhax8xw6e7]{display:flex;gap:12px;flex-wrap:wrap;margin:20px 0}.job-list button[b-rhax8xw6e7]{background:white;color:#243956;border:1px solid #b9cadf;text-align:left}.job-list button[aria-pressed=true][b-rhax8xw6e7]{border:2px solid #ed2841}.status-panel[b-rhax8xw6e7]{padding:24px;border:1px solid #d9e2ee;border-radius:20px;margin-bottom:16px}.status-panel h2[b-rhax8xw6e7]{font-size:24px}.status-panel strong[b-rhax8xw6e7]{color:#087e6a;font-size:22px}.map[b-rhax8xw6e7]{height:450px;border-radius:20px;overflow:hidden;background:#eff3f9}small[b-rhax8xw6e7],footer[b-rhax8xw6e7]{color:#61728c}footer[b-rhax8xw6e7]{padding:30px 0;font-size:13px}#onsite-public-message[b-rhax8xw6e7]{color:#805516}section[hidden][b-rhax8xw6e7]{display:none}@media(max-width:600px){.onsite-public[b-rhax8xw6e7]{padding:14px}.lookup[b-rhax8xw6e7]{padding:18px}.lookup>div[b-rhax8xw6e7]{flex-direction:column}.hero[b-rhax8xw6e7]{padding:24px}.map[b-rhax8xw6e7]{height:350px}}