/* /Components/Account/Shared/ManageLayout.razor.rz.scp.css */
/* ManageLayout Styles */

.manage-content[b-g360k2x9ys] {
    background: white;
    border-radius: 0.5rem;
    padding: 2rem;
    box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075);
}

.manage-content h3[b-g360k2x9ys] {
    font-size: 1.75rem;
    font-weight: 600;
    margin-bottom: 1rem;
    color: #212529;
}

.manage-content h5[b-g360k2x9ys] {
    font-size: 1.25rem;
    font-weight: 600;
    margin-top: 1.5rem;
    margin-bottom: 1rem;
    color: #495057;
}

/* Form styling within manage pages */
.manage-content .form-floating[b-g360k2x9ys] {
    margin-bottom: 1rem;
}

.manage-content .btn-lg[b-g360k2x9ys] {
    padding: 0.75rem 1.5rem;
    font-size: 1.125rem;
}

.manage-content hr[b-g360k2x9ys] {
    margin: 2rem 0;
    opacity: 0.1;
}

/* List group styling */
.manage-content .list-group-item[b-g360k2x9ys] {
    border: 1px solid #e9ecef;
    border-radius: 0.375rem;
    margin-bottom: 0.5rem;
    padding: 1rem;
}

.manage-content .list-group-item:last-child[b-g360k2x9ys] {
    margin-bottom: 0;
}

/* Badge styling */
.manage-content .badge[b-g360k2x9ys] {
    font-size: 0.75rem;
    font-weight: 500;
    padding: 0.35rem 0.65rem;
}

/* Responsive */
@media (max-width: 991.98px) {
    .manage-content[b-g360k2x9ys] {
        padding: 1.5rem;
        margin-top: 1rem;
    }
}

@media (max-width: 575.98px) {
    .manage-content[b-g360k2x9ys] {
        padding: 1rem;
        box-shadow: none;
        border-radius: 0;
    }
}
/* /Components/Account/Shared/ManageNavMenu.razor.rz.scp.css */
/* ManageNavMenu Styles */

.nav-pills[b-8mihhrwrjo] {
    gap: 0.25rem;
}

.nav-pills .nav-link[b-8mihhrwrjo] {
    border-radius: 0.375rem;
    padding: 0.75rem 1rem;
    color: #6c757d;
    transition: all 0.2s ease-in-out;
    font-weight: 500;
    display: flex;
    align-items: center;
}

.nav-pills .nav-link:hover[b-8mihhrwrjo] {
    background-color: #f8f9fa;
    color: #495057;
}

.nav-pills .nav-link.active[b-8mihhrwrjo] {
    background-color: #0d6efd;
    color: white;
}

.nav-pills .nav-link i[b-8mihhrwrjo] {
    font-size: 1.1rem;
    opacity: 0.8;
}

.nav-pills .nav-link.active i[b-8mihhrwrjo] {
    opacity: 1;
}

/* Responsive adjustments */
@media (max-width: 991.98px) {
    .nav-pills[b-8mihhrwrjo] {
        margin-bottom: 1.5rem;
    }
}
/* /Components/Admin/ContentBlocks/ContentBlockEdit.razor.rz.scp.css */
.modern-table-card[b-ipvc6mz70y] {
    background: white;
    border-radius: 0.25rem;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06);
    border: 1px solid #e0e0e0;
    overflow: hidden;
    margin-bottom: 2rem;
}

.table-header[b-ipvc6mz70y] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1.25rem 1.5rem;
    background: #fafafa;
    border-bottom: 1px solid #e0e0e0;
}

.table-title[b-ipvc6mz70y] {
    margin: 0;
    font-size: 1rem;
    font-weight: 700;
    color: #212529;
    display: flex;
    align-items: center;
}

.table-title i[b-ipvc6mz70y] {
    color: var(--bs-primary);
}

/* Wrapper constrains the editor � prevents it overflowing onto buttons */
.quill-wrapper[b-ipvc6mz70y] {
    position: relative;
}

[b-ipvc6mz70y] .ql-toolbar.ql-snow {
    border-color: #dee2e6;
    border-top-left-radius: 0.375rem;
    border-top-right-radius: 0.375rem;
    background: #fafafa;
}

[b-ipvc6mz70y] .ql-container.ql-snow {
    border-color: #dee2e6;
    border-bottom-left-radius: 0.375rem;
    border-bottom-right-radius: 0.375rem;
    font-size: 1rem;
    font-family: var(--bs-body-font-family);
}

[b-ipvc6mz70y] .ql-editor {
    min-height: 240px;
    max-height: 480px;
    overflow-y: auto;
    color: #212529;
}
/* /Components/Admin/ContentBlocks/ContentBlocksList.razor.rz.scp.css */
.modern-search-toolbar[b-j0j3yknh5t] {
    background: white;
    border-radius: 0.25rem;
    padding: 1.5rem;
    margin-bottom: 2rem;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06);
    border: 1px solid #e0e0e0;
}

.toolbar-main[b-j0j3yknh5t] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
}

.search-section[b-j0j3yknh5t] {
    flex: 1;
}

.toolbar-controls[b-j0j3yknh5t] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.modern-table-card[b-j0j3yknh5t] {
    background: white;
    border-radius: 0.25rem;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06);
    border: 1px solid #e0e0e0;
    overflow: hidden;
    margin-bottom: 2rem;
}

.table-header[b-j0j3yknh5t] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1.25rem 1.5rem;
    background: #fafafa;
    border-bottom: 1px solid #e0e0e0;
}

.table-title[b-j0j3yknh5t] {
    margin: 0;
    font-size: 1rem;
    font-weight: 700;
    color: #212529;
    display: flex;
    align-items: center;
}

.table-title i[b-j0j3yknh5t] {
    color: var(--bs-primary);
}

.modern-admin-table[b-j0j3yknh5t] {
    width: 100%;
    border-collapse: collapse;
    background: white;
}

.modern-admin-table thead th[b-j0j3yknh5t] {
    background: #fafafa;
    padding: 0.75rem 1rem;
    font-weight: 600;
    color: #333;
    text-align: left;
    border-bottom: 1px solid #e0e0e0;
    font-size: 0.8rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.modern-admin-table tbody tr[b-j0j3yknh5t] {
    border-bottom: 1px solid #f0f0f0;
    transition: background 0.15s ease;
}

.modern-admin-table tbody tr:hover[b-j0j3yknh5t] {
    background: #fafafa;
}

.modern-admin-table tbody td[b-j0j3yknh5t] {
    padding: 0.875rem 1rem;
    vertical-align: middle;
}

.modern-empty-card[b-j0j3yknh5t] {
    text-align: center;
    background: #fafafa;
    border: 1px dashed #d0d0d0;
    border-radius: 0.25rem;
    padding: 4rem 2rem;
    margin: 1.5rem;
}

.empty-icon[b-j0j3yknh5t] {
    width: 56px;
    height: 56px;
    border-radius: 0.25rem;
    background: rgba(8, 147, 163, 0.1);
    color: var(--bs-primary);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.75rem;
    margin: 0 auto 1.25rem;
}

.empty-content h5[b-j0j3yknh5t] {
    margin: 0 0 0.5rem;
    color: #212529;
}
/* /Components/Admin/EmailTemplates/EmailTemplatesView.razor.rz.scp.css */
/* ============================================================
   Admin – Email Templates View
   ============================================================ */

/* ── Toolbar (mirrors admin pattern) ─────────────────────── */
.modern-search-toolbar[b-z1zxju572l] {
    background: white;
    border-radius: 0.25rem;
    padding: 1.25rem 1.5rem;
    margin-bottom: 1.5rem;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06);
    border: 1px solid #e0e0e0;
}

.toolbar-main[b-z1zxju572l] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
}

.search-section[b-z1zxju572l] { flex: 1; }

.toolbar-controls[b-z1zxju572l] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

/* ── Card (mirrors admin pattern) ────────────────────────── */
.modern-table-card[b-z1zxju572l] {
    background: white;
    border-radius: 0.25rem;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06);
    border: 1px solid #e0e0e0;
    overflow: hidden;
    margin-bottom: 2rem;
}

.table-header[b-z1zxju572l] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1rem 1.5rem;
    background: #fafafa;
    border-bottom: 1px solid #e0e0e0;
}

.table-title[b-z1zxju572l] {
    margin: 0;
    font-size: 1rem;
    font-weight: 600;
    color: #1a1a1a;
    display: flex;
    align-items: center;
}

.table-title i[b-z1zxju572l] {
    color: var(--bs-primary);
}

/* ── Empty state (mirrors admin pattern) ─────────────────── */
.modern-empty-card[b-z1zxju572l] {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 3rem 2rem;
    text-align: center;
}

.empty-icon[b-z1zxju572l] {
    font-size: 2.5rem;
    color: var(--bs-primary);
    margin-bottom: 1rem;
    opacity: 0.5;
}

/* ── Summary pills (mirrors PlaceholdersView) ────────────── */
.summary-pills[b-z1zxju572l] {
    display: flex;
    gap: 0.625rem;
    flex-wrap: wrap;
}

.summary-pill[b-z1zxju572l] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.5rem 1rem;
    background: white;
    border: 1px solid #e0e0e0;
    border-radius: 0.25rem;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
}

.summary-pill-count[b-z1zxju572l] {
    font-size: 1.375rem;
    font-weight: 700;
    color: var(--bs-primary);
    line-height: 1;
}

.summary-pill-label[b-z1zxju572l] {
    font-size: 0.8125rem;
    font-weight: 600;
    color: #6c757d;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.summary-pill-warn .summary-pill-count[b-z1zxju572l] { color: var(--bs-warning); }
.summary-pill-warn[b-z1zxju572l] { border-color: color-mix(in srgb, var(--bs-warning) 40%, #e0e0e0); }

/* ── Modern admin table (mirrors ProfessionalsView) ──────── */
.modern-admin-table[b-z1zxju572l] {
    width: 100%;
    border-collapse: collapse;
    background: white;
}

.modern-admin-table thead th[b-z1zxju572l] {
    background: #fafafa;
    padding: 0.75rem 1rem;
    font-weight: 600;
    color: #555;
    text-align: left;
    border-bottom: 1px solid #e0e0e0;
    font-size: 0.8125rem;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    white-space: nowrap;
}

.modern-admin-table tbody tr[b-z1zxju572l] {
    border-bottom: 1px solid #f0f0f0;
    transition: background 0.15s ease;
}

.modern-admin-table tbody tr:hover[b-z1zxju572l] {
    background: #fafafa;
}

.modern-admin-table tbody td[b-z1zxju572l] {
    padding: 0.875rem 1rem;
    vertical-align: middle;
}

/* ── Row states ───────────────────────────────────────────── */
.et-editing-row td[b-z1zxju572l] {
    background: color-mix(in srgb, var(--bs-primary) 4%, white) !important;
    vertical-align: middle;
}

.et-testing-row-parent td[b-z1zxju572l] {
    border-bottom: none !important;
}

/* ── Test / assign panel rows ────────────────────────────── */
.et-test-panel-row td[b-z1zxju572l] {
    background: #f0faf0 !important;
    padding: 0.75rem 1rem !important;
    border-top: none !important;
}

.et-test-panel[b-z1zxju572l] {
    display: flex;
    flex-direction: column;
}

.et-test-form[b-z1zxju572l] {
    display: flex;
    gap: 0.5rem;
    align-items: center;
    flex-wrap: wrap;
}

.et-test-email-input[b-z1zxju572l] {
    max-width: 280px;
}

/* ── Page-specific cell styles ───────────────────────────── */
.et-alias[b-z1zxju572l] {
    font-family: 'SFMono-Regular', Consolas, monospace;
    font-size: 0.875rem;
    font-weight: 600;
    color: #1a1a1a;
    background: #f4f4f8;
    padding: 0.125rem 0.5rem;
    border-radius: 0.2rem;
    white-space: nowrap;
}

.et-template-id[b-z1zxju572l] {
    font-family: 'SFMono-Regular', Consolas, monospace;
    font-size: 0.9375rem;
    font-weight: 600;
    color: var(--bs-primary);
}

.et-param-badge[b-z1zxju572l] {
    background: color-mix(in srgb, var(--bs-primary) 10%, white);
    color: var(--bs-primary);
    font-size: 0.725rem;
    font-weight: 500;
    border: 1px solid color-mix(in srgb, var(--bs-primary) 25%, white);
    font-family: 'SFMono-Regular', Consolas, monospace;
}

/* ── Unassigned templates section (Brevo Connection footer) ─ */
.et-unassigned-section[b-z1zxju572l] {
    padding: 1rem 1.5rem;
    border-top: 1px solid #f0f0f0;
}

.et-unassigned-chips[b-z1zxju572l] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    margin-bottom: 0;
}

.et-unassigned-chip[b-z1zxju572l] {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    padding: 0.375rem 0.75rem;
    background: white;
    border: 1px solid #d0d0d0;
    border-radius: 0.25rem;
    font-size: 0.875rem;
    cursor: pointer;
    transition: all 0.15s ease;
    color: #333;
}

.et-unassigned-chip:hover[b-z1zxju572l] {
    border-color: var(--bs-primary);
    color: var(--bs-primary);
    background: color-mix(in srgb, var(--bs-primary) 5%, white);
}

.et-unassigned-chip-active[b-z1zxju572l] {
    border-color: var(--bs-primary);
    color: var(--bs-primary);
    background: color-mix(in srgb, var(--bs-primary) 8%, white);
}

.et-chip-id[b-z1zxju572l] {
    font-family: 'SFMono-Regular', Consolas, monospace;
    font-size: 0.8125rem;
    font-weight: 600;
    color: var(--bs-primary);
}

.et-chip-name[b-z1zxju572l] { font-weight: 500; }

.et-assign-panel[b-z1zxju572l] {
    padding: 0.875rem 1rem;
    background: color-mix(in srgb, var(--bs-primary) 4%, white);
    border: 1px solid color-mix(in srgb, var(--bs-primary) 20%, #e0e0e0);
    border-radius: 0.25rem;
}

.et-id-input[b-z1zxju572l]        { width: 100px; }
.et-template-select[b-z1zxju572l] { min-width: 220px; }
/* /Components/Admin/FreeAgent/FreeAgentSettingsView.razor.rz.scp.css */
/* ═══════════════════════════════════════════════════════
   SHARED: Banner
   ═══════════════════════════════════════════════════════ */
.reports-banner[b-gripmg1agn] {
    display: flex;
    align-items: flex-start;
    gap: 1.25rem;
    background: white;
    border: 1px solid #e0e0e0;
    border-left: 4px solid var(--bs-primary);
    border-radius: 0.375rem;
    padding: 1.5rem;
    box-shadow: 0 1px 3px rgba(0,0,0,0.06);
}

.reports-banner-icon[b-gripmg1agn] {
    font-size: 2rem;
    color: var(--bs-primary);
    flex-shrink: 0;
    line-height: 1;
}

.reports-banner-body[b-gripmg1agn] { flex: 1; }

.reports-banner-title[b-gripmg1agn] { font-weight: 700; margin-bottom: 0.35rem; }

.reports-banner-text[b-gripmg1agn] { color: #555; margin-bottom: 0; font-size: 0.9375rem; }

.reports-banner-badge[b-gripmg1agn] { flex-shrink: 0; align-self: center; }

/* ═══════════════════════════════════════════════════════
   SHARED: Report cards
   ═══════════════════════════════════════════════════════ */
.report-card[b-gripmg1agn] {
    display: flex;
    flex-direction: column;
    background: white;
    border: 1px solid #e0e0e0;
    border-radius: 0.5rem;
    overflow: hidden;
    box-shadow: 0 1px 3px rgba(0,0,0,0.06);
    height: 100%;
    transition: box-shadow 0.2s ease, transform 0.2s ease;
}

.report-card:hover[b-gripmg1agn] {
    box-shadow: 0 4px 12px rgba(0,0,0,0.1);
    transform: translateY(-2px);
}

.report-card-icon[b-gripmg1agn] {
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 2rem;
    padding: 1.5rem;
    border-bottom: 1px solid #f0f0f0;
}

.report-card-body[b-gripmg1agn] { flex: 1; padding: 1.25rem; }

.report-card-title[b-gripmg1agn] { font-weight: 700; font-size: 0.9375rem; margin-bottom: 0.5rem; }

.report-card-text[b-gripmg1agn] { color: #666; font-size: 0.875rem; margin-bottom: 0.75rem; line-height: 1.6; }

.report-card-tags[b-gripmg1agn] { display: flex; flex-wrap: wrap; gap: 0.375rem; }

.tag[b-gripmg1agn] {
    display: inline-block;
    padding: 0.2rem 0.6rem;
    font-size: 0.72rem;
    font-weight: 600;
    border-radius: 999px;
    background: #f0f4ff;
    color: #3a5bd9;
    border: 1px solid #d0d9ff;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

.report-card-footer[b-gripmg1agn] {
    padding: 0.875rem 1.25rem;
    background: #fafafa;
    border-top: 1px solid #f0f0f0;
}

/* ═══════════════════════════════════════════════════════
   SHARED: Toolbar
   ═══════════════════════════════════════════════════════ */
.modern-search-toolbar[b-gripmg1agn] {
    background: white;
    border-radius: 0.375rem;
    padding: 1.25rem 1.5rem;
    border: 1px solid #e0e0e0;
    box-shadow: 0 1px 3px rgba(0,0,0,0.06);
}

/* ═══════════════════════════════════════════════════════
   SHARED: Table card
   ═══════════════════════════════════════════════════════ */
.modern-table-card[b-gripmg1agn] {
    background: white;
    border: 1px solid #e0e0e0;
    border-radius: 0.5rem;
    overflow: hidden;
    box-shadow: 0 1px 3px rgba(0,0,0,0.06);
}

.table-header[b-gripmg1agn] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1rem 1.25rem;
    border-bottom: 1px solid #ebebeb;
    background: #fafafa;
}

.table-title[b-gripmg1agn] { margin: 0; font-size: 0.9375rem; font-weight: 700; }

.table-actions[b-gripmg1agn] { display: flex; gap: 0.5rem; }

.modern-admin-table[b-gripmg1agn] { width: 100%; border-collapse: collapse; font-size: 0.875rem; }

.modern-admin-table thead tr[b-gripmg1agn] { background: #f8f9fa; border-bottom: 2px solid #e9ecef; }

.modern-admin-table th[b-gripmg1agn] { padding: 0.75rem 1rem; font-weight: 600; color: #495057; white-space: nowrap; }

.modern-admin-table tbody tr[b-gripmg1agn] { border-bottom: 1px solid #f3f3f3; transition: background-color 0.15s; }

.modern-admin-table tbody tr:hover[b-gripmg1agn] { background-color: #f8f9ff; }

.modern-admin-table td[b-gripmg1agn] { padding: 0.75rem 1rem; vertical-align: middle; }

/* ═══════════════════════════════════════════════════════
   SHARED: Skeleton loader
   ═══════════════════════════════════════════════════════ */
.table-skeleton[b-gripmg1agn] { padding: 0.5rem 1.25rem; }

.skeleton-row[b-gripmg1agn] {
    display: flex;
    gap: 1rem;
    align-items: center;
    padding: 0.75rem 0;
    border-bottom: 1px solid #f3f3f3;
}

.skeleton-cell[b-gripmg1agn] {
    height: 1rem;
    background: linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 50%, #f0f0f0 75%);
    background-size: 200% 100%;
    animation: shimmer-b-gripmg1agn 1.4s infinite;
    border-radius: 0.25rem;
    flex-shrink: 0;
}

@keyframes shimmer-b-gripmg1agn {
    0%   { background-position: 200% 0; }
    100% { background-position: -200% 0; }
}

/* ═══════════════════════════════════════════════════════
   SHARED: Empty state
   ═══════════════════════════════════════════════════════ */
.sa-empty-state[b-gripmg1agn] { text-align: center; padding: 3rem 1rem; }

.sa-empty-icon[b-gripmg1agn] { font-size: 3rem; color: #d1d5db; margin-bottom: 1rem; }

.sa-empty-title[b-gripmg1agn] { font-size: 1.125rem; font-weight: 700; color: #4b5563; margin-bottom: 0.5rem; }

.sa-empty-text[b-gripmg1agn] { font-size: 0.9rem; color: #9ca3af; margin: 0; }

/* ═══════════════════════════════════════════════════════
   FA: Status badges
   ═══════════════════════════════════════════════════════ */
.fa-status-badge[b-gripmg1agn] {
    display: inline-flex;
    align-items: center;
    padding: 0.3rem 0.75rem;
    border-radius: 999px;
    font-size: 0.78rem;
    font-weight: 600;
    white-space: nowrap;
}

.fa-status-connected[b-gripmg1agn]    { background: #d1fae5; color: #065f46; border: 1px solid #6ee7b7; }
.fa-status-disconnected[b-gripmg1agn] { background: #fee2e2; color: #991b1b; border: 1px solid #fca5a5; }
.fa-status-partial[b-gripmg1agn]      { background: #fff3cd; color: #856404; border: 1px solid #fde68a; }

/* ═══════════════════════════════════════════════════════
   FA: Tab strip
   ═══════════════════════════════════════════════════════ */
.fa-tab-strip[b-gripmg1agn] {
    display: flex;
    gap: 0.25rem;
    border-bottom: 2px solid #e9ecef;
    padding-bottom: 0;
}

.fa-tab[b-gripmg1agn] {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0.6rem 1.1rem;
    font-size: 0.9rem;
    font-weight: 600;
    color: #6c757d;
    background: none;
    border: none;
    border-bottom: 3px solid transparent;
    margin-bottom: -2px;
    cursor: pointer;
    border-radius: 0.375rem 0.375rem 0 0;
    transition: color 0.15s, border-color 0.15s, background 0.15s;
}

.fa-tab:hover[b-gripmg1agn] { color: #212529; background: #f8f9fa; }

.fa-tab-active[b-gripmg1agn] {
    color: var(--bs-primary);
    border-bottom-color: var(--bs-primary);
    background: none;
}

.fa-tab-badge[b-gripmg1agn] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 1.25rem;
    height: 1.25rem;
    padding: 0 0.35rem;
    font-size: 0.7rem;
    font-weight: 700;
    background: #dc3545;
    color: white;
    border-radius: 999px;
    line-height: 1;
}

/* ═══════════════════════════════════════════════════════
   FA: Connection card detail rows
   ═══════════════════════════════════════════════════════ */
.fa-detail-row[b-gripmg1agn] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.4rem 0;
    border-bottom: 1px solid #f3f3f3;
    font-size: 0.875rem;
}

.fa-detail-row:last-child[b-gripmg1agn] { border-bottom: none; }

.fa-detail-label[b-gripmg1agn] {
    min-width: 160px;
    font-weight: 600;
    color: #6c757d;
    font-size: 0.8rem;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

.fa-detail-value[b-gripmg1agn] { color: #1a1a1a; }

/* ═══════════════════════════════════════════════════════
   FA: How it works steps
   ═══════════════════════════════════════════════════════ */
.fa-steps[b-gripmg1agn] { padding-left: 1.25rem; color: #555; font-size: 0.875rem; line-height: 1.7; }

.fa-steps li[b-gripmg1agn] { margin-bottom: 0.4rem; }

/* ═══════════════════════════════════════════════════════
   FA: Bank accounts empty / URL code
   ═══════════════════════════════════════════════════════ */
.fa-empty-accounts[b-gripmg1agn] { padding: 2.5rem 1.5rem; text-align: center; color: #9ca3af; }

.fa-empty-accounts i[b-gripmg1agn] { font-size: 2.5rem; opacity: 0.3; display: block; margin-bottom: 0.75rem; }

.fa-empty-accounts p[b-gripmg1agn] { margin: 0; font-size: 0.9rem; }

.fa-url-code[b-gripmg1agn] {
    font-size: 0.78rem;
    word-break: break-all;
    color: #1a56b0;
    background: #f0f4ff;
    padding: 0.2rem 0.4rem;
    border-radius: 0.25rem;
}

/* ═══════════════════════════════════════════════════════
   FA: Manual import panel
   ═══════════════════════════════════════════════════════ */
.fa-import-panel[b-gripmg1agn] {
    background: white;
    border: 1px solid #e0e0e0;
    border-radius: 0.5rem;
    box-shadow: 0 1px 3px rgba(0,0,0,0.06);
    overflow: hidden;
}

.fa-import-panel-body[b-gripmg1agn] {
    display: flex;
    align-items: flex-end;
    gap: 1.25rem;
    padding: 1rem 1.25rem;
    flex-wrap: wrap;
}

.fa-import-title[b-gripmg1agn] { font-weight: 700; font-size: 0.9375rem; color: #212529; align-self: center; white-space: nowrap; }

.fa-import-fields[b-gripmg1agn] { display: flex; align-items: flex-end; gap: 0.75rem; flex-wrap: wrap; }

.fa-import-field[b-gripmg1agn] { display: flex; flex-direction: column; gap: 0.25rem; }

.fa-import-label[b-gripmg1agn] {
    font-size: 0.75rem;
    font-weight: 600;
    color: #6c757d;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.fa-import-result[b-gripmg1agn] {
    display: flex;
    align-items: center;
    padding: 0.65rem 1.25rem;
    font-size: 0.875rem;
    font-weight: 500;
    border-top: 1px solid #f0f0f0;
}

.fa-import-ok[b-gripmg1agn]  { background: #f0fdf4; color: #065f46; }
.fa-import-err[b-gripmg1agn] { background: #fef2f2; color: #991b1b; }

/* ── Manual entry panel ── */
/* Let the fields row fill the body so everything stays on one line on wide screens. */
.fa-manual-fields[b-gripmg1agn] { flex: 1 1 auto; min-width: 0; }

/* Description grows to absorb spare width; the others stay compact. */
.fa-manual-desc[b-gripmg1agn] { flex: 1 1 240px; min-width: 180px; }
.fa-manual-fields .fa-import-field:not(.fa-manual-desc)[b-gripmg1agn] { flex: 0 0 auto; }
.fa-manual-amount[b-gripmg1agn] { width: 130px; }

/* Button aligns with the inputs and never shrinks onto its own line. */
.fa-manual-add[b-gripmg1agn] { flex: 0 0 auto; white-space: nowrap; height: calc(1.5em + 0.5rem + 2px); }

/* Hint sits on its own muted footer line under the inputs. */
.fa-manual-hint[b-gripmg1agn] {
    padding: 0.55rem 1.25rem;
    border-top: 1px solid #f0f0f0;
    background: #fafafa;
    font-size: 0.75rem;
    color: #6c757d;
}

/* ═══════════════════════════════════════════════════════
   TX: Table column widths — no horizontal scroll
   ═══════════════════════════════════════════════════════ */
.tx-table[b-gripmg1agn] { table-layout: fixed; width: 100%; }

.tx-col-date[b-gripmg1agn]    { width: 76px;  white-space: nowrap; }
.tx-col-amount[b-gripmg1agn]  { width: 90px;  white-space: nowrap; }
.tx-col-actions[b-gripmg1agn] { width: 76px;  white-space: nowrap; vertical-align: middle; }
.tx-col-account[b-gripmg1agn] { width: 21%; }
.tx-col-adj[b-gripmg1agn]     { width: 18%; }
.tx-col-desc[b-gripmg1agn]    { width: 22%;   overflow-wrap: break-word; word-break: break-word; white-space: normal; }

/* Keep both action buttons on one line */
.tx-col-actions .d-inline-flex[b-gripmg1agn] { flex-wrap: nowrap; }
.tx-col-actions .btn[b-gripmg1agn] { padding: 0.2rem 0.4rem; line-height: 1.4; }

.tx-row-hidden[b-gripmg1agn]  { opacity: 0.5; }
.tx-full-desc[b-gripmg1agn]   { display: block; word-break: break-word; overflow-wrap: break-word; white-space: normal; }

/* ═══════════════════════════════════════════════════════
   TX: Table cells
   ═══════════════════════════════════════════════════════ */
.tx-date[b-gripmg1agn]        { font-size: 0.875rem; color: #6c757d; white-space: nowrap; }
.tx-description[b-gripmg1agn] { font-size: 0.875rem; color: #1a1a1a; display: block; word-break: break-word; overflow-wrap: break-word; white-space: normal; }

.tx-amount[b-gripmg1agn]      { font-weight: 700; font-size: 0.9rem; white-space: nowrap; }
.tx-credit[b-gripmg1agn]      { color: #065f46; }
.tx-debit[b-gripmg1agn]       { color: #991b1b; }

.tx-match-cell[b-gripmg1agn]  { min-width: 0; }

.tx-account-error[b-gripmg1agn] { font-size: 0.75rem; color: #dc3545; margin-top: 0.3rem; }

/* ═══════════════════════════════════════════════════════
   TX: Account chip (locked selection)
   ═══════════════════════════════════════════════════════ */
.tx-account-chip[b-gripmg1agn] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    background: #f0f4ff;
    border: 1px solid #d0d9ff;
    border-radius: 0.5rem;
    padding: 0.4rem 0.6rem;
}

.tx-chip-icon[b-gripmg1agn] {
    width: 28px;
    height: 28px;
    border-radius: 6px;
    background: #dbe4ff;
    color: #3a5bd9;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.85rem;
    flex-shrink: 0;
}

.tx-chip-body[b-gripmg1agn] {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 0.05rem;
}

.tx-chip-id[b-gripmg1agn]   { font-size: 0.72rem; font-weight: 700; color: #3a5bd9; font-family: monospace; }
.tx-chip-name[b-gripmg1agn] { font-size: 0.82rem; font-weight: 600; color: #1a1a1a; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.tx-chip-type[b-gripmg1agn] { font-size: 0.68rem; color: #6c757d; text-transform: uppercase; letter-spacing: 0.04em; }

.tx-chip-clear[b-gripmg1agn] {
    background: none;
    border: none;
    padding: 0.25rem;
    color: #9ca3af;
    cursor: pointer;
    border-radius: 4px;
    line-height: 1;
    flex-shrink: 0;
    transition: color 0.15s, background 0.15s;
}

.tx-chip-clear:hover[b-gripmg1agn] { color: #dc3545; background: rgba(220,53,69,0.08); }

/* ═══════════════════════════════════════════════════════
   TX: Search box
   ═══════════════════════════════════════════════════════ */
.tx-search-wrap[b-gripmg1agn] { position: relative; }

.tx-search-input-group[b-gripmg1agn] {
    display: flex;
    align-items: center;
    background: white;
    border: 1px solid #d0d0d0;
    border-radius: 0.375rem;
    padding: 0 0.5rem;
    transition: border-color 0.2s, box-shadow 0.2s;
}

.tx-search-input-group:focus-within[b-gripmg1agn] {
    border-color: var(--bs-primary);
    box-shadow: 0 0 0 2px rgba(13,110,253,0.15);
}

.tx-search-icon[b-gripmg1agn]    { color: #9ca3af; font-size: 0.8rem; flex-shrink: 0; }
.tx-search-spinner[b-gripmg1agn] { color: var(--bs-primary); flex-shrink: 0; }

.tx-search-input[b-gripmg1agn] {
    flex: 1;
    border: none;
    outline: none;
    padding: 0.45rem 0.4rem;
    font-size: 0.875rem;
    background: transparent;
    min-width: 0;
}

/* ═══════════════════════════════════════════════════════
   TX: Search results dropdown
   ═══════════════════════════════════════════════════════ */
.tx-search-dropdown[b-gripmg1agn] {
    position: absolute;
    top: calc(100% + 2px);
    left: 0;
    right: 0;
    background: white;
    border: 1px solid #e0e0e0;
    border-radius: 0.375rem;
    box-shadow: 0 4px 16px rgba(0,0,0,0.12);
    z-index: 100;
    overflow: hidden;
}

.tx-search-result[b-gripmg1agn] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    width: 100%;
    padding: 0.5rem 0.75rem;
    background: none;
    border: none;
    border-bottom: 1px solid #f3f3f3;
    text-align: left;
    cursor: pointer;
    transition: background 0.12s;
}

.tx-search-result:last-child[b-gripmg1agn] { border-bottom: none; }

.tx-search-result:hover[b-gripmg1agn] { background: #f0f4ff; }

.tx-result-id[b-gripmg1agn]   { font-family: monospace; font-size: 0.75rem; font-weight: 700; color: #3a5bd9; flex-shrink: 0; min-width: 36px; }
.tx-result-name[b-gripmg1agn] { flex: 1; font-size: 0.85rem; color: #1a1a1a; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

.tx-result-type[b-gripmg1agn] {
    font-size: 0.68rem;
    font-weight: 600;
    padding: 0.15rem 0.45rem;
    border-radius: 999px;
    flex-shrink: 0;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

.tx-type-partywallact[b-gripmg1agn]     { background: #e0f2fe; color: #0369a1; border: 1px solid #bae6fd; }
.tx-type-buildingcontract[b-gripmg1agn] { background: #fef9c3; color: #854d0e; border: 1px solid #fde68a; }
.tx-type-license[b-gripmg1agn]          { background: #f0fdf4; color: #166534; border: 1px solid #bbf7d0; }
.tx-type-rentdeposit[b-gripmg1agn]      { background: #fdf4ff; color: #7e22ce; border: 1px solid #e9d5ff; }

.tx-search-empty[b-gripmg1agn] { padding: 0.6rem 0.75rem; font-size: 0.82rem; color: #9ca3af; text-align: center; }
/* /Components/Admin/Lookups/LookupsView.razor.rz.scp.css */
/* ============================================================
   Admin – Lookups View  (mirrors EmailTemplates/Professionals pattern)
   ============================================================ */

/* ── Toolbar ──────────────────────────────────────────────── */
.modern-search-toolbar[b-q1s3qjc8jy] {
    background: white;
    border-radius: 0.25rem;
    padding: 1.25rem 1.5rem;
    margin-bottom: 1.5rem;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06);
    border: 1px solid #e0e0e0;
}

.toolbar-main[b-q1s3qjc8jy] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
}

.search-section[b-q1s3qjc8jy] { flex: 1; }

.toolbar-controls[b-q1s3qjc8jy] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

/* ── Tab navigation (override Bootstrap nav-tabs) ─────────── */
.nav-tabs[b-q1s3qjc8jy] {
    border-bottom: 2px solid #e0e0e0;
    gap: 0.25rem;
    flex-wrap: wrap;
}

.nav-tabs .nav-link[b-q1s3qjc8jy] {
    color: #6c757d;
    border: 1px solid transparent;
    border-bottom: none;
    padding: 0.5rem 0.875rem;
    font-size: 0.875rem;
    font-weight: 500;
    border-radius: 0.25rem 0.25rem 0 0;
    position: relative;
    bottom: -2px;
    transition: color 0.15s, background 0.15s;
    display: flex;
    align-items: center;
    gap: 0.35rem;
}

.nav-tabs .nav-link:hover[b-q1s3qjc8jy] {
    color: var(--bs-primary);
    background: rgba(8, 147, 163, 0.05);
    border-color: transparent;
}

.nav-tabs .nav-link.active[b-q1s3qjc8jy] {
    color: var(--bs-primary);
    background: white;
    border-color: #e0e0e0;
    border-bottom-color: white;
    font-weight: 600;
}

/* ── Card ─────────────────────────────────────────────────── */
.modern-table-card[b-q1s3qjc8jy] {
    background: white;
    border-radius: 0.25rem;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06);
    border: 1px solid #e0e0e0;
    overflow: hidden;
    margin-bottom: 1.5rem;
}

.table-header[b-q1s3qjc8jy] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1rem 1.5rem;
    background: #fafafa;
    border-bottom: 1px solid #e0e0e0;
}

.table-title[b-q1s3qjc8jy] {
    margin: 0;
    font-size: 1rem;
    font-weight: 600;
    color: #1a1a1a;
    display: flex;
    align-items: center;
}

.table-title i[b-q1s3qjc8jy] { color: var(--bs-primary); }

.table-actions[b-q1s3qjc8jy] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

/* ── Modern admin table (mirrors EmailTemplates/Professionals) */
.modern-admin-table[b-q1s3qjc8jy] {
    width: 100%;
    border-collapse: collapse;
    background: white;
}

.modern-admin-table thead th[b-q1s3qjc8jy] {
    background: #fafafa;
    padding: 0.75rem 1rem;
    font-weight: 600;
    color: #555;
    text-align: left;
    border-bottom: 1px solid #e0e0e0;
    font-size: 0.8125rem;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    white-space: nowrap;
}

.modern-admin-table tbody tr[b-q1s3qjc8jy] {
    border-bottom: 1px solid #f0f0f0;
    transition: background 0.15s ease;
}

.modern-admin-table tbody tr:hover[b-q1s3qjc8jy] {
    background: #fafafa;
}

.modern-admin-table tbody td[b-q1s3qjc8jy] {
    padding: 0.875rem 1rem;
    vertical-align: middle;
}

/* ── Loading skeleton ─────────────────────────────────────── */
.table-skeleton[b-q1s3qjc8jy] {
    padding: 0.5rem 1rem;
}

.skeleton-row[b-q1s3qjc8jy] {
    display: flex;
    gap: 1rem;
    align-items: center;
    padding: 0.75rem 0;
    border-bottom: 1px solid #f3f3f3;
}

.skeleton-cell[b-q1s3qjc8jy] {
    background: linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 50%, #f0f0f0 75%);
    background-size: 200% 100%;
    animation: shimmer-b-q1s3qjc8jy 1.4s infinite;
    border-radius: 0.25rem;
    height: 1rem;
    flex-shrink: 0;
}

.skeleton-id[b-q1s3qjc8jy]      { width: 40px; }
.skeleton-name[b-q1s3qjc8jy]    { width: 200px; }
.skeleton-order[b-q1s3qjc8jy]   { width: 80px; }
.skeleton-status[b-q1s3qjc8jy]  { width: 60px; }
.skeleton-actions[b-q1s3qjc8jy] { width: 80px; margin-left: auto; }

@keyframes shimmer-b-q1s3qjc8jy {
    0%   { background-position: 200% 0; }
    100% { background-position: -200% 0; }
}

/* ── Fee rate current-rates banner ───────────────────────────── */
.fee-current-banner[b-q1s3qjc8jy] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.75rem 1.5rem;
    background: color-mix(in srgb, var(--bs-primary) 6%, white);
    border-bottom: 1px solid color-mix(in srgb, var(--bs-primary) 15%, white);
    flex-wrap: wrap;
}

.fee-banner-label[b-q1s3qjc8jy] {
    font-size: 0.75rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--bs-primary);
    margin-right: 0.25rem;
}

.fee-banner-pill[b-q1s3qjc8jy] {
    background: white;
    border: 1px solid color-mix(in srgb, var(--bs-primary) 25%, #e0e0e0);
    color: #1a1a1a;
    padding: 0.2rem 0.65rem;
    border-radius: 999px;
    font-size: 0.8125rem;
    font-weight: 600;
}

.fee-banner-date[b-q1s3qjc8jy] {
    font-size: 0.8rem;
    color: #6c757d;
    margin-left: auto;
}

/* ── Fee rate history table — highlight current row ─────────── */
.fee-row-current td[b-q1s3qjc8jy] {
    background: color-mix(in srgb, var(--bs-success) 6%, white);
}

/* /Components/Admin/Placeholders/PlaceholdersView.razor.rz.scp.css */
/* ?? Toolbar (reuse admin pattern) ????????????????????????? */
.modern-search-toolbar[b-s9mlqesdlh] {
    background: white;
    border-radius: 0.25rem;
    padding: 1.25rem 1.5rem;
    margin-bottom: 1.5rem;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06);
    border: 1px solid #e0e0e0;
}

.toolbar-main[b-s9mlqesdlh] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
}

.search-section[b-s9mlqesdlh] { flex: 1; }
.toolbar-controls[b-s9mlqesdlh] { display: flex; align-items: center; gap: 1rem; }

/* ?? Card (reuse admin pattern) ???????????????????????????? */
.modern-table-card[b-s9mlqesdlh] {
    background: white;
    border-radius: 0.25rem;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06);
    border: 1px solid #e0e0e0;
    overflow: hidden;
}

.table-header[b-s9mlqesdlh] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1rem 1.5rem;
    background: #fafafa;
    border-bottom: 1px solid #e0e0e0;
}

.table-title[b-s9mlqesdlh] {
    margin: 0;
    font-size: 1rem;
    font-weight: 600;
    color: #1a1a1a;
}

/* Per-section header accent colours */
.section-header-shared[b-s9mlqesdlh] { background: #f8f9fa; }
.section-header-cb[b-s9mlqesdlh]     { background: color-mix(in srgb, #6f42c1 8%, white); border-bottom-color: color-mix(in srgb, #6f42c1 20%, white); }
.section-header-pwa[b-s9mlqesdlh]    { background: color-mix(in srgb, var(--bs-primary) 8%, white); border-bottom-color: color-mix(in srgb, var(--bs-primary) 20%, white); }
.section-header-bc[b-s9mlqesdlh]     { background: color-mix(in srgb, var(--bs-success) 8%, white); border-bottom-color: color-mix(in srgb, var(--bs-success) 20%, white); }
.section-header-lic[b-s9mlqesdlh]    { background: color-mix(in srgb, #d97706 8%, white);           border-bottom-color: color-mix(in srgb, #d97706 20%, white); }
.section-header-rd[b-s9mlqesdlh]     { background: color-mix(in srgb, var(--bs-info) 8%, white);    border-bottom-color: color-mix(in srgb, var(--bs-info) 20%, white); }

.section-header-cb  .table-title[b-s9mlqesdlh] { color: #6f42c1; }
.section-header-pwa .table-title[b-s9mlqesdlh] { color: var(--bs-primary); }
.section-header-bc  .table-title[b-s9mlqesdlh] { color: var(--bs-success); }
.section-header-lic .table-title[b-s9mlqesdlh] { color: #d97706; }
.section-header-rd  .table-title[b-s9mlqesdlh] { color: var(--bs-info); }

/* ?? Instructions list ????????????????????????????????????? */
.instruction-list[b-s9mlqesdlh] {
    padding-left: 1.25rem;
    margin: 0;
}

.instruction-list li[b-s9mlqesdlh] {
    padding: 0.375rem 0;
    font-size: 0.9375rem;
    color: #343a40;
    line-height: 1.6;
}

/* ?? Summary pills ????????????????????????????????????????? */
.summary-pills[b-s9mlqesdlh] {
    display: flex;
    gap: 0.625rem;
    flex-wrap: wrap;
}

.summary-pill[b-s9mlqesdlh] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.5rem 1rem;
    background: white;
    border: 1px solid #e0e0e0;
    border-radius: 0.25rem;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
}

.summary-pill-count[b-s9mlqesdlh] {
    font-size: 1.25rem;
    font-weight: 700;
    color: #1a1a1a;
    line-height: 1;
}

.summary-pill-label[b-s9mlqesdlh] {
    font-size: 0.8125rem;
    font-weight: 600;
    color: #6c757d;
    font-family: 'Courier New', monospace;
}

.summary-pill-cb    .summary-pill-count[b-s9mlqesdlh] { color: #6f42c1; }
.summary-pill-cb    .summary-pill-label[b-s9mlqesdlh] { color: #6f42c1; }
.summary-pill-pwa   .summary-pill-count[b-s9mlqesdlh] { color: var(--bs-primary); }
.summary-pill-pwa   .summary-pill-label[b-s9mlqesdlh] { color: var(--bs-primary); }
.summary-pill-bc    .summary-pill-count[b-s9mlqesdlh] { color: var(--bs-success); }
.summary-pill-bc    .summary-pill-label[b-s9mlqesdlh] { color: var(--bs-success); }
.summary-pill-lic   .summary-pill-count[b-s9mlqesdlh] { color: #d97706; }
.summary-pill-lic   .summary-pill-label[b-s9mlqesdlh] { color: #d97706; }
.summary-pill-rd    .summary-pill-count[b-s9mlqesdlh] { color: var(--bs-info); }
.summary-pill-rd    .summary-pill-label[b-s9mlqesdlh] { color: var(--bs-info); }
.summary-pill-total[b-s9mlqesdlh] { border-color: #ced4da; background: #f8f9fa; }

/* ?? Group subheaders ?????????????????????????????????????? */
.group-subheader[b-s9mlqesdlh] {
    padding: 0.5rem 1.5rem;
    font-size: 0.8125rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: #6c757d;
    background: #fafafa;
    border-bottom: 1px solid #f0f0f0;
    border-top: 1px solid #f0f0f0;
}

/* ?? Placeholder table ????????????????????????????????????? */
.placeholder-table-wrapper[b-s9mlqesdlh] {
    overflow-x: auto;
}

.placeholder-table[b-s9mlqesdlh] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.875rem;
}

.placeholder-table thead tr[b-s9mlqesdlh] {
    background: #f8f9fa;
    border-bottom: 2px solid #e5e5e5;
}

.placeholder-table thead th[b-s9mlqesdlh] {
    padding: 0.625rem 1rem;
    font-size: 0.75rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.4px;
    color: #6c757d;
    text-align: left;
    white-space: nowrap;
}

.placeholder-table tbody tr[b-s9mlqesdlh] {
    border-bottom: 1px solid #f0f0f0;
    transition: background 0.1s ease;
}

.placeholder-table tbody tr:last-child[b-s9mlqesdlh] { border-bottom: none; }

.placeholder-table tbody tr:hover[b-s9mlqesdlh] { background: #fafafa; }

.placeholder-table td[b-s9mlqesdlh] {
    padding: 0.5625rem 1rem;
    vertical-align: middle;
}

/* ?? Copy button ??????????????????????????????????????????? */
.key-btn[b-s9mlqesdlh] {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    background: none;
    border: none;
    padding: 0.25rem 0.5rem;
    border-radius: 0.25rem;
    cursor: pointer;
    transition: background 0.1s ease;
    text-align: left;
}

.key-btn:hover[b-s9mlqesdlh] {
    background: color-mix(in srgb, var(--bs-primary) 10%, white);
}

.key-btn code[b-s9mlqesdlh] {
    font-size: 0.8125rem;
    color: var(--bs-primary);
    font-weight: 600;
    white-space: nowrap;
}

.copy-icon[b-s9mlqesdlh] {
    font-size: 0.6875rem;
    color: #adb5bd;
    opacity: 0;
    transition: opacity 0.15s ease;
}

.key-btn:hover .copy-icon[b-s9mlqesdlh] { opacity: 1; color: var(--bs-primary); }

/* ?? Example + description cells ?????????????????????????? */
.desc-cell[b-s9mlqesdlh]  { color: #495057; }
.example-cell[b-s9mlqesdlh] { }
.example-value[b-s9mlqesdlh] {
    font-family: 'Courier New', monospace;
    font-size: 0.8125rem;
    color: #495057;
    background: #f8f9fa;
    padding: 0.125rem 0.375rem;
    border-radius: 0.25rem;
    border: 1px solid #e5e5e5;
}
/* /Components/Admin/Professionals/ProfessionalsView.razor.rz.scp.css */
/* Modern Admin Professionals View Styles */

/* Modern Search Toolbar */
.modern-search-toolbar[b-t4zd1p8249] {
    background: white;
    border-radius: 0.25rem;
    padding: 1.5rem;
    margin-bottom: 2rem;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06);
    border: 1px solid #e0e0e0;
}

.toolbar-main[b-t4zd1p8249] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.search-section[b-t4zd1p8249] {
    flex: 1;
}

.search-input-group[b-t4zd1p8249] {
    position: relative;
    display: flex;
    align-items: center;
    background: #fafafa;
    border: 1px solid #d0d0d0;
    border-radius: 0.25rem;
    transition: all 0.2s ease;
}

.search-input-group:focus-within[b-t4zd1p8249] {
    border-color: var(--bs-primary);
    box-shadow: 0 0 0 2px rgba(8, 147, 163, 0.15);
}

.search-icon[b-t4zd1p8249] {
    padding: 0 1rem;
    color: #6c757d;
    font-size: 1.125rem;
}

.search-input[b-t4zd1p8249] {
    flex: 1;
    padding: 0.75rem 0;
    border: none;
    background: transparent;
    font-size: 1rem;
    outline: none;
    color: #212529;
}

.search-input[b-t4zd1p8249]::placeholder {
    color: #adb5bd;
}

.clear-search-btn[b-t4zd1p8249] {
    background: transparent;
    border: none;
    padding: 0.5rem;
    color: #6c757d;
    cursor: pointer;
    transition: all 0.3s ease;
    border-radius: 50%;
}

.clear-search-btn:hover[b-t4zd1p8249] {
    color: var(--bs-primary);
    background: rgba(8, 147, 163, 0.1);
}

.search-submit-btn[b-t4zd1p8249] {
    background: var(--bs-primary);
    color: white;
    border: none;
    padding: 0.75rem 1.5rem;
    border-radius: 0 0.25rem 0.25rem 0;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.2s ease;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.search-submit-btn:hover[b-t4zd1p8249] {
    background: #055f6d;
}

.search-info[b-t4zd1p8249] {
    display: flex;
    align-items: center;
    color: #6c757d;
    font-size: 0.875rem;
    margin-top: 0.5rem;
    font-style: italic;
}

.toolbar-controls[b-t4zd1p8249] {
    display: flex;
    align-items: center;
    gap: 1rem;
    flex-wrap: wrap;
}

.page-size-control[b-t4zd1p8249] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.control-label[b-t4zd1p8249] {
    font-size: 0.875rem;
    color: #6c757d;
    font-weight: 500;
    margin: 0;
}

.results-badge[b-t4zd1p8249] {
    background: rgba(8, 147, 163, 0.1);
    color: var(--bs-primary);
    padding: 0.5rem 1rem;
    border-radius: 0.25rem;
    font-size: 0.875rem;
    font-weight: 600;
}

/* Modern Table Card */
.modern-table-card[b-t4zd1p8249] {
    background: white;
    border-radius: 0.25rem;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06);
    border: 1px solid #e0e0e0;
    overflow: hidden;
    margin-bottom: 2rem;
}

.table-header[b-t4zd1p8249] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1.5rem;
    background: #fafafa;
    border-bottom: 1px solid #e0e0e0;
}

.table-title[b-t4zd1p8249] {
    margin: 0;
    font-size: 1.25rem;
    font-weight: 700;
    color: #212529;
    display: flex;
    align-items: center;
}

.table-title i[b-t4zd1p8249] {
    color: var(--bs-primary);
}

.table-actions[b-t4zd1p8249] {
    display: flex;
    gap: 0.5rem;
}

/* Modern Admin Table */
.modern-admin-table[b-t4zd1p8249] {
    width: 100%;
    border-collapse: collapse;
    background: white;
}

.modern-admin-table thead th[b-t4zd1p8249] {
    background: #fafafa;
    padding: 1rem;
    font-weight: 600;
    color: #333333;
    text-align: left;
    border-bottom: 1px solid #e0e0e0;
    font-size: 0.875rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.table-row[b-t4zd1p8249] {
    transition: all 0.2s ease;
    cursor: pointer;
    border-bottom: 1px solid #f0f0f0;
}

.table-row:hover[b-t4zd1p8249] {
    background: #fafafa;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06);
}

.table-row td[b-t4zd1p8249] {
    padding: 1rem;
    vertical-align: middle;
}

/* Professional Cell */
.professional-info[b-t4zd1p8249] {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.professional-avatar[b-t4zd1p8249] {
    width: 48px;
    height: 48px;
    border-radius: 0.25rem;
    background: var(--bs-primary);
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: 1.125rem;
}

.professional-details[b-t4zd1p8249] {
    flex: 1;
}

.professional-name[b-t4zd1p8249] {
    font-weight: 600;
    color: #212529;
    margin-bottom: 0.25rem;
}

.professional-id[b-t4zd1p8249] {
    font-size: 0.75rem;
    color: #6c757d;
    font-family: 'Courier New', monospace;
}

/* Contact Cell */
.contact-email[b-t4zd1p8249] {
    display: flex;
    align-items: center;
    color: #495057;
    font-size: 0.875rem;
}

/* Company Cell */
.company-name[b-t4zd1p8249] {
    font-weight: 600;
    color: #212529;
    margin-bottom: 0.25rem;
}

.company-reg[b-t4zd1p8249] {
    font-size: 0.75rem;
    color: #6c757d;
}

/* Credentials Cell */
.credential-badges[b-t4zd1p8249] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.credential-badges .badge[b-t4zd1p8249] {
    font-size: 0.75rem;
    padding: 0.25rem 0.5rem;
    width: fit-content;
}

/* Registration Cell */
.country[b-t4zd1p8249] {
    display: flex;
    align-items: center;
    font-size: 0.875rem;
    color: #495057;
}

/* Status Cell */
.status-badge[b-t4zd1p8249] {
    display: inline-flex;
    align-items: center;
    padding: 0.375rem 0.75rem;
    border-radius: 0.25rem;
    font-size: 0.75rem;
    font-weight: 600;
}

.status-badge.active[b-t4zd1p8249] {
    background: rgba(40, 167, 69, 0.1);
    color: #28a745;
}

/* Actions Cell */
.action-buttons[b-t4zd1p8249] {
    display: flex;
    gap: 0.5rem;
}

.action-buttons .btn[b-t4zd1p8249] {
    padding: 0.375rem 0.75rem;
    border-radius: 0.25rem;
    transition: all 0.2s ease;
}

.action-buttons .btn:hover[b-t4zd1p8249] {
    opacity: 0.9;
}

/* Modern Error Card */
.modern-error-card[b-t4zd1p8249] {
    display: flex;
    align-items: center;
    gap: 1.5rem;
    background: white;
    border: 1px solid rgba(220, 53, 69, 0.2);
    border-radius: 0.25rem;
    padding: 2rem;
    margin: 2rem 0;
}

.error-icon[b-t4zd1p8249] {
    width: 64px;
    height: 64px;
    border-radius: 0.25rem;
    background: rgba(220, 53, 69, 0.1);
    color: #dc3545;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 2rem;
    flex-shrink: 0;
}

.error-content h6[b-t4zd1p8249] {
    margin: 0 0 0.5rem 0;
    color: #dc3545;
}

/* Modern Empty Card */
.modern-empty-card[b-t4zd1p8249] {
    text-align: center;
    background: #fafafa;
    border: 1px dashed #d0d0d0;
    border-radius: 0.25rem;
    padding: 4rem 2rem;
    margin: 2rem 0;
}

.empty-icon[b-t4zd1p8249] {
    width: 64px;
    height: 64px;
    border-radius: 0.25rem;
    background: rgba(8, 147, 163, 0.1);
    color: var(--bs-primary);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 2rem;
    margin: 0 auto 1.5rem auto;
}

.empty-content h5[b-t4zd1p8249] {
    margin: 0 0 1rem 0;
    color: #212529;
}

/* Loading Skeleton */
.table-skeleton[b-t4zd1p8249] {
    padding: 1rem;
}

.skeleton-row[b-t4zd1p8249] {
    display: flex;
    gap: 1rem;
    margin-bottom: 1rem;
    padding: 1rem;
}

.skeleton-cell[b-t4zd1p8249] {
    border-radius: 0.25rem;
    background: linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 50%, #f0f0f0 75%);
    background-size: 200% 100%;
    animation: shimmer-b-t4zd1p8249 2s infinite;
}

.skeleton-avatar[b-t4zd1p8249] {
    width: 48px;
    height: 48px;
    border-radius: 0.25rem;
}

.skeleton-name[b-t4zd1p8249] {
    height: 20px;
    flex: 2;
}

.skeleton-email[b-t4zd1p8249] {
    height: 16px;
    flex: 3;
}

.skeleton-company[b-t4zd1p8249] {
    height: 16px;
    flex: 2;
}

.skeleton-role[b-t4zd1p8249] {
    height: 16px;
    flex: 1;
}

.skeleton-actions[b-t4zd1p8249] {
    height: 32px;
    width: 80px;
}

@keyframes shimmer-b-t4zd1p8249 {
    0% {
        background-position: 200% 0;
    }
    100% {
        background-position: -200% 0;
    }
}

/* Responsive Design */
@media (max-width: 992px) {
    .toolbar-main[b-t4zd1p8249] {
        flex-direction: column;
    }

    /* Mobile table cards */
    .modern-admin-table[b-t4zd1p8249] {
        display: none;
    }

    .table-responsive[b-t4zd1p8249] {
        display: block;
    }

    .table-row[b-t4zd1p8249] {
        display: block;
        background: #fafafa;
        margin-bottom: 1rem;
        border-radius: 0.25rem;
        padding: 1rem;
    }

    .table-row:hover[b-t4zd1p8249] {
        box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06);
    }

    .table-row td[b-t4zd1p8249] {
        display: block;
        padding: 0.5rem 0;
        border: none;
    }

    .table-row td[b-t4zd1p8249]::before {
        content: attr(data-label);
        font-weight: 700;
        color: #495057;
        display: block;
        margin-bottom: 0.25rem;
    }
}

@media (max-width: 576px) {
    .search-input-group[b-t4zd1p8249] {
        flex-direction: column;
        align-items: stretch;
    }

    .search-submit-btn[b-t4zd1p8249] {
        border-radius: 0 0 0.25rem 0.25rem;
    }
}
/* /Components/Admin/Reports/ReportsView.razor.rz.scp.css */
/* ── Page header ──────────────────────────────────────────────────────────── */
.rpt-page-header[b-5behmsayzs] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    gap: 1rem;
}

.rpt-header-icon[b-5behmsayzs] {
    width: 56px; height: 56px;
    display: flex; align-items: center; justify-content: center;
    border-radius: 14px;
    background: rgba(255,255,255,0.15);
    backdrop-filter: blur(10px);
    border: 2px solid rgba(255,255,255,0.2);
    color: white; font-size: 1.5rem; flex-shrink: 0;
}

.rpt-page-header h2[b-5behmsayzs] { font-size: 1.5rem; color: white; margin: 0; }
.rpt-header-sub[b-5behmsayzs] { color: rgba(255,255,255,0.7); font-size: 0.875rem; }

/* ── Admin framework cards (match ProfessionalsView pattern) ──────────────── */
.modern-search-toolbar[b-5behmsayzs] {
    background: white;
    border-radius: 0.25rem;
    padding: 1.25rem 1.5rem;
    box-shadow: 0 1px 3px rgba(0,0,0,0.06);
    border: 1px solid #e0e0e0;
}

.modern-table-card[b-5behmsayzs] {
    background: white;
    border-radius: 0.25rem;
    box-shadow: 0 1px 3px rgba(0,0,0,0.06);
    border: 1px solid #e0e0e0;
    overflow: hidden;
}

.table-header[b-5behmsayzs] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1rem 1.5rem;
    background: #fafafa;
    border-bottom: 1px solid #e0e0e0;
}

.table-title[b-5behmsayzs] {
    margin: 0;
    font-size: 1rem;
    font-weight: 600;
    color: #212529;
    display: flex;
    align-items: center;
}

/* ── Empty state (matches admin framework exactly) ────────────────────────── */
.modern-empty-card[b-5behmsayzs] {
    text-align: center;
    background: #fafafa;
    border: 1px dashed #d0d0d0;
    border-radius: 0.25rem;
    padding: 4rem 2rem;
    margin: 0;
}

.empty-icon[b-5behmsayzs] {
    width: 64px; height: 64px;
    border-radius: 0.25rem;
    background: rgba(8,147,163,0.1);
    display: flex; align-items: center; justify-content: center;
    font-size: 2rem;
    color: var(--bs-primary);
    margin: 0 auto 1.5rem auto;
}

.empty-content h5[b-5behmsayzs] { margin: 0 0 0.5rem 0; color: #212529; font-weight: 600; }

/* ── Loading skeleton (matches admin framework) ───────────────────────────── */
.table-skeleton[b-5behmsayzs] { display: flex; flex-direction: column; gap: 0; }

.skeleton-row[b-5behmsayzs] {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 1rem 1.5rem;
    border-bottom: 1px solid #f3f4f6;
}

.skeleton-row:last-child[b-5behmsayzs] { border-bottom: none; }

.skeleton-avatar[b-5behmsayzs]  { width: 40px; height: 40px; flex-shrink: 0; border-radius: 0.25rem; }
.skeleton-name[b-5behmsayzs]    { width: 180px; height: 18px; border-radius: 0.25rem; }
.skeleton-company[b-5behmsayzs] { flex: 1; height: 18px; border-radius: 0.25rem; }
.skeleton-actions[b-5behmsayzs] { width: 100px; height: 32px; border-radius: 0.25rem; }

.skeleton[b-5behmsayzs] {
    background: linear-gradient(90deg, #f0f0f0 25%, #e5e5e5 50%, #f0f0f0 75%);
    background-size: 1000px 100%;
    animation: shimmer-b-5behmsayzs 2s infinite;
}

@keyframes shimmer-b-5behmsayzs {
    from { background-position: -1000px 0; }
    to   { background-position:  1000px 0; }
}

/* ── Group management table rows ──────────────────────────────────────────── */
.rpt-group-list[b-5behmsayzs] { display: flex; flex-direction: column; }

.rpt-group-item[b-5behmsayzs] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.625rem 1.5rem;
    border-bottom: 1px solid #f3f4f6;
    gap: 0.5rem;
}

.rpt-group-item:last-child[b-5behmsayzs] { border-bottom: none; }
.rpt-group-item:hover[b-5behmsayzs] { background: #f9fafb; }

.rpt-group-item-left[b-5behmsayzs] {
    display: flex;
    align-items: center;
    flex: 1;
    min-width: 0;
    gap: 0;
}

.rpt-group-item-count[b-5behmsayzs] {
    font-size: 0.72rem;
    color: #9ca3af;
    background: #f3f4f6;
    border: 1px solid #e5e7eb;
    border-radius: 20px;
    padding: 0.1rem 0.4rem;
    font-weight: 500;
    flex-shrink: 0;
}

.rpt-group-form[b-5behmsayzs] {
    padding: 0.75rem 1.5rem;
    border-bottom: 1px solid #e5e7eb;
    background: #fefce8;
}

/* ── Extra-small button ───────────────────────────────────────────────────── */
.btn-xs[b-5behmsayzs] {
    padding: 0.15rem 0.45rem;
    font-size: 0.75rem;
    line-height: 1.4;
    border-radius: 0.2rem;
}

/* ── Report form body ─────────────────────────────────────────────────────── */
.rpt-form-body[b-5behmsayzs] { padding: 1.5rem; }

.rpt-sql-hint[b-5behmsayzs] {
    font-size: 0.75rem;
    font-weight: 400;
    color: #9ca3af;
}

.rpt-sql-input[b-5behmsayzs] {
    font-family: 'Consolas', 'Courier New', monospace;
    font-size: 0.875rem;
    line-height: 1.6;
    resize: vertical;
}

/* ── Grouped report list ──────────────────────────────────────────────────── */
.rpt-list[b-5behmsayzs] {
    display: flex;
    flex-direction: column;
}

.rpt-group-section[b-5behmsayzs] { border-bottom: 1px solid #e5e7eb; }
.rpt-group-section:last-child[b-5behmsayzs] { border-bottom: none; }

.rpt-group-section-header[b-5behmsayzs] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.625rem 1.5rem;
    background: #f8f9fa;
    cursor: pointer;
    user-select: none;
    border-bottom: 1px solid #e5e7eb;
    transition: background 0.12s ease;
}

.rpt-group-section-header:hover[b-5behmsayzs] { background: #f0f2f5; }
.rpt-group-section-ungrouped .rpt-group-section-header[b-5behmsayzs] { background: #fafafa; }

.rpt-group-chevron[b-5behmsayzs]     { font-size: 0.75rem; color: #6c757d; flex-shrink: 0; }
.rpt-group-folder-icon[b-5behmsayzs] { font-size: 0.875rem; color: var(--bs-primary); flex-shrink: 0; }

.rpt-group-section-name[b-5behmsayzs] { font-weight: 600; font-size: 0.875rem; color: #212529; }

.rpt-group-section-desc[b-5behmsayzs] {
    font-size: 0.8rem;
    color: #9ca3af;
    flex: 1;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.rpt-group-section-count[b-5behmsayzs] {
    margin-left: auto;
    font-size: 0.72rem;
    font-weight: 700;
    background: rgba(8,147,163,0.1);
    color: var(--bs-primary);
    border-radius: 20px;
    padding: 0.1rem 0.5rem;
    flex-shrink: 0;
}

.rpt-group-section-body[b-5behmsayzs] { display: flex; flex-direction: column; }

/* ── Individual report row ────────────────────────────────────────────────── */
.rpt-row[b-5behmsayzs] {
    border-bottom: 1px solid #f3f4f6;
    background: white;
    transition: background 0.12s ease;
    cursor: default;
}

.rpt-row:last-child[b-5behmsayzs]  { border-bottom: none; }
.rpt-row:hover[b-5behmsayzs]       { background: #f9fafb; }
.rpt-row-expanded[b-5behmsayzs]    { background: #f9fafb; }

.rpt-row-header[b-5behmsayzs] {
    display: grid;
    grid-template-columns: 40px 1fr auto;
    align-items: center;
    gap: 1rem;
    padding: 0.875rem 1.5rem;
}

.rpt-row-icon[b-5behmsayzs] {
    width: 40px; height: 40px;
    display: flex; align-items: center; justify-content: center;
    font-size: 1.125rem;
    background: rgba(8,147,163,0.07);
    border-radius: 0.25rem;
    flex-shrink: 0;
    color: var(--bs-primary);
}

.rpt-row-name[b-5behmsayzs] { font-size: 0.9375rem; font-weight: 600; color: #212529; line-height: 1.3; }
.rpt-row-desc[b-5behmsayzs] { font-size: 0.8125rem; color: #6c757d; margin-top: 0.125rem; }

.rpt-row-actions[b-5behmsayzs] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
    flex-shrink: 0;
}

.rpt-delete-confirm[b-5behmsayzs] { display: flex; align-items: center; gap: 0.375rem; }

/* ── Results panel ────────────────────────────────────────────────────────── */
.rpt-results[b-5behmsayzs] {
    border-top: 1px solid #e5e7eb;
    background: #fafafa;
}

.rpt-results-toolbar[b-5behmsayzs] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.625rem 1.5rem;
    border-bottom: 1px solid #e5e5e5;
    gap: 0.75rem;
}

.rpt-results-count[b-5behmsayzs] { font-size: 0.8125rem; color: #6c757d; font-weight: 500; }

.rpt-table-wrap[b-5behmsayzs] { overflow-x: auto; max-height: 500px; overflow-y: auto; }

.rpt-table[b-5behmsayzs] { width: 100%; border-collapse: collapse; font-size: 0.8125rem; white-space: nowrap; }

.rpt-table thead th[b-5behmsayzs] {
    position: sticky;
    top: 0;
    background: #f0f2f5;
    border-bottom: 2px solid #d0d5dd;
    padding: 0.5rem 1rem;
    font-weight: 600;
    color: #374151;
    text-align: left;
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 0.3px;
}

.rpt-table tbody tr:nth-child(even)[b-5behmsayzs] { background: #f8f9fa; }
.rpt-table tbody tr:hover[b-5behmsayzs]           { background: rgba(8,147,163,0.04); }

.rpt-table tbody td[b-5behmsayzs] {
    padding: 0.5rem 1rem;
    border-bottom: 1px solid #eeeeee;
    color: #212529;
    max-width: 320px;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* ── Responsive ───────────────────────────────────────────────────────────── */
@media (max-width: 640px) {
    .rpt-row-header[b-5behmsayzs] {
        grid-template-columns: 36px 1fr;
        grid-template-rows: auto auto;
        gap: 0.375rem;
        padding: 0.75rem 1rem;
    }

    .rpt-row-icon[b-5behmsayzs]    { grid-row: 1; grid-column: 1; width: 32px; height: 32px; font-size: 0.875rem; }
    .rpt-row-info[b-5behmsayzs]    { grid-row: 1; grid-column: 2; }
    .rpt-row-actions[b-5behmsayzs] { grid-row: 2; grid-column: 1 / -1; justify-content: flex-start; }

    .rpt-group-section-desc[b-5behmsayzs] { display: none; }
    .rpt-group-section-header[b-5behmsayzs] { padding: 0.5rem 1rem; }
    .table-header[b-5behmsayzs] { padding: 0.75rem 1rem; }
}
/* /Components/Admin/Shared/AdminLayout.razor.rz.scp.css */
.page[b-hsqsyd2rob] {
    position: relative;
    display: flex;
    flex-direction: column;
}

main[b-hsqsyd2rob] {
    flex: 1;
}

.sidebar[b-hsqsyd2rob] {
    background-color: var(--bs-gray-100);
}

@media (min-width: 641px) {
    .page[b-hsqsyd2rob] {
        flex-direction: row;
    }
}


    .top-row[b-hsqsyd2rob]  a, .top-row[b-hsqsyd2rob]  .btn-link {
        white-space: nowrap;
        margin-left: 1.5rem;
        text-decoration: none;
    }

    .top-row[b-hsqsyd2rob]  a:hover, .top-row[b-hsqsyd2rob]  .btn-link:hover {
        text-decoration: underline;
    }

    .top-row[b-hsqsyd2rob]  a:first-child {
        overflow: hidden;
        text-overflow: ellipsis;
    }

@media (max-width: 640.98px) {
    .top-row[b-hsqsyd2rob] {
        justify-content: space-between;
    }

    .top-row[b-hsqsyd2rob]  a, .top-row[b-hsqsyd2rob]  .btn-link {
        margin-left: 0;
    }
}

@media (min-width: 641px) {
    .page[b-hsqsyd2rob] {
        flex-direction: row;
    }

  
    .top-row[b-hsqsyd2rob] {
        position: sticky;
        top: 0;
        z-index: 1;
    }

    .top-row.auth[b-hsqsyd2rob]  a:first-child {
        flex: 1;
        text-align: right;
        width: 0;
    }

    .top-row[b-hsqsyd2rob], article[b-hsqsyd2rob] {
        padding-left: 2rem !important;
        padding-right: 1.5rem !important;
    }
}

#blazor-error-ui[b-hsqsyd2rob] {
    color-scheme: light only;
    background: lightyellow;
    bottom: 0;
    box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
    box-sizing: border-box;
    display: none;
    left: 0;
    padding: 0.6rem 1.25rem 0.7rem 1.25rem;
    position: fixed;
    width: 100%;
    z-index: 1000;
}

    #blazor-error-ui .dismiss[b-hsqsyd2rob] {
        cursor: pointer;
        position: absolute;
        right: 0.75rem;
        top: 0.5rem;
    }
/* /Components/Admin/Shared/AdminMenu.razor.rz.scp.css */
/* Base Sidebar Styles */
.modern-sidebar[b-j4zbcyft33] {
    width: 300px;
    height: 100vh;
    position: sticky;
    top: 0;
    background: #f8f9fa;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

/* Admin Theme Header */
.menu-header[b-j4zbcyft33] {
    padding: 0.875rem 1rem;
    background: linear-gradient(135deg, rgba(220, 53, 69, 0.1) 0%, rgba(220, 53, 69, 0.05) 100%);
    border-bottom: 1px solid rgba(0, 0, 0, 0.08);
}

.account-type-badge[b-j4zbcyft33] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    margin-bottom: 0;
}

.type-icon[b-j4zbcyft33] {
    width: 36px;
    height: 36px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    font-size: 1.125rem;
}

.admin-type-icon[b-j4zbcyft33] {
    background: rgba(220, 53, 69, 0.15);
    color: #dc3545;
}

.type-info[b-j4zbcyft33] {
    flex: 1;
}

.type-label[b-j4zbcyft33] {
    font-size: 0.75rem;
    color: #6c757d;
    text-transform: uppercase;
    font-weight: 600;
    letter-spacing: 0.5px;
}

.type-name[b-j4zbcyft33] {
    font-size: 0.9rem;
    font-weight: 700;
    color: #212529;
}

/* Mobile Menu Button */
.mobile-menu-btn[b-j4zbcyft33] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    width: 100%;
    padding: 0.75rem;
    margin: 0 1rem 1rem 1rem;
    background: #dc3545;
    color: white;
    border: none;
    border-radius: 0.75rem;
    font-weight: 600;
    font-size: 0.9375rem;
    transition: all 0.3s ease;
    box-shadow: 0 2px 8px rgba(220, 53, 69, 0.2);
}

.mobile-menu-btn:hover[b-j4zbcyft33] {
    background: #c82333;
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(220, 53, 69, 0.3);
}

.mobile-menu-btn i[b-j4zbcyft33] {
    font-size: 1.25rem;
}

@media (min-width: 769px) {
    .mobile-menu-btn[b-j4zbcyft33] {
        display: none;
    }
}

/* Menu Content */
.menu-content[b-j4zbcyft33] {
    flex: 1;
    overflow-y: auto;
    padding: 0.625rem;
}

.menu-content[b-j4zbcyft33]::-webkit-scrollbar {
    width: 6px;
}

.menu-content[b-j4zbcyft33]::-webkit-scrollbar-track {
    background: transparent;
}

.menu-content[b-j4zbcyft33]::-webkit-scrollbar-thumb {
    background: rgba(0, 0, 0, 0.2);
    border-radius: 10px;
}

.menu-content[b-j4zbcyft33]::-webkit-scrollbar-thumb:hover {
    background: rgba(0, 0, 0, 0.3);
}

/* Menu Items � ::deep used because NavLink is a child Blazor component;
   the <a> it renders does not reliably receive the CSS isolation scope attribute,
   so we target it as a descendant of the scoped .menu-content wrapper instead. */
.menu-content[b-j4zbcyft33]  .menu-item {
    display: block;
    padding: 0.5rem 0.75rem;
    margin-bottom: 0.25rem;
    border-radius: 0.625rem;
    background: white;
    border: 2px solid transparent;
    text-decoration: none;
    color: #495057;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
}

.menu-content[b-j4zbcyft33]  .menu-item:hover {
    transform: translateX(4px);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
    background: #f8f9fa;
    color: #212529;
    text-decoration: none;
}

.menu-content[b-j4zbcyft33]  .menu-item.active {
    background: linear-gradient(135deg, rgba(220, 53, 69, 0.1) 0%, rgba(220, 53, 69, 0.05) 100%);
    border-color: #dc3545;
    color: #dc3545;
    font-weight: 600;
    box-shadow: 0 4px 12px rgba(220, 53, 69, 0.2);
}

.menu-content[b-j4zbcyft33]  .menu-item.active .nav-arrow {
    transform: translateX(2px);
    color: #dc3545;
}

/* Menu Item Content */
.menu-item-content[b-j4zbcyft33] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
}

.item-left[b-j4zbcyft33] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex: 1;
}

.item-icon[b-j4zbcyft33] {
    width: 26px;
    height: 26px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 6px;
    background: rgba(220, 53, 69, 0.08);
    color: #dc3545;
    font-size: 0.9rem;
    transition: all 0.3s ease;
}

.menu-content[b-j4zbcyft33]  .menu-item:hover .item-icon {
    transform: scale(1.1) rotate(5deg);
    background: rgba(220, 53, 69, 0.15);
}

.menu-content[b-j4zbcyft33]  .menu-item.active .item-icon {
    background: rgba(220, 53, 69, 0.15);
    color: #dc3545;
}

.item-text[b-j4zbcyft33] {
    font-size: 0.875rem;
    font-weight: 500;
}

/* Navigation Arrow */
.nav-arrow[b-j4zbcyft33] {
    font-size: 0.875rem;
    color: rgba(0, 0, 0, 0.25);
    transition: all 0.3s ease;
}

.menu-content[b-j4zbcyft33]  .menu-item:hover .nav-arrow {
    color: #dc3545;
    transform: translateX(2px);
}

/* Responsive */
@media (max-width: 768px) {
    .modern-sidebar[b-j4zbcyft33] {
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        width: 100%;
        height: auto;
        max-height: 100vh;
        z-index: 1040;
        overflow-y: auto;
        box-shadow: 0 4px 20px rgba(0, 0, 0, 0.2);
    }

    .menu-header[b-j4zbcyft33] {
        position: sticky;
        top: 0;
        z-index: 1041;
    }

    .mobile-menu-btn[b-j4zbcyft33] {
        position: fixed;
        bottom: 20px;
        right: 20px;
        z-index: 1050;
        width: auto;
        min-width: 120px;
        box-shadow: 0 4px 20px rgba(220, 53, 69, 0.4);
    }

    .menu-content[b-j4zbcyft33] {
        max-height: 60vh;
        overflow-y: auto;
    }

    .menu-content.collapse:not(.show)[b-j4zbcyft33] {
        display: none;
    }

    .type-icon[b-j4zbcyft33] {
        width: 40px;
        height: 40px;
        font-size: 1.25rem;
    }

    .item-icon[b-j4zbcyft33] {
        width: 28px;
        height: 28px;
        font-size: 1rem;
    }

    /* Hide sidebar when collapsed on mobile */
    .modern-sidebar:not(:has(.menu-content.show))[b-j4zbcyft33] {
        position: relative;
        height: auto;
        box-shadow: none;
    }

    .modern-sidebar:not(:has(.menu-content.show)) .menu-header[b-j4zbcyft33] {
        display: none;
    }
}
/* /Components/Admin/Templates/TemplatesView.razor.rz.scp.css */
/* ======================================
   Admin Templates View � Shared admin
   card/table styles (brand-coloured)
   ====================================== */

/* Search Toolbar (matches Professionals) */
.modern-search-toolbar[b-knhz1fg09b] {
    background: white;
    border-radius: 0.25rem;
    padding: 1.5rem;
    margin-bottom: 2rem;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06);
    border: 1px solid #e0e0e0;
}

.toolbar-main[b-knhz1fg09b] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
}

.search-section[b-knhz1fg09b] {
    flex: 1;
}

.toolbar-controls[b-knhz1fg09b] {
    display: flex;
    align-items: center;
    gap: 1rem;
}

/* Table Card */
.modern-table-card[b-knhz1fg09b] {
    background: white;
    border-radius: 0.25rem;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06);
    border: 1px solid #e0e0e0;
    overflow: hidden;
    margin-bottom: 2rem;
}

.table-header[b-knhz1fg09b] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1.5rem;
    background: #fafafa;
    border-bottom: 1px solid #e0e0e0;
}

.table-title[b-knhz1fg09b] {
    margin: 0;
    font-size: 1.25rem;
    font-weight: 600;
    color: #1a1a1a;
    display: flex;
    align-items: center;
}

    .table-title i[b-knhz1fg09b] {
        color: var(--bs-primary);
    }

/* Empty State Card */
.modern-empty-card[b-knhz1fg09b] {
    text-align: center;
    background: #fafafa;
    border: 1px dashed #d0d0d0;
    border-radius: 0.25rem;
    padding: 4rem 2rem;
}

.empty-icon[b-knhz1fg09b] {
    width: 64px;
    height: 64px;
    border-radius: 0.25rem;
    background: rgba(8, 147, 163, 0.1);
    color: var(--bs-primary);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 2rem;
    margin: 0 auto 1.5rem auto;
}

.empty-content h5[b-knhz1fg09b] {
    margin: 0 0 0.5rem 0;
    color: #1a1a1a;
}

/* Row hover */
.table tbody tr:hover[b-knhz1fg09b] {
    background: #fafafa;
}
/* /Components/Admin/Users/UsersView.razor.rz.scp.css */
/* ── Toolbar (reuse professionals pattern) ── */
.modern-search-toolbar[b-kvczfwl442] {
    background: white;
    border-radius: 0.375rem;
    padding: 1.25rem 1.5rem;
    border: 1px solid #e0e0e0;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06);
}

.search-input-group[b-kvczfwl442] {
    position: relative;
    display: flex;
    align-items: center;
    background: #fafafa;
    border: 1px solid #d0d0d0;
    border-radius: 0.375rem;
    transition: border-color 0.2s, box-shadow 0.2s;
    min-width: 260px;
}

.search-input-group:focus-within[b-kvczfwl442] {
    border-color: var(--bs-primary);
    box-shadow: 0 0 0 2px rgba(13, 110, 253, 0.15);
}

.search-icon[b-kvczfwl442] {
    padding: 0 0.875rem;
    color: #6c757d;
}

.search-input[b-kvczfwl442] {
    flex: 1;
    padding: 0.6rem 0;
    border: none;
    background: transparent;
    font-size: 0.9375rem;
    outline: none;
}

.clear-search-btn[b-kvczfwl442] {
    padding: 0 0.875rem;
    background: none;
    border: none;
    color: #6c757d;
    cursor: pointer;
}

/* ── Table card ── */
.modern-table-card[b-kvczfwl442] {
    background: white;
    border: 1px solid #e0e0e0;
    border-radius: 0.5rem;
    overflow: hidden;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06);
}

.table-header[b-kvczfwl442] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1rem 1.25rem;
    border-bottom: 1px solid #ebebeb;
    background: #fafafa;
}

.table-title[b-kvczfwl442] {
    margin: 0;
    font-size: 0.9375rem;
    font-weight: 700;
}

/* ── Modern table ── */
.modern-admin-table[b-kvczfwl442] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.875rem;
}

.modern-admin-table thead tr[b-kvczfwl442] {
    background: #f8f9fa;
    border-bottom: 2px solid #e9ecef;
}

.modern-admin-table th[b-kvczfwl442] {
    padding: 0.75rem 1rem;
    font-weight: 600;
    color: #495057;
    white-space: nowrap;
}

.modern-admin-table tbody tr[b-kvczfwl442] {
    border-bottom: 1px solid #f3f3f3;
    transition: background-color 0.15s;
}

.modern-admin-table tbody tr:hover[b-kvczfwl442] {
    background-color: #f8f9ff;
}

.modern-admin-table td[b-kvczfwl442] {
    padding: 0.75rem 1rem;
    vertical-align: middle;
}

/* ── User avatar + cell ── */
.user-cell[b-kvczfwl442] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.user-avatar[b-kvczfwl442] {
    width: 2.25rem;
    height: 2.25rem;
    border-radius: 50%;
    background: var(--bs-primary);
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: 0.8rem;
    flex-shrink: 0;
}

.user-name[b-kvczfwl442] {
    font-weight: 600;
    color: #1a1a1a;
}

.user-id[b-kvczfwl442] {
    font-size: 0.72rem;
    font-family: monospace;
}

/* ── Role badges ── */
.role-badge[b-kvczfwl442] {
    display: inline-block;
    padding: 0.2rem 0.6rem;
    border-radius: 999px;
    font-size: 0.72rem;
    font-weight: 600;
    margin-right: 0.25rem;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

.role-admin[b-kvczfwl442] {
    background: #e8f0fe;
    color: #1a56b0;
    border: 1px solid #c3d7fc;
}

.role-applicant[b-kvczfwl442] {
    background: #e8f5e9;
    color: #1b5e20;
    border: 1px solid #a5d6a7;
}

/* ── Status badges ── */
.status-badge[b-kvczfwl442] {
    display: inline-flex;
    align-items: center;
    padding: 0.25rem 0.65rem;
    border-radius: 999px;
    font-size: 0.75rem;
    font-weight: 600;
    white-space: nowrap;
}

.status-active[b-kvczfwl442] {
    background: #d1fae5;
    color: #065f46;
    border: 1px solid #6ee7b7;
}

.status-locked[b-kvczfwl442] {
    background: #fee2e2;
    color: #991b1b;
    border: 1px solid #fca5a5;
}

/* ── Expanded detail row ── */
.detail-row td[b-kvczfwl442] {
    padding: 0 !important;
}

.detail-panel[b-kvczfwl442] {
    background: #f8f9ff;
    border-top: 1px solid #e0e8ff;
    padding: 1rem 1.25rem;
}

.detail-stat-label[b-kvczfwl442] {
    font-size: 0.72rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #6c757d;
    margin-bottom: 0.2rem;
}

.detail-stat-value[b-kvczfwl442] {
    font-size: 0.875rem;
    color: #1a1a1a;
}

/* ── Loading skeleton ── */
.table-skeleton[b-kvczfwl442] {
    padding: 0.5rem 1rem;
}

.skeleton-row[b-kvczfwl442] {
    display: flex;
    gap: 1rem;
    align-items: center;
    padding: 0.75rem 0;
    border-bottom: 1px solid #f3f3f3;
}

.skeleton-cell[b-kvczfwl442] {
    background: linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 50%, #f0f0f0 75%);
    background-size: 200% 100%;
    animation: shimmer-b-kvczfwl442 1.4s infinite;
    border-radius: 0.25rem;
    height: 1rem;
}

.skeleton-avatar[b-kvczfwl442] { width: 2.25rem; height: 2.25rem; border-radius: 50%; flex-shrink: 0; }
.skeleton-name[b-kvczfwl442]   { width: 130px; }
.skeleton-email[b-kvczfwl442]  { width: 180px; }
.skeleton-company[b-kvczfwl442] { width: 110px; }
.skeleton-role[b-kvczfwl442]   { width: 70px; }
.skeleton-actions[b-kvczfwl442] { width: 90px; margin-left: auto; }

@keyframes shimmer-b-kvczfwl442 {
    0%   { background-position: 200% 0; }
    100% { background-position: -200% 0; }
}
/* /Components/Layout/MainLayout.razor.rz.scp.css */
.page[b-64cn80aojp] {
    position: relative;
    display: flex;
    flex-direction: column;
}

main[b-64cn80aojp] {
    flex: 1;
}


    .top-row[b-64cn80aojp]  a, .top-row[b-64cn80aojp]  .btn-link {
        white-space: nowrap;
        margin-left: 1.5rem;
        text-decoration: none;
    }

    .top-row[b-64cn80aojp]  a:hover, .top-row[b-64cn80aojp]  .btn-link:hover {
        text-decoration: underline;
    }

    .top-row[b-64cn80aojp]  a:first-child {
        overflow: hidden;
        text-overflow: ellipsis;
    }

@media (max-width: 640.98px) {
    .top-row[b-64cn80aojp] {
        justify-content: space-between;
    }

    .top-row[b-64cn80aojp]  a, .top-row[b-64cn80aojp]  .btn-link {
        margin-left: 0;
    }
}

@media (min-width: 641px) {
    .page[b-64cn80aojp] {
        flex-direction: row;
    }

    .sidebar[b-64cn80aojp] {
        width: 300px;
        height: 100vh;
        position: sticky;
        top: 0;
    }

    .top-row[b-64cn80aojp] {
        position: sticky;
        top: 0;
        z-index: 1;
    }

    .top-row.auth[b-64cn80aojp]  a:first-child {
        flex: 1;
        text-align: right;
        width: 0;
    }

    .top-row[b-64cn80aojp], article[b-64cn80aojp] {
        padding-left: 2rem !important;
        padding-right: 1.5rem !important;
    }
}

#blazor-error-ui[b-64cn80aojp] {
    color-scheme: light only;
    background: lightyellow;
    bottom: 0;
    box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
    box-sizing: border-box;
    display: none;
    left: 0;
    padding: 0.6rem 1.25rem 0.7rem 1.25rem;
    position: fixed;
    width: 100%;
    z-index: 1000;
}

    #blazor-error-ui .dismiss[b-64cn80aojp] {
        cursor: pointer;
        position: absolute;
        right: 0.75rem;
        top: 0.5rem;
    }
/* /Components/Layout/UnAuthLayout.razor.rz.scp.css */
/*.page {
    position: relative;
    display: flex;
    flex-direction: column;
}

main {
    flex: 1;
}

.sidebar {
    background-image: linear-gradient(180deg, rgb(5, 39, 103) 0%, #3a0647 70%);
}

.top-row {
    background-color: #f7f7f7;
    border-bottom: 1px solid #d6d5d5;
    justify-content: flex-end;
    height: 3.5rem;
    display: flex;
    align-items: center;
}

    .top-row ::deep a, .top-row ::deep .btn-link {
        white-space: nowrap;
        margin-left: 1.5rem;
        text-decoration: none;
    }

    .top-row ::deep a:hover, .top-row ::deep .btn-link:hover {
        text-decoration: underline;
    }

    .top-row ::deep a:first-child {
        overflow: hidden;
        text-overflow: ellipsis;
    }

@media (max-width: 640.98px) {
    .top-row {
        justify-content: space-between;
    }

    .top-row ::deep a, .top-row ::deep .btn-link {
        margin-left: 0;
    }
}

@media (min-width: 641px) {
    .page {
        flex-direction: row;
    }

    .sidebar {
        width: 250px;
        height: 100vh;
        position: sticky;
        top: 0;
    }

    .top-row {
        position: sticky;
        top: 0;
        z-index: 1;
    }

    .top-row.auth ::deep a:first-child {
        flex: 1;
        text-align: right;
        width: 0;
    }

    .top-row, article {
        padding-left: 2rem !important;
        padding-right: 1.5rem !important;
    }
}*/

#blazor-error-ui[b-48zaowq5hg] {
    color-scheme: light only;
    background: lightyellow;
    bottom: 0;
    box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
    box-sizing: border-box;
    display: none;
    left: 0;
    padding: 0.6rem 1.25rem 0.7rem 1.25rem;
    position: fixed;
    width: 100%;
    z-index: 1000;
}

    #blazor-error-ui .dismiss[b-48zaowq5hg] {
        cursor: pointer;
        position: absolute;
        right: 0.75rem;
        top: 0.5rem;
    }
/* /Components/SecurityAccount/Pages/AdminDocuments/AdminDocumentsView.razor.rz.scp.css */
/* ── Upload drop zone ── */
.upload-container[b-0ye2m6lqmm] {
    transition: border-color 0.2s ease, background-color 0.2s ease;
    min-height: 160px;
}

.upload-container:hover[b-0ye2m6lqmm] {
    border-color: var(--bs-primary) !important;
    background-color: #eef4ff !important;
}

/* ── Spinner shown while files are uploading ── */
.upload-spinner-overlay[b-0ye2m6lqmm] {
    background-color: rgba(255, 255, 255, 0.88);
    pointer-events: none;
    z-index: 10;
}
/* /Components/SecurityAccount/Pages/AdminNotes/AdminNotes.razor.rz.scp.css */
/* Notes Conversation Styles */
.notes-conversation[b-3k1p9252f6] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.note-item[b-3k1p9252f6] {
    background: #ffffff;
    border: 1px solid #e0e0e0;
    border-radius: 0.5rem;
    padding: 1rem;
    transition: box-shadow 0.2s ease;
}

.note-item:hover[b-3k1p9252f6] {
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
}

.note-header[b-3k1p9252f6] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 0.75rem;
    padding-bottom: 0.75rem;
    border-bottom: 1px solid #f0f0f0;
}

.note-author[b-3k1p9252f6] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.author-avatar[b-3k1p9252f6] {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: linear-gradient(135deg, #0893A3 0%, #055f6d 100%);
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 600;
    font-size: 0.875rem;
    flex-shrink: 0;
}

.author-info[b-3k1p9252f6] {
    display: flex;
    flex-direction: column;
}

.author-name[b-3k1p9252f6] {
    font-weight: 600;
    font-size: 0.9375rem;
    color: #1a1a1a;
}

.note-date[b-3k1p9252f6] {
    font-size: 0.8125rem;
    color: #666666;
}

.note-actions[b-3k1p9252f6] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.note-content[b-3k1p9252f6] {
    color: #333333;
    font-size: 0.9375rem;
    line-height: 1.6;
    white-space: pre-wrap;
    word-wrap: break-word;
}

/* Responsive */
@media (max-width: 768px) {
    .note-header[b-3k1p9252f6] {
        flex-direction: column;
        gap: 0.75rem;
    }
    
    .note-actions[b-3k1p9252f6] {
        align-self: flex-end;
    }
}
/* /Components/SecurityAccount/Pages/Documents/DocumentsView.razor.rz.scp.css */
.upload-container[b-amj8d3u602] {
    background: #fafafa;
    transition: all 0.2s ease;
}

.upload-container:hover[b-amj8d3u602] {
    background: rgba(13,110,253,0.08);
    border-color: #0d6efd !important;
    box-shadow: 0 0 0 2px rgba(13,110,253,0.15);
}
.upload-container:hover i[b-amj8d3u602] {
    transform: scale(1.05);
    transition: transform 0.2s ease;
}

/* ── Spinner shown while files are uploading ── */
.upload-spinner-overlay[b-amj8d3u602] {
    background-color: rgba(255, 255, 255, 0.88);
    pointer-events: none;
    z-index: 10;
}
/* /Components/SecurityAccount/Pages/NotificationsView.razor.rz.scp.css */
/* ?? Sub-header bar glass content ?????????????????????????? */
.sa-page-header[b-lktjsc8yl8] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    gap: 1.5rem;
}

.sa-page-header h2[b-lktjsc8yl8] {
    font-size: 1.5rem;
    color: white;
    margin: 0;
}

.sa-page-header-sub[b-lktjsc8yl8] {
    color: rgba(255, 255, 255, 0.7);
    font-size: 0.8125rem;
    font-weight: 400;
}

/* Matches .header-icon in SecurityAccountHeaderBar exactly */
.sa-page-header-icon[b-lktjsc8yl8] {
    width: 64px;
    height: 64px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 16px;
    background: rgba(255, 255, 255, 0.15);
    backdrop-filter: blur(10px);
    border: 2px solid rgba(255, 255, 255, 0.2);
    color: white;
    font-size: 1.75rem;
    flex-shrink: 0;
    transition: all 0.3s ease;
}

.sa-page-header-icon:hover[b-lktjsc8yl8] {
    transform: scale(1.05);
    background: rgba(255, 255, 255, 0.2);
}

/* Matches .info-pill in SecurityAccountHeaderBar exactly */
.sa-page-header-pill[b-lktjsc8yl8] {
    background: rgba(255, 255, 255, 0.15);
    backdrop-filter: blur(10px);
    border-radius: 12px;
    padding: 0.75rem 1rem;
    border: 1px solid rgba(255, 255, 255, 0.2);
    text-align: center;
    min-width: 100px;
    transition: all 0.3s ease;
    flex-shrink: 0;
}

.sa-page-header-pill:hover[b-lktjsc8yl8] {
    background: rgba(255, 255, 255, 0.2);
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

.sa-page-header-pill-label[b-lktjsc8yl8] {
    color: rgba(255, 255, 255, 0.7);
    font-size: 0.75rem;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin-bottom: 0.25rem;
}

.sa-page-header-pill-value[b-lktjsc8yl8] {
    color: white;
    font-weight: 600;
    font-size: 0.95rem;
}

@media (max-width: 768px) {
    .sa-page-header-icon[b-lktjsc8yl8] { width: 48px; height: 48px; font-size: 1.25rem; }
}

@media (max-width: 576px) {
    .sa-page-header h2[b-lktjsc8yl8] { font-size: 1.125rem; }
    .sa-page-header-pill[b-lktjsc8yl8] { display: none; }
}

/* Notification Card Animations */
@keyframes fadeIn-b-lktjsc8yl8 {
    from {
        opacity: 0;
        transform: translateY(10px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes fadeOut-b-lktjsc8yl8 {
    from {
        opacity: 1;
        transform: scale(1);
    }
    to {
        opacity: 0;
        transform: scale(0.95);
    }
}

@keyframes shimmer-b-lktjsc8yl8 {
    0% {
        background-position: -1000px 0;
    }
    100% {
        background-position: 1000px 0;
    }
}

/* Notification Card Styles */
.notification-card[b-lktjsc8yl8] {
    transition: all 0.2s ease;
    border-left: 3px solid transparent;
    cursor: pointer;
    animation: fadeIn-b-lktjsc8yl8 0.4s ease forwards;
    border-radius: 0.25rem;
}

.notification-card:hover[b-lktjsc8yl8] {
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1) !important;
    border-left-color: var(--bs-primary);
}

.notification-card.deleting[b-lktjsc8yl8] {
    animation: fadeOut-b-lktjsc8yl8 0.3s ease forwards;
}

/* Icon Container */
.notification-icon[b-lktjsc8yl8] {
    width: 48px;
    height: 48px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 0.25rem;
    transition: all 0.2s ease;
}

.notification-card:hover .notification-icon[b-lktjsc8yl8] {
    transform: scale(1.05);
}

/* Unread Badge */
.unread-badge[b-lktjsc8yl8] {
    width: 10px;
    height: 10px;
    border-radius: 0.125rem;
    background: var(--bs-danger);
    border: 2px solid white;
    position: absolute;
    top: -2px;
    right: -2px;
}

/* Action Buttons */
.notification-actions[b-lktjsc8yl8] {
    opacity: 0;
    transition: opacity 0.2s ease;
}

.notification-card:hover .notification-actions[b-lktjsc8yl8] {
    opacity: 1;
}

/* Loading Skeleton */
.skeleton[b-lktjsc8yl8] {
    background: linear-gradient(
        90deg,
        #f0f0f0 25%,
        #e0e0e0 50%,
        #f0f0f0 75%
    );
    background-size: 1000px 100%;
    animation: shimmer-b-lktjsc8yl8 2s infinite;
    border-radius: 0.25rem;
}

.skeleton-card[b-lktjsc8yl8] {
    animation: fadeIn-b-lktjsc8yl8 0.3s ease;
}

/* Empty State */
.empty-state[b-lktjsc8yl8] {
    animation: fadeIn-b-lktjsc8yl8 0.6s ease;
}

.empty-state-icon[b-lktjsc8yl8] {
    width: 120px;
    height: 120px;
    background: rgba(8, 147, 163, 0.1);
    border-radius: 0.25rem;
}

/* Stats Badge */
.stats-badge[b-lktjsc8yl8] {
    transition: all 0.2s ease;
    border-radius: 0.25rem;
}

.stats-badge:hover[b-lktjsc8yl8] {
    transform: translateY(-2px);
}

/* Group Header */
.group-header[b-lktjsc8yl8] {
    position: sticky;
    top: 0;
    z-index: 10;
    background: rgba(255, 255, 255, 0.95);
    backdrop-filter: blur(2px);
    padding: 1rem 1.25rem;
    margin: 0 -0.5rem 1rem -0.5rem;
    border-radius: 0.25rem;
    border-left: 3px solid var(--bs-primary);
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06);
}

/* Time Badge */
.time-badge[b-lktjsc8yl8] {
    font-size: 0.75rem;
    padding: 0.25rem 0.5rem;
    border-radius: 0.25rem;
    background: rgba(108, 117, 125, 0.1);
    color: #6c757d;
}

/* Type Badge */
.type-badge[b-lktjsc8yl8] {
    font-size: 0.75rem;
    padding: 0.25rem 0.625rem;
    border-radius: 0.25rem;
    font-weight: 500;
}

/* Responsive Adjustments */
@media (max-width: 768px) {
    .notification-actions[b-lktjsc8yl8] {
        opacity: 1;
    }
    
    .notification-card[b-lktjsc8yl8] {
        margin-bottom: 0.75rem;
    }
    
    .notification-icon[b-lktjsc8yl8] {
        width: 40px;
        height: 40px;
    }
}

/* Page Header */
.page-header[b-lktjsc8yl8] {
    background: #fafafa;
    border: 1px solid #e0e0e0;
    border-radius: 0.25rem;
    color: #1a1a1a;
    padding: 2rem 0;
    margin: -1rem -1rem 2rem -1rem;
}

/* Filter Buttons */
.filter-btn[b-lktjsc8yl8] {
    transition: all 0.2s ease;
    border-radius: 0.25rem;
}

.filter-btn:hover[b-lktjsc8yl8] {
    transform: translateY(-1px);
}

.filter-btn.active[b-lktjsc8yl8] {
    background: var(--bs-primary);
    color: white;
    border-color: var(--bs-primary);
}
/* /Components/SecurityAccount/Pages/PaymentRequests/PaymentRequestsView.razor.rz.scp.css */
/* ── Payment Requests: property group heading (inside sa-item-card) ── */
.pr-property-heading[b-lfakn87vgt] {
    font-weight: 600;
    font-size: 0.9375rem;
    color: #1a1a1a;
    padding-bottom: 0.75rem;
    border-bottom: 1px solid #e0e0e0;
}

.pr-property-heading i[b-lfakn87vgt] {
    color: var(--sa-accent, var(--bs-primary));
}

/* ── Admin status select — compact width ── */
.pr-status-select[b-lfakn87vgt] {
    min-width: 160px;
}

/* ── Status badges ── */
.status-badge[b-lfakn87vgt] {
    display: inline-flex;
    align-items: center;
    padding: 0.25rem 0.65rem;
    border-radius: 999px;
    font-size: 0.75rem;
    font-weight: 600;
    white-space: nowrap;
}

.status-badge.pending[b-lfakn87vgt] {
    background: #fff3cd;
    color: #856404;
}

.status-badge.approved[b-lfakn87vgt] {
    background: #d1e7dd;
    color: #0a3622;
}

.status-badge.denied[b-lfakn87vgt] {
    background: #f8d7da;
    color: #58151c;
}

.status-badge.complete[b-lfakn87vgt] {
    background: #cfe2ff;
    color: #084298;
}

/* ── Information / notice panel ── */
.pr-notice[b-lfakn87vgt] {
    background: color-mix(in srgb, var(--bs-primary) 4%, white);
    border: 1px solid color-mix(in srgb, var(--bs-primary) 20%, white);
    border-left: 4px solid var(--bs-primary);
    border-radius: 0.375rem;
    padding: 1rem 1.25rem;
    margin-bottom: 1.5rem;
}

.pr-notice-heading[b-lfakn87vgt] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-weight: 700;
    font-size: 0.9375rem;
    color: var(--bs-primary);
    margin-bottom: 0.75rem;
}

.pr-notice-body p[b-lfakn87vgt] {
    font-size: 0.9375rem;
    color: #3d3d3d;
    line-height: 1.65;
    margin-bottom: 0.625rem;
}

.pr-notice-body p:last-child[b-lfakn87vgt] {
    margin-bottom: 0;
}

.pr-notice-warning[b-lfakn87vgt] {
    display: flex;
    align-items: flex-start;
    gap: 0.25rem;
    background: color-mix(in srgb, #d97706 6%, white);
    border: 1px solid color-mix(in srgb, #d97706 28%, white);
    border-left: 4px solid #d97706;
    border-radius: 0.25rem;
    padding: 0.625rem 0.875rem;
    font-size: 0.875rem;
    color: #5a3200;
    line-height: 1.55;
    margin-top: 0.75rem;
}

.pr-notice-warning i[b-lfakn87vgt] {
    color: #d97706;
    flex-shrink: 0;
    margin-top: 0.15rem;
}

/* ── Form field wrapper with reserved validation message space ── */
.form-field-wrapper[b-lfakn87vgt] {
    display: flex;
    flex-direction: column;
}

.validation-message-slot[b-lfakn87vgt] {
    min-height: 1.25rem;
    font-size: 0.875rem;
    margin-top: 0.25rem;
}
/* /Components/SecurityAccount/Pages/SecurityAccountView.razor.rz.scp.css */
/* ?? Sub-header glass ??????????????????????????????????????? */
.sa-page-header[b-n8i4meg1h6] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    gap: 1.5rem;
}

.sa-page-header h2[b-n8i4meg1h6] { font-size: 1.5rem; color: white; margin: 0; }

.sa-page-header-sub[b-n8i4meg1h6] {
    color: rgba(255, 255, 255, 0.7);
    font-size: 0.875rem;
    font-weight: 400;
}

.sa-page-header-icon[b-n8i4meg1h6] {
    width: 64px; height: 64px;
    display: flex; align-items: center; justify-content: center;
    border-radius: 16px;
    background: rgba(255, 255, 255, 0.15);
    backdrop-filter: blur(10px);
    border: 2px solid rgba(255, 255, 255, 0.2);
    color: white; font-size: 1.75rem; flex-shrink: 0;
    transition: all 0.3s ease;
}

.sa-page-header-icon:hover[b-n8i4meg1h6] { transform: scale(1.05); background: rgba(255,255,255,0.2); }

@media (max-width: 768px) { .sa-page-header-icon[b-n8i4meg1h6] { width: 48px; height: 48px; font-size: 1.25rem; } }
@media (max-width: 576px) { .sa-page-header h2[b-n8i4meg1h6] { font-size: 1.125rem; } }

/* ?? Compact type tabs ?????????????????????????????????????? */
.type-tabs[b-n8i4meg1h6] {
    display: flex;
    background: white;
    border: 1px solid #e0e0e0;
    border-radius: 0.375rem;
    padding: 0.25rem;
    gap: 0.25rem;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06);
}

.type-tab[b-n8i4meg1h6] {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.4375rem;
    padding: 0.5rem 0.75rem;
    border: none;
    background: transparent;
    border-radius: 0.25rem;
    font-size: 0.9375rem;
    font-weight: 500;
    color: #6c757d;
    cursor: pointer;
    transition: all 0.15s ease;
    white-space: nowrap;
    border-bottom: 2px solid transparent;
}

.type-tab:hover:not(.active)[b-n8i4meg1h6] {
    background: #f8f9fa;
    color: #212529;
}

.tab-label[b-n8i4meg1h6] { display: inline; }

.tab-count[b-n8i4meg1h6] {
    border-radius: 20px;
    padding: 0.125rem 0.5rem;
    font-size: 0.75rem;
    font-weight: 700;
    background: #f0f0f0;
    color: #6c757d;
}

/* Per-type active states */
.type-tab-party-wall.active[b-n8i4meg1h6] {
    color: var(--bs-primary);
    border-bottom-color: var(--bs-primary);
    background: rgba(8, 147, 163, 0.06);
    font-weight: 600;
}
.type-tab-party-wall.active .tab-count[b-n8i4meg1h6] { background: rgba(8,147,163,0.12); color: var(--bs-primary); }

.type-tab-building-contract.active[b-n8i4meg1h6] {
    color: var(--bs-success);
    border-bottom-color: var(--bs-success);
    background: rgba(16, 185, 129, 0.06);
    font-weight: 600;
}
.type-tab-building-contract.active .tab-count[b-n8i4meg1h6] { background: rgba(16,185,129,0.12); color: var(--bs-success); }

.type-tab-license.active[b-n8i4meg1h6] {
    color: #d97706;
    border-bottom-color: #d97706;
    background: rgba(217, 119, 6, 0.06);
    font-weight: 600;
}
.type-tab-license.active .tab-count[b-n8i4meg1h6] { background: rgba(217,119,6,0.12); color: #d97706; }

.type-tab-rent-deposit.active[b-n8i4meg1h6] {
    color: var(--bs-info);
    border-bottom-color: var(--bs-info);
    background: rgba(13, 202, 240, 0.06);
    font-weight: 600;
}
.type-tab-rent-deposit.active .tab-count[b-n8i4meg1h6] { background: rgba(13,202,240,0.12); color: var(--bs-info); }

@media (max-width: 640px) {
    .tab-label[b-n8i4meg1h6] { display: none; }
    .type-tab[b-n8i4meg1h6] { padding: 0.5rem; gap: 0.25rem; font-size: 1rem; }
}

/* 🔍 Search bar ─────────────────────────────────────────── */
.search-section[b-n8i4meg1h6] {
    background: white;
    border: 1px solid #d8dde3;
    border-radius: 0.5rem;
    padding: 0.875rem 1rem 0.625rem;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
}

.search-input-wrap[b-n8i4meg1h6] {
    display: flex;
    align-items: center;
    background: #f8f9fa;
    border: 1.5px solid #d0d5dd;
    border-radius: 0.375rem;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
    overflow: hidden;
}

.search-input-wrap:focus-within[b-n8i4meg1h6] {
    border-color: var(--bs-primary);
    box-shadow: 0 0 0 3px rgba(8, 147, 163, 0.12);
    background: white;
}

.search-input-wrap .search-icon[b-n8i4meg1h6] {
    padding: 0 0.625rem 0 0.75rem;
    color: #9ca3af;
    font-size: 0.875rem;
    flex-shrink: 0;
}

.search-input-wrap:focus-within .search-icon[b-n8i4meg1h6] {
    color: var(--bs-primary);
}

.search-input[b-n8i4meg1h6] {
    flex: 1;
    border: none;
    background: transparent;
    padding: 0.4375rem 0;
    font-size: 0.9375rem;
    color: #1a1a1a;
    outline: none;
    min-width: 0;
}

.search-input[b-n8i4meg1h6]::placeholder { color: #9ca3af; }

.search-btn[b-n8i4meg1h6] {
    border: none;
    background: var(--bs-primary);
    color: white;
    padding: 0.4375rem 0.875rem;
    font-size: 0.8125rem;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.15s ease;
    white-space: nowrap;
    flex-shrink: 0;
}

.search-btn:hover[b-n8i4meg1h6] { background: color-mix(in srgb, var(--bs-primary) 85%, black); }

.search-clear-btn[b-n8i4meg1h6] {
    border: none;
    background: transparent;
    color: #9ca3af;
    padding: 0.4375rem 0.625rem;
    cursor: pointer;
    font-size: 0.8125rem;
    transition: color 0.15s ease;
    flex-shrink: 0;
    line-height: 1;
}

.search-clear-btn:hover[b-n8i4meg1h6] { color: #dc3545; }

/* Field hint tags */
.search-hints[b-n8i4meg1h6] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
    flex-wrap: wrap;
    margin-top: 0.5rem;
}

.search-hints-label[b-n8i4meg1h6] {
    font-size: 0.6875rem;
    color: #9ca3af;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.3px;
    white-space: nowrap;
}

.search-hint-tag[b-n8i4meg1h6] {
    display: inline-flex;
    align-items: center;
    gap: 0.2rem;
    font-size: 0.6875rem;
    color: #6c757d;
    background: #f3f4f6;
    border: 1px solid #e5e7eb;
    border-radius: 0.25rem;
    padding: 0.125rem 0.4375rem;
    font-weight: 500;
}

.search-active-info[b-n8i4meg1h6] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
    margin-top: 0.5rem;
    font-size: 0.8125rem;
    color: #6c757d;
}

.search-active-term[b-n8i4meg1h6] {
    font-weight: 600;
    color: var(--bs-primary);
}

/* ?? Row list ??????????????????????????????????????????????? */
.sa-list[b-n8i4meg1h6] {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
}

.sa-row[b-n8i4meg1h6] {
    display: grid;
    grid-template-columns: 40px 120px 1fr minmax(120px, 180px);
    align-items: center;
    gap: 1rem;
    padding: 0.75rem 1rem;
    background: white;
    border: 1px solid #e5e5e5;
    border-left: 4px solid transparent;
    border-radius: 0.25rem;
    cursor: pointer;
    transition: box-shadow 0.15s ease, transform 0.15s ease, background 0.15s ease;
    animation: fadeIn-b-n8i4meg1h6 0.25s ease both;
}

.sa-row:hover[b-n8i4meg1h6] {
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.08);
    transform: translateX(2px);
}

/* Type accent left borders + hover tints */
.sa-row.type-party-wall[b-n8i4meg1h6]      { border-left-color: var(--bs-primary); }
.sa-row.type-party-wall:hover[b-n8i4meg1h6]      { background: rgba(8, 147, 163, 0.025); }

.sa-row.type-building-contract[b-n8i4meg1h6] { border-left-color: var(--bs-success); }
.sa-row.type-building-contract:hover[b-n8i4meg1h6] { background: rgba(16, 185, 129, 0.025); }

.sa-row.type-license[b-n8i4meg1h6]          { border-left-color: #d97706; }
.sa-row.type-license:hover[b-n8i4meg1h6]          { background: rgba(217, 119, 6, 0.025); }

.sa-row.type-rent-deposit[b-n8i4meg1h6]     { border-left-color: var(--bs-info); }
.sa-row.type-rent-deposit:hover[b-n8i4meg1h6]     { background: rgba(13, 202, 240, 0.025); }

/* Icon */
.sa-row-icon[b-n8i4meg1h6] {
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 0.25rem;
    font-size: 1.125rem;
}

/* ID + user */
.sa-row-id[b-n8i4meg1h6] {
    min-width: 0;
    overflow: hidden;
}

.sa-row-ref[b-n8i4meg1h6] {
    display: block;
    font-size: 1rem;
    font-weight: 700;
    color: #1a1a1a;
    line-height: 1.2;
}

.sa-row-user[b-n8i4meg1h6] {
    display: block;
    font-size: 0.75rem;
    color: #6c757d;
    max-width: 120px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    margin-top: 0.125rem;
}

/* Metric chips — CSS grid for exact table-column alignment */
.sa-row-metrics[b-n8i4meg1h6] {
    display: grid;
    align-items: stretch;
    gap: 0.375rem;
    min-width: 0;
}

/* Per-type column templates — 1 date chip (Date of Offer) remains */
.sa-row-metrics.metrics-party-wall[b-n8i4meg1h6] {
    grid-template-columns: minmax(120px, 1.2fr) minmax(110px, 1.2fr) 112px 112px 88px;
}
.sa-row-metrics.metrics-building-contract[b-n8i4meg1h6] {
    grid-template-columns: minmax(100px, 1fr) minmax(130px, 1.3fr) 112px 112px 88px;
}
.sa-row-metrics.metrics-license[b-n8i4meg1h6] {
    grid-template-columns: minmax(150px, 3fr) 112px 112px 88px;
}
.sa-row-metrics.metrics-rent-deposit[b-n8i4meg1h6] {
    grid-template-columns: minmax(150px, 3fr) 112px 112px 88px;
}

.sa-metric[b-n8i4meg1h6] {
    display: flex;
    flex-direction: column;
    padding: 0.25rem 0.5625rem;
    background: #f8f9fa;
    border: 1px solid #e5e5e5;
    border-radius: 0.25rem;
    min-width: 0;
    overflow: hidden;
}

/* Security amount gets a subtle accent */
.sa-metric.sa-metric-highlight[b-n8i4meg1h6] {
    background: color-mix(in srgb, var(--bs-primary) 6%, white);
    border-color: color-mix(in srgb, var(--bs-primary) 25%, white);
}

/* Chip widths are now controlled by the per-type grid-template-columns above */

.sa-metric-label[b-n8i4meg1h6] {
    font-size: 0.6875rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.4px;
    color: #6c757d;
    line-height: 1;
    margin-bottom: 0.1875rem;
}

.sa-metric-value[b-n8i4meg1h6] {
    font-size: 0.875rem;
    font-weight: 600;
    color: #1a1a1a;
    white-space: normal;
    overflow-wrap: break-word;
    line-height: 1.3;
}

/* Status + chevron */
.sa-row-end[b-n8i4meg1h6] {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 0.625rem;
}

.sa-row-arrow[b-n8i4meg1h6] {
    color: #adb5bd;
    font-size: 0.875rem;
    transition: transform 0.15s ease, color 0.15s ease;
}

.sa-row:hover .sa-row-arrow[b-n8i4meg1h6] {
    transform: translateX(3px);
    color: var(--bs-primary);
}

/* Status badge */
.status-badge[b-n8i4meg1h6] {
    padding: 0.3125rem 0.625rem;
    border-radius: 0.25rem;
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.4px;
    white-space: normal;
    word-break: break-word;
    text-align: center;
    line-height: 1.3;
}

/* Skeleton rows */
.sa-row-skeleton[b-n8i4meg1h6] {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 0.875rem 1rem;
    background: white;
    border: 1px solid #e5e5e5;
    border-radius: 0.25rem;
    margin-bottom: 0.375rem;
}

/* ?? Animations ????????????????????????????????????????????? */

/* ── Security Held chip — green accent, mirrors the Security highlight chip ── */
.sa-metric-held[b-n8i4meg1h6] {
    background: color-mix(in srgb, #10b981 6%, white);
    border-color: color-mix(in srgb, #10b981 25%, white);
}
@keyframes fadeIn-b-n8i4meg1h6 {
    from { opacity: 0; transform: translateY(6px); }
    to   { opacity: 1; transform: translateY(0); }
}

@keyframes shimmer-b-n8i4meg1h6 {
    0%   { background-position: -1000px 0; }
    100% { background-position:  1000px 0; }
}

.skeleton[b-n8i4meg1h6] {
    background: linear-gradient(90deg, #f0f0f0 25%, #e5e5e5 50%, #f0f0f0 75%);
    background-size: 1000px 100%;
    animation: shimmer-b-n8i4meg1h6 2s infinite;
    border-radius: 0.25rem;
}

/* ?? Empty state ???????????????????????????????????????????? */
.empty-state-icon[b-n8i4meg1h6] {
    width: 100px; height: 100px;
    background: rgba(8, 147, 163, 0.08);
    margin: 0 auto;
}

/* ?? Pagination ????????????????????????????????????????????? */
.pagination-modern[b-n8i4meg1h6] { gap: 0.25rem; }
.pagination-modern .page-item .page-link[b-n8i4meg1h6] {
    border-radius: 0.25rem;
    border: 1px solid #e0e0e0;
    margin: 0;
}

/* ?? Responsive ????????????????????????????????????????????? */

/* Below 992 px — collapse grid back to wrapping flex */
@media (max-width: 992px) {
    .sa-row-metrics[b-n8i4meg1h6],
    .sa-row-metrics.metrics-party-wall[b-n8i4meg1h6],
    .sa-row-metrics.metrics-building-contract[b-n8i4meg1h6],
    .sa-row-metrics.metrics-license[b-n8i4meg1h6],
    .sa-row-metrics.metrics-rent-deposit[b-n8i4meg1h6] {
        display: flex;
        flex-wrap: wrap;
        align-items: flex-start;
    }
    .sa-row-metrics .sa-metric[b-n8i4meg1h6] { flex: 1 1 120px; }
}

@media (max-width: 768px) {
    .sa-row[b-n8i4meg1h6] {
        grid-template-columns: 32px 80px 1fr 110px;
        gap: 0.625rem;
        padding: 0.625rem 0.75rem;
    }
    .sa-row-user[b-n8i4meg1h6] { display: none; }
    .sa-row-metrics .sa-metric[b-n8i4meg1h6] { flex: 1 1 100px; }
    .sa-metric:nth-child(n+4)[b-n8i4meg1h6] { display: none; }
}

@media (max-width: 576px) {
    .sa-row[b-n8i4meg1h6] {
        grid-template-columns: 32px 1fr auto;
        grid-template-rows: auto auto;
        gap: 0.375rem 0.625rem;
    }

    .sa-row-icon[b-n8i4meg1h6] {
        grid-row: 1;
        grid-column: 1;
        width: 32px; height: 32px; font-size: 0.875rem;
    }

    .sa-row-id[b-n8i4meg1h6] {
        grid-row: 1;
        grid-column: 2;
    }

    .sa-row-end[b-n8i4meg1h6] {
        grid-row: 1;
        grid-column: 3;
        align-self: center;
    }

    .sa-row-metrics[b-n8i4meg1h6] {
        grid-row: 2;
        grid-column: 1 / -1;
        display: flex;
        flex-wrap: wrap;
        gap: 0.375rem;
    }

    .sa-row-metrics .sa-metric[b-n8i4meg1h6] { flex: 1 1 140px; }
    .sa-metric:nth-child(n+3)[b-n8i4meg1h6] { display: none; }
}

/* /Components/SecurityAccount/Shared/AccountMenus/BaseAccountMenu.razor.rz.scp.css */
/* Base Sidebar Styles */
.modern-sidebar[b-tq67ls3sbj] {
    width: 300px;
    height: 100vh;
    position: sticky;
    top: 0;
    background: #f8f9fa;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

/* Account Type Header */
.menu-header[b-tq67ls3sbj] {
    padding: 0.875rem 1rem;
    background: linear-gradient(135deg, rgba(13, 110, 253, 0.1) 0%, rgba(13, 110, 253, 0.05) 100%);
    border-bottom: 1px solid rgba(0, 0, 0, 0.08);
}

.theme-success .menu-header[b-tq67ls3sbj] {
    background: linear-gradient(135deg, rgba(25, 135, 84, 0.1) 0%, rgba(25, 135, 84, 0.05) 100%);
}

.theme-warning .menu-header[b-tq67ls3sbj] {
    background: linear-gradient(135deg, rgba(255, 193, 7, 0.1) 0%, rgba(255, 193, 7, 0.05) 100%);
}

.theme-info .menu-header[b-tq67ls3sbj] {
    background: linear-gradient(135deg, rgba(13, 202, 240, 0.1) 0%, rgba(13, 202, 240, 0.05) 100%);
}

.account-type-badge[b-tq67ls3sbj] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    margin-bottom: 0.5rem;
}

.type-icon[b-tq67ls3sbj] {
    width: 36px;
    height: 36px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    font-size: 1.125rem;
}

.type-info[b-tq67ls3sbj] {
    flex: 1;
}

.type-label[b-tq67ls3sbj] {
    font-size: 0.75rem;
    color: #6c757d;
    text-transform: uppercase;
    font-weight: 600;
    letter-spacing: 0.5px;
}

.type-name[b-tq67ls3sbj] {
    font-size: 0.9rem;
    font-weight: 700;
    color: #212529;
}

/* Progress Container */
.progress-container[b-tq67ls3sbj] {
    margin-top: 0.5rem;
}

.progress-label[b-tq67ls3sbj] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 0.5rem;
    font-size: 0.875rem;
    font-weight: 600;
    color: #495057;
}

.progress-percent[b-tq67ls3sbj] {
    color: var(--bs-primary);
    font-weight: 700;
}

.theme-success .progress-percent[b-tq67ls3sbj] {
    color: var(--bs-success);
}

.theme-warning .progress-percent[b-tq67ls3sbj] {
    color: var(--bs-warning);
}

.theme-info .progress-percent[b-tq67ls3sbj] {
    color: var(--bs-info);
}

.progress[b-tq67ls3sbj] {
    height: 5px;
    background-color: rgba(0, 0, 0, 0.05);
    border-radius: 10px;
    overflow: hidden;
}

/* Mobile Menu Button */
.mobile-menu-btn[b-tq67ls3sbj] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    width: 100%;
    padding: 0.75rem;
    margin: 0 1rem 1rem 1rem;
    background: var(--bs-primary);
    color: white;
    border: none;
    border-radius: 0.75rem;
    font-weight: 600;
    font-size: 0.9375rem;
    transition: all 0.3s ease;
    box-shadow: 0 2px 8px rgba(13, 110, 253, 0.2);
}

.mobile-menu-btn:hover[b-tq67ls3sbj] {
    background: var(--bs-primary);
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(13, 110, 253, 0.3);
}

.mobile-menu-btn i[b-tq67ls3sbj] {
    font-size: 1.25rem;
}

@media (min-width: 769px) {
    .mobile-menu-btn[b-tq67ls3sbj] {
        display: none;
    }
}

/* Menu Content */
.menu-content[b-tq67ls3sbj] {
    flex: 1;
    overflow-y: auto;
    padding: 0.625rem;
}

.menu-content[b-tq67ls3sbj]::-webkit-scrollbar {
    width: 6px;
}

.menu-content[b-tq67ls3sbj]::-webkit-scrollbar-track {
    background: transparent;
}

.menu-content[b-tq67ls3sbj]::-webkit-scrollbar-thumb {
    background: rgba(0, 0, 0, 0.2);
    border-radius: 10px;
}

.menu-content[b-tq67ls3sbj]::-webkit-scrollbar-thumb:hover {
    background: rgba(0, 0, 0, 0.3);
}

/* Menu Items � ::deep used because NavLink is a child Blazor component;
   the <a> it renders does not reliably receive the CSS isolation scope attribute,
   so we target it as a descendant of the scoped .menu-content wrapper instead. */
.menu-content[b-tq67ls3sbj]  .menu-item {
    display: block;
    padding: 0.5rem 0.75rem;
    margin-bottom: 0.25rem;
    border-radius: 0.625rem;
    background: white;
    border: 2px solid transparent;
    text-decoration: none;
    color: #495057;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
}

.menu-content[b-tq67ls3sbj]  .menu-item:hover {
    transform: translateX(4px);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
    background: #f8f9fa;
    color: #212529;
    text-decoration: none;
}

.menu-content[b-tq67ls3sbj]  .menu-item.active {
    background: linear-gradient(135deg, rgba(13, 110, 253, 0.1) 0%, rgba(13, 110, 253, 0.05) 100%);
    border-color: var(--bs-primary);
    color: var(--bs-primary);
    font-weight: 600;
    box-shadow: 0 4px 12px rgba(13, 110, 253, 0.2);
}

.theme-success .menu-content[b-tq67ls3sbj]  .menu-item.active {
    background: linear-gradient(135deg, rgba(25, 135, 84, 0.1) 0%, rgba(25, 135, 84, 0.05) 100%);
    border-color: var(--bs-success);
    color: var(--bs-success);
    box-shadow: 0 4px 12px rgba(25, 135, 84, 0.2);
}

.theme-warning .menu-content[b-tq67ls3sbj]  .menu-item.active {
    background: linear-gradient(135deg, rgba(255, 193, 7, 0.1) 0%, rgba(255, 193, 7, 0.05) 100%);
    border-color: var(--bs-warning);
    color: var(--bs-warning);
    box-shadow: 0 4px 12px rgba(255, 193, 7, 0.2);
}

.theme-info .menu-content[b-tq67ls3sbj]  .menu-item.active {
    background: linear-gradient(135deg, rgba(13, 202, 240, 0.1) 0%, rgba(13, 202, 240, 0.05) 100%);
    border-color: var(--bs-info);
    color: var(--bs-info);
    box-shadow: 0 4px 12px rgba(13, 202, 240, 0.2);
}

/* Completion Status Border */
.menu-content[b-tq67ls3sbj]  .menu-item.complete {
    border-left: 4px solid var(--bs-success);
}

.menu-content[b-tq67ls3sbj]  .menu-item.incomplete {
    border-left: 4px solid var(--bs-warning);
}

/* Menu Item Content */
.menu-item-content[b-tq67ls3sbj] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
}

.item-left[b-tq67ls3sbj] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex: 1;
}

.item-icon[b-tq67ls3sbj] {
    width: 26px;
    height: 26px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 6px;
    background: rgba(0, 0, 0, 0.05);
    font-size: 0.9rem;
    transition: all 0.3s ease;
}

.menu-content[b-tq67ls3sbj]  .menu-item:hover .item-icon {
    transform: scale(1.1) rotate(5deg);
    background: rgba(13, 110, 253, 0.1);
}

.menu-content[b-tq67ls3sbj]  .menu-item.active .item-icon {
    background: rgba(13, 110, 253, 0.15);
}

.theme-success .menu-content[b-tq67ls3sbj]  .menu-item.active .item-icon {
    background: rgba(25, 135, 84, 0.15);
}

.theme-warning .menu-content[b-tq67ls3sbj]  .menu-item.active .item-icon {
    background: rgba(255, 193, 7, 0.15);
}

.theme-info .menu-content[b-tq67ls3sbj]  .menu-item.active .item-icon {
    background: rgba(13, 202, 240, 0.15);
}

.item-text[b-tq67ls3sbj] {
    font-size: 0.875rem;
    font-weight: 500;
}

/* Completion Badge */
.completion-badge[b-tq67ls3sbj] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    border-radius: 50%;
    font-size: 1rem;
}

.completion-badge.complete[b-tq67ls3sbj] {
    color: var(--bs-success);
}

.completion-badge.incomplete[b-tq67ls3sbj] {
    color: var(--bs-warning);
}

/* Admin Link */
.menu-content[b-tq67ls3sbj]  .admin-link {
    border-left: 4px solid var(--bs-danger);
}

.menu-content[b-tq67ls3sbj]  .admin-link .admin-icon {
    background: rgba(220, 53, 69, 0.1);
    color: var(--bs-danger);
}

.menu-content[b-tq67ls3sbj]  .admin-link:hover .admin-icon {
    background: rgba(220, 53, 69, 0.15);
}

/* Menu Divider */
.menu-divider[b-tq67ls3sbj] {
    display: flex;
    align-items: center;
    margin: 0.75rem 0 0.5rem 0;
    position: relative;
}

.menu-divider[b-tq67ls3sbj]::before,
.menu-divider[b-tq67ls3sbj]::after {
    content: '';
    flex: 1;
    height: 1px;
    background: rgba(0, 0, 0, 0.1);
}

.divider-text[b-tq67ls3sbj] {
    padding: 0 1rem;
    font-size: 0.75rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: var(--bs-body-color);
}

/* Loading Skeleton */
.menu-item-skeleton[b-tq67ls3sbj] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.5rem 0.75rem;
    margin-bottom: 0.25rem;
    border-radius: 0.625rem;
    background: white;
}

.skeleton-icon[b-tq67ls3sbj] {
    width: 32px;
    height: 32px;
    border-radius: 8px;
    background: linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 50%, #f0f0f0 75%);
    background-size: 200% 100%;
    animation: shimmer-b-tq67ls3sbj 2s infinite;
}

.skeleton-text[b-tq67ls3sbj] {
    flex: 1;
    height: 16px;
    border-radius: 4px;
    background: linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 50%, #f0f0f0 75%);
    background-size: 200% 100%;
    animation: shimmer-b-tq67ls3sbj 2s infinite;
}

@keyframes shimmer-b-tq67ls3sbj {
    0% {
        background-position: 200% 0;
    }
    100% {
        background-position: -200% 0;
    }
}

/* Responsive */
@media (max-width: 768px) {
    .modern-sidebar[b-tq67ls3sbj] {
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        width: 100%;
        height: auto;
        max-height: 100vh;
        z-index: 1040;
        overflow-y: auto;
        box-shadow: 0 4px 20px rgba(0, 0, 0, 0.2);
    }

    .menu-header[b-tq67ls3sbj] {
        position: sticky;
        top: 0;
        z-index: 1041;
    }

    .mobile-menu-btn[b-tq67ls3sbj] {
        position: fixed;
        bottom: 20px;
        right: 20px;
        z-index: 1050;
        width: auto;
        min-width: 120px;
        box-shadow: 0 4px 20px rgba(13, 110, 253, 0.4);
    }

    .menu-content[b-tq67ls3sbj] {
        max-height: 60vh;
        overflow-y: auto;
    }

    .menu-content.collapse:not(.show)[b-tq67ls3sbj] {
        display: none;
    }

    .type-icon[b-tq67ls3sbj] {
        width: 40px;
        height: 40px;
        font-size: 1.25rem;
    }

    .item-icon[b-tq67ls3sbj] {
        width: 28px;
        height: 28px;
        font-size: 1rem;
    }

    /* Hide sidebar when collapsed on mobile */
    .modern-sidebar:not(:has(.menu-content.show))[b-tq67ls3sbj] {
        position: relative;
        height: auto;
        box-shadow: none;
    }

    .modern-sidebar:not(:has(.menu-content.show)) .menu-header[b-tq67ls3sbj] {
        display: none;
    }
}
/* /Components/SecurityAccount/Shared/GoogleAddressLookup.razor.rz.scp.css */
.postcode-lookup[b-z7a882ib0s] { }

/* ── Search row ───────────────────────────────────────────────────────────── */
.postcode-search-row[b-z7a882ib0s] {
    display: flex;
    align-items: stretch;
    gap: 0.5rem;
}

.postcode-input[b-z7a882ib0s] {
    text-transform: uppercase;
    letter-spacing: 0.05em;
    font-weight: 500;
}

.postcode-find-btn[b-z7a882ib0s] {
    flex-shrink: 0;
    min-width: 64px;
    border-radius: 0.375rem;
    font-weight: 600;
}

/* ── Address select ───────────────────────────────────────────────────────── */
.postcode-select option:first-child[b-z7a882ib0s] {
    color: #6c757d;
}

/* ── Status messages ──────────────────────────────────────────────────────── */
.postcode-message[b-z7a882ib0s] {
    font-size: 0.8125rem;
    margin-top: 0.375rem;
    display: flex;
    align-items: center;
    gap: 0.25rem;
}

.postcode-message-error[b-z7a882ib0s]   { color: #dc3545; }
.postcode-message-muted[b-z7a882ib0s]   { color: #6c757d; }
.postcode-message-success[b-z7a882ib0s] { color: #198754; }

/* ── Footer row (confirmation + clear button) ─────────────────────────────── */
.postcode-footer[b-z7a882ib0s] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 0.25rem;
    min-height: 1.5rem;
}

.postcode-clear-btn[b-z7a882ib0s] {
    font-size: 0.8125rem;
    padding: 0;
    color: #6c757d;
    text-decoration: none;
    white-space: nowrap;
}

.postcode-clear-btn:hover[b-z7a882ib0s] { color: #dc3545; }
/* /Components/SecurityAccount/Shared/SecurityAccountHeaderBar.razor.rz.scp.css */
/* Header Icon Container */
.header-icon[b-i36t00gt1l] {
    width: 64px;
    height: 64px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 16px;
    background: rgba(255, 255, 255, 0.15);
    backdrop-filter: blur(10px);
    border: 2px solid rgba(255, 255, 255, 0.2);
    transition: all 0.3s ease;
}

.header-icon:hover[b-i36t00gt1l] {
    transform: scale(1.05);
    background: rgba(255, 255, 255, 0.2);
}

/* Info Pills */
.info-pill[b-i36t00gt1l] {
    background: rgba(255, 255, 255, 0.15);
    backdrop-filter: blur(10px);
    border-radius: 12px;
    padding: 0.75rem 1rem;
    border: 1px solid rgba(255, 255, 255, 0.2);
    text-align: center;
    min-width: 140px;
    transition: all 0.3s ease;
}

.info-pill:hover[b-i36t00gt1l] {
    background: rgba(255, 255, 255, 0.2);
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

/* Clickable Pills */
.info-pill-clickable[b-i36t00gt1l] {
    cursor: pointer;
}

.info-pill-clickable:hover[b-i36t00gt1l] {
    background: rgba(255, 255, 255, 0.25);
    transform: translateY(-3px);
    box-shadow: 0 6px 16px rgba(0, 0, 0, 0.2);
}

.info-pill-clickable:active[b-i36t00gt1l] {
    transform: translateY(-1px);
}

.info-pill-label[b-i36t00gt1l] {
    color: rgba(255, 255, 255, 0.95);
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin-bottom: 0.25rem;
}

.info-pill-value[b-i36t00gt1l] {
    color: white;
    font-weight: 600;
    font-size: 0.95rem;
}

/* Reminder Pills */
.info-pill-reminder[b-i36t00gt1l] {
    background: rgba(13, 202, 240, 0.2);
    border-color: rgba(13, 202, 240, 0.4);
}

.info-pill-reminder:hover[b-i36t00gt1l] {
    background: rgba(13, 202, 240, 0.3);
    border-color: rgba(13, 202, 240, 0.6);
}

.info-pill-reminder .info-pill-label[b-i36t00gt1l] {
    color: #fff;
    font-weight: 600;
}

/* Status Select */
.status-select[b-i36t00gt1l] {
    background: rgba(255, 255, 255, 0.95);
    border: 1px solid rgba(255, 255, 255, 0.3);
    color: #333;
    font-weight: 500;
    transition: all 0.3s ease;
}

.status-select:focus[b-i36t00gt1l] {
    background: white;
    border-color: var(--bs-primary);
    box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.25);
}

/* Badge inside pill */
.info-pill .badge[b-i36t00gt1l] {
    font-weight: 600;
    font-size: 0.85rem;
    padding: 0.5rem 0.75rem;
}

/* Alert Banner - Full Width */
.alert-banner[b-i36t00gt1l] {
    background: linear-gradient(135deg, rgba(220, 53, 69, 0.15) 0%, rgba(220, 53, 69, 0.25) 100%);
    backdrop-filter: blur(10px);
    border: 1px solid rgba(220, 53, 69, 0.4);
    border-radius: 12px;
    padding: 1rem 1.25rem;
    cursor: pointer;
    transition: all 0.3s ease;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}

.alert-banner:hover[b-i36t00gt1l] {
    background: linear-gradient(135deg, rgba(220, 53, 69, 0.2) 0%, rgba(220, 53, 69, 0.3) 100%);
    border-color: rgba(220, 53, 69, 0.6);
    transform: translateY(-2px);
    box-shadow: 0 4px 16px rgba(220, 53, 69, 0.2);
}

.alert-banner:active[b-i36t00gt1l] {
    transform: translateY(0);
}

.alert-banner-header[b-i36t00gt1l] {
    display: flex;
    align-items: center;
    color: white;
    font-weight: 600;
    font-size: 0.875rem;
    margin-bottom: 0.75rem;
}

.alert-banner-title[b-i36t00gt1l] {
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.alert-banner-count[b-i36t00gt1l] {
    margin-left: 0.5rem;
    opacity: 0.8;
    font-size: 0.8125rem;
}

.alert-banner-notes[b-i36t00gt1l] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    margin-bottom: 0.75rem;
}

.alert-banner-item[b-i36t00gt1l] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    background: rgba(255, 255, 255, 0.1);
    padding: 0.5rem 0.75rem;
    border-radius: 6px;
    transition: background 0.2s ease;
}

.alert-banner-item:hover[b-i36t00gt1l] {
    background: rgba(255, 255, 255, 0.15);
}

.alert-banner-item .badge[b-i36t00gt1l] {
    font-size: 0.75rem;
    padding: 0.3rem 0.6rem;
    font-weight: 600;
    flex-shrink: 0;
}

.alert-banner-text[b-i36t00gt1l] {
    flex: 1;
    color: rgba(255, 255, 255, 0.95);
    font-size: 0.875rem;
    line-height: 1.4;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

.alert-banner-date[b-i36t00gt1l] {
    color: rgba(255, 255, 255, 0.7);
    font-size: 0.75rem;
    white-space: nowrap;
    flex-shrink: 0;
}

.alert-banner-action[b-i36t00gt1l] {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    color: rgba(255, 255, 255, 0.8);
    font-size: 0.8125rem;
    font-weight: 500;
}

.alert-banner:hover .alert-banner-action[b-i36t00gt1l] {
    color: white;
}

/* Compact Alert Banner - Single Line */
.alert-banner-compact[b-i36t00gt1l] {
    background: linear-gradient(90deg, rgba(220, 53, 69, 0.2) 0%, rgba(220, 53, 69, 0.15) 100%);
    backdrop-filter: blur(10px);
    border: 1px solid rgba(220, 53, 69, 0.4);
    border-radius: 8px;
    padding: 0.5rem 1rem;
    cursor: pointer;
    transition: all 0.3s ease;
}

.alert-banner-compact:hover[b-i36t00gt1l] {
    background: linear-gradient(90deg, rgba(220, 53, 69, 0.25) 0%, rgba(220, 53, 69, 0.2) 100%);
    border-color: rgba(220, 53, 69, 0.6);
    box-shadow: 0 2px 8px rgba(220, 53, 69, 0.2);
}

.alert-banner-compact-content[b-i36t00gt1l] {
    display: flex;
    align-items: center;
    color: white;
    font-size: 0.875rem;
    white-space: nowrap;
    overflow: hidden;
}

.alert-banner-compact-content i:first-child[b-i36t00gt1l] {
    flex-shrink: 0;
}

.alert-banner-compact-content i:last-child[b-i36t00gt1l] {
    margin-left: auto;
    flex-shrink: 0;
    opacity: 0.7;
    transition: opacity 0.2s ease;
}

.alert-banner-compact:hover .alert-banner-compact-content i:last-child[b-i36t00gt1l] {
    opacity: 1;
}

.alert-banner-compact .badge[b-i36t00gt1l] {
    font-size: 0.7rem;
    padding: 0.25rem 0.5rem;
    font-weight: 600;
    flex-shrink: 0;
}

.alert-text[b-i36t00gt1l] {
    color: rgba(255, 255, 255, 0.95);
    margin-right: 0.75rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.alert-separator[b-i36t00gt1l] {
    color: rgba(255, 255, 255, 0.5);
    margin: 0 0.5rem;
    flex-shrink: 0;
}

/* Responsive */
@media (max-width: 768px) {
    .header-icon[b-i36t00gt1l] {
        width: 48px;
        height: 48px;
    }

    .info-pill[b-i36t00gt1l] {
        min-width: auto;
        flex: 1 1 auto;
    }

    .info-pill-value[b-i36t00gt1l] {
        font-size: 0.85rem;
    }

    .alert-banner[b-i36t00gt1l] {
        padding: 0.75rem 1rem;
    }

    .alert-banner-item[b-i36t00gt1l] {
        flex-wrap: wrap;
    }

    .alert-banner-text[b-i36t00gt1l] {
        -webkit-line-clamp: 3;
    }

    .alert-banner-date[b-i36t00gt1l] {
        width: 100%;
        margin-top: 0.25rem;
        font-size: 0.7rem;
    }

    .alert-banner-compact[b-i36t00gt1l] {
        padding: 0.4rem 0.75rem;
    }

    .alert-banner-compact-content[b-i36t00gt1l] {
        font-size: 0.8125rem;
    }

    .alert-text[b-i36t00gt1l] {
        max-width: 200px;
    }
}
/* /Components/SecurityAccount/Shared/SecurityAccountLayout.razor.rz.scp.css */
.page[b-7loeg5kns4] {
    position: relative;
    display: flex;
    flex-direction: column;
}

main[b-7loeg5kns4] {
    flex: 1;
}

.sidebar[b-7loeg5kns4] {
    background-color: var(--bs-gray-100);
}

@media (min-width: 641px) {
    .page[b-7loeg5kns4] {
        flex-direction: row;
    }
}


.top-row[b-7loeg5kns4] {
    background-color: #f7f7f7;
    border-bottom: 1px solid #d6d5d5;
    justify-content: flex-end;
    height: 3.5rem;
    display: flex;
    align-items: center;
}

    .top-row[b-7loeg5kns4]  a, .top-row[b-7loeg5kns4]  .btn-link {
        white-space: nowrap;
        margin-left: 1.5rem;
        text-decoration: none;
    }

    .top-row[b-7loeg5kns4]  a:hover, .top-row[b-7loeg5kns4]  .btn-link:hover {
        text-decoration: underline;
    }

    .top-row[b-7loeg5kns4]  a:first-child {
        overflow: hidden;
        text-overflow: ellipsis;
    }

@media (max-width: 640.98px) {
    .top-row[b-7loeg5kns4] {
        justify-content: space-between;
    }

    .top-row[b-7loeg5kns4]  a, .top-row[b-7loeg5kns4]  .btn-link {
        margin-left: 0;
    }
}

@media (min-width: 641px) {
    .page[b-7loeg5kns4] {
        flex-direction: row;
    }

  
    .top-row[b-7loeg5kns4] {
        position: sticky;
        top: 0;
        z-index: 1;
    }

    .top-row.auth[b-7loeg5kns4]  a:first-child {
        flex: 1;
        text-align: right;
        width: 0;
    }

    .top-row[b-7loeg5kns4], article[b-7loeg5kns4] {
        padding-left: 2rem !important;
        padding-right: 1.5rem !important;
    }
}

#blazor-error-ui[b-7loeg5kns4] {
    color-scheme: light only;
    background: lightyellow;
    bottom: 0;
    box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
    box-sizing: border-box;
    display: none;
    left: 0;
    padding: 0.6rem 1.25rem 0.7rem 1.25rem;
    position: fixed;
    width: 100%;
    z-index: 1000;
}

    #blazor-error-ui .dismiss[b-7loeg5kns4] {
        cursor: pointer;
        position: absolute;
        right: 0.75rem;
        top: 0.5rem;
    }
/* /Components/SecurityAccount/Shared/TitleDropdown.razor.rz.scp.css */
.page[b-t7ehkmg3yr] {
    position: relative;
    display: flex;
    flex-direction: column;
}

main[b-t7ehkmg3yr] {
    flex: 1;
}

.sidebar[b-t7ehkmg3yr] {
    background-color: var(--bs-gray-100);
    height: 9vh;
}

@media (min-width: 576px) {
    .sidebar .d-sm-inline[b-t7ehkmg3yr] {
        display: none !important;
    }
}

.top-row[b-t7ehkmg3yr] {
    background-color: #f7f7f7;
    border-bottom: 1px solid #d6d5d5;
    justify-content: flex-end;
    height: 3.5rem;
    display: flex;
    align-items: center;
}

    .top-row[b-t7ehkmg3yr]  a, .top-row[b-t7ehkmg3yr]  .btn-link {
        white-space: nowrap;
        margin-left: 1.5rem;
        text-decoration: none;
    }

    .top-row[b-t7ehkmg3yr]  a:hover, .top-row[b-t7ehkmg3yr]  .btn-link:hover {
        text-decoration: underline;
    }

    .top-row[b-t7ehkmg3yr]  a:first-child {
        overflow: hidden;
        text-overflow: ellipsis;
    }

@media (max-width: 640.98px) {
    .top-row[b-t7ehkmg3yr] {
        justify-content: space-between;
    }

    .top-row[b-t7ehkmg3yr]  a, .top-row[b-t7ehkmg3yr]  .btn-link {
        margin-left: 0;
    }
}

@media (min-width: 641px) {
    .page[b-t7ehkmg3yr] {
        flex-direction: row;
    }

    .sidebar[b-t7ehkmg3yr] {
        width: 350px;
        height: 100vh;
        position: sticky;
        top: 0;
    }

    .top-row[b-t7ehkmg3yr] {
        position: sticky;
        top: 0;
        z-index: 1;
    }

    .top-row.auth[b-t7ehkmg3yr]  a:first-child {
        flex: 1;
        text-align: right;
        width: 0;
    }

    .top-row[b-t7ehkmg3yr], article[b-t7ehkmg3yr] {
        padding-left: 2rem !important;
        padding-right: 1.5rem !important;
    }
}

#blazor-error-ui[b-t7ehkmg3yr] {
    color-scheme: light only;
    background: lightyellow;
    bottom: 0;
    box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
    box-sizing: border-box;
    display: none;
    left: 0;
    padding: 0.6rem 1.25rem 0.7rem 1.25rem;
    position: fixed;
    width: 100%;
    z-index: 1000;
}

    #blazor-error-ui .dismiss[b-t7ehkmg3yr] {
        cursor: pointer;
        position: absolute;
        right: 0.75rem;
        top: 0.5rem;
    }
/* /Components/Shared/Footer.razor.rz.scp.css */
.footer-links .nav-item[b-utyuzwsgwk] {
    display: flex;
    align-items: center;
}

    .footer-links .nav-item:not(:last-child)[b-utyuzwsgwk]::after {
        content: "|";
        margin-left: .5rem;
        margin-right: .5rem;
        color: var(--bs-secondary);
    }
/* /Components/Shared/Header.razor.rz.scp.css */
/* ?? Header shell ??????????????????????????????????????????? */
.modern-header[b-2864s22mva] {
    position: sticky;
    top: 0;
    z-index: 1030;
    background: white;
    border-bottom: 2px solid #e9ecef;
    box-shadow: 0 1px 6px rgba(0, 0, 0, 0.06);
}

.header-container[b-2864s22mva] {
    display: flex;
    align-items: center;
    height: 76px;
    padding: 0 calc(1.5rem + 0.75rem);
    gap: 2rem;
    overflow: visible;
}

/* ?? Logo ??????????????????????????????????????????????????? */
.logo-link[b-2864s22mva] {
    display: flex;
    align-items: center;
    flex-shrink: 0;
    text-decoration: none;
}

.logo-link:hover[b-2864s22mva] { text-decoration: none; }

.header-logo[b-2864s22mva] {
    height: 48px;
    width: auto;
}

/* ?? Desktop nav ???????????????????????????????????????????? */
.desktop-nav[b-2864s22mva] {
    flex: 1;
    display: flex;
    align-items: stretch;
    height: 100%;
}

.nav-list[b-2864s22mva] {
    display: flex;
    align-items: stretch;
    list-style: none;
    margin: 0;
    padding: 0;
    height: 100%;
}

.nav-item[b-2864s22mva] {
    display: flex;
    align-items: stretch;
}

/*
 * ::deep � NavLink renders as <a>; the CSS isolation b-xxx attribute is
 * not reliably forwarded to child component roots. Use ::deep from the
 * scoped .nav-item wrapper so the descendant selector matches correctly.
 */
.nav-item[b-2864s22mva]  a {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0 1.125rem;
    height: 100%;
    font-size: 1rem;
    font-weight: 500;
    color: #6c757d;
    text-decoration: none;
    border-bottom: 2px solid transparent;
    transition: color 0.15s ease, border-color 0.15s ease;
    white-space: nowrap;
    line-height: 1;
}

.nav-item[b-2864s22mva]  a:hover {
    color: #212529;
    text-decoration: none;
    background: none;
}

.nav-item[b-2864s22mva]  a.active {
    color: var(--bs-primary);
    border-bottom-color: var(--bs-primary);
    font-weight: 600;
}

.nav-item[b-2864s22mva]  a i {
    font-size: 0.875rem;
}

/* ?? User section ??????????????????????????????????????????? */
.user-section[b-2864s22mva] {
    display: flex;
    align-items: center;
    gap: 1rem;
    overflow: visible;
    margin-left: auto;
}

/* ?? Phone link ????????????????????????????????????????????? */
.header-phone[b-2864s22mva] {
    display: flex;
    align-items: center;
    gap: 0.4375rem;
    padding: 0.3125rem 0.75rem;
    border: 1px solid #dee2e6;
    border-radius: 0.375rem;
    color: var(--bs-primary);
    font-size: 0.875rem;
    font-weight: 600;
    text-decoration: none;
    white-space: nowrap;
    transition: background 0.15s ease, border-color 0.15s ease;
    line-height: 1;
}

.header-phone:hover[b-2864s22mva] {
    background: #f8f9fa;
    border-color: #adb5bd;
    color: var(--bs-primary);
    text-decoration: none;
}

.header-phone i[b-2864s22mva] {
    font-size: 0.875rem;
}

.user-dropdown[b-2864s22mva] {
    position: relative;
}

.user-button[b-2864s22mva] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.3125rem 0.625rem;
    background: transparent;
    border: 1px solid #dee2e6;
    border-radius: 0.375rem;
    color: #343a40;
    font-size: 0.8125rem;
    font-weight: 500;
    cursor: pointer;
    transition: background 0.15s ease, border-color 0.15s ease;
    line-height: 1;
}

.user-button:hover[b-2864s22mva] {
    background: #f8f9fa;
    border-color: #adb5bd;
}

.user-avatar[b-2864s22mva] {
    width: 26px;
    height: 26px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--bs-primary);
    border-radius: 50%;
    color: white;
    font-size: 0.6875rem;
    font-weight: 700;
    flex-shrink: 0;
    letter-spacing: 0;
}

.user-name[b-2864s22mva] {
    max-width: 160px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.dropdown-icon[b-2864s22mva] {
    font-size: 0.6875rem;
    color: #6c757d;
    transition: transform 0.2s ease;
}

.dropdown-icon.rotated[b-2864s22mva] {
    transform: rotate(180deg);
}

/* User dropdown menu � named .user-menu deliberately to avoid
 * Bootstrap's .dropdown-menu { display: none } overriding us. */
.user-menu[b-2864s22mva] {
    display: block;
    position: absolute;
    top: calc(100% + 6px);
    right: 0;
    min-width: 200px;
    background: white;
    border-radius: 0.375rem;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.12), 0 1px 4px rgba(0, 0, 0, 0.06);
    border: 1px solid #e9ecef;
    padding: 0.25rem;
    z-index: 1050;
    animation: menuIn-b-2864s22mva 0.15s ease;
    overflow: visible;
}

@keyframes menuIn-b-2864s22mva {
    from { opacity: 0; transform: translateY(-6px); }
    to   { opacity: 1; transform: translateY(0); }
}

.dropdown-identity[b-2864s22mva] {
    padding: 0.625rem 0.75rem 0.5rem;
    border-bottom: 1px solid #f0f0f0;
    margin-bottom: 0.25rem;
}

.dropdown-identity-name[b-2864s22mva] {
    font-size: 0.8125rem;
    font-weight: 600;
    color: #212529;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.dropdown-identity-role[b-2864s22mva] {
    font-size: 0.75rem;
    color: #6c757d;
    margin-top: 0.125rem;
}

/*
 * ::deep � dropdown-item is applied to both <NavLink> (child component)
 * and <button> (direct element). Using ::deep from .dropdown-menu covers both.
 */
.user-menu[b-2864s22mva]  .dropdown-item,
.user-menu .dropdown-item[b-2864s22mva] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.4375rem 0.75rem;
    border-radius: 0.25rem;
    color: #495057;
    font-size: 0.8125rem;
    font-weight: 500;
    text-decoration: none;
    transition: background 0.1s ease;
    border: none;
    background: transparent;
    width: 100%;
    text-align: left;
    cursor: pointer;
    line-height: 1.4;
}

.user-menu[b-2864s22mva]  .dropdown-item:hover,
.user-menu .dropdown-item:hover[b-2864s22mva] {
    background: #f8f9fa;
    color: #212529;
    text-decoration: none;
}

.user-menu[b-2864s22mva]  .dropdown-item i,
.user-menu .dropdown-item i[b-2864s22mva] {
    font-size: 0.875rem;
    width: 14px;
    text-align: center;
    color: #6c757d;
    flex-shrink: 0;
}

.dropdown-divider[b-2864s22mva] {
    height: 1px;
    background: #f0f0f0;
    margin: 0.25rem 0;
}

.user-menu .logout-btn[b-2864s22mva],
.user-menu[b-2864s22mva]  .logout-btn { color: #dc3545; }

.user-menu .logout-btn i[b-2864s22mva],
.user-menu[b-2864s22mva]  .logout-btn i { color: #dc3545; }

.user-menu .logout-btn:hover[b-2864s22mva],
.user-menu[b-2864s22mva]  .logout-btn:hover { background: #fff5f5; color: #dc3545; }

/* ?? Auth buttons ??????????????????????????????????????????? */
.auth-buttons[b-2864s22mva] {
    display: flex;
    gap: 0.5rem;
}

.auth-buttons[b-2864s22mva]  .btn,
.auth-buttons .btn[b-2864s22mva] {
    padding: 0.3125rem 0.875rem;
    font-size: 0.8125rem;
    font-weight: 500;
    border-radius: 0.375rem;
}

/* ?? Mobile toggle ?????????????????????????????????????????? */
.mobile-menu-toggle[b-2864s22mva] {
    display: none;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    background: transparent;
    border: 1px solid #dee2e6;
    border-radius: 0.375rem;
    color: #495057;
    font-size: 1.125rem;
    cursor: pointer;
    transition: background 0.15s ease;
    margin-left: auto;
}

.mobile-menu-toggle:hover[b-2864s22mva] { background: #f8f9fa; }

/* ?? Mobile nav ????????????????????????????????????????????? */
.mobile-nav[b-2864s22mva] {
    overflow: hidden;
    background: white;
    border-top: 1px solid #e9ecef;
}

.mobile-nav-content[b-2864s22mva] { padding: 0.375rem; }

/*
 * ::deep � mobile-nav-link applied to <NavLink> child component and <button>.
 */
.mobile-nav-content[b-2864s22mva]  .mobile-nav-link,
.mobile-nav-content .mobile-nav-link[b-2864s22mva] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    padding: 0.5625rem 0.75rem;
    margin-bottom: 0.125rem;
    border-radius: 0.25rem;
    color: #495057;
    font-size: 0.875rem;
    font-weight: 500;
    text-decoration: none;
    transition: background 0.1s ease;
    border: none;
    background: transparent;
    width: 100%;
    text-align: left;
    cursor: pointer;
    line-height: 1.4;
}

.mobile-nav-content[b-2864s22mva]  .mobile-nav-link:hover,
.mobile-nav-content .mobile-nav-link:hover[b-2864s22mva] {
    background: #f8f9fa;
    color: #212529;
    text-decoration: none;
}

.mobile-nav-content[b-2864s22mva]  .mobile-nav-link.active {
    background: color-mix(in srgb, var(--bs-primary) 8%, white);
    color: var(--bs-primary);
    border-left: 3px solid var(--bs-primary);
    padding-left: calc(0.75rem - 3px);
    font-weight: 600;
}

.mobile-nav-content[b-2864s22mva]  .mobile-nav-link i,
.mobile-nav-content .mobile-nav-link i[b-2864s22mva] {
    font-size: 0.9375rem;
    width: 18px;
    text-align: center;
    color: #6c757d;
    flex-shrink: 0;
}

.mobile-nav-content[b-2864s22mva]  .mobile-nav-link.active i { color: var(--bs-primary); }

.mobile-nav-content[b-2864s22mva]  .mobile-nav-link.logout,
.mobile-nav-content .mobile-nav-link.logout[b-2864s22mva] { color: #dc3545; }

.mobile-nav-content[b-2864s22mva]  .mobile-nav-link.logout i,
.mobile-nav-content .mobile-nav-link.logout i[b-2864s22mva] { color: #dc3545; }

.mobile-nav-content[b-2864s22mva]  .mobile-nav-link.logout:hover,
.mobile-nav-content .mobile-nav-link.logout:hover[b-2864s22mva] { background: #fff5f5; }

.mobile-divider[b-2864s22mva] {
    height: 1px;
    background: #e9ecef;
    margin: 0.375rem 0;
}

/* ?? Responsive ????????????????????????????????????????????? */
@media (max-width: 992px) {
    .desktop-nav[b-2864s22mva] { display: none; }
    .user-section[b-2864s22mva] { display: none; }
    .mobile-menu-toggle[b-2864s22mva] { display: flex; }
    .header-container[b-2864s22mva] { gap: 1rem; }
    .header-logo[b-2864s22mva] { height: 36px; }
}

@media (max-width: 576px) {
    .header-container[b-2864s22mva] { padding: 0 1rem; }
}
/* /Components/Shared/ReconnectModal.razor.rz.scp.css */
.components-reconnect-first-attempt-visible[b-xp8c6lw9i4],
.components-reconnect-repeated-attempt-visible[b-xp8c6lw9i4],
.components-reconnect-failed-visible[b-xp8c6lw9i4],
.components-pause-visible[b-xp8c6lw9i4],
.components-resume-failed-visible[b-xp8c6lw9i4],
.components-rejoining-animation[b-xp8c6lw9i4] {
    display: none;
}

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


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

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

}

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

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

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

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

    100% {
        opacity: 1;
    }
}

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

    100% {
        opacity: 0;
    }
}

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

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

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

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

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

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

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

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

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

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

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

    100% {
        top: 0px;
        left: 0px;
        width: 80px;
        height: 80px;
        opacity: 0;
    }
}
/* /Components/Shared/ToastContainer.razor.rz.scp.css */
.app-toast[b-0oju7px86t] {
    position: fixed;
    bottom: 2rem;
    left: 50%;
    transform: translateX(-50%);
    background: #1a1a1a;
    color: white;
    padding: 0.75rem 1.5rem;
    border-radius: 0.5rem;
    font-size: 0.9375rem;
    font-weight: 500;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.2);
    z-index: 9999;
    animation: toastIn-b-0oju7px86t 0.2s ease;
    white-space: nowrap;
}

@keyframes toastIn-b-0oju7px86t {
    from { opacity: 0; transform: translateX(-50%) translateY(8px); }
    to   { opacity: 1; transform: translateX(-50%) translateY(0); }
}