/* _content/RPMClient/Components/CustomerRecord/CustomerRecordAbstractTile.razor.rz.scp.css */
.badges-container[b-o153br89tf] {
    max-width: 100%;
    justify-content: flex-end; /* Align content to the right */
}

.badges-strip[b-o153br89tf] {
    display: flex;
    align-items: center;
    gap: .5rem;
    flex-wrap: nowrap;
    max-width: 100%;
    overflow: hidden;
    flex: 0 1 auto; /* Allow shrinking but don't grow */
}

.badges-strip > *[b-o153br89tf] {
    flex: 0 0 auto;
}

.plus-badge-btn[b-o153br89tf] {
    flex: 0 0 auto;
    min-width: 2rem;
    line-height: 1;
    padding: .25rem .5rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-left: auto; /* Push to the right if needed */
}

@media (max-width: 991.98px) {
    .badges-container[b-o153br89tf] {
        flex-shrink: 1 !important; /* Override inline flex-shrink-0 */
        min-width: 0; /* Allow content to shrink */
    }

    .badges-strip[b-o153br89tf] {
        flex-wrap: wrap;
        row-gap: .25rem;
        overflow: visible; /* Show wrapped badges */
    }
}

@media (max-width: 575.98px) {
    .badges-strip[b-o153br89tf] {
        gap: .25rem .5rem;
    }
}

/* NAICS Display Styles */
.naics-display-container[b-o153br89tf] {
    min-width: 0; /* Allow flex child to shrink */
    max-width: 100%;
    display: flex;
    align-items: center;
    gap: 4px;
}

.naics-text-button[b-o153br89tf] {
    min-width: 0; /* Allow button to shrink */
    flex: 0 1 auto; /* Don't expand, but allow shrinking */
    overflow: hidden;
}

.naics-name-display[b-o153br89tf] {
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.naics-info-button[b-o153br89tf] {
    flex: 0 0 auto; /* Don't shrink the info button */
    margin-left: 0; /* Keep it close to the text */
}

/* Responsive adjustments for NAICS */
@media (max-width: 767.98px) {
    .naics-display-container[b-o153br89tf] {
        max-width: calc(100vw - 100px); /* Account for padding and margins */
    }
    
    .naics-text-button[b-o153br89tf] {
        max-width: calc(100% - 32px); /* Reserve space for info button */
    }
}

@media (max-width: 575.98px) {
    .naics-display-container[b-o153br89tf] {
        max-width: calc(100vw - 80px); /* Tighter constraints on small mobile */
    }
}
/* _content/RPMClient/Components/CustomerRecord/CustomerRecordDocumentModal.razor.rz.scp.css */
/* Document Detail Modal - Matching GenericDataView Modal Styling */

/* Note: Styles are scoped to this component via Blazor's CSS isolation */
/* These styles will only apply to the Dialog used in this component */

/* Override Syncfusion Dialog Background - Make everything consistent */
[b-roxb7a9jye] .e-dialog {
    background-color: var(--rival-background-secondary) !important;
}

/* Override Syncfusion Dialog Header Background */
[b-roxb7a9jye] .e-dialog .e-dlg-header-content,
[b-roxb7a9jye] .e-dialog .e-dlg-header {
    background-color: var(--rival-background-secondary) !important;
    border-bottom: none !important;
}

/* Override Syncfusion Dialog Content Background */
[b-roxb7a9jye] .e-dialog .e-dlg-content {
    background-color: var(--rival-background-secondary) !important;
}

/* Desktop: Match GenericDataView modal dimensions */
@media (min-width: 1275px) {
    [b-roxb7a9jye] .e-dialog {
        max-width: 1200px !important;
        max-height: 90vh !important;
    }
}

/* Mobile: Full screen */
@media (max-width: 1274px) {
    [b-roxb7a9jye] .e-dialog {
        width: 100vw !important;
        height: 100vh !important;
        max-width: 100vw !important;
        max-height: 100vh !important;
        margin: 0 !important;
    }
}

/* Modal Header Wrapper */
.document-modal-header-wrapper[b-roxb7a9jye] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    width: 100%;
    gap: 1rem;
}

/* Modal Header Row */
.document-modal-header-single-row[b-roxb7a9jye] {
    display: flex;
    align-items: center;
    gap: 1rem;
    flex: 1;
    min-width: 0;
    margin-top:1.25rem;
}

/* Document Title Badge */
.document-title-badge[b-roxb7a9jye] {
    font-size: 1.125rem;
    font-weight: 600;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    flex: 1;
    min-width: 0;
}

/* Delete Icon Button */
.delete-icon-btn[b-roxb7a9jye] {
    background: none;
    border: none;
    cursor: pointer;
    border-radius: 0.375rem;
    transition: all 0.2s;
    font-size: 1.25rem;
    display: flex;
    align-items: center;
    justify-content: center;
}

.delete-icon-btn i[b-roxb7a9jye] {
    font-size: 1.25rem;
}

.delete-icon-btn:hover[b-roxb7a9jye] {
    background-color: var(--rival-border);
}

/* Modal Close Button */
.modal-close-button[b-roxb7a9jye] {
    background: none;
    border: none;
    color: #FFFFFF !important;
    cursor: pointer;
    padding: 0.5rem;
    border-radius: 0.375rem;
    transition: all 0.2s;
    font-size: 1.25rem;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    position: relative;
    z-index: 10;
}

.modal-close-button i[b-roxb7a9jye] {
    font-size: 2rem;
    font-weight: bold;
    color: #FFFFFF !important;
}

.modal-close-button:hover[b-roxb7a9jye] {
    background-color: rgba(255, 255, 255, 0.1);
}

/* Modal Content Container */
.document-modal-content[b-roxb7a9jye] {
    background-color: var(--rival-background-secondary) !important;
    color: #FFFFFF;
    padding: 1.5rem;
    min-height: 400px;
}

/* Metadata Section */
.document-modal-metadata[b-roxb7a9jye] {
    margin-bottom: 1.5rem;
    padding: 1rem;
    background-color: transparent;
    border-radius: 0.375rem;
}

/* Metadata Row */
.metadata-row[b-roxb7a9jye] {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
    margin-bottom: 1rem;
}

.metadata-row:last-child[b-roxb7a9jye] {
    margin-bottom: 0;
}

.metadata-row-horizontal[b-roxb7a9jye] {
    display: flex;
    gap: 2rem;
    flex-wrap: wrap;
}

.metadata-item[b-roxb7a9jye] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

/* Description Row - Single Line Layout */
.metadata-row-single-line[b-roxb7a9jye] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    margin-bottom: 1rem;
}

.metadata-row-single-line:last-child[b-roxb7a9jye] {
    margin-bottom: 0;
}

.metadata-row-single-line .metadata-label[b-roxb7a9jye] {
    flex-shrink: 0;
}

.metadata-row-single-line .description-display-container[b-roxb7a9jye],
.metadata-row-single-line .description-edit-container-inline[b-roxb7a9jye] {
    flex: 1;
    min-width: 0;
}

/* Metadata Labels */
.metadata-label[b-roxb7a9jye] {
    color: var(--rival-gray-600-on-text) !important;
    font-size: 0.875rem;
    font-weight: 500;
    white-space: nowrap;
}

/* Metadata Values */
.metadata-value[b-roxb7a9jye] {
    color: #FFFFFF;
    font-size: 0.9375rem;
}

/* Description Display Container */
.description-display-container[b-roxb7a9jye] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    width: 100%;
}

/* Edit Description Button */
.edit-description-btn[b-roxb7a9jye] {
    background-color: transparent;
    border: 1px solid var(--rival-border);
    color: var(--rival-gray-600-on-text) !important;
    padding: 0.25rem 0.5rem;
    font-size: 0.875rem;
    transition: all 0.2s;
    flex-shrink: 0;
    border-radius: 0.25rem;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
}

.edit-description-btn:hover[b-roxb7a9jye] {
    opacity: 0.8;
    cursor: pointer;
}

/* Description Edit Container */
.description-edit-container-inline[b-roxb7a9jye] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    width: 100%;
    position: relative;
}

/* Description Input */
.description-edit-input-single[b-roxb7a9jye] {
    background-color: var(--rival-background-primary) !important;
    border: 1px solid var(--rival-border) !important;
    color: #FFFFFF !important;
    padding: 0.625rem 0.875rem !important;
    border-radius: 0.375rem !important;
    font-size: 0.9375rem !important;
    width: 100% !important;
    transition: border-color 0.2s ease !important;
}

.description-edit-input-single:focus[b-roxb7a9jye] {
    outline: none !important;
    border-color: #6288C5 !important;
    /*box-shadow: 0 0 0 1px #6288C5 !important;*/
}

.description-edit-input-single[b-roxb7a9jye]::placeholder {
    color: var(--rival-gray-600-on-text) !important;
}

/* Description Counter */
.description-counter[b-roxb7a9jye] {
    color: var(--rival-gray-600-on-text) !important;
    font-size: 0.75rem;
    align-self: flex-end;
}

/* Description Save Status */
.description-save-status[b-roxb7a9jye] {
    color: #59BF98;
    font-size: 0.875rem;
    font-weight: 500;
    padding: 0.5rem;
    border-radius: 0.25rem;
    background-color: rgba(89, 191, 152, 0.1);
    transition: opacity 0.3s ease;
}

.description-save-status.saving[b-roxb7a9jye] {
    color: #6288C5;
    background-color: rgba(98, 136, 197, 0.1);
}

.description-save-status.error[b-roxb7a9jye] {
    color: #D9534F;
    background-color: rgba(217, 83, 79, 0.1);
}

.description-save-status.fade-out[b-roxb7a9jye] {
    animation: fadeOut-b-roxb7a9jye 0.5s ease forwards;
}

@keyframes fadeOut-b-roxb7a9jye {
    from {
        opacity: 1;
    }
    to {
        opacity: 0;
    }
}

/* Preview Section */
.document-preview-main[b-roxb7a9jye] {
    background-color: var(--rival-background-secondary);
    border-radius: 0.375rem;
    border: 1px dashed var(--rival-border);
    min-height: 500px;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}

/* Preview Placeholder */
.preview-placeholder[b-roxb7a9jye] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    color: var(--rival-gray-600-on-text) !important;
    padding: 2rem;
    text-align: center;
}

.preview-icon[b-roxb7a9jye] {
    font-size: 4rem;
    margin-bottom: 1rem;
    color: var(--rival-border);
}

.preview-placeholder p[b-roxb7a9jye] {
    margin: 0.25rem 0;
    font-size: 1rem;
}

.preview-subtitle[b-roxb7a9jye] {
    font-size: 0.875rem;
    color: #707070;
}

/* Mobile Responsive Adjustments */
@media (max-width: 1274px) {
    .document-modal-content[b-roxb7a9jye] {
        padding: 1rem;
    }

    .document-modal-metadata[b-roxb7a9jye] {
        padding: 0.75rem;
    }

    .metadata-row-horizontal[b-roxb7a9jye] {
        flex-direction: column;
        gap: 0.75rem;
    }

    .document-preview-main[b-roxb7a9jye] {
        min-height: 300px;
    }

    .document-title-badge[b-roxb7a9jye] {
        font-size: 1rem;
    }
}

/* Accessibility */
.document-modal-content:focus[b-roxb7a9jye] {
    outline: none;
}

/* Ensure proper z-index for modal overlay */
[b-roxb7a9jye] .document-detail-modal .e-dlg-overlay {
    background-color: rgba(0, 0, 0, 0.5) !important;
    z-index: 1000 !important;
}

[b-roxb7a9jye] .document-detail-modal.e-dialog {
    z-index: 1001 !important;
}
/* _content/RPMClient/Components/CustomerRecord/CustomerRecordInterestsModal.razor.rz.scp.css */
/* Full-screen modal overrides - maintain Syncfusion Dialog functionality */
[b-qw5a63y728] .e-dialog.interestselect-interests-modal {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
    max-width: none !important;
    max-height: none !important;
    border-radius: 0 !important;
    border: none !important;
    z-index: 9999 !important;
    margin: 0 !important;
    box-shadow: none !important;
}

[b-qw5a63y728] .e-dialog.interestselect-interests-modal .e-dlg-content {
    padding: 0 !important;
    height: 100% !important;
}

[b-qw5a63y728] .e-dialog.interestselect-interests-modal .e-dlg-header-content {
    display: none !important;
}

.interestselect-header[b-qw5a63y728] {
    padding: 30px 16px !important;
}

.interestselect-cancel-btn.btn.btn-link[b-qw5a63y728] {
    font-size: 1rem !important;
    font-weight: 500 !important;
    border-radius: 6px !important;
    padding: 6px 8px !important;
    text-decoration: none !important;
}

.interestselect-cancel-btn.btn.btn-link:hover[b-qw5a63y728] {
    text-decoration: none !important;
}

.interestselect-save-btn.btn.btn-primary[b-qw5a63y728] {
    border: none !important;
    font-size: 1rem !important;
    font-weight: 600 !important;
    border-radius: 6px !important;
    padding: 8px 16px !important;
    min-width: 80px !important;
}

.interestselect-save-btn.btn.btn-primary.disabled[b-qw5a63y728],
.interestselect-save-btn.btn.btn-primary:disabled[b-qw5a63y728] {
    cursor: not-allowed !important;
}

.interestselect-title.h4[b-qw5a63y728] {
    font-weight: 700 !important;
}

.interestselect-clear-all.btn.btn-link[b-qw5a63y728] {
    font-size: 0.875rem !important;
    text-decoration: none !important;
    padding: 0 !important;
}

.interestselect-clear-all.btn.btn-link:hover[b-qw5a63y728] {
    text-decoration: none !important;
}

.interestselect-content[b-qw5a63y728] {
    flex: 1;
    overflow: hidden;
}

.interestselect-chip-remove[b-qw5a63y728] {
    background: none !important;
    border: none !important;
    cursor: pointer !important;
    padding: 2px 6px !important;
    border-radius: 50% !important;
    font-size: 0.875rem !important;
}

.interestselect-selected-title.h5[b-qw5a63y728] {
    font-weight: 500 !important;
    margin: 0 !important;
}

.interestselect-clear-all[b-qw5a63y728] {
    background: transparent;
    border: none;
    font-size: 1.125rem;
    cursor: pointer;
    padding: 4px 0;
}

.interestselect-selected-chips[b-qw5a63y728] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.interestselect-interest-chip[b-qw5a63y728] {
    display: inline-flex;
    align-items: center;
    padding: 4px 6px 4px 12px;
    border-radius: 16px;
    font-size: 1rem;
    font-weight: 500;
    gap: 6px;
}

.interestselect-chip-text[b-qw5a63y728] {
    font-weight: 500;
}

.interestselect-chip-remove[b-qw5a63y728] {
    background: transparent;
    border: none;
    cursor: pointer;
    padding: 0;
    width: 16px;
    height: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
}

.interestselect-x-icon[b-qw5a63y728] {
    font-size: 0.75rem;
    line-height: 1;
}

/* Search Section */
.interestselect-search-section[b-qw5a63y728] {
    padding: 16px;
}

.interestselect-search-container[b-qw5a63y728] {
    position: relative;
}

.interestselect-search-icon[b-qw5a63y728] {
    position: absolute;
    left: 12px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 1rem;
    z-index: 10;
}

[b-qw5a63y728] .interestselect-search-input .e-input-group {
    border-radius: 6px !important;
    padding-left: 40px !important;
}

[b-qw5a63y728] .interestselect-search-input .e-input {
    padding: 12px 40px 12px 40px !important;
    font-size: 1rem !important;
    border: none !important;
    background: transparent !important;
}

.interestselect-search-clear[b-qw5a63y728] {
    position: absolute;
    right: 12px;
    top: 50%;
    transform: translateY(-50%);
    background: transparent;
    border: none;
    cursor: pointer;
    font-size: 1.125rem;
    width: 20px;
    height: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Scroll Area */
.interestselect-scroll-area[b-qw5a63y728] {
    flex: 1;
    overflow-y: auto;
    min-height: 100vh;
}

.interestselect-content-inner[b-qw5a63y728] {
    padding: 16px;
}

/* Search Results */
.interestselect-search-results[b-qw5a63y728] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 250px));
    gap: 12px;
    padding: 20px;
    width: 100%;
    box-sizing: border-box;
}

.interestselect-no-results[b-qw5a63y728] {
    text-align: center;
    padding: 64px 0;
}

/* Categories */
.interestselect-categories[b-qw5a63y728] {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.interestselect-category[b-qw5a63y728] {
    border: 1px solid;
    border-radius: 8px;
}

.interestselect-category-header[b-qw5a63y728] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    padding: 24px 16px;
    border-radius: 8px;
    cursor: pointer;
    text-align: left;
}

.interestselect-category-name[b-qw5a63y728] {
    font-size: 1.125rem;
    font-weight: 600;
}

.interestselect-category-info[b-qw5a63y728] {
    display: flex;
    align-items: center;
    gap: 8px;
}

.interestselect-category-count[b-qw5a63y728] {
    font-size: 0.75rem;
}

.interestselect-chevron[b-qw5a63y728] {
    font-size: 0.75rem;
    transition: transform 0.2s ease;
}

.interestselect-category-content[b-qw5a63y728] {
    margin-top: 0;
    margin-left: 0;
}

.interestselect-interests-grid[b-qw5a63y728] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 12px;
    padding: 12px 16px 16px 16px;
    margin-left: 0;
}

/* Interest Buttons */
.interestselect-interest-btn[b-qw5a63y728] {
    padding: 10px 20px;
    border-radius: 6px;
    font-size: 1rem;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.15s ease;
    text-align: left;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    border: 1px solid;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.interestselect-interest-btn .bi-check[b-qw5a63y728] {
    align-content: flex-end;
}

.interestselect-interest-btn:hover[b-qw5a63y728] {
    border-color: transparent;
    transform: none;
    box-shadow: none;
}

.interestselect-interest-btn:disabled[b-qw5a63y728] {
    transform: none;
}

/* Add Custom Interest Button */
.interestselect-add-custom[b-qw5a63y728] {
    padding: 10px 20px;
    border-radius: 6px;
    font-size: 1rem;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.15s ease;
    text-align: center;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    display: inline-block;
    min-width: fit-content;
    margin-top: 8px;
}

.interestselect-add-custom:hover[b-qw5a63y728] {
    transform: none;
    box-shadow: none;
}

/* Responsive Design */
@media (max-width: 768px) {
    .interestselect-header[b-qw5a63y728] {
        padding: 12px 16px;
    }
    
    .interestselect-title[b-qw5a63y728] {
        font-size: 1.25rem;
    }
    
    .interestselect-content-inner[b-qw5a63y728] {
        padding: 12px;
    }
    
    .interestselect-search-results[b-qw5a63y728] {
        grid-template-columns: repeat(auto-fit, minmax(160px, 200px));
        gap: 8px;
    }
    
    .interestselect-interests-grid[b-qw5a63y728] {
        grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
        gap: 8px;
    }
    
    .interestselect-interest-btn[b-qw5a63y728] {
        padding: 6px 10px;
        font-size: 0.75rem;
    }
}

.interestselect-interest-btn:focus[b-qw5a63y728],
.interestselect-category-header:focus[b-qw5a63y728],
.interestselect-chip-remove:focus[b-qw5a63y728] {
    outline-offset: 2px;
}

/* Animation */
.interestselect-interest-btn[b-qw5a63y728],
.interestselect-interest-chip[b-qw5a63y728] {
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
}

.interestselect-categories[b-qw5a63y728] {
    animation: fadeIn-b-qw5a63y728 0.3s ease-out;
}

@keyframes fadeIn-b-qw5a63y728 {
    from {
        opacity: 0;
        transform: translateY(10px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.interestselect-error-state[b-qw5a63y728] {
    text-align: center;
    padding: 64px 20px;
}

.interestselect-error-message[b-qw5a63y728] {
    font-size: 1rem;
    margin-bottom: 16px;
    font-weight: 500;
}

.interestselect-retry-btn[b-qw5a63y728] {
    padding: 10px 20px;
    border-radius: 6px;
    font-size: 1rem;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.15s ease;
}

.interestselect-retry-btn:hover[b-qw5a63y728] {
    transform: none;
    box-shadow: none;
}
/* _content/RPMClient/Components/Journal/JournalTileBadge.razor.rz.scp.css */
.e-badge[b-rxsqbwpg6n] {
    position: relative !important;
    color: var(--rival-text-primary) !important;
    padding-top: 5px !important;
    font-size: small !important;
    height: 25px !important;
}

    .e-badge:hover[b-rxsqbwpg6n] {
        cursor: pointer;
        opacity: 0.8;
    }

.e-badge-success[b-rxsqbwpg6n] {
    background-color: var(--rival-success) !important;
    color: var(--rival-badge-text-on-success) !important;
}

.e-badge-danger[b-rxsqbwpg6n] {
    background-color: var(--rival-red) !important;
    color: var(--rival-badge-text-on-danger) !important;
}

.e-badge-primary[b-rxsqbwpg6n] {
    background-color: var(--rival-light-blue) !important;
    color: var(--rival-badge-text-on-primary) !important;
}
/* _content/RPMClient/Components/Journal/JournalTileLastUpdatedIndicator.razor.rz.scp.css */
#journalTileLastUpdatedIndicator[b-ktw3qzjr9y] {
    display: inline;
    position: static;
    bottom: 1rem;
    right: 1rem;
    font-style: italic;
    align-self: flex-end;
}
/* _content/RPMClient/Components/Journal/JournalTileLine.razor.rz.scp.css */
.journal-tile-line[b-capq31tyxk] {
    font-weight: 400 !important;
    line-height: 2 !important;
    letter-spacing: 0.00938em !important;
}
/* _content/RPMClient/Components/Opportunities/LinesOfBusinessDropdown.razor.rz.scp.css */
.lines-of-business-dropdown-container[b-x17vrgtr4i] {
    position: relative;
}

#lines-of-business-dropdown[b-x17vrgtr4i] {
    background-color: var(--rival-dropdown-bg);
    color: var(--rival-dropdown-text);
    border: 1px solid #ced4da;
    border-radius: 0 4px 4px 0;
}

    #lines-of-business-dropdown[b-x17vrgtr4i]::placeholder {
        color: var(--rival-gray-600-on-text) !important;
    }

.lines-of-business-dropdown-container .input-group-text[b-x17vrgtr4i] {
    background-color: var(--rival-dropdown-bg);
    color: var(--rival-dropdown-text);
    border-right: none;
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}

.lines-of-business-dropdown-results[b-x17vrgtr4i] {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    background-color: var(--rival-dropdown-bg);
    color: var(--rival-dropdown-text);
    border: 1px solid #ced4da;
    box-shadow: 0 5px 10px rgba(0, 0, 0, .2);
    min-height: 2rem;
    max-height: 15rem;
    overflow-y: auto;
    width: 100%;
    z-index: 1000;
}

.lines-of-business-dropdown-result[b-x17vrgtr4i] {
    padding: 0.25rem 0.5rem;
    margin-right: 0;
}

    .lines-of-business-dropdown-result:hover[b-x17vrgtr4i] {
        cursor: pointer;
    }

.lines-of-business-dropdown-results .form-check-input[b-x17vrgtr4i],
.lines-of-business-dropdown-results .form-check-label[b-x17vrgtr4i] {
    pointer-events: none !important;
    background-color: inherit !important;
}

    .lines-of-business-dropdown-results .form-check-input:checked[type=checkbox][b-x17vrgtr4i] {
        color: #000000 !important;
        background-color: var(--rival-light-blue) !important;
        border-color: var(--rival-light-blue) !important;
    }
/* _content/RPMClient/Components/Opportunities/LinesOfBusinessDropdownV2.razor.rz.scp.css */
@media (prefers-contrast: more) {
  .trigger[b-x91atuvmwv] {
    border-color: #9ca3af;
  }

  .menu[b-x91atuvmwv] {
    border-color: #9ca3af;
  }
}

[b-x91atuvmwv] .opportunity-creation-container .dropdown {
  z-index: 10000 !important;
}

[b-x91atuvmwv] .opportunity-creation-container .dropdown .menu {
  z-index: 10001 !important;
  position: fixed !important;
}

[b-x91atuvmwv] .opportunity-creation-container .dropdown .overlay {
  z-index: 10000 !important;
}
/* _content/RPMClient/Components/Shared/AddressLookupInput.razor.rz.scp.css */
.address-lookup-input-container[b-9810xfvjuo] {
    position: relative;
}

#address-lookup-input[b-9810xfvjuo] {
    background-color: var(--rival-input-bg);
    color: var(--rival-text-primary);
    border: 1px solid #ced4da;
    border-radius: 4px;
}

    #address-lookup-input[b-9810xfvjuo]::placeholder {
        color: var(--rival-gray-600-on-text) !important;
    }

.address-lookup-input-results[b-9810xfvjuo] {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    background-color: var(--rival-input-bg);
    color: var(--rival-text-primary);
    border: 1px solid #ced4da;
    box-shadow: 0 5px 10px rgba(0, 0, 0, .2);
    min-height: 2rem;
    max-height: 15rem;
    overflow-y: auto;
    width: 100%;
    z-index: 1000;
}

.address-lookup-input-result[b-9810xfvjuo] {
    padding: 0.5rem;
}

    .address-lookup-input-result:hover[b-9810xfvjuo] {
        background-color: var(--rival-light-blue);
        cursor: pointer;
    }

.address-lookup-input-notification-area[b-9810xfvjuo] {
    flex: 0 0 200px;
}

@media (min-width: 768px) {
    .validate-address-button[b-9810xfvjuo] {
        margin-top: auto;
        margin-bottom: 0.25rem;
        margin-left: 1rem;
        margin-right: 1rem;
    }
}

@media (max-width: 767px) {
    .validate-address-button[b-9810xfvjuo] {
        margin-top: 1rem;
        margin-bottom: 0.25rem;
        margin-left: 0;
        margin-right: 1rem;
    }
}
/* _content/RPMClient/Components/Shared/Badge.razor.rz.scp.css */
.rival-badge[b-58z4w7rq8f] {
    line-height: 2rem !important;
}

/* Mobile condensed variant
   Usage: add class 'rival-badge-mobile' to a Badge.
   Applies only on screens <= 575.98px to avoid affecting desktop layout.
*/
    .rival-badge.rival-badge-mobile[b-58z4w7rq8f] {
        font-size: 1rem;
        font-weight: 500;
        padding-left: .75rem !important;
        padding-right: .75rem !important;
        display: inline-flex;
        align-items: center;
        gap: .5rem;
        line-height: 1.5rem !important;
    }

@media (max-width: 575.98px) {
    .rival-badge.rival-badge-mobile[b-58z4w7rq8f] {
        font-size: 0.72rem !important;
        padding-left: .5rem !important;
        padding-right: .5rem !important;
        display: inline-flex !important;
        align-items: center !important;
        gap: .4rem !important;
        line-height: 1.25rem !important;
    }
}
/* _content/RPMClient/Components/Shared/BadgeButton.razor.rz.scp.css */
.e-badge[b-wr4bq6eri0] {
    position: relative !important;
    color: var(--rival-text-primary) !important;
    padding-top: 5px !important;
    font-size: small !important;
    height: 25px !important;
}

    .e-badge:hover[b-wr4bq6eri0] {
        cursor: pointer;
        opacity: 0.8;
    }

.e-badge-success[b-wr4bq6eri0] {
    background-color: var(--rival-success) !important;
    color: var(--rival-badge-text-on-success) !important;
}

.e-badge-danger[b-wr4bq6eri0] {
    background-color: var(--rival-red) !important;
    color: var(--rival-badge-text-on-danger) !important;
}

.e-badge-primary[b-wr4bq6eri0] {
    background-color: var(--rival-light-blue) !important;
    color: var(--rival-badge-text-on-primary) !important;
}
/* _content/RPMClient/Components/Shared/DataViewToggleButton.razor.rz.scp.css */
[b-xorp19rcxi] .view-toggle {
    display: flex;
    border-radius: 0.5rem;
    padding: 0.25rem;
    gap: 0.25rem;
}

[b-xorp19rcxi] .view-toggle-btn {
    background: none;
    border: none;
    color: #9ca3af;
    border-radius: 0.5rem;
    cursor: pointer;
    transition: all 0.2s;
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: 3rem;
    min-height: 3rem;
    font-size: 1.1rem;
}

    [b-xorp19rcxi] .view-toggle-btn.active {
        background-color: var(--rival-light-blue) !important;
        color: #ffffff !important;
    }

    [b-xorp19rcxi] .view-toggle-btn:hover:not(.active) {
        color: #ffffff;
    }

/* Responsive Design */
@media (max-width: 768px) {
    .view-toggle-container[b-xorp19rcxi] {
        padding: 0.75rem;
    }
}
/* _content/RPMClient/Components/Shared/GenericDataView.razor.rz.scp.css */
/* ===== GENERIC DATA VIEW STYLES ===== */

/* Generic Header and Layout Styles */
[b-nbjz7ogd11] .data-view-header,
[b-nbjz7ogd11] .data-list-header {
    background-color: var(--rival-background-primary) !important;
    border-bottom: 1px solid var(--rival-border) !important;
    padding: 1.5rem !important;
}

/* Backward Compatibility - Contact-specific and Opportunity-specific aliases */
[b-nbjz7ogd11] .contact-list-header,
[b-nbjz7ogd11] .opportunity-list-header,
[b-nbjz7ogd11] .location-list-header,
[b-nbjz7ogd11] .policy-list-header {
    background-color: var(--rival-background-primary) !important;
    border-bottom: 1px solid var(--rival-border) !important;
    padding: 1.5rem !important;
}

/* Content Area - Match header padding for alignment */
[b-nbjz7ogd11] .data-view-content,
[b-nbjz7ogd11] .contact-content,
[b-nbjz7ogd11] .opportunity-content,
[b-nbjz7ogd11] .policy-content {
    padding: 0 1.5rem 1.5rem 1.5rem;
}

/* Removed custom flexbox styles - now using Bootstrap classes:
   .header-top -> d-flex justify-content-between align-items-center mb-3
   .header-right -> d-flex align-items-center gap-2  
   .header-left -> d-flex align-items-center gap-3
*/

[b-nbjz7ogd11] .back-button {
    font-size: 24px;
    color: var(--rival-layout-button-text) !important;
}

    [b-nbjz7ogd11] .back-button:hover {
        text-decoration: none !important;
    }

[b-nbjz7ogd11] .page-title {
    font-size: 24px;
    font-weight: normal;
    color: var(--rival-text-primary);
    margin: 0;
}

/* Generic Badge Styles */
[b-nbjz7ogd11] .data-count-badge {
    background-color: var(--rival-light-blue);
    color: var(--rival-text-primary);
    padding: 0.5rem 0.85rem;
    border-radius: 0.375rem;
    font-size: 12px;
    font-weight: 600;
    margin-left: 0.75rem;
}

/* Backward Compatibility - Contact-specific and Opportunity-specific aliases */
[b-nbjz7ogd11] .contact-count-badge,
[b-nbjz7ogd11] .opportunity-count-badge {
    background-color: var(--rival-light-blue);
    color: #ffffff;
    padding: 0.5rem 0.85rem;
    border-radius: 0.375rem;
    font-size: 12px;
    font-weight: 600;
    margin-left: 0.75rem;
}

[b-nbjz7ogd11] .view-toggle {
    display: inline-flex !important;
    background-color: var(--rival-background-secondary) !important;
    border-radius: 0.5rem !important;
    gap: 0.25rem !important;
    overflow: hidden !important;
}

[b-nbjz7ogd11] .view-toggle-btn {
    background: transparent !important;
    border: none !important;
    color: var(--rival-input-placeholder) !important;
    border-radius: 0.375rem !important;
    cursor: pointer;
    transition: all 0.2s ease !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    outline: none !important;
    box-shadow: none !important;
}

    [b-nbjz7ogd11] .view-toggle-btn.active {
        background-color: var(--rival-light-blue) !important;
        color: #ffffff !important;
        outline: none !important;
        box-shadow: none !important;
    }

    [b-nbjz7ogd11] .view-toggle-btn:hover:not(.active) {
        background-color: rgba(255, 255, 255, 0.1) !important;
        color: var(--rival-text-primary) !important;
    }

    [b-nbjz7ogd11] .view-toggle-btn:focus {
        outline: none !important;
        box-shadow: none !important;
    }

[b-nbjz7ogd11] .w-1em {
    width: 1em !important;
}

[b-nbjz7ogd11] .h-1em {
    height: 1em !important;
}

[b-nbjz7ogd11] .search-controls {
    display: flex;
    align-items: center;
    gap: 1rem;
    background-color: var(--rival-background-primary);
    padding: 1rem 0;
}

[b-nbjz7ogd11] .search-container {
    position: relative;
    flex: 2;
    max-width: 40rem;
    border-radius: 0.5rem;
}

[b-nbjz7ogd11] .search-icon {
    position: absolute;
    left: 0.75rem;
    top: 50%;
    transform: translateY(-50%);
    color: var(--rival-input-placeholder) !important;
    font-size: 1.5rem;
}

[b-nbjz7ogd11] .search-input {
    width: 100%;
    background-color: transparent !important;
    border: 1px solid var(--rival-border) !important;
    color: #FFFFFF !important;
    padding: 0.5rem;
    font-size: 16px;
    box-sizing: border-box;
    transition: border-color 0.2s ease, box-shadow 0.2s ease !important;
}

@media (min-width: 768px) {
    [b-nbjz7ogd11] .search-input {
        font-size: 14px;
    }
}

/* Remove browser autofill background */
[b-nbjz7ogd11] .search-input:-webkit-autofill,
[b-nbjz7ogd11] .search-input:-webkit-autofill:hover,
[b-nbjz7ogd11] .search-input:-webkit-autofill:focus,
[b-nbjz7ogd11] .search-input:-webkit-autofill:active {
    -webkit-box-shadow: 0 0 0 30px transparent inset !important;
    -webkit-text-fill-color: #FFFFFF !important;
    box-shadow: 0 0 0 30px transparent inset !important;
}

/* Remove selection highlight */
[b-nbjz7ogd11] .search-input::selection {
    background-color: transparent;
    color: inherit;
}

[b-nbjz7ogd11] .search-input::placeholder {
    color: var(--rival-input-placeholder) !important;
}

[b-nbjz7ogd11] .search-input:focus {
    outline: none;
    border-color: var(--rival-light-blue) !important;
    box-shadow: 0 0 0 1px var(--rival-light-blue) !important;
    background-color: transparent !important;
}

/* Clear search button alignment */
[b-nbjz7ogd11] .clear-search-btn {
    position: absolute !important;
    right: 1rem !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    background: none !important;
    border: none !important;
    color: var(--rival-input-placeholder) !important;
    cursor: pointer !important;
    font-size: 1.5rem;
    padding: 4px !important;
    border-radius: 50% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 24px !important;
    height: 24px !important;
    transition: color 0.2s ease !important;
    z-index: 10 !important;
}

    [b-nbjz7ogd11] .clear-search-btn:hover {
        color: #ffffff !important;
        background-color: rgba(255, 255, 255, 0.1) !important;
    }

    [b-nbjz7ogd11] .clear-search-btn .e-btn {
        background: none !important;
        border: none !important;
        color: inherit !important;
        padding: 0 !important;
        margin: 0 !important;
        width: 100% !important;
        height: 100% !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        min-width: auto !important;
        min-height: auto !important;
    }

        [b-nbjz7ogd11] .clear-search-btn .e-btn .e-btn-icon {
            font-size: 14px !important;
            line-height: 1 !important;
        }

[b-nbjz7ogd11] .filters-button {
    background-color: var(--rival-background-secondary) !important;
    border: 1px solid var(--rival-border) !important;
    color: var(--rival-text-primary) !important;
    border-radius: 0.375rem !important;
    cursor: pointer !important;
    display: flex !important;
    align-items: center !important;
    gap: 0.5rem !important;
    transition: all 0.2s !important;
    font-weight: 500 !important;
    white-space: nowrap !important;
    font-size: 14px !important;
}

    [b-nbjz7ogd11] .filters-button:hover {
        background-color: var(--rival-border) !important;
        border-color: #707070 !important;
    }

    [b-nbjz7ogd11] .filters-button.active {
        background-color: var(--rival-light-blue) !important;
        border-color: var(--rival-light-blue) !important;
        color: var(--rival-text-primary) !important;
    }

        [b-nbjz7ogd11] .filters-button.active:hover {
            background-color: var(--rival-light-blue) !important;
            border-color: var(--rival-light-blue) !important;
        }

[b-nbjz7ogd11] .add-opportunity-button:hover {
    background-color: var(--rival-orange-disabled);
}

[b-nbjz7ogd11] .contact-content {
    background-color: var(--rival-background-primary);
    min-height: calc(100vh - 200px);
    padding: 0 1rem 1rem 1rem;
}

/* Grid View Styles - Bootstrap migration in progress */
/* Removed custom grid styles - now using Bootstrap grid system:
   .contact-grid -> row g-3
   Grid items -> col-12 col-md-6 col-lg-4 col-xl-3
*/

[b-nbjz7ogd11] .e-row:hover {
    cursor: pointer;
}

/* Generic Card Styles */
[b-nbjz7ogd11] .data-card {
    background-color: var(--rival-background-secondary) !important;
    border: 1px solid var(--rival-border) !important;
    border-radius: 0.5rem !important;
    padding: 0.5rem 0.75rem 0 0.75rem !important;
    cursor: pointer !important;
    transition: all 0.2s !important;
    position: relative !important;
    overflow: hidden !important;
    line-height: 1.1 !important;
    box-sizing: border-box !important;
    display: flex !important;
    flex-direction: column !important;
}

    [b-nbjz7ogd11] .data-card:hover {
        background-color: var(--rival-background-secondary) !important;
        border-color: var(--rival-border) !important;
    }

    [b-nbjz7ogd11] .data-card.expanded {
        grid-column: span 2;
        z-index: 10;
        overflow: hidden !important;
    }

    /* Data Type Specific Variants */
    [b-nbjz7ogd11] .data-card.contact-card {
        min-height: 120px;
    }

    [b-nbjz7ogd11] .data-card.opportunity-card {
        min-height: 200px;
    }

    [b-nbjz7ogd11] .data-card.product-card {
        min-height: 100px;
    }

    [b-nbjz7ogd11] .data-card.order-card {
        min-height: 140px;
    }

/* Generic Card Structure - Reusable across all card types */
[b-nbjz7ogd11] .data-card-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 0.5rem;
    height: auto;
    line-height: 1.1;
}

[b-nbjz7ogd11] .data-card-info {
    flex: 1;
}

[b-nbjz7ogd11] .data-card-expanded {
    position: relative;
    margin-top: 1rem;
    padding-top: 1rem;
    padding-bottom: 0.75rem;
    border-top: 1px solid var(--rival-border);
}

[b-nbjz7ogd11] .data-card-summary {
    margin-top: 0.5rem;
    display: block;
    padding-bottom: 0.75rem;
}

[b-nbjz7ogd11] .data-card-details {
    margin: 0.5rem 0 0 0;
    padding-top: 0.5rem;
    padding-bottom: 0;
}

[b-nbjz7ogd11] .data-card-detail-item {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    margin-bottom: 1rem !important;
    color: var(--rival-input-placeholder);
    font-size: 0.875rem;
}

    [b-nbjz7ogd11] .data-card-detail-item:last-child {
        margin-bottom: 0 !important;
    }

    [b-nbjz7ogd11] .data-card-detail-item i {
        font-size: 1.25rem;
        color: var(--rival-input-placeholder);
        min-width: 1.25rem;
    }

[b-nbjz7ogd11] .data-card-summary-item {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    margin-bottom: 0.75rem;
    color: var(--rival-input-placeholder);
    font-size: 0.875rem;
}

    [b-nbjz7ogd11] .data-card-summary-item:last-child {
        margin-bottom: 0;
    }

    [b-nbjz7ogd11] .data-card-summary-item i {
        font-size: 1.25rem;
        color: var(--rival-input-placeholder);
        min-width: 1.25rem;
    }

/* Backward Compatibility - Type-specific aliases */

/* Contact cards */
[b-nbjz7ogd11] .contact-card {
    background-color: var(--rival-background-secondary) !important;
    border: 1px solid var(--rival-border) !important;
    border-radius: 0.5rem !important;
    padding: 0.5rem 0.75rem 0 0.75rem !important;
    cursor: pointer !important;
    transition: all 0.2s !important;
    position: relative !important;
    overflow: hidden !important;
    line-height: 1.1 !important;
    box-sizing: border-box !important;
    display: flex !important;
    flex-direction: column !important;
    min-height: 120px;
}

    [b-nbjz7ogd11] .contact-card:hover {
        background-color: var(--rival-background-secondary) !important;
        border-color: var(--rival-border) !important;
    }

    [b-nbjz7ogd11] .contact-card.expanded {
        grid-column: span 2;
        z-index: 10;
        overflow: hidden !important;
    }

[b-nbjz7ogd11] .contact-card-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 0.5rem;
    height: auto;
    line-height: 1.1;
}

[b-nbjz7ogd11] .contact-info {
    flex: 1;
}

/* Opportunity cards */
[b-nbjz7ogd11] .opportunity-card {
    background-color: var(--rival-background-secondary) !important;
    border: 1px solid var(--rival-border) !important;
    border-radius: 0.5rem !important;
    padding: 0.5rem 0.75rem 0 0.75rem !important;
    cursor: pointer !important;
    transition: all 0.2s !important;
    position: relative !important;
    overflow: hidden !important;
    line-height: 1.1 !important;
    box-sizing: border-box !important;
    display: flex !important;
    flex-direction: column !important;
    min-height: 200px;
}

    [b-nbjz7ogd11] .opportunity-card:hover {
        background-color: var(--rival-background-secondary) !important;
        border-color: var(--rival-border) !important;
    }

    [b-nbjz7ogd11] .opportunity-card.expanded {
        grid-column: span 2;
        z-index: 10;
        overflow: hidden !important;
    }

/* Generic Content Styles */
[b-nbjz7ogd11] .data-item-title {
    font-size: 1.125rem;
    font-weight: 600;
    color: #ffffff;
    margin: 0 0 1rem 0;
    line-height: 1.2;
}

[b-nbjz7ogd11] .data-item-subtitle {
    color: var(--rival-input-placeholder);
    margin: 0 0 1.5rem 0;
    font-size: 0.875rem;
    font-weight: 400;
    line-height: 1.2;
}

[b-nbjz7ogd11] .data-item-details {
    margin: 0.1rem 0 0 0;
    padding-top: 0.1rem;
    padding-bottom: 0;
}

[b-nbjz7ogd11] .data-item-detail-item {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 1.5rem !important;
    color: var(--rival-input-placeholder);
    font-size: 0.875rem;
}

    [b-nbjz7ogd11] .data-item-detail-item:last-child {
        margin-bottom: 0 !important;
    }

    [b-nbjz7ogd11] .data-item-detail-item i {
        font-size: 1.625rem;
        color: var(--rival-input-placeholder);
    }

[b-nbjz7ogd11] .data-item-link {
    color: var(--rival-light-blue);
    text-decoration: none;
    cursor: pointer;
    transition: color 0.2s;
    font-size: 0.875rem;
}

    [b-nbjz7ogd11] .data-item-link:hover {
        color: var(--rival-light-blue);
        text-decoration: underline;
    }

    [b-nbjz7ogd11] .data-item-link.desktop-disabled {
        cursor: pointer !important;
        pointer-events: auto !important;
    }

        [b-nbjz7ogd11] .data-item-link.desktop-disabled:hover {
            color: var(--rival-light-blue);
            text-decoration: underline;
        }

/* Data Type Specific Content Variants */
[b-nbjz7ogd11] .data-card.contact-card .data-item-title {
    font-weight: 700;
}

[b-nbjz7ogd11] .data-card.product-card .data-item-title {
    font-weight: 600;
}

[b-nbjz7ogd11] .data-card.order-card .data-item-title {
    font-family: monospace;
    font-weight: 600;
}

/* Backward Compatibility - Contact-specific aliases */
[b-nbjz7ogd11] .contact-card .contact-name {
    font-size: 1.125rem;
    font-weight: 600;
    color: #ffffff;
    margin: 0 0 1rem 0;
    line-height: 1.2;
}

[b-nbjz7ogd11] .contact-card .contact-title {
    color: var(--rival-input-placeholder);
    margin: 0 0 1.5rem 0;
    font-size: 0.875rem;
    font-weight: 400;
    line-height: 1.2;
}

[b-nbjz7ogd11] .insured-badge {
    color: #59BF98;
    font-size: 1.75rem;
}

[b-nbjz7ogd11] .contact-card-expanded {
    position: relative;
}

[b-nbjz7ogd11] .collapse-button {
    position: absolute;
    top: -0.5rem;
    left: -0.5rem;
    background-color: var(--rival-background-secondary);
    border: 1px solid var(--rival-border);
    color: var(--rival-input-placeholder);
    width: 2rem;
    height: 2rem;
    border-radius: 50%;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.2s;
}

    [b-nbjz7ogd11] .collapse-button:hover {
        color: #ffffff;
        background-color: var(--rival-border);
    }

[b-nbjz7ogd11] .contact-details {
    margin: 0.1rem 0 0 0;
    padding-top: 0.1rem;
    padding-bottom: 0;
}

[b-nbjz7ogd11] .contact-card .contact-detail-item {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 1.5rem !important;
    color: var(--rival-input-placeholder);
    font-size: 0.875rem;
}

    [b-nbjz7ogd11] .contact-card .contact-detail-item:last-child {
        margin-bottom: 0 !important;
    }

[b-nbjz7ogd11] .contact-details:last-child {
    margin-bottom: 0;
    padding-bottom: 0;
}

[b-nbjz7ogd11] .contact-detail-item i {
    font-size: 1.625rem;
    color: var(--rival-input-placeholder);
}

[b-nbjz7ogd11] .contact-card-summary {
    margin-top: 0;
    display: block;
}

[b-nbjz7ogd11] .contact-summary-item {
    display: flex;
    align-items: center;
    gap: 1rem;
    margin-bottom: 1rem;
    color: var(--rival-input-placeholder);
    font-size: 1.125rem;
}

    [b-nbjz7ogd11] .contact-summary-item:last-child {
        margin-bottom: 0;
    }

    [b-nbjz7ogd11] .contact-summary-item i {
        font-size: 1.5rem;
        color: var(--rival-input-placeholder);
    }

[b-nbjz7ogd11] .social-links {
    display: flex;
    gap: 0.75rem;
    margin-top: 1rem;
}

[b-nbjz7ogd11] .social-link {
    color: var(--rival-light-blue);
    text-decoration: none;
    font-size: 1.5rem;
    transition: color 0.2s;
}

    [b-nbjz7ogd11] .social-link:hover {
        color: var(--rival-light-blue);
    }

[b-nbjz7ogd11] .insured-cell {
    text-align: center;
}

[b-nbjz7ogd11] .contact-link {
    color: var(--rival-light-blue);
    text-decoration: none;
    cursor: pointer;
    transition: color 0.2s;
    font-size: 0.875rem;
}

    [b-nbjz7ogd11] .contact-link:hover {
        color: var(--rival-light-blue);
        text-decoration: underline;
    }

    [b-nbjz7ogd11] .contact-link.desktop-disabled {
        cursor: pointer !important;
        pointer-events: auto !important;
    }

        [b-nbjz7ogd11] .contact-link.desktop-disabled:hover {
            color: var(--rival-light-blue);
            text-decoration: underline;
        }

[b-nbjz7ogd11] .social-cell {
    text-align: center;
}

[b-nbjz7ogd11] .social-icons {
    display: flex;
    gap: 0.5rem;
    justify-content: center;
    align-items: center;
}

[b-nbjz7ogd11] .social-icon {
    color: var(--rival-light-blue);
    text-decoration: none;
    font-size: 1rem;
    transition: color 0.2s;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

    [b-nbjz7ogd11] .social-icon:hover {
        color: var(--rival-light-blue);
    }

/* ========================================
   GENERIC MODAL STYLES (Shell Only)
   Content-specific styles are in individual page CSS files
   ======================================== */

/* Modal Overlay */
[b-nbjz7ogd11] .detail-modal-overlay {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 1000;
    padding: 1rem;
    /* Uses Bootstrap classes: d-flex align-items-center justify-content-center */
}

/* Modal Container */
[b-nbjz7ogd11] .detail-modal {
    background-color: var(--rival-background-secondary);
    border: 1px solid var(--rival-border);
    border-radius: 0.5rem;
    max-width: 50rem;
    width: 100%;
    max-height: 90vh;
    overflow-y: auto;
}

/* Close Button - Aligned with title text using Bootstrap */
/* h2.contact-name: 1.25rem font, 1.5 line-height = 30px line height, center at 15px */
/* Button: 44px height, 29px icon centered at 22px from top */
/* Adjustment: Moving up a bit more for better visual alignment */
[b-nbjz7ogd11] .close-button {
    background: none;
    border: none;
    color: var(--rival-input-placeholder);
    cursor: pointer;
    padding: 0;
    border-radius: 0.375rem;
    transition: all 0.2s;
    font-size: 28px;
    min-width: 44px;
    min-height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    margin-top: -0.625rem; /* Move up a bit more for better alignment */
}

    [b-nbjz7ogd11] .close-button:hover {
        color: #ffffff;
        background-color: var(--rival-border);
    }

    [b-nbjz7ogd11] .close-button .e-btn .e-btn-icon,
    [b-nbjz7ogd11] .close-button.e-btn .e-btn-icon,
    [b-nbjz7ogd11] .close-button .e-css.e-btn .e-btn-icon,
    [b-nbjz7ogd11] .close-button.e-css.e-btn .e-btn-icon {
        font-size: 28px !important;
    }

/* Modal Actions Footer */
[b-nbjz7ogd11] .modal-actions {
    display: flex;
    gap: 1rem;
    padding: 1.5rem;
    justify-content: flex-start;
}

    [b-nbjz7ogd11] .modal-actions .e-btn {
        padding: 0.75rem 1.5rem !important;
        min-height: 3rem !important;
        font-size: 1rem !important;
        min-width: 8rem !important;
    }


/* Social Links Text Styling */
[b-nbjz7ogd11] .social-links-text {
    display: flex;
    flex-wrap: wrap;
    gap: 0.25rem;
    line-height: 1.4;
}

[b-nbjz7ogd11] .social-link-text {
    color: var(--rival-light-blue);
    text-decoration: underline;
    font-size: 0.875rem;
    word-break: break-all;
    transition: color 0.2s;
}

    [b-nbjz7ogd11] .social-link-text:hover {
        color: var(--rival-light-blue);
    }

/* Keyboard Navigation Styles - Match Rival color scheme */
[b-nbjz7ogd11] .contact-card.keyboard-selected,
[b-nbjz7ogd11] .contact-row.keyboard-selected {
    outline: 2px solid var(--rival-light-blue) !important;
    outline-offset: 2px !important;
    background-color: var(--rival-background-secondary) !important;
    box-shadow: 0 0 0 4px rgba(98, 136, 197, 0.2) !important;
}

[b-nbjz7ogd11] .contact-grid:focus {
    outline: 2px solid var(--rival-light-blue) !important;
    outline-offset: 2px !important;
}

/* Accessibility - Focus indicators */
[b-nbjz7ogd11] .contact-card:focus,
[b-nbjz7ogd11] .contact-row:focus {
    outline: 2px solid var(--rival-light-blue) !important;
    outline-offset: 2px !important;
}

/* Touch target sizing for mobile */
@media (max-width: 768px) {
    [b-nbjz7ogd11] .contact-card {
        min-height: 44px !important; /* Minimum touch target size */
        padding: 0.75rem !important;
    }

    [b-nbjz7ogd11] .contact-row {
        min-height: 44px !important; /* Minimum touch target size */
    }
}

/* Tablet Optimization (769px to 991px) */
@media (min-width: 769px) and (max-width: 991px) {
    [b-nbjz7ogd11] .contact-list-header,
    [b-nbjz7ogd11] .opportunity-list-header,
    [b-nbjz7ogd11] .location-list-header,
    [b-nbjz7ogd11] .data-list-header,
    [b-nbjz7ogd11] .data-view-header {
        padding: 1.25rem !important;
    }

    [b-nbjz7ogd11] .search-input {
        font-size: 16px !important;
        padding: 0.5rem !important;
    }

    [b-nbjz7ogd11] .page-title {
        font-size: 2rem !important;
    }

    /* Buttons can be side-by-side on tablets in a row */
    [b-nbjz7ogd11] .d-flex.align-items-center.gap-3:not(.view-toggle) {
        flex-direction: row !important;
        flex-wrap: wrap !important;
    }

    [b-nbjz7ogd11] .search-container {
        flex: 1 1 100% !important;
        margin-bottom: 0.75rem !important;
    }

    [b-nbjz7ogd11] .filters-button,
    [b-nbjz7ogd11] .add-opportunity-button {
        width: auto !important;
        flex: 1 1 auto !important;
        min-width: 140px !important;
        min-height: 48px !important;
    }
}

/* Responsive Design */
@media (max-width: 768px) {
    [b-nbjz7ogd11] .header-top {
        flex-direction: column;
        gap: 1rem;
        align-items: stretch;
    }

    [b-nbjz7ogd11] .header-right {
        align-self: flex-end;
    }

    [b-nbjz7ogd11] .search-controls {
        flex-direction: column;
        gap: 0.75rem;
        padding: 0.75rem;
    }

    [b-nbjz7ogd11] .search-container {
        max-width: none;
    }

    [b-nbjz7ogd11] .contact-grid {
        grid-template-columns: 1fr;
        gap: 1rem;
        padding: 0 0.75rem;
    }

    [b-nbjz7ogd11] .contact-card.expanded {
        grid-column: span 1;
    }

    /* Generic Modal Responsive Styles for Tablet */
    [b-nbjz7ogd11] .detail-modal {
        margin: 0.5rem;
        max-width: none;
        max-height: 95vh;
        overflow-y: auto;
    }

    [b-nbjz7ogd11] .modal-actions {
        flex-direction: column;
        gap: 0.5rem;
        margin-top: 1rem;
    }

    [b-nbjz7ogd11] .contact-link.desktop-disabled {
        cursor: pointer;
        pointer-events: auto;
    }

    /* ========================================
       MOBILE HEADER STYLES - BEST PRACTICES
       ======================================== */

    /* Header Container - Increased padding for breathing room */
    [b-nbjz7ogd11] .contact-list-header,
    [b-nbjz7ogd11] .opportunity-list-header,
    [b-nbjz7ogd11] .location-list-header,
    [b-nbjz7ogd11] .data-list-header,
    [b-nbjz7ogd11] .data-view-header {
        padding: 1rem !important;
    }

    /* First Row (Back Button, Title, Badge, View Toggle) */
    [b-nbjz7ogd11] .d-flex.justify-content-between.align-items-center.mb-3 {
        flex-direction: column !important;
        align-items: stretch !important;
        gap: 1rem !important;
        margin-bottom: 1rem !important;
    }

    /* Left Section (Back Button + Title + Badge) */
    [b-nbjz7ogd11] .d-flex.align-items-center.gap-3 {
        flex-direction: column !important;
        align-items: flex-start !important;
        gap: 0.75rem !important;
        width: 100% !important;
    }

    /* Back Button - Touch Friendly, Left Aligned */
    [b-nbjz7ogd11] .back-button {
        padding: 0.75rem !important;
        font-size: 1rem !important;
        min-height: 48px !important;
        display: inline-flex !important;
        align-items: center !important;
        align-self: flex-start !important;
        margin-right: auto !important;
        width: auto !important;
    }

    /* Page Title - Responsive Size */
    [b-nbjz7ogd11] .page-title {
        font-size: 1.75rem !important;
        line-height: 1.3 !important;
        margin: 0 !important;
        word-wrap: break-word !important;
    }

    /* Count Badge - Compact on Mobile, Desktop Shape */
    [b-nbjz7ogd11] .opportunity-count-badge,
    [b-nbjz7ogd11] .contact-count-badge,
    [b-nbjz7ogd11] .data-count-badge {
        font-size: 0.75rem !important;
        padding: 0.5rem 1.5rem !important;
        border-radius: 0.375rem !important;
        display: inline-block !important;
        width: auto !important;
        max-width: fit-content !important;
        align-self: flex-start !important;
        flex-shrink: 0 !important;
    }

    /* View Toggle Container - Compact Background */
    [b-nbjz7ogd11] .view-toggle {
        display: inline-flex !important;
        width: auto !important;
        max-width: fit-content !important;
        align-self: flex-end !important;
        flex-shrink: 0 !important;
        justify-content: flex-end !important;
        background-color: var(--rival-background-secondary) !important;
        border-radius: 0.5rem !important;
        padding: 0.25rem !important;
        gap: 0.25rem !important;
        margin-top: 0 !important;
    }

    /* View Toggle Buttons - Square Shape Like Desktop */
    [b-nbjz7ogd11] .view-toggle-btn {
        font-size: 1rem !important;
        border-radius: 0.375rem !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
    }

    /* Second Row (Search + Buttons) */
    [b-nbjz7ogd11] .d-flex.align-items-center.gap-3:not(.view-toggle) {
        flex-direction: column !important;
        align-items: stretch !important;
        gap: 0.75rem !important;
        width: 100% !important;
    }

    /* Search Container - Full Width, Prominent */
    [b-nbjz7ogd11] .search-container {
        width: 100% !important;
        max-width: none !important;
        order: 1 !important;
        margin-bottom: 0.5rem !important;
        border-radius: 0.5rem;
    }

    /* Search Input - Large and Easy to Tap */
    [b-nbjz7ogd11] .search-input {
        width: 100% !important;
        font-size: 16px !important; /* Prevents iOS zoom */
        padding: 0.5rem !important;
    }

    /* Search Icon - Properly Sized */
    [b-nbjz7ogd11] .search-icon {
        font-size: 1.25rem !important;
        left: 1rem !important;
    }

    /* Clear Search Button */
    [b-nbjz7ogd11] .clear-search-btn {
        right: 0.5rem !important;
        min-width: 44px !important;
        min-height: 44px !important;
    }

    /* Action Buttons - Full Width, Touch Friendly */
    [b-nbjz7ogd11] .filters-button,
    [b-nbjz7ogd11] .add-opportunity-button {
        width: 100% !important;
        justify-content: center !important;
        padding: 0.5rem 1rem !important;
        font-size: 1rem !important;
        border-radius: 8px !important;
        order: 2 !important;
    }

    /* Filters button should be slightly less prominent */
    [b-nbjz7ogd11] .filters-button {
        order: 3 !important;
    }

    /* Add button (primary action) should be most prominent */
    [b-nbjz7ogd11] .add-opportunity-button {
        order: 2 !important;
        font-weight: 600 !important;
    }

    /* Mobile Content Area */
    [b-nbjz7ogd11] .contact-content,
    [b-nbjz7ogd11] .opportunity-content,
    [b-nbjz7ogd11] .policy-content,
    [b-nbjz7ogd11] .data-view-content {
        padding: 0 1rem 1rem 1rem !important;
        min-height: calc(100vh - 180px);
    }

    /* Mobile Grid View Enhancements - All Grid Types */
    [b-nbjz7ogd11] .contact-grid,
    [b-nbjz7ogd11] .opportunity-grid,
    [b-nbjz7ogd11] .data-grid {
        grid-template-columns: 1fr !important;
        gap: 0.75rem !important;
        margin-top: 0.75rem !important;
    }

    /* Mobile Card Styles - All Card Types */
    [b-nbjz7ogd11] .contact-card,
    [b-nbjz7ogd11] .opportunity-card,
    [b-nbjz7ogd11] .data-card {
        width: 100% !important;
        margin: 0 !important;
        border-radius: 8px !important;
        box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1) !important;
    }

    [b-nbjz7ogd11] .contact-card-header,
    [b-nbjz7ogd11] .opportunity-card-header,
    [b-nbjz7ogd11] .policy-card-header,
    [b-nbjz7ogd11] .data-card-header {
        padding: 0.75rem !important;
    }

    [b-nbjz7ogd11] .contact-name,
    [b-nbjz7ogd11] .opportunity-name {
        font-size: 1.125rem !important;
        line-height: 1.4 !important;
    }

    [b-nbjz7ogd11] .contact-title,
    [b-nbjz7ogd11] .opportunity-status,
    [b-nbjz7ogd11] .policy-title {
        font-size: 0.875rem !important;
        margin-top: 0.25rem !important;
    }

    [b-nbjz7ogd11] .contact-card-expanded,
    [b-nbjz7ogd11] .opportunity-card-expanded,
    [b-nbjz7ogd11] .policy-card-expanded,
    [b-nbjz7ogd11] .data-card-expanded {
        padding: 0.75rem !important;
        border-top: 1px solid var(--rival-border) !important;
        margin-top: 0.75rem !important;
    }

    [b-nbjz7ogd11] .contact-card.expanded,
    [b-nbjz7ogd11] .opportunity-card.expanded,
    [b-nbjz7ogd11] .policy-card-expanded,
    [b-nbjz7ogd11] .data-card.expanded {
        grid-column: span 1 !important;
        height: auto !important;
        max-height: none !important;
        min-height: auto !important;
        overflow: visible !important;
    }

    [b-nbjz7ogd11] .contact-details,
    [b-nbjz7ogd11] .opportunity-details {
        gap: 0.75rem !important;
    }

    [b-nbjz7ogd11] .contact-detail-item,
    [b-nbjz7ogd11] .opportunity-detail-item {
        padding: 0.5rem 0 !important;
        font-size: 0.875rem !important;
        word-wrap: break-word !important;
        overflow-wrap: break-word !important;
        white-space: normal !important;
    }

    [b-nbjz7ogd11] .contact-card .contact-name,
    [b-nbjz7ogd11] .opportunity-card .opportunity-name {
        font-size: 1.125rem !important;
        line-height: 1.4 !important;
        word-wrap: break-word !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
    }

    [b-nbjz7ogd11] .contact-card .contact-title,
    [b-nbjz7ogd11] .opportunity-card .opportunity-status,
    [b-nbjz7ogd11] .policy-card .policy-title {
        font-size: 0.875rem !important;
        margin-top: 0.25rem !important;
        word-wrap: break-word !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
    }

    [b-nbjz7ogd11] .social-links {
        gap: 0.75rem !important;
        margin-top: 0.75rem !important;
    }

    [b-nbjz7ogd11] .social-link {
        padding: 0.5rem !important;
        font-size: 1.25rem !important;
    }

    /* Mobile List View - Syncfusion DataGrid */
    [b-nbjz7ogd11] .e-grid {
        font-size: 14px !important;
        width: 100% !important;
        overflow-x: auto !important;
    }

        [b-nbjz7ogd11] .e-grid .e-headercell {
            padding: 0.5rem 0.25rem !important;
            font-size: 0.875rem !important;
            font-weight: 600 !important;
            min-width: 80px !important;
        }

        [b-nbjz7ogd11] .e-grid .e-rowcell {
            padding: 0.5rem 0.25rem !important;
            font-size: 0.875rem !important;
            line-height: 1.4 !important;
            min-width: 80px !important;
            word-wrap: break-word !important;
        }

        [b-nbjz7ogd11] .e-grid .e-filterbarcell {
            padding: 0.25rem !important;
        }

            [b-nbjz7ogd11] .e-grid .e-filterbarcell .e-input-group {
                height: 36px !important;
            }

            [b-nbjz7ogd11] .e-grid .e-filterbarcell .e-input {
                font-size: 14px !important;
                padding: 0.25rem 0.5rem !important;
            }

        /* Mobile-specific column adjustments */
        [b-nbjz7ogd11] .e-grid .e-gridcontent {
            overflow-x: auto !important;
            -webkit-overflow-scrolling: touch !important;
        }

        /* Ensure horizontal scrolling works smoothly on mobile */
        [b-nbjz7ogd11] .e-grid .e-content {
            overflow-x: auto !important;
            -webkit-overflow-scrolling: touch !important;
        }
}

/* Column Resizing Styles */
[b-nbjz7ogd11] .e-grid .e-headercell .e-resize-handle {
    background-color: var(--rival-light-blue) !important;
    width: 4px !important;
    opacity: 0.7 !important;
    transition: opacity 0.2s ease !important;
}

    [b-nbjz7ogd11] .e-grid .e-headercell .e-resize-handle:hover {
        opacity: 1 !important;
        background-color: var(--rival-light-blue) !important;
    }

    [b-nbjz7ogd11] .e-grid .e-headercell .e-resize-handle:active {
        background-color: var(--rival-dark-blue) !important;
    }

/* Make resize handles more sensitive and visible */
[b-nbjz7ogd11] .e-grid .e-headercell {
    position: relative !important;
}

    [b-nbjz7ogd11] .e-grid .e-headercell .e-resize-handle {
        position: absolute !important;
        right: 0 !important;
        top: 0 !important;
        height: 100% !important;
        cursor: col-resize !important;
        z-index: 10 !important;
        background-color: transparent !important;
        border-right: 2px solid transparent !important;
        transition: border-color 0.2s ease !important;
    }

    [b-nbjz7ogd11] .e-grid .e-headercell:hover .e-resize-handle {
        border-right-color: var(--rival-light-blue) !important;
    }

    [b-nbjz7ogd11] .e-grid .e-headercell .e-resize-handle:hover {
        border-right-color: var(--rival-light-blue) !important;
        background-color: rgba(98, 136, 197, 0.1) !important;
    }

    [b-nbjz7ogd11] .e-grid .e-headercell .e-resize-handle:active {
        border-right-color: var(--rival-dark-blue) !important;
        background-color: rgba(98, 136, 197, 0.2) !important;
    }

/* Resize indicator line */
[b-nbjz7ogd11] .e-grid .e-resize-indicator {
    background-color: var(--rival-light-blue) !important;
    width: 2px !important;
    opacity: 0.8 !important;
}

/* Mobile: Disable resizing on small screens */
@media (max-width: 768px) {
    [b-nbjz7ogd11] .e-grid .e-headercell .e-resize-handle {
        display: none !important;
    }

    /* Mobile Grid View Improvements */
    [b-nbjz7ogd11] .contacts-grid {
        padding: 0.5rem !important;
        gap: 0.75rem !important;
        grid-template-columns: 1fr !important;
        overflow-x: hidden !important;
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
    }

    [b-nbjz7ogd11] .contact-card {
        width: 100% !important;
        max-width: 100% !important;
        margin: 0 !important;
        border-radius: 12px !important;
        box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15) !important;
        padding: 1rem !important;
        min-height: auto !important;
        max-height: none !important;
        height: auto !important;
        box-sizing: border-box !important;
        overflow: visible !important;
        word-wrap: break-word !important;
        overflow-wrap: break-word !important;
    }

    [b-nbjz7ogd11] .contact-card-header {
        padding: 0 !important;
        margin-bottom: 0.75rem !important;
    }

    [b-nbjz7ogd11] .contact-name {
        font-size: 1.25rem !important;
        margin-bottom: 0.5rem !important;
        line-height: 1.3 !important;
    }

    [b-nbjz7ogd11] .contact-title {
        font-size: 1rem !important;
        margin-bottom: 1rem !important;
        color: var(--rival-input-placeholder) !important;
    }

    [b-nbjz7ogd11] .contact-detail-item {
        margin-bottom: 0.75rem !important;
        font-size: 0.95rem !important;
        gap: 0.75rem !important;
    }

        [b-nbjz7ogd11] .contact-detail-item i {
            font-size: 1.25rem !important;
            min-width: 1.25rem !important;
        }

    [b-nbjz7ogd11] .contact-link {
        font-size: 0.95rem !important;
        word-break: break-all !important;
        line-height: 1.4 !important;
    }

    /* Mobile Expanded View */
    [b-nbjz7ogd11] .contact-card-expanded {
        padding: 1rem !important;
        border-top: 1px solid var(--rival-border) !important;
        margin-top: 0.75rem !important;
    }

    [b-nbjz7ogd11] .contact-details {
        gap: 0.75rem !important;
    }

    /* Mobile Modal - Generic Responsive Styles */
    [b-nbjz7ogd11] .detail-modal {
        margin: 0.5rem !important;
        max-width: none !important;
        width: calc(100vw - 1rem) !important;
        max-height: 95vh !important;
        border-radius: 12px !important;
    }

        [b-nbjz7ogd11] .detail-modal .modal-actions {
            flex-direction: column !important;
            gap: 0.75rem !important;
            padding: 1rem !important;
            margin-top: 0 !important;
        }

            [b-nbjz7ogd11] .detail-modal .modal-actions .e-btn {
                width: 100% !important;
                justify-content: center !important;
                padding: 1rem 1.5rem !important;
                min-height: 3.5rem !important;
                font-size: 1.1rem !important;
                min-width: auto !important;
            }

    /* Mobile DataGrid - Compact Layout (List View Only) */
    [b-nbjz7ogd11] .e-grid:not(.contact-grid) {
        --mobile-grid-font-size: 12px;
        --mobile-grid-border-radius: 2px;
        --mobile-grid-border-color: var(--rival-border);
        --mobile-grid-row-height: 20px;
        --mobile-grid-header-height: 14px;
        --mobile-grid-header-bg: var(--rival-background-secondary);
        --mobile-grid-cell-bg: var(--rival-background-secondary);
        --mobile-grid-cell-border: var(--rival-border);
        font-size: var(--mobile-grid-font-size);
        border: 1px solid var(--mobile-grid-border-color);
        border-radius: var(--mobile-grid-border-radius);
        overflow: hidden;
        margin: 0;
        padding: 0;
        width: 100%;
    }

        [b-nbjz7ogd11] .e-grid:not(.contact-grid) .e-headercell {
            padding: 0;
            margin: 0;
            background-color: var(--mobile-grid-header-bg);
            border-right: 1px solid var(--mobile-grid-border-color);
            border-bottom: 1px solid var(--mobile-grid-border-color);
            font-weight: 600;
            font-size: 8px;
            text-align: left;
            line-height: 1.0;
            height: var(--mobile-grid-header-height);
            min-height: var(--mobile-grid-header-height);
            max-height: var(--mobile-grid-header-height);
            vertical-align: middle;
            display: table-cell;
        }

        [b-nbjz7ogd11] .e-grid:not(.contact-grid) .e-rowcell {
            padding: 2px 1px;
            margin: 0;
            background-color: var(--mobile-grid-cell-bg);
            border-right: 1px solid var(--mobile-grid-cell-border);
            border-bottom: 1px solid var(--mobile-grid-cell-border);
            vertical-align: middle;
            line-height: 1.1;
            height: var(--mobile-grid-row-height);
            min-height: var(--mobile-grid-row-height);
            max-height: var(--mobile-grid-row-height);
            font-size: 11px;
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
        }

        [b-nbjz7ogd11] .e-grid:not(.contact-grid) .e-row:hover .e-rowcell {
            background-color: var(--rival-background-secondary);
        }

        [b-nbjz7ogd11] .e-grid:not(.contact-grid) .e-row:last-child .e-rowcell {
            border-bottom: none;
        }

        [b-nbjz7ogd11] .e-grid:not(.contact-grid) .e-headercell:last-child,
        [b-nbjz7ogd11] .e-grid:not(.contact-grid) .e-rowcell:last-child {
            border-right: none;
        }

        /* Grid container spacing optimization (List View Only) */
        [b-nbjz7ogd11] .e-grid:not(.contact-grid) .e-gridcontent,
        [b-nbjz7ogd11] .e-grid:not(.contact-grid) .e-content,
        [b-nbjz7ogd11] .e-grid:not(.contact-grid) .e-table,
        [b-nbjz7ogd11] .e-grid:not(.contact-grid) .e-gridheader,
        [b-nbjz7ogd11] .e-grid:not(.contact-grid) .e-gridheader .e-table {
            margin: 0;
            padding: 0;
            border-spacing: 0;
            border-collapse: collapse;
            height: auto;
        }

            /* Header row structure optimization (List View Only) */
            [b-nbjz7ogd11] .e-grid:not(.contact-grid) .e-gridheader .e-table tr {
                height: var(--mobile-grid-header-height);
                min-height: var(--mobile-grid-header-height);
                max-height: var(--mobile-grid-header-height);
                margin: 0;
                padding: 0;
            }

            [b-nbjz7ogd11] .e-grid:not(.contact-grid) .e-gridheader .e-table th {
                height: var(--mobile-grid-header-height);
                min-height: var(--mobile-grid-header-height);
                max-height: var(--mobile-grid-header-height);
                padding: 0;
                margin: 0;
                border-spacing: 0;
                vertical-align: middle;
                line-height: 1.0;
            }

        [b-nbjz7ogd11] .e-grid:not(.contact-grid) .e-headertext {
            padding: 0;
            margin: 0;
            line-height: 1.0;
            font-size: 8px;
            vertical-align: middle;
        }

        /* Compact filter bar (List View Only) */
        [b-nbjz7ogd11] .e-grid:not(.contact-grid) .e-filterbar {
            margin: 0;
            padding: 0;
            height: var(--mobile-grid-header-height);
        }

        [b-nbjz7ogd11] .e-grid:not(.contact-grid) .e-filterbarcell {
            padding: 1px;
            margin: 0;
            border: none;
            height: var(--mobile-grid-header-height);
            vertical-align: middle;
        }

            [b-nbjz7ogd11] .e-grid:not(.contact-grid) .e-filterbarcell .e-input-group {
                margin: 0;
                padding: 0;
                height: 16px;
            }

            [b-nbjz7ogd11] .e-grid:not(.contact-grid) .e-filterbarcell .e-input {
                padding: 1px 2px;
                margin: 0;
                font-size: 8px;
                height: 14px;
                border: 1px solid var(--mobile-grid-cell-border);
                line-height: 1.0;
            }

        /* Table structure optimization (List View Only) */
        [b-nbjz7ogd11] .e-grid:not(.contact-grid) .e-table tr {
            height: var(--mobile-grid-row-height);
            min-height: var(--mobile-grid-row-height);
            max-height: var(--mobile-grid-row-height);
        }

        [b-nbjz7ogd11] .e-grid:not(.contact-grid) .e-table td,
        [b-nbjz7ogd11] .e-grid:not(.contact-grid) .e-table th {
            height: var(--mobile-grid-row-height);
            min-height: var(--mobile-grid-row-height);
            max-height: var(--mobile-grid-row-height);
            padding: 0;
            margin: 0;
            border-spacing: 0;
        }

        /* Grid element box model (List View Only) */
        [b-nbjz7ogd11] .e-grid:not(.contact-grid) * {
            box-sizing: border-box;
        }

        [b-nbjz7ogd11] .e-grid:not(.contact-grid) .e-row {
            height: var(--mobile-grid-row-height);
            min-height: var(--mobile-grid-row-height);
            max-height: var(--mobile-grid-row-height);
        }
}

/* Sticky Headers for Vertical Scrolling */
[b-nbjz7ogd11] .e-grid .e-gridheader {
    position: sticky !important;
    top: 0 !important;
    z-index: 100 !important;
    background-color: var(--rival-surface) !important;
}

    [b-nbjz7ogd11] .e-grid .e-gridheader .e-headercell {
        position: sticky !important;
        top: 0 !important;
        z-index: 100 !important;
        background-color: var(--rival-surface) !important;
        border-bottom: 1px solid #4a4a4a !important;
    }

/* Ensure filter bar is also sticky */
[b-nbjz7ogd11] .e-grid .e-filterbar {
    position: sticky !important;
    top: 40px !important; /* Height of header row */
    z-index: 99 !important;
    background-color: var(--rival-background-secondary) !important;
}

    [b-nbjz7ogd11] .e-grid .e-filterbar .e-filterbarcell {
        background-color: var(--rival-background-secondary) !important;
        border-bottom: 1px solid var(--rival-border) !important;
    }

/* Ensure proper stacking order */
[b-nbjz7ogd11] .e-grid .e-gridcontent {
    position: relative !important;
    z-index: 1 !important;
}

/* Add shadow to sticky header for better visual separation */
[b-nbjz7ogd11] .e-grid .e-gridheader {
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.3) !important;
}

[b-nbjz7ogd11] .e-grid .e-filterbar {
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2) !important;
}

/* Additional utility styles */
[b-nbjz7ogd11] .modal-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    padding: 1.5rem;
}

[b-nbjz7ogd11] .close-button {
    background: none;
    border: none;
    color: var(--rival-input-placeholder);
    cursor: pointer;
    padding: 0;
    border-radius: 0.375rem;
    transition: all 0.2s;
    font-size: 29px;
    min-width: 44px;
    min-height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

    [b-nbjz7ogd11] .close-button:hover {
        color: #ffffff;
        background-color: var(--rival-border);
    }

[b-nbjz7ogd11] .modal-content {
    padding: 1.5rem;
}

[b-nbjz7ogd11] .section-title {
    color: var(--rival-input-placeholder);
    font-size: 1rem;
    font-weight: 500;
    margin: 0 0 0.5rem 0;
    padding-bottom: 0;
}

[b-nbjz7ogd11] .text-btn {
    background-color: var(--rival-light-blue);
    color: #ffffff;
}

    [b-nbjz7ogd11] .text-btn:hover {
        background-color: var(--rival-light-blue);
    }

[b-nbjz7ogd11] .social-link-text {
    color: var(--rival-light-blue);
    text-decoration: none;
    transition: color 0.2s;
}

    [b-nbjz7ogd11] .social-link-text:hover {
        color: var(--rival-light-blue);
    }

/* Insured badge styling */
[b-nbjz7ogd11] .insured-badge {
    color: #59BF98;
    font-size: 1.75rem;
}

/* Desktop disabled styles - But allow links to work */
[b-nbjz7ogd11] .desktop-disabled:not(.contact-link):not(.social-link):not(a) {
    pointer-events: none !important;
    opacity: 0.5 !important;
    cursor: not-allowed !important;
}

/* Links and contact-links should always work */
[b-nbjz7ogd11] .contact-link,
[b-nbjz7ogd11] .social-link,
[b-nbjz7ogd11] a.contact-link,
[b-nbjz7ogd11] a.social-link {
    pointer-events: auto !important;
    cursor: pointer !important;
    opacity: 1 !important;
}

@media (max-width: 768px) {
    [b-nbjz7ogd11] .desktop-disabled {
        pointer-events: auto !important;
        opacity: 1 !important;
        cursor: pointer !important;
    }
}

/* Touch target sizing for mobile */
@media (max-width: 768px) {
    .data-card[b-nbjz7ogd11] {
        min-height: 44px !important; /* Minimum touch target size */
        padding: 0.75rem !important;
        width: 100% !important;
        margin: 0 !important;
        border-radius: 8px !important;
        box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1) !important;
    }

    /* Mobile Grid View Enhancements */
    .data-grid[b-nbjz7ogd11] {
        grid-template-columns: 1fr !important;
        gap: 0.75rem !important;
        margin-top: 0.75rem !important;
    }

    .card-header[b-nbjz7ogd11] {
        padding: 0.75rem !important;
    }

    .card-name[b-nbjz7ogd11] {
        font-size: 1.125rem !important;
        line-height: 1.4 !important;
    }

    .card-title[b-nbjz7ogd11] {
        font-size: 0.875rem !important;
        margin-top: 0.25rem !important;
    }

    .card-expanded[b-nbjz7ogd11] {
        padding: 0.75rem !important;
        border-top: 1px solid var(--rival-border) !important;
    }

    .card-detail-item[b-nbjz7ogd11] {
        padding: 0.5rem 0 !important;
        font-size: 0.875rem !important;
    }

    .social-links[b-nbjz7ogd11] {
        gap: 0.75rem !important;
        margin-top: 0.75rem !important;
    }

    .social-link[b-nbjz7ogd11] {
        padding: 0.5rem !important;
        font-size: 1.25rem !important;
    }

    .card-link.desktop-disabled[b-nbjz7ogd11] {
        cursor: pointer;
        pointer-events: auto;
    }
}

/* Mobile List View - Syncfusion DataGrid */
@media (max-width: 768px) {
    .generic-data-view .e-grid[b-nbjz7ogd11] {
        font-size: 14px !important;
        width: 100% !important;
        overflow-x: auto !important;
    }

        .generic-data-view .e-grid .e-headercell[b-nbjz7ogd11] {
            padding: 0.5rem 0.25rem !important;
            font-size: 0.875rem !important;
            font-weight: 600 !important;
            min-width: 80px !important;
        }

        .generic-data-view .e-grid .e-rowcell[b-nbjz7ogd11] {
            padding: 0.5rem 0.25rem !important;
            font-size: 0.875rem !important;
            line-height: 1.4 !important;
            min-width: 80px !important;
            word-wrap: break-word !important;
            overflow-wrap: break-word !important;
        }

        .generic-data-view .e-grid .e-filterbarcell[b-nbjz7ogd11] {
            padding: 0.25rem !important;
        }

            .generic-data-view .e-grid .e-filterbarcell .e-input-group[b-nbjz7ogd11] {
                height: 36px !important;
            }

            .generic-data-view .e-grid .e-filterbarcell .e-input[b-nbjz7ogd11] {
                font-size: 14px !important;
                padding: 0.25rem 0.5rem !important;
            }

        /* Mobile-specific column adjustments */
        .generic-data-view .e-grid .e-gridcontent[b-nbjz7ogd11] {
            overflow-x: auto !important;
            -webkit-overflow-scrolling: touch !important;
        }

        /* Ensure horizontal scrolling works smoothly on mobile */
        .generic-data-view .e-grid .e-content[b-nbjz7ogd11] {
            overflow-x: auto !important;
            -webkit-overflow-scrolling: touch !important;
        }
}

/* Mobile DataGrid - Compact Layout (List View Only) */
@media (max-width: 768px) {
    .generic-data-view .e-grid:not(.data-grid)[b-nbjz7ogd11] {
        --mobile-grid-font-size: 12px;
        --mobile-grid-border-radius: 2px;
        --mobile-grid-border-color: var(--rival-border);
        --mobile-grid-row-height: 20px;
        --mobile-grid-header-height: 14px;
        --mobile-grid-header-bg: var(--rival-background-secondary);
        --mobile-grid-cell-bg: var(--rival-background-secondary);
        --mobile-grid-cell-border: var(--rival-border);
        font-size: var(--mobile-grid-font-size);
        border: 1px solid var(--mobile-grid-border-color);
        border-radius: var(--mobile-grid-border-radius);
        overflow: hidden;
        margin: 0;
        padding: 0;
        width: 100%;
    }

        .generic-data-view .e-grid:not(.data-grid) .e-headercell[b-nbjz7ogd11] {
            padding: 0;
            margin: 0;
            background-color: var(--mobile-grid-header-bg);
            border-right: 1px solid var(--mobile-grid-border-color);
            border-bottom: 1px solid var(--mobile-grid-border-color);
            font-weight: 600;
            font-size: 8px;
            text-align: left;
            line-height: 1.0;
            height: var(--mobile-grid-header-height);
            min-height: var(--mobile-grid-header-height);
            max-height: var(--mobile-grid-header-height);
            vertical-align: middle;
            display: table-cell;
        }

        .generic-data-view .e-grid:not(.data-grid) .e-rowcell[b-nbjz7ogd11] {
            padding: 2px 1px;
            margin: 0;
            background-color: var(--mobile-grid-cell-bg);
            border-right: 1px solid var(--mobile-grid-cell-border);
            border-bottom: 1px solid var(--mobile-grid-cell-border);
            vertical-align: middle;
            line-height: 1.1;
            height: var(--mobile-grid-row-height);
            min-height: var(--mobile-grid-row-height);
            max-height: var(--mobile-grid-row-height);
            font-size: 11px;
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
        }

        .generic-data-view .e-grid:not(.data-grid) .e-row:hover .e-rowcell[b-nbjz7ogd11] {
            background-color: var(--rival-background-secondary);
        }

        .generic-data-view .e-grid:not(.data-grid) .e-row:last-child .e-rowcell[b-nbjz7ogd11] {
            border-bottom: none;
        }

        .generic-data-view .e-grid:not(.data-grid) .e-headercell:last-child[b-nbjz7ogd11],
        .generic-data-view .e-grid:not(.data-grid) .e-rowcell:last-child[b-nbjz7ogd11] {
            border-right: none;
        }

        /* Grid container spacing optimization (List View Only) */
        .generic-data-view .e-grid:not(.data-grid) .e-gridcontent[b-nbjz7ogd11],
        .generic-data-view .e-grid:not(.data-grid) .e-content[b-nbjz7ogd11],
        .generic-data-view .e-grid:not(.data-grid) .e-table[b-nbjz7ogd11],
        .generic-data-view .e-grid:not(.data-grid) .e-gridheader[b-nbjz7ogd11],
        .generic-data-view .e-grid:not(.data-grid) .e-gridheader .e-table[b-nbjz7ogd11] {
            margin: 0;
            padding: 0;
            border-spacing: 0;
            border-collapse: collapse;
            height: auto;
        }

            /* Header row structure optimization (List View Only) */
            .generic-data-view .e-grid:not(.data-grid) .e-gridheader .e-table tr[b-nbjz7ogd11] {
                height: var(--mobile-grid-header-height);
                min-height: var(--mobile-grid-header-height);
                max-height: var(--mobile-grid-header-height);
                margin: 0;
                padding: 0;
            }

            .generic-data-view .e-grid:not(.data-grid) .e-gridheader .e-table th[b-nbjz7ogd11] {
                height: var(--mobile-grid-header-height);
                min-height: var(--mobile-grid-header-height);
                max-height: var(--mobile-grid-header-height);
                padding: 0;
                margin: 0;
                border-spacing: 0;
                vertical-align: middle;
                line-height: 1.0;
            }

        .generic-data-view .e-grid:not(.data-grid) .e-headertext[b-nbjz7ogd11] {
            padding: 0;
            margin: 0;
            line-height: 1.0;
            font-size: 8px;
            vertical-align: middle;
        }

        /* Compact filter bar (List View Only) */
        .generic-data-view .e-grid:not(.data-grid) .e-filterbar[b-nbjz7ogd11] {
            margin: 0;
            padding: 0;
            height: var(--mobile-grid-header-height);
        }

        .generic-data-view .e-grid:not(.data-grid) .e-filterbarcell[b-nbjz7ogd11] {
            padding: 1px;
            margin: 0;
            border: none;
            height: var(--mobile-grid-header-height);
            vertical-align: middle;
        }

            .generic-data-view .e-grid:not(.data-grid) .e-filterbarcell .e-input-group[b-nbjz7ogd11] {
                margin: 0;
                padding: 0;
                height: 16px;
            }

            .generic-data-view .e-grid:not(.data-grid) .e-filterbarcell .e-input[b-nbjz7ogd11] {
                padding: 1px 2px;
                margin: 0;
                font-size: 8px;
                height: 14px;
                border: 1px solid var(--mobile-grid-cell-border);
                line-height: 1.0;
            }

        /* Table structure optimization (List View Only) */
        .generic-data-view .e-grid:not(.data-grid) .e-table tr[b-nbjz7ogd11] {
            height: var(--mobile-grid-row-height);
            min-height: var(--mobile-grid-row-height);
            max-height: var(--mobile-grid-row-height);
        }

        .generic-data-view .e-grid:not(.data-grid) .e-table td[b-nbjz7ogd11],
        .generic-data-view .e-grid:not(.data-grid) .e-table th[b-nbjz7ogd11] {
            height: var(--mobile-grid-row-height);
            min-height: var(--mobile-grid-row-height);
            max-height: var(--mobile-grid-row-height);
            padding: 0;
            margin: 0;
            border-spacing: 0;
        }

        /* Grid element box model (List View Only) */
        .generic-data-view .e-grid:not(.data-grid) *[b-nbjz7ogd11] {
            box-sizing: border-box;
        }

        .generic-data-view .e-grid:not(.data-grid) .e-row[b-nbjz7ogd11] {
            height: var(--mobile-grid-row-height);
            min-height: var(--mobile-grid-row-height);
            max-height: var(--mobile-grid-row-height);
        }
}

/* Sticky Headers for Vertical Scrolling */
.generic-data-view .e-grid .e-gridheader[b-nbjz7ogd11] {
    position: sticky !important;
    top: 0 !important;
    z-index: 100 !important;
    background-color: var(--rival-surface) !important;
}

    .generic-data-view .e-grid .e-gridheader .e-headercell[b-nbjz7ogd11] {
        position: sticky !important;
        top: 0 !important;
        z-index: 100 !important;
        background-color: var(--rival-surface) !important;
        border-bottom: 1px solid #4a4a4a !important;
    }

/* Ensure filter bar is also sticky */
.generic-data-view .e-grid .e-filterbar[b-nbjz7ogd11] {
    position: sticky !important;
    top: 40px !important; /* Height of header row */
    z-index: 99 !important;
    background-color: var(--rival-background-secondary) !important;
}

    .generic-data-view .e-grid .e-filterbar .e-filterbarcell[b-nbjz7ogd11] {
        background-color: var(--rival-background-secondary) !important;
        border-bottom: 1px solid var(--rival-border) !important;
    }

/* Responsive Design */
@media (max-width: 768px) {
    .view-toggle-container[b-nbjz7ogd11] {
        padding: 0.75rem;
    }

    .data-view-content[b-nbjz7ogd11] {
        padding: 0 1.5rem 1rem 1.5rem;
    }

    .data-grid[b-nbjz7ogd11] {
        grid-template-columns: 1fr;
        gap: 1rem;
        padding: 0 0.75rem;
    }

    .data-card.expanded[b-nbjz7ogd11] {
        grid-column: span 1;
    }

    .detail-modal[b-nbjz7ogd11] {
        margin: 0.5rem;
        max-width: none;
        max-height: 95vh;
        overflow-y: auto;
    }

        .detail-modal .modal-content[b-nbjz7ogd11] {
            padding: 1rem;
            grid-template-columns: 1fr;
            gap: 1.5rem;
        }

    .modal-actions[b-nbjz7ogd11] {
        flex-direction: column;
        gap: 0.5rem;
        margin-top: 1rem;
    }

    /* Additional Mobile Styles for Contact Cards */
    .contact-content[b-nbjz7ogd11] {
        padding: 0 0.75rem 1rem 0.75rem !important;
        min-height: calc(100vh - 180px);
    }

    .contact-card[b-nbjz7ogd11] {
        width: 100% !important;
        max-width: 100% !important;
        margin: 0 !important;
        border-radius: 12px !important;
        box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15) !important;
        padding: 1rem !important;
        min-height: auto !important;
        max-height: none !important;
        height: auto !important;
        box-sizing: border-box !important;
        overflow: visible !important;
        word-wrap: break-word !important;
        overflow-wrap: break-word !important;
    }

    .contact-card-header[b-nbjz7ogd11] {
        padding: 0 !important;
        margin-bottom: 0.75rem !important;
    }

    .contact-name[b-nbjz7ogd11] {
        font-size: 1.25rem !important;
        margin-bottom: 0.5rem !important;
        line-height: 1.3 !important;
    }

    .contact-title[b-nbjz7ogd11] {
        font-size: 1rem !important;
        margin-bottom: 1rem !important;
        color: var(--rival-input-placeholder) !important;
    }

    .contact-detail-item[b-nbjz7ogd11] {
        margin-bottom: 0.75rem !important;
        font-size: 0.95rem !important;
        gap: 0.75rem !important;
    }

        .contact-detail-item i[b-nbjz7ogd11] {
            font-size: 1.25rem !important;
            min-width: 1.25rem !important;
        }

    .contact-link[b-nbjz7ogd11] {
        font-size: 0.95rem !important;
        word-break: break-all !important;
        line-height: 1.4 !important;
    }

    .contact-card-expanded[b-nbjz7ogd11] {
        padding: 1rem !important;
        border-top: 1px solid var(--rival-border) !important;
        margin-top: 0.75rem !important;
    }

    .contact-details[b-nbjz7ogd11] {
        gap: 0.75rem !important;
    }

    .social-links[b-nbjz7ogd11] {
        gap: 0.75rem !important;
        margin-top: 0.75rem !important;
    }

    .social-link[b-nbjz7ogd11] {
        padding: 0.5rem !important;
        font-size: 1.25rem !important;
    }

    .contact-link.desktop-disabled[b-nbjz7ogd11] {
        cursor: pointer;
        pointer-events: auto;
    }

    /* AGGRESSIVE MOBILE TABLE/GRID STYLES WITH ::deep - ENHANCED WITH BACKUP STYLES */

    /* Core grid mobile styling from backup - proven to work */
    [b-nbjz7ogd11] .e-grid {
        font-size: 14px !important;
        width: 100% !important;
        overflow-x: auto !important;
        min-width: 100% !important;
        max-width: 100vw !important;
        overflow-y: visible !important;
        border-collapse: collapse !important;
    }

    /* Grid wrapper with smooth scrolling */
    [b-nbjz7ogd11] .e-gridcontent {
        overflow-x: auto !important;
        overflow-y: visible !important;
        -webkit-overflow-scrolling: touch !important;
        width: 100% !important;
        max-width: 100vw !important;
    }

    /* Content scrolling */
    [b-nbjz7ogd11] .e-grid .e-content {
        overflow-x: auto !important;
        -webkit-overflow-scrolling: touch !important;
        overflow-y: visible !important;
    }

    /* Header styling from backup */
    [b-nbjz7ogd11] .e-grid .e-headercell {
        padding: 0.5rem 0.25rem !important;
        font-size: 0.875rem !important;
        font-weight: 600 !important;
        min-width: 120px !important;
        background-color: var(--rival-background-secondary) !important;
        color: #FFFFFF !important;
        border-color: var(--rival-border) !important;
        white-space: nowrap !important;
    }

    /* Cell styling from backup */
    [b-nbjz7ogd11] .e-grid .e-rowcell {
        padding: 0.5rem 0.25rem !important;
        font-size: 0.875rem !important;
        line-height: 1.4 !important;
        min-width: 120px !important;
        word-wrap: break-word !important;
        background-color: var(--rival-background-secondary) !important;
        color: #FFFFFF !important;
        border-color: var(--rival-border) !important;
        white-space: normal !important;
        overflow: visible !important;
        text-overflow: clip !important;
    }

    /* Row styling from backup */
    [b-nbjz7ogd11] .e-grid .e-row:hover .e-rowcell {
        background-color: var(--rival-background-secondary) !important;
    }

    [b-nbjz7ogd11] .e-grid td.e-active {
        background: var(--rival-background-secondary) !important;
    }

    /* Filter bar styling from backup */
    [b-nbjz7ogd11] .e-grid .e-filterbarcell {
        padding: 0.25rem !important;
        background-color: var(--rival-background-secondary) !important;
    }

        [b-nbjz7ogd11] .e-grid .e-filterbarcell .e-input-group {
            height: 36px !important;
        }

        [b-nbjz7ogd11] .e-grid .e-filterbarcell .e-input {
            font-size: 14px !important;
            padding: 0.25rem 0.5rem !important;
            background-color: var(--rival-background-secondary) !important;
            color: #FFFFFF !important;
            border-color: var(--rival-border) !important;
        }

    /* Pager styling from backup */
    [b-nbjz7ogd11] .e-grid .e-pager {
        background-color: var(--rival-background-secondary) !important;
    }

        [b-nbjz7ogd11] .e-grid .e-pager .e-icons,
        [b-nbjz7ogd11] .e-grid .e-pager .e-link {
            background-color: var(--rival-background-secondary) !important;
            color: var(--rival-light-blue) !important;
        }

            [b-nbjz7ogd11] .e-grid .e-pager .e-icons.e-disable,
            [b-nbjz7ogd11] .e-grid .e-pager .e-link.e-disable {
                color: var(--rival-input-placeholder) !important;
            }

    /* Header text styling */
    [b-nbjz7ogd11] .e-grid .e-headertext {
        color: #FFFFFF !important;
    }

    /* Parent message bar */
    [b-nbjz7ogd11] .e-grid .e-pager .e-parentmsgbar {
        color: #FFFFFF !important;
    }

    /* Table and general styling */
    [b-nbjz7ogd11] .e-grid .e-table {
        background-color: var(--rival-background-secondary) !important;
        table-layout: auto !important;
        width: auto !important;
        min-width: 100% !important;
    }

        /* Links styling */
        [b-nbjz7ogd11] .e-grid .e-table a {
            color: #59BF98 !important;
            text-decoration: none !important;
        }

        /* Dropdown button styling */
        [b-nbjz7ogd11] .e-grid .e-table .e-rowcell .e-dropdown-btn {
            background-color: var(--rival-background-secondary) !important;
            width: 100% !important;
            box-sizing: border-box !important;
            margin-left: 0 !important;
            margin-right: 0 !important;
            text-align: left !important;
        }

            [b-nbjz7ogd11] .e-grid .e-table .e-rowcell .e-dropdown-btn .e-btn-icon {
                position: absolute !important;
                right: 20px !important;
                top: 20px !important;
            }

        /* Input styling */
        [b-nbjz7ogd11] .e-grid .e-table .e-rowcell input {
            color: #212529 !important;
        }

        /* Icon styling */
        [b-nbjz7ogd11] .e-grid .e-table .bi-trash {
            color: white !important;
        }

    /* Pager container */
    [b-nbjz7ogd11] .e-grid .e-pagercontainer {
        background-color: inherit !important;
    }

    /* Filter div */
    [b-nbjz7ogd11] .e-grid .e-filterdiv {
        background-color: var(--rival-input-placeholder) !important;
    }

    /* Disable resize handles on mobile */
    [b-nbjz7ogd11] .e-grid .e-headercell .e-resize-handle {
        display: none !important;
    }

    /* Responsive column widths for very small screens */
    @media (max-width: 480px) {
        [b-nbjz7ogd11] .e-grid {
            font-size: 12px !important;
        }

            [b-nbjz7ogd11] .e-grid .e-headercell {
                font-size: 0.75rem !important;
                padding: 0.375rem 0.125rem !important;
                min-width: 100px !important;
            }

            [b-nbjz7ogd11] .e-grid .e-rowcell {
                padding: 0.375rem 0.125rem !important;
                font-size: 0.75rem !important;
                min-width: 100px !important;
            }

            [b-nbjz7ogd11] .e-grid .e-filterbarcell .e-input {
                font-size: 12px !important;
                padding: 0.125rem 0.25rem !important;
            }
    }
}

/* ===== DOCUMENT CARD CONTAINER STYLES (Applied by GenericDataView) ===== */

/* Document Grid Container */
[b-nbjz7ogd11] .documents-card-grid {
    display: grid !important;
    gap: 1.25rem !important;
    padding: 0.5rem !important;
    grid-template-columns: 1fr !important;
}

@media (min-width: 768px) {
    [b-nbjz7ogd11] .documents-card-grid {
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 1rem !important;
    }
}

@media (min-width: 1024px) {
    [b-nbjz7ogd11] .documents-card-grid {
        grid-template-columns: repeat(4, 1fr) !important;
    }
}

@media (min-width: 1280px) {
    [b-nbjz7ogd11] .documents-card-grid {
        grid-template-columns: repeat(4, 1fr) !important;
    }
}

/* Document Card Container - Applied by GenericDataView */
[b-nbjz7ogd11] .document-card {
    padding: 0.75rem !important;
    background-color: var(--rival-background-secondary) !important;
    border-radius: 0.75rem !important;
    border: 1px solid #6b7280 !important;
    color: #ffffff !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 0.75rem !important;
    height: 100% !important;
    cursor: pointer !important;
    transition: all 0.2s ease !important;
    position: relative !important;
    min-height: 140px !important;
    box-sizing: border-box !important;
    margin: 0 !important;
}

    [b-nbjz7ogd11] .document-card:hover {
        border-color: #9ca3af !important;
    }

    [b-nbjz7ogd11] .document-card.expanded {
        border: 1px solid var(--rival-light-blue) !important;
        background-color: transparent !important;
        transform: scale(1.02) !important;
        padding: 1rem !important;
        grid-column: span 2 !important;
        z-index: 10 !important;
        border-radius: 0.875rem !important;
        font-size: 1rem !important;
    }

/* Responsive Document Card Adjustments */
@media (min-width: 768px) and (max-width: 1023px) {
    [b-nbjz7ogd11] .documents-card-grid {
        gap: 1rem !important;
    }

    [b-nbjz7ogd11] .document-card {
        padding: 0.875rem !important;
        min-height: 135px !important;
        gap: 0.625rem !important;
        border: 2px solid #6b7280 !important;
        border-radius: 0.75rem !important;
    }

        [b-nbjz7ogd11] .document-card:hover {
            border-color: #9ca3af !important;
        }

        [b-nbjz7ogd11] .document-card.expanded {
            border: 1px solid #10b981 !important;
            border-radius: 0.875rem !important;
        }
}

@media (min-width: 481px) and (max-width: 767px) {
    [b-nbjz7ogd11] .documents-card-grid {
        gap: 0.875rem !important;
    }

    [b-nbjz7ogd11] .document-card {
        padding: 0.75rem !important;
        min-height: 125px !important;
        gap: 0.5rem !important;
        border: 1px solid #6b7280 !important;
        border-radius: 0.625rem !important;
    }

        [b-nbjz7ogd11] .document-card:hover {
            border-color: #9ca3af !important;
        }

        [b-nbjz7ogd11] .document-card.expanded {
            border: 1px solid #10b981 !important;
            border-radius: 0.75rem !important;
        }
}

@media (max-width: 480px) {
    [b-nbjz7ogd11] .documents-card-grid {
        gap: 0.75rem !important;
    }

    [b-nbjz7ogd11] .document-card {
        min-height: 110px !important;
        padding: 0.625rem !important;
        gap: 0.5rem !important;
        border: 1px solid #6b7280 !important;
        border-radius: 0.5rem !important;
    }

        [b-nbjz7ogd11] .document-card:hover {
            border-color: #9ca3af !important;
        }

        [b-nbjz7ogd11] .document-card.expanded {
            border: 1px solid #10b981 !important;
            border-radius: 0.625rem !important;
        }
}

/* ========================================
   Shared filter panel styles for all data views (Documents, Opportunities, etc.)
   ======================================== */

/* Filter Panel Container */
[b-nbjz7ogd11] .filters-panel-container {
    background-color: var(--rival-background-primary);
    border: 1px solid var(--rival-border);
    border-radius: 8px;
    padding: 1rem;
    margin-bottom: 0rem;
}

[b-nbjz7ogd11] .filters-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 1rem;
    align-items: start;
}

/* Ensure filter sections don't overlap */
[b-nbjz7ogd11] .filter-section {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    min-width: 0; /* Prevent overflow */
    position: relative; /* Ensure proper stacking context */
}

[b-nbjz7ogd11] .filter-label {
    font-size: 0.875rem;
    font-weight: 500;
    color: #999;
}

/* Dropdown Button */
[b-nbjz7ogd11] .filter-dropdown {
    position: relative;
}

[b-nbjz7ogd11] .filter-dropdown-button {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    padding: 0.5rem 0.75rem;
    background-color: var(--rival-background-secondary);
    border: 1px solid #444;
    border-radius: 4px;
    color: #fff;
    cursor: pointer;
    transition: background-color 0.2s;
}

    [b-nbjz7ogd11] .filter-dropdown-button:hover {
        background-color: var(--rival-border);
    }

[b-nbjz7ogd11] .dropdown-arrow {
    font-size: 0.75rem;
    margin-left: 0.5rem;
}

/* Dropdown Menu */
[b-nbjz7ogd11] .filter-dropdown-menu {
    position: absolute;
    z-index: 1000;
    width: 100%;
    max-height: 300px;
    overflow-y: auto;
    background-color: var(--rival-background-secondary);
    border: 1px solid #444;
    border-radius: 4px;
    margin-top: 0.25rem;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.3);
}

    [b-nbjz7ogd11] .filter-dropdown-menu.scrollable {
        max-height: 200px;
    }

[b-nbjz7ogd11] .filter-checkbox-item {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.5rem 0.75rem;
    cursor: pointer;
    transition: background-color 0.2s;
}

    [b-nbjz7ogd11] .filter-checkbox-item:hover {
        background-color: var(--rival-border);
    }

    [b-nbjz7ogd11] .filter-checkbox-item input[type='checkbox'] {
        cursor: pointer;
        accent-color: var(--rival-light-blue); /* Rival light blue */
    }

[b-nbjz7ogd11] .filter-no-results {
    padding: 0.5rem 0.75rem;
    color: #999;
    font-size: 0.875rem;
    text-align: center;
}

/* Date Range Inputs */
[b-nbjz7ogd11] .date-range-inputs {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    width: 100%;
}

[b-nbjz7ogd11] .filter-date-input {
    flex: 1;
    min-width: 0; /* Allow input to shrink below content size */
    padding: 0.5rem 0.75rem;
    background-color: var(--rival-background-secondary);
    border: 1px solid #444;
    border-radius: 4px;
    color: #fff;
    font-size: 0.875rem;
    max-width: 100%;
}

[b-nbjz7ogd11] .date-separator {
    color: #999;
    font-size: 0.875rem;
    flex-shrink: 0; /* Prevent separator from shrinking */
}

/* Radio Group */
[b-nbjz7ogd11] .filter-radio-group {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

[b-nbjz7ogd11] .filter-radio-item {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    cursor: pointer;
    color: #fff;
    font-size: 0.875rem;
}

    [b-nbjz7ogd11] .filter-radio-item input[type='radio'] {
        cursor: pointer;
        accent-color: var(--rival-light-blue); /* Rival light blue */
    }

/* ========================================
   Filter Chips Styles
   ======================================== */

[b-nbjz7ogd11] .filter-chips-container {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.75rem;
    padding: 1rem;
    background-color: var(--rival-background-primary);
    border: 1px solid var(--rival-border);
    border-radius: 8px;
    margin-top: 1rem;
}

[b-nbjz7ogd11] .filter-chips-list {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    flex: 1;
}

[b-nbjz7ogd11] .filter-chip {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.375rem 0.75rem;
    /* Background color set via bg-rival-light-blue class (var(--rival-light-blue)) */
    color: #fff;
    border-radius: 9999px;
    font-size: 0.875rem;
    animation: fadeIn-b-nbjz7ogd11 0.2s ease-in;
}

[b-nbjz7ogd11] .chip-label {
    font-weight: 500;
}

[b-nbjz7ogd11] .chip-remove-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 1.25rem;
    height: 1.25rem;
    padding: 0;
    background-color: transparent;
    border: none;
    border-radius: 50%;
    color: #fff;
    font-size: 1.25rem;
    line-height: 1;
    cursor: pointer;
    transition: background-color 0.2s;
}

    [b-nbjz7ogd11] .chip-remove-btn:hover {
        background-color: rgba(255, 255, 255, 0.2);
    }

@keyframes fadeIn-b-nbjz7ogd11 {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

/* Responsive Design */
@media (max-width: 1200px) {
    /* Smaller desktop - prevent description text wrap issues */
    [b-nbjz7ogd11] .filter-radio-item {
        font-size: 0.8125rem;
        white-space: nowrap;
    }

    [b-nbjz7ogd11] .filter-radio-group {
        gap: 0.375rem;
    }

    [b-nbjz7ogd11] .filters-grid {
        gap: 0.875rem;
    }
}

@media (max-width: 1024px) {
    /* Tablet and smaller - 2 columns */
    [b-nbjz7ogd11] .filters-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    /* Prevent description radio group overlap on tablet */
    [b-nbjz7ogd11] .filter-radio-group {
        gap: 0.375rem;
    }

    [b-nbjz7ogd11] .filter-radio-item {
        font-size: 0.8125rem;
    }
}

@media (max-width: 768px) {
    /* Mobile - single column, prevent overflow */
    [b-nbjz7ogd11] .filters-grid {
        grid-template-columns: 1fr;
        gap: 1.5rem; /* Increased gap to prevent overlap when dropdown is open */
    }

    /* Fix dropdown positioning on mobile */
    [b-nbjz7ogd11] .filter-section {
        overflow: visible;
        position: relative;
        z-index: 1;
    }

        /* Open dropdown should have higher z-index */
        [b-nbjz7ogd11] .filter-section:has(.filter-dropdown-menu) {
            z-index: 10;
        }

    [b-nbjz7ogd11] .filter-dropdown {
        position: relative;
        overflow: visible;
    }

    /* Dropdown menu should be full width and positioned correctly */
    [b-nbjz7ogd11] .filter-dropdown-menu {
        position: relative;
        left: 0;
        right: 0;
        width: 100%;
        max-height: 200px;
        margin-top: 0.25rem;
        z-index: 100;
    }

    /* Ensure date inputs don't overflow */
    [b-nbjz7ogd11] .date-range-inputs {
        gap: 0.25rem;
    }

    [b-nbjz7ogd11] .filter-date-input {
        padding: 0.5rem;
        font-size: 0.8125rem;
        min-width: 90px;
    }

    [b-nbjz7ogd11] .date-separator {
        font-size: 0.75rem;
    }

    [b-nbjz7ogd11] .filter-chips-container {
        flex-direction: column;
        align-items: flex-start;
    }

    [b-nbjz7ogd11] .filter-chips-list {
        width: 100%;
    }

    /* Reduce padding on mobile */
    [b-nbjz7ogd11] .filters-panel-container {
        padding: 0.75rem;
    }
}

@media (max-width: 480px) {
    /* Extra small mobile */
    [b-nbjz7ogd11] .filters-grid {
        gap: 0.75rem;
    }

    [b-nbjz7ogd11] .filter-section {
        gap: 0.375rem;
    }

    [b-nbjz7ogd11] .filter-label {
        font-size: 0.8125rem;
    }

    [b-nbjz7ogd11] .filter-dropdown-button {
        padding: 0.375rem 0.625rem;
        font-size: 0.875rem;
    }
}

/* Policy Card */
[b-nbjz7ogd11] .policy-card {
    background-color: var(--rival-background-secondary) !important;
    border: 1px solid var(--rival-border) !important;
    border-radius: 0.5rem !important;
    padding: 0.5rem 0.75rem 0 0.75rem !important;
    cursor: pointer !important;
    transition: all 0.2s !important;
    position: relative !important;
    overflow: hidden !important;
    line-height: 1.1 !important;
    box-sizing: border-box !important;
    display: flex !important;
    flex-direction: column !important;
    min-height: 250px;
}

    [b-nbjz7ogd11] .policy-card:hover {
        background-color: var(--rival-background-secondary) !important;
        border-color: var(--rival-border) !important;
    }

[b-nbjz7ogd11] .policy-card.expanded {
    grid-column: span 2;
    z-index: 10;
    overflow: hidden !important;
}
/* _content/RPMClient/Components/Shared/RequiredAsterisk.razor.rz.scp.css */
.rival-required-asterisk[b-lgu8e29ujk] {
    color: #EF5350 !important;
}
/* _content/RPMClient/Components/Shared/Rolodex/Rolodex.razor.rz.scp.css */
[b-p8ksydqzxq] .transition {
    transition: all 0.15s ease !important;
}

[b-p8ksydqzxq] .no-transitions * {
    transition: none !important;
}
/* _content/RPMClient/Components/Store/MGATooltip.razor.rz.scp.css */
.tooltip-container[b-hr8143gft3] {
    position: relative;
    display: inline-block;
    max-width: max-content;
    margin-bottom: 2px;
    padding-right: 1px;
}

    .tooltip-container.clicked .tooltip-text[b-hr8143gft3] {
        visibility: visible;
        opacity: 1;
    }

.tooltip-content[b-hr8143gft3] {
    cursor: pointer;
}

.tooltip-text[b-hr8143gft3] {
    font-size: 0.7rem;
    visibility: hidden;
    position: absolute;
    text-align: center;
    padding: 5px 10px;
    border-radius: 4px;
    z-index: 1;
    left: 4px;
    opacity: 0;
    top: calc(100% + 10px);
    white-space: nowrap;
}

    .tooltip-text[b-hr8143gft3]:before {
        content: "";
        position: absolute;
        bottom: 100%;
        left: 25px;
        margin-left: -5px;
        border-width: 5px;
        border-style: solid;
        border-color: transparent transparent #707070 transparent;
    }

.tooltip-right-aligned[b-hr8143gft3] {
    left: auto !important;
    right: 25px !important;
}

    .tooltip-right-aligned[b-hr8143gft3]:before {
        left: auto !important;
        right: 25px !important;
    }

.tooltip-left-aligned[b-hr8143gft3] {
    left: 25px !important;
    right: auto !important;
}

    .tooltip-left-aligned[b-hr8143gft3]:before {
        left: 25px !important;
        right: auto !important;
    }
/* _content/RPMClient/Components/Tiles/AppsTile.razor.rz.scp.css */
.e-panel-header[b-kzqsj8t2dt] {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

    .e-panel-header a[b-kzqsj8t2dt] {
        padding-right: 20px;
    }
/* _content/RPMClient/Components/Tiles/StoreTile.razor.rz.scp.css */
.e-panel-header[b-9zod04w3wl] {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

    .e-panel-header a[b-9zod04w3wl] {
        padding-right: 20px;
    }
/* _content/RPMClient/Pages/Board.razor.rz.scp.css */
.e-panel[b-ewul7mieon] {
    background-color: var(--rival-background-secondary) !important;
    border: none !important;
}
/* _content/RPMClient/Pages/CustomerRecord/CustomerRecordContacts.razor.rz.scp.css */
/* Customer Record Contacts Page-Specific Styles */
/* Header styles are inherited from GenericDataView.razor.css */

/* Bottom spacing for the page and table */
.customer-record-contacts-page[b-u48dltigy3] {
    margin-bottom: 3rem; /* Add space at the bottom of the entire page */
}

/* ========================================
   CONTACT DETAIL MODAL STYLES
   ======================================== */

/* Modal Header */
[b-u48dltigy3] .contact-name-title {
    flex: 1;
}

[b-u48dltigy3] .contact-name {
    color: var(--rival-text-primary);
    font-size: 1.25rem;
    font-weight: 600;
    margin: 0 0 0.25rem 0;
}

[b-u48dltigy3] .contact-title {
    font-size: 1.125rem;
    font-weight: 600;
    margin: 0.75rem 0 0 0;
    opacity: 0.9;
}

/* Modal Content - Grid Layout */
[b-u48dltigy3] .contact-details {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 3rem;
}

[b-u48dltigy3] .contact-details-column,
[b-u48dltigy3] .additional-info-column {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

[b-u48dltigy3] .section-title {
    color: var(--rival-gray-600-on-text) !important;
    font-size: 1rem;
    font-weight: 500;
    margin: 0 0 0.5rem 0;
    padding-bottom: 0;
}

/* Contact Detail Items */
[b-u48dltigy3] .detail-modal .contact-detail-item {
    display: flex;
    align-items: baseline;
    gap: 0.5rem;
    margin-bottom: 1.0rem !important;
    margin-top: 0.25rem;
    color: var(--rival-gray-600-on-text) !important;
    font-size: 0.875rem;
}


    [b-u48dltigy3] .detail-modal .contact-detail-item:last-child {
        margin-bottom: 0 !important;
    }

[b-u48dltigy3] .contact-detail-item i {
    color: var(--rival-gray-600-on-text) !important;
    font-size: 1rem;
    align-self: center;
}

[b-u48dltigy3] .contact-link {
    color: #6288C5;
    text-decoration: none;
    transition: color 0.2s;
    cursor: pointer;
}

    [b-u48dltigy3] .contact-link:hover {
        color: #6288C5;
        text-decoration: underline;
    }

[b-u48dltigy3] .phone-number {
    color: var(--rival-text-primary);
    margin-right: 1rem;
    font-size: 1rem;
    line-height: 1.5;
    align-self: baseline;
}

[b-u48dltigy3] .phone-actions {
    display: flex;
    gap: 0.5rem;
    margin-left: auto;
    align-self: center;
}

    [b-u48dltigy3] .phone-actions .e-btn {
        padding: 0.375rem 0.75rem !important;
        font-size: 0.875rem !important;
        min-height: 2rem !important;
    }

/* Info Items */
[b-u48dltigy3] .detail-modal .info-item {
    display: flex;
    flex-direction: row;
    align-items: baseline;
    gap: 0.75rem;
    margin-bottom: 0.1rem !important;
}

[b-u48dltigy3] .detail-modal .info-label {
    color: var(--rival-gray-600-on-text) !important;
    font-size: 1rem;
    font-weight: 500;
    min-width: 120px;
    flex-shrink: 0;
    line-height: 1.5;
}

[b-u48dltigy3] .detail-modal .info-value {
    color: var(--rival-text-primary);
    font-size: 1rem;
    line-height: 1.5;
}

/* Social Links in Modal */
[b-u48dltigy3] .detail-modal .social-links {
    display: flex;
    gap: 0.75rem;
    margin-top: 0.5rem;
}

[b-u48dltigy3] .detail-modal .info-item:has(.social-links) .info-label {
    margin-top: 0;
}

[b-u48dltigy3] .detail-modal .social-link {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 2.5rem;
    height: 2.5rem;
    border-radius: 0.375rem;
    background-color: var(--rival-social-link-bg);
    color: var(--rival-component-text);
    transition: all 0.2s;
    text-decoration: none;
}

    [b-u48dltigy3] .detail-modal .social-link:hover {
        background-color: var(--rival-light-blue);
        color: var(--rival-component-text);
    }

    [b-u48dltigy3] .detail-modal .social-link i {
        font-size: 1.25rem;
    }

/* ========================================
   EXPANDED CARD VIEW SOCIAL LINKS
   Match the Bootstrap styling from modal
   ======================================== */

[b-u48dltigy3] .contact-card-expanded {
    padding-bottom: 1.5rem;
}

    [b-u48dltigy3] .contact-card-expanded .social-links {
        display: flex;
        gap: 0.75rem;
        margin-top: 1rem;
        margin-bottom: 1rem;
    }

    [b-u48dltigy3] .contact-card-expanded .social-link {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 2.5rem;
        height: 2.5rem;
        border-radius: 0.375rem;
        background-color: #373737;
        color: #ffffff;
        transition: all 0.2s;
        text-decoration: none;
    }

        [b-u48dltigy3] .contact-card-expanded .social-link:hover {
            background-color: #6288C5;
            color: #ffffff;
        }

        [b-u48dltigy3] .contact-card-expanded .social-link i {
            font-size: 1.25rem;
        }

/* Mobile-specific overrides for grid columns */
@media (max-width: 768px) {
    /* Make email column wider on mobile */
    .e-grid .e-gridcontent .e-table .e-row .e-rowcell[aria-label*="Email"][b-u48dltigy3],
    .e-grid .e-gridcontent .e-table .e-row .e-rowcell[data-colindex="2"][b-u48dltigy3] {
        min-width: 180px !important;
        width: 180px !important;
    }

    /* Adjust email column header on mobile */
    .e-grid .e-gridheader .e-table .e-columnheader[aria-label*="Email"][b-u48dltigy3],
    .e-grid .e-gridheader .e-table .e-columnheader[data-colindex="2"][b-u48dltigy3] {
        min-width: 180px !important;
        width: 180px !important;
    }

    /* Contact Modal Mobile Styles */
    [b-u48dltigy3] .contact-details {
        grid-template-columns: 1fr !important;
        gap: 1.5rem !important;
    }

    [b-u48dltigy3] .detail-modal .contact-detail-item {
        flex-direction: column;
        align-items: flex-start !important;
        gap: 0.75rem !important;
        margin-bottom: 1rem !important;
    }

        [b-u48dltigy3] .detail-modal .contact-detail-item i {
            font-size: 1.25rem !important;
        }

    [b-u48dltigy3] .phone-actions {
        width: 100%;
        margin-left: 0 !important;
    }

        [b-u48dltigy3] .phone-actions .e-btn {
            flex: 1;
            justify-content: center !important;
            padding: 0.75rem 1rem !important;
            font-size: 1rem !important;
            min-height: 44px !important;
        }

    [b-u48dltigy3] .detail-modal .info-item {
        flex-direction: column;
        align-items: flex-start !important;
        gap: 0.5rem !important;
        margin-bottom: 1rem !important;
    }

    [b-u48dltigy3] .detail-modal .info-label {
        font-size: 0.875rem !important;
    }

    [b-u48dltigy3] .detail-modal .info-value {
        font-size: 0.875rem !important;
    }

    [b-u48dltigy3] .detail-modal .social-links {
        gap: 1rem !important;
        margin-top: 0.75rem !important;
    }

    [b-u48dltigy3] .detail-modal .social-link {
        width: 3rem !important;
        height: 3rem !important;
    }

        [b-u48dltigy3] .detail-modal .social-link i {
            font-size: 1.5rem !important;
        }

    /* Expanded Card Mobile Styles */
    [b-u48dltigy3] .contact-card-expanded .social-links {
        gap: 1rem !important;
        margin-top: 0.75rem !important;
        margin-bottom: 1rem !important;
    }

    [b-u48dltigy3] .contact-card-expanded .social-link {
        width: 3rem !important;
        height: 3rem !important;
    }

        [b-u48dltigy3] .contact-card-expanded .social-link i {
            font-size: 1.5rem !important;
        }
}
/* _content/RPMClient/Pages/CustomerRecord/CustomerRecordDocuments.razor.rz.scp.css */
/* Customer Record Documents Page Styles */

.customer-record-documents-page[b-0yb4joqedm] {
    background-color: var(--rival-background-primary);
    min-height: 100vh;
    color: var(--rival-text-primary);
}

.document-list-header[b-0yb4joqedm] {
    background-color: var(--rival-background-primary);
    border-bottom: 1px solid var(--rival-border);
    padding: 1rem;
}

.header-top[b-0yb4joqedm] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1rem;
}

.header-right[b-0yb4joqedm] {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.header-left[b-0yb4joqedm] {
    display: flex;
    align-items: center;
    gap: 2rem;
}

.back-button[b-0yb4joqedm] {
    background: none;
    border: none;
    color: var(--rival-text-primary);
    display: flex;
    align-items: center;
    gap: 0.5rem;
    cursor: pointer;
    padding: 0.5rem;
    border-radius: 0.375rem;
    transition: background-color 0.2s;
}

    .back-button:hover[b-0yb4joqedm] {
        background-color: var(--rival-background-secondary);
    }

.page-title[b-0yb4joqedm] {
    font-size: 2rem;
    font-weight: 600;
    color: var(--rival-text-primary);
    margin: 0;
}

.document-count-badge[b-0yb4joqedm] {
    background-color: var(--rival-light-blue);
    color: var(--rival-text-primary);
    padding: 0.375rem 0.75rem;
    border-radius: 1rem;
    font-size: 0.875rem;
    font-weight: 500;
}

.view-toggle[b-0yb4joqedm] {
    display: flex;
    border: 1px solid var(--rival-border);
    border-radius: 0.375rem;
    overflow: hidden;
}

.view-toggle-btn[b-0yb4joqedm] {
    background-color: transparent;
    border: none;
    color: var(--rival-input-placeholder);
    cursor: pointer;
    transition: all 0.2s;
    border-radius: 0;
}

    .view-toggle-btn:hover[b-0yb4joqedm] {
        background-color: var(--rival-background-secondary);
        color: var(--rival-text-primary);
    }

    .view-toggle-btn.active[b-0yb4joqedm] {
        background-color: var(--rival-light-blue);
        color: var(--rival-text-primary);
    }

.search-controls[b-0yb4joqedm] {
    display: flex;
    align-items: center;
    gap: 1rem;
    background-color: var(--rival-background-primary);
    padding: 1rem 0;
}

.search-container[b-0yb4joqedm] {
    position: relative;
    flex: 2;
    max-width: 40rem;
    display: flex;
    align-items: center;
    border-radius: 0.5rem;
}

.search-icon[b-0yb4joqedm] {
    position: absolute;
    left: 0.75rem;
    top: 50%;
    transform: translateY(-50%);
    color: var(--rival-input-placeholder);
    font-size: 1rem;
    z-index: 2;
}

.search-input[b-0yb4joqedm] {
    width: 100%;
    background-color: var(--rival-background-secondary);
    border: 1px solid var(--rival-border);
    color: var(--rival-text-primary);
    padding: 0.5rem;
    font-size: 1rem;
    box-sizing: border-box;
}

    .search-input[b-0yb4joqedm]::placeholder {
        color: var(--rival-input-placeholder);
    }

    .search-input:focus[b-0yb4joqedm] {
        outline: none;
        border-color: var(--rival-light-blue);
        box-shadow: 0 0 0 1px var(--rival-light-blue);
    }

.clear-search-btn[b-0yb4joqedm] {
    position: absolute;
    right: 0.5rem;
    top: 50%;
    transform: translateY(-50%);
    background: none;
    border: none;
    color: var(--rival-input-placeholder);
    cursor: pointer;
    padding: 0.25rem;
    border-radius: 0.25rem;
    z-index: 2;
}

    .clear-search-btn:hover[b-0yb4joqedm] {
        background-color: var(--rival-border);
        color: var(--rival-text-primary);
    }

.filter-btn[b-0yb4joqedm],
.add-document-button[b-0yb4joqedm] {
    white-space: nowrap;
    height: 52px;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0 1rem;
    border-radius: 0.375rem;
    font-weight: 500;
    transition: all 0.2s;
}

.filter-btn[b-0yb4joqedm] {
    background-color: var(--rival-background-secondary);
    border: 1px solid var(--rival-border);
    color: var(--rival-text-primary);
}

    .filter-btn:hover[b-0yb4joqedm] {
        background-color: var(--rival-border);
    }

    .filter-btn.active[b-0yb4joqedm] {
        background-color: var(--rival-light-blue);
        border-color: var(--rival-light-blue);
    }

.add-document-button[b-0yb4joqedm] {
    background-color: var(--rival-warning);
    border: 1px solid var(--rival-warning);
    color: #000000;
}

    .add-document-button:hover[b-0yb4joqedm] {
        background-color: var(--rival-warning-hover);
        border-color: var(--rival-warning-hover);
    }

/* Content Area */
.document-content[b-0yb4joqedm] {
    padding: 1rem;
    background-color: var(--rival-background-primary);
    min-height: calc(100vh - 200px);
}

/* Card View Styles */
.documents-card-grid[b-0yb4joqedm] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(350px, 1fr));
    gap: 1rem;
    padding: 0;
}

/* Default Card View - Compact Layout */
.document-card[b-0yb4joqedm] {
    padding: 1rem;
    background-color: var(--rival-background-secondary) !important;
    border-radius: 0.5rem;
    border: 1px solid var(--rival-border);
    color: var(--rival-text-primary);
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    height: 100%;
    cursor: pointer;
    transition: all 0.2s;
    position: relative;
    min-height: 140px;
}

    .document-card:hover[b-0yb4joqedm] {
        background-color: var(--rival-background-secondary);
        border-color: #4a4a4a;
        transform: translateY(-2px);
        box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
    }

    .document-card.expanded[b-0yb4joqedm] {
        border-color: var(--rival-success);
        background-color: var(--rival-background-secondary);
        box-shadow: 0 8px 16px rgba(0, 0, 0, 0.3);
        transform: scale(1.02);
    }

.document-card-header[b-0yb4joqedm] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    margin-bottom: 0.75rem;
}

.document-info[b-0yb4joqedm] {
    display: flex;
    align-items: flex-start;
    justify-content: flex-start;
    gap: 0.75rem;
    width: 100%;
}

/* Document Name Pill - Green Button */
.document-name-pill[b-0yb4joqedm],
.document-name-btn[b-0yb4joqedm] {
    background-color: var(--rival-success);
    color: #000000;
    border: none;
    padding: 0.375rem 0.75rem;
    border-radius: 1.25rem;
    font-size: 0.875rem;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.2s;
    max-width: 200px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    flex: 1;
    min-width: 0;
}

    .document-name-pill:hover[b-0yb4joqedm],
    .document-name-btn:hover[b-0yb4joqedm] {
        background-color: var(--rival-success-hover);
        transform: translateY(-1px);
    }

    .document-name-pill:focus[b-0yb4joqedm],
    .document-name-btn:focus[b-0yb4joqedm] {
        outline: 2px solid var(--rival-success);
        outline-offset: 2px;
    }

/* File Type Badge */
.document-type-badge[b-0yb4joqedm] {
    background: transparent;
    color: #d1d5db;
    border: 1px solid #6b7280;
    padding: 0.1rem 0.5rem;
    border-radius: 0.375rem;
    font-size: 0.75rem;
    font-weight: 500;
    flex-shrink: 0;
    white-space: nowrap;
    width: fit-content;
}

/* Metadata Section */
.document-metadata[b-0yb4joqedm] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    margin-top: auto;
    color: var(--rival-input-placeholder);
    font-size: 0.75rem;
    text-align: left;
}

.metadata-item[b-0yb4joqedm] {
    display: flex;
    align-items: baseline;
    gap: 0.5rem;
    font-size: 0.75rem;
    line-height: 1.5;
    margin-bottom: 0.25rem;
    text-align: left;
}

    .metadata-item:last-child[b-0yb4joqedm] {
        margin-bottom: 0;
    }

    .metadata-item .metadata-label[b-0yb4joqedm] {
        color: var(--rival-input-placeholder);
        font-weight: 500;
        min-width: fit-content;
        flex-shrink: 0;
        white-space: nowrap;
    }

    .metadata-item .metadata-value[b-0yb4joqedm] {
        color: var(--rival-text-primary);
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        flex: 1;
    }

.metadata-label[b-0yb4joqedm] {
    color: var(--rival-input-placeholder);
    font-weight: 500;
    min-width: fit-content;
    flex-shrink: 0;
}

.metadata-value[b-0yb4joqedm] {
    color: var(--rival-text-primary);
    flex: 1;
    word-break: break-word;
}



/* Table View Styles */
.documents-table-container[b-0yb4joqedm] {
    background-color: var(--rival-background-secondary);
    border: 1px solid var(--rival-border);
    border-radius: 0.5rem;
    overflow: hidden;
}

.documents-table[b-0yb4joqedm] {
    width: 100%;
}

.table-header[b-0yb4joqedm] {
    background-color: var(--rival-background-primary);
    border-bottom: 1px solid var(--rival-border);
}

.table-header-row[b-0yb4joqedm] {
    display: grid;
    grid-template-columns: 2fr 1fr 2fr 1.5fr 1.5fr;
    gap: 1rem;
    padding: 1rem;
    font-weight: 600;
    color: var(--rival-text-primary);
}

.table-header-cell[b-0yb4joqedm] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    cursor: pointer;
    user-select: none;
    transition: color 0.2s;
    font-size: 0.875rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

    .table-header-cell:hover[b-0yb4joqedm] {
        color: var(--rival-light-blue);
    }

.sort-icon[b-0yb4joqedm] {
    font-size: 0.75rem;
    color: var(--rival-input-placeholder);
}

    .sort-icon.active[b-0yb4joqedm] {
        color: var(--rival-light-blue);
    }

.table-body[b-0yb4joqedm] {
    max-height: 600px;
    overflow-y: auto;
}

.table-row[b-0yb4joqedm] {
    display: grid;
    grid-template-columns: 2fr 1fr 2fr 1.5fr 1.5fr;
    gap: 1rem;
    padding: 1rem;
    border-bottom: 1px solid var(--rival-border);
    cursor: pointer;
    transition: background-color 0.2s;
}

    .table-row:hover[b-0yb4joqedm] {
        background-color: var(--rival-background-secondary);
    }

    .table-row:last-child[b-0yb4joqedm] {
        border-bottom: none;
    }

.table-cell[b-0yb4joqedm] {
    display: flex;
    align-items: center;
    font-size: 0.875rem;
    color: var(--rival-text-primary);
    min-height: 2.5rem;
}

.document-name-cell[b-0yb4joqedm] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.file-type-icon[b-0yb4joqedm] {
    font-size: 1.25rem;
    flex-shrink: 0;
}

.document-name-text[b-0yb4joqedm] {
    font-weight: 500;
    word-break: break-word;
}

.document-description-text[b-0yb4joqedm] {
    color: #d1d5db;
    word-break: break-word;
}

.uploader-name[b-0yb4joqedm] {
    color: var(--rival-light-blue);
    font-weight: 500;
}

.upload-date[b-0yb4joqedm] {
    color: var(--rival-input-placeholder);
}

/* No Documents Message */
.no-documents-message[b-0yb4joqedm] {
    text-align: center;
    padding: 4rem 2rem;
    color: var(--rival-input-placeholder);
}

.no-documents-icon[b-0yb4joqedm] {
    font-size: 4rem;
    margin-bottom: 1rem;
    color: #6b7280;
}

.no-documents-message h3[b-0yb4joqedm] {
    font-size: 1.5rem;
    font-weight: 600;
    color: var(--rival-text-primary);
    margin: 0 0 0.5rem 0;
}

.no-documents-message p[b-0yb4joqedm] {
    font-size: 1rem;
    margin: 0;
    line-height: 1.5;
}

/* Responsive Design */
@media (max-width: 1024px) {
    .document-list-header[b-0yb4joqedm] {
        padding: 0.75rem;
    }

    .header-left[b-0yb4joqedm] {
        gap: 1rem;
    }

    .page-title[b-0yb4joqedm] {
        font-size: 1.5rem;
    }

    .documents-card-grid[b-0yb4joqedm] {
        grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
    }

    .table-header-row[b-0yb4joqedm],
    .table-row[b-0yb4joqedm] {
        grid-template-columns: 1.5fr 1fr 1.5fr 1fr 1fr;
        gap: 0.5rem;
        padding: 0.75rem;
    }
}

@media (max-width: 768px) {
    .header-top[b-0yb4joqedm] {
        flex-direction: column;
        gap: 1rem;
        align-items: stretch;
    }

    .header-left[b-0yb4joqedm] {
        justify-content: space-between;
        align-items: center;
    }

    .search-controls[b-0yb4joqedm] {
        flex-direction: column;
        gap: 0.75rem;
        align-items: stretch;
    }

        .search-controls .e-btn[b-0yb4joqedm],
        .search-controls button[b-0yb4joqedm] {
            width: 100%;
            justify-content: center;
        }

    .documents-card-grid[b-0yb4joqedm] {
        grid-template-columns: 1fr;
    }

    .documents-table-container[b-0yb4joqedm] {
        overflow-x: auto;
    }

    .table-header-row[b-0yb4joqedm],
    .table-row[b-0yb4joqedm] {
        min-width: 600px;
    }

    .document-content[b-0yb4joqedm] {
        padding: 0.75rem;
    }
}

@media (max-width: 480px) {
    .document-list-header[b-0yb4joqedm] {
        padding: 0.5rem;
    }

    .page-title[b-0yb4joqedm] {
        font-size: 1.25rem;
    }

    .document-count-badge[b-0yb4joqedm] {
        font-size: 0.75rem;
        padding: 0.25rem 0.5rem;
    }

    .document-card[b-0yb4joqedm] {
        padding: 0.75rem;
    }

    .document-name[b-0yb4joqedm] {
        font-size: 0.875rem;
    }

    .no-documents-message[b-0yb4joqedm] {
        padding: 2rem 1rem;
    }

    .no-documents-icon[b-0yb4joqedm] {
        font-size: 3rem;
    }
}

/* Focus and Accessibility */
.search-input:focus[b-0yb4joqedm],
.document-card:focus[b-0yb4joqedm],
.table-row:focus[b-0yb4joqedm],
.table-header-cell:focus[b-0yb4joqedm] {
    outline: 2px solid var(--rival-light-blue);
    outline-offset: 2px;
}

/* Animations */
.document-card[b-0yb4joqedm],
.table-row[b-0yb4joqedm] {
    animation: fadeIn-b-0yb4joqedm 0.3s ease-in-out;
}

@keyframes fadeIn-b-0yb4joqedm {
    from {
        opacity: 0;
        transform: translateY(10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Scrollbar Styling */
.table-body[b-0yb4joqedm]::-webkit-scrollbar {
    width: 8px;
}

.table-body[b-0yb4joqedm]::-webkit-scrollbar-track {
    background: var(--rival-background-primary);
}

.table-body[b-0yb4joqedm]::-webkit-scrollbar-thumb {
    background: #374151;
    border-radius: 4px;
}

    .table-body[b-0yb4joqedm]::-webkit-scrollbar-thumb:hover {
        background: #4b5563;
    }

/* Grid View Styles - Matching Prototype */
.document-name-cell[b-0yb4joqedm] {
    display: flex;
    align-items: center;
}

.document-name-badge[b-0yb4joqedm] {
    background-color: var(--rival-success);
    color: var(--rival-text-primary);
    padding: 0.25rem 0.75rem;
    border-radius: 0.375rem;
    font-size: 0.875rem;
    font-weight: 500;
    display: inline-block;
}

.document-type-cell[b-0yb4joqedm] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.document-type-icon-grid[b-0yb4joqedm] {
    font-size: 1rem;
}

    .document-type-icon-grid.bi-file-earmark-pdf[b-0yb4joqedm] {
        color: #dc2626;
    }

    .document-type-icon-grid.bi-file-earmark-excel[b-0yb4joqedm] {
        color: var(--rival-success-hover);
    }

    .document-type-icon-grid.bi-file-earmark-word[b-0yb4joqedm] {
        color: #2563eb;
    }

    .document-type-icon-grid.bi-file-earmark-image[b-0yb4joqedm] {
        color: #7c3aed;
    }

.document-type-text[b-0yb4joqedm] {
    font-size: 0.875rem;
    color: #d1d5db;
}

.document-description-cell[b-0yb4joqedm] {
    color: #d1d5db;
}

.no-description[b-0yb4joqedm] {
    font-style: italic;
    color: var(--rival-input-placeholder);
}

.document-uploader-cell[b-0yb4joqedm] {
    color: #d1d5db;
    font-size: 0.875rem;
}

.document-date-cell[b-0yb4joqedm] {
    color: #d1d5db;
    font-size: 0.875rem;
}

/* Card styles are now handled by GenericDataView.razor.css */

/* Expanded Card View - Larger Text */
.document-card.expanded[b-0yb4joqedm] {
    border-color: var(--rival-success);
    background-color: var(--rival-background-secondary);
    box-shadow: 0 8px 16px rgba(0, 0, 0, 0.3);
    transform: scale(1.02);
    grid-column: span 2;
    z-index: 10;
}

    .document-card.expanded .document-name-pill[b-0yb4joqedm],
    .document-card.expanded .document-name-btn[b-0yb4joqedm] {
        font-size: 1rem;
        padding: 0.5rem 1rem;
        max-width: 250px;
    }

    .document-card.expanded .document-type-badge[b-0yb4joqedm] {
        font-size: 0.875rem;
        padding: 0.375rem 0.75rem;
        width: fit-content;
    }

    .document-card.expanded .document-metadata[b-0yb4joqedm] {
        font-size: 0.875rem;
    }

    .document-card.expanded .metadata-item[b-0yb4joqedm] {
        font-size: 0.875rem;
        margin-bottom: 0.375rem;
    }

        .document-card.expanded .metadata-item:last-child[b-0yb4joqedm] {
            margin-bottom: 0;
        }

/* Responsive Design for Document Cards */
@media (max-width: 768px) {
    .document-card[b-0yb4joqedm] {
        min-height: 120px;
        padding: 0.75rem;
    }

    .document-name-pill[b-0yb4joqedm],
    .document-name-btn[b-0yb4joqedm] {
        font-size: 0.8rem;
        padding: 0.3rem 0.6rem;
        max-width: 160px;
    }

    .document-type-badge[b-0yb4joqedm] {
        font-size: 0.7rem;
        padding: 0.2rem 0.4rem;
    }

    .metadata-item[b-0yb4joqedm] {
        font-size: 0.7rem;
    }
}

@media (max-width: 480px) {
    .document-card[b-0yb4joqedm] {
        min-height: 110px;
        padding: 0.6rem;
        gap: 0.5rem;
    }

    .document-card-header[b-0yb4joqedm] {
        gap: 0.5rem;
        margin-bottom: 0.5rem;
    }

    .document-name-pill[b-0yb4joqedm],
    .document-name-btn[b-0yb4joqedm] {
        font-size: 0.75rem;
        padding: 0.25rem 0.5rem;
        max-width: 140px;
    }

    .document-type-badge[b-0yb4joqedm] {
        font-size: 0.65rem;
        padding: 0.15rem 0.35rem;
    }

    .metadata-item[b-0yb4joqedm] {
        font-size: 0.65rem;
    }
}
/* _content/RPMClient/Pages/CustomerRecord/CustomerRecordOpportunities.razor.rz.scp.css */
/* Customer Record Opportunities Page-Specific Styles */
/* Header styles are inherited from GenericDataView.razor.css */

/* Bottom spacing for the page and table */
.customer-record-opportunities-page[b-2ltbrauxr8] {
    margin-bottom: 3rem; /* Add space at the bottom of the entire page */
}

/* Opportunity Card Content Styles (inherits base structure from GenericDataView.razor.css) */

/* Opportunity-specific aliases for generic classes */
[b-2ltbrauxr8] .opportunity-card-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 0.5rem;
    height: auto;
    line-height: 1.1;
}

[b-2ltbrauxr8] .opportunity-info {
    flex: 1;
}

[b-2ltbrauxr8] .opportunity-card-expanded {
    position: relative;
    margin-top: 0.5rem;
    padding-top: 0;
    padding-bottom: 0;
}

[b-2ltbrauxr8] .opportunity-details {
    margin: 0;
    padding-top: 0;
    padding-bottom: 0;
}

[b-2ltbrauxr8] .opportunity-detail-item {
    display: flex;
    align-items: center;
    margin-bottom: 0.5rem !important;
    color: var(--rival-gray-600-on-text) !important;
    font-size: 0.875rem;
}

[b-2ltbrauxr8] .detail-label {
    color: var(--rival-gray-600-on-text) !important;
    margin-right: 0.5rem;
}

[b-2ltbrauxr8] .detail-value {
    color: var(--rival-text-primary);
    font-weight: 500;
}

[b-2ltbrauxr8] .opportunity-detail-item:last-child {
    margin-bottom: 0 !important;
}

[b-2ltbrauxr8] .opportunity-card-summary {
    margin-top: 0.5rem;
    display: block;
    padding-bottom: 0.75rem;
}

[b-2ltbrauxr8] .opportunity-summary-item {
    display: flex;
    align-items: center;
    margin-bottom: 0.75rem;
    color: var(--rival-gray-600-on-text) !important;
    font-size: 0.875rem;
}

[b-2ltbrauxr8] .opportunity-summary-item:last-child {
    margin-bottom: 0;
}

/* Opportunity-specific content styles */
[b-2ltbrauxr8] .opportunity-name {
    font-size: 1.125rem;
    font-weight: 600;
    color: var(--rival-text-primary);
    margin: 0 0 0.5rem 0;
    line-height: 1.2;
}

[b-2ltbrauxr8] .opportunity-status {
    color: var(--rival-gray-600-on-text) !important;
    margin: 0 0 1rem 0;
    font-size: 0.875rem;
    font-weight: 400;
    line-height: 1.2;
}

[b-2ltbrauxr8] .opportunity-premium {
    text-align: right;
}

[b-2ltbrauxr8] .premium-amount {
    font-size: 1.25rem;
    font-weight: 700;
    color: var(--rival-text-primary);
}

/* Status badge colors - All white */
[b-2ltbrauxr8] .status-badge {
    padding: 0.25rem 0.75rem;
    border-radius: 0.375rem;
    font-size: 0.875rem;
    font-weight: 500;
    color: var(--rival-text-primary) !important;
}

/* Override all status-specific colors to be white */
[b-2ltbrauxr8] .status-new,
[b-2ltbrauxr8] .status-quoted,
[b-2ltbrauxr8] .status-bound,
[b-2ltbrauxr8] .status-inprogress,
[b-2ltbrauxr8] .status-in-progress,
[b-2ltbrauxr8] .status-application,
[b-2ltbrauxr8] .status-closed {
    color: var(--rival-text-primary) !important;
}

/* ========================================
   OPPORTUNITY DETAIL MODAL STYLES
   ======================================== */

/* Modal Header */
[b-2ltbrauxr8] .opportunity-modal-header {
    display: flex;
    align-items: center;
}

[b-2ltbrauxr8] .opportunity-lob-badge {
    background-color: var(--rival-success);
    color: #121212;
    font-size: 1.125rem;
    font-weight: 600;
    padding: 0.5rem 1.5rem;
    border-radius: 0.5rem;
    display: inline-block;
    transition: all 0.2s ease;
}

[b-2ltbrauxr8] .opportunity-lob-badge.cursor-pointer:hover {
    opacity: 0.8;
    transform: scale(1.05);
}

/* Modal Content - Two Column Layout */
[b-2ltbrauxr8] .opportunity-modal-content {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 4rem;
    padding: 2rem 0 1rem 0;
}

[b-2ltbrauxr8] .opportunity-left-column,
[b-2ltbrauxr8] .opportunity-right-column {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

/* Opportunity Field Rows */
[b-2ltbrauxr8] .opportunity-field {
    display: flex;
    flex-direction: row;
    align-items: baseline;
    gap: 0.5rem;
}

[b-2ltbrauxr8] .opportunity-field .field-label {
    color: var(--rival-gray-600-on-text) !important;
    font-size: 1rem;
    font-weight: 400;
    white-space: nowrap;
}

[b-2ltbrauxr8] .opportunity-field .field-value {
    color: var(--rival-text-primary);
    font-size: 1rem;
}

/* Mobile Styles */
@media (max-width: 768px) {
    /* Opportunity Modal Mobile Styles */
    [b-2ltbrauxr8] .opportunity-lob-badge {
        font-size: 1rem !important;
        padding: 0.4rem 1.2rem !important;
    }

    [b-2ltbrauxr8] .opportunity-modal-content {
        grid-template-columns: 1fr !important;
        gap: 1.5rem !important;
        padding: 1.5rem 0 0.5rem 0 !important;
    }

    [b-2ltbrauxr8] .opportunity-left-column,
    [b-2ltbrauxr8] .opportunity-right-column {
        gap: 1.25rem !important;
    }

    [b-2ltbrauxr8] .opportunity-field {
        flex-direction: column;
        align-items: flex-start !important;
        gap: 0.25rem !important;
    }

    [b-2ltbrauxr8] .opportunity-field .field-label {
        font-size: 0.875rem !important;
    }

    [b-2ltbrauxr8] .opportunity-field .field-value {
        font-size: 0.875rem !important;
    }
}
/* _content/RPMClient/Pages/CustomerRecord/CustomerRecordPolicies.razor.rz.scp.css */
.customer-record-policies-page[b-k7rf9dnn9d] {
    margin-bottom: 3rem; /* Add space at the bottom of the entire page */
}

[b-k7rf9dnn9d] .policy-number {
    font-size: 1.125rem;
    color: var(--rival-text-primary);
    margin: 0 0 0.5rem 0;
    line-height: 1.2;
}

[b-k7rf9dnn9d] .policy-title {
    color: var(--rival-text-light-grey);
    margin: 0 0 1rem 0;
    font-size: 0.875rem;
    line-height: 1.2;
}

[b-k7rf9dnn9d] .policy-premium {
    text-align: right;
}

[b-k7rf9dnn9d] .premium-amount {
    font-size: 1.25rem;
    color: var(--rival-text-primary);
}

[b-k7rf9dnn9d] .policy-info {
    flex: 1;
}

[b-k7rf9dnn9d] .policy-card-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 0.5rem;
    height: auto;
    line-height: 1.1;
}

[b-k7rf9dnn9d] .policy-modal-header {
    display: flex;
    align-items: center;
}

[b-k7rf9dnn9d] .policy-lob-badge {
    background-color: var(--rival-green);
    color: var(--rival-text-primary);
    font-size: 1.125rem;
    font-weight: 600;
    padding: 0.5rem 1.5rem;
    border-radius: 0.5rem;
    display: inline-block;
    transition: all 0.2s ease;
}

    [b-k7rf9dnn9d] .policy-lob-badge.cursor-pointer:hover {
        opacity: 0.8;
        transform: scale(1.05);
    }

/* Modal Content - Two Column Layout */
[b-k7rf9dnn9d] .policy-modal-content {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 4rem;
    padding: 2rem 0 1rem 0;
}

[b-k7rf9dnn9d] .policy-left-column,
[b-k7rf9dnn9d] .policy-right-column {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

/* policy Field Rows */
[b-k7rf9dnn9d] .policy-field {
    display: flex;
    flex-direction: row;
    align-items: baseline;
    gap: 0.5rem;
}

[b-k7rf9dnn9d] .policy-modal-header .field-label {
    color: var(--rival-text-light-grey);
    font-size: 1rem;
    font-weight: 400;
    white-space: nowrap;
}

[b-k7rf9dnn9d] .policy-field .field-label {
    color: var(--rival-text-light-grey);
    font-size: 1rem;
    font-weight: 400;
    white-space: nowrap;
}

[b-k7rf9dnn9d] .policy-field .field-value {
    color: var(--rival-text-primary);
    font-size: 1rem;
}

/* Mobile Styles */
@media (max-width: 768px) {
    /* policy Modal Mobile Styles */
    [b-k7rf9dnn9d] .policy-lob-badge {
        font-size: 1rem !important;
        padding: 0.4rem 1.2rem !important;
    }

    [b-k7rf9dnn9d] .policy-modal-content {
        grid-template-columns: 1fr !important;
        gap: 1.5rem !important;
        padding: 1.5rem 0 0.5rem 0 !important;
    }

    [b-k7rf9dnn9d] .policy-left-column,
    [b-k7rf9dnn9d] .policy-right-column {
        gap: 1.25rem !important;
    }

    [b-k7rf9dnn9d] .policy-field {
        flex-direction: column;
        align-items: flex-start !important;
        gap: 0.25rem !important;
    }

        [b-k7rf9dnn9d] .policy-field .field-label {
            font-size: 0.875rem !important;
        }

        [b-k7rf9dnn9d] .policy-field .field-value {
            font-size: 0.875rem !important;
        }
}
/* _content/RPMClient/Pages/CustomerRecord/DocumentDataView.razor.rz.scp.css */
/* Header Container - Flex Column for Pill + Type Badge */
.document-card-header[b-veezgenncr] {
    display: flex !important;
    flex-direction: column !important;
    gap: 0.5rem !important;
    margin-bottom: 0.75rem !important;
}

/* Document Name Pill - Green Button Style */
.document-name-pill[b-veezgenncr],
.document-name-btn[b-veezgenncr] {
    border: none !important;
    border-radius: 0.5rem !important;
    padding: 0.375rem 0.75rem !important;
    font-size: 0.8125rem !important;
    font-weight: 600 !important;
    cursor: pointer !important;
    transition: all 0.2s !important;
    text-align: left !important;
    width: fit-content !important;
    max-width: 100% !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    text-decoration: none !important;
    display: inline-block !important;
    color: #000000 !important;
}

/* Document Type Badge - Second Line with Border Only */
.document-type-badge[b-veezgenncr] {
    background-color: transparent !important;
    color: #e2e8f0 !important;
    padding: 0.1rem 0.5rem !important;
    border: 1px solid #6b7280 !important;
    border-radius: 0.75rem !important;
    font-size: 0.75rem !important;
    font-weight: 500 !important;
    width: fit-content !important;
    letter-spacing: 0.025em !important;
}

/* === METADATA SECTION === */

/* Metadata Container - Even Spacing */
.document-metadata[b-veezgenncr] {
    display: flex !important;
    flex-direction: column !important;
    gap: 0.5rem !important;
    font-size: 0.8125rem !important;
    line-height: 1.5 !important;
}

/* Individual Metadata Items - Left Aligned */
.metadata-item[b-veezgenncr] {
    display: flex !important;
    align-items: flex-start !important;
    gap: 0.5rem !important;
    line-height: 1.4 !important;
}

/* Metadata Labels - Grey Text */
.metadata-label[b-veezgenncr] {
    color: #9ca3af !important;
    font-weight: 500 !important;
    min-width: 85px !important;
    flex-shrink: 0 !important;
}

/* Metadata Values - White Text */
.metadata-value[b-veezgenncr],
.description-value[b-veezgenncr] {
    color: var(--rival-text-primary) !important;
    word-break: break-word !important;
    font-weight: normal !important;
}

/* No Description Styling - Grey and Italic (only in grid view) */
.no-description[b-veezgenncr] {
    color: #9ca3af !important;
    font-style: italic !important;
    font-weight: 400 !important;
}

/* Description Row - Centered Vertical Alignment Override */
.document-metadata .description-row[b-veezgenncr] {
    display: flex !important;
    flex-direction: row !important;
    gap: 0.5rem !important;
    align-items: center !important;
}

.description-row .metadata-label[b-veezgenncr] {
    min-width: 85px !important;
    flex-shrink: 0 !important;
}

/* === EXPANDED CARD ENHANCEMENTS === */

/* Expanded Card - Larger Text and Enhanced Spacing */
[b-veezgenncr] .document-card.expanded .document-card-header {
    gap: 0.75rem !important;
    margin-bottom: 1rem !important;
}

[b-veezgenncr] .document-card.expanded .document-name-pill,
[b-veezgenncr] .document-card.expanded .document-name-btn {
    font-size: 1rem !important;
    padding: 0.5rem 1rem !important;
    max-width: 100% !important;
}

[b-veezgenncr] .document-card.expanded .document-type-badge {
    font-size: 0.875rem !important;
    padding: 0.375rem 0.75rem !important;
}

[b-veezgenncr] .document-card.expanded .document-metadata {
    font-size: 0.875rem !important;
    gap: 0.625rem !important;
}

[b-veezgenncr] .document-card.expanded .metadata-item {
    font-size: 0.875rem !important;
    gap: 0.5rem !important;
    line-height: 1.6 !important;
}

[b-veezgenncr] .document-card.expanded .metadata-label {
    min-width: 90px !important;
}

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

/* Desktop (1024px and up) - Default styles already applied above */

/* Tablet (768px - 1023px) */
@media (min-width: 768px) and (max-width: 1023px) {
    [b-veezgenncr] .documents-card-grid {
        gap: 1rem !important;
    }
    
    [b-veezgenncr] .document-card {
        padding: 0.875rem !important;
        min-height: 135px !important;
        gap: 0.625rem !important;
        border: 2px solid #6b7280 !important;
        border-radius: 0.75rem !important;
    }
    
    [b-veezgenncr] .document-card:hover {
        border-color: #9ca3af !important;
    }
    
    [b-veezgenncr] .document-card.expanded {
        border: 3px solid #10b981 !important;
        border-radius: 0.875rem !important;
    }
    
    [b-veezgenncr] .document-card-header {
        gap: 0.5rem !important;
        margin-bottom: 0.625rem !important;
    }
    
    [b-veezgenncr] .document-name-pill,
    [b-veezgenncr] .document-name-btn {
        font-size: 0.8rem !important;
        padding: 0.375rem 0.6875rem !important;
        border-radius: 0.5rem !important;
    }
    
    [b-veezgenncr] .document-type-badge {
        font-size: 0.6875rem !important;
        padding: 0.25rem 0.4375rem !important;
        border: 1px solid #6b7280 !important;
        background-color: transparent !important;
        border-radius: 0.375rem !important;
    }
    
    [b-veezgenncr] .document-metadata {
        font-size: 0.8rem !important;
        gap: 0.4375rem !important;
    }
    
    [b-veezgenncr] .metadata-item {
        font-size: 0.8rem !important;
    }
    
    [b-veezgenncr] .metadata-label {
        min-width: 80px !important;
    }
    
    /* Expanded card adjustments for tablet */
    [b-veezgenncr] .document-card.expanded {
        padding: 0.875rem !important;
    }
    
    [b-veezgenncr] .document-card.expanded .document-name-pill,
    [b-veezgenncr] .document-card.expanded .document-name-btn {
        font-size: 0.9rem !important;
        padding: 0.4rem 0.8rem !important;
    }
    
    [b-veezgenncr] .document-card.expanded .document-type-badge {
        font-size: 0.8rem !important;
        padding: 0.3rem 0.6rem !important;
        border: 1px solid #6b7280 !important;
        background-color: transparent !important;
    }
    
    [b-veezgenncr] .document-card.expanded .metadata-item {
        font-size: 0.8rem !important;
    }
}

/* Mobile Large (481px - 767px) */
@media (min-width: 481px) and (max-width: 767px) {
    [b-veezgenncr] .documents-card-grid {
        gap: 0.875rem !important;
    }
    
    [b-veezgenncr] .document-card {
        padding: 0.75rem !important;
        min-height: 125px !important;
        gap: 0.5rem !important;
        border: 2px solid #6b7280 !important;
        border-radius: 0.625rem !important;
    }
    
    [b-veezgenncr] .document-card:hover {
        border-color: #9ca3af !important;
    }
    
    [b-veezgenncr] .document-card.expanded {
        border: 3px solid #10b981 !important;
        border-radius: 0.75rem !important;
    }
    
    [b-veezgenncr] .document-card-header {
        gap: 0.4375rem !important;
        margin-bottom: 0.5rem !important;
    }
    
    [b-veezgenncr] .document-name-pill,
    [b-veezgenncr] .document-name-btn {
        font-size: 0.75rem !important;
        padding: 0.3125rem 0.625rem !important;
        border-radius: 0.4375rem !important;
    }
    
    [b-veezgenncr] .document-type-badge {
        font-size: 0.6875rem !important;
        padding: 0.1875rem 0.375rem !important;
        border: 1px solid #6b7280 !important;
        background-color: transparent !important;
        border-radius: 0.3125rem !important;
    }
    
    [b-veezgenncr] .document-metadata {
        font-size: 0.75rem !important;
        gap: 0.375rem !important;
    }
    
    [b-veezgenncr] .metadata-item {
        font-size: 0.75rem !important;
    }
    
    [b-veezgenncr] .metadata-label {
        min-width: 75px !important;
    }
    
    /* Expanded card adjustments for mobile large */
    [b-veezgenncr] .document-card.expanded {
        padding: 0.8125rem !important;
    }
    
    [b-veezgenncr] .document-card.expanded .document-name-pill,
    [b-veezgenncr] .document-card.expanded .document-name-btn {
        font-size: 0.875rem !important;
        padding: 0.375rem 0.75rem !important;
    }
    
    [b-veezgenncr] .document-card.expanded .document-type-badge {
        font-size: 0.75rem !important;
        padding: 0.25rem 0.5rem !important;
        border: 1px solid #6b7280 !important;
        background-color: transparent !important;
    }
    
    [b-veezgenncr] .document-card.expanded .metadata-item {
        font-size: 0.8125rem !important;
    }
}

/* Mobile Small (≤480px) */
@media (max-width: 480px) {
    [b-veezgenncr] .documents-card-grid {
        gap: 0.75rem !important;
    }
    
    [b-veezgenncr] .document-card {
        min-height: 110px !important;
        padding: 0.625rem !important;
        gap: 0.5rem !important;
        border: 2px solid #6b7280 !important;
        border-radius: 0.5rem !important;
    }
    
    [b-veezgenncr] .document-card:hover {
        border-color: #9ca3af !important;
    }
    
    [b-veezgenncr] .document-card.expanded {
        border: 2px solid #10b981 !important;
        border-radius: 0.625rem !important;
    }
    
    [b-veezgenncr] .document-card-header {
        gap: 0.375rem !important;
        margin-bottom: 0.5rem !important;
    }
    
    [b-veezgenncr] .document-name-pill,
    [b-veezgenncr] .document-name-btn {
        font-size: 0.6875rem !important;
        padding: 0.25rem 0.5rem !important;
        border-radius: 0.375rem !important;
    }
    
    [b-veezgenncr] .document-type-badge {
        font-size: 0.625rem !important;
        padding: 0.1875rem 0.3125rem !important;
        border: 1px solid #6b7280 !important;
        background-color: transparent !important;
        border-radius: 0.25rem !important;
    }
    
    [b-veezgenncr] .document-metadata {
        font-size: 0.6875rem !important;
        gap: 0.3125rem !important;
    }
    
    [b-veezgenncr] .metadata-item {
        font-size: 0.6875rem !important;
    }
    
    [b-veezgenncr] .metadata-label {
        min-width: 70px !important;
    }
    
    /* Expanded card adjustments for small mobile */
    [b-veezgenncr] .document-card.expanded {
        padding: 0.75rem !important;
        transform: scale(1.01) !important;
    }
    
    [b-veezgenncr] .document-card.expanded .document-name-pill,
    [b-veezgenncr] .document-card.expanded .document-name-btn {
        font-size: 0.8125rem !important;
        padding: 0.3125rem 0.625rem !important;
    }
    
    [b-veezgenncr] .document-card.expanded .document-type-badge {
        font-size: 0.6875rem !important;
        padding: 0.1875rem 0.4375rem !important;
        border: 1px solid #6b7280 !important;
        background-color: transparent !important;
    }
    
    [b-veezgenncr] .document-card.expanded .metadata-item {
        font-size: 0.75rem !important;
    }
    
    [b-veezgenncr] .document-card.expanded .metadata-label {
        min-width: 70px !important;
    }
}

/* === ACCESSIBILITY & FOCUS STATES === */

/* Keyboard Navigation Support */
[b-veezgenncr] .document-card:focus-within {
    outline: 2px solid #10b981 !important;
    outline-offset: 2px !important;
}

/* High Contrast Support */
@media (prefers-contrast: high) {
    [b-veezgenncr] .document-card {
        border-width: 3px !important;
    }
    
    [b-veezgenncr] .metadata-label {
        font-weight: 600 !important;
    }
}

/* Motion Reduction Support */
@media (prefers-reduced-motion: reduce) {
    [b-veezgenncr] .document-card,
    [b-veezgenncr] .document-name-pill,
    [b-veezgenncr] .document-name-btn {
        transition: none !important;
    }
    
    [b-veezgenncr] .document-card:hover {
        transform: none !important;
    }
    
    [b-veezgenncr] .document-card.expanded {
        transform: none !important;
    }
}

/* ===== DOCUMENT MODAL STYLING ===== */

/* Document Modal Header */
.document-modal-header-single-row[b-veezgenncr] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1rem 1.25rem;
    border-bottom: 1px solid #374151;
    background-color: transparent;
    min-height: 70px;
}

.document-title-badge[b-veezgenncr] {
    font-size: 1.1rem;
    font-weight: 600;
    margin: 0;
    max-width: calc(100% - 50px);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.delete-icon-btn[b-veezgenncr] {
    background: none;
    border: none;
    color: #ef4444;
    font-size: 1.2rem;
    cursor: pointer;
    padding: 0.5rem;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 0.375rem;
    transition: all 0.2s ease;
    min-width: 40px;
    height: 40px;
}

.delete-icon-btn:hover[b-veezgenncr] {
    border: 1px solid #dc2626;
    color: #dc2626;
}

/* Document Modal Content */
.document-modal-content[b-veezgenncr] {
    background-color: transparent;
    color: #f9fafb;
    display: flex;
    flex-direction: column;
    height: calc(100vh - 140px);
    max-height: 700px;
    overflow: hidden;
}

/* Metadata Section - Modal Only */
.document-modal-metadata[b-veezgenncr] {
    padding: 1rem 1.25rem;
    background-color: transparent;
    flex-shrink: 0;
}

/* Description Row - Modal Only - Horizontal Layout */
.document-modal-metadata .description-row[b-veezgenncr] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 1rem;
}

.document-modal-metadata .description-row .metadata-label[b-veezgenncr] {
    font-size: 0.875rem;
    font-weight: 600;
    color: #9ca3af;
    margin-bottom: 0;
    flex-shrink: 0;
    min-width: 85px;
}

/* Uploaded By/On Row - Modal Only - Horizontal Layout */
.document-modal-metadata .metadata-row-horizontal[b-veezgenncr] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 2rem;
    margin-bottom: 0;
}

.document-modal-metadata .metadata-row-horizontal .metadata-item[b-veezgenncr] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex: 0 0 auto;
}

.document-modal-metadata .metadata-row-horizontal .metadata-label[b-veezgenncr] {
    font-size: 0.875rem;
    font-weight: 600;
    color: #9ca3af;
    margin-bottom: 0;
    flex-shrink: 0;
}

.document-modal-metadata .metadata-row-horizontal .metadata-value[b-veezgenncr] {
    font-size: 0.95rem;
    color: #f3f4f6;
    word-break: break-word;
    margin-bottom: 0;
    font-weight: normal;
}

/* Description Display and Edit - Modal Only */
.document-modal-metadata .description-display-container[b-veezgenncr] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex: 1;
}

.document-modal-metadata .description-display-container .metadata-value[b-veezgenncr] {
    flex: 0 1 auto;
    min-height: 1.5rem;
    font-size: 0.95rem;
    color: #f3f4f6;
    word-break: break-word;
    line-height: 1.4;
    font-weight: normal;
}

/* Description Edit Container - Modal Only */
.document-modal-metadata .description-edit-container-inline[b-veezgenncr] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    flex: 1;
}

.document-modal-metadata .edit-description-btn[b-veezgenncr] {
    padding: 0.375rem 0.5rem;
    font-size: 0.8rem;
    border: 1px solid #6b7280;
    background-color: transparent;
    color: #9ca3af;
    border-radius: 0.375rem;
    transition: all 0.2s ease;
    flex-shrink: 0;
    align-self: flex-start;
    height: auto;
}

.document-modal-metadata .edit-description-btn:hover[b-veezgenncr] {
    opacity: 0.8;
    cursor: pointer;
}

.description-edit-input-single[b-veezgenncr] {
    width: 100%;
    padding: 0.5rem;
    font-size: 0.95rem;
    color: #f3f4f6;
    background-color: transparent;
    border: 1px solid #6b7280;
    border-radius: 0.375rem;
    transition: border-color 0.2s ease;
}

.description-edit-input-single:focus[b-veezgenncr] {
    outline: none;
    box-shadow: 0 0 0 2px rgba(16, 185, 129, 0.1);
}

.description-counter[b-veezgenncr] {
    font-size: 0.75rem;
    color: #9ca3af;
    text-align: right;
}

/* Document Preview Area */
.document-preview-main[b-veezgenncr] {
    flex: 1;
    padding: 1.25rem;
    background-color: transparent;
    overflow: hidden;
    display: flex;
    flex-direction: column;
}

/* CustomerRecordDocumentPreview component container */
.document-preview-main > *[b-veezgenncr] {
    width: 100%;
    height: 100%;
    flex: 1;
    min-height: 400px;
    border-radius: 0.5rem;
    background-color: var(--rival-text-primary);
}

/* Override image preview container width for modal (from CustomerRecordDocumentPreview) */
.document-modal-content .document-preview-main .image-preview-container[b-veezgenncr] {
    width: 100% !important;
    max-width: none !important;
    height: 100% !important;
}

/* Legacy iframe and image styles for fallback */
.document-preview-iframe[b-veezgenncr] {
    width: 100%;
    height: 100%;
    border: 1px solid #374151;
    border-radius: 0.5rem;
    background-color: var(--rival-text-primary);
    flex: 1;
    min-height: 400px;
}

.document-preview-image[b-veezgenncr] {
    width: 100%;
    height: 100%;
    object-fit: contain;
    border: 1px solid #374151;
    border-radius: 0.5rem;
    background-color: var(--rival-text-primary);
    flex: 1;
    min-height: 400px;
}

.preview-placeholder[b-veezgenncr] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    height: 100%;
    min-height: 400px;
    background-color: transparent;
    border: 1px dashed #6b7280;
    border-radius: 0.75rem;
    color: #9ca3af;
    text-align: center;
    padding: 2rem;
}

.preview-icon[b-veezgenncr] {
    font-size: 3rem;
    margin-bottom: 1rem;
    color: #6b7280;
}

.preview-placeholder p[b-veezgenncr] {
    margin: 0.5rem 0;
    font-size: 1rem;
}

.preview-subtitle[b-veezgenncr] {
    font-size: 0.875rem;
    color: #6b7280;
}

/* Mobile Responsiveness for Modal */
@media (max-width: 768px) {
    .document-modal-header-single-row[b-veezgenncr] {
        padding: 0.75rem 1rem;
        min-height: 60px;
    }
    
    .document-title-badge[b-veezgenncr] {
        font-size: 1rem;
        max-width: calc(100% - 45px);
    }
    
    .delete-icon-btn[b-veezgenncr] {
        font-size: 1.1rem;
        min-width: 35px;
        height: 35px;
        padding: 0.375rem;
    }
    
    .document-modal-content[b-veezgenncr] {
        height: calc(100vh - 120px);
    }
    
    .document-modal-metadata[b-veezgenncr] {
        padding: 0.75rem 1rem;
    }
    
    /* Stack metadata on mobile */
    .document-modal-metadata .metadata-row-horizontal[b-veezgenncr] {
        flex-direction: column;
        gap: 1rem;
        align-items: flex-start;
    }
    
    .document-modal-metadata .metadata-row-horizontal .metadata-item[b-veezgenncr] {
        gap: 0.5rem;
    }
    
    .document-preview-main[b-veezgenncr] {
        padding: 1rem;
    }
    
    .document-preview-main > *[b-veezgenncr],
    .document-preview-iframe[b-veezgenncr],
    .document-preview-image[b-veezgenncr],
    .preview-placeholder[b-veezgenncr] {
        min-height: 300px;
    }
    
    .preview-icon[b-veezgenncr] {
        font-size: 2.5rem;
    }
}

@media (max-width: 480px) {
    .document-modal-header-single-row[b-veezgenncr] {
        padding: 0.625rem 0.75rem;
        min-height: 55px;
    }
    
    .document-title-badge[b-veezgenncr] {
        font-size: 0.9rem;
        max-width: calc(100% - 40px);
    }
    
    .delete-icon-btn[b-veezgenncr] {
        font-size: 1rem;
        min-width: 32px;
        height: 32px;
    }
    
    .document-modal-metadata[b-veezgenncr] {
        padding: 0.625rem 0.875rem;
    }
    
    /* Stack metadata on small mobile with smaller gaps */
    .document-modal-metadata .metadata-row-horizontal[b-veezgenncr] {
        gap: 0.75rem;
    }
    
    .document-preview-main[b-veezgenncr] {
        padding: 0.875rem;
    }
    
    .document-preview-main > *[b-veezgenncr],
    .document-preview-iframe[b-veezgenncr],
    .document-preview-image[b-veezgenncr],
    .preview-placeholder[b-veezgenncr] {
        min-height: 250px;
    }
    
    .preview-icon[b-veezgenncr] {
        font-size: 2rem;
    }
    
    .preview-placeholder[b-veezgenncr] {
        padding: 0.75rem;
    }
}

/* Tablet Landscape Optimization */
@media (min-width: 769px) and (max-width: 1024px) and (orientation: landscape) {
    .document-modal-content[b-veezgenncr] {
        height: calc(100vh - 160px);
        max-height: 500px;
    }
    
    .document-preview-main > *[b-veezgenncr],
    .document-preview-iframe[b-veezgenncr],
    .document-preview-image[b-veezgenncr],
    .preview-placeholder[b-veezgenncr] {
        min-height: 300px;
    }
}

/* === GRID VIEW EXTENSIONS - Reusing Existing Styles === */

/* === GRID-SPECIFIC STYLES (Won't Affect Card View) === */

/* Grid Row Height - Only for Syncfusion Grid with datagrid-styling class */
.datagrid-styling .e-grid .e-row[b-veezgenncr] {
    height: 60px !important;
}

.datagrid-styling .e-grid .e-row td[b-veezgenncr] {
    padding: 12px 8px !important;
    vertical-align: middle !important;
}

/* Grid Document Type Cell Layout - Only in Grid Context */
.datagrid-styling .document-type-cell[b-veezgenncr] {
    display: flex !important;
    align-items: center !important;
    gap: 0.75rem !important;
}

/* Grid-Specific Icon Styling - Only in Grid Context, Colors Come from Bootstrap Classes */
.datagrid-styling .document-type-icon-grid[b-veezgenncr] {
    font-size: 1.25rem !important;
    width: 20px !important;
    text-align: center !important;
}

/* === DOCUMENT-SPECIFIC DESCRIPTION EDIT STATUS === */
/* This section is isolated to document tiles only and won't affect contacts or locations */

.description-save-status[b-veezgenncr] {
    font-size: 0.75rem;
    color: #10b981;
    font-weight: 500;
    margin-top: 0.25rem;
    transition: opacity 0.3s ease;
    opacity: 1;
}

.description-save-status.fade-out[b-veezgenncr] {
    animation: fadeOut-b-veezgenncr 2s ease-in-out forwards;
}

.description-save-status.error[b-veezgenncr] {
    color: #ef4444;
}

.description-save-status.saving[b-veezgenncr] {
    color: #f59e0b;
}

@keyframes fadeOut-b-veezgenncr {
    0% {
        opacity: 1;
    }
    80% {
        opacity: 1;
    }
    100% {
        opacity: 0;
    }
}
/* ========================================
   Story 20166: Filter Panel Styles
   ======================================== */

/* Filter Panel Container */
.filters-panel-container[b-veezgenncr] {
    background-color: var(--rival-background-primary);
    border: 1px solid var(--rival-border);
    border-radius: 8px;
    padding: 1rem;
    margin-bottom: 0;
}

.filters-grid[b-veezgenncr] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 1rem;
    align-items: start;
}

/* Ensure filter sections don't overlap */
.filter-section[b-veezgenncr] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    min-width: 0; /* Prevent overflow */
    position: relative; /* Ensure proper stacking context */
}

.filter-label[b-veezgenncr] {
    font-size: 0.875rem;
    font-weight: 500;
    color: #999;
}

/* Dropdown Button */
.filter-dropdown[b-veezgenncr] {
    position: relative;
}

.filter-dropdown-button[b-veezgenncr] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    padding: 0.5rem 0.75rem;
    background-color: var(--rival-background-secondary);
    border: 1px solid #444;
    border-radius: 4px;
    color: #fff;
    cursor: pointer;
    transition: background-color 0.2s;
}

.filter-dropdown-button:hover[b-veezgenncr] {
    background-color: var(--rival-border);
}

.dropdown-arrow[b-veezgenncr] {
    font-size: 0.75rem;
    margin-left: 0.5rem;
}

/* Dropdown Menu */
.filter-dropdown-menu[b-veezgenncr] {
    position: absolute;
    z-index: 1000;
    width: 100%;
    max-height: 300px;
    overflow-y: auto;
    background-color: var(--rival-background-secondary);
    border: 1px solid #444;
    border-radius: 4px;
    margin-top: 0.25rem;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.3);
}

.filter-dropdown-menu.scrollable[b-veezgenncr] {
    max-height: 200px;
}

.filter-checkbox-item[b-veezgenncr] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.5rem 0.75rem;
    cursor: pointer;
    transition: background-color 0.2s;
}

.filter-checkbox-item:hover[b-veezgenncr] {
    background-color: var(--rival-border);
}

.filter-checkbox-item input[type='checkbox'][b-veezgenncr] {
    cursor: pointer;
    accent-color: #6288C5; /* Rival light blue */
}

.filter-no-results[b-veezgenncr] {
    padding: 0.5rem 0.75rem;
    color: #999;
    font-size: 0.875rem;
    text-align: center;
}

/* Date Range Inputs */
.date-range-inputs[b-veezgenncr] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    width: 100%;
}

.filter-date-input[b-veezgenncr] {
    flex: 1;
    min-width: 0; /* Allow input to shrink below content size */
    padding: 0.5rem 0.75rem;
    background-color: var(--rival-background-secondary);
    border: 1px solid #444;
    border-radius: 4px;
    color: #fff;
    font-size: 0.875rem;
    max-width: 100%;
}

.date-separator[b-veezgenncr] {
    color: #999;
    font-size: 0.875rem;
    flex-shrink: 0; /* Prevent separator from shrinking */
}

/* Radio Group */
.filter-radio-group[b-veezgenncr] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.filter-radio-item[b-veezgenncr] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    cursor: pointer;
    color: #fff;
    font-size: 0.875rem;
}

.filter-radio-item input[type='radio'][b-veezgenncr] {
    cursor: pointer;
    accent-color: #6288C5; /* Rival light blue */
}

/* ========================================
   Filter Chips Styles
   ======================================== */

.filter-chips-container[b-veezgenncr] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.75rem;
    padding: 1rem;
    background-color: var(--rival-background-primary);
    border: 1px solid var(--rival-border);
    border-radius: 8px;
    margin-top: 1rem;
}

.filter-chips-list[b-veezgenncr] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    flex: 1;
}

.filter-chip[b-veezgenncr] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.375rem 0.75rem;
    /* Background color set via bg-rival-light-blue class (#6288C5) */
    color: #fff;
    border-radius: 9999px;
    font-size: 0.875rem;
    animation: fadeIn 0.2s ease-in;
}

.chip-label[b-veezgenncr] {
    font-weight: 500;
}

.chip-remove-btn[b-veezgenncr] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 1.25rem;
    height: 1.25rem;
    padding: 0;
    background-color: transparent;
    border: none;
    border-radius: 50%;
    color: #fff;
    font-size: 1.25rem;
    line-height: 1;
    cursor: pointer;
    transition: background-color 0.2s;
}

.chip-remove-btn:hover[b-veezgenncr] {
    background-color: rgba(255, 255, 255, 0.2);
}

/* Responsive Design */
@media (max-width: 1200px) {
    /* Smaller desktop - prevent description text wrap issues */
    .filter-radio-item[b-veezgenncr] {
        font-size: 0.8125rem;
        white-space: nowrap;
    }
    
    .filter-radio-group[b-veezgenncr] {
        gap: 0.375rem;
    }
}

@media (max-width: 1024px) {
    /* Tablet and smaller - 2 columns */
    .filters-grid[b-veezgenncr] {
        grid-template-columns: repeat(2, 1fr);
    }
    
    /* Prevent description radio group overlap on tablet */
    .filter-radio-group[b-veezgenncr] {
        gap: 0.375rem;
    }
    
    .filter-radio-item[b-veezgenncr] {
        font-size: 0.8125rem;
    }
}

@media (max-width: 768px) {
    /* Mobile - single column, prevent overflow */
    .filters-grid[b-veezgenncr] {
        grid-template-columns: 1fr;
        gap: 1.5rem; /* Increased gap to prevent overlap when dropdown is open */
    }
    
    /* Fix dropdown positioning on mobile */
    .filter-section[b-veezgenncr] {
        overflow: visible;
        position: relative;
        z-index: 1;
    }
    
    /* Open dropdown should have higher z-index */
    .filter-section:has(.filter-dropdown-menu)[b-veezgenncr] {
        z-index: 10;
    }
    
    .filter-dropdown[b-veezgenncr] {
        position: relative;
        overflow: visible;
    }
    
    /* Dropdown menu should be full width and positioned correctly */
    .filter-dropdown-menu[b-veezgenncr] {
        position: relative;
        left: 0;
        right: 0;
        width: 100%;
        max-height: 200px;
        margin-top: 0.25rem;
        z-index: 100;
    }
    
    /* Ensure date inputs don't overflow */
    .date-range-inputs[b-veezgenncr] {
        gap: 0.25rem;
    }
    
    .filter-date-input[b-veezgenncr] {
        padding: 0.5rem;
        font-size: 0.8125rem;
        min-width: 90px;
    }
    
    .date-separator[b-veezgenncr] {
        font-size: 0.75rem;
    }
    
    .filter-chips-container[b-veezgenncr] {
        flex-direction: column;
        align-items: flex-start;
    }
    
    .filter-chips-list[b-veezgenncr] {
        width: 100%;
    }
    
    /* Reduce padding on mobile */
    .filters-panel-container[b-veezgenncr] {
        padding: 0.75rem;
    }
}

@media (max-width: 480px) {
    /* Extra small mobile */
    .filters-grid[b-veezgenncr] {
        gap: 0.75rem;
    }
    
    .filter-section[b-veezgenncr] {
        gap: 0.375rem;
    }
    
    .filter-label[b-veezgenncr] {
        font-size: 0.8125rem;
    }
    
    .filter-dropdown-button[b-veezgenncr] {
        padding: 0.375rem 0.625rem;
        font-size: 0.875rem;
    }
}
/* _content/RPMClient/Shared/MainLayout.razor.rz.scp.css */
.page[b-2esjo6q2ax] {
    position: relative;
    display: flex;
    flex-direction: column;
}

main[b-2esjo6q2ax] {
    flex: 1;
}

.navbar-brand[b-2esjo6q2ax] {
    font-size: 1.1rem;
    color: white;
}

.top-row[b-2esjo6q2ax] {
    border-bottom: 1px solid #d6d5d5;
    justify-content: flex-end;
    height: 3.5rem;
    display: flex;
    align-items: center;
    background: var(--mud-palette-appbar-background);
}

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

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

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

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

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

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

    .sidebar[b-2esjo6q2ax] {
        width: 250px;
        height: 100vh;
        position: sticky;
        top: 0;
    }

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

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

.navbar-toggler[b-2esjo6q2ax] {
    appearance: none;
    cursor: pointer;
    width: 3.5rem;
    height: 2.5rem;
    color: white;
    position: absolute;
    top: 0.5rem;
    right: 1rem;
    border: 1px solid rgba(255, 255, 255, 0.1);
    background: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%28255, 255, 255, 0.55%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e") no-repeat center/1.75rem rgba(255, 255, 255, 0.1);
}

    .navbar-toggler:checked[b-2esjo6q2ax] {
        background-color: rgba(255, 255, 255, 0.5);
    }

.nav-scrollable[b-2esjo6q2ax] {
    display: none;
}

.navbar-toggler:checked ~ .nav-scrollable[b-2esjo6q2ax] {
    display: block;
}

@media (min-width: 641px) {
    .navbar-toggler[b-2esjo6q2ax] {
        display: none;
    }

    .nav-scrollable[b-2esjo6q2ax] {
        /* Never collapse the sidebar for wide screens */
        display: block;
        /* Allow sidebar to scroll for tall menus */
        height: calc(100vh - 3.5rem);
        overflow-y: auto;
    }
}