@import '_content/Blazored.Toast/Blazored.Toast.bundle.scp.css';

/* /Features/Accounts/Components/CompanyLookup.razor.rz.scp.css */
.table-wrapper[b-3pa8uebglg] {
    position: relative;
}

.table-scroll[b-3pa8uebglg] {
    height: 400px;
    overflow: auto;
    margin-top: 20px;
}

.table-wrapper table[b-3pa8uebglg] {
    width: 100%;
}

    .table-wrapper table *[b-3pa8uebglg] {
        color: black;
    }

    .table-wrapper table thead th .text[b-3pa8uebglg] {
        position: absolute;
        top: -20px;
        z-index: 2;
        height: 20px;
        width: 35%;
        border: 1px solid red;
    }
/* /Features/Accounts/Pages/AccountList.razor.rz.scp.css */
/* /Features/Accounts/Pages/AccountView.razor.rz.scp.css */
.header-paper[b-h4ak6so849] {
    background-color: var(--mud-palette-background);
    border-radius: 35px;
}

.header-row[b-h4ak6so849] {
    height: 100%;
    border-radius: 15px;
    color: var(--mud-palette-primary);
}

.custom-icon[b-h4ak6so849] {
    background-color: #0C135D;
    color: white;
    padding: 15px;
    border-radius: 50%;
    width: 54px;
    height: 54px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.partner-link[b-h4ak6so849] {
    color: var(--mud-palette-primary);
    font-size: 12px;
}
/* /Features/Accounts/Pages/SoleTrader/SoleTraderDetail.razor.rz.scp.css */
.error[b-p1tknhww2p] {
    color: red;
}

.dob[b-p1tknhww2p] {
    margin-bottom: 28px;
}

.contact[b-p1tknhww2p] {
    font-weight: bold;
}

.saveBtn[b-p1tknhww2p] {
    margin-right: 5px;
}
/* /Features/Admin/Pages/MarketSummary/MarketSummaryUpload.razor.rz.scp.css */
/* ── Upload card ── */
.upload-card[b-p7lmknjdlj] {
    border-radius: 12px;
    height: 100%;
}

.card-icon[b-p7lmknjdlj] {
    background-color: #0C135D;
    color: white;
    padding: 10px;
    border-radius: 10px;
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.card-icon--small[b-p7lmknjdlj] {
    width: 34px;
    height: 34px;
    padding: 8px;
    border-radius: 8px;
}

/* ── Dropzone ── */
.dropzone[b-p7lmknjdlj] {
    position: relative;
    border: 2px dashed;
    border-color: var(--mud-palette-lines-default);
    border-radius: 12px;
    cursor: pointer;
    transition: all 0.2s ease;
    background: var(--mud-palette-background);
    min-height: 180px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.dropzone:hover[b-p7lmknjdlj] {
    border-color: var(--mud-palette-primary);
    background: var(--mud-palette-primary-hover);
}

.dropzone-active[b-p7lmknjdlj] {
    border-color: var(--mud-palette-primary);
    background: var(--mud-palette-primary-hover);
    border-style: solid;
}

.dropzone-has-file[b-p7lmknjdlj] {
    border-color: var(--mud-palette-primary);
    border-style: solid;
    background: var(--mud-palette-primary-hover);
}

/* ── Files card / grid ── */
.files-card[b-p7lmknjdlj] {
    border-radius: 12px;
    overflow: hidden;
    height: 100%;
}

[b-p7lmknjdlj] .grid-header th {
    background: var(--mud-palette-background) !important;
    font-weight: 600 !important;
    font-size: 0.75rem !important;
    text-transform: uppercase !important;
    letter-spacing: 0.04em !important;
    color: var(--mud-palette-text-secondary) !important;
}

[b-p7lmknjdlj] .active-row {
    background: color-mix(in srgb, var(--mud-palette-success) 6%, transparent) !important;
}

[b-p7lmknjdlj] .active-row:hover {
    background: color-mix(in srgb, var(--mud-palette-success) 10%, transparent) !important;
}

[b-p7lmknjdlj] .file-row td {
    padding-top: 10px !important;
    padding-bottom: 10px !important;
}
/* /Features/Admin/Pages/UserManagement.razor.rz.scp.css */
/* ═══════════════════════════════════════
   User Management – Scoped Styles
   ═══════════════════════════════════════ */

/* ─── Page ─── */
.um-page[b-4rlsbwvpe0] {
    max-width: 1400px;
    margin: 0 auto;
    padding: 24px;
}

/* ─── Header ─── */
.um-header[b-4rlsbwvpe0] {
    display: flex;
    align-items: center;
    gap: 16px;
    margin-bottom: 24px;
}

.um-header-icon[b-4rlsbwvpe0] {
    width: 52px;
    height: 52px;
    border-radius: 14px;
    background: linear-gradient(135deg, #1E3A8A, #3B82F6);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    box-shadow: 0 4px 12px rgba(30, 58, 138, 0.25);
}

/* ─── Two-Panel Layout ─── */
.um-layout[b-4rlsbwvpe0] {
    display: flex;
    gap: 20px;
    align-items: flex-start;
    min-height: 600px;
}

/* ─── Sidebar ─── */
.um-sidebar[b-4rlsbwvpe0] {
    width: 320px;
    min-width: 320px;
    background: #fff;
    border-radius: 12px;
    border: 1px solid var(--mud-palette-lines-default);
    overflow: hidden;
}

.um-sidebar-inner[b-4rlsbwvpe0] {
    padding: 16px;
    display: flex;
    flex-direction: column;
    gap: 0;
}

/* ─── Mode Selector ─── */
.um-mode-bar[b-4rlsbwvpe0] {
    display: flex;
    gap: 4px;
    background: var(--mud-palette-lines-default);
    border-radius: 10px;
    padding: 4px;
    margin-bottom: 12px;
}

.um-mode-btn[b-4rlsbwvpe0] {
    flex: 1;
    padding: 8px 10px;
    border: none;
    border-radius: 8px;
    background: transparent;
    color: #6B7280;
    font-size: 0.8rem;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.2s ease;
    white-space: nowrap;
}

.um-mode-btn:hover[b-4rlsbwvpe0] {
    color: #1F2937;
    background: rgba(255, 255, 255, 0.6);
}

.um-mode-btn.active[b-4rlsbwvpe0] {
    background: #fff;
    color: #1E3A8A;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
}

/* ─── User List ─── */
.um-user-list[b-4rlsbwvpe0] {
    flex: 1;
    overflow-y: auto;
    max-height: 420px;
    min-height: 200px;
    margin: 0 -16px;
    padding: 0;
}

.um-user-item[b-4rlsbwvpe0] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px 16px;
    cursor: pointer;
    transition: background 0.15s ease;
    border-left: 3px solid transparent;
}

.um-user-item:hover[b-4rlsbwvpe0] {
    background: #F0F4FF;
}

.um-user-item.active[b-4rlsbwvpe0] {
    background: #EEF2FF;
    border-left-color: #1E3A8A;
}

.um-user-name[b-4rlsbwvpe0] {
    font-size: 0.84rem;
    font-weight: 500;
    color: #1F2937;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    min-width: 0;
}

.um-user-item.active .um-user-name[b-4rlsbwvpe0] {
    color: #1E3A8A;
    font-weight: 600;
}

/* ─── Shared Avatars ─── */
.um-avatar-sm[b-4rlsbwvpe0] {
    width: 32px;
    height: 32px;
    border-radius: 8px;
    background: #1E3A8A;
    color: #fff;
    font-size: 0.75rem;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.um-avatar-lg[b-4rlsbwvpe0] {
    width: 52px;
    height: 52px;
    border-radius: 14px;
    background: linear-gradient(135deg, #1E3A8A, #3B82F6);
    color: #fff;
    font-size: 1.25rem;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

/* ─── User Count Footer ─── */
.um-user-count[b-4rlsbwvpe0] {
    padding: 10px 0 0;
    font-size: 0.75rem;
    color: #9CA3AF;
    text-align: center;
    border-top: 1px solid var(--mud-palette-lines-default);
}

/* ─── Empty List ─── */
.um-empty-list[b-4rlsbwvpe0] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 48px 16px;
}

/* ─── Detail Panel ─── */
.um-detail[b-4rlsbwvpe0] {
    flex: 1;
    min-width: 0;
    background: #fff;
    border-radius: 12px;
    border: 1px solid var(--mud-palette-lines-default);
    padding: 24px;
    min-height: 600px;
}

/* ─── No Selection ─── */
.um-no-selection[b-4rlsbwvpe0] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 8px;
    height: 100%;
    min-height: 400px;
}

/* ─── Profile Header ─── */
.um-profile[b-4rlsbwvpe0] {
    display: flex;
    align-items: center;
    gap: 16px;
    padding-bottom: 20px;
    margin-bottom: 20px;
    border-bottom: 1px solid var(--mud-palette-lines-default);
}

.um-profile-info[b-4rlsbwvpe0] {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.um-profile-name[b-4rlsbwvpe0] {
    font-size: 1.1rem;
    font-weight: 700;
    color: #1F2937;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* ─── Role Badge ─── */
.um-role-badge[b-4rlsbwvpe0] {
    display: inline-block;
    padding: 2px 10px;
    border-radius: 6px;
    font-size: 0.72rem;
    font-weight: 600;
    letter-spacing: 0.03em;
    text-transform: uppercase;
    width: fit-content;
}

.um-role-partner[b-4rlsbwvpe0] {
    background: rgba(30, 58, 138, 0.08);
    color: #1E3A8A;
}

.um-role-enduser[b-4rlsbwvpe0] {
    background: rgba(16, 185, 129, 0.08);
    color: #047857;
}

.um-role-unauthorised[b-4rlsbwvpe0] {
    background: rgba(245, 158, 11, 0.08);
    color: #B45309;
}

.um-role-staff[b-4rlsbwvpe0],
.um-role-admin[b-4rlsbwvpe0],
.um-role-authorised[b-4rlsbwvpe0] {
    background: rgba(107, 114, 128, 0.08);
    color: #4B5563;
}

/* ─── Status Cards Row ─── */
.um-status-row[b-4rlsbwvpe0] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 12px;
    margin-bottom: 20px;
}

.um-status-card[b-4rlsbwvpe0] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 14px;
    border-radius: 10px;
    border: 1px solid var(--mud-palette-lines-default);
    transition: border-color 0.2s ease;
}

.um-status-card.good[b-4rlsbwvpe0] {
    border-color: #A7F3D0;
    background: #F0FDF4;
    color: #047857;
}

.um-status-card.bad[b-4rlsbwvpe0] {
    border-color: #FECACA;
    background: #FEF2F2;
    color: #B91C1C;
}

.um-status-card.neutral[b-4rlsbwvpe0] {
    border-color: var(--mud-palette-lines-default);
    background: var(--mud-palette-background);
    color: #6B7280;
}

.um-status-body[b-4rlsbwvpe0] {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 1px;
}

.um-status-label[b-4rlsbwvpe0] {
    font-size: 0.68rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    opacity: 0.7;
}

.um-status-value[b-4rlsbwvpe0] {
    font-size: 0.82rem;
    font-weight: 600;
}

/* ─── Sections ─── */
.um-section[b-4rlsbwvpe0] {
    padding: 20px 0;
    border-top: 1px solid var(--mud-palette-lines-default);
}

.um-section:first-of-type[b-4rlsbwvpe0] {
    border-top: none;
}

.um-section-head[b-4rlsbwvpe0] {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 14px;
}

.um-section-title[b-4rlsbwvpe0] {
    font-size: 0.82rem;
    font-weight: 700;
    color: #374151;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    flex: 1;
}

/* ─── Roles Display ─── */
.um-roles-display[b-4rlsbwvpe0] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

/* ─── Roles Edit (Checkboxes) ─── */
.um-roles-edit[b-4rlsbwvpe0] {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.um-role-check[b-4rlsbwvpe0] {
    display: flex;
    align-items: center;
    gap: 4px;
    padding: 6px 10px;
    border-radius: 8px;
    border: 1px solid transparent;
    transition: all 0.15s ease;
}

.um-role-check:hover[b-4rlsbwvpe0] {
    background: #F8FAFC;
}

.um-role-check.checked[b-4rlsbwvpe0] {
    background: #EEF2FF;
    border-color: rgba(30, 58, 138, 0.12);
}

.um-role-check-desc[b-4rlsbwvpe0] {
    font-size: 0.75rem;
    color: #9CA3AF;
    margin-left: auto;
}

/* ─── Approval Details ─── */
.um-approval-details[b-4rlsbwvpe0] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
    margin-bottom: 16px;
}

.um-detail-field[b-4rlsbwvpe0] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.um-field-label[b-4rlsbwvpe0] {
    font-size: 0.72rem;
    font-weight: 600;
    color: #9CA3AF;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.um-field-value[b-4rlsbwvpe0] {
    font-size: 0.92rem;
    font-weight: 500;
    color: #1F2937;
}

.um-field-hint[b-4rlsbwvpe0] {
    font-size: 0.75rem;
    color: #9CA3AF;
    font-style: italic;
}

/* ─── Action Bars ─── */
.um-approve-actions[b-4rlsbwvpe0],
.um-add-bar[b-4rlsbwvpe0],
.um-save-bar[b-4rlsbwvpe0] {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
    margin-top: 12px;
}

/* ─── Pending Rights ─── */
.um-pending-rights[b-4rlsbwvpe0] {
    display: flex;
    flex-direction: column;
    gap: 6px;
    margin-bottom: 4px;
}

.um-pending-item[b-4rlsbwvpe0] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 12px;
    background: #F0F4FF;
    border-radius: 8px;
    font-size: 0.85rem;
    color: #1F2937;
}

/* ─── Scrollbar ─── */
.um-user-list[b-4rlsbwvpe0]::-webkit-scrollbar {
    width: 5px;
}

.um-user-list[b-4rlsbwvpe0]::-webkit-scrollbar-track {
    background: transparent;
}

.um-user-list[b-4rlsbwvpe0]::-webkit-scrollbar-thumb {
    background: var(--mud-palette-lines-default);
    border-radius: 3px;
}

.um-user-list[b-4rlsbwvpe0]::-webkit-scrollbar-thumb:hover {
    background: #9CA3AF;
}

/* ─── Bulk Unauthorise ─── */
.um-bulk-toggle[b-4rlsbwvpe0] {
    margin-bottom: 12px;
}

.um-bulk-card[b-4rlsbwvpe0] {
    background: #fff;
    border: 1px solid #FECACA;
    border-radius: 10px;
    padding: 16px;
    margin-bottom: 16px;
}

.um-bulk-header[b-4rlsbwvpe0] {
    display: flex;
    align-items: center;
    gap: 4px;
    margin-bottom: 12px;
}

.um-bulk-body[b-4rlsbwvpe0] {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
}

/* ─── Responsive ─── */
@media (max-width: 960px) {
    .um-page[b-4rlsbwvpe0] {
        padding: 16px;
    }

    .um-layout[b-4rlsbwvpe0] {
        flex-direction: column;
    }

    .um-sidebar[b-4rlsbwvpe0] {
        width: 100%;
        min-width: 0;
    }

    .um-user-list[b-4rlsbwvpe0] {
        max-height: 250px;
    }

    .um-detail[b-4rlsbwvpe0] {
        min-height: auto;
    }

    .um-status-row[b-4rlsbwvpe0] {
        grid-template-columns: 1fr;
    }

    .um-approval-details[b-4rlsbwvpe0] {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 600px) {
    .um-header-icon[b-4rlsbwvpe0] {
        width: 42px;
        height: 42px;
        border-radius: 10px;
    }

    .um-profile[b-4rlsbwvpe0] {
        flex-wrap: wrap;
    }

    .um-profile-name[b-4rlsbwvpe0] {
        font-size: 0.95rem;
    }
}
/* /Features/DigitalSwitching/Pages/LeadOverview.razor.rz.scp.css */

/* /Features/Energy/ECOES/Pages/IndexPage.razor.rz.scp.css */
/* ─── Page Layout ─── */

.ecoes-page[b-mzps7i0bjm] {
    padding: 24px;
    max-width: 1200px;
    margin: 0 auto;
}

/* ─── Header ─── */

.ecoes-header[b-mzps7i0bjm] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    margin-bottom: 24px;
    gap: 16px;
}

.ecoes-title[b-mzps7i0bjm] {
    font-size: 1.5rem;
    font-weight: 700;
    color: var(--mud-palette-text-primary);
    margin: 0;
    letter-spacing: -0.01em;
}

.ecoes-subtitle[b-mzps7i0bjm] {
    font-size: 0.84rem;
    color: var(--mud-palette-text-secondary);
    margin: 2px 0 0;
    font-weight: 400;
}

/* ─── API Limits ─── */

.ecoes-limits[b-mzps7i0bjm] {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 4px;
    flex-shrink: 0;
}

.ecoes-limits-label[b-mzps7i0bjm] {
    font-size: 0.7rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--mud-palette-text-secondary);
}

.ecoes-limits-items[b-mzps7i0bjm] {
    display: flex;
    gap: 6px;
}

/* ─── Search Card ─── */

.ecoes-search-card[b-mzps7i0bjm] {
    background: var(--mud-palette-background);
    border: 1px solid var(--mud-palette-lines-default);
    border-radius: 12px;
    padding: 20px 24px;
    margin-bottom: 20px;
    transition: box-shadow 0.2s ease;
}

.ecoes-search-card:focus-within[b-mzps7i0bjm] {
    box-shadow: 0 4px 20px rgba(30, 58, 138, 0.08);
}

.ecoes-search-row[b-mzps7i0bjm] {
    display: flex;
    align-items: flex-end;
    gap: 20px;
}

.ecoes-search-field[b-mzps7i0bjm] {
    flex: 1;
    min-width: 0;
}

.ecoes-field-label[b-mzps7i0bjm] {
    display: block;
    font-size: 0.72rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--mud-palette-text-secondary);
    margin-bottom: 6px;
}

[b-mzps7i0bjm] .ecoes-mpan-input {
    width: 100% !important;
    padding: 10px 14px;
    border: 1px solid var(--mud-palette-lines-default);
    border-radius: 8px;
    font-size: 1rem;
    font-family: 'Cascadia Code', 'Fira Code', 'Consolas', monospace;
    font-weight: 500;
    letter-spacing: 0.06em;
    color: var(--mud-palette-text-primary);
    background: var(--mud-palette-background);
    transition: border-color 0.15s ease, box-shadow 0.15s ease, background 0.15s ease;
    outline: none;
}

[b-mzps7i0bjm] .ecoes-mpan-input:focus {
    border-color: #3B82F6;
    box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.12);
    background: var(--mud-palette-background);
}

.ecoes-search-actions[b-mzps7i0bjm] {
    display: flex;
    gap: 8px;
    flex-shrink: 0;
}

/* ─── Buttons ─── */

.ecoes-btn[b-mzps7i0bjm] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 9px 16px;
    border-radius: 8px;
    font-size: 0.82rem;
    font-weight: 600;
    border: none;
    cursor: pointer;
    transition: all 0.15s ease;
    white-space: nowrap;
}

.ecoes-btn:disabled[b-mzps7i0bjm] {
    opacity: 0.45;
    cursor: not-allowed;
    transform: none !important;
    box-shadow: none !important;
}

.ecoes-btn-primary[b-mzps7i0bjm] {
    background: #1E3A8A;
    color: #fff;
}

.ecoes-btn-primary:hover:not(:disabled)[b-mzps7i0bjm] {
    background: #1E40AF;
    box-shadow: 0 4px 12px rgba(30, 58, 138, 0.3);
    transform: translateY(-1px);
}

.ecoes-btn-secondary[b-mzps7i0bjm] {
    background: #EFF6FF;
    color: #1E3A8A;
    border: 1px solid #BFDBFE;
}

.ecoes-btn-secondary:hover:not(:disabled)[b-mzps7i0bjm] {
    background: #DBEAFE;
    border-color: #93C5FD;
    transform: translateY(-1px);
}

.ecoes-btn-tertiary[b-mzps7i0bjm] {
    background: var(--mud-palette-background);
    color: var(--mud-palette-text-primary);
    border: 1px solid var(--mud-palette-lines-default);
}

.ecoes-btn-tertiary:hover:not(:disabled)[b-mzps7i0bjm] {
    background: var(--mud-palette-lines-default);
    border-color: var(--mud-palette-lines-default);
    transform: translateY(-1px);
}

[b-mzps7i0bjm] .ecoes-btn .mud-icon-root {
    font-size: 1rem !important;
}

/* ─── Spinner ─── */

.ecoes-spinner[b-mzps7i0bjm] {
    width: 14px;
    height: 14px;
    border: 2px solid rgba(255, 255, 255, 0.3);
    border-top-color: currentColor;
    border-radius: 50%;
    animation: ecoes-spin-b-mzps7i0bjm 0.6s linear infinite;
}

.ecoes-btn-secondary .ecoes-spinner[b-mzps7i0bjm],
.ecoes-btn-tertiary .ecoes-spinner[b-mzps7i0bjm] {
    border-color: rgba(30, 58, 138, 0.15);
    border-top-color: #1E3A8A;
}

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

/* ─── Error Banner ─── */

.ecoes-error[b-mzps7i0bjm] {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-top: 14px;
    padding: 10px 14px;
    background: #FEF2F2;
    border: 1px solid #FECACA;
    border-radius: 8px;
    color: #B91C1C;
    font-size: 0.84rem;
    font-weight: 500;
}

[b-mzps7i0bjm] .ecoes-error .mud-icon-root {
    color: #EF4444;
    font-size: 1.1rem !important;
    flex-shrink: 0;
}

.ecoes-error span[b-mzps7i0bjm] {
    flex: 1;
}

.ecoes-error-close[b-mzps7i0bjm] {
    background: none;
    border: none;
    cursor: pointer;
    padding: 2px;
    border-radius: 4px;
    color: #B91C1C;
    opacity: 0.6;
    transition: opacity 0.15s ease;
}

.ecoes-error-close:hover[b-mzps7i0bjm] {
    opacity: 1;
}

/* ─── Results Container ─── */

.ecoes-results[b-mzps7i0bjm] {
    background: var(--mud-palette-background);
    border: 1px solid var(--mud-palette-lines-default);
    border-radius: 12px;
    overflow: hidden;
    transition: box-shadow 0.2s ease;
}

.ecoes-results:hover[b-mzps7i0bjm] {
    box-shadow: 0 4px 20px rgba(30, 58, 138, 0.06);
}

/* ─── Tab Bar ─── */

.ecoes-tab-bar[b-mzps7i0bjm] {
    display: flex;
    border-bottom: 1px solid var(--mud-palette-lines-default);
    background: var(--mud-palette-background);
    padding: 0 8px;
    gap: 2px;
}

.ecoes-tab[b-mzps7i0bjm] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 12px 16px;
    font-size: 0.82rem;
    font-weight: 500;
    color: var(--mud-palette-text-secondary);
    background: none;
    border: none;
    border-bottom: 2px solid transparent;
    cursor: pointer;
    transition: all 0.15s ease;
    margin-bottom: -1px;
}

.ecoes-tab:hover[b-mzps7i0bjm] {
    color: #1E3A8A;
    background: rgba(30, 58, 138, 0.04);
}

.ecoes-tab-active[b-mzps7i0bjm] {
    color: #1E3A8A;
    border-bottom-color: #1E3A8A;
    font-weight: 600;
}

[b-mzps7i0bjm] .ecoes-tab .mud-icon-root {
    font-size: 1rem !important;
}

/* ─── Tab Content ─── */

.ecoes-tab-content[b-mzps7i0bjm] {
    padding: 20px 24px;
}

/* ─── Style overrides for child Section/TRow/TextRow components ─── */

[b-mzps7i0bjm] .ecoes-tab-content .row {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 20px;
    margin: 0;
}

[b-mzps7i0bjm] .ecoes-tab-content .col-lg-6 {
    width: 100%;
    max-width: 100%;
    padding: 0;
    flex: none;
}

[b-mzps7i0bjm] .ecoes-tab-content .card {
    background: var(--mud-palette-background);
    border: 1px solid var(--mud-palette-lines-default);
    border-radius: 10px;
    overflow: hidden;
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

[b-mzps7i0bjm] .ecoes-tab-content .card:hover {
    transform: translateY(-1px);
    box-shadow: 0 4px 16px rgba(30, 58, 138, 0.06);
}

[b-mzps7i0bjm] .ecoes-tab-content .card-header {
    padding: 10px 16px;
    font-size: 0.76rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    border-bottom: 1px solid var(--mud-palette-lines-default);
}

[b-mzps7i0bjm] .ecoes-tab-content .card-header.bg-primary {
    background: #1E3A8A !important;
    color: #fff;
    border-bottom: none;
}

[b-mzps7i0bjm] .ecoes-tab-content .card-header.bg-info {
    background: #EFF6FF !important;
    color: #1E3A8A;
    border-bottom: 1px solid #DBEAFE;
}

[b-mzps7i0bjm] .ecoes-tab-content .card-body {
    padding: 0;
}

[b-mzps7i0bjm] .ecoes-tab-content .card-body .table {
    margin: 0;
    font-size: 0.84rem;
    width: 100%;
}

[b-mzps7i0bjm] .ecoes-tab-content .card-body .table td {
    padding: 7px 16px;
    border-color: var(--mud-palette-lines-default);
    vertical-align: middle;
}

[b-mzps7i0bjm] .ecoes-tab-content .card-body .table tr:last-child td {
    border-bottom: none;
}

[b-mzps7i0bjm] .ecoes-tab-content .card-body .table tr:hover {
    background: var(--mud-palette-background);
}

[b-mzps7i0bjm] .ecoes-tab-content .card-body .table td b {
    font-weight: 600;
    color: var(--mud-palette-text-primary);
    font-size: 0.78rem;
}

[b-mzps7i0bjm] .ecoes-tab-content .card-body .table .text-muted {
    color: var(--mud-palette-text-secondary) !important;
    font-size: 0.78rem;
}

[b-mzps7i0bjm] .ecoes-tab-content .card-body .table .text-secondary {
    color: var(--mud-palette-text-secondary) !important;
    font-size: 0.76rem;
}

/* ─── CSS History Table Override ─── */

[b-mzps7i0bjm] .ecoes-tab-content .table-striped {
    border-collapse: collapse;
    width: 100%;
    font-size: 0.84rem;
}

[b-mzps7i0bjm] .ecoes-tab-content .table-striped thead th {
    background: var(--mud-palette-background);
    color: var(--mud-palette-text-secondary);
    font-weight: 600;
    font-size: 0.72rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    padding: 10px 16px;
    border-bottom: 1px solid var(--mud-palette-lines-default);
    text-align: left;
}

[b-mzps7i0bjm] .ecoes-tab-content .table-striped tbody td {
    padding: 9px 16px;
    border-bottom: 1px solid var(--mud-palette-lines-default);
    color: var(--mud-palette-text-primary);
}

[b-mzps7i0bjm] .ecoes-tab-content .table-striped tbody tr:hover {
    background: #F0F4FF !important;
}

[b-mzps7i0bjm] .ecoes-tab-content .table-striped tbody tr:nth-child(odd) {
    background: transparent;
}

[b-mzps7i0bjm] .ecoes-tab-content .table-striped a {
    color: #1E3A8A;
    font-weight: 600;
    text-decoration: none;
    transition: color 0.15s ease;
}

[b-mzps7i0bjm] .ecoes-tab-content .table-striped a:hover {
    color: #3B82F6;
}

/* ─── LimitBadge Override ─── */

[b-mzps7i0bjm] .ecoes-limits-items .badge {
    font-size: 0.7rem;
    font-weight: 600;
    padding: 3px 8px;
    border-radius: 6px;
    letter-spacing: 0.02em;
}

[b-mzps7i0bjm] .ecoes-limits-items .badge-success {
    background: #D1FAE5 !important;
    color: #047857 !important;
}

[b-mzps7i0bjm] .ecoes-limits-items .badge-warning {
    background: #FEF3C7 !important;
    color: #B45309 !important;
}

[b-mzps7i0bjm] .ecoes-limits-items .badge-danger {
    background: #FEE2E2 !important;
    color: #B91C1C !important;
}

[b-mzps7i0bjm] .ecoes-limits-items .badge-secondary {
    background: var(--mud-palette-background) !important;
    color: var(--mud-palette-text-secondary) !important;
}

[b-mzps7i0bjm] .ecoes-limits-items .fa-exclamation-triangle {
    font-size: 0.7rem;
    margin-left: 2px;
}

/* ─── Empty State ─── */

.ecoes-empty[b-mzps7i0bjm] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 64px 24px;
    background: var(--mud-palette-background);
    border: 1px dashed var(--mud-palette-lines-default);
    border-radius: 12px;
}

[b-mzps7i0bjm] .ecoes-empty-icon {
    color: var(--mud-palette-lines-default);
    font-size: 2.5rem !important;
    margin-bottom: 12px;
}

.ecoes-empty-text[b-mzps7i0bjm] {
    color: var(--mud-palette-text-secondary);
    font-size: 0.9rem;
    margin: 0;
}

/* ─── Entrance Animation ─── */

.ecoes-anim[b-mzps7i0bjm] {
    animation: ecoes-fade-up-b-mzps7i0bjm 0.35s cubic-bezier(0.4, 0, 0.2, 1) both;
}

@keyframes ecoes-fade-up-b-mzps7i0bjm {
    from {
        opacity: 0;
        transform: translateY(10px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* ─── Responsive ─── */

@media (max-width: 960px) {
    .ecoes-search-row[b-mzps7i0bjm] {
        flex-direction: column;
        align-items: stretch;
    }

    .ecoes-search-actions[b-mzps7i0bjm] {
        justify-content: flex-start;
    }

    [b-mzps7i0bjm] .ecoes-tab-content .row {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 600px) {
    .ecoes-page[b-mzps7i0bjm] {
        padding: 16px;
    }

    .ecoes-header[b-mzps7i0bjm] {
        flex-direction: column;
        align-items: flex-start;
    }

    .ecoes-limits[b-mzps7i0bjm] {
        align-items: flex-start;
    }

    .ecoes-search-card[b-mzps7i0bjm] {
        padding: 16px;
    }

    .ecoes-search-actions[b-mzps7i0bjm] {
        flex-direction: column;
    }

    .ecoes-btn[b-mzps7i0bjm] {
        justify-content: center;
    }

    .ecoes-tab-bar[b-mzps7i0bjm] {
        overflow-x: auto;
    }

    .ecoes-tab-content[b-mzps7i0bjm] {
        padding: 16px;
    }
}
/* /Features/Executive/Dashboard/Pages/ExecDashboard.razor.rz.scp.css */
[b-3fy01za7ze] .exec-stat-box {
    border-radius: 12px;
    background: white;
    transition: box-shadow 0.2s ease;
}

[b-3fy01za7ze] .exec-stat-box:hover {
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
}

[b-3fy01za7ze] .mud-chart {
    min-height: 200px;
}

.cursor-pointer[b-3fy01za7ze] {
    cursor: pointer;
}

@media print {
    [b-3fy01za7ze] .no-print,
    [b-3fy01za7ze] .mud-drawer,
    [b-3fy01za7ze] .mud-appbar,
    [b-3fy01za7ze] .mud-nav-menu {
        display: none !important;
    }

    [b-3fy01za7ze] .mud-paper {
        box-shadow: none !important;
        break-inside: avoid;
    }

    [b-3fy01za7ze] .mud-grid-item {
        break-inside: avoid;
    }
}
/* /Features/Executive/Engineering/Pages/Engineering.razor.rz.scp.css */
[b-sanwzfxzb2] .mud-chart {
    min-height: 200px;
}

[b-sanwzfxzb2] .mud-simple-table {
    font-size: 0.875rem;
}
/* /Features/HelpCenter/Pages/HelpCenter.razor.rz.scp.css */
/* ============================================
   Help Center — UI/UX Overhaul
   ============================================ */

/* ---- Hero Section ---- */
[b-ip299y2j44] .help-hero {
    background: linear-gradient(135deg, rgba(var(--mud-palette-primary-rgb), 0.06) 0%, rgba(var(--mud-palette-primary-rgb), 0.02) 100%);
    padding: 3.5rem 0 3rem;
    margin-bottom: 0;
}

[b-ip299y2j44] .help-hero-content {
    text-align: center;
    max-width: 640px;
    margin: 0 auto;
}

[b-ip299y2j44] .help-hero-title {
    font-weight: 700;
    margin-bottom: 0.5rem;
}

[b-ip299y2j44] .help-hero-subtitle {
    color: rgba(0, 0, 0, 0.55);
    margin-bottom: 1.5rem;
}

[b-ip299y2j44] .help-hero-search {
    max-width: 560px;
    margin: 0 auto;
}

[b-ip299y2j44] .help-hero-search .mud-input-outlined .mud-input-outlined-border {
    border-radius: 12px;
    border-color: rgba(0, 0, 0, 0.12);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
}

[b-ip299y2j44] .help-hero-search .mud-input {
    font-size: 1rem;
}

/* ---- Category Cards Grid ---- */
[b-ip299y2j44] .help-category-grid .mud-grid-item {
    display: flex;
}

/* ---- Category Cards — vertical layout ---- */
[b-ip299y2j44] .help-category-card {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    padding: 2rem 1.5rem 1.75rem;
    border-radius: 12px;
    border: 1px solid rgba(0, 0, 0, 0.08);
    background: #fff;
    cursor: pointer;
    transition: all 0.2s ease;
    width: 100%;
    min-height: 220px;
}

[b-ip299y2j44] .help-category-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.08);
    border-color: rgba(0, 0, 0, 0.12);
}

[b-ip299y2j44] .help-category-card-icon {
    width: 48px;
    height: 48px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 1rem;
}

[b-ip299y2j44] .help-category-card-title {
    font-weight: 600;
    margin-bottom: 0.35rem;
}

[b-ip299y2j44] .help-category-card-desc {
    color: rgba(0, 0, 0, 0.55);
    font-size: 0.85rem;
    line-height: 1.5;
    margin-bottom: 0.75rem;
    flex: 1;
}

[b-ip299y2j44] .help-category-card-count {
    color: rgba(0, 0, 0, 0.4);
    font-size: 0.75rem;
}

/* ---- Popular Articles — 2-column grid ---- */
[b-ip299y2j44] .help-popular-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0;
}

[b-ip299y2j44] .help-popular-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.75rem 1rem;
    cursor: pointer;
    border-radius: 8px;
    transition: background-color 0.15s ease;
}

[b-ip299y2j44] .help-popular-item:hover {
    background: rgba(0, 0, 0, 0.03);
}

[b-ip299y2j44] .help-popular-item-content {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

[b-ip299y2j44] .help-popular-item-arrow {
    color: rgba(0, 0, 0, 0.2);
    font-size: 1.2rem;
    transition: transform 0.15s ease;
}

[b-ip299y2j44] .help-popular-item:hover .help-popular-item-arrow {
    transform: translateX(3px);
    color: rgba(0, 0, 0, 0.4);
}

/* ---- Category Badge (small pill) ---- */
[b-ip299y2j44] .help-category-badge {
    display: inline-block;
    font-size: 0.7rem;
    font-weight: 600;
    padding: 0.15rem 0.5rem;
    border-radius: 10px;
    line-height: 1.4;
    white-space: nowrap;
}

/* ---- Category Pill (filled, white text) ---- */
[b-ip299y2j44] .help-category-pill {
    display: inline-block;
    font-size: 0.72rem;
    font-weight: 600;
    padding: 0.2rem 0.65rem;
    border-radius: 10px;
    line-height: 1.4;
    white-space: nowrap;
}

/* ---- Recently Updated list ---- */
[b-ip299y2j44] .help-recent-list {
    border: 1px solid rgba(0, 0, 0, 0.08);
    border-radius: 8px;
    overflow: hidden;
}

[b-ip299y2j44] .help-recent-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.85rem 1.25rem;
    cursor: pointer;
    transition: background-color 0.15s ease;
    border-bottom: 1px solid rgba(0, 0, 0, 0.05);
}

[b-ip299y2j44] .help-recent-item:last-child {
    border-bottom: none;
}

[b-ip299y2j44] .help-recent-item:hover {
    background: rgba(0, 0, 0, 0.02);
}

[b-ip299y2j44] .help-recent-item-content {
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
}

[b-ip299y2j44] .help-recent-date {
    color: rgba(0, 0, 0, 0.4);
    white-space: nowrap;
}

/* ---- Category Page Header ---- */
[b-ip299y2j44] .help-category-header {
    display: flex;
    align-items: center;
    gap: 1.25rem;
    padding: 1.5rem;
    border-radius: 12px;
    margin-bottom: 1.5rem;
}

[b-ip299y2j44] .help-category-header-icon {
    width: 48px;
    height: 48px;
    min-width: 48px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* ---- Article List (category page) ---- */
[b-ip299y2j44] .help-article-list {
    display: flex;
    flex-direction: column;
}

[b-ip299y2j44] .help-article-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 1rem 1rem;
    cursor: pointer;
    border-bottom: 1px solid rgba(0, 0, 0, 0.06);
    transition: background-color 0.15s ease;
}

[b-ip299y2j44] .help-article-item:last-child {
    border-bottom: none;
}

[b-ip299y2j44] .help-article-item:hover {
    background: rgba(0, 0, 0, 0.02);
}

[b-ip299y2j44] .help-article-item-content {
    flex: 1;
    min-width: 0;
}

[b-ip299y2j44] .help-article-item-desc {
    color: rgba(0, 0, 0, 0.55);
    margin-top: 0.2rem;
    font-size: 0.85rem;
}

[b-ip299y2j44] .help-article-item-chevron {
    color: rgba(0, 0, 0, 0.2);
    transition: transform 0.15s ease;
    flex-shrink: 0;
}

[b-ip299y2j44] .help-article-item:hover .help-article-item-chevron {
    transform: translateX(3px);
    color: rgba(0, 0, 0, 0.4);
}

/* ---- Article Page — Title & Meta ---- */
[b-ip299y2j44] .help-article-title {
    font-weight: 700;
    margin-bottom: 0.75rem;
}

[b-ip299y2j44] .help-article-meta {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    margin-bottom: 0.75rem;
    flex-wrap: wrap;
}

[b-ip299y2j44] .help-article-meta-date {
    color: rgba(0, 0, 0, 0.45);
}

[b-ip299y2j44] .help-article-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
    margin-bottom: 1.5rem;
}

[b-ip299y2j44] .help-tag-pill {
    display: inline-block;
    font-size: 0.72rem;
    padding: 0.2rem 0.6rem;
    border-radius: 10px;
    background: rgba(0, 0, 0, 0.05);
    color: rgba(0, 0, 0, 0.6);
    line-height: 1.4;
}

/* ---- Article Content — Reading Typography ---- */
[b-ip299y2j44] .help-article-content {
    max-width: 72ch;
    line-height: 1.85;
    font-size: 1rem;
}

[b-ip299y2j44] .help-article-content h2 {
    margin-top: 2.5rem;
    margin-bottom: 0.75rem;
    font-size: 1.6rem;
    font-weight: 600;
    scroll-margin-top: 80px;
    padding-bottom: 0.4rem;
    border-bottom: 1px solid rgba(0, 0, 0, 0.08);
}

[b-ip299y2j44] .help-article-content h3 {
    margin-top: 1.75rem;
    margin-bottom: 0.5rem;
    font-size: 1.25rem;
    font-weight: 600;
    scroll-margin-top: 80px;
}

[b-ip299y2j44] .help-article-content p {
    margin-bottom: 1rem;
}

[b-ip299y2j44] .help-article-content ul,
[b-ip299y2j44] .help-article-content ol {
    margin-bottom: 1rem;
    padding-left: 1.5rem;
}

[b-ip299y2j44] .help-article-content li {
    margin-bottom: 0.5rem;
}

/* ---- Tables — rounded, alternating rows ---- */
[b-ip299y2j44] .help-article-content table {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    margin-bottom: 1.5rem;
    border: 1px solid rgba(0, 0, 0, 0.1);
    border-radius: 8px;
    overflow: hidden;
}

[b-ip299y2j44] .help-article-content th,
[b-ip299y2j44] .help-article-content td {
    border-bottom: 1px solid rgba(0, 0, 0, 0.06);
    padding: 0.6rem 0.9rem;
    text-align: left;
}

[b-ip299y2j44] .help-article-content th {
    background-color: rgba(var(--mud-palette-primary-rgb), 0.06);
    font-weight: 600;
    font-size: 0.88rem;
}

[b-ip299y2j44] .help-article-content tr:nth-child(even) td {
    background-color: rgba(0, 0, 0, 0.015);
}

[b-ip299y2j44] .help-article-content tr:last-child td {
    border-bottom: none;
}

/* ---- Code — inline & blocks ---- */
[b-ip299y2j44] .help-article-content code {
    background-color: rgba(124, 58, 237, 0.08);
    color: #5b21b6;
    padding: 0.15rem 0.4rem;
    border-radius: 3px;
    font-size: 0.88em;
    font-family: 'Cascadia Code', 'Fira Code', Consolas, monospace;
}

[b-ip299y2j44] .help-article-content pre {
    background-color: #1e1e2e;
    color: #cdd6f4;
    border-radius: 8px;
    padding: 1.25rem;
    overflow-x: auto;
    margin-bottom: 1.5rem;
    border-left: 3px solid var(--mud-palette-primary);
}

[b-ip299y2j44] .help-article-content pre code {
    background: none;
    color: inherit;
    padding: 0;
    font-size: 0.85rem;
}

/* ---- Images ---- */
[b-ip299y2j44] .help-article-content img {
    max-width: 100%;
    height: auto;
    border-radius: 8px;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
    margin: 0.75rem 0;
}

/* ---- Links ---- */
[b-ip299y2j44] .help-article-content a {
    color: var(--mud-palette-primary);
    text-decoration: none;
}

[b-ip299y2j44] .help-article-content a:hover {
    text-decoration: underline;
}

[b-ip299y2j44] .help-article-content strong {
    font-weight: 600;
}

/* ---- Blockquotes (non-callout) ---- */
[b-ip299y2j44] .help-article-content blockquote {
    border-left: 3px solid rgba(0, 0, 0, 0.15);
    margin: 1.25rem 0;
    padding: 0.5rem 1.25rem;
    color: rgba(0, 0, 0, 0.6);
    font-style: italic;
}

/* ---- Callouts — flex layout with icon ---- */
[b-ip299y2j44] .help-callout {
    display: flex;
    gap: 0.85rem;
    border-radius: 8px;
    padding: 1rem 1.25rem;
    margin: 1.25rem 0;
    border: 1px solid;
}

[b-ip299y2j44] .help-callout-icon {
    flex-shrink: 0;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 0.1rem;
}

[b-ip299y2j44] .help-callout-content {
    flex: 1;
    min-width: 0;
}

[b-ip299y2j44] .help-callout-content p {
    margin-bottom: 0.25rem;
}

[b-ip299y2j44] .help-callout-content p:last-child {
    margin-bottom: 0;
}

[b-ip299y2j44] .help-callout-info {
    background-color: #eff6ff;
    border-color: #bfdbfe;
    color: #1e40af;
}

[b-ip299y2j44] .help-callout-info .help-callout-icon {
    background: rgba(37, 99, 235, 0.12);
    color: #2563eb;
}

[b-ip299y2j44] .help-callout-tip {
    background-color: #f0fdf4;
    border-color: #bbf7d0;
    color: #166534;
}

[b-ip299y2j44] .help-callout-tip .help-callout-icon {
    background: rgba(22, 163, 74, 0.12);
    color: #16a34a;
}

[b-ip299y2j44] .help-callout-warning {
    background-color: #fffbeb;
    border-color: #fde68a;
    color: #92400e;
}

[b-ip299y2j44] .help-callout-warning .help-callout-icon {
    background: rgba(245, 158, 11, 0.12);
    color: #f59e0b;
}

[b-ip299y2j44] .help-callout-important {
    background-color: #fef2f2;
    border-color: #fecaca;
    color: #991b1b;
}

[b-ip299y2j44] .help-callout-important .help-callout-icon {
    background: rgba(239, 68, 68, 0.12);
    color: #ef4444;
}

/* ---- Prev/Next Navigation Cards ---- */
[b-ip299y2j44] .help-prevnext {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    margin-top: 3rem;
    padding-top: 2rem;
    border-top: 1px solid rgba(0, 0, 0, 0.08);
}

[b-ip299y2j44] .help-prevnext-card {
    flex: 1;
    padding: 1rem 1.25rem;
    border: 1px solid rgba(0, 0, 0, 0.1);
    border-radius: 8px;
    cursor: pointer;
    transition: all 0.2s ease;
    max-width: 48%;
}

[b-ip299y2j44] .help-prevnext-card:hover {
    border-color: rgba(var(--mud-palette-primary-rgb), 0.3);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.06);
    transform: translateY(-1px);
}

[b-ip299y2j44] .help-prevnext-next {
    text-align: right;
    margin-left: auto;
}

[b-ip299y2j44] .help-prevnext-label {
    display: flex;
    align-items: center;
    gap: 0.25rem;
    color: rgba(0, 0, 0, 0.45);
    margin-bottom: 0.25rem;
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

[b-ip299y2j44] .help-prevnext-next .help-prevnext-label {
    justify-content: flex-end;
}

/* ---- Related Articles ---- */
[b-ip299y2j44] .help-related-section {
    margin-top: 2.5rem;
    padding-top: 2rem;
    border-top: 1px solid rgba(0, 0, 0, 0.08);
}

[b-ip299y2j44] .help-related-list {
    display: flex;
    flex-direction: column;
}

[b-ip299y2j44] .help-related-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.65rem 0.75rem;
    cursor: pointer;
    border-radius: 6px;
    transition: background-color 0.15s ease;
}

[b-ip299y2j44] .help-related-item:hover {
    background: rgba(0, 0, 0, 0.03);
}

[b-ip299y2j44] .help-related-item-content {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    flex: 1;
    min-width: 0;
}

/* ---- Table of Contents ---- */
[b-ip299y2j44] .help-toc-sticky {
    position: sticky;
    top: 80px;
    max-height: calc(100vh - 100px);
    overflow-y: auto;
}

[b-ip299y2j44] .help-toc-wrapper {
    padding-left: 1rem;
    border-left: 2px solid rgba(0, 0, 0, 0.08);
}

[b-ip299y2j44] .help-toc-label {
    display: block;
    font-size: 0.7rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: rgba(0, 0, 0, 0.4);
    margin-bottom: 0.75rem;
}

[b-ip299y2j44] .help-toc-nav {
    display: flex;
    flex-direction: column;
}

[b-ip299y2j44] .help-toc-link {
    display: block;
    padding: 0.3rem 0;
    font-size: 0.82rem;
    color: rgba(0, 0, 0, 0.55);
    text-decoration: none;
    transition: color 0.15s ease;
    line-height: 1.4;
}

[b-ip299y2j44] .help-toc-link:hover {
    color: rgba(0, 0, 0, 0.85);
}

[b-ip299y2j44] .help-toc-link-h3 {
    padding-left: 0.85rem;
    font-size: 0.78rem;
}

/* ---- Sidebar ---- */
[b-ip299y2j44] .help-nav-sidebar {
    position: sticky;
    top: 80px;
    max-height: calc(100vh - 120px);
    overflow-y: auto;
}

[b-ip299y2j44] .help-sidebar-nav {
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
}

[b-ip299y2j44] .help-sidebar-group-title {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.5rem 0.65rem;
    font-size: 0.875rem;
    font-weight: 600;
    color: rgba(0, 0, 0, 0.8);
    cursor: pointer;
    border-radius: 6px;
    transition: background-color 0.15s ease;
    user-select: none;
}

[b-ip299y2j44] .help-sidebar-group-title:hover {
    background: rgba(0, 0, 0, 0.04);
}

[b-ip299y2j44] .help-sidebar-articles {
    display: flex;
    flex-direction: column;
    padding-left: 0.5rem;
    margin-bottom: 0.35rem;
}

[b-ip299y2j44] .help-sidebar-link {
    display: block;
    padding: 0.35rem 0.65rem 0.35rem 1.25rem;
    font-size: 0.825rem;
    color: rgba(0, 0, 0, 0.6);
    text-decoration: none;
    border-radius: 4px;
    transition: all 0.15s ease;
    border-left: 2px solid transparent;
}

[b-ip299y2j44] .help-sidebar-link:hover {
    color: rgba(0, 0, 0, 0.85);
    background: rgba(0, 0, 0, 0.03);
}

[b-ip299y2j44] .help-sidebar-link.active {
    color: var(--mud-palette-primary);
    font-weight: 500;
    border-left-color: var(--mud-palette-primary);
    background: rgba(var(--mud-palette-primary-rgb), 0.06);
}

/* ---- Breadcrumbs ---- */
[b-ip299y2j44] .help-breadcrumbs {
    padding-left: 0;
    padding-right: 0;
    margin-bottom: 0.5rem;
}

[b-ip299y2j44] .help-breadcrumbs .mud-breadcrumbs li {
    font-size: 0.8rem;
}

[b-ip299y2j44] .help-breadcrumbs .mud-breadcrumbs li .mud-typography {
    font-size: 0.8rem;
    color: rgba(0, 0, 0, 0.45);
}

[b-ip299y2j44] .help-breadcrumbs .mud-breadcrumbs li a {
    color: rgba(0, 0, 0, 0.5);
    text-decoration: none;
}

[b-ip299y2j44] .help-breadcrumbs .mud-breadcrumbs li a:hover {
    color: rgba(0, 0, 0, 0.8);
}

[b-ip299y2j44] .help-breadcrumbs .mud-breadcrumb-separator {
    color: rgba(0, 0, 0, 0.3);
}

/* ---- Search Results ---- */
[b-ip299y2j44] .help-search-header {
    margin-bottom: 2rem;
}

[b-ip299y2j44] .help-results-count {
    display: inline-block;
    font-size: 0.75rem;
    font-weight: 500;
    padding: 0.2rem 0.65rem;
    border-radius: 10px;
    background: rgba(0, 0, 0, 0.06);
    color: rgba(0, 0, 0, 0.55);
    margin-bottom: 1rem;
}

[b-ip299y2j44] .help-search-empty {
    text-align: center;
    padding: 3rem 1rem;
}

[b-ip299y2j44] .help-search-popular {
    display: flex;
    flex-direction: column;
    max-width: 400px;
    margin: 0 auto;
    text-align: left;
}

[b-ip299y2j44] .help-search-popular-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.5rem 0.75rem;
    cursor: pointer;
    border-radius: 6px;
    transition: background-color 0.15s ease;
}

[b-ip299y2j44] .help-search-popular-item:hover {
    background: rgba(0, 0, 0, 0.03);
}

[b-ip299y2j44] .help-search-group {
    margin-bottom: 1.5rem;
}

[b-ip299y2j44] .help-search-group-header {
    border-bottom: 1px solid rgba(0, 0, 0, 0.08);
    margin-bottom: 0.5rem;
    padding-bottom: 0.35rem;
}

[b-ip299y2j44] .help-search-group-label {
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: rgba(0, 0, 0, 0.4);
}

[b-ip299y2j44] .help-search-result {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.85rem 0.75rem;
    cursor: pointer;
    border-radius: 6px;
    transition: background-color 0.15s ease;
}

[b-ip299y2j44] .help-search-result:hover {
    background: rgba(0, 0, 0, 0.03);
}

[b-ip299y2j44] .help-search-result-content {
    flex: 1;
    min-width: 0;
}

[b-ip299y2j44] .help-search-result-preview {
    color: rgba(0, 0, 0, 0.55);
    font-size: 0.85rem;
    margin-top: 0.15rem;
}

/* ---- Responsive ---- */
@media (max-width: 959px) {
    [b-ip299y2j44] .help-toc-sticky {
        position: static;
        max-height: none;
    }

    [b-ip299y2j44] .help-nav-sidebar {
        position: static;
        max-height: none;
    }

    [b-ip299y2j44] .help-popular-grid {
        grid-template-columns: 1fr;
    }

    [b-ip299y2j44] .help-prevnext {
        flex-direction: column;
    }

    [b-ip299y2j44] .help-prevnext-card {
        max-width: 100%;
    }

    [b-ip299y2j44] .help-prevnext-next {
        text-align: left;
    }

    [b-ip299y2j44] .help-prevnext-next .help-prevnext-label {
        justify-content: flex-start;
    }

    [b-ip299y2j44] .help-hero {
        padding: 2rem 0 1.5rem;
    }

    [b-ip299y2j44] .help-category-card {
        min-height: auto;
    }
}

/* ============================================
   Dark Mode Overrides
   ============================================ */

/* ── Hero ── */
:global(.mud-theme-dark)[b-ip299y2j44]  .help-hero-subtitle {
    color: rgba(255, 255, 255, 0.5);
}

:global(.mud-theme-dark)[b-ip299y2j44]  .help-hero-search .mud-input-outlined .mud-input-outlined-border {
    border-color: rgba(255, 255, 255, 0.12);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);
}

/* ── Category Cards ── */
:global(.mud-theme-dark)[b-ip299y2j44]  .help-category-card {
    background: var(--mud-palette-surface);
    border-color: rgba(255, 255, 255, 0.08);
}

:global(.mud-theme-dark)[b-ip299y2j44]  .help-category-card:hover {
    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.25);
    border-color: rgba(255, 255, 255, 0.15);
}

:global(.mud-theme-dark)[b-ip299y2j44]  .help-category-card-desc {
    color: rgba(255, 255, 255, 0.5);
}

:global(.mud-theme-dark)[b-ip299y2j44]  .help-category-card-count {
    color: rgba(255, 255, 255, 0.35);
}

/* ── Popular & Recent Items ── */
:global(.mud-theme-dark)[b-ip299y2j44]  .help-popular-item:hover {
    background: rgba(255, 255, 255, 0.04);
}

:global(.mud-theme-dark)[b-ip299y2j44]  .help-popular-item-arrow {
    color: rgba(255, 255, 255, 0.2);
}

:global(.mud-theme-dark)[b-ip299y2j44]  .help-popular-item:hover .help-popular-item-arrow {
    color: rgba(255, 255, 255, 0.4);
}

:global(.mud-theme-dark)[b-ip299y2j44]  .help-recent-list {
    border-color: rgba(255, 255, 255, 0.08);
}

:global(.mud-theme-dark)[b-ip299y2j44]  .help-recent-item {
    border-bottom-color: rgba(255, 255, 255, 0.05);
}

:global(.mud-theme-dark)[b-ip299y2j44]  .help-recent-item:hover {
    background: rgba(255, 255, 255, 0.03);
}

:global(.mud-theme-dark)[b-ip299y2j44]  .help-recent-date {
    color: rgba(255, 255, 255, 0.4);
}

/* ── Tag Pills ── */
:global(.mud-theme-dark)[b-ip299y2j44]  .help-tag-pill {
    background: rgba(255, 255, 255, 0.08);
    color: rgba(255, 255, 255, 0.6);
}

/* ── Results count ── */
:global(.mud-theme-dark)[b-ip299y2j44]  .help-results-count {
    background: rgba(255, 255, 255, 0.08);
    color: rgba(255, 255, 255, 0.55);
}

/* ── Article Items ── */
:global(.mud-theme-dark)[b-ip299y2j44]  .help-article-item {
    border-bottom-color: rgba(255, 255, 255, 0.06);
}

:global(.mud-theme-dark)[b-ip299y2j44]  .help-article-item:hover {
    background: rgba(255, 255, 255, 0.03);
}

:global(.mud-theme-dark)[b-ip299y2j44]  .help-article-item-desc {
    color: rgba(255, 255, 255, 0.5);
}

:global(.mud-theme-dark)[b-ip299y2j44]  .help-article-item-chevron {
    color: rgba(255, 255, 255, 0.2);
}

:global(.mud-theme-dark)[b-ip299y2j44]  .help-article-item:hover .help-article-item-chevron {
    color: rgba(255, 255, 255, 0.4);
}

/* ── Article Meta ── */
:global(.mud-theme-dark)[b-ip299y2j44]  .help-article-meta-date {
    color: rgba(255, 255, 255, 0.45);
}

/* ── Blockquotes ── */
:global(.mud-theme-dark)[b-ip299y2j44]  .help-article-content blockquote {
    border-left-color: rgba(255, 255, 255, 0.15);
    color: rgba(255, 255, 255, 0.6);
}

/* ── Tables ── */
:global(.mud-theme-dark)[b-ip299y2j44]  .help-article-content table {
    border-color: rgba(255, 255, 255, 0.1);
}

:global(.mud-theme-dark)[b-ip299y2j44]  .help-article-content th,
:global(.mud-theme-dark)[b-ip299y2j44]  .help-article-content td {
    border-bottom-color: rgba(255, 255, 255, 0.06);
}

:global(.mud-theme-dark)[b-ip299y2j44]  .help-article-content tr:nth-child(even) td {
    background-color: rgba(255, 255, 255, 0.02);
}

/* ── Inline code ── */
:global(.mud-theme-dark)[b-ip299y2j44]  .help-article-content code {
    background-color: rgba(124, 58, 237, 0.15);
    color: #c4b5fd;
}

/* ── H2 border ── */
:global(.mud-theme-dark)[b-ip299y2j44]  .help-article-content h2 {
    border-bottom-color: rgba(255, 255, 255, 0.08);
}

/* ── Callouts ── */
:global(.mud-theme-dark)[b-ip299y2j44]  .help-callout-info {
    background-color: rgba(30, 64, 175, 0.15);
    border-color: rgba(59, 130, 246, 0.3);
    color: #93c5fd;
}

:global(.mud-theme-dark)[b-ip299y2j44]  .help-callout-tip {
    background-color: rgba(22, 101, 52, 0.15);
    border-color: rgba(34, 197, 94, 0.3);
    color: #86efac;
}

:global(.mud-theme-dark)[b-ip299y2j44]  .help-callout-warning {
    background-color: rgba(146, 64, 14, 0.15);
    border-color: rgba(245, 158, 11, 0.3);
    color: #fcd34d;
}

:global(.mud-theme-dark)[b-ip299y2j44]  .help-callout-important {
    background-color: rgba(153, 27, 27, 0.15);
    border-color: rgba(239, 68, 68, 0.3);
    color: #fca5a5;
}

/* ── Prev/Next Navigation ── */
:global(.mud-theme-dark)[b-ip299y2j44]  .help-prevnext {
    border-top-color: rgba(255, 255, 255, 0.08);
}

:global(.mud-theme-dark)[b-ip299y2j44]  .help-prevnext-card {
    border-color: rgba(255, 255, 255, 0.1);
}

:global(.mud-theme-dark)[b-ip299y2j44]  .help-prevnext-card:hover {
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
}

:global(.mud-theme-dark)[b-ip299y2j44]  .help-prevnext-label {
    color: rgba(255, 255, 255, 0.4);
}

/* ── Related Articles ── */
:global(.mud-theme-dark)[b-ip299y2j44]  .help-related-section {
    border-top-color: rgba(255, 255, 255, 0.08);
}

:global(.mud-theme-dark)[b-ip299y2j44]  .help-related-item:hover {
    background: rgba(255, 255, 255, 0.04);
}

/* ── TOC Sidebar ── */
:global(.mud-theme-dark)[b-ip299y2j44]  .help-toc-wrapper {
    border-left-color: rgba(255, 255, 255, 0.08);
}

:global(.mud-theme-dark)[b-ip299y2j44]  .help-toc-label {
    color: rgba(255, 255, 255, 0.4);
}

:global(.mud-theme-dark)[b-ip299y2j44]  .help-toc-link {
    color: rgba(255, 255, 255, 0.5);
}

:global(.mud-theme-dark)[b-ip299y2j44]  .help-toc-link:hover {
    color: rgba(255, 255, 255, 0.85);
}

/* ── Nav Sidebar ── */
:global(.mud-theme-dark)[b-ip299y2j44]  .help-sidebar-group-title {
    color: rgba(255, 255, 255, 0.8);
}

:global(.mud-theme-dark)[b-ip299y2j44]  .help-sidebar-group-title:hover {
    background: rgba(255, 255, 255, 0.05);
}

:global(.mud-theme-dark)[b-ip299y2j44]  .help-sidebar-link {
    color: rgba(255, 255, 255, 0.55);
}

:global(.mud-theme-dark)[b-ip299y2j44]  .help-sidebar-link:hover {
    color: rgba(255, 255, 255, 0.85);
    background: rgba(255, 255, 255, 0.04);
}

/* ── Breadcrumbs ── */
:global(.mud-theme-dark)[b-ip299y2j44]  .help-breadcrumbs .mud-breadcrumbs li .mud-typography {
    color: rgba(255, 255, 255, 0.45);
}

:global(.mud-theme-dark)[b-ip299y2j44]  .help-breadcrumbs .mud-breadcrumbs li a {
    color: rgba(255, 255, 255, 0.5);
}

:global(.mud-theme-dark)[b-ip299y2j44]  .help-breadcrumbs .mud-breadcrumbs li a:hover {
    color: rgba(255, 255, 255, 0.8);
}

:global(.mud-theme-dark)[b-ip299y2j44]  .help-breadcrumb-separator {
    color: rgba(255, 255, 255, 0.3);
}

/* ── Search Results ── */
:global(.mud-theme-dark)[b-ip299y2j44]  .help-search-result:hover,
:global(.mud-theme-dark)[b-ip299y2j44]  .help-search-popular-item:hover {
    background: rgba(255, 255, 255, 0.04);
}

:global(.mud-theme-dark)[b-ip299y2j44]  .help-search-result-preview {
    color: rgba(255, 255, 255, 0.5);
}

:global(.mud-theme-dark)[b-ip299y2j44]  .help-search-group-header {
    border-bottom-color: rgba(255, 255, 255, 0.08);
}

:global(.mud-theme-dark)[b-ip299y2j44]  .help-search-group-label {
    color: rgba(255, 255, 255, 0.4);
}
/* /Features/Home/Pages/Suppliers.razor.rz.scp.css */
/* ============================================================
   Supplier Pricing — Scoped Styles
   ============================================================ */

/* --- Page shell --- */
.sp-page[b-ulzq83f2rw] {
    max-width: 1400px;
    margin: 0 auto;
    padding: 1.5rem;
}

/* --- Loading --- */
.sp-loading[b-ulzq83f2rw] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 420px;
    gap: 1rem;
    color: #6B7280;
    font-size: 0.875rem;
}

.sp-spinner[b-ulzq83f2rw] {
    width: 36px;
    height: 36px;
    border: 3px solid #E5E7EB;
    border-top-color: #1E3A8A;
    border-radius: 50%;
    animation: sp-spin-b-ulzq83f2rw 0.7s linear infinite;
}

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

/* --- Header --- */
.sp-header[b-ulzq83f2rw] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 1.5rem;
    margin-bottom: 1.5rem;
    flex-wrap: wrap;
}

.sp-title[b-ulzq83f2rw] {
    font-size: 1.5rem;
    font-weight: 700;
    color: #111827;
    margin: 0;
    letter-spacing: -0.02em;
}

.sp-subtitle[b-ulzq83f2rw] {
    font-size: 0.8125rem;
    color: #6B7280;
    margin: 0.25rem 0 0;
}

/* --- Stats --- */
.sp-stats[b-ulzq83f2rw] {
    display: flex;
    gap: 0.5rem;
}

.sp-stat[b-ulzq83f2rw] {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 0.5rem 0.875rem;
    border-radius: 10px;
    background: #F3F4F6;
    border: 1.5px solid transparent;
    cursor: pointer;
    transition: all 0.2s ease;
    min-width: 68px;
}

.sp-stat:hover[b-ulzq83f2rw] { background: #E5E7EB; }

.sp-stat--selected[b-ulzq83f2rw] { border-color: #1E3A8A; }

.sp-stat-value[b-ulzq83f2rw] {
    font-size: 1.25rem;
    font-weight: 700;
    color: #1F2937;
    line-height: 1.2;
}

.sp-stat-label[b-ulzq83f2rw] {
    font-size: 0.65rem;
    color: #6B7280;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    font-weight: 600;
}

.sp-stat--active[b-ulzq83f2rw]                    { background: #ECFDF5; }
.sp-stat--active .sp-stat-value[b-ulzq83f2rw]     { color: #059669; }
.sp-stat--active:hover[b-ulzq83f2rw]              { background: #D1FAE5; }

.sp-stat--suspended[b-ulzq83f2rw]                 { background: #FEF2F2; }
.sp-stat--suspended .sp-stat-value[b-ulzq83f2rw]  { color: #DC2626; }
.sp-stat--suspended:hover[b-ulzq83f2rw]           { background: #FEE2E2; }

.sp-stat--issues[b-ulzq83f2rw]                    { background: #FFFBEB; }
.sp-stat--issues .sp-stat-value[b-ulzq83f2rw]     { color: #D97706; }
.sp-stat--issues:hover[b-ulzq83f2rw]              { background: #FEF3C7; }

/* --- Toolbar --- */
.sp-toolbar[b-ulzq83f2rw] {
    display: flex;
    gap: 1rem;
    align-items: center;
    margin-bottom: 1.5rem;
    flex-wrap: wrap;
}

/* Search */
.sp-search[b-ulzq83f2rw] {
    position: relative;
    flex: 1;
    min-width: 200px;
    max-width: 360px;
}

.sp-search > .material-icons[b-ulzq83f2rw] {
    position: absolute;
    left: 0.75rem;
    top: 50%;
    transform: translateY(-50%);
    font-size: 1.2rem;
    color: #9CA3AF;
    pointer-events: none;
}

.sp-search input[b-ulzq83f2rw] {
    width: 100%;
    padding: 0.5625rem 2.25rem 0.5625rem 2.5rem;
    border: 1.5px solid #E5E7EB;
    border-radius: 10px;
    font-size: 0.8125rem;
    font-family: inherit;
    color: #1F2937;
    background: #fff;
    outline: none;
    transition: border-color 0.2s, box-shadow 0.2s;
}

.sp-search input[b-ulzq83f2rw]::placeholder { color: #9CA3AF; }

.sp-search input:focus[b-ulzq83f2rw] {
    border-color: #1E3A8A;
    box-shadow: 0 0 0 3px rgba(30, 58, 138, 0.08);
}

.sp-search-clear[b-ulzq83f2rw] {
    position: absolute;
    right: 0.5rem;
    top: 50%;
    transform: translateY(-50%);
    background: none;
    border: none;
    padding: 0.25rem;
    cursor: pointer;
    color: #9CA3AF;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    transition: color 0.15s;
}

.sp-search-clear:hover[b-ulzq83f2rw] { color: #6B7280; }

.sp-search-clear .material-icons[b-ulzq83f2rw] {
    font-size: 1.125rem;
}

/* Filters */
.sp-filters[b-ulzq83f2rw] {
    display: flex;
    gap: 0.375rem;
}

.sp-filter[b-ulzq83f2rw] {
    padding: 0.4375rem 0.875rem;
    border: 1.5px solid #E5E7EB;
    border-radius: 8px;
    background: #fff;
    font-size: 0.8125rem;
    font-family: inherit;
    font-weight: 500;
    color: #6B7280;
    cursor: pointer;
    transition: all 0.2s ease;
    white-space: nowrap;
}

.sp-filter:hover[b-ulzq83f2rw] {
    border-color: #D1D5DB;
    color: #374151;
    background: #F9FAFB;
}

.sp-filter.active[b-ulzq83f2rw] {
    background: #1E3A8A;
    color: #fff;
    border-color: #1E3A8A;
}

.sp-filter-count[b-ulzq83f2rw] {
    font-size: 0.6875rem;
    font-weight: 600;
    opacity: 0.6;
    margin-left: 0.125rem;
}

.sp-filter.active .sp-filter-count[b-ulzq83f2rw] {
    opacity: 0.8;
}

/* --- Empty state --- */
.sp-empty[b-ulzq83f2rw] {
    text-align: center;
    padding: 4rem 2rem;
    color: #6B7280;
}

.sp-empty .material-icons[b-ulzq83f2rw] {
    font-size: 3rem;
    color: #D1D5DB;
    margin-bottom: 0.75rem;
}

.sp-empty h3[b-ulzq83f2rw] {
    font-size: 1.0625rem;
    font-weight: 600;
    color: #374151;
    margin: 0 0 0.375rem;
}

.sp-empty p[b-ulzq83f2rw] {
    margin: 0 0 1.25rem;
    font-size: 0.8125rem;
}

.sp-reset-btn[b-ulzq83f2rw] {
    padding: 0.4375rem 1.125rem;
    border: 1.5px solid #E5E7EB;
    border-radius: 8px;
    background: #fff;
    font-size: 0.8125rem;
    font-family: inherit;
    font-weight: 500;
    color: #1E3A8A;
    cursor: pointer;
    transition: all 0.2s ease;
}

.sp-reset-btn:hover[b-ulzq83f2rw] {
    background: #EFF6FF;
    border-color: #93C5FD;
}

/* --- Card grid --- */
.sp-grid[b-ulzq83f2rw] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(340px, 1fr));
    gap: 1.25rem;
}

/* --- Card --- */
@keyframes sp-card-in-b-ulzq83f2rw {
    from {
        opacity: 0;
        transform: translateY(10px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.sp-card[b-ulzq83f2rw] {
    background: #fff;
    border-radius: 12px;
    border: 1.5px solid #E5E7EB;
    overflow: hidden;
    animation: sp-card-in-b-ulzq83f2rw 0.35s ease both;
    transition: border-color 0.2s ease, box-shadow 0.25s ease;
    display: flex;
    flex-direction: column;
    position: relative;
}

.sp-card:hover[b-ulzq83f2rw] {
    border-color: #D1D5DB;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.05);
}

.sp-card--expanded[b-ulzq83f2rw] {
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.07);
    border-color: #D1D5DB;
}

/* Accent borders */
.sp-card--suspended[b-ulzq83f2rw] { border-left: 3px solid #DC2626; }
.sp-card--warning[b-ulzq83f2rw]   { border-left: 3px solid #D97706; }

/* Suspended card dimming */
.sp-card--suspended .sp-logo[b-ulzq83f2rw] {
    opacity: 0.55;
    filter: grayscale(40%);
    transition: opacity 0.2s, filter 0.2s;
}

.sp-card--suspended:hover .sp-logo[b-ulzq83f2rw] {
    opacity: 0.8;
    filter: grayscale(10%);
}

.sp-card--suspended .sp-name[b-ulzq83f2rw] {
    color: #6B7280;
}

/* --- Suspended badge --- */
.sp-badge[b-ulzq83f2rw] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
    padding: 0.375rem 0.875rem;
    font-size: 0.6875rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.sp-badge--suspended[b-ulzq83f2rw] {
    background: #FEF2F2;
    color: #DC2626;
}

.sp-badge--suspended .material-icons[b-ulzq83f2rw] {
    font-size: 0.875rem;
}

.sp-suspended-reason[b-ulzq83f2rw] {
    padding: 0.25rem 0.875rem 0.375rem;
    font-size: 0.6875rem;
    color: #991B1B;
    background: #FEF2F2;
    border-top: 1px solid #FECACA;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* --- Logo --- */
.sp-card-top[b-ulzq83f2rw] {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1.25rem 1.25rem 0.625rem;
    min-height: 72px;
}

.sp-logo[b-ulzq83f2rw] {
    max-width: 140px;
    max-height: 52px;
    object-fit: contain;
}

/* --- Card body --- */
.sp-card-body[b-ulzq83f2rw] {
    padding: 0 1.25rem 0.875rem;
    flex: 1;
}

.sp-name[b-ulzq83f2rw] {
    font-size: 0.9375rem;
    font-weight: 600;
    color: #1F2937;
    margin: 0 0 0.75rem;
    text-align: center;
    line-height: 1.3;
}

/* --- Commodity rows --- */
.sp-commodities[b-ulzq83f2rw] {
    display: flex;
    flex-direction: column;
    gap: 0.4375rem;
}

.sp-commodity[b-ulzq83f2rw] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.4375rem 0.625rem;
    border-radius: 8px;
    background: #F9FAFB;
    font-size: 0.8125rem;
}

.sp-icon--elec[b-ulzq83f2rw] { color: #2563EB; font-size: 1.125rem; }
.sp-icon--gas[b-ulzq83f2rw]  { color: #EA580C; font-size: 1.125rem; }

.sp-commodity-name[b-ulzq83f2rw] {
    font-weight: 500;
    color: #374151;
    min-width: 30px;
}

.sp-dot[b-ulzq83f2rw] {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    flex-shrink: 0;
    margin-left: auto;
}

.sp-dot--active[b-ulzq83f2rw]    { background: #059669; }
.sp-dot--progress[b-ulzq83f2rw]  { background: #2563EB; animation: sp-pulse-b-ulzq83f2rw 1.5s ease-in-out infinite; }
.sp-dot--pending[b-ulzq83f2rw]   { background: #9CA3AF; }
.sp-dot--na[b-ulzq83f2rw]        { background: #D1D5DB; }
.sp-dot--withdrawn[b-ulzq83f2rw] { background: #D97706; }

@keyframes sp-pulse-b-ulzq83f2rw {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.35; }
}

.sp-status-text[b-ulzq83f2rw] {
    font-size: 0.75rem;
    font-weight: 500;
}

.sp-text--active[b-ulzq83f2rw]    { color: #059669; }
.sp-text--progress[b-ulzq83f2rw]  { color: #2563EB; }
.sp-text--withdrawn[b-ulzq83f2rw] { color: #D97706; }
.sp-text--muted[b-ulzq83f2rw]     { color: #9CA3AF; }

.sp-count[b-ulzq83f2rw] {
    font-size: 0.6875rem;
    color: #6B7280;
    background: #E5E7EB;
    padding: 0.0625rem 0.4375rem;
    border-radius: 9999px;
    font-weight: 600;
    line-height: 1.5;
}

/* --- Alert banner (invalid files) --- */
.sp-alert[b-ulzq83f2rw] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
    margin-top: 0.625rem;
    padding: 0.375rem 0.625rem;
    border-radius: 8px;
    background: #FFFBEB;
    color: #92400E;
    font-size: 0.75rem;
    font-weight: 500;
}

.sp-alert .material-icons[b-ulzq83f2rw] {
    font-size: 1rem;
    color: #D97706;
}

/* --- Toggle button --- */
.sp-toggle[b-ulzq83f2rw] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.375rem;
    width: 100%;
    padding: 0.5625rem;
    background: none;
    border: none;
    border-top: 1px solid #F3F4F6;
    font-size: 0.8125rem;
    font-family: inherit;
    font-weight: 500;
    color: #6B7280;
    cursor: pointer;
    transition: color 0.15s, background 0.15s;
}

.sp-toggle:hover[b-ulzq83f2rw] {
    color: #1E3A8A;
    background: #F9FAFB;
}

.sp-toggle-icon[b-ulzq83f2rw] {
    font-size: 1.25rem;
    transition: transform 0.25s ease;
}

.sp-toggle-icon.open[b-ulzq83f2rw] {
    transform: rotate(180deg);
}

/* --- No files --- */
.sp-no-files[b-ulzq83f2rw] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.375rem;
    padding: 0.75rem;
    border-top: 1px solid #F3F4F6;
    color: #9CA3AF;
    font-size: 0.8125rem;
}

.sp-no-files .material-icons[b-ulzq83f2rw] { font-size: 1rem; }

/* --- File detail panel --- */
@keyframes sp-files-in-b-ulzq83f2rw {
    from {
        opacity: 0;
        transform: translateY(-4px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.sp-files[b-ulzq83f2rw] {
    border-top: 1px solid #F3F4F6;
    padding: 0.75rem;
    animation: sp-files-in-b-ulzq83f2rw 0.2s ease;
}

.sp-file-group + .sp-file-group[b-ulzq83f2rw] { margin-top: 0.75rem; }

.sp-file-group-label[b-ulzq83f2rw] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
    font-size: 0.6875rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    margin-bottom: 0.375rem;
    padding-bottom: 0.3125rem;
    border-bottom: 1px solid #F3F4F6;
}

.sp-file-group-label .material-icons[b-ulzq83f2rw] { font-size: 0.875rem; }

.sp-file-group--elec .sp-file-group-label[b-ulzq83f2rw] { color: #2563EB; }
.sp-file-group--gas  .sp-file-group-label[b-ulzq83f2rw] { color: #EA580C; }

.sp-file[b-ulzq83f2rw] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
    padding: 0.3125rem 0.25rem;
    border-radius: 6px;
    transition: background 0.12s;
}

.sp-file:hover[b-ulzq83f2rw] { background: #F9FAFB; }

.sp-file-name[b-ulzq83f2rw] {
    flex: 1;
    font-size: 0.8125rem;
    color: #374151;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    min-width: 0;
}

.sp-file-meta[b-ulzq83f2rw] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-shrink: 0;
}

.sp-file-date[b-ulzq83f2rw] {
    font-size: 0.6875rem;
    color: #9CA3AF;
    white-space: nowrap;
    cursor: help;
}

.sp-file-expiry[b-ulzq83f2rw] {
    font-size: 0.6875rem;
    color: #9CA3AF;
    white-space: nowrap;
}

/* Validity pills */
.sp-validity[b-ulzq83f2rw] {
    font-size: 0.625rem;
    font-weight: 700;
    padding: 0.125rem 0.5rem;
    border-radius: 9999px;
    white-space: nowrap;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

.sp-validity--valid[b-ulzq83f2rw] {
    background: #ECFDF5;
    color: #059669;
}

.sp-validity--invalid[b-ulzq83f2rw] {
    background: #FEF2F2;
    color: #DC2626;
}

.sp-validity--warning[b-ulzq83f2rw] {
    background: #FFFBEB;
    color: #D97706;
}

/* --- Focus & accessibility --- */
.sp-filter:focus-visible[b-ulzq83f2rw],
.sp-stat:focus-visible[b-ulzq83f2rw],
.sp-toggle:focus-visible[b-ulzq83f2rw],
.sp-reset-btn:focus-visible[b-ulzq83f2rw],
.sp-search-clear:focus-visible[b-ulzq83f2rw] {
    outline: 2px solid #1E3A8A;
    outline-offset: 2px;
}

.sp-search input:focus-visible[b-ulzq83f2rw] {
    border-color: #1E3A8A;
    box-shadow: 0 0 0 3px rgba(30, 58, 138, 0.1);
}

/* ============================================================
   Responsive
   ============================================================ */
@media (max-width: 768px) {
    .sp-page[b-ulzq83f2rw] { padding: 1rem; }

    .sp-header[b-ulzq83f2rw] { flex-direction: column; }

    .sp-stats[b-ulzq83f2rw] {
        width: 100%;
        justify-content: stretch;
    }

    .sp-stat[b-ulzq83f2rw] {
        flex: 1;
        min-width: 0;
        padding: 0.4375rem 0.5rem;
    }

    .sp-toolbar[b-ulzq83f2rw] { flex-direction: column; }

    .sp-search[b-ulzq83f2rw] {
        max-width: none;
        width: 100%;
    }

    .sp-filters[b-ulzq83f2rw] {
        width: 100%;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
    }

    .sp-filters[b-ulzq83f2rw]::-webkit-scrollbar { display: none; }

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

@media (max-width: 480px) {
    .sp-title[b-ulzq83f2rw] { font-size: 1.25rem; }
    .sp-stat-value[b-ulzq83f2rw] { font-size: 1.0625rem; }
    .sp-stat-label[b-ulzq83f2rw] { font-size: 0.6rem; }
    .sp-filter[b-ulzq83f2rw] { padding: 0.375rem 0.75rem; font-size: 0.75rem; }

    .sp-file[b-ulzq83f2rw] {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.25rem;
    }

    .sp-file-meta[b-ulzq83f2rw] {
        flex-wrap: wrap;
        gap: 0.375rem;
    }
}
/* /Features/Home/Pages/Tools/QuickElecQuote.razor.rz.scp.css */
/* ══════════════════════════════════════════════════
   Quick Electricity Quote — Scoped Styles
   Theme: Deep navy → electric blue
   ══════════════════════════════════════════════════ */

/* ── Gradient Banner ── */

.qq-banner[b-9l8ni8gojw] {
    position: relative;
    border-radius: 16px;
    padding: 28px 32px;
    background: linear-gradient(135deg, #0C1B3D 0%, #1E3A8A 45%, #2563EB 100%);
    overflow: hidden;
    color: #fff;
}

.qq-banner-pattern[b-9l8ni8gojw] {
    position: absolute;
    inset: 0;
    opacity: 0.06;
    background-image:
        radial-gradient(circle at 18% 45%, rgba(255,255,255,0.9) 1px, transparent 1px),
        radial-gradient(circle at 78% 22%, rgba(255,255,255,0.6) 1px, transparent 1px),
        radial-gradient(circle at 55% 78%, rgba(255,255,255,0.7) 1px, transparent 1px);
    background-size: 38px 38px, 56px 56px, 48px 48px;
    pointer-events: none;
}

.qq-banner-inner[b-9l8ni8gojw] {
    position: relative;
    display: flex;
    align-items: center;
    gap: 18px;
}

.qq-banner-icon[b-9l8ni8gojw] {
    width: 54px;
    height: 54px;
    border-radius: 14px;
    background: rgba(255, 255, 255, 0.15);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.12);
}

.qq-banner-title[b-9l8ni8gojw] {
    font-family: 'Plus Jakarta Sans', 'Segoe UI', sans-serif;
    font-size: 1.5rem;
    font-weight: 800;
    letter-spacing: -0.03em;
    line-height: 1.2;
}

.qq-banner-sub[b-9l8ni8gojw] {
    font-size: 0.875rem;
    font-weight: 400;
    opacity: 0.7;
    margin-top: 2px;
}

/* ── Step Flow ── */

.qq-flow[b-9l8ni8gojw] {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.qq-step-head[b-9l8ni8gojw] {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 10px;
}

.qq-step-num[b-9l8ni8gojw] {
    width: 28px;
    height: 28px;
    border-radius: 50%;
    background: linear-gradient(135deg, #1E3A8A, #2563EB);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: 'Plus Jakarta Sans', 'Segoe UI', sans-serif;
    font-size: 0.8rem;
    font-weight: 700;
    flex-shrink: 0;
    box-shadow: 0 2px 6px rgba(30, 58, 138, 0.3);
}

.qq-step-label[b-9l8ni8gojw] {
    font-family: 'Plus Jakarta Sans', 'Segoe UI', sans-serif;
    font-size: 0.9rem;
    font-weight: 600;
    color: var(--mud-palette-text-primary);
    letter-spacing: -0.01em;
}

.qq-step-body[b-9l8ni8gojw] {
    border: 1px solid var(--mud-palette-lines-default, #E5E7EB);
    border-left: 3px solid #2563EB;
    border-radius: 12px;
    padding: 20px;
    background: var(--mud-palette-surface, #fff);
    transition: box-shadow 0.2s ease;
}

.qq-step-body:hover[b-9l8ni8gojw] {
    box-shadow: 0 2px 12px rgba(37, 99, 235, 0.08);
}

.qq-step--reveal[b-9l8ni8gojw] {
    animation: qqReveal-b-9l8ni8gojw 0.4s cubic-bezier(0.16, 1, 0.3, 1) both;
}

/* ── Rate Rows ── */

.qq-rate-row[b-9l8ni8gojw] {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 12px;
}

.qq-rate-tag[b-9l8ni8gojw] {
    font-family: 'Plus Jakarta Sans', 'Segoe UI', sans-serif;
    font-size: 0.7rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    padding: 5px 10px;
    border-radius: 6px;
    background: rgba(37, 99, 235, 0.1);
    color: #1D4ED8;
    white-space: nowrap;
    min-width: 56px;
    text-align: center;
}

.qq-rate-tag--2[b-9l8ni8gojw] {
    background: rgba(99, 102, 241, 0.1);
    color: #4338CA;
}

.qq-rate-tag--3[b-9l8ni8gojw] {
    background: rgba(20, 184, 166, 0.1);
    color: #0F766E;
}

.qq-rate-fields[b-9l8ni8gojw] {
    display: flex;
    gap: 8px;
    flex: 1;
    min-width: 0;
}

[b-9l8ni8gojw] .qq-field-grow {
    flex: 1;
    min-width: 0;
}

[b-9l8ni8gojw] .qq-field-rate {
    max-width: 100px;
    flex-shrink: 0;
}

/* ── Annual Total ── */

.qq-total[b-9l8ni8gojw] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 16px;
    padding: 12px 16px;
    border-radius: 10px;
    background: linear-gradient(135deg, rgba(30, 58, 138, 0.04), rgba(37, 99, 235, 0.08));
    border: 1px solid rgba(37, 99, 235, 0.12);
}

.qq-total-label[b-9l8ni8gojw] {
    font-family: 'Plus Jakarta Sans', 'Segoe UI', sans-serif;
    font-size: 0.72rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--mud-palette-text-secondary);
}

.qq-total-value[b-9l8ni8gojw] {
    font-family: 'Plus Jakarta Sans', 'Segoe UI', sans-serif;
    font-size: 1.3rem;
    font-weight: 800;
    color: var(--mud-palette-primary);
    letter-spacing: -0.02em;
}

.qq-total-value small[b-9l8ni8gojw] {
    font-size: 0.6em;
    font-weight: 500;
    opacity: 0.55;
}

/* ── Submit Button ── */

[b-9l8ni8gojw] .qq-submit-btn {
    border-radius: 12px !important;
    font-family: 'Plus Jakarta Sans', 'Segoe UI', sans-serif !important;
    font-weight: 700 !important;
    letter-spacing: -0.01em !important;
    text-transform: none !important;
    padding-top: 14px !important;
    padding-bottom: 14px !important;
    box-shadow: 0 4px 14px rgba(30, 58, 138, 0.25) !important;
    transition: transform 0.15s ease, box-shadow 0.2s ease !important;
}

[b-9l8ni8gojw] .qq-submit-btn:hover:not([disabled]) {
    transform: translateY(-1px);
    box-shadow: 0 6px 20px rgba(30, 58, 138, 0.35) !important;
}

/* ── Loading State ── */

.qq-loading[b-9l8ni8gojw] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 450px;
    border: 2px dashed var(--mud-palette-lines-default, #D1D5DB);
    border-radius: 16px;
    padding: 40px 20px;
}

.qq-loading-visual[b-9l8ni8gojw] {
    position: relative;
    width: 80px;
    height: 80px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 24px;
}

.qq-loading-ring[b-9l8ni8gojw] {
    position: absolute;
    inset: 0;
    border-radius: 50%;
    border: 3px solid rgba(37, 99, 235, 0.12);
    border-top-color: #2563EB;
    animation: qqSpin-b-9l8ni8gojw 1s linear infinite;
}

[b-9l8ni8gojw] .qq-loading-icon {
    font-size: 2rem !important;
    color: #2563EB;
    animation: qqPulse-b-9l8ni8gojw 2s ease-in-out infinite;
}

.qq-loading-title[b-9l8ni8gojw] {
    font-family: 'Plus Jakarta Sans', 'Segoe UI', sans-serif;
    font-size: 1.1rem;
    font-weight: 700;
    color: var(--mud-palette-text-primary);
    margin-bottom: 4px;
}

.qq-loading-sub[b-9l8ni8gojw] {
    font-size: 0.85rem;
    color: var(--mud-palette-text-secondary);
}

/* ── Results ── */

.qq-results[b-9l8ni8gojw] {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.qq-results-head[b-9l8ni8gojw] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 2px;
}

.qq-results-stat[b-9l8ni8gojw] {
    display: flex;
    align-items: baseline;
    gap: 8px;
}

.qq-results-num[b-9l8ni8gojw] {
    font-family: 'Plus Jakarta Sans', 'Segoe UI', sans-serif;
    font-size: 2rem;
    font-weight: 800;
    color: var(--mud-palette-primary);
    letter-spacing: -0.04em;
    line-height: 1;
}

.qq-results-txt[b-9l8ni8gojw] {
    font-size: 0.9rem;
    color: var(--mud-palette-text-secondary);
    font-weight: 500;
}

[b-9l8ni8gojw] .qq-grid-wrap {
    border-radius: 14px !important;
    overflow: hidden;
}

[b-9l8ni8gojw] .qq-grid .mud-table-head th {
    font-family: 'Plus Jakarta Sans', 'Segoe UI', sans-serif;
    font-weight: 700;
    font-size: 0.72rem;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

[b-9l8ni8gojw] .qq-unit {
    font-size: 0.72em;
    opacity: 0.5;
    font-weight: 400;
}

/* ── Empty State ── */

.qq-empty[b-9l8ni8gojw] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 450px;
    border: 2px dashed var(--mud-palette-lines-default, #D1D5DB);
    border-radius: 16px;
    padding: 40px 24px;
    text-align: center;
}

.qq-empty-visual[b-9l8ni8gojw] {
    width: 80px;
    height: 80px;
    border-radius: 50%;
    background: linear-gradient(135deg, rgba(30, 58, 138, 0.06), rgba(37, 99, 235, 0.12));
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 20px;
    animation: qqFloat-b-9l8ni8gojw 3s ease-in-out infinite;
}

[b-9l8ni8gojw] .qq-empty-bolt {
    font-size: 2.2rem !important;
    color: #3B82F6;
    opacity: 0.55;
}

.qq-empty-title[b-9l8ni8gojw] {
    font-family: 'Plus Jakarta Sans', 'Segoe UI', sans-serif;
    font-size: 1.15rem;
    font-weight: 700;
    color: var(--mud-palette-text-primary);
    margin-bottom: 6px;
}

.qq-empty-sub[b-9l8ni8gojw] {
    font-size: 0.875rem;
    color: var(--mud-palette-text-secondary);
    max-width: 280px;
    line-height: 1.5;
    margin-bottom: 28px;
}

.qq-empty-flow[b-9l8ni8gojw] {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    justify-content: center;
}

.qq-empty-pip[b-9l8ni8gojw] {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 7px 14px;
    border-radius: 8px;
    background: var(--mud-palette-background, #F3F4F6);
    font-size: 0.8rem;
    font-weight: 500;
    color: var(--mud-palette-text-secondary);
    border: 1px solid var(--mud-palette-lines-default, #E5E7EB);
}

.qq-empty-arrow[b-9l8ni8gojw] {
    color: var(--mud-palette-text-secondary);
    opacity: 0.35;
    font-size: 0.85rem;
}

/* ── Animations ── */

@keyframes qqReveal-b-9l8ni8gojw {
    from { opacity: 0; transform: translateY(-10px); }
    to   { opacity: 1; transform: translateY(0); }
}

@keyframes qqSpin-b-9l8ni8gojw {
    to { transform: rotate(360deg); }
}

@keyframes qqPulse-b-9l8ni8gojw {
    0%, 100% { opacity: 0.5; transform: scale(1); }
    50%      { opacity: 1;   transform: scale(1.12); }
}

@keyframes qqFloat-b-9l8ni8gojw {
    0%, 100% { transform: translateY(0); }
    50%      { transform: translateY(-6px); }
}

/* ── Responsive ── */

@media (max-width: 959.98px) {
    .qq-banner[b-9l8ni8gojw] {
        padding: 22px 20px;
    }
    .qq-banner-title[b-9l8ni8gojw] {
        font-size: 1.25rem;
    }
    .qq-rate-row[b-9l8ni8gojw] {
        flex-wrap: wrap;
    }
    .qq-rate-tag[b-9l8ni8gojw] {
        width: 100%;
    }
    .qq-rate-fields[b-9l8ni8gojw] {
        width: 100%;
    }
    .qq-empty-flow[b-9l8ni8gojw] {
        flex-direction: column;
        gap: 6px;
    }
    .qq-empty-arrow[b-9l8ni8gojw] {
        transform: rotate(90deg);
    }
}
/* /Features/Home/Pages/Tools/QuickGasQuote.razor.rz.scp.css */
/* ══════════════════════════════════════════════════
   Quick Gas Quote — Scoped Styles
   Theme: Deep brown → warm amber
   ══════════════════════════════════════════════════ */

/* ── Gradient Banner ── */

.qq-banner[b-pjzzf23lx7] {
    position: relative;
    border-radius: 16px;
    padding: 28px 32px;
    background: linear-gradient(135deg, #451A03 0%, #92400E 45%, #D97706 100%);
    overflow: hidden;
    color: #fff;
}

.qq-banner-pattern[b-pjzzf23lx7] {
    position: absolute;
    inset: 0;
    opacity: 0.06;
    background-image:
        radial-gradient(circle at 22% 40%, rgba(255,255,255,0.9) 1px, transparent 1px),
        radial-gradient(circle at 75% 25%, rgba(255,255,255,0.6) 1px, transparent 1px),
        radial-gradient(circle at 50% 75%, rgba(255,255,255,0.7) 1px, transparent 1px);
    background-size: 38px 38px, 56px 56px, 48px 48px;
    pointer-events: none;
}

.qq-banner-inner[b-pjzzf23lx7] {
    position: relative;
    display: flex;
    align-items: center;
    gap: 18px;
}

.qq-banner-icon[b-pjzzf23lx7] {
    width: 54px;
    height: 54px;
    border-radius: 14px;
    background: rgba(255, 255, 255, 0.15);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.12);
}

.qq-banner-title[b-pjzzf23lx7] {
    font-family: 'Plus Jakarta Sans', 'Segoe UI', sans-serif;
    font-size: 1.5rem;
    font-weight: 800;
    letter-spacing: -0.03em;
    line-height: 1.2;
}

.qq-banner-sub[b-pjzzf23lx7] {
    font-size: 0.875rem;
    font-weight: 400;
    opacity: 0.7;
    margin-top: 2px;
}

/* ── Step Flow ── */

.qq-flow[b-pjzzf23lx7] {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.qq-step-head[b-pjzzf23lx7] {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 10px;
}

.qq-step-num[b-pjzzf23lx7] {
    width: 28px;
    height: 28px;
    border-radius: 50%;
    background: linear-gradient(135deg, #92400E, #D97706);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: 'Plus Jakarta Sans', 'Segoe UI', sans-serif;
    font-size: 0.8rem;
    font-weight: 700;
    flex-shrink: 0;
    box-shadow: 0 2px 6px rgba(146, 64, 14, 0.3);
}

.qq-step-label[b-pjzzf23lx7] {
    font-family: 'Plus Jakarta Sans', 'Segoe UI', sans-serif;
    font-size: 0.9rem;
    font-weight: 600;
    color: var(--mud-palette-text-primary);
    letter-spacing: -0.01em;
}

.qq-step-body[b-pjzzf23lx7] {
    border: 1px solid var(--mud-palette-lines-default, #E5E7EB);
    border-left: 3px solid #D97706;
    border-radius: 12px;
    padding: 20px;
    background: var(--mud-palette-surface, #fff);
    transition: box-shadow 0.2s ease;
}

.qq-step-body:hover[b-pjzzf23lx7] {
    box-shadow: 0 2px 12px rgba(217, 119, 6, 0.08);
}

/* ── EZ Status ── */

.qq-ez-status[b-pjzzf23lx7] {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-top: 12px;
}

/* ── Submit Button ── */

[b-pjzzf23lx7] .qq-submit-btn {
    border-radius: 12px !important;
    font-family: 'Plus Jakarta Sans', 'Segoe UI', sans-serif !important;
    font-weight: 700 !important;
    letter-spacing: -0.01em !important;
    text-transform: none !important;
    padding-top: 14px !important;
    padding-bottom: 14px !important;
    box-shadow: 0 4px 14px rgba(30, 58, 138, 0.25) !important;
    transition: transform 0.15s ease, box-shadow 0.2s ease !important;
}

[b-pjzzf23lx7] .qq-submit-btn:hover:not([disabled]) {
    transform: translateY(-1px);
    box-shadow: 0 6px 20px rgba(30, 58, 138, 0.35) !important;
}

/* ── Loading State ── */

.qq-loading[b-pjzzf23lx7] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 450px;
    border: 2px dashed var(--mud-palette-lines-default, #D1D5DB);
    border-radius: 16px;
    padding: 40px 20px;
}

.qq-loading-visual[b-pjzzf23lx7] {
    position: relative;
    width: 80px;
    height: 80px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 24px;
}

.qq-loading-ring[b-pjzzf23lx7] {
    position: absolute;
    inset: 0;
    border-radius: 50%;
    border: 3px solid rgba(217, 119, 6, 0.12);
    border-top-color: #D97706;
    animation: qqSpin-b-pjzzf23lx7 1s linear infinite;
}

[b-pjzzf23lx7] .qq-loading-icon {
    font-size: 2rem !important;
    color: #D97706;
    animation: qqPulse-b-pjzzf23lx7 2s ease-in-out infinite;
}

.qq-loading-title[b-pjzzf23lx7] {
    font-family: 'Plus Jakarta Sans', 'Segoe UI', sans-serif;
    font-size: 1.1rem;
    font-weight: 700;
    color: var(--mud-palette-text-primary);
    margin-bottom: 4px;
}

.qq-loading-sub[b-pjzzf23lx7] {
    font-size: 0.85rem;
    color: var(--mud-palette-text-secondary);
}

/* ── Results ── */

.qq-results[b-pjzzf23lx7] {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.qq-results-head[b-pjzzf23lx7] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 2px;
}

.qq-results-stat[b-pjzzf23lx7] {
    display: flex;
    align-items: baseline;
    gap: 8px;
}

.qq-results-num[b-pjzzf23lx7] {
    font-family: 'Plus Jakarta Sans', 'Segoe UI', sans-serif;
    font-size: 2rem;
    font-weight: 800;
    color: var(--mud-palette-primary);
    letter-spacing: -0.04em;
    line-height: 1;
}

.qq-results-txt[b-pjzzf23lx7] {
    font-size: 0.9rem;
    color: var(--mud-palette-text-secondary);
    font-weight: 500;
}

[b-pjzzf23lx7] .qq-grid-wrap {
    border-radius: 14px !important;
    overflow: hidden;
}

[b-pjzzf23lx7] .qq-grid .mud-table-head th {
    font-family: 'Plus Jakarta Sans', 'Segoe UI', sans-serif;
    font-weight: 700;
    font-size: 0.72rem;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

[b-pjzzf23lx7] .qq-unit {
    font-size: 0.72em;
    opacity: 0.5;
    font-weight: 400;
}

/* ── Empty State ── */

.qq-empty[b-pjzzf23lx7] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 450px;
    border: 2px dashed var(--mud-palette-lines-default, #D1D5DB);
    border-radius: 16px;
    padding: 40px 24px;
    text-align: center;
}

.qq-empty-visual[b-pjzzf23lx7] {
    width: 80px;
    height: 80px;
    border-radius: 50%;
    background: linear-gradient(135deg, rgba(146, 64, 14, 0.06), rgba(217, 119, 6, 0.12));
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 20px;
    animation: qqFloat-b-pjzzf23lx7 3s ease-in-out infinite;
}

[b-pjzzf23lx7] .qq-empty-flame {
    font-size: 2.2rem !important;
    color: #D97706;
    opacity: 0.55;
}

.qq-empty-title[b-pjzzf23lx7] {
    font-family: 'Plus Jakarta Sans', 'Segoe UI', sans-serif;
    font-size: 1.15rem;
    font-weight: 700;
    color: var(--mud-palette-text-primary);
    margin-bottom: 6px;
}

.qq-empty-sub[b-pjzzf23lx7] {
    font-size: 0.875rem;
    color: var(--mud-palette-text-secondary);
    max-width: 280px;
    line-height: 1.5;
    margin-bottom: 28px;
}

.qq-empty-flow[b-pjzzf23lx7] {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    justify-content: center;
}

.qq-empty-pip[b-pjzzf23lx7] {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 7px 14px;
    border-radius: 8px;
    background: var(--mud-palette-background, #F3F4F6);
    font-size: 0.8rem;
    font-weight: 500;
    color: var(--mud-palette-text-secondary);
    border: 1px solid var(--mud-palette-lines-default, #E5E7EB);
}

.qq-empty-arrow[b-pjzzf23lx7] {
    color: var(--mud-palette-text-secondary);
    opacity: 0.35;
    font-size: 0.85rem;
}

/* ── Animations ── */

@keyframes qqSpin-b-pjzzf23lx7 {
    to { transform: rotate(360deg); }
}

@keyframes qqPulse-b-pjzzf23lx7 {
    0%, 100% { opacity: 0.5; transform: scale(1); }
    50%      { opacity: 1;   transform: scale(1.12); }
}

@keyframes qqFloat-b-pjzzf23lx7 {
    0%, 100% { transform: translateY(0); }
    50%      { transform: translateY(-6px); }
}

/* ── Responsive ── */

@media (max-width: 959.98px) {
    .qq-banner[b-pjzzf23lx7] {
        padding: 22px 20px;
    }
    .qq-banner-title[b-pjzzf23lx7] {
        font-size: 1.25rem;
    }
    .qq-empty-flow[b-pjzzf23lx7] {
        flex-direction: column;
        gap: 6px;
    }
    .qq-empty-arrow[b-pjzzf23lx7] {
        transform: rotate(90deg);
    }
}
/* /Features/Info/Pages/FuelMix.razor.rz.scp.css */
.supImgSm[b-3r1ycnr7tq] {
    height: 100px;
    margin: 10px 8px;
}

.supImgLg[b-3r1ycnr7tq] {
    height: 70px;
    margin: 10px 8px;
}

.tBody[b-3r1ycnr7tq] {
    font-size: 16px;
    font-weight: bold;
    text-align: center;
    align-content: center;
}
/* /Features/Info/Pages/Marketing/MarketingResourcesEdit.razor.rz.scp.css */
.cols-4[b-98l8x1kkau] {
    columns: 4; /* use CSS column feature */
}

.col-item[b-98l8x1kkau] {
    break-inside: avoid-column; /* avoid breaks inside cards */
    border-color: #3276b1;
}

.card[b-98l8x1kkau] {
}

.card-header[b-98l8x1kkau] {
    background-color: #3276b1 !important;
}

.dropArea[b-98l8x1kkau] {
    transition-duration: 0.1s;
    border: 2px solid silver;
    padding: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: gainsboro;
    cursor: pointer;
    position: relative;
    min-height: 100px;
    border-radius: 3px;
    margin-top: 1rem;
}

    .dropArea input[type=file][b-98l8x1kkau] {
        position: absolute;
        width: 100%;
        height: 100%;
        opacity: 0;
        cursor: pointer;
    }

.fileDragged[b-98l8x1kkau] {
    transition-duration: 0.2s;
    background-color: silver;
}

.fileDropped[b-98l8x1kkau] {
    transition-duration: 0.2s;
    background-color: lightgreen;
    border-color: lightgreen;
}

.list-unstyled[b-98l8x1kkau] {
    padding-left: 0;
    list-style: none;
}
/* /Features/Opportunities/Components/Dialogs/GenerateContractDialog.razor.rz.scp.css */
/* ── Step indicator ── */
.gcn-title-bar[b-dldentsfqp] {
    display: flex;
    flex-direction: column;
    gap: 6px;
    width: 100%;
    padding-right: 32px; /* clear the dialog close button */
}

.gcn-steps[b-dldentsfqp] {
    display: flex;
    align-items: center;
}

.gcn-step[b-dldentsfqp] {
    display: flex;
    align-items: center;
    gap: 5px;
    opacity: 0.35;
    transition: opacity 0.2s ease;
}

.gcn-step--active[b-dldentsfqp] {
    opacity: 1;
}

.gcn-step--done[b-dldentsfqp] {
    opacity: 0.6;
}

.gcn-step-dot[b-dldentsfqp] {
    width: 22px;
    height: 22px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.7rem;
    font-weight: 700;
    background: var(--mud-palette-background-grey);
    color: var(--mud-palette-text-secondary);
    transition: all 0.2s ease;
}

.gcn-step--active .gcn-step-dot[b-dldentsfqp] {
    background: var(--mud-palette-primary);
    color: #fff;
}

.gcn-step--done .gcn-step-dot[b-dldentsfqp] {
    background: var(--mud-palette-success);
    color: #fff;
}

.gcn-step-label[b-dldentsfqp] {
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--mud-palette-text-secondary);
    white-space: nowrap;
}

.gcn-step--active .gcn-step-label[b-dldentsfqp] {
    color: var(--mud-palette-text-primary);
}

.gcn-step-line[b-dldentsfqp] {
    width: 20px;
    height: 2px;
    background: var(--mud-palette-divider);
    margin: 0 6px;
    transition: background 0.2s ease;
}

.gcn-step-line--done[b-dldentsfqp] {
    background: var(--mud-palette-success);
}

/* ── Summary banner ── */
.gcn-banner[b-dldentsfqp] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 12px 16px;
    border-radius: 8px;
    font-size: 0.875rem;
    font-weight: 600;
    margin-bottom: 16px;
}

.gcn-banner--success[b-dldentsfqp] {
    background: rgba(46, 125, 50, 0.08);
    color: var(--mud-palette-success);
}

.gcn-banner--warning[b-dldentsfqp] {
    background: rgba(230, 126, 34, 0.1);
    color: #e67e22;
}

.gcn-banner--error[b-dldentsfqp] {
    background: rgba(211, 47, 47, 0.08);
    color: var(--mud-palette-error);
}

/* ── Stat cards ── */
.gcn-stats[b-dldentsfqp] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 12px;
    margin-bottom: 20px;
}

.gcn-stat[b-dldentsfqp] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 12px 14px;
    border-radius: 8px;
    background: var(--mud-palette-surface);
    border: 1px solid var(--mud-palette-divider);
}

.gcn-stat-body[b-dldentsfqp] {
    display: flex;
    flex-direction: column;
}

.gcn-stat-value[b-dldentsfqp] {
    font-size: 1.25rem;
    font-weight: 700;
    line-height: 1.2;
}

.gcn-stat-label[b-dldentsfqp] {
    font-size: 0.7rem;
    color: var(--mud-palette-text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.gcn-stat--success .gcn-stat-value[b-dldentsfqp] { color: var(--mud-palette-success); }
.gcn-stat--warning .gcn-stat-value[b-dldentsfqp] { color: #e67e22; }
.gcn-stat--error   .gcn-stat-value[b-dldentsfqp] { color: var(--mud-palette-error); }

/* ── Supplier cards ── */
.gcn-supplier[b-dldentsfqp] {
    border: 1px solid var(--mud-palette-divider);
    border-radius: 8px;
    margin-bottom: 12px;
    padding-bottom: 8px;
    overflow: hidden;
    border-left: 3px solid var(--mud-palette-divider);
}

.gcn-supplier--success[b-dldentsfqp] { border-left-color: var(--mud-palette-success); }
.gcn-supplier--warning[b-dldentsfqp] { border-left-color: #e67e22; }
.gcn-supplier--error[b-dldentsfqp]   { border-left-color: var(--mud-palette-error); }

.gcn-supplier-header[b-dldentsfqp] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 16px;
    background: var(--mud-palette-background-grey);
}

.gcn-supplier-name[b-dldentsfqp] {
    font-weight: 600;
    font-size: 0.875rem;
    flex: 1;
}

.gcn-supplier-badges[b-dldentsfqp] {
    display: flex;
    gap: 6px;
    flex-wrap: wrap;
}

.gcn-badge[b-dldentsfqp] {
    display: inline-flex;
    align-items: center;
    padding: 2px 8px;
    border-radius: 12px;
    font-size: 0.7rem;
    font-weight: 600;
    white-space: nowrap;
}

.gcn-badge--success[b-dldentsfqp] {
    background: rgba(46, 125, 50, 0.1);
    color: var(--mud-palette-success);
}

.gcn-badge--warning[b-dldentsfqp] {
    background: rgba(230, 126, 34, 0.12);
    color: #e67e22;
}

.gcn-badge--error[b-dldentsfqp] {
    background: rgba(211, 47, 47, 0.1);
    color: var(--mud-palette-error);
}

/* ── Check items ── */
.gcn-check[b-dldentsfqp] {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    padding: 8px 16px 8px 12px;
    margin-left: 6px;
    font-size: 0.825rem;
    line-height: 1.4;
    border-left: 3px solid transparent;
    border-bottom: 1px solid var(--mud-palette-divider);
    color: var(--mud-palette-text-primary);
}

.gcn-check:last-child[b-dldentsfqp] {
    border-bottom: none;
}

.gcn-check--ok[b-dldentsfqp]      { border-left-color: var(--mud-palette-success); }
.gcn-check--warning[b-dldentsfqp]  { border-left-color: #e67e22; }
.gcn-check--error[b-dldentsfqp]    { border-left-color: var(--mud-palette-error); }

/* ── Blocked callout ── */
.gcn-blocked[b-dldentsfqp] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 12px 16px;
    border-radius: 8px;
    background: rgba(211, 47, 47, 0.08);
    color: var(--mud-palette-error);
    font-size: 0.875rem;
    font-weight: 600;
    margin-top: 4px;
}

/* ── Contact form (Phase 2) ── */
.gcn-form[b-dldentsfqp] {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.gcn-contact-card[b-dldentsfqp] {
    border: 1px solid var(--mud-palette-divider);
    border-radius: 8px;
    padding: 14px 16px;
    background: var(--mud-palette-surface);
}

.gcn-contact-card-title[b-dldentsfqp] {
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--mud-palette-text-secondary);
    margin-bottom: 10px;
}

.gcn-contact-row[b-dldentsfqp] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 5px 0;
    font-size: 0.85rem;
    color: var(--mud-palette-text-primary);
}

/* ── eSign results (Phase 3) ── */
.gcn-results[b-dldentsfqp] {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.gcn-results-header[b-dldentsfqp] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    padding: 24px 0 8px;
}

.gcn-result-row[b-dldentsfqp] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px 16px;
    border: 1px solid var(--mud-palette-divider);
    border-radius: 8px;
}

.gcn-result-text[b-dldentsfqp] {
    flex: 1;
    font-size: 0.875rem;
    color: var(--mud-palette-text-primary);
}

/* ── Actions ── */
.gcn-actions[b-dldentsfqp] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 4px 8px;
}

/* ── Responsive ── */
@media (max-width: 480px) {
    .gcn-stats[b-dldentsfqp] {
        grid-template-columns: 1fr;
    }

    .gcn-title-bar[b-dldentsfqp] {
        flex-direction: column;
        align-items: flex-start;
    }

    .gcn-supplier-header[b-dldentsfqp] {
        flex-wrap: wrap;
    }

    .gcn-supplier-badges[b-dldentsfqp] {
        width: 100%;
    }
}
/* /Features/Public/Pages/GovSupport/GovSupport.razor.rz.scp.css */
.header[b-ey3lu89k4e] {
    border-radius: 5px;
    width: 100%;
    height: 50px;
    margin-top: 25px;
    margin-bottom: 25px;
    text-align: center;
}

.center[b-ey3lu89k4e] {
    display: flex;
    justify-content: center;
    align-items: center;
}

.no-margin[b-ey3lu89k4e] {
    margin: 0;
}

.margin[b-ey3lu89k4e] {
    margin-top: 15px !important;
    margin-bottom: 15px !important;
}

.text-left[b-ey3lu89k4e] {
    text-align: left;
}
/* /Features/Public/Pages/RenewalQuotes/AccountRenewal.razor.rz.scp.css */
/* ========== Fidelity Energy Portal – flat, modern ========== */
.portal[b-28o880dud2] {
    --portal-bg: var(--renewal-bg);
    --portal-surface: var(--renewal-surface);
    --portal-border: var(--renewal-border);
    --portal-text: var(--renewal-text);
    --portal-text-muted: var(--renewal-text-muted);
    --portal-primary: var(--fe-primary);
    --portal-accent: var(--fe-accent);
    --portal-success: var(--renewal-success);
    --portal-elec: var(--renewal-elec);
    --portal-elec-bg: var(--renewal-elec-bg);
    --portal-gas: var(--renewal-gas);
    --portal-gas-bg: var(--renewal-gas-bg);
    --portal-radius: var(--renewal-radius);
    --portal-radius-sm: var(--renewal-radius-sm);
    --portal-muted: var(--renewal-text-muted);
    font-family: var(--renewal-font);
    width: 100%;
}

/* Header – Fidelity Energy brand (navy), sticky */
.portal-header[b-28o880dud2] {
    position: sticky;
    top: 0;
    z-index: 100;
    background: var(--fe-primary);
    color: #fff;
    padding: 1rem 1rem;
    border-bottom: none;
    box-shadow: 0 2px 12px rgba(12, 19, 93, 0.15);
}

.portal-header-inner[b-28o880dud2] {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 1rem;
}

.portal-brand[b-28o880dud2] {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.portal-logo[b-28o880dud2] {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.portal-logo-img[b-28o880dud2] {
    height: 40px;
    width: auto;
    max-width: 140px;
    object-fit: contain;
    display: block;
}

.portal-logo-icon[b-28o880dud2] {
    width: 24px;
    height: 24px;
    display: block;
}

.portal-title[b-28o880dud2] {
    margin: 0;
    font-size: 1.35rem;
    font-weight: 700;
    letter-spacing: -0.02em;
    line-height: 1.2;
}

.portal-account[b-28o880dud2] {
    margin: 0.2rem 0 0;
    font-size: 0.8125rem;
    opacity: 0.85;
    font-weight: 500;
}

/* Main content – align with header (same max-width and horizontal padding) */
.portal-help-line[b-28o880dud2] {
    margin: 0 0 1rem;
    font-size: 0.875rem;
    color: var(--renewal-text-muted);
    font-weight: 500;
    line-height: 1.4;
}

.portal-callback-link[b-28o880dud2] {
    background: none;
    border: none;
    padding: 0;
    font: inherit;
    font-weight: 700;
    color: var(--fe-accent);
    cursor: pointer;
    text-decoration: underline;
    text-underline-offset: 2px;
    transition: color 0.15s;
}

.portal-callback-link:hover[b-28o880dud2] {
    color: var(--fe-accent-dark, #d97706);
}

.portal-body[b-28o880dud2] {
    flex: 1;
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 1rem 2rem;
    width: 100%;
    box-sizing: border-box;
}

@media (min-width: 640px) {
    .portal-header-inner[b-28o880dud2] { padding: 0 1.5rem; }
    .portal-body[b-28o880dud2] { padding: 0 1.5rem 2rem; }
}

.portal-dashboard[b-28o880dud2] {
    padding: 1.5rem 0 1.25rem;
    border-bottom: 1px solid var(--portal-border);
}

/* Help tip – bright blue */
.portal-tip[b-28o880dud2] {
    display: flex;
    align-items: flex-start;
    gap: 0.5rem;
    padding: 1rem 1.25rem;
    margin-bottom: 1rem;
    border-radius: var(--portal-radius);
    background: #eff6ff;
    border: 1px solid #c7d2fe;
}

.portal-tip-icon[b-28o880dud2] {
    flex-shrink: 0;
    font-size: 1.1rem;
}

.portal-tip-text[b-28o880dud2] {
    margin: 0;
    font-size: 0.875rem;
    color: #1d4ed8;
    font-weight: 500;
    line-height: 1.5;
}

.portal-card-supplier[b-28o880dud2] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 0.5rem;
}

.portal-card-supplier-logo[b-28o880dud2] {
    width: 72px;
    max-height: 28px;
    object-fit: contain;
    object-position: left;
}

.portal-card-supplier-name[b-28o880dud2] {
    font-size: 0.8125rem;
    font-weight: 600;
    color: var(--portal-text-muted);
}

.portal-dashboard-grid[b-28o880dud2] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 1rem;
}

.portal-stat[b-28o880dud2] {
    padding: 1.25rem;
    background: #ffffff !important;
    background-image: none !important;
    border-radius: var(--portal-radius);
    border: 1px solid var(--portal-border);
    box-shadow: var(--renewal-shadow);
    transition: transform 0.2s var(--renewal-ease), box-shadow 0.2s var(--renewal-ease);
}

.portal-stat:hover[b-28o880dud2] {
    transform: translateY(-1px);
    box-shadow: var(--renewal-shadow-hover);
}

.portal-stat:nth-child(1)[b-28o880dud2] { border-left: 4px solid var(--fe-primary); }
.portal-stat:nth-child(2)[b-28o880dud2] { border-left: 4px solid var(--fe-accent); }
.portal-stat:nth-child(3)[b-28o880dud2] { border-left: 4px solid var(--portal-success); }
.portal-stat:nth-child(4)[b-28o880dud2] { border-left: 4px solid var(--fe-accent); }

.portal-stat-value[b-28o880dud2] {
    display: block;
    font-size: 1.5rem;
    font-weight: 800;
    color: var(--portal-text);
    letter-spacing: -0.02em;
    line-height: 1.2;
}

.portal-stat-label[b-28o880dud2] {
    display: block;
    margin-top: 0.35rem;
    font-size: 0.75rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--portal-text-muted);
}

.portal-stat--highlight .portal-stat-value[b-28o880dud2] {
    color: var(--portal-success);
}

/* Toolbar + filter pills (working filters) */
.portal-toolbar[b-28o880dud2] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 1rem;
    padding: 1.25rem 0;
}

.portal-search-wrap[b-28o880dud2] {
    flex: 1;
    min-width: 0;
    max-width: 360px;
}

.portal-search-input[b-28o880dud2] {
    width: 100%;
    padding: 0.65rem 1rem 0.65rem 2.5rem;
    font-size: var(--renewal-text-sm);
    font-family: var(--renewal-font);
    color: var(--portal-text);
    background: var(--portal-surface);
    border: 2px solid var(--portal-border);
    border-radius: var(--portal-radius-sm);
    transition: border-color var(--renewal-duration) var(--renewal-ease), box-shadow var(--renewal-duration) var(--renewal-ease);
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='%234a5568' stroke-width='2'%3E%3Ccircle cx='11' cy='11' r='8'/%3E%3Cpath d='m21 21-4.35-4.35'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: 0.75rem center;
    background-size: 1.15rem;
}

.portal-search-input[b-28o880dud2]::placeholder {
    color: var(--portal-text-muted);
}

.portal-search-input:hover[b-28o880dud2] {
    border-color: #a0aec0;
}

.portal-search-input:focus[b-28o880dud2] {
    outline: none;
    border-color: var(--fe-primary);
    box-shadow: 0 0 0 3px rgba(12, 19, 93, 0.12);
}

.portal-filters[b-28o880dud2] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.375rem;
}

.portal-filter-pill[b-28o880dud2] {
    padding: 0.4rem 0.875rem;
    font-size: 0.8125rem;
    font-weight: 600;
    color: var(--portal-text-muted);
    background: var(--portal-surface);
    border: 1px solid var(--portal-border);
    border-radius: 999px;
    cursor: pointer;
    transition: background 0.2s var(--renewal-ease), border-color 0.2s var(--renewal-ease), color 0.2s var(--renewal-ease), box-shadow 0.2s var(--renewal-ease);
}

.portal-filter-pill:hover[b-28o880dud2] {
    background: #f1f5f9;
    border-color: #cbd5e1;
    color: var(--portal-text);
}

.portal-filter-pill--active[b-28o880dud2] {
    background: var(--portal-primary);
    border-color: var(--portal-primary);
    color: #fff;
    box-shadow: 0 2px 8px rgba(12, 19, 93, 0.2);
}

.portal-filter-pill--active:hover[b-28o880dud2] {
    background: var(--fe-primary-light);
    border-color: var(--fe-primary-light);
    color: #fff;
}

.portal-filter-pill--quote.portal-filter-pill--active[b-28o880dud2] {
    background: var(--portal-success);
    border-color: var(--portal-success);
}

.portal-filter-pill--quote.portal-filter-pill--active:hover[b-28o880dud2] {
    background: #059669;
    border-color: #059669;
}

/* Section titles (Electricity / Gas) */
.portal-content[b-28o880dud2] {
    padding-bottom: 1rem;
}

.portal-section[b-28o880dud2] {
    margin-bottom: 2rem;
}

.portal-section:last-child[b-28o880dud2] {
    margin-bottom: 0;
}

.portal-section--priority .portal-section-title[b-28o880dud2] {
    color: #059669;
}

.portal-section--priority .portal-section-icon[b-28o880dud2] {
    color: var(--portal-success);
}

/* Out of contract – rolling rates warning */
.portal-section--outofcontract .portal-section-title[b-28o880dud2] {
    color: #b45309;
}

.portal-section--outofcontract .portal-section-icon[b-28o880dud2] {
    color: #d97706;
}

.portal-section--outofcontract .portal-section-count[b-28o880dud2] {
    background: #d97706;
}

.portal-outofcontract-note[b-28o880dud2] {
    margin-bottom: 1rem;
}

.portal-card--outofcontract[b-28o880dud2] {
    border-color: rgba(217, 119, 6, 0.4);
    background: #ffffff !important;
    background-image: none !important;
    border-left: 4px solid #d97706;
}

.portal-card--outofcontract:hover[b-28o880dud2] {
    border-color: #d97706;
}

.portal-section-title[b-28o880dud2] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin: 0 0 1rem;
    font-size: 1.125rem;
    font-weight: 700;
    color: var(--portal-text);
    letter-spacing: -0.02em;
}

.portal-section-icon[b-28o880dud2] {
    font-size: 1.25rem;
    opacity: 0.9;
}

.portal-section-count[b-28o880dud2] {
    margin-left: 0.25rem;
    padding: 0.2rem 0.6rem;
    background: var(--portal-success);
    color: #fff;
    font-size: 0.75rem;
    font-weight: 700;
    border-radius: 999px;
}

/* Meter cards grid */
.portal-cards[b-28o880dud2] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
    gap: 1rem;
}

.portal-card[b-28o880dud2] {
    border-radius: var(--portal-radius);
    border: 1px solid var(--portal-border);
    background: #ffffff !important;
    background-image: none !important;
    transition: border-color 0.2s ease, box-shadow 0.2s ease, transform 0.2s ease;
    overflow: hidden;
    box-shadow: var(--renewal-shadow);
    animation: fidelity-card-in 0.4s var(--renewal-ease) both;
    animation-delay: calc(var(--stagger, 0) * 60ms);
}

.portal-card:hover[b-28o880dud2] {
    border-color: var(--fe-primary);
    box-shadow: var(--renewal-shadow-hover);
    transform: translateY(-2px);
}

.portal-card--action[b-28o880dud2] {
    border-color: rgba(12, 19, 93, 0.25);
    background: #ffffff !important;
    background-image: none !important;
    border-left: 4px solid var(--fe-primary);
}

.portal-card--action:hover[b-28o880dud2] {
    border-color: var(--fe-primary);
}

.portal-card-inner[b-28o880dud2] {
    padding: 1.25rem;
}

.portal-card-header[b-28o880dud2] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 0.5rem;
    margin-bottom: 0.5rem;
}

.portal-card-badge[b-28o880dud2] {
    display: inline-block;
    padding: 0.25rem 0.5rem;
    font-size: 0.6875rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    border-radius: 6px;
}

.portal-card-badge--electricity[b-28o880dud2] {
    background: var(--portal-elec-bg);
    color: var(--portal-elec);
    border: 1px solid #93c5fd;
}

.portal-card-badge--gas[b-28o880dud2] {
    background: var(--portal-gas-bg);
    color: var(--portal-gas);
    border: 1px solid #fdba74;
}

.portal-card-badge--other[b-28o880dud2] {
    background: #f3e8ff;
    color: #7c3aed;
    border: 1px solid #c4b5fd;
}

/* Status chips */
.portal-status[b-28o880dud2] {
    display: inline-block;
    padding: 0.2rem 0.5rem;
    font-size: 0.6875rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    border-radius: 6px;
}

.portal-status--action[b-28o880dud2] {
    background: #d1fae5;
    color: #047857;
    border: 1px solid #6ee7b7;
}

.portal-status--urgent[b-28o880dud2] {
    background: #fef3c7;
    color: #b45309;
    border: 1px solid #fcd34d;
}

.portal-status--later[b-28o880dud2] {
    background: #e0f2fe;
    color: #0369a1;
}

.portal-status--expired[b-28o880dud2] {
    background: #f1f5f9;
    color: #64748b;
}

.portal-status--quoted[b-28o880dud2] {
    background: #dbeafe;
    color: #1d4ed8;
    border: 1px solid #93c5fd;
}

/* Alerts – Fidelity branded */
.portal-alert[b-28o880dud2] {
    padding: 1rem 1.25rem;
    border-radius: var(--portal-radius);
    font-size: var(--renewal-text-sm);
    line-height: var(--renewal-leading-normal);
}

.portal-alert p[b-28o880dud2] {
    margin: 0;
}

.portal-alert--warning[b-28o880dud2] {
    background: var(--renewal-warning-bg);
    border: 2px solid #f59e0b;
    color: #92400e;
}

.portal-contract-bar[b-28o880dud2] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 0.75rem;
    padding: 1.25rem 1.5rem;
    margin-bottom: 1rem;
    background: #ffffff !important;
    background-image: none !important;
    border: 1px solid var(--renewal-border);
    border-radius: var(--portal-radius);
    box-shadow: var(--renewal-shadow);
}
.portal-contract-bar-text[b-28o880dud2] {
    margin: 0;
    font-size: 1rem;
    font-weight: 700;
    color: var(--fe-primary);
}
.portal-btn-contract[b-28o880dud2] {
    padding: 0.6rem 1.25rem;
    font-size: 0.9375rem;
    font-weight: 700;
    font-family: inherit;
    color: #fff;
    background: var(--fe-accent) !important;
    background-image: none !important;
    border: none;
    border-radius: 8px;
    cursor: pointer;
    transition: background 0.2s, transform 0.2s;
}
.portal-btn-contract:hover[b-28o880dud2] {
    background: var(--fe-accent-dark) !important;
    color: #fff;
    transform: translateY(-1px);
}

/* (Simple 2-meter layout removed – all accounts use the same full layout) */

.portal-card-mpan[b-28o880dud2] {
    margin: 0 0 0.25rem;
    font-family: ui-monospace, 'SF Mono', monospace;
    font-size: 0.875rem;
    color: var(--portal-text-muted);
}

.portal-card-address[b-28o880dud2] {
    margin: 0 0 0.75rem;
    font-size: 0.8125rem;
    color: var(--portal-text);
    line-height: 1.4;
}

.portal-card-meta[b-28o880dud2] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 0.5rem 1rem;
    margin: 0;
    padding: 0.75rem 0;
    border-top: 1px solid var(--portal-border);
}

.portal-card-meta div[b-28o880dud2] {
    margin: 0;
}

.portal-card-meta dt[b-28o880dud2] {
    margin: 0;
    font-size: 0.625rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--portal-muted);
}

.portal-card-meta dd[b-28o880dud2] {
    margin: 0.2rem 0 0;
    font-size: 0.8125rem;
    font-weight: 600;
    color: var(--portal-text);
}

.portal-card-actions[b-28o880dud2] {
    padding-top: 0.75rem;
    border-top: 1px solid var(--portal-border);
}

/* Primary CTA – Fidelity Energy amber */
.portal-btn-quote[b-28o880dud2] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.35rem;
    padding: 0.6rem 1.25rem;
    font-size: 0.9375rem;
    font-weight: 700;
    font-family: inherit;
    color: #fff;
    background: var(--fe-accent) !important;
    background-image: none !important;
    border: none;
    border-radius: 8px;
    cursor: pointer;
    transition: background 0.2s, transform 0.2s;
}

.portal-btn-quote:hover[b-28o880dud2] {
    background: var(--fe-accent-dark) !important;
    color: #fff;
    transform: translateY(-1px);
}

.portal-btn-quote:focus[b-28o880dud2] {
    outline: none;
    box-shadow: 0 0 0 3px rgba(247, 150, 0, 0.4);
}

.portal-btn-quote-arrow[b-28o880dud2] {
    font-size: 1em;
    opacity: 0.9;
}

.portal-card-hint[b-28o880dud2] {
    margin: 0;
    font-size: 0.8125rem;
    color: var(--portal-text-muted);
    font-style: italic;
}

/* Empty state */
.portal-empty[b-28o880dud2] {
    text-align: center;
    padding: 3rem 2rem;
}

.portal-empty-icon[b-28o880dud2] {
    font-size: 2.5rem;
    display: block;
    margin-bottom: 0.75rem;
    opacity: 0.6;
}

.portal-empty-title[b-28o880dud2] {
    margin: 0 0 0.25rem;
    font-size: 1.125rem;
    font-weight: 600;
    color: var(--portal-text);
}

.portal-empty-text[b-28o880dud2] {
    margin: 0;
    font-size: 0.875rem;
    color: var(--portal-text-muted);
}

/* Footer */
.portal-footer[b-28o880dud2] {
    text-align: center;
    padding: 1.5rem 1rem 0;
    margin-top: auto;
}

.portal-footer-copy[b-28o880dud2] {
    margin: 0;
    font-size: 0.8125rem;
    color: var(--portal-text-muted);
    font-weight: 500;
}

/* Responsive */
@media (max-width: 900px) {
    .portal-dashboard-grid[b-28o880dud2] {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 640px) {
    .portal-dashboard-grid[b-28o880dud2] {
        grid-template-columns: 1fr;
    }

    .portal-toolbar[b-28o880dud2] {
        flex-direction: column;
        align-items: stretch;
    }

    .portal-search-wrap[b-28o880dud2] {
        max-width: none;
    }

    .portal-cards[b-28o880dud2] {
        grid-template-columns: 1fr;
    }

    .portal-card-meta[b-28o880dud2] {
        grid-template-columns: 1fr 1fr;
    }
}

/* ========== Legacy (single-site quote cards, etc.) ========== */
.font[b-28o880dud2] {
    font-family: 'Roboto', sans-serif;
}

.container[b-28o880dud2] {
    max-width: 1200px;
    margin: auto;
    padding: 20px;
}

.header[b-28o880dud2] {
    background-color: #f0f4f8;
    padding: 20px;
    border-top-left-radius: 20px;
    border-top-right-radius: 20px;
    color: #004080;
}

.paper[b-28o880dud2] {
    background-color: #fff;
    box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.15);
    border-bottom-left-radius: 20px;
    border-bottom-right-radius: 20px;
    padding: 20px 25px;
}

.quote-card[b-28o880dud2] {
    background-color: #f9f9f9;
    border-radius: 20px;
    border-top-left-radius: 0px;
    padding: 20px 15px;
    box-shadow: 0px 4px 8px rgba(39, 0, 0, 0.1);
    margin: 0 0 20px 0;
}

.quote-card-recommended[b-28o880dud2] {
    box-shadow: 0px 4px 8px rgba(39, 0, 0, 0.1);
    background-color: #f9f9f9;
    border-radius: 20px;
    border-top-left-radius: 0px;
    border: 2px solid #004080;
    padding: 20px 15px;
    margin: 0 0 20px 0;
}

.quote-card-supplier-note[b-28o880dud2] {
    background-color: #f9f9f9;
    border-radius: 20px;
    border-top-left-radius: 0px;
    border-bottom-left-radius: 0px;
    border-bottom-right-radius: 0px;
    padding: 20px 15px;
    box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.1);
    margin: 0;
}

.supplier-note[b-28o880dud2] {
    padding: 10px;
    border-bottom-left-radius: 20px;
    border-bottom-right-radius: 20px;
    border: 5px solid #f9f9f9;
    box-shadow: 1px 4px 8px rgba(0, 0, 0, 0.1);
    font-weight: bold;
    color: #004080;
    font-size: 0.9em;
}

.detail-wrapper[b-28o880dud2] {
    background-color: #f9f9f9;
    padding: 20px 15px;
    border-radius: 20px;
    margin-top: 10px;
}

.badge[b-28o880dud2] {
    border-radius: 99px;
    padding: 5px;
    color: #fff;
}

.badge-green[b-28o880dud2] {
    background-color: #28a745;
}

.badge-recommended[b-28o880dud2] {
    background-color: #0078d4;
}

.badge-renewal[b-28o880dud2] {
    background-color: #ff964f;
}

.badge-alternative[b-28o880dud2] {
    background-color: #957dad;
}

.start-date[b-28o880dud2] {
    padding: 10px;
    background-color: #004080;
    border-top-left-radius: 20px;
    border-top-right-radius: 20px;
    color: #fff;
    margin: 0;
}

.supplier-logo[b-28o880dud2] {
    width: 125px;
    height: auto;
}

.special-note[b-28o880dud2] {
    background-color: #eaf7ff;
    padding: 15px;
    border-radius: 8px;
    color: #005f9e;
    border-left: 4px solid #0078d4;
}

.select-contract-btn[b-28o880dud2] {
    padding: 0.6rem 1.2rem;
    color: #fff;
    background-color: #004080;
    border-radius: 99px;
    border: none;
    font-weight: bold;
    margin-top: 10px;
}

@media (max-width: 768px) {
    .quote-card[b-28o880dud2] {
        flex-direction: column;
        text-align: center;
    }
}

.callback[b-28o880dud2] {
    border-radius: 99px;
}

.copyright[b-28o880dud2] {
    color: #455054;
}

/* ========== Quoted state – cards ========== */
.portal-status--quoted-done[b-28o880dud2] {
    background: #d1fae5;
    color: #047857;
    border: 1px solid #6ee7b7;
    display: inline-block;
    padding: 0.2rem 0.5rem;
    font-size: 0.6875rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    border-radius: 6px;
}

/* Quoted card – green left border + subtle green tint */
.portal-card--quoted[b-28o880dud2] {
    border-left: 4px solid #059669 !important;
    border-color: rgba(5, 150, 105, 0.3);
    background: #f0fdf4 !important;
    background-image: none !important;
}
.portal-card--quoted:hover[b-28o880dud2] {
    border-color: #059669;
}

/* Chosen quote summary inside card */
.portal-card-chosen[b-28o880dud2] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 0.5rem;
    padding: 0.5rem 0.75rem;
    background: #ecfdf5;
    border-radius: 6px;
    border: 1px solid #a7f3d0;
}
.portal-card-chosen .portal-card-supplier-name[b-28o880dud2] {
    color: #065f46;
    font-weight: 600;
    font-size: 0.8125rem;
}

/* Signed state – green card with muted appearance */
.portal-card--signed[b-28o880dud2] {
    border-left: 4px solid #059669 !important;
    border-color: rgba(5, 150, 105, 0.3);
    background: #f0fdf4 !important;
    background-image: none !important;
    opacity: 0.85;
}
.portal-card--signed:hover[b-28o880dud2] {
    border-color: #059669;
}

.portal-status--signed[b-28o880dud2] {
    background: #059669;
    color: #fff;
    border: 1px solid #047857;
    display: inline-block;
    padding: 0.2rem 0.5rem;
    font-size: 0.6875rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    border-radius: 6px;
}

/* Outline button variant for "Change quote" */
.portal-btn-quote--outline[b-28o880dud2] {
    background: transparent !important;
    color: var(--fe-primary) !important;
    border: 2px solid var(--fe-primary) !important;
}
.portal-btn-quote--outline:hover[b-28o880dud2] {
    background: var(--fe-primary) !important;
    color: #fff !important;
}

/* /Features/Public/Pages/RenewalQuotes/EmbeddedSigningView.razor.rz.scp.css */
/* Embedded signing – modern, trust-focused design */
.embedded-signing[b-jawtpvggra] {
    display: flex;
    flex-direction: column;
    min-height: 0;
    font-family: var(--renewal-font);
}

/* ── Signing container ── */
.signing-container[b-jawtpvggra] {
    display: flex;
    flex-direction: column;
    min-height: 0;
}

.signing-header[b-jawtpvggra] {
    flex-shrink: 0;
    padding: 24px 20px 0;
}

.signing-header-content[b-jawtpvggra] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    flex-wrap: wrap;
}

.signing-title[b-jawtpvggra] {
    font-size: 1.5rem;
    font-weight: 800;
    color: var(--renewal-text, #1a1a2e);
    margin: 0;
    letter-spacing: -0.02em;
}

.signing-subtitle[b-jawtpvggra] {
    font-size: 0.9375rem;
    color: var(--renewal-text-muted, #64748b);
    margin: 4px 0 0;
    font-weight: 500;
}

.signing-trust-badge[b-jawtpvggra] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 14px;
    background: #f0fdf4;
    color: #15803d;
    border: 1px solid #bbf7d0;
    border-radius: 100px;
    font-size: 0.8125rem;
    font-weight: 600;
    white-space: nowrap;
}

.signing-trust-badge svg[b-jawtpvggra] {
    width: 14px;
    height: 14px;
    flex-shrink: 0;
}

/* ── Mini instruction steps ── */
.signing-instructions[b-jawtpvggra] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    padding: 16px 20px;
    flex-shrink: 0;
}

.signing-instruction-step[b-jawtpvggra] {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 0.8125rem;
    font-weight: 600;
    color: var(--renewal-text-muted, #64748b);
}

.signing-instruction-num[b-jawtpvggra] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    background: var(--fe-primary, #1e3a5f);
    color: #fff;
    font-size: 0.6875rem;
    font-weight: 700;
    flex-shrink: 0;
}

.signing-instruction-divider[b-jawtpvggra] {
    width: 24px;
    height: 2px;
    background: var(--renewal-border, #e2e8f0);
    border-radius: 1px;
}

/* ── iframe wrapper ── */
.signing-frame-wrap[b-jawtpvggra] {
    position: relative;
    flex: 1;
    min-height: 65vh;
    border: 2px solid var(--renewal-border, #dce3ed);
    border-radius: 12px;
    overflow: hidden;
    margin: 0 20px;
    background: #fafbfc;
    box-shadow: var(--renewal-shadow-lg, 0 4px 12px rgba(12, 19, 93, 0.08), 0 20px 48px rgba(12, 19, 93, 0.16));
}

.signing-iframe[b-jawtpvggra] {
    width: 100%;
    height: 100%;
    min-height: 65vh;
    border: none;
    display: block;
    opacity: 0;
    transition: opacity 0.3s ease;
}

.signing-iframe--visible[b-jawtpvggra] {
    opacity: 1;
}

/* ── Loading state ── */
.signing-loading[b-jawtpvggra] {
    position: absolute;
    inset: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 16px;
    z-index: 1;
    background: #fafbfc;
}

.signing-loading-spinner[b-jawtpvggra] {
    width: 48px;
    height: 48px;
}

.signing-loading-spinner svg[b-jawtpvggra] {
    width: 100%;
    height: 100%;
}

.signing-loading-text[b-jawtpvggra] {
    font-size: 1rem;
    font-weight: 700;
    color: var(--renewal-text, #1a1a2e);
    margin: 0;
}

.signing-loading-sub[b-jawtpvggra] {
    font-size: 0.8125rem;
    color: var(--renewal-text-muted, #94a3b8);
    margin: 0;
    font-weight: 500;
}

/* ── Footer with security + cancel ── */
.signing-footer[b-jawtpvggra] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 14px 20px;
    flex-shrink: 0;
    flex-wrap: wrap;
    gap: 12px;
}

.signing-footer-security[b-jawtpvggra] {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 0.8125rem;
    color: var(--renewal-text-muted, #94a3b8);
    font-weight: 500;
}

.signing-footer-security svg[b-jawtpvggra] {
    width: 14px;
    height: 14px;
    color: #22c55e;
    flex-shrink: 0;
}

.signing-cancel[b-jawtpvggra] {
    background: none;
    border: none;
    color: var(--renewal-text-muted, #94a3b8);
    font-size: 0.875rem;
    font-weight: 600;
    cursor: pointer;
    padding: 8px 16px;
    font-family: inherit;
    border-radius: 8px;
    transition: color 0.15s, background 0.15s;
}

.signing-cancel:hover[b-jawtpvggra] {
    color: var(--renewal-text, #1a1a2e);
    background: #f1f5f9;
}

/* ── Success state ── */
.signing-success[b-jawtpvggra] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: 60px 24px;
    min-height: 50vh;
    animation: signing-success-in-b-jawtpvggra 0.5s ease;
}

@keyframes signing-success-in-b-jawtpvggra {
    from { opacity: 0; transform: scale(0.95) translateY(10px); }
    to { opacity: 1; transform: scale(1) translateY(0); }
}

.signing-success-icon[b-jawtpvggra] {
    width: 72px;
    height: 72px;
    margin-bottom: 24px;
}

.signing-success-icon svg[b-jawtpvggra] {
    width: 100%;
    height: 100%;
}

.signing-success-icon circle[b-jawtpvggra] {
    animation: signing-circle-draw-b-jawtpvggra 0.6s ease forwards;
    stroke-dasharray: 157;
    stroke-dashoffset: 157;
}

.signing-success-icon path[b-jawtpvggra] {
    animation: signing-check-draw-b-jawtpvggra 0.4s 0.4s ease forwards;
    stroke-dasharray: 40;
    stroke-dashoffset: 40;
}

@keyframes signing-circle-draw-b-jawtpvggra {
    to { stroke-dashoffset: 0; }
}

@keyframes signing-check-draw-b-jawtpvggra {
    to { stroke-dashoffset: 0; }
}

.signing-success-title[b-jawtpvggra] {
    font-size: 1.5rem;
    font-weight: 800;
    color: var(--renewal-text, #1a1a2e);
    margin: 0 0 8px;
    letter-spacing: -0.02em;
}

.signing-success-text[b-jawtpvggra] {
    font-size: 0.9375rem;
    color: var(--renewal-text-muted, #64748b);
    margin: 0 0 32px;
    max-width: 420px;
    line-height: 1.6;
    font-weight: 500;
}

.signing-success-btn[b-jawtpvggra] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 14px 40px;
    font-size: 1rem;
    font-weight: 700;
    font-family: inherit;
    background: var(--fe-primary, #1e3a5f);
    color: #fff;
    border: 2px solid var(--fe-primary, #1e3a5f);
    border-radius: 12px;
    cursor: pointer;
    transition: background 0.2s, transform 0.15s, box-shadow 0.2s;
    box-shadow: 0 2px 12px rgba(30, 58, 95, 0.25);
}

.signing-success-btn:hover[b-jawtpvggra] {
    background: #163050;
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(30, 58, 95, 0.35);
}

.signing-success-btn:active[b-jawtpvggra] {
    transform: translateY(0);
    box-shadow: 0 2px 8px rgba(30, 58, 95, 0.2);
}

.signing-success-btn:focus-visible[b-jawtpvggra] {
    outline: 2px solid var(--fe-primary, #1e3a5f);
    outline-offset: 3px;
}

/* ── Responsive ── */
@media (max-width: 640px) {
    .signing-header[b-jawtpvggra] {
        padding: 16px 16px 0;
    }

    .signing-title[b-jawtpvggra] {
        font-size: 1.25rem;
    }

    .signing-instructions[b-jawtpvggra] {
        display: none;
    }

    .signing-frame-wrap[b-jawtpvggra] {
        margin: 0 12px;
        min-height: 55vh;
        border-radius: 8px;
    }

    .signing-iframe[b-jawtpvggra] {
        min-height: 55vh;
    }

    .signing-footer[b-jawtpvggra] {
        flex-direction: column;
        text-align: center;
        padding: 12px 16px;
    }

    .signing-success[b-jawtpvggra] {
        padding: 40px 20px;
        min-height: 40vh;
    }
}
/* /Features/Public/Pages/RenewalQuotes/MeterQuoteView.razor.rz.scp.css */
/* Quote page – Fidelity Energy brand (navy + amber) */
.quote-page[b-g744sntugw] {
    --quote-bg: var(--renewal-bg);
    --quote-border: var(--renewal-border);
    --quote-text: var(--renewal-text);
    --quote-muted: var(--renewal-text-muted);
    --quote-success: var(--renewal-success);
    --quote-elec: var(--renewal-elec);
    --quote-gas: var(--renewal-gas);
    --quote-radius: var(--renewal-radius);
    font-family: var(--renewal-font);
    max-width: 920px;
    margin: 0 auto;
    padding: 0 0 2rem;
    background: var(--quote-bg);
}

.quote-page-header[b-g744sntugw] {
    padding: 1.5rem 0;
    border-bottom: 2px solid var(--quote-border);
}

.quote-page-title[b-g744sntugw] {
    margin: 0 0 0.25rem;
    font-size: 1.75rem;
    font-weight: 800;
    letter-spacing: -0.02em;
    color: var(--quote-text);
}

.quote-page-meter[b-g744sntugw] {
    margin: 0 0 0.75rem;
    font-size: 0.9375rem;
    color: var(--quote-muted);
    font-weight: 500;
}

.quote-page-meta[b-g744sntugw] {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem 1.5rem;
    font-size: 0.875rem;
    color: var(--quote-text);
    font-weight: 500;
}

.quote-page-meta span[b-g744sntugw] {
    flex: 1 1 auto;
    min-width: 0;
}

.quote-page-loading[b-g744sntugw] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 50vh;
    padding: 3rem 1rem;
    color: var(--quote-muted);
    font-weight: 600;
    text-align: center;
}

.quote-page-loading p[b-g744sntugw] {
    margin: 0.5rem 0 0;
    font-size: var(--renewal-text-base);
}

.quote-page-empty[b-g744sntugw] {
    text-align: center;
    padding: 2.5rem 1.25rem;
    background: var(--renewal-warning-bg);
    border: 2px solid #f59e0b;
    border-radius: var(--quote-radius);
    color: #92400e;
}

.quote-page-empty-title[b-g744sntugw] {
    margin: 0 0 0.5rem;
    font-size: var(--renewal-text-xl);
    font-weight: 700;
    color: var(--renewal-text);
}

.quote-page-empty p[b-g744sntugw] {
    margin: 0;
    font-size: var(--renewal-text-sm);
}

.quote-page-tip[b-g744sntugw] {
    display: flex;
    align-items: flex-start;
    gap: 0.5rem;
    padding: 1rem 1.25rem;
    margin: 1rem 0;
    border-radius: var(--quote-radius);
    font-size: 0.9375rem;
    line-height: 1.5;
    font-weight: 500;
}

.quote-page-tip--info[b-g744sntugw] {
    background: #eff6ff;
    border: 1px solid #c7d2fe;
    color: #1d4ed8;
}

.quote-page-tip--same-supplier[b-g744sntugw] {
    background: #ecfdf5;
    border: 1px solid #a7f3d0;
    color: #047857;
}

.quote-page-tip p[b-g744sntugw] {
    margin: 0;
}

.quote-page-payment[b-g744sntugw] {
    margin: 1.5rem 0;
}

.quote-page-payment-label[b-g744sntugw] {
    display: block;
    font-size: var(--renewal-text-xs);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--quote-muted);
    margin-bottom: 0.5rem;
}

.quote-page-payment-toggle[b-g744sntugw] {
    display: inline-flex;
    align-items: stretch;
    border: 2px solid var(--quote-border);
    border-radius: var(--quote-radius);
    overflow: hidden;
    box-shadow: 0 1px 4px rgba(12, 19, 93, 0.06);
    background: var(--renewal-surface);
    vertical-align: top;
}

.quote-page-payment-toggle input[type="radio"][b-g744sntugw] {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

.quote-page-payment-toggle label[b-g744sntugw] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.6rem 1.25rem;
    font-size: var(--renewal-text-sm);
    font-weight: 600;
    font-family: var(--renewal-font);
    background: transparent;
    color: var(--quote-muted);
    cursor: pointer;
    transition: background var(--renewal-duration) var(--renewal-ease), color var(--renewal-duration) var(--renewal-ease);
    border: none;
    margin: 0;
}

.quote-page-payment-toggle input:checked + label[b-g744sntugw] {
    background: var(--fe-accent);
    color: #fff;
    transition: background 0.2s var(--renewal-ease), color 0.2s var(--renewal-ease);
}

.quote-page-payment-toggle input:focus-visible + label[b-g744sntugw] {
    outline: 2px solid var(--fe-primary);
    outline-offset: 2px;
}

.quote-page-section[b-g744sntugw] { margin-top: 1.75rem; }
.quote-page-section-title[b-g744sntugw] {
    margin: 0 0 0.35rem;
    font-size: 1.25rem;
    font-weight: 800;
    color: var(--quote-text);
}
.quote-page-section-sub[b-g744sntugw] {
    margin: 0 0 1.25rem;
    font-size: var(--renewal-text-sm);
    color: var(--quote-muted);
    font-weight: 500;
}

.quote-cheapest-grid[b-g744sntugw] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
    gap: 1rem;
    margin-bottom: 1.5rem;
}

.quote-cheapest-card[b-g744sntugw] {
    padding: 1.25rem;
    border: 2px solid var(--quote-border);
    border-radius: var(--quote-radius);
    background: var(--renewal-surface);
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.4rem;
    text-align: center;
    box-shadow: var(--renewal-shadow);
    transition: transform 0.25s var(--renewal-ease), box-shadow 0.25s var(--renewal-ease);
    animation: fidelity-card-in 0.4s var(--renewal-ease) both;
    animation-delay: calc(var(--stagger, 0) * 60ms);
}

.quote-cheapest-card:hover[b-g744sntugw] {
    transform: translateY(-3px);
    box-shadow: var(--renewal-shadow-hover);
}

.quote-cheapest-term[b-g744sntugw] {
    font-size: 0.75rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--quote-muted);
}

.quote-cheapest-logo[b-g744sntugw] {
    max-width: 80px;
    max-height: 28px;
    object-fit: contain;
}

.quote-cheapest-supplier[b-g744sntugw] { font-size: 0.875rem; font-weight: 700; color: var(--quote-text); }
.quote-cheapest-cost[b-g744sntugw] { font-size: 1.25rem; font-weight: 800; color: var(--quote-text); }
.quote-cheapest-cost-label[b-g744sntugw] { font-size: 0.75rem; font-weight: 600; color: var(--quote-muted); margin-left: 0.15rem; }
.quote-cheapest-save[b-g744sntugw] {
    font-size: 0.8125rem;
    font-weight: 800;
    color: var(--quote-success);
    margin-top: 0.35rem;
}

/* ========== Recommended offers – image style (navy header, white body, orange CTA) ========== */
.quote-rec-grid[b-g744sntugw] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: 1.25rem;
}

.quote-rec[b-g744sntugw] {
    background: #fff;
    border-radius: var(--renewal-radius);
    overflow: hidden;
    box-shadow: var(--renewal-shadow);
    border: 1px solid var(--quote-border);
    transition: box-shadow 0.25s var(--renewal-ease), transform 0.25s var(--renewal-ease);
    animation: fidelity-card-in 0.4s var(--renewal-ease) both;
    animation-delay: calc(var(--stagger, 0) * 60ms);
}

.quote-rec:hover[b-g744sntugw] {
    box-shadow: var(--renewal-shadow-hover);
    transform: translateY(-3px);
}

.quote-rec-header[b-g744sntugw] {
    background: var(--fe-primary);
    color: #fff;
    text-align: center;
    padding: 0.65rem 0.75rem;
    font-size: 0.8125rem;
    font-weight: 700;
}

.quote-rec-body[b-g744sntugw] {
    padding: 1rem 1.25rem;
}

.quote-rec-hero[b-g744sntugw] {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
    margin-bottom: 1rem;
    padding-bottom: 1rem;
    border-bottom: 1px solid var(--quote-border);
}

.quote-rec-logo[b-g744sntugw] {
    flex-shrink: 0;
    max-width: 80px;
    max-height: 32px;
    object-fit: contain;
}

.quote-rec-cost-wrap[b-g744sntugw] {
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
}

.quote-rec-annual[b-g744sntugw] {
    font-size: 1.75rem;
    font-weight: 800;
    color: var(--fe-primary);
    line-height: 1.1;
}

.quote-rec-monthly[b-g744sntugw] {
    font-size: 0.9375rem;
    font-weight: 600;
    color: var(--quote-text);
}

.quote-rec-est[b-g744sntugw] {
    font-size: 0.7rem;
    color: var(--quote-muted);
    font-weight: 500;
}

.quote-rec-rates[b-g744sntugw] {
    display: grid;
    gap: 0.35rem 1rem;
    margin: 0 0 1rem;
    font-size: 0.8125rem;
}

.quote-rec-rates div[b-g744sntugw] {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    gap: 0.5rem;
}

.quote-rec-rates dt[b-g744sntugw] {
    margin: 0;
    font-weight: 500;
    color: var(--quote-muted);
}

.quote-rec-rates dd[b-g744sntugw] {
    margin: 0;
    font-weight: 700;
    color: var(--quote-text);
}

.quote-rec-btn[b-g744sntugw] {
    display: block;
    width: 100%;
    padding: 0.65rem 1rem;
    font-size: 0.9375rem;
    font-weight: 700;
    font-family: var(--renewal-font);
    color: #fff;
    background: linear-gradient(180deg, var(--fe-accent), var(--fe-accent-dark));
    border: none;
    border-radius: 8px;
    cursor: pointer;
    transition: transform 0.2s var(--renewal-ease), box-shadow 0.2s var(--renewal-ease), filter 0.2s var(--renewal-ease);
    box-shadow: 0 2px 8px rgba(247, 150, 0, 0.3);
}

.quote-rec-btn:hover[b-g744sntugw] {
    filter: brightness(1.05);
    transform: translateY(-2px);
    box-shadow: 0 4px 14px rgba(247, 150, 0, 0.4);
}

.quote-rec-btn:active[b-g744sntugw] {
    transform: translateY(0);
    box-shadow: 0 1px 4px rgba(247, 150, 0, 0.2);
}

.quote-rec-btn:focus-visible[b-g744sntugw] {
    outline: 2px solid var(--fe-primary);
    outline-offset: 2px;
}

.quote-rec-note[b-g744sntugw] {
    padding: 0.5rem 1rem;
    font-size: 0.75rem;
    background: var(--renewal-bg);
    border-top: 1px solid var(--quote-border);
    color: var(--quote-muted);
}

/* ========== See all – simple table for easy scanning ========== */
.quote-all-table-wrap[b-g744sntugw] {
    overflow-x: auto;
    border: 1px solid var(--quote-border);
    border-radius: 10px;
    background: #fff;
    box-shadow: 0 2px 12px rgba(12, 19, 93, 0.06);
}

.quote-all-table[b-g744sntugw] {
    width: 100%;
    border-collapse: collapse;
    font-size: 1rem;
}

.quote-all-table th[b-g744sntugw] {
    text-align: left;
    padding: 0.85rem 1rem;
    font-weight: 700;
    font-size: 0.9375rem;
    color: var(--fe-primary);
    background: #f1f5f9;
    border-bottom: 2px solid var(--quote-border);
}

.quote-all-table td[b-g744sntugw] {
    padding: 0.85rem 1rem;
    border-bottom: 1px solid var(--quote-border);
    vertical-align: middle;
    font-size: 0.9375rem;
}

.quote-all-table .quote-all-saving[b-g744sntugw] {
    font-weight: 700;
    color: var(--renewal-success);
}

.quote-all-table tbody tr[b-g744sntugw] {
    transition: background 0.15s var(--renewal-ease);
}

.quote-all-table tbody tr:hover[b-g744sntugw] {
    background: #f8fafc;
}

.quote-all-table tbody tr:last-child td[b-g744sntugw] {
    border-bottom: none;
}

.quote-all-supplier[b-g744sntugw] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.quote-all-logo[b-g744sntugw] {
    max-width: 80px;
    max-height: 28px;
    object-fit: contain;
}

.quote-all-btn[b-g744sntugw] {
    padding: 0.5rem 1rem;
    font-size: 0.9375rem;
    font-weight: 700;
    font-family: var(--renewal-font);
    color: #fff;
    background: var(--fe-accent);
    border: none;
    border-radius: 6px;
    cursor: pointer;
    transition: background 0.2s ease;
}

.quote-all-btn:hover[b-g744sntugw] {
    background: var(--fe-accent-dark);
}

.quote-all-btn:focus-visible[b-g744sntugw] {
    outline: 2px solid var(--fe-primary);
    outline-offset: 2px;
}

@media (max-width: 640px) {
    .quote-rec-grid[b-g744sntugw] {
        grid-template-columns: 1fr;
    }
    .quote-all-table-wrap[b-g744sntugw] {
        font-size: 0.8125rem;
    }
    .quote-all-table th[b-g744sntugw],
    .quote-all-table td[b-g744sntugw] {
        padding: 0.5rem 0.5rem;
    }
}

/* Legacy quote-card (kept for any refs) */
.quote-card[b-g744sntugw] {
    border: 2px solid var(--quote-border);
    border-radius: 14px;
    background: var(--renewal-surface);
    overflow: hidden;
    box-shadow: var(--renewal-shadow);
    transition: box-shadow 0.2s ease, border-color 0.2s ease, transform 0.2s ease;
}

.quote-card:hover[b-g744sntugw] {
    box-shadow: var(--renewal-shadow-hover);
    border-color: var(--fe-primary);
    transform: translateY(-2px);
}

.quote-card--recommended[b-g744sntugw] {
    border-color: rgba(12, 19, 93, 0.4);
    background: var(--renewal-surface);
    border-left: 4px solid var(--fe-primary);
}

.quote-card-top[b-g744sntugw] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.5rem;
    padding: 0.6rem 1rem;
    border-bottom: 1px solid var(--quote-border);
}

.quote-card-supplier[b-g744sntugw] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    min-width: 0;
}

.quote-card-logo[b-g744sntugw] {
    flex-shrink: 0;
    max-width: 72px;
    max-height: 26px;
    object-fit: contain;
}

.quote-card-supplier-info[b-g744sntugw] {
    min-width: 0;
}

.quote-card-supplier-name[b-g744sntugw] {
    display: block;
    font-size: var(--renewal-text-sm);
    font-weight: 700;
    color: var(--quote-text);
}

.quote-card-meta[b-g744sntugw] {
    display: block;
    font-size: 0.7rem;
    color: var(--quote-muted);
    margin-top: 0.1rem;
    font-weight: 500;
}

.quote-card-badges[b-g744sntugw] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.25rem;
    flex-shrink: 0;
}

.quote-card-badge[b-g744sntugw] {
    font-size: 0.625rem;
    font-weight: 800;
    text-transform: uppercase;
    padding: 0.15rem 0.4rem;
    border-radius: 4px;
    color: #fff;
}

.quote-card-badge--recommended[b-g744sntugw] {
    background: var(--fe-accent);
}

.quote-card-badge--green[b-g744sntugw] {
    background: var(--renewal-success);
}

.quote-card-rates-block[b-g744sntugw] {
    padding: 0.5rem 1rem;
    background: #f8fafc;
    border-bottom: 1px solid var(--quote-border);
}

.quote-card-rates-heading[b-g744sntugw] {
    margin: 0 0 0.25rem;
    font-size: 0.65rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--quote-muted);
}

.quote-card-rates-table[b-g744sntugw] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.8125rem;
}

.quote-card-rates-table th[b-g744sntugw] {
    text-align: left;
    font-weight: 600;
    color: var(--quote-muted);
    padding: 0.15rem 0.5rem 0.15rem 0;
    white-space: nowrap;
}

.quote-card-rates-table td[b-g744sntugw] {
    text-align: right;
    font-weight: 600;
    color: var(--quote-text);
    padding: 0.15rem 0;
}

.quote-card-unit[b-g744sntugw] {
    font-weight: 500;
    font-size: 0.7rem;
    color: var(--quote-muted);
    margin-left: 0.15rem;
}

.quote-card-bottom[b-g744sntugw] {
    padding: 0.6rem 1rem;
}

.quote-card-cost-row[b-g744sntugw] {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 0.5rem;
    margin-bottom: 0.25rem;
}

.quote-card-cost-label[b-g744sntugw] {
    font-size: 0.7rem;
    font-weight: 700;
    color: var(--quote-muted);
}

.quote-card-cost-value[b-g744sntugw] {
    font-size: 1.15rem;
    font-weight: 800;
    color: var(--quote-text);
}

.quote-card-save-row[b-g744sntugw] {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 0.5rem;
    margin-bottom: 0.5rem;
    padding: 0.35rem 0.6rem;
    background: var(--renewal-success-bg);
    border: 1px solid #5eead4;
    border-radius: 6px;
}

.quote-card-save-label[b-g744sntugw] {
    font-size: 0.7rem;
    font-weight: 700;
    color: #047857;
}

.quote-card-save-value[b-g744sntugw] {
    font-size: 0.9375rem;
    font-weight: 800;
    color: var(--quote-success);
}

.quote-card-bottom .quote-btn-select[b-g744sntugw] {
    width: 100%;
    margin-top: 0.15rem;
    padding: 0.5rem 1rem;
    font-size: 0.875rem;
}

.quote-btn-select[b-g744sntugw] {
    display: inline-block;
    padding: 0.6rem 1.25rem;
    font-size: 0.9375rem;
    font-weight: 700;
    font-family: inherit;
    color: #fff;
    background: linear-gradient(180deg, var(--fe-accent), var(--fe-accent-dark));
    border: none;
    border-radius: 10px;
    cursor: pointer;
    transition: transform 0.2s var(--renewal-ease), box-shadow 0.2s var(--renewal-ease), filter 0.2s var(--renewal-ease);
    box-shadow: 0 2px 8px rgba(247, 150, 0, 0.3);
}

.quote-card-recommended-note[b-g744sntugw] {
    padding: 0.5rem 1rem;
    font-size: 0.8125rem;
    background: #ecfdf5;
    border-top: 1px solid #a7f3d0;
    color: #065f46;
    font-weight: 500;
}

.quote-card-supplier-note[b-g744sntugw] {
    padding: 0.5rem 1rem;
    font-size: 0.8125rem;
    background: var(--renewal-bg);
    border-top: 1px solid var(--quote-border);
    color: var(--quote-muted);
}

.quote-page-see-all[b-g744sntugw] { margin-top: 1.75rem; text-align: center; }

.quote-page-all-header[b-g744sntugw] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 0.75rem;
    margin-bottom: 1rem;
}

.quote-page-filters[b-g744sntugw] {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    gap: 1rem;
    margin-bottom: 1rem;
    padding: 1.25rem;
    background: var(--renewal-surface);
    border-radius: var(--quote-radius);
    border: 1px solid var(--quote-border);
}

.quote-filter-group[b-g744sntugw] {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
}

.quote-filter-label[b-g744sntugw] {
    font-size: var(--renewal-text-xs);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--quote-muted);
}

.quote-filter-select[b-g744sntugw] {
    padding: 0.5rem 2rem 0.5rem 0.75rem;
    font-size: var(--renewal-text-sm);
    font-family: var(--renewal-font);
    font-weight: 600;
    color: var(--quote-text);
    background: var(--renewal-surface);
    border: 2px solid var(--quote-border);
    border-radius: 8px;
    cursor: pointer;
    min-width: 120px;
}

.quote-filter-select:focus[b-g744sntugw] {
    outline: none;
    border-color: var(--fe-primary);
    box-shadow: 0 0 0 3px rgba(12, 19, 93, 0.2);
}

.quote-filter-check[b-g744sntugw] {
    flex-direction: row;
    align-items: center;
}

.quote-filter-check input[type="checkbox"][b-g744sntugw] {
    width: 1.125rem;
    height: 1.125rem;
    accent-color: var(--fe-primary);
    cursor: pointer;
}

.quote-page-no-results[b-g744sntugw] {
    text-align: center;
    padding: 2rem 1rem;
    font-size: var(--renewal-text-base);
    font-weight: 600;
    color: var(--quote-muted);
    margin: 0;
}

.quote-btn-see-all[b-g744sntugw],
.quote-btn-back-all[b-g744sntugw] {
    padding: 0.6rem 1.25rem;
    font-size: var(--renewal-text-sm);
    font-weight: 700;
    font-family: var(--renewal-font);
    background: var(--renewal-surface);
    color: var(--fe-primary);
    border: 2px solid var(--fe-primary);
    border-radius: 10px;
    cursor: pointer;
    transition: background var(--renewal-duration) var(--renewal-ease), color var(--renewal-duration) var(--renewal-ease), transform 0.2s;
}

.quote-btn-see-all:hover[b-g744sntugw],
.quote-btn-back-all:hover[b-g744sntugw] {
    background: var(--fe-primary);
    color: #fff;
    transform: translateY(-1px);
}

.quote-btn-callback[b-g744sntugw] {
    padding: 0.75rem 1.5rem;
    font-size: var(--renewal-text-base);
    font-weight: 700;
    font-family: var(--renewal-font);
    background: transparent;
    color: var(--fe-accent);
    border: 2px solid var(--fe-accent);
    border-radius: 10px;
    cursor: pointer;
    transition: background var(--renewal-duration) var(--renewal-ease), color var(--renewal-duration) var(--renewal-ease), transform 0.2s;
}

.quote-btn-callback:hover[b-g744sntugw] {
    background: var(--fe-accent);
    color: #fff;
    transform: translateY(-1px);
}

.quote-btn-select:hover[b-g744sntugw] {
    filter: brightness(1.05);
    transform: translateY(-2px);
    box-shadow: 0 4px 14px rgba(247, 150, 0, 0.4);
}

.quote-btn-select:active[b-g744sntugw] {
    transform: translateY(0);
    box-shadow: 0 1px 4px rgba(247, 150, 0, 0.2);
}

.quote-btn-select:focus-visible[b-g744sntugw],
.quote-btn-see-all:focus-visible[b-g744sntugw],
.quote-btn-back-all:focus-visible[b-g744sntugw],
.quote-btn-callback:focus-visible[b-g744sntugw] {
    outline: 2px solid var(--fe-primary);
    outline-offset: 2px;
}

.quote-page-offers[b-g744sntugw] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    margin-top: 1rem;
}

.quote-page-callback[b-g744sntugw] {
    text-align: center;
    margin-top: 1.75rem;
    padding-top: 1.25rem;
    border-top: 2px solid var(--quote-border);
}

.quote-page-footer[b-g744sntugw] {
    text-align: center;
    margin-top: 2rem;
    padding-top: 1.25rem;
    font-size: 0.875rem;
    color: var(--quote-muted);
    font-weight: 500;
}

@media (max-width: 640px) {
    .quote-page[b-g744sntugw] {
        padding-bottom: 1.5rem;
    }
    .quote-page-title[b-g744sntugw] {
        font-size: var(--renewal-text-xl);
    }
    .quote-page-payment-toggle label[b-g744sntugw] {
        padding: 0.75rem 1.25rem;
        min-height: 44px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
    }
    .quote-page-filters[b-g744sntugw] {
        flex-direction: column;
        align-items: stretch;
    }
    .quote-filter-select[b-g744sntugw] {
        min-width: 0;
        width: 100%;
    }
    .quote-card-top[b-g744sntugw] {
        flex-direction: column;
        align-items: flex-start;
    }
    .quote-card-supplier[b-g744sntugw] {
        width: 100%;
    }
    .quote-card-rates-table th[b-g744sntugw],
    .quote-card-rates-table td[b-g744sntugw] {
        padding: 0.2rem 0;
    }
    .quote-btn-select[b-g744sntugw],
    .quote-btn-see-all[b-g744sntugw],
    .quote-btn-back-all[b-g744sntugw],
    .quote-btn-callback[b-g744sntugw] {
        min-height: 44px;
        width: 100%;
    }
}
/* /Features/Public/Pages/RenewalQuotes/QuoteHandler.razor.rz.scp.css */
/* QuoteHandler – scoped overrides; main styles in renewal.css */
.renewal-quote-view[b-g6b929mkug] {
    animation: fidelity-fade-in 0.35s var(--renewal-ease);
}

.renewal-banner-logo-icon[b-g6b929mkug] {
    width: 28px;
    height: 28px;
    display: block;
}

.renewal-back-btn:focus-visible[b-g6b929mkug] {
    outline: 2px solid var(--fe-accent);
    outline-offset: 2px;
}

/* ── All-complete success view ── */
.renewal-complete[b-g6b929mkug] {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    padding: 40px 24px 60px;
    max-width: 600px;
    margin: 0 auto;
    animation: renewal-complete-in-b-g6b929mkug 0.5s ease;
}

@keyframes renewal-complete-in-b-g6b929mkug {
    from { opacity: 0; transform: translateY(12px); }
    to { opacity: 1; transform: translateY(0); }
}

.renewal-complete-icon[b-g6b929mkug] {
    width: 80px;
    height: 80px;
    margin-bottom: 24px;
}

.renewal-complete-icon svg[b-g6b929mkug] {
    width: 100%;
    height: 100%;
}

.renewal-complete-title[b-g6b929mkug] {
    font-size: 2rem;
    font-weight: 800;
    color: var(--renewal-text, #1a1a2e);
    margin: 0 0 12px;
    letter-spacing: -0.03em;
}

.renewal-complete-text[b-g6b929mkug] {
    font-size: 1.0625rem;
    color: var(--renewal-text-muted, #64748b);
    margin: 0 0 32px;
    line-height: 1.5;
    font-weight: 500;
}

.renewal-complete-summary[b-g6b929mkug] {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin-bottom: 32px;
}

.renewal-complete-meter[b-g6b929mkug] {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding: 16px;
    background: #f0fdf4;
    border: 1px solid #bbf7d0;
    border-radius: 12px;
    text-align: left;
    animation: fidelity-card-in 0.4s var(--renewal-ease) both;
    animation-delay: calc(var(--stagger, 0) * 60ms);
}

.renewal-complete-meter-icon[b-g6b929mkug] {
    flex-shrink: 0;
    width: 20px;
    height: 20px;
    margin-top: 2px;
}

.renewal-complete-meter-icon svg[b-g6b929mkug] {
    width: 100%;
    height: 100%;
}

.renewal-complete-meter strong[b-g6b929mkug] {
    color: var(--renewal-text, #1a1a2e);
}

.renewal-complete-meter-detail[b-g6b929mkug] {
    display: block;
    font-size: 0.8125rem;
    color: var(--renewal-text-muted, #64748b);
    margin-top: 2px;
    font-weight: 500;
}

.renewal-complete-next[b-g6b929mkug] {
    width: 100%;
    text-align: left;
    padding: 20px;
    background: var(--renewal-surface, #fff);
    border: 2px solid var(--renewal-border, #dce3ed);
    border-radius: 14px;
    margin-bottom: 24px;
    box-shadow: var(--renewal-shadow);
}

.renewal-complete-next h3[b-g6b929mkug] {
    font-size: 1rem;
    font-weight: 800;
    color: var(--renewal-text, #1a1a2e);
    margin: 0 0 12px;
}

.renewal-complete-next ul[b-g6b929mkug] {
    margin: 0;
    padding-left: 1.25rem;
    font-size: 0.9375rem;
    color: var(--renewal-text-muted, #64748b);
    line-height: 1.7;
    font-weight: 500;
}

.renewal-complete-next ul li[b-g6b929mkug] {
    margin-bottom: 4px;
}

.renewal-complete-contact[b-g6b929mkug] {
    font-size: 0.875rem;
    color: var(--renewal-text-muted, #94a3b8);
    margin: 0;
    font-weight: 500;
}

/* ── No-meters empty state ── */
.renewal-empty-state[b-g6b929mkug] {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    padding: 60px 24px;
    max-width: 500px;
    margin: 0 auto;
    animation: renewal-complete-in-b-g6b929mkug 0.5s ease;
}

.renewal-empty-state-icon[b-g6b929mkug] {
    width: 80px;
    height: 80px;
    margin-bottom: 24px;
    opacity: 0.5;
}

.renewal-empty-state-icon svg[b-g6b929mkug] {
    width: 100%;
    height: 100%;
}

.renewal-empty-state-title[b-g6b929mkug] {
    font-size: 1.5rem;
    font-weight: 800;
    color: var(--renewal-text, #1a1a2e);
    margin: 0 0 12px;
    letter-spacing: -0.02em;
}

.renewal-empty-state-text[b-g6b929mkug] {
    font-size: 1rem;
    color: var(--renewal-text-muted, #64748b);
    margin: 0 0 1.5rem;
    line-height: 1.6;
    font-weight: 500;
}

.renewal-empty-callback-btn[b-g6b929mkug] {
    padding: 0.75rem 1.5rem;
    font-size: 0.9375rem;
    font-weight: 700;
    font-family: var(--renewal-font);
    background: transparent;
    color: var(--fe-accent, #f79600);
    border: 2px solid var(--fe-accent, #f79600);
    border-radius: 10px;
    cursor: pointer;
    transition: background 0.2s, color 0.2s, transform 0.2s;
}

.renewal-empty-callback-btn:hover:not(:disabled)[b-g6b929mkug] {
    background: var(--fe-accent, #f79600);
    color: #fff;
    transform: translateY(-1px);
}

.renewal-empty-callback-btn:disabled[b-g6b929mkug] {
    opacity: 0.6;
    cursor: default;
}

.renewal-empty-callback-btn:focus-visible[b-g6b929mkug] {
    outline: 2px solid var(--fe-primary, #1e3a5f);
    outline-offset: 2px;
}

@media (max-width: 640px) {
    .renewal-complete[b-g6b929mkug] {
        padding: 24px 16px 40px;
    }
    .renewal-complete-title[b-g6b929mkug] {
        font-size: 1.5rem;
    }
    .renewal-complete-icon[b-g6b929mkug] {
        width: 64px;
        height: 64px;
    }
    .renewal-empty-state[b-g6b929mkug] {
        padding: 40px 16px;
    }
    .renewal-empty-state-title[b-g6b929mkug] {
        font-size: 1.25rem;
    }
}
/* /Features/Public/Pages/RenewalQuotes/RenewalContractSummary.razor.rz.scp.css */
/* Contract Summary – modern, cutting-edge design */
.contract-summary[b-rtsmsvicr8] {
    font-family: var(--renewal-font);
    max-width: 760px;
    margin: 0 auto;
    padding: 0 0 2rem;
}

/* ── Hero header ── */
.contract-summary-hero[b-rtsmsvicr8] {
    text-align: center;
    padding: 0 0 1.5rem;
}

.contract-summary-title[b-rtsmsvicr8] {
    margin: 0 0 0.5rem;
    font-size: 1.75rem;
    font-weight: 800;
    letter-spacing: -0.03em;
    color: var(--renewal-text, #1a1a2e);
}

.contract-summary-intro[b-rtsmsvicr8] {
    margin: 0;
    font-size: 0.9375rem;
    color: var(--renewal-text-muted, #64748b);
    line-height: 1.6;
    font-weight: 500;
    max-width: 560px;
    margin: 0 auto;
}

/* ── Overview bar (multi-meter) ── */
.contract-overview[b-rtsmsvicr8] {
    margin-bottom: 1.5rem;
    padding: 1.25rem;
    background: linear-gradient(135deg, #f8f9fb 0%, var(--renewal-bg, #f5f7fa) 100%);
    border: 2px solid var(--renewal-border, #dce3ed);
    border-radius: 16px;
    box-shadow: var(--renewal-shadow);
}

.contract-overview-stats[b-rtsmsvicr8] {
    display: flex;
    justify-content: center;
    gap: 2rem;
    flex-wrap: wrap;
}

.contract-overview-stat[b-rtsmsvicr8] {
    text-align: center;
    min-width: 80px;
}

.contract-overview-stat-value[b-rtsmsvicr8] {
    display: block;
    font-size: 1.5rem;
    font-weight: 800;
    color: var(--renewal-text, #1a1a2e);
    letter-spacing: -0.02em;
}

.contract-overview-stat--saving .contract-overview-stat-value[b-rtsmsvicr8] {
    color: var(--renewal-success, #059669);
}

.contract-overview-stat-label[b-rtsmsvicr8] {
    display: block;
    font-size: 0.75rem;
    font-weight: 700;
    color: var(--renewal-text-muted, #94a3b8);
    text-transform: uppercase;
    letter-spacing: 0.04em;
    margin-top: 2px;
}

.contract-overview-progress[b-rtsmsvicr8] {
    margin-top: 1rem;
    height: 6px;
    background: var(--renewal-border, #e2e8f0);
    border-radius: 3px;
    overflow: hidden;
}

.contract-overview-progress-bar[b-rtsmsvicr8] {
    height: 100%;
    background: var(--renewal-success, #059669);
    border-radius: 3px;
    transition: width 0.4s ease;
}

/* ── Contract cards ── */
.contract-cards[b-rtsmsvicr8] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.contract-card[b-rtsmsvicr8] {
    border: 2px solid var(--renewal-border, #dce3ed);
    border-radius: 16px;
    background: var(--renewal-surface, #fff);
    overflow: hidden;
    box-shadow: var(--renewal-shadow);
    transition: box-shadow 0.25s var(--renewal-ease), transform 0.25s var(--renewal-ease), border-color 0.25s var(--renewal-ease);
    position: relative;
    animation: fidelity-card-in 0.4s var(--renewal-ease) both;
    animation-delay: calc(var(--stagger, 0) * 60ms);
}

.contract-card:hover[b-rtsmsvicr8] {
    box-shadow: var(--renewal-shadow-hover);
    transform: translateY(-2px);
}

.contract-card--complete[b-rtsmsvicr8] {
    border-color: #a7f3d0;
    background: linear-gradient(180deg, #f0fdf4 0%, #fff 30%);
}

.contract-card--complete:hover[b-rtsmsvicr8] {
    border-color: #6ee7b7;
}

/* ── Complete badge ── */
.contract-card-complete-badge[b-rtsmsvicr8] {
    position: absolute;
    top: 12px;
    right: 12px;
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 4px 12px;
    background: #dcfce7;
    color: #15803d;
    border-radius: 100px;
    font-size: 0.75rem;
    font-weight: 700;
    z-index: 1;
}

.contract-card-complete-badge svg[b-rtsmsvicr8] {
    width: 14px;
    height: 14px;
}

/* ── Card header ── */
.contract-card-header[b-rtsmsvicr8] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    padding: 1.25rem 1.25rem 0;
    gap: 12px;
}

.contract-card-fuel[b-rtsmsvicr8] {
    display: inline-block;
    padding: 2px 10px;
    border-radius: 100px;
    font-size: 0.6875rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.contract-card-fuel--electricity[b-rtsmsvicr8] {
    background: #dbeafe;
    color: #1d4ed8;
}

.contract-card-fuel--gas[b-rtsmsvicr8] {
    background: #fef3c7;
    color: #b45309;
}

.contract-card-meter[b-rtsmsvicr8] {
    margin: 6px 0 0;
    font-size: 1.0625rem;
    font-weight: 800;
    color: var(--renewal-text, #1a1a2e);
}

.contract-card-site[b-rtsmsvicr8] {
    margin: 2px 0 0;
    font-size: 0.8125rem;
    color: var(--renewal-text-muted, #94a3b8);
    font-weight: 500;
}

.contract-card-logo[b-rtsmsvicr8] {
    max-width: 100px;
    max-height: 40px;
    object-fit: contain;
    flex-shrink: 0;
}

/* ── Card body ── */
.contract-card-body[b-rtsmsvicr8] {
    padding: 1rem 1.25rem;
}

.contract-card-deal[b-rtsmsvicr8] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding-bottom: 1rem;
    border-bottom: 1px solid var(--renewal-border, #e2e8f0);
    flex-wrap: wrap;
}

.contract-card-supplier-name[b-rtsmsvicr8] {
    display: block;
    font-size: 1rem;
    font-weight: 700;
    color: var(--renewal-text, #1a1a2e);
}

.contract-card-deal-term[b-rtsmsvicr8] {
    display: block;
    font-size: 0.8125rem;
    color: var(--renewal-text-muted, #64748b);
    font-weight: 500;
    margin-top: 2px;
}

.contract-card-cost[b-rtsmsvicr8] {
    text-align: right;
    flex-shrink: 0;
}

.contract-card-cost-value[b-rtsmsvicr8] {
    display: block;
    font-size: 1.5rem;
    font-weight: 800;
    color: var(--renewal-text, #1a1a2e);
    letter-spacing: -0.02em;
    line-height: 1;
}

.contract-card-cost-label[b-rtsmsvicr8] {
    display: block;
    font-size: 0.75rem;
    color: var(--renewal-text-muted, #94a3b8);
    font-weight: 600;
    margin-top: 2px;
}

/* ── Rates grid ── */
.contract-card-rates[b-rtsmsvicr8] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
    gap: 0.5rem;
    padding: 1rem 0;
}

.contract-card-rate[b-rtsmsvicr8] {
    padding: 8px 12px;
    background: #f9fafb;
    border-radius: 10px;
    border: 1px solid var(--renewal-border, #dce3ed);
}

.contract-card-rate-label[b-rtsmsvicr8] {
    display: block;
    font-size: 0.6875rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--renewal-text-muted, #94a3b8);
}

.contract-card-rate-value[b-rtsmsvicr8] {
    display: block;
    font-size: 0.9375rem;
    font-weight: 700;
    color: var(--renewal-text, #1a1a2e);
    margin-top: 2px;
}

/* ── Bottom section ── */
.contract-card-bottom[b-rtsmsvicr8] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    flex-wrap: wrap;
}

.contract-card-saving[b-rtsmsvicr8] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 14px;
    background: #f0fdf4;
    color: #15803d;
    border-radius: 100px;
    font-size: 0.8125rem;
    font-weight: 600;
}

.contract-card-saving svg[b-rtsmsvicr8] {
    width: 14px;
    height: 14px;
    flex-shrink: 0;
}

.contract-card-start[b-rtsmsvicr8] {
    text-align: right;
}

.contract-card-start-label[b-rtsmsvicr8] {
    display: block;
    font-size: 0.6875rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--renewal-text-muted, #94a3b8);
}

.contract-card-start-value[b-rtsmsvicr8] {
    display: block;
    font-size: 0.875rem;
    font-weight: 700;
    color: var(--renewal-text, #1a1a2e);
}

/* ── Card actions ── */
.contract-card-actions[b-rtsmsvicr8] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 1rem 1.25rem;
    border-top: 2px solid var(--renewal-border, #e2e8f0);
    background: #fafbfc;
    flex-wrap: wrap;
}

.contract-card-btn-sign[b-rtsmsvicr8] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 12px 28px;
    font-size: 0.9375rem;
    font-weight: 700;
    font-family: inherit;
    background: linear-gradient(180deg, var(--fe-cta, #c62828), var(--fe-cta-dark, #b71c1c));
    color: #fff;
    border: 2px solid var(--fe-cta-dark, #a21c1c);
    border-radius: 12px;
    cursor: pointer;
    transition: transform 0.2s var(--renewal-ease), box-shadow 0.2s var(--renewal-ease), filter 0.2s var(--renewal-ease);
    box-shadow: 0 4px 12px rgba(198, 40, 40, 0.25);
}

.contract-card-btn-sign:hover[b-rtsmsvicr8] {
    filter: brightness(1.05);
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(198, 40, 40, 0.35);
}

.contract-card-btn-sign:active[b-rtsmsvicr8] {
    transform: translateY(0);
    box-shadow: 0 2px 6px rgba(198, 40, 40, 0.2);
}

.contract-card-btn-sign:focus-visible[b-rtsmsvicr8] {
    outline: 2px solid var(--fe-primary, #1e3a5f);
    outline-offset: 2px;
}

.contract-card-btn-sign svg[b-rtsmsvicr8] {
    width: 16px;
    height: 16px;
    flex-shrink: 0;
}

.contract-card-or[b-rtsmsvicr8] {
    font-size: 0.8125rem;
    font-weight: 600;
    color: var(--renewal-text-muted, #94a3b8);
}

.contract-card-btn-email[b-rtsmsvicr8] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 10px 20px;
    font-size: 0.875rem;
    font-weight: 600;
    font-family: inherit;
    background: var(--renewal-surface, #fff);
    color: var(--fe-primary, #1e3a5f);
    border: 2px solid var(--renewal-border, #e2e8f0);
    border-radius: 12px;
    cursor: pointer;
    transition: background 0.15s, border-color 0.15s, transform 0.15s;
}

.contract-card-btn-email:hover[b-rtsmsvicr8] {
    background: var(--fe-primary-bg, #eef2f7);
    border-color: var(--fe-primary, #1e3a5f);
    transform: translateY(-1px);
}

.contract-card-btn-email:focus-visible[b-rtsmsvicr8] {
    outline: 2px solid var(--fe-primary, #1e3a5f);
    outline-offset: 2px;
}

.contract-card-btn-email svg[b-rtsmsvicr8] {
    width: 14px;
    height: 14px;
    flex-shrink: 0;
}

/* ── Completed action state ── */
.contract-card-action-complete[b-rtsmsvicr8] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 0.9375rem;
    font-weight: 700;
    color: #059669;
}

.contract-card-action-complete svg[b-rtsmsvicr8] {
    width: 20px;
    height: 20px;
}

.contract-card-action-sending[b-rtsmsvicr8] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 0.9375rem;
    font-weight: 600;
    color: var(--renewal-text-muted, #64748b);
}

.renewal-spinner--sm[b-rtsmsvicr8] {
    width: 18px;
    height: 18px;
    border-width: 2px;
}

/* ── Help section ── */
.contract-help[b-rtsmsvicr8] {
    display: flex;
    gap: 16px;
    margin-top: 1.75rem;
    padding: 1.25rem;
    background: var(--renewal-surface, #fff);
    border: 2px solid var(--renewal-border, #e2e8f0);
    border-radius: 16px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04);
}

.contract-help-icon[b-rtsmsvicr8] {
    flex-shrink: 0;
    width: 24px;
    height: 24px;
    color: var(--fe-primary, #1e3a5f);
    margin-top: 2px;
}

.contract-help-icon svg[b-rtsmsvicr8] {
    width: 100%;
    height: 100%;
}

.contract-help-title[b-rtsmsvicr8] {
    margin: 0 0 0.75rem;
    font-size: 1rem;
    font-weight: 800;
    color: var(--renewal-text, #1a1a2e);
}

.contract-help-list[b-rtsmsvicr8] {
    margin: 0;
    padding-left: 1.25rem;
    font-size: 0.875rem;
    color: var(--renewal-text-muted, #64748b);
    line-height: 1.7;
    font-weight: 500;
}

.contract-help-list li[b-rtsmsvicr8] {
    margin-bottom: 0.25rem;
}

.contract-help-callback[b-rtsmsvicr8] {
    margin: 0.75rem 0 0;
    font-size: 0.875rem;
    color: var(--renewal-text-muted, #64748b);
    font-weight: 500;
}

.contract-callback-link[b-rtsmsvicr8] {
    background: none;
    border: none;
    padding: 0;
    font: inherit;
    font-weight: 700;
    color: var(--fe-accent, #f79600);
    cursor: pointer;
    text-decoration: underline;
    text-underline-offset: 2px;
    transition: color 0.15s;
}

.contract-callback-link:hover[b-rtsmsvicr8] {
    color: var(--fe-accent-dark, #d97706);
}

/* ── Footer ── */
.contract-summary-footer[b-rtsmsvicr8] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: 1.75rem;
    gap: 16px;
    flex-wrap: wrap;
}

.contract-btn-back[b-rtsmsvicr8] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 10px 20px;
    font-size: 0.9375rem;
    font-weight: 700;
    font-family: inherit;
    background: var(--renewal-surface, #fff);
    border: 2px solid var(--renewal-border, #e2e8f0);
    border-radius: 12px;
    color: var(--renewal-text, #1a1a2e);
    cursor: pointer;
    transition: background 0.15s, border-color 0.15s, transform 0.15s;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04);
}

.contract-btn-back:hover[b-rtsmsvicr8] {
    background: var(--fe-primary-bg, #eef2f7);
    border-color: var(--fe-primary, #1e3a5f);
    transform: translateY(-1px);
}

.contract-btn-back:focus-visible[b-rtsmsvicr8] {
    outline: 2px solid var(--fe-primary, #1e3a5f);
    outline-offset: 2px;
}

.contract-btn-back svg[b-rtsmsvicr8] {
    width: 16px;
    height: 16px;
}

.contract-security-note[b-rtsmsvicr8] {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 0.8125rem;
    color: var(--renewal-text-muted, #94a3b8);
    font-weight: 500;
}

.contract-security-note svg[b-rtsmsvicr8] {
    width: 14px;
    height: 14px;
    color: #22c55e;
    flex-shrink: 0;
}

/* ── Responsive ── */
@media (max-width: 640px) {
    .contract-summary[b-rtsmsvicr8] {
        padding-bottom: 1.5rem;
    }

    .contract-summary-title[b-rtsmsvicr8] {
        font-size: 1.375rem;
    }

    .contract-overview-stats[b-rtsmsvicr8] {
        gap: 1rem;
    }

    .contract-overview-stat-value[b-rtsmsvicr8] {
        font-size: 1.25rem;
    }

    .contract-card-rates[b-rtsmsvicr8] {
        grid-template-columns: 1fr 1fr;
    }

    .contract-card-actions[b-rtsmsvicr8] {
        flex-direction: column;
        align-items: stretch;
    }

    .contract-card-btn-sign[b-rtsmsvicr8],
    .contract-card-btn-email[b-rtsmsvicr8] {
        justify-content: center;
        width: 100%;
    }

    .contract-card-or[b-rtsmsvicr8] {
        text-align: center;
    }

    .contract-btn-back[b-rtsmsvicr8] {
        width: 100%;
        justify-content: center;
    }

    .contract-summary-footer[b-rtsmsvicr8] {
        flex-direction: column;
    }

    .contract-security-note[b-rtsmsvicr8] {
        justify-content: center;
        text-align: center;
    }
}
/* /Features/Public/Pages/RenewalQuotes/SelectedContractDialog.razor.rz.scp.css */
/* Review offer dialog – Fidelity Energy branding (MudDialog wrapper kept for IDialogService) */
:deep(.mud-dialog-content)[b-11xt8ihv3r] {
    padding: 1.25rem 1.5rem;
    min-width: 0;
}

/* Footer – bar with action buttons */
:deep(.mud-dialog-actions)[b-11xt8ihv3r] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    justify-content: flex-end;
    align-items: center;
    padding: 1rem 1.5rem;
    border-top: 2px solid var(--renewal-border);
    background: var(--renewal-bg);
}

.review-dialog-inner[b-11xt8ihv3r] {
    font-family: var(--renewal-font);
    max-width: 560px;
    margin: 0 auto;
}

/* Spacing between each box – one consistent gap */
.review-dialog-supplier[b-11xt8ihv3r],
.review-dialog-grid[b-11xt8ihv3r],
.review-dialog-savings[b-11xt8ihv3r],
.review-dialog-next[b-11xt8ihv3r],
.review-dialog-tip[b-11xt8ihv3r] {
    margin-bottom: 1.25rem;
}
.review-dialog-tip[b-11xt8ihv3r] {
    margin-bottom: 0;
}

/* Header: supplier logo + title + intro */
.review-dialog-supplier[b-11xt8ihv3r] {
    display: flex;
    align-items: flex-start;
    gap: 1rem;
    padding-bottom: 1.25rem;
    border-bottom: 1px solid var(--renewal-border);
}

.review-dialog-supplier-logo[b-11xt8ihv3r] {
    flex-shrink: 0;
    max-width: 80px;
    max-height: 40px;
    object-fit: contain;
}

.review-dialog-supplier-text[b-11xt8ihv3r] {
    flex: 1;
    min-width: 0;
}

.review-dialog-title[b-11xt8ihv3r] {
    margin: 0 0 0.35rem;
    font-size: var(--renewal-text-xl);
    font-weight: 800;
    color: var(--renewal-text);
    letter-spacing: -0.02em;
}

.review-dialog-intro[b-11xt8ihv3r] {
    margin: 0;
    font-size: var(--renewal-text-sm);
    line-height: 1.5;
    color: var(--renewal-text-muted);
    font-weight: 500;
}

.review-dialog-grid[b-11xt8ihv3r] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
}

.review-dialog-card[b-11xt8ihv3r] {
    padding: 1.25rem;
    background: var(--renewal-surface);
    border: 2px solid var(--renewal-border);
    border-radius: var(--renewal-radius);
    box-shadow: var(--renewal-shadow);
}

.review-dialog-card-title[b-11xt8ihv3r] {
    margin: 0 0 0.75rem;
    font-size: var(--renewal-text-base);
    font-weight: 800;
    color: var(--fe-primary);
}

.review-dialog-card p[b-11xt8ihv3r] {
    margin: 0.4rem 0;
    font-size: var(--renewal-text-sm);
    color: var(--renewal-text);
}

.review-dialog-savings[b-11xt8ihv3r] {
    background: #ecfdf5;
    border-color: #a7f3d0;
}

.review-dialog-caption[b-11xt8ihv3r] {
    margin-top: 0.75rem !important;
    font-size: var(--renewal-text-xs) !important;
    color: var(--renewal-text-muted) !important;
}

.review-dialog-next[b-11xt8ihv3r] {
    padding: 1.25rem;
    background: var(--renewal-surface);
    border: 1px solid var(--renewal-border);
    border-radius: var(--renewal-radius);
}

.review-dialog-next .review-dialog-card-title[b-11xt8ihv3r] {
    margin-bottom: 0.5rem;
}

.review-dialog-doc-checklist[b-11xt8ihv3r] {
    margin: 0 0 0.75rem;
    font-size: var(--renewal-text-sm);
    color: var(--renewal-text);
    font-weight: 500;
}

.review-dialog-list[b-11xt8ihv3r] {
    margin: 0;
    padding-left: 1.25rem;
    font-size: var(--renewal-text-sm);
    line-height: 1.6;
    color: var(--renewal-text);
}

.review-dialog-list li[b-11xt8ihv3r] {
    margin-bottom: 0.35rem;
}

.review-dialog-tip[b-11xt8ihv3r] {
    padding: 1rem 1.25rem;
    font-size: var(--renewal-text-xs);
    background: var(--fe-primary-bg);
    border: 2px solid rgba(12, 19, 93, 0.25);
    border-radius: var(--renewal-radius);
    color: var(--fe-primary);
    font-weight: 600;
}

.review-dialog-thanks .review-dialog-intro[b-11xt8ihv3r] {
    margin-bottom: 0.75rem;
}

.review-dialog-next-step[b-11xt8ihv3r] {
    margin: 0 0 1rem;
    font-size: var(--renewal-text-sm);
    color: var(--fe-primary);
    font-weight: 600;
}

.review-dialog-success-icon[b-11xt8ihv3r] {
    width: 48px;
    height: 48px;
    margin: 1rem auto 0;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%230d9488'%3E%3Cpath d='M9 16.17L4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41z'/%3E%3C/svg%3E") center/contain no-repeat;
}

/* Dialog action buttons – Fidelity colours */
.review-dialog-btn[b-11xt8ihv3r] {
    padding: 0.6rem 1.25rem;
    font-size: var(--renewal-text-sm);
    font-weight: 700;
    font-family: var(--renewal-font);
    border-radius: 10px;
    border: none;
    cursor: pointer;
    transition: background var(--renewal-duration) var(--renewal-ease), transform 0.2s;
}

.review-dialog-btn-primary[b-11xt8ihv3r] {
    background: var(--fe-primary);
    color: #fff;
}

.review-dialog-btn-primary:hover[b-11xt8ihv3r] {
    background: var(--fe-primary-light);
    transform: translateY(-1px);
}

.review-dialog-btn-send[b-11xt8ihv3r] {
    background: var(--fe-cta);
    color: #fff;
    box-shadow: 0 2px 8px rgba(198, 40, 40, 0.25);
}

.review-dialog-btn-send:hover[b-11xt8ihv3r] {
    background: var(--fe-cta-dark);
    transform: translateY(-1px);
}

.review-dialog-btn-close[b-11xt8ihv3r] {
    background: var(--renewal-surface);
    color: var(--renewal-text);
    border: 2px solid var(--renewal-border);
}

.review-dialog-btn-close:hover[b-11xt8ihv3r] {
    border-color: var(--fe-primary);
    color: var(--fe-primary);
}

.review-dialog-btn:focus-visible[b-11xt8ihv3r] {
    outline: 2px solid var(--fe-primary);
    outline-offset: 2px;
}

@media (max-width: 640px) {
    :deep(.mud-dialog-content)[b-11xt8ihv3r] {
        padding: 1rem;
    }
    :deep(.mud-dialog-actions)[b-11xt8ihv3r] {
        padding: 1rem;
        flex-direction: column;
        align-items: stretch;
    }
    .review-dialog-grid[b-11xt8ihv3r] {
        grid-template-columns: 1fr;
    }
    .review-dialog-btn[b-11xt8ihv3r] {
        min-height: 44px;
        width: 100%;
    }
}
/* /Features/Reports/Pages/OpportunityReport.razor.rz.scp.css */
/* ── Page layout ── */
.opp-page[b-jd9b1exi8j] {
    font-family: 'Plus Jakarta Sans', 'Inter', 'Segoe UI', system-ui, sans-serif;
    max-width: 1400px;
    margin: 0 auto;
    padding: 24px 16px 48px;
}

/* ── Header ── */
.opp-header[b-jd9b1exi8j] {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    flex-wrap: wrap;
    gap: 12px;
    margin-bottom: 24px;
}

.opp-title[b-jd9b1exi8j] {
    font-size: 1.5rem;
    font-weight: 800;
    color: #0C135D;
    margin: 0;
    line-height: 1.25;
}

.opp-subtitle[b-jd9b1exi8j] {
    font-size: 0.9375rem;
    color: #475569;
    font-weight: 500;
    margin: 2px 0 0;
}

.opp-header__search[b-jd9b1exi8j] {
    min-width: 300px;
    flex-shrink: 0;
}

/* ── Loading / Empty ── */
.opp-loading[b-jd9b1exi8j] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 16px;
    padding: 80px 0;
}

.opp-empty[b-jd9b1exi8j] {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 48px 24px;
    border-radius: 14px;
    background: #ffffff;
    border: 1px solid #dce3ed;
}

/* ── Cards ── */
.opp-card[b-jd9b1exi8j] {
    border-radius: 14px;
    border: 1px solid #dce3ed;
    border-left: 4px solid transparent;
    background: #ffffff;
    box-shadow: 0 1px 3px rgba(12, 19, 93, 0.04), 0 4px 20px rgba(12, 19, 93, 0.07);
    overflow: hidden;
    margin-bottom: 12px;
    transition: box-shadow 0.25s cubic-bezier(0.4, 0, 0.2, 1);
    animation: opp-card-in-b-jd9b1exi8j 0.4s cubic-bezier(0.4, 0, 0.2, 1) both;
    animation-delay: calc(var(--stagger, 0) * 60ms);
}

.opp-card--danger[b-jd9b1exi8j] {
    border-left-color: #c62828;
}

.opp-card--warning[b-jd9b1exi8j] {
    border-left-color: #b45309;
}

.opp-card--ok[b-jd9b1exi8j] {
    border-left-color: #0d9488;
}

.opp-card--open[b-jd9b1exi8j] {
    box-shadow: 0 2px 8px rgba(12, 19, 93, 0.06), 0 12px 32px rgba(12, 19, 93, 0.12);
}

/* ── Card header ── */
.opp-card-header[b-jd9b1exi8j] {
    cursor: pointer;
    user-select: none;
    padding: 16px;
    transition: background-color 0.15s ease;
}

.opp-card-header:hover[b-jd9b1exi8j] {
    background-color: #f5f7fa;
}

.opp-card-name[b-jd9b1exi8j] {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 8px;
    min-width: 0;
    flex: 1;
    overflow: hidden;
}

/* ── Chevron ── */
.opp-chevron[b-jd9b1exi8j] {
    flex-shrink: 0;
    transition: transform 0.2s ease;
    color: #475569;
}

.opp-card--open .opp-chevron[b-jd9b1exi8j] {
    transform: rotate(180deg);
}

/* ── Metrics ── */
.opp-metrics[b-jd9b1exi8j] {
    display: flex;
    flex-direction: row;
    align-items: center;
    flex-shrink: 0;
    gap: 0;
}

.opp-metric[b-jd9b1exi8j] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 3px;
    padding: 0 14px;
}

.opp-metric__label[b-jd9b1exi8j] {
    font-size: 0.6875rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: #475569;
    white-space: nowrap;
}

.opp-metric__value[b-jd9b1exi8j] {
    font-size: 0.9375rem;
    font-weight: 700;
    white-space: nowrap;
    color: #0C135D;
}

.opp-metric__value--muted[b-jd9b1exi8j] {
    font-weight: 400;
    color: #475569;
}

.opp-metric-sep[b-jd9b1exi8j] {
    width: 1px;
    height: 32px;
    background: #dce3ed;
    flex-shrink: 0;
}

/* ── Expiry badge ── */
.opp-badge[b-jd9b1exi8j] {
    display: inline-block;
    font-size: 0.75rem;
    font-weight: 700;
    padding: 2px 10px;
    border-radius: 20px;
    white-space: nowrap;
}

.opp-badge--danger[b-jd9b1exi8j] {
    background: rgba(198, 40, 40, 0.1);
    color: #c62828;
}

.opp-badge--warning[b-jd9b1exi8j] {
    background: #fef3c7;
    color: #b45309;
}

.opp-badge--ok[b-jd9b1exi8j] {
    background: #ccfbf1;
    color: #0d9488;
}

/* ── Card body ── */
.opp-card-body[b-jd9b1exi8j] {
    background: #f5f7fa;
    padding: 16px;
    animation: opp-body-reveal-b-jd9b1exi8j 0.25s cubic-bezier(0.4, 0, 0.2, 1) both;
}

/* ── Table ── */
[b-jd9b1exi8j] .opp-table .mud-table-container {
    border-radius: 10px;
    overflow: hidden;
}

[b-jd9b1exi8j] .opp-table .mud-table-head th {
    font-size: 0.7rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #475569;
    background: #f5f7fa;
    padding-top: 10px;
    padding-bottom: 10px;
}

/* ── Section label ── */
.opp-section-label[b-jd9b1exi8j] {
    display: block;
    font-size: 0.6875rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: #0C135D;
    font-weight: 600;
    margin-bottom: 8px;
}

/* ── Notes row ── */
.opp-notes[b-jd9b1exi8j] {
    display: flex;
    align-items: flex-start;
}

.opp-notes__editor[b-jd9b1exi8j] {
    flex: 1;
    min-width: 0;
}

.opp-notes__divider[b-jd9b1exi8j] {
    width: 1px;
    align-self: stretch;
    background: #dce3ed;
    margin: 0 24px;
    flex-shrink: 0;
}

.opp-notes__confidence[b-jd9b1exi8j] {
    display: flex;
    flex-direction: column;
    align-items: center;
    flex-shrink: 0;
    width: 168px;
    padding-top: 2px;
}

/* ── Footer ── */
.opp-footer[b-jd9b1exi8j] {
    position: sticky;
    bottom: 16px;
    border-radius: 14px;
    background: rgba(255, 255, 255, 0.85);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    box-shadow: 0 4px 12px rgba(12, 19, 93, 0.08), 0 20px 48px rgba(12, 19, 93, 0.16);
    padding: 12px 16px;
    margin-top: 16px;
}

/* ── Animations ── */
@keyframes opp-card-in-b-jd9b1exi8j {
    from {
        opacity: 0;
        transform: translateY(12px);
    }
}

@keyframes opp-body-reveal-b-jd9b1exi8j {
    from {
        opacity: 0;
        transform: translateY(-8px);
    }
}

/* ── Responsive ── */
@media (max-width: 960px) {
    .opp-metrics[b-jd9b1exi8j] {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: 8px;
    }

    .opp-metric-sep[b-jd9b1exi8j] {
        display: none;
    }

    .opp-header[b-jd9b1exi8j] {
        flex-direction: column;
        align-items: flex-start;
    }

    .opp-header__search[b-jd9b1exi8j] {
        width: 100%;
        min-width: unset;
    }
}

@media (max-width: 600px) {
    .opp-notes[b-jd9b1exi8j] {
        flex-direction: column;
        gap: 16px;
    }

    .opp-notes__divider[b-jd9b1exi8j] {
        width: 100%;
        height: 1px;
        margin: 0;
    }

    .opp-notes__confidence[b-jd9b1exi8j] {
        width: 100%;
    }

    .opp-footer[b-jd9b1exi8j] {
        border-radius: 10px;
    }

    .opp-card[b-jd9b1exi8j] {
        border-radius: 10px;
    }
}
/* /Features/SystemAdmin/Pages/Diagnostics.razor.rz.scp.css */
/* ─── Page Layout ─── */

.diag-page[b-d61v38rxfv] {
    padding: 24px;
    max-width: 1200px;
    margin: 0 auto;
}

/* ─── Header ─── */

.diag-header[b-d61v38rxfv] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 28px;
}

.diag-title[b-d61v38rxfv] {
    font-size: 1.5rem;
    font-weight: 700;
    color: #1F2937;
    margin: 0;
    letter-spacing: -0.01em;
}

.diag-subtitle[b-d61v38rxfv] {
    font-size: 0.84rem;
    color: #6B7280;
    margin: 2px 0 0;
    font-weight: 400;
}

.diag-env-badge[b-d61v38rxfv] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 14px;
    border-radius: 20px;
    font-size: 0.75rem;
    font-weight: 600;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    white-space: nowrap;
}

.diag-env-live[b-d61v38rxfv] {
    background: #F0FDF4;
    color: #047857;
    border: 1px solid #A7F3D0;
}

.diag-env-sandbox[b-d61v38rxfv] {
    background: #FFFBEB;
    color: #B45309;
    border: 1px solid #FDE68A;
}

.diag-env-dot[b-d61v38rxfv] {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    animation: diag-pulse-b-d61v38rxfv 2s ease-in-out infinite;
}

.diag-env-live .diag-env-dot[b-d61v38rxfv] {
    background: #10B981;
}

.diag-env-sandbox .diag-env-dot[b-d61v38rxfv] {
    background: #F59E0B;
}

/* ─── Card Grid ─── */

.diag-grid[b-d61v38rxfv] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
}

.diag-card[b-d61v38rxfv] {
    background: #fff;
    border: 1px solid var(--mud-palette-lines-default);
    border-radius: 12px;
    overflow: hidden;
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.diag-card:hover[b-d61v38rxfv] {
    transform: translateY(-2px);
    box-shadow: 0 8px 24px rgba(30, 58, 138, 0.08);
}

.diag-card-wide[b-d61v38rxfv] {
    grid-column: 1 / -1;
}

/* ─── Card Entrance Animation ─── */

.diag-card-anim[b-d61v38rxfv] {
    animation: diag-fade-up-b-d61v38rxfv 0.35s cubic-bezier(0.4, 0, 0.2, 1) both;
}

@keyframes diag-fade-up-b-d61v38rxfv {
    from {
        opacity: 0;
        transform: translateY(12px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* ─── Card Header ─── */

.diag-card-header[b-d61v38rxfv] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 14px 18px;
    border-bottom: 1px solid var(--mud-palette-lines-default);
}

.diag-card-title[b-d61v38rxfv] {
    font-size: 0.78rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #6B7280;
}

[b-d61v38rxfv] .diag-card-icon {
    color: #1E3A8A;
    font-size: 1.1rem !important;
}

.diag-badge[b-d61v38rxfv] {
    margin-left: auto;
    background: #EFF6FF;
    color: #1E3A8A;
    font-size: 0.7rem;
    font-weight: 600;
    padding: 2px 8px;
    border-radius: 10px;
}

/* ─── Card Body ─── */

.diag-card-body[b-d61v38rxfv] {
    padding: 16px 18px;
}

.diag-card-body-table[b-d61v38rxfv] {
    padding: 0;
}

/* ─── Key-Value List ─── */

.diag-kv-list[b-d61v38rxfv] {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.diag-kv[b-d61v38rxfv] {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 12px;
}

.diag-kv-label[b-d61v38rxfv] {
    font-size: 0.78rem;
    font-weight: 500;
    color: #9CA3AF;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    flex-shrink: 0;
}

.diag-kv-value[b-d61v38rxfv] {
    font-size: 0.88rem;
    font-weight: 500;
    color: #1F2937;
    text-align: right;
}

.diag-mono[b-d61v38rxfv] {
    font-family: 'Cascadia Code', 'Fira Code', 'Consolas', monospace;
    font-size: 0.82rem;
}

.diag-truncate[b-d61v38rxfv] {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    max-width: 200px;
}

/* ─── Action Buttons ─── */

.diag-actions[b-d61v38rxfv] {
    display: flex;
    gap: 10px;
    margin-bottom: 16px;
}

.diag-btn[b-d61v38rxfv] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 8px 16px;
    border-radius: 8px;
    font-size: 0.82rem;
    font-weight: 600;
    border: none;
    cursor: pointer;
    transition: all 0.15s ease;
    white-space: nowrap;
}

.diag-btn:disabled[b-d61v38rxfv] {
    opacity: 0.6;
    cursor: not-allowed;
}

.diag-btn-primary[b-d61v38rxfv] {
    background: #1E3A8A;
    color: #fff;
}

.diag-btn-primary:hover:not(:disabled)[b-d61v38rxfv] {
    background: #1E40AF;
    box-shadow: 0 4px 12px rgba(30, 58, 138, 0.3);
}

.diag-btn-secondary[b-d61v38rxfv] {
    background: var(--mud-palette-lines-default);
    color: #374151;
    border: 1px solid var(--mud-palette-lines-default);
}

.diag-btn-secondary:hover:not(:disabled)[b-d61v38rxfv] {
    background: var(--mud-palette-lines-default);
    border-color: var(--mud-palette-lines-default);
}

[b-d61v38rxfv] .diag-btn .mud-icon-root {
    font-size: 1rem !important;
}

/* ─── Spinner ─── */

.diag-spinner[b-d61v38rxfv] {
    width: 14px;
    height: 14px;
    border: 2px solid rgba(255, 255, 255, 0.3);
    border-top-color: currentColor;
    border-radius: 50%;
    animation: diag-spin-b-d61v38rxfv 0.6s linear infinite;
}

.diag-btn-secondary .diag-spinner[b-d61v38rxfv] {
    border-color: rgba(55, 65, 81, 0.2);
    border-top-color: #374151;
}

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

/* ─── Log Level Select ─── */

.diag-log-level[b-d61v38rxfv] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding-top: 14px;
    border-top: 1px solid var(--mud-palette-lines-default);
}

.diag-log-level .diag-kv-label[b-d61v38rxfv] {
    flex-shrink: 0;
}

[b-d61v38rxfv] .diag-select {
    flex: 1;
}

[b-d61v38rxfv] .diag-select .mud-input-outlined-border {
    border-radius: 8px;
}

/* ─── Suppliers Table ─── */

.diag-table-wrap[b-d61v38rxfv] {
    max-height: 360px;
    overflow-y: auto;
}

.diag-table-wrap[b-d61v38rxfv]::-webkit-scrollbar {
    width: 5px;
}

.diag-table-wrap[b-d61v38rxfv]::-webkit-scrollbar-thumb {
    background: var(--mud-palette-lines-default);
    border-radius: 3px;
}

.diag-table-wrap[b-d61v38rxfv]::-webkit-scrollbar-thumb:hover {
    background: #9CA3AF;
}

.diag-table[b-d61v38rxfv] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.84rem;
}

.diag-table thead[b-d61v38rxfv] {
    position: sticky;
    top: 0;
    z-index: 1;
}

.diag-table th[b-d61v38rxfv] {
    background: var(--mud-palette-background);
    color: #6B7280;
    font-weight: 600;
    font-size: 0.72rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    padding: 10px 18px;
    text-align: left;
    border-bottom: 1px solid var(--mud-palette-lines-default);
}

.diag-table td[b-d61v38rxfv] {
    padding: 9px 18px;
    color: #374151;
    border-bottom: 1px solid var(--mud-palette-lines-default);
}

.diag-table tbody tr[b-d61v38rxfv] {
    transition: background 0.12s ease;
}

.diag-table tbody tr:hover[b-d61v38rxfv] {
    background: #F0F4FF;
}

.diag-table tbody tr:last-child td[b-d61v38rxfv] {
    border-bottom: none;
}

/* ─── Loading State ─── */

.diag-loading[b-d61v38rxfv] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 32px 18px;
    color: #9CA3AF;
    font-size: 0.84rem;
}

/* ─── Pulse Animation ─── */

@keyframes diag-pulse-b-d61v38rxfv {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.4; }
}

/* ─── Responsive ─── */

@media (max-width: 960px) {
    .diag-grid[b-d61v38rxfv] {
        grid-template-columns: 1fr 1fr;
    }

    .diag-card-wide[b-d61v38rxfv] {
        grid-column: 1 / -1;
    }
}

@media (max-width: 600px) {
    .diag-page[b-d61v38rxfv] {
        padding: 16px;
    }

    .diag-header[b-d61v38rxfv] {
        flex-direction: column;
        align-items: flex-start;
        gap: 12px;
    }

    .diag-grid[b-d61v38rxfv] {
        grid-template-columns: 1fr;
    }

    .diag-actions[b-d61v38rxfv] {
        flex-direction: column;
    }

    .diag-kv[b-d61v38rxfv] {
        flex-direction: column;
        gap: 2px;
    }

    .diag-kv-value[b-d61v38rxfv] {
        text-align: left;
    }
}
/* /Features/SystemAdmin/Pages/Jobs/MassDelete.razor.rz.scp.css */
/* General styling */
.page-title[b-scd0s2n3kp] {
    font-size: 1.5rem;
    margin-bottom: 1rem;
}

.info-text[b-scd0s2n3kp] {
    font-size: 1rem;
    color: #555;
    margin-bottom: 2rem;
}

/* Table styling */
.table[b-scd0s2n3kp] {
    width: 100%;
    margin-top: 1rem;
    border-collapse: collapse;
    font-size: 0.95rem;
}

    .table th[b-scd0s2n3kp], .table td[b-scd0s2n3kp] {
        padding: 0.75rem;
        text-align: left;
        border: 1px solid var(--mud-palette-lines-default);
    }

.table-striped tbody tr:nth-child(odd)[b-scd0s2n3kp] {
    background-color: #f9f9f9;
}

.table-bordered th[b-scd0s2n3kp], .table-bordered td[b-scd0s2n3kp] {
    border: 2px solid var(--mud-palette-lines-default);
}

/* Button styling */
.button-container[b-scd0s2n3kp] {
    margin-top: 1rem;
    text-align: right;
}

.btn[b-scd0s2n3kp] {
    padding: 0.5rem 1rem;
    font-size: 1rem;
    cursor: pointer;
    border-radius: 0.25rem;
    border: none;
    transition: background-color 0.3s ease;
}

.btn-danger[b-scd0s2n3kp] {
    background-color: #dc3545;
    color: #fff;
}

    .btn-danger:hover[b-scd0s2n3kp] {
        background-color: #c82333;
    }

/* Loading spinner */
.loading-container[b-scd0s2n3kp] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    margin-top: 2rem;
}

.spinner[b-scd0s2n3kp] {
    width: 3rem;
    height: 3rem;
    border: 4px solid var(--mud-palette-lines-default);
    border-top-color: #007bff;
    border-radius: 50%;
    animation: spin-b-scd0s2n3kp 1s linear infinite;
}

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

    100% {
        transform: rotate(360deg);
    }
}
/* /Features/SystemAdmin/Pages/Logs.razor.rz.scp.css */
/* ═══════════════════════════════════════
   Application Logs – Scoped CSS
   ═══════════════════════════════════════ */

/* ─── Page ─── */
.lg-page[b-90b3atyhih] {
    max-width: 1400px;
    margin: 0 auto;
    padding: 24px;
}

/* ─── Header ─── */
.lg-header[b-90b3atyhih] {
    display: flex;
    align-items: center;
    gap: 16px;
    margin-bottom: 24px;
}

.lg-header-icon[b-90b3atyhih] {
    width: 52px;
    height: 52px;
    border-radius: 14px;
    background: linear-gradient(135deg, #1E3A8A, #3B82F6);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    box-shadow: 0 4px 12px rgba(30, 58, 138, 0.25);
}

.lg-header-text[b-90b3atyhih] {
    flex: 1;
    min-width: 0;
}

/* ─── Stats Row ─── */
.lg-stats-row[b-90b3atyhih] {
    display: flex;
    gap: 12px;
    margin: 20px 0;
    flex-wrap: wrap;
}

.lg-stat-card[b-90b3atyhih] {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 14px 20px;
    border-radius: 10px;
    border: 1px solid var(--mud-palette-lines-default);
    cursor: pointer;
    transition: all 0.2s ease;
    min-width: 90px;
}

.lg-stat-card:hover[b-90b3atyhih] {
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
}

.lg-stat-card.active[b-90b3atyhih] {
    box-shadow: 0 0 0 2px currentColor, 0 4px 12px rgba(0, 0, 0, 0.08);
    transform: translateY(-2px);
}

.lg-stat-count[b-90b3atyhih] {
    font-size: 1.4rem;
    font-weight: 800;
    line-height: 1;
}

.lg-stat-label[b-90b3atyhih] {
    font-size: 0.68rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    margin-top: 4px;
    opacity: 0.7;
}

/* Stat Card Variants */
.lg-stat-total[b-90b3atyhih] {
    border-color: #BFDBFE;
    background: #EFF6FF;
    color: #1E3A8A;
}

.lg-stat-ftl[b-90b3atyhih] {
    border-color: #FECACA;
    background: #FEF2F2;
    color: #7C2D12;
}

.lg-stat-err[b-90b3atyhih] {
    border-color: #FECACA;
    background: #FEF2F2;
    color: #B91C1C;
}

.lg-stat-wrn[b-90b3atyhih] {
    border-color: #FDE68A;
    background: #FFFBEB;
    color: #B45309;
}

.lg-stat-inf[b-90b3atyhih] {
    border-color: #A7F3D0;
    background: #F0FDF4;
    color: #047857;
}

.lg-stat-dbg[b-90b3atyhih] {
    border-color: var(--mud-palette-lines-default);
    background: var(--mud-palette-background);
    color: #6B7280;
}

.lg-stat-vrb[b-90b3atyhih] {
    border-color: var(--mud-palette-lines-default);
    background: var(--mud-palette-background);
    color: #9CA3AF;
}

/* ─── Recurring Errors Panel ─── */
.lg-errors-panel[b-90b3atyhih] {
    background: #fff;
    border-radius: 12px;
    border: 1px solid #FECACA;
    margin-bottom: 20px;
    overflow: hidden;
}

.lg-errors-header[b-90b3atyhih] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 12px 16px;
    background: #FEF2F2;
    border-bottom: 1px solid #FECACA;
    cursor: pointer;
    transition: background 0.15s ease;
    user-select: none;
}

.lg-errors-header:hover[b-90b3atyhih] {
    background: #FEE2E2;
}

.lg-errors-title[b-90b3atyhih] {
    font-size: 0.82rem;
    font-weight: 700;
    color: #B91C1C;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    flex: 1;
}

.lg-errors-count[b-90b3atyhih] {
    background: rgba(185, 28, 28, 0.1);
    color: #B91C1C;
    font-size: 0.72rem;
    font-weight: 700;
    padding: 2px 10px;
    border-radius: 10px;
}

.lg-errors-list[b-90b3atyhih] {
    padding: 8px;
    max-height: 260px;
    overflow-y: auto;
}

.lg-error-item[b-90b3atyhih] {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    padding: 8px 12px;
    border-radius: 8px;
    cursor: pointer;
    transition: background 0.15s ease;
}

.lg-error-item:hover[b-90b3atyhih] {
    background: #FEF2F2;
}

.lg-error-badge[b-90b3atyhih] {
    background: #FEE2E2;
    color: #B91C1C;
    font-size: 0.72rem;
    font-weight: 700;
    padding: 2px 10px;
    border-radius: 6px;
    flex-shrink: 0;
    min-width: 36px;
    text-align: center;
}

.lg-error-text[b-90b3atyhih] {
    font-size: 0.8rem;
    color: #991B1B;
    font-family: 'Cascadia Code', 'Fira Code', 'Consolas', monospace;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    flex: 1;
    min-width: 0;
}

/* ─── Two-Panel Layout ─── */
.lg-layout[b-90b3atyhih] {
    display: flex;
    gap: 20px;
    align-items: stretch;
    height: calc(100vh - 280px);
    min-height: 500px;
}

/* ─── Sidebar ─── */
.lg-sidebar[b-90b3atyhih] {
    width: 280px;
    min-width: 280px;
    background: #fff;
    border-radius: 12px;
    border: 1px solid var(--mud-palette-lines-default);
    overflow: hidden;
}

.lg-sidebar-inner[b-90b3atyhih] {
    padding: 16px;
    display: flex;
    flex-direction: column;
}

.lg-sidebar-title[b-90b3atyhih] {
    font-size: 0.82rem;
    font-weight: 700;
    color: #374151;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    margin-bottom: 12px;
}

/* ─── File List ─── */
.lg-file-list[b-90b3atyhih] {
    flex: 1;
    overflow-y: auto;
    max-height: 500px;
    min-height: 200px;
    margin: 0 -16px;
}

.lg-file-item[b-90b3atyhih] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 16px;
    cursor: pointer;
    transition: background 0.15s ease;
    border-left: 3px solid transparent;
    font-size: 0.84rem;
    color: #1F2937;
}

.lg-file-item:hover[b-90b3atyhih] {
    background: #F0F4FF;
}

.lg-file-item.active[b-90b3atyhih] {
    background: #EEF2FF;
    border-left-color: #1E3A8A;
    font-weight: 600;
    color: #1E3A8A;
}

.lg-file-name[b-90b3atyhih] {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    min-width: 0;
}

.lg-file-count[b-90b3atyhih] {
    padding: 10px 0 0;
    font-size: 0.75rem;
    color: #9CA3AF;
    text-align: center;
    border-top: 1px solid var(--mud-palette-lines-default);
}

.lg-empty[b-90b3atyhih] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 48px 16px;
}

/* ─── Viewer Panel ─── */
.lg-viewer[b-90b3atyhih] {
    flex: 1;
    min-width: 0;
    background: #fff;
    border-radius: 12px;
    border: 1px solid var(--mud-palette-lines-default);
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.lg-no-selection[b-90b3atyhih] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 8px;
    height: 100%;
    min-height: 400px;
}

.lg-loading-bar[b-90b3atyhih] {
    flex-shrink: 0;
}

/* ─── Toolbar ─── */
.lg-toolbar[b-90b3atyhih] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 16px;
    border-bottom: 1px solid var(--mud-palette-lines-default);
    flex-wrap: wrap;
    flex-shrink: 0;
    background: #FAFBFC;
}

.lg-filters[b-90b3atyhih] {
    display: flex;
    gap: 6px;
    flex-wrap: wrap;
}

/* ─── Filter Chips ─── */
.lg-filter-chip[b-90b3atyhih] {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 4px 10px;
    border-radius: 6px;
    font-size: 0.7rem;
    font-weight: 700;
    letter-spacing: 0.03em;
    cursor: pointer;
    transition: all 0.15s ease;
    border: 1px solid transparent;
    user-select: none;
}

.lg-filter-chip:hover[b-90b3atyhih] {
    transform: translateY(-1px);
}

.lg-chip-count[b-90b3atyhih] {
    opacity: 0.7;
    font-weight: 600;
}

.lg-chip-ftl[b-90b3atyhih] {
    background: rgba(124, 45, 18, 0.08);
    color: #7C2D12;
}

.lg-chip-ftl.active[b-90b3atyhih] {
    background: #7C2D12;
    color: #fff;
}

.lg-chip-err[b-90b3atyhih] {
    background: rgba(185, 28, 28, 0.08);
    color: #B91C1C;
}

.lg-chip-err.active[b-90b3atyhih] {
    background: #B91C1C;
    color: #fff;
}

.lg-chip-wrn[b-90b3atyhih] {
    background: rgba(180, 83, 9, 0.08);
    color: #B45309;
}

.lg-chip-wrn.active[b-90b3atyhih] {
    background: #B45309;
    color: #fff;
}

.lg-chip-inf[b-90b3atyhih] {
    background: rgba(4, 120, 87, 0.08);
    color: #047857;
}

.lg-chip-inf.active[b-90b3atyhih] {
    background: #047857;
    color: #fff;
}

.lg-chip-dbg[b-90b3atyhih] {
    background: rgba(107, 114, 128, 0.08);
    color: #6B7280;
}

.lg-chip-dbg.active[b-90b3atyhih] {
    background: #6B7280;
    color: #fff;
}

.lg-chip-vrb[b-90b3atyhih] {
    background: rgba(156, 163, 175, 0.08);
    color: #9CA3AF;
}

.lg-chip-vrb.active[b-90b3atyhih] {
    background: #9CA3AF;
    color: #fff;
}

/* ─── Lines Info ─── */
.lg-lines-info[b-90b3atyhih] {
    padding: 6px 16px;
    font-size: 0.7rem;
    color: #9CA3AF;
    font-weight: 500;
    border-bottom: 1px solid var(--mud-palette-lines-default);
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    background: #FAFBFC;
    flex-shrink: 0;
}

/* ─── Search Box (inline in toolbar) ─── */
.lg-search-box[b-90b3atyhih] {
    display: flex;
    flex-direction: row;
    align-items: center;
    height: 34px;
    border: 1px solid var(--mud-palette-lines-default);
    background: #fff;
    border-radius: 8px;
    padding: 0 8px;
    gap: 6px;
    min-width: 250px;
    flex: 1;
    max-width: 400px;
}

[b-90b3atyhih] .lg-search-box .mud-autocomplete .mud-input-slot {
    font-size: 0.82rem;
}

[b-90b3atyhih] .lg-search-box .mud-autocomplete .mud-input {
    margin: 0;
}

/* ─── Date Selector (inline in toolbar) ─── */
.lg-date-selector[b-90b3atyhih] {
    flex-shrink: 0;
}

[b-90b3atyhih] .lg-date-selector .mud-stack {
    gap: 4px;
}

[b-90b3atyhih] .lg-date-selector .mud-button {
    min-width: auto;
    padding: 2px 8px;
    font-size: 0.75rem;
    text-transform: none;
}

[b-90b3atyhih] .lg-date-selector .mud-icon-button {
    padding: 4px;
}

[b-90b3atyhih] .lg-date-selector .mud-input {
    font-size: 0.8rem;
}

/* ─── Search Navigation ─── */
.lg-search-nav[b-90b3atyhih] {
    display: inline-flex;
    align-items: center;
    gap: 2px;
    padding: 0 4px;
    border-radius: 6px;
    background: rgba(30, 58, 138, 0.06);
    flex-shrink: 0;
}

.lg-match-info[b-90b3atyhih] {
    font-size: 0.7rem;
    font-weight: 600;
    color: #1E3A8A;
    padding: 0 6px;
    min-width: 42px;
    text-align: center;
}

/* ─── Log Content ─── */
.lg-content[b-90b3atyhih] {
    flex: 1;
    overflow-y: auto;
    min-height: 0;
    font-family: 'Cascadia Code', 'Fira Code', 'Consolas', monospace;
    font-size: 0.78rem;
    line-height: 1.6;
}

.lg-item[b-90b3atyhih] {
    display: block;
}

/* ─── Ticket Selection Mode ─── */
.lg-ticket-bar[b-90b3atyhih] {
    display: flex;
    align-items: center;
    gap: 8px;
    background: #FFFBEB;
    border-bottom-color: #FDE68A;
    color: #92400E;
    font-weight: 600;
}

.lg-selectable[b-90b3atyhih] {
    cursor: pointer;
}

.lg-selectable:hover[b-90b3atyhih] {
    background: rgba(245, 158, 11, 0.06) !important;
}

.lg-selected[b-90b3atyhih] {
    background: rgba(245, 158, 11, 0.1) !important;
    border-left-color: #F59E0B !important;
}

.lg-select-tick[b-90b3atyhih] {
    flex-shrink: 0;
    font-size: 1rem;
    line-height: 1;
    color: #B45309;
    cursor: pointer;
    user-select: none;
}

/* ─── Search Highlight ─── */
[b-90b3atyhih] .lg-highlight {
    background: #FEF08A;
    color: #854D0E;
    padding: 0 2px;
    border-radius: 2px;
    font-weight: 600;
}

.lg-line[b-90b3atyhih] {
    display: flex;
    gap: 8px;
    padding: 3px 16px;
    align-items: flex-start;
    border-left: 3px solid transparent;
    transition: background 0.1s ease;
}

.lg-line:hover[b-90b3atyhih] {
    background: rgba(0, 0, 0, 0.02);
}

.lg-timestamp[b-90b3atyhih] {
    color: #9CA3AF;
    white-space: nowrap;
    flex-shrink: 0;
    min-width: 150px;
    font-size: 0.74rem;
}

.lg-badge[b-90b3atyhih] {
    font-size: 0.62rem;
    font-weight: 700;
    padding: 1px 6px;
    border-radius: 4px;
    white-space: nowrap;
    flex-shrink: 0;
    min-width: 32px;
    text-align: center;
    margin-top: 2px;
}

.lg-message[b-90b3atyhih] {
    flex: 1;
    min-width: 0;
    word-break: break-word;
    white-space: pre-wrap;
}

/* ─── Log Level Line Styles ─── */
.lg-level-ftl[b-90b3atyhih] {
    background: rgba(239, 68, 68, 0.06);
    border-left-color: #7C2D12;
}

.lg-level-ftl .lg-message[b-90b3atyhih] {
    color: #7C2D12;
    font-weight: 600;
}

.lg-badge-ftl[b-90b3atyhih] {
    background: #FEE2E2;
    color: #7C2D12;
}

.lg-level-err[b-90b3atyhih] {
    background: rgba(239, 68, 68, 0.04);
    border-left-color: #DC2626;
}

.lg-level-err .lg-message[b-90b3atyhih] {
    color: #991B1B;
}

.lg-badge-err[b-90b3atyhih] {
    background: #FEE2E2;
    color: #991B1B;
}

.lg-level-wrn[b-90b3atyhih] {
    background: rgba(245, 158, 11, 0.04);
    border-left-color: #F59E0B;
}

.lg-level-wrn .lg-message[b-90b3atyhih] {
    color: #92400E;
}

.lg-badge-wrn[b-90b3atyhih] {
    background: #FEF3C7;
    color: #92400E;
}

.lg-level-inf .lg-message[b-90b3atyhih] {
    color: #374151;
}

.lg-badge-inf[b-90b3atyhih] {
    background: #DBEAFE;
    color: #1E40AF;
}

.lg-level-dbg .lg-message[b-90b3atyhih] {
    color: #6B7280;
}

.lg-badge-dbg[b-90b3atyhih] {
    background: var(--mud-palette-lines-default);
    color: #6B7280;
}

.lg-level-vrb .lg-message[b-90b3atyhih] {
    color: #9CA3AF;
}

.lg-badge-vrb[b-90b3atyhih] {
    background: var(--mud-palette-lines-default);
    color: #9CA3AF;
}

.lg-empty-content[b-90b3atyhih] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 64px 16px;
    flex: 1;
}

/* ─── Scrollbar ─── */
.lg-file-list[b-90b3atyhih]::-webkit-scrollbar,
.lg-content[b-90b3atyhih]::-webkit-scrollbar,
.lg-errors-list[b-90b3atyhih]::-webkit-scrollbar {
    width: 5px;
}

.lg-file-list[b-90b3atyhih]::-webkit-scrollbar-track,
.lg-content[b-90b3atyhih]::-webkit-scrollbar-track,
.lg-errors-list[b-90b3atyhih]::-webkit-scrollbar-track {
    background: transparent;
}

.lg-file-list[b-90b3atyhih]::-webkit-scrollbar-thumb,
.lg-content[b-90b3atyhih]::-webkit-scrollbar-thumb,
.lg-errors-list[b-90b3atyhih]::-webkit-scrollbar-thumb {
    background: var(--mud-palette-lines-default);
    border-radius: 3px;
}

.lg-file-list[b-90b3atyhih]::-webkit-scrollbar-thumb:hover,
.lg-content[b-90b3atyhih]::-webkit-scrollbar-thumb:hover,
.lg-errors-list[b-90b3atyhih]::-webkit-scrollbar-thumb:hover {
    background: #9CA3AF;
}

/* ─── Release Banner ─── */
.lg-release-banner[b-90b3atyhih] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 8px 16px;
    background: linear-gradient(135deg, #1E3A8A, #3B82F6);
    color: #fff;
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    font-size: 0.78rem;
    font-weight: 600;
    letter-spacing: 0.03em;
    border-left: 3px solid #F59E0B;
}

.lg-release-time[b-90b3atyhih] {
    margin-left: auto;
    opacity: 0.8;
    font-weight: 400;
    font-family: 'Cascadia Code', 'Fira Code', 'Consolas', monospace;
    font-size: 0.72rem;
}

/* ─── SF Objects Panel ─── */
.lg-sf-panel[b-90b3atyhih] {
    display: flex;
    gap: 16px;
    padding: 12px 16px;
    border-bottom: 1px solid var(--mud-palette-lines-default);
    background: #F0F9FF;
    overflow-x: auto;
    flex-shrink: 0;
}

.lg-sf-group[b-90b3atyhih] {
    min-width: 200px;
}

.lg-sf-group-title[b-90b3atyhih] {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 0.72rem;
    font-weight: 700;
    color: #1E3A8A;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    margin-bottom: 6px;
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
}

.lg-sf-item[b-90b3atyhih] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 4px 8px;
    border-radius: 6px;
    cursor: pointer;
    transition: background 0.15s ease;
    font-size: 0.76rem;
}

.lg-sf-item:hover[b-90b3atyhih] {
    background: rgba(30, 58, 138, 0.06);
}

.lg-sf-item.active[b-90b3atyhih] {
    background: rgba(30, 58, 138, 0.1);
    font-weight: 600;
}

.lg-sf-name[b-90b3atyhih] {
    color: #1F2937;
    font-weight: 500;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 180px;
}

.lg-sf-id[b-90b3atyhih] {
    font-family: 'Cascadia Code', 'Fira Code', 'Consolas', monospace;
    font-size: 0.68rem;
    color: #9CA3AF;
    flex-shrink: 0;
}

.lg-sf-errors[b-90b3atyhih] {
    font-size: 0.65rem;
    font-weight: 700;
    color: #B91C1C;
    background: #FEE2E2;
    padding: 1px 6px;
    border-radius: 4px;
    flex-shrink: 0;
}

/* ─── Live Mode Toggle ─── */
.lg-live-toggle[b-90b3atyhih] {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 4px 10px;
    border-radius: 6px;
    font-size: 0.68rem;
    font-weight: 700;
    letter-spacing: 0.05em;
    cursor: pointer;
    transition: all 0.15s ease;
    background: rgba(107, 114, 128, 0.08);
    color: #6B7280;
    user-select: none;
}

.lg-live-toggle:hover[b-90b3atyhih] {
    background: rgba(107, 114, 128, 0.15);
}

.lg-live-toggle.active[b-90b3atyhih] {
    background: rgba(22, 163, 74, 0.1);
    color: #16A34A;
}

.lg-live-dot[b-90b3atyhih] {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: currentColor;
    flex-shrink: 0;
}

.lg-live-toggle.active .lg-live-dot[b-90b3atyhih] {
    animation: lg-pulse-b-90b3atyhih 1.5s ease-in-out infinite;
    background: #16A34A;
}

@keyframes lg-pulse-b-90b3atyhih {
    0%, 100% { opacity: 1; box-shadow: 0 0 0 0 rgba(22, 163, 74, 0.4); }
    50% { opacity: 0.7; box-shadow: 0 0 0 4px rgba(22, 163, 74, 0); }
}

.lg-live-text[b-90b3atyhih] {
    line-height: 1;
}

.lg-live-indicator[b-90b3atyhih] {
    margin-left: 8px;
    color: #16A34A;
    font-weight: 600;
}

/* ─── MudSelect override ─── */
[b-90b3atyhih] .mud-select {
    font-size: 0.8rem;
}

/* ─── Responsive ─── */
@media (max-width: 960px) {
    .lg-page[b-90b3atyhih] {
        padding: 16px;
    }

    .lg-layout[b-90b3atyhih] {
        flex-direction: column;
        height: auto;
        min-height: 0;
    }

    .lg-sidebar[b-90b3atyhih] {
        width: 100%;
        min-width: 0;
    }

    .lg-file-list[b-90b3atyhih] {
        max-height: 200px;
    }

    .lg-viewer[b-90b3atyhih] {
        min-height: 400px;
        max-height: 70vh;
    }

    .lg-timestamp[b-90b3atyhih] {
        min-width: auto;
    }
}

@media (max-width: 600px) {
    .lg-header[b-90b3atyhih] {
        flex-wrap: wrap;
    }

    .lg-header-icon[b-90b3atyhih] {
        width: 42px;
        height: 42px;
        border-radius: 10px;
    }

    .lg-line[b-90b3atyhih] {
        flex-wrap: wrap;
        gap: 4px;
    }

    .lg-toolbar[b-90b3atyhih] {
        padding: 10px 12px;
    }
}
/* /Features/SystemAdmin/Pages/Pricing/PricingUpload.razor.rz.scp.css */
/* ── Pricing Upload responsive layout ── */

[b-4set8vxfcn] .pricing-panel {
    min-height: 50vh;
}

/* Action buttons row — flex wrap instead of rigid row */
[b-4set8vxfcn] .pricing-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-top: 8px;
}

[b-4set8vxfcn] .pricing-actions > * {
    flex: 1 1 auto;
    min-width: 0;
    white-space: nowrap;
}

/* ── Mobile: stack panels vertically, reduce heights ── */
@media (max-width: 959.98px) {
    [b-4set8vxfcn] .pricing-panel {
        min-height: auto;
        max-height: 60vh;
    }

    [b-4set8vxfcn] .pricing-actions > * {
        flex: 1 1 45%;
    }
}

/* ── Small mobile ── */
@media (max-width: 599.98px) {
    [b-4set8vxfcn] .pricing-actions > * {
        flex: 1 1 100%;
    }
}
/* /Features/SystemAdmin/Pages/UserActivity/UserActivity.razor.rz.scp.css */
/* ─── Page Layout ─── */
.ua-page[b-qjzhqlkrhk] {
    max-width: 1400px;
    margin: 0 auto;
    padding: 24px;
}

/* ─── Header ─── */
.ua-header[b-qjzhqlkrhk] {
    display: flex;
    align-items: center;
    gap: 16px;
    margin-bottom: 28px;
}

.ua-header-icon[b-qjzhqlkrhk] {
    width: 52px;
    height: 52px;
    border-radius: 14px;
    background: linear-gradient(135deg, #1E3A8A, #3B82F6);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    box-shadow: 0 4px 12px rgba(30, 58, 138, 0.25);
}

/* ─── Tabs ─── */
[b-qjzhqlkrhk] .ua-tabs {
    background: #fff;
    border-radius: 12px;
    border: 1px solid var(--mud-palette-lines-default);
    overflow: hidden;
}

[b-qjzhqlkrhk] .ua-tabs .mud-tab {
    margin: 0 6px;
}

[b-qjzhqlkrhk] .ua-chart-tabs .mud-tab {
    margin: 0 6px;
}

[b-qjzhqlkrhk] .ua-tab-content {
    padding: 24px;
    background: var(--mud-palette-background);
}

/* ─── Stat Cards ─── */
.ua-stat-card[b-qjzhqlkrhk] {
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 20px;
    background: #fff;
    border-radius: 12px;
    border: 1px solid var(--mud-palette-lines-default);
    transition: box-shadow 0.2s ease, border-color 0.2s ease;
    height: 100%;
}

.ua-stat-card:hover[b-qjzhqlkrhk] {
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.06);
    border-color: var(--mud-palette-lines-default);
}

.ua-stat-icon[b-qjzhqlkrhk] {
    width: 48px;
    height: 48px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.ua-stat-content[b-qjzhqlkrhk] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
}

.ua-stat-label[b-qjzhqlkrhk] {
    font-size: 0.78rem;
    font-weight: 500;
    color: #6B7280;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.ua-stat-value[b-qjzhqlkrhk] {
    font-size: 1.6rem;
    font-weight: 700;
    color: #1F2937;
    line-height: 1.2;
}

/* ─── Toolbar ─── */
.ua-toolbar[b-qjzhqlkrhk] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 16px;
    background: #fff;
    border-radius: 12px;
    border: 1px solid var(--mud-palette-lines-default);
    flex-wrap: wrap;
}

/* ─── Table ─── */
[b-qjzhqlkrhk] .ua-table-container {
    border-radius: 12px !important;
    overflow: hidden;
}

[b-qjzhqlkrhk] .ua-table-row {
    transition: background 0.15s ease;
}

[b-qjzhqlkrhk] .ua-table-row:hover {
    background: #F0F4FF !important;
}

.ua-user-cell[b-qjzhqlkrhk] {
    display: flex;
    align-items: center;
    gap: 12px;
}

.ua-user-cell > div[b-qjzhqlkrhk] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
}

.ua-user-email[b-qjzhqlkrhk] {
    font-weight: 500;
    font-size: 0.875rem;
    color: #1F2937;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.ua-ip[b-qjzhqlkrhk] {
    font-family: 'Cascadia Code', 'Fira Code', 'Consolas', monospace;
    font-size: 0.8rem;
    color: #6B7280;
    background: var(--mud-palette-lines-default);
    padding: 2px 8px;
    border-radius: 6px;
}

/* ─── User Filter ─── */
.ua-user-filter-bar[b-qjzhqlkrhk] {
    flex-wrap: wrap;
    gap: 10px;
}

.ua-filter-chips[b-qjzhqlkrhk] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 4px;
}

/* ─── Empty State ─── */
.ua-empty[b-qjzhqlkrhk] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 48px 0;
}

/* ─── Loading ─── */
.ua-loading[b-qjzhqlkrhk] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 80px 0;
}

/* ─── Chart Tabs ─── */
[b-qjzhqlkrhk] .ua-chart-tabs {
    background: #fff;
    border-radius: 12px;
    border: 1px solid var(--mud-palette-lines-default);
    overflow: hidden;
}

.ua-chart-wrap[b-qjzhqlkrhk] {
    padding: 24px;
}

[b-qjzhqlkrhk] .ua-chart-title {
    font-weight: 600;
    color: #1F2937;
    margin-bottom: 16px;
}

/* ─── Duration Controls ─── */
.ua-duration-controls[b-qjzhqlkrhk] {
    display: flex;
    align-items: center;
    gap: 16px;
    flex-wrap: wrap;
    margin-bottom: 20px;
}

.ua-date-nav[b-qjzhqlkrhk] {
    display: flex;
    align-items: center;
    gap: 4px;
    background: var(--mud-palette-lines-default);
    border-radius: 10px;
    padding: 4px 8px;
}

.ua-date-display[b-qjzhqlkrhk] {
    font-size: 0.875rem;
    font-weight: 600;
    color: #1F2937;
    min-width: 110px;
    text-align: center;
    user-select: none;
}

/* ─── Duration Bars ─── */
.ua-duration-list[b-qjzhqlkrhk] {
    display: flex;
    flex-direction: column;
    gap: 6px;
    max-height: 600px;
    overflow-y: auto;
    padding-right: 4px;
}

.ua-duration-row[b-qjzhqlkrhk] {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 6px 0;
    min-height: 38px;
}

[b-qjzhqlkrhk] .ua-duration-row > .mud-tooltip-root {
    width: 200px;
    min-width: 200px;
    flex-shrink: 0;
}

.ua-duration-label[b-qjzhqlkrhk] {
    display: block;
    width: 100%;
    font-size: 0.82rem;
    font-weight: 500;
    color: #374151;
    text-align: right;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    cursor: default;
}

.ua-duration-track[b-qjzhqlkrhk] {
    flex: 1;
    background: var(--mud-palette-lines-default);
    border-radius: 6px;
    height: 28px;
    min-width: 0;
    overflow: hidden;
}

.ua-duration-fill[b-qjzhqlkrhk] {
    background: linear-gradient(90deg, var(--mud-palette-primary), var(--mud-palette-primary));
    border-radius: 6px;
    height: 100%;
    min-width: 4px;
    transition: width 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

.ua-duration-value[b-qjzhqlkrhk] {
    width: 72px;
    min-width: 72px;
    font-size: 0.82rem;
    font-weight: 600;
    color: #4B5563;
    white-space: nowrap;
    text-align: right;
}

/* ─── Scrollbar ─── */
.ua-duration-list[b-qjzhqlkrhk]::-webkit-scrollbar {
    width: 6px;
}

.ua-duration-list[b-qjzhqlkrhk]::-webkit-scrollbar-track {
    background: transparent;
}

.ua-duration-list[b-qjzhqlkrhk]::-webkit-scrollbar-thumb {
    background: var(--mud-palette-lines-default);
    border-radius: 3px;
}

.ua-duration-list[b-qjzhqlkrhk]::-webkit-scrollbar-thumb:hover {
    background: #9CA3AF;
}

/* ─── Responsive ─── */
@media (max-width: 960px) {
    .ua-page[b-qjzhqlkrhk] {
        padding: 16px;
    }

    .ua-stat-value[b-qjzhqlkrhk] {
        font-size: 1.3rem;
    }

    [b-qjzhqlkrhk] .ua-duration-row > .mud-tooltip-root {
        width: 140px;
        min-width: 140px;
    }

    .ua-toolbar[b-qjzhqlkrhk] {
        gap: 8px;
    }
}

@media (max-width: 600px) {
    .ua-header-icon[b-qjzhqlkrhk] {
        width: 42px;
        height: 42px;
        border-radius: 10px;
    }

    .ua-duration-controls[b-qjzhqlkrhk] {
        flex-direction: column;
        align-items: stretch;
    }

    [b-qjzhqlkrhk] .ua-duration-row > .mud-tooltip-root {
        width: 100px;
        min-width: 100px;
    }

    .ua-duration-label[b-qjzhqlkrhk] {
        font-size: 0.75rem;
    }
}
/* /Features/SystemAdmin/Pages/Users.razor.rz.scp.css */
/* ═══════════════════════════════════════
   SysAdmin User Management – Scoped CSS
   ═══════════════════════════════════════ */

/* ─── Page ─── */
.um-page[b-z8nvc421h0] {
    max-width: 1400px;
    margin: 0 auto;
    padding: 24px;
}

/* ─── Header ─── */
.um-header[b-z8nvc421h0] {
    display: flex;
    align-items: center;
    gap: 16px;
    margin-bottom: 24px;
}

.um-header-icon[b-z8nvc421h0] {
    width: 52px;
    height: 52px;
    border-radius: 14px;
    background: linear-gradient(135deg, #1E3A8A, #3B82F6);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    box-shadow: 0 4px 12px rgba(30, 58, 138, 0.25);
}

.um-header-text[b-z8nvc421h0] {
    flex: 1;
    min-width: 0;
}

/* ─── Two-Panel Layout ─── */
.um-layout[b-z8nvc421h0] {
    display: flex;
    gap: 20px;
    align-items: flex-start;
    min-height: 600px;
}

/* ─── Sidebar ─── */
.um-sidebar[b-z8nvc421h0] {
    width: 320px;
    min-width: 320px;
    background: #fff;
    border-radius: 12px;
    border: 1px solid var(--mud-palette-lines-default);
    overflow: hidden;
}

.um-sidebar-inner[b-z8nvc421h0] {
    padding: 16px;
    display: flex;
    flex-direction: column;
}

/* ─── User List ─── */
.um-user-list[b-z8nvc421h0] {
    flex: 1;
    overflow-y: auto;
    max-height: 500px;
    min-height: 200px;
    margin: 0 -16px;
}

.um-user-item[b-z8nvc421h0] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px 16px;
    cursor: pointer;
    transition: background 0.15s ease;
    border-left: 3px solid transparent;
}

.um-user-item:hover[b-z8nvc421h0] {
    background: #F0F4FF;
}

.um-user-item.active[b-z8nvc421h0] {
    background: #EEF2FF;
    border-left-color: #1E3A8A;
}

.um-user-name[b-z8nvc421h0] {
    font-size: 0.84rem;
    font-weight: 500;
    color: #1F2937;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    min-width: 0;
}

.um-user-item.active .um-user-name[b-z8nvc421h0] {
    color: #1E3A8A;
    font-weight: 600;
}

/* ─── Avatars ─── */
.um-avatar-sm[b-z8nvc421h0] {
    width: 32px;
    height: 32px;
    border-radius: 8px;
    background: #1E3A8A;
    color: #fff;
    font-size: 0.75rem;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.um-avatar-lg[b-z8nvc421h0] {
    width: 52px;
    height: 52px;
    border-radius: 14px;
    background: linear-gradient(135deg, #1E3A8A, #3B82F6);
    color: #fff;
    font-size: 1.25rem;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

/* ─── User Count ─── */
.um-user-count[b-z8nvc421h0] {
    padding: 10px 0 0;
    font-size: 0.75rem;
    color: #9CA3AF;
    text-align: center;
    border-top: 1px solid var(--mud-palette-lines-default);
}

/* ─── Empty List ─── */
.um-empty-list[b-z8nvc421h0] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 48px 16px;
}

/* ─── Detail Panel ─── */
.um-detail[b-z8nvc421h0] {
    flex: 1;
    min-width: 0;
    background: #fff;
    border-radius: 12px;
    border: 1px solid var(--mud-palette-lines-default);
    padding: 24px;
    min-height: 600px;
}

/* ─── No Selection ─── */
.um-no-selection[b-z8nvc421h0] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 8px;
    height: 100%;
    min-height: 400px;
}

/* ─── Profile Header ─── */
.um-profile[b-z8nvc421h0] {
    display: flex;
    align-items: center;
    gap: 16px;
    padding-bottom: 20px;
    margin-bottom: 20px;
    border-bottom: 1px solid var(--mud-palette-lines-default);
}

.um-profile-info[b-z8nvc421h0] {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.um-profile-name[b-z8nvc421h0] {
    font-size: 1.1rem;
    font-weight: 700;
    color: #1F2937;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.um-profile-sub[b-z8nvc421h0] {
    font-size: 0.84rem;
    color: #6B7280;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* ─── Role Badge ─── */
.um-role-badge[b-z8nvc421h0] {
    display: inline-block;
    padding: 2px 10px;
    border-radius: 6px;
    font-size: 0.72rem;
    font-weight: 600;
    letter-spacing: 0.03em;
    text-transform: uppercase;
    width: fit-content;
}

.um-role-partner[b-z8nvc421h0] {
    background: rgba(30, 58, 138, 0.08);
    color: #1E3A8A;
}

.um-role-enduser[b-z8nvc421h0] {
    background: rgba(16, 185, 129, 0.08);
    color: #047857;
}

.um-role-unauthorised[b-z8nvc421h0] {
    background: rgba(245, 158, 11, 0.08);
    color: #B45309;
}

.um-role-staff[b-z8nvc421h0] {
    background: rgba(139, 92, 246, 0.08);
    color: #6D28D9;
}

.um-role-admin[b-z8nvc421h0] {
    background: rgba(239, 68, 68, 0.08);
    color: #B91C1C;
}

.um-role-authorised[b-z8nvc421h0] {
    background: rgba(107, 114, 128, 0.08);
    color: #4B5563;
}

/* ─── Status Cards ─── */
.um-status-row[b-z8nvc421h0] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 12px;
    margin-bottom: 20px;
}

.um-status-card[b-z8nvc421h0] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 14px;
    border-radius: 10px;
    border: 1px solid var(--mud-palette-lines-default);
    transition: border-color 0.2s ease;
}

.um-status-card.good[b-z8nvc421h0] {
    border-color: #A7F3D0;
    background: #F0FDF4;
    color: #047857;
}

.um-status-card.bad[b-z8nvc421h0] {
    border-color: #FECACA;
    background: #FEF2F2;
    color: #B91C1C;
}

.um-status-card.neutral[b-z8nvc421h0] {
    border-color: var(--mud-palette-lines-default);
    background: var(--mud-palette-background);
    color: #6B7280;
}

.um-status-body[b-z8nvc421h0] {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 1px;
}

.um-status-label[b-z8nvc421h0] {
    font-size: 0.68rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    opacity: 0.7;
}

.um-status-value[b-z8nvc421h0] {
    font-size: 0.82rem;
    font-weight: 600;
}

/* ─── Sections ─── */
.um-section[b-z8nvc421h0] {
    padding: 20px 0;
    border-top: 1px solid var(--mud-palette-lines-default);
}

.um-section-head[b-z8nvc421h0] {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 14px;
}

.um-section-title[b-z8nvc421h0] {
    font-size: 0.82rem;
    font-weight: 700;
    color: #374151;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    flex: 1;
}

/* ─── Fields Grid ─── */
.um-fields-grid[b-z8nvc421h0] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
}

/* ─── Detail Field ─── */
.um-detail-field[b-z8nvc421h0] {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.um-field-label[b-z8nvc421h0] {
    font-size: 0.72rem;
    font-weight: 600;
    color: #9CA3AF;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

/* ─── Inline Status ─── */
.um-inline-status[b-z8nvc421h0] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 14px;
    border-radius: 8px;
    font-size: 0.84rem;
    font-weight: 500;
}

.um-inline-status.good[b-z8nvc421h0] {
    background: #F0FDF4;
    color: #047857;
}

.um-inline-status.bad[b-z8nvc421h0] {
    background: #FEF2F2;
    color: #B91C1C;
    flex-wrap: wrap;
}

/* ─── Access Claims ─── */
.um-claim-count[b-z8nvc421h0] {
    background: rgba(30, 58, 138, 0.08);
    color: #1E3A8A;
    font-size: 0.72rem;
    font-weight: 700;
    padding: 2px 10px;
    border-radius: 10px;
}

.um-claims-list[b-z8nvc421h0] {
    display: flex;
    flex-direction: column;
    gap: 6px;
    max-height: 320px;
    overflow-y: auto;
    padding-right: 4px;
}

.um-claim-item[b-z8nvc421h0] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px 14px;
    background: var(--mud-palette-background);
    border-radius: 8px;
    border: 1px solid var(--mud-palette-lines-default);
    transition: border-color 0.15s ease;
}

.um-claim-item:hover[b-z8nvc421h0] {
    border-color: var(--mud-palette-lines-default);
}

.um-claim-type[b-z8nvc421h0] {
    font-size: 0.72rem;
    font-weight: 600;
    color: #1E3A8A;
    background: rgba(30, 58, 138, 0.06);
    padding: 2px 10px;
    border-radius: 6px;
    white-space: nowrap;
    flex-shrink: 0;
}

.um-claim-name[b-z8nvc421h0] {
    font-size: 0.85rem;
    font-weight: 500;
    color: #1F2937;
    flex: 1;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.um-claim-id[b-z8nvc421h0] {
    font-size: 0.75rem;
    font-family: 'Cascadia Code', 'Fira Code', 'Consolas', monospace;
    color: #9CA3AF;
    flex-shrink: 0;
}

/* ─── Scrollbar ─── */
.um-user-list[b-z8nvc421h0]::-webkit-scrollbar,
.um-claims-list[b-z8nvc421h0]::-webkit-scrollbar {
    width: 5px;
}

.um-user-list[b-z8nvc421h0]::-webkit-scrollbar-track,
.um-claims-list[b-z8nvc421h0]::-webkit-scrollbar-track {
    background: transparent;
}

.um-user-list[b-z8nvc421h0]::-webkit-scrollbar-thumb,
.um-claims-list[b-z8nvc421h0]::-webkit-scrollbar-thumb {
    background: var(--mud-palette-lines-default);
    border-radius: 3px;
}

.um-user-list[b-z8nvc421h0]::-webkit-scrollbar-thumb:hover,
.um-claims-list[b-z8nvc421h0]::-webkit-scrollbar-thumb:hover {
    background: #9CA3AF;
}

/* ─── Responsive ─── */
@media (max-width: 960px) {
    .um-page[b-z8nvc421h0] {
        padding: 16px;
    }

    .um-layout[b-z8nvc421h0] {
        flex-direction: column;
    }

    .um-sidebar[b-z8nvc421h0] {
        width: 100%;
        min-width: 0;
    }

    .um-user-list[b-z8nvc421h0] {
        max-height: 250px;
    }

    .um-detail[b-z8nvc421h0] {
        min-height: auto;
    }

    .um-status-row[b-z8nvc421h0] {
        grid-template-columns: 1fr;
    }

    .um-fields-grid[b-z8nvc421h0] {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 600px) {
    .um-header[b-z8nvc421h0] {
        flex-wrap: wrap;
    }

    .um-header-icon[b-z8nvc421h0] {
        width: 42px;
        height: 42px;
        border-radius: 10px;
    }

    .um-profile[b-z8nvc421h0] {
        flex-wrap: wrap;
    }

    .um-profile-name[b-z8nvc421h0] {
        font-size: 0.95rem;
    }

    .um-claim-item[b-z8nvc421h0] {
        flex-wrap: wrap;
    }

    .um-claim-id[b-z8nvc421h0] {
        width: 100%;
    }
}
/* /Features/Tools/Pages/BankValidationTool.razor.rz.scp.css */
.bav-page[b-m0y4kcgqtm] {
    display: flex;
    justify-content: center;
    padding: 40px 20px;
    min-height: 100%;
    background: linear-gradient(135deg, #f5f7fa 0%, #e8ecf1 100%);
}

.bav-container[b-m0y4kcgqtm] {
    width: 100%;
    max-width: 620px;
    background: #fff;
    border-radius: 16px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06), 0 8px 24px rgba(0, 0, 0, 0.06);
    padding: 40px;
}

/* Header */
.bav-header[b-m0y4kcgqtm] {
    display: flex;
    align-items: center;
    gap: 16px;
    margin-bottom: 32px;
}

.bav-icon[b-m0y4kcgqtm] {
    width: 56px;
    height: 56px;
    border-radius: 14px;
    background: #0C135D;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.bav-title[b-m0y4kcgqtm] {
    font-weight: 700 !important;
    letter-spacing: -0.02em;
    color: #111827;
}

.bav-subtitle[b-m0y4kcgqtm] {
    color: #6b7280;
    margin-top: 2px;
}

/* Result Banner */
.bav-result[b-m0y4kcgqtm] {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding: 16px;
    border-radius: 10px;
    margin-bottom: 28px;
    animation: slideDown-b-m0y4kcgqtm 0.3s ease-out;
}

@keyframes slideDown-b-m0y4kcgqtm {
    from {
        opacity: 0;
        transform: translateY(-8px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.bav-result--success[b-m0y4kcgqtm] {
    background: #ecfdf5;
    border: 1px solid #a7f3d0;
    color: #065f46;
}

    .bav-result--success[b-m0y4kcgqtm]  .mud-icon-root {
        color: #059669;
    }

.bav-result--fail[b-m0y4kcgqtm] {
    background: #fef2f2;
    border: 1px solid #fecaca;
    color: #991b1b;
}

    .bav-result--fail[b-m0y4kcgqtm]  .mud-icon-root {
        color: #dc2626;
    }

.bav-result-title[b-m0y4kcgqtm] {
    font-weight: 600 !important;
    line-height: 1.3;
}

.bav-result-message[b-m0y4kcgqtm] {
    opacity: 0.85;
    margin-top: 2px;
}

.bav-result-close[b-m0y4kcgqtm] {
    opacity: 0.5;
    margin-top: -4px;
}

    .bav-result-close:hover[b-m0y4kcgqtm] {
        opacity: 1;
    }

/* Sections */
.bav-section[b-m0y4kcgqtm] {
    margin-bottom: 24px;
}

.bav-section-label[b-m0y4kcgqtm] {
    font-weight: 700 !important;
    letter-spacing: 0.08em !important;
    color: #9ca3af;
    margin-bottom: 12px;
    font-size: 0.7rem !important;
}

/* Fields */
.bav-field-row[b-m0y4kcgqtm] {
    display: flex;
    gap: 16px;
    margin-bottom: 4px;
}

.bav-field[b-m0y4kcgqtm] {
    flex: 1;
    min-width: 0;
}

.bav-field--full[b-m0y4kcgqtm] {
    flex-basis: 100%;
}

/* Actions */
.bav-actions[b-m0y4kcgqtm] {
    display: flex;
    justify-content: flex-end;
    gap: 12px;
    padding-top: 16px;
    border-top: 1px solid #f3f4f6;
    margin-top: 8px;
}

/* Responsive */
@media (max-width: 600px) {
    .bav-container[b-m0y4kcgqtm] {
        padding: 24px 20px;
        border-radius: 12px;
    }

    .bav-field-row[b-m0y4kcgqtm] {
        flex-direction: column;
        gap: 4px;
    }

    .bav-header[b-m0y4kcgqtm] {
        flex-direction: column;
        text-align: center;
    }
}
/* /Features/Tools/Pages/BulkJobTracking.razor.rz.scp.css */
/* ── Page layout ── */
.bjt-page[b-282n0xf3kp] {
    max-width: 1100px;
    margin: 0 auto;
    padding: 24px 16px 48px;
}

/* ── Header ── */
.bjt-header[b-282n0xf3kp] {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 24px;
}

.bjt-header-left[b-282n0xf3kp] {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.bjt-title[b-282n0xf3kp] {
    font-size: 1.5rem;
    font-weight: 700;
    color: var(--mud-palette-text-primary);
    margin: 0;
    line-height: 1.3;
}

.bjt-subtitle[b-282n0xf3kp] {
    font-size: 0.8rem;
    color: var(--mud-palette-text-secondary);
    font-family: monospace;
    letter-spacing: 0.02em;
}

[b-282n0xf3kp] .bjt-back {
    align-self: flex-start;
    text-transform: none;
    margin-bottom: 4px;
    padding-left: 4px;
    font-weight: 500;
}

.bjt-header-right[b-282n0xf3kp] {
    display: flex;
    align-items: center;
    gap: 6px;
    flex-shrink: 0;
}

.bjt-live-dot[b-282n0xf3kp] {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--mud-palette-success);
    animation: bjt-pulse-b-282n0xf3kp 1.5s ease-in-out infinite;
}

@keyframes bjt-pulse-b-282n0xf3kp {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.3; }
}

.bjt-live-label[b-282n0xf3kp] {
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--mud-palette-success);
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.bjt-refresh-time[b-282n0xf3kp] {
    font-size: 0.775rem;
    color: var(--mud-palette-text-secondary);
    margin-left: 8px;
    padding-left: 14px;
    border-left: 1px solid var(--mud-palette-divider);
}

/* ── Progress bar ── */
.bjt-progress-wrap[b-282n0xf3kp] {
    margin-bottom: 20px;
}

.bjt-progress-bar[b-282n0xf3kp] {
    display: flex;
    height: 8px;
    background: var(--mud-palette-background-grey);
    border-radius: 4px;
    overflow: hidden;
}

.bjt-bar[b-282n0xf3kp] {
    height: 100%;
    transition: width 0.4s ease;
}

.bjt-bar--success[b-282n0xf3kp] {
    background: var(--mud-palette-success);
}

.bjt-bar--error[b-282n0xf3kp] {
    background: var(--mud-palette-error);
}

.bjt-progress-label[b-282n0xf3kp] {
    display: block;
    margin-top: 6px;
    font-size: 0.775rem;
    color: var(--mud-palette-text-secondary);
}

/* ── Stat cards ── */
.bjt-stats[b-282n0xf3kp] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 24px;
}

.bjt-stat[b-282n0xf3kp] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 14px 16px;
    border-radius: 10px;
    background: var(--mud-palette-surface);
    border: 1px solid var(--mud-palette-divider);
    transition: box-shadow 0.15s ease;
}

.bjt-stat:hover[b-282n0xf3kp] {
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
}

.bjt-stat-body[b-282n0xf3kp] {
    display: flex;
    flex-direction: column;
}

.bjt-stat-value[b-282n0xf3kp] {
    font-size: 1.35rem;
    font-weight: 700;
    line-height: 1.2;
}

.bjt-stat-label[b-282n0xf3kp] {
    font-size: 0.75rem;
    color: var(--mud-palette-text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

/* stat colour variants */
.bjt-stat--success[b-282n0xf3kp] { color: var(--mud-palette-success); }
.bjt-stat--error[b-282n0xf3kp]   { color: var(--mud-palette-error); }
.bjt-stat--info[b-282n0xf3kp]    { color: var(--mud-palette-info); }
.bjt-stat--default[b-282n0xf3kp] { color: var(--mud-palette-text-secondary); }

.bjt-stat--success .bjt-stat-value[b-282n0xf3kp] { color: var(--mud-palette-success); }
.bjt-stat--error   .bjt-stat-value[b-282n0xf3kp] { color: var(--mud-palette-error); }
.bjt-stat--info    .bjt-stat-value[b-282n0xf3kp] { color: var(--mud-palette-info); }
.bjt-stat--default .bjt-stat-value[b-282n0xf3kp] { color: var(--mud-palette-text-primary); }

.bjt-stat--success .bjt-stat-label[b-282n0xf3kp],
.bjt-stat--error   .bjt-stat-label[b-282n0xf3kp],
.bjt-stat--info    .bjt-stat-label[b-282n0xf3kp],
.bjt-stat--default .bjt-stat-label[b-282n0xf3kp] {
    color: var(--mud-palette-text-secondary);
}

/* ── Data grid ── */
.bjt-grid-wrap[b-282n0xf3kp] {
    border-radius: 10px;
    overflow: hidden;
    border: 1px solid var(--mud-palette-divider);
}

[b-282n0xf3kp] .bjt-grid .mud-table-container {
    border-radius: 0;
}

[b-282n0xf3kp] .bjt-grid .mud-table-head th {
    font-size: 0.7rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--mud-palette-text-secondary);
    background: var(--mud-palette-background-grey);
    padding-top: 10px;
    padding-bottom: 10px;
}

/* ── Status badges ── */
.bjt-status[b-282n0xf3kp] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 3px 10px 3px 6px;
    border-radius: 20px;
    font-size: 0.8rem;
    font-weight: 600;
    white-space: nowrap;
}

.bjt-status--success[b-282n0xf3kp] {
    background: rgba(46, 125, 50, 0.1);
    color: var(--mud-palette-success);
}

.bjt-status--error[b-282n0xf3kp] {
    background: rgba(211, 47, 47, 0.1);
    color: var(--mud-palette-error);
}

.bjt-status--info[b-282n0xf3kp] {
    background: rgba(2, 136, 209, 0.1);
    color: var(--mud-palette-info);
}

.bjt-status--default[b-282n0xf3kp] {
    background: rgba(0, 0, 0, 0.06);
    color: var(--mud-palette-text-secondary);
}

/* ── Error detail row ── */
.bjt-error-detail[b-282n0xf3kp] {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    padding: 10px 16px;
    margin: 4px 12px 8px;
    background: rgba(211, 47, 47, 0.06);
    border-left: 3px solid var(--mud-palette-error);
    border-radius: 0 6px 6px 0;
    color: var(--mud-palette-error);
    font-size: 0.825rem;
    line-height: 1.5;
    word-break: break-word;
}

/* ── Loading state ── */
.bjt-loading[b-282n0xf3kp] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 16px;
    padding: 80px 0;
}

/* ── Responsive ── */
@media (max-width: 768px) {
    .bjt-stats[b-282n0xf3kp] {
        grid-template-columns: repeat(2, 1fr);
    }

    .bjt-header[b-282n0xf3kp] {
        flex-direction: column;
        align-items: flex-start;
    }

    .bjt-header-right[b-282n0xf3kp] {
        margin-top: 4px;
    }
}
/* /Features/Tools/Pages/FGSalesNoteUpload/FGSalesNoteUpload.razor.rz.scp.css */
[b-1zo8h5vs3z] .dropzone-active {
    border-color: var(--mud-palette-primary) !important;
    background: var(--mud-palette-primary-lighten) !important;
}
/* /Features/Tools/Pages/NoteTools/NoteUpload.razor.rz.scp.css */
/* Styles inherited from ToolsPage.razor.css via ::deep */
/* /Features/Tools/Pages/TGP/TGPQuoteTool.razor.rz.scp.css */
/* Styles inherited from ToolsPage.razor.css via ::deep */
/* /Features/Tools/Pages/ToolsPage.razor.rz.scp.css */
.tools-page[b-rm91szzyc3] {
    max-width: 1120px;
    margin: 0 auto;
    padding: 40px 24px 60px;
}

/* Header */
.tools-header[b-rm91szzyc3] {
    display: flex;
    align-items: center;
    gap: 16px;
    margin-bottom: 36px;
}

.tools-icon[b-rm91szzyc3] {
    width: 56px;
    height: 56px;
    border-radius: 14px;
    background: #0C135D;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.tools-title[b-rm91szzyc3] {
    font-weight: 700 !important;
    letter-spacing: -0.02em;
    color: #111827;
}

.tools-subtitle[b-rm91szzyc3] {
    color: #6b7280;
    margin-top: 2px;
}

/* Grid */
.tools-grid[b-rm91szzyc3] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
    align-items: start;
}

/* Footer */
.tools-footer[b-rm91szzyc3] {
    margin-top: 32px;
    padding-top: 20px;
    border-top: 1px solid #e5e7eb;
    display: flex;
    justify-content: center;
}

[b-rm91szzyc3] .tools-footer-link {
    text-transform: none !important;
    font-weight: 500 !important;
}

/* ===== Shared Tool Card Styles ===== */

[b-rm91szzyc3] .tool-card {
    background: #fff;
    border-radius: 14px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06), 0 6px 16px rgba(0, 0, 0, 0.05);
    display: flex;
    flex-direction: column;
    transition: box-shadow 0.2s ease;
}

    [b-rm91szzyc3] .tool-card:hover {
        box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08), 0 10px 28px rgba(0, 0, 0, 0.08);
    }

[b-rm91szzyc3] .tool-card-header {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 24px 24px 0;
}

[b-rm91szzyc3] .tool-card-icon {
    width: 44px;
    height: 44px;
    border-radius: 11px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    color: #fff;
}

[b-rm91szzyc3] .tool-card-icon--teal {
    background: #0d9488;
}

[b-rm91szzyc3] .tool-card-icon--amber {
    background: #d97706;
}

[b-rm91szzyc3] .tool-card-icon--indigo {
    background: #4f46e5;
}

[b-rm91szzyc3] .tool-card-title {
    font-weight: 650 !important;
    color: #111827;
    line-height: 1.3;
}

[b-rm91szzyc3] .tool-card-desc {
    color: #6b7280;
    line-height: 1.4;
}

[b-rm91szzyc3] .tool-card-body {
    padding: 20px 24px 8px;
    flex: 1;
}

[b-rm91szzyc3] .tool-card-actions {
    padding: 12px 24px 24px;
}

[b-rm91szzyc3] .tool-action-btn {
    width: 100%;
    background: #0C135D !important;
    color: #fff !important;
    border-radius: 8px !important;
    padding: 10px 20px !important;
    font-weight: 600 !important;
    border: none !important;
    transition: background 0.2s ease, transform 0.1s ease !important;
}

    [b-rm91szzyc3] .tool-action-btn:hover:not(:disabled) {
        background: #161d7a !important;
        transform: translateY(-1px);
    }

    [b-rm91szzyc3] .tool-action-btn:disabled {
        background: #9ca3af !important;
        cursor: not-allowed;
    }

/* Field row */
[b-rm91szzyc3] .tool-field-row {
    display: flex;
    gap: 12px;
}

    [b-rm91szzyc3] .tool-field-row > * {
        flex: 1;
        min-width: 0;
    }

/* ===== Drop Zone ===== */

[b-rm91szzyc3] .drop-zone {
    position: relative;
    border: 2px dashed #d1d5db;
    border-radius: 10px;
    padding: 24px 16px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 6px;
    background: #fafbfc;
    cursor: pointer;
    transition: all 0.2s ease;
    min-height: 96px;
}

    [b-rm91szzyc3] .drop-zone:hover {
        border-color: #9ca3af;
        background: #f3f4f6;
    }

[b-rm91szzyc3] .drop-zone-input {
    position: absolute;
    inset: 0;
    opacity: 0;
    cursor: pointer;
}

[b-rm91szzyc3] .drop-zone-icon {
    color: #9ca3af;
    font-size: 28px !important;
}

[b-rm91szzyc3] .drop-zone-icon--file {
    color: #4f46e5;
}

[b-rm91szzyc3] .drop-zone-label {
    color: #6b7280;
    text-align: center;
    font-size: 0.82rem !important;
}

[b-rm91szzyc3] .drop-zone-filename {
    color: #111827;
    font-weight: 500;
    text-align: center;
    word-break: break-all;
    font-size: 0.82rem !important;
}

/* Drop zone drag-over state */
[b-rm91szzyc3] .dropAreaDrag {
    border-color: #4f46e5 !important;
    background: #eef2ff !important;
}

/* Drop zone validation states */
[b-rm91szzyc3] .validFile {
    border-color: #22c55e !important;
    border-style: solid !important;
    background: #f0fdf4 !important;
}

[b-rm91szzyc3] .invalidFile {
    border-color: #ef4444 !important;
    border-style: solid !important;
    background: #fef2f2 !important;
}

/* Responsive */
@media (max-width: 960px) {
    .tools-grid[b-rm91szzyc3] {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 600px) {
    .tools-page[b-rm91szzyc3] {
        padding: 24px 16px 40px;
    }

    .tools-grid[b-rm91szzyc3] {
        grid-template-columns: 1fr;
    }

    .tools-header[b-rm91szzyc3] {
        flex-direction: column;
        text-align: center;
    }

    [b-rm91szzyc3] .tool-field-row {
        flex-direction: column;
        gap: 4px;
    }
}
/* /Layout/MainLayout.razor.rz.scp.css */
/* ── App shell ── */
.app-shell[b-7rlyj7ug66] {
    min-height: 100vh;
}

/* ── Main content ── */
.app-main[b-7rlyj7ug66] {
    min-height: 100vh;
    transition: margin-left 200ms cubic-bezier(0.4, 0, 0.2, 1);
}

/* Desktop: sidebar always visible, content offset */
@media (min-width: 960px) {
    .app-main--shifted[b-7rlyj7ug66] {
        margin-left: 256px;
    }
}

/* Mobile: always full width */
@media (max-width: 959.98px) {
    .app-main[b-7rlyj7ug66] {
        margin-left: 0 !important;
    }
}

@media (prefers-reduced-motion: reduce) {
    .app-main[b-7rlyj7ug66] {
        transition-duration: 0ms !important;
    }
}
/* /Layout/Navigation/SidebarNav.razor.rz.scp.css */
/* ═══════════════════════════════════════════════
   Sidebar Navigation
   Desktop: always expanded 256px, toggle to hide
   Mobile: off-canvas overlay 280px
   ═══════════════════════════════════════════════ */

/* ── Scrim (mobile only) ── */
.sb-scrim[b-cb69zur9q9] {
    position: fixed;
    inset: 0;
    z-index: 1199;
    background: rgba(0, 0, 0, 0.4);
    -webkit-tap-highlight-color: transparent;
    animation: sb-scrim-in-b-cb69zur9q9 200ms ease both;
}

@keyframes sb-scrim-in-b-cb69zur9q9 {
    from { opacity: 0; }
}

/* ── Sidebar ── */
.sb[b-cb69zur9q9] {
    position: fixed;
    top: 0;
    left: 0;
    bottom: 0;
    width: 256px;
    z-index: 1200;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    transition: transform 200ms cubic-bezier(0.4, 0, 0.2, 1),
                box-shadow 200ms cubic-bezier(0.4, 0, 0.2, 1);
}

/* ── Logo ── */
.sb-logo[b-cb69zur9q9] {
    padding: 20px 16px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    overflow: hidden;
}

.sb-logo img[b-cb69zur9q9] {
    width: 100%;
    height: auto;
    max-height: 60px;
    object-fit: contain;
    object-position: center;
}

/* ── Nav scroll ── */
.sb-nav[b-cb69zur9q9] {
    flex: 1;
    overflow-y: auto;
    overflow-x: hidden;
    padding: 8px 0;
    scrollbar-width: thin;
    scrollbar-color: transparent transparent;
}

.sb-nav:hover[b-cb69zur9q9] {
    scrollbar-color: rgba(255, 255, 255, 0.15) transparent;
}

.sb-nav[b-cb69zur9q9]::-webkit-scrollbar { width: 6px; }
.sb-nav[b-cb69zur9q9]::-webkit-scrollbar-track { background: transparent; }
.sb-nav[b-cb69zur9q9]::-webkit-scrollbar-thumb { background: transparent; border-radius: 3px; }
.sb-nav:hover[b-cb69zur9q9]::-webkit-scrollbar-thumb { background: rgba(255, 255, 255, 0.15); }

/* ── Links ── */
.sb-link[b-cb69zur9q9] {
    display: flex;
    align-items: center;
    gap: 12px;
    height: 40px;
    padding: 0 16px;
    margin: 1px 8px;
    border-radius: 6px;
    text-decoration: none !important;
    font-size: 0.8125rem;
    font-weight: 500;
    white-space: nowrap;
    overflow: hidden;
    transition: background-color 150ms ease;
}

.sb-link:hover[b-cb69zur9q9] {
    background: rgba(255, 255, 255, 0.08);
}

.sb-link--active[b-cb69zur9q9] {
    background: rgba(255, 255, 255, 0.12);
    font-weight: 600;
    box-shadow: inset 3px 0 0 currentColor;
}

.sb-link--child[b-cb69zur9q9] {
    height: 36px;
    padding-left: 44px;
    font-weight: 400;
}

.sb-link--child:hover[b-cb69zur9q9] {
    background: rgba(255, 255, 255, 0.06);
}

.sb-link--child.sb-link--active[b-cb69zur9q9] {
    font-weight: 500;
}

/* ── Icon ── */
.sb-icon[b-cb69zur9q9] {
    font-size: 20px;
    width: 24px;
    height: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    opacity: 0.9;
    line-height: 1;
}

/* ── Label ── */
.sb-label[b-cb69zur9q9] {
    overflow: hidden;
    text-overflow: ellipsis;
}

.sb-label--link[b-cb69zur9q9] {
    text-decoration: none !important;
    flex: 1;
}

/* ── Groups ── */
.sb-group[b-cb69zur9q9] {
    margin: 1px 0;
}

.sb-group-header[b-cb69zur9q9] {
    display: flex;
    align-items: center;
    gap: 12px;
    height: 40px;
    padding: 0 16px;
    margin: 1px 8px;
    border-radius: 6px;
    cursor: pointer;
    font-size: 0.8125rem;
    font-weight: 500;
    white-space: nowrap;
    user-select: none;
    overflow: hidden;
    transition: background-color 150ms ease;
}

.sb-group-header:hover[b-cb69zur9q9] {
    background: rgba(255, 255, 255, 0.08);
}

.sb-group-header--child[b-cb69zur9q9] {
    padding-left: 44px;
    height: 36px;
    font-weight: 400;
}

.sb-chevron[b-cb69zur9q9] {
    margin-left: auto;
    font-size: 18px;
    opacity: 0.4;
    flex-shrink: 0;
    transition: transform 200ms cubic-bezier(0.4, 0, 0.2, 1);
}

.sb-group--open > .sb-group-header .sb-chevron[b-cb69zur9q9] {
    transform: rotate(180deg);
    opacity: 0.6;
}

.sb-group-items[b-cb69zur9q9] {
    max-height: 0;
    overflow: hidden;
    transition: max-height 250ms cubic-bezier(0.4, 0, 0.2, 1);
}

.sb-group--open > .sb-group-items[b-cb69zur9q9] {
    max-height: 600px;
}

/* ── Footer ── */
.sb-footer-area[b-cb69zur9q9] {
    flex-shrink: 0;
    border-top: 1px solid rgba(255, 255, 255, 0.08);
}

.sb-ticket[b-cb69zur9q9] {
    display: flex;
    align-items: center;
    gap: 12px;
    width: calc(100% - 16px);
    height: 40px;
    margin: 4px 8px;
    padding: 0 16px;
    border: none;
    border-radius: 6px;
    background: none;
    cursor: pointer;
    font-size: 0.8125rem;
    font-weight: 500;
    font-family: inherit;
    white-space: nowrap;
    overflow: hidden;
    transition: background-color 150ms ease;
}

.sb-ticket:hover[b-cb69zur9q9] {
    background: rgba(255, 255, 255, 0.08);
}

/* ═══════════════════════════════════════════════
   DESKTOP (>=960px)
   ═══════════════════════════════════════════════ */
@media (min-width: 960px) {
    .sb[b-cb69zur9q9] {
        transform: translateX(0);
        box-shadow: 1px 0 0 rgba(0, 0, 0, 0.06);
    }

    .sb:not(.sb--open)[b-cb69zur9q9] {
        transform: translateX(-100%);
    }

    .sb-scrim[b-cb69zur9q9] {
        display: none !important;
    }
}

/* ═══════════════════════════════════════════════
   MOBILE (<960px)
   ═══════════════════════════════════════════════ */
@media (max-width: 959.98px) {
    .sb[b-cb69zur9q9] {
        width: 280px;
        transform: translateX(-100%);
        box-shadow: none;
    }

    .sb.sb--mobile[b-cb69zur9q9] {
        transform: translateX(0);
        box-shadow: 4px 0 24px rgba(0, 0, 0, 0.15);
    }

    .sb-link[b-cb69zur9q9] {
        height: 48px;
        font-size: 0.875rem;
        margin: 1px 6px;
        padding: 0 14px;
    }

    .sb-link--child[b-cb69zur9q9] {
        height: 44px;
        padding-left: 44px;
    }

    .sb-group-header[b-cb69zur9q9] {
        height: 48px;
        font-size: 0.875rem;
        margin: 1px 6px;
        padding: 0 14px;
    }

    .sb-group-header--child[b-cb69zur9q9] {
        height: 44px;
        padding-left: 44px;
    }

    .sb-ticket[b-cb69zur9q9] {
        height: 48px;
        font-size: 0.875rem;
    }

    .sb-logo[b-cb69zur9q9] {
        height: 56px;
    }

    .sb-logo img[b-cb69zur9q9] {
        height: 26px;
    }
}

/* ═══════════════════════════════════════════════
   Accessibility
   ═══════════════════════════════════════════════ */
@media (prefers-reduced-motion: reduce) {
    .sb[b-cb69zur9q9], .sb-chevron[b-cb69zur9q9], .sb-group-items[b-cb69zur9q9],
    .sb-link[b-cb69zur9q9], .sb-group-header[b-cb69zur9q9], .sb-scrim[b-cb69zur9q9] {
        transition-duration: 0ms !important;
        animation-duration: 0ms !important;
    }
}

.sb-link:focus-visible[b-cb69zur9q9],
.sb-group-header:focus-visible[b-cb69zur9q9],
.sb-ticket:focus-visible[b-cb69zur9q9] {
    outline: 2px solid rgba(255, 255, 255, 0.6);
    outline-offset: -2px;
}
/* /Layout/Shared/NotFoundPage.razor.rz.scp.css */
.nf[b-927f10v4gi] {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 70vh;
    position: relative;
    overflow: hidden;
    padding: 2rem;
}

/* Slow-drifting radial accent — adds atmosphere without distraction */
.nf-accent[b-927f10v4gi] {
    position: absolute;
    width: 480px;
    height: 480px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(25, 118, 210, 0.06) 0%, transparent 70%);
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    animation: nf-drift-b-927f10v4gi 20s ease-in-out infinite;
    pointer-events: none;
}

.nf-content[b-927f10v4gi] {
    text-align: center;
    position: relative;
    z-index: 1;
    max-width: 400px;
}

.nf-code[b-927f10v4gi] {
    font-family: 'Plus Jakarta Sans', sans-serif;
    font-size: clamp(6rem, 15vw, 10rem);
    font-weight: 800;
    letter-spacing: -0.04em;
    line-height: 1;
    margin: 0 0 0.25rem;
    background: linear-gradient(160deg, #1a1a2e 30%, #16213e 60%, #0f3460 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    opacity: 0;
    animation: nf-fade-up-b-927f10v4gi 0.6s cubic-bezier(0.16, 1, 0.3, 1) 0.1s forwards;
}

.nf-title[b-927f10v4gi] {
    font-family: 'Plus Jakarta Sans', sans-serif;
    font-size: 1.25rem;
    font-weight: 600;
    color: #1a1a2e;
    margin: 0 0 0.625rem;
    letter-spacing: -0.01em;
    opacity: 0;
    animation: nf-fade-up-b-927f10v4gi 0.6s cubic-bezier(0.16, 1, 0.3, 1) 0.2s forwards;
}

.nf-subtitle[b-927f10v4gi] {
    font-family: 'Plus Jakarta Sans', sans-serif;
    font-size: 0.9rem;
    font-weight: 400;
    color: #64748b;
    margin: 0 0 2.5rem;
    line-height: 1.6;
    opacity: 0;
    animation: nf-fade-up-b-927f10v4gi 0.6s cubic-bezier(0.16, 1, 0.3, 1) 0.3s forwards;
}

.nf-link[b-927f10v4gi] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    font-family: 'Plus Jakarta Sans', sans-serif;
    font-size: 0.8125rem;
    font-weight: 600;
    color: #1976d2;
    text-decoration: none;
    padding: 0.625rem 1.25rem;
    border: 1.5px solid #1976d2;
    border-radius: 100px;
    transition: all 0.25s cubic-bezier(0.16, 1, 0.3, 1);
    opacity: 0;
    animation: nf-fade-up-b-927f10v4gi 0.6s cubic-bezier(0.16, 1, 0.3, 1) 0.4s forwards;
}

.nf-link:hover[b-927f10v4gi] {
    background: #1976d2;
    color: #fff;
    transform: translateY(-1px);
    box-shadow: 0 4px 20px rgba(25, 118, 210, 0.25);
}

.nf-link-icon[b-927f10v4gi] {
    display: flex;
    transition: transform 0.25s cubic-bezier(0.16, 1, 0.3, 1);
}

.nf-link:hover .nf-link-icon[b-927f10v4gi] {
    transform: translateX(-3px);
}

@keyframes nf-fade-up-b-927f10v4gi {
    from {
        opacity: 0;
        transform: translateY(12px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes nf-drift-b-927f10v4gi {
    0%, 100% { transform: translate(-50%, -50%) scale(1); }
    50% { transform: translate(-45%, -55%) scale(1.08); }
}

/* Dark mode support */
:global(.mud-theme-dark) .nf-code[b-927f10v4gi] {
    background: linear-gradient(160deg, #e2e8f0 30%, #94a3b8 60%, #64748b 100%);
    -webkit-background-clip: text;
    background-clip: text;
}

:global(.mud-theme-dark) .nf-title[b-927f10v4gi] {
    color: #e2e8f0;
}

:global(.mud-theme-dark) .nf-subtitle[b-927f10v4gi] {
    color: #94a3b8;
}

:global(.mud-theme-dark) .nf-accent[b-927f10v4gi] {
    background: radial-gradient(circle, rgba(96, 165, 250, 0.08) 0%, transparent 70%);
}