@import '_content/ZXingBlazor/ZXingBlazor.bundle.scp.css';

/* /Components/Account/Pages/Login.razor.rz.scp.css */
/* =====================================================
   Login.razor.css — Nebula Card (redesigned v3)
   Floating split-card over animated mesh gradient
   ===================================================== */

/* ---------- Design tokens ---------- */
.google-login-wrapper[b-lspz45unow] {
    --brand-1: #1a73e8;  /* Google blue */
    --brand-2: #1967d2;  /* Google blue dark */
    --brand-3: #ea4335;  /* Google red */
    --brand-4: #34a853;  /* Google green */

    --ink-900: #0b1220;
    --ink-800: #1e293b;
    --ink-700: #334155;
    --ink-500: #64748b;
    --ink-400: #94a3b8;
    --ink-300: #cbd5e1;
    --ink-200: #e2e8f0;
    --ink-100: #f1f5f9;
    --ink-50:  #f8fafc;
    --line:    #e5e7eb;
    --danger:  #dc2626;

    position: fixed;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 24px;
    overflow: hidden;
    z-index: 10;
    font-family: 'Inter', 'Google Sans', Roboto, -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Microsoft YaHei", sans-serif;
    -webkit-font-smoothing: antialiased;
    color: var(--ink-900);

    /* Google-style light background */
    background:
        radial-gradient(900px 600px at 12% 8%,   rgba(66, 133, 244, 0.10) 0%, transparent 60%),
        radial-gradient(800px 600px at 92% 18%,  rgba(234, 67, 53, 0.08)  0%, transparent 60%),
        radial-gradient(900px 700px at 88% 96%,  rgba(52, 168, 83, 0.09)  0%, transparent 60%),
        radial-gradient(800px 600px at 10% 92%,  rgba(251, 188, 5, 0.10)  0%, transparent 60%),
        linear-gradient(135deg, #ffffff 0%, #f8f9fa 50%, #f1f3f4 100%);
    background-size: 200% 200%;
    animation: meshShift-b-lspz45unow 24s ease-in-out infinite alternate;
}

@keyframes meshShift-b-lspz45unow {
    0%   { background-position: 0% 0%, 100% 0%, 100% 100%, 0% 100%, 0 0; }
    100% { background-position: 20% 10%, 80% 20%, 70% 80%, 30% 90%, 0 0; }
}

/* Soft vignette overlay on the wrapper (no grid) */
.google-login-wrapper[b-lspz45unow]::before {
    content: "";
    position: absolute;
    inset: 0;
    background: radial-gradient(ellipse at center, transparent 60%, rgba(60, 64, 67, 0.06) 100%);
    pointer-events: none;
    z-index: 0;
}

/* =====================================================
   Floating split card
   ===================================================== */
.google-login-card-outer[b-lspz45unow] {
    position: relative;
    z-index: 1;
    display: flex;
    width: 100%;
    max-width: 480px;
    min-height: 560px;
    background: #ffffff;
    border-radius: 20px;
    box-shadow:
        0 1px 2px rgba(60, 64, 67, 0.08),
        0 8px 24px -12px rgba(60, 64, 67, 0.14),
        0 0 0 1px rgba(60, 64, 67, 0.06);
    overflow: hidden;
    transform: scale(0.9);
}

/* Top accent bar on the card */
.google-login-card-outer[b-lspz45unow]::before {
    content: "";
    position: absolute;
    top: 0; left: 0; right: 0;
    height: 2px;
    background: linear-gradient(90deg, #6366f1, #ec4899, #38bdf8, #ec4899, #6366f1);
    background-size: 200% 100%;
    z-index: 2;
    animation: accentFlow-b-lspz45unow 14s linear infinite;
}

/* Bottom accent bar on the card (mirrored: blue → pink → purple) */
.google-login-card-outer[b-lspz45unow]::after {
    content: "";
    position: absolute;
    bottom: 0; left: 0; right: 0;
    height: 2px;
    background: linear-gradient(90deg, #38bdf8, #ec4899, #6366f1, #ec4899, #38bdf8);
    background-size: 200% 100%;
    z-index: 2;
    animation: accentFlowReverse-b-lspz45unow 14s linear infinite;
}

@keyframes accentFlow-b-lspz45unow {
    0%   { background-position: 0% 0; }
    100% { background-position: 200% 0; }
}
@keyframes accentFlowReverse-b-lspz45unow {
    0%   { background-position: 200% 0; }
    100% { background-position: 0% 0; }
}

/* =====================================================
   LEFT — Brand panel (Google-style light)
   ===================================================== */
.login-left-panel[b-lspz45unow] {
    position: relative;
    flex: 1 1 0;
    min-width: 0;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding: 56px 48px;
    color: #202124;
    background:
        radial-gradient(700px 500px at 10% 0%,   rgba(66, 133, 244, 0.22) 0%, transparent 60%),
        radial-gradient(600px 500px at 100% 100%, rgba(52, 168, 83, 0.20) 0%, transparent 60%),
        radial-gradient(500px 400px at 90% 10%,  rgba(234, 67, 53, 0.16)  0%, transparent 60%),
        radial-gradient(500px 400px at 0% 100%,  rgba(251, 188, 5, 0.20)  0%, transparent 60%),
        linear-gradient(155deg, #f8f9fa 0%, #eef1f5 55%, #e8eaed 100%);
    border-right: 1px solid rgba(60, 64, 67, 0.08);
}

/* Floating orbs — softened for light bg */
.aurora-orb[b-lspz45unow] {
    position: absolute;
    border-radius: 50%;
    filter: blur(70px);
    opacity: 0.45;
    pointer-events: none;
    animation: float-b-lspz45unow 16s ease-in-out infinite;
}
.aurora-orb-1[b-lspz45unow] {
    width: 280px; height: 280px;
    background: radial-gradient(circle, #4285f4 0%, transparent 70%);
    top: -60px; left: -40px;
}
.aurora-orb-2[b-lspz45unow] {
    width: 360px; height: 360px;
    background: radial-gradient(circle, #34a853 0%, transparent 70%);
    bottom: -120px; right: -90px;
    animation-delay: -6s;
}
.aurora-orb-3[b-lspz45unow] {
    width: 220px; height: 220px;
    background: radial-gradient(circle, #ea4335 0%, transparent 70%);
    top: 45%; right: 10%;
    animation-delay: -10s;
}
@keyframes float-b-lspz45unow {
    0%, 100% { transform: translate(0, 0) scale(1); }
    33%      { transform: translate(30px, -24px) scale(1.06); }
    66%      { transform: translate(-20px, 26px) scale(0.96); }
}

.aurora-grid[b-lspz45unow] {
    position: absolute;
    inset: 0;
    pointer-events: none;
    background:
        radial-gradient(600px 400px at 20% 30%, rgba(60, 64, 67, 0.03) 0%, transparent 60%),
        radial-gradient(500px 400px at 80% 70%, rgba(60, 64, 67, 0.025) 0%, transparent 60%);
}

.login-left-content[b-lspz45unow] {
    position: relative;
    z-index: 1;
    max-width: 420px;
    width: 100%;
}

.left-logo-mark[b-lspz45unow] {
    width: 56px;
    height: 56px;
    margin: 0 0 28px;
    padding: 10px;
    border-radius: 16px;
    background: #ffffff;
    border: 1px solid rgba(60, 64, 67, 0.10);
    box-shadow: 0 4px 14px -4px rgba(60, 64, 67, 0.18);
    display: flex; align-items: center; justify-content: center;
}
.left-logo-mark svg[b-lspz45unow] { width: 36px; height: 36px; }

.left-title[b-lspz45unow] {
    font-size: 34px;
    font-weight: 700;
    color: #202124;
    margin: 0 0 10px;
    letter-spacing: -0.02em;
    line-height: 1.15;
}

.left-subtitle[b-lspz45unow] {
    font-size: 14.5px;
    color: #5f6368;
    margin: 0 0 32px;
    line-height: 1.65;
    max-width: 380px;
}

/* Feature list */
.feature-list[b-lspz45unow] {
    list-style: none;
    margin: 0; padding: 0;
    display: flex; flex-direction: column;
    gap: 12px;
}
.feature-item[b-lspz45unow] {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding: 12px 14px;
    background: rgba(255, 255, 255, 0.75);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    border: 1px solid rgba(60, 64, 67, 0.10);
    border-radius: 12px;
    transition: transform 0.25s ease, background 0.25s ease, border-color 0.25s ease, box-shadow 0.25s ease;
}
.feature-item:hover[b-lspz45unow] {
    transform: translateX(4px);
    background: #ffffff;
    border-color: rgba(66, 133, 244, 0.35);
    box-shadow: 0 6px 18px -10px rgba(60, 64, 67, 0.25);
}
.feature-icon[b-lspz45unow] {
    flex-shrink: 0;
    width: 32px; height: 32px;
    border-radius: 9px;
    display: flex; align-items: center; justify-content: center;
    background: #4285f4;
    color: #fff;
    box-shadow: 0 2px 6px -2px rgba(60, 64, 67, 0.25);
}
.feature-item:nth-child(2) .feature-icon[b-lspz45unow] { background: #ea4335; box-shadow: 0 2px 6px -2px rgba(234, 67, 53, 0.35); }
.feature-item:nth-child(3) .feature-icon[b-lspz45unow] { background: #34a853; box-shadow: 0 2px 6px -2px rgba(52, 168, 83, 0.35); }
.feature-title[b-lspz45unow] {
    font-size: 13.5px;
    font-weight: 600;
    color: #202124;
    margin-bottom: 2px;
}
.feature-desc[b-lspz45unow] {
    font-size: 12px;
    color: #5f6368;
    line-height: 1.55;
}

/* Brand panel footer — tiny brand badge */
.left-brand-badge[b-lspz45unow] {
    position: relative;
    z-index: 1;
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 12px;
    color: #5f6368;
    letter-spacing: 0.04em;
    margin-top: 24px;
}
.left-brand-badge .dot[b-lspz45unow] {
    width: 6px; height: 6px; border-radius: 50%;
    background: #34a853;
    box-shadow: 0 0 0 4px rgba(52, 168, 83, 0.22);
}

/* =====================================================
   RIGHT — Form panel
   ===================================================== */
.login-right-panel[b-lspz45unow] {
    position: relative;
    flex: 1 1 auto;
    width: 100%;
    background: #ffffff;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 48px 48px 28px;
}

/* Decorative QR corner ribbon (top-right) */
.google-corner-deco[b-lspz45unow] {
    position: absolute;
    top: 0;
    right: 0;
    width: 64px;
    height: 64px;
    z-index: 3;
    pointer-events: none;
    background: linear-gradient(135deg, #5b8def 0%, #4285f4 100%);
    clip-path: polygon(100% 0, 0 0, 100% 100%);
    border-top-right-radius: 20px;
}
.google-corner-deco svg[b-lspz45unow] {
    position: absolute;
    top: 8px;
    right: 8px;
    color: #fff;
    opacity: 0.95;
}

.google-login-card[b-lspz45unow] {
    width: 100%;
    max-width: 380px;
    margin: 0 auto;
    background: transparent;
    border: none;
    padding: 0;
}

/* Header */
.google-login-header[b-lspz45unow] {
    text-align: left;
    margin-bottom: 28px;
}


.google-title[b-lspz45unow] {
    font-size: 28px;
    font-weight: 700;
    color: #202124;
    margin: 0 0 8px;
    letter-spacing: -0.02em;
    line-height: 1.2;
}

.google-welcome[b-lspz45unow] {
    font-size: 15px;
    font-weight: 600;
    color: #1a73e8;
    margin: 0 0 4px;
    line-height: 1.4;
}

.google-subtitle[b-lspz45unow] {
    font-size: 14px;
    color: #5f6368;
    margin: 0;
    font-weight: 400;
}

/* Alert */
.google-alert[b-lspz45unow] {
    background: #fce8e6;
    border: 1px solid #f6c7c3;
    border-left: 3px solid #c5221f;
    border-radius: 8px;
    padding: 11px 13px;
    margin-bottom: 18px;
    font-size: 13px;
    color: #c5221f;
    display: flex;
    align-items: center;
    gap: 10px;
    animation: slideDown-b-lspz45unow 0.25s ease-out;
}
@keyframes slideDown-b-lspz45unow {
    from { opacity: 0; transform: translateY(-6px); }
    to   { opacity: 1; transform: translateY(0); }
}

/* ---------- Company Select ---------- */
.google-select-wrapper[b-lspz45unow] {
    position: relative;
    margin-bottom: 28px;
}
.google-select[b-lspz45unow] {
    display: block;
    width: 100%;
    height: 50px;
    padding: 0 40px 0 14px;
    border: 1px solid var(--line);
    border-radius: 8px;
    font-size: 14.5px;
    color: var(--ink-900);
    background: #fff;
    outline: none;
    appearance: none;
    cursor: pointer;
    transition: border-color 0.2s, box-shadow 0.2s, background 0.2s;
    font-family: inherit;
    box-sizing: border-box;
}
.google-select:hover[b-lspz45unow]  { border-color: var(--ink-300); }
.google-select:focus[b-lspz45unow]  {
    border-color: var(--brand-1);
    box-shadow: 0 0 0 4px rgba(26, 115, 232, 0.15);
}
.google-select-label[b-lspz45unow] {
    position: absolute;
    top: 0; left: 10px;
    transform: translateY(-50%);
    font-size: 11.5px;
    line-height: 1;
    font-weight: 500;
    color: var(--ink-500);
    background: #fff;
    padding: 0 6px;
    pointer-events: none;
    transition: color 0.2s;
    letter-spacing: 0.02em;
}
.google-select:focus ~ .google-select-label[b-lspz45unow] { color: var(--brand-1); }
.google-select-arrow[b-lspz45unow] {
    position: absolute;
    right: 14px;
    top: 50%;
    transform: translateY(-50%);
    pointer-events: none;
    color: var(--ink-500);
}
.google-select-error[b-lspz45unow] {
    font-size: 12px;
    color: var(--danger);
    margin-top: 6px;
    padding-left: 4px;
    display: none;
}
.google-select-error.show[b-lspz45unow] { display: block; }

/* ---------- Floating input ---------- */
.google-field[b-lspz45unow] {
    position: relative;
    margin-bottom: 28px;
}
.google-input[b-lspz45unow] {
    display: block;
    width: 100%;
    height: 50px;
    padding: 20px 46px 6px 14px;
    border: 1px solid var(--line);
    border-radius: 8px;
    font-size: 14.5px;
    color: var(--ink-900);
    background: #fff;
    outline: none;
    transition: border-color 0.2s, box-shadow 0.2s, background 0.2s;
    font-family: inherit;
    box-sizing: border-box;
}
.google-input:hover[b-lspz45unow]  { border-color: var(--ink-300); }
.google-input:focus[b-lspz45unow]  {
    border-color: var(--brand-1);
    box-shadow: 0 0 0 4px rgba(26, 115, 232, 0.15);
}

/* 覆盖浏览器自动填充的淡紫色背景，保持输入框与标签背景一致（白色） */
.google-input:-webkit-autofill[b-lspz45unow],
.google-input:-webkit-autofill:hover[b-lspz45unow],
.google-input:-webkit-autofill:focus[b-lspz45unow],
.google-input:-webkit-autofill:active[b-lspz45unow],
.google-select:-webkit-autofill[b-lspz45unow],
.google-select:-webkit-autofill:hover[b-lspz45unow],
.google-select:-webkit-autofill:focus[b-lspz45unow] {
    -webkit-box-shadow: 0 0 0 1000px #fff inset !important;
    box-shadow: 0 0 0 1000px #fff inset !important;
    -webkit-text-fill-color: var(--ink-900) !important;
    caret-color: var(--ink-900);
    transition: background-color 9999s ease-in-out 0s;
}
.google-floating-label[b-lspz45unow] {
    position: absolute;
    top: 50%;
    left: 15px;
    transform: translateY(-50%);
    font-size: 14.5px;
    color: var(--ink-500);
    pointer-events: none;
    background: transparent;
    padding: 0 4px;
    line-height: 1;
    transition: top 0.18s ease, font-size 0.18s ease, color 0.18s ease, transform 0.18s ease;
}
.google-input:focus + .google-floating-label[b-lspz45unow],
.google-input:not(:placeholder-shown) + .google-floating-label[b-lspz45unow] {
    top: 0;
    font-size: 11.5px;
    font-weight: 500;
    transform: translateY(-50%);
    color: var(--ink-500);
    background: #fff;
    letter-spacing: 0.02em;
}
.google-input:focus + .google-floating-label[b-lspz45unow] { color: var(--brand-1); }

/* Password toggle */
.google-password-toggle[b-lspz45unow] {
    position: absolute;
    right: 8px;
    top: 50%;
    transform: translateY(-50%);
    background: transparent;
    border: none;
    padding: 8px;
    color: var(--ink-500);
    cursor: pointer;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background 0.15s, color 0.15s;
}
.google-password-toggle:hover[b-lspz45unow] {
    background: var(--ink-100);
    color: var(--ink-900);
}

/* Decorative input icon (e.g. email/phone field) */
.google-input-icon[b-lspz45unow] {
    position: absolute;
    right: 14px;
    top: 50%;
    transform: translateY(-50%);
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--ink-500);
    pointer-events: none;
    transition: color 0.15s;
}
.google-input:focus ~ .google-input-icon[b-lspz45unow] { color: var(--brand-1); }

/* Hint row */
.google-hint-row[b-lspz45unow] {
    margin: 4px 0 14px;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.google-text-link[b-lspz45unow] {
    font-size: 13px;
    color: var(--brand-1);
    text-decoration: none;
    font-weight: 500;
    background: none;
    border: none;
    padding: 0;
    cursor: pointer;
    font-family: inherit;
    line-height: inherit;
    transition: color 0.15s;
}
.google-text-link:hover[b-lspz45unow] {
    color: var(--brand-2);
    text-decoration: underline;
}

/* Remember me */
.google-remember[b-lspz45unow] {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 22px;
    font-size: 13px;
    color: var(--ink-700);
    cursor: pointer;
    user-select: none;
}
.google-remember input[type="checkbox"][b-lspz45unow] {
    width: 17px;
    height: 17px;
    accent-color: var(--brand-1);
    cursor: pointer;
    flex-shrink: 0;
}

/* Primary button */
.google-actions-row[b-lspz45unow] { margin-top: 2px; }

.google-btn-primary[b-lspz45unow] {
    position: relative;
    overflow: hidden;
    width: 100%;
    height: 48px;
    border: none;
    border-radius: 999px;
    background: #1a73e8;
    color: #fff;
    font-size: 15px;
    font-weight: 600;
    letter-spacing: 0.02em;
    cursor: pointer;
    font-family: inherit;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    white-space: nowrap;
    box-shadow: 0 1px 2px rgba(60, 64, 67, 0.15), 0 2px 6px 2px rgba(60, 64, 67, 0.08);
    transition: background 0.2s ease, transform 0.18s ease, box-shadow 0.22s ease;
}
.google-btn-primary[b-lspz45unow]::before {
    content: "";
    position: absolute;
    top: 0; left: -100%;
    width: 100%; height: 100%;
    background: linear-gradient(120deg, transparent, rgba(255,255,255,0.25), transparent);
    transition: left 0.7s ease;
}
.google-btn-primary:hover:not(:disabled)[b-lspz45unow] {
    background: #1967d2;
    transform: translateY(-1px);
    box-shadow: 0 2px 4px rgba(60, 64, 67, 0.2), 0 6px 14px 2px rgba(26, 115, 232, 0.25);
}
.google-btn-primary:hover:not(:disabled)[b-lspz45unow]::before { left: 100%; }
.google-btn-primary:active:not(:disabled)[b-lspz45unow] { transform: translateY(0); background: #185abc; }
.google-btn-primary:focus-visible[b-lspz45unow] {
    outline: none;
    box-shadow: 0 0 0 4px rgba(26, 115, 232, 0.25), 0 1px 2px rgba(60, 64, 67, 0.15);
}
.google-btn-primary:disabled[b-lspz45unow] { opacity: 0.7; cursor: not-allowed; }

.google-spinner[b-lspz45unow] {
    width: 18px; height: 18px;
    border: 2.5px solid rgba(255, 255, 255, 0.4);
    border-top-color: #fff;
    border-radius: 50%;
    animation: gSpin-b-lspz45unow 0.8s linear infinite;
    flex-shrink: 0;
}
@keyframes gSpin-b-lspz45unow { to { transform: rotate(360deg); } }

/* =====================================================
   System status badge
   ===================================================== */
.google-status-badge[b-lspz45unow] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    font-size: 11px;
    color: #80868b;
    line-height: 1.4;
    white-space: nowrap;
    pointer-events: none;
    user-select: none;
}
.google-status-badge .status-dot[b-lspz45unow] {
    flex-shrink: 0;
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: #34a853;
    box-shadow: 0 0 0 4px rgba(52, 168, 83, 0.18);
    animation: statusPulse-b-lspz45unow 2.4s ease-in-out infinite;
}
@keyframes statusPulse-b-lspz45unow {
    0%, 100% { box-shadow: 0 0 0 4px rgba(52, 168, 83, 0.18); }
    50%      { box-shadow: 0 0 0 6px rgba(52, 168, 83, 0.08); }
}

/* =====================================================
   Footer (inside right panel)
   ===================================================== */
.google-page-footer[b-lspz45unow] {
    width: 100%;
    max-width: 380px;
    margin: 24px auto 0;
    padding: 16px 0 0;
    border-top: 1px solid var(--line);
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 10px;
}

.google-lang-wrapper[b-lspz45unow] { position: relative; }

.google-lang-btn[b-lspz45unow] {
    display: flex;
    align-items: center;
    gap: 6px;
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 999px;
    padding: 6px 12px;
    font-size: 12px;
    color: var(--ink-700);
    cursor: pointer;
    font-family: inherit;
    transition: all 0.18s;
}
.google-lang-btn:hover[b-lspz45unow] {
    background: var(--ink-100);
    border-color: var(--ink-300);
    color: var(--ink-900);
}

.google-lang-menu[b-lspz45unow] {
    position: absolute;
    bottom: calc(100% + 6px);
    left: 0;
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 12px;
    min-width: 220px;
    box-shadow: 0 12px 32px -8px rgba(15, 23, 42, 0.18);
    display: none;
    overflow: hidden;
    z-index: 20;
    padding: 6px;
}
.google-lang-item[b-lspz45unow] {
    padding: 10px 14px;
    font-size: 13px;
    color: var(--ink-900);
    cursor: pointer;
    transition: background 0.15s, color 0.15s;
    border-radius: 8px;
}
.google-lang-item:hover[b-lspz45unow] {
    background: var(--ink-100);
    color: var(--brand-1);
}

.google-footer-links[b-lspz45unow] { display: flex; gap: 16px; }
.google-footer-link[b-lspz45unow] {
    font-size: 12px;
    color: var(--ink-500);
    text-decoration: none;
    transition: color 0.15s;
}
.google-footer-link:hover[b-lspz45unow] {
    text-decoration: underline;
    color: var(--ink-900);
}

/* Copyright — on the light backdrop, below the card */
.google-footer-copyright[b-lspz45unow] {
    position: absolute;
    z-index: 1;
    bottom: 14px; left: 0; right: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 6px;
    font-size: 11px;
    color: #80868b;
    letter-spacing: 0.04em;
    pointer-events: none;
    user-select: none;
}
.google-footer-copyright .copyright-line[b-lspz45unow] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
}
.google-about-link[b-lspz45unow] {
    pointer-events: auto;
    color: #5f6368;
    text-decoration: none;
    font-weight: 500;
    transition: color 0.15s;
}
.google-about-link:hover[b-lspz45unow] {
    color: #1a73e8;
    text-decoration: underline;
}
.google-copyright-sep[b-lspz45unow] {
    color: #bdc1c6;
}

/* =====================================================
   Page Loader
   ===================================================== */
.page-loading-overlay[b-lspz45unow] {
    position: fixed;
    inset: 0;
    background:
        radial-gradient(900px 600px at 12% 8%,   rgba(66, 133, 244, 0.10) 0%, transparent 60%),
        radial-gradient(800px 600px at 92% 18%,  rgba(234, 67, 53, 0.08)  0%, transparent 60%),
        radial-gradient(900px 700px at 88% 96%,  rgba(52, 168, 83, 0.09)  0%, transparent 60%),
        radial-gradient(800px 600px at 10% 92%,  rgba(251, 188, 5, 0.10)  0%, transparent 60%),
        linear-gradient(135deg, #ffffff 0%, #f8f9fa 50%, #f1f3f4 100%);
    z-index: 9999;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: opacity 0.4s ease-out;
    opacity: 1;
}
.page-loading-overlay.fade-out[b-lspz45unow] {
    opacity: 0;
    pointer-events: none;
}
.loading-content[b-lspz45unow] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 16px;
}
.loading-spinner-large[b-lspz45unow] {
    width: 52px; height: 52px;
    border: 3px solid rgba(60, 64, 67, 0.12);
    border-top-color: #1a73e8;
    border-radius: 50%;
    animation: gSpin-b-lspz45unow 1s linear infinite;
}
.loading-text[b-lspz45unow] {
    color: #5f6368;
    font-weight: 500;
    font-size: 14px;
    letter-spacing: 0.04em;
}

/* Admin snackbar */
.google-snackbar[b-lspz45unow] {
    position: fixed;
    bottom: 32px;
    left: 50%;
    transform: translateX(-50%) translateY(16px);
    background: rgba(15, 23, 42, 0.95);
    backdrop-filter: blur(10px);
    color: #fff;
    padding: 13px 20px;
    border-radius: 12px;
    font-size: 13px;
    box-shadow: 0 12px 32px -8px rgba(0, 0, 0, 0.4);
    white-space: nowrap;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.22s ease, transform 0.22s ease;
    z-index: 9998;
}
.google-snackbar.show[b-lspz45unow] {
    opacity: 1;
    transform: translateX(-50%) translateY(0);
    pointer-events: auto;
}

/* =====================================================
   Responsive
   ===================================================== */
@media (max-width: 600px) {
    .google-login-wrapper[b-lspz45unow] {
        padding: 0;
        align-items: stretch;
        justify-content: stretch;
    }

    .google-login-card-outer[b-lspz45unow] {
        width: 100%;
        max-width: 100%;
        min-height: 100vh;
        border-radius: 0;
        box-shadow: none;
        transform: none;
    }

    .login-right-panel[b-lspz45unow] {
        flex: 1 1 auto;
        width: 100%;
        padding: 32px 20px 72px;
        justify-content: flex-start;
    }

    .google-login-card[b-lspz45unow] { max-width: 100%; }
    .google-page-footer[b-lspz45unow] { max-width: 100%; }

    .google-login-header[b-lspz45unow] { margin-bottom: 22px; }
    .google-title[b-lspz45unow]       { font-size: 24px; }
    .google-welcome[b-lspz45unow]     { font-size: 14px; }
    .google-subtitle[b-lspz45unow]    { font-size: 13px; }

    .google-input[b-lspz45unow],
    .google-select[b-lspz45unow]      { height: 48px; font-size: 14px; }
    .google-input[b-lspz45unow]       { padding: 18px 42px 6px 13px; }
    .google-select-wrapper[b-lspz45unow],
    .google-field[b-lspz45unow]       { margin-bottom: 22px; }
    .google-btn-primary[b-lspz45unow] { height: 46px; font-size: 14.5px; }

    .google-footer-links[b-lspz45unow] { gap: 12px; }
    .google-footer-link[b-lspz45unow]  { font-size: 11px; }
    .google-lang-btn[b-lspz45unow]     { font-size: 11px; padding: 6px 12px; }

    /* Hide the corner status badge on mobile to avoid clutter */
    .google-status-badge[b-lspz45unow] { display: none; }

    /* Fix the copyright bar at the very bottom on mobile */
    .google-footer-copyright[b-lspz45unow] {
        position: fixed;
        bottom: 0; left: 0; right: 0;
        height: 34px;
        background: #fff;
        border-top: 1px solid var(--line);
        color: #94a3b8;
        padding: 0 16px;
        z-index: 50;
        font-size: 10.5px;
    }
}

@media (max-width: 380px) {
    .login-right-panel[b-lspz45unow]  { padding: 24px 16px 72px; }
    .google-title[b-lspz45unow]       { font-size: 22px; }
    .google-page-footer[b-lspz45unow] {
        flex-direction: column;
        align-items: flex-start;
        gap: 12px;
    }
}

/* Base */
*[b-lspz45unow] { box-sizing: border-box; }
body[b-lspz45unow] {
    margin: 0;
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}
/* /Components/Account/Pages/Manage/EnableAuthenticator.razor.rz.scp.css */
.info-message[b-ovo8mw7hwr] {
    margin: 0.625rem 0 0.625rem 0;
    justify-content: start;
}
/* /Components/Account/Pages/Manage/ExternalLogins.razor.rz.scp.css */
.current-logins[b-0ng6abkovo] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.current-logins-item[b-0ng6abkovo] {
    display: flex;
    gap: 0.625rem;
}
/* /Components/Account/Shared/ExternalLoginPicker.razor.rz.scp.css */
.external-logins[b-kn3oxdxynx] {
    display: flex;
    gap: 0.5rem;
}

@media (max-width: 500px) {
    .external-logins[b-kn3oxdxynx] {
        flex-direction: column;
    }
}
/* /Components/Account/Shared/ManageLayout.razor.rz.scp.css */
[b-b3ut6wp8il] .tab-icon {
    width: 1rem;
    height: 1rem;
    min-width: 1rem;
    min-height: 1rem;
    background-size: contain;
    mask-repeat: no-repeat;
    -webkit-mask-repeat: no-repeat;
    background-position: center center;
    background-color: currentColor;
}

[b-b3ut6wp8il] .icon-profile {
    -webkit-mask-image: url("images/account/manage-profile.svg");
    mask-image: url("images/account/manage-profile.svg");
}

[b-b3ut6wp8il] .icon-email {
    -webkit-mask-image: url("images/account/manage-email.svg");
    mask-image: url("images/account/manage-email.svg");
}

[b-b3ut6wp8il] .icon-two-factor {
    -webkit-mask-image: url("images/account/manage-two-factor.svg");
    mask-image: url("images/account/manage-two-factor.svg");
}

[b-b3ut6wp8il] .icon-password {
    -webkit-mask-image: url("images/account/manage-password.svg");
    mask-image: url("images/account/manage-password.svg");
}

[b-b3ut6wp8il] .icon-personal {
    -webkit-mask-image: url("images/account/manage-personal.svg");
    mask-image: url("images/account/manage-personal.svg");
}

[b-b3ut6wp8il] .icon-external {
    -webkit-mask-image: url("images/account/user.svg");
    mask-image: url("images/account/user.svg");
}
/* /Components/Account/Shared/ShowRecoveryCodes.razor.rz.scp.css */
.codes[b-16108wbbtx] {
    margin: 0.625rem 0px 0.625rem 0px;
}
/* /Components/Common/PdfViewerComponent.razor.rz.scp.css */
/* 让 DevExpress PdfViewer 填满外层 host 容器（DxPdfViewer 只能用 CSS 控制尺寸） */
.pdf-viewer-host[b-kwm229bkal] {
    min-height: 0;
}

/* DxPdfViewer 根元素（带 pdf-viewer-inner 类）填满剩余空间 */
.pdf-viewer-host[b-kwm229bkal]  .pdf-viewer-inner {
    flex: 1 1 auto;
    height: 100%;
    width: 100%;
    min-height: 0;
}

/* 兜底：直接命中 DevExpress 内部根容器，保证有高度 */
.pdf-viewer-host[b-kwm229bkal]  .dxbl-pdf-viewer {
    flex: 1 1 auto;
    height: 100%;
    width: 100%;
    min-height: 0;
}

/* /Components/Customize/GeneralManagement.razor.rz.scp.css */
/* 现有样式保持不变 */
[b-n4hl4k1pl9] .grid-cell-align-center {
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: -4px;
    margin-bottom: -4px;
}

[b-n4hl4k1pl9] .grid-icon {
    display: inline-block;
    width: 12px;
    height: 12px;
    min-width: 12px;
    min-height: 12px;
    background-size: contain;
    mask-repeat: no-repeat;
    -webkit-mask-repeat: no-repeat;
    background-position: center center;
    background-color: currentColor;
    vertical-align: middle;
}

[b-n4hl4k1pl9] .grid-icon-delete {
    -webkit-mask-image: url("../images/icons/delete.svg");
    mask-image: url("../images/icons/delete.svg");
}

[b-n4hl4k1pl9] .grid-toolbar-new,
[b-n4hl4k1pl9] .grid-toolbar-delete,
[b-n4hl4k1pl9] .grid-toolbar-save,
[b-n4hl4k1pl9] .grid-toolbar-edit,
[b-n4hl4k1pl9] .grid-toolbar-cancel {
    background-size: contain;
    mask-repeat: no-repeat;
    -webkit-mask-repeat: no-repeat;
    background-position: center center;
    background-color: currentColor;
    height: 15px;
    width: 15px;
    opacity: 0.7;
}

[b-n4hl4k1pl9] .grid-toolbar-new {
    -webkit-mask-image: url("../images/icons/grid-toolbar-new.svg");
    mask-image: url("../images/icons/grid-toolbar-new.svg");
}

[b-n4hl4k1pl9] .grid-toolbar-save {
    -webkit-mask-image: url("images/icons/save.svg");
    mask-image: url("images/icons/save.svg");
}

[b-n4hl4k1pl9] .grid-toolbar-edit {
    -webkit-mask-image: url("../images/icons/grid-toolbar-edit.svg");
    mask-image: url("../images/icons/grid-toolbar-edit.svg");
}

[b-n4hl4k1pl9] .grid-toolbar-cancel {
    -webkit-mask-image: url("images/icons/undo.svg");
    mask-image: url("images/icons/undo.svg");
}

[b-n4hl4k1pl9] .grid-modified-cell {
    background-color: rgba(var(--bs-primary-rgb), 0.15) !important;
}

[b-n4hl4k1pl9] .grid-disabled-button {
    pointer-events: none;
}

/* 新增按钮组容器样式 - 方案1：蓝色渐变背景 */
[b-n4hl4k1pl9] .button-group-container {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    padding: 15px;
    /* 渐变背景 - 蓝色主题 */
    background: linear-gradient(135deg, #2980b9, #6ab0de);
    border-radius: 8px;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
    border: 1px solid rgba(255, 255, 255, 0.2);
    margin: 10px 0;
    transition: all 0.3s ease;
    position: relative;
    overflow: hidden;
}

    /* 添加动态效果 */
    [b-n4hl4k1pl9] .button-group-container:before {
        content: "";
        position: absolute;
        top: -50%;
        left: -50%;
        width: 200%;
        height: 200%;
        background: radial-gradient(circle, rgba(255,255,255,0.1) 0%, rgba(255,255,255,0) 80%);
        opacity: 0;
        transition: opacity 0.5s ease;
        pointer-events: none;
    }

    [b-n4hl4k1pl9] .button-group-container:hover:before {
        opacity: 1;
        animation: pulse-b-n4hl4k1pl9 1.5s infinite;
    }

@keyframes pulse-b-n4hl4k1pl9 {
    0% {
        transform: scale(0.95);
        opacity: 0.5;
    }

    70% {
        transform: scale(1.05);
        opacity: 0.2;
    }

    100% {
        transform: scale(0.95);
        opacity: 0.5;
    }
}

[b-n4hl4k1pl9] .button-group-container:hover {
    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.15);
    transform: translateY(-3px);
}

/* 美化按钮样式 */
[b-n4hl4k1pl9] .button-group-container .dx-button {
    position: relative;
    overflow: hidden;
    transition: all 0.25s ease;
    border-radius: 6px;
    margin: 0;
    min-width: 100px;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
    border: 1px solid rgba(255, 255, 255, 0.3);
}

    [b-n4hl4k1pl9] .button-group-container .dx-button:hover {
        transform: translateY(-2px);
        box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
    }

    [b-n4hl4k1pl9] .button-group-container .dx-button:active {
        transform: translateY(1px);
        box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
    }

/* 按钮图标样式优化 */
[b-n4hl4k1pl9] .button-group-container .dx-button-has-icon .dx-icon {
    margin-right: 8px;
    opacity: 0.9;
    transition: opacity 0.2s ease;
}

[b-n4hl4k1pl9] .button-group-container .dx-button:hover .dx-icon {
    opacity: 1;
}

/* 响应式调整 */
@media (max-width: 768px) {
    [b-n4hl4k1pl9] .button-group-container {
        flex-direction: column;
        gap: 8px;
    }

        [b-n4hl4k1pl9] .button-group-container .dx-button {
            width: 100%;
        }
}

/* 以下是其他背景色方案，可以替换上面的背景色样式 */

/* 方案2：深色主题 */
/*
::deep .button-group-container {
    background: linear-gradient(to right, #2c3e50, #4a6785);
    border: 1px solid rgba(255, 255, 255, 0.1);
}
*/

/* 方案3：紫色主题 */
/*
::deep .button-group-container {
    background: linear-gradient(45deg, #8e44ad, #9b59b6, #3498db);
    background-size: 200% 200%;
    animation: gradientBG 10s ease infinite;
}

@keyframes gradientBG {
    0% { background-position: 0% 50%; }
    50% { background-position: 100% 50%; }
    100% { background-position: 0% 50%; }
}
*/

/* 方案4：自然绿色主题 */
/*
::deep .button-group-container {
    background: linear-gradient(to right, #134e5e, #71b280);
}
*/

/* 方案5：暖色橙色主题 

::deep .button-group-container {
    background: linear-gradient(to right, #ff7e5f, #feb47b);
}
*/

/* ============================================================
 * 以下样式从 GeneralManagement.razor 内联 <style> 移入，做样式隔离
 * - 直接渲染的 <div> 元素使用作用域选择器（无 ::deep）
 * - 通过 CssClass 应用到 DevExpress 组件的类使用 ::deep
 * ============================================================ */

/* ===== Flexbox 自适应布局 ===== */

/* 左侧面板：工具栏 + 主表Grid 自动填满 */
.gm-left-pane[b-n4hl4k1pl9] {
    display: flex;
    flex-direction: column;
    height: 100%;
    overflow: hidden;
}

/* 右侧明细面板：工具栏 + 明细Grid 自动填满 */
.gm-detail-pane[b-n4hl4k1pl9] {
    display: flex;
    flex-direction: column;
    height: 100%;
    overflow: hidden;
}

/* 工具栏固定高度，不参与伸缩 */
.gm-left-pane > .master-toolbar-container[b-n4hl4k1pl9],
.gm-detail-pane > .master-toolbar-container[b-n4hl4k1pl9] {
    flex-shrink: 0;
}

/* Grid 自动填满剩余空间（应用到 DxGrid 的 CssClass） */
[b-n4hl4k1pl9] .gm-grid-fill {
    flex: 1;
    min-height: 0; /* 防止 flex 子元素溢出 */
    overflow: auto;
    width: 100%;
}

/* ===== 原有样式 ===== */

/* 主表工具栏容器 */
.master-toolbar-container[b-n4hl4k1pl9] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 8px 12px;
    border-radius: 4px 4px 0 0;
}

.master-grid-title[b-n4hl4k1pl9] {
    margin: 0;
    font-weight: 600;
    color: #495057;
    font-size: 14px;
}

/* 主表工具栏按钮组 */
.master-toolbar[b-n4hl4k1pl9] {
    display: flex;
    gap: 6px;
}

.master-toolbar[b-n4hl4k1pl9]  .dxbl-button {
    min-width: 60px;
    height: 28px;
    font-size: 12px;
    padding: 0 8px;
}

/* 主表Grid样式 */
.master-grid[b-n4hl4k1pl9] {
    flex: 1;
    border-radius: 0 0 4px 4px;
}

/* 详细信息工具栏样式 */
.detail-toolbar-container[b-n4hl4k1pl9] {
    background-color: #f8f9fa;
    border: 1px solid #dee2e6;
    border-radius: 4px;
    padding: 12px;
    margin-top: 8px;
}

.detail-toolbar-title[b-n4hl4k1pl9] {
    margin: 0 0 8px 0;
    font-weight: 600;
    color: #495057;
    font-size: 13px;
}

.detail-toolbar[b-n4hl4k1pl9] {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}

.detail-toolbar[b-n4hl4k1pl9]  .dxbl-button {
    min-width: 80px;
    height: 32px;
    font-size: 13px;
}

/* 网格修改单元格样式（与上方已有 ::deep .grid-modified-cell 重复，保留即可） */

[b-n4hl4k1pl9] .header-bold span {
    font-weight: 700;
}

[b-n4hl4k1pl9] .alt-item {
    --dxbl-grid-row-bg: var(--DS-color-surface-neutral-subdued-rest);
}

.validation-message[b-n4hl4k1pl9] {
    color: #dc3545;
    font-size: 0.875rem;
    margin-top: 0.25rem;
    display: block;
}

/* 响应式设计 */
@media (max-width: 768px) {
    .master-toolbar-container[b-n4hl4k1pl9] {
        flex-direction: column;
        gap: 8px;
        align-items: stretch;
    }

    .master-toolbar[b-n4hl4k1pl9] {
        justify-content: center;
    }

    .detail-toolbar[b-n4hl4k1pl9] {
        justify-content: center;
    }
}

/* Grid禁用样式（应用到 DxGrid 的 CssClass） */
[b-n4hl4k1pl9] .grid-disabled {
    pointer-events: none;
    opacity: 0.6;
    position: relative;
}

[b-n4hl4k1pl9] .grid-disabled::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(255, 255, 255, 0.3);
    z-index: 1000;
}

/* SearchBox 宽度（应用到 DxSearchBox 的 CssClass） */
[b-n4hl4k1pl9] .cw-280 {
    width: 160px;
}
/* /Components/Customize/StandardTable.razor.rz.scp.css */
[b-31bafm2j35] .grid-cell-align-center {
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: -4px;
    margin-bottom: -4px;
}

[b-31bafm2j35] .grid-icon {
    display: inline-block;
    width: 12px;
    height: 12px;
    min-width: 12px;
    min-height: 12px;
    background-size: contain;
    mask-repeat: no-repeat;
    -webkit-mask-repeat: no-repeat;
    background-position: center center;
    background-color: currentColor;
    vertical-align: middle;
}

[b-31bafm2j35] .grid-icon-delete {
    -webkit-mask-image: url("../images/icons/delete.svg");
    mask-image: url("../images/icons/delete.svg");
}

[b-31bafm2j35] .grid-toolbar-new,
[b-31bafm2j35] .grid-toolbar-delete,
[b-31bafm2j35] .grid-toolbar-save,
[b-31bafm2j35] .grid-toolbar-cancel {
    background-size: contain;
    mask-repeat: no-repeat;
    -webkit-mask-repeat: no-repeat;
    background-position: center center;
    background-color: currentColor;
    height: 15px;
    width: 15px;
    opacity: 0.7;
}

[b-31bafm2j35] .grid-toolbar-new {
    -webkit-mask-image: url("images/icons/new.svg");
    mask-image: url("images/icons/new.svg");
}

[b-31bafm2j35] .grid-toolbar-save {
    -webkit-mask-image: url("images/icons/save.svg");
    mask-image: url("images/icons/save.svg");
}

[b-31bafm2j35] .grid-toolbar-cancel {
    -webkit-mask-image: url("images/icons/undo.svg");
    mask-image: url("images/icons/undo.svg");
}

[b-31bafm2j35] .grid-modified-cell {
    background-color: rgba(var(--bs-primary-rgb), 0.15) !important;
}

[b-31bafm2j35] .grid-disabled-button {
    pointer-events: none;
}
/* /Components/Customize/StandardTableGrid.razor.rz.scp.css */
[b-4vrybooa8b] .grid-cell-align-center {
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: -4px;
    margin-bottom: -4px;
}

[b-4vrybooa8b] .grid-icon {
    display: inline-block;
    width: 12px;
    height: 12px;
    min-width: 12px;
    min-height: 12px;
    background-size: contain;
    mask-repeat: no-repeat;
    -webkit-mask-repeat: no-repeat;
    background-position: center center;
    background-color: currentColor;
    vertical-align: middle;
}

[b-4vrybooa8b] .grid-icon-delete {
    -webkit-mask-image: url("../images/icons/delete.svg");
    mask-image: url("../images/icons/delete.svg");
}

[b-4vrybooa8b] .grid-toolbar-new,
[b-4vrybooa8b] .grid-toolbar-delete,
[b-4vrybooa8b] .grid-toolbar-save,
[b-4vrybooa8b] .grid-toolbar-cancel {
    background-size: contain;
    mask-repeat: no-repeat;
    -webkit-mask-repeat: no-repeat;
    background-position: center center;
    background-color: currentColor;
    height: 15px;
    width: 15px;
    opacity: 0.7;
}

[b-4vrybooa8b] .grid-toolbar-new {
    -webkit-mask-image: url("images/icons/new.svg");
    mask-image: url("images/icons/new.svg");
}

[b-4vrybooa8b] .grid-toolbar-save {
    -webkit-mask-image: url("images/icons/save.svg");
    mask-image: url("images/icons/save.svg");
}

[b-4vrybooa8b] .grid-toolbar-cancel {
    -webkit-mask-image: url("images/icons/undo.svg");
    mask-image: url("images/icons/undo.svg");
}

[b-4vrybooa8b] .grid-modified-cell {
    background-color: rgba(var(--bs-primary-rgb), 0.15) !important;
}

[b-4vrybooa8b] .grid-disabled-button {
    pointer-events: none;
}
/* /Components/Customize/StandardTableGridConfig.razor.rz.scp.css */
[b-mpf4w8z1dc] .grid-cell-align-center {
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: -4px;
    margin-bottom: -4px;
}

[b-mpf4w8z1dc] .grid-icon {
    display: inline-block;
    width: 12px;
    height: 12px;
    min-width: 12px;
    min-height: 12px;
    background-size: contain;
    mask-repeat: no-repeat;
    -webkit-mask-repeat: no-repeat;
    background-position: center center;
    background-color: currentColor;
    vertical-align: middle;
}

[b-mpf4w8z1dc] .grid-icon-delete {
    -webkit-mask-image: url("../images/icons/delete.svg");
    mask-image: url("../images/icons/delete.svg");
}

[b-mpf4w8z1dc] .grid-toolbar-new,
[b-mpf4w8z1dc] .grid-toolbar-delete,
[b-mpf4w8z1dc] .grid-toolbar-save,
[b-mpf4w8z1dc] .grid-toolbar-cancel {
    background-size: contain;
    mask-repeat: no-repeat;
    -webkit-mask-repeat: no-repeat;
    background-position: center center;
    background-color: currentColor;
    height: 15px;
    width: 15px;
    opacity: 0.7;
}

[b-mpf4w8z1dc] .grid-toolbar-new {
    -webkit-mask-image: url("images/icons/new.svg");
    mask-image: url("images/icons/new.svg");
}

[b-mpf4w8z1dc] .grid-toolbar-save {
    -webkit-mask-image: url("images/icons/save.svg");
    mask-image: url("images/icons/save.svg");
}

[b-mpf4w8z1dc] .grid-toolbar-cancel {
    -webkit-mask-image: url("images/icons/undo.svg");
    mask-image: url("images/icons/undo.svg");
}

[b-mpf4w8z1dc] .grid-modified-cell {
    background-color: rgba(var(--bs-primary-rgb), 0.15) !important;
}

[b-mpf4w8z1dc] .grid-disabled-button {
    pointer-events: none;
}
/* /Components/Customize/StandardTableGridSize.razor.rz.scp.css */
[b-cfsuupnq6k] .grid-cell-align-center {
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: -4px;
    margin-bottom: -4px;
}

[b-cfsuupnq6k] .grid-icon {
    display: inline-block;
    width: 12px;
    height: 12px;
    min-width: 12px;
    min-height: 12px;
    background-size: contain;
    mask-repeat: no-repeat;
    -webkit-mask-repeat: no-repeat;
    background-position: center center;
    background-color: currentColor;
    vertical-align: middle;
}

[b-cfsuupnq6k] .grid-icon-delete {
    -webkit-mask-image: url("../images/icons/delete.svg");
    mask-image: url("../images/icons/delete.svg");
}

[b-cfsuupnq6k] .grid-toolbar-new,
[b-cfsuupnq6k] .grid-toolbar-delete,
[b-cfsuupnq6k] .grid-toolbar-save,
[b-cfsuupnq6k] .grid-toolbar-cancel {
    background-size: contain;
    mask-repeat: no-repeat;
    -webkit-mask-repeat: no-repeat;
    background-position: center center;
    background-color: currentColor;
    height: 15px;
    width: 15px;
    opacity: 0.7;
}

[b-cfsuupnq6k] .grid-toolbar-new {
    -webkit-mask-image: url("images/icons/new.svg");
    mask-image: url("images/icons/new.svg");
}

[b-cfsuupnq6k] .grid-toolbar-save {
    -webkit-mask-image: url("images/icons/save.svg");
    mask-image: url("images/icons/save.svg");
}

[b-cfsuupnq6k] .grid-toolbar-cancel {
    -webkit-mask-image: url("images/icons/undo.svg");
    mask-image: url("images/icons/undo.svg");
}

[b-cfsuupnq6k] .grid-modified-cell {
    background-color: rgba(var(--bs-primary-rgb), 0.15) !important;
}

[b-cfsuupnq6k] .grid-disabled-button {
    pointer-events: none;
}
/* /Components/Customize/StandardTableViewModel.razor.rz.scp.css */
[b-is44iyp5vy] .grid-cell-align-center {
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: -4px;
    margin-bottom: -4px;
}

[b-is44iyp5vy] .grid-icon {
    display: inline-block;
    width: 12px;
    height: 12px;
    min-width: 12px;
    min-height: 12px;
    background-size: contain;
    mask-repeat: no-repeat;
    -webkit-mask-repeat: no-repeat;
    background-position: center center;
    background-color: currentColor;
    vertical-align: middle;
}

[b-is44iyp5vy] .grid-icon-delete {
    -webkit-mask-image: url("../images/icons/delete.svg");
    mask-image: url("../images/icons/delete.svg");
}

[b-is44iyp5vy] .grid-toolbar-new,
[b-is44iyp5vy] .grid-toolbar-delete,
[b-is44iyp5vy] .grid-toolbar-save,
[b-is44iyp5vy] .grid-toolbar-cancel {
    background-size: contain;
    mask-repeat: no-repeat;
    -webkit-mask-repeat: no-repeat;
    background-position: center center;
    background-color: currentColor;
    height: 15px;
    width: 15px;
    opacity: 0.7;
}

[b-is44iyp5vy] .grid-toolbar-new {
    -webkit-mask-image: url("images/icons/new.svg");
    mask-image: url("images/icons/new.svg");
}

[b-is44iyp5vy] .grid-toolbar-save {
    -webkit-mask-image: url("images/icons/save.svg");
    mask-image: url("images/icons/save.svg");
}

[b-is44iyp5vy] .grid-toolbar-cancel {
    -webkit-mask-image: url("images/icons/undo.svg");
    mask-image: url("images/icons/undo.svg");
}

[b-is44iyp5vy] .grid-modified-cell {
    background-color: rgba(var(--bs-primary-rgb), 0.15) !important;
}

[b-is44iyp5vy] .grid-disabled-button {
    pointer-events: none;
}
/* /Components/Layout/Drawer.razor.rz.scp.css */
::deep .navigation-drawer[b-pasbqj8pqk] {
    --dxbl-drawer-panel-footer-justify-content: center;
    height: 100vh;
    max-height: 100%;
}

[b-pasbqj8pqk] .panel-open:not(.mobile) .menu-button {
    display: none;
}

@media (max-width: 768px) {
    [b-pasbqj8pqk] .panel-open:not(.mobile) .menu-button {
        display: inline-flex;
    }

    .mobile-drawer-closed .shading-copy[b-pasbqj8pqk] {
        display: none;
        visibility: hidden;
    }

    [b-pasbqj8pqk] .shading-copy {
        background-color: var(--dxbl-drawer-content-shading-bg);
        height: 100%;
        position: absolute;
        transition: opacity ease var(--dxbl-drawer-animation-duration);
        visibility: visible;
        width: 100%;
        z-index: 99;
        opacity: var(--dxbl-drawer-content-shading-opacity);
    }

    [b-pasbqj8pqk] .panel-open .shading-copy {
        opacity: 0;
        visibility: unset;
        height: unset;
    }
}

/* 仅在面板展开时预设宽度，防止 JS 初始化前闪动 */
[b-pasbqj8pqk] .navigation-drawer.panel-open:not(.mobile) > .dxbl-drawer-panel {
    width: 250px;
    min-width: 250px;
    max-width: 250px;
}

/* CSS 变量保留即可，DevExpress 内部会在收缩时覆盖它 */
[b-pasbqj8pqk] .navigation-drawer {
    --dxbl-drawer-panel-width: 250px;
}

/* /Components/Layout/MainLayout.razor.rz.scp.css */
.page[b-oz4cnfqw8q] {
    height: 100%;
    font-family: var(--bs-font-sans-serif);
}


/* 🎯 菜单收起时调整容器宽度 */
@media (max-width: 768px) {
    .toolbar-left-container[b-oz4cnfqw8q] {
        width: auto; /* 移动端自适应宽度 */
        border-right: none;
    }
}

/* 🎯 工具栏Logo样式 - 基础样式定义 */
.toolbar-logo-container[b-oz4cnfqw8q] {
    display: flex;
    align-items: center;
    height: 100%;
    /* 🎯 增加左边距，让Logo不要太靠左 */
    padding: 0 12px 0 15px; /* 左边距15px，右边距12px */
    margin-right: 10px;
}

.toolbar-logo[b-oz4cnfqw8q] {
    height: 32px;
    width: auto;
    max-width: 100px;
    object-fit: contain;
    transition: transform 0.2s ease, filter 0.2s ease;
    /* 🎯 默认状态：白色logo在浅色主题下变为深色 */
    filter: brightness(0) saturate(100%) invert(0%);
}

    .toolbar-logo:hover[b-oz4cnfqw8q] {
        transform: scale(1.05);
    }

/* 🎯 备用文本Logo样式 */
.toolbar-text-logo[b-oz4cnfqw8q] {
    font-size: 18px;
    font-weight: bold;
    color: inherit;
    padding: 0 4px;
    display: none; /* 默认隐藏，当图片加载失败时显示 */
}

/* 🎯 更新Logo容器样式 */
.toolbar-left-container .toolbar-logo-container[b-oz4cnfqw8q] {
    display: flex;
    align-items: center;
    height: 100%;
    padding: 0 15px;
    flex: 0 0 auto; /* 不伸缩，保持固定大小 */
}

/* 🎯 菜单切换按钮容器 */
.menu-toggle-container[b-oz4cnfqw8q] {
    display: flex;
    align-items: center;
    height: 100%;
    padding: 0 10px;
    flex: 0 0 auto; /* 不伸缩，保持固定大小 */
    margin-left: auto; /* 推到右侧 */
}

/* 🎯 响应式调整 */
@media (max-width: 1200px) {
    .toolbar-left-container[b-oz4cnfqw8q] {
        width: 220px; /* 中等屏幕稍微缩小 */
    }
}

@media (max-width: 992px) {
    .toolbar-left-container[b-oz4cnfqw8q] {
        width: 180px; /* 小屏幕进一步缩小 */
    }
}

@media (max-width: 768px) {
    .toolbar-left-container[b-oz4cnfqw8q] {
        width: auto;
        max-width: 150px;
        border-right: none;
    }

        .toolbar-left-container .toolbar-logo-container[b-oz4cnfqw8q] {
            padding: 0 8px;
        }

    .menu-toggle-container[b-oz4cnfqw8q] {
        padding: 0 5px;
    }
}

/* 🎯 确保在深色主题下边框颜色正确 */
[b-oz4cnfqw8q] .theme-blazing-dark .toolbar-left-container,
[b-oz4cnfqw8q] .theme-night .toolbar-left-container,
[b-oz4cnfqw8q] .theme-cyborg .toolbar-left-container,
[b-oz4cnfqw8q] .theme-solar .toolbar-left-container,
[b-oz4cnfqw8q] .theme-superhero .toolbar-left-container,
[b-oz4cnfqw8q] .theme-darkly .toolbar-left-container,
[b-oz4cnfqw8q] .theme-quartz .toolbar-left-container,
[b-oz4cnfqw8q] .theme-vapor .toolbar-left-container,
[b-oz4cnfqw8q] .theme-fluent-dark .toolbar-left-container,
[b-oz4cnfqw8q] .theme-dark .toolbar-left-container {
    border-right-color: var(--bs-border-color, rgba(255,255,255,0.125));
}

/* 🎯 深色主题下：让白色logo显示为白色（完全反转） */
[b-oz4cnfqw8q] .theme-blazing-dark .toolbar-logo,
[b-oz4cnfqw8q] .theme-night .toolbar-logo,
[b-oz4cnfqw8q] .theme-cyborg .toolbar-logo,
[b-oz4cnfqw8q] .theme-solar .toolbar-logo,
[b-oz4cnfqw8q] .theme-superhero .toolbar-logo,
[b-oz4cnfqw8q] .theme-darkly .toolbar-logo,
[b-oz4cnfqw8q] .theme-quartz .toolbar-logo,
[b-oz4cnfqw8q] .theme-vapor .toolbar-logo,
[b-oz4cnfqw8q] .theme-fluent-dark .toolbar-logo,
[b-oz4cnfqw8q] .theme-dark .toolbar-logo {
    /* 🎯 修复：在深色主题下，让白色logo显示为白色 */
    filter: brightness(1) saturate(100%) invert(1) !important;
}

/* 🎯 更具体的深色主题选择器，确保覆盖 */
[b-oz4cnfqw8q] body.theme-blazing-dark .toolbar-logo,
[b-oz4cnfqw8q] body.theme-night .toolbar-logo,
[b-oz4cnfqw8q] body.theme-cyborg .toolbar-logo,
[b-oz4cnfqw8q] body.theme-solar .toolbar-logo,
[b-oz4cnfqw8q] body.theme-superhero .toolbar-logo,
[b-oz4cnfqw8q] body.theme-darkly .toolbar-logo,
[b-oz4cnfqw8q] body.theme-quartz .toolbar-logo,
[b-oz4cnfqw8q] body.theme-vapor .toolbar-logo,
[b-oz4cnfqw8q] body.theme-fluent-dark .toolbar-logo,
[b-oz4cnfqw8q] html.theme-blazing-dark .toolbar-logo,
[b-oz4cnfqw8q] html.theme-night .toolbar-logo,
[b-oz4cnfqw8q] html.theme-cyborg .toolbar-logo,
[b-oz4cnfqw8q] html.theme-solar .toolbar-logo,
[b-oz4cnfqw8q] html.theme-superhero .toolbar-logo,
[b-oz4cnfqw8q] html.theme-darkly .toolbar-logo,
[b-oz4cnfqw8q] html.theme-quartz .toolbar-logo,
[b-oz4cnfqw8q] html.theme-vapor .toolbar-logo,
[b-oz4cnfqw8q] html.theme-fluent-dark .toolbar-logo,
[b-oz4cnfqw8q] html.theme-dark .toolbar-logo {
    /* 🎯 使用 !important 确保在深色主题下logo显示为白色 */
    filter: brightness(1) saturate(100%) invert(1) contrast(100%) !important;
}

/* 🎯 额外的深色主题支持，处理可能的类名变化 */
[b-oz4cnfqw8q] [class*="dark"] .toolbar-logo,
[b-oz4cnfqw8q] [data-theme*="dark"] .toolbar-logo,
[b-oz4cnfqw8q] .dark-theme .toolbar-logo {
    filter: brightness(1) saturate(100%) invert(1) contrast(100%) !important;
}

/* 抽屉底部版本信息样式 - 🎯 调整位置往上30px */
.drawer-footer-version[b-oz4cnfqw8q] {
    padding: 8px 16px;
    text-align: start;
    width: 100%;
    position: absolute;
    bottom: 0;
    left: 0;
    background-color: inherit;
    z-index: 100; /* 🆕 确保层级足够高 */
    pointer-events: auto; /* 🆕 确保可点击 */
}

.version-info[b-oz4cnfqw8q] {
    font-size: 0.8rem;
    color: inherit !important;
    display: block;
    width: 100%;
}

.drawer-footer-version[b-oz4cnfqw8q],
.drawer-footer-version *[b-oz4cnfqw8q] {
    color: inherit !important;
}

    .drawer-footer-version .version-info[b-oz4cnfqw8q] {
        color: var(--bs-body-color, var(--dxbl-content-color, inherit)) !important;
        opacity: 0.7;
    }

    .drawer-footer-version[b-oz4cnfqw8q],
    .drawer-footer-version *[b-oz4cnfqw8q],
    .drawer-footer-version .footer-button[b-oz4cnfqw8q],
    .drawer-footer-version .version-info[b-oz4cnfqw8q] {
        color: var(--dxbl-content-color, white) !important;
    }

    /* 🎯 Fluent Light 主题：footer 文字/按钮用深色 */
    .theme-fluent .drawer-footer-version[b-oz4cnfqw8q],
    .theme-fluent .drawer-footer-version *[b-oz4cnfqw8q],
    .theme-fluent .drawer-footer-version .footer-button[b-oz4cnfqw8q],
    .theme-fluent .drawer-footer-version .version-info[b-oz4cnfqw8q] {
        color: var(--dxbl-content-color, #333) !important;
    }
        /* 🆕 确保搜索按钮可点击 */
        .drawer-footer-version .footer-button[b-oz4cnfqw8q] {
            pointer-events: auto !important;
            cursor: pointer !important;
            z-index: 101 !important;
            position: relative;
        }

        /* 🆕 确保搜索容器可见可点击 */
        .drawer-footer-version .search-container[b-oz4cnfqw8q] {
            z-index: 102 !important;
            position: relative;
            pointer-events: auto !important;
        }

        /* 🆕 确保搜索框可交互 */
        .drawer-footer-version .menu-search-box[b-oz4cnfqw8q] {
            pointer-events: auto !important;
            z-index: 103 !important;
        }

        /* 🆕 确保版本信息不阻挡点击 */
        .drawer-footer-version .version-info[b-oz4cnfqw8q] {
            pointer-events: none; /* 版本信息文本不拦截点击 */
        }

/* DxToolbar 样式修复 */
/* 1. 工具栏：flex 子项不缩不长，固定 35px 高 */
[b-oz4cnfqw8q] .main-toolbar {
    flex: 0 0 35px !important;
    z-index: 100000 !important;
    pointer-events: auto !important;
    isolation: isolate !important;
    padding: 0px 5px 0px 0px;
    margin-bottom: 0 !important;
    height: 35px !important;
    display: block !important;             /* 🎯 保持 block，让内部 DxToolbar 自己管理 flex 布局 */
    width: 100% !important;                /* 🎯 确保占满宽度 */
    visibility: visible !important;
    opacity: 1 !important;
    background-color: var(--bs-body-bg, #ffffff) !important;
    background-image: none !important;
    color: inherit !important;
    border-bottom: 1px solid var(--bs-border-color, var(--dxbl-border-color, rgba(0,0,0,0.125))) !important;
    border-radius: 0 !important;
    transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out, border-color 0.2s ease-in-out !important;
}

/* 2. 内容区容器 —— flex 纵向、占满剩余空间 */
.p-2[b-oz4cnfqw8q] {
    flex: 1 1 0% !important;
    min-height: 0 !important;              /* flex 子项能收缩 */
    overflow-y: auto !important;           /* 非多标签时自身滚动 */
    overflow-x: hidden !important;         /* 🎯 防止 Fluent 主题下 .row 负边距产生横向滚动条 */
    scrollbar-gutter: stable;
    box-sizing: border-box !important;
    padding: 0.5rem !important;
    display: flex !important;
    flex-direction: column !important;
}

/* 3. 多标签容器 —— 撑满 .p-2，禁止 .p-2 自身出现滚动条 */
.tabs-container[b-oz4cnfqw8q] {
    flex: 1 1 0% !important;
    min-height: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    overflow: hidden !important;           /* 由内部 content-panel 滚动 */
}

/* 5. Drawer 内容区域调整 */
[b-oz4cnfqw8q] .dxbl-drawer-content {
    height: 100vh !important;
    overflow: hidden !important; /* 🎯 外层禁用滚动 */
    position: relative !important;
    z-index: 1 !important;
    display: flex !important;
    flex-direction: column !important;
}

/* 6. 确保 Drawer Target 正确布局 */
[b-oz4cnfqw8q] .dxbl-drawer-target {
    position: relative !important;
    z-index: auto !important;
    height: 100% !important;
    display: flex !important;
    flex-direction: column !important;
    overflow: hidden !important;
}

/* 7. 自定义滚动条样式 - 浅色主题 - 🎯 调整为更细的滚动条 */
.p-2[b-oz4cnfqw8q]::-webkit-scrollbar,
[b-oz4cnfqw8q] .dxbl-tab-page-content::-webkit-scrollbar {
    width: 4px !important; /* 🎯 从 8px 改为 4px，更细更精致 */
    height: 4px !important;
}

.p-2[b-oz4cnfqw8q]::-webkit-scrollbar-track,
[b-oz4cnfqw8q] .dxbl-tab-page-content::-webkit-scrollbar-track {
    background: var(--bs-gray-200, #f1f3f5) !important;
    border-radius: 2px !important; /* 🎯 相应调整圆角 */
}

.p-2[b-oz4cnfqw8q]::-webkit-scrollbar-thumb,
[b-oz4cnfqw8q] .dxbl-tab-page-content::-webkit-scrollbar-thumb {
    background: var(--bs-gray-400, #adb5bd) !important;
    border-radius: 2px !important; /* 🎯 相应调整圆角 */
    transition: background 0.2s ease !important;
}

    .p-2[b-oz4cnfqw8q]::-webkit-scrollbar-thumb:hover,
    [b-oz4cnfqw8q] .dxbl-tab-page-content::-webkit-scrollbar-thumb:hover {
        background: var(--bs-gray-600, #6c757d) !important;
    }

/* 8. 深色主题滚动条样式 */
[b-oz4cnfqw8q] .theme-blazing-dark .p-2::-webkit-scrollbar-track,
[b-oz4cnfqw8q] .theme-night .p-2::-webkit-scrollbar-track,
[b-oz4cnfqw8q] .theme-cyborg .p-2::-webkit-scrollbar-track,
[b-oz4cnfqw8q] .theme-fluent-dark .p-2::-webkit-scrollbar-track,
[b-oz4cnfqw8q] .theme-blazing-dark .dxbl-tab-page-content::-webkit-scrollbar-track,
[b-oz4cnfqw8q] .theme-night .dxbl-tab-page-content::-webkit-scrollbar-track,
[b-oz4cnfqw8q] .theme-cyborg .dxbl-tab-page-content::-webkit-scrollbar-track,
[b-oz4cnfqw8q] .theme-fluent-dark .dxbl-tab-page-content::-webkit-scrollbar-track,
[b-oz4cnfqw8q] .theme-dark .dxbl-tab-page-content::-webkit-scrollbar-track {
    background: rgba(255, 255, 255, 0.1) !important;
}

[b-oz4cnfqw8q] .theme-blazing-dark .p-2::-webkit-scrollbar-thumb,
[b-oz4cnfqw8q] .theme-night .p-2::-webkit-scrollbar-thumb,
[b-oz4cnfqw8q] .theme-cyborg .p-2::-webkit-scrollbar-thumb,
[b-oz4cnfqw8q] .theme-fluent-dark .p-2::-webkit-scrollbar-thumb,
[b-oz4cnfqw8q] .theme-blazing-dark .dxbl-tab-page-content::-webkit-scrollbar-thumb,
[b-oz4cnfqw8q] .theme-night .dxbl-tab-page-content::-webkit-scrollbar-thumb,
[b-oz4cnfqw8q] .theme-cyborg .dxbl-tab-page-content::-webkit-scrollbar-thumb,
[b-oz4cnfqw8q] .theme-fluent-dark .dxbl-tab-page-content::-webkit-scrollbar-thumb,
[b-oz4cnfqw8q] .theme-dark .dxbl-tab-page-content::-webkit-scrollbar-thumb {
    background: rgba(255, 255, 255, 0.3) !important;
}

    [b-oz4cnfqw8q] .theme-blazing-dark .p-2::-webkit-scrollbar-thumb:hover,
    [b-oz4cnfqw8q] .theme-night .p-2::-webkit-scrollbar-thumb:hover,
    [b-oz4cnfqw8q] .theme-cyborg .p-2::-webkit-scrollbar-thumb:hover,
    [b-oz4cnfqw8q] .theme-fluent-dark .p-2::-webkit-scrollbar-thumb:hover,
    [b-oz4cnfqw8q] .theme-blazing-dark .dxbl-tab-page-content::-webkit-scrollbar-thumb:hover,
    [b-oz4cnfqw8q] .theme-night .dxbl-tab-page-content::-webkit-scrollbar-thumb:hover,
    [b-oz4cnfqw8q] .theme-cyborg .dxbl-tab-page-content::-webkit-scrollbar-thumb:hover,
    [b-oz4cnfqw8q] .theme-fluent-dark .dxbl-tab-page-content::-webkit-scrollbar-thumb:hover,
[b-oz4cnfqw8q] .theme-dark .dxbl-tab-page-content::-webkit-scrollbar-thumb:hover {
        background: rgba(255, 255, 255, 0.5) !important;
    }

/* 9. 确保深色主题下工具栏背景不透明 */
[b-oz4cnfqw8q] .theme-blazing-dark .main-toolbar,
[b-oz4cnfqw8q] .theme-night .main-toolbar,
[b-oz4cnfqw8q] .theme-cyborg .main-toolbar,
[b-oz4cnfqw8q] .theme-solar .main-toolbar,
[b-oz4cnfqw8q] .theme-superhero .main-toolbar,
[b-oz4cnfqw8q] .theme-darkly .main-toolbar,
[b-oz4cnfqw8q] .theme-quartz .main-toolbar,
[b-oz4cnfqw8q] .theme-vapor .main-toolbar,
[b-oz4cnfqw8q] .theme-fluent-dark .main-toolbar,
[b-oz4cnfqw8q] .theme-dark .main-toolbar {
    background-color: var(--bs-body-bg, #212529) !important;
    border-bottom-color: var(--bs-border-color, var(--dxbl-border-color, rgba(255,255,255,0.125))) !important;
}

/* 10. 移除之前可能冲突的样式 */
[b-oz4cnfqw8q] .dxbl-drawer-content {
    overflow: hidden !important; /* 保持外层不滚动 */
}

    [b-oz4cnfqw8q] .main-toolbar .dxbl-toolbar-item {
        display: flex;
        align-items: center;
        height: 100%;
    }

.toolbar-button-container[b-oz4cnfqw8q],
.toolbar-nav-link[b-oz4cnfqw8q],
.toolbar-form[b-oz4cnfqw8q],
.toolbar-component-wrapper[b-oz4cnfqw8q] {
    display: flex;
    align-items: center;
    height: 100%;
}

.toolbar-form[b-oz4cnfqw8q] {
    margin: 0;
    padding: 0;
    display: inline-flex !important;
}

.toolbar-nav-link[b-oz4cnfqw8q] {
    text-decoration: none;
    color: inherit;
}

.toolbar-component-wrapper[b-oz4cnfqw8q] {
    padding: 0 2px;
    display: flex;
    align-items: center;
    min-height: 30px;
    max-height: 30px;
    position: relative !important;
}

/* 确保工具栏按钮样式继承 */
[b-oz4cnfqw8q] .main-toolbar *,
[b-oz4cnfqw8q] .main-toolbar .dxbl-btn,
[b-oz4cnfqw8q] .main-toolbar .dxbl-btn *,
[b-oz4cnfqw8q] .main-toolbar button,
[b-oz4cnfqw8q] .main-toolbar a,
[b-oz4cnfqw8q] .main-toolbar span,
[b-oz4cnfqw8q] .main-toolbar div {
    color: inherit !important;
}

/* 主题支持 — 只覆盖边框色，不覆盖背景（背景已在主规则中用 var 自适应） */

[b-oz4cnfqw8q] .theme-blazing-dark .main-toolbar,
[b-oz4cnfqw8q] .theme-night .main-toolbar,
[b-oz4cnfqw8q] .theme-cyborg .main-toolbar,
[b-oz4cnfqw8q] .theme-solar .main-toolbar,
[b-oz4cnfqw8q] .theme-superhero .main-toolbar,
[b-oz4cnfqw8q] .theme-darkly .main-toolbar,
[b-oz4cnfqw8q] .theme-quartz .main-toolbar,
[b-oz4cnfqw8q] .theme-vapor .main-toolbar {
    border-bottom-color: var(--bs-border-color, var(--dxbl-border-color, rgba(255,255,255,0.125))) !important;
}

/* Tab Context Menu Styles */
.tabs-container[b-oz4cnfqw8q] {
    position: relative;
}


.tab-text-container[b-oz4cnfqw8q] {
    display: block;
    width: 100%;
    height: 100%;
}

.tab-context-menu[b-oz4cnfqw8q] {
    position: fixed;
    z-index: 9999;
}

.context-menu-backdrop[b-oz4cnfqw8q] {
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    background: transparent;
    z-index: -1;
}

.context-menu-content[b-oz4cnfqw8q] {
    background: var(--bs-body-bg, #ffffff);
    border: 1px solid var(--bs-border-color, #dee2e6);
    border-radius: 6px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
    min-width: 180px;
    padding: 4px 0;
    font-size: 14px;
    color: var(--bs-body-color, #212529);
}

.context-menu-item[b-oz4cnfqw8q] {
    display: flex;
    align-items: center;
    padding: 8px 16px;
    cursor: pointer;
    transition: background-color 0.2s ease;
    gap: 8px;
}

    .context-menu-item:hover[b-oz4cnfqw8q] {
        background-color: var(--bs-primary, #0d6efd);
        color: white;
    }

    .context-menu-item i[b-oz4cnfqw8q] {
        width: 16px;
        font-size: 12px;
        text-align: center;
    }

    /* SVG 图标（取代 Font Awesome <i>），跟随文字 currentColor，hover 自动变白 */
    .context-menu-item .ctx-icon[b-oz4cnfqw8q] {
        width: 16px;
        height: 16px;
        flex-shrink: 0;
        color: var(--bs-secondary-color, #6c757d);
        transition: color 0.2s ease;
    }

    .context-menu-item:hover .ctx-icon[b-oz4cnfqw8q] {
        color: #fff;
    }

    /* 危险操作（关闭全部）图标染红，hover 时仍然变白以保持对比 */
    .context-menu-item-danger .ctx-icon[b-oz4cnfqw8q] {
        color: var(--bs-danger, #dc3545);
    }

    .context-menu-item span[b-oz4cnfqw8q] {
        flex: 1;
    }

.context-menu-separator[b-oz4cnfqw8q] {
    height: 1px;
    background-color: var(--bs-border-color, #dee2e6);
    margin: 4px 0;
}

/* Dark theme support for context menu */
[b-oz4cnfqw8q] .theme-blazing-dark .context-menu-content,
[b-oz4cnfqw8q] .theme-night .context-menu-content,
[b-oz4cnfqw8q] .theme-cyborg .context-menu-content,
[b-oz4cnfqw8q] .theme-solar .context-menu-content,
[b-oz4cnfqw8q] .theme-superhero .context-menu-content,
[b-oz4cnfqw8q] .theme-darkly .context-menu-content,
[b-oz4cnfqw8q] .theme-quartz .context-menu-content,
[b-oz4cnfqw8q] .theme-vapor .context-menu-content,
[b-oz4cnfqw8q] .theme-fluent-dark .context-menu-content,
[b-oz4cnfqw8q] .theme-dark .context-menu-content {
    background: var(--bs-dark, #212529);
    border-color: var(--bs-gray-600, #6c757d);
    color: var(--bs-light, #f8f9fa);
}

[b-oz4cnfqw8q] .theme-blazing-dark .context-menu-item:hover,
[b-oz4cnfqw8q] .theme-night .context-menu-item:hover,
[b-oz4cnfqw8q] .theme-cyborg .context-menu-item:hover,
[b-oz4cnfqw8q] .theme-solar .context-menu-item:hover,
[b-oz4cnfqw8q] .theme-superhero .context-menu-item:hover,
[b-oz4cnfqw8q] .theme-darkly .context-menu-item:hover,
[b-oz4cnfqw8q] .theme-quartz .context-menu-item:hover,
[b-oz4cnfqw8q] .theme-vapor .context-menu-item:hover,
[b-oz4cnfqw8q] .theme-fluent-dark .context-menu-item:hover,
[b-oz4cnfqw8q] .theme-dark .context-menu-item:hover {
    background-color: var(--bs-primary, #0d6efd);
    color: white;
}

[b-oz4cnfqw8q] .theme-blazing-dark .context-menu-separator,
[b-oz4cnfqw8q] .theme-night .context-menu-separator,
[b-oz4cnfqw8q] .theme-cyborg .context-menu-separator,
[b-oz4cnfqw8q] .theme-solar .context-menu-separator,
[b-oz4cnfqw8q] .theme-superhero .context-menu-separator,
[b-oz4cnfqw8q] .theme-darkly .context-menu-separator,
[b-oz4cnfqw8q] .theme-quartz .context-menu-separator,
[b-oz4cnfqw8q] .theme-vapor .context-menu-separator,
[b-oz4cnfqw8q] .theme-fluent-dark .context-menu-separator,
[b-oz4cnfqw8q] .theme-dark .context-menu-separator {
    background-color: var(--bs-gray-600, #6c757d);
}

/* 🎯 强制移除所有标签页相关的内边距和外边距 */
.tab-text-container[b-oz4cnfqw8q] {
    padding: 0 !important;
    margin: 0 !important;
    width: 100% !important;
    box-sizing: border-box !important;
}

.tab-header-container[b-oz4cnfqw8q] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: 30px;
    padding: 0 !important;
    margin: 0 !important;
    position: relative;
    width: 100% !important;
    box-sizing: border-box !important;
}

.tab-content[b-oz4cnfqw8q] {
    display: flex;
    align-items: center;
    flex: 1;
    gap: 5px;
    min-width: 0;
    padding: 0 !important;
    margin: 0 !important;
    box-sizing: border-box !important;
}

/* 🎯 覆盖 DevExpress 组件的默认样式 */
[b-oz4cnfqw8q] .dxbl-tab-page-text,
[b-oz4cnfqw8q] .dxbl-tab-page-text > *,
[b-oz4cnfqw8q] .dxbl-tab-page-content {
    padding: 0 !important;
    margin: 0 !important;
}

[b-oz4cnfqw8q] .dxbl-tabs .dxbl-tab-page {
    padding: 0 !important;
}

/* 🎯 确保标签页容器也没有内边距 */
[b-oz4cnfqw8q] .dxbl-tabs {
    padding: 0 !important;
}

.tab-refresh-btn[b-oz4cnfqw8q] {
    width: 20px;
    height: 20px;
    min-width: 20px;
    padding: 0;
    border-radius: 1px;
    transition: all 0.2s ease-in-out;
    opacity: 0.7;
    color: inherit !important;
    border: none !important;
    outline: none !important;
}

    .tab-refresh-btn:hover[b-oz4cnfqw8q] {
        background-color: var(--bs-gray-100, var(--dxbl-surface-bg, rgba(0,0,0,0.05))) !important;
        border: none !important;
        outline: none !important;
        opacity: 1;
        transform: scale(1.1);
    }

[b-oz4cnfqw8q] .theme-blazing-dark .tab-refresh-btn:hover,
[b-oz4cnfqw8q] .theme-night .tab-refresh-btn:hover,
[b-oz4cnfqw8q] .theme-cyborg .tab-refresh-btn:hover,
[b-oz4cnfqw8q] .theme-solar .tab-refresh-btn:hover,
[b-oz4cnfqw8q] .theme-superhero .tab-refresh-btn:hover,
[b-oz4cnfqw8q] .theme-darkly .tab-refresh-btn:hover,
[b-oz4cnfqw8q] .theme-quartz .tab-refresh-btn:hover,
[b-oz4cnfqw8q] .theme-vapor .tab-refresh-btn:hover {
    background-color: var(--bs-gray-100, var(--dxbl-surface-bg, rgba(255,255,255,0.1))) !important;
    border-color: var(--bs-gray-300, var(--dxbl-border-color, rgba(255,255,255,0.25))) !important;
}

.tab-refresh-btn .icon-refresh[b-oz4cnfqw8q]::before {
    content: "↻";
    font-size: 12px;
    font-weight: bold;
    color: inherit !important;
}

[b-oz4cnfqw8q] .icon-refresh::before {
    content: "⟲";
    font-size: 12px;
    font-weight: bold;
    color: inherit;
}

.tab-refresh-btn:active[b-oz4cnfqw8q]::after {
    transform: rotate(180deg);
}

.tab-header-container .tab-content[b-oz4cnfqw8q] {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* 🎯 修复主题切换器被覆盖的问题 */
/* 确保主题切换器面板有足够高的z-index */
[b-oz4cnfqw8q] .toolbar-component-wrapper .themeswitcher-container,
[b-oz4cnfqw8q] .themeswitcher-container {
    position: fixed !important;
    top: 45px !important;
    right: 10px !important;
    width: 300px !important;
    z-index: 999999 !important; /* 更高的层级，确保在工具栏之上 */
    pointer-events: auto !important;
    user-select: auto !important;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.2) !important;
}

[b-oz4cnfqw8q] .toolbar-component-wrapper .themeswitcher-container-shown,
[b-oz4cnfqw8q] .themeswitcher-container-shown {
    height: calc(100vh - 60px) !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    -ms-overflow-style: none !important;
    scrollbar-width: none !important;
    pointer-events: auto !important;
    transform: translateX(0) !important;
}

[b-oz4cnfqw8q] .toolbar-component-wrapper .themeswitcher-container-shown::-webkit-scrollbar,
[b-oz4cnfqw8q] .themeswitcher-container-shown::-webkit-scrollbar {
    display: none !important;
}

[b-oz4cnfqw8q] .toolbar-component-wrapper .themeswitcher-container-hidden,
[b-oz4cnfqw8q] .themeswitcher-container-hidden {
    height: 0 !important;
    overflow: hidden !important;
    transform: translateX(100%) !important;
}

/* 确保主题切换器内部所有元素都可以点击 */
[b-oz4cnfqw8q] .toolbar-component-wrapper .themeswitcher-content,
[b-oz4cnfqw8q] .toolbar-component-wrapper .themeswitcher-colors,
[b-oz4cnfqw8q] .toolbar-component-wrapper .themeswitcher-color,
[b-oz4cnfqw8q] .toolbar-component-wrapper .themeswitcher-color a,
[b-oz4cnfqw8q] .themeswitcher-content,
[b-oz4cnfqw8q] .themeswitcher-colors,
[b-oz4cnfqw8q] .themeswitcher-color,
[b-oz4cnfqw8q] .themeswitcher-color a {
    pointer-events: auto !important;
    user-select: none !important;
    position: relative !important;
    z-index: inherit !important;
}

    [b-oz4cnfqw8q] .toolbar-component-wrapper .themeswitcher-color a:hover,
    [b-oz4cnfqw8q] .themeswitcher-color a:hover {
        background-color: var(--themeswitcher-color-hover) !important;
        cursor: pointer !important;
    }

/* 确保主题切换器标题可见 */
[b-oz4cnfqw8q] .toolbar-component-wrapper .themeswitcher-title,
[b-oz4cnfqw8q] .themeswitcher-title {
    pointer-events: auto !important;
    position: sticky !important;
    top: 0 !important;
    z-index: 10 !important;
    background-color: var(--bs-body-bg) !important;
}

/* 确保主题切换器在工具栏环境中正确显示 */
[b-oz4cnfqw8q] .toolbar-component-wrapper .theme-icon-wrapper {
    position: relative !important;
    z-index: 1 !important;
}

/* 工具栏中的语言切换器样式优化 */
[b-oz4cnfqw8q] .toolbar-component-wrapper .language-switcher {
    margin: 0;
    position: relative;
    display: flex;
    align-items: center;
    height: 30px;
}

[b-oz4cnfqw8q] .toolbar-component-wrapper .language-button {
    background: transparent !important;
    border: none !important;
    cursor: pointer;
    padding: 4px 8px !important;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
    color: inherit !important;
    font-weight: 500;
    text-align: center;
    min-width: 40px;
    height: 28px;
    border-radius: 4px;
    transition: all 0.2s ease;
}

    [b-oz4cnfqw8q] .toolbar-component-wrapper .language-button:hover {
        background-color: rgba(0, 0, 0, 0.1) !important;
        transform: scale(1.05);
    }

[b-oz4cnfqw8q] .theme-blazing-dark .toolbar-component-wrapper .language-button:hover,
[b-oz4cnfqw8q] .theme-night .toolbar-component-wrapper .language-button:hover,
[b-oz4cnfqw8q] .theme-cyborg .toolbar-component-wrapper .language-button:hover,
[b-oz4cnfqw8q] .theme-solar .toolbar-component-wrapper .language-button:hover,
[b-oz4cnfqw8q] .theme-superhero .toolbar-component-wrapper .language-button:hover,
[b-oz4cnfqw8q] .theme-darkly .toolbar-component-wrapper .language-button:hover,
[b-oz4cnfqw8q] .theme-quartz .toolbar-component-wrapper .language-button:hover,
[b-oz4cnfqw8q] .theme-vapor .toolbar-component-wrapper .language-button:hover {
    background-color: rgba(255, 255, 255, 0.1) !important;
}

[b-oz4cnfqw8q] .toolbar-component-wrapper .language-text {
    font-size: 13px !important;
    font-weight: 600 !important;
    color: inherit !important;
    transition: color 0.2s ease;
    opacity: 1 !important;
}

[b-oz4cnfqw8q] .toolbar-component-wrapper .language-menu {
    position: absolute !important;
    top: calc(100% + 5px) !important;
    right: 0 !important;
    background-color: var(--bs-body-bg) !important;
    border: 1px solid var(--bs-border-color) !important;
    border-radius: 6px !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15) !important;
    z-index: 999999 !important;
    min-width: 100px !important;
    overflow: visible !important;
    pointer-events: auto !important;
    user-select: auto !important;
}

[b-oz4cnfqw8q] .toolbar-component-wrapper .language-item {
    padding: 8px 12px !important;
    cursor: pointer !important;
    color: var(--bs-body-color) !important;
    text-align: center !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 13px !important;
    transition: background-color 0.2s ease !important;
    pointer-events: auto !important;
    user-select: none !important;
}

    [b-oz4cnfqw8q] .toolbar-component-wrapper .language-item:hover {
        background-color: var(--bs-primary) !important;
        color: white !important;
    }

    [b-oz4cnfqw8q] .toolbar-component-wrapper .language-item.active {
        background-color: var(--bs-primary) !important;
        color: white !important;
        font-weight: 600 !important;
    }

/* 工具栏中的主题切换器样式优化 */
[b-oz4cnfqw8q] .toolbar-component-wrapper .theme-icon-wrapper {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    border-radius: 4px;
    cursor: pointer;
    transition: all 0.2s ease;
    margin: 0;
    padding: 0;
}

    [b-oz4cnfqw8q] .toolbar-component-wrapper .theme-icon-wrapper:hover {
        background-color: rgba(0, 0, 0, 0.1);
        transform: scale(1.1);
    }

        [b-oz4cnfqw8q] .toolbar-component-wrapper .theme-icon-wrapper:hover .theme-icon {
            background-color: transparent !important;
        }

[b-oz4cnfqw8q] .theme-blazing-dark .toolbar-component-wrapper .theme-icon-wrapper:hover,
[b-oz4cnfqw8q] .theme-night .toolbar-component-wrapper .theme-icon-wrapper:hover,
[b-oz4cnfqw8q] .theme-cyborg .toolbar-component-wrapper .theme-icon-wrapper:hover,
[b-oz4cnfqw8q] .theme-solar .toolbar-component-wrapper .theme-icon-wrapper:hover,
[b-oz4cnfqw8q] .theme-superhero .toolbar-component-wrapper .theme-icon-wrapper:hover,
[b-oz4cnfqw8q] .theme-darkly .toolbar-component-wrapper .theme-icon-wrapper:hover,
[b-oz4cnfqw8q] .theme-quartz .toolbar-component-wrapper .theme-icon-wrapper:hover,
[b-oz4cnfqw8q] .theme-vapor .toolbar-component-wrapper .theme-icon-wrapper:hover {
    background-color: rgba(255, 255, 255, 0.1);
}

[b-oz4cnfqw8q] .toolbar-component-wrapper .dxbl-image.theme-icon {
    width: 1.45rem !important;
    height: 1.45rem !important;
    background-color: transparent !important;
    background-image: url("images/icons/line-theme.svg");
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
}

/* 修复 DxSearchBox 文字颜色问题 */
[b-oz4cnfqw8q] .menu-search-box input,
[b-oz4cnfqw8q] .menu-search-box .dxbl-editor input {
    color: #212529 !important;
    background-color: #ffffff !important;
    border: 1px solid #ced4da !important;
}

/* 响应式调整 - 移动端保持适当间距 */
@media (max-width: 768px) {
    .toolbar-logo[b-oz4cnfqw8q] {
        height: 24px;
        max-width: 80px;
    }

    .toolbar-logo-container[b-oz4cnfqw8q] {
        /* 🎯 移动端稍微减少间距但仍保持合适的距离 */
        padding: 0 8px 0 12px;
        margin-right: 6px;
    }

    .toolbar-text-logo[b-oz4cnfqw8q] {
        font-size: 16px;
    }

    [b-oz4cnfqw8q] .toolbar-component-wrapper {
        padding: 0 1px;
    }

        [b-oz4cnfqw8q] .toolbar-component-wrapper .language-button {
            min-width: 35px;
            padding: 3px 6px !important;
        }

        [b-oz4cnfqw8q] .toolbar-component-wrapper .language-text {
            font-size: 12px !important;
        }

        [b-oz4cnfqw8q] .toolbar-component-wrapper .theme-icon-wrapper {
            width: 26px;
            height: 26px;
        }

        [b-oz4cnfqw8q] .toolbar-component-wrapper .dxbl-image.theme-icon {
            width: 0.9rem !important;
            height: 0.9rem !important;
        }
}

@media (max-width: 480px) {
    .toolbar-logo[b-oz4cnfqw8q] {
        height: 20px;
        max-width: 60px;
    }

    .toolbar-logo-container[b-oz4cnfqw8q] {
        /* 🎯 小屏幕进一步调整，但仍保持不贴边 */
        padding: 0 6px 0 10px;
        margin-right: 4px;
    }

    .toolbar-text-logo[b-oz4cnfqw8q] {
        font-size: 14px;
    }
}

/* 修复移动端显示 */
@media (max-width: 1199.98px) {
    [b-oz4cnfqw8q] .toolbar-component-wrapper .themeswitcher-container,
    [b-oz4cnfqw8q] .themeswitcher-container {
        position: fixed !important;
        top: 45px !important;
        right: 5px !important;
        width: 280px !important;
        z-index: 999999 !important;
    }
}

/* 原有样式继续保持... */
[b-oz4cnfqw8q] .navigation-drawer > .dxbl-drawer-panel {
    background-image: linear-gradient(180deg, var(--bs-primary) 0%, var(--bs-black) 150%);
}

/* Fluent 主题：移除 Bootstrap 渐变背景，使用 Fluent 原生样式 */
[b-oz4cnfqw8q] .theme-fluent .navigation-drawer > .dxbl-drawer-panel,
[b-oz4cnfqw8q] .theme-fluent-dark .navigation-drawer > .dxbl-drawer-panel,
[b-oz4cnfqw8q] .theme-dark .navigation-drawer > .dxbl-drawer-panel {
    background-image: none !important;
    background: var(--dxbl-drawer-panel-bg, inherit) !important;
}

[b-oz4cnfqw8q] .dxbl-drawer .dxbl-drawer-content {
    height: 100vh;
    overflow: auto;
}

[b-oz4cnfqw8q] .dxbl-drawer > .dxbl-drawer-panel .dxbl-drawer-header {
    border-bottom: none;
    padding: 0 !important; /* 🎯 完全移除padding */
    margin: 0 !important; /* 🎯 移除margin */
    height: 35px !important; /* 🎯 精确匹配main-toolbar高度 */
    min-height: 35px !important;
    max-height: 35px !important;
    display: flex;
    align-items: center;
    box-sizing: border-box;
    overflow: hidden; /* 🎯 防止内容溢出 */
}

[b-oz4cnfqw8q] .dxbl-drawer-panel .dxbl-drawer-header .navigation-drawer-header {
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    height: 35px;
    padding: 0 24px 0 1rem; /* 🎯 右侧固定 16px（Medium 基准），左侧保持 1rem */
    box-sizing: border-box;
    margin: 0;
}

/* 🎯 header 按钮固定 30×30px（Medium 基准），图标固定 16px，使图标右边缘始终在距面板右 23px */
.menu-button-nav[b-oz4cnfqw8q] {
    width: 30px !important;
    height: 30px !important;
    flex-shrink: 0;
}

[b-oz4cnfqw8q] .menu-button-nav .dxbl-image,
[b-oz4cnfqw8q] .menu-button-nav .icon {
    width: 16px !important;
    height: 16px !important;
}

/* 特别调整用户头像大小并居中，解决太小不对称的问题 */
[b-oz4cnfqw8q] .menu-button-nav .icon-user {
    width: 20px !important;
    height: 20px !important;
    -webkit-mask-size: contain !important;
    mask-size: contain !important;
    mask-position: center !important;
    -webkit-mask-position: center !important;
}

[b-oz4cnfqw8q] .dxbl-drawer > .dxbl-drawer-panel > .dxbl-drawer-body {
    --dxbl-drawer-panel-body-padding-x: 0;
    --dxbl-drawer-panel-body-padding-y: 0rem;
}

[b-oz4cnfqw8q] .dxbl-drawer > .dxbl-drawer-panel .dxbl-drawer-footer {
    --dxbl-drawer-panel-footer-justify-content: center;
    border-top: none;
    padding-bottom: 0rem;
}

[b-oz4cnfqw8q] .content {
    overflow: auto;
    display: flex;
    flex-direction: column;
}

[b-oz4cnfqw8q] .icon {
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    mask-position: center center;
/*    -webkit-mask-mask-position: center center;*/
    width: 1rem;
    height: 1rem;
    background-repeat: no-repeat;
    background-color: var(--dxbl-btn-color);
}

[b-oz4cnfqw8q] .icon-back {
    -webkit-mask-image: url("images/back.svg");
    mask-image: url("images/back.svg");
}

[b-oz4cnfqw8q] .icon-company {
    /* Lucide: building-2（公司大楼，多层窗户更直观） */
    -webkit-mask-image: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 22V4a2 2 0 0 1 2-2h8a2 2 0 0 1 2 2v18Z'/%3E%3Cpath d='M6 12H4a2 2 0 0 0-2 2v6a2 2 0 0 0 2 2h2'/%3E%3Cpath d='M18 9h2a2 2 0 0 1 2 2v9a2 2 0 0 1-2 2h-2'/%3E%3Cpath d='M10 6h4'/%3E%3Cpath d='M10 10h4'/%3E%3Cpath d='M10 14h4'/%3E%3Cpath d='M10 18h4'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 22V4a2 2 0 0 1 2-2h8a2 2 0 0 1 2 2v18Z'/%3E%3Cpath d='M6 12H4a2 2 0 0 0-2 2v6a2 2 0 0 0 2 2h2'/%3E%3Cpath d='M18 9h2a2 2 0 0 1 2 2v9a2 2 0 0 1-2 2h-2'/%3E%3Cpath d='M10 6h4'/%3E%3Cpath d='M10 10h4'/%3E%3Cpath d='M10 14h4'/%3E%3Cpath d='M10 18h4'/%3E%3C/svg%3E");
    background-color: #6366f1 !important;
}

[b-oz4cnfqw8q] .icon-message {
    -webkit-mask-image: url("images/bticons/chat-square-dots-fill.svg");
    mask-image: url("images/bticons/chat-square-dots-fill.svg");
}

/*::deep .icon-message {
    -webkit-mask-image: url("images/Btimage/megaphone.svg");
    mask-image: url("images/Btimage/megaphone.svg");
}*/

[b-oz4cnfqw8q] .icon-close {
    -webkit-mask-image: url("images/close.svg");
    mask-image: url("images/close.svg");
}

[b-oz4cnfqw8q] .icon-menu {
    -webkit-mask-image: url("images/menu.svg");
    mask-image: url("images/menu.svg");
}

/* 导航菜单按钮专用彩色图标（独立 class，不影响 icon / icon-menu） */
[b-oz4cnfqw8q] .menu-nav-icon {
    display: inline-block;
    width: 18px !important;
    height: 18px !important;
    background-color: transparent !important;
    background-image: url("images/icons/line-menu-nav.svg");
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    -webkit-mask-image: none !important;
    mask-image: none !important;
    vertical-align: middle;
}

[b-oz4cnfqw8q] .icon-log-in {
    -webkit-mask-image: url("images/account/log-in.svg");
    mask-image: url("images/account/log-in.svg");
    background-color: #1a8f54 !important;
}

[b-oz4cnfqw8q] .icon-log-out {
    -webkit-mask-image: url("images/account/log-out.svg");
    mask-image: url("images/account/log-out.svg");
}

[b-oz4cnfqw8q] .icon-user {
    /* circle-user-round：外圈头像框 + 圆头 + 肩膀弧线，三层结构与公司 building-2 视觉密度匹配 */
    -webkit-mask-image: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Ccircle cx='12' cy='10' r='3'/%3E%3Cpath d='M6.17 18.31a7 7 0 0 1 11.66 0'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Ccircle cx='12' cy='10' r='3'/%3E%3Cpath d='M6.17 18.31a7 7 0 0 1 11.66 0'/%3E%3C/svg%3E");
    background-color: #6366f1 !important;
}

[b-oz4cnfqw8q] .message-icon {
    color: #6366f1 !important;
}

/* 🌙 暗色主题下公司/用户图标的颜色覆盖见 wwwroot/css/site.css —
 * 这里不能写在 ::deep 作用域里，因为 .theme-dark 类是直接打在 .page 元素自身上，
 * 而 ::deep 编译后会要求 .theme-dark 是带作用域属性元素的"后代"，导致永远不匹配。
 */

[b-oz4cnfqw8q] .docs-icon {
    mask-image: url("images/doc.svg");
    -webkit-mask-image: url("images/doc.svg");
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    background-color: var(--dxbl-btn-color);
}

[b-oz4cnfqw8q] .demos-icon {
    mask-image: url("images/demos.svg");
    -webkit-mask-image: url("images/demos.svg");
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    background-color: var(--dxbl-btn-color);
}

[b-oz4cnfqw8q] .footer-button:hover .demos-icon {
    background-color: var(--dxbl-btn-hover-color);
}

[b-oz4cnfqw8q] .footer-button:hover .docs-icon {
    background-color: var(--dxbl-btn-hover-color);
}

[b-oz4cnfqw8q] .menu-button:hover .icon {
    background-color: var(--dxbl-btn-hover-color);
}

[b-oz4cnfqw8q] .menu-button-nav:hover .icon {
    background-color: var(--dxbl-btn-hover-color);
}

.panel-open .menu-button[b-oz4cnfqw8q] {
    display: inline-flex;
}

.menu-button-nav[b-oz4cnfqw8q] {
    background-image: url("images/close.svg");
    width: 1.875rem;
    height: 1.875rem;
}

.nav-buttons-container[b-oz4cnfqw8q] {
    display: flex;
    gap: 1px;
    padding: 0.1rem 0.1rem;
}

    .nav-buttons-container[b-oz4cnfqw8q]  .menubutton-float-end {
        margin-left: auto;
    }

    .nav-buttons-container[b-oz4cnfqw8q]  .dxbl-btn-icon-only {
        --dxbl-btn-padding-x: 0.75rem;
        --dxbl-btn-padding-y: 0.25rem;
    }

[b-oz4cnfqw8q] .navigation-drawer > .dxbl-drawer-panel {
    display: flex;
}

[b-oz4cnfqw8q] .navigation-drawer.mobile > .dxbl-drawer-panel {
    display: none;
}

[b-oz4cnfqw8q] .navigation-drawer.mobile > .dxbl-drawer-shading {
    display: none;
}

@media (max-width: 768px) {
    [b-oz4cnfqw8q] .navigation-drawer > .dxbl-drawer-panel {
        display: none;
    }

    [b-oz4cnfqw8q] .navigation-drawer.mobile > .dxbl-drawer-panel {
        display: flex;
    }

    [b-oz4cnfqw8q] .navigation-drawer.mobile > .dxbl-drawer-shading {
        display: block;
    }
}

.footer1[b-oz4cnfqw8q] {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    padding: 0.3rem;
    background-color: var(--bs-body-bg);
    border-top: 1px solid var(--bs-border-color); /* 使用Bootstrap的边框颜色变量 */
    position: fixed;
    bottom: 0;
    right: 0;
    left: 250px;
    box-sizing: border-box;
}

.footer-collapsed[b-oz4cnfqw8q] {
    left: 0;
}

.breadcrumb[b-oz4cnfqw8q] {
    background-color: transparent;
    padding: 0;
    margin-bottom: 1rem;
}

.flex-container[b-oz4cnfqw8q] {
    display: flex;
    align-items: center;
}

.app-title-container[b-oz4cnfqw8q] {
    display: flex;
    align-items: center;
}

.app-title-logo[b-oz4cnfqw8q] {
    height: 30px;
    max-width: 100%;
    object-fit: contain;
}

.nav-buttons-container[b-oz4cnfqw8q] {
    display: none !important;
}


/* ==================== 🔧 修复菜单遮罩与工具栏重叠问题 ==================== */

/* 1. 工具栏层级（flex 布局下无需 sticky） */
[b-oz4cnfqw8q] .main-toolbar {
    z-index: 100000 !important;
    pointer-events: auto !important;
    isolation: isolate !important;
}

/* 2. 降低 Drawer 遮罩层级 */
[b-oz4cnfqw8q] .dxbl-drawer-shading {
    z-index: 50 !important; /* 🎯 降低到 50 */
    pointer-events: auto !important;
}

/* 3. Drawer 面板层级 */
[b-oz4cnfqw8q] .dxbl-drawer-panel {
    z-index: 60 !important; /* 🎯 设置为 60 */
}

/* 4. 确保 Drawer 内容区域不阻挡工具栏 */
[b-oz4cnfqw8q] .dxbl-drawer-content {
    position: relative !important;
    z-index: 1 !important;
}

/* 5. 移动端遮罩不覆盖工具栏 */
[b-oz4cnfqw8q] .navigation-drawer.mobile .dxbl-drawer-shading {
    top: 40px !important;
    height: calc(100% - 40px) !important;
    z-index: 50 !important;
}

/* 🔧 修复 Footer 按钮布局 */
.footer-buttons-row[b-oz4cnfqw8q] {
    display: flex;
    gap: 8px;
    margin-bottom: 8px;
    z-index: 101;
    position: relative;
    pointer-events: auto;
}

    /* 🔧 确保按钮可点击 */
    .footer-buttons-row .footer-button[b-oz4cnfqw8q] {
        flex: 0 0 auto;
        pointer-events: auto !important;
        cursor: pointer !important;
    }

/* 🔧 搜索容器独立行 */
.search-container[b-oz4cnfqw8q] {
    margin-top: 8px;
    z-index: 102;
    position: relative;
    pointer-events: auto;
}

/* 🔧 版本信息独立行且不阻挡点击 */
.version-info[b-oz4cnfqw8q] {
    display: block;
    margin-top: 4px;
    pointer-events: none !important;
}

/* 6. 确保工具栏所有元素可点击（不设 position，避免破坏内部布局） */
[b-oz4cnfqw8q] .main-toolbar *,
[b-oz4cnfqw8q] .main-toolbar .dxbl-toolbar-item,
[b-oz4cnfqw8q] .main-toolbar .toolbar-button-container,
[b-oz4cnfqw8q] .main-toolbar .menu-toggle-container,
[b-oz4cnfqw8q] .main-toolbar button,
[b-oz4cnfqw8q] .main-toolbar a,
[b-oz4cnfqw8q] .main-toolbar .dxbl-btn {
    pointer-events: auto !important;
}

/* 7. 强制覆盖任何可能的冲突样式 */
[b-oz4cnfqw8q] body .main-toolbar,
[b-oz4cnfqw8q] html .main-toolbar,
[b-oz4cnfqw8q] .page .main-toolbar {
    z-index: 100000 !important;
    pointer-events: auto !important;
    isolation: isolate !important;
}

/* 8. 确保 Drawer 目标区域不影响层级 */
[b-oz4cnfqw8q] .dxbl-drawer-target {
    position: relative !important;
    z-index: auto !important;
}

/* ==================== 🔧 修复 Drawer Footer 布局问题 ==================== */

/* 1. Footer 容器样式 - 固定在底部但不遮挡内容 */
.drawer-footer-version[b-oz4cnfqw8q] {
    padding: 8px 16px;
    text-align: start;
    width: 100%;
    position: sticky; /* 🔧 改为 sticky 而不是 absolute */
    bottom: 0;
    left: 0;
    background-color: inherit;
    z-index: 100;
    pointer-events: auto
}

/* 2. 按钮行容器 */
.footer-buttons-row[b-oz4cnfqw8q] {
    display: flex;
    gap: 8px;
    margin-bottom: 6px;
    z-index: 101;
    position: relative;
    pointer-events: auto;
}

    /* 3. 确保按钮可点击 */
    .footer-buttons-row .footer-button[b-oz4cnfqw8q] {
        flex: 0 0 auto;
        pointer-events: auto !important;
        cursor: pointer !important;
        z-index: 102;
        position: relative;
    }

/* 4. 搜索容器独立行 */
.search-container[b-oz4cnfqw8q] {
    margin-top: 6px;
    z-index: 103;
    position: relative;
    pointer-events: auto;
}

/* 5. 版本信息独立行且不阻挡点击 */
.version-info[b-oz4cnfqw8q] {
    display: block;
    margin-top: 4px;
    pointer-events: none !important;
    font-size: 0.75rem;
    opacity: 0.8;
}

/* 6. 🔧 关键修复：确保 Drawer Body 有底部边距，避免内容被遮挡 */
[b-oz4cnfqw8q] .dxbl-drawer-body {
    padding-bottom: 150px !important; /* 🔧 增加到 140px，为 Footer 留出空间 */
    overflow-y: auto !important;
    overflow-x: hidden !important;
}

/* 7. 🔧 NavMenu 容器也需要底部边距 */
[b-oz4cnfqw8q] .sidebar-container {
    padding-top: 0 !important;   /* 🎯 干掉 LOGO 与第一个菜单之间的空白 */
    margin-top: 0 !important;
    padding-bottom: 20px !important; /* 额外的底部间距 */
}

/* 🎯 同时清掉 DxTreeView 自身和 ScrollViewer 的顶部内边距 */
[b-oz4cnfqw8q] .sidebar-container .dxbl-treeview,
[b-oz4cnfqw8q] .sidebar-container .theme-responsive-menu,
[b-oz4cnfqw8q] .sidebar-container .dxbl-scroll-viewer,
[b-oz4cnfqw8q] .sidebar-container .dxbl-scroll-viewer-content {
    padding-top: 0 !important;
    margin-top: 0 !important;
    --dxbl-treeview-padding-y: 0 !important;
    --dxbl-treeview-padding-top: 0 !important;
    --dxbl-scroll-viewer-content-padding-y: 0 !important;
}

/* 8. 🔧 搜索框样式优化 */
.search-container .menu-search-box[b-oz4cnfqw8q] {
    width: 100%;
    pointer-events: auto !important;
}

/* 10. 🔧 确保滚动条不被 Footer 遮挡 */
[b-oz4cnfqw8q] .dxbl-drawer-body::-webkit-scrollbar {
    width: 4px !important;
    height: 4px !important;
}

[b-oz4cnfqw8q] .dxbl-drawer-body::-webkit-scrollbar-track {
    background: rgba(255, 255, 255, 0.05) !important;
    border-radius: 2px !important;
    margin-bottom: 140px !important; /* 🔧 滚动条轨道也留出空间 */
}

[b-oz4cnfqw8q] .dxbl-drawer-body::-webkit-scrollbar-thumb {
    background: rgba(255, 255, 255, 0.3) !important;
    border-radius: 2px !important;
    transition: background 0.2s ease !important;
}

    [b-oz4cnfqw8q] .dxbl-drawer-body::-webkit-scrollbar-thumb:hover {
        background: rgba(255, 255, 255, 0.5) !important;
    }

/* ============ 🎯 删除文件中所有旧的刷新按钮样式 ============ */
/* 找到并删除以下这些旧样式：
   - 第 588-632 行左右的旧 .tab-refresh-btn 定义
   - 第 1090-1135 行左右的重复 .tab-refresh-btn 定义
*/

/* ============ 🎯 添加新的刷新按钮样式 - 放在文件末尾 ============ */

/* 刷新按钮外层容器 - 完全消除多余空间 */
.tab-refresh-button[b-oz4cnfqw8q] {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    margin: 0 !important;
    padding: 0 !important;
    flex-shrink: 0 !important;
    width: 16px !important; /* 🎯 减小到 16px */
    height: 16px !important;
    line-height: 1 !important;
}

/* 刷新按钮本体样式 */
.tab-refresh-btn[b-oz4cnfqw8q] {
    width: 16px !important; /* 🎯 减小到 16px */
    height: 16px !important;
    min-width: 16px !important;
    max-width: 16px !important;
    padding: 0 !important;
    margin: 0 !important;
    border-radius: 2px;
    transition: all 0.15s ease-in-out;
    opacity: 0.6;
    color: inherit !important;
    border: none !important;
    outline: none !important;
    background: transparent !important;
    background-color: transparent !important;
    box-shadow: none !important;
    font-size: 11px !important; /* 🎯 减小字体到 11px */
    line-height: 1 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    overflow: hidden !important;
}

    .tab-refresh-btn:hover[b-oz4cnfqw8q] {
        background-color: var(--bs-gray-200, rgba(0,0,0,0.08)) !important;
        opacity: 1;
        transform: scale(1.2); /* 🎯 悬停时放大一点 */
    }

    .tab-refresh-btn:focus[b-oz4cnfqw8q] {
        background: transparent !important;
        outline: none !important;
        box-shadow: none !important;
    }

    .tab-refresh-btn:active[b-oz4cnfqw8q] {
        background-color: var(--bs-gray-300, rgba(0,0,0,0.12)) !important;
        transform: rotate(180deg);
    }

/* 🎯 确保按钮内的文本显示 */
[b-oz4cnfqw8q] .tab-refresh-btn .dxbl-btn-content,
[b-oz4cnfqw8q] .tab-refresh-btn .dxbl-btn-text {
    font-size: 11px !important;
    color: inherit !important;
    line-height: 1 !important;
    padding: 0 !important;
    margin: 0 !important;
}

/* 🎯 强制 DevExpress 按钮不添加额外宽度 */
[b-oz4cnfqw8q] .tab-refresh-btn.dxbl-btn {
    --dxbl-btn-padding-x: 0 !important;
    --dxbl-btn-padding-y: 0 !important;
    --dxbl-btn-gap: 0 !important;
    min-width: 16px !important;
    max-width: 16px !important;
    width: 16px !important;
}

/* 🎯 强制移除所有 DevExpress 可能添加的间距 */
[b-oz4cnfqw8q] .tab-refresh-button,
[b-oz4cnfqw8q] .tab-refresh-button *,
[b-oz4cnfqw8q] .tab-refresh-button .dxbl-btn,
[b-oz4cnfqw8q] .tab-refresh-button .dxbl-btn-content,
[b-oz4cnfqw8q] .tab-refresh-button .dxbl-btn-text,
[b-oz4cnfqw8q] .tab-refresh-button .dxbl-btn-icon {
    margin: 0 !important;
    padding: 0 !important;
    gap: 0 !important;
    width: auto !important;
    min-width: auto !important;
    max-width: none !important;
}

/* 深色主题支持 */
[b-oz4cnfqw8q] .theme-blazing-dark .tab-refresh-btn:hover,
[b-oz4cnfqw8q] .theme-night .tab-refresh-btn:hover,
[b-oz4cnfqw8q] .theme-cyborg .tab-refresh-btn:hover,
[b-oz4cnfqw8q] .theme-solar .tab-refresh-btn:hover,
[b-oz4cnfqw8q] .theme-superhero .tab-refresh-btn:hover,
[b-oz4cnfqw8q] .theme-darkly .tab-refresh-btn:hover,
[b-oz4cnfqw8q] .theme-quartz .tab-refresh-btn:hover,
[b-oz4cnfqw8q] .theme-vapor .tab-refresh-btn:hover,
[b-oz4cnfqw8q] .theme-fluent-dark .tab-refresh-btn:hover,
[b-oz4cnfqw8q] .theme-dark .tab-refresh-btn:hover {
    background-color: var(--bs-gray-100, rgba(255,255,255,0.1)) !important;
}

/* 🎯 移除所有伪元素 */
.tab-refresh-btn[b-oz4cnfqw8q]::before,
.tab-refresh-btn[b-oz4cnfqw8q]::after,
.tab-refresh-button[b-oz4cnfqw8q]::before,
.tab-refresh-button[b-oz4cnfqw8q]::after {
    display: none !important;
    content: none !important;
}

/* ============ 🎯 优化标签头部容器 ============ */

/* 🎯 强制标签页文本容器紧凑 */
.tab-text-container[b-oz4cnfqw8q] {
    padding: 0 !important;
    margin: 0 !important;
    width: 100% !important;
    box-sizing: border-box !important;
    display: flex !important;
    align-items: center !important;
}

/* 🎯 标签头部容器 - 最紧凑布局 */
.tab-header-container[b-oz4cnfqw8q] {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    height: 30px !important;
    padding: 0 2px 0 4px !important; /* 🎯 右边距只有 2px */
    margin: 0 !important;
    position: relative !important;
    width: 100% !important;
    box-sizing: border-box !important;
    gap: 0 !important; /* 🎯 完全去除 gap */
}

/* 🎯 标签内容区域 */
.tab-content[b-oz4cnfqw8q] {
    display: flex !important;
    align-items: center !important;
    flex: 1 !important;
    gap: 4px !important;
    min-width: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
    margin-right: 2px !important; /* 🎯 与刷新按钮保持 2px 间距 */
    box-sizing: border-box !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
}

/* ============ 🎯 覆盖 DevExpress 标签页样式 ============ */

/* 🎯 强制标签页最小内边距 */
[b-oz4cnfqw8q] .dxbl-tabs .dxbl-tab-page {
    padding: 0 1px !important; /* 🎯 最小内边距 */
}

/* 🎯 标签页文本区域 */
[b-oz4cnfqw8q] .dxbl-tab-page-text {
    padding: 0 !important;
    margin: 0 !important;
}

    [b-oz4cnfqw8q] .dxbl-tab-page-text > * {
        padding: 0 !important;
        margin: 0 !important;
    }

/* 🎯 关闭按钮与刷新按钮间距 */
[b-oz4cnfqw8q] .dxbl-tab-close-btn {
    margin: 0 !important;
    padding: 0 2px !important; /* 🎯 最小间距 */
}

/* 🎯 强制所有标签页内元素紧凑 */
[b-oz4cnfqw8q] .dxbl-tab-page-text .tab-text-container,
[b-oz4cnfqw8q] .dxbl-tab-page-text .tab-header-container,
[b-oz4cnfqw8q] .dxbl-tab-page-text .tab-content,
[b-oz4cnfqw8q] .dxbl-tab-page-text .tab-refresh-button {
    box-sizing: border-box !important;
}


/* 🎯 Drawer Header 中的 Logo 固定大小样式 */
.navigation-drawer-header .logo[b-oz4cnfqw8q] {
    height: 32px !important;
    width: auto !important;
    max-width: 150px !important;
    object-fit: contain !important;
    transition: transform 0.2s ease !important;
    margin-left: 5px !important; /* 🎯 向右移动 8px */
    /* filter 由 Razor 内联 style 按主题动态控制：浅色主题 brightness(0) 变黑，深色主题无 filter 保持白色 */
}

    .navigation-drawer-header .logo:hover[b-oz4cnfqw8q] {
        transform: scale(1.05);
    }


/* 🎯 响应式调整 - 移动端 */
@media (max-width: 768px) {
    .navigation-drawer-header .logo[b-oz4cnfqw8q] {
        height: 28px !important;
        max-width: 100px !important;
        margin-left: 6px !important; /* 🎯 移动端向右移动 6px */
    }
}

@media (max-width: 480px) {
    .navigation-drawer-header .logo[b-oz4cnfqw8q] {
        height: 24px !important;
        max-width: 80px !important;
        margin-left: 4px !important; /* 🎯 小屏幕向右移动 4px */
    }
}

/* ==================== 用户下拉菜单样式 ==================== */
/* ===================== 用户下拉菜单 (Google 风格) ===================== */
.udm-card[b-oz4cnfqw8q] {
    background: var(--bs-body-bg, #fff);
    border: 1px solid var(--bs-border-color, #dee2e6);
    border-radius: 16px;
    box-shadow: 0 4px 6px rgba(60,64,67,.1), 0 12px 28px rgba(60,64,67,.15);
    width: 300px;
    overflow: hidden;
    font-family: inherit;
}

/* ---- 头像区 ---- */
.udm-profile[b-oz4cnfqw8q] {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 28px 24px 20px;
    gap: 6px;
}

.udm-avatar[b-oz4cnfqw8q] {
    width: 64px;
    height: 64px;
    border-radius: 50%;
    background: linear-gradient(135deg, #1a73e8, #4285f4);
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 4px;
    box-shadow: 0 2px 10px rgba(66,133,244,.4);
    flex-shrink: 0;
}

.udm-avatar-letter[b-oz4cnfqw8q] {
    font-size: 26px;
    font-weight: 500;
    color: #fff;
    line-height: 1;
    user-select: none;
}

.udm-profile-name[b-oz4cnfqw8q] {
    font-size: 16px;
    font-weight: 600;
    color: var(--bs-body-color);
    text-align: center;
    line-height: 1.3;
}

.udm-profile-email[b-oz4cnfqw8q] {
    font-size: 13px;
    color: var(--bs-secondary-color);
    text-align: center;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    max-width: 100%;
}

/* 管理账户按钮 —— Google 描边胶囊样式 */
.udm-manage-btn[b-oz4cnfqw8q] {
    display: inline-block;
    margin-top: 10px;
    padding: 7px 20px;
    font-size: 13px;
    font-weight: 500;
    color: var(--bs-primary, #1a73e8);
    border: 1px solid var(--bs-border-color);
    border-radius: 20px;
    text-decoration: none;
    background: transparent;
    cursor: pointer;
    transition: background 0.15s, box-shadow 0.15s;
    white-space: nowrap;
}

    .udm-manage-btn:hover[b-oz4cnfqw8q] {
        background: var(--bs-primary-bg-subtle, rgba(26,115,232,.06));
        box-shadow: 0 1px 3px rgba(60,64,67,.15);
        text-decoration: none;
        color: var(--bs-primary, #1a73e8);
    }

/* ---- 分隔线 ---- */
.udm-divider[b-oz4cnfqw8q] {
    height: 1px;
    background: var(--bs-border-color);
    margin: 0;
}

/* ---- 公司信息行 ---- */
.udm-company-row[b-oz4cnfqw8q] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 12px 20px;
    background: var(--bs-tertiary-bg);
}

.udm-company-text[b-oz4cnfqw8q] {
    display: flex;
    flex-direction: column;
    min-width: 0;
    flex: 1;
}

.udm-company-name[b-oz4cnfqw8q] {
    font-size: 12.5px;
    font-weight: 600;
    color: var(--bs-body-color);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    line-height: 1.4;
}

.udm-company-code[b-oz4cnfqw8q] {
    font-size: 11px;
    color: var(--bs-secondary-color);
    line-height: 1.4;
    letter-spacing: 0.03em;
}

/* ---- 登出区 ---- */
.udm-signout-form[b-oz4cnfqw8q] {
    margin: 0;
    padding: 0;
}

.udm-signout-btn[b-oz4cnfqw8q] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    width: 100%;
    padding: 12px 20px;
    font-size: 13.5px;
    font-weight: 500;
    color: var(--bs-body-color);
    background: transparent;
    border: none;
    cursor: pointer;
    transition: background 0.15s;
}

    .udm-signout-btn:hover[b-oz4cnfqw8q] {
        background: var(--bs-tertiary-bg);
    }

    .udm-signout-btn svg[b-oz4cnfqw8q] {
        color: var(--bs-secondary-color);
        flex-shrink: 0;
    }

/* ---- 深色主题覆盖 ---- */
[b-oz4cnfqw8q] .theme-blazing-dark .udm-card,
[b-oz4cnfqw8q] .theme-night .udm-card,
[b-oz4cnfqw8q] .theme-cyborg .udm-card,
[b-oz4cnfqw8q] .theme-solar .udm-card,
[b-oz4cnfqw8q] .theme-superhero .udm-card,
[b-oz4cnfqw8q] .theme-darkly .udm-card,
[b-oz4cnfqw8q] .theme-quartz .udm-card,
[b-oz4cnfqw8q] .theme-vapor .udm-card,
[b-oz4cnfqw8q] .theme-fluent-dark .udm-card,
[b-oz4cnfqw8q] .theme-dark .udm-card {
    box-shadow: 0 4px 8px rgba(0,0,0,.4), 0 12px 28px rgba(0,0,0,.5);
}

/* 深色主题：公司信息行 背景 + 文字 强制可见 */
[b-oz4cnfqw8q] .theme-blazing-dark .udm-company-row,
[b-oz4cnfqw8q] .theme-night .udm-company-row,
[b-oz4cnfqw8q] .theme-cyborg .udm-company-row,
[b-oz4cnfqw8q] .theme-solar .udm-company-row,
[b-oz4cnfqw8q] .theme-superhero .udm-company-row,
[b-oz4cnfqw8q] .theme-darkly .udm-company-row,
[b-oz4cnfqw8q] .theme-quartz .udm-company-row,
[b-oz4cnfqw8q] .theme-vapor .udm-company-row,
[b-oz4cnfqw8q] .theme-fluent-dark .udm-company-row,
[b-oz4cnfqw8q] .theme-dark .udm-company-row {
    background: rgba(255, 255, 255, 0.06) !important;
}

[b-oz4cnfqw8q] .theme-blazing-dark .udm-company-name,
[b-oz4cnfqw8q] .theme-night .udm-company-name,
[b-oz4cnfqw8q] .theme-cyborg .udm-company-name,
[b-oz4cnfqw8q] .theme-solar .udm-company-name,
[b-oz4cnfqw8q] .theme-superhero .udm-company-name,
[b-oz4cnfqw8q] .theme-darkly .udm-company-name,
[b-oz4cnfqw8q] .theme-quartz .udm-company-name,
[b-oz4cnfqw8q] .theme-vapor .udm-company-name,
[b-oz4cnfqw8q] .theme-fluent-dark .udm-company-name,
[b-oz4cnfqw8q] .theme-dark .udm-company-name {
    color: rgba(255, 255, 255, 0.9) !important;
}

[b-oz4cnfqw8q] .theme-blazing-dark .udm-company-code,
[b-oz4cnfqw8q] .theme-night .udm-company-code,
[b-oz4cnfqw8q] .theme-cyborg .udm-company-code,
[b-oz4cnfqw8q] .theme-solar .udm-company-code,
[b-oz4cnfqw8q] .theme-superhero .udm-company-code,
[b-oz4cnfqw8q] .theme-darkly .udm-company-code,
[b-oz4cnfqw8q] .theme-quartz .udm-company-code,
[b-oz4cnfqw8q] .theme-vapor .udm-company-code,
[b-oz4cnfqw8q] .theme-fluent-dark .udm-company-code,
[b-oz4cnfqw8q] .theme-dark .udm-company-code {
    color: rgba(255, 255, 255, 0.55) !important;
}

/* 深色主题：profile 文字 */
[b-oz4cnfqw8q] .theme-blazing-dark .udm-profile-name,
[b-oz4cnfqw8q] .theme-night .udm-profile-name,
[b-oz4cnfqw8q] .theme-cyborg .udm-profile-name,
[b-oz4cnfqw8q] .theme-solar .udm-profile-name,
[b-oz4cnfqw8q] .theme-superhero .udm-profile-name,
[b-oz4cnfqw8q] .theme-darkly .udm-profile-name,
[b-oz4cnfqw8q] .theme-quartz .udm-profile-name,
[b-oz4cnfqw8q] .theme-vapor .udm-profile-name,
[b-oz4cnfqw8q] .theme-fluent-dark .udm-profile-name,
[b-oz4cnfqw8q] .theme-dark .udm-profile-name {
    color: rgba(255, 255, 255, 0.9) !important;
}

[b-oz4cnfqw8q] .theme-blazing-dark .udm-profile-email,
[b-oz4cnfqw8q] .theme-night .udm-profile-email,
[b-oz4cnfqw8q] .theme-cyborg .udm-profile-email,
[b-oz4cnfqw8q] .theme-solar .udm-profile-email,
[b-oz4cnfqw8q] .theme-superhero .udm-profile-email,
[b-oz4cnfqw8q] .theme-darkly .udm-profile-email,
[b-oz4cnfqw8q] .theme-quartz .udm-profile-email,
[b-oz4cnfqw8q] .theme-vapor .udm-profile-email,
[b-oz4cnfqw8q] .theme-fluent-dark .udm-profile-email,
[b-oz4cnfqw8q] .theme-dark .udm-profile-email {
    color: rgba(255, 255, 255, 0.55) !important;
}

/* 深色主题：登出按钮文字 */
[b-oz4cnfqw8q] .theme-blazing-dark .udm-signout-btn,
[b-oz4cnfqw8q] .theme-night .udm-signout-btn,
[b-oz4cnfqw8q] .theme-cyborg .udm-signout-btn,
[b-oz4cnfqw8q] .theme-solar .udm-signout-btn,
[b-oz4cnfqw8q] .theme-superhero .udm-signout-btn,
[b-oz4cnfqw8q] .theme-darkly .udm-signout-btn,
[b-oz4cnfqw8q] .theme-quartz .udm-signout-btn,
[b-oz4cnfqw8q] .theme-vapor .udm-signout-btn,
[b-oz4cnfqw8q] .theme-fluent-dark .udm-signout-btn,
[b-oz4cnfqw8q] .theme-dark .udm-signout-btn {
    color: rgba(255, 255, 255, 0.85) !important;
}

    [b-oz4cnfqw8q] .theme-blazing-dark .udm-signout-btn svg,
    [b-oz4cnfqw8q] .theme-night .udm-signout-btn svg,
    [b-oz4cnfqw8q] .theme-cyborg .udm-signout-btn svg,
    [b-oz4cnfqw8q] .theme-solar .udm-signout-btn svg,
    [b-oz4cnfqw8q] .theme-superhero .udm-signout-btn svg,
    [b-oz4cnfqw8q] .theme-darkly .udm-signout-btn svg,
    [b-oz4cnfqw8q] .theme-quartz .udm-signout-btn svg,
    [b-oz4cnfqw8q] .theme-vapor .udm-signout-btn svg,
    [b-oz4cnfqw8q] .theme-fluent-dark .udm-signout-btn svg,
[b-oz4cnfqw8q] .theme-dark .udm-signout-btn svg {
        color: rgba(255, 255, 255, 0.55) !important;
    }

[b-oz4cnfqw8q] .theme-blazing-dark .udm-manage-btn:hover,
[b-oz4cnfqw8q] .theme-night .udm-manage-btn:hover,
[b-oz4cnfqw8q] .theme-cyborg .udm-manage-btn:hover,
[b-oz4cnfqw8q] .theme-solar .udm-manage-btn:hover,
[b-oz4cnfqw8q] .theme-superhero .udm-manage-btn:hover,
[b-oz4cnfqw8q] .theme-darkly .udm-manage-btn:hover,
[b-oz4cnfqw8q] .theme-quartz .udm-manage-btn:hover,
[b-oz4cnfqw8q] .theme-vapor .udm-manage-btn:hover,
[b-oz4cnfqw8q] .theme-fluent-dark .udm-manage-btn:hover,
[b-oz4cnfqw8q] .theme-dark .udm-manage-btn:hover {
    background: rgba(255,255,255,.06) !important;
    box-shadow: 0 1px 3px rgba(0,0,0,.3);
}

[b-oz4cnfqw8q] .theme-blazing-dark .udm-signout-btn:hover,
[b-oz4cnfqw8q] .theme-night .udm-signout-btn:hover,
[b-oz4cnfqw8q] .theme-cyborg .udm-signout-btn:hover,
[b-oz4cnfqw8q] .theme-solar .udm-signout-btn:hover,
[b-oz4cnfqw8q] .theme-superhero .udm-signout-btn:hover,
[b-oz4cnfqw8q] .theme-darkly .udm-signout-btn:hover,
[b-oz4cnfqw8q] .theme-quartz .udm-signout-btn:hover,
[b-oz4cnfqw8q] .theme-vapor .udm-signout-btn:hover,
[b-oz4cnfqw8q] .theme-fluent-dark .udm-signout-btn:hover,
[b-oz4cnfqw8q] .theme-dark .udm-signout-btn:hover {
    background: rgba(255,255,255,.06) !important;
}

/* 响应式 */
@media (max-width: 480px) {
    .udm-card[b-oz4cnfqw8q] { width: 260px; }
    .udm-avatar[b-oz4cnfqw8q] { width: 54px; height: 54px; }
    .udm-avatar-letter[b-oz4cnfqw8q] { font-size: 22px; }
}

/* ---- 以下保留旧类，兼容其他地方可能的引用 ---- */
.user-menu-separator[b-oz4cnfqw8q] { height: 1px; background: var(--bs-border-color); margin: 4px 0; }


/* 头部区域 */
.user-menu-header[b-oz4cnfqw8q] {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 18px 16px 16px;
    background: linear-gradient(135deg, var(--bs-primary-bg-subtle, #e7f1ff) 0%, var(--bs-body-bg) 100%);
    border-bottom: 1px solid var(--bs-border-color);
}

.user-avatar[b-oz4cnfqw8q] {
    width: 44px;
    height: 44px;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--bs-primary, #0d6efd), #6ea8fe);
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    box-shadow: 0 3px 10px rgba(13, 110, 253, 0.35);
}

    .user-avatar svg[b-oz4cnfqw8q] {
        width: 22px;
        height: 22px;
    }

.user-info[b-oz4cnfqw8q] {
    flex: 1;
    min-width: 0;
}

.user-name[b-oz4cnfqw8q] {
    font-size: 14px;
    font-weight: 600;
    color: var(--bs-body-color);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    margin-bottom: 3px;
    line-height: 1.3;
}

.user-role[b-oz4cnfqw8q] {
    display: inline-block;
    font-size: 11px;
    font-weight: 500;
    color: var(--bs-primary, #0d6efd);
    background: var(--bs-primary-bg-subtle, #e7f1ff);
    border: 1px solid var(--bs-primary-border-subtle, #9ec5fe);
    border-radius: 20px;
    padding: 1px 8px;
    line-height: 1.6;
}

/* 菜单主体 */
.user-menu-body[b-oz4cnfqw8q] {
    padding: 6px 0;
}

/* 菜单项 */
.user-menu-item[b-oz4cnfqw8q] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 16px;
    color: var(--bs-body-color);
    text-decoration: none;
    cursor: pointer;
    transition: background 0.15s ease, color 0.15s ease;
    border: none;
    background: transparent;
    width: 100%;
    text-align: left;
    font-size: 13.5px;
}

    .user-menu-item:hover[b-oz4cnfqw8q] {
        background-color: var(--bs-primary-bg-subtle, #e7f1ff);
        color: var(--bs-primary, #0d6efd);
        text-decoration: none;
    }

    .user-menu-item:active[b-oz4cnfqw8q] {
        opacity: 0.8;
    }

/* 菜单图标 */
.user-menu-icon[b-oz4cnfqw8q] {
    width: 18px;
    height: 18px;
    flex-shrink: 0;
    color: var(--bs-secondary-color);
    transition: color 0.15s ease;
}

.user-menu-item:hover .user-menu-icon[b-oz4cnfqw8q] {
    color: var(--bs-primary, #0d6efd);
}

/* 箭头图标 */
.user-menu-arrow[b-oz4cnfqw8q] {
    margin-left: auto;
    opacity: 0;
    transform: translateX(-6px);
    transition: all 0.2s ease;
    color: var(--bs-primary, #0d6efd);
    width: 14px !important;
    height: 14px !important;
}

.user-menu-item:hover .user-menu-arrow[b-oz4cnfqw8q] {
    opacity: 1;
    transform: translateX(0);
}

/* 分隔线 */
.user-menu-separator[b-oz4cnfqw8q] {
    height: 1px;
    background-color: var(--bs-border-color);
    margin: 4px 0;
}

/* 公司信息块 */
.user-menu-company[b-oz4cnfqw8q] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 16px;
    background: var(--bs-tertiary-bg, #f8f9fa);
    border-top: 1px solid var(--bs-border-color);
    border-bottom: 1px solid var(--bs-border-color);
}

.user-menu-company-icon[b-oz4cnfqw8q] {
    color: var(--bs-secondary-color);
    flex-shrink: 0;
    opacity: 0.65;
}

.user-menu-company-info[b-oz4cnfqw8q] {
    display: flex;
    flex-direction: column;
    min-width: 0;
    flex: 1;
}

.user-menu-company-name[b-oz4cnfqw8q] {
    font-size: 12px;
    font-weight: 600;
    color: var(--bs-body-color);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    line-height: 1.5;
}

.user-menu-company-code[b-oz4cnfqw8q] {
    font-size: 11px;
    color: var(--bs-secondary-color);
    letter-spacing: 0.04em;
    line-height: 1.4;
}

/* 表单容器 */
.user-menu-form[b-oz4cnfqw8q] {
    margin: 0;
    padding: 0;
}

/* 登出按钮 */
.user-menu-logout[b-oz4cnfqw8q] {
    color: #dc3545 !important;
    padding-top: 10px;
    padding-bottom: 10px;
}

    .user-menu-logout:hover[b-oz4cnfqw8q] {
        background-color: rgba(220, 53, 69, 0.07) !important;
        color: #c82333 !important;
    }

    .user-menu-logout .user-menu-icon[b-oz4cnfqw8q] {
        color: #dc3545;
    }

    .user-menu-logout:hover .user-menu-icon[b-oz4cnfqw8q] {
        color: #c82333;
    }

/* 深色主题适配 */
@media (prefers-color-scheme: dark) {
    .user-dropdown-menu[b-oz4cnfqw8q] {
        box-shadow: 0 8px 24px rgba(0, 0, 0, 0.4);
    }

    .user-menu-header[b-oz4cnfqw8q] {
        background: linear-gradient(135deg, rgba(13, 110, 253, 0.15) 0%, rgba(108, 117, 125, 0.1) 100%);
    }

    .user-avatar[b-oz4cnfqw8q] {
        box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
    }
}

/* 响应式设计 */
@media (max-width: 768px) {
    .user-dropdown-menu[b-oz4cnfqw8q] {
        min-width: 200px;
    }

    .user-menu-header[b-oz4cnfqw8q] {
        padding: 12px;
    }

    .user-avatar[b-oz4cnfqw8q] {
        width: 40px;
        height: 40px;
    }

        .user-avatar svg[b-oz4cnfqw8q] {
            width: 24px;
            height: 24px;
        }

    .user-name[b-oz4cnfqw8q] {
        font-size: 14px;
    }

    .user-menu-item[b-oz4cnfqw8q] {
        padding: 10px 12px;
        font-size: 13px;
    }
}

/* =============================================================
   🚑 Tailwind CSS 冲突修复补丁
   请添加到 MainLayout.razor.css 的最末尾
   ============================================================= */

/* 1. 修复图标布局：Tailwind 默认把图片设为 block，导致图标强行换行或撑破布局 */
[b-oz4cnfqw8q] .main-toolbar img,
[b-oz4cnfqw8q] .main-toolbar svg,
[b-oz4cnfqw8q] .main-toolbar .icon {
    display: inline-block !important; /* 强制改回行内块 */
    vertical-align: middle !important;
}

/* 2. 修复对齐：确保工具栏内部列表占满宽度（右对齐依赖此条件） */
[b-oz4cnfqw8q] .main-toolbar .dxbl-toolbar-items,
[b-oz4cnfqw8q] .main-toolbar > div > ul,
[b-oz4cnfqw8q] .main-toolbar > ul {
    width: 100% !important;
    display: flex !important;
    align-items: center !important;
    padding: 0 !important;
    margin: 0 !important;
}

/* =============================================================
   🚑 [FINAL FIX] Tailwind CSS 冲突终极修复补丁
   ============================================================= */

/* 1. [通用修复] 修复图标布局
   Tailwind 把 img 设为 block，导致图标强行换行。
*/
[b-oz4cnfqw8q] .main-toolbar img,
[b-oz4cnfqw8q] .main-toolbar svg,
[b-oz4cnfqw8q] .main-toolbar .icon {
    display: inline-block !important; /* 强制改回行内块 */
    vertical-align: middle !important;
}

/* 2. [通用修复] 修复所有工具栏按钮消失的问题
   Tailwind 把按钮边框去掉了，这里统一加回来 1px 透明边框以占位。
*/
[b-oz4cnfqw8q] .main-toolbar button,
[b-oz4cnfqw8q] .main-toolbar .dxbl-btn {
    border-width: 1px !important;
    border-style: solid !important;
    border-color: transparent;
    background-color: transparent;
    box-sizing: border-box !important;
    outline: none !important;
}

/* 
   3. [特例修复] 强制干掉语言切换器的边框 (权重升级版)
   ⚠️ 关键改动：加了 .main-toolbar 前缀，权重变为 (3个类)，
   绝对压制上面的 (2个类) 通用样式。
*/
[b-oz4cnfqw8q] .main-toolbar .language-switcher button,
[b-oz4cnfqw8q] .main-toolbar .language-switcher .dxbl-btn,
[b-oz4cnfqw8q] .main-toolbar .language-switcher .dxbl-btn-content {
    border: none !important;           /* 彻底消灭边框 */
    border-width: 0 !important;
    border-style: none !important;     /* 覆盖上面的 solid */
    background: transparent !important;
    box-shadow: none !important;
    outline: none !important;
    padding: 0 4px !important;         /* 保持紧凑 */
}

/* 4. [特例交互] 去除点击时的黑框/Focus Ring */
[b-oz4cnfqw8q] .main-toolbar .language-switcher .dxbl-btn:focus,
[b-oz4cnfqw8q] .main-toolbar .language-switcher .dxbl-btn:active,
[b-oz4cnfqw8q] .main-toolbar .language-switcher .dxbl-btn:focus-visible {
    outline: none !important;
    box-shadow: none !important;
    border: none !important;
}

/* 5. [特例悬停] 鼠标悬停时才显示一点点头背景（可选） */
[b-oz4cnfqw8q] .main-toolbar .language-switcher .dxbl-btn:hover {
    background-color: rgba(0, 0, 0, 0.05) !important;
    border-radius: 4px;
}
/* /Components/Layout/NavMenu.razor.rz.scp.css */
#sidebar[b-e44s1h306l] {
    min-width: 250px; /* 固定与 Drawer PanelWidth="250px" 一致，不随 size rem 变化 */
    max-width: 250px;
    width: 250px;
    transition: transform 0.1s ease-out;
    height: 100%;
    max-height: 100%;
    display: block;
    background: inherit;
}

.logo[b-e44s1h306l] {
    text-align: center;
}

[b-e44s1h306l] .menu.display-mobile {
    margin-bottom: 2rem;
}

[b-e44s1h306l] .menu.display-iam {
    margin-bottom: 2rem;
}

[b-e44s1h306l] .menu {
    background-color: inherit;
}

    [b-e44s1h306l] .menu .dxbl-menu-item-list {
        gap: 0.5rem;
    }

[b-e44s1h306l] .menu-item {
    color: var(--dxbl-menu-item-color, var(--bs-white));
}

[b-e44s1h306l] .icon {
    width: 1rem;
    height: 1rem;
    background-position: center;
    background-repeat: no-repeat;
    margin-left: 0.5rem;
}

[b-e44s1h306l] .home-icon {
    background-image: url("images/home.svg");
}

[b-e44s1h306l] .weather-icon {
    background-image: url("images/weather.svg");
}

[b-e44s1h306l] .counter-icon {
    background-image: url("images/counter.svg");
}

[b-e44s1h306l] .settings-icon {
    background-image: url("images/account/settings.svg");
}

[b-e44s1h306l] .log-in-icon {
    background-image: url("images/account/log-in.svg");
}

[b-e44s1h306l] .log-out-icon {
    background-image: url("images/account/log-out.svg");
}

[b-e44s1h306l] .user-icon {
    background-image: url("images/account/user.svg");
}

@media (max-width: 768px) {
    #sidebar[b-e44s1h306l] {
        min-width: inherit;
        max-width: inherit;
        display: block;
    }

    .logo[b-e44s1h306l] {
        text-align: inherit;
    }
}

/*增加自定义CSS变量*/
/* /Components/Pages/Counter.razor.rz.scp.css */
.counter-block[b-mvy78sevzz] {
    display: flex;
    padding: 2.5rem 1.5rem 1.5rem 1.5rem;
    flex-direction: column;
    border-radius: 1rem;
    gap: 1.5rem;
    justify-content: center;
    align-items: center;
    width: 16.875rem;
    height: 17rem;
    position: relative;
}

    .counter-block .counter-content[b-mvy78sevzz] {
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 0.5rem;
    }

    .counter-block .counter-count[b-mvy78sevzz] {
        font-size: 7.5rem;
        font-weight: 400;
        line-height: 7.75rem;
    }

    .counter-block .counter-block-back[b-mvy78sevzz] {
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        background: var(--bs-body-color);
        opacity: 0.05;
        border-radius: 1rem;
        z-index: -2;
    }
/* /Components/Pages/Frame/Equipment.razor.rz.scp.css */
[b-6sfti9jwo1] .grid-cell-align-center {
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: -4px;
    margin-bottom: -4px;
}

[b-6sfti9jwo1] .grid-icon {
    display: inline-block;
    width: 12px;
    height: 12px;
    min-width: 12px;
    min-height: 12px;
    background-size: contain;
    mask-repeat: no-repeat;
    -webkit-mask-repeat: no-repeat;
    background-position: center center;
    background-color: currentColor;
    vertical-align: middle;
}

[b-6sfti9jwo1] .grid-icon-delete {
    -webkit-mask-image: url("../images/icons/delete.svg");
    mask-image: url("../images/icons/delete.svg");
}

[b-6sfti9jwo1] .grid-toolbar-new,
[b-6sfti9jwo1] .grid-toolbar-delete,
[b-6sfti9jwo1] .grid-toolbar-save,
[b-6sfti9jwo1] .grid-toolbar-cancel {
    background-size: contain;
    mask-repeat: no-repeat;
    -webkit-mask-repeat: no-repeat;
    background-position: center center;
    background-color: currentColor;
    height: 15px;
    width: 15px;
    opacity: 0.7;
}

[b-6sfti9jwo1] .grid-toolbar-new {
    -webkit-mask-image: url("images/icons/new.svg");
    mask-image: url("images/icons/new.svg");
}

[b-6sfti9jwo1] .grid-toolbar-save {
    -webkit-mask-image: url("images/icons/save.svg");
    mask-image: url("images/icons/save.svg");
}

[b-6sfti9jwo1] .grid-toolbar-cancel {
    -webkit-mask-image: url("images/icons/undo.svg");
    mask-image: url("images/icons/undo.svg");
}

[b-6sfti9jwo1] .grid-modified-cell {
    background-color: rgba(var(--bs-primary-rgb), 0.15) !important;
}

[b-6sfti9jwo1] .grid-disabled-button {
    pointer-events: none;
}
/* /Components/Pages/Frame/ReportDataSource.razor.rz.scp.css */
[b-vqns6fa93v] .grid-cell-align-center {
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: -4px;
    margin-bottom: -4px;
}

[b-vqns6fa93v] .grid-icon {
    display: inline-block;
    width: 12px;
    height: 12px;
    min-width: 12px;
    min-height: 12px;
    background-size: contain;
    mask-repeat: no-repeat;
    -webkit-mask-repeat: no-repeat;
    background-position: center center;
    background-color: currentColor;
    vertical-align: middle;
}

[b-vqns6fa93v] .grid-icon-delete {
    -webkit-mask-image: url("../images/icons/delete.svg");
    mask-image: url("../images/icons/delete.svg");
}

[b-vqns6fa93v] .grid-toolbar-new,
[b-vqns6fa93v] .grid-toolbar-delete,
[b-vqns6fa93v] .grid-toolbar-save,
[b-vqns6fa93v] .grid-toolbar-cancel {
    background-size: contain;
    mask-repeat: no-repeat;
    -webkit-mask-repeat: no-repeat;
    background-position: center center;
    background-color: currentColor;
    height: 15px;
    width: 15px;
    opacity: 0.7;
}

[b-vqns6fa93v] .grid-toolbar-new {
    -webkit-mask-image: url("images/icons/new.svg");
    mask-image: url("images/icons/new.svg");
}

[b-vqns6fa93v] .grid-toolbar-save {
    -webkit-mask-image: url("images/icons/save.svg");
    mask-image: url("images/icons/save.svg");
}

[b-vqns6fa93v] .grid-toolbar-cancel {
    -webkit-mask-image: url("images/icons/undo.svg");
    mask-image: url("images/icons/undo.svg");
}

[b-vqns6fa93v] .grid-modified-cell {
    background-color: rgba(var(--bs-primary-rgb), 0.15) !important;
}

[b-vqns6fa93v] .grid-disabled-button {
    pointer-events: none;
}
/* /Components/Pages/Index.razor.rz.scp.css */
[b-s7u0dw7n1k] .welcome-gridlayout {
    margin: auto;
    width: auto;
    height: auto;
}

[b-s7u0dw7n1k] .welcome-gridlayout .dxbl-gridlayout-root {
    align-content: center;
    justify-content: center;
}

[b-s7u0dw7n1k] .title {
    text-align: center;
}

[b-s7u0dw7n1k] .welcome-cards {
    display: flex;
    flex-wrap: wrap;
    gap: 1.5rem;
    justify-content: center;
}

[b-s7u0dw7n1k] .welcome-card {
    width: 26.25rem;
    height: 15rem;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    box-shadow: 0px 4px 6px -1px rgba(0, 0, 0, 0.1), 0px 2px 4px -2px rgba(0, 0, 0, 0.1);
    transition: box-shadow 0.2s;
    border-radius: 1rem;
    color: var(--bs-link-color-rgb);
    gap: 1.5rem;
    text-decoration: none;
    position: relative;
}

    [b-s7u0dw7n1k] .welcome-card:hover {
        box-shadow: 0px 20px 25px -5px rgba(0, 0, 0, 0.1), 0px 8px 10px -6px rgba(0, 0, 0, 0.1);
    }

    [b-s7u0dw7n1k] .welcome-card .welcome-card-img {
        width: 6.5rem;
        height: 6.5rem;
    }

    [b-s7u0dw7n1k] .welcome-card .welcome-card-text {
        font-size: 1.75rem;
        font-weight: 600;
        letter-spacing: 0em;
        text-align: center;
        text-decoration: unset;
    }

    [b-s7u0dw7n1k] .icon-fill {
        fill: var(--bs-primary);
    }

    [b-s7u0dw7n1k] .welcome-card .welcome-card-back {
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        background: var(--bs-body-color);
        opacity: 0.05;
        border-radius: 1rem;
        z-index: -2;
    }
/* /Components/Pages/Index1.razor.rz.scp.css */
[b-k0drht45pq] .welcome-gridlayout {
    margin: auto;
    width: auto;
    height: auto;
}

[b-k0drht45pq] .welcome-gridlayout .dxbl-gridlayout-root {
    align-content: center;
    justify-content: center;
}

[b-k0drht45pq] .title {
    text-align: center;
}

[b-k0drht45pq] .welcome-cards {
    display: flex;
    flex-wrap: wrap;
    gap: 1.5rem;
    justify-content: center;
}

[b-k0drht45pq] .welcome-card {
    width: 26.25rem;
    height: 15rem;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    box-shadow: 0px 4px 6px -1px rgba(0, 0, 0, 0.1), 0px 2px 4px -2px rgba(0, 0, 0, 0.1);
    transition: box-shadow 0.2s;
    border-radius: 1rem;
    color: var(--bs-link-color-rgb);
    gap: 1.5rem;
    text-decoration: none;
    position: relative;
}

    [b-k0drht45pq] .welcome-card:hover {
        box-shadow: 0px 20px 25px -5px rgba(0, 0, 0, 0.1), 0px 8px 10px -6px rgba(0, 0, 0, 0.1);
    }

    [b-k0drht45pq] .welcome-card .welcome-card-img {
        width: 6.5rem;
        height: 6.5rem;
    }

    [b-k0drht45pq] .welcome-card .welcome-card-text {
        font-size: 1.75rem;
        font-weight: 600;
        letter-spacing: 0em;
        text-align: center;
        text-decoration: unset;
    }

    [b-k0drht45pq] .icon-fill {
        fill: var(--bs-primary);
    }

    [b-k0drht45pq] .welcome-card .welcome-card-back {
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        background: var(--bs-body-color);
        opacity: 0.05;
        border-radius: 1rem;
        z-index: -2;
    }
/* /Components/Pages/Inspection/CheckControl.razor.rz.scp.css */
[b-aj4a07mct9] .dxbl-stack-layout {
    height: 100% !important;
}

    [b-aj4a07mct9] .dxbl-stack-layout > div {
        height: 100% !important;
        display: flex !important;
    }

[b-aj4a07mct9] .dxbl-stack-layout-item {
    height: 100% !important;
}

.stacklayout-item[b-aj4a07mct9] {
    font-size: 1.2em;
    font-weight: 500;
    text-align: center;
    padding: 0.5rem;
    position: relative;
    z-index: 0;
    display: block;
    width: 100%;
    height: 100%;
    box-sizing: border-box;
}

    .stacklayout-item[b-aj4a07mct9]:before {
        content: " ";
        position: absolute;
        z-index: -1;
        width: 100%;
        height: 100%;
        left: 0;
        top: 0;
        opacity: 0.4;
    }

    .stacklayout-item > div[b-aj4a07mct9] {
        position: relative;
        z-index: 1;
        width: 100%;
        height: 100%;
        overflow: auto;
    }

.stacklayout-header[b-aj4a07mct9]:before {
    background-color: var(--bs-red);
}

.stacklayout-content[b-aj4a07mct9]:before {
    background-color: var(--bs-yellow);
}

.stacklayout-footer[b-aj4a07mct9]:before {
    background-color: var(--bs-blue);
}

@media (max-width: 575.98px) {
    .stacklayout-item[b-aj4a07mct9] {
        font-size: 0.9em;
    }
}
[b-aj4a07mct9] .info-label {
    color: #666;
    font-size: 15px;
}

[b-aj4a07mct9] .info-value {
    color: #333;
    font-size: 12px;
    font-weight: 500;
}

[b-aj4a07mct9] .section-title-blue {
    color: #1890ff;
    font-size: 12px;
    font-weight: 600;
    margin-bottom: 8px;
}

[b-aj4a07mct9] .card-white {
    background: white;
    border-radius: 4px;
    padding: 12px;
    margin-bottom: 12px;
    border: 1px solid #e8e8e8;
    box-shadow: 0 1px 2px rgba(0,0,0,0.03);
}

[b-aj4a07mct9] .side-panel {
    background: #f5f7fa;
    padding: 12px;
    height: 100%;
    overflow-y: auto;
}

[b-aj4a07mct9] .center-panel {
    background: #ffffff;
    height: 100%;
    display: flex;
    flex-direction: column;
}

[b-aj4a07mct9] .section-title-blue {
    color: #1890ff;
    font-size: 15px;
    font-weight: 600;
    margin-bottom: 8px;
    padding-bottom: 6px;
    border-bottom: 1px dashed #d9d9d9;
}

/* 弹出窗体样式 */
.popup-overlay[b-aj4a07mct9] {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 9999;
    animation: fadeIn 0.2s ease-out;
}

.popup-content[b-aj4a07mct9] {
    background: white;
    border-radius: 12px;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);
    animation: slideUp 0.3s ease-out;
    max-width: 90%;
}

.popup-header[b-aj4a07mct9] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 16px;
    border-bottom: 1px solid #e8e8e8;
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
}

.popup-title[b-aj4a07mct9] {
    margin: 0;
    color: white;
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 15px;
}

.popup-close-btn[b-aj4a07mct9] {
    background: transparent;
    border: none;
    color: white;
    font-size: 24px;
    cursor: pointer;
    padding: 0;
    line-height: 1;
    transition: transform 0.2s;
}

    .popup-close-btn:hover[b-aj4a07mct9] {
        transform: scale(1.2);
    }

.popup-body[b-aj4a07mct9] {
    padding: 20px;
    max-height: 60vh;
    overflow-y: auto;
}

.popup-footer[b-aj4a07mct9] {
    display: flex;
    justify-content: flex-end;
    gap: 12px;
    padding: 16px;
    border-top: 1px solid #e8e8e8;
    background: #fafafa;
}

.weight-table[b-aj4a07mct9] {
    width: 100%;
    font-size: 13px;
    border-collapse: collapse;
}

    .weight-table thead[b-aj4a07mct9] {
        background: #f5f5f5;
        position: sticky;
        top: 0;
        z-index: 10;
    }

    .weight-table th[b-aj4a07mct9] {
        padding: 10px;
        border-bottom: 2px solid #e0e0e0;
        font-weight: 600;
        color: #333;
        text-align: left;
    }

    .weight-table td[b-aj4a07mct9] {
        padding: 8px;
        border-bottom: 1px solid #e9ecef;
    }

.weight-input[b-aj4a07mct9] {
    width: 100%;
    padding: 6px 10px;
    border: 1px solid #e8e8e8;
    border-radius: 4px;
    font-size: 13px;
    text-align: right;
    transition: border-color 0.3s;
}

    .weight-input:focus[b-aj4a07mct9] {
        border-color: #0d6efd;
        outline: none;
    }

.empty-state[b-aj4a07mct9] {
    text-align: center;
    padding: 40px;
    color: #999;
}

.empty-state-icon[b-aj4a07mct9] {
    font-size: 48px;
    display: block;
    margin-bottom: 12px;
}

.btn-cancel[b-aj4a07mct9] {
    padding: 8px 20px;
    font-size: 13px;
    background: #fff;
    border: 1px solid #d9d9d9;
    color: #666;
    border-radius: 4px;
    cursor: pointer;
}


/* 字体大小统一定义 - 基于视口单位实现响应式 */
:root[b-aj4a07mct9] {
    --font-xs: clamp(9px, 0.8vw, 10px); /* 超小字体 */
    --font-sm: clamp(10px, 0.9vw, 11px); /* 小字体 */
    --font-base: clamp(11px, 1vw, 12px); /* 基础字体 */
    --font-md: clamp(12px, 1.1vw, 13px); /* 中等字体 */
    --font-lg: clamp(13px, 1.2vw, 14px); /* 大字体 */
    --font-xl: clamp(14px, 1.3vw, 15px); /* 超大字体 */
}

/* 全局字体适配 */
.side-panel[b-aj4a07mct9],
.center-panel[b-aj4a07mct9] {
    font-size: var(--font-base);
}

    /* 标题字体 */
    .side-panel h6[b-aj4a07mct9],
    .center-panel h6[b-aj4a07mct9] {
        font-size: var(--font-md) !important;
    }

/* 标签和描述文字 */
.info-label[b-aj4a07mct9] {
    font-size: var(--font-sm) !important;
}

.info-value[b-aj4a07mct9] {
    font-size: var(--font-sm) !important;
}

/* 按钮字体 */
.btn-sm[b-aj4a07mct9] {
    font-size: var(--font-sm) !important;
}

/* 表格字体 */
.table[b-aj4a07mct9] {
    font-size: var(--font-base) !important;
}

    .table th[b-aj4a07mct9] {
        font-size: var(--font-base) !important;
    }

    .table td[b-aj4a07mct9] {
        font-size: var(--font-sm) !important;
    }

/* Badge 字体 */
.badge[b-aj4a07mct9] {
    font-size: var(--font-xs) !important;
}

/* 图标字体 */
.bi[b-aj4a07mct9] {
    font-size: var(--font-base) !important;
}

/* 输入框字体 */
input[b-aj4a07mct9],
select[b-aj4a07mct9],
textarea[b-aj4a07mct9] {
    font-size: var(--font-sm) !important;
}

/* 步骤条字体 */
.step-text[b-aj4a07mct9] {
    font-size: var(--font-sm) !important;
}

/* 空状态提示字体 */
.empty-state-text[b-aj4a07mct9] {
    font-size: var(--font-base) !important;
}

.empty-state-icon[b-aj4a07mct9] {
    font-size: calc(var(--font-base) * 3) !important;
}

/* 统计信息字体 */
.stats-text[b-aj4a07mct9] {
    font-size: var(--font-sm) !important;
}

/* 卡片标题字体 */
.section-title-blue[b-aj4a07mct9] {
    font-size: var(--font-base) !important;
}

/* 响应式断点 - 大屏幕 */
@media (min-width: 1920px) {
    :root[b-aj4a07mct9] {
        --font-xs: 10px;
        --font-sm: 11px;
        --font-base: 12px;
        --font-md: 13px;
        --font-lg: 14px;
        --font-xl: 15px;
    }
}

/* 响应式断点 - 中等屏幕 */
@media (min-width: 1366px) and (max-width: 1919px) {
    :root[b-aj4a07mct9] {
        --font-xs: 9px;
        --font-sm: 10px;
        --font-base: 11px;
        --font-md: 12px;
        --font-lg: 13px;
        --font-xl: 14px;
    }
}

/* 响应式断点 - 小屏幕 */
@media (max-width: 1365px) {
    :root[b-aj4a07mct9] {
        --font-xs: 8px;
        --font-sm: 9px;
        --font-base: 10px;
        --font-md: 11px;
        --font-lg: 12px;
        --font-xl: 13px;
    }
}

/* 🔥 PDF Tab iframe（替代 DxPdfViewer，跨平台稳定） */
.pdf-tab-iframe[b-aj4a07mct9] {
    width: 100%;
    height: 100%;
    border: none;
    background-color: #fff;
    display: block;
}

/* 🔥 DevExpress PdfViewer（兼容安卓浏览器，canvas 渲染） */
[b-aj4a07mct9] .pdf-tab-viewer {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    min-height: 0;
}

[b-aj4a07mct9] .pdf-tab-viewer .dxbl-pdf-viewer {
    flex: 1;
    height: 100%;
    min-height: 0;
}

/*!* =========================================================================*/
/*   ✅ Bootstrap 工具类兜底（仅作用于本组件，使用 ::deep 限定作用域）*/
/*   原因：DevExpress 的 Bootstrap 系列主题自带 Bootstrap CSS，但 Fluent_Light /*/
/*   Fluent_Dark 等主题不带 Bootstrap，本页面里大量使用了 .btn / .row / .col-12 /*/
/*   .d-flex / .badge / .table / .progress / .rounded-circle / .me-*!.mb-* 等类，*/
/*   导致在 Fluent 主题下样式失效。*/
/*   这里只为本页面所需的类提供最小兜底，scoped CSS + ::deep 保证其它页面与*/
/*   Bootstrap 主题完全不受影响。  ========================================================================= *!*/

/* layout */
[b-aj4a07mct9] .row { display: flex; flex-wrap: wrap; margin-right: -8px; margin-left: -8px; }
[b-aj4a07mct9] .row > [class^="col-"], [b-aj4a07mct9] .row > [class*=" col-"] { padding-right: 8px; padding-left: 8px; box-sizing: border-box; }
[b-aj4a07mct9] .col-12 { flex: 0 0 100%; max-width: 100%; }

/* flex helpers */
[b-aj4a07mct9] .d-flex { display: flex !important; }
[b-aj4a07mct9] .d-inline-flex { display: inline-flex !important; }
[b-aj4a07mct9] .flex-column { flex-direction: column !important; }
[b-aj4a07mct9] .justify-content-start { justify-content: flex-start !important; }
[b-aj4a07mct9] .justify-content-center { justify-content: center !important; }
[b-aj4a07mct9] .justify-content-between { justify-content: space-between !important; }
[b-aj4a07mct9] .justify-content-end { justify-content: flex-end !important; }
[b-aj4a07mct9] .align-items-center { align-items: center !important; }
[b-aj4a07mct9] .align-items-start { align-items: flex-start !important; }
[b-aj4a07mct9] .align-items-end { align-items: flex-end !important; }

/* position */
[b-aj4a07mct9] .position-relative { position: relative !important; }
[b-aj4a07mct9] .position-absolute { position: absolute !important; }

/* sizing */
[b-aj4a07mct9] .w-100 { width: 100% !important; }
[b-aj4a07mct9] .h-100 { height: 100% !important; }

/* spacing (BS 0.25rem step) */
[b-aj4a07mct9] .m-0 { margin: 0 !important; }
[b-aj4a07mct9] .mt-0 { margin-top: 0 !important; } [b-aj4a07mct9] .mb-0 { margin-bottom: 0 !important; }
[b-aj4a07mct9] .ms-0 { margin-left: 0 !important; } [b-aj4a07mct9] .me-0 { margin-right: 0 !important; }
[b-aj4a07mct9] .mt-1 { margin-top: .25rem !important; } [b-aj4a07mct9] .mb-1 { margin-bottom: .25rem !important; }
[b-aj4a07mct9] .ms-1 { margin-left: .25rem !important; } [b-aj4a07mct9] .me-1 { margin-right: .25rem !important; }
[b-aj4a07mct9] .mt-2 { margin-top: .5rem !important; } [b-aj4a07mct9] .mb-2 { margin-bottom: .5rem !important; }
[b-aj4a07mct9] .ms-2 { margin-left: .5rem !important; } [b-aj4a07mct9] .me-2 { margin-right: .5rem !important; }
[b-aj4a07mct9] .mt-3 { margin-top: 1rem !important; } [b-aj4a07mct9] .mb-3 { margin-bottom: 1rem !important; }
[b-aj4a07mct9] .p-0 { padding: 0 !important; }
[b-aj4a07mct9] .py-1 { padding-top: .25rem !important; padding-bottom: .25rem !important; }
[b-aj4a07mct9] .py-2 { padding-top: .5rem !important; padding-bottom: .5rem !important; }
[b-aj4a07mct9] .py-3 { padding-top: 1rem !important; padding-bottom: 1rem !important; }
[b-aj4a07mct9] .px-1 { padding-left: .25rem !important; padding-right: .25rem !important; }
[b-aj4a07mct9] .px-2 { padding-left: .5rem !important; padding-right: .5rem !important; }
[b-aj4a07mct9] .px-3 { padding-left: 1rem !important; padding-right: 1rem !important; }
[b-aj4a07mct9] .gap-1 { gap: .25rem !important; }
[b-aj4a07mct9] .gap-2 { gap: .5rem !important; }
[b-aj4a07mct9] .gap-3 { gap: 1rem !important; }

/* text */
[b-aj4a07mct9] .text-center { text-align: center !important; }
[b-aj4a07mct9] .text-start { text-align: left !important; }
[b-aj4a07mct9] .text-end { text-align: right !important; }
[b-aj4a07mct9] .text-white { color: #fff !important; }
[b-aj4a07mct9] .text-muted { color: #6c757d !important; }
[b-aj4a07mct9] .fw-semibold { font-weight: 600 !important; }
[b-aj4a07mct9] .fw-bold { font-weight: 700 !important; }

/* backgrounds */
[b-aj4a07mct9] .bg-primary { background-color: #0d6efd !important; color: #fff; }
[b-aj4a07mct9] .bg-light { background-color: #f8f9fa !important; }
[b-aj4a07mct9] .bg-secondary { background-color: #6c757d !important; color: #fff; }
[b-aj4a07mct9] .bg-success { background-color: #198754 !important; color: #fff; }
[b-aj4a07mct9] .bg-danger { background-color: #dc3545 !important; color: #fff; }
[b-aj4a07mct9] .bg-warning { background-color: #ffc107 !important; color: #212529; }
[b-aj4a07mct9] .bg-info { background-color: #0dcaf0 !important; color: #212529; }

/* borders / radius */
[b-aj4a07mct9] .rounded { border-radius: .375rem !important; }
[b-aj4a07mct9] .rounded-circle { border-radius: 50% !important; }
[b-aj4a07mct9] .border { border: 1px solid #dee2e6 !important; }

/* buttons */
[b-aj4a07mct9] .btn {
    display: inline-block;
    font-weight: 400;
    line-height: 1.5;
    color: #212529;
    text-align: center;
    text-decoration: none;
    vertical-align: middle;
    cursor: pointer;
    user-select: none;
    background-color: transparent;
    border: 1px solid transparent;
    padding: .375rem .75rem;
    font-size: 1rem;
    border-radius: .375rem;
    transition: color .15s, background-color .15s, border-color .15s, box-shadow .15s;
}
[b-aj4a07mct9] .btn:hover { filter: brightness(0.95); }
[b-aj4a07mct9] .btn:disabled, [b-aj4a07mct9] .btn.disabled { opacity: .65; cursor: not-allowed; }
[b-aj4a07mct9] .btn-sm { padding: .25rem .5rem; font-size: .875rem; border-radius: .25rem; }
[b-aj4a07mct9] .btn-primary { color: #fff; background-color: #0d6efd; border-color: #0d6efd; }
[b-aj4a07mct9] .btn-secondary { color: #fff; background-color: #6c757d; border-color: #6c757d; }
[b-aj4a07mct9] .btn-outline-primary { color: #0d6efd; border-color: #0d6efd; background-color: transparent; }
[b-aj4a07mct9] .btn-outline-primary:hover { color: #fff; background-color: #0d6efd; }

/* card */
[b-aj4a07mct9] .card {
    position: relative;
    display: flex;
    flex-direction: column;
    min-width: 0;
    word-wrap: break-word;
    background-color: #fff;
    background-clip: border-box;
    border: 1px solid rgba(0, 0, 0, 0.125);
    border-radius: .375rem;
}

/* badge */
[b-aj4a07mct9] .badge {
    display: inline-block;
    padding: .35em .65em;
    font-size: .75em;
    font-weight: 700;
    line-height: 1;
    color: #fff;
    text-align: center;
    white-space: nowrap;
    vertical-align: baseline;
    border-radius: .375rem;
    background-color: #6c757d;
}

/* progress */
[b-aj4a07mct9] .progress {
    display: flex;
    height: 1rem;
    overflow: hidden;
    font-size: .75rem;
    background-color: #e9ecef;
    border-radius: .375rem;
}
[b-aj4a07mct9] .progress-bar {
    display: flex;
    flex-direction: column;
    justify-content: center;
    overflow: hidden;
    color: #fff;
    text-align: center;
    white-space: nowrap;
    background-color: #0d6efd;
    transition: width .6s ease;
}

/* table */
[b-aj4a07mct9] .table {
    width: 100%;
    margin-bottom: 1rem;
    color: #212529;
    vertical-align: top;
    border-color: #dee2e6;
    border-collapse: collapse;
}
[b-aj4a07mct9] .table > :not(caption) > * > * {
    padding: .5rem .5rem;
    border-bottom-width: 1px;
    border-bottom-style: solid;
    border-bottom-color: #dee2e6;
    background-color: transparent;
}
[b-aj4a07mct9] .table-sm > :not(caption) > * > * { padding: .25rem .25rem; }
[b-aj4a07mct9] .table-hover > tbody > tr:hover > * { background-color: rgba(0, 0, 0, 0.075); }

/* =========================================================================
   ✅ Fluent_Dark / 暗色主题适配
   通过 razor 顶层 div 上的 .cc-dark 类（由 ThemesService.IsDark 决定）作为
   作用域开关，仅当本页面处于暗色主题时才覆盖颜色，不影响 Bootstrap / 亮色主题。
   说明：以下规则等价于 [b-xxx].cc-dark XXX，cc-root 在 razor 模板中，因此
   能正确接收 scoped CSS 的属性，::deep 之后的选择器作用于其内部所有后代。
   ========================================================================= */

/* —— 页面级别区域容器 —— */
.cc-dark[b-aj4a07mct9]  .side-panel { background: #1f1f1f !important; color: #e6e6e6; }
.cc-dark[b-aj4a07mct9]  .center-panel { background: #141414 !important; color: #e6e6e6; }

/* —— 卡片 / 信息块 —— */
.cc-dark[b-aj4a07mct9]  .card-white {
    background: #2a2a2a !important;
    border-color: #3a3a3a !important;
    color: #e6e6e6;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.4);
}

/* —— 文本 —— */
.cc-dark[b-aj4a07mct9]  .info-label { color: #b0b0b0 !important; }
.cc-dark[b-aj4a07mct9]  .info-value { color: #f0f0f0 !important; }
.cc-dark[b-aj4a07mct9]  .section-title-blue {
    color: #4ea1ff !important;
    border-bottom-color: #3a3a3a !important;
}
.cc-dark[b-aj4a07mct9]  .text-muted { color: #9aa0a6 !important; }

/* —— Bootstrap 兜底类的暗色配色 —— */
.cc-dark[b-aj4a07mct9]  .card {
    background-color: #2a2a2a !important;
    border-color: #3a3a3a !important;
    color: #e6e6e6;
}
.cc-dark[b-aj4a07mct9]  .bg-light { background-color: #2a2a2a !important; color: #e6e6e6; }
.cc-dark[b-aj4a07mct9]  .border { border-color: #3a3a3a !important; }
.cc-dark[b-aj4a07mct9]  .table { color: #e6e6e6 !important; border-color: #3a3a3a !important; }
.cc-dark[b-aj4a07mct9]  .table > :not(caption) > * > * { border-bottom-color: #3a3a3a !important; }
.cc-dark[b-aj4a07mct9]  .table-hover > tbody > tr:hover > * { background-color: rgba(255, 255, 255, 0.06) !important; }
.cc-dark[b-aj4a07mct9]  .progress { background-color: #333 !important; }

/* —— 按钮（次要按钮在暗色下保持可读） —— */
.cc-dark[b-aj4a07mct9]  .btn { color: #e6e6e6; }
.cc-dark[b-aj4a07mct9]  .btn-outline-primary { color: #4ea1ff; border-color: #4ea1ff; }
.cc-dark[b-aj4a07mct9]  .btn-outline-primary:hover { color: #fff; background-color: #2563eb; }

/* —— 输入框 / 表格内输入 —— */
.cc-dark[b-aj4a07mct9]  input,
.cc-dark[b-aj4a07mct9]  select,
.cc-dark[b-aj4a07mct9]  textarea,
.cc-dark[b-aj4a07mct9]  .weight-input {
    background-color: #1f1f1f !important;
    border-color: #3a3a3a !important;
    color: #e6e6e6 !important;
}

/* —— 弹窗（popup） —— */
.cc-dark[b-aj4a07mct9]  .popup-content { background: #1f1f1f; color: #e6e6e6; }
.cc-dark[b-aj4a07mct9]  .popup-body { background: #1f1f1f; }
.cc-dark[b-aj4a07mct9]  .popup-footer { background: #2a2a2a; border-top-color: #3a3a3a; }
.cc-dark[b-aj4a07mct9]  .weight-table thead { background: #2a2a2a; }
.cc-dark[b-aj4a07mct9]  .weight-table th { color: #e6e6e6; border-bottom-color: #3a3a3a; }
.cc-dark[b-aj4a07mct9]  .weight-table td { border-bottom-color: #3a3a3a; }
.cc-dark[b-aj4a07mct9]  .btn-cancel {
    background: #2a2a2a;
    border-color: #3a3a3a;
    color: #d0d0d0;
}
.cc-dark[b-aj4a07mct9]  .empty-state { color: #9aa0a6; }

/* —— PDF iframe 在暗色下也保留白底（PDF 内容自身就是白的） —— */
.cc-dark[b-aj4a07mct9]  .pdf-tab-iframe { background-color: #fff; }

/* =========================================================================
   ✅ 内联硬编码颜色的暗色覆写
   .razor 模板里大量使用 style="background: white / #f5f5f5; color: #333 ..."
   这些内联样式优先级高于普通 CSS。这里通过属性选择器 + !important 在暗色主题
   下批量纠正常见的浅色硬编码值，且仅在 .cc-dark 范围内生效。
   ========================================================================= */

/* 浅色背景 → 暗色面板 */
.cc-dark[b-aj4a07mct9]  [style*="background: white"],
.cc-dark[b-aj4a07mct9]  [style*="background:#fff"],
.cc-dark[b-aj4a07mct9]  [style*="background: #fff"],
.cc-dark[b-aj4a07mct9]  [style*="background-color: white"],
.cc-dark[b-aj4a07mct9]  [style*="background-color:#fff"],
.cc-dark[b-aj4a07mct9]  [style*="background-color: #fff"] {
    background: #2a2a2a !important;
    background-color: #2a2a2a !important;
    color: #e6e6e6;
}

.cc-dark[b-aj4a07mct9]  [style*="background: #f5f5f5"],
.cc-dark[b-aj4a07mct9]  [style*="background:#f5f5f5"],
.cc-dark[b-aj4a07mct9]  [style*="background: #fafafa"],
.cc-dark[b-aj4a07mct9]  [style*="background:#fafafa"],
.cc-dark[b-aj4a07mct9]  [style*="background: #fafbfc"],
.cc-dark[b-aj4a07mct9]  [style*="background:#fafbfc"],
.cc-dark[b-aj4a07mct9]  [style*="background: #f5f7fa"],
.cc-dark[b-aj4a07mct9]  [style*="background: #f0f0f0"],
.cc-dark[b-aj4a07mct9]  [style*="background: #f6ffed"],
.cc-dark[b-aj4a07mct9]  [style*="background: #f8f9fa"],
.cc-dark[b-aj4a07mct9]  [style*="background:#f8f9fa"],
.cc-dark[b-aj4a07mct9]  [style*="background: #d9d9d9"] {
    background: #262626 !important;
    color: #e6e6e6;
}

/* 信息提示蓝条 / 警告黄条 */
.cc-dark[b-aj4a07mct9]  [style*="background: #e6f7ff"] {
    background: #0f2a44 !important; color: #cfe6ff !important;
    border-color: #1f4e7a !important;
}
.cc-dark[b-aj4a07mct9]  [style*="background: #fff7e6"] {
    background: #3a2a10 !important; color: #ffd591 !important;
    border-color: #6b4a1a !important;
}

/* 渐变背景（左侧滚动区） */
.cc-dark[b-aj4a07mct9]  [style*="linear-gradient(180deg, #fafbfc"],
.cc-dark[b-aj4a07mct9]  [style*="linear-gradient(180deg,#fafbfc"] {
    background: linear-gradient(180deg, #1a1a1a 0%, #141414 100%) !important;
}

/* 浅色边框 */
.cc-dark[b-aj4a07mct9]  [style*="border: 1px solid #e8e8e8"],
.cc-dark[b-aj4a07mct9]  [style*="border: 1px solid #e0e6ed"],
.cc-dark[b-aj4a07mct9]  [style*="border: 1px solid #e0e0e0"],
.cc-dark[b-aj4a07mct9]  [style*="border-bottom: 1px solid #e8e8e8"],
.cc-dark[b-aj4a07mct9]  [style*="border-bottom: 1px solid #e9ecef"],
.cc-dark[b-aj4a07mct9]  [style*="border-bottom: 1px solid #e0e6ed"],
.cc-dark[b-aj4a07mct9]  [style*="border-top: 1px solid #e0e6ed"],
.cc-dark[b-aj4a07mct9]  [style*="border-bottom: 2px solid #e0e0e0"],
.cc-dark[b-aj4a07mct9]  [style*="border-color: #e8e8e8"] {
    border-color: #3a3a3a !important;
}

/* 暗色文字（覆盖内联 #333 / #666 / #999） */
.cc-dark[b-aj4a07mct9]  [style*="color: #333"] { color: #f0f0f0 !important; }
.cc-dark[b-aj4a07mct9]  [style*="color:#333"] { color: #f0f0f0 !important; }
.cc-dark[b-aj4a07mct9]  [style*="color: #666"] { color: #b8b8b8 !important; }
.cc-dark[b-aj4a07mct9]  [style*="color:#666"] { color: #b8b8b8 !important; }
.cc-dark[b-aj4a07mct9]  [style*="color: #999"] { color: #909090 !important; }
.cc-dark[b-aj4a07mct9]  [style*="color:#999"] { color: #909090 !important; }
.cc-dark[b-aj4a07mct9]  [style*="color: #888"] { color: #a0a0a0 !important; }
.cc-dark[b-aj4a07mct9]  [style*="color:#888"] { color: #a0a0a0 !important; }
.cc-dark[b-aj4a07mct9]  [style*="color: #bbb"] { color: #888 !important; }
.cc-dark[b-aj4a07mct9]  [style*="color: #ccc"] { color: #777 !important; }
.cc-dark[b-aj4a07mct9]  [style*="color: #6c757d"] { color: #a0a6ad !important; }
.cc-dark[b-aj4a07mct9]  [style*="color: #d46b08"] { color: #ffd591 !important; }

/* 暗底里成功/警告/错误文字保持原色但稍微提亮 */
.cc-dark[b-aj4a07mct9]  [style*="color: #155724"] { color: #4ade80 !important; }
.cc-dark[b-aj4a07mct9]  [style*="color: #721c24"] { color: #ff7875 !important; }

/* 蓝色链接稍微调亮以提高暗底对比度 */
.cc-dark[b-aj4a07mct9]  [style*="color: #1890ff"] { color: #4ea1ff !important; }

/* 下划线 / hr */
.cc-dark[b-aj4a07mct9]  hr[style*="#e8e8e8"] { border-color: #3a3a3a !important; }

/* sticky 表头浅灰 → 暗色 */
.cc-dark[b-aj4a07mct9]  thead[style*="background: #f5f5f5"],
.cc-dark[b-aj4a07mct9]  thead[style*="background:#f5f5f5"] {
    background: #262626 !important;
}

/* 卡片浅色阴影在暗底下不明显，加个深色阴影 */
.cc-dark[b-aj4a07mct9]  [style*="box-shadow: 0 2px 8px rgba(0,0,0,0.04)"] {
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.5) !important;
}

/* /Components/Pages/Inspection/CheckControlv1.razor.rz.scp.css */
[b-mren7qogja] .dxbl-stack-layout {
    height: 100% !important;
}

    [b-mren7qogja] .dxbl-stack-layout > div {
        height: 100% !important;
        display: flex !important;
    }

[b-mren7qogja] .dxbl-stack-layout-item {
    height: 100% !important;
}

.stacklayout-item[b-mren7qogja] {
    font-size: 1.2em;
    font-weight: 500;
    text-align: center;
    padding: 0.5rem;
    position: relative;
    z-index: 0;
    display: block;
    width: 100%;
    height: 100%;
    box-sizing: border-box;
}

    .stacklayout-item[b-mren7qogja]:before {
        content: " ";
        position: absolute;
        z-index: -1;
        width: 100%;
        height: 100%;
        left: 0;
        top: 0;
        opacity: 0.4;
    }

    .stacklayout-item > div[b-mren7qogja] {
        position: relative;
        z-index: 1;
        width: 100%;
        height: 100%;
        overflow: auto;
    }

.stacklayout-header[b-mren7qogja]:before {
    background-color: var(--bs-red);
}

.stacklayout-content[b-mren7qogja]:before {
    background-color: var(--bs-yellow);
}

.stacklayout-footer[b-mren7qogja]:before {
    background-color: var(--bs-blue);
}

@media (max-width: 575.98px) {
    .stacklayout-item[b-mren7qogja] {
        font-size: 0.9em;
    }
}
[b-mren7qogja] .info-label {
    color: #666;
    font-size: 15px;
}

[b-mren7qogja] .info-value {
    color: #333;
    font-size: 12px;
    font-weight: 500;
}

[b-mren7qogja] .section-title-blue {
    color: #1890ff;
    font-size: 12px;
    font-weight: 600;
    margin-bottom: 8px;
}

[b-mren7qogja] .card-white {
    background: white;
    border-radius: 4px;
    padding: 12px;
    margin-bottom: 12px;
    border: 1px solid #e8e8e8;
    box-shadow: 0 1px 2px rgba(0,0,0,0.03);
}

[b-mren7qogja] .side-panel {
    background: #f5f7fa;
    padding: 12px;
    height: 100%;
    overflow-y: auto;
}

[b-mren7qogja] .center-panel {
    background: #ffffff;
    height: 100%;
    display: flex;
    flex-direction: column;
}

[b-mren7qogja] .section-title-blue {
    color: #1890ff;
    font-size: 15px;
    font-weight: 600;
    margin-bottom: 8px;
    padding-bottom: 6px;
    border-bottom: 1px dashed #d9d9d9;
}

/* 弹出窗体样式 */
.popup-overlay[b-mren7qogja] {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 9999;
    animation: fadeIn 0.2s ease-out;
}

.popup-content[b-mren7qogja] {
    background: white;
    border-radius: 12px;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);
    animation: slideUp 0.3s ease-out;
    max-width: 90%;
}

.popup-header[b-mren7qogja] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 16px;
    border-bottom: 1px solid #e8e8e8;
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
}

.popup-title[b-mren7qogja] {
    margin: 0;
    color: white;
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 15px;
}

.popup-close-btn[b-mren7qogja] {
    background: transparent;
    border: none;
    color: white;
    font-size: 24px;
    cursor: pointer;
    padding: 0;
    line-height: 1;
    transition: transform 0.2s;
}

    .popup-close-btn:hover[b-mren7qogja] {
        transform: scale(1.2);
    }

.popup-body[b-mren7qogja] {
    padding: 20px;
    max-height: 60vh;
    overflow-y: auto;
}

.popup-footer[b-mren7qogja] {
    display: flex;
    justify-content: flex-end;
    gap: 12px;
    padding: 16px;
    border-top: 1px solid #e8e8e8;
    background: #fafafa;
}

.weight-table[b-mren7qogja] {
    width: 100%;
    font-size: 13px;
    border-collapse: collapse;
}

    .weight-table thead[b-mren7qogja] {
        background: #f5f5f5;
        position: sticky;
        top: 0;
        z-index: 10;
    }

    .weight-table th[b-mren7qogja] {
        padding: 10px;
        border-bottom: 2px solid #e0e0e0;
        font-weight: 600;
        color: #333;
        text-align: left;
    }

    .weight-table td[b-mren7qogja] {
        padding: 8px;
        border-bottom: 1px solid #e9ecef;
    }

.weight-input[b-mren7qogja] {
    width: 100%;
    padding: 6px 10px;
    border: 1px solid #e8e8e8;
    border-radius: 4px;
    font-size: 13px;
    text-align: right;
    transition: border-color 0.3s;
}

    .weight-input:focus[b-mren7qogja] {
        border-color: #0d6efd;
        outline: none;
    }

.empty-state[b-mren7qogja] {
    text-align: center;
    padding: 40px;
    color: #999;
}

.empty-state-icon[b-mren7qogja] {
    font-size: 48px;
    display: block;
    margin-bottom: 12px;
}

.btn-cancel[b-mren7qogja] {
    padding: 8px 20px;
    font-size: 13px;
    background: #fff;
    border: 1px solid #d9d9d9;
    color: #666;
    border-radius: 4px;
    cursor: pointer;
}


/* 字体大小统一定义 - 基于视口单位实现响应式 */
:root[b-mren7qogja] {
    --font-xs: clamp(9px, 0.8vw, 10px); /* 超小字体 */
    --font-sm: clamp(10px, 0.9vw, 11px); /* 小字体 */
    --font-base: clamp(11px, 1vw, 12px); /* 基础字体 */
    --font-md: clamp(12px, 1.1vw, 13px); /* 中等字体 */
    --font-lg: clamp(13px, 1.2vw, 14px); /* 大字体 */
    --font-xl: clamp(14px, 1.3vw, 15px); /* 超大字体 */
}

/* 全局字体适配 */
.side-panel[b-mren7qogja],
.center-panel[b-mren7qogja] {
    font-size: var(--font-base);
}

    /* 标题字体 */
    .side-panel h6[b-mren7qogja],
    .center-panel h6[b-mren7qogja] {
        font-size: var(--font-md) !important;
    }

/* 标签和描述文字 */
.info-label[b-mren7qogja] {
    font-size: var(--font-sm) !important;
}

.info-value[b-mren7qogja] {
    font-size: var(--font-sm) !important;
}

/* 按钮字体 */
.btn-sm[b-mren7qogja] {
    font-size: var(--font-sm) !important;
}

/* 表格字体 */
.table[b-mren7qogja] {
    font-size: var(--font-base) !important;
}

    .table th[b-mren7qogja] {
        font-size: var(--font-base) !important;
    }

    .table td[b-mren7qogja] {
        font-size: var(--font-sm) !important;
    }

/* Badge 字体 */
.badge[b-mren7qogja] {
    font-size: var(--font-xs) !important;
}

/* 图标字体 */
.bi[b-mren7qogja] {
    font-size: var(--font-base) !important;
}

/* 输入框字体 */
input[b-mren7qogja],
select[b-mren7qogja],
textarea[b-mren7qogja] {
    font-size: var(--font-sm) !important;
}

/* 步骤条字体 */
.step-text[b-mren7qogja] {
    font-size: var(--font-sm) !important;
}

/* 空状态提示字体 */
.empty-state-text[b-mren7qogja] {
    font-size: var(--font-base) !important;
}

.empty-state-icon[b-mren7qogja] {
    font-size: calc(var(--font-base) * 3) !important;
}

/* 统计信息字体 */
.stats-text[b-mren7qogja] {
    font-size: var(--font-sm) !important;
}

/* 卡片标题字体 */
.section-title-blue[b-mren7qogja] {
    font-size: var(--font-base) !important;
}

/* 响应式断点 - 大屏幕 */
@media (min-width: 1920px) {
    :root[b-mren7qogja] {
        --font-xs: 10px;
        --font-sm: 11px;
        --font-base: 12px;
        --font-md: 13px;
        --font-lg: 14px;
        --font-xl: 15px;
    }
}

/* 响应式断点 - 中等屏幕 */
@media (min-width: 1366px) and (max-width: 1919px) {
    :root[b-mren7qogja] {
        --font-xs: 9px;
        --font-sm: 10px;
        --font-base: 11px;
        --font-md: 12px;
        --font-lg: 13px;
        --font-xl: 14px;
    }
}

/* 响应式断点 - 小屏幕 */
@media (max-width: 1365px) {
    :root[b-mren7qogja] {
        --font-xs: 8px;
        --font-sm: 9px;
        --font-base: 10px;
        --font-md: 11px;
        --font-lg: 12px;
        --font-xl: 13px;
    }
}

/* 🔥 PDF Tab iframe（替代 DxPdfViewer，跨平台稳定） */
.pdf-tab-iframe[b-mren7qogja] {
    width: 100%;
    height: 100%;
    border: none;
    background-color: #fff;
    display: block;
}

/* =========================================================================
   ✅ 订单选择弹窗（os-*）+ 移动端适配
   桌面端：横向表格；移动端（<= 768px）：表格行转为堆叠卡片（data-label 模式）
   ========================================================================= */
.os-overlay[b-mren7qogja] {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.5);
    z-index: 9999;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 16px;
    box-sizing: border-box;
}

.os-modal[b-mren7qogja] {
    background: #fff;
    border-radius: 8px;
    width: 1000px;
    max-width: 100%;
    max-height: 85vh;
    overflow: hidden;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3);
    display: flex;
    flex-direction: column;
}

.os-header[b-mren7qogja] {
    padding: 12px 16px;
    border-bottom: 1px solid #e8e8e8;
    display: flex;
    justify-content: space-between;
    align-items: center;
    background: linear-gradient(90deg, #1890ff 0%, #096dd9 100%);
    flex-shrink: 0;
}

.os-header-title[b-mren7qogja] {
    display: flex;
    align-items: center;
    gap: 8px;
    color: #fff;
}

    .os-header-title h6[b-mren7qogja] {
        margin: 0;
        color: #fff;
        font-weight: 600;
    }

    .os-header-title i[b-mren7qogja] {
        color: #fff;
        font-size: 16px;
    }

.os-close-btn[b-mren7qogja] {
    background: transparent;
    border: none;
    color: #fff;
    font-size: 22px;
    cursor: pointer;
    padding: 0 4px;
    line-height: 1;
}

.os-search-bar[b-mren7qogja] {
    padding: 10px 16px;
    border-bottom: 1px solid #f0f0f0;
    display: flex;
    gap: 8px;
    align-items: center;
    flex-shrink: 0;
}

.os-search-input[b-mren7qogja] {
    flex: 1;
    max-width: 320px;
    padding: 6px 10px;
    height: 32px;
    border: 1px solid #d9d9d9;
    border-radius: 4px;
    font-size: 12px;
    box-sizing: border-box;
}

.os-refresh-btn[b-mren7qogja] {
    height: 32px;
    font-size: 11px;
    padding: 4px 12px;
    white-space: nowrap;
}

.os-body[b-mren7qogja] {
    flex: 1;
    overflow: auto;
    -webkit-overflow-scrolling: touch;
    padding: 0;
}

.os-footer[b-mren7qogja] {
    padding: 10px 16px;
    border-top: 1px solid #e8e8e8;
    display: flex;
    justify-content: flex-end;
    background: #fafafa;
    flex-shrink: 0;
}

.os-empty[b-mren7qogja] {
    text-align: center;
    padding: 40px 0;
    color: #999;
}

    .os-empty p[b-mren7qogja] {
        margin-top: 8px;
        font-size: 13px;
    }

.os-table[b-mren7qogja] {
    width: 100%;
    font-size: 12px;
    margin-bottom: 0;
}

    .os-table thead[b-mren7qogja] {
        position: sticky;
        top: 0;
        background: #f5f5f5;
        z-index: 10;
    }

    .os-table th[b-mren7qogja] {
        padding: 10px;
        white-space: nowrap;
        text-align: left;
        font-weight: 600;
        color: #555;
        border-bottom: 2px solid #e8e8e8;
    }

    .os-table td[b-mren7qogja] {
        padding: 8px 10px;
        vertical-align: middle;
        border-bottom: 1px solid #f0f0f0;
    }

.os-row[b-mren7qogja] {
    cursor: pointer;
    transition: background-color 0.2s;
}
.os-row:hover[b-mren7qogja] {
    background-color: #f5faff !important;
}

.os-orderno[b-mren7qogja] {
    font-weight: 600;
    color: #1890ff;
}

.os-blue-text[b-mren7qogja] {
    color: #1890ff;
}

.os-qty[b-mren7qogja] {
    text-align: left;
}

.os-action-cell[b-mren7qogja] {
    text-align: left;
}

.os-select-btn[b-mren7qogja] {
    font-size: 10px;
    padding: 2px 10px;
    white-space: nowrap;
}

/* —— 移动端（<=768px）：表格行转为堆叠卡片 —— */
@media (max-width: 768px) {
    .os-overlay[b-mren7qogja] {
        padding: 0;
        align-items: stretch;
        justify-content: stretch;
    }

    .os-modal[b-mren7qogja] {
        width: 100%;
        max-width: 100%;
        height: 100%;
        max-height: 100%;
        border-radius: 0;
    }

    .os-search-input[b-mren7qogja] {
        max-width: none;
    }

    /* 隐藏表头，行变卡片 */
    .os-table thead[b-mren7qogja] {
        display: none;
    }

    .os-table[b-mren7qogja],
    .os-table tbody[b-mren7qogja],
    .os-table tr[b-mren7qogja],
    .os-table td[b-mren7qogja] {
        display: block;
        width: 100%;
        box-sizing: border-box;
    }

    .os-table tr[b-mren7qogja] {
        border: 1px solid #e8e8e8;
        border-radius: 8px;
        margin: 10px;
        padding: 6px 10px;
        background: #fff;
        box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06);
    }

    .os-table td[b-mren7qogja] {
        display: flex;
        justify-content: space-between;
        align-items: center;
        gap: 12px;
        padding: 7px 2px;
        border: none;
        border-bottom: 1px dashed #f0f0f0;
        text-align: right;
        font-size: 13px;
    }

        .os-table td:last-child[b-mren7qogja] {
            border-bottom: none;
        }

        /* 左侧字段名 */
        .os-table td[b-mren7qogja]::before {
            content: attr(data-label);
            font-weight: 600;
            color: #888;
            flex: 0 0 auto;
            text-align: left;
            white-space: nowrap;
        }

    .os-orderno[b-mren7qogja] {
        font-size: 15px !important;
    }

    /* 操作单元格：按钮占满整行 */
    .os-action-cell[b-mren7qogja] {
        justify-content: stretch !important;
    }

        .os-action-cell[b-mren7qogja]::before {
            content: none !important;
        }

    .os-select-btn[b-mren7qogja] {
        width: 100%;
        font-size: 14px;
        padding: 9px 10px;
    }
}

/* —— 暗色主题适配 —— */
.cc-dark[b-mren7qogja]  .os-modal {
    background: #1f1f1f;
    color: #e6e6e6;
}

.cc-dark[b-mren7qogja]  .os-search-bar {
    border-bottom-color: #3a3a3a;
}

.cc-dark[b-mren7qogja]  .os-search-input {
    background: #1f1f1f;
    border-color: #3a3a3a;
    color: #e6e6e6;
}

.cc-dark[b-mren7qogja]  .os-body {
    background: #1f1f1f;
}

.cc-dark[b-mren7qogja]  .os-footer {
    background: #2a2a2a;
    border-top-color: #3a3a3a;
}

.cc-dark[b-mren7qogja]  .os-table {
    color: #e6e6e6;
}

.cc-dark[b-mren7qogja]  .os-table thead {
    background: #262626;
}

.cc-dark[b-mren7qogja]  .os-table th {
    color: #a0a0a0;
    border-bottom-color: #3a3a3a;
}

.cc-dark[b-mren7qogja]  .os-table td {
    border-bottom-color: #3a3a3a;
}

.cc-dark[b-mren7qogja]  .os-row:hover {
    background-color: #303030 !important;
}

.cc-dark[b-mren7qogja]  .os-orderno {
    color: #4ea1ff;
}

.cc-dark[b-mren7qogja]  .os-blue-text {
    color: #4ea1ff;
}

.cc-dark[b-mren7qogja]  .os-empty {
    color: #9aa0a6;
}

@media (max-width: 768px) {
    .cc-dark[b-mren7qogja]  .os-table tr {
        background: #2a2a2a;
        border-color: #3a3a3a;
    }

    .cc-dark[b-mren7qogja]  .os-table td {
        border-bottom-color: #3a3a3a;
    }

        .cc-dark[b-mren7qogja]  .os-table td::before {
            color: #9aa0a6;
        }
}

/*!* =========================================================================*/
/*   ✅ Bootstrap 工具类兜底（仅作用于本组件，使用 ::deep 限定作用域）*/
/*   原因：DevExpress 的 Bootstrap 系列主题自带 Bootstrap CSS，但 Fluent_Light /*/
/*   Fluent_Dark 等主题不带 Bootstrap，本页面里大量使用了 .btn / .row / .col-12 /*/
/*   .d-flex / .badge / .table / .progress / .rounded-circle / .me-*!.mb-* 等类，*/
/*   导致在 Fluent 主题下样式失效。*/
/*   这里只为本页面所需的类提供最小兜底，scoped CSS + ::deep 保证其它页面与*/
/*   Bootstrap 主题完全不受影响。  ========================================================================= *!*/

/* layout */
[b-mren7qogja] .row { display: flex; flex-wrap: wrap; margin-right: -8px; margin-left: -8px; }
[b-mren7qogja] .row > [class^="col-"], [b-mren7qogja] .row > [class*=" col-"] { padding-right: 8px; padding-left: 8px; box-sizing: border-box; }
[b-mren7qogja] .col-12 { flex: 0 0 100%; max-width: 100%; }

/* flex helpers */
[b-mren7qogja] .d-flex { display: flex !important; }
[b-mren7qogja] .d-inline-flex { display: inline-flex !important; }
[b-mren7qogja] .flex-column { flex-direction: column !important; }
[b-mren7qogja] .justify-content-start { justify-content: flex-start !important; }
[b-mren7qogja] .justify-content-center { justify-content: center !important; }
[b-mren7qogja] .justify-content-between { justify-content: space-between !important; }
[b-mren7qogja] .justify-content-end { justify-content: flex-end !important; }
[b-mren7qogja] .align-items-center { align-items: center !important; }
[b-mren7qogja] .align-items-start { align-items: flex-start !important; }
[b-mren7qogja] .align-items-end { align-items: flex-end !important; }

/* position */
[b-mren7qogja] .position-relative { position: relative !important; }
[b-mren7qogja] .position-absolute { position: absolute !important; }

/* sizing */
[b-mren7qogja] .w-100 { width: 100% !important; }
[b-mren7qogja] .h-100 { height: 100% !important; }

/* spacing (BS 0.25rem step) */
[b-mren7qogja] .m-0 { margin: 0 !important; }
[b-mren7qogja] .mt-0 { margin-top: 0 !important; } [b-mren7qogja] .mb-0 { margin-bottom: 0 !important; }
[b-mren7qogja] .ms-0 { margin-left: 0 !important; } [b-mren7qogja] .me-0 { margin-right: 0 !important; }
[b-mren7qogja] .mt-1 { margin-top: .25rem !important; } [b-mren7qogja] .mb-1 { margin-bottom: .25rem !important; }
[b-mren7qogja] .ms-1 { margin-left: .25rem !important; } [b-mren7qogja] .me-1 { margin-right: .25rem !important; }
[b-mren7qogja] .mt-2 { margin-top: .5rem !important; } [b-mren7qogja] .mb-2 { margin-bottom: .5rem !important; }
[b-mren7qogja] .ms-2 { margin-left: .5rem !important; } [b-mren7qogja] .me-2 { margin-right: .5rem !important; }
[b-mren7qogja] .mt-3 { margin-top: 1rem !important; } [b-mren7qogja] .mb-3 { margin-bottom: 1rem !important; }
[b-mren7qogja] .p-0 { padding: 0 !important; }
[b-mren7qogja] .py-1 { padding-top: .25rem !important; padding-bottom: .25rem !important; }
[b-mren7qogja] .py-2 { padding-top: .5rem !important; padding-bottom: .5rem !important; }
[b-mren7qogja] .py-3 { padding-top: 1rem !important; padding-bottom: 1rem !important; }
[b-mren7qogja] .px-1 { padding-left: .25rem !important; padding-right: .25rem !important; }
[b-mren7qogja] .px-2 { padding-left: .5rem !important; padding-right: .5rem !important; }
[b-mren7qogja] .px-3 { padding-left: 1rem !important; padding-right: 1rem !important; }
[b-mren7qogja] .gap-1 { gap: .25rem !important; }
[b-mren7qogja] .gap-2 { gap: .5rem !important; }
[b-mren7qogja] .gap-3 { gap: 1rem !important; }

/* text */
[b-mren7qogja] .text-center { text-align: center !important; }
[b-mren7qogja] .text-start { text-align: left !important; }
[b-mren7qogja] .text-end { text-align: right !important; }
[b-mren7qogja] .text-white { color: #fff !important; }
[b-mren7qogja] .text-muted { color: #6c757d !important; }
[b-mren7qogja] .fw-semibold { font-weight: 600 !important; }
[b-mren7qogja] .fw-bold { font-weight: 700 !important; }

/* backgrounds */
[b-mren7qogja] .bg-primary { background-color: #0d6efd !important; color: #fff; }
[b-mren7qogja] .bg-light { background-color: #f8f9fa !important; }
[b-mren7qogja] .bg-secondary { background-color: #6c757d !important; color: #fff; }
[b-mren7qogja] .bg-success { background-color: #198754 !important; color: #fff; }
[b-mren7qogja] .bg-danger { background-color: #dc3545 !important; color: #fff; }
[b-mren7qogja] .bg-warning { background-color: #ffc107 !important; color: #212529; }
[b-mren7qogja] .bg-info { background-color: #0dcaf0 !important; color: #212529; }

/* borders / radius */
[b-mren7qogja] .rounded { border-radius: .375rem !important; }
[b-mren7qogja] .rounded-circle { border-radius: 50% !important; }
[b-mren7qogja] .border { border: 1px solid #dee2e6 !important; }

/* buttons */
[b-mren7qogja] .btn {
    display: inline-block;
    font-weight: 400;
    line-height: 1.5;
    color: #212529;
    text-align: center;
    text-decoration: none;
    vertical-align: middle;
    cursor: pointer;
    user-select: none;
    background-color: transparent;
    border: 1px solid transparent;
    padding: .375rem .75rem;
    font-size: 1rem;
    border-radius: .375rem;
    transition: color .15s, background-color .15s, border-color .15s, box-shadow .15s;
}
[b-mren7qogja] .btn:hover { filter: brightness(0.95); }
[b-mren7qogja] .btn:disabled, [b-mren7qogja] .btn.disabled { opacity: .65; cursor: not-allowed; }
[b-mren7qogja] .btn-sm { padding: .25rem .5rem; font-size: .875rem; border-radius: .25rem; }
[b-mren7qogja] .btn-primary { color: #fff; background-color: #0d6efd; border-color: #0d6efd; }
[b-mren7qogja] .btn-secondary { color: #fff; background-color: #6c757d; border-color: #6c757d; }
[b-mren7qogja] .btn-outline-primary { color: #0d6efd; border-color: #0d6efd; background-color: transparent; }
[b-mren7qogja] .btn-outline-primary:hover { color: #fff; background-color: #0d6efd; }

/* card */
[b-mren7qogja] .card {
    position: relative;
    display: flex;
    flex-direction: column;
    min-width: 0;
    word-wrap: break-word;
    background-color: #fff;
    background-clip: border-box;
    border: 1px solid rgba(0, 0, 0, 0.125);
    border-radius: .375rem;
}

/* badge */
[b-mren7qogja] .badge {
    display: inline-block;
    padding: .35em .65em;
    font-size: .75em;
    font-weight: 700;
    line-height: 1;
    color: #fff;
    text-align: center;
    white-space: nowrap;
    vertical-align: baseline;
    border-radius: .375rem;
    background-color: #6c757d;
}

/* progress */
[b-mren7qogja] .progress {
    display: flex;
    height: 1rem;
    overflow: hidden;
    font-size: .75rem;
    background-color: #e9ecef;
    border-radius: .375rem;
}
[b-mren7qogja] .progress-bar {
    display: flex;
    flex-direction: column;
    justify-content: center;
    overflow: hidden;
    color: #fff;
    text-align: center;
    white-space: nowrap;
    background-color: #0d6efd;
    transition: width .6s ease;
}

/* table */
[b-mren7qogja] .table {
    width: 100%;
    margin-bottom: 1rem;
    color: #212529;
    vertical-align: top;
    border-color: #dee2e6;
    border-collapse: collapse;
}
[b-mren7qogja] .table > :not(caption) > * > * {
    padding: .5rem .5rem;
    border-bottom-width: 1px;
    border-bottom-style: solid;
    border-bottom-color: #dee2e6;
    background-color: transparent;
}
[b-mren7qogja] .table-sm > :not(caption) > * > * { padding: .25rem .25rem; }
[b-mren7qogja] .table-hover > tbody > tr:hover > * { background-color: rgba(0, 0, 0, 0.075); }

/* =========================================================================
   ✅ Fluent_Dark / 暗色主题适配
   通过 razor 顶层 div 上的 .cc-dark 类（由 ThemesService.IsDark 决定）作为
   作用域开关，仅当本页面处于暗色主题时才覆盖颜色，不影响 Bootstrap / 亮色主题。
   说明：以下规则等价于 [b-xxx].cc-dark XXX，cc-root 在 razor 模板中，因此
   能正确接收 scoped CSS 的属性，::deep 之后的选择器作用于其内部所有后代。
   ========================================================================= */

/* —— 页面级别区域容器 —— */
.cc-dark[b-mren7qogja]  .side-panel { background: #1f1f1f !important; color: #e6e6e6; }
.cc-dark[b-mren7qogja]  .center-panel { background: #141414 !important; color: #e6e6e6; }

/* —— 卡片 / 信息块 —— */
.cc-dark[b-mren7qogja]  .card-white {
    background: #2a2a2a !important;
    border-color: #3a3a3a !important;
    color: #e6e6e6;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.4);
}

/* —— 文本 —— */
.cc-dark[b-mren7qogja]  .info-label { color: #b0b0b0 !important; }
.cc-dark[b-mren7qogja]  .info-value { color: #f0f0f0 !important; }
.cc-dark[b-mren7qogja]  .section-title-blue {
    color: #4ea1ff !important;
    border-bottom-color: #3a3a3a !important;
}
.cc-dark[b-mren7qogja]  .text-muted { color: #9aa0a6 !important; }

/* —— Bootstrap 兜底类的暗色配色 —— */
.cc-dark[b-mren7qogja]  .card {
    background-color: #2a2a2a !important;
    border-color: #3a3a3a !important;
    color: #e6e6e6;
}
.cc-dark[b-mren7qogja]  .bg-light { background-color: #2a2a2a !important; color: #e6e6e6; }
.cc-dark[b-mren7qogja]  .border { border-color: #3a3a3a !important; }
.cc-dark[b-mren7qogja]  .table { color: #e6e6e6 !important; border-color: #3a3a3a !important; }
.cc-dark[b-mren7qogja]  .table > :not(caption) > * > * { border-bottom-color: #3a3a3a !important; }
.cc-dark[b-mren7qogja]  .table-hover > tbody > tr:hover > * { background-color: rgba(255, 255, 255, 0.06) !important; }
.cc-dark[b-mren7qogja]  .progress { background-color: #333 !important; }

/* —— 按钮（次要按钮在暗色下保持可读） —— */
.cc-dark[b-mren7qogja]  .btn { color: #e6e6e6; }
.cc-dark[b-mren7qogja]  .btn-outline-primary { color: #4ea1ff; border-color: #4ea1ff; }
.cc-dark[b-mren7qogja]  .btn-outline-primary:hover { color: #fff; background-color: #2563eb; }

/* —— 输入框 / 表格内输入 —— */
.cc-dark[b-mren7qogja]  input,
.cc-dark[b-mren7qogja]  select,
.cc-dark[b-mren7qogja]  textarea,
.cc-dark[b-mren7qogja]  .weight-input {
    background-color: #1f1f1f !important;
    border-color: #3a3a3a !important;
    color: #e6e6e6 !important;
}

/* —— 弹窗（popup） —— */
.cc-dark[b-mren7qogja]  .popup-content { background: #1f1f1f; color: #e6e6e6; }
.cc-dark[b-mren7qogja]  .popup-body { background: #1f1f1f; }
.cc-dark[b-mren7qogja]  .popup-footer { background: #2a2a2a; border-top-color: #3a3a3a; }
.cc-dark[b-mren7qogja]  .weight-table thead { background: #2a2a2a; }
.cc-dark[b-mren7qogja]  .weight-table th { color: #e6e6e6; border-bottom-color: #3a3a3a; }
.cc-dark[b-mren7qogja]  .weight-table td { border-bottom-color: #3a3a3a; }
.cc-dark[b-mren7qogja]  .btn-cancel {
    background: #2a2a2a;
    border-color: #3a3a3a;
    color: #d0d0d0;
}
.cc-dark[b-mren7qogja]  .empty-state { color: #9aa0a6; }

/* —— PDF iframe 在暗色下也保留白底（PDF 内容自身就是白的） —— */
.cc-dark[b-mren7qogja]  .pdf-tab-iframe { background-color: #fff; }

/* =========================================================================
   ✅ 内联硬编码颜色的暗色覆写
   .razor 模板里大量使用 style="background: white / #f5f5f5; color: #333 ..."
   这些内联样式优先级高于普通 CSS。这里通过属性选择器 + !important 在暗色主题
   下批量纠正常见的浅色硬编码值，且仅在 .cc-dark 范围内生效。
   ========================================================================= */

/* 浅色背景 → 暗色面板 */
.cc-dark[b-mren7qogja]  [style*="background: white"],
.cc-dark[b-mren7qogja]  [style*="background:#fff"],
.cc-dark[b-mren7qogja]  [style*="background: #fff"],
.cc-dark[b-mren7qogja]  [style*="background-color: white"],
.cc-dark[b-mren7qogja]  [style*="background-color:#fff"],
.cc-dark[b-mren7qogja]  [style*="background-color: #fff"] {
    background: #2a2a2a !important;
    background-color: #2a2a2a !important;
    color: #e6e6e6;
}

.cc-dark[b-mren7qogja]  [style*="background: #f5f5f5"],
.cc-dark[b-mren7qogja]  [style*="background:#f5f5f5"],
.cc-dark[b-mren7qogja]  [style*="background: #fafafa"],
.cc-dark[b-mren7qogja]  [style*="background:#fafafa"],
.cc-dark[b-mren7qogja]  [style*="background: #fafbfc"],
.cc-dark[b-mren7qogja]  [style*="background:#fafbfc"],
.cc-dark[b-mren7qogja]  [style*="background: #f5f7fa"],
.cc-dark[b-mren7qogja]  [style*="background: #f0f0f0"],
.cc-dark[b-mren7qogja]  [style*="background: #f6ffed"],
.cc-dark[b-mren7qogja]  [style*="background: #f8f9fa"],
.cc-dark[b-mren7qogja]  [style*="background:#f8f9fa"],
.cc-dark[b-mren7qogja]  [style*="background: #d9d9d9"] {
    background: #262626 !important;
    color: #e6e6e6;
}

/* 信息提示蓝条 / 警告黄条 */
.cc-dark[b-mren7qogja]  [style*="background: #e6f7ff"] {
    background: #0f2a44 !important; color: #cfe6ff !important;
    border-color: #1f4e7a !important;
}
.cc-dark[b-mren7qogja]  [style*="background: #fff7e6"] {
    background: #3a2a10 !important; color: #ffd591 !important;
    border-color: #6b4a1a !important;
}

/* 渐变背景（左侧滚动区） */
.cc-dark[b-mren7qogja]  [style*="linear-gradient(180deg, #fafbfc"],
.cc-dark[b-mren7qogja]  [style*="linear-gradient(180deg,#fafbfc"] {
    background: linear-gradient(180deg, #1a1a1a 0%, #141414 100%) !important;
}

/* 浅色边框 */
.cc-dark[b-mren7qogja]  [style*="border: 1px solid #e8e8e8"],
.cc-dark[b-mren7qogja]  [style*="border: 1px solid #e0e6ed"],
.cc-dark[b-mren7qogja]  [style*="border: 1px solid #e0e0e0"],
.cc-dark[b-mren7qogja]  [style*="border-bottom: 1px solid #e8e8e8"],
.cc-dark[b-mren7qogja]  [style*="border-bottom: 1px solid #e9ecef"],
.cc-dark[b-mren7qogja]  [style*="border-bottom: 1px solid #e0e6ed"],
.cc-dark[b-mren7qogja]  [style*="border-top: 1px solid #e0e6ed"],
.cc-dark[b-mren7qogja]  [style*="border-bottom: 2px solid #e0e0e0"],
.cc-dark[b-mren7qogja]  [style*="border-color: #e8e8e8"] {
    border-color: #3a3a3a !important;
}

/* 暗色文字（覆盖内联 #333 / #666 / #999） */
.cc-dark[b-mren7qogja]  [style*="color: #333"] { color: #f0f0f0 !important; }
.cc-dark[b-mren7qogja]  [style*="color:#333"] { color: #f0f0f0 !important; }
.cc-dark[b-mren7qogja]  [style*="color: #666"] { color: #b8b8b8 !important; }
.cc-dark[b-mren7qogja]  [style*="color:#666"] { color: #b8b8b8 !important; }
.cc-dark[b-mren7qogja]  [style*="color: #999"] { color: #909090 !important; }
.cc-dark[b-mren7qogja]  [style*="color:#999"] { color: #909090 !important; }
.cc-dark[b-mren7qogja]  [style*="color: #888"] { color: #a0a0a0 !important; }
.cc-dark[b-mren7qogja]  [style*="color:#888"] { color: #a0a0a0 !important; }
.cc-dark[b-mren7qogja]  [style*="color: #bbb"] { color: #888 !important; }
.cc-dark[b-mren7qogja]  [style*="color: #ccc"] { color: #777 !important; }
.cc-dark[b-mren7qogja]  [style*="color: #6c757d"] { color: #a0a6ad !important; }
.cc-dark[b-mren7qogja]  [style*="color: #d46b08"] { color: #ffd591 !important; }

/* 暗底里成功/警告/错误文字保持原色但稍微提亮 */
.cc-dark[b-mren7qogja]  [style*="color: #155724"] { color: #4ade80 !important; }
.cc-dark[b-mren7qogja]  [style*="color: #721c24"] { color: #ff7875 !important; }

/* 蓝色链接稍微调亮以提高暗底对比度 */
.cc-dark[b-mren7qogja]  [style*="color: #1890ff"] { color: #4ea1ff !important; }

/* 下划线 / hr */
.cc-dark[b-mren7qogja]  hr[style*="#e8e8e8"] { border-color: #3a3a3a !important; }

/* sticky 表头浅灰 → 暗色 */
.cc-dark[b-mren7qogja]  thead[style*="background: #f5f5f5"],
.cc-dark[b-mren7qogja]  thead[style*="background:#f5f5f5"] {
    background: #262626 !important;
}

/* 卡片浅色阴影在暗底下不明显，加个深色阴影 */
.cc-dark[b-mren7qogja]  [style*="box-shadow: 0 2px 8px rgba(0,0,0,0.04)"] {
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.5) !important;
}
/* /Components/Pages/Inspection/DefectRegistration.razor.rz.scp.css */
/* =========================================================
   DefectRegistration scoped styles
   目标：手机 / iPad（横竖屏）/ 桌面 同一套响应式样式
   ========================================================= */

/* --------- 根容器 --------- */
.dr-root[b-tdn7mz6qc2] {
    --dr-bg: #f4f6f9;
    --dr-card: #ffffff;
    --dr-border: #e5e9f0;
    --dr-text: #1f2937;
    --dr-text-muted: #6b7280;
    --dr-primary: #1890ff;
    --dr-primary-dark: #096dd9;
    --dr-danger: #ff4d4f;
    --dr-warning: #faad14;
    --dr-success: #52c41a;
    --dr-shadow: 0 1px 3px rgba(0, 0, 0, 0.06), 0 1px 2px rgba(0, 0, 0, 0.04);

    display: flex;
    flex-direction: column;
    height: calc(100vh - 120px);
    min-height: 540px;
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
    background: var(--dr-bg);
    color: var(--dr-text);
    font-size: 13px;
    overflow: hidden;
    overscroll-behavior: contain;
    -webkit-tap-highlight-color: transparent;
}

.dr-root.dr-dark[b-tdn7mz6qc2] {
    --dr-bg: #1f2329;
    --dr-card: #2a2f37;
    --dr-border: #3a414b;
    --dr-text: #e6e8eb;
    --dr-text-muted: #9aa3af;
    --dr-shadow: 0 1px 3px rgba(0, 0, 0, 0.4);
}

/* --------- 顶部条 --------- */
.dr-header[b-tdn7mz6qc2] {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
    padding: 6px 10px;
    background: var(--dr-card);
    border-bottom: 1px solid var(--dr-border);
    box-shadow: var(--dr-shadow);
    z-index: 5;
}

.dr-header-left[b-tdn7mz6qc2],
.dr-header-center[b-tdn7mz6qc2],
.dr-header-right[b-tdn7mz6qc2] {
    display: flex;
    align-items: center;
    gap: 6px;
}

.dr-header-left[b-tdn7mz6qc2] { flex: 1 1 280px; }
.dr-header-center[b-tdn7mz6qc2] { flex: 0 0 auto; }
.dr-header-right[b-tdn7mz6qc2] { margin-left: auto; }

.dr-label[b-tdn7mz6qc2] {
    font-weight: 600;
    color: var(--dr-text-muted);
    font-size: 12px;
}

.dr-order-input[b-tdn7mz6qc2] {
    flex: 1;
    min-width: 160px;
    max-width: 280px;
    height: 32px;
    padding: 0 10px;
    font-size: 14px;
    border: 1px solid var(--dr-border);
    border-radius: 6px;
    background: var(--dr-card);
    color: var(--dr-text);
    outline: none;
    transition: border-color .2s;
}

.dr-order-input:focus[b-tdn7mz6qc2] { border-color: var(--dr-primary); }

/* --------- 色号 / 尺码下拉 --------- */
.dr-cs-select[b-tdn7mz6qc2] {
    height: 32px;
    min-width: 120px;
    max-width: 200px;
    padding: 0 8px;
    font-size: 13px;
    border: 1px solid var(--dr-border);
    border-radius: 6px;
    background: var(--dr-card);
    color: var(--dr-text);
    outline: none;
    cursor: pointer;
    transition: border-color .2s;
}

.dr-cs-select:focus[b-tdn7mz6qc2] { border-color: var(--dr-primary); }

/* --------- 尺码：平板平铺直选（替代下拉） --------- */
.dr-size-chips[b-tdn7mz6qc2] {
    display: flex;
    flex-wrap: nowrap;            /* 不换行，避免窄屏撑高顶部条导致错乱 */
    align-items: center;
    gap: 6px;
    flex: 1 1 auto;
    min-width: 0;                 /* 允许在 flex 容器内收缩 */
    max-width: 520px;
    overflow-x: auto;             /* 尺码过多时横向滚动 */
    overflow-y: hidden;
    scrollbar-width: thin;
    -webkit-overflow-scrolling: touch;
    padding-bottom: 2px;
}

.dr-size-chips[b-tdn7mz6qc2]::-webkit-scrollbar { height: 4px; }
.dr-size-chips[b-tdn7mz6qc2]::-webkit-scrollbar-thumb {
    background: rgba(0, 0, 0, .2);
    border-radius: 2px;
}

.dr-size-chip[b-tdn7mz6qc2] {
    flex: 0 0 auto;              /* 保持原始尺寸，不被压缩 */
    min-width: 40px;
    height: 32px;
    padding: 0 12px;
    font-size: 13px;
    font-weight: 600;
    border: 1px solid var(--dr-border);
    border-radius: 6px;
    background: var(--dr-card);
    color: var(--dr-text);
    cursor: pointer;
    outline: none;
    transition: all .15s;
    -webkit-tap-highlight-color: transparent;
}

.dr-size-chip:hover[b-tdn7mz6qc2] { border-color: var(--dr-primary); }

.dr-size-chip.active[b-tdn7mz6qc2] {
    background: var(--dr-primary);
    border-color: var(--dr-primary);
    color: #fff;
    box-shadow: 0 2px 6px rgba(24, 144, 255, .35);
}

.dr-size-empty[b-tdn7mz6qc2] {
    font-size: 13px;
    color: var(--dr-text-muted);
}


/* 已登记面板上下文标签 */
.dr-cs-tag[b-tdn7mz6qc2] {
    display: inline-block;
    padding: 2px 10px;
    border-radius: 11px;
    background: rgba(24, 144, 255, .12);
    color: var(--dr-primary);
    font-size: 12px;
    font-weight: 600;
    white-space: nowrap;
}.dr-total-label[b-tdn7mz6qc2] {
    color: var(--dr-text-muted);
    font-size: 12px;
}

.dr-total-badge[b-tdn7mz6qc2] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 36px;
    height: 26px;
    padding: 0 10px;
    border-radius: 13px;
    background: linear-gradient(135deg, #ff4d4f 0%, #ff7875 100%);
    color: #fff;
    font-weight: 700;
    font-size: 14px;
    box-shadow: 0 1px 4px rgba(255, 77, 79, .35);
}

.dr-total-sub[b-tdn7mz6qc2] { color: var(--dr-text-muted); font-size: 11px; }

/* --------- 正品数量录入入口按钮 --------- */
.dr-quality-entry[b-tdn7mz6qc2] {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    height: 32px;
    padding: 0 14px;
    margin-right: 8px;
    border-radius: 6px;
    background: rgba(82, 196, 26, .1);
    border: 1px solid rgba(82, 196, 26, .35);
    color: #389e0d;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    white-space: nowrap;
    transition: background-color .2s, transform .1s;
}

.dr-quality-entry:hover[b-tdn7mz6qc2] { background: rgba(82, 196, 26, .18); }
.dr-quality-entry:active[b-tdn7mz6qc2] { transform: scale(0.97); }

.dr-quality-entry-num[b-tdn7mz6qc2] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 30px;
    height: 22px;
    padding: 0 8px;
    border-radius: 11px;
    background: linear-gradient(135deg, #52c41a 0%, #73d13d 100%);
    color: #fff;
    font-weight: 700;
    font-size: 13px;
}

.dr-quality-entry-saved[b-tdn7mz6qc2] { color: var(--dr-text-muted); font-size: 11px; }

.dr-root.dr-dark .dr-quality-entry[b-tdn7mz6qc2] {
    background: rgba(82, 196, 26, .15);
    border-color: rgba(82, 196, 26, .4);
    color: #95de64;
}

/* --------- 正品数量录入弹窗 --------- */
.dr-qty-popup[b-tdn7mz6qc2] { padding: 4px; }

.dr-qty-summary[b-tdn7mz6qc2] {
    font-size: 13px;
    color: var(--dr-text-muted);
    padding: 4px 2px 10px;
}
.dr-qty-summary b[b-tdn7mz6qc2] { color: var(--dr-text); }
.dr-qty-summary .dr-qty-total[b-tdn7mz6qc2] { color: #52c41a; }

.dr-qty-table-wrap[b-tdn7mz6qc2] {
    max-height: 60vh;
    overflow: auto;
    border: 1px solid var(--dr-border);
    border-radius: 8px;
}

.dr-qty-table[b-tdn7mz6qc2] {
    width: 100%;
    border-collapse: collapse;
    font-size: 13px;
}

.dr-qty-table thead th[b-tdn7mz6qc2] {
    position: sticky;
    top: 0;
    z-index: 2;
    background: var(--dr-card);
    color: var(--dr-text-muted);
    font-weight: 600;
    text-align: center;
    padding: 8px 10px;
    border-bottom: 2px solid var(--dr-border);
    white-space: nowrap;
}

.dr-qty-table tbody td[b-tdn7mz6qc2] {
    padding: 6px 10px;
    text-align: center;
    border-bottom: 1px solid var(--dr-border);
    color: var(--dr-text);
    white-space: nowrap;
}

.dr-qty-table tbody tr.has-qty[b-tdn7mz6qc2] { background: rgba(82, 196, 26, .07); }
.dr-qty-table tbody tr:hover[b-tdn7mz6qc2] { background: rgba(24, 144, 255, .06); }

.dr-qty-colorno[b-tdn7mz6qc2] { font-weight: 600; }

.dr-qty-size[b-tdn7mz6qc2] {
    display: inline-block;
    padding: 1px 8px;
    border-radius: 10px;
    background: rgba(24, 144, 255, .12);
    color: var(--dr-primary);
    font-weight: 600;
}

.dr-qty-saved-cell[b-tdn7mz6qc2] { color: var(--dr-text-muted); font-weight: 600; }

.dr-qty-table .dr-quick-btns[b-tdn7mz6qc2] { justify-content: center; }
.dr-qty-table .dr-counter-pill[b-tdn7mz6qc2] { margin: 0 auto; }

/* --------- 弹窗页脚按钮（弹窗在 .dr-root 之外渲染，需独立颜色，不依赖 CSS 变量） --------- */
.dr-popup-btn[b-tdn7mz6qc2] {
    height: 34px;
    padding: 0 18px;
    border-radius: 6px;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 5px;
    transition: background-color .2s, border-color .2s, transform .1s;
}

.dr-popup-btn:active[b-tdn7mz6qc2] { transform: scale(0.97); }
.dr-popup-btn:disabled[b-tdn7mz6qc2] { opacity: .6; cursor: not-allowed; }

.dr-popup-btn-ghost[b-tdn7mz6qc2] {
    background: #fff;
    border: 1px solid #d9d9d9;
    color: #333;
}
.dr-popup-btn-ghost:hover[b-tdn7mz6qc2] { border-color: #1890ff; color: #1890ff; }

.dr-popup-btn-primary[b-tdn7mz6qc2] {
    background: #52c41a;
    border: 1px solid #52c41a;
    color: #fff;
    box-shadow: 0 2px 6px rgba(82, 196, 26, .35);
}
.dr-popup-btn-primary:hover:not(:disabled)[b-tdn7mz6qc2] { background: #389e0d; border-color: #389e0d; }

/* --------- 快捷录入按钮（共享） --------- */
.dr-quick-btns[b-tdn7mz6qc2] {
    display: inline-flex;
    gap: 4px;
}

.dr-quick-btn[b-tdn7mz6qc2] {
    min-width: 30px;
    height: 26px;
    padding: 0 6px;
    border: 1px solid rgba(82, 196, 26, .4);
    border-radius: 13px;
    background: var(--dr-card);
    color: #52c41a;
    font-size: 12px;
    font-weight: 700;
    cursor: pointer;
    touch-action: manipulation;
    transition: background-color .15s, transform .1s, color .15s;
}

.dr-quick-btn:hover[b-tdn7mz6qc2] { background: rgba(82, 196, 26, .15); }
.dr-quick-btn:active[b-tdn7mz6qc2] { transform: scale(0.92); }

.dr-quick-btn.active[b-tdn7mz6qc2] {
    background: #52c41a;
    border-color: #52c41a;
    color: #fff;
}

.dr-root.dr-dark .dr-quick-btn[b-tdn7mz6qc2] { background: #2a2f37; }
.dr-root.dr-dark .dr-quick-btn:hover[b-tdn7mz6qc2] { background: rgba(82, 196, 26, .2); }
.dr-root.dr-dark .dr-quick-btn.active[b-tdn7mz6qc2] { background: #52c41a; color: #fff; }

/* --------- 按钮通用 --------- */
.dr-btn[b-tdn7mz6qc2] {
    height: 32px;
    padding: 0 14px;
    border: 1px solid var(--dr-border);
    border-radius: 6px;
    background: var(--dr-card);
    color: var(--dr-text);
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 5px;
    touch-action: manipulation;
    user-select: none;
    transition: transform .1s, background-color .2s, border-color .2s;
}

.dr-btn:active[b-tdn7mz6qc2] { transform: scale(0.97); }
.dr-btn:disabled[b-tdn7mz6qc2] { opacity: .55; cursor: not-allowed; }

.dr-btn-primary[b-tdn7mz6qc2] {
    background: var(--dr-primary);
    border-color: var(--dr-primary);
    color: #fff;
    box-shadow: 0 2px 6px rgba(24, 144, 255, .35);
}
.dr-btn-primary:hover:not(:disabled)[b-tdn7mz6qc2] { background: var(--dr-primary-dark); }

.dr-btn-ghost:hover[b-tdn7mz6qc2] { border-color: var(--dr-primary); color: var(--dr-primary); }

/* --------- 手机端 tab 切换（默认隐藏，移动端显示） --------- */
.dr-mobile-tabs[b-tdn7mz6qc2] {
    display: none;
    border-bottom: 1px solid var(--dr-border);
    background: var(--dr-card);
}

.dr-mobile-tabs button[b-tdn7mz6qc2] {
    flex: 1;
    height: 36px;
    border: none;
    background: transparent;
    color: var(--dr-text-muted);
    font-size: 12px;
    font-weight: 600;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
    border-bottom: 3px solid transparent;
    cursor: pointer;
    touch-action: manipulation;
}

.dr-mobile-tabs button.active[b-tdn7mz6qc2] {
    color: var(--dr-primary);
    border-bottom-color: var(--dr-primary);
}

.dr-mini-badge[b-tdn7mz6qc2] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 18px;
    height: 18px;
    padding: 0 5px;
    border-radius: 9px;
    background: var(--dr-danger);
    color: #fff;
    font-size: 10px;
    font-weight: 700;
}

/* --------- 主体布局 --------- */
.dr-body[b-tdn7mz6qc2] {
    flex: 1 1 auto;
    display: flex;
    flex-direction: row;
    gap: 4px;
    padding: 4px;
    width: 100%;
    min-width: 0;
    min-height: 0;
    box-sizing: border-box;
    overflow: hidden;
}

.dr-panel[b-tdn7mz6qc2] {
    display: flex;
    flex-direction: column;
    background: var(--dr-card);
    border: 1px solid var(--dr-border);
    border-radius: 6px;
    box-shadow: var(--dr-shadow);
    overflow: hidden;
    min-width: 0;
    min-height: 0;
}

/* 左：疵点选择 —— 固定宽度 sidebar */
.dr-panel.dr-defects[b-tdn7mz6qc2] {
    flex: 0 0 260px;
    width: 260px;
}

/* 右：已登记 —— 占据剩余全部空间 */
.dr-panel.dr-records[b-tdn7mz6qc2] {
    flex: 1 1 auto;
    width: auto;
}

.dr-panel-head[b-tdn7mz6qc2] {
    padding: 4px 6px;
    border-bottom: 1px solid var(--dr-border);
    display: flex;
    flex-direction: column;
    gap: 4px;
    background: var(--dr-card);
}

.dr-panel-title[b-tdn7mz6qc2] { font-size: 12px; font-weight: 700; color: var(--dr-text); }
.dr-panel-sub[b-tdn7mz6qc2] { font-size: 10px; color: var(--dr-text-muted); }

.dr-panel-head-top[b-tdn7mz6qc2] {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 6px;
}

.dr-records-stats[b-tdn7mz6qc2] {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 6px;
}
.dr-records-stats .dr-quality-entry[b-tdn7mz6qc2] { margin-right: 4px; }

/* --------- 搜索 + tabs --------- */
.dr-search[b-tdn7mz6qc2] {
    position: relative;
    display: flex;
    align-items: center;
}

.dr-search > i.bi-search[b-tdn7mz6qc2] {
    position: absolute;
    left: 8px;
    color: var(--dr-text-muted);
    pointer-events: none;
    font-size: 11px;
}

.dr-search input[b-tdn7mz6qc2] {
    width: 100%;
    height: 26px;
    padding: 0 26px;
    border: 1px solid var(--dr-border);
    border-radius: 5px;
    background: var(--dr-bg);
    color: var(--dr-text);
    font-size: 12px;
    outline: none;
}

.dr-search input:focus[b-tdn7mz6qc2] { border-color: var(--dr-primary); background: var(--dr-card); }

.dr-search-clear[b-tdn7mz6qc2] {
    position: absolute;
    right: 8px;
    color: var(--dr-text-muted);
    cursor: pointer;
    font-size: 15px;
}

.dr-tabs[b-tdn7mz6qc2] {
    display: flex;
    gap: 5px;
    overflow-x: auto;
    padding-bottom: 2px;
    scrollbar-width: thin;
}

.dr-tab[b-tdn7mz6qc2] {
    flex: 0 0 auto;
    min-width: 36px;
    height: 26px;
    padding: 0 8px;
    border: 1px solid var(--dr-border);
    border-radius: 13px;
    background: var(--dr-card);
    color: var(--dr-text-muted);
    font-size: 11px;
    font-weight: 600;
    cursor: pointer;
    touch-action: manipulation;
    user-select: none;
    transition: all .15s;
}

.dr-tab.active[b-tdn7mz6qc2] {
    background: var(--dr-primary);
    border-color: var(--dr-primary);
    color: #fff;
}

.dr-tab:active[b-tdn7mz6qc2] { transform: scale(0.96); }

/* --------- 疵点面板内部布局：左侧通讯录式索引条 + 右侧主区 --------- */
.dr-defects-inner[b-tdn7mz6qc2] {
    flex: 1;
    display: flex;
    flex-direction: row;
    min-height: 0;
    min-width: 0;
}

.dr-alt-strip[b-tdn7mz6qc2] {
    flex: 0 0 auto;
    width: 34px;
    overflow-y: auto;
    overflow-x: hidden;
    padding: 3px 2px;
    display: flex;
    flex-direction: column;
    gap: 2px;
    border-right: 1px solid var(--dr-border);
    background: linear-gradient(180deg, rgba(24, 144, 255, .04), transparent 60%);
    scrollbar-width: thin;
}

.dr-alt-item[b-tdn7mz6qc2] {
    width: 100%;
    min-height: 22px;
    padding: 1px 3px;
    border: none;
    border-radius: 5px;
    background: transparent;
    color: var(--dr-text-muted);
    font-size: 10px;
    font-weight: 600;
    cursor: pointer;
    touch-action: manipulation;
    user-select: none;
    word-break: break-all;
    line-height: 1.15;
    transition: background-color .15s, color .15s, transform .08s;
    text-align: center;
}

.dr-alt-item:hover[b-tdn7mz6qc2] { color: var(--dr-primary); background: rgba(24, 144, 255, .08); }
.dr-alt-item:active[b-tdn7mz6qc2] { transform: scale(0.94); }
.dr-alt-item.active[b-tdn7mz6qc2] {
    background: var(--dr-primary);
    color: #fff;
    box-shadow: 0 2px 6px rgba(24, 144, 255, .35);
}

.dr-defects-main[b-tdn7mz6qc2] {
    flex: 1 1 auto;
    display: flex;
    flex-direction: column;
    min-width: 0;
    min-height: 0;
}

/* --------- 疵点按钮网格 --------- */
.dr-defect-grid[b-tdn7mz6qc2] {
    flex: 1;
    overflow-y: auto;
    padding: 8px;
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(96px, 1fr));
    gap: 6px;
    align-content: start;
}

.dr-defect-card[b-tdn7mz6qc2] {
    position: relative;
    min-height: 64px;
    padding: 6px 4px;
    border: 1px solid var(--dr-border);
    border-radius: 8px;
    background: var(--dr-card);
    color: var(--dr-text);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 3px;
    cursor: pointer;
    touch-action: manipulation;
    user-select: none;
    transition: transform .08s, border-color .15s, background-color .15s;
    text-align: center;
}

.dr-defect-card:hover[b-tdn7mz6qc2] {
    border-color: var(--dr-primary);
    background: rgba(24, 144, 255, .06);
}
.dr-defect-card:active[b-tdn7mz6qc2] { transform: scale(0.96); }

.dr-defect-card.selected[b-tdn7mz6qc2] {
    border-color: var(--dr-primary);
    background: rgba(24, 144, 255, .12);
    box-shadow: inset 0 0 0 1px var(--dr-primary);
}

.dr-defect-name[b-tdn7mz6qc2] {
    font-size: 12px;
    font-weight: 600;
    line-height: 1.2;
    word-break: break-all;
}

.dr-defect-code[b-tdn7mz6qc2] { font-size: 10px; color: var(--dr-text-muted); }

.dr-defect-badge[b-tdn7mz6qc2] {
    position: absolute;
    top: -5px;
    right: -5px;
    min-width: 18px;
    height: 18px;
    padding: 0 5px;
    border-radius: 9px;
    background: var(--dr-danger);
    color: #fff;
    font-size: 10px;
    font-weight: 700;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 2px 4px rgba(255, 77, 79, .4);
}

/* --------- 已登记卡片 --------- */
.dr-record-grid[b-tdn7mz6qc2] {
    flex: 1;
    overflow-y: auto;
    padding: 8px;
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(190px, 1fr));
    gap: 8px;
    align-content: start;
}

.dr-record-card[b-tdn7mz6qc2] {
    position: relative;
    background: var(--dr-card);
    border: 1px solid var(--dr-border);
    border-radius: 9px;
    padding: 8px;
    display: flex;
    flex-direction: column;
    gap: 6px;
    box-shadow: var(--dr-shadow);
    transition: box-shadow .2s, transform .1s, border-color .2s;
}

.dr-record-card:hover[b-tdn7mz6qc2] {
    border-color: rgba(24, 144, 255, .35);
    box-shadow: 0 4px 14px rgba(24, 144, 255, .12);
}

/* 顶部彩色装饰条 */
.dr-record-card[b-tdn7mz6qc2]::before {
    content: "";
    position: absolute;
    left: 8px;
    right: 8px;
    top: 0;
    height: 2px;
    border-radius: 0 0 2px 2px;
    background: linear-gradient(90deg, var(--dr-primary), #69c0ff);
    opacity: .85;
}

.dr-record-head[b-tdn7mz6qc2] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 6px;
    padding-top: 2px;
}

.dr-record-name[b-tdn7mz6qc2] {
    font-size: 13px;
    font-weight: 700;
    line-height: 1.2;
    color: var(--dr-text);
    flex: 1;
    min-width: 0;
    overflow: hidden;
}
.dr-record-name small[b-tdn7mz6qc2] {
    display: block;
    font-size: 10px;
    font-weight: 500;
    color: var(--dr-text-muted);
    margin-top: 2px;
    letter-spacing: .3px;
}

/* --------- 计数 pill + 添加按钮 同一行 --------- */
.dr-counter-row[b-tdn7mz6qc2] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 6px;
}

.dr-counter-pill[b-tdn7mz6qc2] {
    display: inline-flex;
    align-items: center;
    background: linear-gradient(180deg, #f5f9ff 0%, #e8f1fd 100%);
    border: 1px solid rgba(24, 144, 255, .25);
    border-radius: 18px;
    padding: 2px;
}

.dr-root.dr-dark .dr-counter-pill[b-tdn7mz6qc2] {
    background: linear-gradient(180deg, #2f3640 0%, #2a2f37 100%);
    border-color: rgba(24, 144, 255, .35);
}

.dr-counter-btn[b-tdn7mz6qc2] {
    width: 26px;
    height: 26px;
    border-radius: 50%;
    border: none;
    background: var(--dr-card);
    color: var(--dr-primary);
    font-size: 15px;
    font-weight: 700;
    cursor: pointer;
    touch-action: manipulation;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 1px 2px rgba(0, 0, 0, .08);
    transition: background-color .15s, transform .1s;
}
.dr-counter-btn:hover[b-tdn7mz6qc2] { background: var(--dr-primary); color: #fff; }
.dr-counter-btn:active[b-tdn7mz6qc2] { transform: scale(0.9); }

.dr-counter-num[b-tdn7mz6qc2] {
    min-width: 36px;
    text-align: center;
    font-size: 15px;
    font-weight: 800;
    color: var(--dr-primary);
    padding: 0 4px;
    font-variant-numeric: tabular-nums;
}

/* --------- 通用图标按钮 --------- */
.dr-icon-btn[b-tdn7mz6qc2] {
    width: 26px;
    height: 26px;
    border-radius: 6px;
    border: 1px solid var(--dr-border);
    background: var(--dr-card);
    color: var(--dr-text-muted);
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    touch-action: manipulation;
    font-size: 12px;
    transition: all .15s;
}
.dr-icon-btn:active[b-tdn7mz6qc2] { transform: scale(0.92); }
.dr-icon-btn.dr-danger:hover[b-tdn7mz6qc2] {
    background: var(--dr-danger);
    border-color: var(--dr-danger);
    color: #fff;
}

/* --------- 相册区 --------- */
.dr-photos[b-tdn7mz6qc2] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 4px;
}

.dr-photo[b-tdn7mz6qc2] {
    position: relative;
    width: 100%;
    height: 78px;
    border-radius: 6px;
    overflow: hidden;
    border: 1px solid var(--dr-border);
    background: var(--dr-bg);
}

.dr-photo img[b-tdn7mz6qc2] {
    width: 100%;
    height: 100%;
    object-fit: cover;
    cursor: zoom-in;
    display: block;
    transition: transform .25s;
}
.dr-photo:hover img[b-tdn7mz6qc2] { transform: scale(1.06); }

.dr-photo-del[b-tdn7mz6qc2] {
    position: absolute;
    top: 3px;
    right: 3px;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    border: none;
    color: #fff;
    background: rgba(0, 0, 0, .55);
    cursor: pointer;
    font-size: 12px;
    line-height: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    transition: opacity .15s, background-color .15s;
}
.dr-photo:hover .dr-photo-del[b-tdn7mz6qc2] { opacity: 1; }
.dr-photo-del:hover[b-tdn7mz6qc2] { background: var(--dr-danger); }

/* 疵点标识（画圈）按钮 */
.dr-photo-mark[b-tdn7mz6qc2] {
    position: absolute;
    top: 3px;
    left: 3px;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    border: none;
    color: #fff;
    background: rgba(0, 0, 0, .55);
    cursor: pointer;
    font-size: 11px;
    line-height: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    transition: opacity .15s, background-color .15s;
}
.dr-photo:hover .dr-photo-mark[b-tdn7mz6qc2] { opacity: 1; }
.dr-photo-mark:hover[b-tdn7mz6qc2] { background: var(--dr-primary, #2d7dff); }

/* 触屏设备：始终显示删除按钮 */
@media (hover: none) {
    .dr-photo-del[b-tdn7mz6qc2] { opacity: 1; }
    .dr-photo-mark[b-tdn7mz6qc2] { opacity: 1; }
}

/* ===== 疵点标识标注弹窗 ===== */
.dann-body[b-tdn7mz6qc2] {
    display: flex;
    flex-direction: column;
    gap: 12px;
}
.dann-toolbar[b-tdn7mz6qc2] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 12px;
    padding-bottom: 6px;
    border-bottom: 1px solid var(--dr-border, #e3e3e3);
}
.dann-tip[b-tdn7mz6qc2] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 13px;
    color: var(--dr-text-muted, #888);
}
.dann-colors[b-tdn7mz6qc2] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}
.dann-tools-shapes[b-tdn7mz6qc2] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}
.dann-tool[b-tdn7mz6qc2] {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 4px 10px;
    font-size: 13px;
    border: 1px solid var(--dr-border, #d9d9d9);
    border-radius: 16px;
    background: var(--dr-card, #fff);
    color: var(--dr-text, #333);
    cursor: pointer;
    transition: border-color .15s, background-color .15s, color .15s;
}
.dann-tool:hover[b-tdn7mz6qc2] { border-color: var(--dr-primary, #2d7dff); }
.dann-tool.active[b-tdn7mz6qc2] {
    border-color: var(--dr-primary, #2d7dff);
    background: var(--dr-primary, #2d7dff);
    color: #fff;
}
.dann-tool i[b-tdn7mz6qc2] { font-size: 14px; }
.dann-color[b-tdn7mz6qc2] {
    width: 24px;
    height: 24px;
    border-radius: 50%;
    border: 2px solid transparent;
    cursor: pointer;
    box-shadow: 0 0 0 1px rgba(0, 0, 0, .15) inset;
    transition: transform .1s, border-color .15s;
}
.dann-color.active[b-tdn7mz6qc2] {
    border-color: var(--dr-text, #222);
    transform: scale(1.15);
}
.dann-widths[b-tdn7mz6qc2] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}
.dann-width[b-tdn7mz6qc2] {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 4px 10px;
    font-size: 13px;
    border: 1px solid var(--dr-border, #d9d9d9);
    border-radius: 16px;
    background: var(--dr-card, #fff);
    color: var(--dr-text, #333);
    cursor: pointer;
    transition: border-color .15s, background-color .15s;
}
.dann-width:hover[b-tdn7mz6qc2] { border-color: var(--dr-primary, #2d7dff); }
.dann-width.active[b-tdn7mz6qc2] {
    border-color: var(--dr-primary, #2d7dff);
    background: var(--dr-primary, #2d7dff);
    color: #fff;
}
.dann-width-dot[b-tdn7mz6qc2] {
    display: inline-block;
    border-radius: 50%;
    background: currentColor;
    flex: 0 0 auto;
}
.dann-tools[b-tdn7mz6qc2] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-left: auto;
}
.dann-stage[b-tdn7mz6qc2] {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: flex-start;
    width: 100%;
    user-select: none;
    touch-action: none;
}
.dann-canvas[b-tdn7mz6qc2] {
    display: block;
    max-width: 100%;
    max-height: 62vh;
    width: auto;
    height: auto;
    touch-action: none;
    cursor: crosshair;
    border: 1px solid var(--dr-border, #e3e3e3);
    border-radius: 4px;
    background: #fff;
}

.dr-photo-add[b-tdn7mz6qc2] {
    width: 100%;
    aspect-ratio: 1 / 1;
    border: 2px dashed var(--dr-border);
    border-radius: 6px;
    background: var(--dr-bg);
    color: var(--dr-text-muted);
    cursor: pointer;
    display: inline-flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 3px;
    font-size: 11px;
    font-weight: 600;
    touch-action: manipulation;
    transition: all .15s;
}
.dr-photo-add i[b-tdn7mz6qc2] { font-size: 18px; line-height: 1; }
.dr-photo-add:hover[b-tdn7mz6qc2] {
    border-color: var(--dr-primary);
    color: var(--dr-primary);
    background: rgba(24, 144, 255, .06);
}
.dr-photo-add:active[b-tdn7mz6qc2] { transform: scale(0.96); }

/* 无照片占位 —— 高度与单张照片 tile 接近，保持卡片对称 */
.dr-photos-empty[b-tdn7mz6qc2] {
    width: 100%;
    min-height: 64px;
    border: 1px dashed var(--dr-border);
    border-radius: 6px;
    background: repeating-linear-gradient(
        45deg,
        var(--dr-bg),
        var(--dr-bg) 8px,
        rgba(0, 0, 0, .02) 8px,
        rgba(0, 0, 0, .02) 16px
    );
    color: var(--dr-text-muted);
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    font-size: 11px;
    font-weight: 500;
    touch-action: manipulation;
    transition: all .15s;
}
.dr-photos-empty i[b-tdn7mz6qc2] { font-size: 15px; opacity: .7; }
.dr-photos-empty:hover[b-tdn7mz6qc2] {
    border-color: var(--dr-primary);
    color: var(--dr-primary);
    background: rgba(24, 144, 255, .04);
}
.dr-photos-empty:active[b-tdn7mz6qc2] { transform: scale(0.99); }

.dr-root.dr-dark .dr-photos-empty[b-tdn7mz6qc2] {
    background: repeating-linear-gradient(
        45deg,
        var(--dr-bg),
        var(--dr-bg) 8px,
        rgba(255, 255, 255, .03) 8px,
        rgba(255, 255, 255, .03) 16px
    );
}

/* 计数器行右侧"添加照片"按钮 */
.dr-add-btn[b-tdn7mz6qc2] {
    height: 28px;
    padding: 0 10px;
    border: 1px dashed var(--dr-border);
    border-radius: 14px;
    background: var(--dr-card);
    color: var(--dr-text-muted);
    font-size: 12px;
    font-weight: 600;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 5px;
    touch-action: manipulation;
    user-select: none;
    transition: all .15s;
}
.dr-add-btn i[b-tdn7mz6qc2] { font-size: 13px; }
.dr-add-btn:hover[b-tdn7mz6qc2] {
    border-style: solid;
    border-color: var(--dr-primary);
    color: var(--dr-primary);
    background: rgba(24, 144, 255, .06);
}
.dr-add-btn:active[b-tdn7mz6qc2] { transform: scale(0.96); }

/* --------- 备注 --------- */
.dr-remark[b-tdn7mz6qc2] {
    width: 100%;
    min-height: 30px;
    max-height: 70px;
    padding: 4px 6px;
    border: 1px solid var(--dr-border);
    border-radius: 4px;
    background: var(--dr-bg);
    color: var(--dr-text);
    font-size: 11px;
    resize: vertical;
    outline: none;
    font-family: inherit;
}
.dr-remark:focus[b-tdn7mz6qc2] { border-color: var(--dr-primary); background: var(--dr-card); }

/* --------- 空状态 --------- */
.dr-empty[b-tdn7mz6qc2] {
    grid-column: 1 / -1;
    padding: 28px 16px;
    text-align: center;
    color: var(--dr-text-muted);
    font-size: 12px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 5px;
}

/* --------- 弹窗 --------- */
.dr-popup-body[b-tdn7mz6qc2] {
    display: flex;
    flex-direction: column;
    gap: 10px;
    min-width: 260px;
    max-width: 92vw;
}

.dr-popup-existing-title[b-tdn7mz6qc2] { font-size: 11px; color: var(--dr-text-muted); margin-bottom: 4px; }
.dr-popup-existing-list[b-tdn7mz6qc2] { display: flex; flex-wrap: wrap; gap: 5px; }

.dr-photo.dr-photo-sm[b-tdn7mz6qc2] {
    width: 60px;
    height: 60px;
    flex: 0 0 60px;
    aspect-ratio: unset;
}

/* --------- 图片放大预览（全屏遮罩） --------- */
.dr-preview-overlay[b-tdn7mz6qc2] {
    position: fixed;
    inset: 0;
    z-index: 9999;
    background: rgba(0, 0, 0, .88);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 24px;
    cursor: zoom-out;
    animation: dr-fade-in-b-tdn7mz6qc2 .15s ease-out;
    -webkit-backdrop-filter: blur(2px);
    backdrop-filter: blur(2px);
}

.dr-preview-img[b-tdn7mz6qc2] {
    max-width: 96vw;
    max-height: 92vh;
    object-fit: contain;
    border-radius: 6px;
    box-shadow: 0 10px 40px rgba(0, 0, 0, .6);
    cursor: default;
    touch-action: pinch-zoom;
    user-select: none;
    -webkit-user-drag: none;
}

.dr-preview-close[b-tdn7mz6qc2] {
    position: absolute;
    top: 14px;
    right: 14px;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    border: none;
    background: rgba(255, 255, 255, .15);
    color: #fff;
    font-size: 16px;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: background-color .2s, transform .1s;
    backdrop-filter: blur(4px);
}
.dr-preview-close:hover[b-tdn7mz6qc2] { background: rgba(255, 255, 255, .28); }
.dr-preview-close:active[b-tdn7mz6qc2] { transform: scale(0.92); }

@keyframes dr-fade-in-b-tdn7mz6qc2 {
    from { opacity: 0; }
    to   { opacity: 1; }
}

/* =========================================================
   响应式断点
   ========================================================= */

/* iPad 竖屏 / 中等屏：上下双栏 */
@media (max-width: 1023px) {
    .dr-body[b-tdn7mz6qc2] {
        flex-direction: column;
    }
    .dr-panel.dr-defects[b-tdn7mz6qc2] {
        flex: 0 0 45%;
        width: 100%;
    }
    .dr-panel.dr-records[b-tdn7mz6qc2] {
        flex: 1 1 auto;
        width: 100%;
    }
}

/* 手机端：单栏 + tab 切换 */
@media (max-width: 767px) {
    .dr-mobile-tabs[b-tdn7mz6qc2] { display: flex; }

    .dr-body[b-tdn7mz6qc2] {
        display: block;
        padding: 6px;
        overflow-y: hidden;
    }

    .dr-panel[b-tdn7mz6qc2] { display: none; height: 100%; width: 100%; }
    .dr-panel.mobile-active[b-tdn7mz6qc2] { display: flex; }
    .dr-panel.dr-defects[b-tdn7mz6qc2],
    .dr-panel.dr-records[b-tdn7mz6qc2] { flex: 1 1 auto; width: 100%; }

    .dr-header[b-tdn7mz6qc2] { padding: 8px 10px; gap: 8px; }
    .dr-header-left[b-tdn7mz6qc2] { flex: 1 1 100%; min-width: 0; flex-wrap: nowrap; }
    .dr-header-center[b-tdn7mz6qc2],
    .dr-header-right[b-tdn7mz6qc2] { flex: 1 1 auto; }
    .dr-header-right[b-tdn7mz6qc2] { justify-content: flex-end; }

    /* 窄屏下尺码按钮更紧凑，并保持单行横向滚动 */
    .dr-size-chips[b-tdn7mz6qc2] { max-width: none; }
    .dr-size-chip[b-tdn7mz6qc2] {
        min-width: 36px;
        height: 30px;
        padding: 0 9px;
        font-size: 13px;
    }
    .dr-cs-select[b-tdn7mz6qc2] { min-width: 96px; max-width: 150px; }

    .dr-defect-grid[b-tdn7mz6qc2] {
        grid-template-columns: repeat(auto-fill, minmax(84px, 1fr));
        gap: 6px;
        padding: 6px;
    }

    .dr-record-grid[b-tdn7mz6qc2] {
        grid-template-columns: 1fr;
        padding: 6px;
        gap: 6px;
    }
}

/* 大屏：sidebar 适当加宽，记录卡片可更密 */
@media (min-width: 1440px) {
    .dr-panel.dr-defects[b-tdn7mz6qc2] { flex: 0 0 300px; width: 300px; }
}

@media (min-width: 1920px) {
    .dr-panel.dr-defects[b-tdn7mz6qc2] { flex: 0 0 340px; width: 340px; }
}


/* ============== 快捷录入 ============== */
.dr-quick-entry-btn[b-tdn7mz6qc2] {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    gap: 5px;
    height: 32px;
    padding: 0 14px;
    font-size: 13px;
    font-weight: 600;
    border: 1px solid var(--dr-primary);
    border-radius: 6px;
    background: var(--dr-primary);
    color: #fff;
    cursor: pointer;
    outline: none;
    transition: all .15s;
    -webkit-tap-highlight-color: transparent;
    box-shadow: 0 2px 6px rgba(24, 144, 255, .35);
}
.dr-quick-entry-btn:hover[b-tdn7mz6qc2] { filter: brightness(1.05); }
.dr-quick-entry-btn:active[b-tdn7mz6qc2] { transform: scale(0.97); }
.dr-quick-entry-btn i[b-tdn7mz6qc2] { font-size: 14px; }

.dr-quick-popup[b-tdn7mz6qc2] {
    display: flex;
    flex-direction: column;
    gap: 16px;
    max-height: 72vh;
    overflow-y: auto;
}
.dr-quick-section[b-tdn7mz6qc2] { display: flex; flex-direction: column; gap: 8px; }
.dr-quick-step-title[b-tdn7mz6qc2] {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 15px;
    font-weight: 700;
    color: var(--dr-text);
}
.dr-quick-step-title small[b-tdn7mz6qc2] {
    font-weight: 400;
    font-size: 12px;
    color: var(--dr-text-muted);
}
.dr-quick-step-no[b-tdn7mz6qc2] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    background: var(--dr-primary);
    color: #fff;
    font-size: 13px;
    font-weight: 700;
}
.dr-quick-photos[b-tdn7mz6qc2] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}
.dr-quick-search[b-tdn7mz6qc2] { margin: 0; }
.dr-quick-defect-grid[b-tdn7mz6qc2] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(104px, 1fr));
    gap: 6px;
    max-height: 40vh;
    overflow-y: auto;
    padding: 2px;
}
.dr-quick-defect .dr-quick-check[b-tdn7mz6qc2] {
    position: absolute;
    top: -6px;
    right: -6px;
    font-size: 16px;
    color: var(--dr-primary);
    background: var(--dr-card);
    border-radius: 50%;
}
.dr-quick-defect[b-tdn7mz6qc2] {
    border: 1px solid #d0d7e2;
    border-radius: 10px;
    background: var(--dr-card, #fff);
    padding: 10px 6px;
    box-shadow: 0 1px 2px rgba(0, 0, 0, .04);
}
.dr-quick-defect:hover[b-tdn7mz6qc2] {
    border-color: var(--dr-primary);
    box-shadow: 0 2px 8px rgba(24, 144, 255, .18);
}
.dr-quick-defect.selected[b-tdn7mz6qc2] {
    border-color: #52c41a;
    background: rgba(82, 196, 26, .08);
    box-shadow: inset 0 0 0 1px #52c41a;
}
.dr-quick-defect .dr-defect-name[b-tdn7mz6qc2] {
    font-size: 13px;
    font-weight: 700;
    letter-spacing: .3px;
    color: #1890ff;
    line-height: 1.25;
    padding-bottom: 4px;
    border-bottom: 1px solid var(--dr-border);
}
.dr-quick-defect .dr-defect-code[b-tdn7mz6qc2] {
    margin-top: 2px;
    padding: 1px 7px;
    font-size: 10px;
    font-weight: 600;
    color: #1890ff;
    background: rgba(24, 144, 255, .10);
    border-radius: 10px;
    letter-spacing: .5px;
}
.dr-quick-defect.selected .dr-defect-name[b-tdn7mz6qc2] { color: #52c41a; border-bottom-color: #52c41a; }
.dr-quick-defect.selected .dr-defect-code[b-tdn7mz6qc2] {
    color: #fff;
    background: #52c41a;
}
/* /Components/Pages/Inspection/DefectRegistrationChoose.razor.rz.scp.css */
.sc-card-header[b-wlgl27dm4r] {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 16px 20px;
    background: linear-gradient(135deg, #ffffff 0%, #f7f9fc 100%);
    border-bottom: 1px solid #eef1f5;
    border-radius: 8px 8px 0 0;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04);
}

.sc-color-bar[b-wlgl27dm4r] {
    width: 5px;
    align-self: stretch;
    min-height: 40px;
    border-radius: 4px;
    background: linear-gradient(180deg, #1890ff 0%, #096dd9 100%);
    box-shadow: 0 2px 6px rgba(24, 144, 255, 0.35);
}

.sc-card-title[b-wlgl27dm4r] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
}

.sc-card-title h6[b-wlgl27dm4r] {
    margin: 0;
    font-size: 16px;
    font-weight: 600;
    color: #1f2d3d;
    line-height: 1.4;
    letter-spacing: 0.2px;
}

.sc-card-title p[b-wlgl27dm4r] {
    margin: 0;
    font-size: 12px;
    color: #8c98a4;
    line-height: 1.4;
}
/* /Components/Pages/Inspection/GarmentImageRegistration.razor.rz.scp.css */
/* =========================================================
   GarmentImageRegistration scoped styles
   响应式：手机 / iPad / 桌面
   ========================================================= */

.gir-root[b-0435behny0] {
    --gir-bg: #f4f6f9;
    --gir-card: #ffffff;
    --gir-border: #e5e9f0;
    --gir-text: #1f2937;
    --gir-text-muted: #6b7280;
    --gir-primary: #1890ff;
    --gir-primary-dark: #096dd9;
    --gir-danger: #ff4d4f;
    --gir-success: #52c41a;
    --gir-shadow: 0 1px 3px rgba(0,0,0,.06), 0 1px 2px rgba(0,0,0,.04);

    display: flex;
    flex-direction: column;
    min-height: 100%;
    width: 100%;
    box-sizing: border-box;
    background: var(--gir-bg);
    color: var(--gir-text);
    font-size: 13px;
    -webkit-tap-highlight-color: transparent;

    /* 让内部布局根据“容器实际宽度”而非视口宽度做响应式，
       解决本组件被嵌入到右侧内容区（宽度远小于视口）时，
       平板上仍按桌面三列布局而被挤压的问题 */
    container-type: inline-size;
    container-name: gir;
}

.gir-root.gir-dark[b-0435behny0] {
    --gir-bg: #1f2329;
    --gir-card: #2a2f37;
    --gir-border: #3a414b;
    --gir-text: #e6e8eb;
    --gir-text-muted: #9aa3af;
    --gir-shadow: 0 1px 3px rgba(0,0,0,.4);
}

/* ---------- 顶部条 ---------- */
.gir-header[b-0435behny0] {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
    padding: 6px 10px;
    background: var(--gir-card);
    border-bottom: 1px solid var(--gir-border);
    box-shadow: var(--gir-shadow);
    z-index: 5;
}

.gir-header-left[b-0435behny0],
.gir-header-center[b-0435behny0],
.gir-header-right[b-0435behny0] {
    display: flex;
    align-items: center;
    gap: 6px;
}

.gir-header-left[b-0435behny0]   { flex: 1 1 280px; }
.gir-header-center[b-0435behny0] { flex: 0 0 auto; }
.gir-header-right[b-0435behny0]  { margin-left: auto; }

.gir-label[b-0435behny0] {
    font-weight: 600;
    color: var(--gir-text-muted);
    font-size: 12px;
}

.gir-order-input[b-0435behny0] {
    flex: 1;
    min-width: 160px;
    max-width: 280px;
    height: 32px;
    padding: 0 10px;
    border: 1px solid var(--gir-border);
    border-radius: 6px;
    background: var(--gir-card);
    color: var(--gir-text);
    outline: none;
}
.gir-order-input:focus[b-0435behny0] {
    border-color: var(--gir-primary);
    box-shadow: 0 0 0 2px rgba(24,144,255,.15);
}

.gir-total-label[b-0435behny0] { color: var(--gir-text-muted); font-size: 12px; }
.gir-total-badge[b-0435behny0] {
    display: inline-block;
    padding: 2px 10px;
    background: var(--gir-primary);
    color: #fff;
    border-radius: 10px;
    font-weight: 600;
    font-size: 12px;
}
.gir-total-sub[b-0435behny0] { color: var(--gir-text-muted); font-size: 12px; }

/* ---------- 按钮 ---------- */
.gir-btn[b-0435behny0] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    height: 32px;
    padding: 0 12px;
    border: 1px solid var(--gir-border);
    border-radius: 6px;
    background: var(--gir-card);
    color: var(--gir-text);
    cursor: pointer;
    font-size: 13px;
    transition: all .15s;
}
.gir-btn:hover[b-0435behny0] { border-color: var(--gir-primary); color: var(--gir-primary); }
.gir-btn-primary[b-0435behny0] {
    background: var(--gir-primary);
    color: #fff;
    border-color: var(--gir-primary);
}
.gir-btn-primary:hover[b-0435behny0] {
    background: var(--gir-primary-dark);
    border-color: var(--gir-primary-dark);
    color: #fff;
}
.gir-btn-primary[disabled][b-0435behny0] { opacity: .6; cursor: not-allowed; }

.gir-btn-ghost[b-0435behny0] { background: transparent; }

.gir-icon-btn[b-0435behny0] {
    width: 28px;
    height: 28px;
    border: 1px solid var(--gir-border);
    border-radius: 6px;
    background: rgba(0,0,0,.04);
    color: var(--gir-text);
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 13px;
    line-height: 1;
}
.gir-root.gir-dark .gir-icon-btn[b-0435behny0] { background: rgba(255,255,255,.06); }
.gir-icon-btn i[b-0435behny0] { font-size: 13px; }
.gir-icon-btn:hover[b-0435behny0] {
    color: #fff;
    background: var(--gir-primary);
    border-color: var(--gir-primary);
}
.gir-icon-btn.gir-danger:hover[b-0435behny0] {
    background: var(--gir-danger);
    border-color: var(--gir-danger);
    color: #fff;
}

/* ---------- 主体 ---------- */
.gir-body[b-0435behny0] {
    display: grid;
    grid-template-columns: 1fr;
    gap: 12px;
    padding: 12px;
    align-items: stretch;
}

.gir-panel[b-0435behny0] {
    display: flex;
    flex-direction: column;
    background: var(--gir-card);
    border: 1px solid var(--gir-border);
    border-radius: 8px;
    box-shadow: var(--gir-shadow);
    overflow: hidden;
    min-height: 420px;
    box-sizing: border-box;
}

.gir-panel-head[b-0435behny0] {
    flex: 0 0 36px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    padding: 0 12px;
    border-bottom: 1px solid var(--gir-border);
    box-sizing: border-box;
}
.gir-panel-title[b-0435behny0] {
    font-weight: 600;
    font-size: 14px;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    white-space: nowrap;
}
.gir-panel-sub[b-0435behny0] { color: var(--gir-text-muted); font-size: 12px; }

/* ---------- 左：款式主图（结构与右侧 slot-card 完全一致） ---------- */
.gir-style-image-wrap[b-0435behny0] {
    /* 复用 .gir-slot-body 的尺寸（flex:0 0 260px），此处仅追加棋盘格背景与居中 */
    align-items: center;
    justify-content: center;
    background:
        linear-gradient(45deg, rgba(0,0,0,.025) 25%, transparent 25%) 0 0/14px 14px,
        linear-gradient(-45deg, rgba(0,0,0,.025) 25%, transparent 25%) 0 7px/14px 14px,
        linear-gradient(45deg, transparent 75%, rgba(0,0,0,.025) 75%) 7px -7px/14px 14px,
        linear-gradient(-45deg, transparent 75%, rgba(0,0,0,.025) 75%) -7px 0/14px 14px;
}
.gir-root.gir-dark .gir-style-image-wrap[b-0435behny0] {
    background:
        linear-gradient(45deg, rgba(255,255,255,.04) 25%, transparent 25%) 0 0/14px 14px,
        linear-gradient(-45deg, rgba(255,255,255,.04) 25%, transparent 25%) 0 7px/14px 14px,
        linear-gradient(45deg, transparent 75%, rgba(255,255,255,.04) 75%) 7px -7px/14px 14px,
        linear-gradient(-45deg, transparent 75%, rgba(255,255,255,.04) 75%) -7px 0/14px 14px;
}
.gir-style-image[b-0435behny0] {
    width: 100%;
    height: 100%;
    object-fit: contain;
    border-radius: 6px;
    cursor: zoom-in;
    box-shadow: var(--gir-shadow);
}
.gir-style-empty[b-0435behny0] {
    text-align: center;
    color: var(--gir-text-muted);
}
.gir-style-empty i[b-0435behny0] { font-size: 56px; display: block; margin-bottom: 6px; }
.gir-style-empty small[b-0435behny0] { display: block; margin-top: 4px; font-size: 11px; }


/* ---------- 右：拍照槽位 ---------- */
.gir-slots[b-0435behny0] { }
.gir-slot-grid[b-0435behny0] {
    display: grid;
    /* 自适应列数：容器宽时 3 列，窄时自动换行为 2 列 / 1 列，避免卡片被挤压 */
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 12px;
    padding: 12px;
}

.gir-slot-card[b-0435behny0] {
    display: flex;
    flex-direction: column;
    border: 1px solid var(--gir-border);
    border-radius: 8px;
    background: var(--gir-card);
    box-shadow: var(--gir-shadow);
    min-height: 420px;
    overflow: hidden;
    box-sizing: border-box;
    transition: border-color .15s, box-shadow .15s;
}
.gir-slot-card.is-uploaded[b-0435behny0] {
    border-color: var(--gir-success);
    box-shadow: 0 0 0 1px rgba(82,196,26,.15), var(--gir-shadow);
}

.gir-slot-head[b-0435behny0] {
    flex: 0 0 36px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 6px;
    padding: 0 10px;
    border-bottom: 1px solid var(--gir-border);
    box-sizing: border-box;
}
.gir-slot-title[b-0435behny0] {
    font-weight: 600;
    font-size: 13px;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    white-space: nowrap;
    min-width: 0;
}
.gir-slot-status[b-0435behny0] {
    font-size: 11px;
    padding: 2px 8px;
    border-radius: 10px;
    background: rgba(0,0,0,.06);
    color: var(--gir-text-muted);
    white-space: nowrap;
}
.gir-slot-card.is-uploaded .gir-slot-status[b-0435behny0] {
    background: rgba(82,196,26,.15);
    color: var(--gir-success);
}
.gir-slot-actions[b-0435behny0] { display: inline-flex; gap: 4px; }

/* 与左侧 .gir-style-image-wrap 完全一致 */
.gir-slot-body[b-0435behny0] {
    flex: 1 1 0;
    min-height: 0;
    padding: 8px;
    box-sizing: border-box;
    display: flex;
    overflow: hidden;
}
.gir-slot-body > *[b-0435behny0] { flex: 1; min-width: 0; min-height: 0; }

.gir-slot-remark-wrap[b-0435behny0] {
    flex: 0 0 50px;
    border-top: 1px solid var(--gir-border);
    padding: 6px 10px;
    display: flex;
    box-sizing: border-box;
    min-height: 0;
}
.gir-slot-remark[b-0435behny0] {
    flex: 1;
    width: 100%;
    resize: none;
    border: 1px solid var(--gir-border);
    border-radius: 6px;
    padding: 6px 8px;
    font-size: 12px;
    background: var(--gir-card);
    color: var(--gir-text);
    outline: none;
    box-sizing: border-box;
}
.gir-slot-remark:focus[b-0435behny0] {
    border-color: var(--gir-primary);
    box-shadow: 0 0 0 2px rgba(24,144,255,.15);
}

/* ---------- 放大预览 ---------- */
.gir-preview-overlay[b-0435behny0] {
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,.85);
    z-index: 10000;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: zoom-out;
}
.gir-preview-img[b-0435behny0] {
    max-width: 92vw;
    max-height: 92vh;
    object-fit: contain;
    box-shadow: 0 8px 32px rgba(0,0,0,.5);
    cursor: default;
}
.gir-preview-close[b-0435behny0] {
    position: absolute;
    top: 16px;
    right: 16px;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    border: none;
    background: rgba(255,255,255,.15);
    color: #fff;
    font-size: 18px;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}
.gir-preview-close:hover[b-0435behny0] { background: rgba(255,255,255,.3); }

/* ---------- 响应式：iPad/平板（基于容器实际宽度） ---------- */
@container gir (max-width: 1100px) {
    .gir-body[b-0435behny0] {
        grid-template-columns: 1fr;
    }

    /* 移动端：解除 420 强制高度，交给图片容器的确定高度控制 */
    .gir-panel[b-0435behny0],
    .gir-slot-card[b-0435behny0] {
        min-height: 0;
    }

    /* 四个图片容器统一为“确定高度”，保证 object-fit:contain 能一起等比缩放
       （flex:1 的不确定高度会让 <img> 的 height:100% 失效，导致左侧不缩放） */
    .gir-style-image-wrap[b-0435behny0],
    .gir-slot-body[b-0435behny0] {
        flex: 0 0 auto;
        height: 40vh;
        min-height: 240px;
        max-height: 360px;
    }
}

/* ---------- 响应式：窄容器/手机（基于容器实际宽度） ---------- */
@container gir (max-width: 720px) {
    .gir-slot-grid[b-0435behny0] { grid-template-columns: 1fr; }
    .gir-header-center[b-0435behny0] { display: none; }
    .gir-order-input[b-0435behny0] { max-width: none; }
}

/* 真实手机视口：限制整体高度 */
@media (max-width: 720px) {
    .gir-root[b-0435behny0] { height: calc(100vh - 100px); font-size: 12px; }
}

/* /Components/Pages/Inspection/SizeChart.razor.rz.scp.css */
/* =========================================================================
   ✅ SizeChart 主题 - 与 CheckControl 主题保持一致
   - 卡片：1px solid #e8e8e8 + border-radius 8px + 浅阴影
   - 主色：#1890ff，强调：#52c41a / #faad14 / #ff4d4f / #722ed1
   - 暗色：通过 .sc-dark 作用域开关，等同 cc-dark 风格
   ========================================================================= */

/* ---------- 根容器 / 卡片包装 ---------- */
.sc-root[b-23e2z0dgkw] {
    width: 100%;
    color: #333;
}

.sc-card[b-23e2z0dgkw] {
    border: 1px solid #e8e8e8;
    border-radius: 8px;
    background: white;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);
    overflow: hidden;
    margin-bottom: 12px;
}

.sc-card-header[b-23e2z0dgkw] {
    padding: 10px 12px;
    border-bottom: 1px solid #e8e8e8;
    display: flex;
    align-items: center;
    gap: 12px;
}

.sc-color-bar[b-23e2z0dgkw] {
    width: 4px;
    height: 32px;
    background: linear-gradient(180deg, #722ed1 0%, #531dab 100%);
    border-radius: 2px;
    flex-shrink: 0;
}

.sc-card-title[b-23e2z0dgkw] {
    flex: 1;
    min-width: 0;
}

    .sc-card-title h6[b-23e2z0dgkw] {
        margin: 0;
        color: #333;
        font-weight: 600;
        font-size: 14px;
    }

    .sc-card-title p[b-23e2z0dgkw] {
        margin: 4px 0 0 0;
        color: #666;
        font-size: 12px;
    }

/* ---------- 顶部操作按钮 ---------- */
.btn-quality-check[b-23e2z0dgkw] {
    padding: 6px 14px;
    background: #52c41a;
    color: white;
    border: none;
    border-radius: 4px;
    font-size: 12px;
    font-weight: 600;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 4px;
    transition: background 0.2s ease;
    white-space: nowrap;
}

    .btn-quality-check:hover[b-23e2z0dgkw] {
        background: #389e0d;
    }

    .btn-quality-check i[b-23e2z0dgkw] {
        font-size: 12px;
    }

/* ---------- 主表格滚动容器 ---------- */
[b-23e2z0dgkw] .chart-container {
    width: 100%;
    overflow-x: auto;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
    position: relative;
    scrollbar-width: thin;
    scrollbar-color: #c0c4cc #f1f1f1;
}

    [b-23e2z0dgkw] .chart-container::-webkit-scrollbar {
        height: 10px !important;
    }

    [b-23e2z0dgkw] .chart-container::-webkit-scrollbar-track {
        background: #f1f1f1 !important;
        border-radius: 5px;
    }

    [b-23e2z0dgkw] .chart-container::-webkit-scrollbar-thumb {
        background: #c0c4cc !important;
        border-radius: 5px;
    }

        [b-23e2z0dgkw] .chart-container::-webkit-scrollbar-thumb:hover {
            background: #909399 !important;
        }

[b-23e2z0dgkw] .chart-wrapper {
    width: max-content;
    min-width: 100%;
}

/* ---------- 主透视表 ---------- */
[b-23e2z0dgkw] .pivot-table {
    width: auto;
    border-collapse: collapse;
    border: 1px solid #e0e0e0;
    background: white;
    font-size: 12px;
    table-layout: fixed;
}

    [b-23e2z0dgkw] .pivot-table thead th {
        background: #f5f5f5;
        color: #333;
        font-weight: 600;
        padding: 8px 6px;
        border: 1px solid #e0e0e0;
        text-align: center;
        white-space: nowrap;
    }

[b-23e2z0dgkw] .header-fixed {
    position: sticky;
    left: 0;
    z-index: 30;
    background: #f5f5f5 !important;
    min-width: 130px;
    width: 130px;
    line-height: 1.4;
}

[b-23e2z0dgkw] .header-part-group {
    background: #f5f5f5 !important;
    font-size: 12px;
    font-weight: 700;
    border: 1px solid #e0e0e0 !important;
    padding: 6px 4px !important;
    min-width: 90px;
    width: 90px;
}

    [b-23e2z0dgkw] .header-part-group div {
        line-height: 1.3;
    }

    [b-23e2z0dgkw] .header-part-group .part-method {
        font-size: 11px;
        font-weight: 500;
        margin-top: 2px;
        color: #666;
    }

    [b-23e2z0dgkw] .header-part-group .part-check-qty {
        display: inline-block;
        font-size: 10px;
        font-weight: 600;
        margin-top: 3px;
        padding: 1px 6px;
        border-radius: 4px;
        background: #faad14;
        color: white;
    }

        [b-23e2z0dgkw] .header-part-group .part-check-qty.has-value {
            background: #ff4d4f;
        }

[b-23e2z0dgkw] .pivot-table tbody tr {
    border-bottom: 1px solid #e9ecef;
    transition: background-color 0.2s;
}

    [b-23e2z0dgkw] .pivot-table tbody tr:hover {
        background-color: #f5f9ff;
    }

[b-23e2z0dgkw] .pivot-table tbody td {
    padding: 6px 4px;
    border: 1px solid #e9ecef;
    white-space: nowrap;
}

[b-23e2z0dgkw] .tolerance-label {
    text-align: center;
    font-weight: 700;
    background: #fafafa;
    position: sticky;
    left: 0;
    z-index: 20;
    border-right: 2px solid #e0e0e0 !important;
    font-size: 12px;
    color: #333;
    min-width: 130px;
    width: 130px;
}

    [b-23e2z0dgkw] .tolerance-label.positive {
        color: #2e7d32;
    }

    [b-23e2z0dgkw] .tolerance-label.negative {
        color: #c62828;
    }

[b-23e2z0dgkw] .sc-issue-hint {
    color: #ff4d4f;
    font-size: 11px;
    margin-top: 2px;
    font-weight: 500;
}

[b-23e2z0dgkw] .cell-size-fixed {
    text-align: center;
    font-weight: 700;
    background: #fafafa;
    position: sticky;
    left: 0;
    z-index: 20;
    color: #1890ff;
    font-size: 14px;
    border-right: 2px solid #e0e0e0 !important;
    min-width: 130px;
    width: 130px;
}

[b-23e2z0dgkw] .size-row {
    background-color: #fff;
}

[b-23e2z0dgkw] .cell-value {
    text-align: center;
    font-weight: 600;
    color: #333;
    min-width: 90px;
    width: 90px;
    font-size: 13px;
}

    [b-23e2z0dgkw] .cell-value.has-value {
        background-color: #f6ffed;
    }

    [b-23e2z0dgkw] .cell-value span {
        display: inline-block;
        min-width: 28px;
    }

    [b-23e2z0dgkw] .cell-value .empty {
        color: #bbb;
        font-weight: normal;
    }

    [b-23e2z0dgkw] .cell-value .qty-red {
        color: #ff4d4f;
        font-weight: 700;
        margin: 0 2px;
    }

[b-23e2z0dgkw] .tolerance-row {
    font-size: 12px;
    font-weight: 600;
}

[b-23e2z0dgkw] .positive-row {
    background-color: #f6ffed;
    border-top: 2px solid #b7eb8f !important;
}

[b-23e2z0dgkw] .negative-row {
    background-color: #fff1f0;
    border-bottom: 2px solid #ffa39e !important;
}

[b-23e2z0dgkw] .deviation-row {
    background-color: #fffbe6;
}

[b-23e2z0dgkw] .results-row {
    background-color: #fafafa;
}

[b-23e2z0dgkw] .cell-tolerance {
    text-align: center;
    font-weight: 600;
    padding: 6px 4px !important;
    min-width: 90px;
    width: 90px;
}

    [b-23e2z0dgkw] .cell-tolerance.positive {
        color: #2e7d32;
    }

    [b-23e2z0dgkw] .cell-tolerance.negative {
        color: #c62828;
    }

    [b-23e2z0dgkw] .cell-tolerance span {
        display: inline-block;
        font-size: 12px;
    }

/* ---------- 滚动提示 ---------- */
.scroll-hint[b-23e2z0dgkw] {
    text-align: center;
    color: #666;
    font-size: 12px;
    margin: 8px 12px 12px 12px;
    padding: 6px;
    background: #fafafa;
    border-radius: 4px;
    border-left: 3px solid #1890ff;
}

    .scroll-hint i[b-23e2z0dgkw] {
        margin-right: 4px;
        color: #1890ff;
    }

/* =========================================================================
   弹窗 - 质量检查录入
   ========================================================================= */
[b-23e2z0dgkw] .modal-overlay {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.5);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1000;
    backdrop-filter: blur(2px);
}

[b-23e2z0dgkw] .modal-content-table {
    background: white;
    border-radius: 8px;
    width: 90%;
    max-width: 1000px;
    max-height: 85vh;
    display: flex;
    flex-direction: column;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.2);
    overflow: hidden;
}

[b-23e2z0dgkw] .modal-header {
    padding: 12px 16px;
    border-bottom: 1px solid #e8e8e8;
    display: flex;
    justify-content: space-between;
    align-items: center;
    background: linear-gradient(90deg, #1890ff 0%, #096dd9 100%);
    color: white;
}

    [b-23e2z0dgkw] .modal-header h3 {
        margin: 0;
        font-size: 14px;
        font-weight: 600;
        display: flex;
        align-items: center;
        gap: 6px;
    }

        [b-23e2z0dgkw] .modal-header h3 i {
            font-size: 16px;
        }

[b-23e2z0dgkw] .btn-close {
    background: rgba(255, 255, 255, 0.2);
    border: 1px solid rgba(255, 255, 255, 0.6);
    color: white;
    font-size: 14px;
    width: 28px;
    height: 28px;
    border-radius: 4px;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: all 0.2s;
}

    [b-23e2z0dgkw] .btn-close:hover {
        background: rgba(255, 255, 255, 0.35);
    }

[b-23e2z0dgkw] .modal-body {
    padding: 12px;
    overflow-y: auto;
    flex: 1;
    background: #fff;
}

[b-23e2z0dgkw] .form-group-inline {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 10px;
    padding: 10px 12px;
    background: #f5f7fa;
    border: 1px solid #e8e8e8;
    border-radius: 6px;
}

    [b-23e2z0dgkw] .form-group-inline label {
        font-weight: 600;
        color: #333;
        font-size: 12px;
        white-space: nowrap;
    }

[b-23e2z0dgkw] .form-select-inline {
    flex: 0 0 160px;
    padding: 6px 10px;
    border: 1px solid #d9d9d9;
    border-radius: 4px;
    font-size: 12px;
    font-weight: 500;
    background: white;
    transition: all 0.2s;
}

    [b-23e2z0dgkw] .form-select-inline:focus {
        outline: none;
        border-color: #1890ff;
        box-shadow: 0 0 0 2px rgba(24, 144, 255, 0.15);
    }

/* 尺码按钮选择（替代下拉，适配平板触屏） */
[b-23e2z0dgkw] .sc-size-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    flex: 1 1 auto;
}

[b-23e2z0dgkw] .sc-size-chip {
    min-width: 52px;
    height: 40px;
    padding: 0 16px;
    font-size: 15px;
    font-weight: 600;
    color: #333;
    background: #fff;
    border: 1px solid #d9d9d9;
    border-radius: 8px;
    cursor: pointer;
    transition: all 0.15s;
    -webkit-tap-highlight-color: transparent;
}

    [b-23e2z0dgkw] .sc-size-chip:hover {
        border-color: #1890ff;
        color: #1890ff;
    }

    [b-23e2z0dgkw] .sc-size-chip.active {
        background: #1890ff;
        border-color: #1890ff;
        color: #fff;
        box-shadow: 0 2px 6px rgba(24, 144, 255, 0.35);
    }

[b-23e2z0dgkw] .table-container {
    margin-top: 8px;
    overflow-x: auto;
    border: 1px solid #e8e8e8;
    border-radius: 6px;
}

[b-23e2z0dgkw] .quality-check-table {
    width: 100%;
    border-collapse: collapse;
    background: white;
    font-size: 12px;
}

    [b-23e2z0dgkw] .quality-check-table thead {
        background: #f5f5f5;
        color: #333;
        position: sticky;
        top: 0;
        z-index: 10;
    }

    [b-23e2z0dgkw] .quality-check-table th {
        padding: 8px 6px;
        text-align: center;
        font-weight: 600;
        border: 1px solid #e0e0e0;
        white-space: nowrap;
        font-size: 12px;
        color: #333;
    }

    [b-23e2z0dgkw] .quality-check-table tbody tr:nth-child(even) {
        background-color: #fafafa;
    }

    [b-23e2z0dgkw] .quality-check-table tbody tr:hover {
        background-color: #f5f9ff;
    }

    [b-23e2z0dgkw] .quality-check-table td {
        padding: 5px 4px;
        border: 1px solid #e9ecef;
        text-align: center;
    }

[b-23e2z0dgkw] .col-part-name {
    min-width: 100px;
    width: 100px;
}

[b-23e2z0dgkw] .col-method {
    min-width: 70px;
    width: 70px;
}

[b-23e2z0dgkw] .col-standard {
    min-width: 70px;
    width: 70px;
}

[b-23e2z0dgkw] .col-tolerance {
    min-width: 90px;
    width: 90px;
}

[b-23e2z0dgkw] .col-check-item {
    min-width: 90px;
    width: 90px;
}

[b-23e2z0dgkw] .col-seq {
    min-width: 44px;
    width: 44px;
}

[b-23e2z0dgkw] .cell-seq {
    color: #8c8c8c;
    font-weight: 600;
}

[b-23e2z0dgkw] .cell-part-name {
    font-weight: 600;
    color: #333;
    text-align: left;
    padding-left: 8px !important;
    font-size: 12px;
}

[b-23e2z0dgkw] .cell-method {
    padding: 4px !important;
}

[b-23e2z0dgkw] .method-badge-small {
    display: inline-block;
    background: #1890ff;
    color: white;
    padding: 2px 8px;
    border-radius: 10px;
    font-size: 11px;
    font-weight: 500;
}

[b-23e2z0dgkw] .cell-standard {
    font-weight: 700;
    color: #1890ff;
    font-size: 12px;
}

[b-23e2z0dgkw] .cell-tolerance-range {
    font-size: 11px;
    padding: 4px !important;
}

[b-23e2z0dgkw] .positive-text {
    color: #52c41a;
    font-weight: 600;
}

[b-23e2z0dgkw] .negative-text {
    color: #ff4d4f;
    font-weight: 600;
}

[b-23e2z0dgkw] .separator {
    color: #999;
    margin: 0 2px;
}

[b-23e2z0dgkw] .cell-input {
    padding: 4px !important;
}

[b-23e2z0dgkw] .cell-disabled {
    background: #fafafa;
    color: #ccc;
    font-size: 12px;
}

[b-23e2z0dgkw] .input-cell-wrapper {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
}

[b-23e2z0dgkw] .table-input {
    width: 100%;
    max-width: 75px;
    padding: 5px 22px 5px 6px;
    border: 1px solid #d9d9d9;
    border-radius: 4px;
    font-size: 12px;
    text-align: center;
    transition: all 0.2s;
    background: white;
    color: #333;
}

    [b-23e2z0dgkw] .table-input:focus {
        outline: none;
        border-color: #1890ff;
        box-shadow: 0 0 0 2px rgba(24, 144, 255, 0.15);
    }

    [b-23e2z0dgkw] .table-input.valid {
        border-color: #52c41a;
        background: #f6ffed;
    }

    [b-23e2z0dgkw] .table-input.invalid {
        border-color: #ff4d4f;
        background: #fff1f0;
    }

    [b-23e2z0dgkw] .table-input::placeholder {
        color: #ccc;
        font-size: 11px;
    }

[b-23e2z0dgkw] .validation-badge {
    position: absolute;
    right: 4px;
    width: 16px;
    height: 16px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 10px;
    font-weight: 700;
}

    [b-23e2z0dgkw] .validation-badge.valid {
        background: #52c41a;
        color: white;
    }

    [b-23e2z0dgkw] .validation-badge.invalid {
        background: #ff4d4f;
        color: white;
    }

[b-23e2z0dgkw] .modal-actions {
    margin-top: 12px;
    padding: 12px;
    border-top: 1px solid #e8e8e8;
    background: #fafafa;
    display: flex;
    gap: 8px;
    justify-content: flex-end;
}

[b-23e2z0dgkw] .btn {
    padding: 6px 16px;
    border: 1px solid transparent;
    border-radius: 4px;
    font-size: 12px;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s;
    display: inline-flex;
    align-items: center;
    gap: 4px;
}

[b-23e2z0dgkw] .btn-primary {
    background: #1890ff;
    border-color: #1890ff;
    color: white;
}

    [b-23e2z0dgkw] .btn-primary:hover {
        background: #096dd9;
        border-color: #096dd9;
    }

[b-23e2z0dgkw] .btn-secondary {
    background: white;
    border-color: #d9d9d9;
    color: #333;
}

    [b-23e2z0dgkw] .btn-secondary:hover {
        background: #fafafa;
        border-color: #1890ff;
        color: #1890ff;
    }

/* ---------- 响应式 ---------- */
@media (max-width: 768px) {
    [b-23e2z0dgkw] .chart-wrapper {
        min-width: 100%;
    }

    [b-23e2z0dgkw] .modal-content-table {
        width: 95%;
        max-height: 90vh;
    }

    [b-23e2z0dgkw] .table-input {
        max-width: 65px;
        font-size: 11px;
    }
}

/* =========================================================================
   ✅ 暗色主题（.sc-dark） - 与 CheckControl 的 .cc-dark 保持一致
   ========================================================================= */
.sc-dark[b-23e2z0dgkw] {
    color: #e6e6e6;
}

    .sc-dark .sc-card[b-23e2z0dgkw] {
        background: #2a2a2a !important;
        border-color: #3a3a3a !important;
        color: #e6e6e6;
        box-shadow: 0 2px 8px rgba(0, 0, 0, 0.5);
    }

    .sc-dark .sc-card-header[b-23e2z0dgkw] {
        border-bottom-color: #3a3a3a !important;
    }

    .sc-dark .sc-card-title h6[b-23e2z0dgkw] {
        color: #f0f0f0;
    }

    .sc-dark .sc-card-title p[b-23e2z0dgkw] {
        color: #b8b8b8;
    }

    .sc-dark .scroll-hint[b-23e2z0dgkw] {
        background: #262626;
        color: #b8b8b8;
    }

    /* 主表格 */
    .sc-dark[b-23e2z0dgkw]  .pivot-table {
        background: #2a2a2a !important;
        border-color: #3a3a3a !important;
        color: #e6e6e6;
    }

        .sc-dark[b-23e2z0dgkw]  .pivot-table thead th {
            background: #1f1f1f !important;
            color: #f0f0f0 !important;
            border-color: #3a3a3a !important;
        }

    .sc-dark[b-23e2z0dgkw]  .header-fixed,
    .sc-dark[b-23e2z0dgkw]  .header-part-group {
        background: #1f1f1f !important;
        color: #f0f0f0 !important;
        border-color: #3a3a3a !important;
    }

    .sc-dark[b-23e2z0dgkw]  .header-part-group .part-method {
        color: #a0a0a0;
    }

    .sc-dark[b-23e2z0dgkw]  .pivot-table tbody tr {
        border-bottom-color: #3a3a3a;
    }

        .sc-dark[b-23e2z0dgkw]  .pivot-table tbody tr:hover {
            background-color: rgba(24, 144, 255, 0.08);
        }

    .sc-dark[b-23e2z0dgkw]  .pivot-table tbody td {
        border-color: #3a3a3a;
        color: #e6e6e6;
    }

    .sc-dark[b-23e2z0dgkw]  .tolerance-label {
        background: #262626 !important;
        color: #f0f0f0;
        border-right-color: #3a3a3a !important;
    }

        .sc-dark[b-23e2z0dgkw]  .tolerance-label.positive {
            color: #73d13d;
        }

        .sc-dark[b-23e2z0dgkw]  .tolerance-label.negative {
            color: #ff7875;
        }

    .sc-dark[b-23e2z0dgkw]  .cell-size-fixed {
        background: #262626 !important;
        color: #4ea1ff;
        border-right-color: #3a3a3a !important;
    }

    .sc-dark[b-23e2z0dgkw]  .size-row {
        background-color: transparent;
    }

    .sc-dark[b-23e2z0dgkw]  .cell-value {
        color: #e6e6e6;
    }

        .sc-dark[b-23e2z0dgkw]  .cell-value.has-value {
            background-color: rgba(82, 196, 26, 0.12);
        }

        .sc-dark[b-23e2z0dgkw]  .cell-value .empty {
            color: #666;
        }

        .sc-dark[b-23e2z0dgkw]  .cell-value .qty-red {
            color: #ff7875;
        }

    .sc-dark[b-23e2z0dgkw]  .positive-row {
        background-color: rgba(82, 196, 26, 0.08);
        border-top-color: #389e0d !important;
    }

    .sc-dark[b-23e2z0dgkw]  .negative-row {
        background-color: rgba(255, 77, 79, 0.08);
        border-bottom-color: #cf1322 !important;
    }

    .sc-dark[b-23e2z0dgkw]  .deviation-row {
        background-color: rgba(250, 173, 20, 0.08);
    }

    .sc-dark[b-23e2z0dgkw]  .results-row {
        background-color: #262626;
    }

    .sc-dark[b-23e2z0dgkw]  .cell-tolerance.positive {
        color: #73d13d;
    }

    .sc-dark[b-23e2z0dgkw]  .cell-tolerance.negative {
        color: #ff7875;
    }

    /* 滚动条暗色 */
    .sc-dark[b-23e2z0dgkw]  .chart-container {
        scrollbar-color: #555 #1f1f1f;
    }

        .sc-dark[b-23e2z0dgkw]  .chart-container::-webkit-scrollbar-track {
            background: #1f1f1f !important;
        }

        .sc-dark[b-23e2z0dgkw]  .chart-container::-webkit-scrollbar-thumb {
            background: #555 !important;
        }

    /* 弹窗暗色 */
    .sc-dark[b-23e2z0dgkw]  .modal-content-table {
        background: #2a2a2a;
        color: #e6e6e6;
    }

    .sc-dark[b-23e2z0dgkw]  .modal-body {
        background: #2a2a2a;
    }

    .sc-dark[b-23e2z0dgkw]  .form-group-inline {
        background: #1f1f1f;
        border-color: #3a3a3a;
    }

        .sc-dark[b-23e2z0dgkw]  .form-group-inline label {
            color: #f0f0f0;
        }

    .sc-dark[b-23e2z0dgkw]  .form-select-inline,
    .sc-dark[b-23e2z0dgkw]  .table-input {
        background: #1f1f1f !important;
        border-color: #3a3a3a !important;
        color: #e6e6e6 !important;
    }

    .sc-dark[b-23e2z0dgkw]  .sc-size-chip {
        background: #1f1f1f;
        border-color: #3a3a3a;
        color: #e6e6e6;
    }

        .sc-dark[b-23e2z0dgkw]  .sc-size-chip:hover {
            border-color: #1890ff;
            color: #40a9ff;
        }

        .sc-dark[b-23e2z0dgkw]  .sc-size-chip.active {
            background: #1890ff;
            border-color: #1890ff;
            color: #fff;
        }

    .sc-dark[b-23e2z0dgkw]  .table-container {
        border-color: #3a3a3a;
    }

    .sc-dark[b-23e2z0dgkw]  .quality-check-table {
        background: #2a2a2a;
        color: #e6e6e6;
    }

        .sc-dark[b-23e2z0dgkw]  .quality-check-table thead {
            background: #1f1f1f;
        }

        .sc-dark[b-23e2z0dgkw]  .quality-check-table th {
            background: #1f1f1f;
            color: #f0f0f0;
            border-color: #3a3a3a;
        }

        .sc-dark[b-23e2z0dgkw]  .quality-check-table tbody tr:nth-child(even) {
            background-color: #262626;
        }

        .sc-dark[b-23e2z0dgkw]  .quality-check-table tbody tr:hover {
            background-color: rgba(24, 144, 255, 0.08);
        }

        .sc-dark[b-23e2z0dgkw]  .quality-check-table td {
            border-color: #3a3a3a;
            color: #e6e6e6;
        }

    .sc-dark[b-23e2z0dgkw]  .cell-part-name {
        color: #f0f0f0;
    }

    .sc-dark[b-23e2z0dgkw]  .cell-standard {
        color: #4ea1ff;
    }

    .sc-dark[b-23e2z0dgkw]  .cell-disabled {
        background: #1f1f1f;
        color: #555;
    }

    .sc-dark[b-23e2z0dgkw]  .table-input.valid {
        background: rgba(82, 196, 26, 0.15) !important;
        border-color: #52c41a !important;
    }

    .sc-dark[b-23e2z0dgkw]  .table-input.invalid {
        background: rgba(255, 77, 79, 0.15) !important;
        border-color: #ff4d4f !important;
    }

    .sc-dark[b-23e2z0dgkw]  .modal-actions {
        background: #1f1f1f;
        border-top-color: #3a3a3a;
    }

    .sc-dark[b-23e2z0dgkw]  .btn-secondary {
        background: #2a2a2a;
        border-color: #3a3a3a;
        color: #e6e6e6;
    }

        .sc-dark[b-23e2z0dgkw]  .btn-secondary:hover {
            background: #333;
            border-color: #4ea1ff;
            color: #4ea1ff;
        }


/* =========================================================================
   ✅ 已登记记录区域
   ========================================================================= */
.sc-record-count[b-23e2z0dgkw] {
    font-size: 12px;
    font-weight: 600;
    color: #1890ff;
    background: rgba(24, 144, 255, 0.1);
    padding: 4px 10px;
    border-radius: 12px;
    white-space: nowrap;
}

.btn-refresh-records[b-23e2z0dgkw] {
    padding: 6px 14px;
    background: #1890ff;
    color: white;
    border: none;
    border-radius: 4px;
    font-size: 12px;
    font-weight: 600;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 4px;
    transition: background 0.2s ease;
    white-space: nowrap;
}

    .btn-refresh-records:hover[b-23e2z0dgkw] {
        background: #096dd9;
    }

    .btn-refresh-records:disabled[b-23e2z0dgkw] {
        background: #b3d8ff;
        cursor: not-allowed;
    }

.sc-record-empty[b-23e2z0dgkw] {
    text-align: center;
    color: #999;
    font-size: 13px;
    padding: 24px 0;
    margin: 0;
}

    .sc-record-empty i[b-23e2z0dgkw] {
        margin-right: 6px;
    }

[b-23e2z0dgkw] .records-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 12px;
    background: white;
}

    [b-23e2z0dgkw] .records-table thead th {
        background: #fafafa;
        color: #333;
        font-weight: 600;
        text-align: center;
        padding: 8px 10px;
        border-bottom: 2px solid #e8e8e8;
        white-space: nowrap;
    }

    [b-23e2z0dgkw] .records-table tbody td {
        text-align: center;
        padding: 7px 10px;
        border-bottom: 1px solid #f0f0f0;
        color: #333;
        white-space: nowrap;
    }

    [b-23e2z0dgkw] .records-table tbody tr:hover {
        background: #f5faff;
    }

[b-23e2z0dgkw] .records-table .col-action {
    width: 60px;
}

[b-23e2z0dgkw] .qualified-badge {
    display: inline-block;
    padding: 2px 8px;
    border-radius: 10px;
    font-size: 11px;
    font-weight: 600;
}

    [b-23e2z0dgkw] .qualified-badge.qualified {
        background: rgba(82, 196, 26, 0.12);
        color: #52c41a;
    }

    [b-23e2z0dgkw] .qualified-badge.unqualified {
        background: rgba(255, 77, 79, 0.12);
        color: #ff4d4f;
    }

[b-23e2z0dgkw] .btn-delete-record {
    background: transparent;
    border: 1px solid #ff4d4f;
    color: #ff4d4f;
    border-radius: 4px;
    width: 28px;
    height: 28px;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: all 0.2s ease;
}

    [b-23e2z0dgkw] .btn-delete-record:hover {
        background: #ff4d4f;
        color: white;
    }

/* ---------- 暗色模式 ---------- */
.sc-dark .sc-record-count[b-23e2z0dgkw] {
    color: #4ea1ff;
    background: rgba(78, 161, 255, 0.15);
}

.sc-dark[b-23e2z0dgkw]  .records-table {
    background: #1f1f1f;
}

    .sc-dark[b-23e2z0dgkw]  .records-table thead th {
        background: #262626;
        color: #e6e6e6;
        border-bottom-color: #3a3a3a;
    }

    .sc-dark[b-23e2z0dgkw]  .records-table tbody td {
        color: #d6d6d6;
        border-bottom-color: #303030;
    }

    .sc-dark[b-23e2z0dgkw]  .records-table tbody tr:hover {
        background: #262d36;
    }



/* /Components/Pages/OrderBom/MaterialBom.razor.rz.scp.css */
.bom-page[b-jtydf7g8ly] {
    display: flex; flex-direction: column;
    height: calc(100vh - 70px);
    padding: 2px 4px; gap: 2px;
    box-sizing: border-box;
    overflow: hidden;
}

.bom-toolbar[b-jtydf7g8ly] { border-bottom: 1px solid #e0e0e0; background: #fafbfc; flex: 0 0 auto; }
.bom-search[b-jtydf7g8ly] { width: 240px; }
.bom-title[b-jtydf7g8ly] { font-weight: 600; color: #34495e; font-size: 12px; }
.bom-billno[b-jtydf7g8ly] { color: #2980b9; margin-right: 16px; font-weight: 500; font-size: 12px; }

/* -------- 列表外层 DxTabs (vertical text on right) -------- */
.bom-list-tabs[b-jtydf7g8ly] { flex: 1 1 auto; min-height: 0; height: 100%; width: 100%; }

[b-jtydf7g8ly] .bom-list-tabs > .dxbl-tabs {
    height: 100% !important;
    width: 100% !important;
}
[b-jtydf7g8ly] .bom-list-tabs .dxbl-tabs-content-wrapper,
[b-jtydf7g8ly] .bom-list-tabs .dxbl-tabs-content {
    min-width: 0 !important;
    min-height: 0 !important;
}
[b-jtydf7g8ly] .bom-list-tabs .dxbl-tabs-page,
[b-jtydf7g8ly] .bom-list-tabs .dxbl-tabs-page-content {
    min-height: 0 !important;
    height: 100% !important;
    display: flex !important;
    flex-direction: column !important;
}

[b-jtydf7g8ly] .vertical-text-tab .dxbl-tabs-tab-text,
[b-jtydf7g8ly] .vertical-tab-text {
    writing-mode: vertical-lr;
    text-orientation: upright;
    display: inline-block;
    letter-spacing: 2px;
    font-weight: 600;
}

[b-jtydf7g8ly] .bom-list-tabs .vertical-text-tab {
    height: 120px;
    width: 10px;
    position: relative;
}
[b-jtydf7g8ly] .bom-list-tabs .vertical-text-tab .vertical-tab-text {
    position: absolute;
    left: 3px;
    top: 50%;
    transform: translateY(-50%);
}

/* -------- Master grid -------- */
.bom-master-grid[b-jtydf7g8ly] { flex: 1 1 auto; min-height: 0; height: 100%; width: 100%; }

/* -------- 详细明细 tab content -------- */
.bom-detail-header[b-jtydf7g8ly] {
    flex: 0 0 auto;
    padding: 4px 8px;
    background: #f5f9ff;
    border-bottom: 1px solid #d0e2f5;
    display: flex; align-items: center;
    gap: 4px; font-size: 12px;
}

.bom-empty[b-jtydf7g8ly] {
    flex: 1 1 auto;
    display: flex; align-items: center; justify-content: center;
    color: #888; font-size: 13px;
}

.bom-detail-area[b-jtydf7g8ly] {
    display: flex; flex-direction: column;
    flex: 1 1 auto; min-height: 0;
    width: 100%; gap: 0;
}

/* DxSplitter 占满剩余区域；从表 60% / 从从表 40% */
.bom-detail-splitter[b-jtydf7g8ly] { flex: 1 1 auto; min-height: 0; height: 100%; }
[b-jtydf7g8ly] .bom-detail-splitter { height: 100% !important; }
[b-jtydf7g8ly] .bom-detail-splitter .dxbl-splitter-pane:nth-child(1) { height: 60% !important; }
[b-jtydf7g8ly] .bom-detail-splitter .dxbl-splitter-pane:nth-child(2) { height: 40% !important; }

.bom-detail-grid[b-jtydf7g8ly], .bom-sub-grid[b-jtydf7g8ly] { height: 100%; }

[b-jtydf7g8ly] .bom-sub-tabs,
[b-jtydf7g8ly] .bom-sub-tabs > .dxbl-tabs {
    display: flex !important;
    flex-direction: column !important;
    flex: 1 1 auto !important;
    min-height: 0 !important;
    height: 40% !important;
}
[b-jtydf7g8ly] .bom-sub-tabs .dxbl-tabs-content-wrapper,
[b-jtydf7g8ly] .bom-sub-tabs .dxbl-tabs-content,
[b-jtydf7g8ly] .bom-sub-tabs .dxbl-tabs-page,
[b-jtydf7g8ly] .bom-sub-tabs .dxbl-tabs-page-content {
    flex: 1 1 auto !important;
    min-height: 0 !important;
    height: 100% !important;
}

.bom-sub-grid[b-jtydf7g8ly] { height: 60%; min-height: 0; }

/* -------- 编辑/预览 视图：水平 Tab + GroupPanel + 申请明细列表 -------- */
.bom-edit-tabs[b-jtydf7g8ly] { flex: 1 1 auto; min-height: 0; height: 100%; width: 100%; }

[b-jtydf7g8ly] .bom-edit-tabs .dxbl-tabs-content-wrapper,
[b-jtydf7g8ly] .bom-edit-tabs .dxbl-tabs-content {
    flex: 1 1 auto !important;
    min-height: 0 !important;
}
[b-jtydf7g8ly] .bom-edit-tabs .dxbl-tabs-page,
[b-jtydf7g8ly] .bom-edit-tabs .dxbl-tabs-page-content {
    flex: 1 1 auto !important;
    min-height: 0 !important;
    display: flex !important;
    flex-direction: column !important;
}

.bom-edit-body[b-jtydf7g8ly] {
    display: flex; flex-direction: column;
    flex: 1 1 auto; min-height: 0;
    gap: 4px; padding: 2px 4px;
}

.bom-group-panel[b-jtydf7g8ly] {
    border: 1px solid #d8e1ec;
    border-radius: 3px;
    background: #fff;
    flex: 0 0 auto;
}
.bom-group-header[b-jtydf7g8ly] {
    background: #f3f6fb;
    border-bottom: 1px solid #d8e1ec;
    padding: 2px 10px;
    font-weight: 600; font-size: 12px;
    color: #34495e;
    display: flex; align-items: center; gap: 6px;
}
.bom-group-icon[b-jtydf7g8ly] { font-size: 13px; }
.bom-group-body[b-jtydf7g8ly] { padding: 2px 4px; }

/* 5 列表单（基于 12 栅格的 ColSpanMd=3 = 4 列，覆盖为 20%） */
[b-jtydf7g8ly] .bom-info-form .dxbl-flex-form-item {
    flex-basis: 20% !important;
    max-width: 20% !important;
    padding: 1px 4px !important;
}
[b-jtydf7g8ly] .bom-info-form .dxbl-flex-form-group .dxbl-flex-form-group-content {
    padding: 2px 4px !important;
}
[b-jtydf7g8ly] .bom-info-form .dxbl-textbox,
[b-jtydf7g8ly] .bom-info-form .dxbl-dateedit {
    min-height: 22px !important;
}

.bom-detail-panel[b-jtydf7g8ly] {
    flex: 1 1 auto; min-height: 0;
    display: flex; flex-direction: column;
    border: 1px solid #d8e1ec;
    border-radius: 3px;
    background: #fff;
    overflow: hidden;
}
.bom-panel-title[b-jtydf7g8ly] {
    padding: 2px 10px;
    border-bottom: 1px solid #d8e1ec;
    background: #f3f6fb;
    font-weight: 600; font-size: 12px;
    color: #34495e;
    flex: 0 0 auto;
}
.bom-detail-panel .bom-detail-area[b-jtydf7g8ly] {
    flex: 1 1 auto; min-height: 0;
}

/* 编辑视图工具栏右侧"下一条"图标镜像 */
[b-jtydf7g8ly] .bom-next-icon img,
[b-jtydf7g8ly] .bom-next-icon .dxbl-image {
    transform: scaleX(-1);
}

/* -------- 表单样式 -------- */
.bom-form[b-jtydf7g8ly] { padding: 2px 4px; background: #fff; border-bottom: 1px solid #e9ecef; flex: 0 0 auto; }
.bom-form-layout[b-jtydf7g8ly] { font-size: 12px; }
.bom-form-layout .dxbl-flex-form-item[b-jtydf7g8ly] { padding: 2px 4px !important; }

.ready-yes[b-jtydf7g8ly] { color: #2e7d32; font-weight: 600; }
.ready-no[b-jtydf7g8ly]  { color: #c62828; }

[b-jtydf7g8ly] .dxbl-grid-edit-cell .dxbl-textbox { padding: 0 !important; }
/* /Components/Pages/Qualityinspection/CheckControlv2.razor.rz.scp.css */
[b-vnkoweq3g2] .dxbl-stack-layout {
    height: 100% !important;
}

    [b-vnkoweq3g2] .dxbl-stack-layout > div {
        height: 100% !important;
        display: flex !important;
    }

[b-vnkoweq3g2] .dxbl-stack-layout-item {
    height: 100% !important;
}

.stacklayout-item[b-vnkoweq3g2] {
    font-size: 1.2em;
    font-weight: 500;
    text-align: center;
    padding: 0.5rem;
    position: relative;
    z-index: 0;
    display: block;
    width: 100%;
    height: 100%;
    box-sizing: border-box;
}

    .stacklayout-item[b-vnkoweq3g2]:before {
        content: " ";
        position: absolute;
        z-index: -1;
        width: 100%;
        height: 100%;
        left: 0;
        top: 0;
        opacity: 0.4;
    }

    .stacklayout-item > div[b-vnkoweq3g2] {
        position: relative;
        z-index: 1;
        width: 100%;
        height: 100%;
        overflow: auto;
    }

.stacklayout-header[b-vnkoweq3g2]:before {
    background-color: var(--bs-red);
}

.stacklayout-content[b-vnkoweq3g2]:before {
    background-color: var(--bs-yellow);
}

.stacklayout-footer[b-vnkoweq3g2]:before {
    background-color: var(--bs-blue);
}

@media (max-width: 575.98px) {
    .stacklayout-item[b-vnkoweq3g2] {
        font-size: 0.9em;
    }
}
[b-vnkoweq3g2] .info-label {
    color: #666;
    font-size: 15px;
}

[b-vnkoweq3g2] .info-value {
    color: #333;
    font-size: 12px;
    font-weight: 500;
}

[b-vnkoweq3g2] .section-title-blue {
    color: #1890ff;
    font-size: 12px;
    font-weight: 600;
    margin-bottom: 8px;
}

[b-vnkoweq3g2] .card-white {
    background: transparent;
    border-radius: 0;
    padding: 8px 12px;
    margin-bottom: 0;
    border: none;
    box-shadow: none;
}

[b-vnkoweq3g2] .side-panel {
    background: transparent;
    padding: 8px;
    height: 100%;
    overflow-y: auto;
}

[b-vnkoweq3g2] .center-panel {
    background: #ffffff;
    height: 100%;
    display: flex;
    flex-direction: column;
}

[b-vnkoweq3g2] .section-title-blue {
    color: #1890ff;
    font-size: 15px;
    font-weight: 600;
    margin-bottom: 8px;
    padding-bottom: 6px;
    border-bottom: 1px dashed #d9d9d9;
}

/* 弹出窗体样式 */
.popup-overlay[b-vnkoweq3g2] {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 9999;
    animation: fadeIn 0.2s ease-out;
}

.popup-content[b-vnkoweq3g2] {
    background: white;
    border-radius: 12px;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);
    animation: slideUp 0.3s ease-out;
    max-width: 90%;
}

.popup-header[b-vnkoweq3g2] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 16px;
    border-bottom: 1px solid #e8e8e8;
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
}

.popup-title[b-vnkoweq3g2] {
    margin: 0;
    color: white;
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 15px;
}

.popup-close-btn[b-vnkoweq3g2] {
    background: transparent;
    border: none;
    color: white;
    font-size: 24px;
    cursor: pointer;
    padding: 0;
    line-height: 1;
    transition: transform 0.2s;
}

    .popup-close-btn:hover[b-vnkoweq3g2] {
        transform: scale(1.2);
    }

.popup-body[b-vnkoweq3g2] {
    padding: 20px;
    max-height: 60vh;
    overflow-y: auto;
}

.popup-footer[b-vnkoweq3g2] {
    display: flex;
    justify-content: flex-end;
    gap: 12px;
    padding: 16px;
    border-top: 1px solid #e8e8e8;
    background: #fafafa;
}

.weight-table[b-vnkoweq3g2] {
    width: 100%;
    font-size: 13px;
    border-collapse: collapse;
}

    .weight-table thead[b-vnkoweq3g2] {
        background: #f5f5f5;
        position: sticky;
        top: 0;
        z-index: 10;
    }

    .weight-table th[b-vnkoweq3g2] {
        padding: 10px;
        border-bottom: 2px solid #e0e0e0;
        font-weight: 600;
        color: #333;
        text-align: left;
    }

    .weight-table td[b-vnkoweq3g2] {
        padding: 8px;
        border-bottom: 1px solid #e9ecef;
    }

.weight-input[b-vnkoweq3g2] {
    width: 100%;
    padding: 6px 10px;
    border: 1px solid #e8e8e8;
    border-radius: 4px;
    font-size: 13px;
    text-align: right;
    transition: border-color 0.3s;
}

    .weight-input:focus[b-vnkoweq3g2] {
        border-color: #0d6efd;
        outline: none;
    }

.empty-state[b-vnkoweq3g2] {
    text-align: center;
    padding: 40px;
    color: #999;
}

.empty-state-icon[b-vnkoweq3g2] {
    font-size: 48px;
    display: block;
    margin-bottom: 12px;
}

.btn-cancel[b-vnkoweq3g2] {
    padding: 8px 20px;
    font-size: 13px;
    background: #fff;
    border: 1px solid #d9d9d9;
    color: #666;
    border-radius: 4px;
    cursor: pointer;
}


/* 字体大小统一定义 - 基于视口单位实现响应式 */
:root[b-vnkoweq3g2] {
    --font-xs: clamp(9px, 0.8vw, 10px); /* 超小字体 */
    --font-sm: clamp(10px, 0.9vw, 11px); /* 小字体 */
    --font-base: clamp(11px, 1vw, 12px); /* 基础字体 */
    --font-md: clamp(12px, 1.1vw, 13px); /* 中等字体 */
    --font-lg: clamp(13px, 1.2vw, 14px); /* 大字体 */
    --font-xl: clamp(14px, 1.3vw, 15px); /* 超大字体 */
}

/* 全局字体适配 */
.side-panel[b-vnkoweq3g2],
.center-panel[b-vnkoweq3g2] {
    font-size: var(--font-base);
}

    /* 标题字体 */
    .side-panel h6[b-vnkoweq3g2],
    .center-panel h6[b-vnkoweq3g2] {
        font-size: var(--font-md) !important;
    }

/* 标签和描述文字 */
.info-label[b-vnkoweq3g2] {
    font-size: var(--font-sm) !important;
}

.info-value[b-vnkoweq3g2] {
    font-size: var(--font-sm) !important;
}

/* 按钮字体 */
.btn-sm[b-vnkoweq3g2] {
    font-size: var(--font-sm) !important;
}

/* 表格字体 */
.table[b-vnkoweq3g2] {
    font-size: var(--font-base) !important;
}

    .table th[b-vnkoweq3g2] {
        font-size: var(--font-base) !important;
    }

    .table td[b-vnkoweq3g2] {
        font-size: var(--font-sm) !important;
    }

/* Badge 字体 */
.badge[b-vnkoweq3g2] {
    font-size: var(--font-xs) !important;
}

/* 图标字体 */
.bi[b-vnkoweq3g2] {
    font-size: var(--font-base) !important;
}

/* 输入框字体 */
input[b-vnkoweq3g2],
select[b-vnkoweq3g2],
textarea[b-vnkoweq3g2] {
    font-size: var(--font-sm) !important;
}

/* 步骤条字体 */
.step-text[b-vnkoweq3g2] {
    font-size: var(--font-sm) !important;
}

/* 空状态提示字体 */
.empty-state-text[b-vnkoweq3g2] {
    font-size: var(--font-base) !important;
}

.empty-state-icon[b-vnkoweq3g2] {
    font-size: calc(var(--font-base) * 3) !important;
}

/* 统计信息字体 */
.stats-text[b-vnkoweq3g2] {
    font-size: var(--font-sm) !important;
}

/* 卡片标题字体 */
.section-title-blue[b-vnkoweq3g2] {
    font-size: var(--font-base) !important;
}

/* 响应式断点 - 大屏幕 */
@media (min-width: 1920px) {
    :root[b-vnkoweq3g2] {
        --font-xs: 10px;
        --font-sm: 11px;
        --font-base: 12px;
        --font-md: 13px;
        --font-lg: 14px;
        --font-xl: 15px;
    }
}

/* 响应式断点 - 中等屏幕 */
@media (min-width: 1366px) and (max-width: 1919px) {
    :root[b-vnkoweq3g2] {
        --font-xs: 9px;
        --font-sm: 10px;
        --font-base: 11px;
        --font-md: 12px;
        --font-lg: 13px;
        --font-xl: 14px;
    }
}

/* 响应式断点 - 小屏幕 */
@media (max-width: 1365px) {
    :root[b-vnkoweq3g2] {
        --font-xs: 8px;
        --font-sm: 9px;
        --font-base: 10px;
        --font-md: 11px;
        --font-lg: 12px;
        --font-xl: 13px;
    }
}

/* 🔥 PDF Tab iframe（替代 DxPdfViewer，跨平台稳定） */
.pdf-tab-iframe[b-vnkoweq3g2] {
    width: 100%;
    height: 100%;
    border: none;
    background-color: #fff;
    display: block;
}

/* 🔥 DevExpress PdfViewer（兼容安卓浏览器，canvas 渲染） */
[b-vnkoweq3g2] .pdf-tab-viewer {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    min-height: 0;
}

[b-vnkoweq3g2] .pdf-tab-viewer .dxbl-pdf-viewer {
    flex: 1;
    height: 100%;
    min-height: 0;
}

/* =========================================================================
   ✅ 订单选择弹窗（os-*）+ 移动端适配
   桌面端：横向表格；移动端（<= 768px）：表格行转为堆叠卡片（data-label 模式）
   ========================================================================= */
.os-overlay[b-vnkoweq3g2] {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.5);
    z-index: 9999;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 16px;
    box-sizing: border-box;
}

.os-modal[b-vnkoweq3g2] {
    background: #fff;
    border-radius: 8px;
    width: 1000px;
    max-width: 100%;
    max-height: 85vh;
    overflow: hidden;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3);
    display: flex;
    flex-direction: column;
}

.os-header[b-vnkoweq3g2] {
    padding: 12px 16px;
    border-bottom: 1px solid #e8e8e8;
    display: flex;
    justify-content: space-between;
    align-items: center;
    background: linear-gradient(90deg, #1890ff 0%, #096dd9 100%);
    flex-shrink: 0;
}

.os-header-title[b-vnkoweq3g2] {
    display: flex;
    align-items: center;
    gap: 8px;
    color: #fff;
}

    .os-header-title h6[b-vnkoweq3g2] {
        margin: 0;
        color: #fff;
        font-weight: 600;
    }

    .os-header-title i[b-vnkoweq3g2] {
        color: #fff;
        font-size: 16px;
    }

.os-close-btn[b-vnkoweq3g2] {
    background: transparent;
    border: none;
    color: #fff;
    font-size: 22px;
    cursor: pointer;
    padding: 0 4px;
    line-height: 1;
}

.os-search-bar[b-vnkoweq3g2] {
    padding: 10px 16px;
    border-bottom: 1px solid #f0f0f0;
    display: flex;
    gap: 8px;
    align-items: center;
    flex-shrink: 0;
}

.os-search-input[b-vnkoweq3g2] {
    flex: 1;
    max-width: 320px;
    padding: 6px 10px;
    height: 32px;
    border: 1px solid #d9d9d9;
    border-radius: 4px;
    font-size: 12px;
    box-sizing: border-box;
}

.os-refresh-btn[b-vnkoweq3g2] {
    height: 32px;
    font-size: 11px;
    padding: 4px 12px;
    white-space: nowrap;
}

.os-body[b-vnkoweq3g2] {
    flex: 1;
    overflow: auto;
    -webkit-overflow-scrolling: touch;
    padding: 0;
}

.os-footer[b-vnkoweq3g2] {
    padding: 10px 16px;
    border-top: 1px solid #e8e8e8;
    display: flex;
    justify-content: flex-end;
    background: #fafafa;
    flex-shrink: 0;
}

.os-empty[b-vnkoweq3g2] {
    text-align: center;
    padding: 40px 0;
    color: #999;
}

    .os-empty p[b-vnkoweq3g2] {
        margin-top: 8px;
        font-size: 13px;
    }

.os-table[b-vnkoweq3g2] {
    width: 100%;
    font-size: 12px;
    margin-bottom: 0;
}

    .os-table thead[b-vnkoweq3g2] {
        position: sticky;
        top: 0;
        background: #f5f5f5;
        z-index: 10;
    }

    .os-table th[b-vnkoweq3g2] {
        padding: 10px;
        white-space: nowrap;
        text-align: left;
        font-weight: 600;
        color: #555;
        border-bottom: 2px solid #e8e8e8;
    }

    .os-table td[b-vnkoweq3g2] {
        padding: 8px 10px;
        vertical-align: middle;
        border-bottom: 1px solid #f0f0f0;
    }

.os-row[b-vnkoweq3g2] {
    cursor: pointer;
    transition: background-color 0.2s;
}
.os-row:hover[b-vnkoweq3g2] {
    background-color: #f5faff !important;
}

.os-orderno[b-vnkoweq3g2] {
    font-weight: 600;
    color: #1890ff;
}

.os-blue-text[b-vnkoweq3g2] {
    color: #1890ff;
}

.os-qty[b-vnkoweq3g2] {
    text-align: left;
}

.os-action-cell[b-vnkoweq3g2] {
    text-align: left;
}

.os-select-btn[b-vnkoweq3g2] {
    font-size: 10px;
    padding: 2px 10px;
    white-space: nowrap;
}

/* —— 移动端（<=768px）：表格行转为堆叠卡片 —— */
@media (max-width: 768px) {
    .os-overlay[b-vnkoweq3g2] {
        padding: 0;
        align-items: stretch;
        justify-content: stretch;
    }

    .os-modal[b-vnkoweq3g2] {
        width: 100%;
        max-width: 100%;
        height: 100%;
        max-height: 100%;
        border-radius: 0;
    }

    .os-search-input[b-vnkoweq3g2] {
        max-width: none;
    }

    /* 隐藏表头，行变卡片 */
    .os-table thead[b-vnkoweq3g2] {
        display: none;
    }

    .os-table[b-vnkoweq3g2],
    .os-table tbody[b-vnkoweq3g2],
    .os-table tr[b-vnkoweq3g2],
    .os-table td[b-vnkoweq3g2] {
        display: block;
        width: 100%;
        box-sizing: border-box;
    }

    .os-table tr[b-vnkoweq3g2] {
        border: 1px solid #e8e8e8;
        border-radius: 8px;
        margin: 10px;
        padding: 6px 10px;
        background: #fff;
        box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06);
    }

    .os-table td[b-vnkoweq3g2] {
        display: flex;
        justify-content: space-between;
        align-items: center;
        gap: 12px;
        padding: 7px 2px;
        border: none;
        border-bottom: 1px dashed #f0f0f0;
        text-align: right;
        font-size: 13px;
    }

        .os-table td:last-child[b-vnkoweq3g2] {
            border-bottom: none;
        }

        /* 左侧字段名 */
        .os-table td[b-vnkoweq3g2]::before {
            content: attr(data-label);
            font-weight: 600;
            color: #888;
            flex: 0 0 auto;
            text-align: left;
            white-space: nowrap;
        }

    .os-orderno[b-vnkoweq3g2] {
        font-size: 15px !important;
    }

    /* 操作单元格：按钮占满整行 */
    .os-action-cell[b-vnkoweq3g2] {
        justify-content: stretch !important;
    }

        .os-action-cell[b-vnkoweq3g2]::before {
            content: none !important;
        }

    .os-select-btn[b-vnkoweq3g2] {
        width: 100%;
        font-size: 14px;
        padding: 9px 10px;
    }
}

/* =========================================================================
   ✅ 质量疵点报表（qr-*）+ 移动端适配
   桌面端：左表格 + 右饼图（横向）；移动端（<=768px）：纵向堆叠，
   查询条件项整行排列，按钮占满整行，饼图给固定高度避免被压扁。
   ========================================================================= */
[b-vnkoweq3g2] .qr-card {
    border: 1px solid #e8e8e8;
    border-radius: 8px;
    background: white;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);
    overflow: hidden;
    height: calc(90vh - 180px);
    display: flex;
    flex-direction: column;
}

[b-vnkoweq3g2] .qr-filter-bar {
    padding: 10px 12px;
    border-bottom: 1px solid #f0f0f0;
    background: #fafafa;
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    align-items: center;
    flex-shrink: 0;
}

[b-vnkoweq3g2] .qr-filter-item {
    display: flex;
    align-items: center;
    gap: 4px;
}

[b-vnkoweq3g2] .qr-filter-label {
    font-size: 12px;
    color: #555;
    white-space: nowrap;
}

[b-vnkoweq3g2] .qr-style-input {
    width: 150px;
    padding: 4px 8px;
    height: 28px;
    border: 1px solid #e9ecef;
    border-radius: 4px;
    font-size: 12px;
    box-sizing: border-box;
}

[b-vnkoweq3g2] .qr-date {
    width: 150px;
}

[b-vnkoweq3g2] .qr-filter-actions {
    display: flex;
    gap: 8px;
    align-items: center;
}

[b-vnkoweq3g2] .qr-btn {
    padding: 4px 14px;
    height: 28px;
    font-size: 12px;
    border-radius: 4px;
    white-space: nowrap;
}

[b-vnkoweq3g2] .qr-content {
    flex: 1;
    display: flex;
    overflow: hidden;
}

[b-vnkoweq3g2] .qr-grid-panel {
    flex: 1;
    min-width: 0;
    padding: 8px;
    overflow: hidden;
    display: flex;
    flex-direction: column;
}

[b-vnkoweq3g2] .qr-chart-panel {
    width: 420px;
    flex-shrink: 0;
    border-left: 1px solid #f0f0f0;
    padding: 8px;
    display: flex;
    flex-direction: column;
}

[b-vnkoweq3g2] .qr-panel-title {
    font-size: 13px;
    font-weight: 600;
    color: #333;
    margin-bottom: 6px;
}

[b-vnkoweq3g2] .qr-panel-body {
    flex: 1;
    overflow: auto;
}

/* 让网格填满其容器高度，保证虚拟滚动在容器内部滚动 */
[b-vnkoweq3g2] .report-grid {
    height: 100%;
}

[b-vnkoweq3g2] .qr-chart-body {
    height: 300px;
    flex: none;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
}

[b-vnkoweq3g2] .qr-empty {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
    flex-direction: column;
    gap: 10px;
    color: #999;
}

/* —— 移动端（<=768px）：纵向堆叠 —— */
@media (max-width: 992px) {
    [b-vnkoweq3g2] .qr-card {
        height: auto;
        min-height: auto;
    }

    [b-vnkoweq3g2] .qr-filter-bar {
        gap: 8px;
    }

    /* 查询条件项整行排列，输入框占满 */
    [b-vnkoweq3g2] .qr-filter-item {
        width: 100%;
    }

    [b-vnkoweq3g2] .qr-style-input,
    [b-vnkoweq3g2] .qr-date {
        width: 100%;
        flex: 1;
    }

    /* 按钮整行平分 */
    [b-vnkoweq3g2] .qr-filter-actions {
        width: 100%;
    }

    [b-vnkoweq3g2] .qr-btn {
        flex: 1;
        height: 36px;
        font-size: 14px;
    }

    /* 内容区由横向改为纵向堆叠 */
    [b-vnkoweq3g2] .qr-content {
        flex-direction: column;
        overflow: auto;
        -webkit-overflow-scrolling: touch;
    }

    /* 表格面板限定高度，内部滚动，避免把饼图顶到最底部 */
    [b-vnkoweq3g2] .qr-grid-panel {
        flex: none;
        overflow: hidden;
    }

    [b-vnkoweq3g2] .qr-panel-body {
        height: 36vh;
        min-height: 200px;
        max-height: 340px;
        overflow: auto;
        -webkit-overflow-scrolling: touch;
    }

    /* 饼图改为整行 + 固定高度，紧贴表格下方 */
    [b-vnkoweq3g2] .qr-chart-panel {
        flex: none;
        width: 100%;
        border-left: none;
        border-top: 1px solid #f0f0f0;
    }

    [b-vnkoweq3g2] .qr-chart-body {
        height: 280px;
    }
}

/* —— 暗色主题适配（qr-*） —— */
.cc-dark[b-vnkoweq3g2]  .qr-card {
    background: #2a2a2a;
    border-color: #3a3a3a;
    color: #e6e6e6;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.5);
}

.cc-dark[b-vnkoweq3g2]  .qr-filter-bar {
    background: #262626;
    border-bottom-color: #3a3a3a;
}

.cc-dark[b-vnkoweq3g2]  .qr-filter-label {
    color: #b0b0b0;
}

.cc-dark[b-vnkoweq3g2]  .qr-style-input {
    background: #1f1f1f;
    border-color: #3a3a3a;
    color: #e6e6e6;
}

.cc-dark[b-vnkoweq3g2]  .qr-chart-panel {
    border-left-color: #3a3a3a;
    border-top-color: #3a3a3a;
}

.cc-dark[b-vnkoweq3g2]  .qr-panel-title {
    color: #f0f0f0;
}

.cc-dark[b-vnkoweq3g2]  .qr-empty {
    color: #9aa0a6;
}

/* —— 暗色主题适配 —— */
.cc-dark[b-vnkoweq3g2]  .os-modal {
    background: #1f1f1f;
    color: #e6e6e6;
}

.cc-dark[b-vnkoweq3g2]  .os-search-bar {
    border-bottom-color: #3a3a3a;
}

.cc-dark[b-vnkoweq3g2]  .os-search-input {
    background: #1f1f1f;
    border-color: #3a3a3a;
    color: #e6e6e6;
}

.cc-dark[b-vnkoweq3g2]  .os-body {
    background: #1f1f1f;
}

.cc-dark[b-vnkoweq3g2]  .os-footer {
    background: #2a2a2a;
    border-top-color: #3a3a3a;
}

.cc-dark[b-vnkoweq3g2]  .os-table {
    color: #e6e6e6;
}

.cc-dark[b-vnkoweq3g2]  .os-table thead {
    background: #262626;
}

.cc-dark[b-vnkoweq3g2]  .os-table th {
    color: #a0a0a0;
    border-bottom-color: #3a3a3a;
}

.cc-dark[b-vnkoweq3g2]  .os-table td {
    border-bottom-color: #3a3a3a;
}

.cc-dark[b-vnkoweq3g2]  .os-row:hover {
    background-color: #303030 !important;
}

.cc-dark[b-vnkoweq3g2]  .os-orderno {
    color: #4ea1ff;
}

.cc-dark[b-vnkoweq3g2]  .os-blue-text {
    color: #4ea1ff;
}

.cc-dark[b-vnkoweq3g2]  .os-empty {
    color: #9aa0a6;
}

@media (max-width: 768px) {
    .cc-dark[b-vnkoweq3g2]  .os-table tr {
        background: #2a2a2a;
        border-color: #3a3a3a;
    }

    .cc-dark[b-vnkoweq3g2]  .os-table td {
        border-bottom-color: #3a3a3a;
    }

        .cc-dark[b-vnkoweq3g2]  .os-table td::before {
            color: #9aa0a6;
        }
}

/*!* =========================================================================*/
/*   ✅ Bootstrap 工具类兜底（仅作用于本组件，使用 ::deep 限定作用域）*/
/*   原因：DevExpress 的 Bootstrap 系列主题自带 Bootstrap CSS，但 Fluent_Light /*/
/*   Fluent_Dark 等主题不带 Bootstrap，本页面里大量使用了 .btn / .row / .col-12 /*/
/*   .d-flex / .badge / .table / .progress / .rounded-circle / .me-*!.mb-* 等类，*/
/*   导致在 Fluent 主题下样式失效。*/
/*   这里只为本页面所需的类提供最小兜底，scoped CSS + ::deep 保证其它页面与*/
/*   Bootstrap 主题完全不受影响。  ========================================================================= *!*/

/* layout */
[b-vnkoweq3g2] .row { display: flex; flex-wrap: wrap; margin-right: -8px; margin-left: -8px; }
[b-vnkoweq3g2] .row > [class^="col-"], [b-vnkoweq3g2] .row > [class*=" col-"] { padding-right: 8px; padding-left: 8px; box-sizing: border-box; }
[b-vnkoweq3g2] .col-12 { flex: 0 0 100%; max-width: 100%; }

/* flex helpers */
[b-vnkoweq3g2] .d-flex { display: flex !important; }
[b-vnkoweq3g2] .d-inline-flex { display: inline-flex !important; }
[b-vnkoweq3g2] .flex-column { flex-direction: column !important; }
[b-vnkoweq3g2] .justify-content-start { justify-content: flex-start !important; }
[b-vnkoweq3g2] .justify-content-center { justify-content: center !important; }
[b-vnkoweq3g2] .justify-content-between { justify-content: space-between !important; }
[b-vnkoweq3g2] .justify-content-end { justify-content: flex-end !important; }
[b-vnkoweq3g2] .align-items-center { align-items: center !important; }
[b-vnkoweq3g2] .align-items-start { align-items: flex-start !important; }
[b-vnkoweq3g2] .align-items-end { align-items: flex-end !important; }

/* position */
[b-vnkoweq3g2] .position-relative { position: relative !important; }
[b-vnkoweq3g2] .position-absolute { position: absolute !important; }

/* sizing */
[b-vnkoweq3g2] .w-100 { width: 100% !important; }
[b-vnkoweq3g2] .h-100 { height: 100% !important; }

/* spacing (BS 0.25rem step) */
[b-vnkoweq3g2] .m-0 { margin: 0 !important; }
[b-vnkoweq3g2] .mt-0 { margin-top: 0 !important; } [b-vnkoweq3g2] .mb-0 { margin-bottom: 0 !important; }
[b-vnkoweq3g2] .ms-0 { margin-left: 0 !important; } [b-vnkoweq3g2] .me-0 { margin-right: 0 !important; }
[b-vnkoweq3g2] .mt-1 { margin-top: .25rem !important; } [b-vnkoweq3g2] .mb-1 { margin-bottom: .25rem !important; }
[b-vnkoweq3g2] .ms-1 { margin-left: .25rem !important; } [b-vnkoweq3g2] .me-1 { margin-right: .25rem !important; }
[b-vnkoweq3g2] .mt-2 { margin-top: .5rem !important; } [b-vnkoweq3g2] .mb-2 { margin-bottom: .5rem !important; }
[b-vnkoweq3g2] .ms-2 { margin-left: .5rem !important; } [b-vnkoweq3g2] .me-2 { margin-right: .5rem !important; }
[b-vnkoweq3g2] .mt-3 { margin-top: 1rem !important; } [b-vnkoweq3g2] .mb-3 { margin-bottom: 1rem !important; }
[b-vnkoweq3g2] .p-0 { padding: 0 !important; }
[b-vnkoweq3g2] .py-1 { padding-top: .25rem !important; padding-bottom: .25rem !important; }
[b-vnkoweq3g2] .py-2 { padding-top: .5rem !important; padding-bottom: .5rem !important; }
[b-vnkoweq3g2] .py-3 { padding-top: 1rem !important; padding-bottom: 1rem !important; }
[b-vnkoweq3g2] .px-1 { padding-left: .25rem !important; padding-right: .25rem !important; }
[b-vnkoweq3g2] .px-2 { padding-left: .5rem !important; padding-right: .5rem !important; }
[b-vnkoweq3g2] .px-3 { padding-left: 1rem !important; padding-right: 1rem !important; }
[b-vnkoweq3g2] .gap-1 { gap: .25rem !important; }
[b-vnkoweq3g2] .gap-2 { gap: .5rem !important; }
[b-vnkoweq3g2] .gap-3 { gap: 1rem !important; }

/* text */
[b-vnkoweq3g2] .text-center { text-align: center !important; }
[b-vnkoweq3g2] .text-start { text-align: left !important; }
[b-vnkoweq3g2] .text-end { text-align: right !important; }
[b-vnkoweq3g2] .text-white { color: #fff !important; }
[b-vnkoweq3g2] .text-muted { color: #6c757d !important; }
[b-vnkoweq3g2] .fw-semibold { font-weight: 600 !important; }
[b-vnkoweq3g2] .fw-bold { font-weight: 700 !important; }

/* backgrounds */
[b-vnkoweq3g2] .bg-primary { background-color: #0d6efd !important; color: #fff; }
[b-vnkoweq3g2] .bg-light { background-color: #f8f9fa !important; }
[b-vnkoweq3g2] .bg-secondary { background-color: #6c757d !important; color: #fff; }
[b-vnkoweq3g2] .bg-success { background-color: #198754 !important; color: #fff; }
[b-vnkoweq3g2] .bg-danger { background-color: #dc3545 !important; color: #fff; }
[b-vnkoweq3g2] .bg-warning { background-color: #ffc107 !important; color: #212529; }
[b-vnkoweq3g2] .bg-info { background-color: #0dcaf0 !important; color: #212529; }

/* borders / radius */
[b-vnkoweq3g2] .rounded { border-radius: .375rem !important; }
[b-vnkoweq3g2] .rounded-circle { border-radius: 50% !important; }
[b-vnkoweq3g2] .border { border: 1px solid #dee2e6 !important; }

/* buttons */
[b-vnkoweq3g2] .btn {
    display: inline-block;
    font-weight: 400;
    line-height: 1.5;
    color: #212529;
    text-align: center;
    text-decoration: none;
    vertical-align: middle;
    cursor: pointer;
    user-select: none;
    background-color: transparent;
    border: 1px solid transparent;
    padding: .375rem .75rem;
    font-size: 1rem;
    border-radius: .375rem;
    transition: color .15s, background-color .15s, border-color .15s, box-shadow .15s;
}
[b-vnkoweq3g2] .btn:hover { filter: brightness(0.95); }
[b-vnkoweq3g2] .btn:disabled, [b-vnkoweq3g2] .btn.disabled { opacity: .65; cursor: not-allowed; }
[b-vnkoweq3g2] .btn-sm { padding: .25rem .5rem; font-size: .875rem; border-radius: .25rem; }
[b-vnkoweq3g2] .btn-primary { color: #fff; background-color: #0d6efd; border-color: #0d6efd; }
[b-vnkoweq3g2] .btn-secondary { color: #fff; background-color: #6c757d; border-color: #6c757d; }
[b-vnkoweq3g2] .btn-outline-primary { color: #0d6efd; border-color: #0d6efd; background-color: transparent; }
[b-vnkoweq3g2] .btn-outline-primary:hover { color: #fff; background-color: #0d6efd; }

/* card */
[b-vnkoweq3g2] .card {
    position: relative;
    display: flex;
    flex-direction: column;
    min-width: 0;
    word-wrap: break-word;
    background-color: #fff;
    background-clip: border-box;
    border: 1px solid rgba(0, 0, 0, 0.125);
    border-radius: .375rem;
}

/* badge */
[b-vnkoweq3g2] .badge {
    display: inline-block;
    padding: .35em .65em;
    font-size: .75em;
    font-weight: 700;
    line-height: 1;
    color: #fff;
    text-align: center;
    white-space: nowrap;
    vertical-align: baseline;
    border-radius: .375rem;
    background-color: #6c757d;
}

/* progress */
[b-vnkoweq3g2] .progress {
    display: flex;
    height: 1rem;
    overflow: hidden;
    font-size: .75rem;
    background-color: #e9ecef;
    border-radius: .375rem;
}
[b-vnkoweq3g2] .progress-bar {
    display: flex;
    flex-direction: column;
    justify-content: center;
    overflow: hidden;
    color: #fff;
    text-align: center;
    white-space: nowrap;
    background-color: #0d6efd;
    transition: width .6s ease;
}

/* table */
[b-vnkoweq3g2] .table {
    width: 100%;
    margin-bottom: 1rem;
    color: #212529;
    vertical-align: top;
    border-color: #dee2e6;
    border-collapse: collapse;
}
[b-vnkoweq3g2] .table > :not(caption) > * > * {
    padding: .5rem .5rem;
    border-bottom-width: 1px;
    border-bottom-style: solid;
    border-bottom-color: #dee2e6;
    background-color: transparent;
}
[b-vnkoweq3g2] .table-sm > :not(caption) > * > * { padding: .25rem .25rem; }
[b-vnkoweq3g2] .table-hover > tbody > tr:hover > * { background-color: rgba(0, 0, 0, 0.075); }

/* =========================================================================
   ✅ Fluent_Dark / 暗色主题适配
   通过 razor 顶层 div 上的 .cc-dark 类（由 ThemesService.IsDark 决定）作为
   作用域开关，仅当本页面处于暗色主题时才覆盖颜色，不影响 Bootstrap / 亮色主题。
   说明：以下规则等价于 [b-xxx].cc-dark XXX，cc-root 在 razor 模板中，因此
   能正确接收 scoped CSS 的属性，::deep 之后的选择器作用于其内部所有后代。
   ========================================================================= */

/* —— 页面级别区域容器 —— */
.cc-dark[b-vnkoweq3g2]  .side-panel { background: #1f1f1f !important; color: #e6e6e6; }
.cc-dark[b-vnkoweq3g2]  .center-panel { background: #141414 !important; color: #e6e6e6; }

/* —— 卡片 / 信息块 —— */
.cc-dark[b-vnkoweq3g2]  .card-white {
    background: transparent !important;
    border-color: transparent !important;
    color: #e6e6e6;
    box-shadow: none;
}

/* —— 文本 —— */
.cc-dark[b-vnkoweq3g2]  .info-label { color: #b0b0b0 !important; }
.cc-dark[b-vnkoweq3g2]  .info-value { color: #f0f0f0 !important; }
.cc-dark[b-vnkoweq3g2]  .section-title-blue {
    color: #4ea1ff !important;
    border-bottom-color: #3a3a3a !important;
}
.cc-dark[b-vnkoweq3g2]  .text-muted { color: #9aa0a6 !important; }

/* —— Bootstrap 兜底类的暗色配色 —— */
.cc-dark[b-vnkoweq3g2]  .card {
    background-color: #2a2a2a !important;
    border-color: #3a3a3a !important;
    color: #e6e6e6;
}
.cc-dark[b-vnkoweq3g2]  .bg-light { background-color: #2a2a2a !important; color: #e6e6e6; }
.cc-dark[b-vnkoweq3g2]  .border { border-color: #3a3a3a !important; }
.cc-dark[b-vnkoweq3g2]  .table { color: #e6e6e6 !important; border-color: #3a3a3a !important; }
.cc-dark[b-vnkoweq3g2]  .table > :not(caption) > * > * { border-bottom-color: #3a3a3a !important; }
.cc-dark[b-vnkoweq3g2]  .table-hover > tbody > tr:hover > * { background-color: rgba(255, 255, 255, 0.06) !important; }
.cc-dark[b-vnkoweq3g2]  .progress { background-color: #333 !important; }

/* —— 按钮（次要按钮在暗色下保持可读） —— */
.cc-dark[b-vnkoweq3g2]  .btn { color: #e6e6e6; }
.cc-dark[b-vnkoweq3g2]  .btn-outline-primary { color: #4ea1ff; border-color: #4ea1ff; }
.cc-dark[b-vnkoweq3g2]  .btn-outline-primary:hover { color: #fff; background-color: #2563eb; }

/* —— 输入框 / 表格内输入 —— */
.cc-dark[b-vnkoweq3g2]  input,
.cc-dark[b-vnkoweq3g2]  select,
.cc-dark[b-vnkoweq3g2]  textarea,
.cc-dark[b-vnkoweq3g2]  .weight-input {
    background-color: #1f1f1f !important;
    border-color: #3a3a3a !important;
    color: #e6e6e6 !important;
}

/* —— 弹窗（popup） —— */
.cc-dark[b-vnkoweq3g2]  .popup-content { background: #1f1f1f; color: #e6e6e6; }
.cc-dark[b-vnkoweq3g2]  .popup-body { background: #1f1f1f; }
.cc-dark[b-vnkoweq3g2]  .popup-footer { background: #2a2a2a; border-top-color: #3a3a3a; }
.cc-dark[b-vnkoweq3g2]  .weight-table thead { background: #2a2a2a; }
.cc-dark[b-vnkoweq3g2]  .weight-table th { color: #e6e6e6; border-bottom-color: #3a3a3a; }
.cc-dark[b-vnkoweq3g2]  .weight-table td { border-bottom-color: #3a3a3a; }
.cc-dark[b-vnkoweq3g2]  .btn-cancel {
    background: #2a2a2a;
    border-color: #3a3a3a;
    color: #d0d0d0;
}
.cc-dark[b-vnkoweq3g2]  .empty-state { color: #9aa0a6; }

/* —— PDF iframe 在暗色下也保留白底（PDF 内容自身就是白的） —— */
.cc-dark[b-vnkoweq3g2]  .pdf-tab-iframe { background-color: #fff; }

/* =========================================================================
   ✅ 内联硬编码颜色的暗色覆写
   .razor 模板里大量使用 style="background: white / #f5f5f5; color: #333 ..."
   这些内联样式优先级高于普通 CSS。这里通过属性选择器 + !important 在暗色主题
   下批量纠正常见的浅色硬编码值，且仅在 .cc-dark 范围内生效。
   ========================================================================= */

/* 浅色背景 → 暗色面板 */
.cc-dark[b-vnkoweq3g2]  [style*="background: white"],
.cc-dark[b-vnkoweq3g2]  [style*="background:#fff"],
.cc-dark[b-vnkoweq3g2]  [style*="background: #fff"],
.cc-dark[b-vnkoweq3g2]  [style*="background-color: white"],
.cc-dark[b-vnkoweq3g2]  [style*="background-color:#fff"],
.cc-dark[b-vnkoweq3g2]  [style*="background-color: #fff"] {
    background: #2a2a2a !important;
    background-color: #2a2a2a !important;
    color: #e6e6e6;
}

.cc-dark[b-vnkoweq3g2]  [style*="background: #f5f5f5"],
.cc-dark[b-vnkoweq3g2]  [style*="background:#f5f5f5"],
.cc-dark[b-vnkoweq3g2]  [style*="background: #fafafa"],
.cc-dark[b-vnkoweq3g2]  [style*="background:#fafafa"],
.cc-dark[b-vnkoweq3g2]  [style*="background: #fafbfc"],
.cc-dark[b-vnkoweq3g2]  [style*="background:#fafbfc"],
.cc-dark[b-vnkoweq3g2]  [style*="background: #f5f7fa"],
.cc-dark[b-vnkoweq3g2]  [style*="background: #f0f0f0"],
.cc-dark[b-vnkoweq3g2]  [style*="background: #f6ffed"],
.cc-dark[b-vnkoweq3g2]  [style*="background: #f8f9fa"],
.cc-dark[b-vnkoweq3g2]  [style*="background:#f8f9fa"],
.cc-dark[b-vnkoweq3g2]  [style*="background: #d9d9d9"] {
    background: #262626 !important;
    color: #e6e6e6;
}

/* 信息提示蓝条 / 警告黄条 */
.cc-dark[b-vnkoweq3g2]  [style*="background: #e6f7ff"] {
    background: #0f2a44 !important; color: #cfe6ff !important;
    border-color: #1f4e7a !important;
}
.cc-dark[b-vnkoweq3g2]  [style*="background: #fff7e6"] {
    background: #3a2a10 !important; color: #ffd591 !important;
    border-color: #6b4a1a !important;
}

/* 渐变背景（左侧滚动区） */
.cc-dark[b-vnkoweq3g2]  [style*="linear-gradient(180deg, #fafbfc"],
.cc-dark[b-vnkoweq3g2]  [style*="linear-gradient(180deg,#fafbfc"] {
    background: linear-gradient(180deg, #1a1a1a 0%, #141414 100%) !important;
}

/* 浅色边框 */
.cc-dark[b-vnkoweq3g2]  [style*="border: 1px solid #e8e8e8"],
.cc-dark[b-vnkoweq3g2]  [style*="border: 1px solid #e0e6ed"],
.cc-dark[b-vnkoweq3g2]  [style*="border: 1px solid #e0e0e0"],
.cc-dark[b-vnkoweq3g2]  [style*="border-bottom: 1px solid #e8e8e8"],
.cc-dark[b-vnkoweq3g2]  [style*="border-bottom: 1px solid #e9ecef"],
.cc-dark[b-vnkoweq3g2]  [style*="border-bottom: 1px solid #e0e6ed"],
.cc-dark[b-vnkoweq3g2]  [style*="border-top: 1px solid #e0e6ed"],
.cc-dark[b-vnkoweq3g2]  [style*="border-bottom: 2px solid #e0e0e0"],
.cc-dark[b-vnkoweq3g2]  [style*="border-color: #e8e8e8"] {
    border-color: #3a3a3a !important;
}

/* 暗色文字（覆盖内联 #333 / #666 / #999） */
.cc-dark[b-vnkoweq3g2]  [style*="color: #333"] { color: #f0f0f0 !important; }
.cc-dark[b-vnkoweq3g2]  [style*="color:#333"] { color: #f0f0f0 !important; }
.cc-dark[b-vnkoweq3g2]  [style*="color: #666"] { color: #b8b8b8 !important; }
.cc-dark[b-vnkoweq3g2]  [style*="color:#666"] { color: #b8b8b8 !important; }
.cc-dark[b-vnkoweq3g2]  [style*="color: #999"] { color: #909090 !important; }
.cc-dark[b-vnkoweq3g2]  [style*="color:#999"] { color: #909090 !important; }
.cc-dark[b-vnkoweq3g2]  [style*="color: #888"] { color: #a0a0a0 !important; }
.cc-dark[b-vnkoweq3g2]  [style*="color:#888"] { color: #a0a0a0 !important; }
.cc-dark[b-vnkoweq3g2]  [style*="color: #bbb"] { color: #888 !important; }
.cc-dark[b-vnkoweq3g2]  [style*="color: #ccc"] { color: #777 !important; }
.cc-dark[b-vnkoweq3g2]  [style*="color: #6c757d"] { color: #a0a6ad !important; }
.cc-dark[b-vnkoweq3g2]  [style*="color: #d46b08"] { color: #ffd591 !important; }

/* 暗底里成功/警告/错误文字保持原色但稍微提亮 */
.cc-dark[b-vnkoweq3g2]  [style*="color: #155724"] { color: #4ade80 !important; }
.cc-dark[b-vnkoweq3g2]  [style*="color: #721c24"] { color: #ff7875 !important; }

/* 蓝色链接稍微调亮以提高暗底对比度 */
.cc-dark[b-vnkoweq3g2]  [style*="color: #1890ff"] { color: #4ea1ff !important; }

/* 下划线 / hr */
.cc-dark[b-vnkoweq3g2]  hr[style*="#e8e8e8"] { border-color: #3a3a3a !important; }

/* sticky 表头浅灰 → 暗色 */
.cc-dark[b-vnkoweq3g2]  thead[style*="background: #f5f5f5"],
.cc-dark[b-vnkoweq3g2]  thead[style*="background:#f5f5f5"] {
    background: #262626 !important;
}

/* 卡片浅色阴影在暗底下不明显，加个深色阴影 */
.cc-dark[b-vnkoweq3g2]  [style*="box-shadow: 0 2px 8px rgba(0,0,0,0.04)"] {
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.5) !important;
}
/* /Components/Pages/Qualityinspection/DefectRegistrationv2.razor.rz.scp.css */
/* =========================================================
   DefectRegistration scoped styles
   目标：手机 / iPad（横竖屏）/ 桌面 同一套响应式样式
   ========================================================= */

/* --------- 根容器 --------- */
.dr-root[b-cw547wdqwt] {
    --dr-bg: #f4f6f9;
    --dr-card: #ffffff;
    --dr-border: #e5e9f0;
    --dr-text: #1f2937;
    --dr-text-muted: #6b7280;
    --dr-primary: #1890ff;
    --dr-primary-dark: #096dd9;
    --dr-danger: #ff4d4f;
    --dr-warning: #faad14;
    --dr-success: #52c41a;
    --dr-shadow: 0 1px 3px rgba(0, 0, 0, 0.06), 0 1px 2px rgba(0, 0, 0, 0.04);

    display: flex;
    flex-direction: column;
    height: calc(100vh - 120px);
    min-height: 540px;
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
    background: var(--dr-bg);
    color: var(--dr-text);
    font-size: 13px;
    overflow: hidden;
    overscroll-behavior: contain;
    -webkit-tap-highlight-color: transparent;
}

.dr-root.dr-dark[b-cw547wdqwt] {
    --dr-bg: #1f2329;
    --dr-card: #2a2f37;
    --dr-border: #3a414b;
    --dr-text: #e6e8eb;
    --dr-text-muted: #9aa3af;
    --dr-shadow: 0 1px 3px rgba(0, 0, 0, 0.4);
}

/* --------- 顶部条 --------- */
.dr-header[b-cw547wdqwt] {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
    padding: 6px 10px;
    background: var(--dr-card);
    border-bottom: 1px solid var(--dr-border);
    box-shadow: var(--dr-shadow);
    z-index: 5;
}

.dr-header-left[b-cw547wdqwt],
.dr-header-center[b-cw547wdqwt],
.dr-header-right[b-cw547wdqwt] {
    display: flex;
    align-items: center;
    gap: 6px;
}

.dr-header-left[b-cw547wdqwt] { flex: 1 1 280px; }
.dr-header-center[b-cw547wdqwt] { flex: 0 0 auto; }
.dr-header-right[b-cw547wdqwt] { margin-left: auto; }

.dr-label[b-cw547wdqwt] {
    font-weight: 600;
    color: var(--dr-text-muted);
    font-size: 12px;
}

.dr-order-input[b-cw547wdqwt] {
    flex: 1;
    min-width: 160px;
    max-width: 280px;
    height: 32px;
    padding: 0 10px;
    font-size: 14px;
    border: 1px solid var(--dr-border);
    border-radius: 6px;
    background: var(--dr-card);
    color: var(--dr-text);
    outline: none;
    transition: border-color .2s;
}

.dr-order-input:focus[b-cw547wdqwt] { border-color: var(--dr-primary); }

/* --------- 色号 / 尺码下拉 --------- */
.dr-cs-select[b-cw547wdqwt] {
    height: 32px;
    min-width: 120px;
    max-width: 200px;
    padding: 0 8px;
    font-size: 13px;
    border: 1px solid var(--dr-border);
    border-radius: 6px;
    background: var(--dr-card);
    color: var(--dr-text);
    outline: none;
    cursor: pointer;
    transition: border-color .2s;
}

.dr-cs-select:focus[b-cw547wdqwt] { border-color: var(--dr-primary); }

/* --------- 尺码：平板平铺直选（替代下拉） --------- */
.dr-size-chips[b-cw547wdqwt] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px;
    max-width: 520px;
}

.dr-size-chip[b-cw547wdqwt] {
    min-width: 48px;
    height: 38px;
    padding: 0 14px;
    font-size: 15px;
    font-weight: 600;
    border: 1px solid var(--dr-border);
    border-radius: 8px;
    background: var(--dr-card);
    color: var(--dr-text);
    cursor: pointer;
    outline: none;
    transition: all .15s;
    -webkit-tap-highlight-color: transparent;
}

.dr-size-chip:hover[b-cw547wdqwt] { border-color: var(--dr-primary); }

.dr-size-chip.active[b-cw547wdqwt] {
    background: var(--dr-primary);
    border-color: var(--dr-primary);
    color: #fff;
    box-shadow: 0 2px 6px rgba(24, 144, 255, .35);
}

.dr-size-empty[b-cw547wdqwt] {
    font-size: 13px;
    color: var(--dr-text-muted);
}


/* 已登记面板上下文标签 */
.dr-cs-tag[b-cw547wdqwt] {
    display: inline-block;
    padding: 2px 10px;
    border-radius: 11px;
    background: rgba(24, 144, 255, .12);
    color: var(--dr-primary);
    font-size: 12px;
    font-weight: 600;
    white-space: nowrap;
}.dr-total-label[b-cw547wdqwt] {
    color: var(--dr-text-muted);
    font-size: 12px;
}

.dr-total-badge[b-cw547wdqwt] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 36px;
    height: 26px;
    padding: 0 10px;
    border-radius: 13px;
    background: linear-gradient(135deg, #ff4d4f 0%, #ff7875 100%);
    color: #fff;
    font-weight: 700;
    font-size: 14px;
    box-shadow: 0 1px 4px rgba(255, 77, 79, .35);
}

.dr-total-sub[b-cw547wdqwt] { color: var(--dr-text-muted); font-size: 11px; }

/* --------- 正品数量录入入口按钮 --------- */
.dr-quality-entry[b-cw547wdqwt] {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    height: 30px;
    padding: 0 12px;
    margin-right: 8px;
    border-radius: 8px;
    background: rgba(82, 196, 26, .1);
    border: 1px solid rgba(82, 196, 26, .35);
    color: #389e0d;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    white-space: nowrap;
    transition: background-color .2s, transform .1s;
}

.dr-quality-entry:hover[b-cw547wdqwt] { background: rgba(82, 196, 26, .18); }
.dr-quality-entry:active[b-cw547wdqwt] { transform: scale(0.97); }

.dr-quality-entry-num[b-cw547wdqwt] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 30px;
    height: 22px;
    padding: 0 8px;
    border-radius: 11px;
    background: linear-gradient(135deg, #52c41a 0%, #73d13d 100%);
    color: #fff;
    font-weight: 700;
    font-size: 13px;
}

.dr-quality-entry-saved[b-cw547wdqwt] { color: var(--dr-text-muted); font-size: 11px; }

.dr-root.dr-dark .dr-quality-entry[b-cw547wdqwt] {
    background: rgba(82, 196, 26, .15);
    border-color: rgba(82, 196, 26, .4);
    color: #95de64;
}

/* --------- 正品数量录入弹窗 --------- */
.dr-qty-popup[b-cw547wdqwt] { padding: 4px; }

.dr-qty-summary[b-cw547wdqwt] {
    font-size: 13px;
    color: var(--dr-text-muted);
    padding: 4px 2px 10px;
}
.dr-qty-summary b[b-cw547wdqwt] { color: var(--dr-text); }
.dr-qty-summary .dr-qty-total[b-cw547wdqwt] { color: #52c41a; }

.dr-qty-table-wrap[b-cw547wdqwt] {
    max-height: 60vh;
    overflow: auto;
    border: 1px solid var(--dr-border);
    border-radius: 8px;
}

.dr-qty-table[b-cw547wdqwt] {
    width: 100%;
    border-collapse: collapse;
    font-size: 13px;
}

.dr-qty-table thead th[b-cw547wdqwt] {
    position: sticky;
    top: 0;
    z-index: 2;
    background: var(--dr-card);
    color: var(--dr-text-muted);
    font-weight: 600;
    text-align: center;
    padding: 8px 10px;
    border-bottom: 2px solid var(--dr-border);
    white-space: nowrap;
}

.dr-qty-table tbody td[b-cw547wdqwt] {
    padding: 6px 10px;
    text-align: center;
    border-bottom: 1px solid var(--dr-border);
    color: var(--dr-text);
    white-space: nowrap;
}

.dr-qty-table tbody tr.has-qty[b-cw547wdqwt] { background: rgba(82, 196, 26, .07); }
.dr-qty-table tbody tr:hover[b-cw547wdqwt] { background: rgba(24, 144, 255, .06); }

.dr-qty-colorno[b-cw547wdqwt] { font-weight: 600; }

.dr-qty-size[b-cw547wdqwt] {
    display: inline-block;
    padding: 1px 8px;
    border-radius: 10px;
    background: rgba(24, 144, 255, .12);
    color: var(--dr-primary);
    font-weight: 600;
}

.dr-qty-saved-cell[b-cw547wdqwt] { color: var(--dr-text-muted); font-weight: 600; }

.dr-qty-table .dr-quick-btns[b-cw547wdqwt] { justify-content: center; }
.dr-qty-table .dr-counter-pill[b-cw547wdqwt] { margin: 0 auto; }

/* --------- 弹窗页脚按钮（弹窗在 .dr-root 之外渲染，需独立颜色，不依赖 CSS 变量） --------- */
.dr-popup-btn[b-cw547wdqwt] {
    height: 34px;
    padding: 0 18px;
    border-radius: 6px;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 5px;
    transition: background-color .2s, border-color .2s, transform .1s;
}

.dr-popup-btn:active[b-cw547wdqwt] { transform: scale(0.97); }
.dr-popup-btn:disabled[b-cw547wdqwt] { opacity: .6; cursor: not-allowed; }

.dr-popup-btn-ghost[b-cw547wdqwt] {
    background: #fff;
    border: 1px solid #d9d9d9;
    color: #333;
}
.dr-popup-btn-ghost:hover[b-cw547wdqwt] { border-color: #1890ff; color: #1890ff; }

.dr-popup-btn-primary[b-cw547wdqwt] {
    background: #52c41a;
    border: 1px solid #52c41a;
    color: #fff;
    box-shadow: 0 2px 6px rgba(82, 196, 26, .35);
}
.dr-popup-btn-primary:hover:not(:disabled)[b-cw547wdqwt] { background: #389e0d; border-color: #389e0d; }

/* --------- 快捷录入按钮（共享） --------- */
.dr-quick-btns[b-cw547wdqwt] {
    display: inline-flex;
    gap: 4px;
}

.dr-quick-btn[b-cw547wdqwt] {
    min-width: 30px;
    height: 26px;
    padding: 0 6px;
    border: 1px solid rgba(82, 196, 26, .4);
    border-radius: 13px;
    background: var(--dr-card);
    color: #52c41a;
    font-size: 12px;
    font-weight: 700;
    cursor: pointer;
    touch-action: manipulation;
    transition: background-color .15s, transform .1s, color .15s;
}

.dr-quick-btn:hover[b-cw547wdqwt] { background: rgba(82, 196, 26, .15); }
.dr-quick-btn:active[b-cw547wdqwt] { transform: scale(0.92); }

.dr-quick-btn.active[b-cw547wdqwt] {
    background: #52c41a;
    border-color: #52c41a;
    color: #fff;
}

.dr-root.dr-dark .dr-quick-btn[b-cw547wdqwt] { background: #2a2f37; }
.dr-root.dr-dark .dr-quick-btn:hover[b-cw547wdqwt] { background: rgba(82, 196, 26, .2); }
.dr-root.dr-dark .dr-quick-btn.active[b-cw547wdqwt] { background: #52c41a; color: #fff; }

/* --------- 按钮通用 --------- */
.dr-btn[b-cw547wdqwt] {
    height: 32px;
    padding: 0 14px;
    border: 1px solid var(--dr-border);
    border-radius: 6px;
    background: var(--dr-card);
    color: var(--dr-text);
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 5px;
    touch-action: manipulation;
    user-select: none;
    transition: transform .1s, background-color .2s, border-color .2s;
}

.dr-btn:active[b-cw547wdqwt] { transform: scale(0.97); }
.dr-btn:disabled[b-cw547wdqwt] { opacity: .55; cursor: not-allowed; }

.dr-btn-primary[b-cw547wdqwt] {
    background: var(--dr-primary);
    border-color: var(--dr-primary);
    color: #fff;
    box-shadow: 0 2px 6px rgba(24, 144, 255, .35);
}
.dr-btn-primary:hover:not(:disabled)[b-cw547wdqwt] { background: var(--dr-primary-dark); }

.dr-btn-ghost:hover[b-cw547wdqwt] { border-color: var(--dr-primary); color: var(--dr-primary); }

/* --------- 手机端 tab 切换（默认隐藏，移动端显示） --------- */
.dr-mobile-tabs[b-cw547wdqwt] {
    display: none;
    border-bottom: 1px solid var(--dr-border);
    background: var(--dr-card);
}

.dr-mobile-tabs button[b-cw547wdqwt] {
    flex: 1;
    height: 36px;
    border: none;
    background: transparent;
    color: var(--dr-text-muted);
    font-size: 12px;
    font-weight: 600;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
    border-bottom: 3px solid transparent;
    cursor: pointer;
    touch-action: manipulation;
}

.dr-mobile-tabs button.active[b-cw547wdqwt] {
    color: var(--dr-primary);
    border-bottom-color: var(--dr-primary);
}

.dr-mini-badge[b-cw547wdqwt] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 18px;
    height: 18px;
    padding: 0 5px;
    border-radius: 9px;
    background: var(--dr-danger);
    color: #fff;
    font-size: 10px;
    font-weight: 700;
}

/* --------- 主体布局 --------- */
.dr-body[b-cw547wdqwt] {
    flex: 1 1 auto;
    display: flex;
    flex-direction: row;
    gap: 4px;
    padding: 4px;
    width: 100%;
    min-width: 0;
    min-height: 0;
    box-sizing: border-box;
    overflow: hidden;
}

.dr-panel[b-cw547wdqwt] {
    display: flex;
    flex-direction: column;
    background: var(--dr-card);
    border: 1px solid var(--dr-border);
    border-radius: 6px;
    box-shadow: var(--dr-shadow);
    overflow: hidden;
    min-width: 0;
    min-height: 0;
}

/* 左：疵点选择 —— 固定宽度 sidebar */
.dr-panel.dr-defects[b-cw547wdqwt] {
    flex: 0 0 260px;
    width: 260px;
}

/* 右：已登记 —— 占据剩余全部空间 */
.dr-panel.dr-records[b-cw547wdqwt] {
    flex: 1 1 auto;
    width: auto;
}

.dr-panel-head[b-cw547wdqwt] {
    padding: 4px 6px;
    border-bottom: 1px solid var(--dr-border);
    display: flex;
    flex-direction: column;
    gap: 4px;
    background: var(--dr-card);
}

.dr-panel-title[b-cw547wdqwt] { font-size: 12px; font-weight: 700; color: var(--dr-text); }
.dr-panel-sub[b-cw547wdqwt] { font-size: 10px; color: var(--dr-text-muted); }

/* --------- 搜索 + tabs --------- */
.dr-search[b-cw547wdqwt] {
    position: relative;
    display: flex;
    align-items: center;
}

.dr-search > i.bi-search[b-cw547wdqwt] {
    position: absolute;
    left: 8px;
    color: var(--dr-text-muted);
    pointer-events: none;
    font-size: 11px;
}

.dr-search input[b-cw547wdqwt] {
    width: 100%;
    height: 26px;
    padding: 0 26px;
    border: 1px solid var(--dr-border);
    border-radius: 5px;
    background: var(--dr-bg);
    color: var(--dr-text);
    font-size: 12px;
    outline: none;
}

.dr-search input:focus[b-cw547wdqwt] { border-color: var(--dr-primary); background: var(--dr-card); }

.dr-search-clear[b-cw547wdqwt] {
    position: absolute;
    right: 8px;
    color: var(--dr-text-muted);
    cursor: pointer;
    font-size: 15px;
}

.dr-tabs[b-cw547wdqwt] {
    display: flex;
    gap: 5px;
    overflow-x: auto;
    padding-bottom: 2px;
    scrollbar-width: thin;
}

.dr-tab[b-cw547wdqwt] {
    flex: 0 0 auto;
    min-width: 36px;
    height: 26px;
    padding: 0 8px;
    border: 1px solid var(--dr-border);
    border-radius: 13px;
    background: var(--dr-card);
    color: var(--dr-text-muted);
    font-size: 11px;
    font-weight: 600;
    cursor: pointer;
    touch-action: manipulation;
    user-select: none;
    transition: all .15s;
}

.dr-tab.active[b-cw547wdqwt] {
    background: var(--dr-primary);
    border-color: var(--dr-primary);
    color: #fff;
}

.dr-tab:active[b-cw547wdqwt] { transform: scale(0.96); }

/* --------- 疵点面板内部布局：左侧通讯录式索引条 + 右侧主区 --------- */
.dr-defects-inner[b-cw547wdqwt] {
    flex: 1;
    display: flex;
    flex-direction: row;
    min-height: 0;
    min-width: 0;
}

.dr-alt-strip[b-cw547wdqwt] {
    flex: 0 0 auto;
    width: 34px;
    overflow-y: auto;
    overflow-x: hidden;
    padding: 3px 2px;
    display: flex;
    flex-direction: column;
    gap: 2px;
    border-right: 1px solid var(--dr-border);
    background: linear-gradient(180deg, rgba(24, 144, 255, .04), transparent 60%);
    scrollbar-width: thin;
}

.dr-alt-item[b-cw547wdqwt] {
    width: 100%;
    min-height: 22px;
    padding: 1px 3px;
    border: none;
    border-radius: 5px;
    background: transparent;
    color: var(--dr-text-muted);
    font-size: 10px;
    font-weight: 600;
    cursor: pointer;
    touch-action: manipulation;
    user-select: none;
    word-break: break-all;
    line-height: 1.15;
    transition: background-color .15s, color .15s, transform .08s;
    text-align: center;
}

.dr-alt-item:hover[b-cw547wdqwt] { color: var(--dr-primary); background: rgba(24, 144, 255, .08); }
.dr-alt-item:active[b-cw547wdqwt] { transform: scale(0.94); }
.dr-alt-item.active[b-cw547wdqwt] {
    background: var(--dr-primary);
    color: #fff;
    box-shadow: 0 2px 6px rgba(24, 144, 255, .35);
}

.dr-defects-main[b-cw547wdqwt] {
    flex: 1 1 auto;
    display: flex;
    flex-direction: column;
    min-width: 0;
    min-height: 0;
}

/* --------- 疵点按钮网格 --------- */
.dr-defect-grid[b-cw547wdqwt] {
    flex: 1;
    overflow-y: auto;
    padding: 8px;
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(96px, 1fr));
    gap: 6px;
    align-content: start;
}

.dr-defect-card[b-cw547wdqwt] {
    position: relative;
    min-height: 64px;
    padding: 6px 4px;
    border: 1px solid var(--dr-border);
    border-radius: 8px;
    background: var(--dr-card);
    color: var(--dr-text);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 3px;
    cursor: pointer;
    touch-action: manipulation;
    user-select: none;
    transition: transform .08s, border-color .15s, background-color .15s;
    text-align: center;
}

.dr-defect-card:hover[b-cw547wdqwt] {
    border-color: var(--dr-primary);
    background: rgba(24, 144, 255, .06);
}
.dr-defect-card:active[b-cw547wdqwt] { transform: scale(0.96); }

.dr-defect-card.selected[b-cw547wdqwt] {
    border-color: var(--dr-primary);
    background: rgba(24, 144, 255, .12);
    box-shadow: inset 0 0 0 1px var(--dr-primary);
}

.dr-defect-name[b-cw547wdqwt] {
    font-size: 12px;
    font-weight: 600;
    line-height: 1.2;
    word-break: break-all;
}

.dr-defect-code[b-cw547wdqwt] { font-size: 10px; color: var(--dr-text-muted); }

.dr-defect-badge[b-cw547wdqwt] {
    position: absolute;
    top: -5px;
    right: -5px;
    min-width: 18px;
    height: 18px;
    padding: 0 5px;
    border-radius: 9px;
    background: var(--dr-danger);
    color: #fff;
    font-size: 10px;
    font-weight: 700;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 2px 4px rgba(255, 77, 79, .4);
}

/* --------- 已登记卡片 --------- */
.dr-record-grid[b-cw547wdqwt] {
    flex: 1;
    overflow-y: auto;
    padding: 8px;
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(190px, 1fr));
    gap: 8px;
    align-content: start;
}

.dr-record-card[b-cw547wdqwt] {
    position: relative;
    background: var(--dr-card);
    border: 1px solid var(--dr-border);
    border-radius: 9px;
    padding: 8px;
    display: flex;
    flex-direction: column;
    gap: 6px;
    box-shadow: var(--dr-shadow);
    transition: box-shadow .2s, transform .1s, border-color .2s;
}

.dr-record-card:hover[b-cw547wdqwt] {
    border-color: rgba(24, 144, 255, .35);
    box-shadow: 0 4px 14px rgba(24, 144, 255, .12);
}

/* 顶部彩色装饰条 */
.dr-record-card[b-cw547wdqwt]::before {
    content: "";
    position: absolute;
    left: 8px;
    right: 8px;
    top: 0;
    height: 2px;
    border-radius: 0 0 2px 2px;
    background: linear-gradient(90deg, var(--dr-primary), #69c0ff);
    opacity: .85;
}

.dr-record-head[b-cw547wdqwt] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 6px;
    padding-top: 2px;
}

.dr-record-owner[b-cw547wdqwt] {
    display: flex;
    align-items: center;
    gap: 4px;
    font-size: 11px;
    color: var(--dr-text-muted);
    margin-top: 2px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.dr-record-name[b-cw547wdqwt] {
    font-size: 13px;
    font-weight: 700;
    line-height: 1.2;
    color: var(--dr-text);
    flex: 1;
    min-width: 0;
    overflow: hidden;
}
.dr-record-name small[b-cw547wdqwt] {
    display: block;
    font-size: 10px;
    font-weight: 500;
    color: var(--dr-text-muted);
    margin-top: 2px;
    letter-spacing: .3px;
}

/* --------- 计数 pill + 添加按钮 同一行 --------- */
.dr-counter-row[b-cw547wdqwt] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 6px;
}

.dr-counter-pill[b-cw547wdqwt] {
    display: inline-flex;
    align-items: center;
    background: linear-gradient(180deg, #f5f9ff 0%, #e8f1fd 100%);
    border: 1px solid rgba(24, 144, 255, .25);
    border-radius: 18px;
    padding: 2px;
}

.dr-root.dr-dark .dr-counter-pill[b-cw547wdqwt] {
    background: linear-gradient(180deg, #2f3640 0%, #2a2f37 100%);
    border-color: rgba(24, 144, 255, .35);
}

.dr-counter-btn[b-cw547wdqwt] {
    width: 26px;
    height: 26px;
    border-radius: 50%;
    border: none;
    background: var(--dr-card);
    color: var(--dr-primary);
    font-size: 15px;
    font-weight: 700;
    cursor: pointer;
    touch-action: manipulation;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 1px 2px rgba(0, 0, 0, .08);
    transition: background-color .15s, transform .1s;
}
.dr-counter-btn:hover[b-cw547wdqwt] { background: var(--dr-primary); color: #fff; }
.dr-counter-btn:active[b-cw547wdqwt] { transform: scale(0.9); }

.dr-counter-num[b-cw547wdqwt] {
    min-width: 36px;
    text-align: center;
    font-size: 15px;
    font-weight: 800;
    color: var(--dr-primary);
    padding: 0 4px;
    font-variant-numeric: tabular-nums;
}

/* --------- 通用图标按钮 --------- */
.dr-icon-btn[b-cw547wdqwt] {
    width: 26px;
    height: 26px;
    border-radius: 6px;
    border: 1px solid var(--dr-border);
    background: var(--dr-card);
    color: var(--dr-text-muted);
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    touch-action: manipulation;
    font-size: 12px;
    transition: all .15s;
}
.dr-icon-btn:active[b-cw547wdqwt] { transform: scale(0.92); }
.dr-icon-btn.dr-danger:hover[b-cw547wdqwt] {
    background: var(--dr-danger);
    border-color: var(--dr-danger);
    color: #fff;
}

/* --------- 相册区 --------- */
.dr-photos[b-cw547wdqwt] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 4px;
}

.dr-photo[b-cw547wdqwt] {
    position: relative;
    width: 100%;
    height: 78px;
    border-radius: 6px;
    overflow: hidden;
    border: 1px solid var(--dr-border);
    background: var(--dr-bg);
}

.dr-photo img[b-cw547wdqwt] {
    width: 100%;
    height: 100%;
    object-fit: cover;
    cursor: zoom-in;
    display: block;
    transition: transform .25s;
}
.dr-photo:hover img[b-cw547wdqwt] { transform: scale(1.06); }

.dr-photo-del[b-cw547wdqwt] {
    position: absolute;
    top: 3px;
    right: 3px;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    border: none;
    color: #fff;
    background: rgba(0, 0, 0, .55);
    cursor: pointer;
    font-size: 12px;
    line-height: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    transition: opacity .15s, background-color .15s;
}
.dr-photo:hover .dr-photo-del[b-cw547wdqwt] { opacity: 1; }
.dr-photo-del:hover[b-cw547wdqwt] { background: var(--dr-danger); }

/* 触屏设备：始终显示删除按钮 */
@media (hover: none) {
    .dr-photo-del[b-cw547wdqwt] { opacity: 1; }
}

.dr-photo-add[b-cw547wdqwt] {
    width: 100%;
    aspect-ratio: 1 / 1;
    border: 2px dashed var(--dr-border);
    border-radius: 6px;
    background: var(--dr-bg);
    color: var(--dr-text-muted);
    cursor: pointer;
    display: inline-flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 3px;
    font-size: 11px;
    font-weight: 600;
    touch-action: manipulation;
    transition: all .15s;
}
.dr-photo-add i[b-cw547wdqwt] { font-size: 18px; line-height: 1; }
.dr-photo-add:hover[b-cw547wdqwt] {
    border-color: var(--dr-primary);
    color: var(--dr-primary);
    background: rgba(24, 144, 255, .06);
}
.dr-photo-add:active[b-cw547wdqwt] { transform: scale(0.96); }

/* 无照片占位 —— 高度与单张照片 tile 接近，保持卡片对称 */
.dr-photos-empty[b-cw547wdqwt] {
    width: 100%;
    min-height: 64px;
    border: 1px dashed var(--dr-border);
    border-radius: 6px;
    background: repeating-linear-gradient(
        45deg,
        var(--dr-bg),
        var(--dr-bg) 8px,
        rgba(0, 0, 0, .02) 8px,
        rgba(0, 0, 0, .02) 16px
    );
    color: var(--dr-text-muted);
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    font-size: 11px;
    font-weight: 500;
    touch-action: manipulation;
    transition: all .15s;
}
.dr-photos-empty i[b-cw547wdqwt] { font-size: 15px; opacity: .7; }
.dr-photos-empty:hover[b-cw547wdqwt] {
    border-color: var(--dr-primary);
    color: var(--dr-primary);
    background: rgba(24, 144, 255, .04);
}
.dr-photos-empty:active[b-cw547wdqwt] { transform: scale(0.99); }

.dr-root.dr-dark .dr-photos-empty[b-cw547wdqwt] {
    background: repeating-linear-gradient(
        45deg,
        var(--dr-bg),
        var(--dr-bg) 8px,
        rgba(255, 255, 255, .03) 8px,
        rgba(255, 255, 255, .03) 16px
    );
}

/* 计数器行右侧"添加照片"按钮 */
.dr-add-btn[b-cw547wdqwt] {
    height: 28px;
    padding: 0 10px;
    border: 1px dashed var(--dr-border);
    border-radius: 14px;
    background: var(--dr-card);
    color: var(--dr-text-muted);
    font-size: 12px;
    font-weight: 600;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 5px;
    touch-action: manipulation;
    user-select: none;
    transition: all .15s;
}
.dr-add-btn i[b-cw547wdqwt] { font-size: 13px; }
.dr-add-btn:hover[b-cw547wdqwt] {
    border-style: solid;
    border-color: var(--dr-primary);
    color: var(--dr-primary);
    background: rgba(24, 144, 255, .06);
}
.dr-add-btn:active[b-cw547wdqwt] { transform: scale(0.96); }

/* --------- 备注 --------- */
.dr-remark[b-cw547wdqwt] {
    width: 100%;
    min-height: 30px;
    max-height: 70px;
    padding: 4px 6px;
    border: 1px solid var(--dr-border);
    border-radius: 4px;
    background: var(--dr-bg);
    color: var(--dr-text);
    font-size: 11px;
    resize: vertical;
    outline: none;
    font-family: inherit;
}
.dr-remark:focus[b-cw547wdqwt] { border-color: var(--dr-primary); background: var(--dr-card); }

/* --------- 空状态 --------- */
.dr-empty[b-cw547wdqwt] {
    grid-column: 1 / -1;
    padding: 28px 16px;
    text-align: center;
    color: var(--dr-text-muted);
    font-size: 12px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 5px;
}

/* --------- 弹窗 --------- */
.dr-popup-header[b-cw547wdqwt] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    width: 100%;
}

.dr-popup-header-title[b-cw547wdqwt] {
    font-size: 15px;
    font-weight: 600;
    color: var(--dr-text, #111827);
}

.dr-popup-header-emp[b-cw547wdqwt] {
    font-size: 13px;
    color: var(--dr-text-muted, #6b7280);
    display: flex;
    align-items: center;
    gap: 4px;
    white-space: nowrap;
}

.dr-popup-header-emp .dr-roster-current[b-cw547wdqwt] {
    color: var(--dr-primary, #2563eb);
    font-weight: 500;
}

.dr-popup-body[b-cw547wdqwt] {
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    gap: 12px;
    width: 100%;
}

.dr-popup-main[b-cw547wdqwt] {
    display: flex;
    flex-direction: column;
    gap: 10px;
    flex: 0 0 300px;
    width: 300px;
    min-width: 0;
}

/* --------- 弹窗右侧班组名单 --------- */
.dr-popup-roster[b-cw547wdqwt] {
    flex: 1 1 auto;
    min-width: 0;
    max-height: 380px;
    display: flex;
    flex-direction: column;
    border-left: 1px solid var(--dr-border, #e5e7eb);
    padding-left: 10px;
}

.dr-popup-roster-head[b-cw547wdqwt] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    margin-bottom: 8px;
}

.dr-popup-roster-title[b-cw547wdqwt] {
    font-size: 13px;
    font-weight: 600;
    color: var(--dr-text, #111827);
}

.dr-roster-current[b-cw547wdqwt] {
    font-size: 11px;
    color: var(--dr-primary, #2563eb);
}

.dr-roster-list[b-cw547wdqwt] {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 6px;
    overflow-y: auto;
    padding-right: 4px;
}

.dr-roster-item[b-cw547wdqwt] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 1px;
    padding: 6px 8px;
    border: 1px solid var(--dr-border, #e5e7eb);
    border-radius: 8px;
    background: var(--dr-card, #fff);
    cursor: pointer;
    text-align: left;
    min-width: 0;
    overflow: hidden;
    transition: all .15s;
}

.dr-roster-item:hover[b-cw547wdqwt] {
    border-color: var(--dr-primary, #2563eb);
}

.dr-roster-item.active[b-cw547wdqwt] {
    border-color: var(--dr-primary, #2563eb);
    background: var(--dr-primary-soft, #eff6ff);
}

.dr-roster-name[b-cw547wdqwt] {
    font-size: 13px;
    font-weight: 500;
    color: var(--dr-text, #111827);
    max-width: 100%;
    word-break: break-all;
}

.dr-roster-no[b-cw547wdqwt] {
    font-size: 11px;
    color: var(--dr-text-muted, #6b7280);
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

@media (max-width: 640px) {
    .dr-popup-body[b-cw547wdqwt] { flex-direction: column; }
    .dr-popup-roster[b-cw547wdqwt] {
        flex: 1 1 auto;
        width: 100%;
        max-height: 180px;
        border-left: none;
        border-top: 1px solid var(--dr-border, #e5e7eb);
        padding-left: 0;
        padding-top: 10px;
    }
}

.dr-popup-existing-title[b-cw547wdqwt] { font-size: 11px; color: var(--dr-text-muted); margin-bottom: 4px; }
.dr-popup-existing-list[b-cw547wdqwt] { display: flex; flex-wrap: wrap; gap: 5px; }

.dr-photo.dr-photo-sm[b-cw547wdqwt] {
    width: 60px;
    height: 60px;
    flex: 0 0 60px;
    aspect-ratio: unset;
}

/* --------- 图片放大预览（全屏遮罩） --------- */
.dr-preview-overlay[b-cw547wdqwt] {
    position: fixed;
    inset: 0;
    z-index: 9999;
    background: rgba(0, 0, 0, .88);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 24px;
    cursor: zoom-out;
    animation: dr-fade-in-b-cw547wdqwt .15s ease-out;
    -webkit-backdrop-filter: blur(2px);
    backdrop-filter: blur(2px);
}

.dr-preview-img[b-cw547wdqwt] {
    max-width: 96vw;
    max-height: 92vh;
    object-fit: contain;
    border-radius: 6px;
    box-shadow: 0 10px 40px rgba(0, 0, 0, .6);
    cursor: default;
    touch-action: pinch-zoom;
    user-select: none;
    -webkit-user-drag: none;
}

.dr-preview-close[b-cw547wdqwt] {
    position: absolute;
    top: 14px;
    right: 14px;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    border: none;
    background: rgba(255, 255, 255, .15);
    color: #fff;
    font-size: 16px;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: background-color .2s, transform .1s;
    backdrop-filter: blur(4px);
}
.dr-preview-close:hover[b-cw547wdqwt] { background: rgba(255, 255, 255, .28); }
.dr-preview-close:active[b-cw547wdqwt] { transform: scale(0.92); }

@keyframes dr-fade-in-b-cw547wdqwt {
    from { opacity: 0; }
    to   { opacity: 1; }
}

/* =========================================================
   响应式断点
   ========================================================= */

/* iPad 竖屏 / 中等屏：上下双栏 */
@media (max-width: 1023px) {
    .dr-body[b-cw547wdqwt] {
        flex-direction: column;
    }
    .dr-panel.dr-defects[b-cw547wdqwt] {
        flex: 0 0 45%;
        width: 100%;
    }
    .dr-panel.dr-records[b-cw547wdqwt] {
        flex: 1 1 auto;
        width: 100%;
    }
}

/* 手机端：单栏 + tab 切换 */
@media (max-width: 767px) {
    .dr-mobile-tabs[b-cw547wdqwt] { display: flex; }

    .dr-body[b-cw547wdqwt] {
        display: block;
        padding: 6px;
        overflow-y: hidden;
    }

    .dr-panel[b-cw547wdqwt] { display: none; height: 100%; width: 100%; }
    .dr-panel.mobile-active[b-cw547wdqwt] { display: flex; }
    .dr-panel.dr-defects[b-cw547wdqwt],
    .dr-panel.dr-records[b-cw547wdqwt] { flex: 1 1 auto; width: 100%; }

    .dr-header[b-cw547wdqwt] { padding: 8px 10px; gap: 8px; }
    .dr-header-left[b-cw547wdqwt] { flex: 1 1 100%; }
    .dr-header-center[b-cw547wdqwt],
    .dr-header-right[b-cw547wdqwt] { flex: 1 1 auto; }
    .dr-header-right[b-cw547wdqwt] { justify-content: flex-end; }

    .dr-defect-grid[b-cw547wdqwt] {
        grid-template-columns: repeat(auto-fill, minmax(84px, 1fr));
        gap: 6px;
        padding: 6px;
    }

    .dr-record-grid[b-cw547wdqwt] {
        grid-template-columns: 1fr;
        padding: 6px;
        gap: 6px;
    }
}

/* 大屏：sidebar 适当加宽，记录卡片可更密 */
@media (min-width: 1440px) {
    .dr-panel.dr-defects[b-cw547wdqwt] { flex: 0 0 300px; width: 300px; }
}

@media (min-width: 1920px) {
    .dr-panel.dr-defects[b-cw547wdqwt] { flex: 0 0 340px; width: 340px; }
}

/* /Components/Pages/Qualityinspection/SizeChartv2.razor.rz.scp.css */
/* =========================================================================
   ✅ SizeChart 主题 - 与 CheckControl 主题保持一致
   - 卡片：1px solid #e8e8e8 + border-radius 8px + 浅阴影
   - 主色：#1890ff，强调：#52c41a / #faad14 / #ff4d4f / #722ed1
   - 暗色：通过 .sc-dark 作用域开关，等同 cc-dark 风格
   ========================================================================= */

/* ---------- 根容器 / 卡片包装 ---------- */
.sc-root[b-ih6hj8etiw] {
    width: 100%;
    color: #333;
}

.sc-card[b-ih6hj8etiw] {
    border: 1px solid #e8e8e8;
    border-radius: 8px;
    background: white;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);
    overflow: hidden;
    margin-bottom: 12px;
}

.sc-card-header[b-ih6hj8etiw] {
    padding: 10px 12px;
    border-bottom: 1px solid #e8e8e8;
    display: flex;
    align-items: center;
    gap: 12px;
}

.sc-color-bar[b-ih6hj8etiw] {
    width: 4px;
    height: 32px;
    background: linear-gradient(180deg, #722ed1 0%, #531dab 100%);
    border-radius: 2px;
    flex-shrink: 0;
}

.sc-card-title[b-ih6hj8etiw] {
    flex: 1;
    min-width: 0;
}

    .sc-card-title h6[b-ih6hj8etiw] {
        margin: 0;
        color: #333;
        font-weight: 600;
        font-size: 14px;
    }

    .sc-card-title p[b-ih6hj8etiw] {
        margin: 4px 0 0 0;
        color: #666;
        font-size: 12px;
    }

/* ---------- 顶部操作按钮 ---------- */
.btn-quality-check[b-ih6hj8etiw] {
    padding: 6px 14px;
    background: #52c41a;
    color: white;
    border: none;
    border-radius: 4px;
    font-size: 12px;
    font-weight: 600;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 4px;
    transition: background 0.2s ease;
    white-space: nowrap;
}

    .btn-quality-check:hover[b-ih6hj8etiw] {
        background: #389e0d;
    }

    .btn-quality-check i[b-ih6hj8etiw] {
        font-size: 12px;
    }

/* ---------- 主表格滚动容器 ---------- */
[b-ih6hj8etiw] .chart-container {
    width: 100%;
    overflow-x: auto;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
    position: relative;
    scrollbar-width: thin;
    scrollbar-color: #c0c4cc #f1f1f1;
}

    [b-ih6hj8etiw] .chart-container::-webkit-scrollbar {
        height: 10px !important;
    }

    [b-ih6hj8etiw] .chart-container::-webkit-scrollbar-track {
        background: #f1f1f1 !important;
        border-radius: 5px;
    }

    [b-ih6hj8etiw] .chart-container::-webkit-scrollbar-thumb {
        background: #c0c4cc !important;
        border-radius: 5px;
    }

        [b-ih6hj8etiw] .chart-container::-webkit-scrollbar-thumb:hover {
            background: #909399 !important;
        }

[b-ih6hj8etiw] .chart-wrapper {
    width: max-content;
    min-width: 100%;
}

/* ---------- 主透视表 ---------- */
[b-ih6hj8etiw] .pivot-table {
    width: auto;
    border-collapse: collapse;
    border: 1px solid #e0e0e0;
    background: white;
    font-size: 12px;
    table-layout: fixed;
}

    [b-ih6hj8etiw] .pivot-table thead th {
        background: #f5f5f5;
        color: #333;
        font-weight: 600;
        padding: 8px 6px;
        border: 1px solid #e0e0e0;
        text-align: center;
        white-space: nowrap;
    }

[b-ih6hj8etiw] .header-fixed {
    position: sticky;
    left: 0;
    z-index: 30;
    background: #f5f5f5 !important;
    min-width: 130px;
    width: 130px;
    line-height: 1.4;
}

[b-ih6hj8etiw] .header-part-group {
    background: #f5f5f5 !important;
    font-size: 12px;
    font-weight: 700;
    border: 1px solid #e0e0e0 !important;
    padding: 6px 4px !important;
    min-width: 90px;
    width: 90px;
}

    [b-ih6hj8etiw] .header-part-group div {
        line-height: 1.3;
    }

    [b-ih6hj8etiw] .header-part-group .part-method {
        font-size: 11px;
        font-weight: 500;
        margin-top: 2px;
        color: #666;
    }

    [b-ih6hj8etiw] .header-part-group .part-check-qty {
        display: inline-block;
        font-size: 10px;
        font-weight: 600;
        margin-top: 3px;
        padding: 1px 6px;
        border-radius: 4px;
        background: #faad14;
        color: white;
    }

        [b-ih6hj8etiw] .header-part-group .part-check-qty.has-value {
            background: #ff4d4f;
        }

[b-ih6hj8etiw] .pivot-table tbody tr {
    border-bottom: 1px solid #e9ecef;
    transition: background-color 0.2s;
}

    [b-ih6hj8etiw] .pivot-table tbody tr:hover {
        background-color: #f5f9ff;
    }

[b-ih6hj8etiw] .pivot-table tbody td {
    padding: 6px 4px;
    border: 1px solid #e9ecef;
    white-space: nowrap;
}

[b-ih6hj8etiw] .tolerance-label {
    text-align: center;
    font-weight: 700;
    background: #fafafa;
    position: sticky;
    left: 0;
    z-index: 20;
    border-right: 2px solid #e0e0e0 !important;
    font-size: 12px;
    color: #333;
    min-width: 130px;
    width: 130px;
}

    [b-ih6hj8etiw] .tolerance-label.positive {
        color: #2e7d32;
    }

    [b-ih6hj8etiw] .tolerance-label.negative {
        color: #c62828;
    }

[b-ih6hj8etiw] .sc-issue-hint {
    color: #ff4d4f;
    font-size: 11px;
    margin-top: 2px;
    font-weight: 500;
}

[b-ih6hj8etiw] .cell-size-fixed {
    text-align: center;
    font-weight: 700;
    background: #fafafa;
    position: sticky;
    left: 0;
    z-index: 20;
    color: #1890ff;
    font-size: 14px;
    border-right: 2px solid #e0e0e0 !important;
    min-width: 130px;
    width: 130px;
}

[b-ih6hj8etiw] .size-row {
    background-color: #fff;
}

[b-ih6hj8etiw] .cell-value {
    text-align: center;
    font-weight: 600;
    color: #333;
    min-width: 90px;
    width: 90px;
    font-size: 13px;
}

    [b-ih6hj8etiw] .cell-value.has-value {
        background-color: #f6ffed;
    }

    [b-ih6hj8etiw] .cell-value span {
        display: inline-block;
        min-width: 28px;
    }

    [b-ih6hj8etiw] .cell-value .empty {
        color: #bbb;
        font-weight: normal;
    }

    [b-ih6hj8etiw] .cell-value .qty-red {
        color: #ff4d4f;
        font-weight: 700;
        margin: 0 2px;
    }

[b-ih6hj8etiw] .tolerance-row {
    font-size: 12px;
    font-weight: 600;
}

[b-ih6hj8etiw] .positive-row {
    background-color: #f6ffed;
    border-top: 2px solid #b7eb8f !important;
}

[b-ih6hj8etiw] .negative-row {
    background-color: #fff1f0;
    border-bottom: 2px solid #ffa39e !important;
}

[b-ih6hj8etiw] .deviation-row {
    background-color: #fffbe6;
}

[b-ih6hj8etiw] .results-row {
    background-color: #fafafa;
}

[b-ih6hj8etiw] .cell-tolerance {
    text-align: center;
    font-weight: 600;
    padding: 6px 4px !important;
    min-width: 90px;
    width: 90px;
}

    [b-ih6hj8etiw] .cell-tolerance.positive {
        color: #2e7d32;
    }

    [b-ih6hj8etiw] .cell-tolerance.negative {
        color: #c62828;
    }

    [b-ih6hj8etiw] .cell-tolerance span {
        display: inline-block;
        font-size: 12px;
    }

/* ---------- 滚动提示 ---------- */
.scroll-hint[b-ih6hj8etiw] {
    text-align: center;
    color: #666;
    font-size: 12px;
    margin: 8px 12px 12px 12px;
    padding: 6px;
    background: #fafafa;
    border-radius: 4px;
    border-left: 3px solid #1890ff;
}

    .scroll-hint i[b-ih6hj8etiw] {
        margin-right: 4px;
        color: #1890ff;
    }

/* =========================================================================
   弹窗 - 质量检查录入
   ========================================================================= */
[b-ih6hj8etiw] .modal-overlay {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.5);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1000;
    backdrop-filter: blur(2px);
}

[b-ih6hj8etiw] .modal-content-table {
    background: white;
    border-radius: 8px;
    width: 90%;
    max-width: 1000px;
    max-height: 85vh;
    display: flex;
    flex-direction: column;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.2);
    overflow: hidden;
}

[b-ih6hj8etiw] .modal-header {
    padding: 12px 16px;
    border-bottom: 1px solid #e8e8e8;
    display: flex;
    justify-content: space-between;
    align-items: center;
    background: linear-gradient(90deg, #1890ff 0%, #096dd9 100%);
    color: white;
}

    [b-ih6hj8etiw] .modal-header h3 {
        margin: 0;
        font-size: 14px;
        font-weight: 600;
        display: flex;
        align-items: center;
        gap: 6px;
    }

        [b-ih6hj8etiw] .modal-header h3 i {
            font-size: 16px;
        }

[b-ih6hj8etiw] .btn-close {
    background: rgba(255, 255, 255, 0.2);
    border: 1px solid rgba(255, 255, 255, 0.6);
    color: white;
    font-size: 14px;
    width: 28px;
    height: 28px;
    border-radius: 4px;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: all 0.2s;
}

    [b-ih6hj8etiw] .btn-close:hover {
        background: rgba(255, 255, 255, 0.35);
    }

[b-ih6hj8etiw] .modal-body {
    padding: 12px;
    overflow-y: auto;
    flex: 1;
    background: #fff;
}

[b-ih6hj8etiw] .form-group-inline {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 10px;
    padding: 10px 12px;
    background: #f5f7fa;
    border: 1px solid #e8e8e8;
    border-radius: 6px;
}

    [b-ih6hj8etiw] .form-group-inline label {
        font-weight: 600;
        color: #333;
        font-size: 12px;
        white-space: nowrap;
    }

[b-ih6hj8etiw] .form-select-inline {
    flex: 0 0 160px;
    padding: 6px 10px;
    border: 1px solid #d9d9d9;
    border-radius: 4px;
    font-size: 12px;
    font-weight: 500;
    background: white;
    transition: all 0.2s;
}

    [b-ih6hj8etiw] .form-select-inline:focus {
        outline: none;
        border-color: #1890ff;
        box-shadow: 0 0 0 2px rgba(24, 144, 255, 0.15);
    }

/* 尺码按钮选择（替代下拉，适配平板触屏） */
[b-ih6hj8etiw] .sc-size-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    flex: 1 1 auto;
}

[b-ih6hj8etiw] .sc-size-chip {
    min-width: 52px;
    height: 40px;
    padding: 0 16px;
    font-size: 15px;
    font-weight: 600;
    color: #333;
    background: #fff;
    border: 1px solid #d9d9d9;
    border-radius: 8px;
    cursor: pointer;
    transition: all 0.15s;
    -webkit-tap-highlight-color: transparent;
}

    [b-ih6hj8etiw] .sc-size-chip:hover {
        border-color: #1890ff;
        color: #1890ff;
    }

    [b-ih6hj8etiw] .sc-size-chip.active {
        background: #1890ff;
        border-color: #1890ff;
        color: #fff;
        box-shadow: 0 2px 6px rgba(24, 144, 255, 0.35);
    }

[b-ih6hj8etiw] .table-container {
    margin-top: 8px;
    overflow-x: auto;
    border: 1px solid #e8e8e8;
    border-radius: 6px;
}

[b-ih6hj8etiw] .quality-check-table {
    width: 100%;
    border-collapse: collapse;
    background: white;
    font-size: 12px;
}

    [b-ih6hj8etiw] .quality-check-table thead {
        background: #f5f5f5;
        color: #333;
        position: sticky;
        top: 0;
        z-index: 10;
    }

    [b-ih6hj8etiw] .quality-check-table th {
        padding: 8px 6px;
        text-align: center;
        font-weight: 600;
        border: 1px solid #e0e0e0;
        white-space: nowrap;
        font-size: 12px;
        color: #333;
    }

    [b-ih6hj8etiw] .quality-check-table tbody tr:nth-child(even) {
        background-color: #fafafa;
    }

    [b-ih6hj8etiw] .quality-check-table tbody tr:hover {
        background-color: #f5f9ff;
    }

    [b-ih6hj8etiw] .quality-check-table td {
        padding: 5px 4px;
        border: 1px solid #e9ecef;
        text-align: center;
    }

[b-ih6hj8etiw] .col-part-name {
    min-width: 100px;
    width: 100px;
}

[b-ih6hj8etiw] .col-method {
    min-width: 70px;
    width: 70px;
}

[b-ih6hj8etiw] .col-standard {
    min-width: 70px;
    width: 70px;
}

[b-ih6hj8etiw] .col-tolerance {
    min-width: 90px;
    width: 90px;
}

[b-ih6hj8etiw] .col-check-item {
    min-width: 90px;
    width: 90px;
}

[b-ih6hj8etiw] .col-seq {
    min-width: 44px;
    width: 44px;
}

[b-ih6hj8etiw] .cell-seq {
    color: #8c8c8c;
    font-weight: 600;
}

[b-ih6hj8etiw] .cell-part-name {
    font-weight: 600;
    color: #333;
    text-align: left;
    padding-left: 8px !important;
    font-size: 12px;
}

[b-ih6hj8etiw] .cell-method {
    padding: 4px !important;
}

[b-ih6hj8etiw] .method-badge-small {
    display: inline-block;
    background: #1890ff;
    color: white;
    padding: 2px 8px;
    border-radius: 10px;
    font-size: 11px;
    font-weight: 500;
}

[b-ih6hj8etiw] .cell-standard {
    font-weight: 700;
    color: #1890ff;
    font-size: 12px;
}

[b-ih6hj8etiw] .cell-tolerance-range {
    font-size: 11px;
    padding: 4px !important;
}

[b-ih6hj8etiw] .positive-text {
    color: #52c41a;
    font-weight: 600;
}

[b-ih6hj8etiw] .negative-text {
    color: #ff4d4f;
    font-weight: 600;
}

[b-ih6hj8etiw] .separator {
    color: #999;
    margin: 0 2px;
}

[b-ih6hj8etiw] .cell-input {
    padding: 4px !important;
}

[b-ih6hj8etiw] .cell-disabled {
    background: #fafafa;
    color: #ccc;
    font-size: 12px;
}

[b-ih6hj8etiw] .input-cell-wrapper {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
}

[b-ih6hj8etiw] .table-input {
    width: 100%;
    max-width: 75px;
    padding: 5px 22px 5px 6px;
    border: 1px solid #d9d9d9;
    border-radius: 4px;
    font-size: 12px;
    text-align: center;
    transition: all 0.2s;
    background: white;
    color: #333;
}

    [b-ih6hj8etiw] .table-input:focus {
        outline: none;
        border-color: #1890ff;
        box-shadow: 0 0 0 2px rgba(24, 144, 255, 0.15);
    }

    [b-ih6hj8etiw] .table-input.valid {
        border-color: #52c41a;
        background: #f6ffed;
    }

    [b-ih6hj8etiw] .table-input.invalid {
        border-color: #ff4d4f;
        background: #fff1f0;
    }

    [b-ih6hj8etiw] .table-input::placeholder {
        color: #ccc;
        font-size: 11px;
    }

[b-ih6hj8etiw] .btn-step {
    flex: 0 0 auto;
    width: 22px;
    height: 26px;
    margin: 0 3px;
    border: 1px solid #d9d9d9;
    border-radius: 4px;
    background: #fafafa;
    color: #555;
    font-size: 14px;
    font-weight: 600;
    line-height: 1;
    cursor: pointer;
    transition: all 0.15s;
}

    [b-ih6hj8etiw] .btn-step:hover {
        background: #1890ff;
        border-color: #1890ff;
        color: #fff;
    }

[b-ih6hj8etiw] .cell-action {
    text-align: center;
    white-space: nowrap;
}

[b-ih6hj8etiw] .btn-sync-standard {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 4px 8px;
    border: 1px solid #1890ff;
    border-radius: 4px;
    background: #e6f7ff;
    color: #1890ff;
    font-size: 12px;
    cursor: pointer;
    transition: all 0.15s;
}

    [b-ih6hj8etiw] .btn-sync-standard:hover {
        background: #1890ff;
        color: #fff;
    }

[b-ih6hj8etiw] .btn-clear-standard {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    margin-left: 4px;
    padding: 4px 8px;
    border: 1px solid #ff7875;
    border-radius: 4px;
    background: #fff1f0;
    color: #ff4d4f;
    font-size: 12px;
    cursor: pointer;
    transition: all 0.15s;
}

    [b-ih6hj8etiw] .btn-clear-standard:hover {
        background: #ff4d4f;
        color: #fff;
    }

[b-ih6hj8etiw] .validation-badge {
    position: absolute;
    right: 28px;
    width: 16px;
    height: 16px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 10px;
    font-weight: 700;
}

    [b-ih6hj8etiw] .validation-badge.valid {
        background: #52c41a;
        color: white;
    }

    [b-ih6hj8etiw] .validation-badge.invalid {
        background: #ff4d4f;
        color: white;
    }

[b-ih6hj8etiw] .modal-actions {
    margin-top: 12px;
    padding: 12px;
    border-top: 1px solid #e8e8e8;
    background: #fafafa;
    display: flex;
    gap: 8px;
    justify-content: flex-end;
}

[b-ih6hj8etiw] .btn {
    padding: 6px 16px;
    border: 1px solid transparent;
    border-radius: 4px;
    font-size: 12px;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s;
    display: inline-flex;
    align-items: center;
    gap: 4px;
}

[b-ih6hj8etiw] .btn-primary {
    background: #1890ff;
    border-color: #1890ff;
    color: white;
}

    [b-ih6hj8etiw] .btn-primary:hover {
        background: #096dd9;
        border-color: #096dd9;
    }

[b-ih6hj8etiw] .btn-secondary {
    background: white;
    border-color: #d9d9d9;
    color: #333;
}

    [b-ih6hj8etiw] .btn-secondary:hover {
        background: #fafafa;
        border-color: #1890ff;
        color: #1890ff;
    }

/* ---------- 响应式 ---------- */
@media (max-width: 768px) {
    [b-ih6hj8etiw] .chart-wrapper {
        min-width: 100%;
    }

    [b-ih6hj8etiw] .modal-content-table {
        width: 95%;
        max-height: 90vh;
    }

    [b-ih6hj8etiw] .table-input {
        max-width: 65px;
        font-size: 11px;
    }
}

/* =========================================================================
   ✅ 暗色主题（.sc-dark） - 与 CheckControl 的 .cc-dark 保持一致
   ========================================================================= */
.sc-dark[b-ih6hj8etiw] {
    color: #e6e6e6;
}

    .sc-dark .sc-card[b-ih6hj8etiw] {
        background: #2a2a2a !important;
        border-color: #3a3a3a !important;
        color: #e6e6e6;
        box-shadow: 0 2px 8px rgba(0, 0, 0, 0.5);
    }

    .sc-dark .sc-card-header[b-ih6hj8etiw] {
        border-bottom-color: #3a3a3a !important;
    }

    .sc-dark .sc-card-title h6[b-ih6hj8etiw] {
        color: #f0f0f0;
    }

    .sc-dark .sc-card-title p[b-ih6hj8etiw] {
        color: #b8b8b8;
    }

    .sc-dark .scroll-hint[b-ih6hj8etiw] {
        background: #262626;
        color: #b8b8b8;
    }

    /* 主表格 */
    .sc-dark[b-ih6hj8etiw]  .pivot-table {
        background: #2a2a2a !important;
        border-color: #3a3a3a !important;
        color: #e6e6e6;
    }

        .sc-dark[b-ih6hj8etiw]  .pivot-table thead th {
            background: #1f1f1f !important;
            color: #f0f0f0 !important;
            border-color: #3a3a3a !important;
        }

    .sc-dark[b-ih6hj8etiw]  .header-fixed,
    .sc-dark[b-ih6hj8etiw]  .header-part-group {
        background: #1f1f1f !important;
        color: #f0f0f0 !important;
        border-color: #3a3a3a !important;
    }

    .sc-dark[b-ih6hj8etiw]  .header-part-group .part-method {
        color: #a0a0a0;
    }

    .sc-dark[b-ih6hj8etiw]  .pivot-table tbody tr {
        border-bottom-color: #3a3a3a;
    }

        .sc-dark[b-ih6hj8etiw]  .pivot-table tbody tr:hover {
            background-color: rgba(24, 144, 255, 0.08);
        }

    .sc-dark[b-ih6hj8etiw]  .pivot-table tbody td {
        border-color: #3a3a3a;
        color: #e6e6e6;
    }

    .sc-dark[b-ih6hj8etiw]  .tolerance-label {
        background: #262626 !important;
        color: #f0f0f0;
        border-right-color: #3a3a3a !important;
    }

        .sc-dark[b-ih6hj8etiw]  .tolerance-label.positive {
            color: #73d13d;
        }

        .sc-dark[b-ih6hj8etiw]  .tolerance-label.negative {
            color: #ff7875;
        }

    .sc-dark[b-ih6hj8etiw]  .cell-size-fixed {
        background: #262626 !important;
        color: #4ea1ff;
        border-right-color: #3a3a3a !important;
    }

    .sc-dark[b-ih6hj8etiw]  .size-row {
        background-color: transparent;
    }

    .sc-dark[b-ih6hj8etiw]  .cell-value {
        color: #e6e6e6;
    }

        .sc-dark[b-ih6hj8etiw]  .cell-value.has-value {
            background-color: rgba(82, 196, 26, 0.12);
        }

        .sc-dark[b-ih6hj8etiw]  .cell-value .empty {
            color: #666;
        }

        .sc-dark[b-ih6hj8etiw]  .cell-value .qty-red {
            color: #ff7875;
        }

    .sc-dark[b-ih6hj8etiw]  .positive-row {
        background-color: rgba(82, 196, 26, 0.08);
        border-top-color: #389e0d !important;
    }

    .sc-dark[b-ih6hj8etiw]  .negative-row {
        background-color: rgba(255, 77, 79, 0.08);
        border-bottom-color: #cf1322 !important;
    }

    .sc-dark[b-ih6hj8etiw]  .deviation-row {
        background-color: rgba(250, 173, 20, 0.08);
    }

    .sc-dark[b-ih6hj8etiw]  .results-row {
        background-color: #262626;
    }

    .sc-dark[b-ih6hj8etiw]  .cell-tolerance.positive {
        color: #73d13d;
    }

    .sc-dark[b-ih6hj8etiw]  .cell-tolerance.negative {
        color: #ff7875;
    }

    /* 滚动条暗色 */
    .sc-dark[b-ih6hj8etiw]  .chart-container {
        scrollbar-color: #555 #1f1f1f;
    }

        .sc-dark[b-ih6hj8etiw]  .chart-container::-webkit-scrollbar-track {
            background: #1f1f1f !important;
        }

        .sc-dark[b-ih6hj8etiw]  .chart-container::-webkit-scrollbar-thumb {
            background: #555 !important;
        }

    /* 弹窗暗色 */
    .sc-dark[b-ih6hj8etiw]  .modal-content-table {
        background: #2a2a2a;
        color: #e6e6e6;
    }

    .sc-dark[b-ih6hj8etiw]  .modal-body {
        background: #2a2a2a;
    }

    .sc-dark[b-ih6hj8etiw]  .form-group-inline {
        background: #1f1f1f;
        border-color: #3a3a3a;
    }

        .sc-dark[b-ih6hj8etiw]  .form-group-inline label {
            color: #f0f0f0;
        }

    .sc-dark[b-ih6hj8etiw]  .form-select-inline,
    .sc-dark[b-ih6hj8etiw]  .table-input {
        background: #1f1f1f !important;
        border-color: #3a3a3a !important;
        color: #e6e6e6 !important;
    }

    .sc-dark[b-ih6hj8etiw]  .sc-size-chip {
        background: #1f1f1f;
        border-color: #3a3a3a;
        color: #e6e6e6;
    }

        .sc-dark[b-ih6hj8etiw]  .sc-size-chip:hover {
            border-color: #1890ff;
            color: #40a9ff;
        }

        .sc-dark[b-ih6hj8etiw]  .sc-size-chip.active {
            background: #1890ff;
            border-color: #1890ff;
            color: #fff;
        }

    .sc-dark[b-ih6hj8etiw]  .table-container {
        border-color: #3a3a3a;
    }

    .sc-dark[b-ih6hj8etiw]  .quality-check-table {
        background: #2a2a2a;
        color: #e6e6e6;
    }

        .sc-dark[b-ih6hj8etiw]  .quality-check-table thead {
            background: #1f1f1f;
        }

        .sc-dark[b-ih6hj8etiw]  .quality-check-table th {
            background: #1f1f1f;
            color: #f0f0f0;
            border-color: #3a3a3a;
        }

        .sc-dark[b-ih6hj8etiw]  .quality-check-table tbody tr:nth-child(even) {
            background-color: #262626;
        }

        .sc-dark[b-ih6hj8etiw]  .quality-check-table tbody tr:hover {
            background-color: rgba(24, 144, 255, 0.08);
        }

        .sc-dark[b-ih6hj8etiw]  .quality-check-table td {
            border-color: #3a3a3a;
            color: #e6e6e6;
        }

    .sc-dark[b-ih6hj8etiw]  .cell-part-name {
        color: #f0f0f0;
    }

    .sc-dark[b-ih6hj8etiw]  .cell-standard {
        color: #4ea1ff;
    }

    .sc-dark[b-ih6hj8etiw]  .cell-disabled {
        background: #1f1f1f;
        color: #555;
    }

    .sc-dark[b-ih6hj8etiw]  .table-input.valid {
        background: rgba(82, 196, 26, 0.15) !important;
        border-color: #52c41a !important;
    }

    .sc-dark[b-ih6hj8etiw]  .table-input.invalid {
        background: rgba(255, 77, 79, 0.15) !important;
        border-color: #ff4d4f !important;
    }

    .sc-dark[b-ih6hj8etiw]  .modal-actions {
        background: #1f1f1f;
        border-top-color: #3a3a3a;
    }

    .sc-dark[b-ih6hj8etiw]  .btn-secondary {
        background: #2a2a2a;
        border-color: #3a3a3a;
        color: #e6e6e6;
    }

        .sc-dark[b-ih6hj8etiw]  .btn-secondary:hover {
            background: #333;
            border-color: #4ea1ff;
            color: #4ea1ff;
        }


/* =========================================================================
   ✅ 已登记记录区域
   ========================================================================= */
.sc-record-count[b-ih6hj8etiw] {
    font-size: 12px;
    font-weight: 600;
    color: #1890ff;
    background: rgba(24, 144, 255, 0.1);
    padding: 4px 10px;
    border-radius: 12px;
    white-space: nowrap;
}

.btn-refresh-records[b-ih6hj8etiw] {
    padding: 6px 14px;
    background: #1890ff;
    color: white;
    border: none;
    border-radius: 4px;
    font-size: 12px;
    font-weight: 600;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 4px;
    transition: background 0.2s ease;
    white-space: nowrap;
}

    .btn-refresh-records:hover[b-ih6hj8etiw] {
        background: #096dd9;
    }

    .btn-refresh-records:disabled[b-ih6hj8etiw] {
        background: #b3d8ff;
        cursor: not-allowed;
    }

.sc-record-empty[b-ih6hj8etiw] {
    text-align: center;
    color: #999;
    font-size: 13px;
    padding: 24px 0;
    margin: 0;
}

    .sc-record-empty i[b-ih6hj8etiw] {
        margin-right: 6px;
    }

[b-ih6hj8etiw] .records-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 12px;
    background: white;
}

    [b-ih6hj8etiw] .records-table thead th {
        background: #fafafa;
        color: #333;
        font-weight: 600;
        text-align: center;
        padding: 8px 10px;
        border-bottom: 2px solid #e8e8e8;
        white-space: nowrap;
    }

    [b-ih6hj8etiw] .records-table tbody td {
        text-align: center;
        padding: 7px 10px;
        border-bottom: 1px solid #f0f0f0;
        color: #333;
        white-space: nowrap;
    }

    [b-ih6hj8etiw] .records-table tbody tr:hover {
        background: #f5faff;
    }

[b-ih6hj8etiw] .records-table .col-action {
    width: 60px;
}

[b-ih6hj8etiw] .qualified-badge {
    display: inline-block;
    padding: 2px 8px;
    border-radius: 10px;
    font-size: 11px;
    font-weight: 600;
}

    [b-ih6hj8etiw] .qualified-badge.qualified {
        background: rgba(82, 196, 26, 0.12);
        color: #52c41a;
    }

    [b-ih6hj8etiw] .qualified-badge.unqualified {
        background: rgba(255, 77, 79, 0.12);
        color: #ff4d4f;
    }

[b-ih6hj8etiw] .btn-delete-record {
    background: transparent;
    border: 1px solid #ff4d4f;
    color: #ff4d4f;
    border-radius: 4px;
    width: 28px;
    height: 28px;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: all 0.2s ease;
}

    [b-ih6hj8etiw] .btn-delete-record:hover {
        background: #ff4d4f;
        color: white;
    }

/* ---------- 暗色模式 ---------- */
.sc-dark .sc-record-count[b-ih6hj8etiw] {
    color: #4ea1ff;
    background: rgba(78, 161, 255, 0.15);
}

.sc-dark[b-ih6hj8etiw]  .records-table {
    background: #1f1f1f;
}

    .sc-dark[b-ih6hj8etiw]  .records-table thead th {
        background: #262626;
        color: #e6e6e6;
        border-bottom-color: #3a3a3a;
    }

    .sc-dark[b-ih6hj8etiw]  .records-table tbody td {
        color: #d6d6d6;
        border-bottom-color: #303030;
    }

    .sc-dark[b-ih6hj8etiw]  .records-table tbody tr:hover {
        background: #262d36;
    }



/* /Components/Universal/ModuleMaster.razor.rz.scp.css */
[b-3u2h3sizxj] .grid-cell-align-center {
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: -4px;
    margin-bottom: -4px;
}

[b-3u2h3sizxj] .grid-icon {
    display: inline-block;
    width: 12px;
    height: 12px;
    min-width: 12px;
    min-height: 12px;
    background-size: contain;
    mask-repeat: no-repeat;
    -webkit-mask-repeat: no-repeat;
    background-position: center center;
    background-color: currentColor;
    vertical-align: middle;
}

[b-3u2h3sizxj] .grid-icon-delete {
    -webkit-mask-image: url("../images/icons/delete.svg");
    mask-image: url("../images/icons/delete.svg");
}

[b-3u2h3sizxj] .grid-toolbar-new,
[b-3u2h3sizxj] .grid-toolbar-delete,
[b-3u2h3sizxj] .grid-toolbar-save,
[b-3u2h3sizxj] .grid-toolbar-cancel {
    background-size: contain;
    mask-repeat: no-repeat;
    -webkit-mask-repeat: no-repeat;
    background-position: center center;
    background-color: currentColor;
    height: 15px;
    width: 15px;
    opacity: 0.7;
}

[b-3u2h3sizxj] .grid-toolbar-new {
    -webkit-mask-image: url("images/icons/new.svg");
    mask-image: url("images/icons/new.svg");
}

[b-3u2h3sizxj] .grid-toolbar-save {
    -webkit-mask-image: url("images/icons/save.svg");
    mask-image: url("images/icons/save.svg");
}

[b-3u2h3sizxj] .grid-toolbar-cancel {
    -webkit-mask-image: url("images/icons/undo.svg");
    mask-image: url("images/icons/undo.svg");
}

[b-3u2h3sizxj] .grid-modified-cell {
    background-color: rgba(var(--bs-primary-rgb), 0.15) !important;
}

[b-3u2h3sizxj] .grid-disabled-button {
    pointer-events: none;
}
/* /Components/Universal/ModuleMasterDtlDetail.razor.rz.scp.css */
[b-5bynxvkyrq] .grid-cell-align-center {
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: -4px;
    margin-bottom: -4px;
}

[b-5bynxvkyrq] .grid-icon {
    display: inline-block;
    width: 12px;
    height: 12px;
    min-width: 12px;
    min-height: 12px;
    background-size: contain;
    mask-repeat: no-repeat;
    -webkit-mask-repeat: no-repeat;
    background-position: center center;
    background-color: currentColor;
    vertical-align: middle;
}

[b-5bynxvkyrq] .grid-icon-delete {
    -webkit-mask-image: url("../images/icons/delete.svg");
    mask-image: url("../images/icons/delete.svg");
}

[b-5bynxvkyrq] .grid-toolbar-new,
[b-5bynxvkyrq] .grid-toolbar-delete,
[b-5bynxvkyrq] .grid-toolbar-save,
[b-5bynxvkyrq] .grid-toolbar-cancel {
    background-size: contain;
    mask-repeat: no-repeat;
    -webkit-mask-repeat: no-repeat;
    background-position: center center;
    background-color: currentColor;
    height: 15px;
    width: 15px;
    opacity: 0.7;
}

[b-5bynxvkyrq] .grid-toolbar-new {
    -webkit-mask-image: url("images/icons/new.svg");
    mask-image: url("images/icons/new.svg");
}

[b-5bynxvkyrq] .grid-toolbar-save {
    -webkit-mask-image: url("images/icons/save.svg");
    mask-image: url("images/icons/save.svg");
}

[b-5bynxvkyrq] .grid-toolbar-cancel {
    -webkit-mask-image: url("images/icons/undo.svg");
    mask-image: url("images/icons/undo.svg");
}

[b-5bynxvkyrq] .grid-modified-cell {
    background-color: rgba(var(--bs-primary-rgb), 0.15) !important;
}

[b-5bynxvkyrq] .grid-disabled-button {
    pointer-events: none;
}
/* /Components/Universal/ModuleMasterDtlSize.razor.rz.scp.css */
[b-4qp4gvyypf] .grid-cell-align-center {
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: -4px;
    margin-bottom: -4px;
}

[b-4qp4gvyypf] .grid-icon {
    display: inline-block;
    width: 12px;
    height: 12px;
    min-width: 12px;
    min-height: 12px;
    background-size: contain;
    mask-repeat: no-repeat;
    -webkit-mask-repeat: no-repeat;
    background-position: center center;
    background-color: currentColor;
    vertical-align: middle;
}

[b-4qp4gvyypf] .grid-icon-delete {
    -webkit-mask-image: url("../images/icons/delete.svg");
    mask-image: url("../images/icons/delete.svg");
}

[b-4qp4gvyypf] .grid-toolbar-new,
[b-4qp4gvyypf] .grid-toolbar-delete,
[b-4qp4gvyypf] .grid-toolbar-save,
[b-4qp4gvyypf] .grid-toolbar-cancel {
    background-size: contain;
    mask-repeat: no-repeat;
    -webkit-mask-repeat: no-repeat;
    background-position: center center;
    background-color: currentColor;
    height: 15px;
    width: 15px;
    opacity: 0.7;
}

[b-4qp4gvyypf] .grid-toolbar-new {
    -webkit-mask-image: url("images/icons/new.svg");
    mask-image: url("images/icons/new.svg");
}

[b-4qp4gvyypf] .grid-toolbar-save {
    -webkit-mask-image: url("images/icons/save.svg");
    mask-image: url("images/icons/save.svg");
}

[b-4qp4gvyypf] .grid-toolbar-cancel {
    -webkit-mask-image: url("images/icons/undo.svg");
    mask-image: url("images/icons/undo.svg");
}

[b-4qp4gvyypf] .grid-modified-cell {
    background-color: rgba(var(--bs-primary-rgb), 0.15) !important;
}

[b-4qp4gvyypf] .grid-disabled-button {
    pointer-events: none;
}
/* /Components/Universal/ModuleQueryView.razor.rz.scp.css */
/* 使用 ::deep 选择器来穿透作用域 */
[b-s4r41g8z5s] .querycss {
    height: 24px !important;
}

[b-s4r41g8z5s] .MyTableCss {
    height: 50vh !important;
}


[b-s4r41g8z5s] .highUnitPrice {
    color: red;
    font-weight: bold
}

[b-s4r41g8z5s] .lowUnitPrice {
    color: green;
    font-weight: bold
}
/* /Components/Universal/ModuleQueryViewOnline.razor.rz.scp.css */
/* 使用 ::deep 选择器来穿透作用域 */
[b-u93t4nsao1] .querycss {
    height: 24px !important;
}

[b-u93t4nsao1] .MyTableCss {
    height: 50vh !important;
}
