/* /Features/Admin/ActionTriggers/ActionTriggersPage.razor.rz.scp.css */
.action-trigger-rules-page[b-0lansznf82] {
    padding: 1.5rem;
    background: linear-gradient(135deg, #BFD8B8 0%, #FFFFFF 100%);
    min-height: 100vh;
}

.page-header[b-0lansznf82] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 2rem;
    padding: 1.5rem;
    background: #FFFFFF;
    border-radius: 12px;
    box-shadow: 0 2px 8px rgba(20, 33, 61, 0.1);
}

.header-content h1[b-0lansznf82] {
    color: #14213D;
    font-size: 2rem;
    font-weight: 600;
    margin-bottom: 0.5rem;
}

.page-description[b-0lansznf82] {
    color: #2E2E2E;
    font-size: 1.1rem;
    margin: 0;
}

.header-actions[b-0lansznf82] {
    display: flex;
    gap: 1rem;
}

.rule-filters[b-0lansznf82] {
    padding: 1rem 0;
}

.stats-summary[b-0lansznf82] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.stat-item[b-0lansznf82] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.75rem;
    background: rgba(191, 216, 184, 0.1);
    border-radius: 8px;
}

.stat-value[b-0lansznf82] {
    font-size: 1.5rem;
    font-weight: 700;
    color: #14213D;
}

.stat-label[b-0lansznf82] {
    color: #2E2E2E;
    font-size: 0.9rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.rules-grid[b-0lansznf82] {
    background: #FFFFFF;
    border-radius: 8px;
}

.subdomain-info strong[b-0lansznf82] {
    color: #14213D;
    font-weight: 600;
}

.condition-display[b-0lansznf82] {
    font-family: 'Courier New', monospace;
    font-size: 0.85rem;
    background: rgba(46, 46, 46, 0.05);
    padding: 0.25rem 0.5rem;
    border-radius: 4px;
    border-left: 3px solid #C8A951;
}

.action-indicators[b-0lansznf82] {
    display: flex;
    gap: 0.5rem;
    justify-content: center;
}

.action-indicators i[b-0lansznf82] {
    font-size: 1.1rem;
}

.action-buttons[b-0lansznf82] {
    display: flex;
    gap: 0.5rem;
    justify-content: center;
}

.badge[b-0lansznf82] {
    font-size: 0.8rem;
    padding: 0.4rem 0.8rem;
    border-radius: 6px;
    font-weight: 500;
}

.bg-danger[b-0lansznf82] {
    background-color: #dc3545 !important;
    color: white;
}

.bg-warning[b-0lansznf82] {
    background-color: #C8A951 !important;
    color: white;
}

.bg-info[b-0lansznf82] {
    background-color: #17a2b8 !important;
    color: white;
}

.bg-success[b-0lansznf82] {
    background-color: #BFD8B8 !important;
    color: #14213D;
}

.bg-secondary[b-0lansznf82] {
    background-color: #E2E6EA !important;
    color: #14213D;
}

.loading-overlay[b-0lansznf82] {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(255, 255, 255, 0.8);
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 1000;
}

.spinner-border[b-0lansznf82] {
    color: #C8A951;
    width: 3rem;
    height: 3rem;
}

.upgrade-prompt[b-0lansznf82] {
    padding: 2rem;
    text-align: center;
}

.upgrade-prompt h2[b-0lansznf82] {
    color: #14213D;
    margin-bottom: 1rem;
}

.upgrade-prompt .lead[b-0lansznf82] {
    color: #2E2E2E;
    font-size: 1.2rem;
}

.upgrade-prompt .text-muted[b-0lansznf82] {
    color: #6c757d !important;
    line-height: 1.6;
}

/* Responsive Design */
@media (max-width: 768px) {
    .page-header[b-0lansznf82] {
        flex-direction: column;
        gap: 1rem;
    }
    
    .header-actions[b-0lansznf82] {
        width: 100%;
        justify-content: center;
    }
    
    .stats-summary[b-0lansznf82] {
        flex-direction: row;
        justify-content: space-around;
    }
    
    .stat-item[b-0lansznf82] {
        flex-direction: column;
        text-align: center;
        min-width: 80px;
    }
    
    .action-buttons[b-0lansznf82] {
        flex-direction: column;
    }
}
/* /Features/Admin/ActionTriggers/AutomationPage.razor.rz.scp.css */
.automation-page[b-yqpqdydffh] {
    padding: 2rem;
    background-color: #f8f9fa;
}

.page-header[b-yqpqdydffh] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 2rem;
    padding: 1.5rem;
    background: linear-gradient(135deg, #14213D 0%, #2E2E2E 100%);
    border-radius: 12px;
    color: white;
}

.header-content h1[b-yqpqdydffh] {
    color: white;
    margin-bottom: 0.5rem;
    font-weight: 600;
}

.header-content p[b-yqpqdydffh] {
    color: #BFD8B8;
    margin: 0;
}

.header-actions[b-yqpqdydffh] {
    display: flex;
    gap: 1rem;
}

.content-container[b-yqpqdydffh] {
    max-width: 1400px;
    margin: 0 auto;
}

.metric-card[b-yqpqdydffh] {
    text-align: center;
    border: none;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
    transition: transform 0.2s ease;
}

.metric-card:hover[b-yqpqdydffh] {
    transform: translateY(-2px);
}

.metric-card.success[b-yqpqdydffh] {
    border-left: 4px solid #28a745;
}

.metric-card.warning[b-yqpqdydffh] {
    border-left: 4px solid #C8A951;
}

.metric-value[b-yqpqdydffh] {
    font-size: 2.5rem;
    font-weight: bold;
    color: #14213D;
    margin-bottom: 0.5rem;
}

.metric-label[b-yqpqdydffh] {
    color: #6c757d;
    font-size: 0.9rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.nav-tabs[b-yqpqdydffh] {
    border-bottom: 2px solid #14213D;
}

.nav-tabs .nav-link[b-yqpqdydffh] {
    color: #6c757d;
    border: none;
    border-bottom: 3px solid transparent;
    background: none;
    padding: 1rem 1.5rem;
    font-weight: 500;
    transition: all 0.3s ease;
}

.nav-tabs .nav-link:hover[b-yqpqdydffh] {
    color: #14213D;
    border-bottom-color: #BFD8B8;
}

.nav-tabs .nav-link.active[b-yqpqdydffh] {
    color: #14213D;
    border-bottom-color: #C8A951;
    background: none;
}

.nav-tabs .nav-link i[b-yqpqdydffh] {
    margin-right: 0.5rem;
}

.tab-content[b-yqpqdydffh] {
    min-height: 400px;
}

.health-card[b-yqpqdydffh] {
    border-left: 4px solid #28a745;
}

.unauthorized-prompt[b-yqpqdydffh] {
    padding: 2rem;
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 60vh;
}

.loading-overlay[b-yqpqdydffh] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.5);
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 9999;
}

.loading-overlay .spinner-border[b-yqpqdydffh] {
    color: #C8A951;
    width: 3rem;
    height: 3rem;
}

@media (max-width: 768px) {
    .automation-page[b-yqpqdydffh] {
        padding: 1rem;
    }

    .page-header[b-yqpqdydffh] {
        flex-direction: column;
        gap: 1rem;
    }

    .header-actions[b-yqpqdydffh] {
        width: 100%;
        justify-content: center;
    }

    .metric-value[b-yqpqdydffh] {
        font-size: 2rem;
    }

    .nav-tabs .nav-link[b-yqpqdydffh] {
        padding: 0.75rem 1rem;
        font-size: 0.9rem;
    }
}
/* /Features/Admin/ActionTriggers/TriggerDashboardPage.razor.rz.scp.css */
.action-trigger-dashboard-page[b-ygev05vmg8] {
    padding: 1.5rem;
    background: linear-gradient(135deg, #BFD8B8 0%, #FFFFFF 100%);
    min-height: 100vh;
}

.page-header[b-ygev05vmg8] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 2rem;
    padding: 1.5rem;
    background: #FFFFFF;
    border-radius: 12px;
    box-shadow: 0 2px 8px rgba(20, 33, 61, 0.1);
}

.header-content h1[b-ygev05vmg8] {
    color: #14213D;
    font-size: 2rem;
    font-weight: 600;
    margin-bottom: 0.5rem;
}

.page-description[b-ygev05vmg8] {
    color: #2E2E2E;
    font-size: 1.1rem;
    margin: 0;
}

.header-actions[b-ygev05vmg8] {
    display: flex;
    gap: 1rem;
}

.metric-card[b-ygev05vmg8] {
    text-align: center;
    border: none;
    background: #FFFFFF;
    transition: all 0.3s ease;
}

.metric-card:hover[b-ygev05vmg8] {
    transform: translateY(-2px);
    box-shadow: 0 4px 16px rgba(20, 33, 61, 0.15);
}

.metric-card.warning[b-ygev05vmg8] {
    border-left: 4px solid #C8A951;
}

.metric-card.success[b-ygev05vmg8] {
    border-left: 4px solid #BFD8B8;
}

.metric-value[b-ygev05vmg8] {
    font-size: 2.5rem;
    font-weight: 700;
    color: #14213D;
    margin-bottom: 0.5rem;
}

.metric-label[b-ygev05vmg8] {
    color: #2E2E2E;
    font-size: 0.95rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.alert-card[b-ygev05vmg8] {
    border-left: 4px solid #dc3545;
}

.alert-summary[b-ygev05vmg8] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.alert-item[b-ygev05vmg8] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1rem;
    border-radius: 8px;
    background: rgba(220, 53, 69, 0.1);
}

.alert-item.critical[b-ygev05vmg8] {
    background: rgba(220, 53, 69, 0.15);
    border: 1px solid rgba(220, 53, 69, 0.3);
}

.alert-item.high[b-ygev05vmg8] {
    background: rgba(200, 169, 81, 0.15);
    border: 1px solid rgba(200, 169, 81, 0.3);
}

.alert-item i[b-ygev05vmg8] {
    margin-right: 0.75rem;
    font-size: 1.2rem;
}

.alert-item.critical i[b-ygev05vmg8] {
    color: #dc3545;
}

.alert-item.high i[b-ygev05vmg8] {
    color: #C8A951;
}

.alert-item span[b-ygev05vmg8] {
    flex: 1;
    font-weight: 500;
    color: #14213D;
}

.loading-overlay[b-ygev05vmg8] {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(255, 255, 255, 0.8);
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 1000;
}

.spinner-border[b-ygev05vmg8] {
    color: #C8A951;
    width: 3rem;
    height: 3rem;
}

.upgrade-prompt[b-ygev05vmg8] {
    padding: 2rem;
    text-align: center;
}

.upgrade-prompt h2[b-ygev05vmg8] {
    color: #14213D;
    margin-bottom: 1rem;
}

.upgrade-prompt .lead[b-ygev05vmg8] {
    color: #2E2E2E;
    font-size: 1.2rem;
}

.upgrade-prompt .text-muted[b-ygev05vmg8] {
    color: #6c757d !important;
    line-height: 1.6;
}

/* Responsive Design */
@media (max-width: 768px) {
    .page-header[b-ygev05vmg8] {
        flex-direction: column;
        gap: 1rem;
    }
    
    .header-actions[b-ygev05vmg8] {
        width: 100%;
        justify-content: center;
    }
    
    .metric-value[b-ygev05vmg8] {
        font-size: 2rem;
    }
    
    .alert-item[b-ygev05vmg8] {
        flex-direction: column;
        gap: 0.75rem;
        text-align: center;
    }
}
/* /Features/Admin/ActionTriggers/TriggerEventsPage.razor.rz.scp.css */
.trigger-events-page[b-45tv4jkgsx] {
    padding: 2rem;
    background-color: #f8f9fa;
}

.page-header[b-45tv4jkgsx] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 2rem;
    padding: 1.5rem;
    background: linear-gradient(135deg, #14213D 0%, #2E2E2E 100%);
    border-radius: 12px;
    color: white;
}

.header-content h1[b-45tv4jkgsx] {
    color: white;
    margin-bottom: 0.5rem;
    font-weight: 600;
}

.header-content p[b-45tv4jkgsx] {
    color: #BFD8B8;
    margin: 0;
}

.header-actions[b-45tv4jkgsx] {
    display: flex;
    gap: 1rem;
}

.content-container[b-45tv4jkgsx] {
    max-width: 1400px;
    margin: 0 auto;
}

.metric-card[b-45tv4jkgsx] {
    text-align: center;
    border: none;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
    transition: transform 0.2s ease;
}

.metric-card:hover[b-45tv4jkgsx] {
    transform: translateY(-2px);
}

.metric-card.warning[b-45tv4jkgsx] {
    border-left: 4px solid #C8A951;
}

.metric-card.danger[b-45tv4jkgsx] {
    border-left: 4px solid #dc3545;
}

.metric-value[b-45tv4jkgsx] {
    font-size: 2.5rem;
    font-weight: bold;
    color: #14213D;
    margin-bottom: 0.5rem;
}

.metric-label[b-45tv4jkgsx] {
    color: #6c757d;
    font-size: 0.9rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.event-filters[b-45tv4jkgsx] {
    padding: 1rem;
}

.loading-overlay[b-45tv4jkgsx] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.5);
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 9999;
}

.loading-overlay .spinner-border[b-45tv4jkgsx] {
    color: #C8A951;
    width: 3rem;
    height: 3rem;
}

@media (max-width: 768px) {
    .trigger-events-page[b-45tv4jkgsx] {
        padding: 1rem;
    }

    .page-header[b-45tv4jkgsx] {
        flex-direction: column;
        gap: 1rem;
    }

    .header-actions[b-45tv4jkgsx] {
        width: 100%;
        justify-content: center;
    }

    .metric-value[b-45tv4jkgsx] {
        font-size: 2rem;
    }
}
/* /Features/Admin/Onboarding/ActionLogsPage.razor.rz.scp.css */
.action-logs-page[b-f2hl8ggf61] {
    padding: 2rem;
    max-width: 1600px;
    margin: 0 auto;
}

.page-header[b-f2hl8ggf61] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 2.5rem;
    flex-wrap: wrap;
    gap: 1rem;
}

.header-content[b-f2hl8ggf61] {
    flex: 1;
}

.page-title[b-f2hl8ggf61] {
    color: #14213D;
    font-size: 2.5rem;
    font-weight: 600;
    margin-bottom: 0.5rem;
    display: flex;
    align-items: center;
    gap: 1rem;
}

.page-title i[b-f2hl8ggf61] {
    color: #C8A951;
    font-size: 2rem;
}

.page-description[b-f2hl8ggf61] {
    color: #2E2E2E;
    font-size: 1.1rem;
    margin: 0;
    max-width: 600px;
}

.header-actions[b-f2hl8ggf61] {
    display: flex;
    gap: 0.75rem;
    align-items: center;
}

.action-logs-content[b-f2hl8ggf61] {
    display: flex;
    flex-direction: column;
    gap: 2.5rem;
}

.loading-state[b-f2hl8ggf61] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 4rem 2rem;
    text-align: center;
}

.spinner[b-f2hl8ggf61] {
    width: 40px;
    height: 40px;
    border: 4px solid #E2E6EA;
    border-top: 4px solid #C8A951;
    border-radius: 50%;
    animation: spin-b-f2hl8ggf61 1s linear infinite;
    margin-bottom: 1rem;
}

@keyframes spin-b-f2hl8ggf61 {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

/* Filters Section */
.filters-section[b-f2hl8ggf61] {
    margin-bottom: 2rem;
}

[b-f2hl8ggf61] .filters-card {
    border: 2px solid #E2E6EA;
    background: white;
}

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

.filter-group[b-f2hl8ggf61] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.filter-group label[b-f2hl8ggf61] {
    color: #14213D;
    font-weight: 600;
    font-size: 0.9rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.filter-group input[b-f2hl8ggf61],
.filter-group select[b-f2hl8ggf61] {
    padding: 0.75rem;
    border: 2px solid #E2E6EA;
    border-radius: 8px;
    font-family: inherit;
    font-size: 0.95rem;
    transition: border-color 0.3s ease;
    background: white;
}

.filter-group input:focus[b-f2hl8ggf61],
.filter-group select:focus[b-f2hl8ggf61] {
    outline: none;
    border-color: #C8A951;
    box-shadow: 0 0 0 3px rgba(200, 169, 81, 0.1);
}

.date-range[b-f2hl8ggf61] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.date-separator[b-f2hl8ggf61] {
    color: #6c757d;
    font-size: 0.9rem;
    font-weight: 500;
}

.filter-actions[b-f2hl8ggf61] {
    display: flex;
    align-items: flex-end;
}

/* Summary Section */
.summary-section[b-f2hl8ggf61] {
    margin-bottom: 2rem;
}

.summary-cards[b-f2hl8ggf61] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 1.5rem;
}

.summary-card[b-f2hl8ggf61] {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 1.5rem;
    background: white;
    border: 2px solid #E2E6EA;
    border-radius: 12px;
    transition: all 0.3s ease;
}

.summary-card:hover[b-f2hl8ggf61] {
    transform: translateY(-2px);
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.1);
    border-color: #C8A951;
}

.summary-icon[b-f2hl8ggf61] {
    flex-shrink: 0;
    width: 50px;
    height: 50px;
    border-radius: 12px;
    background: rgba(200, 169, 81, 0.1);
    display: flex;
    align-items: center;
    justify-content: center;
    color: #C8A951;
    font-size: 1.5rem;
}

.summary-content[b-f2hl8ggf61] {
    flex: 1;
}

.summary-number[b-f2hl8ggf61] {
    color: #14213D;
    font-size: 2rem;
    font-weight: 700;
    line-height: 1;
    margin-bottom: 0.25rem;
}

.summary-label[b-f2hl8ggf61] {
    color: #6c757d;
    font-size: 0.9rem;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

/* Logs Table Section */
.logs-table-section[b-f2hl8ggf61] {
    margin-bottom: 2rem;
}

.logs-table-container[b-f2hl8ggf61] {
    min-height: 400px;
}

/* Table Cell Styling */
.timestamp-cell[b-f2hl8ggf61] {
    display: flex;
    flex-direction: column;
    gap: 0.125rem;
}

.timestamp-cell .date[b-f2hl8ggf61] {
    color: #14213D;
    font-weight: 600;
    font-size: 0.9rem;
}

.timestamp-cell .time[b-f2hl8ggf61] {
    color: #6c757d;
    font-size: 0.8rem;
    font-family: 'Courier New', monospace;
}

.action-cell[b-f2hl8ggf61] {
    display: flex;
    align-items: center;
}

.action-badge[b-f2hl8ggf61] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.4rem 0.8rem;
    border-radius: 16px;
    font-size: 0.8rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.action-badge.create[b-f2hl8ggf61] {
    background: rgba(25, 135, 84, 0.1);
    color: #198754;
    border: 1px solid rgba(25, 135, 84, 0.3);
}

.action-badge.add[b-f2hl8ggf61] {
    background: rgba(13, 110, 253, 0.1);
    color: #0d6efd;
    border: 1px solid rgba(13, 110, 253, 0.3);
}

.action-badge.assign[b-f2hl8ggf61] {
    background: rgba(200, 169, 81, 0.1);
    color: #C8A951;
    border: 1px solid rgba(200, 169, 81, 0.3);
}

.action-badge.activate[b-f2hl8ggf61] {
    background: rgba(25, 135, 84, 0.1);
    color: #198754;
    border: 1px solid rgba(25, 135, 84, 0.3);
}

.action-badge.deactivate[b-f2hl8ggf61] {
    background: rgba(255, 193, 7, 0.1);
    color: #ffc107;
    border: 1px solid rgba(255, 193, 7, 0.3);
}

.action-badge.update[b-f2hl8ggf61] {
    background: rgba(111, 66, 193, 0.1);
    color: #6f42c1;
    border: 1px solid rgba(111, 66, 193, 0.3);
}

.action-badge.delete[b-f2hl8ggf61] {
    background: rgba(220, 53, 69, 0.1);
    color: #dc3545;
    border: 1px solid rgba(220, 53, 69, 0.3);
}

.action-badge.default[b-f2hl8ggf61] {
    background: rgba(108, 117, 125, 0.1);
    color: #6c757d;
    border: 1px solid rgba(108, 117, 125, 0.3);
}

.employer-cell[b-f2hl8ggf61] {
    display: flex;
    align-items: center;
}

.employer-name[b-f2hl8ggf61] {
    color: #14213D;
    font-weight: 600;
    font-size: 0.9rem;
}

.no-employer[b-f2hl8ggf61] {
    color: #6c757d;
    font-style: italic;
}

.details-cell[b-f2hl8ggf61] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}

.details-text[b-f2hl8ggf61] {
    color: #2E2E2E;
    font-size: 0.9rem;
    line-height: 1.4;
    flex: 1;
}

.user-cell[b-f2hl8ggf61] {
    display: flex;
    align-items: center;
}

.user-name[b-f2hl8ggf61] {
    color: #14213D;
    font-weight: 500;
    font-size: 0.85rem;
}

/* No Logs State */
.no-logs[b-f2hl8ggf61] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 4rem 2rem;
    text-align: center;
}

.no-logs-icon[b-f2hl8ggf61] {
    font-size: 4rem;
    color: #BFD8B8;
    margin-bottom: 1.5rem;
}

.no-logs h4[b-f2hl8ggf61] {
    color: #14213D;
    font-size: 1.5rem;
    font-weight: 600;
    margin-bottom: 0.75rem;
}

.no-logs p[b-f2hl8ggf61] {
    color: #2E2E2E;
    font-size: 1rem;
    margin-bottom: 2rem;
    max-width: 400px;
}

/* Error Section */
.error-section[b-f2hl8ggf61] {
    margin-top: 2rem;
}

[b-f2hl8ggf61] .error-card {
    border: 2px solid #dc3545;
    background: linear-gradient(135deg, rgba(220, 53, 69, 0.05) 0%, rgba(255, 193, 7, 0.05) 100%);
}

.error-content[b-f2hl8ggf61] {
    text-align: center;
    padding: 2rem;
}

.error-icon[b-f2hl8ggf61] {
    font-size: 3rem;
    color: #dc3545;
    margin-bottom: 1rem;
}

.error-content h4[b-f2hl8ggf61] {
    color: #14213D;
    font-size: 1.3rem;
    font-weight: 600;
    margin-bottom: 0.75rem;
}

.error-content p[b-f2hl8ggf61] {
    color: #2E2E2E;
    font-size: 1rem;
    margin-bottom: 1.5rem;
    line-height: 1.5;
}

.error-actions[b-f2hl8ggf61] {
    display: flex;
    gap: 1rem;
    justify-content: center;
    flex-wrap: wrap;
}

/* Responsive Design */
@media (max-width: 768px) {
    .action-logs-page[b-f2hl8ggf61] {
        padding: 1rem;
    }
    
    .page-header[b-f2hl8ggf61] {
        flex-direction: column;
        align-items: flex-start;
    }
    
    .page-title[b-f2hl8ggf61] {
        font-size: 2rem;
    }
    
    .filters-grid[b-f2hl8ggf61] {
        grid-template-columns: 1fr;
        gap: 1rem;
    }
    
    .date-range[b-f2hl8ggf61] {
        flex-direction: column;
        align-items: stretch;
    }
    
    .date-separator[b-f2hl8ggf61] {
        text-align: center;
        margin: 0.25rem 0;
    }
    
    .summary-cards[b-f2hl8ggf61] {
        grid-template-columns: repeat(2, 1fr);
        gap: 1rem;
    }
    
    .summary-card[b-f2hl8ggf61] {
        flex-direction: column;
        text-align: center;
        padding: 1.25rem;
    }
    
    .summary-icon[b-f2hl8ggf61] {
        margin-bottom: 0.5rem;
    }
    
    .details-cell[b-f2hl8ggf61] {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.5rem;
    }
    
    /* Make table responsive */
    [b-f2hl8ggf61] .iswara-data-grid {
        font-size: 0.85rem;
    }
    
    .timestamp-cell[b-f2hl8ggf61],
    .action-cell[b-f2hl8ggf61],
    .employer-cell[b-f2hl8ggf61],
    .user-cell[b-f2hl8ggf61] {
        font-size: 0.8rem;
    }
}

@media (max-width: 480px) {
    .action-logs-page[b-f2hl8ggf61] {
        padding: 0.5rem;
    }
    
    .page-title[b-f2hl8ggf61] {
        font-size: 1.75rem;
        flex-direction: column;
        align-items: flex-start;
        gap: 0.5rem;
    }
    
    .header-actions[b-f2hl8ggf61] {
        flex-direction: column;
        align-items: stretch;
        width: 100%;
    }
    
    .summary-cards[b-f2hl8ggf61] {
        grid-template-columns: 1fr;
    }
    
    .summary-number[b-f2hl8ggf61] {
        font-size: 1.75rem;
    }
    
    .filter-group input[b-f2hl8ggf61],
    .filter-group select[b-f2hl8ggf61] {
        padding: 0.625rem;
        font-size: 0.9rem;
    }
    
    .action-badge[b-f2hl8ggf61] {
        padding: 0.3rem 0.6rem;
        font-size: 0.75rem;
    }
    
    .no-logs[b-f2hl8ggf61] {
        padding: 2rem 1rem;
    }
    
    .no-logs-icon[b-f2hl8ggf61] {
        font-size: 3rem;
    }
    
    .error-content[b-f2hl8ggf61] {
        padding: 1.5rem;
    }
    
    .error-icon[b-f2hl8ggf61] {
        font-size: 2.5rem;
    }
}

/* Dark mode considerations */
@media (prefers-color-scheme: dark) {
    .filter-group input[b-f2hl8ggf61],
    .filter-group select[b-f2hl8ggf61] {
        background: #2E2E2E;
        color: white;
        border-color: #444;
    }
    
    .summary-card[b-f2hl8ggf61] {
        background: #2E2E2E;
        border-color: #444;
    }
}

/* Print styles */
@media print {
    .page-header[b-f2hl8ggf61],
    .filters-section[b-f2hl8ggf61],
    .header-actions[b-f2hl8ggf61],
    .error-actions[b-f2hl8ggf61] {
        display: none;
    }
    
    .action-logs-page[b-f2hl8ggf61] {
        padding: 1rem;
    }
    
    .summary-cards[b-f2hl8ggf61] {
        grid-template-columns: repeat(4, 1fr);
        margin-bottom: 2rem;
    }
    
    .logs-table-container[b-f2hl8ggf61] {
        font-size: 0.8rem;
    }
}
/* /Features/Admin/Onboarding/AddUserPage.razor.rz.scp.css */
.add-user-page[b-5wm8v2r4vj] {
    padding: 2rem;
    max-width: 1200px;
    margin: 0 auto;
}

.page-header[b-5wm8v2r4vj] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 2.5rem;
    flex-wrap: wrap;
    gap: 1rem;
}

.header-content[b-5wm8v2r4vj] {
    flex: 1;
}

.page-title[b-5wm8v2r4vj] {
    color: #14213D;
    font-size: 2.5rem;
    font-weight: 600;
    margin-bottom: 0.5rem;
    display: flex;
    align-items: center;
    gap: 1rem;
}

.page-title i[b-5wm8v2r4vj] {
    color: #C8A951;
    font-size: 2rem;
}

.page-description[b-5wm8v2r4vj] {
    color: #2E2E2E;
    font-size: 1.1rem;
    margin: 0;
    max-width: 600px;
}

.header-actions[b-5wm8v2r4vj] {
    display: flex;
    gap: 0.75rem;
    align-items: center;
}

.add-user-content[b-5wm8v2r4vj] {
    display: flex;
    flex-direction: column;
    gap: 2.5rem;
}

.loading-state[b-5wm8v2r4vj] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 4rem 2rem;
    text-align: center;
}

.spinner[b-5wm8v2r4vj] {
    width: 40px;
    height: 40px;
    border: 4px solid #E2E6EA;
    border-top: 4px solid #C8A951;
    border-radius: 50%;
    animation: spin-b-5wm8v2r4vj 1s linear infinite;
    margin-bottom: 1rem;
}

@keyframes spin-b-5wm8v2r4vj {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

/* Employer Selection Section */
.employer-selection-section[b-5wm8v2r4vj] {
    margin-bottom: 2rem;
}

/* Employer Info Section */
.employer-info-section[b-5wm8v2r4vj] {
    margin-bottom: 2rem;
}

[b-5wm8v2r4vj] .employer-info-card {
    border: 2px solid #C8A951;
    background: linear-gradient(135deg, rgba(200, 169, 81, 0.05) 0%, rgba(191, 216, 184, 0.05) 100%);
}

.employer-summary[b-5wm8v2r4vj] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 1.5rem;
}

.employer-details h3[b-5wm8v2r4vj] {
    color: #14213D;
    font-size: 1.5rem;
    font-weight: 600;
    margin-bottom: 0.75rem;
}

.employer-meta[b-5wm8v2r4vj] {
    display: flex;
    flex-wrap: wrap;
    gap: 1.5rem;
    color: #2E2E2E;
    font-size: 0.95rem;
}

.employer-meta span[b-5wm8v2r4vj] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.employer-meta i[b-5wm8v2r4vj] {
    color: #C8A951;
    width: 16px;
}

.employer-status[b-5wm8v2r4vj] {
    flex-shrink: 0;
}

.status-badge[b-5wm8v2r4vj] {
    padding: 0.5rem 1rem;
    border-radius: 20px;
    font-size: 0.85rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.status-badge.active[b-5wm8v2r4vj] {
    background: rgba(25, 135, 84, 0.1);
    color: #198754;
    border: 1px solid rgba(25, 135, 84, 0.3);
}

.status-badge.inactive[b-5wm8v2r4vj] {
    background: rgba(220, 53, 69, 0.1);
    color: #dc3545;
    border: 1px solid rgba(220, 53, 69, 0.3);
}

/* User Form Section */
.user-form-section[b-5wm8v2r4vj] {
    margin-bottom: 2rem;
}

/* Existing Users Section */
.existing-users-section[b-5wm8v2r4vj] {
    margin-bottom: 2rem;
}

.users-list[b-5wm8v2r4vj] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.user-item[b-5wm8v2r4vj] {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 1.5rem;
    border: 2px solid #E2E6EA;
    border-radius: 12px;
    background: white;
    transition: all 0.3s ease;
}

.user-item:hover[b-5wm8v2r4vj] {
    border-color: #C8A951;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
}

.user-avatar[b-5wm8v2r4vj] {
    flex-shrink: 0;
    width: 50px;
    height: 50px;
    border-radius: 50%;
    background: rgba(200, 169, 81, 0.1);
    display: flex;
    align-items: center;
    justify-content: center;
    color: #C8A951;
    font-size: 1.8rem;
}

.user-details[b-5wm8v2r4vj] {
    flex: 1;
}

.user-name[b-5wm8v2r4vj] {
    color: #14213D;
    font-size: 1.1rem;
    font-weight: 600;
    margin-bottom: 0.25rem;
}

.user-email[b-5wm8v2r4vj] {
    color: #2E2E2E;
    font-size: 0.95rem;
    margin-bottom: 0.25rem;
}

.user-role[b-5wm8v2r4vj] {
    color: #6c757d;
    font-size: 0.85rem;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.user-status[b-5wm8v2r4vj] {
    flex-shrink: 0;
    margin-right: 1rem;
}

.user-actions[b-5wm8v2r4vj] {
    flex-shrink: 0;
}

/* Success Section */
.success-section[b-5wm8v2r4vj] {
    margin-top: 2rem;
}

[b-5wm8v2r4vj] .success-card {
    border: 2px solid #198754;
    background: linear-gradient(135deg, rgba(25, 135, 84, 0.05) 0%, rgba(191, 216, 184, 0.05) 100%);
}

.success-content[b-5wm8v2r4vj] {
    text-align: center;
    padding: 2rem;
}

.success-icon[b-5wm8v2r4vj] {
    font-size: 4rem;
    color: #198754;
    margin-bottom: 1.5rem;
}

.success-content h3[b-5wm8v2r4vj] {
    color: #14213D;
    font-size: 1.8rem;
    font-weight: 600;
    margin-bottom: 1rem;
}

.success-content > p[b-5wm8v2r4vj] {
    color: #2E2E2E;
    font-size: 1.1rem;
    margin-bottom: 2rem;
}

.next-steps[b-5wm8v2r4vj] {
    background: rgba(25, 135, 84, 0.05);
    border: 1px solid rgba(25, 135, 84, 0.2);
    border-radius: 8px;
    padding: 1.5rem;
    margin-bottom: 2rem;
    text-align: left;
}

.next-steps h4[b-5wm8v2r4vj] {
    color: #14213D;
    font-size: 1.2rem;
    font-weight: 600;
    margin-bottom: 1rem;
}

.next-steps ul[b-5wm8v2r4vj] {
    color: #2E2E2E;
    margin: 0;
    padding-left: 1.5rem;
}

.next-steps li[b-5wm8v2r4vj] {
    margin-bottom: 0.5rem;
    line-height: 1.4;
}

.success-actions[b-5wm8v2r4vj] {
    display: flex;
    gap: 1rem;
    justify-content: center;
    flex-wrap: wrap;
}

/* Error Section */
.error-section[b-5wm8v2r4vj] {
    margin-top: 2rem;
}

[b-5wm8v2r4vj] .error-card {
    border: 2px solid #dc3545;
    background: linear-gradient(135deg, rgba(220, 53, 69, 0.05) 0%, rgba(255, 193, 7, 0.05) 100%);
}

.error-content[b-5wm8v2r4vj] {
    text-align: center;
    padding: 2rem;
}

.error-icon[b-5wm8v2r4vj] {
    font-size: 4rem;
    color: #dc3545;
    margin-bottom: 1.5rem;
}

.error-content h4[b-5wm8v2r4vj] {
    color: #14213D;
    font-size: 1.5rem;
    font-weight: 600;
    margin-bottom: 1rem;
}

.error-content p[b-5wm8v2r4vj] {
    color: #2E2E2E;
    font-size: 1rem;
    margin-bottom: 2rem;
    line-height: 1.5;
}

.error-actions[b-5wm8v2r4vj] {
    display: flex;
    gap: 1rem;
    justify-content: center;
    flex-wrap: wrap;
}

/* Responsive Design */
@media (max-width: 768px) {
    .add-user-page[b-5wm8v2r4vj] {
        padding: 1rem;
    }
    
    .page-header[b-5wm8v2r4vj] {
        flex-direction: column;
        align-items: flex-start;
    }
    
    .page-title[b-5wm8v2r4vj] {
        font-size: 2rem;
    }
    
    .employer-summary[b-5wm8v2r4vj] {
        flex-direction: column;
        align-items: flex-start;
    }
    
    .employer-meta[b-5wm8v2r4vj] {
        flex-direction: column;
        gap: 0.5rem;
    }
    
    .user-item[b-5wm8v2r4vj] {
        flex-direction: column;
        text-align: center;
        gap: 1rem;
    }
    
    .user-details[b-5wm8v2r4vj] {
        text-align: center;
    }
    
    .success-actions[b-5wm8v2r4vj],
    .error-actions[b-5wm8v2r4vj] {
        flex-direction: column;
        align-items: stretch;
    }
}

@media (max-width: 480px) {
    .add-user-page[b-5wm8v2r4vj] {
        padding: 0.5rem;
    }
    
    .page-title[b-5wm8v2r4vj] {
        font-size: 1.75rem;
        flex-direction: column;
        align-items: flex-start;
        gap: 0.5rem;
    }
    
    .success-content[b-5wm8v2r4vj],
    .error-content[b-5wm8v2r4vj] {
        padding: 1.5rem;
    }
    
    .success-icon[b-5wm8v2r4vj],
    .error-icon[b-5wm8v2r4vj] {
        font-size: 3rem;
    }
    
    .next-steps[b-5wm8v2r4vj] {
        padding: 1.25rem;
    }
    
    .user-item[b-5wm8v2r4vj] {
        padding: 1.25rem;
    }
    
    .user-avatar[b-5wm8v2r4vj] {
        width: 40px;
        height: 40px;
        font-size: 1.5rem;
    }
}
/* /Features/Admin/Onboarding/AssignTierPage.razor.rz.scp.css */
.assign-tier-page[b-3bq3ay3tz2] {
    padding: 2rem;
    max-width: 1400px;
    margin: 0 auto;
}

.page-header[b-3bq3ay3tz2] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 2.5rem;
    flex-wrap: wrap;
    gap: 1rem;
}

.header-content[b-3bq3ay3tz2] {
    flex: 1;
}

.page-title[b-3bq3ay3tz2] {
    color: #14213D;
    font-size: 2.5rem;
    font-weight: 600;
    margin-bottom: 0.5rem;
    display: flex;
    align-items: center;
    gap: 1rem;
}

.page-title i[b-3bq3ay3tz2] {
    color: #C8A951;
    font-size: 2rem;
}

.page-description[b-3bq3ay3tz2] {
    color: #2E2E2E;
    font-size: 1.1rem;
    margin: 0;
    max-width: 600px;
}

.header-actions[b-3bq3ay3tz2] {
    display: flex;
    gap: 0.75rem;
    align-items: center;
}

.assign-tier-content[b-3bq3ay3tz2] {
    display: flex;
    flex-direction: column;
    gap: 2.5rem;
}

.loading-state[b-3bq3ay3tz2] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 4rem 2rem;
    text-align: center;
}

.spinner[b-3bq3ay3tz2] {
    width: 40px;
    height: 40px;
    border: 4px solid #E2E6EA;
    border-top: 4px solid #C8A951;
    border-radius: 50%;
    animation: spin-b-3bq3ay3tz2 1s linear infinite;
    margin-bottom: 1rem;
}

@keyframes spin-b-3bq3ay3tz2 {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

/* Employer Selection Section */
.employer-selection-section[b-3bq3ay3tz2] {
    margin-bottom: 2rem;
}

/* Employer Info Section */
.employer-info-section[b-3bq3ay3tz2] {
    margin-bottom: 2rem;
}

[b-3bq3ay3tz2] .employer-info-card {
    border: 2px solid #C8A951;
    background: linear-gradient(135deg, rgba(200, 169, 81, 0.05) 0%, rgba(191, 216, 184, 0.05) 100%);
}

.employer-summary[b-3bq3ay3tz2] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 1.5rem;
}

.employer-details h3[b-3bq3ay3tz2] {
    color: #14213D;
    font-size: 1.5rem;
    font-weight: 600;
    margin-bottom: 0.75rem;
}

.employer-meta[b-3bq3ay3tz2] {
    display: flex;
    flex-wrap: wrap;
    gap: 1.5rem;
    color: #2E2E2E;
    font-size: 0.95rem;
    margin-bottom: 0.75rem;
}

.employer-meta span[b-3bq3ay3tz2] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.employer-meta i[b-3bq3ay3tz2] {
    color: #C8A951;
    width: 16px;
}

.current-tier[b-3bq3ay3tz2] {
    color: #198754;
    font-size: 0.95rem;
    font-weight: 500;
    margin: 0;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.current-tier i[b-3bq3ay3tz2] {
    color: #C8A951;
}

.employer-status[b-3bq3ay3tz2] {
    flex-shrink: 0;
}

.status-badge[b-3bq3ay3tz2] {
    padding: 0.5rem 1rem;
    border-radius: 20px;
    font-size: 0.85rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.status-badge.active[b-3bq3ay3tz2] {
    background: rgba(25, 135, 84, 0.1);
    color: #198754;
    border: 1px solid rgba(25, 135, 84, 0.3);
}

.status-badge.inactive[b-3bq3ay3tz2] {
    background: rgba(220, 53, 69, 0.1);
    color: #dc3545;
    border: 1px solid rgba(220, 53, 69, 0.3);
}

/* Tier Selection Section */
.tier-selection-section[b-3bq3ay3tz2] {
    margin-bottom: 2rem;
}

.tiers-grid[b-3bq3ay3tz2] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
    gap: 1.5rem;
}

.tier-card[b-3bq3ay3tz2] {
    border: 2px solid #E2E6EA;
    border-radius: 12px;
    padding: 2rem;
    background: white;
    cursor: pointer;
    transition: all 0.3s ease;
    position: relative;
    overflow: hidden;
}

.tier-card:hover[b-3bq3ay3tz2] {
    transform: translateY(-4px);
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.1);
    border-color: #C8A951;
}

.tier-card.selected[b-3bq3ay3tz2] {
    border-color: #C8A951;
    background: linear-gradient(135deg, rgba(200, 169, 81, 0.05) 0%, rgba(191, 216, 184, 0.05) 100%);
    box-shadow: 0 4px 16px rgba(200, 169, 81, 0.2);
}

.tier-card.current[b-3bq3ay3tz2] {
    border-color: #198754;
    background: linear-gradient(135deg, rgba(25, 135, 84, 0.05) 0%, rgba(191, 216, 184, 0.05) 100%);
}

.tier-header[b-3bq3ay3tz2] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 1.5rem;
}

.tier-name[b-3bq3ay3tz2] {
    color: #14213D;
    font-size: 1.5rem;
    font-weight: 700;
}

.tier-price[b-3bq3ay3tz2] {
    text-align: right;
}

.tier-price .price[b-3bq3ay3tz2] {
    color: #C8A951;
    font-size: 1.8rem;
    font-weight: 700;
}

.tier-price .period[b-3bq3ay3tz2] {
    color: #6c757d;
    font-size: 0.9rem;
}

.tier-description[b-3bq3ay3tz2] {
    color: #2E2E2E;
    font-size: 1rem;
    line-height: 1.5;
    margin-bottom: 1.5rem;
}

.tier-features h5[b-3bq3ay3tz2] {
    color: #14213D;
    font-size: 1.1rem;
    font-weight: 600;
    margin-bottom: 1rem;
}

.tier-features ul[b-3bq3ay3tz2] {
    list-style: none;
    padding: 0;
    margin: 0;
}

.tier-features li[b-3bq3ay3tz2] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.5rem 0;
    color: #2E2E2E;
    font-size: 0.95rem;
}

.tier-features li i[b-3bq3ay3tz2] {
    color: #C8A951;
    width: 16px;
    flex-shrink: 0;
}

.current-badge[b-3bq3ay3tz2],
.selected-badge[b-3bq3ay3tz2] {
    position: absolute;
    top: 1rem;
    right: 1rem;
    padding: 0.5rem 1rem;
    border-radius: 20px;
    font-size: 0.8rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.current-badge[b-3bq3ay3tz2] {
    background: rgba(25, 135, 84, 0.1);
    color: #198754;
    border: 1px solid rgba(25, 135, 84, 0.3);
}

.selected-badge[b-3bq3ay3tz2] {
    background: rgba(200, 169, 81, 0.1);
    color: #C8A951;
    border: 1px solid rgba(200, 169, 81, 0.3);
}

/* Assignment Actions Section */
.assignment-actions-section[b-3bq3ay3tz2] {
    margin-bottom: 2rem;
}

[b-3bq3ay3tz2] .assignment-card {
    border: 2px solid #0d6efd;
    background: linear-gradient(135deg, rgba(13, 110, 253, 0.05) 0%, rgba(191, 216, 184, 0.05) 100%);
}

.assignment-summary h4[b-3bq3ay3tz2] {
    color: #14213D;
    font-size: 1.3rem;
    font-weight: 600;
    margin-bottom: 1.5rem;
}

.tier-change[b-3bq3ay3tz2] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 2rem;
    margin-bottom: 2rem;
    padding: 1.5rem;
    background: rgba(255, 255, 255, 0.7);
    border-radius: 8px;
    border: 1px solid #E2E6EA;
}

.from-tier[b-3bq3ay3tz2],
.to-tier[b-3bq3ay3tz2] {
    text-align: center;
}

.from-tier .label[b-3bq3ay3tz2],
.to-tier .label[b-3bq3ay3tz2] {
    display: block;
    color: #6c757d;
    font-size: 0.9rem;
    font-weight: 500;
    margin-bottom: 0.5rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.from-tier .tier[b-3bq3ay3tz2],
.to-tier .tier[b-3bq3ay3tz2] {
    display: block;
    color: #14213D;
    font-size: 1.2rem;
    font-weight: 600;
}

.arrow[b-3bq3ay3tz2] {
    color: #C8A951;
    font-size: 1.5rem;
}

.assignment-notes[b-3bq3ay3tz2] {
    margin-bottom: 2rem;
}

.assignment-notes label[b-3bq3ay3tz2] {
    display: block;
    color: #14213D;
    font-weight: 600;
    margin-bottom: 0.5rem;
}

.assignment-notes textarea[b-3bq3ay3tz2] {
    width: 100%;
    padding: 0.75rem;
    border: 2px solid #E2E6EA;
    border-radius: 8px;
    font-family: inherit;
    font-size: 0.95rem;
    resize: vertical;
    transition: border-color 0.3s ease;
}

.assignment-notes textarea:focus[b-3bq3ay3tz2] {
    outline: none;
    border-color: #C8A951;
    box-shadow: 0 0 0 3px rgba(200, 169, 81, 0.1);
}

.assignment-actions[b-3bq3ay3tz2] {
    display: flex;
    gap: 1rem;
    justify-content: center;
    flex-wrap: wrap;
}

/* Success Section */
.success-section[b-3bq3ay3tz2] {
    margin-top: 2rem;
}

[b-3bq3ay3tz2] .success-card {
    border: 2px solid #198754;
    background: linear-gradient(135deg, rgba(25, 135, 84, 0.05) 0%, rgba(191, 216, 184, 0.05) 100%);
}

.success-content[b-3bq3ay3tz2] {
    text-align: center;
    padding: 2rem;
}

.success-icon[b-3bq3ay3tz2] {
    font-size: 4rem;
    color: #198754;
    margin-bottom: 1.5rem;
}

.success-content h3[b-3bq3ay3tz2] {
    color: #14213D;
    font-size: 1.8rem;
    font-weight: 600;
    margin-bottom: 1rem;
}

.success-content > p[b-3bq3ay3tz2] {
    color: #2E2E2E;
    font-size: 1.1rem;
    margin-bottom: 2rem;
}

.next-steps[b-3bq3ay3tz2] {
    background: rgba(25, 135, 84, 0.05);
    border: 1px solid rgba(25, 135, 84, 0.2);
    border-radius: 8px;
    padding: 1.5rem;
    margin-bottom: 2rem;
    text-align: left;
}

.next-steps h4[b-3bq3ay3tz2] {
    color: #14213D;
    font-size: 1.2rem;
    font-weight: 600;
    margin-bottom: 1rem;
}

.next-steps ul[b-3bq3ay3tz2] {
    color: #2E2E2E;
    margin: 0;
    padding-left: 1.5rem;
}

.next-steps li[b-3bq3ay3tz2] {
    margin-bottom: 0.5rem;
    line-height: 1.4;
}

.success-actions[b-3bq3ay3tz2] {
    display: flex;
    gap: 1rem;
    justify-content: center;
    flex-wrap: wrap;
}

/* Error Section */
.error-section[b-3bq3ay3tz2] {
    margin-top: 2rem;
}

[b-3bq3ay3tz2] .error-card {
    border: 2px solid #dc3545;
    background: linear-gradient(135deg, rgba(220, 53, 69, 0.05) 0%, rgba(255, 193, 7, 0.05) 100%);
}

.error-content[b-3bq3ay3tz2] {
    text-align: center;
    padding: 2rem;
}

.error-icon[b-3bq3ay3tz2] {
    font-size: 4rem;
    color: #dc3545;
    margin-bottom: 1.5rem;
}

.error-content h4[b-3bq3ay3tz2] {
    color: #14213D;
    font-size: 1.5rem;
    font-weight: 600;
    margin-bottom: 1rem;
}

.error-content p[b-3bq3ay3tz2] {
    color: #2E2E2E;
    font-size: 1rem;
    margin-bottom: 2rem;
    line-height: 1.5;
}

.error-actions[b-3bq3ay3tz2] {
    display: flex;
    gap: 1rem;
    justify-content: center;
    flex-wrap: wrap;
}

/* Responsive Design */
@media (max-width: 768px) {
    .assign-tier-page[b-3bq3ay3tz2] {
        padding: 1rem;
    }
    
    .page-header[b-3bq3ay3tz2] {
        flex-direction: column;
        align-items: flex-start;
    }
    
    .page-title[b-3bq3ay3tz2] {
        font-size: 2rem;
    }
    
    .employer-summary[b-3bq3ay3tz2] {
        flex-direction: column;
        align-items: flex-start;
    }
    
    .employer-meta[b-3bq3ay3tz2] {
        flex-direction: column;
        gap: 0.5rem;
    }
    
    .tiers-grid[b-3bq3ay3tz2] {
        grid-template-columns: 1fr;
        gap: 1rem;
    }
    
    .tier-change[b-3bq3ay3tz2] {
        flex-direction: column;
        gap: 1rem;
    }
    
    .arrow[b-3bq3ay3tz2] {
        transform: rotate(90deg);
    }
    
    .assignment-actions[b-3bq3ay3tz2],
    .success-actions[b-3bq3ay3tz2],
    .error-actions[b-3bq3ay3tz2] {
        flex-direction: column;
        align-items: stretch;
    }
    
    .current-badge[b-3bq3ay3tz2],
    .selected-badge[b-3bq3ay3tz2] {
        position: static;
        margin-top: 1rem;
        align-self: flex-start;
    }
}

@media (max-width: 480px) {
    .assign-tier-page[b-3bq3ay3tz2] {
        padding: 0.5rem;
    }
    
    .page-title[b-3bq3ay3tz2] {
        font-size: 1.75rem;
        flex-direction: column;
        align-items: flex-start;
        gap: 0.5rem;
    }
    
    .tier-card[b-3bq3ay3tz2] {
        padding: 1.5rem;
    }
    
    .tier-header[b-3bq3ay3tz2] {
        flex-direction: column;
        gap: 1rem;
    }
    
    .tier-price[b-3bq3ay3tz2] {
        text-align: left;
    }
    
    .success-content[b-3bq3ay3tz2],
    .error-content[b-3bq3ay3tz2] {
        padding: 1.5rem;
    }
    
    .success-icon[b-3bq3ay3tz2],
    .error-icon[b-3bq3ay3tz2] {
        font-size: 3rem;
    }
    
    .next-steps[b-3bq3ay3tz2] {
        padding: 1.25rem;
    }
    
    .tier-change[b-3bq3ay3tz2] {
        padding: 1rem;
    }
}
/* /Features/Admin/Onboarding/Components/AdminActionLogViewer.razor.rz.scp.css */
.admin-action-log-viewer[b-uigz0q5af6] {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

/* Log Viewer Content */
.log-viewer-content[b-uigz0q5af6] {
    display: flex;
    flex-direction: column;
    gap: 2rem;
}

/* Filter and Search Section */
.filter-search-section[b-uigz0q5af6] {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
    padding: 1.5rem;
    border: 1px solid #E2E6EA;
    border-radius: 12px;
    background: #F8F9FA;
}

.search-controls[b-uigz0q5af6] {
    display: flex;
    gap: 1.5rem;
    align-items: flex-end;
}

.search-input[b-uigz0q5af6] {
    flex: 1;
    max-width: 400px;
}

.date-filters[b-uigz0q5af6] {
    display: flex;
    gap: 1rem;
}

.date-filters > *[b-uigz0q5af6] {
    min-width: 150px;
}

.filter-controls[b-uigz0q5af6] {
    display: flex;
    gap: 1rem;
    flex-wrap: wrap;
}

.filter-controls > *[b-uigz0q5af6] {
    min-width: 150px;
}

.action-controls[b-uigz0q5af6] {
    display: flex;
    gap: 1rem;
    justify-content: flex-end;
    flex-wrap: wrap;
}

/* Log Statistics */
.log-statistics[b-uigz0q5af6] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 1.5rem;
    margin-bottom: 1rem;
}

.stat-card[b-uigz0q5af6] {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 1.5rem;
    border: 1px solid #E2E6EA;
    border-radius: 12px;
    background: white;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
    transition: all 0.3s ease;
}

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

.stat-icon[b-uigz0q5af6] {
    flex-shrink: 0;
    width: 45px;
    height: 45px;
    border-radius: 12px;
    background: rgba(200, 169, 81, 0.1);
    display: flex;
    align-items: center;
    justify-content: center;
    color: #C8A951;
    font-size: 1.2rem;
}

.stat-icon.today[b-uigz0q5af6] {
    background: rgba(25, 135, 84, 0.1);
    color: #198754;
}

.stat-icon.users[b-uigz0q5af6] {
    background: rgba(20, 33, 61, 0.1);
    color: #14213D;
}

.stat-icon.recent[b-uigz0q5af6] {
    background: rgba(255, 193, 7, 0.1);
    color: #ffc107;
}

.stat-content[b-uigz0q5af6] {
    flex: 1;
}

.stat-value[b-uigz0q5af6] {
    color: #14213D;
    font-size: 1.5rem;
    font-weight: 700;
    line-height: 1;
    margin-bottom: 0.25rem;
}

.stat-label[b-uigz0q5af6] {
    color: #6c757d;
    font-size: 0.85rem;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

/* Log Grid Section */
.log-grid-section[b-uigz0q5af6] {
    background: white;
    border-radius: 12px;
    border: 1px solid #E2E6EA;
    overflow: hidden;
}

/* Data Grid Styling */
[b-uigz0q5af6] .action-log-grid {
    border: none;
}

[b-uigz0q5af6] .action-log-grid .e-gridheader {
    background: linear-gradient(135deg, #14213D 0%, #2E2E2E 100%);
    border-bottom: 2px solid #C8A951;
}

[b-uigz0q5af6] .action-log-grid .e-headercell {
    color: white;
    font-weight: 600;
    border-right: 1px solid rgba(255, 255, 255, 0.1);
}

[b-uigz0q5af6] .action-log-grid .e-gridcontent {
    border: none;
}

[b-uigz0q5af6] .action-log-grid .e-row {
    border-bottom: 1px solid #E2E6EA;
    transition: all 0.2s ease;
}

[b-uigz0q5af6] .action-log-grid .e-row:hover {
    background: #F8F9FA;
}

[b-uigz0q5af6] .action-log-grid .e-rowcell {
    border-right: 1px solid #F1F3F4;
    padding: 0.75rem;
}

/* Grid Cell Styling */
.timestamp-cell[b-uigz0q5af6] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.timestamp-cell .date[b-uigz0q5af6] {
    color: #14213D;
    font-weight: 600;
    font-size: 0.9rem;
}

.timestamp-cell .time[b-uigz0q5af6] {
    color: #6c757d;
    font-size: 0.8rem;
    font-family: monospace;
}

.action-cell[b-uigz0q5af6] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.action-icon[b-uigz0q5af6] {
    flex-shrink: 0;
    width: 25px;
    height: 25px;
    border-radius: 50%;
    background: rgba(200, 169, 81, 0.1);
    display: flex;
    align-items: center;
    justify-content: center;
    color: #C8A951;
    font-size: 0.8rem;
}

.action-name[b-uigz0q5af6] {
    color: #14213D;
    font-weight: 500;
    font-size: 0.9rem;
}

.user-cell[b-uigz0q5af6] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.user-name[b-uigz0q5af6] {
    color: #14213D;
    font-weight: 500;
    font-size: 0.9rem;
}

.user-id[b-uigz0q5af6] {
    color: #6c757d;
    font-size: 0.75rem;
    font-family: monospace;
}

.employer-cell[b-uigz0q5af6] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.employer-name[b-uigz0q5af6] {
    color: #14213D;
    font-weight: 500;
    font-size: 0.9rem;
}

.employer-id[b-uigz0q5af6] {
    color: #6c757d;
    font-size: 0.75rem;
    font-family: monospace;
}

.no-employer[b-uigz0q5af6] {
    color: #6c757d;
    font-style: italic;
    font-size: 0.85rem;
}

.details-cell[b-uigz0q5af6] {
    max-width: 300px;
}

.details-text[b-uigz0q5af6] {
    color: #2E2E2E;
    font-size: 0.85rem;
    line-height: 1.4;
    word-wrap: break-word;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.actions-cell[b-uigz0q5af6] {
    display: flex;
    gap: 0.5rem;
    justify-content: center;
}

/* Quick Filters */
.quick-filters[b-uigz0q5af6] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    padding: 1.5rem;
    border: 1px solid #E2E6EA;
    border-radius: 12px;
    background: white;
}

.quick-filters h5[b-uigz0q5af6] {
    color: #14213D;
    font-size: 1rem;
    font-weight: 600;
    margin: 0;
}

.quick-filter-buttons[b-uigz0q5af6] {
    display: flex;
    gap: 0.75rem;
    flex-wrap: wrap;
}

/* Action Details Panel */
.action-details-panel[b-uigz0q5af6] {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 90%;
    max-width: 600px;
    max-height: 80vh;
    overflow-y: auto;
    z-index: 1000;
    background: white;
    border-radius: 12px;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.2);
}

.action-details-panel[b-uigz0q5af6]::before {
    content: '';
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    background: rgba(0, 0, 0, 0.5);
    z-index: -1;
}

.detail-sections[b-uigz0q5af6] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.detail-row[b-uigz0q5af6] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    padding: 0.75rem 0;
    border-bottom: 1px solid #E2E6EA;
    gap: 1rem;
}

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

.detail-row.full-width[b-uigz0q5af6] {
    flex-direction: column;
    align-items: stretch;
}

.detail-row .label[b-uigz0q5af6] {
    color: #6c757d;
    font-weight: 500;
    font-size: 0.9rem;
    min-width: 120px;
    flex-shrink: 0;
}

.detail-row .value[b-uigz0q5af6] {
    color: #14213D;
    font-weight: 500;
    font-size: 0.95rem;
    word-wrap: break-word;
    flex: 1;
}

.details-full[b-uigz0q5af6] {
    font-family: monospace;
    background: #F8F9FA;
    padding: 1rem;
    border-radius: 6px;
    border: 1px solid #E2E6EA;
    white-space: pre-wrap;
    word-wrap: break-word;
    margin-top: 0.5rem;
}

.detail-actions[b-uigz0q5af6] {
    display: flex;
    gap: 1rem;
    justify-content: flex-end;
    padding-top: 1rem;
    border-top: 1px solid #E2E6EA;
    margin-top: 1rem;
}

/* Special styling for log viewer card */
[b-uigz0q5af6] .iswara-card {
    border: 2px solid #E2E6EA;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.08);
}

[b-uigz0q5af6] .iswara-card .card-header {
    background: linear-gradient(135deg, #14213D 0%, #2E2E2E 100%);
    color: white;
    border-bottom: 2px solid #C8A951;
}

[b-uigz0q5af6] .iswara-card .card-header i {
    color: #C8A951;
}

/* Responsive Design */
@media (max-width: 1200px) {
    .search-controls[b-uigz0q5af6] {
        flex-direction: column;
        align-items: stretch;
        gap: 1rem;
    }
    
    .search-input[b-uigz0q5af6] {
        max-width: none;
    }
    
    .date-filters[b-uigz0q5af6] {
        justify-content: space-between;
    }
    
    .filter-controls[b-uigz0q5af6] {
        justify-content: space-between;
    }
    
    .action-controls[b-uigz0q5af6] {
        justify-content: center;
    }
}

@media (max-width: 768px) {
    .log-viewer-content[b-uigz0q5af6] {
        gap: 1.5rem;
    }
    
    .filter-search-section[b-uigz0q5af6] {
        padding: 1rem;
        gap: 1rem;
    }
    
    .date-filters[b-uigz0q5af6] {
        flex-direction: column;
        gap: 0.75rem;
    }
    
    .date-filters > *[b-uigz0q5af6] {
        min-width: unset;
    }
    
    .filter-controls[b-uigz0q5af6] {
        flex-direction: column;
        gap: 0.75rem;
    }
    
    .filter-controls > *[b-uigz0q5af6] {
        min-width: unset;
    }
    
    .action-controls[b-uigz0q5af6] {
        flex-direction: column;
    }
    
    .log-statistics[b-uigz0q5af6] {
        grid-template-columns: repeat(2, 1fr);
        gap: 1rem;
    }
    
    .stat-card[b-uigz0q5af6] {
        padding: 1rem;
        flex-direction: column;
        text-align: center;
        gap: 0.75rem;
    }
    
    .stat-icon[b-uigz0q5af6] {
        width: 40px;
        height: 40px;
        font-size: 1rem;
    }
    
    .stat-value[b-uigz0q5af6] {
        font-size: 1.25rem;
    }
    
    .stat-label[b-uigz0q5af6] {
        font-size: 0.8rem;
    }
    
    /* Hide less important columns on mobile */
    [b-uigz0q5af6] .action-log-grid .e-headercell:nth-child(n+4),
    [b-uigz0q5af6] .action-log-grid .e-rowcell:nth-child(n+4) {
        display: none;
    }
    
    .quick-filter-buttons[b-uigz0q5af6] {
        flex-direction: column;
    }
    
    .action-details-panel[b-uigz0q5af6] {
        width: 95%;
        max-height: 90vh;
    }
    
    .detail-actions[b-uigz0q5af6] {
        flex-direction: column;
    }
}

@media (max-width: 480px) {
    .admin-action-log-viewer[b-uigz0q5af6] {
        gap: 1rem;
    }
    
    .log-viewer-content[b-uigz0q5af6] {
        gap: 1rem;
    }
    
    .filter-search-section[b-uigz0q5af6] {
        padding: 0.75rem;
    }
    
    .log-statistics[b-uigz0q5af6] {
        grid-template-columns: 1fr;
        gap: 0.75rem;
    }
    
    .stat-card[b-uigz0q5af6] {
        padding: 0.75rem;
    }
    
    .stat-icon[b-uigz0q5af6] {
        width: 35px;
        height: 35px;
        font-size: 0.9rem;
    }
    
    .stat-value[b-uigz0q5af6] {
        font-size: 1.1rem;
    }
    
    .stat-label[b-uigz0q5af6] {
        font-size: 0.75rem;
    }
    
    /* Show only essential columns on small mobile */
    [b-uigz0q5af6] .action-log-grid .e-headercell:nth-child(n+3),
    [b-uigz0q5af6] .action-log-grid .e-rowcell:nth-child(n+3) {
        display: none;
    }
    
    .quick-filters[b-uigz0q5af6] {
        padding: 1rem;
    }
    
    .action-details-panel[b-uigz0q5af6] {
        width: 98%;
        max-height: 95vh;
    }
    
    .detail-row .label[b-uigz0q5af6] {
        min-width: 80px;
        font-size: 0.8rem;
    }
    
    .detail-row .value[b-uigz0q5af6] {
        font-size: 0.85rem;
    }
    
    .details-full[b-uigz0q5af6] {
        padding: 0.75rem;
        font-size: 0.8rem;
    }
}

/* Loading states */
.log-grid-section.loading[b-uigz0q5af6] {
    opacity: 0.6;
    pointer-events: none;
}

.log-grid-section.loading[b-uigz0q5af6]::after {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    width: 32px;
    height: 32px;
    margin: -16px 0 0 -16px;
    border: 3px solid #E2E6EA;
    border-top: 3px solid #C8A951;
    border-radius: 50%;
    animation: spin-b-uigz0q5af6 1s linear infinite;
}

@keyframes spin-b-uigz0q5af6 {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

/* Focus and accessibility improvements */
[b-uigz0q5af6] .action-log-grid .e-row:focus {
    outline: 2px solid #C8A951;
    outline-offset: -2px;
}

.quick-filter-buttons button:focus[b-uigz0q5af6],
.action-controls button:focus[b-uigz0q5af6],
.detail-actions button:focus[b-uigz0q5af6] {
    outline: 2px solid #C8A951;
    outline-offset: 2px;
}

/* Enhanced hover effects */
.stat-card:hover .stat-icon[b-uigz0q5af6] {
    transform: scale(1.1);
}

.actions-cell button:hover[b-uigz0q5af6] {
    transform: translateY(-1px);
}

.quick-filter-buttons button:hover[b-uigz0q5af6] {
    transform: translateY(-1px);
}

/* Smooth transitions */
.stat-card[b-uigz0q5af6],
.stat-icon[b-uigz0q5af6],
.actions-cell button[b-uigz0q5af6],
.quick-filter-buttons button[b-uigz0q5af6] {
    transition: all 0.3s ease;
}

/* Custom scrollbar for grid content and details panel */
[b-uigz0q5af6] .action-log-grid .e-gridcontent::-webkit-scrollbar,
.action-details-panel[b-uigz0q5af6]::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}

[b-uigz0q5af6] .action-log-grid .e-gridcontent::-webkit-scrollbar-track,
.action-details-panel[b-uigz0q5af6]::-webkit-scrollbar-track {
    background: #F1F3F4;
    border-radius: 4px;
}

[b-uigz0q5af6] .action-log-grid .e-gridcontent::-webkit-scrollbar-thumb,
.action-details-panel[b-uigz0q5af6]::-webkit-scrollbar-thumb {
    background: #C8A951;
    border-radius: 4px;
}

[b-uigz0q5af6] .action-log-grid .e-gridcontent::-webkit-scrollbar-thumb:hover,
.action-details-panel[b-uigz0q5af6]::-webkit-scrollbar-thumb:hover {
    background: #B8965A;
}

/* Animation for action details panel */
.action-details-panel[b-uigz0q5af6] {
    animation: slideInScale-b-uigz0q5af6 0.3s ease;
}

@keyframes slideInScale-b-uigz0q5af6 {
    from {
        opacity: 0;
        transform: translate(-50%, -50%) scale(0.9);
    }
    to {
        opacity: 1;
        transform: translate(-50%, -50%) scale(1);
    }
}
/* /Features/Admin/Onboarding/Components/EmployerAuditTrail.razor.rz.scp.css */
.employer-audit-trail[b-kflzri6o6r] {
    display: flex;
    flex-direction: column;
    gap: 2rem;
    max-width: 1200px;
    margin: 0 auto;
}

/* Employer Header */
.employer-header[b-kflzri6o6r] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    padding: 2rem;
    border: 2px solid #E2E6EA;
    border-radius: 16px;
    background: linear-gradient(135deg, rgba(200, 169, 81, 0.05) 0%, rgba(200, 169, 81, 0.02) 100%);
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.08);
}

.employer-info h2[b-kflzri6o6r] {
    color: #14213D;
    font-size: 1.8rem;
    font-weight: 700;
    margin: 0 0 1rem 0;
}

.employer-meta[b-kflzri6o6r] {
    display: flex;
    gap: 2rem;
    color: #6c757d;
    font-size: 0.95rem;
}

.employer-meta span[b-kflzri6o6r] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.employer-meta i[b-kflzri6o6r] {
    color: #C8A951;
    width: 16px;
}

.audit-stats[b-kflzri6o6r] {
    display: flex;
    gap: 1.5rem;
}

.stat-item[b-kflzri6o6r] {
    text-align: center;
    padding: 1rem;
    border: 1px solid #E2E6EA;
    border-radius: 12px;
    background: white;
    min-width: 100px;
}

.stat-number[b-kflzri6o6r] {
    color: #14213D;
    font-size: 1.5rem;
    font-weight: 700;
    margin-bottom: 0.25rem;
}

.stat-label[b-kflzri6o6r] {
    color: #6c757d;
    font-size: 0.8rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

/* Audit Trail Content */
.audit-trail-content[b-kflzri6o6r] {
    display: flex;
    flex-direction: column;
    gap: 2rem;
}

/* Filter Controls Section */
.filter-controls-section[b-kflzri6o6r] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    padding: 1.5rem;
    border: 1px solid #E2E6EA;
    border-radius: 12px;
    background: #F8F9FA;
}

.primary-filters[b-kflzri6o6r] {
    display: flex;
    gap: 1.5rem;
    align-items: flex-end;
}

.search-filter[b-kflzri6o6r] {
    flex: 1;
    max-width: 400px;
}

.date-range-filters[b-kflzri6o6r] {
    display: flex;
    gap: 1rem;
}

.date-range-filters > *[b-kflzri6o6r] {
    min-width: 150px;
}

.secondary-filters[b-kflzri6o6r] {
    display: flex;
    gap: 1rem;
    flex-wrap: wrap;
}

.secondary-filters > *[b-kflzri6o6r] {
    min-width: 150px;
}

.action-filters[b-kflzri6o6r] {
    display: flex;
    gap: 1rem;
    justify-content: flex-end;
    flex-wrap: wrap;
}

/* Timeline View */
.timeline-view[b-kflzri6o6r] {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

.timeline-container[b-kflzri6o6r] {
    position: relative;
    padding-left: 2rem;
}

.timeline-entry[b-kflzri6o6r] {
    display: flex;
    margin-bottom: 2rem;
    position: relative;
}

.timeline-marker[b-kflzri6o6r] {
    position: absolute;
    left: -2rem;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.marker-icon[b-kflzri6o6r] {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: white;
    border: 3px solid #C8A951;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #C8A951;
    font-size: 1rem;
    z-index: 2;
}

.timeline-entry.critical .marker-icon[b-kflzri6o6r] {
    border-color: #dc3545;
    color: #dc3545;
}

.timeline-entry.high .marker-icon[b-kflzri6o6r] {
    border-color: #fd7e14;
    color: #fd7e14;
}

.timeline-entry.medium .marker-icon[b-kflzri6o6r] {
    border-color: #ffc107;
    color: #ffc107;
}

.timeline-entry.low .marker-icon[b-kflzri6o6r] {
    border-color: #198754;
    color: #198754;
}

.timeline-line[b-kflzri6o6r] {
    width: 2px;
    height: 100px;
    background: #E2E6EA;
    margin-top: 40px;
}

.timeline-entry:last-child .timeline-line[b-kflzri6o6r] {
    display: none;
}

.timeline-content[b-kflzri6o6r] {
    flex: 1;
    margin-left: 1.5rem;
    padding: 1.5rem;
    border: 1px solid #E2E6EA;
    border-radius: 12px;
    background: white;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
}

.entry-header[b-kflzri6o6r] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 1rem;
}

.entry-title[b-kflzri6o6r] {
    color: #14213D;
    font-size: 1.1rem;
    font-weight: 600;
}

.entry-timestamp[b-kflzri6o6r] {
    color: #6c757d;
    font-size: 0.85rem;
    text-align: right;
}

.entry-description[b-kflzri6o6r] {
    color: #2E2E2E;
    font-size: 0.95rem;
    line-height: 1.5;
    margin-bottom: 1rem;
}

.entry-user[b-kflzri6o6r] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    color: #6c757d;
    font-size: 0.85rem;
    margin-bottom: 1rem;
}

.entry-user i[b-kflzri6o6r] {
    color: #C8A951;
}

.entry-details[b-kflzri6o6r] {
    margin-bottom: 1rem;
}

.details-toggle[b-kflzri6o6r] {
    background: none;
    border: 1px solid #E2E6EA;
    border-radius: 6px;
    padding: 0.5rem 1rem;
    color: #C8A951;
    font-size: 0.85rem;
    cursor: pointer;
    transition: all 0.3s ease;
}

.details-toggle:hover[b-kflzri6o6r] {
    background: rgba(200, 169, 81, 0.1);
    border-color: #C8A951;
}

.details-content[b-kflzri6o6r] {
    margin-top: 1rem;
    padding: 1rem;
    background: #F8F9FA;
    border: 1px solid #E2E6EA;
    border-radius: 6px;
    font-family: monospace;
    font-size: 0.85rem;
    white-space: pre-wrap;
    word-wrap: break-word;
}

.entry-meta[b-kflzri6o6r] {
    display: flex;
    gap: 1rem;
    align-items: center;
}

.severity-badge[b-kflzri6o6r] {
    padding: 0.25rem 0.75rem;
    border-radius: 12px;
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.severity-badge.critical[b-kflzri6o6r] {
    background: rgba(220, 53, 69, 0.1);
    color: #dc3545;
    border: 1px solid rgba(220, 53, 69, 0.3);
}

.severity-badge.high[b-kflzri6o6r] {
    background: rgba(253, 126, 20, 0.1);
    color: #fd7e14;
    border: 1px solid rgba(253, 126, 20, 0.3);
}

.severity-badge.medium[b-kflzri6o6r] {
    background: rgba(255, 193, 7, 0.1);
    color: #ffc107;
    border: 1px solid rgba(255, 193, 7, 0.3);
}

.severity-badge.low[b-kflzri6o6r] {
    background: rgba(25, 135, 84, 0.1);
    color: #198754;
    border: 1px solid rgba(25, 135, 84, 0.3);
}

.severity-badge.info[b-kflzri6o6r] {
    background: rgba(200, 169, 81, 0.1);
    color: #C8A951;
    border: 1px solid rgba(200, 169, 81, 0.3);
}

.ip-address[b-kflzri6o6r] {
    color: #6c757d;
    font-size: 0.8rem;
    font-family: monospace;
}

/* Table View */
.table-view[b-kflzri6o6r] {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

.audit-table[b-kflzri6o6r] {
    border: 1px solid #E2E6EA;
    border-radius: 12px;
    overflow: hidden;
    background: white;
}

.table-header[b-kflzri6o6r] {
    display: grid;
    grid-template-columns: 140px 120px 120px 100px 1fr 80px;
    background: linear-gradient(135deg, #14213D 0%, #2E2E2E 100%);
    color: white;
}

.header-cell[b-kflzri6o6r] {
    padding: 1rem;
    font-weight: 600;
    font-size: 0.9rem;
    border-right: 1px solid rgba(255, 255, 255, 0.1);
}

.header-cell:last-child[b-kflzri6o6r] {
    border-right: none;
}

.table-body[b-kflzri6o6r] {
    display: flex;
    flex-direction: column;
}

.table-row[b-kflzri6o6r] {
    display: grid;
    grid-template-columns: 140px 120px 120px 100px 1fr 80px;
    border-bottom: 1px solid #E2E6EA;
    transition: all 0.2s ease;
}

.table-row:hover[b-kflzri6o6r] {
    background: #F8F9FA;
}

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

.table-cell[b-kflzri6o6r] {
    padding: 1rem;
    display: flex;
    align-items: center;
    border-right: 1px solid #F1F3F4;
    font-size: 0.85rem;
}

.table-cell:last-child[b-kflzri6o6r] {
    border-right: none;
    justify-content: center;
}

.timestamp-content[b-kflzri6o6r] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.timestamp-content .date[b-kflzri6o6r] {
    color: #14213D;
    font-weight: 500;
}

.timestamp-content .time[b-kflzri6o6r] {
    color: #6c757d;
    font-size: 0.8rem;
    font-family: monospace;
}

.event-content[b-kflzri6o6r] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.event-content i[b-kflzri6o6r] {
    color: #C8A951;
    width: 16px;
}

.description-text[b-kflzri6o6r] {
    line-height: 1.4;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* Load More Section */
.load-more-section[b-kflzri6o6r] {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 2rem;
    padding: 2rem;
    border-top: 1px solid #E2E6EA;
}

.entries-info[b-kflzri6o6r] {
    color: #6c757d;
    font-size: 0.9rem;
}

/* View Controls */
.view-controls[b-kflzri6o6r] {
    display: flex;
    justify-content: center;
    padding: 1.5rem 0;
    border-top: 1px solid #E2E6EA;
}

.view-mode-toggle[b-kflzri6o6r] {
    display: flex;
    gap: 0.5rem;
}

/* No Entries State */
.no-entries[b-kflzri6o6r],
.no-employer-selected[b-kflzri6o6r] {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 300px;
}

.empty-state[b-kflzri6o6r] {
    text-align: center;
    max-width: 400px;
}

.empty-icon[b-kflzri6o6r] {
    width: 80px;
    height: 80px;
    border-radius: 50%;
    background: rgba(200, 169, 81, 0.1);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 2rem;
    color: #C8A951;
    margin: 0 auto 1.5rem auto;
}

.empty-state h3[b-kflzri6o6r],
.empty-state h4[b-kflzri6o6r] {
    color: #14213D;
    font-size: 1.3rem;
    font-weight: 700;
    margin: 0 0 1rem 0;
}

.empty-state p[b-kflzri6o6r] {
    color: #6c757d;
    font-size: 1rem;
    margin: 0 0 2rem 0;
    line-height: 1.5;
}

/* Special styling for audit trail card */
[b-kflzri6o6r] .iswara-card {
    border: 2px solid #E2E6EA;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.08);
}

[b-kflzri6o6r] .iswara-card .card-header {
    background: linear-gradient(135deg, #14213D 0%, #2E2E2E 100%);
    color: white;
    border-bottom: 2px solid #C8A951;
}

[b-kflzri6o6r] .iswara-card .card-header i {
    color: #C8A951;
}

/* Responsive Design */
@media (max-width: 1024px) {
    .primary-filters[b-kflzri6o6r] {
        flex-direction: column;
        align-items: stretch;
        gap: 1rem;
    }
    
    .search-filter[b-kflzri6o6r] {
        max-width: none;
    }
    
    .date-range-filters[b-kflzri6o6r] {
        justify-content: space-between;
    }
    
    .secondary-filters[b-kflzri6o6r] {
        justify-content: space-between;
    }
    
    .action-filters[b-kflzri6o6r] {
        justify-content: center;
    }
    
    .table-header[b-kflzri6o6r],
    .table-row[b-kflzri6o6r] {
        grid-template-columns: 120px 100px 100px 80px 1fr 60px;
    }
    
    .table-cell[b-kflzri6o6r] {
        padding: 0.75rem;
        font-size: 0.8rem;
    }
}

@media (max-width: 768px) {
    .employer-audit-trail[b-kflzri6o6r] {
        gap: 1.5rem;
    }
    
    .employer-header[b-kflzri6o6r] {
        flex-direction: column;
        gap: 1.5rem;
        padding: 1.5rem;
    }
    
    .employer-meta[b-kflzri6o6r] {
        flex-direction: column;
        gap: 0.75rem;
    }
    
    .audit-stats[b-kflzri6o6r] {
        align-self: stretch;
        justify-content: space-between;
    }
    
    .filter-controls-section[b-kflzri6o6r] {
        padding: 1rem;
        gap: 0.75rem;
    }
    
    .date-range-filters[b-kflzri6o6r],
    .secondary-filters[b-kflzri6o6r] {
        flex-direction: column;
        gap: 0.75rem;
    }
    
    .date-range-filters > *[b-kflzri6o6r],
    .secondary-filters > *[b-kflzri6o6r] {
        min-width: unset;
    }
    
    .action-filters[b-kflzri6o6r] {
        flex-direction: column;
    }
    
    .timeline-container[b-kflzri6o6r] {
        padding-left: 1.5rem;
    }
    
    .timeline-content[b-kflzri6o6r] {
        margin-left: 1rem;
        padding: 1rem;
    }
    
    .marker-icon[b-kflzri6o6r] {
        width: 30px;
        height: 30px;
        font-size: 0.8rem;
    }
    
    .timeline-line[b-kflzri6o6r] {
        margin-top: 30px;
        height: 80px;
    }
    
    .entry-header[b-kflzri6o6r] {
        flex-direction: column;
        gap: 0.5rem;
    }
    
    .entry-timestamp[b-kflzri6o6r] {
        text-align: left;
    }
    
    /* Hide table view on mobile, use timeline only */
    .table-view[b-kflzri6o6r] {
        display: none;
    }
    
    .view-mode-toggle[b-kflzri6o6r] {
        display: none;
    }
    
    .load-more-section[b-kflzri6o6r] {
        flex-direction: column;
        gap: 1rem;
        padding: 1.5rem;
    }
}

@media (max-width: 480px) {
    .employer-audit-trail[b-kflzri6o6r] {
        gap: 1rem;
    }
    
    .employer-header[b-kflzri6o6r] {
        padding: 1rem;
    }
    
    .employer-info h2[b-kflzri6o6r] {
        font-size: 1.5rem;
    }
    
    .audit-stats[b-kflzri6o6r] {
        flex-direction: column;
        gap: 1rem;
    }
    
    .stat-item[b-kflzri6o6r] {
        padding: 0.75rem;
    }
    
    .stat-number[b-kflzri6o6r] {
        font-size: 1.25rem;
    }
    
    .stat-label[b-kflzri6o6r] {
        font-size: 0.75rem;
    }
    
    .filter-controls-section[b-kflzri6o6r] {
        padding: 0.75rem;
    }
    
    .timeline-container[b-kflzri6o6r] {
        padding-left: 1rem;
    }
    
    .timeline-content[b-kflzri6o6r] {
        margin-left: 0.75rem;
        padding: 0.75rem;
    }
    
    .marker-icon[b-kflzri6o6r] {
        width: 25px;
        height: 25px;
        font-size: 0.7rem;
    }
    
    .timeline-line[b-kflzri6o6r] {
        margin-top: 25px;
        height: 60px;
    }
    
    .entry-title[b-kflzri6o6r] {
        font-size: 1rem;
    }
    
    .entry-description[b-kflzri6o6r] {
        font-size: 0.9rem;
    }
    
    .entry-user[b-kflzri6o6r],
    .details-toggle[b-kflzri6o6r] {
        font-size: 0.8rem;
    }
    
    .details-content[b-kflzri6o6r] {
        padding: 0.75rem;
        font-size: 0.8rem;
    }
    
    .empty-icon[b-kflzri6o6r] {
        width: 60px;
        height: 60px;
        font-size: 1.5rem;
    }
    
    .empty-state h3[b-kflzri6o6r],
    .empty-state h4[b-kflzri6o6r] {
        font-size: 1.1rem;
    }
    
    .empty-state p[b-kflzri6o6r] {
        font-size: 0.9rem;
    }
}

/* Loading states */
.audit-trail-content.loading[b-kflzri6o6r] {
    opacity: 0.6;
    pointer-events: none;
}

.audit-trail-content.loading[b-kflzri6o6r]::after {
    content: '';
    position: fixed;
    top: 50%;
    left: 50%;
    width: 40px;
    height: 40px;
    margin: -20px 0 0 -20px;
    border: 4px solid #E2E6EA;
    border-top: 4px solid #C8A951;
    border-radius: 50%;
    animation: spin-b-kflzri6o6r 1s linear infinite;
    z-index: 1000;
}

@keyframes spin-b-kflzri6o6r {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

/* Focus and accessibility improvements */
.timeline-content:focus[b-kflzri6o6r],
.table-row:focus[b-kflzri6o6r] {
    outline: 2px solid #C8A951;
    outline-offset: 2px;
}

.details-toggle:focus[b-kflzri6o6r],
.view-mode-toggle button:focus[b-kflzri6o6r],
.action-filters button:focus[b-kflzri6o6r] {
    outline: 2px solid #C8A951;
    outline-offset: 2px;
}

/* Enhanced hover effects */
.timeline-content:hover[b-kflzri6o6r] {
    transform: translateX(5px);
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.1);
}

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

/* Smooth transitions */
.timeline-content[b-kflzri6o6r],
.table-row[b-kflzri6o6r],
.stat-item[b-kflzri6o6r],
.marker-icon[b-kflzri6o6r],
.details-toggle[b-kflzri6o6r] {
    transition: all 0.3s ease;
}

/* Animation for timeline entries */
.timeline-entry[b-kflzri6o6r] {
    animation: slideInFromLeft-b-kflzri6o6r 0.5s ease;
}

@keyframes slideInFromLeft-b-kflzri6o6r {
    from {
        opacity: 0;
        transform: translateX(-20px);
    }
    to {
        opacity: 1;
        transform: translateX(0);
    }
}
/* /Features/Admin/Onboarding/Components/EmployerCreationForm.razor.rz.scp.css */
/* Main Form Container */
.employer-creation-form[b-yq89qrkp22] {
    max-width: 800px;
    margin: 0 auto;
    padding: 0;
}

/* Form Content */
.form-content[b-yq89qrkp22] {
    display: flex;
    flex-direction: column;
    gap: 2rem;
    padding: 30px;
}

/* Form Header */
.form-header[b-yq89qrkp22] {
    text-align: center;
    margin-bottom: 30px;
    padding-bottom: 20px;
    border-bottom: 2px solid #e2e6ea;
}

.form-header h2[b-yq89qrkp22] {
    color: #14213D;
    font-size: 2rem;
    font-weight: 700;
    margin: 0 0 8px 0;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
}

.form-header h2 i[b-yq89qrkp22] {
    color: #C8A951;
    font-size: 1.8rem;
}

.form-header p[b-yq89qrkp22] {
    color: #2E2E2E;
    font-size: 1.1rem;
    margin: 0;
    opacity: 0.8;
    line-height: 1.5;
}

/* Form Sections */
.form-section[b-yq89qrkp22] {
    background: #ffffff;
    border: 1px solid #e2e6ea;
    border-radius: 12px;
    padding: 24px;
    transition: all 0.3s ease;
}

.form-section:hover[b-yq89qrkp22] {
    border-color: rgba(200, 169, 81, 0.3);
    box-shadow: 0 2px 8px rgba(200, 169, 81, 0.1);
}

/* Section Headers */
.section-header[b-yq89qrkp22] {
    margin-bottom: 20px;
    padding-bottom: 12px;
    border-bottom: 1px solid #e2e6ea;
}

.section-header h3[b-yq89qrkp22] {
    color: #14213D;
    font-size: 1.3rem;
    font-weight: 600;
    margin: 0;
    display: flex;
    align-items: center;
    gap: 10px;
}

.section-header h3 i[b-yq89qrkp22] {
    color: #C8A951;
    font-size: 1.2rem;
}

/* Form Grid Layout */
.form-grid[b-yq89qrkp22] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 20px;
    align-items: start;
}

.form-group[b-yq89qrkp22] {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.form-group.full-width[b-yq89qrkp22] {
    grid-column: 1 / -1;
}

/* Form Labels */
.form-label[b-yq89qrkp22] {
    color: #14213D;
    font-weight: 600;
    font-size: 0.95rem;
    margin-bottom: 6px;
    display: block;
}

/* Tier Option Styling */
.tier-option[b-yq89qrkp22] {
    display: flex;
    flex-direction: column;
    gap: 4px;
    padding: 8px 0;
}

.tier-name[b-yq89qrkp22] {
    font-weight: 600;
    color: #14213D;
    font-size: 0.95rem;
}

.tier-description[b-yq89qrkp22] {
    color: #2E2E2E;
    font-size: 0.85rem;
    opacity: 0.7;
    line-height: 1.3;
}

/* Checkbox Styling */
.checkbox-group[b-yq89qrkp22] {
    display: flex;
    align-items: center;
    padding-top: 8px;
}

.checkbox-wrapper[b-yq89qrkp22] {
    display: flex;
    align-items: center;
}

/* Form Controls Styling */
[b-yq89qrkp22] .form-dropdown.e-dropdownlist,
[b-yq89qrkp22] .form-textarea.e-textarea {
    border: 2px solid #e2e6ea;
    border-radius: 8px;
    font-size: 1rem;
    transition: all 0.3s ease;
}

[b-yq89qrkp22] .form-dropdown.e-dropdownlist:focus,
[b-yq89qrkp22] .form-dropdown.e-dropdownlist.e-input-focus,
[b-yq89qrkp22] .form-textarea.e-textarea:focus {
    border-color: #C8A951;
    box-shadow: 0 0 0 0.2rem rgba(200, 169, 81, 0.25);
    outline: none;
}

[b-yq89qrkp22] .form-dropdown.e-dropdownlist:hover,
[b-yq89qrkp22] .form-textarea.e-textarea:hover {
    border-color: #C8A951;
}

[b-yq89qrkp22] .form-dropdown .e-ddl-icon {
    color: #C8A951;
}

/* Checkbox Styling */
[b-yq89qrkp22] .form-checkbox .e-frame {
    border: 2px solid #C8A951;
    border-radius: 4px;
    background: #ffffff;
}

[b-yq89qrkp22] .form-checkbox .e-frame.e-check {
    background-color: #C8A951;
    border-color: #C8A951;
}

[b-yq89qrkp22] .form-checkbox .e-check {
    color: #ffffff;
    font-weight: bold;
}

[b-yq89qrkp22] .form-checkbox .e-label {
    color: #14213D;
    font-weight: 500;
    margin-left: 8px;
    cursor: pointer;
}

[b-yq89qrkp22] .form-checkbox:hover .e-frame {
    background-color: rgba(200, 169, 81, 0.1);
}

/* Validation Messages */
.validation-message[b-yq89qrkp22] {
    color: #dc3545;
    font-size: 0.85rem;
    margin-top: 4px;
    display: flex;
    align-items: center;
    gap: 4px;
    min-height: 1.2rem;
}

.validation-message:not(:empty)[b-yq89qrkp22]::before {
    content: '\f071';
    font-family: 'Font Awesome 5 Free';
    font-weight: 900;
    font-size: 0.8rem;
}

/* Form Actions */
.form-actions[b-yq89qrkp22] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 24px 30px;
    background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);
    border-top: 2px solid #e2e6ea;
    margin: 0 -30px -30px -30px;
    border-radius: 0 0 12px 12px;
    gap: 16px;
}

/* Button Styling */
.form-actions .iswara-button[b-yq89qrkp22] {
    min-width: 140px;
    height: 44px;
    border-radius: 8px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    font-size: 0.85rem;
    transition: all 0.3s ease;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

.form-actions .iswara-button:hover[b-yq89qrkp22] {
    transform: translateY(-1px);
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15);
}

.form-actions .iswara-button:disabled[b-yq89qrkp22] {
    opacity: 0.6;
    transform: none !important;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1) !important;
    cursor: not-allowed;
}

/* Card Styling Override */
[b-yq89qrkp22] .iswara-card {
    border: 2px solid #e2e6ea;
    border-radius: 12px;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.08);
    overflow: hidden;
}

/* Responsive Design */
@media (max-width: 768px) {
    .employer-creation-form[b-yq89qrkp22] {
        max-width: 100%;
        margin: 0 16px;
    }
    
    .form-content[b-yq89qrkp22] {
        padding: 20px;
        gap: 1.5rem;
    }
    
    .form-header h2[b-yq89qrkp22] {
        font-size: 1.6rem;
        flex-direction: column;
        gap: 8px;
    }
    
    .form-header h2 i[b-yq89qrkp22] {
        font-size: 1.4rem;
    }
    
    .form-header p[b-yq89qrkp22] {
        font-size: 1rem;
    }
    
    .form-section[b-yq89qrkp22] {
        padding: 20px;
    }
    
    .form-grid[b-yq89qrkp22] {
        grid-template-columns: 1fr;
        gap: 16px;
    }
    
    .form-group.full-width[b-yq89qrkp22] {
        grid-column: 1;
    }
    
    .section-header h3[b-yq89qrkp22] {
        font-size: 1.2rem;
    }
    
    .form-actions[b-yq89qrkp22] {
        flex-direction: column-reverse;
        gap: 12px;
        padding: 20px;
        margin: 0 -20px -20px -20px;
    }
    
    .form-actions .iswara-button[b-yq89qrkp22] {
        width: 100%;
        min-width: auto;
    }
}

@media (max-width: 480px) {
    .employer-creation-form[b-yq89qrkp22] {
        margin: 0 8px;
    }
    
    .form-content[b-yq89qrkp22] {
        padding: 16px;
        gap: 1.25rem;
    }
    
    .form-header[b-yq89qrkp22] {
        margin-bottom: 20px;
        padding-bottom: 16px;
    }
    
    .form-header h2[b-yq89qrkp22] {
        font-size: 1.4rem;
    }
    
    .form-header p[b-yq89qrkp22] {
        font-size: 0.9rem;
    }
    
    .form-section[b-yq89qrkp22] {
        padding: 16px;
    }
    
    .section-header[b-yq89qrkp22] {
        margin-bottom: 16px;
        padding-bottom: 8px;
    }
    
    .section-header h3[b-yq89qrkp22] {
        font-size: 1.1rem;
    }
    
    .form-grid[b-yq89qrkp22] {
        gap: 12px;
    }
    
    .form-actions[b-yq89qrkp22] {
        padding: 16px;
        margin: 0 -16px -16px -16px;
    }
}

/* Loading State */
.form-content.loading[b-yq89qrkp22] {
    opacity: 0.6;
    pointer-events: none;
}

/* Focus Improvements */
[b-yq89qrkp22] .form-dropdown:focus-within,
[b-yq89qrkp22] .form-textarea:focus-within {
    border-color: #C8A951;
    box-shadow: 0 0 0 0.2rem rgba(200, 169, 81, 0.25);
}

/* Error State */
.form-group.error[b-yq89qrkp22]  .form-dropdown,
.form-group.error[b-yq89qrkp22]  .form-textarea,
.form-group.error[b-yq89qrkp22]  .iswara-form-input input {
    border-color: #dc3545;
    box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.15);
}
/* /Features/Admin/Onboarding/Components/EmployerList.razor.rz.scp.css */
.employer-list[b-x4o6jzozq4] {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

/* Employer List Content */
.employer-list-content[b-x4o6jzozq4] {
    display: flex;
    flex-direction: column;
    gap: 2rem;
}

/* Search and Filter Section */
.search-filter-section[b-x4o6jzozq4] {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    gap: 2rem;
    flex-wrap: wrap;
}

.search-controls[b-x4o6jzozq4] {
    display: flex;
    gap: 1rem;
    flex: 1;
    min-width: 300px;
}

.search-input[b-x4o6jzozq4] {
    flex: 1;
    max-width: 400px;
}

.filter-controls[b-x4o6jzozq4] {
    display: flex;
    gap: 1rem;
}

.filter-controls > *[b-x4o6jzozq4] {
    min-width: 150px;
}

.action-controls[b-x4o6jzozq4] {
    display: flex;
    gap: 1rem;
    flex-shrink: 0;
}

/* Statistics Summary */
.stats-summary[b-x4o6jzozq4] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 1.5rem;
    margin-bottom: 1rem;
}

.stat-card[b-x4o6jzozq4] {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 1.5rem;
    border: 1px solid #E2E6EA;
    border-radius: 12px;
    background: white;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
    transition: all 0.3s ease;
}

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

.stat-icon[b-x4o6jzozq4] {
    flex-shrink: 0;
    width: 50px;
    height: 50px;
    border-radius: 12px;
    background: rgba(200, 169, 81, 0.1);
    display: flex;
    align-items: center;
    justify-content: center;
    color: #C8A951;
    font-size: 1.5rem;
}

.stat-icon.active[b-x4o6jzozq4] {
    background: rgba(25, 135, 84, 0.1);
    color: #198754;
}

.stat-icon.pending[b-x4o6jzozq4] {
    background: rgba(255, 193, 7, 0.1);
    color: #ffc107;
}

.stat-icon.users[b-x4o6jzozq4] {
    background: rgba(20, 33, 61, 0.1);
    color: #14213D;
}

.stat-content[b-x4o6jzozq4] {
    flex: 1;
}

.stat-value[b-x4o6jzozq4] {
    color: #14213D;
    font-size: 2rem;
    font-weight: 700;
    line-height: 1;
    margin-bottom: 0.25rem;
}

.stat-label[b-x4o6jzozq4] {
    color: #6c757d;
    font-size: 0.9rem;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

/* Employers Grid Section */
.employers-grid-section[b-x4o6jzozq4] {
    background: white;
    border-radius: 12px;
    border: 1px solid #E2E6EA;
    overflow: hidden;
}

/* Data Grid Styling */
[b-x4o6jzozq4] .employer-data-grid {
    border: none;
}

[b-x4o6jzozq4] .employer-data-grid .e-gridheader {
    background: linear-gradient(135deg, #14213D 0%, #2E2E2E 100%);
    border-bottom: 2px solid #C8A951;
}

[b-x4o6jzozq4] .employer-data-grid .e-headercell {
    color: white;
    font-weight: 600;
    border-right: 1px solid rgba(255, 255, 255, 0.1);
}

[b-x4o6jzozq4] .employer-data-grid .e-gridcontent {
    border: none;
}

[b-x4o6jzozq4] .employer-data-grid .e-row {
    border-bottom: 1px solid #E2E6EA;
    transition: all 0.2s ease;
}

[b-x4o6jzozq4] .employer-data-grid .e-row:hover {
    background: #F8F9FA;
}

[b-x4o6jzozq4] .employer-data-grid .e-rowcell {
    border-right: 1px solid #F1F3F4;
    padding: 1rem;
}

/* Grid Cell Styling */
.employer-name-cell[b-x4o6jzozq4] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.employer-name-cell .name[b-x4o6jzozq4] {
    color: #14213D;
    font-weight: 600;
    font-size: 0.95rem;
}

.employer-name-cell .industry[b-x4o6jzozq4] {
    color: #6c757d;
    font-size: 0.8rem;
}

.contact-cell[b-x4o6jzozq4] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.contact-cell .email[b-x4o6jzozq4] {
    color: #14213D;
    font-size: 0.9rem;
}

.contact-cell .phone[b-x4o6jzozq4] {
    color: #6c757d;
    font-size: 0.8rem;
}

.user-count-cell[b-x4o6jzozq4] {
    text-align: center;
}

.user-count-cell .count[b-x4o6jzozq4] {
    color: #14213D;
    font-weight: 600;
    font-size: 1.1rem;
}

.tier-badge[b-x4o6jzozq4] {
    padding: 0.4rem 0.8rem;
    border-radius: 16px;
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    display: inline-block;
}

.tier-badge.basic[b-x4o6jzozq4] {
    background: rgba(108, 117, 125, 0.1);
    color: #6c757d;
    border: 1px solid rgba(108, 117, 125, 0.3);
}

.tier-badge.standard[b-x4o6jzozq4] {
    background: rgba(25, 135, 84, 0.1);
    color: #198754;
    border: 1px solid rgba(25, 135, 84, 0.3);
}

.tier-badge.premium[b-x4o6jzozq4] {
    background: rgba(200, 169, 81, 0.1);
    color: #C8A951;
    border: 1px solid rgba(200, 169, 81, 0.3);
}

.tier-badge.enterprise[b-x4o6jzozq4] {
    background: rgba(20, 33, 61, 0.1);
    color: #14213D;
    border: 1px solid rgba(20, 33, 61, 0.3);
}

.status-cell[b-x4o6jzozq4] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.status-badge[b-x4o6jzozq4] {
    padding: 0.3rem 0.6rem;
    border-radius: 12px;
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    text-align: center;
    letter-spacing: 0.5px;
}

.status-badge.active[b-x4o6jzozq4] {
    background: rgba(25, 135, 84, 0.1);
    color: #198754;
    border: 1px solid rgba(25, 135, 84, 0.3);
}

.status-badge.inactive[b-x4o6jzozq4] {
    background: rgba(220, 53, 69, 0.1);
    color: #dc3545;
    border: 1px solid rgba(220, 53, 69, 0.3);
}

.onboarding-badge[b-x4o6jzozq4] {
    padding: 0.2rem 0.5rem;
    border-radius: 8px;
    font-size: 0.7rem;
    font-weight: 500;
    background: rgba(255, 193, 7, 0.1);
    color: #ffc107;
    border: 1px solid rgba(255, 193, 7, 0.3);
    display: flex;
    align-items: center;
    gap: 0.25rem;
}

.onboarding-badge i[b-x4o6jzozq4] {
    font-size: 0.6rem;
}

.date-cell[b-x4o6jzozq4] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.date-cell .date[b-x4o6jzozq4] {
    color: #14213D;
    font-size: 0.9rem;
    font-weight: 500;
}

.date-cell .time[b-x4o6jzozq4] {
    color: #6c757d;
    font-size: 0.8rem;
}

.actions-cell[b-x4o6jzozq4] {
    display: flex;
    gap: 0.5rem;
    justify-content: center;
}

/* Bulk Actions Section */
.bulk-actions-section[b-x4o6jzozq4] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1rem;
    border: 2px solid #C8A951;
    border-radius: 12px;
    background: linear-gradient(135deg, rgba(200, 169, 81, 0.05) 0%, rgba(200, 169, 81, 0.02) 100%);
}

.selection-info[b-x4o6jzozq4] {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.selected-count[b-x4o6jzozq4] {
    color: #14213D;
    font-weight: 600;
    font-size: 0.95rem;
}

.bulk-actions[b-x4o6jzozq4] {
    display: flex;
    gap: 1rem;
}

/* Special styling for employer list card */
[b-x4o6jzozq4] .iswara-card {
    border: 2px solid #E2E6EA;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.08);
}

[b-x4o6jzozq4] .iswara-card .card-header {
    background: linear-gradient(135deg, #14213D 0%, #2E2E2E 100%);
    color: white;
    border-bottom: 2px solid #C8A951;
}

[b-x4o6jzozq4] .iswara-card .card-header i {
    color: #C8A951;
}

/* Responsive Design */
@media (max-width: 1200px) {
    .search-filter-section[b-x4o6jzozq4] {
        flex-direction: column;
        align-items: stretch;
        gap: 1rem;
    }
    
    .search-controls[b-x4o6jzozq4] {
        flex-direction: column;
        min-width: unset;
    }
    
    .filter-controls[b-x4o6jzozq4] {
        flex-wrap: wrap;
    }
    
    .action-controls[b-x4o6jzozq4] {
        justify-content: center;
        flex-wrap: wrap;
    }
    
    .stats-summary[b-x4o6jzozq4] {
        grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
        gap: 1rem;
    }
}

@media (max-width: 768px) {
    .employer-list-content[b-x4o6jzozq4] {
        gap: 1.5rem;
    }
    
    .search-controls[b-x4o6jzozq4] {
        gap: 0.75rem;
    }
    
    .filter-controls[b-x4o6jzozq4] {
        gap: 0.75rem;
    }
    
    .filter-controls > *[b-x4o6jzozq4] {
        min-width: 120px;
    }
    
    .action-controls[b-x4o6jzozq4] {
        gap: 0.75rem;
    }
    
    .stats-summary[b-x4o6jzozq4] {
        grid-template-columns: repeat(2, 1fr);
        gap: 0.75rem;
    }
    
    .stat-card[b-x4o6jzozq4] {
        padding: 1rem;
        flex-direction: column;
        text-align: center;
        gap: 0.75rem;
    }
    
    .stat-icon[b-x4o6jzozq4] {
        width: 40px;
        height: 40px;
        font-size: 1.2rem;
    }
    
    .stat-value[b-x4o6jzozq4] {
        font-size: 1.5rem;
    }
    
    .stat-label[b-x4o6jzozq4] {
        font-size: 0.8rem;
    }
    
    /* Hide less important columns on mobile */
    [b-x4o6jzozq4] .employer-data-grid .e-headercell:nth-child(n+4),
    [b-x4o6jzozq4] .employer-data-grid .e-rowcell:nth-child(n+4) {
        display: none;
    }
    
    .bulk-actions-section[b-x4o6jzozq4] {
        flex-direction: column;
        gap: 1rem;
        text-align: center;
    }
    
    .bulk-actions[b-x4o6jzozq4] {
        justify-content: center;
        flex-wrap: wrap;
    }
}

@media (max-width: 480px) {
    .employer-list[b-x4o6jzozq4] {
        gap: 1rem;
    }
    
    .employer-list-content[b-x4o6jzozq4] {
        gap: 1rem;
    }
    
    .search-filter-section[b-x4o6jzozq4] {
        gap: 0.75rem;
    }
    
    .filter-controls[b-x4o6jzozq4] {
        flex-direction: column;
    }
    
    .filter-controls > *[b-x4o6jzozq4] {
        min-width: unset;
    }
    
    .action-controls[b-x4o6jzozq4] {
        flex-direction: column;
    }
    
    .stats-summary[b-x4o6jzozq4] {
        grid-template-columns: 1fr;
        gap: 0.5rem;
    }
    
    .stat-card[b-x4o6jzozq4] {
        padding: 0.75rem;
    }
    
    .stat-icon[b-x4o6jzozq4] {
        width: 35px;
        height: 35px;
        font-size: 1rem;
    }
    
    .stat-value[b-x4o6jzozq4] {
        font-size: 1.25rem;
    }
    
    .stat-label[b-x4o6jzozq4] {
        font-size: 0.75rem;
    }
    
    /* Show only essential columns on small mobile */
    [b-x4o6jzozq4] .employer-data-grid .e-headercell:nth-child(n+3),
    [b-x4o6jzozq4] .employer-data-grid .e-rowcell:nth-child(n+3) {
        display: none;
    }
    
    .bulk-actions[b-x4o6jzozq4] {
        flex-direction: column;
    }
    
    .selection-info[b-x4o6jzozq4] {
        flex-direction: column;
        gap: 0.5rem;
    }
}

/* Loading states */
.employers-grid-section.loading[b-x4o6jzozq4] {
    opacity: 0.6;
    pointer-events: none;
}

.employers-grid-section.loading[b-x4o6jzozq4]::after {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    width: 32px;
    height: 32px;
    margin: -16px 0 0 -16px;
    border: 3px solid #E2E6EA;
    border-top: 3px solid #C8A951;
    border-radius: 50%;
    animation: spin-b-x4o6jzozq4 1s linear infinite;
}

@keyframes spin-b-x4o6jzozq4 {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

/* Focus and accessibility improvements */
[b-x4o6jzozq4] .employer-data-grid .e-row:focus {
    outline: 2px solid #C8A951;
    outline-offset: -2px;
}

.bulk-actions button:focus[b-x4o6jzozq4],
.action-controls button:focus[b-x4o6jzozq4] {
    outline: 2px solid #C8A951;
    outline-offset: 2px;
}

/* Enhanced hover effects */
.stat-card:hover .stat-icon[b-x4o6jzozq4] {
    transform: scale(1.1);
}

.actions-cell button:hover[b-x4o6jzozq4] {
    transform: translateY(-1px);
}

/* Smooth transitions */
.stat-card[b-x4o6jzozq4],
.stat-icon[b-x4o6jzozq4],
.actions-cell button[b-x4o6jzozq4] {
    transition: all 0.3s ease;
}

/* Custom scrollbar for grid content */
[b-x4o6jzozq4] .employer-data-grid .e-gridcontent::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}

[b-x4o6jzozq4] .employer-data-grid .e-gridcontent::-webkit-scrollbar-track {
    background: #F1F3F4;
    border-radius: 4px;
}

[b-x4o6jzozq4] .employer-data-grid .e-gridcontent::-webkit-scrollbar-thumb {
    background: #C8A951;
    border-radius: 4px;
}

[b-x4o6jzozq4] .employer-data-grid .e-gridcontent::-webkit-scrollbar-thumb:hover {
    background: #B8965A;
}
/* /Features/Admin/Onboarding/Components/EmployerOnboardingDashboard.razor.rz.scp.css */
.employer-onboarding-dashboard[b-g6m9t25a5t] {
    display: flex;
    flex-direction: column;
    gap: 2rem;
}

/* Quick Actions Grid */
.quick-actions-grid[b-g6m9t25a5t] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 1.5rem;
    margin-bottom: 2rem;
}

.quick-action[b-g6m9t25a5t] {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 1.5rem;
    border: 2px solid #E2E6EA;
    border-radius: 12px;
    background: white;
    cursor: pointer;
    transition: all 0.3s ease;
}

.quick-action:hover[b-g6m9t25a5t] {
    transform: translateY(-2px);
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.1);
    border-color: #C8A951;
}

.action-icon[b-g6m9t25a5t] {
    flex-shrink: 0;
    width: 50px;
    height: 50px;
    border-radius: 12px;
    background: rgba(200, 169, 81, 0.1);
    display: flex;
    align-items: center;
    justify-content: center;
    color: #C8A951;
    font-size: 1.5rem;
}

.action-content[b-g6m9t25a5t] {
    flex: 1;
}

.action-content h4[b-g6m9t25a5t] {
    color: #14213D;
    font-size: 1.1rem;
    font-weight: 600;
    margin: 0 0 0.25rem 0;
}

.action-content p[b-g6m9t25a5t] {
    color: #2E2E2E;
    font-size: 0.9rem;
    margin: 0;
    line-height: 1.3;
}

/* Recent Employers Section */
.recent-employers-section[b-g6m9t25a5t] {
    margin-bottom: 2rem;
}

.employers-list[b-g6m9t25a5t] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.employer-item[b-g6m9t25a5t] {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 1.25rem;
    border: 1px solid #E2E6EA;
    border-radius: 8px;
    background: white;
    cursor: pointer;
    transition: all 0.3s ease;
}

.employer-item:hover[b-g6m9t25a5t] {
    border-color: #C8A951;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
}

.employer-info[b-g6m9t25a5t] {
    flex: 1;
}

.employer-name[b-g6m9t25a5t] {
    color: #14213D;
    font-size: 1.1rem;
    font-weight: 600;
    margin-bottom: 0.5rem;
}

.employer-meta[b-g6m9t25a5t] {
    display: flex;
    gap: 1.5rem;
    color: #6c757d;
    font-size: 0.85rem;
}

.employer-meta span[b-g6m9t25a5t] {
    display: flex;
    align-items: center;
    gap: 0.25rem;
}

.employer-meta i[b-g6m9t25a5t] {
    color: #C8A951;
    width: 12px;
}

.employer-status[b-g6m9t25a5t] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    align-items: flex-end;
}

.status-badge[b-g6m9t25a5t] {
    padding: 0.25rem 0.75rem;
    border-radius: 12px;
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.status-badge.active[b-g6m9t25a5t] {
    background: rgba(25, 135, 84, 0.1);
    color: #198754;
    border: 1px solid rgba(25, 135, 84, 0.3);
}

.status-badge.inactive[b-g6m9t25a5t] {
    background: rgba(220, 53, 69, 0.1);
    color: #dc3545;
    border: 1px solid rgba(220, 53, 69, 0.3);
}

.onboarding-badge[b-g6m9t25a5t] {
    padding: 0.25rem 0.75rem;
    border-radius: 12px;
    font-size: 0.75rem;
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 0.25rem;
}

.onboarding-badge.pending[b-g6m9t25a5t] {
    background: rgba(255, 193, 7, 0.1);
    color: #ffc107;
    border: 1px solid rgba(255, 193, 7, 0.3);
}

.employer-actions[b-g6m9t25a5t] {
    color: #C8A951;
    font-size: 1.2rem;
}

/* Pending Actions Section */
.pending-actions-section[b-g6m9t25a5t] {
    margin-bottom: 2rem;
}

[b-g6m9t25a5t] .pending-actions-card {
    border: 2px solid #ffc107;
    background: linear-gradient(135deg, rgba(255, 193, 7, 0.05) 0%, rgba(255, 193, 7, 0.02) 100%);
}

.pending-actions-list[b-g6m9t25a5t] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.pending-action[b-g6m9t25a5t] {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 1rem;
    border: 1px solid #E2E6EA;
    border-radius: 8px;
    background: white;
    cursor: pointer;
    transition: all 0.3s ease;
}

.pending-action:hover[b-g6m9t25a5t] {
    border-color: #C8A951;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
}

.action-priority[b-g6m9t25a5t] {
    flex-shrink: 0;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.85rem;
}

.action-priority.high[b-g6m9t25a5t] {
    background: rgba(220, 53, 69, 0.1);
    color: #dc3545;
}

.action-priority.medium[b-g6m9t25a5t] {
    background: rgba(255, 193, 7, 0.1);
    color: #ffc107;
}

.action-priority.low[b-g6m9t25a5t] {
    background: rgba(108, 117, 125, 0.1);
    color: #6c757d;
}

.action-details[b-g6m9t25a5t] {
    flex: 1;
}

.action-title[b-g6m9t25a5t] {
    color: #14213D;
    font-weight: 600;
    font-size: 0.95rem;
    margin-bottom: 0.25rem;
}

.action-description[b-g6m9t25a5t] {
    color: #2E2E2E;
    font-size: 0.85rem;
    margin-bottom: 0.25rem;
}

.action-employer[b-g6m9t25a5t] {
    color: #6c757d;
    font-size: 0.8rem;
}

.action-meta[b-g6m9t25a5t] {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 0.5rem;
}

.action-due[b-g6m9t25a5t] {
    color: #6c757d;
    font-size: 0.8rem;
}

.action-arrow[b-g6m9t25a5t] {
    color: #C8A951;
    font-size: 1rem;
}

/* Recent Activity Section */
.recent-activity-section[b-g6m9t25a5t] {
    margin-bottom: 2rem;
}

.activity-timeline[b-g6m9t25a5t] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.activity-item[b-g6m9t25a5t] {
    display: flex;
    gap: 1rem;
    padding: 1rem;
    border-radius: 8px;
    border: 1px solid #E2E6EA;
    background: white;
    transition: all 0.3s ease;
}

.activity-item:hover[b-g6m9t25a5t] {
    background: #F8F9FA;
    border-color: #C8A951;
}

.activity-icon[b-g6m9t25a5t] {
    flex-shrink: 0;
    width: 35px;
    height: 35px;
    border-radius: 50%;
    background: rgba(200, 169, 81, 0.1);
    display: flex;
    align-items: center;
    justify-content: center;
    color: #C8A951;
    font-size: 1rem;
}

.activity-content[b-g6m9t25a5t] {
    flex: 1;
}

.activity-header[b-g6m9t25a5t] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 0.5rem;
}

.activity-title[b-g6m9t25a5t] {
    color: #14213D;
    font-weight: 600;
    font-size: 0.95rem;
}

.activity-time[b-g6m9t25a5t] {
    color: #6c757d;
    font-size: 0.8rem;
}

.activity-description[b-g6m9t25a5t] {
    color: #2E2E2E;
    font-size: 0.85rem;
    margin-bottom: 0.25rem;
    line-height: 1.4;
}

.activity-employer[b-g6m9t25a5t] {
    color: #6c757d;
    font-size: 0.8rem;
}

/* View All Section */
.view-all-section[b-g6m9t25a5t] {
    margin-top: 1.5rem;
    text-align: center;
    padding-top: 1rem;
    border-top: 1px solid #E2E6EA;
}

/* Responsive Design */
@media (max-width: 768px) {
    .quick-actions-grid[b-g6m9t25a5t] {
        grid-template-columns: 1fr;
        gap: 1rem;
    }
    
    .quick-action[b-g6m9t25a5t] {
        flex-direction: column;
        text-align: center;
        padding: 1.25rem;
    }
    
    .employer-item[b-g6m9t25a5t] {
        flex-direction: column;
        align-items: flex-start;
        gap: 1rem;
    }
    
    .employer-status[b-g6m9t25a5t] {
        align-items: flex-start;
        flex-direction: row;
        gap: 0.75rem;
    }
    
    .employer-meta[b-g6m9t25a5t] {
        flex-direction: column;
        gap: 0.5rem;
    }
    
    .pending-action[b-g6m9t25a5t] {
        flex-direction: column;
        align-items: flex-start;
        gap: 1rem;
    }
    
    .action-meta[b-g6m9t25a5t] {
        align-items: flex-start;
        flex-direction: row;
        justify-content: space-between;
        width: 100%;
    }
    
    .activity-item[b-g6m9t25a5t] {
        flex-direction: column;
        text-align: center;
    }
    
    .activity-header[b-g6m9t25a5t] {
        flex-direction: column;
        gap: 0.25rem;
    }
}

@media (max-width: 480px) {
    .employer-onboarding-dashboard[b-g6m9t25a5t] {
        gap: 1.5rem;
    }
    
    .quick-action[b-g6m9t25a5t] {
        padding: 1rem;
    }
    
    .action-icon[b-g6m9t25a5t] {
        width: 40px;
        height: 40px;
        font-size: 1.2rem;
    }
    
    .employer-item[b-g6m9t25a5t],
    .pending-action[b-g6m9t25a5t],
    .activity-item[b-g6m9t25a5t] {
        padding: 1rem;
    }
}
/* /Features/Admin/Onboarding/Components/EmployerStatusViewer.razor.rz.scp.css */
.employer-status-viewer[b-fvttlg17l6] {
    display: flex;
    flex-direction: column;
    gap: 2rem;
    max-width: 1200px;
    margin: 0 auto;
}

/* Status Header */
.status-header[b-fvttlg17l6] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    padding: 2rem;
    border: 2px solid #E2E6EA;
    border-radius: 16px;
    background: linear-gradient(135deg, rgba(200, 169, 81, 0.05) 0%, rgba(200, 169, 81, 0.02) 100%);
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.08);
}

.employer-info h2[b-fvttlg17l6] {
    color: #14213D;
    font-size: 2rem;
    font-weight: 700;
    margin: 0 0 1rem 0;
}

.employer-meta[b-fvttlg17l6] {
    display: flex;
    gap: 2rem;
    color: #6c757d;
    font-size: 0.95rem;
}

.employer-meta span[b-fvttlg17l6] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.employer-meta i[b-fvttlg17l6] {
    color: #C8A951;
    width: 16px;
}

.status-badges[b-fvttlg17l6] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    align-items: flex-end;
}

.status-badge[b-fvttlg17l6] {
    padding: 0.5rem 1rem;
    border-radius: 20px;
    font-size: 0.85rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.status-badge.active[b-fvttlg17l6] {
    background: rgba(25, 135, 84, 0.1);
    color: #198754;
    border: 2px solid rgba(25, 135, 84, 0.3);
}

.status-badge.inactive[b-fvttlg17l6] {
    background: rgba(220, 53, 69, 0.1);
    color: #dc3545;
    border: 2px solid rgba(220, 53, 69, 0.3);
}

.tier-badge[b-fvttlg17l6] {
    padding: 0.5rem 1rem;
    border-radius: 20px;
    font-size: 0.8rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.tier-badge.basic[b-fvttlg17l6] {
    background: rgba(108, 117, 125, 0.1);
    color: #6c757d;
    border: 2px solid rgba(108, 117, 125, 0.3);
}

.tier-badge.standard[b-fvttlg17l6] {
    background: rgba(25, 135, 84, 0.1);
    color: #198754;
    border: 2px solid rgba(25, 135, 84, 0.3);
}

.tier-badge.premium[b-fvttlg17l6] {
    background: rgba(200, 169, 81, 0.1);
    color: #C8A951;
    border: 2px solid rgba(200, 169, 81, 0.3);
}

.tier-badge.enterprise[b-fvttlg17l6] {
    background: rgba(20, 33, 61, 0.1);
    color: #14213D;
    border: 2px solid rgba(20, 33, 61, 0.3);
}

/* Status Overview */
.status-overview[b-fvttlg17l6] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 2rem;
}

/* Onboarding Progress */
.onboarding-progress[b-fvttlg17l6] {
    display: flex;
    flex-direction: column;
    gap: 2rem;
}

.progress-summary[b-fvttlg17l6] {
    display: flex;
    align-items: center;
    gap: 2rem;
}

.progress-details h4[b-fvttlg17l6] {
    color: #14213D;
    font-size: 1.3rem;
    font-weight: 700;
    margin: 0 0 0.5rem 0;
}

.progress-details p[b-fvttlg17l6] {
    color: #6c757d;
    font-size: 0.95rem;
    margin: 0 0 1rem 0;
}

.next-step[b-fvttlg17l6] {
    color: #C8A951;
    font-size: 0.9rem;
    font-weight: 500;
}

.next-step strong[b-fvttlg17l6] {
    color: #14213D;
}

.progress-checklist[b-fvttlg17l6] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.checklist-item[b-fvttlg17l6] {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 1rem;
    border: 1px solid #E2E6EA;
    border-radius: 8px;
    background: white;
    transition: all 0.3s ease;
}

.checklist-item.completed[b-fvttlg17l6] {
    background: rgba(25, 135, 84, 0.05);
    border-color: rgba(25, 135, 84, 0.3);
}

.checklist-item.required:not(.completed)[b-fvttlg17l6] {
    background: rgba(255, 193, 7, 0.05);
    border-color: rgba(255, 193, 7, 0.3);
}

.check-icon[b-fvttlg17l6] {
    flex-shrink: 0;
    font-size: 1.2rem;
}

.checklist-item.completed .check-icon[b-fvttlg17l6] {
    color: #198754;
}

.checklist-item.required:not(.completed) .check-icon[b-fvttlg17l6] {
    color: #ffc107;
}

.checklist-item:not(.completed):not(.required) .check-icon[b-fvttlg17l6] {
    color: #6c757d;
}

.step-details[b-fvttlg17l6] {
    flex: 1;
}

.step-name[b-fvttlg17l6] {
    color: #14213D;
    font-weight: 600;
    font-size: 0.95rem;
    margin-bottom: 0.25rem;
}

.step-description[b-fvttlg17l6] {
    color: #6c757d;
    font-size: 0.85rem;
    margin-bottom: 0.25rem;
}

.completion-date[b-fvttlg17l6] {
    color: #198754;
    font-size: 0.8rem;
    font-style: italic;
}

.step-action[b-fvttlg17l6] {
    flex-shrink: 0;
}

/* System Status */
.system-status[b-fvttlg17l6] {
    display: flex;
    flex-direction: column;
    gap: 2rem;
}

.status-metrics[b-fvttlg17l6] {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

.metric-item[b-fvttlg17l6] {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 1rem;
    border: 1px solid #E2E6EA;
    border-radius: 8px;
    background: white;
}

.metric-icon[b-fvttlg17l6] {
    flex-shrink: 0;
    width: 45px;
    height: 45px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.2rem;
}

.metric-icon.healthy[b-fvttlg17l6] {
    background: rgba(25, 135, 84, 0.1);
    color: #198754;
}

.metric-icon.usage[b-fvttlg17l6] {
    background: rgba(200, 169, 81, 0.1);
    color: #C8A951;
}

.metric-icon.storage[b-fvttlg17l6] {
    background: rgba(20, 33, 61, 0.1);
    color: #14213D;
}

.metric-details[b-fvttlg17l6] {
    flex: 1;
}

.metric-value[b-fvttlg17l6] {
    color: #14213D;
    font-size: 1.1rem;
    font-weight: 700;
    margin-bottom: 0.25rem;
}

.metric-label[b-fvttlg17l6] {
    color: #6c757d;
    font-size: 0.85rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.recent-activity h5[b-fvttlg17l6] {
    color: #14213D;
    font-size: 1rem;
    font-weight: 600;
    margin: 0 0 1rem 0;
}

.activity-list[b-fvttlg17l6] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.activity-item[b-fvttlg17l6] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.75rem;
    border: 1px solid #E2E6EA;
    border-radius: 6px;
    background: #F8F9FA;
}

.activity-icon[b-fvttlg17l6] {
    flex-shrink: 0;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    background: rgba(200, 169, 81, 0.1);
    display: flex;
    align-items: center;
    justify-content: center;
    color: #C8A951;
    font-size: 0.9rem;
}

.activity-content[b-fvttlg17l6] {
    flex: 1;
}

.activity-title[b-fvttlg17l6] {
    color: #14213D;
    font-size: 0.85rem;
    font-weight: 500;
    margin-bottom: 0.25rem;
}

.activity-time[b-fvttlg17l6] {
    color: #6c757d;
    font-size: 0.75rem;
}

/* Detailed Status */
.detailed-status[b-fvttlg17l6] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 2rem;
}

/* Subscription Details */
.subscription-details[b-fvttlg17l6] {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

.subscription-info[b-fvttlg17l6] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.info-row[b-fvttlg17l6] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.75rem 0;
    border-bottom: 1px solid #E2E6EA;
}

.info-row:last-child[b-fvttlg17l6] {
    border-bottom: none;
}

.info-row .label[b-fvttlg17l6] {
    color: #6c757d;
    font-weight: 500;
    font-size: 0.9rem;
}

.info-row .value[b-fvttlg17l6] {
    color: #14213D;
    font-weight: 600;
    font-size: 0.95rem;
}

.tier-value[b-fvttlg17l6] {
    padding: 0.25rem 0.75rem;
    border-radius: 12px;
    font-size: 0.8rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.usage-progress[b-fvttlg17l6] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.usage-header[b-fvttlg17l6] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    color: #14213D;
    font-size: 0.9rem;
    font-weight: 500;
}

/* User Management */
.user-management[b-fvttlg17l6] {
    display: flex;
    flex-direction: column;
    gap: 2rem;
}

.user-stats[b-fvttlg17l6] {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
}

.user-stat[b-fvttlg17l6] {
    text-align: center;
    padding: 1rem;
    border: 1px solid #E2E6EA;
    border-radius: 8px;
    background: #F8F9FA;
    flex: 1;
}

.stat-number[b-fvttlg17l6] {
    color: #14213D;
    font-size: 1.5rem;
    font-weight: 700;
    margin-bottom: 0.25rem;
}

.stat-label[b-fvttlg17l6] {
    color: #6c757d;
    font-size: 0.8rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.recent-user-actions h5[b-fvttlg17l6] {
    color: #14213D;
    font-size: 1rem;
    font-weight: 600;
    margin: 0 0 1rem 0;
}

.user-actions-list[b-fvttlg17l6] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.user-action-item[b-fvttlg17l6] {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
    padding: 0.75rem;
    border: 1px solid #E2E6EA;
    border-radius: 6px;
    background: white;
}

.action-icon[b-fvttlg17l6] {
    flex-shrink: 0;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    background: rgba(200, 169, 81, 0.1);
    display: flex;
    align-items: center;
    justify-content: center;
    color: #C8A951;
    font-size: 0.9rem;
}

.action-details[b-fvttlg17l6] {
    flex: 1;
}

.action-description[b-fvttlg17l6] {
    color: #14213D;
    font-size: 0.85rem;
    font-weight: 500;
    margin-bottom: 0.25rem;
}

.action-user[b-fvttlg17l6] {
    color: #6c757d;
    font-size: 0.8rem;
    margin-bottom: 0.25rem;
}

.action-time[b-fvttlg17l6] {
    color: #6c757d;
    font-size: 0.75rem;
}

/* Status Actions */
.status-actions[b-fvttlg17l6] {
    display: flex;
    gap: 1rem;
    justify-content: center;
    padding: 2rem 0;
    border-top: 1px solid #E2E6EA;
}

/* No Employer Selected */
.no-employer-selected[b-fvttlg17l6] {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 400px;
}

.empty-state[b-fvttlg17l6] {
    text-align: center;
    max-width: 400px;
}

.empty-icon[b-fvttlg17l6] {
    width: 80px;
    height: 80px;
    border-radius: 50%;
    background: rgba(200, 169, 81, 0.1);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 2rem;
    color: #C8A951;
    margin: 0 auto 1.5rem auto;
}

.empty-state h3[b-fvttlg17l6] {
    color: #14213D;
    font-size: 1.5rem;
    font-weight: 700;
    margin: 0 0 1rem 0;
}

.empty-state p[b-fvttlg17l6] {
    color: #6c757d;
    font-size: 1rem;
    margin: 0 0 2rem 0;
    line-height: 1.5;
}

/* Responsive Design */
@media (max-width: 1024px) {
    .status-overview[b-fvttlg17l6],
    .detailed-status[b-fvttlg17l6] {
        grid-template-columns: 1fr;
        gap: 1.5rem;
    }
    
    .progress-summary[b-fvttlg17l6] {
        flex-direction: column;
        align-items: center;
        text-align: center;
        gap: 1.5rem;
    }
    
    .user-stats[b-fvttlg17l6] {
        flex-direction: column;
    }
}

@media (max-width: 768px) {
    .employer-status-viewer[b-fvttlg17l6] {
        gap: 1.5rem;
    }
    
    .status-header[b-fvttlg17l6] {
        flex-direction: column;
        gap: 1.5rem;
        padding: 1.5rem;
    }
    
    .status-badges[b-fvttlg17l6] {
        align-items: flex-start;
        flex-direction: row;
        gap: 1rem;
    }
    
    .employer-info h2[b-fvttlg17l6] {
        font-size: 1.5rem;
    }
    
    .employer-meta[b-fvttlg17l6] {
        flex-direction: column;
        gap: 0.75rem;
    }
    
    .status-overview[b-fvttlg17l6],
    .detailed-status[b-fvttlg17l6] {
        gap: 1rem;
    }
    
    .status-actions[b-fvttlg17l6] {
        flex-wrap: wrap;
        gap: 0.75rem;
    }
    
    .status-metrics[b-fvttlg17l6] {
        gap: 1rem;
    }
    
    .metric-item[b-fvttlg17l6] {
        padding: 0.75rem;
    }
    
    .checklist-item[b-fvttlg17l6] {
        padding: 0.75rem;
    }
}

@media (max-width: 480px) {
    .employer-status-viewer[b-fvttlg17l6] {
        gap: 1rem;
    }
    
    .status-header[b-fvttlg17l6] {
        padding: 1rem;
    }
    
    .employer-info h2[b-fvttlg17l6] {
        font-size: 1.3rem;
    }
    
    .status-badges[b-fvttlg17l6] {
        flex-direction: column;
        gap: 0.75rem;
    }
    
    .status-actions[b-fvttlg17l6] {
        flex-direction: column;
    }
    
    .progress-summary[b-fvttlg17l6] {
        gap: 1rem;
    }
    
    .user-stats[b-fvttlg17l6] {
        gap: 0.75rem;
    }
    
    .user-stat[b-fvttlg17l6] {
        padding: 0.75rem;
    }
    
    .stat-number[b-fvttlg17l6] {
        font-size: 1.25rem;
    }
    
    .empty-icon[b-fvttlg17l6] {
        width: 60px;
        height: 60px;
        font-size: 1.5rem;
    }
    
    .empty-state h3[b-fvttlg17l6] {
        font-size: 1.25rem;
    }
    
    .empty-state p[b-fvttlg17l6] {
        font-size: 0.9rem;
    }
}

/* Loading states */
.employer-status-viewer.loading[b-fvttlg17l6] {
    opacity: 0.6;
    pointer-events: none;
}

.employer-status-viewer.loading[b-fvttlg17l6]::after {
    content: '';
    position: fixed;
    top: 50%;
    left: 50%;
    width: 40px;
    height: 40px;
    margin: -20px 0 0 -20px;
    border: 4px solid #E2E6EA;
    border-top: 4px solid #C8A951;
    border-radius: 50%;
    animation: spin-b-fvttlg17l6 1s linear infinite;
    z-index: 1000;
}

@keyframes spin-b-fvttlg17l6 {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

/* Focus and accessibility improvements */
.checklist-item:focus[b-fvttlg17l6],
.metric-item:focus[b-fvttlg17l6],
.activity-item:focus[b-fvttlg17l6],
.user-action-item:focus[b-fvttlg17l6] {
    outline: 2px solid #C8A951;
    outline-offset: 2px;
}

.status-actions button:focus[b-fvttlg17l6] {
    outline: 2px solid #C8A951;
    outline-offset: 2px;
}

/* Enhanced hover effects */
.checklist-item:hover[b-fvttlg17l6],
.metric-item:hover[b-fvttlg17l6],
.activity-item:hover[b-fvttlg17l6],
.user-action-item:hover[b-fvttlg17l6] {
    background: #F8F9FA;
    border-color: #C8A951;
}

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

/* Smooth transitions */
.checklist-item[b-fvttlg17l6],
.metric-item[b-fvttlg17l6],
.activity-item[b-fvttlg17l6],
.user-action-item[b-fvttlg17l6],
.user-stat[b-fvttlg17l6] {
    transition: all 0.3s ease;
}
/* /Features/Admin/Onboarding/Components/EmployerUserForm.razor.rz.scp.css */
/* Main Form Container */
.employer-user-form[b-n8m4f68okh] {
    max-width: 700px;
    margin: 0 auto;
    padding: 0;
}

/* User Form Content */
.user-form-content[b-n8m4f68okh] {
    display: flex;
    flex-direction: column;
    gap: 2rem;
    padding: 30px;
}

/* Form Header */
.form-header[b-n8m4f68okh] {
    text-align: center;
    margin-bottom: 30px;
    padding-bottom: 20px;
    border-bottom: 2px solid #e2e6ea;
}

.form-header h2[b-n8m4f68okh] {
    color: #14213D;
    font-size: 2rem;
    font-weight: 700;
    margin: 0 0 8px 0;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
}

.form-header h2 i[b-n8m4f68okh] {
    color: #C8A951;
    font-size: 1.8rem;
}

.form-header p[b-n8m4f68okh] {
    color: #2E2E2E;
    font-size: 1.1rem;
    margin: 0;
    opacity: 0.8;
    line-height: 1.5;
}

/* Form Sections */
.form-section[b-n8m4f68okh] {
    background: #ffffff;
    border: 1px solid #e2e6ea;
    border-radius: 12px;
    padding: 24px;
    transition: all 0.3s ease;
}

.form-section:hover[b-n8m4f68okh] {
    border-color: rgba(200, 169, 81, 0.3);
    box-shadow: 0 2px 8px rgba(200, 169, 81, 0.1);
}

/* Section Headers */
.section-header[b-n8m4f68okh] {
    margin-bottom: 20px;
    padding-bottom: 12px;
    border-bottom: 1px solid #e2e6ea;
}

.section-header h3[b-n8m4f68okh] {
    color: #14213D;
    font-size: 1.3rem;
    font-weight: 600;
    margin: 0;
    display: flex;
    align-items: center;
    gap: 10px;
}

.section-header h3 i[b-n8m4f68okh] {
    color: #C8A951;
    font-size: 1.2rem;
}

/* Form Grid Layout */
.form-grid[b-n8m4f68okh] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 20px;
    align-items: start;
}

.form-group[b-n8m4f68okh] {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.form-group.full-width[b-n8m4f68okh] {
    grid-column: 1 / -1;
}

/* Form Labels */
.form-label[b-n8m4f68okh] {
    color: #14213D;
    font-weight: 600;
    font-size: 0.95rem;
    margin-bottom: 6px;
    display: block;
}

/* Password Help Text */
.password-help[b-n8m4f68okh] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 12px 16px;
    background: linear-gradient(135deg, rgba(200, 169, 81, 0.08) 0%, rgba(200, 169, 81, 0.04) 100%);
    border: 1px solid rgba(200, 169, 81, 0.2);
    border-radius: 8px;
    color: #14213D;
    font-size: 0.9rem;
    font-weight: 500;
    line-height: 1.4;
}

.password-help i[b-n8m4f68okh] {
    color: #C8A951;
    font-size: 1rem;
    flex-shrink: 0;
}

/* Form Controls Styling */
[b-n8m4f68okh] .form-dropdown.e-dropdownlist {
    border: 2px solid #e2e6ea;
    border-radius: 8px;
    font-size: 1rem;
    transition: all 0.3s ease;
}

[b-n8m4f68okh] .form-dropdown.e-dropdownlist:focus,
[b-n8m4f68okh] .form-dropdown.e-dropdownlist.e-input-focus {
    border-color: #C8A951;
    box-shadow: 0 0 0 0.2rem rgba(200, 169, 81, 0.25);
    outline: none;
}

[b-n8m4f68okh] .form-dropdown.e-dropdownlist:hover {
    border-color: #C8A951;
}

[b-n8m4f68okh] .form-dropdown .e-ddl-icon {
    color: #C8A951;
}

/* Dropdown Popup Styling */
[b-n8m4f68okh] .e-popup.e-ddl.e-popup-open {
    border: 1px solid #C8A951;
    border-radius: 8px;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.1);
}

[b-n8m4f68okh] .e-list-item.e-hover {
    background-color: rgba(200, 169, 81, 0.1);
    color: #14213D;
}

[b-n8m4f68okh] .e-list-item.e-active {
    background-color: #C8A951;
    color: white;
}

/* Validation Messages */
.validation-message[b-n8m4f68okh] {
    color: #dc3545;
    font-size: 0.85rem;
    margin-top: 4px;
    display: flex;
    align-items: center;
    gap: 4px;
    min-height: 1.2rem;
}

.validation-message:not(:empty)[b-n8m4f68okh]::before {
    content: '\f071';
    font-family: 'Font Awesome 5 Free';
    font-weight: 900;
    font-size: 0.8rem;
}

/* Form Actions */
.form-actions[b-n8m4f68okh] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 24px 30px;
    background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);
    border-top: 2px solid #e2e6ea;
    margin: 0 -30px -30px -30px;
    border-radius: 0 0 12px 12px;
    gap: 16px;
}

/* Button Styling */
.form-actions .iswara-button[b-n8m4f68okh] {
    min-width: 140px;
    height: 44px;
    border-radius: 8px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    font-size: 0.85rem;
    transition: all 0.3s ease;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

.form-actions .iswara-button:hover[b-n8m4f68okh] {
    transform: translateY(-1px);
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15);
}

.form-actions .iswara-button:disabled[b-n8m4f68okh] {
    opacity: 0.6;
    transform: none !important;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1) !important;
    cursor: not-allowed;
}

/* Card Styling Override */
[b-n8m4f68okh] .iswara-card {
    border: 2px solid #e2e6ea;
    border-radius: 12px;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.08);
    overflow: hidden;
}

/* Responsive Design */
@media (max-width: 768px) {
    .employer-user-form[b-n8m4f68okh] {
        max-width: 100%;
        margin: 0 16px;
    }
    
    .user-form-content[b-n8m4f68okh] {
        padding: 20px;
        gap: 1.5rem;
    }
    
    .form-header h2[b-n8m4f68okh] {
        font-size: 1.6rem;
        flex-direction: column;
        gap: 8px;
    }
    
    .form-header h2 i[b-n8m4f68okh] {
        font-size: 1.4rem;
    }
    
    .form-header p[b-n8m4f68okh] {
        font-size: 1rem;
    }
    
    .form-section[b-n8m4f68okh] {
        padding: 20px;
    }
    
    .form-grid[b-n8m4f68okh] {
        grid-template-columns: 1fr;
        gap: 16px;
    }
    
    .form-group.full-width[b-n8m4f68okh] {
        grid-column: 1;
    }
    
    .section-header h3[b-n8m4f68okh] {
        font-size: 1.2rem;
    }
    
    .form-actions[b-n8m4f68okh] {
        flex-direction: column-reverse;
        gap: 12px;
        padding: 20px;
        margin: 0 -20px -20px -20px;
    }
    
    .form-actions .iswara-button[b-n8m4f68okh] {
        width: 100%;
        min-width: auto;
    }
    
    .password-help[b-n8m4f68okh] {
        padding: 10px 12px;
        font-size: 0.85rem;
    }
}

@media (max-width: 480px) {
    .employer-user-form[b-n8m4f68okh] {
        margin: 0 8px;
    }
    
    .user-form-content[b-n8m4f68okh] {
        padding: 16px;
        gap: 1.25rem;
    }
    
    .form-header[b-n8m4f68okh] {
        margin-bottom: 20px;
        padding-bottom: 16px;
    }
    
    .form-header h2[b-n8m4f68okh] {
        font-size: 1.4rem;
    }
    
    .form-header p[b-n8m4f68okh] {
        font-size: 0.9rem;
    }
    
    .form-section[b-n8m4f68okh] {
        padding: 16px;
    }
    
    .section-header[b-n8m4f68okh] {
        margin-bottom: 16px;
        padding-bottom: 8px;
    }
    
    .section-header h3[b-n8m4f68okh] {
        font-size: 1.1rem;
    }
    
    .form-grid[b-n8m4f68okh] {
        gap: 12px;
    }
    
    .form-actions[b-n8m4f68okh] {
        padding: 16px;
        margin: 0 -16px -16px -16px;
    }
    
    .password-help[b-n8m4f68okh] {
        padding: 8px 10px;
        font-size: 0.8rem;
    }
}

/* Loading State */
.user-form-content.loading[b-n8m4f68okh] {
    opacity: 0.6;
    pointer-events: none;
}

/* Focus Improvements */
[b-n8m4f68okh] .form-dropdown:focus-within {
    border-color: #C8A951;
    box-shadow: 0 0 0 0.2rem rgba(200, 169, 81, 0.25);
}

/* Error State */
.form-group.error[b-n8m4f68okh]  .form-dropdown,
.form-group.error[b-n8m4f68okh]  .iswara-form-input input {
    border-color: #dc3545;
    box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.15);
}

/* Accessibility Improvements */
[b-n8m4f68okh] .form-dropdown:focus,
[b-n8m4f68okh] .iswara-form-input input:focus {
    outline: 2px solid transparent;
    outline-offset: 2px;
}

/* Enhanced Visual Feedback */
.form-section:focus-within[b-n8m4f68okh] {
    border-color: rgba(200, 169, 81, 0.4);
    box-shadow: 0 4px 12px rgba(200, 169, 81, 0.15);
}

/* Animation for Form Sections */
.form-section[b-n8m4f68okh] {
    animation: fadeInUp-b-n8m4f68okh 0.3s ease-out;
}

@keyframes fadeInUp-b-n8m4f68okh {
    from {
        opacity: 0;
        transform: translateY(20px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}
/* /Features/Admin/Onboarding/Components/TierAssignmentForm.razor.rz.scp.css */
.tier-assignment-form[b-xmwktanoi5] {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
    max-width: 1000px;
    margin: 0 auto;
}

/* Tier Form Content */
.tier-form-content[b-xmwktanoi5] {
    display: flex;
    flex-direction: column;
    gap: 2.5rem;
}

/* Section Headers */
.tier-form-content h3[b-xmwktanoi5] {
    color: #14213D;
    font-size: 1.2rem;
    font-weight: 700;
    margin: 0 0 1rem 0;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.tier-form-content h3[b-xmwktanoi5]::before {
    content: '';
    width: 4px;
    height: 20px;
    background: #C8A951;
    border-radius: 2px;
}

/* Employer Selection Section */
.employer-selection-section[b-xmwktanoi5] {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

.employer-dropdown[b-xmwktanoi5] {
    max-width: 500px;
}

.employer-info-card[b-xmwktanoi5] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1.5rem;
    border: 2px solid #E2E6EA;
    border-radius: 12px;
    background: white;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
}

.employer-details h4[b-xmwktanoi5] {
    color: #14213D;
    font-size: 1.1rem;
    font-weight: 600;
    margin: 0 0 0.5rem 0;
}

.employer-meta[b-xmwktanoi5] {
    display: flex;
    gap: 1.5rem;
    color: #6c757d;
    font-size: 0.85rem;
}

.employer-meta span[b-xmwktanoi5] {
    display: flex;
    align-items: center;
    gap: 0.25rem;
}

.employer-meta i[b-xmwktanoi5] {
    color: #C8A951;
    width: 12px;
}

.current-tier[b-xmwktanoi5] {
    flex-shrink: 0;
}

.tier-badge[b-xmwktanoi5] {
    padding: 0.5rem 1rem;
    border-radius: 20px;
    font-size: 0.8rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.tier-badge.basic[b-xmwktanoi5] {
    background: rgba(108, 117, 125, 0.1);
    color: #6c757d;
    border: 1px solid rgba(108, 117, 125, 0.3);
}

.tier-badge.standard[b-xmwktanoi5] {
    background: rgba(25, 135, 84, 0.1);
    color: #198754;
    border: 1px solid rgba(25, 135, 84, 0.3);
}

.tier-badge.premium[b-xmwktanoi5] {
    background: rgba(200, 169, 81, 0.1);
    color: #C8A951;
    border: 1px solid rgba(200, 169, 81, 0.3);
}

.tier-badge.enterprise[b-xmwktanoi5] {
    background: rgba(20, 33, 61, 0.1);
    color: #14213D;
    border: 1px solid rgba(20, 33, 61, 0.3);
}

/* Tier Selection Section */
.tier-selection-section[b-xmwktanoi5] {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

.tiers-grid[b-xmwktanoi5] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 1.5rem;
}

.tier-card[b-xmwktanoi5] {
    border: 2px solid #E2E6EA;
    border-radius: 12px;
    padding: 1.5rem;
    background: white;
    cursor: pointer;
    transition: all 0.3s ease;
    position: relative;
}

.tier-card:hover[b-xmwktanoi5] {
    transform: translateY(-2px);
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.1);
    border-color: #C8A951;
}

.tier-card.selected[b-xmwktanoi5] {
    border-color: #C8A951;
    background: linear-gradient(135deg, rgba(200, 169, 81, 0.05) 0%, rgba(200, 169, 81, 0.02) 100%);
    box-shadow: 0 8px 24px rgba(200, 169, 81, 0.2);
}

.tier-card.current[b-xmwktanoi5] {
    border-color: #198754;
    background: linear-gradient(135deg, rgba(25, 135, 84, 0.05) 0%, rgba(25, 135, 84, 0.02) 100%);
}

.tier-card.current[b-xmwktanoi5]::before {
    content: 'CURRENT';
    position: absolute;
    top: -8px;
    right: 15px;
    background: #198754;
    color: white;
    padding: 0.25rem 0.75rem;
    border-radius: 12px;
    font-size: 0.7rem;
    font-weight: 700;
    letter-spacing: 0.5px;
}

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

.tier-header h4[b-xmwktanoi5] {
    color: #14213D;
    font-size: 1.2rem;
    font-weight: 700;
    margin: 0;
}

.current-label[b-xmwktanoi5] {
    background: rgba(25, 135, 84, 0.1);
    color: #198754;
    padding: 0.25rem 0.5rem;
    border-radius: 8px;
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
}

.tier-price[b-xmwktanoi5] {
    display: flex;
    align-items: baseline;
    gap: 0.25rem;
    margin-bottom: 1.5rem;
}

.tier-price .price[b-xmwktanoi5] {
    color: #14213D;
    font-size: 2rem;
    font-weight: 700;
}

.tier-price .period[b-xmwktanoi5] {
    color: #6c757d;
    font-size: 0.9rem;
}

.tier-features[b-xmwktanoi5] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    margin-bottom: 1.5rem;
}

.feature-item[b-xmwktanoi5] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    color: #2E2E2E;
    font-size: 0.9rem;
}

.feature-item i[b-xmwktanoi5] {
    color: #198754;
    font-size: 0.8rem;
    width: 12px;
}

.feature-item.more[b-xmwktanoi5] {
    color: #6c757d;
    font-style: italic;
}

.tier-limits[b-xmwktanoi5] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    padding-top: 1rem;
    border-top: 1px solid #E2E6EA;
}

.limit-item[b-xmwktanoi5] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 0.85rem;
}

.limit-item .label[b-xmwktanoi5] {
    color: #6c757d;
}

.limit-item .value[b-xmwktanoi5] {
    color: #14213D;
    font-weight: 600;
}

/* Assignment Configuration Section */
.assignment-config-section[b-xmwktanoi5] {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

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

.config-group[b-xmwktanoi5] {
    display: flex;
    flex-direction: column;
}

.config-group.full-width[b-xmwktanoi5] {
    grid-column: 1 / -1;
}

/* Form Labels */
.form-label[b-xmwktanoi5] {
    color: #14213D;
    font-weight: 600;
    font-size: 0.95rem;
    margin-bottom: 0.75rem;
    display: block;
}

/* Checkbox Group Styling */
.checkbox-group[b-xmwktanoi5] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    padding: 1rem;
    border: 1px solid #E2E6EA;
    border-radius: 8px;
    background: #F8F9FA;
}

.checkbox-item[b-xmwktanoi5] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.checkbox-item input[type="checkbox"][b-xmwktanoi5] {
    width: 18px;
    height: 18px;
    accent-color: #C8A951;
    cursor: pointer;
}

.checkbox-item label[b-xmwktanoi5] {
    color: #2E2E2E;
    font-size: 0.95rem;
    cursor: pointer;
    margin: 0;
    line-height: 1.4;
}

.checkbox-item input[type="checkbox"]:checked + label[b-xmwktanoi5] {
    color: #14213D;
    font-weight: 500;
}

/* Assignment Summary Section */
.assignment-summary-section[b-xmwktanoi5] {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

.summary-card[b-xmwktanoi5] {
    border: 2px solid #C8A951;
    border-radius: 12px;
    padding: 1.5rem;
    background: linear-gradient(135deg, rgba(200, 169, 81, 0.05) 0%, rgba(200, 169, 81, 0.02) 100%);
}

.summary-row[b-xmwktanoi5] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.75rem 0;
    border-bottom: 1px solid rgba(200, 169, 81, 0.2);
}

.summary-row:last-child[b-xmwktanoi5] {
    border-bottom: none;
}

.summary-row .label[b-xmwktanoi5] {
    color: #6c757d;
    font-weight: 500;
    font-size: 0.9rem;
}

.summary-row .value[b-xmwktanoi5] {
    color: #14213D;
    font-weight: 600;
    font-size: 0.95rem;
}

/* Form Actions */
.form-actions[b-xmwktanoi5] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1.5rem 0;
    border-top: 1px solid #E2E6EA;
    margin-top: 1rem;
}

.actions-left[b-xmwktanoi5],
.actions-right[b-xmwktanoi5] {
    display: flex;
    gap: 1rem;
}

/* Special styling for tier assignment card */
[b-xmwktanoi5] .iswara-card {
    border: 2px solid #E2E6EA;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.08);
}

[b-xmwktanoi5] .iswara-card .card-header {
    background: linear-gradient(135deg, #14213D 0%, #2E2E2E 100%);
    color: white;
    border-bottom: 2px solid #C8A951;
}

[b-xmwktanoi5] .iswara-card .card-header i {
    color: #C8A951;
}

/* Responsive Design */
@media (max-width: 768px) {
    .tier-assignment-form[b-xmwktanoi5] {
        max-width: 100%;
        gap: 1rem;
    }
    
    .tier-form-content[b-xmwktanoi5] {
        gap: 2rem;
    }
    
    .tiers-grid[b-xmwktanoi5] {
        grid-template-columns: 1fr;
        gap: 1rem;
    }
    
    .tier-card[b-xmwktanoi5] {
        padding: 1rem;
    }
    
    .employer-info-card[b-xmwktanoi5] {
        flex-direction: column;
        align-items: flex-start;
        gap: 1rem;
        padding: 1rem;
    }
    
    .employer-meta[b-xmwktanoi5] {
        flex-direction: column;
        gap: 0.5rem;
    }
    
    .config-grid[b-xmwktanoi5] {
        grid-template-columns: 1fr;
        gap: 1rem;
    }
    
    .config-group.full-width[b-xmwktanoi5] {
        grid-column: 1;
    }
    
    .form-actions[b-xmwktanoi5] {
        flex-direction: column;
        gap: 1rem;
        padding: 1rem 0;
    }
    
    .actions-left[b-xmwktanoi5],
    .actions-right[b-xmwktanoi5] {
        width: 100%;
        justify-content: center;
    }
    
    .checkbox-group[b-xmwktanoi5] {
        padding: 0.75rem;
        gap: 0.75rem;
    }
}

@media (max-width: 480px) {
    .tier-assignment-form[b-xmwktanoi5] {
        gap: 0.75rem;
    }
    
    .tier-form-content[b-xmwktanoi5] {
        gap: 1.5rem;
    }
    
    .tier-form-content h3[b-xmwktanoi5] {
        font-size: 1.1rem;
    }
    
    .tier-card[b-xmwktanoi5] {
        padding: 0.75rem;
    }
    
    .tier-header h4[b-xmwktanoi5] {
        font-size: 1.1rem;
    }
    
    .tier-price .price[b-xmwktanoi5] {
        font-size: 1.5rem;
    }
    
    .employer-info-card[b-xmwktanoi5] {
        padding: 0.75rem;
    }
    
    .employer-details h4[b-xmwktanoi5] {
        font-size: 1rem;
    }
    
    .employer-meta[b-xmwktanoi5] {
        font-size: 0.8rem;
    }
    
    .config-grid[b-xmwktanoi5] {
        gap: 0.75rem;
    }
    
    .checkbox-group[b-xmwktanoi5] {
        padding: 0.5rem;
        gap: 0.5rem;
    }
    
    .checkbox-item[b-xmwktanoi5] {
        gap: 0.5rem;
    }
    
    .checkbox-item input[type="checkbox"][b-xmwktanoi5] {
        width: 16px;
        height: 16px;
    }
    
    .checkbox-item label[b-xmwktanoi5] {
        font-size: 0.9rem;
    }
    
    .summary-card[b-xmwktanoi5] {
        padding: 1rem;
    }
    
    .summary-row[b-xmwktanoi5] {
        padding: 0.5rem 0;
    }
    
    .summary-row .label[b-xmwktanoi5],
    .summary-row .value[b-xmwktanoi5] {
        font-size: 0.85rem;
    }
}

/* Loading states */
.tier-card.loading[b-xmwktanoi5] {
    opacity: 0.6;
    pointer-events: none;
}

/* Focus and accessibility improvements */
.tier-card:focus[b-xmwktanoi5] {
    outline: 2px solid #C8A951;
    outline-offset: 2px;
}

.checkbox-item input[type="checkbox"]:focus[b-xmwktanoi5] {
    outline: 2px solid #C8A951;
    outline-offset: 2px;
}

.form-actions button:focus[b-xmwktanoi5] {
    outline: 2px solid #C8A951;
    outline-offset: 2px;
}

/* Enhanced validation display */
[b-xmwktanoi5] .validation-message {
    color: #dc3545;
    font-size: 0.8rem;
    margin-top: 0.25rem;
    display: flex;
    align-items: center;
    gap: 0.25rem;
}

[b-xmwktanoi5] .validation-message::before {
    content: '\f071';
    font-family: 'Font Awesome 5 Free';
    font-weight: 900;
    font-size: 0.75rem;
}

[b-xmwktanoi5] .form-input.error,
[b-xmwktanoi5] .dropdown.error {
    border-color: #dc3545;
    box-shadow: 0 0 0 2px rgba(220, 53, 69, 0.1);
}
/* /Features/Admin/Onboarding/CreateAdminPage.razor.rz.scp.css */
/* Create Admin Page Styles */
.create-admin-container[b-fe0kq0a42b] {
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, #BFD8B8 0%, #E2E6EA 100%);
    padding: 20px;
}

.create-admin-wrapper[b-fe0kq0a42b] {
    width: 100%;
    max-width: 700px;
}

.create-admin-header[b-fe0kq0a42b] {
    text-align: center;
    margin-bottom: 30px;
}

.create-admin-header h2[b-fe0kq0a42b] {
    color: #14213D;
    font-size: 2rem;
    font-weight: 700;
    margin-bottom: 8px;
}

.create-admin-header p[b-fe0kq0a42b] {
    color: #2E2E2E;
    font-size: 1rem;
    margin: 0 0 15px 0;
}

.access-notice[b-fe0kq0a42b] {
    background-color: #e3f2fd;
    border: 1px solid #90caf9;
    border-radius: 6px;
    padding: 10px 12px;
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 0.85rem;
    color: #1565c0;
    margin-top: 15px;
}

.access-notice i[b-fe0kq0a42b] {
    color: #1976d2;
    flex-shrink: 0;
}

.form-section[b-fe0kq0a42b] {
    margin-bottom: 30px;
    padding-bottom: 20px;
    border-bottom: 1px solid #E2E6EA;
}

.form-section:last-of-type[b-fe0kq0a42b] {
    border-bottom: none;
    margin-bottom: 20px;
}

.form-section h4[b-fe0kq0a42b] {
    color: #14213D;
    font-size: 1.2rem;
    font-weight: 600;
    margin-bottom: 15px;
    display: flex;
    align-items: center;
    gap: 8px;
}

.form-row[b-fe0kq0a42b] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
    margin-bottom: 15px;
}

.form-group[b-fe0kq0a42b] {
    margin-bottom: 20px;
}

.security-notice[b-fe0kq0a42b] {
    background-color: #fff3cd;
    border: 1px solid #ffeaa7;
    border-radius: 6px;
    padding: 12px 16px;
    margin-bottom: 15px;
}

.security-text[b-fe0kq0a42b] {
    color: #856404;
    font-size: 0.85rem;
    line-height: 1.5;
    margin: 0;
    display: flex;
    align-items: flex-start;
    gap: 8px;
}

.security-text i[b-fe0kq0a42b] {
    color: #f39c12;
    margin-top: 2px;
    flex-shrink: 0;
}

.security-text strong[b-fe0kq0a42b] {
    font-weight: 600;
}

.checkbox-container[b-fe0kq0a42b] {
    display: flex;
    align-items: center;
    cursor: pointer;
    font-size: 0.95rem;
    color: #2E2E2E;
    user-select: none;
    gap: 8px;
}

.checkbox-container input[type="checkbox"][b-fe0kq0a42b] {
    width: 18px;
    height: 18px;
    accent-color: #C8A951;
}

.checkmark[b-fe0kq0a42b] {
    margin-left: 4px;
}

.password-strength[b-fe0kq0a42b] {
    margin-top: 8px;
}

.strength-indicator[b-fe0kq0a42b] {
    height: 4px;
    background-color: #E2E6EA;
    border-radius: 2px;
    overflow: hidden;
    margin-bottom: 4px;
}

.strength-bar[b-fe0kq0a42b] {
    height: 100%;
    transition: all 0.3s ease;
    border-radius: 2px;
}

.strength-none .strength-bar[b-fe0kq0a42b] {
    width: 0%;
    background-color: transparent;
}

.strength-weak .strength-bar[b-fe0kq0a42b] {
    width: 25%;
    background-color: #dc3545;
}

.strength-fair .strength-bar[b-fe0kq0a42b] {
    width: 50%;
    background-color: #fd7e14;
}

.strength-good .strength-bar[b-fe0kq0a42b] {
    width: 75%;
    background-color: #ffc107;
}

.strength-strong .strength-bar[b-fe0kq0a42b] {
    width: 100%;
    background-color: #28a745;
}

.strength-text[b-fe0kq0a42b] {
    font-size: 0.8rem;
    color: #2E2E2E;
    font-weight: 500;
}

.alert[b-fe0kq0a42b] {
    padding: 12px 16px;
    border-radius: 6px;
    margin-bottom: 20px;
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 0.9rem;
}

.alert-danger[b-fe0kq0a42b] {
    background-color: #f8d7da;
    border: 1px solid #f5c6cb;
    color: #721c24;
}

.alert-success[b-fe0kq0a42b] {
    background-color: #d4edda;
    border: 1px solid #c3e6cb;
    color: #155724;
}

.alert i[b-fe0kq0a42b] {
    flex-shrink: 0;
}

.form-actions[b-fe0kq0a42b] {
    margin-bottom: 25px;
}

.create-admin-button[b-fe0kq0a42b] {
    width: 100%;
}

.create-admin-footer[b-fe0kq0a42b] {
    border-top: 1px solid #E2E6EA;
    padding-top: 20px;
}

.help-info[b-fe0kq0a42b] {
    margin-bottom: 15px;
}

.help-text[b-fe0kq0a42b] {
    color: #2E2E2E;
    font-size: 0.85rem;
    line-height: 1.5;
    margin: 0;
    display: flex;
    align-items: flex-start;
    gap: 8px;
}

.help-text i[b-fe0kq0a42b] {
    color: #C8A951;
    margin-top: 2px;
    flex-shrink: 0;
}

.back-link[b-fe0kq0a42b] {
    text-align: center;
}

.link-secondary[b-fe0kq0a42b] {
    color: #2E2E2E;
    text-decoration: none;
    font-size: 0.9rem;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    transition: all 0.3s ease;
}

.link-secondary:hover[b-fe0kq0a42b] {
    color: #14213D;
}

/* Field validation styles */
.is-invalid[b-fe0kq0a42b] {
    border-color: #dc3545 !important;
    box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.25) !important;
}

.validation-message[b-fe0kq0a42b] {
    color: #dc3545;
    font-size: 0.8rem;
    margin-top: 4px;
    display: block;
}

/* Mobile responsive */
@media (max-width: 768px) {
    .create-admin-container[b-fe0kq0a42b] {
        padding: 20px 15px;
        align-items: flex-start;
        padding-top: 40px;
    }
    
    .create-admin-wrapper[b-fe0kq0a42b] {
        max-width: 100%;
    }
    
    .form-row[b-fe0kq0a42b] {
        grid-template-columns: 1fr;
        gap: 0;
    }
    
    .create-admin-header h2[b-fe0kq0a42b] {
        font-size: 1.75rem;
    }
    
    .access-notice[b-fe0kq0a42b] {
        padding: 8px 10px;
        font-size: 0.8rem;
    }
    
    .form-section h4[b-fe0kq0a42b] {
        font-size: 1.1rem;
    }
}

@media (max-width: 576px) {
    .create-admin-container[b-fe0kq0a42b] {
        padding: 20px 10px;
        padding-top: 30px;
    }
    
    .create-admin-header[b-fe0kq0a42b] {
        margin-bottom: 25px;
    }
    
    .create-admin-header h2[b-fe0kq0a42b] {
        font-size: 1.5rem;
    }
    
    .form-section[b-fe0kq0a42b] {
        margin-bottom: 25px;
        padding-bottom: 15px;
    }
    
    .authorization-note[b-fe0kq0a42b] {
        padding: 10px 12px;
        font-size: 0.85rem;
    }
    
    .help-text[b-fe0kq0a42b] {
        font-size: 0.8rem;
    }
}

/* Accessibility improvements */
@media (prefers-reduced-motion: reduce) {
    .alert[b-fe0kq0a42b],
    .link-secondary[b-fe0kq0a42b],
    .strength-bar[b-fe0kq0a42b] {
        transition: none;
    }
}

/* High contrast mode support */
@media (prefers-contrast: high) {
    .create-admin-container[b-fe0kq0a42b] {
        background: #ffffff;
    }
    
    .create-admin-header h2[b-fe0kq0a42b] {
        color: #000000;
    }
    
    .create-admin-header p[b-fe0kq0a42b] {
        color: #333333;
    }
    
    .form-section h4[b-fe0kq0a42b] {
        color: #000000;
    }
    
    .authorization-note[b-fe0kq0a42b] {
        background-color: #f0f0f0;
        border-color: #000000;
    }
}
/* /Features/Admin/Onboarding/CreateEmployerPage.razor.rz.scp.css */
.create-employer-page[b-10930zmqlf] {
    padding: 2rem;
    max-width: 1200px;
    margin: 0 auto;
}

.page-header[b-10930zmqlf] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 2.5rem;
    flex-wrap: wrap;
    gap: 1rem;
}

.header-content[b-10930zmqlf] {
    flex: 1;
}

.page-title[b-10930zmqlf] {
    color: #14213D;
    font-size: 2.5rem;
    font-weight: 600;
    margin-bottom: 0.5rem;
    display: flex;
    align-items: center;
    gap: 1rem;
}

.page-title i[b-10930zmqlf] {
    color: #C8A951;
    font-size: 2rem;
}

.page-description[b-10930zmqlf] {
    color: #2E2E2E;
    font-size: 1.1rem;
    margin: 0;
    max-width: 600px;
}

.header-actions[b-10930zmqlf] {
    display: flex;
    gap: 0.75rem;
    align-items: center;
}

.create-employer-content[b-10930zmqlf] {
    display: flex;
    flex-direction: column;
    gap: 2.5rem;
}

.loading-state[b-10930zmqlf] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 4rem 2rem;
    text-align: center;
}

.spinner[b-10930zmqlf] {
    width: 40px;
    height: 40px;
    border: 4px solid #E2E6EA;
    border-top: 4px solid #C8A951;
    border-radius: 50%;
    animation: spin-b-10930zmqlf 1s linear infinite;
    margin-bottom: 1rem;
}

@keyframes spin-b-10930zmqlf {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

/* Progress Steps */
.progress-section[b-10930zmqlf] {
    background: white;
    border-radius: 12px;
    border: 2px solid #E2E6EA;
    padding: 2rem;
    margin-bottom: 2rem;
}

.progress-steps[b-10930zmqlf] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    max-width: 800px;
    margin: 0 auto;
}

.step[b-10930zmqlf] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.75rem;
    flex: 1;
    text-align: center;
}

.step-number[b-10930zmqlf] {
    width: 50px;
    height: 50px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: 1.2rem;
    transition: all 0.3s ease;
}

.step.pending .step-number[b-10930zmqlf] {
    background: #E2E6EA;
    color: #6c757d;
    border: 2px solid #E2E6EA;
}

.step.active .step-number[b-10930zmqlf] {
    background: #C8A951;
    color: white;
    border: 2px solid #C8A951;
    box-shadow: 0 0 0 4px rgba(200, 169, 81, 0.2);
}

.step.completed .step-number[b-10930zmqlf] {
    background: #198754;
    color: white;
    border: 2px solid #198754;
}

.step-label[b-10930zmqlf] {
    font-size: 0.9rem;
    font-weight: 500;
    color: #2E2E2E;
    max-width: 120px;
}

.step.active .step-label[b-10930zmqlf] {
    color: #14213D;
    font-weight: 600;
}

.step-connector[b-10930zmqlf] {
    flex: 1;
    height: 2px;
    margin: 0 1rem;
    transition: all 0.3s ease;
}

.step-connector.pending[b-10930zmqlf] {
    background: #E2E6EA;
}

.step-connector.completed[b-10930zmqlf] {
    background: #198754;
}

/* Form Section */
.form-section[b-10930zmqlf] {
    background: white;
    border-radius: 12px;
    border: 2px solid #E2E6EA;
    overflow: hidden;
}

/* Success Section */
.success-section[b-10930zmqlf] {
    margin-top: 2rem;
}

[b-10930zmqlf] .success-card {
    border: 2px solid #198754;
    background: linear-gradient(135deg, rgba(25, 135, 84, 0.05) 0%, rgba(191, 216, 184, 0.05) 100%);
}

.success-content[b-10930zmqlf] {
    text-align: center;
    padding: 2rem;
}

.success-icon[b-10930zmqlf] {
    font-size: 4rem;
    color: #198754;
    margin-bottom: 1.5rem;
}

.success-content h3[b-10930zmqlf] {
    color: #14213D;
    font-size: 1.8rem;
    font-weight: 600;
    margin-bottom: 1rem;
}

.success-content > p[b-10930zmqlf] {
    color: #2E2E2E;
    font-size: 1.1rem;
    margin-bottom: 2rem;
}

.next-steps[b-10930zmqlf] {
    background: rgba(25, 135, 84, 0.05);
    border: 1px solid rgba(25, 135, 84, 0.2);
    border-radius: 8px;
    padding: 1.5rem;
    margin-bottom: 2rem;
    text-align: left;
}

.next-steps h4[b-10930zmqlf] {
    color: #14213D;
    font-size: 1.2rem;
    font-weight: 600;
    margin-bottom: 1rem;
}

.next-steps ul[b-10930zmqlf] {
    color: #2E2E2E;
    margin: 0;
    padding-left: 1.5rem;
}

.next-steps li[b-10930zmqlf] {
    margin-bottom: 0.5rem;
    line-height: 1.4;
}

.success-actions[b-10930zmqlf] {
    display: flex;
    gap: 1rem;
    justify-content: center;
    flex-wrap: wrap;
}

/* Error Section */
.error-section[b-10930zmqlf] {
    margin-top: 2rem;
}

[b-10930zmqlf] .error-card {
    border: 2px solid #dc3545;
    background: linear-gradient(135deg, rgba(220, 53, 69, 0.05) 0%, rgba(255, 193, 7, 0.05) 100%);
}

.error-content[b-10930zmqlf] {
    text-align: center;
    padding: 2rem;
}

.error-icon[b-10930zmqlf] {
    font-size: 4rem;
    color: #dc3545;
    margin-bottom: 1.5rem;
}

.error-content h4[b-10930zmqlf] {
    color: #14213D;
    font-size: 1.5rem;
    font-weight: 600;
    margin-bottom: 1rem;
}

.error-content p[b-10930zmqlf] {
    color: #2E2E2E;
    font-size: 1rem;
    margin-bottom: 2rem;
    line-height: 1.5;
}

.error-actions[b-10930zmqlf] {
    display: flex;
    gap: 1rem;
    justify-content: center;
    flex-wrap: wrap;
}

/* Responsive Design */
@media (max-width: 768px) {
    .create-employer-page[b-10930zmqlf] {
        padding: 1rem;
    }
    
    .page-header[b-10930zmqlf] {
        flex-direction: column;
        align-items: flex-start;
    }
    
    .page-title[b-10930zmqlf] {
        font-size: 2rem;
    }
    
    .progress-steps[b-10930zmqlf] {
        flex-direction: column;
        gap: 1.5rem;
    }
    
    .step[b-10930zmqlf] {
        flex-direction: row;
        gap: 1rem;
        width: 100%;
        text-align: left;
    }
    
    .step-connector[b-10930zmqlf] {
        display: none;
    }
    
    .success-actions[b-10930zmqlf],
    .error-actions[b-10930zmqlf] {
        flex-direction: column;
        align-items: stretch;
    }
    
    .progress-section[b-10930zmqlf] {
        padding: 1.5rem;
    }
}

@media (max-width: 480px) {
    .create-employer-page[b-10930zmqlf] {
        padding: 0.5rem;
    }
    
    .page-title[b-10930zmqlf] {
        font-size: 1.75rem;
        flex-direction: column;
        align-items: flex-start;
        gap: 0.5rem;
    }
    
    .success-content[b-10930zmqlf],
    .error-content[b-10930zmqlf] {
        padding: 1.5rem;
    }
    
    .success-icon[b-10930zmqlf],
    .error-icon[b-10930zmqlf] {
        font-size: 3rem;
    }
    
    .next-steps[b-10930zmqlf] {
        padding: 1.25rem;
    }
}
/* /Features/Admin/Onboarding/EmployerStatusPage.razor.rz.scp.css */
.employer-status-page[b-gnyu4zou5r] {
    padding: 2rem;
    max-width: 1400px;
    margin: 0 auto;
}

.page-header[b-gnyu4zou5r] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 2.5rem;
    flex-wrap: wrap;
    gap: 1rem;
}

.header-content[b-gnyu4zou5r] {
    flex: 1;
}

.page-title[b-gnyu4zou5r] {
    color: #14213D;
    font-size: 2.5rem;
    font-weight: 600;
    margin-bottom: 0.5rem;
    display: flex;
    align-items: center;
    gap: 1rem;
}

.page-title i[b-gnyu4zou5r] {
    color: #C8A951;
    font-size: 2rem;
}

.page-description[b-gnyu4zou5r] {
    color: #2E2E2E;
    font-size: 1.1rem;
    margin: 0;
    max-width: 600px;
}

.header-actions[b-gnyu4zou5r] {
    display: flex;
    gap: 0.75rem;
    align-items: center;
}

.employer-status-content[b-gnyu4zou5r] {
    display: flex;
    flex-direction: column;
    gap: 2.5rem;
}

.loading-state[b-gnyu4zou5r] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 4rem 2rem;
    text-align: center;
}

.spinner[b-gnyu4zou5r] {
    width: 40px;
    height: 40px;
    border: 4px solid #E2E6EA;
    border-top: 4px solid #C8A951;
    border-radius: 50%;
    animation: spin-b-gnyu4zou5r 1s linear infinite;
    margin-bottom: 1rem;
}

@keyframes spin-b-gnyu4zou5r {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

/* Employer Selection Section */
.employer-selection-section[b-gnyu4zou5r] {
    margin-bottom: 2rem;
}

/* Employer Overview Section */
.employer-overview-section[b-gnyu4zou5r] {
    margin-bottom: 2rem;
}

[b-gnyu4zou5r] .employer-overview-card {
    border: 2px solid #C8A951;
    background: linear-gradient(135deg, rgba(200, 169, 81, 0.05) 0%, rgba(191, 216, 184, 0.05) 100%);
}

.employer-header[b-gnyu4zou5r] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 2rem;
    gap: 1.5rem;
}

.employer-info h2[b-gnyu4zou5r] {
    color: #14213D;
    font-size: 2rem;
    font-weight: 600;
    margin-bottom: 1rem;
}

.employer-badges[b-gnyu4zou5r] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
}

.status-badge[b-gnyu4zou5r],
.onboarding-badge[b-gnyu4zou5r],
.tier-badge[b-gnyu4zou5r] {
    padding: 0.5rem 1rem;
    border-radius: 20px;
    font-size: 0.85rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.status-badge.active[b-gnyu4zou5r] {
    background: rgba(25, 135, 84, 0.1);
    color: #198754;
    border: 1px solid rgba(25, 135, 84, 0.3);
}

.status-badge.inactive[b-gnyu4zou5r] {
    background: rgba(220, 53, 69, 0.1);
    color: #dc3545;
    border: 1px solid rgba(220, 53, 69, 0.3);
}

.onboarding-badge.complete[b-gnyu4zou5r] {
    background: rgba(25, 135, 84, 0.1);
    color: #198754;
    border: 1px solid rgba(25, 135, 84, 0.3);
}

.onboarding-badge.pending[b-gnyu4zou5r] {
    background: rgba(255, 193, 7, 0.1);
    color: #ffc107;
    border: 1px solid rgba(255, 193, 7, 0.3);
}

.tier-badge[b-gnyu4zou5r] {
    background: rgba(200, 169, 81, 0.1);
    color: #C8A951;
    border: 1px solid rgba(200, 169, 81, 0.3);
}

.employer-actions[b-gnyu4zou5r] {
    flex-shrink: 0;
}

.employer-details[b-gnyu4zou5r] {
    border-top: 1px solid #E2E6EA;
    padding-top: 1.5rem;
}

.details-grid[b-gnyu4zou5r] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 1.5rem;
}

.detail-item[b-gnyu4zou5r] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.detail-item .label[b-gnyu4zou5r] {
    color: #6c757d;
    font-size: 0.9rem;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.detail-item .value[b-gnyu4zou5r] {
    color: #14213D;
    font-size: 1rem;
    font-weight: 600;
}

/* Onboarding Progress Section */
.onboarding-progress-section[b-gnyu4zou5r] {
    margin-bottom: 2rem;
}

.progress-steps[b-gnyu4zou5r] {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
    margin-bottom: 2rem;
}

.step[b-gnyu4zou5r] {
    display: flex;
    align-items: flex-start;
    gap: 1.5rem;
    padding: 1.5rem;
    border-radius: 12px;
    border: 2px solid #E2E6EA;
    background: white;
    transition: all 0.3s ease;
}

.step.completed[b-gnyu4zou5r] {
    border-color: #198754;
    background: linear-gradient(135deg, rgba(25, 135, 84, 0.05) 0%, rgba(191, 216, 184, 0.05) 100%);
}

.step.pending[b-gnyu4zou5r] {
    border-color: #E2E6EA;
    background: #F8F9FA;
}

.step-icon[b-gnyu4zou5r] {
    flex-shrink: 0;
    width: 50px;
    height: 50px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.5rem;
    transition: all 0.3s ease;
}

.step.completed .step-icon[b-gnyu4zou5r] {
    background: #198754;
    color: white;
}

.step.pending .step-icon[b-gnyu4zou5r] {
    background: #E2E6EA;
    color: #6c757d;
}

.step-content[b-gnyu4zou5r] {
    flex: 1;
}

.step-content h4[b-gnyu4zou5r] {
    color: #14213D;
    font-size: 1.2rem;
    font-weight: 600;
    margin-bottom: 0.5rem;
}

.step-content p[b-gnyu4zou5r] {
    color: #2E2E2E;
    font-size: 0.95rem;
    margin-bottom: 0.5rem;
    line-height: 1.4;
}

.step-date[b-gnyu4zou5r],
.step-status[b-gnyu4zou5r] {
    font-size: 0.85rem;
    font-weight: 500;
}

.step-date[b-gnyu4zou5r] {
    color: #6c757d;
}

.step-status.completed[b-gnyu4zou5r] {
    color: #198754;
}

.step-status.pending[b-gnyu4zou5r] {
    color: #ffc107;
}

.progress-summary[b-gnyu4zou5r] {
    text-align: center;
    padding-top: 1.5rem;
    border-top: 1px solid #E2E6EA;
}

.progress-bar[b-gnyu4zou5r] {
    width: 100%;
    height: 8px;
    background: #E2E6EA;
    border-radius: 4px;
    overflow: hidden;
    margin-bottom: 0.75rem;
}

.progress-fill[b-gnyu4zou5r] {
    height: 100%;
    background: linear-gradient(90deg, #C8A951 0%, #198754 100%);
    transition: width 0.5s ease;
}

.progress-text[b-gnyu4zou5r] {
    color: #14213D;
    font-size: 1.1rem;
    font-weight: 600;
    margin: 0;
}

/* Users List Section */
.users-list-section[b-gnyu4zou5r] {
    margin-bottom: 2rem;
}

.users-grid[b-gnyu4zou5r] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 1.5rem;
}

.user-card[b-gnyu4zou5r] {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 1.5rem;
    border: 2px solid #E2E6EA;
    border-radius: 12px;
    background: white;
    transition: all 0.3s ease;
}

.user-card:hover[b-gnyu4zou5r] {
    border-color: #C8A951;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
}

.user-avatar[b-gnyu4zou5r] {
    flex-shrink: 0;
    width: 50px;
    height: 50px;
    border-radius: 50%;
    background: rgba(200, 169, 81, 0.1);
    display: flex;
    align-items: center;
    justify-content: center;
    color: #C8A951;
    font-size: 1.8rem;
}

.user-info[b-gnyu4zou5r] {
    flex: 1;
}

.user-info h5[b-gnyu4zou5r] {
    color: #14213D;
    font-size: 1.1rem;
    font-weight: 600;
    margin-bottom: 0.25rem;
}

.user-email[b-gnyu4zou5r] {
    color: #2E2E2E;
    font-size: 0.9rem;
    margin-bottom: 0.25rem;
}

.user-role[b-gnyu4zou5r] {
    color: #6c757d;
    font-size: 0.85rem;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin: 0;
}

.user-status[b-gnyu4zou5r] {
    flex-shrink: 0;
}

/* Pending Actions Section */
.pending-actions-section[b-gnyu4zou5r] {
    margin-bottom: 2rem;
}

[b-gnyu4zou5r] .pending-actions-card {
    border: 2px solid #ffc107;
    background: linear-gradient(135deg, rgba(255, 193, 7, 0.05) 0%, rgba(255, 193, 7, 0.02) 100%);
}

.pending-actions-list[b-gnyu4zou5r] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.pending-action[b-gnyu4zou5r] {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 1.5rem;
    border: 1px solid #E2E6EA;
    border-radius: 8px;
    background: white;
    transition: all 0.3s ease;
}

.pending-action:hover[b-gnyu4zou5r] {
    border-color: #C8A951;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
}

.action-icon[b-gnyu4zou5r] {
    flex-shrink: 0;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: rgba(255, 193, 7, 0.1);
    display: flex;
    align-items: center;
    justify-content: center;
    color: #ffc107;
    font-size: 1.1rem;
}

.action-content[b-gnyu4zou5r] {
    flex: 1;
}

.action-content h5[b-gnyu4zou5r] {
    color: #14213D;
    font-size: 1rem;
    font-weight: 600;
    margin-bottom: 0.25rem;
}

.action-content p[b-gnyu4zou5r] {
    color: #2E2E2E;
    font-size: 0.9rem;
    margin-bottom: 0.5rem;
}

.priority[b-gnyu4zou5r] {
    font-size: 0.8rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    padding: 0.25rem 0.5rem;
    border-radius: 12px;
}

.priority.high[b-gnyu4zou5r] {
    background: rgba(220, 53, 69, 0.1);
    color: #dc3545;
}

.priority.medium[b-gnyu4zou5r] {
    background: rgba(255, 193, 7, 0.1);
    color: #ffc107;
}

.priority.low[b-gnyu4zou5r] {
    background: rgba(108, 117, 125, 0.1);
    color: #6c757d;
}

.action-button[b-gnyu4zou5r] {
    flex-shrink: 0;
}

/* Quick Actions Section */
.quick-actions-section[b-gnyu4zou5r] {
    margin-bottom: 2rem;
}

.quick-actions-grid[b-gnyu4zou5r] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 1.5rem;
}

.quick-action[b-gnyu4zou5r] {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 1.5rem;
    border: 2px solid #E2E6EA;
    border-radius: 12px;
    background: white;
    cursor: pointer;
    transition: all 0.3s ease;
}

.quick-action:hover[b-gnyu4zou5r] {
    transform: translateY(-2px);
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.1);
    border-color: #C8A951;
}

.quick-action .action-icon[b-gnyu4zou5r] {
    flex-shrink: 0;
    width: 50px;
    height: 50px;
    border-radius: 12px;
    background: rgba(200, 169, 81, 0.1);
    display: flex;
    align-items: center;
    justify-content: center;
    color: #C8A951;
    font-size: 1.5rem;
}

.quick-action .action-content[b-gnyu4zou5r] {
    flex: 1;
}

.quick-action .action-content h4[b-gnyu4zou5r] {
    color: #14213D;
    font-size: 1.1rem;
    font-weight: 600;
    margin: 0 0 0.25rem 0;
}

.quick-action .action-content p[b-gnyu4zou5r] {
    color: #2E2E2E;
    font-size: 0.9rem;
    margin: 0;
    line-height: 1.3;
}

/* Error Section */
.error-section[b-gnyu4zou5r] {
    margin-top: 2rem;
}

[b-gnyu4zou5r] .error-card {
    border: 2px solid #dc3545;
    background: linear-gradient(135deg, rgba(220, 53, 69, 0.05) 0%, rgba(255, 193, 7, 0.05) 100%);
}

.error-content[b-gnyu4zou5r] {
    text-align: center;
    padding: 2rem;
}

.error-icon[b-gnyu4zou5r] {
    font-size: 3rem;
    color: #dc3545;
    margin-bottom: 1rem;
}

.error-content h4[b-gnyu4zou5r] {
    color: #14213D;
    font-size: 1.3rem;
    font-weight: 600;
    margin-bottom: 0.75rem;
}

.error-content p[b-gnyu4zou5r] {
    color: #2E2E2E;
    font-size: 1rem;
    margin-bottom: 1.5rem;
    line-height: 1.5;
}

.error-actions[b-gnyu4zou5r] {
    display: flex;
    gap: 1rem;
    justify-content: center;
    flex-wrap: wrap;
}

/* Responsive Design */
@media (max-width: 768px) {
    .employer-status-page[b-gnyu4zou5r] {
        padding: 1rem;
    }
    
    .page-header[b-gnyu4zou5r] {
        flex-direction: column;
        align-items: flex-start;
    }
    
    .page-title[b-gnyu4zou5r] {
        font-size: 2rem;
    }
    
    .employer-header[b-gnyu4zou5r] {
        flex-direction: column;
        align-items: flex-start;
    }
    
    .details-grid[b-gnyu4zou5r] {
        grid-template-columns: 1fr;
        gap: 1rem;
    }
    
    .progress-steps[b-gnyu4zou5r] {
        gap: 1rem;
    }
    
    .step[b-gnyu4zou5r] {
        flex-direction: column;
        text-align: center;
    }
    
    .users-grid[b-gnyu4zou5r] {
        grid-template-columns: 1fr;
        gap: 1rem;
    }
    
    .user-card[b-gnyu4zou5r] {
        flex-direction: column;
        text-align: center;
    }
    
    .quick-actions-grid[b-gnyu4zou5r] {
        grid-template-columns: 1fr;
        gap: 1rem;
    }
    
    .quick-action[b-gnyu4zou5r] {
        flex-direction: column;
        text-align: center;
        padding: 1.25rem;
    }
    
    .pending-action[b-gnyu4zou5r] {
        flex-direction: column;
        text-align: center;
        gap: 1rem;
    }
}

@media (max-width: 480px) {
    .employer-status-page[b-gnyu4zou5r] {
        padding: 0.5rem;
    }
    
    .page-title[b-gnyu4zou5r] {
        font-size: 1.75rem;
        flex-direction: column;
        align-items: flex-start;
        gap: 0.5rem;
    }
    
    .employer-badges[b-gnyu4zou5r] {
        flex-direction: column;
        align-items: flex-start;
    }
    
    .step[b-gnyu4zou5r] {
        padding: 1.25rem;
    }
    
    .step-icon[b-gnyu4zou5r] {
        width: 40px;
        height: 40px;
        font-size: 1.2rem;
    }
    
    .user-card[b-gnyu4zou5r] {
        padding: 1.25rem;
    }
    
    .user-avatar[b-gnyu4zou5r] {
        width: 40px;
        height: 40px;
        font-size: 1.5rem;
    }
    
    .error-content[b-gnyu4zou5r] {
        padding: 1.5rem;
    }
    
    .error-icon[b-gnyu4zou5r] {
        font-size: 2.5rem;
    }
}
/* /Features/Admin/Onboarding/OnboardingDashboardPage.razor.rz.scp.css */
/* Main container */
.onboarding-dashboard-container[b-hmak404bzn] {
    padding: 0;
    background: #f8f9fa;
    min-height: 100vh;
}


/* Selected Employer Context */
.selected-employer-context[b-hmak404bzn] {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-top: 12px;
    padding: 12px 16px;
    background: rgba(200, 169, 81, 0.1);
    border: 1px solid rgba(200, 169, 81, 0.3);
    border-radius: 8px;
    color: #14213D;
    font-size: 0.9rem;
}

.selected-employer-context i[b-hmak404bzn] {
    color: #C8A951;
    font-size: 1rem;
}

.selected-employer-context span[b-hmak404bzn] {
    flex: 1;
}

/* Employer Context Header in Sections */
.employer-context-header[b-hmak404bzn] {
    margin-bottom: 20px;
    padding-bottom: 16px;
    border-bottom: 2px solid #e2e6ea;
}

.employer-context-header h3[b-hmak404bzn] {
    color: #14213D;
    font-size: 1.4rem;
    font-weight: 700;
    margin: 0 0 8px 0;
}

.employer-context-header .text-muted[b-hmak404bzn] {
    color: #6c757d;
    font-size: 1rem;
    margin: 0;
}

/* Page Header */
.page-header[b-hmak404bzn] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 30px;
    padding: 30px 24px 0 24px;
    background: #f8f9fa;
}

.header-content h1[b-hmak404bzn] {
    color: #14213D;
    font-size: 2.5rem;
    font-weight: 700;
    margin: 0;
    text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.1);
}

.header-content p[b-hmak404bzn] {
    color: #6c757d;
    font-size: 1.1rem;
    margin: 5px 0 0 0;
}

.header-actions[b-hmak404bzn] {
    display: flex;
    gap: 10px;
}

/* Filters Section */
.filters-section[b-hmak404bzn] {
    margin: 0 24px 30px 24px;
}

.filters-content[b-hmak404bzn] {
    padding: 24px;
    background: linear-gradient(135deg, #ffffff 0%, #f8f9fa 100%);
    border-radius: 12px;
    border: 1px solid #e2e6ea;
}

.filter-row[b-hmak404bzn] {
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
    align-items: end;
}

.search-group[b-hmak404bzn] {
    flex: 3;
    min-width: 300px;
}

.filter-group[b-hmak404bzn] {
    display: flex;
    flex-direction: column;
    min-width: 150px;
    flex: 1;
}

.filter-group label[b-hmak404bzn] {
    color: #14213D;
    font-weight: 600;
    margin-bottom: 8px;
    font-size: 0.9rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.filter-actions[b-hmak404bzn] {
    display: flex;
    gap: 12px;
    align-items: end;
    flex-wrap: nowrap;
    flex-shrink: 0;
}


/* Form Input Styling */
.filter-group .search-input[b-hmak404bzn] {
    width: 100%;
}

.filter-group .form-select[b-hmak404bzn],
.filter-group input[b-hmak404bzn],
.filter-group .e-input-group[b-hmak404bzn],
.filter-group .e-dropdownlist[b-hmak404bzn] {
    padding: 12px 16px;
    border: 2px solid #e2e6ea;
    border-radius: 8px;
    background: #ffffff;
    color: #14213D;
    font-size: 1rem;
    transition: all 0.3s ease;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
}

.filter-group .form-select:focus[b-hmak404bzn],
.filter-group input:focus[b-hmak404bzn],
.filter-group .e-input-group.e-input-focus[b-hmak404bzn],
.filter-group .e-dropdownlist.e-input-focus[b-hmak404bzn] {
    border-color: #C8A951;
    box-shadow: 0 0 0 0.2rem rgba(200, 169, 81, 0.25);
    outline: none;
    background: #ffffff;
}

.filter-group .form-select:hover[b-hmak404bzn],
.filter-group input:hover[b-hmak404bzn],
.filter-group .e-input-group:hover[b-hmak404bzn],
.filter-group .e-dropdownlist:hover[b-hmak404bzn] {
    border-color: #C8A951;
    background: #ffffff;
}

/* Button Styling */
.filter-actions .iswara-button[b-hmak404bzn] {
    height: 44px;
    min-width: 120px;
    border-radius: 8px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    font-size: 0.85rem;
    transition: all 0.3s ease;
}

.filter-actions .iswara-button--secondary[b-hmak404bzn] {
    background: linear-gradient(135deg, #6c757d 0%, #495057 100%);
    border: 2px solid #6c757d;
    color: white;
}

.filter-actions .iswara-button--secondary:hover[b-hmak404bzn] {
    background: linear-gradient(135deg, #5a6268 0%, #3d4043 100%);
    transform: translateY(-1px);
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15);
}

.filter-actions .iswara-button--outline[b-hmak404bzn] {
    background: transparent;
    border: 2px solid #C8A951;
    color: #C8A951;
}

.filter-actions .iswara-button--outline:hover[b-hmak404bzn] {
    background: #C8A951;
    color: white;
    transform: translateY(-1px);
    box-shadow: 0 4px 8px rgba(200, 169, 81, 0.3);
}

.filter-actions .iswara-button:disabled[b-hmak404bzn] {
    opacity: 0.6;
    cursor: not-allowed;
    transform: none !important;
    box-shadow: none !important;
}

/* Active Filters */
.active-filters[b-hmak404bzn] {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
    margin-top: 16px;
    padding-top: 16px;
    border-top: 1px solid #e2e6ea;
}

.filter-tag[b-hmak404bzn] {
    display: flex;
    align-items: center;
    gap: 8px;
    background: linear-gradient(135deg, #C8A951 0%, #b8994a 100%);
    color: white;
    padding: 8px 12px;
    border-radius: 20px;
    font-size: 0.85rem;
    font-weight: 600;
    box-shadow: 0 2px 6px rgba(200, 169, 81, 0.3);
    transition: all 0.3s ease;
    border: 2px solid transparent;
}

.filter-tag:hover[b-hmak404bzn] {
    transform: translateY(-1px);
    box-shadow: 0 4px 8px rgba(200, 169, 81, 0.4);
    background: linear-gradient(135deg, #b8994a 0%, #a88a42 100%);
}

.filter-tag i[b-hmak404bzn] {
    font-size: 0.9rem;
    opacity: 0.9;
}

.filter-tag .filter-remove-btn[b-hmak404bzn] {
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.2);
    border: none;
    color: white;
    font-size: 0.7rem;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: all 0.2s ease;
    margin-left: 4px;
}

.filter-tag .filter-remove-btn:hover[b-hmak404bzn] {
    background: rgba(255, 255, 255, 0.3);
    transform: scale(1.1);
}

/* Content Section */
.content-section[b-hmak404bzn] {
    margin: 0 24px 30px 24px;
}

.onboarding-data-grid[b-hmak404bzn] {
    background: white;
    border-radius: 8px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
    overflow: hidden;
}

.onboarding-data-grid .e-grid .e-gridheader[b-hmak404bzn] {
    background: linear-gradient(135deg, #14213D 0%, #2c3e50 100%);
    border-bottom: 3px solid #C8A951;
}

.onboarding-data-grid .e-grid .e-columnheader[b-hmak404bzn] {
    color: white;
    font-weight: 700;
    font-size: 0.9rem;
    text-transform: uppercase;
    letter-spacing: 0.8px;
    text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.3);
}

.onboarding-data-grid .e-grid .e-content .e-row[b-hmak404bzn] {
    transition: all 0.3s ease;
    border-bottom: 1px solid #f1f3f4;
}

.onboarding-data-grid .e-grid .e-content .e-row:hover[b-hmak404bzn] {
    background: linear-gradient(135deg, rgba(200, 169, 81, 0.08) 0%, rgba(200, 169, 81, 0.04) 100%);
    transform: translateY(-1px);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}

.onboarding-data-grid .e-grid .e-content .e-row:nth-child(even)[b-hmak404bzn] {
    background: rgba(248, 249, 250, 0.5);
}

.onboarding-data-grid .e-grid .e-content .e-row:nth-child(even):hover[b-hmak404bzn] {
    background: linear-gradient(135deg, rgba(200, 169, 81, 0.08) 0%, rgba(200, 169, 81, 0.04) 100%);
}

.onboarding-data-grid .e-pager[b-hmak404bzn] {
    background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);
    border-top: 2px solid #C8A951;
    padding: 12px;
}

.onboarding-data-grid .e-pager .e-pagercontainer .e-icons[b-hmak404bzn] {
    color: #C8A951;
}

.onboarding-data-grid .e-pager .e-numericcontainer .e-link[b-hmak404bzn] {
    color: #14213D;
    font-weight: 600;
}

.onboarding-data-grid .e-pager .e-numericcontainer .e-currentitem[b-hmak404bzn] {
    background: linear-gradient(135deg, #C8A951 0%, #b8994a 100%);
    color: white;
    border-radius: 6px;
}

/* Grid Cell Styling */
.company-name-cell[b-hmak404bzn] {
    padding: 12px 8px;
}

.company-title[b-hmak404bzn] {
    color: #14213D;
    font-size: 1.1rem;
    font-weight: 700;
    margin: 0 0 4px 0;
    cursor: pointer;
    transition: all 0.3s ease;
    line-height: 1.3;
}

.company-title:hover[b-hmak404bzn] {
    color: #C8A951;
    text-decoration: underline;
    text-shadow: 1px 1px 2px rgba(200, 169, 81, 0.2);
}

.company-industry[b-hmak404bzn] {
    color: #2E2E2E;
    font-size: 0.85rem;
    margin: 0;
    line-height: 1.3;
    max-width: 280px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    opacity: 0.7;
    font-style: italic;
}

.tier-badge[b-hmak404bzn] {
    display: inline-block;
    padding: 6px 12px;
    border-radius: 16px;
    font-size: 0.8rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: white;
    text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.2);
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
    transition: all 0.3s ease;
}

.tier-badge.tier-free[b-hmak404bzn] {
    background: linear-gradient(135deg, #6c757d 0%, #495057 100%);
}

.tier-badge.tier-bronze[b-hmak404bzn] {
    background: linear-gradient(135deg, #cd7f32 0%, #b8691e 100%);
}

.tier-badge.tier-silver[b-hmak404bzn] {
    background: linear-gradient(135deg, #c0c0c0 0%, #a8a8a8 100%);
    color: #2E2E2E;
    text-shadow: none;
}

.tier-badge.tier-gold[b-hmak404bzn] {
    background: linear-gradient(135deg, #C8A951 0%, #b8994a 100%);
}

.tier-badge:hover[b-hmak404bzn] {
    transform: translateY(-1px);
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
}

.user-count[b-hmak404bzn] {
    color: #14213D;
    font-size: 1.1rem;
    font-weight: 600;
    padding: 8px 12px;
    background: linear-gradient(135deg, rgba(200, 169, 81, 0.1) 0%, rgba(200, 169, 81, 0.05) 100%);
    border: 1px solid rgba(200, 169, 81, 0.2);
    border-radius: 8px;
    text-align: center;
    display: inline-block;
    min-width: 40px;
    transition: all 0.3s ease;
}

.user-count:hover[b-hmak404bzn] {
    background: linear-gradient(135deg, rgba(200, 169, 81, 0.15) 0%, rgba(200, 169, 81, 0.08) 100%);
    border-color: rgba(200, 169, 81, 0.3);
    transform: translateY(-1px);
    box-shadow: 0 2px 4px rgba(200, 169, 81, 0.2);
}

/* User Grid Styling */
.user-name-cell[b-hmak404bzn] {
    padding: 12px 8px;
}

.user-title[b-hmak404bzn] {
    color: #14213D;
    font-size: 1.1rem;
    font-weight: 700;
    margin: 0 0 4px 0;
    cursor: pointer;
    transition: all 0.3s ease;
    line-height: 1.3;
}

.user-title:hover[b-hmak404bzn] {
    color: #C8A951;
    text-decoration: underline;
    text-shadow: 1px 1px 2px rgba(200, 169, 81, 0.2);
}

.user-email-cell[b-hmak404bzn] {
    padding: 12px 8px;
}

.user-email[b-hmak404bzn] {
    color: #14213D;
    font-size: 0.9rem;
    font-weight: 500;
    margin: 0;
    line-height: 1.4;
    max-width: 200px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    padding: 6px 10px;
    background: linear-gradient(135deg, rgba(200, 169, 81, 0.05) 0%, rgba(200, 169, 81, 0.02) 100%);
    border: 1px solid rgba(200, 169, 81, 0.15);
    border-radius: 6px;
    display: inline-block;
    transition: all 0.3s ease;
    cursor: pointer;
}

.user-email:hover[b-hmak404bzn] {
    background: linear-gradient(135deg, rgba(200, 169, 81, 0.1) 0%, rgba(200, 169, 81, 0.05) 100%);
    border-color: rgba(200, 169, 81, 0.25);
    transform: translateY(-1px);
    box-shadow: 0 2px 4px rgba(200, 169, 81, 0.15);
}

.user-type-badge[b-hmak404bzn] {
    display: inline-block;
    padding: 6px 12px;
    border-radius: 16px;
    font-size: 0.8rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: white;
    text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.2);
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
    transition: all 0.3s ease;
}

.user-type-badge.user-type-iswaraadmin[b-hmak404bzn] {
    background: linear-gradient(135deg, #dc3545 0%, #c82333 100%);
}

.user-type-badge.user-type-employeradmin[b-hmak404bzn] {
    background: linear-gradient(135deg, #C8A951 0%, #b8994a 100%);
}

.user-type-badge.user-type-employeruser[b-hmak404bzn] {
    background: linear-gradient(135deg, #007bff 0%, #0056b3 100%);
}

.user-type-badge.user-type-employee[b-hmak404bzn] {
    background: linear-gradient(135deg, #28a745 0%, #1e7e34 100%);
}

.user-type-badge:hover[b-hmak404bzn] {
    transform: translateY(-1px);
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
}

.created-date[b-hmak404bzn] {
    color: #14213D;
    font-size: 0.9rem;
    font-weight: 500;
    padding: 4px 8px;
    background: rgba(200, 169, 81, 0.05);
    border-radius: 6px;
    display: inline-block;
}

.created-by-admin[b-hmak404bzn] {
    color: #14213D;
    font-size: 0.9rem;
    font-weight: 600;
    padding: 6px 10px;
    background: linear-gradient(135deg, rgba(200, 169, 81, 0.1) 0%, rgba(200, 169, 81, 0.05) 100%);
    border: 1px solid rgba(200, 169, 81, 0.2);
    border-radius: 8px;
    display: inline-block;
    transition: all 0.3s ease;
    max-width: 120px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.created-by-admin:hover[b-hmak404bzn] {
    background: linear-gradient(135deg, rgba(200, 169, 81, 0.15) 0%, rgba(200, 169, 81, 0.08) 100%);
    border-color: rgba(200, 169, 81, 0.3);
    transform: translateY(-1px);
    box-shadow: 0 2px 4px rgba(200, 169, 81, 0.2);
}

.action-buttons[b-hmak404bzn] {
    display: flex;
    gap: 8px;
    align-items: center;
}

.btn-icon[b-hmak404bzn] {
    min-width: 36px;
    height: 36px;
    padding: 8px;
    border-radius: 8px !important;
    transition: all 0.3s ease;
    border: 2px solid transparent;
}

.btn-icon:hover[b-hmak404bzn] {
    transform: translateY(-2px);
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15);
}

.iswara-button--outline.btn-icon[b-hmak404bzn] {
    border-color: #e2e6ea;
}

.iswara-button--outline.btn-icon:hover[b-hmak404bzn] {
    border-color: #C8A951;
    background: rgba(200, 169, 81, 0.1);
}

.iswara-button--secondary.btn-icon[b-hmak404bzn] {
    background: linear-gradient(135deg, #6c757d 0%, #495057 100%);
    border-color: #6c757d;
}

.iswara-button--secondary.btn-icon:hover[b-hmak404bzn] {
    background: linear-gradient(135deg, #5a6268 0%, #3d4043 100%);
}

.iswara-button--danger.btn-icon[b-hmak404bzn] {
    background: linear-gradient(135deg, #dc3545 0%, #c82333 100%);
    border-color: #dc3545;
    color: white;
}

.iswara-button--danger.btn-icon:hover[b-hmak404bzn] {
    background: linear-gradient(135deg, #c82333 0%, #bd2130 100%);
}

/* Status badges */
.status-badge[b-hmak404bzn] {
    padding: 6px 12px;
    border-radius: 20px;
    font-size: 0.85rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.status-active[b-hmak404bzn] {
    background: linear-gradient(135deg, #28a745 0%, #20c997 100%);
    color: white;
    box-shadow: 0 2px 4px rgba(40, 167, 69, 0.3);
}

.status-inactive[b-hmak404bzn] {
    background: linear-gradient(135deg, #6c757d 0%, #495057 100%);
    color: white;
    box-shadow: 0 2px 4px rgba(108, 117, 125, 0.3);
}

/* Loading Container */
.loading-container[b-hmak404bzn] {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 60px 20px;
    color: #6c757d;
}

.loading-container .spinner-border[b-hmak404bzn] {
    width: 3rem;
    height: 3rem;
    margin-bottom: 20px;
}

.loading-container p[b-hmak404bzn] {
    font-size: 1.1rem;
    margin: 0;
}

/* Empty State */
.empty-state[b-hmak404bzn] {
    text-align: center;
    padding: 60px 20px;
    color: #6c757d;
}

.empty-state i[b-hmak404bzn] {
    font-size: 4rem;
    color: #C8A951;
    margin-bottom: 20px;
    opacity: 0.7;
}

.empty-state h3[b-hmak404bzn] {
    color: #14213D;
    font-size: 1.8rem;
    font-weight: 700;
    margin: 0 0 10px 0;
}

.empty-state p[b-hmak404bzn] {
    font-size: 1.1rem;
    margin: 0 0 30px 0;
}

/* Content Cards for Tiers and Logs */
.tier-assignment-content[b-hmak404bzn],
.logs-content[b-hmak404bzn] {
    padding: 30px;
    min-height: 400px;
}

/* Modal Styling */
.modal-overlay[b-hmak404bzn] {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1050;
}

.modal-content[b-hmak404bzn] {
    background: white;
    padding: 30px;
    border-radius: 12px;
    max-width: 800px;
    width: 90%;
    max-height: 90%;
    overflow-y: auto;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3);
}

.user-form-container h3[b-hmak404bzn] {
    color: #14213D;
    margin-bottom: 20px;
}

.form-actions[b-hmak404bzn] {
    display: flex;
    gap: 12px;
    justify-content: flex-end;
    margin-top: 20px;
}

/* Alert Messages */
.alert[b-hmak404bzn] {
    position: fixed;
    top: 20px;
    right: 20px;
    z-index: 1050;
    min-width: 350px;
    max-width: 500px;
    border: none;
    border-radius: 8px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
    animation: slideInRight-b-hmak404bzn 0.3s ease-out;
}

.alert i[b-hmak404bzn] {
    margin-right: 8px;
}

.alert-danger[b-hmak404bzn] {
    background: linear-gradient(135deg, #dc3545 0%, #c82333 100%);
    color: white;
}

.alert-success[b-hmak404bzn] {
    background: linear-gradient(135deg, #28a745 0%, #20c997 100%);
    color: white;
}

.btn-close[b-hmak404bzn] {
    filter: invert(1);
    opacity: 0.8;
}

.btn-close:hover[b-hmak404bzn] {
    opacity: 1;
}

@keyframes slideInRight-b-hmak404bzn {
    from {
        transform: translateX(100%);
        opacity: 0;
    }
    to {
        transform: translateX(0);
        opacity: 1;
    }
}

/* Responsive Design */
@media (max-width: 1200px) {
    .filter-row[b-hmak404bzn] {
        flex-wrap: wrap;
        gap: 12px;
    }
    
    .search-group[b-hmak404bzn] {
        flex: 1 1 100%;
        margin-bottom: 12px;
    }
    
    .filter-group[b-hmak404bzn] {
        flex: 1 1 calc(50% - 6px);
        min-width: 120px;
    }
    
    .filter-actions[b-hmak404bzn] {
        flex: 1 1 100%;
        justify-content: flex-start;
        margin-top: 12px;
    }
}

@media (max-width: 768px) {
    .onboarding-dashboard-container[b-hmak404bzn] {
        padding: 0;
    }
    
    .page-header[b-hmak404bzn] {
        flex-direction: column;
        align-items: flex-start;
        gap: 20px;
        padding: 20px 15px 0 15px;
    }
    
    .header-content h1[b-hmak404bzn] {
        font-size: 2rem;
    }
    
    .filters-section[b-hmak404bzn] {
        margin: 0 15px 20px 15px;
    }
    
    .content-section[b-hmak404bzn] {
        margin: 0 15px 20px 15px;
    }
    
    .filters-content[b-hmak404bzn] {
        padding: 20px;
    }
    
    .filter-row[b-hmak404bzn] {
        flex-direction: column;
        gap: 16px;
    }
    
    .search-group[b-hmak404bzn] {
        flex: 1 1 auto;
        margin-bottom: 0;
    }
    
    .filter-group[b-hmak404bzn] {
        flex: 1 1 auto;
        min-width: auto;
    }
    
    .filter-actions[b-hmak404bzn] {
        flex-direction: column;
        gap: 12px;
        margin-top: 16px;
    }
    
    .filter-actions .iswara-button[b-hmak404bzn] {
        width: 100%;
        min-width: auto;
    }
    
    
    .alert[b-hmak404bzn] {
        position: relative;
        top: auto;
        right: auto;
        margin: 20px 15px;
        min-width: auto;
        max-width: none;
    }
}

@media (max-width: 480px) {
    .header-content h1[b-hmak404bzn] {
        font-size: 1.8rem;
    }
    
    .section-navigation[b-hmak404bzn] {
        padding: 12px 15px;
    }
}

/* Confirmation Dialog Styles */
.confirmation-overlay[b-hmak404bzn] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.5);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1050;
    animation: fadeIn-b-hmak404bzn 0.3s ease-in-out;
}

.confirmation-dialog[b-hmak404bzn] {
    max-width: 500px;
    width: 90%;
    animation: slideUp-b-hmak404bzn 0.3s ease-out;
}

.confirmation-card[b-hmak404bzn] {
    border: none;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3);
}

.confirmation-content[b-hmak404bzn] {
    text-align: center;
    padding: 2rem;
}

.confirmation-icon[b-hmak404bzn] {
    margin-bottom: 1.5rem;
}

.confirmation-icon i[b-hmak404bzn] {
    font-size: 3rem;
    color: #dc3545;
}

.confirmation-content h4[b-hmak404bzn] {
    color: #14213D;
    font-weight: 700;
    margin-bottom: 1rem;
    font-size: 1.5rem;
}

.confirmation-content p[b-hmak404bzn] {
    color: #6c757d;
    margin-bottom: 1.5rem;
    font-size: 1.1rem;
    line-height: 1.5;
}

.confirmation-warning[b-hmak404bzn] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 12px 16px;
    background: rgba(255, 193, 7, 0.1);
    border: 1px solid rgba(255, 193, 7, 0.3);
    border-radius: 8px;
    margin-bottom: 2rem;
    font-size: 0.9rem;
    color: #856404;
}

.confirmation-warning i[b-hmak404bzn] {
    color: #ffc107;
    font-size: 1rem;
}

.confirmation-actions[b-hmak404bzn] {
    display: flex;
    gap: 1rem;
    justify-content: center;
    flex-wrap: wrap;
}

@keyframes fadeIn-b-hmak404bzn {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}

@keyframes slideUp-b-hmak404bzn {
    from {
        transform: translateY(30px);
        opacity: 0;
    }
    to {
        transform: translateY(0);
        opacity: 1;
    }
}
}
/* /Features/Admin/SurveyTemplates/Components/QuestionBuilder.razor.rz.scp.css */
.question-builder-container[b-5kleuo8hf1] {
    display: flex;
    flex-direction: column;
    height: 100%;
    background: white;
    border: 1px solid #dee2e6;
    border-radius: 8px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
    overflow: hidden;
}

.question-builder-card .card-header[b-5kleuo8hf1] {
    background: #f8f9fa;
    color: #495057;
    padding: 12px 16px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 1px solid #dee2e6;
    font-size: 14px;
    font-weight: 600;
}

.question-builder-card .card-header h4[b-5kleuo8hf1] {
    margin: 0;
    font-size: 14px;
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 8px;
}

.header-actions[b-5kleuo8hf1] {
    display: flex;
    gap: 8px;
    align-items: center;
}

.width-toggle-btn[b-5kleuo8hf1] {
    background: linear-gradient(135deg, #C8A951 0%, #b8994a 100%);
    color: white !important;
    border-color: #C8A951 !important;
    transition: all 0.3s ease;
}

.width-toggle-btn:hover[b-5kleuo8hf1] {
    background: linear-gradient(135deg, #b8994a 0%, #a87c41 100%);
    transform: scale(1.05);
}

.question-builder-card[b-5kleuo8hf1] {
    display: flex;
    flex-direction: column;
    height: 100%;
    border: none;
    border-radius: 0;
    box-shadow: none;
}

.question-builder-card .card-content[b-5kleuo8hf1] {
    padding: 16px;
    transition: all 0.3s ease;
    overflow-y: auto;
    flex: 1;
    min-height: 0;
}

.question-builder-card .card-content.collapsed[b-5kleuo8hf1] {
    padding: 0;
    max-height: 0;
}

/* Question Sections */
.question-section[b-5kleuo8hf1] {
    margin-bottom: 20px;
    border: 1px solid #dee2e6;
    border-radius: 6px;
    overflow: hidden;
    background: white;
}

.section-header[b-5kleuo8hf1] {
    background: #f8f9fa;
    padding: 10px 12px;
    border-bottom: 1px solid #dee2e6;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.section-header h5[b-5kleuo8hf1] {
    margin: 0;
    color: #495057;
    font-size: 13px;
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 6px;
}

.section-header i[b-5kleuo8hf1] {
    color: #6c757d;
    font-size: 12px;
}

.section-actions[b-5kleuo8hf1] {
    display: flex;
    gap: 6px;
}

/* Answer Options Section - Special Highlight */
.answer-options-section[b-5kleuo8hf1] {
    border: 2px solid #dc3545;
    box-shadow: 0 0 0 0.25rem rgba(220, 53, 69, 0.1);
    border-radius: 8px;
}

.answer-options-section .section-header[b-5kleuo8hf1] {
    background: linear-gradient(135deg, #007bff 0%, #0056b3 100%);
    color: white;
}

.answer-options-section .section-header h5[b-5kleuo8hf1] {
    color: white;
}

.answer-options-section .section-header i[b-5kleuo8hf1] {
    color: #ffd700;
}

.question-section > .form-group[b-5kleuo8hf1],
.question-section > .form-row[b-5kleuo8hf1] {
    padding: 12px;
    margin: 0;
}

.question-section > .form-group:not(:last-child)[b-5kleuo8hf1],
.question-section > .form-row:not(:last-child)[b-5kleuo8hf1] {
    border-bottom: 1px solid #e9ecef;
}

.form-row[b-5kleuo8hf1] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
    margin-bottom: 12px;
}

.form-check-container[b-5kleuo8hf1] {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    min-height: 50px;
}

.form-group[b-5kleuo8hf1] {
    margin-bottom: 12px;
}

.form-label[b-5kleuo8hf1] {
    color: #495057;
    font-weight: 500;
    margin-bottom: 6px;
    display: block;
    font-size: 12px;
}

.form-select[b-5kleuo8hf1] {
    width: 100%;
    padding: 8px 12px;
    border: 1px solid #dee2e6;
    border-radius: 4px;
    background: white;
    color: #495057;
    font-size: 13px;
    transition: all 0.15s ease-in-out;
}

.form-select:focus[b-5kleuo8hf1] {
    border-color: #86b7fe;
    box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.25);
    outline: none;
}

.form-check[b-5kleuo8hf1] {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-top: 10px;
}

.form-check-input[b-5kleuo8hf1] {
    width: 20px;
    height: 20px;
    border: 2px solid #C8A951;
    border-radius: 4px;
}

.form-check-input:checked[b-5kleuo8hf1] {
    background-color: #C8A951;
    border-color: #C8A951;
}

.form-check-label[b-5kleuo8hf1] {
    color: #14213D;
    font-weight: 600;
    cursor: pointer;
    margin: 0;
}

/* Options Section */
.options-list[b-5kleuo8hf1] {
    padding: 12px;
    display: flex;
    flex-direction: column;
    gap: 8px;
    max-height: 500px;
    overflow-y: auto;
    border-radius: 6px;
    background: #f8f9fa;
}

.option-item[b-5kleuo8hf1] {
    background: white;
    border: 2px solid #E2E6EA;
    border-radius: 8px;
    padding: 16px;
    display: flex;
    align-items: center;
    gap: 12px;
    transition: all 0.3s ease;
    position: relative;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
}

.option-item:hover[b-5kleuo8hf1] {
    border-color: #C8A951;
    box-shadow: 0 4px 12px rgba(200, 169, 81, 0.15);
    transform: translateY(-1px);
}

.option-drag-handle[b-5kleuo8hf1] {
    color: #6c757d;
    cursor: grab;
    font-size: 1.1rem;
    padding: 5px;
    transition: color 0.2s ease;
}

.option-drag-handle:hover[b-5kleuo8hf1] {
    color: #C8A951;
}

.option-drag-handle:active[b-5kleuo8hf1] {
    cursor: grabbing;
}

.option-content[b-5kleuo8hf1] {
    flex: 1;
    min-width: 0;
}

.option-inputs[b-5kleuo8hf1] {
    display: flex;
    align-items: center;
    gap: 15px;
    flex-wrap: wrap;
}

.option-inputs > div[b-5kleuo8hf1] {
    flex: 1;
    min-width: 200px;
}

@media (max-width: 992px) {
    .option-inputs[b-5kleuo8hf1] {
        flex-direction: column;
        align-items: stretch;
        gap: 12px;
    }
    
    .option-text-input[b-5kleuo8hf1],
    .option-value-input[b-5kleuo8hf1] {
        min-width: auto;
        width: 100%;
    }
    
    .score-input-group[b-5kleuo8hf1] {
        max-width: 200px;
    }
}

.option-text-input[b-5kleuo8hf1] {
    flex: 2;
    min-width: 200px;
}

.option-value-input[b-5kleuo8hf1] {
    flex: 1;
    min-width: 100px;
}

.score-input-group[b-5kleuo8hf1] {
    display: flex;
    align-items: center;
    gap: 8px;
    min-width: 80px;
}

.score-label[b-5kleuo8hf1] {
    color: #6c757d;
    font-size: 0.85rem;
    font-weight: 600;
    white-space: nowrap;
}

.score-input[b-5kleuo8hf1] {
    width: 60px;
    padding: 8px;
    border: 2px solid #E2E6EA;
    border-radius: 6px;
    text-align: center;
    font-size: 0.9rem;
    transition: border-color 0.3s ease;
}

.score-input:focus[b-5kleuo8hf1] {
    border-color: #C8A951;
    outline: none;
}

.option-actions[b-5kleuo8hf1] {
    display: flex;
    gap: 5px;
}

.option-actions .btn[b-5kleuo8hf1] {
    width: 32px;
    height: 32px;
    padding: 0;
    border-radius: 6px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.empty-options[b-5kleuo8hf1] {
    padding: 40px 20px;
    text-align: center;
    color: #6c757d;
}

.empty-options i[b-5kleuo8hf1] {
    font-size: 2.5rem;
    color: #C8A951;
    margin-bottom: 15px;
    opacity: 0.7;
}

.empty-options p[b-5kleuo8hf1] {
    margin: 0;
    line-height: 1.5;
}

/* Advanced Section */
.advanced-section[b-5kleuo8hf1] {
    border-color: #C8A951;
}

.advanced-section .section-header[b-5kleuo8hf1] {
    background: linear-gradient(135deg, #fff8f0 0%, #f8f9fa 100%);
}

.advanced-content[b-5kleuo8hf1] {
    padding: 20px;
}

/* Conditional Logic Section */
.conditional-logic-section[b-5kleuo8hf1] {
    background: #f8f9fa;
    border: 1px solid #dee2e6;
    border-radius: 8px;
    padding: 20px;
    margin: 20px 0;
}

.conditional-logic-section .section-header[b-5kleuo8hf1] {
    display: flex;
    flex-direction: column;
    gap: 5px;
    margin-bottom: 20px;
    padding-bottom: 15px;
    border-bottom: 1px solid #dee2e6;
}

.conditional-logic-section .section-header h6[b-5kleuo8hf1] {
    color: #14213D;
    font-size: 1rem;
    font-weight: 700;
    margin: 0;
    display: flex;
    align-items: center;
    gap: 8px;
}

.conditional-logic-section .section-header h6 i[b-5kleuo8hf1] {
    color: #C8A951;
    font-size: 1.1rem;
}

.conditional-logic-section .section-header small[b-5kleuo8hf1] {
    color: #6c757d;
    font-size: 0.85rem;
    font-style: italic;
}

.conditional-preview[b-5kleuo8hf1] {
    margin-top: 15px;
}

.conditional-preview .alert[b-5kleuo8hf1] {
    background: #d1ecf1;
    border: 1px solid #bee5eb;
    border-radius: 8px;
    color: #0c5460;
    padding: 12px 15px;
    margin: 0;
    font-size: 0.9rem;
    display: flex;
    align-items: flex-start;
    gap: 10px;
}

.conditional-preview .alert i[b-5kleuo8hf1] {
    color: #17a2b8;
    margin-top: 2px;
    flex-shrink: 0;
}

.conditional-preview .alert strong[b-5kleuo8hf1] {
    color: #14213D;
}

/* Conditional Logic Dropdown and Input Styling */
.conditional-text-input[b-5kleuo8hf1] {
    width: 100%;
    height: 38px;
    border: 1px solid #dee2e6;
    border-radius: 4px;
    background: white;
    transition: all 0.15s ease-in-out;
    font-size: 13px;
    padding: 8px 12px;
    color: #495057;
}

.conditional-text-input:focus[b-5kleuo8hf1] {
    border-color: #C8A951;
    box-shadow: 0 0 0 0.2rem rgba(200, 169, 81, 0.25);
    outline: none;
}

[b-5kleuo8hf1] .parent-question-dropdown .e-dropdownlist,
[b-5kleuo8hf1] .conditional-value-dropdown .e-dropdownlist {
    border: 1px solid #dee2e6;
    border-radius: 4px;
    height: 38px;
    font-size: 13px;
    background: white;
    transition: all 0.15s ease-in-out;
}

[b-5kleuo8hf1] .parent-question-dropdown .e-dropdownlist:hover,
[b-5kleuo8hf1] .conditional-value-dropdown .e-dropdownlist:hover {
    border-color: #C8A951;
}

[b-5kleuo8hf1] .parent-question-dropdown .e-dropdownlist.e-input-focus,
[b-5kleuo8hf1] .conditional-value-dropdown .e-dropdownlist.e-input-focus {
    border-color: #C8A951;
    box-shadow: 0 0 0 0.2rem rgba(200, 169, 81, 0.25);
}

[b-5kleuo8hf1] .parent-question-dropdown .e-input-group .e-input,
[b-5kleuo8hf1] .conditional-value-dropdown .e-input-group .e-input {
    color: #495057;
    font-size: 13px;
    padding: 8px 12px;
}

[b-5kleuo8hf1] .parent-question-dropdown .e-input-group .e-ddl-icon,
[b-5kleuo8hf1] .conditional-value-dropdown .e-input-group .e-ddl-icon {
    color: #6c757d;
    transition: color 0.15s ease;
}

[b-5kleuo8hf1] .parent-question-dropdown .e-input-group:hover .e-ddl-icon,
[b-5kleuo8hf1] .conditional-value-dropdown .e-input-group:hover .e-ddl-icon {
    color: #C8A951;
}

[b-5kleuo8hf1] .parent-question-dropdown .e-input-group.e-input-focus .e-ddl-icon,
[b-5kleuo8hf1] .conditional-value-dropdown .e-input-group.e-input-focus .e-ddl-icon {
    color: #C8A951;
}

/* Preview Card */
.preview-card .card-header[b-5kleuo8hf1] {
    background: linear-gradient(135deg, #C8A951 0%, #b8994a 100%);
    color: white;
    padding: 15px 20px;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.preview-card .card-header h5[b-5kleuo8hf1] {
    margin: 0;
    font-size: 1.1rem;
    display: flex;
    align-items: center;
    gap: 10px;
}

.preview-card .card-content[b-5kleuo8hf1] {
    padding: 20px;
    background: #f8f9fa;
}

/* Quick Setup Modal */
.quick-setup-options[b-5kleuo8hf1] {
    display: flex;
    flex-direction: column;
    gap: 15px;
}

.scale-preset-grid[b-5kleuo8hf1] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
}

.scale-preset[b-5kleuo8hf1] {
    text-align: left;
    padding: 15px;
    border: 2px solid #E2E6EA;
    border-radius: 8px;
    background: white;
    transition: all 0.3s ease;
    width: 100%;
}

.scale-preset:hover[b-5kleuo8hf1] {
    border-color: #C8A951;
    background: #fff8f0;
}

.scale-preset small[b-5kleuo8hf1] {
    display: block;
    color: #6c757d;
    margin-top: 5px;
    font-size: 0.85rem;
}

/* Validation Styles */
.is-invalid[b-5kleuo8hf1] {
    border-color: #dc3545 !important;
    box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.25) !important;
}

.validation-message[b-5kleuo8hf1] {
    color: #dc3545;
    font-size: 0.85rem;
    margin-top: 5px;
    display: block;
}

/* Modal Styles */
.modal-content[b-5kleuo8hf1] {
    border: none;
    border-radius: 12px;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.2);
}

.modal-header[b-5kleuo8hf1] {
    background: linear-gradient(135deg, #14213D 0%, #2c3e50 100%);
    color: white;
    border-radius: 12px 12px 0 0;
    padding: 20px;
}

.modal-title[b-5kleuo8hf1] {
    font-size: 1.3rem;
    font-weight: 700;
    margin: 0;
}

.btn-close[b-5kleuo8hf1] {
    filter: invert(1);
    opacity: 0.8;
}

.btn-close:hover[b-5kleuo8hf1] {
    opacity: 1;
}

/* Drag and Drop Styles */
.option-item.dragging[b-5kleuo8hf1] {
    opacity: 0.5;
    transform: rotate(1deg);
    z-index: 1000;
}

.option-item.drop-zone[b-5kleuo8hf1] {
    border-color: #C8A951 !important;
    background: linear-gradient(135deg, rgba(200, 169, 81, 0.1) 0%, rgba(200, 169, 81, 0.05) 100%);
    transform: scale(1.02);
}

/* Question Type Icons */
.question-builder-card .card-header i[b-5kleuo8hf1] {
    color: #C8A951;
}

/* Animations */
@keyframes optionAdded-b-5kleuo8hf1 {
    0% {
        opacity: 0;
        transform: translateY(-10px);
    }
    100% {
        opacity: 1;
        transform: translateY(0);
    }
}

.option-item.newly-added[b-5kleuo8hf1] {
    animation: optionAdded-b-5kleuo8hf1 0.3s ease-out;
}

/* Responsive Design */
@media (max-width: 768px) {
    .question-builder-container[b-5kleuo8hf1] {
        max-height: none;
    }
    
    .form-row[b-5kleuo8hf1] {
        grid-template-columns: 1fr;
        gap: 15px;
    }
    
    .option-inputs[b-5kleuo8hf1] {
        flex-direction: column;
        align-items: stretch;
        gap: 12px;
    }
    
    .option-text-input[b-5kleuo8hf1],
    .option-value-input[b-5kleuo8hf1] {
        min-width: auto;
        flex: none;
        width: 100%;
    }
    
    .score-input-group[b-5kleuo8hf1] {
        justify-content: flex-start;
        max-width: 150px;
    }
    
    .quick-setup-options[b-5kleuo8hf1] {
        gap: 10px;
    }
    
    .scale-preset-grid[b-5kleuo8hf1] {
        grid-template-columns: 1fr;
    }
    
    .scale-preset[b-5kleuo8hf1] {
        padding: 12px;
    }
}

@media (max-width: 480px) {
    .question-builder-card .card-content[b-5kleuo8hf1],
    .options-list[b-5kleuo8hf1],
    .advanced-content[b-5kleuo8hf1],
    .preview-card .card-content[b-5kleuo8hf1] {
        padding: 15px;
    }
    
    .option-item[b-5kleuo8hf1] {
        padding: 12px;
        flex-direction: column;
        align-items: stretch;
        gap: 10px;
    }
    
    .option-drag-handle[b-5kleuo8hf1] {
        align-self: center;
    }
    
    .option-actions[b-5kleuo8hf1] {
        align-self: center;
    }
}

/* Focus and accessibility improvements */
.btn:focus[b-5kleuo8hf1],
.form-select:focus[b-5kleuo8hf1],
.form-check-input:focus[b-5kleuo8hf1],
.score-input:focus[b-5kleuo8hf1] {
    box-shadow: 0 0 0 0.2rem rgba(200, 169, 81, 0.25);
}

/* High contrast mode support */
@media (prefers-contrast: high) {
    .option-item[b-5kleuo8hf1] {
        border-width: 3px;
    }
    
    .question-section[b-5kleuo8hf1] {
        border-width: 2px;
    }
}

/* Syncfusion Dropdown Styling */
[b-5kleuo8hf1] .question-type-dropdown .e-dropdownlist,
[b-5kleuo8hf1] .hazard-dropdown .e-dropdownlist {
    border: 1px solid #dee2e6;
    border-radius: 4px;
    height: 38px;
    font-size: 13px;
    background: white;
    transition: all 0.15s ease-in-out;
}

[b-5kleuo8hf1] .question-type-dropdown .e-dropdownlist:hover,
[b-5kleuo8hf1] .hazard-dropdown .e-dropdownlist:hover {
    border-color: #C8A951;
}

[b-5kleuo8hf1] .question-type-dropdown .e-dropdownlist.e-input-focus,
[b-5kleuo8hf1] .hazard-dropdown .e-dropdownlist.e-input-focus {
    border-color: #C8A951;
    box-shadow: 0 0 0 0.2rem rgba(200, 169, 81, 0.25);
}

[b-5kleuo8hf1] .question-type-dropdown .e-input-group .e-input,
[b-5kleuo8hf1] .hazard-dropdown .e-input-group .e-input {
    color: #495057;
    font-size: 13px;
    padding: 8px 12px;
}

[b-5kleuo8hf1] .question-type-dropdown .e-input-group .e-ddl-icon,
[b-5kleuo8hf1] .hazard-dropdown .e-input-group .e-ddl-icon {
    color: #6c757d;
    transition: color 0.15s ease;
}

[b-5kleuo8hf1] .question-type-dropdown .e-input-group:hover .e-ddl-icon,
[b-5kleuo8hf1] .hazard-dropdown .e-input-group:hover .e-ddl-icon {
    color: #C8A951;
}

[b-5kleuo8hf1] .question-type-dropdown .e-input-group.e-input-focus .e-ddl-icon,
[b-5kleuo8hf1] .hazard-dropdown .e-input-group.e-input-focus .e-ddl-icon {
    color: #C8A951;
}

/* Dropdown Popup Styling */
[b-5kleuo8hf1] .e-popup.e-ddl.e-popup-open {
    border: 1px solid #C8A951;
    border-radius: 6px;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15);
    z-index: 1100;
}

[b-5kleuo8hf1] .e-list-item {
    padding: 8px 12px;
    font-size: 13px;
    color: #495057;
    transition: all 0.15s ease;
}

[b-5kleuo8hf1] .e-list-item:hover {
    background: #fff8f0;
    color: #14213D;
}

[b-5kleuo8hf1] .e-list-item.e-active {
    background: #C8A951;
    color: white;
}

[b-5kleuo8hf1] .e-list-item.e-active.e-hover {
    background: #b8994a;
}

/* Clear Button Styling */
[b-5kleuo8hf1] .hazard-dropdown .e-clear-icon {
    color: #6c757d;
    font-size: 12px;
    transition: color 0.15s ease;
}

[b-5kleuo8hf1] .hazard-dropdown .e-clear-icon:hover {
    color: #dc3545;
}

/* Placeholder Styling */
[b-5kleuo8hf1] .question-type-dropdown .e-input-group .e-input::placeholder,
[b-5kleuo8hf1] .hazard-dropdown .e-input-group .e-input::placeholder {
    color: #6c757d;
    font-style: italic;
}

/* Reduced motion support */
@media (prefers-reduced-motion: reduce) {
    .option-item[b-5kleuo8hf1],
    .question-section[b-5kleuo8hf1],
    .question-builder-card .card-content[b-5kleuo8hf1] {
        transition: none;
    }
    
    .option-item.newly-added[b-5kleuo8hf1] {
        animation: none;
    }
    
    [b-5kleuo8hf1] .question-type-dropdown .e-dropdownlist,
    [b-5kleuo8hf1] .hazard-dropdown .e-dropdownlist,
    [b-5kleuo8hf1] .e-list-item {
        transition: none;
    }
}
/* /Features/Admin/SurveyTemplates/Components/QuestionLibrary.razor.rz.scp.css */
.question-library-content[b-mngp6d1w71] {
    padding: 1.5rem;
    height: 100%;
    overflow-y: auto;
    display: flex;
    flex-direction: column;
}

.search-section[b-mngp6d1w71] {
    margin-bottom: 2rem;
    padding: 1.5rem;
    background: rgba(255, 255, 255, 0.8);
    border-radius: 8px;
    border: 1px solid #e2e6ea;
}

.search-box[b-mngp6d1w71] {
    margin-bottom: 1rem;
}

.search-box .form-control[b-mngp6d1w71] {
    border: 2px solid #e2e6ea;
    border-radius: 6px;
    padding: 0.75rem 1rem;
    font-size: 0.95rem;
    transition: all 0.3s ease;
}

.search-box .form-control:focus[b-mngp6d1w71] {
    border-color: #c8a951;
    box-shadow: 0 0 0 0.2rem rgba(200, 169, 81, 0.25);
}

.category-filter .form-select[b-mngp6d1w71] {
    border: 2px solid #e2e6ea;
    border-radius: 6px;
    padding: 0.75rem 1rem;
    font-size: 0.95rem;
    background-color: white;
    transition: all 0.3s ease;
}

.category-filter .form-select:focus[b-mngp6d1w71] {
    border-color: #c8a951;
    box-shadow: 0 0 0 0.2rem rgba(200, 169, 81, 0.25);
}

.questions-library[b-mngp6d1w71] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    flex: 1;
    overflow-y: auto;
}

.library-question-item[b-mngp6d1w71] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1.25rem;
    background: white;
    border: 2px solid #e2e6ea;
    border-radius: 8px;
    cursor: pointer;
    transition: all 0.3s ease;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
}

.library-question-item:hover[b-mngp6d1w71] {
    border-color: #c8a951;
    box-shadow: 0 4px 12px rgba(200, 169, 81, 0.15);
    transform: translateY(-2px);
}

.question-content[b-mngp6d1w71] {
    flex: 1;
    margin-right: 1rem;
}

.question-text[b-mngp6d1w71] {
    font-size: 1rem;
    font-weight: 500;
    color: #14213d;
    margin: 0 0 0.75rem 0;
    line-height: 1.4;
}

.question-meta[b-mngp6d1w71] {
    display: flex;
    align-items: center;
    gap: 1rem;
    margin-bottom: 0.75rem;
}

.question-type[b-mngp6d1w71] {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    padding: 0.25rem 0.75rem;
    background: #14213d;
    color: white;
    border-radius: 4px;
    font-size: 0.75rem;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.hazard-category[b-mngp6d1w71] {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    padding: 0.25rem 0.75rem;
    background: #bfd8b8;
    color: #2e2e2e;
    border-radius: 4px;
    font-size: 0.75rem;
    font-weight: 500;
}

.options-preview[b-mngp6d1w71] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.option-preview[b-mngp6d1w71] {
    padding: 0.25rem 0.5rem;
    background: #f8f9fa;
    border: 1px solid #e2e6ea;
    border-radius: 4px;
    font-size: 0.8rem;
    color: #2e2e2e;
}

.more-options[b-mngp6d1w71] {
    padding: 0.25rem 0.5rem;
    background: #e2e6ea;
    color: #14213d;
    border-radius: 4px;
    font-size: 0.8rem;
    font-weight: 500;
    font-style: italic;
}

.question-actions .btn[b-mngp6d1w71] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.5rem 1rem;
    border-radius: 6px;
    font-size: 0.875rem;
    font-weight: 500;
    transition: all 0.3s ease;
}

.question-actions .btn-primary[b-mngp6d1w71] {
    background: #c8a951;
    border-color: #c8a951;
    color: white;
}

.question-actions .btn-primary:hover[b-mngp6d1w71] {
    background: #b5964a;
    border-color: #b5964a;
    transform: translateY(-1px);
    box-shadow: 0 4px 8px rgba(200, 169, 81, 0.3);
}

.loading-state[b-mngp6d1w71] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 3rem 2rem;
    text-align: center;
    color: #6c757d;
}

.loading-state .spinner-border[b-mngp6d1w71] {
    width: 3rem;
    height: 3rem;
    margin-bottom: 1rem;
    color: #c8a951;
}

.loading-state p[b-mngp6d1w71] {
    font-size: 1rem;
    margin: 0;
}

.empty-state[b-mngp6d1w71] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 4rem 2rem;
    text-align: center;
    color: #6c757d;
}

.empty-state i[b-mngp6d1w71] {
    font-size: 3rem;
    margin-bottom: 1rem;
    color: #c8a951;
}

.empty-state h5[b-mngp6d1w71] {
    font-size: 1.25rem;
    font-weight: 600;
    color: #14213d;
    margin-bottom: 0.5rem;
}

.empty-state p[b-mngp6d1w71] {
    font-size: 1rem;
    margin: 0;
}

/* Responsive Design */
@media (max-width: 768px) {
    .question-library-content[b-mngp6d1w71] {
        padding: 1rem;
    }
    
    .search-section[b-mngp6d1w71] {
        padding: 1rem;
    }
    
    .library-question-item[b-mngp6d1w71] {
        flex-direction: column;
        align-items: flex-start;
        gap: 1rem;
    }
    
    .question-content[b-mngp6d1w71] {
        margin-right: 0;
        width: 100%;
    }
    
    .question-actions[b-mngp6d1w71] {
        width: 100%;
        display: flex;
        justify-content: flex-end;
    }
    
    .question-meta[b-mngp6d1w71] {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.5rem;
    }
}

/* Animation for slide-out appearance */
.question-library-content[b-mngp6d1w71] {
    animation: slideInRight-b-mngp6d1w71 0.3s ease-out;
}

@keyframes slideInRight-b-mngp6d1w71 {
    from {
        opacity: 0;
        transform: translateX(20px);
    }
    to {
        opacity: 1;
        transform: translateX(0);
    }
}

/* Accessibility improvements */
.library-question-item:focus[b-mngp6d1w71] {
    outline: 2px solid #c8a951;
    outline-offset: 2px;
}

.question-actions .btn:focus[b-mngp6d1w71] {
    box-shadow: 0 0 0 0.2rem rgba(200, 169, 81, 0.5);
}

/* High contrast mode support */
@media (prefers-contrast: high) {
    .library-question-item[b-mngp6d1w71] {
        border-width: 3px;
    }
    
    .question-type[b-mngp6d1w71],
    .hazard-category[b-mngp6d1w71] {
        border: 1px solid currentColor;
    }
}
/* /Features/Admin/SurveyTemplates/Components/QuestionPreview.razor.rz.scp.css */
.question-preview[b-stboejebye] {
    width: 100%;
}

.preview-question[b-stboejebye] {
    padding: 0;
    background: transparent;
}

.question-header[b-stboejebye] {
    background: rgba(255, 255, 255, 0.8);
    padding: 20px 25px;
    border-bottom: 2px solid #E2E6EA;
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 15px;
}

.question-text[b-stboejebye] {
    color: #14213D;
    font-size: 1.1rem;
    font-weight: 600;
    margin: 0;
    line-height: 1.4;
    flex: 1;
}

.required[b-stboejebye] {
    color: #dc3545;
    font-weight: 700;
    margin-left: 4px;
}

.question-type[b-stboejebye] {
    background: linear-gradient(135deg, #C8A951 0%, #b8994a 100%);
    color: white;
    padding: 6px 12px;
    border-radius: 12px;
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    white-space: nowrap;
    box-shadow: 0 2px 4px rgba(200, 169, 81, 0.3);
}

.question-content[b-stboejebye] {
    padding: 25px;
    background: white;
}

/* Options Preview */
.options-preview[b-stboejebye] {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.option-preview[b-stboejebye] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 15px;
    background: #f8f9fa;
    border: 2px solid #E2E6EA;
    border-radius: 8px;
    transition: all 0.3s ease;
}

.option-preview:hover[b-stboejebye] {
    background: #fff8f0;
    border-color: #C8A951;
}

.option-preview input[type="radio"][b-stboejebye],
.option-preview input[type="checkbox"][b-stboejebye] {
    width: 18px;
    height: 18px;
    accent-color: #C8A951;
    margin: 0;
}

.option-preview label[b-stboejebye] {
    color: #14213D;
    font-weight: 500;
    margin: 0;
    cursor: not-allowed;
    line-height: 1.4;
    flex: 1;
}

/* Scale Preview */
.scale-preview[b-stboejebye] {
    background: #f8f9fa;
    border-radius: 12px;
    padding: 20px;
    border: 2px solid #E2E6EA;
}

.scale-options[b-stboejebye] {
    display: flex;
    gap: 15px;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
}

.scale-option[b-stboejebye] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    padding: 12px;
    background: white;
    border: 2px solid #E2E6EA;
    border-radius: 8px;
    transition: all 0.3s ease;
    flex: 1;
    min-width: 80px;
}

.scale-option:hover[b-stboejebye] {
    border-color: #C8A951;
    background: #fff8f0;
}

.scale-option input[type="radio"][b-stboejebye] {
    width: 20px;
    height: 20px;
    accent-color: #C8A951;
    margin: 0;
}

.scale-option label[b-stboejebye] {
    color: #14213D;
    font-weight: 500;
    font-size: 0.9rem;
    text-align: center;
    margin: 0;
    cursor: not-allowed;
    line-height: 1.3;
}

/* Text Input Preview */
.question-content input[type="text"][b-stboejebye],
.question-content textarea[b-stboejebye] {
    width: 100%;
    padding: 12px 15px;
    border: 2px solid #E2E6EA;
    border-radius: 8px;
    background: #f8f9fa;
    color: #6c757d;
    font-size: 1rem;
    transition: border-color 0.3s ease;
}

.question-content input[type="text"]:focus[b-stboejebye],
.question-content textarea:focus[b-stboejebye] {
    border-color: #C8A951;
    outline: none;
    box-shadow: 0 0 0 0.2rem rgba(200, 169, 81, 0.25);
}

.question-content textarea[b-stboejebye] {
    resize: vertical;
    line-height: 1.5;
}

/* Yes/No Preview */
.yesno-preview[b-stboejebye] {
    display: flex;
    gap: 20px;
    justify-content: center;
}

.yesno-preview .option-preview[b-stboejebye] {
    flex: 1;
    max-width: 150px;
    justify-content: center;
    text-align: center;
}

/* No Question State */
.no-question[b-stboejebye] {
    text-align: center;
    padding: 40px 20px;
    color: #6c757d;
    font-style: italic;
}

/* Responsive Design */
@media (max-width: 768px) {
    .question-header[b-stboejebye] {
        flex-direction: column;
        align-items: flex-start;
        gap: 10px;
        padding: 15px 20px;
    }
    
    .question-content[b-stboejebye] {
        padding: 20px;
    }
    
    .scale-options[b-stboejebye] {
        flex-direction: column;
        gap: 10px;
    }
    
    .scale-option[b-stboejebye] {
        width: 100%;
        flex-direction: row;
        justify-content: flex-start;
        gap: 12px;
    }
    
    .yesno-preview[b-stboejebye] {
        flex-direction: column;
        gap: 12px;
    }
    
    .yesno-preview .option-preview[b-stboejebye] {
        max-width: none;
    }
}

@media (max-width: 480px) {
    .question-header[b-stboejebye] {
        padding: 12px 15px;
    }
    
    .question-content[b-stboejebye] {
        padding: 15px;
    }
    
    .question-text[b-stboejebye] {
        font-size: 1rem;
    }
    
    .question-type[b-stboejebye] {
        font-size: 0.7rem;
        padding: 4px 8px;
    }
    
    .option-preview[b-stboejebye] {
        padding: 10px 12px;
    }
    
    .scale-option[b-stboejebye] {
        padding: 10px;
    }
}

/* Focus and accessibility improvements */
.option-preview input:focus[b-stboejebye],
.scale-option input:focus[b-stboejebye],
.question-content input:focus[b-stboejebye],
.question-content textarea:focus[b-stboejebye] {
    box-shadow: 0 0 0 0.2rem rgba(200, 169, 81, 0.25);
}

/* High contrast mode support */
@media (prefers-contrast: high) {
    .option-preview[b-stboejebye],
    .scale-option[b-stboejebye] {
        border-width: 3px;
    }
    
    .question-header[b-stboejebye] {
        border-bottom-width: 3px;
    }
}

/* Reduced motion support */
@media (prefers-reduced-motion: reduce) {
    .option-preview[b-stboejebye],
    .scale-option[b-stboejebye],
    .question-content input[b-stboejebye],
    .question-content textarea[b-stboejebye] {
        transition: none;
    }
}
/* /Features/Admin/SurveyTemplates/Components/TemplateEditor.razor.rz.scp.css */

.editor-header[b-vg3bhx7vd9] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 24px;
    padding: 16px 20px;
    background: white;
    border-radius: 8px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
    border: 1px solid #dee2e6;
}

.header-content h2[b-vg3bhx7vd9] {
    color: #212529;
    font-size: 24px;
    font-weight: 600;
    margin: 0;
}

.header-content p[b-vg3bhx7vd9] {
    color: #6c757d;
    font-size: 14px;
    margin: 4px 0 0 0;
}

.header-actions[b-vg3bhx7vd9] {
    display: flex;
    gap: 12px;
}

.editor-content[b-vg3bhx7vd9] {
    display: grid;
    grid-template-columns: 1fr 700px;
    gap: 20px;
    align-items: start;
    width: 100%;
    margin: 0;
}

.editor-content.sidebar-expanded[b-vg3bhx7vd9] {
    grid-template-columns: 1fr 900px;
}

.editor-content.sidebar-fullwidth[b-vg3bhx7vd9] {
    grid-template-columns: 1fr 1fr;
}

.editor-main[b-vg3bhx7vd9] {
    display: flex;
    flex-direction: column;
    gap: 25px;
}

.editor-sidebar[b-vg3bhx7vd9] {
    position: sticky;
    top: 20px;
    max-height: calc(100vh - 40px);
    overflow-y: auto;
}

/* Template Information Card */
.template-info-card[b-vg3bhx7vd9] {
    background: white;
    border: 1px solid #dee2e6;
    border-radius: 8px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
    margin-bottom: 20px;
}

.template-info-card .card-header[b-vg3bhx7vd9] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    background: #f8f9fa;
    color: #495057;
    padding: 12px 20px;
    border-radius: 8px 8px 0 0;
    border-bottom: 1px solid #dee2e6;
}

.template-info-card .card-header h4[b-vg3bhx7vd9] {
    margin: 0;
    font-size: 16px;
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 8px;
}

.template-info-card .card-content[b-vg3bhx7vd9] {
    padding: 20px;
    transition: all 0.3s ease;
}

.template-info-card .card-content.collapsed[b-vg3bhx7vd9] {
    padding: 0;
    max-height: 0;
    overflow: hidden;
}

.form-row[b-vg3bhx7vd9] {
    display: grid;
    grid-template-columns: 1fr 2fr;
    gap: 20px;
    margin-bottom: 20px;
}

.form-check-container[b-vg3bhx7vd9] {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    min-height: 50px;
}

.form-group[b-vg3bhx7vd9] {
    margin-bottom: 20px;
}

.form-label[b-vg3bhx7vd9] {
    color: #14213D;
    font-weight: 600;
    margin-bottom: 8px;
    display: block;
    font-size: 0.9rem;
}

.form-select[b-vg3bhx7vd9] {
    width: 100%;
    padding: 12px 15px;
    border: 2px solid #E2E6EA;
    border-radius: 8px;
    background: white;
    color: #14213D;
    font-size: 1rem;
    transition: all 0.3s ease;
}

.form-select:focus[b-vg3bhx7vd9] {
    border-color: #C8A951;
    box-shadow: 0 0 0 0.2rem rgba(200, 169, 81, 0.25);
    outline: none;
}

/* Syncfusion DropDown Styling in TemplateEditor */
.form-group .industry-dropdown[b-vg3bhx7vd9] {
    width: 100%;
    height: 44px;
    border: 2px solid #E2E6EA;
    border-radius: 8px;
    background: #ffffff;
    font-size: 1rem;
    transition: all 0.3s ease;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
}

.form-group .industry-dropdown:hover[b-vg3bhx7vd9] {
    border-color: #C8A951;
    background: #ffffff;
}

.form-group .industry-dropdown.e-input-focus[b-vg3bhx7vd9] {
    border-color: #C8A951;
    box-shadow: 0 0 0 0.2rem rgba(200, 169, 81, 0.25);
    outline: none;
    background: #ffffff;
}

.form-group .industry-dropdown .e-input[b-vg3bhx7vd9] {
    color: #14213D;
    font-weight: 500;
    padding: 0 16px;
    height: 100%;
    border: none;
    background: transparent;
}

.form-group .industry-dropdown .e-ddl-icon[b-vg3bhx7vd9] {
    color: #C8A951;
    font-size: 1.1rem;
    right: 12px;
}

.form-group .industry-dropdown .e-clear-icon[b-vg3bhx7vd9] {
    color: #6c757d;
    font-size: 1rem;
    right: 36px;
}

.form-group .industry-dropdown .e-clear-icon:hover[b-vg3bhx7vd9] {
    color: #C8A951;
}

/* Syncfusion Rich Text Editor Styling */
.syncfusion-rich-text-editor[b-vg3bhx7vd9] {
    border: 2px solid #E2E6EA;
    border-radius: 8px;
    overflow: hidden;
    transition: border-color 0.3s ease, box-shadow 0.3s ease;
    background: white;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
}

.syncfusion-rich-text-editor:focus-within[b-vg3bhx7vd9] {
    border-color: #C8A951;
    box-shadow: 0 0 0 0.2rem rgba(200, 169, 81, 0.25);
}

/* Syncfusion RTE Toolbar Styling */
.syncfusion-rich-text-editor .e-rte-toolbar[b-vg3bhx7vd9] {
    background: linear-gradient(135deg, #14213D 0%, #2E2E2E 100%);
    border-bottom: 2px solid #C8A951;
    padding: 8px 12px;
}

.syncfusion-rich-text-editor .e-toolbar-item[b-vg3bhx7vd9] {
    margin: 2px;
}

.syncfusion-rich-text-editor .e-toolbar-item .e-tbar-btn[b-vg3bhx7vd9] {
    background: rgba(255, 255, 255, 0.1);
    color: #FFFFFF;
    border: 1px solid rgba(255, 255, 255, 0.2);
    border-radius: 6px;
    padding: 6px 8px;
    transition: all 0.3s ease;
    font-weight: 500;
}

.syncfusion-rich-text-editor .e-toolbar-item .e-tbar-btn:hover[b-vg3bhx7vd9] {
    background: rgba(200, 169, 81, 0.2);
    border-color: rgba(200, 169, 81, 0.4);
    color: #FFFFFF;
    transform: translateY(-1px);
}

.syncfusion-rich-text-editor .e-toolbar-item .e-tbar-btn.e-active[b-vg3bhx7vd9] {
    background: linear-gradient(135deg, #C8A951 0%, #BFD8B8 100%);
    border-color: #C8A951;
    color: #14213D;
    font-weight: 600;
}

.syncfusion-rich-text-editor .e-toolbar-item .e-separator[b-vg3bhx7vd9] {
    background: rgba(255, 255, 255, 0.3);
    margin: 0 4px;
}

/* Syncfusion RTE Content Area Styling */
.syncfusion-rich-text-editor .e-rte-content[b-vg3bhx7vd9] {
    background: #FFFFFF;
}

.syncfusion-rich-text-editor .e-content[b-vg3bhx7vd9] {
    min-height: 200px;
    padding: 16px;
    background: #FFFFFF;
    color: #14213D;
    font-size: 1rem;
    line-height: 1.6;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
}

.syncfusion-rich-text-editor .e-content:focus[b-vg3bhx7vd9] {
    outline: none;
}

/* Placeholder styling */
.syncfusion-rich-text-editor .e-content:empty[b-vg3bhx7vd9]:before {
    content: attr(placeholder);
    color: #6c757d;
    font-style: italic;
}

/* Dropdown styling for RTE */
.syncfusion-rich-text-editor .e-dropdown-popup[b-vg3bhx7vd9] {
    border: 2px solid #C8A951;
    border-radius: 8px;
    box-shadow: 0 8px 24px rgba(20, 33, 61, 0.15);
    background: #FFFFFF;
}

.syncfusion-rich-text-editor .e-dropdown-popup .e-item[b-vg3bhx7vd9] {
    color: #14213D;
    padding: 8px 12px;
    transition: all 0.2s ease;
}

.syncfusion-rich-text-editor .e-dropdown-popup .e-item:hover[b-vg3bhx7vd9] {
    background: linear-gradient(135deg, rgba(200, 169, 81, 0.1) 0%, rgba(191, 216, 184, 0.1) 100%);
    color: #14213D;
}

.syncfusion-rich-text-editor .e-dropdown-popup .e-item.e-active[b-vg3bhx7vd9] {
    background: linear-gradient(135deg, #C8A951 0%, #BFD8B8 100%);
    color: #14213D;
    font-weight: 600;
}

/* Color picker styling */
.syncfusion-rich-text-editor .e-colorpicker-popup[b-vg3bhx7vd9] {
    border: 2px solid #C8A951;
    border-radius: 8px;
    box-shadow: 0 8px 24px rgba(20, 33, 61, 0.15);
}

/* Link dialog styling */
.syncfusion-rich-text-editor .e-dialog[b-vg3bhx7vd9] {
    border-radius: 12px;
    border: 2px solid #C8A951;
}

.syncfusion-rich-text-editor .e-dialog .e-dlg-header[b-vg3bhx7vd9] {
    background: linear-gradient(135deg, #14213D 0%, #2E2E2E 100%);
    color: #FFFFFF;
    border-radius: 10px 10px 0 0;
}

.syncfusion-rich-text-editor .e-dialog .e-dlg-content[b-vg3bhx7vd9] {
    background: #FFFFFF;
    color: #14213D;
}

/* Quick toolbar styling */
.syncfusion-rich-text-editor .e-rte-quick-toolbar[b-vg3bhx7vd9] {
    background: linear-gradient(135deg, #14213D 0%, #2E2E2E 100%);
    border: 2px solid #C8A951;
    border-radius: 8px;
    box-shadow: 0 8px 24px rgba(20, 33, 61, 0.15);
}

.syncfusion-rich-text-editor .e-rte-quick-toolbar .e-toolbar-item .e-tbar-btn[b-vg3bhx7vd9] {
    background: rgba(255, 255, 255, 0.1);
    color: #FFFFFF;
    border: 1px solid rgba(255, 255, 255, 0.2);
    border-radius: 4px;
}

.syncfusion-rich-text-editor .e-rte-quick-toolbar .e-toolbar-item .e-tbar-btn:hover[b-vg3bhx7vd9] {
    background: rgba(200, 169, 81, 0.2);
    border-color: rgba(200, 169, 81, 0.4);
}

/* Tags Input */
.tags-input[b-vg3bhx7vd9] {
    border: 2px solid #E2E6EA;
    border-radius: 8px;
    background: white;
    transition: border-color 0.3s ease;
}

.tags-input:focus-within[b-vg3bhx7vd9] {
    border-color: #C8A951;
    box-shadow: 0 0 0 0.2rem rgba(200, 169, 81, 0.25);
}

.tags-container[b-vg3bhx7vd9] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    padding: 12px;
    align-items: center;
}

.tag[b-vg3bhx7vd9] {
    display: flex;
    align-items: center;
    gap: 6px;
    background: linear-gradient(135deg, #C8A951 0%, #b8994a 100%);
    color: white;
    padding: 4px 8px;
    border-radius: 12px;
    font-size: 0.85rem;
    font-weight: 500;
}

.tag button[b-vg3bhx7vd9],
.tag .tag-remove-btn[b-vg3bhx7vd9] {
    background: none;
    border: none;
    color: white;
    font-size: 0.8rem;
    font-weight: bold;
    cursor: pointer;
    opacity: 0.8;
    transition: opacity 0.2s ease;
    width: 18px;
    height: 18px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
}

.tag button:hover[b-vg3bhx7vd9] {
    opacity: 1;
}

.tag-input[b-vg3bhx7vd9] {
    border: none;
    outline: none;
    background: transparent;
    flex: 1;
    min-width: 120px;
    padding: 4px;
    color: #14213D;
}

.form-check[b-vg3bhx7vd9] {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-top: 20px;
}

.form-check-input[b-vg3bhx7vd9] {
    width: 20px;
    height: 20px;
    border: 2px solid #C8A951;
    border-radius: 4px;
}

.form-check-input:checked[b-vg3bhx7vd9] {
    background-color: #C8A951;
    border-color: #C8A951;
}

.form-check-label[b-vg3bhx7vd9] {
    color: #14213D;
    font-weight: 600;
    cursor: pointer;
}

/* Questions Panel */
.questions-panel[b-vg3bhx7vd9] {
    background: white;
    border: 1px solid #dee2e6;
    border-radius: 8px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
}

.questions-panel .card-header[b-vg3bhx7vd9] {
    background: linear-gradient(135deg, #C8A951 0%, #b8994a 100%);
    color: white;
    padding: 12px 20px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-radius: 8px 8px 0 0;
}

.questions-panel .card-header h4[b-vg3bhx7vd9] {
    margin: 0;
    font-size: 16px;
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 8px;
}

.questions-panel .header-actions[b-vg3bhx7vd9] {
    display: flex;
    gap: 8px;
}

.questions-panel .card-content[b-vg3bhx7vd9] {
    padding: 20px;
}

.empty-questions[b-vg3bhx7vd9] {
    text-align: center;
    padding: 60px 20px;
    color: #6c757d;
}

.empty-questions i[b-vg3bhx7vd9] {
    font-size: 4rem;
    color: #C8A951;
    margin-bottom: 20px;
    opacity: 0.7;
}

.empty-questions h5[b-vg3bhx7vd9] {
    color: #14213D;
    font-size: 1.5rem;
    font-weight: 700;
    margin: 0 0 10px 0;
}

.empty-questions p[b-vg3bhx7vd9] {
    font-size: 1.1rem;
    margin: 0 0 30px 0;
}

/* Questions List */
.questions-list[b-vg3bhx7vd9] {
    display: flex;
    flex-direction: column;
    gap: 15px;
}

.question-item[b-vg3bhx7vd9] {
    background: white;
    border: 2px solid #E2E6EA;
    border-radius: 12px;
    padding: 20px;
    display: flex;
    align-items: center;
    gap: 15px;
    transition: all 0.3s ease;
    cursor: pointer;
    position: relative;
}

.question-item:hover[b-vg3bhx7vd9] {
    border-color: #C8A951;
    box-shadow: 0 4px 12px rgba(200, 169, 81, 0.15);
    transform: translateY(-1px);
}

.question-item.selected[b-vg3bhx7vd9] {
    border-color: #C8A951;
    box-shadow: 0 0 0 3px rgba(200, 169, 81, 0.2);
    background: linear-gradient(135deg, #fff8f0 0%, #ffffff 100%);
}

.question-drag-handle[b-vg3bhx7vd9] {
    color: #6c757d;
    cursor: grab;
    font-size: 1.2rem;
    padding: 5px;
    transition: color 0.2s ease;
}

.question-drag-handle:hover[b-vg3bhx7vd9] {
    color: #C8A951;
}

.question-drag-handle:active[b-vg3bhx7vd9] {
    cursor: grabbing;
}

.question-content[b-vg3bhx7vd9] {
    flex: 1;
    min-width: 0;
}

.question-header[b-vg3bhx7vd9] {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    margin-bottom: 10px;
}

.question-type-icon[b-vg3bhx7vd9] {
    width: 40px;
    height: 40px;
    background: linear-gradient(135deg, #C8A951 0%, #b8994a 100%);
    color: white;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.1rem;
    flex-shrink: 0;
}

.question-info[b-vg3bhx7vd9] {
    flex: 1;
    min-width: 0;
}

.question-title[b-vg3bhx7vd9] {
    color: #14213D;
    font-size: 1.1rem;
    font-weight: 700;
    margin: 0 0 5px 0;
    display: flex;
    align-items: center;
    gap: 5px;
}

.required-indicator[b-vg3bhx7vd9] {
    color: #dc3545;
    font-weight: bold;
}

.question-text[b-vg3bhx7vd9] {
    color: #2E2E2E;
    margin: 0;
    line-height: 1.4;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.question-meta[b-vg3bhx7vd9] {
    display: flex;
    gap: 12px;
    align-items: center;
    flex-wrap: wrap;
}

.question-type-badge[b-vg3bhx7vd9] {
    padding: 4px 8px;
    border-radius: 12px;
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.badge-multiple-choice[b-vg3bhx7vd9] {
    background: linear-gradient(135deg, #007bff 0%, #0056b3 100%);
    color: white;
}

.badge-scale[b-vg3bhx7vd9] {
    background: linear-gradient(135deg, #ffc107 0%, #e0a800 100%);
    color: #212529;
}

.badge-text[b-vg3bhx7vd9] {
    background: linear-gradient(135deg, #28a745 0%, #1e7e34 100%);
    color: white;
}

.badge-yesno[b-vg3bhx7vd9] {
    background: linear-gradient(135deg, #17a2b8 0%, #138496 100%);
    color: white;
}

.badge-ranking[b-vg3bhx7vd9] {
    background: linear-gradient(135deg, #6610f2 0%, #520dc2 100%);
    color: white;
}

.badge-default[b-vg3bhx7vd9] {
    background: linear-gradient(135deg, #6c757d 0%, #545b62 100%);
    color: white;
}

.options-count[b-vg3bhx7vd9] {
    color: #6c757d;
    font-size: 0.85rem;
}

.question-actions[b-vg3bhx7vd9] {
    display: flex;
    gap: 8px;
    flex-shrink: 0;
}

.question-actions .btn[b-vg3bhx7vd9],
.question-actions .question-action-btn[b-vg3bhx7vd9] {
    width: 36px;
    height: 36px;
    padding: 0;
    border-radius: 6px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.2s ease;
}

.question-actions .btn:hover[b-vg3bhx7vd9] {
    transform: scale(1.05);
}

.questions-footer[b-vg3bhx7vd9] {
    margin-top: 16px;
    padding: 12px 16px;
    background: #f8f9fa;
    border-top: 1px solid #dee2e6;
    border-radius: 0 0 8px 8px;
}

.questions-summary[b-vg3bhx7vd9] {
    display: flex;
    gap: 16px;
    align-items: center;
    color: #6c757d;
    font-size: 12px;
    font-weight: 500;
}

.summary-item[b-vg3bhx7vd9] {
    display: flex;
    align-items: center;
    gap: 6px;
}

.summary-item i[b-vg3bhx7vd9] {
    color: #C8A951;
    width: 14px;
    text-align: center;
    font-size: 11px;
}

/* Help Panel */
.help-panel .help-content[b-vg3bhx7vd9] {
    text-align: center;
    padding: 30px 20px;
    color: #6c757d;
}

.help-content i[b-vg3bhx7vd9] {
    font-size: 3rem;
    color: #C8A951;
    margin-bottom: 15px;
    opacity: 0.8;
}

.help-content h5[b-vg3bhx7vd9] {
    color: #14213D;
    font-size: 1.3rem;
    font-weight: 700;
    margin: 0 0 15px 0;
}

.help-content ul[b-vg3bhx7vd9] {
    text-align: left;
    padding-left: 20px;
    margin: 0;
    line-height: 1.6;
}

.help-content li[b-vg3bhx7vd9] {
    margin-bottom: 8px;
}

/* Validation Styles */
.is-invalid[b-vg3bhx7vd9] {
    border-color: #dc3545 !important;
    box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.25) !important;
}

.validation-message[b-vg3bhx7vd9] {
    color: #dc3545;
    font-size: 0.85rem;
    margin-top: 5px;
    display: block;
}

/* Modal Styles */
.modal-xl[b-vg3bhx7vd9] {
    max-width: 90%;
}

.modal-content[b-vg3bhx7vd9] {
    border: none;
    border-radius: 12px;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.2);
}

.modal-header[b-vg3bhx7vd9] {
    background: linear-gradient(135deg, #14213D 0%, #2c3e50 100%);
    color: white;
    border-radius: 12px 12px 0 0;
    padding: 20px;
}

.modal-title[b-vg3bhx7vd9] {
    font-size: 1.3rem;
    font-weight: 700;
    margin: 0;
}

.btn-close[b-vg3bhx7vd9] {
    filter: invert(1);
    opacity: 0.8;
}

.btn-close:hover[b-vg3bhx7vd9] {
    opacity: 1;
}

/* Responsive Design */
@media (max-width: 1400px) {
    .editor-content.sidebar-fullwidth[b-vg3bhx7vd9] {
        grid-template-columns: 1fr 1.2fr;
    }
}

@media (max-width: 1200px) {
    .editor-content[b-vg3bhx7vd9] {
        grid-template-columns: 1fr;
        gap: 20px;
    }
    
    .editor-content.sidebar-expanded[b-vg3bhx7vd9],
    .editor-content.sidebar-fullwidth[b-vg3bhx7vd9] {
        grid-template-columns: 1fr;
    }
    
    .editor-sidebar[b-vg3bhx7vd9] {
        position: static;
        max-height: none;
        width: 100%;
    }
}

@media (max-width: 768px) {
    .template-editor-container[b-vg3bhx7vd9] {
        padding: 15px;
    }
    
    .editor-header[b-vg3bhx7vd9] {
        flex-direction: column;
        align-items: flex-start;
        gap: 20px;
    }
    
    .header-content h2[b-vg3bhx7vd9] {
        font-size: 1.8rem;
    }
    
    .header-actions[b-vg3bhx7vd9] {
        flex-wrap: wrap;
        gap: 10px;
        width: 100%;
        justify-content: center;
    }
    
    .form-row[b-vg3bhx7vd9] {
        grid-template-columns: 1fr;
        gap: 15px;
    }
    
    .question-item[b-vg3bhx7vd9] {
        padding: 15px;
        flex-direction: column;
        align-items: flex-start;
        gap: 10px;
    }
    
    .question-header[b-vg3bhx7vd9] {
        width: 100%;
    }
    
    .question-actions[b-vg3bhx7vd9] {
        width: 100%;
        justify-content: center;
        flex-wrap: wrap;
    }
    
    .questions-summary[b-vg3bhx7vd9] {
        flex-direction: column;
        align-items: flex-start;
        gap: 10px;
    }
    
    .tags-container[b-vg3bhx7vd9] {
        flex-direction: column;
        align-items: stretch;
        gap: 8px;
    }
    
    .tag-input[b-vg3bhx7vd9] {
        min-width: auto;
        width: 100%;
    }
}

@media (max-width: 480px) {
    .header-content h2[b-vg3bhx7vd9] {
        font-size: 1.5rem;
    }
    
    .question-meta[b-vg3bhx7vd9] {
        flex-direction: column;
        align-items: flex-start;
        gap: 8px;
    }
    
    .editor-toolbar[b-vg3bhx7vd9] {
        flex-wrap: wrap;
    }
}

/* Question Library Inline Styles */
.question-library-inline[b-vg3bhx7vd9] {
    background: white;
    border-radius: 8px;
    border: 2px solid #e2e6ea;
    overflow: hidden;
    height: 100%;
    display: flex;
    flex-direction: column;
    max-height: calc(100vh - 150px);
}

.library-header[b-vg3bhx7vd9] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 15px 20px;
    background: linear-gradient(135deg, #14213d 0%, #2c3e50 100%);
    color: white;
    border-bottom: 2px solid #e2e6ea;
    flex-shrink: 0;
}

.library-header h4[b-vg3bhx7vd9] {
    margin: 0;
    font-size: 1.1rem;
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 8px;
}

.library-header .btn[b-vg3bhx7vd9] {
    color: white;
    border-color: rgba(255, 255, 255, 0.3);
    background: rgba(255, 255, 255, 0.1);
    transition: all 0.3s ease;
}

.library-header .btn:hover[b-vg3bhx7vd9] {
    background: rgba(255, 255, 255, 0.2);
    border-color: rgba(255, 255, 255, 0.5);
    color: white;
    transform: scale(1.05);
}

.question-library-inline .question-library-content[b-vg3bhx7vd9] {
    flex: 1;
    overflow-y: auto;
    height: 100%;
}

/* Unsaved Changes Modal */
.unsaved-changes-summary[b-vg3bhx7vd9] {
    background: #fff3cd;
    border: 1px solid #ffeaa7;
    border-radius: 8px;
    padding: 16px;
    margin-top: 16px;
}

.unsaved-changes-summary h6[b-vg3bhx7vd9] {
    color: #856404;
    font-weight: 600;
    margin: 0 0 8px 0;
    font-size: 0.9rem;
}

.unsaved-changes-summary ul[b-vg3bhx7vd9] {
    margin: 0;
    padding-left: 20px;
    color: #856404;
}

.unsaved-changes-summary li[b-vg3bhx7vd9] {
    margin-bottom: 4px;
    font-size: 0.85rem;
}

.modal-dialog-centered[b-vg3bhx7vd9] {
    display: flex;
    align-items: center;
    min-height: calc(100% - 1rem);
}

.modal-dialog-centered .modal-content[b-vg3bhx7vd9] {
    max-width: 500px;
    width: 100%;
}

.modal-footer[b-vg3bhx7vd9] {
    display: flex;
    gap: 12px;
    justify-content: flex-end;
    align-items: center;
    padding: 16px 20px;
    background: #f8f9fa;
    border-top: 1px solid #dee2e6;
    border-radius: 0 0 12px 12px;
}

.modal-body[b-vg3bhx7vd9] {
    padding: 20px;
    line-height: 1.6;
}

.modal-body p[b-vg3bhx7vd9] {
    margin: 0 0 16px 0;
    color: #495057;
}

.modal-title .text-warning[b-vg3bhx7vd9] {
    color: #ffc107 !important;
}

/* Animation for modal */
.modal.fade.show[b-vg3bhx7vd9] {
    animation: modalFadeIn-b-vg3bhx7vd9 0.3s ease-out;
}

@keyframes modalFadeIn-b-vg3bhx7vd9 {
    from {
        opacity: 0;
        transform: scale(0.9);
    }
    to {
        opacity: 1;
        transform: scale(1);
    }
}

/* Loading state for save button */
.modal-footer .btn:disabled[b-vg3bhx7vd9] {
    opacity: 0.6;
    cursor: not-allowed;
}

.modal-footer .btn.btn-primary:disabled[b-vg3bhx7vd9] {
    background: #6c757d;
    border-color: #6c757d;
}

/* Responsive modal */
@media (max-width: 576px) {
    .modal-dialog-centered[b-vg3bhx7vd9] {
        margin: 1rem;
    }
    
    .modal-footer[b-vg3bhx7vd9] {
        flex-direction: column;
        gap: 8px;
    }
    
    .modal-footer .btn[b-vg3bhx7vd9] {
        width: 100%;
        justify-content: center;
    }
    
    .unsaved-changes-summary[b-vg3bhx7vd9] {
        padding: 12px;
    }
}
/* /Features/Admin/SurveyTemplates/Components/TemplatePreview.razor.rz.scp.css */
.template-preview[b-9u0qcddbac] {
    padding: 0;
    height: 100%;
    display: flex;
    flex-direction: column;
}

.preview-header[b-9u0qcddbac] {
    background: rgba(255, 255, 255, 0.8);
    border-bottom: 1px solid #E2E6EA;
    padding: 25px 30px;
    margin-bottom: 0;
}

.preview-header h4[b-9u0qcddbac] {
    font-size: 1.5rem;
    font-weight: 700;
    margin: 0 0 10px 0;
    color: #14213D;
}

.template-description[b-9u0qcddbac] {
    color: #6c757d;
    margin: 0 0 15px 0;
    line-height: 1.5;
    font-size: 1rem;
}

.template-meta[b-9u0qcddbac] {
    display: flex;
    gap: 20px;
    align-items: center;
    flex-wrap: wrap;
}

.meta-item[b-9u0qcddbac] {
    display: flex;
    align-items: center;
    gap: 8px;
    color: #6c757d;
    font-size: 0.9rem;
    font-weight: 500;
}

.meta-item i[b-9u0qcddbac] {
    color: #C8A951;
    width: 16px;
    text-align: center;
}

.preview-content[b-9u0qcddbac] {
    flex: 1;
    overflow-y: auto;
    padding: 25px 30px;
    background: #f8f9fa;
    max-height: 500px;
}

.preview-question[b-9u0qcddbac] {
    display: flex;
    gap: 20px;
    margin-bottom: 25px;
    align-items: flex-start;
}

.preview-question:last-child[b-9u0qcddbac] {
    margin-bottom: 0;
}

.question-number[b-9u0qcddbac] {
    width: 40px;
    height: 40px;
    background: linear-gradient(135deg, #C8A951 0%, #b8994a 100%);
    color: white;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: 1.1rem;
    flex-shrink: 0;
    box-shadow: 0 2px 8px rgba(200, 169, 81, 0.3);
}

.question-content[b-9u0qcddbac] {
    flex: 1;
    background: white;
    border-radius: 12px;
    border: 2px solid #E2E6EA;
    overflow: hidden;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
    transition: all 0.3s ease;
}

.question-content:hover[b-9u0qcddbac] {
    border-color: #C8A951;
    box-shadow: 0 4px 16px rgba(200, 169, 81, 0.15);
}

.no-questions[b-9u0qcddbac] {
    text-align: center;
    padding: 60px 20px;
    color: #6c757d;
}

.no-questions i[b-9u0qcddbac] {
    font-size: 4rem;
    color: #C8A951;
    margin-bottom: 20px;
    opacity: 0.7;
}

.no-questions h5[b-9u0qcddbac] {
    color: #14213D;
    font-size: 1.5rem;
    font-weight: 700;
    margin: 0 0 10px 0;
}

.no-questions p[b-9u0qcddbac] {
    font-size: 1.1rem;
    margin: 0;
    line-height: 1.5;
}

.no-template[b-9u0qcddbac] {
    text-align: center;
    padding: 40px 20px;
    color: #6c757d;
    font-size: 1.1rem;
}

/* Responsive Design */
@media (max-width: 768px) {
    .preview-header[b-9u0qcddbac] {
        padding: 20px;
    }
    
    .preview-content[b-9u0qcddbac] {
        padding: 20px;
    }
    
    .preview-question[b-9u0qcddbac] {
        flex-direction: column;
        gap: 15px;
    }
    
    .question-number[b-9u0qcddbac] {
        align-self: center;
        width: 35px;
        height: 35px;
        font-size: 1rem;
    }
    
    .template-meta[b-9u0qcddbac] {
        flex-direction: column;
        align-items: flex-start;
        gap: 10px;
    }
}

@media (max-width: 480px) {
    .preview-header h4[b-9u0qcddbac] {
        font-size: 1.3rem;
    }
    
    .template-description[b-9u0qcddbac] {
        font-size: 0.9rem;
    }
    
    .meta-item[b-9u0qcddbac] {
        font-size: 0.85rem;
    }
}
/* /Features/Admin/SurveyTemplates/SurveyTemplatesPage.razor.rz.scp.css */

.page-header[b-y8ptfgaqxv] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 30px;
    padding: 0 10px;
}

.header-content h1[b-y8ptfgaqxv] {
    color: #14213D;
    font-size: 2.5rem;
    font-weight: 700;
    margin: 0;
    text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.1);
}

.header-content p[b-y8ptfgaqxv] {
    color: #6c757d;
    font-size: 1.1rem;
    margin: 5px 0 0 0;
}

.header-actions[b-y8ptfgaqxv] {
    display: flex;
    gap: 10px;
}

.filters-section[b-y8ptfgaqxv] {
    margin-bottom: 30px;
}

.filters-content[b-y8ptfgaqxv] {
    padding: 24px;
    background: linear-gradient(135deg, #ffffff 0%, #f8f9fa 100%);
    border-radius: 12px;
    border: 1px solid #e2e6ea;
}

.filter-row[b-y8ptfgaqxv] {
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
    align-items: end;
}

.search-group[b-y8ptfgaqxv] {
    flex: 3;
    min-width: 300px;
}

.filter-group[b-y8ptfgaqxv] {
    display: flex;
    flex-direction: column;
    min-width: 150px;
    flex: 1;
}

.filter-group label[b-y8ptfgaqxv] {
    color: #14213D;
    font-weight: 600;
    margin-bottom: 8px;
    font-size: 0.9rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.filter-actions[b-y8ptfgaqxv] {
    display: flex;
    gap: 12px;
    align-items: end;
    flex-wrap: nowrap;
    flex-shrink: 0;
}

.bulk-actions[b-y8ptfgaqxv] {
    margin-right: 8px;
}

/* Form Input Styling */
.filter-group .search-input[b-y8ptfgaqxv] {
    width: 100%;
}

.filter-group .form-select[b-y8ptfgaqxv],
.filter-group input[b-y8ptfgaqxv],
.filter-group .e-input-group[b-y8ptfgaqxv],
.filter-group .e-dropdownlist[b-y8ptfgaqxv] {
    padding: 12px 16px;
    border: 2px solid #e2e6ea;
    border-radius: 8px;
    background: #ffffff;
    color: #14213D;
    font-size: 1rem;
    transition: all 0.3s ease;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
}

/* Syncfusion DropDown Specific Styling */
.filter-group .industry-dropdown[b-y8ptfgaqxv],
.filter-group .status-dropdown[b-y8ptfgaqxv] {
    width: 100%;
    height: 44px;
    border: 2px solid #e2e6ea;
    border-radius: 8px;
    background: #ffffff;
    font-size: 1rem;
    transition: all 0.3s ease;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
}

.filter-group .industry-dropdown .e-input[b-y8ptfgaqxv],
.filter-group .status-dropdown .e-input[b-y8ptfgaqxv] {
    color: #14213D;
    font-weight: 500;
    padding: 0 16px;
    height: 100%;
    border: none;
    background: transparent;
}

.filter-group .industry-dropdown .e-ddl-icon[b-y8ptfgaqxv],
.filter-group .status-dropdown .e-ddl-icon[b-y8ptfgaqxv] {
    color: #C8A951;
    font-size: 1.1rem;
    right: 12px;
}

/* Syncfusion DropDown Popup Styling */
.e-popup.e-popup-open .e-dropdownbase[b-y8ptfgaqxv] {
    border: 2px solid #C8A951;
    border-radius: 8px;
    box-shadow: 0 8px 24px rgba(20, 33, 61, 0.15);
    background: #ffffff;
}

.e-popup.e-popup-open .e-list-item[b-y8ptfgaqxv] {
    color: #14213D;
    font-weight: 500;
    padding: 12px 16px;
    transition: all 0.2s ease;
}

.e-popup.e-popup-open .e-list-item:hover[b-y8ptfgaqxv] {
    background: linear-gradient(135deg, rgba(200, 169, 81, 0.1) 0%, rgba(191, 216, 184, 0.1) 100%);
    color: #14213D;
}

.e-popup.e-popup-open .e-list-item.e-active[b-y8ptfgaqxv] {
    background: linear-gradient(135deg, #C8A951 0%, #BFD8B8 100%);
    color: #14213D;
    font-weight: 600;
}

/* Clear button styling */
.filter-group .industry-dropdown .e-clear-icon[b-y8ptfgaqxv],
.filter-group .status-dropdown .e-clear-icon[b-y8ptfgaqxv] {
    color: #6c757d;
    font-size: 1rem;
    right: 36px;
}

.filter-group .industry-dropdown .e-clear-icon:hover[b-y8ptfgaqxv],
.filter-group .status-dropdown .e-clear-icon:hover[b-y8ptfgaqxv] {
    color: #C8A951;
}

.filter-group .form-select:focus[b-y8ptfgaqxv],
.filter-group input:focus[b-y8ptfgaqxv],
.filter-group .e-input-group.e-input-focus[b-y8ptfgaqxv],
.filter-group .e-dropdownlist.e-input-focus[b-y8ptfgaqxv],
.filter-group .industry-dropdown.e-input-focus[b-y8ptfgaqxv],
.filter-group .status-dropdown.e-input-focus[b-y8ptfgaqxv] {
    border-color: #C8A951;
    box-shadow: 0 0 0 0.2rem rgba(200, 169, 81, 0.25);
    outline: none;
    background: #ffffff;
}

.filter-group .form-select:hover[b-y8ptfgaqxv],
.filter-group input:hover[b-y8ptfgaqxv],
.filter-group .e-input-group:hover[b-y8ptfgaqxv],
.filter-group .e-dropdownlist:hover[b-y8ptfgaqxv],
.filter-group .industry-dropdown:hover[b-y8ptfgaqxv],
.filter-group .status-dropdown:hover[b-y8ptfgaqxv] {
    border-color: #C8A951;
    background: #ffffff;
}

/* Button Styling */
.filter-actions .iswara-button[b-y8ptfgaqxv] {
    height: 44px;
    min-width: 120px;
    border-radius: 8px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    font-size: 0.85rem;
    transition: all 0.3s ease;
}

.filter-actions .iswara-button--secondary[b-y8ptfgaqxv] {
    background: linear-gradient(135deg, #6c757d 0%, #495057 100%);
    border: 2px solid #6c757d;
    color: white;
}

.filter-actions .iswara-button--secondary:hover[b-y8ptfgaqxv] {
    background: linear-gradient(135deg, #5a6268 0%, #3d4043 100%);
    transform: translateY(-1px);
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15);
}

.filter-actions .iswara-button--outline[b-y8ptfgaqxv] {
    background: transparent;
    border: 2px solid #C8A951;
    color: #C8A951;
}

.filter-actions .iswara-button--outline:hover[b-y8ptfgaqxv] {
    background: #C8A951;
    color: white;
    transform: translateY(-1px);
    box-shadow: 0 4px 8px rgba(200, 169, 81, 0.3);
}

.filter-actions .iswara-button:disabled[b-y8ptfgaqxv] {
    opacity: 0.6;
    cursor: not-allowed;
    transform: none !important;
    box-shadow: none !important;
}

@media (max-width: 1200px) {
    .filter-row[b-y8ptfgaqxv] {
        flex-wrap: wrap;
        gap: 12px;
    }
    
    .search-group[b-y8ptfgaqxv] {
        flex: 1 1 100%;
        margin-bottom: 12px;
    }
    
    .filter-group[b-y8ptfgaqxv] {
        flex: 1 1 calc(50% - 6px);
        min-width: 120px;
    }
    
    .filter-actions[b-y8ptfgaqxv] {
        flex: 1 1 100%;
        justify-content: flex-start;
        margin-top: 12px;
    }
}

@media (max-width: 768px) {
    .filters-content[b-y8ptfgaqxv] {
        padding: 20px;
    }
    
    .filter-row[b-y8ptfgaqxv] {
        flex-direction: column;
        gap: 16px;
    }
    
    .search-group[b-y8ptfgaqxv] {
        flex: 1 1 auto;
        margin-bottom: 0;
    }
    
    .filter-group[b-y8ptfgaqxv] {
        flex: 1 1 auto;
        min-width: auto;
    }
    
    .filter-actions[b-y8ptfgaqxv] {
        flex-direction: column;
        gap: 12px;
        margin-top: 16px;
    }
    
    .filter-actions .iswara-button[b-y8ptfgaqxv] {
        width: 100%;
        min-width: auto;
    }
    
    .bulk-actions[b-y8ptfgaqxv] {
        margin-right: 0;
        width: 100%;
    }
}



.active-filters[b-y8ptfgaqxv] {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
    margin-top: 16px;
    padding-top: 16px;
    border-top: 1px solid #e2e6ea;
}

.filter-tag[b-y8ptfgaqxv] {
    display: flex;
    align-items: center;
    gap: 8px;
    background: linear-gradient(135deg, #C8A951 0%, #b8994a 100%);
    color: white;
    padding: 8px 12px;
    border-radius: 20px;
    font-size: 0.85rem;
    font-weight: 600;
    box-shadow: 0 2px 6px rgba(200, 169, 81, 0.3);
    transition: all 0.3s ease;
    border: 2px solid transparent;
}

.filter-tag:hover[b-y8ptfgaqxv] {
    transform: translateY(-1px);
    box-shadow: 0 4px 8px rgba(200, 169, 81, 0.4);
    background: linear-gradient(135deg, #b8994a 0%, #a88a42 100%);
}

.filter-tag i[b-y8ptfgaqxv] {
    font-size: 0.9rem;
    opacity: 0.9;
}

.filter-tag .filter-remove-btn[b-y8ptfgaqxv] {
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.2);
    border: none;
    color: white;
    font-size: 0.7rem;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: all 0.2s ease;
    margin-left: 4px;
}

.filter-tag .filter-remove-btn:hover[b-y8ptfgaqxv] {
    background: rgba(255, 255, 255, 0.3);
    transform: scale(1.1);
}


.templates-section[b-y8ptfgaqxv] {
    margin-bottom: 30px;
}

.templates-data-grid[b-y8ptfgaqxv] {
    background: white;
    border-radius: 8px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
    overflow: hidden;
}

.templates-data-grid .e-grid .e-gridheader[b-y8ptfgaqxv] {
    background: linear-gradient(135deg, #14213D 0%, #2c3e50 100%);
    border-bottom: 3px solid #C8A951;
}

.templates-data-grid .e-grid .e-columnheader[b-y8ptfgaqxv] {
    color: white;
    font-weight: 700;
    font-size: 0.9rem;
    text-transform: uppercase;
    letter-spacing: 0.8px;
    text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.3);
}

.templates-data-grid .e-grid .e-content .e-row[b-y8ptfgaqxv] {
    transition: all 0.3s ease;
    border-bottom: 1px solid #f1f3f4;
}

.templates-data-grid .e-grid .e-content .e-row:hover[b-y8ptfgaqxv] {
    background: linear-gradient(135deg, rgba(200, 169, 81, 0.08) 0%, rgba(200, 169, 81, 0.04) 100%);
    transform: translateY(-1px);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}

.templates-data-grid .e-grid .e-content .e-row:nth-child(even)[b-y8ptfgaqxv] {
    background: rgba(248, 249, 250, 0.5);
}

.templates-data-grid .e-grid .e-content .e-row:nth-child(even):hover[b-y8ptfgaqxv] {
    background: linear-gradient(135deg, rgba(200, 169, 81, 0.08) 0%, rgba(200, 169, 81, 0.04) 100%);
}

.templates-data-grid .e-pager[b-y8ptfgaqxv] {
    background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);
    border-top: 2px solid #C8A951;
    padding: 12px;
}

.templates-data-grid .e-pager .e-pagercontainer .e-icons[b-y8ptfgaqxv] {
    color: #C8A951;
}

.templates-data-grid .e-pager .e-numericcontainer .e-link[b-y8ptfgaqxv] {
    color: #14213D;
    font-weight: 600;
}

.templates-data-grid .e-pager .e-numericcontainer .e-currentitem[b-y8ptfgaqxv] {
    background: linear-gradient(135deg, #C8A951 0%, #b8994a 100%);
    color: white;
    border-radius: 6px;
}

.template-name-cell[b-y8ptfgaqxv] {
    padding: 12px 8px;
}

.template-header[b-y8ptfgaqxv] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 8px;
}

.template-title[b-y8ptfgaqxv] {
    color: #14213D;
    font-size: 1.1rem;
    font-weight: 700;
    margin: 0;
    cursor: pointer;
    transition: all 0.3s ease;
}

.template-title:hover[b-y8ptfgaqxv] {
    color: #C8A951;
    text-decoration: underline;
    text-shadow: 1px 1px 2px rgba(200, 169, 81, 0.2);
}

.template-badges[b-y8ptfgaqxv] {
    display: flex;
    gap: 8px;
    align-items: center;
}

.template-description[b-y8ptfgaqxv] {
    color: #2E2E2E;
    font-size: 0.9rem;
    margin: 0;
    line-height: 1.4;
    max-width: 280px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    opacity: 0.8;
}

.action-buttons[b-y8ptfgaqxv] {
    display: flex;
    gap: 8px;
    align-items: center;
}

.btn-icon[b-y8ptfgaqxv] {
    min-width: 36px;
    height: 36px;
    padding: 8px;
    border-radius: 8px !important;
    transition: all 0.3s ease;
    border: 2px solid transparent;
}

.btn-icon:hover[b-y8ptfgaqxv] {
    transform: translateY(-2px);
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15);
}

.iswara-button--outline.btn-icon[b-y8ptfgaqxv] {
    border-color: #e2e6ea;
}

.iswara-button--outline.btn-icon:hover[b-y8ptfgaqxv] {
    border-color: #C8A951;
    background: rgba(200, 169, 81, 0.1);
}

.iswara-button--secondary.btn-icon[b-y8ptfgaqxv] {
    background: linear-gradient(135deg, #6c757d 0%, #495057 100%);
    border-color: #6c757d;
}

.iswara-button--secondary.btn-icon:hover[b-y8ptfgaqxv] {
    background: linear-gradient(135deg, #5a6268 0%, #3d4043 100%);
}


.loading-container[b-y8ptfgaqxv] {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 60px 20px;
    color: #6c757d;
}

.loading-container .spinner-border[b-y8ptfgaqxv] {
    width: 3rem;
    height: 3rem;
    margin-bottom: 20px;
}

.loading-container p[b-y8ptfgaqxv] {
    font-size: 1.1rem;
    margin: 0;
}

.template-item[b-y8ptfgaqxv] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0;
    border-radius: 8px;
    transition: all 0.3s ease;
}

.template-main[b-y8ptfgaqxv] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex: 1;
    margin-right: 20px;
}

.template-info[b-y8ptfgaqxv] {
    flex: 1;
}

.template-name[b-y8ptfgaqxv] {
    color: #14213D;
    font-size: 1.3rem;
    font-weight: 700;
    margin: 0 0 8px 0;
}

.template-description[b-y8ptfgaqxv] {
    color: #2E2E2E;
    font-size: 1rem;
    margin: 0 0 12px 0;
    line-height: 1.4;
}

.template-meta[b-y8ptfgaqxv] {
    display: flex;
    gap: 20px;
    flex-wrap: wrap;
}

.meta-item[b-y8ptfgaqxv] {
    display: flex;
    align-items: center;
    gap: 8px;
    color: #6c757d;
    font-size: 0.9rem;
}

.meta-item i[b-y8ptfgaqxv] {
    color: #C8A951;
    width: 16px;
    text-align: center;
}

.template-status[b-y8ptfgaqxv] {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 8px;
}

.status-badge[b-y8ptfgaqxv] {
    padding: 6px 12px;
    border-radius: 20px;
    font-size: 0.85rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.status-active[b-y8ptfgaqxv] {
    background: linear-gradient(135deg, #28a745 0%, #20c997 100%);
    color: white;
    box-shadow: 0 2px 4px rgba(40, 167, 69, 0.3);
}

.status-inactive[b-y8ptfgaqxv] {
    background: linear-gradient(135deg, #6c757d 0%, #495057 100%);
    color: white;
    box-shadow: 0 2px 4px rgba(108, 117, 125, 0.3);
}

.default-badge[b-y8ptfgaqxv] {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 4px 10px;
    background: linear-gradient(135deg, #C8A951 0%, #b8994a 100%);
    color: white;
    border-radius: 15px;
    font-size: 0.8rem;
    font-weight: 600;
    box-shadow: 0 2px 4px rgba(200, 169, 81, 0.3);
}

.default-badge i[b-y8ptfgaqxv] {
    font-size: 0.7rem;
}

.template-actions[b-y8ptfgaqxv] {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}

.empty-state[b-y8ptfgaqxv] {
    text-align: center;
    padding: 60px 20px;
    color: #6c757d;
}

.empty-state i[b-y8ptfgaqxv] {
    font-size: 4rem;
    color: #C8A951;
    margin-bottom: 20px;
    opacity: 0.7;
}

.empty-state h3[b-y8ptfgaqxv] {
    color: #14213D;
    font-size: 1.8rem;
    font-weight: 700;
    margin: 0 0 10px 0;
}

.empty-state p[b-y8ptfgaqxv] {
    font-size: 1.1rem;
    margin: 0 0 30px 0;
}

.alert[b-y8ptfgaqxv] {
    position: fixed;
    top: 20px;
    right: 20px;
    z-index: 1050;
    min-width: 350px;
    max-width: 500px;
    border: none;
    border-radius: 8px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
    animation: slideInRight-b-y8ptfgaqxv 0.3s ease-out;
}

.alert i[b-y8ptfgaqxv] {
    margin-right: 8px;
}

.alert-danger[b-y8ptfgaqxv] {
    background: linear-gradient(135deg, #dc3545 0%, #c82333 100%);
    color: white;
}

.alert-success[b-y8ptfgaqxv] {
    background: linear-gradient(135deg, #28a745 0%, #20c997 100%);
    color: white;
}

.btn-close[b-y8ptfgaqxv] {
    filter: invert(1);
    opacity: 0.8;
}

.btn-close:hover[b-y8ptfgaqxv] {
    opacity: 1;
}

@keyframes slideInRight-b-y8ptfgaqxv {
    from {
        transform: translateX(100%);
        opacity: 0;
    }
    to {
        transform: translateX(0);
        opacity: 1;
    }
}

@media (max-width: 1200px) {
    .filter-row[b-y8ptfgaqxv] {
        grid-template-columns: 1fr 1fr;
        gap: 15px;
    }
    
    .search-group[b-y8ptfgaqxv] {
        grid-column: 1 / -1;
    }
    
    .filter-actions[b-y8ptfgaqxv] {
        grid-column: 1 / -1;
        justify-content: flex-start;
        margin-top: 10px;
    }
}

@media (max-width: 768px) {
    .survey-templates-container[b-y8ptfgaqxv] {
        padding: 15px;
    }
    
    .page-header[b-y8ptfgaqxv] {
        flex-direction: column;
        align-items: flex-start;
        gap: 20px;
    }
    
    .header-content h1[b-y8ptfgaqxv] {
        font-size: 2rem;
    }
    
    .filter-row[b-y8ptfgaqxv] {
        grid-template-columns: 1fr;
        gap: 15px;
    }
    
    .template-item[b-y8ptfgaqxv] {
        flex-direction: column;
        align-items: flex-start;
        gap: 15px;
    }
    
    .template-main[b-y8ptfgaqxv] {
        margin-right: 0;
        width: 100%;
    }
    
    .template-status[b-y8ptfgaqxv] {
        align-items: flex-start;
        flex-direction: row;
        gap: 10px;
    }
    
    .template-actions[b-y8ptfgaqxv] {
        width: 100%;
        justify-content: flex-start;
    }
    
    .template-meta[b-y8ptfgaqxv] {
        gap: 15px;
    }
    
    .alert[b-y8ptfgaqxv] {
        position: relative;
        top: auto;
        right: auto;
        margin: 20px 0;
        min-width: auto;
        max-width: none;
    }
}

@media (max-width: 480px) {
    .header-content h1[b-y8ptfgaqxv] {
        font-size: 1.8rem;
    }
    
    .template-actions[b-y8ptfgaqxv] {
        flex-direction: column;
        width: 100%;
    }
    
    .template-meta[b-y8ptfgaqxv] {
        flex-direction: column;
        gap: 8px;
        align-items: flex-start;
    }
}
/* /Features/Admin/SurveyTemplates/TemplateDetailsPage.razor.rz.scp.css */
.template-details-container[b-82g3qflcnt] {
    padding: 20px;
    max-width: 1400px;
    margin: 0 auto;
}

.loading-container[b-82g3qflcnt] {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 60px 20px;
    color: #6c757d;
}

.loading-container .spinner-border[b-82g3qflcnt] {
    width: 3rem;
    height: 3rem;
    margin-bottom: 20px;
}

.page-header[b-82g3qflcnt] {
    margin-bottom: 30px;
}

.breadcrumb[b-82g3qflcnt] {
    margin-bottom: 20px;
}

.back-button[b-82g3qflcnt] {
    padding: 8px 16px;
    font-size: 0.9rem;
}

.template-header[b-82g3qflcnt] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 30px;
    background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);
    padding: 30px;
    border-radius: 12px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}

.template-info[b-82g3qflcnt] {
    flex: 1;
}

.template-header h1[b-82g3qflcnt] {
    color: #14213D;
    font-size: 2.2rem;
    font-weight: 700;
    margin: 0 0 12px 0;
    text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.1);
}

.template-description[b-82g3qflcnt] {
    color: #2E2E2E;
    font-size: 1.1rem;
    margin: 0 0 20px 0;
    line-height: 1.5;
}

.template-meta[b-82g3qflcnt] {
    display: flex;
    gap: 25px;
    flex-wrap: wrap;
}

.meta-item[b-82g3qflcnt] {
    display: flex;
    align-items: center;
    gap: 8px;
    color: #6c757d;
    font-size: 1rem;
}

.meta-item i[b-82g3qflcnt] {
    color: #C8A951;
    width: 18px;
    text-align: center;
}

.template-status[b-82g3qflcnt] {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 20px;
}

.status-badges[b-82g3qflcnt] {
    display: flex;
    gap: 12px;
    align-items: center;
}

.status-badge[b-82g3qflcnt] {
    padding: 8px 16px;
    border-radius: 25px;
    font-size: 0.9rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.status-active[b-82g3qflcnt] {
    background: linear-gradient(135deg, #28a745 0%, #20c997 100%);
    color: white;
    box-shadow: 0 2px 6px rgba(40, 167, 69, 0.3);
}

.status-inactive[b-82g3qflcnt] {
    background: linear-gradient(135deg, #6c757d 0%, #495057 100%);
    color: white;
    box-shadow: 0 2px 6px rgba(108, 117, 125, 0.3);
}

.default-badge[b-82g3qflcnt] {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 6px 14px;
    background: linear-gradient(135deg, #C8A951 0%, #b8994a 100%);
    color: white;
    border-radius: 20px;
    font-size: 0.85rem;
    font-weight: 600;
    box-shadow: 0 2px 6px rgba(200, 169, 81, 0.3);
}

.default-badge i[b-82g3qflcnt] {
    font-size: 0.8rem;
}

.template-actions[b-82g3qflcnt] {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
}

.template-content[b-82g3qflcnt] {
    margin-top: 30px;
}

.card-header[b-82g3qflcnt] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 20px 20px 0 20px;
    margin-bottom: 20px;
}

.card-header h3[b-82g3qflcnt] {
    color: #14213D;
    font-size: 1.5rem;
    font-weight: 600;
    margin: 0;
}

.questions-data-grid[b-82g3qflcnt] {
    margin: 0 20px 20px 20px;
    background: white;
    border-radius: 8px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
    overflow: hidden;
}

.questions-data-grid .e-grid .e-gridheader[b-82g3qflcnt] {
    background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);
    border-bottom: 2px solid #C8A951;
}

.questions-data-grid .e-grid .e-columnheader[b-82g3qflcnt] {
    color: #14213D;
    font-weight: 600;
    font-size: 0.9rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.questions-data-grid .e-grid .e-content .e-row:hover[b-82g3qflcnt] {
    background: linear-gradient(135deg, rgba(200, 169, 81, 0.05) 0%, rgba(200, 169, 81, 0.02) 100%);
}

.questions-data-grid .e-pager[b-82g3qflcnt] {
    background: #f8f9fa;
    border-top: 1px solid #e2e6ea;
}

.question-cell[b-82g3qflcnt] {
    padding: 8px 0;
}

.question-text[b-82g3qflcnt] {
    color: #14213D;
    font-size: 1rem;
    font-weight: 500;
    margin-bottom: 6px;
    line-height: 1.4;
}

.question-type[b-82g3qflcnt] {
    margin-top: 4px;
}

.type-badge[b-82g3qflcnt] {
    display: inline-block;
    padding: 3px 8px;
    background: #e9ecef;
    color: #495057;
    border-radius: 12px;
    font-size: 0.75rem;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.3px;
}

.required-badge[b-82g3qflcnt] {
    padding: 4px 10px;
    border-radius: 15px;
    font-size: 0.8rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.3px;
}

.required-yes[b-82g3qflcnt] {
    background: linear-gradient(135deg, #dc3545 0%, #c82333 100%);
    color: white;
}

.required-no[b-82g3qflcnt] {
    background: linear-gradient(135deg, #6c757d 0%, #495057 100%);
    color: white;
}

.question-actions[b-82g3qflcnt] {
    display: flex;
    gap: 6px;
    align-items: center;
}

.btn-icon[b-82g3qflcnt] {
    min-width: 32px;
    height: 32px;
    padding: 6px;
    border-radius: 6px !important;
}

.empty-questions[b-82g3qflcnt] {
    text-align: center;
    padding: 60px 20px;
    color: #6c757d;
}

.empty-questions i[b-82g3qflcnt] {
    font-size: 4rem;
    color: #C8A951;
    margin-bottom: 20px;
    opacity: 0.7;
}

.empty-questions h4[b-82g3qflcnt] {
    color: #14213D;
    font-size: 1.5rem;
    font-weight: 600;
    margin: 0 0 12px 0;
}

.empty-questions p[b-82g3qflcnt] {
    font-size: 1.1rem;
    margin: 0 0 30px 0;
}

.error-state[b-82g3qflcnt] {
    text-align: center;
    padding: 60px 20px;
    color: #6c757d;
}

.error-state i[b-82g3qflcnt] {
    font-size: 4rem;
    color: #dc3545;
    margin-bottom: 20px;
    opacity: 0.7;
}

.error-state h3[b-82g3qflcnt] {
    color: #14213D;
    font-size: 1.8rem;
    font-weight: 700;
    margin: 0 0 12px 0;
}

.error-state p[b-82g3qflcnt] {
    font-size: 1.1rem;
    margin: 0 0 30px 0;
}

.alert[b-82g3qflcnt] {
    position: fixed;
    top: 20px;
    right: 20px;
    z-index: 1050;
    min-width: 350px;
    max-width: 500px;
    border: none;
    border-radius: 8px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
    animation: slideInRight-b-82g3qflcnt 0.3s ease-out;
}

.alert i[b-82g3qflcnt] {
    margin-right: 8px;
}

.alert-danger[b-82g3qflcnt] {
    background: linear-gradient(135deg, #dc3545 0%, #c82333 100%);
    color: white;
}

.alert-success[b-82g3qflcnt] {
    background: linear-gradient(135deg, #28a745 0%, #20c997 100%);
    color: white;
}

.btn-close[b-82g3qflcnt] {
    filter: invert(1);
    opacity: 0.8;
}

.btn-close:hover[b-82g3qflcnt] {
    opacity: 1;
}

@keyframes slideInRight-b-82g3qflcnt {
    from {
        transform: translateX(100%);
        opacity: 0;
    }
    to {
        transform: translateX(0);
        opacity: 1;
    }
}


@media (max-width: 1200px) {
    .template-header[b-82g3qflcnt] {
        flex-direction: column;
        align-items: flex-start;
        gap: 20px;
    }
    
    .template-status[b-82g3qflcnt] {
        align-items: flex-start;
        width: 100%;
    }
    
    .template-actions[b-82g3qflcnt] {
        justify-content: flex-start;
    }
}

@media (max-width: 768px) {
    .template-details-container[b-82g3qflcnt] {
        padding: 15px;
    }
    
    .template-header h1[b-82g3qflcnt] {
        font-size: 1.8rem;
    }
    
    .template-meta[b-82g3qflcnt] {
        gap: 15px;
    }
    
    .meta-item[b-82g3qflcnt] {
        font-size: 0.9rem;
    }
    
    .template-actions[b-82g3qflcnt] {
        flex-direction: column;
        width: 100%;
    }
    
    .status-badges[b-82g3qflcnt] {
        flex-wrap: wrap;
        gap: 8px;
    }
    
    .card-header[b-82g3qflcnt] {
        flex-direction: column;
        align-items: flex-start;
        gap: 15px;
    }
    
    .alert[b-82g3qflcnt] {
        position: relative;
        top: auto;
        right: auto;
        margin: 20px 0;
        min-width: auto;
        max-width: none;
    }
}

@media (max-width: 480px) {
    .template-header h1[b-82g3qflcnt] {
        font-size: 1.5rem;
    }
    
    .template-meta[b-82g3qflcnt] {
        flex-direction: column;
        gap: 10px;
        align-items: flex-start;
    }
}
/* /Features/Alignment/AlignmentGapsPage.razor.rz.scp.css */
.alignment-gaps-page[b-hnh9ycpazb] {
    padding: 24px;
    background: var(--bs-light);
    min-height: 100vh;
}

.page-header[b-hnh9ycpazb] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 32px;
    padding: 24px 0;
    border-bottom: 2px solid var(--bs-border-color);
}

.header-content h1[b-hnh9ycpazb] {
    color: #14213D;
    font-size: 2.5rem;
    font-weight: 700;
    margin-bottom: 8px;
}

.header-content h1 i[b-hnh9ycpazb] {
    color: #C8A951;
    margin-right: 12px;
}

.page-description[b-hnh9ycpazb] {
    color: #2E2E2E;
    font-size: 1.1rem;
    margin: 0;
}

.header-actions[b-hnh9ycpazb] {
    display: flex;
    gap: 12px;
}

.content-container[b-hnh9ycpazb] {
    max-width: 1400px;
}

.metric-card[b-hnh9ycpazb] {
    text-align: center;
    border: 2px solid #E2E6EA;
    transition: all 0.3s ease;
}

.metric-card:hover[b-hnh9ycpazb] {
    border-color: #C8A951;
    transform: translateY(-2px);
    box-shadow: 0 4px 16px rgba(200, 169, 81, 0.2);
}

.metric-card.danger[b-hnh9ycpazb] {
    border-color: #dc3545;
}

.metric-card.danger:hover[b-hnh9ycpazb] {
    border-color: #c82333;
    box-shadow: 0 4px 16px rgba(220, 53, 69, 0.2);
}

.metric-value[b-hnh9ycpazb] {
    font-size: 2.5rem;
    font-weight: 700;
    color: #14213D;
    margin-bottom: 8px;
}

.metric-value-text[b-hnh9ycpazb] {
    font-size: 1.2rem;
    font-weight: 600;
    color: #14213D;
    margin-bottom: 8px;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
}

.metric-label[b-hnh9ycpazb] {
    color: #2E2E2E;
    font-size: 0.9rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.gap-details[b-hnh9ycpazb] {
    padding: 16px;
}

.gap-details h5[b-hnh9ycpazb] {
    color: #14213D;
    font-weight: 600;
    margin-bottom: 16px;
}

.gap-details p[b-hnh9ycpazb] {
    margin-bottom: 12px;
}

.gap-details .badge[b-hnh9ycpazb] {
    font-size: 0.85rem;
    padding: 6px 12px;
}

.upgrade-prompt[b-hnh9ycpazb] {
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 60vh;
    padding: 24px;
}

.upgrade-prompt .card[b-hnh9ycpazb] {
    max-width: 600px;
    border: 2px solid #C8A951;
    border-radius: 12px;
    box-shadow: 0 8px 24px rgba(20, 33, 61, 0.1);
}

.upgrade-prompt h2[b-hnh9ycpazb] {
    color: #14213D;
    font-weight: 700;
}

.upgrade-prompt .text-warning[b-hnh9ycpazb] {
    color: #C8A951 !important;
}

.loading-overlay[b-hnh9ycpazb] {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(255, 255, 255, 0.9);
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 9999;
}

.loading-overlay .spinner-border[b-hnh9ycpazb] {
    color: #C8A951;
    width: 3rem;
    height: 3rem;
}

@media (max-width: 768px) {
    .alignment-gaps-page[b-hnh9ycpazb] {
        padding: 16px;
    }
    
    .page-header[b-hnh9ycpazb] {
        flex-direction: column;
        align-items: flex-start;
        gap: 16px;
    }
    
    .header-content h1[b-hnh9ycpazb] {
        font-size: 2rem;
    }
    
    .header-actions[b-hnh9ycpazb] {
        flex-direction: column;
        width: 100%;
    }
    
    .metric-value[b-hnh9ycpazb] {
        font-size: 2rem;
    }
}
/* /Features/Alignment/AlignmentPage.razor.rz.scp.css */
.alignment-page[b-ypoztuimfh] {
    padding: 24px;
    background: var(--bs-light);
    min-height: 100vh;
}

.page-header[b-ypoztuimfh] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 32px;
    padding: 24px 0;
    border-bottom: 2px solid var(--bs-border-color);
}

.header-content h1[b-ypoztuimfh] {
    color: #14213D;
    font-size: 2.5rem;
    font-weight: 700;
    margin-bottom: 8px;
}

.header-content h1 i[b-ypoztuimfh] {
    color: #C8A951;
    margin-right: 12px;
}

.page-description[b-ypoztuimfh] {
    color: #2E2E2E;
    font-size: 1.1rem;
    margin: 0;
}

.content-container[b-ypoztuimfh] {
    max-width: 1400px;
}

.upgrade-prompt[b-ypoztuimfh] {
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 60vh;
    padding: 24px;
}

.upgrade-prompt .card[b-ypoztuimfh] {
    max-width: 600px;
    border: 2px solid #C8A951;
    border-radius: 12px;
    box-shadow: 0 8px 24px rgba(20, 33, 61, 0.1);
}

.upgrade-prompt h2[b-ypoztuimfh] {
    color: #14213D;
    font-weight: 700;
}

.upgrade-prompt .text-warning[b-ypoztuimfh] {
    color: #C8A951 !important;
}

.loading-overlay[b-ypoztuimfh] {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(255, 255, 255, 0.9);
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 9999;
}

.loading-overlay .spinner-border[b-ypoztuimfh] {
    color: #C8A951;
    width: 3rem;
    height: 3rem;
}

@media (max-width: 768px) {
    .alignment-page[b-ypoztuimfh] {
        padding: 16px;
    }
    
    .page-header[b-ypoztuimfh] {
        flex-direction: column;
        align-items: flex-start;
        gap: 16px;
    }
    
    .header-content h1[b-ypoztuimfh] {
        font-size: 2rem;
    }
}
/* /Features/Alignment/AlignmentTrendsPage.razor.rz.scp.css */
.alignment-trends-page[b-vxvfb9qxze] {
    padding: 24px;
    background: var(--bs-light);
    min-height: 100vh;
}

.page-header[b-vxvfb9qxze] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 32px;
    padding: 24px 0;
    border-bottom: 2px solid var(--bs-border-color);
}

.header-content h1[b-vxvfb9qxze] {
    color: #14213D;
    font-size: 2.5rem;
    font-weight: 700;
    margin-bottom: 8px;
}

.header-content h1 i[b-vxvfb9qxze] {
    color: #C8A951;
    margin-right: 12px;
}

.page-description[b-vxvfb9qxze] {
    color: #2E2E2E;
    font-size: 1.1rem;
    margin: 0;
}

.header-actions[b-vxvfb9qxze] {
    display: flex;
    gap: 12px;
}

.content-container[b-vxvfb9qxze] {
    max-width: 1400px;
}

.trend-filters[b-vxvfb9qxze] {
    padding: 16px;
}

.trend-summary-grid[b-vxvfb9qxze] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 24px;
    padding: 16px;
}

.summary-item[b-vxvfb9qxze] {
    text-align: center;
    padding: 20px;
    background: white;
    border-radius: 12px;
    border: 2px solid #E2E6EA;
    transition: all 0.3s ease;
}

.summary-item:hover[b-vxvfb9qxze] {
    border-color: #C8A951;
    transform: translateY(-2px);
    box-shadow: 0 4px 16px rgba(200, 169, 81, 0.1);
}

.summary-value[b-vxvfb9qxze] {
    font-size: 2.5rem;
    font-weight: 700;
    color: #14213D;
    margin-bottom: 8px;
}

.summary-label[b-vxvfb9qxze] {
    color: #2E2E2E;
    font-size: 0.9rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin-bottom: 8px;
}

.summary-change[b-vxvfb9qxze] {
    font-weight: 600;
    font-size: 1rem;
}

.summary-change.trend-positive[b-vxvfb9qxze] {
    color: #28a745;
}

.summary-change.trend-negative[b-vxvfb9qxze] {
    color: #dc3545;
}

.summary-date[b-vxvfb9qxze] {
    color: #6c757d;
    font-size: 0.85rem;
}

.summary-trend[b-vxvfb9qxze] {
    font-weight: 600;
    font-size: 0.9rem;
    color: #C8A951;
}

.group-trends[b-vxvfb9qxze] {
    display: flex;
    flex-direction: column;
    gap: 16px;
    max-height: 500px;
    overflow-y: auto;
}

.group-trend-item[b-vxvfb9qxze] {
    display: flex;
    align-items: center;
    padding: 16px;
    border: 1px solid #E2E6EA;
    border-radius: 8px;
    background: white;
    transition: all 0.3s ease;
}

.group-trend-item:hover[b-vxvfb9qxze] {
    border-color: #C8A951;
    box-shadow: 0 2px 8px rgba(200, 169, 81, 0.1);
}

.group-info[b-vxvfb9qxze] {
    flex: 1;
    margin-right: 20px;
}

.group-info h6[b-vxvfb9qxze] {
    color: #14213D;
    font-weight: 600;
    margin-bottom: 8px;
}

.group-stats[b-vxvfb9qxze] {
    display: flex;
    align-items: center;
    gap: 12px;
}

.current-score[b-vxvfb9qxze] {
    font-size: 1.5rem;
    font-weight: 700;
    color: #14213D;
}

.trend-indicator[b-vxvfb9qxze] {
    font-weight: 600;
    font-size: 0.9rem;
}

.trend-indicator.trend-positive[b-vxvfb9qxze] {
    color: #28a745;
}

.trend-indicator.trend-negative[b-vxvfb9qxze] {
    color: #dc3545;
}

.group-chart[b-vxvfb9qxze] {
    width: 200px;
    height: 120px;
}

.upgrade-prompt[b-vxvfb9qxze] {
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 60vh;
    padding: 24px;
}

.upgrade-prompt .card[b-vxvfb9qxze] {
    max-width: 600px;
    border: 2px solid #C8A951;
    border-radius: 12px;
    box-shadow: 0 8px 24px rgba(20, 33, 61, 0.1);
}

.upgrade-prompt h2[b-vxvfb9qxze] {
    color: #14213D;
    font-weight: 700;
}

.upgrade-prompt .text-warning[b-vxvfb9qxze] {
    color: #C8A951 !important;
}

.loading-overlay[b-vxvfb9qxze] {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(255, 255, 255, 0.9);
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 9999;
}

.loading-overlay .spinner-border[b-vxvfb9qxze] {
    color: #C8A951;
    width: 3rem;
    height: 3rem;
}

@media (max-width: 768px) {
    .alignment-trends-page[b-vxvfb9qxze] {
        padding: 16px;
    }
    
    .page-header[b-vxvfb9qxze] {
        flex-direction: column;
        align-items: flex-start;
        gap: 16px;
    }
    
    .header-content h1[b-vxvfb9qxze] {
        font-size: 2rem;
    }
    
    .header-actions[b-vxvfb9qxze] {
        flex-direction: column;
        width: 100%;
    }
    
    .trend-summary-grid[b-vxvfb9qxze] {
        grid-template-columns: 1fr;
        gap: 16px;
    }
    
    .summary-value[b-vxvfb9qxze] {
        font-size: 2rem;
    }
    
    .group-trend-item[b-vxvfb9qxze] {
        flex-direction: column;
        align-items: flex-start;
        gap: 16px;
    }
    
    .group-info[b-vxvfb9qxze] {
        margin-right: 0;
        width: 100%;
    }
    
    .group-chart[b-vxvfb9qxze] {
        width: 100%;
    }
}
/* /Features/Alignment/IndividualAlignmentPage.razor.rz.scp.css */
.individual-alignment-page[b-c2hkxjol26] {
    padding: 24px;
    background: var(--bs-light);
    min-height: 100vh;
}

.page-header[b-c2hkxjol26] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 32px;
    padding: 24px 0;
    border-bottom: 2px solid var(--bs-border-color);
}

.header-content h1[b-c2hkxjol26] {
    color: #14213D;
    font-size: 2.5rem;
    font-weight: 700;
    margin-bottom: 8px;
}

.header-content h1 i[b-c2hkxjol26] {
    color: #C8A951;
    margin-right: 12px;
}

.page-description[b-c2hkxjol26] {
    color: #2E2E2E;
    font-size: 1.1rem;
    margin: 0;
}

.content-container[b-c2hkxjol26] {
    max-width: 1400px;
}

.employee-filters[b-c2hkxjol26] {
    padding: 16px;
}

.gap-summary[b-c2hkxjol26] {
    max-height: 400px;
    overflow-y: auto;
}

.gap-item[b-c2hkxjol26] {
    padding: 12px;
    border: 1px solid #E2E6EA;
    border-radius: 8px;
    margin-bottom: 12px;
    background: white;
    transition: all 0.3s ease;
}

.gap-item:hover[b-c2hkxjol26] {
    border-color: #C8A951;
    box-shadow: 0 2px 8px rgba(200, 169, 81, 0.1);
}

.gap-header[b-c2hkxjol26] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 8px;
}

.gap-header strong[b-c2hkxjol26] {
    color: #14213D;
    font-size: 1rem;
}

.gap-score[b-c2hkxjol26] {
    color: #2E2E2E;
    font-size: 0.9rem;
}

.no-gaps[b-c2hkxjol26] {
    text-align: center;
    padding: 40px 20px;
}

.no-gaps i[b-c2hkxjol26] {
    display: block;
    margin: 0 auto 16px;
}

.no-gaps p[b-c2hkxjol26] {
    color: #2E2E2E;
    font-size: 1.1rem;
    margin: 0;
}

.no-selection[b-c2hkxjol26] {
    margin-top: 32px;
}

.upgrade-prompt[b-c2hkxjol26] {
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 60vh;
    padding: 24px;
}

.upgrade-prompt .card[b-c2hkxjol26] {
    max-width: 600px;
    border: 2px solid #C8A951;
    border-radius: 12px;
    box-shadow: 0 8px 24px rgba(20, 33, 61, 0.1);
}

.upgrade-prompt h2[b-c2hkxjol26] {
    color: #14213D;
    font-weight: 700;
}

.upgrade-prompt .text-warning[b-c2hkxjol26] {
    color: #C8A951 !important;
}

.loading-overlay[b-c2hkxjol26] {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(255, 255, 255, 0.9);
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 9999;
}

.loading-overlay .spinner-border[b-c2hkxjol26] {
    color: #C8A951;
    width: 3rem;
    height: 3rem;
}

@media (max-width: 768px) {
    .individual-alignment-page[b-c2hkxjol26] {
        padding: 16px;
    }
    
    .page-header[b-c2hkxjol26] {
        flex-direction: column;
        align-items: flex-start;
        gap: 16px;
    }
    
    .header-content h1[b-c2hkxjol26] {
        font-size: 2rem;
    }
    
    .gap-header[b-c2hkxjol26] {
        flex-direction: column;
        align-items: flex-start;
        gap: 8px;
    }
}
/* /Features/Authentication/Login/LoginPage.razor.rz.scp.css */
/* Login Page Styles */
.login-container[b-8wp0t06z9w] {
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, #BFD8B8 0%, #E2E6EA 100%);
    padding: 20px;
}

.login-wrapper[b-8wp0t06z9w] {
    width: 100%;
    max-width: 450px;
}

.login-header[b-8wp0t06z9w] {
    text-align: center;
    margin-bottom: 30px;
}

.login-header h2[b-8wp0t06z9w] {
    color: #14213D;
    font-size: 2rem;
    font-weight: 700;
    margin-bottom: 8px;
}

.login-header p[b-8wp0t06z9w] {
    color: #2E2E2E;
    font-size: 1rem;
    margin: 0;
}

.form-group[b-8wp0t06z9w] {
    margin-bottom: 20px;
}

.form-group.remember-me[b-8wp0t06z9w] {
    margin-bottom: 25px;
}

.checkbox-container[b-8wp0t06z9w] {
    display: flex;
    align-items: center;
    cursor: pointer;
    font-size: 0.95rem;
    color: #2E2E2E;
    user-select: none;
}

.checkbox-container input[type="checkbox"][b-8wp0t06z9w] {
    margin-right: 8px;
    width: 18px;
    height: 18px;
    accent-color: #C8A951;
}

.alert[b-8wp0t06z9w] {
    padding: 12px 16px;
    border-radius: 6px;
    margin-bottom: 20px;
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 0.9rem;
}

.alert-danger[b-8wp0t06z9w] {
    background-color: #f8d7da;
    border: 1px solid #f5c6cb;
    color: #721c24;
}

.alert i[b-8wp0t06z9w] {
    flex-shrink: 0;
}

.form-actions[b-8wp0t06z9w] {
    margin-bottom: 25px;
}

.login-button[b-8wp0t06z9w] {
    width: 100%;
}

.login-footer[b-8wp0t06z9w] {
    text-align: center;
    border-top: 1px solid #E2E6EA;
    padding-top: 20px;
}

.alternative-links[b-8wp0t06z9w] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 15px;
    margin-bottom: 20px;
    flex-wrap: wrap;
}

.alternative-links a[b-8wp0t06z9w] {
    display: flex;
    align-items: center;
    gap: 6px;
    text-decoration: none;
    font-size: 0.9rem;
    transition: all 0.3s ease;
}

.link-primary[b-8wp0t06z9w] {
    color: #14213D;
    font-weight: 600;
}

.link-primary:hover[b-8wp0t06z9w] {
    color: #C8A951;
}

.registration-link[b-8wp0t06z9w] {
    color: #C8A951 !important;
    font-weight: 600;
}

.registration-link:hover[b-8wp0t06z9w] {
    color: #14213D !important;
}

.link-secondary[b-8wp0t06z9w] {
    color: #2E2E2E;
}

.link-secondary:hover[b-8wp0t06z9w] {
    color: #14213D;
}

.separator[b-8wp0t06z9w] {
    color: #E2E6EA;
    font-weight: 300;
}

.account-help[b-8wp0t06z9w] {
    margin-bottom: 15px;
}

.help-text[b-8wp0t06z9w] {
    color: #2E2E2E;
    font-size: 0.9rem;
    margin: 0;
    line-height: 1.4;
}

.forgot-password[b-8wp0t06z9w] {
    margin-top: 10px;
}

.link-muted[b-8wp0t06z9w] {
    color: #6c757d;
    text-decoration: none;
    font-size: 0.85rem;
    transition: color 0.3s ease;
}

.link-muted:hover[b-8wp0t06z9w] {
    color: #14213D;
    text-decoration: underline;
}

/* Field validation styles */
.is-invalid[b-8wp0t06z9w] {
    border-color: #dc3545 !important;
    box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.25) !important;
}

.validation-message[b-8wp0t06z9w] {
    color: #dc3545;
    font-size: 0.8rem;
    margin-top: 4px;
    display: block;
}

/* Mobile responsive */
@media (max-width: 576px) {
    .login-container[b-8wp0t06z9w] {
        padding: 20px 15px;
        min-height: 100vh;
        align-items: flex-start;
        padding-top: 60px;
    }
    
    .login-wrapper[b-8wp0t06z9w] {
        max-width: 100%;
    }
    
    .login-header[b-8wp0t06z9w] {
        margin-bottom: 32px;
        padding: 16px 0;
    }
    
    .login-header h2[b-8wp0t06z9w] {
        font-size: 2rem;
        margin-bottom: 8px;
    }
    
    .login-header p[b-8wp0t06z9w] {
        font-size: 1rem;
    }
    
    .form-group[b-8wp0t06z9w] {
        margin-bottom: 24px;
    }
    
    .alternative-links[b-8wp0t06z9w] {
        flex-direction: column;
        gap: 12px;
    }
    
    .alternative-links a[b-8wp0t06z9w] {
        width: 100%;
        justify-content: center;
        padding: 16px 24px;
    }
    
    
    .separator[b-8wp0t06z9w] {
        display: none;
    }
    
    .login-footer[b-8wp0t06z9w] {
        padding-top: 24px;
    }
}

@media (max-width: 480px) {
    .login-container[b-8wp0t06z9w] {
        padding: 20px 10px;
        padding-top: 40px;
    }
    
    .login-header h2[b-8wp0t06z9w] {
        font-size: 1.8rem;
    }
}

/* Accessibility improvements */
@media (prefers-reduced-motion: reduce) {
    .alert[b-8wp0t06z9w],
    .alternative-links a[b-8wp0t06z9w],
    .link-muted[b-8wp0t06z9w] {
        transition: none;
    }
}

/* High contrast mode support */
@media (prefers-contrast: high) {
    .login-container[b-8wp0t06z9w] {
        background: #ffffff;
    }
    
    .login-header h2[b-8wp0t06z9w] {
        color: #000000;
    }
    
    .login-header p[b-8wp0t06z9w] {
        color: #333333;
    }
}
/* /Features/Authentication/SurveyAccess/SurveyAccessPage.razor.rz.scp.css */
/* Survey Access Page Styles */
.survey-access-container[b-17gdvo0h29] {
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, #BFD8B8 0%, #E2E6EA 100%);
    padding: 20px;
}

.survey-access-wrapper[b-17gdvo0h29] {
    width: 100%;
    max-width: 550px;
}

.survey-access-header[b-17gdvo0h29] {
    text-align: center;
    margin-bottom: 30px;
}

.icon-container[b-17gdvo0h29] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 80px;
    height: 80px;
    border-radius: 50%;
    background: linear-gradient(135deg, #C8A951 0%, #B8973D 100%);
    margin-bottom: 20px;
    box-shadow: 0 4px 15px rgba(200, 169, 81, 0.3);
}

.icon-container i[b-17gdvo0h29] {
    font-size: 2.5rem;
    color: #ffffff;
}

.survey-access-header h2[b-17gdvo0h29] {
    color: #14213D;
    font-size: 2rem;
    font-weight: 700;
    margin-bottom: 8px;
}

.survey-access-header p[b-17gdvo0h29] {
    color: #2E2E2E;
    font-size: 1rem;
    margin: 0;
}

.instructions[b-17gdvo0h29] {
    background: linear-gradient(135deg, rgba(20, 33, 61, 0.05) 0%, rgba(20, 33, 61, 0.02) 100%);
    border: 1px solid rgba(20, 33, 61, 0.1);
    border-radius: 8px;
    padding: 20px;
    margin-bottom: 25px;
}

.instructions h4[b-17gdvo0h29] {
    color: #14213D;
    font-size: 1.1rem;
    font-weight: 600;
    margin-bottom: 12px;
    display: flex;
    align-items: center;
    gap: 8px;
}

.instructions ol[b-17gdvo0h29] {
    margin: 0;
    padding-left: 20px;
    color: #2E2E2E;
}

.instructions li[b-17gdvo0h29] {
    margin-bottom: 8px;
    line-height: 1.4;
}

.form-section[b-17gdvo0h29] {
    margin-bottom: 25px;
}

.form-section h4[b-17gdvo0h29] {
    color: #14213D;
    font-size: 1.1rem;
    font-weight: 600;
    margin-bottom: 10px;
}

.section-description[b-17gdvo0h29] {
    color: #2E2E2E;
    font-size: 0.9rem;
    margin-bottom: 15px;
    line-height: 1.4;
}

.code-input[b-17gdvo0h29] {
    position: relative;
}

.code-field[b-17gdvo0h29] {
    font-family: 'Courier New', monospace;
    font-size: 1.1rem;
    text-transform: uppercase;
    letter-spacing: 2px;
    text-align: center;
    font-weight: 600;
    padding: 15px;
    border: 2px solid #C8A951;
    background: linear-gradient(135deg, rgba(200, 169, 81, 0.05) 0%, rgba(200, 169, 81, 0.02) 100%);
}

.code-field:focus[b-17gdvo0h29] {
    border-color: #14213D;
    box-shadow: 0 0 0 0.2rem rgba(200, 169, 81, 0.25);
}

.code-help[b-17gdvo0h29] {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    margin-top: 8px;
    padding: 10px;
    background: #f8f9fa;
    border-radius: 4px;
    font-size: 0.85rem;
    color: #6c757d;
    line-height: 1.4;
}

.code-help i[b-17gdvo0h29] {
    color: #C8A951;
    margin-top: 2px;
    flex-shrink: 0;
}

.form-row[b-17gdvo0h29] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
}

.form-group[b-17gdvo0h29] {
    margin-bottom: 15px;
}

.optional-field[b-17gdvo0h29] {
    border-color: #E2E6EA;
    background: #ffffff;
}

.alert[b-17gdvo0h29] {
    padding: 12px 16px;
    border-radius: 6px;
    margin-bottom: 20px;
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 0.9rem;
}

.alert-danger[b-17gdvo0h29] {
    background-color: #f8d7da;
    border: 1px solid #f5c6cb;
    color: #721c24;
}

.alert-success[b-17gdvo0h29] {
    background-color: #d4edda;
    border: 1px solid #c3e6cb;
    color: #155724;
}

.alert i[b-17gdvo0h29] {
    flex-shrink: 0;
}

.form-actions[b-17gdvo0h29] {
    margin: 25px 0;
}

.access-button[b-17gdvo0h29] {
    width: 100%;
}

.privacy-notice[b-17gdvo0h29] {
    background: linear-gradient(135deg, rgba(191, 216, 184, 0.3) 0%, rgba(191, 216, 184, 0.1) 100%);
    border: 1px solid rgba(191, 216, 184, 0.5);
    border-radius: 8px;
    padding: 20px;
    margin: 25px 0;
}

.privacy-content[b-17gdvo0h29] {
    display: flex;
    align-items: flex-start;
    gap: 15px;
}

.privacy-content i[b-17gdvo0h29] {
    font-size: 1.5rem;
    color: #28a745;
    margin-top: 2px;
    flex-shrink: 0;
}

.privacy-content h5[b-17gdvo0h29] {
    color: #14213D;
    font-size: 1rem;
    font-weight: 600;
    margin-bottom: 5px;
}

.privacy-content p[b-17gdvo0h29] {
    color: #2E2E2E;
    font-size: 0.9rem;
    margin: 0;
    line-height: 1.4;
}

.survey-access-footer[b-17gdvo0h29] {
    text-align: center;
    border-top: 1px solid #E2E6EA;
    padding-top: 20px;
}

.alternative-links[b-17gdvo0h29] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 15px;
    margin-bottom: 15px;
    flex-wrap: wrap;
}

.alternative-links a[b-17gdvo0h29] {
    display: flex;
    align-items: center;
    gap: 6px;
    text-decoration: none;
    font-size: 0.9rem;
    transition: all 0.3s ease;
}

.link-primary[b-17gdvo0h29] {
    color: #14213D;
    font-weight: 600;
}

.link-primary:hover[b-17gdvo0h29] {
    color: #C8A951;
}

.link-secondary[b-17gdvo0h29] {
    color: #2E2E2E;
}

.link-secondary:hover[b-17gdvo0h29] {
    color: #14213D;
}

.separator[b-17gdvo0h29] {
    color: #E2E6EA;
    font-weight: 300;
}

.help-link[b-17gdvo0h29] {
    margin-top: 10px;
}

.link-muted[b-17gdvo0h29] {
    color: #6c757d;
    text-decoration: none;
    font-size: 0.85rem;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    transition: color 0.3s ease;
}

.link-muted:hover[b-17gdvo0h29] {
    color: #14213D;
    text-decoration: underline;
}

/* Field validation styles */
.is-invalid[b-17gdvo0h29] {
    border-color: #dc3545 !important;
    box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.25) !important;
}

.validation-message[b-17gdvo0h29] {
    color: #dc3545;
    font-size: 0.8rem;
    margin-top: 4px;
    display: block;
}

/* Mobile responsive */
@media (max-width: 768px) {
    .form-row[b-17gdvo0h29] {
        grid-template-columns: 1fr;
        gap: 15px;
    }
    
    .icon-container[b-17gdvo0h29] {
        width: 70px;
        height: 70px;
    }
    
    .icon-container i[b-17gdvo0h29] {
        font-size: 2rem;
    }
    
    .alternative-links[b-17gdvo0h29] {
        flex-direction: column;
        gap: 10px;
    }
    
    .separator[b-17gdvo0h29] {
        display: none;
    }
}

@media (max-width: 576px) {
    .survey-access-container[b-17gdvo0h29] {
        padding: 15px;
        align-items: flex-start;
        padding-top: 20px;
    }
    
    .survey-access-wrapper[b-17gdvo0h29] {
        max-width: 100%;
    }
    
    .survey-access-header h2[b-17gdvo0h29] {
        font-size: 1.75rem;
    }
    
    .instructions[b-17gdvo0h29] {
        padding: 15px;
    }
    
    .privacy-notice[b-17gdvo0h29] {
        padding: 15px;
    }
    
    .privacy-content[b-17gdvo0h29] {
        gap: 12px;
    }
    
    .code-field[b-17gdvo0h29] {
        font-size: 1rem;
        letter-spacing: 1px;
        padding: 12px;
    }
}

/* Accessibility improvements */
@media (prefers-reduced-motion: reduce) {
    .alternative-links a[b-17gdvo0h29],
    .link-muted[b-17gdvo0h29] {
        transition: none;
    }
}

/* High contrast mode support */
@media (prefers-contrast: high) {
    .survey-access-container[b-17gdvo0h29] {
        background: #ffffff;
    }
    
    .survey-access-header h2[b-17gdvo0h29] {
        color: #000000;
    }
    
    .instructions[b-17gdvo0h29] {
        border-color: #000000;
        background: #f0f0f0;
    }
    
    .code-field[b-17gdvo0h29] {
        border-color: #000000;
        background: #ffffff;
    }
}
/* /Features/Compliance/AdvancedReportsPage.razor.rz.scp.css */
.advanced-reports-page[b-l4o55bfwmx] {
    padding: 24px;
    background: #f8f9fa;
    min-height: 100vh;
}

.page-header[b-l4o55bfwmx] {
    background: white;
    padding: 24px;
    border-radius: 8px;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
    margin-bottom: 24px;
}

.page-header h2[b-l4o55bfwmx] {
    color: #2c3e50;
    margin-bottom: 8px;
    font-weight: 600;
}

.page-header .text-muted[b-l4o55bfwmx] {
    margin-bottom: 12px;
    font-size: 0.95rem;
}

.advanced-report-builder[b-l4o55bfwmx],
.regulatory-templates[b-l4o55bfwmx],
.generated-reports[b-l4o55bfwmx],
.report-analytics[b-l4o55bfwmx] {
    margin-bottom: 24px;
}

.stats-container[b-l4o55bfwmx] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
    padding: 16px;
}

.stat-item[b-l4o55bfwmx] {
    text-align: center;
    padding: 16px;
    background: #f8f9fa;
    border-radius: 6px;
    border: 1px solid #e9ecef;
}

.stat-value[b-l4o55bfwmx] {
    font-size: 1.8rem;
    font-weight: 700;
    color: #2c3e50;
    margin-bottom: 4px;
}

.stat-label[b-l4o55bfwmx] {
    font-size: 0.85rem;
    color: #6c757d;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.loading-container[b-l4o55bfwmx] {
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 200px;
    background: white;
    border-radius: 8px;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}

.no-data-container[b-l4o55bfwmx] {
    background: white;
    border-radius: 8px;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
    margin: 24px 0;
}

.no-data-container i[b-l4o55bfwmx] {
    color: #6c757d;
}

.btn-group .iswara-button[b-l4o55bfwmx] {
    margin-right: 4px;
}

.btn-group .iswara-button:last-child[b-l4o55bfwmx] {
    margin-right: 0;
}

.badge.bg-warning[b-l4o55bfwmx] {
    background-color: #ffc107 !important;
    color: #212529;
}

.badge.bg-success[b-l4o55bfwmx] {
    background-color: #28a745 !important;
    color: white;
}

.badge.bg-danger[b-l4o55bfwmx] {
    background-color: #dc3545 !important;
    color: white;
}

.badge.bg-secondary[b-l4o55bfwmx] {
    background-color: #6c757d !important;
    color: white;
}

/* Report type specific styles */
.report-type-card[b-l4o55bfwmx] {
    border: 2px solid transparent;
    transition: all 0.3s ease;
    cursor: pointer;
}

.report-type-card:hover[b-l4o55bfwmx] {
    border-color: #007bff;
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0,0,0,0.15);
}

.report-type-card.selected[b-l4o55bfwmx] {
    border-color: #007bff;
    background: #f8f9ff;
}

/* Framework selection styles */
.framework-selector[b-l4o55bfwmx] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 16px;
    margin: 16px 0;
}

.framework-option[b-l4o55bfwmx] {
    padding: 16px;
    border: 2px solid #e9ecef;
    border-radius: 8px;
    text-align: center;
    cursor: pointer;
    transition: all 0.3s ease;
}

.framework-option:hover[b-l4o55bfwmx] {
    border-color: #007bff;
    background: #f8f9ff;
}

.framework-option.selected[b-l4o55bfwmx] {
    border-color: #007bff;
    background: #007bff;
    color: white;
}

.framework-option .framework-icon[b-l4o55bfwmx] {
    font-size: 2rem;
    margin-bottom: 8px;
    display: block;
}

.framework-option .framework-name[b-l4o55bfwmx] {
    font-weight: 600;
    margin-bottom: 4px;
}

.framework-option .framework-description[b-l4o55bfwmx] {
    font-size: 0.85rem;
    opacity: 0.8;
}

/* Report status indicators */
.status-indicator[b-l4o55bfwmx] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 4px 8px;
    border-radius: 4px;
    font-size: 0.8rem;
    font-weight: 500;
}

.status-indicator.completed[b-l4o55bfwmx] {
    background: #d4edda;
    color: #155724;
}

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

.status-indicator.failed[b-l4o55bfwmx] {
    background: #f8d7da;
    color: #721c24;
}

.status-indicator.in-progress[b-l4o55bfwmx] {
    background: #d1ecf1;
    color: #0c5460;
}

/* Compliance metrics visualization */
.compliance-metrics-grid[b-l4o55bfwmx] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 16px;
    margin: 16px 0;
}

.metric-card[b-l4o55bfwmx] {
    background: white;
    padding: 20px;
    border-radius: 8px;
    border: 1px solid #e9ecef;
    text-align: center;
}

.metric-card .metric-icon[b-l4o55bfwmx] {
    font-size: 2.5rem;
    margin-bottom: 12px;
    color: #007bff;
}

.metric-card .metric-value[b-l4o55bfwmx] {
    font-size: 2rem;
    font-weight: 700;
    margin-bottom: 4px;
}

.metric-card .metric-label[b-l4o55bfwmx] {
    color: #6c757d;
    font-size: 0.9rem;
}

.metric-card.critical .metric-icon[b-l4o55bfwmx] {
    color: #dc3545;
}

.metric-card.warning .metric-icon[b-l4o55bfwmx] {
    color: #ffc107;
}

.metric-card.success .metric-icon[b-l4o55bfwmx] {
    color: #28a745;
}

/* Advanced report builder styles */
.report-builder-section[b-l4o55bfwmx] {
    border: 1px solid #e9ecef;
    border-radius: 8px;
    margin-bottom: 16px;
}

.report-builder-header[b-l4o55bfwmx] {
    background: #f8f9fa;
    padding: 12px 16px;
    border-bottom: 1px solid #e9ecef;
    border-radius: 8px 8px 0 0;
    font-weight: 600;
    color: #495057;
}

.report-builder-content[b-l4o55bfwmx] {
    padding: 16px;
}

/* Responsive design */
@media (max-width: 768px) {
    .advanced-reports-page[b-l4o55bfwmx] {
        padding: 16px;
    }
    
    .page-header[b-l4o55bfwmx] {
        padding: 16px;
    }
    
    .page-header .d-flex[b-l4o55bfwmx] {
        flex-direction: column;
        gap: 16px;
        align-items: flex-start !important;
    }
    
    .stats-container[b-l4o55bfwmx] {
        grid-template-columns: 1fr;
        gap: 12px;
    }
    
    .framework-selector[b-l4o55bfwmx] {
        grid-template-columns: 1fr;
    }
    
    .compliance-metrics-grid[b-l4o55bfwmx] {
        grid-template-columns: 1fr;
    }
}
/* /Features/Compliance/AuditManagementPage.razor.rz.scp.css */
.audit-management-page[b-hynsnlvji7] {
    padding: 24px;
    background: #f8f9fa;
    min-height: 100vh;
}

.page-header[b-hynsnlvji7] {
    background: white;
    padding: 24px;
    border-radius: 8px;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
    margin-bottom: 24px;
}

.page-header h2[b-hynsnlvji7] {
    color: #2c3e50;
    margin-bottom: 8px;
    font-weight: 600;
}

.page-header .text-muted[b-hynsnlvji7] {
    margin-bottom: 12px;
    font-size: 0.95rem;
}

.audit-dashboard[b-hynsnlvji7],
.audit-workflow[b-hynsnlvji7],
.audit-filters[b-hynsnlvji7],
.audit-management-grid[b-hynsnlvji7],
.audit-analytics[b-hynsnlvji7],
.upcoming-audits[b-hynsnlvji7] {
    margin-bottom: 24px;
}

.dashboard-metrics[b-hynsnlvji7] {
    padding: 16px 0;
}

.metric-card[b-hynsnlvji7] {
    background: #f8f9fa;
    padding: 24px;
    border-radius: 8px;
    border: 1px solid #e9ecef;
    text-align: center;
    transition: all 0.3s ease;
    height: 100%;
    position: relative;
    overflow: hidden;
}

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

.metric-card[b-hynsnlvji7]::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 4px;
    background: linear-gradient(90deg, #007bff, #28a745);
}

.metric-card.active-audits[b-hynsnlvji7]::before {
    background: linear-gradient(90deg, #007bff, #0056b3);
}

.metric-card.scheduled-audits[b-hynsnlvji7]::before {
    background: linear-gradient(90deg, #17a2b8, #138496);
}

.metric-card.overdue-audits[b-hynsnlvji7]::before {
    background: linear-gradient(90deg, #dc3545, #c82333);
}

.metric-card.compliance-score[b-hynsnlvji7]::before {
    background: linear-gradient(90deg, #28a745, #1e7e34);
}

.metric-card .metric-icon[b-hynsnlvji7] {
    font-size: 2.5rem;
    margin-bottom: 12px;
    color: #007bff;
}

.metric-card .metric-value[b-hynsnlvji7] {
    font-size: 2.2rem;
    font-weight: 700;
    margin-bottom: 4px;
    color: #2c3e50;
}

.metric-card .metric-label[b-hynsnlvji7] {
    color: #6c757d;
    font-size: 0.9rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    font-weight: 500;
}

.audit-trends[b-hynsnlvji7] {
    padding: 16px 0;
}

.no-trend-data[b-hynsnlvji7] {
    text-align: center;
    padding: 40px;
    color: #6c757d;
}

.audit-distribution[b-hynsnlvji7] {
    padding: 16px 0;
}

.distribution-item[b-hynsnlvji7] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 16px;
    padding-bottom: 16px;
    border-bottom: 1px solid #e9ecef;
}

.distribution-item:last-child[b-hynsnlvji7] {
    border-bottom: none;
    margin-bottom: 0;
    padding-bottom: 0;
}

.distribution-info .distribution-name[b-hynsnlvji7] {
    font-weight: 600;
    color: #495057;
    margin-bottom: 4px;
}

.distribution-info .distribution-count[b-hynsnlvji7] {
    font-size: 0.85rem;
    color: #6c757d;
}

.distribution-progress[b-hynsnlvji7] {
    display: flex;
    align-items: center;
    gap: 8px;
    min-width: 120px;
}

.distribution-progress .progress[b-hynsnlvji7] {
    flex: 1;
    height: 6px;
}

.distribution-progress .percentage[b-hynsnlvji7] {
    font-size: 0.8rem;
    font-weight: 600;
    color: #495057;
    min-width: 35px;
    text-align: right;
}

.upcoming-audits-list[b-hynsnlvji7] {
    padding: 16px 0;
}

.upcoming-audit-item[b-hynsnlvji7] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 16px;
    background: #f8f9fa;
    border-radius: 8px;
    border: 1px solid #e9ecef;
    margin-bottom: 12px;
    transition: all 0.3s ease;
}

.upcoming-audit-item:hover[b-hynsnlvji7] {
    transform: translateY(-1px);
    box-shadow: 0 2px 8px rgba(0,0,0,0.1);
}

.upcoming-audit-item:last-child[b-hynsnlvji7] {
    margin-bottom: 0;
}

.audit-info h6[b-hynsnlvji7] {
    color: #2c3e50;
    margin-bottom: 4px;
    font-weight: 600;
}

.audit-info p[b-hynsnlvji7] {
    margin-bottom: 0;
    font-size: 0.9rem;
}

.audit-schedule[b-hynsnlvji7] {
    text-align: center;
    color: #495057;
}

.schedule-date[b-hynsnlvji7],
.schedule-time[b-hynsnlvji7] {
    display: flex;
    align-items: center;
    gap: 4px;
    font-size: 0.85rem;
    margin-bottom: 2px;
}

.schedule-date i[b-hynsnlvji7],
.schedule-time i[b-hynsnlvji7] {
    color: #6c757d;
}

.audit-actions[b-hynsnlvji7] {
    display: flex;
    gap: 8px;
}

.no-upcoming-audits[b-hynsnlvji7] {
    text-align: center;
    padding: 40px;
    color: #6c757d;
}

.loading-container[b-hynsnlvji7] {
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 200px;
    background: white;
    border-radius: 8px;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}

.no-data-container[b-hynsnlvji7] {
    background: white;
    border-radius: 8px;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
    margin: 24px 0;
}

.no-data-container i[b-hynsnlvji7] {
    color: #6c757d;
}

/* Audit Details Modal Styles */
.audit-details[b-hynsnlvji7] {
    padding: 16px;
}

.audit-header[b-hynsnlvji7] {
    border-bottom: 1px solid #e9ecef;
    padding-bottom: 16px;
}

.audit-header h5[b-hynsnlvji7] {
    color: #2c3e50;
    margin-bottom: 12px;
    font-weight: 600;
}

.audit-header p[b-hynsnlvji7] {
    margin-bottom: 6px;
    font-size: 0.9rem;
}

.audit-description h5[b-hynsnlvji7] {
    color: #2c3e50;
    margin-bottom: 12px;
    font-weight: 600;
}

.audit-findings h5[b-hynsnlvji7] {
    color: #2c3e50;
    margin-bottom: 16px;
    font-weight: 600;
}

.findings-list[b-hynsnlvji7] {
    max-height: 300px;
    overflow-y: auto;
}

.finding-item[b-hynsnlvji7] {
    background: #f8f9fa;
    padding: 16px;
    border-radius: 8px;
    border: 1px solid #e9ecef;
    margin-bottom: 12px;
}

.finding-item:last-child[b-hynsnlvji7] {
    margin-bottom: 0;
}

.finding-header[b-hynsnlvji7] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 8px;
}

.finding-header h6[b-hynsnlvji7] {
    color: #2c3e50;
    margin-bottom: 0;
    font-weight: 600;
}

.finding-description[b-hynsnlvji7] {
    color: #495057;
    margin-bottom: 8px;
    font-size: 0.9rem;
}

.finding-recommendation[b-hynsnlvji7] {
    color: #495057;
    font-size: 0.85rem;
    font-style: italic;
    border-top: 1px solid #e9ecef;
    padding-top: 8px;
}

.audit-actions[b-hynsnlvji7] {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
    padding-top: 16px;
    border-top: 1px solid #e9ecef;
}

/* Badge styles */
.badge.bg-warning[b-hynsnlvji7] {
    background-color: #ffc107 !important;
    color: #212529;
}

.badge.bg-success[b-hynsnlvji7] {
    background-color: #28a745 !important;
    color: white;
}

.badge.bg-danger[b-hynsnlvji7] {
    background-color: #dc3545 !important;
    color: white;
}

.badge.bg-info[b-hynsnlvji7] {
    background-color: #17a2b8 !important;
    color: white;
}

.badge.bg-secondary[b-hynsnlvji7] {
    background-color: #6c757d !important;
    color: white;
}

/* Progress bar styles */
.progress[b-hynsnlvji7] {
    height: 8px;
    background-color: #e9ecef;
    border-radius: 4px;
    overflow: hidden;
}

.progress-bar[b-hynsnlvji7] {
    height: 100%;
    line-height: 8px;
    font-size: 0.65rem;
    text-align: center;
    transition: width 0.6s ease;
}

.bg-primary[b-hynsnlvji7] { background-color: #007bff !important; }
.bg-success[b-hynsnlvji7] { background-color: #28a745 !important; }
.bg-info[b-hynsnlvji7] { background-color: #17a2b8 !important; }
.bg-warning[b-hynsnlvji7] { background-color: #ffc107 !important; }
.bg-danger[b-hynsnlvji7] { background-color: #dc3545 !important; }
.bg-secondary[b-hynsnlvji7] { background-color: #6c757d !important; }
.bg-light[b-hynsnlvji7] { background-color: #f8f9fa !important; }

/* Text color utilities */
.text-success[b-hynsnlvji7] { color: #28a745 !important; }
.text-warning[b-hynsnlvji7] { color: #ffc107 !important; }
.text-danger[b-hynsnlvji7] { color: #dc3545 !important; }
.text-info[b-hynsnlvji7] { color: #17a2b8 !important; }

/* Responsive Design */
@media (max-width: 768px) {
    .audit-management-page[b-hynsnlvji7] {
        padding: 16px;
    }
    
    .page-header[b-hynsnlvji7] {
        padding: 16px;
    }
    
    .page-header .d-flex[b-hynsnlvji7] {
        flex-direction: column;
        gap: 16px;
        align-items: flex-start !important;
    }
    
    .dashboard-metrics .row[b-hynsnlvji7] {
        flex-direction: column;
    }
    
    .metric-card[b-hynsnlvji7] {
        margin-bottom: 16px;
    }
    
    .upcoming-audit-item[b-hynsnlvji7] {
        flex-direction: column;
        align-items: flex-start;
        gap: 12px;
    }
    
    .audit-schedule[b-hynsnlvji7] {
        text-align: left;
        width: 100%;
    }
    
    .audit-actions[b-hynsnlvji7] {
        width: 100%;
        justify-content: flex-start;
    }
    
    .distribution-item[b-hynsnlvji7] {
        flex-direction: column;
        align-items: flex-start;
        gap: 8px;
    }
    
    .distribution-progress[b-hynsnlvji7] {
        width: 100%;
        min-width: unset;
    }
    
    .audit-actions[b-hynsnlvji7] {
        flex-direction: column;
    }
    
    .audit-actions .iswara-button[b-hynsnlvji7] {
        width: 100%;
    }
}

@media (max-width: 576px) {
    .metric-card[b-hynsnlvji7] {
        padding: 16px;
    }
    
    .metric-card .metric-value[b-hynsnlvji7] {
        font-size: 1.8rem;
    }
    
    .metric-card .metric-icon[b-hynsnlvji7] {
        font-size: 2rem;
    }
    
    .upcoming-audit-item[b-hynsnlvji7] {
        padding: 12px;
    }
    
    .finding-item[b-hynsnlvji7] {
        padding: 12px;
    }
    
    .finding-header[b-hynsnlvji7] {
        flex-direction: column;
        align-items: flex-start;
        gap: 4px;
    }
}
/* /Features/Compliance/AuditTrailPage.razor.rz.scp.css */
.audit-trail-page[b-3cns2wat6o] {
    padding: 2rem;
    background: linear-gradient(135deg, #BFD8B8 0%, #E2E6EA 100%);
    min-height: 100vh;
}

.page-header[b-3cns2wat6o] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 2rem;
    background: white;
    padding: 2rem;
    border-radius: 12px;
    box-shadow: 0 4px 6px rgba(20, 33, 61, 0.1);
}

.header-content h1[b-3cns2wat6o] {
    color: #14213D;
    font-size: 2rem;
    font-weight: 600;
    margin-bottom: 0.5rem;
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.header-content p[b-3cns2wat6o] {
    color: #2E2E2E;
    font-size: 1.1rem;
    margin: 0;
}

.content-container[b-3cns2wat6o] {
    background: white;
    border-radius: 12px;
    box-shadow: 0 4px 6px rgba(20, 33, 61, 0.1);
    padding: 2rem;
}

.audit-filters[b-3cns2wat6o] {
    background: #f8f9fa;
    padding: 1.5rem;
    border-radius: 8px;
    border: 1px solid #E2E6EA;
}

.audit-trail-grid[b-3cns2wat6o] {
    margin-top: 1.5rem;
}

.upgrade-prompt[b-3cns2wat6o] {
    padding: 3rem;
}

.upgrade-prompt .fa-lock[b-3cns2wat6o] {
    color: #C8A951;
}

.loading-overlay[b-3cns2wat6o] {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(255, 255, 255, 0.8);
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 1000;
}

.spinner-border[b-3cns2wat6o] {
    color: #C8A951;
}
/* /Features/Compliance/ComplianceReportsPage.razor.rz.scp.css */
.compliance-reports-page[b-gy3nrs1t5n] {
    padding: 2rem;
    background: linear-gradient(135deg, #BFD8B8 0%, #E2E6EA 100%);
    min-height: 100vh;
}

.page-header[b-gy3nrs1t5n] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 2rem;
    background: white;
    padding: 2rem;
    border-radius: 12px;
    box-shadow: 0 4px 6px rgba(20, 33, 61, 0.1);
}

.header-content h1[b-gy3nrs1t5n] {
    color: #14213D;
    font-size: 2rem;
    font-weight: 600;
    margin-bottom: 0.5rem;
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.header-content p[b-gy3nrs1t5n] {
    color: #2E2E2E;
    font-size: 1.1rem;
    margin: 0;
}

.content-container[b-gy3nrs1t5n] {
    background: white;
    border-radius: 12px;
    box-shadow: 0 4px 6px rgba(20, 33, 61, 0.1);
    overflow: hidden;
}

.reports-grid[b-gy3nrs1t5n] {
    padding: 2rem;
}

.upgrade-prompt[b-gy3nrs1t5n] {
    padding: 3rem;
}

.upgrade-prompt .fa-lock[b-gy3nrs1t5n] {
    color: #C8A951;
}

.loading-overlay[b-gy3nrs1t5n] {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(255, 255, 255, 0.8);
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 1000;
}

.spinner-border[b-gy3nrs1t5n] {
    color: #C8A951;
}
/* /Features/Compliance/DueDiligencePage.razor.rz.scp.css */
.due-diligence-page[b-nwpkltikam] {
    padding: 24px;
    background: #f8f9fa;
    min-height: 100vh;
}

.page-header[b-nwpkltikam] {
    background: white;
    padding: 24px;
    border-radius: 8px;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
    margin-bottom: 24px;
}

.page-header h2[b-nwpkltikam] {
    color: #2c3e50;
    margin-bottom: 8px;
    font-weight: 600;
}

.page-header .text-muted[b-nwpkltikam] {
    margin-bottom: 12px;
    font-size: 0.95rem;
}

.due-diligence-config[b-nwpkltikam],
.reports-list[b-nwpkltikam],
.due-diligence-metrics[b-nwpkltikam] {
    margin-bottom: 24px;
}

.compliance-overview[b-nwpkltikam] {
    padding: 16px 0;
}

.metric-card[b-nwpkltikam] {
    background: #f8f9fa;
    padding: 20px;
    border-radius: 8px;
    border: 1px solid #e9ecef;
    text-align: center;
    transition: all 0.3s ease;
}

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

.metric-card .metric-icon[b-nwpkltikam] {
    font-size: 2.5rem;
    margin-bottom: 12px;
    color: #007bff;
}

.metric-card .metric-value[b-nwpkltikam] {
    font-size: 2rem;
    font-weight: 700;
    margin-bottom: 4px;
    color: #2c3e50;
}

.metric-card .metric-label[b-nwpkltikam] {
    color: #6c757d;
    font-size: 0.9rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.framework-compliance[b-nwpkltikam] {
    padding: 16px 0;
}

.framework-item[b-nwpkltikam] {
    margin-bottom: 16px;
    padding-bottom: 16px;
    border-bottom: 1px solid #e9ecef;
}

.framework-item:last-child[b-nwpkltikam] {
    border-bottom: none;
    margin-bottom: 0;
    padding-bottom: 0;
}

.framework-name[b-nwpkltikam] {
    font-weight: 600;
    color: #495057;
    margin-bottom: 8px;
}

.progress[b-nwpkltikam] {
    height: 8px;
    background-color: #e9ecef;
    border-radius: 4px;
}

.progress-bar[b-nwpkltikam] {
    border-radius: 4px;
    font-size: 0.75rem;
    line-height: 8px;
}

.loading-container[b-nwpkltikam] {
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 200px;
    background: white;
    border-radius: 8px;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}

.no-data-container[b-nwpkltikam] {
    background: white;
    border-radius: 8px;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
    margin: 24px 0;
}

.no-data-container i[b-nwpkltikam] {
    color: #6c757d;
}

.btn-group .iswara-button[b-nwpkltikam] {
    margin-right: 4px;
}

.btn-group .iswara-button:last-child[b-nwpkltikam] {
    margin-right: 0;
}

/* Report Details Modal Styles */
.report-details[b-nwpkltikam] {
    padding: 16px;
}

.report-header[b-nwpkltikam] {
    border-bottom: 1px solid #e9ecef;
    padding-bottom: 16px;
}

.report-header h5[b-nwpkltikam] {
    color: #2c3e50;
    margin-bottom: 12px;
    font-weight: 600;
}

.report-header p[b-nwpkltikam] {
    margin-bottom: 6px;
    font-size: 0.9rem;
}

.executive-summary[b-nwpkltikam] {
    background: #f8f9fa;
    padding: 20px;
    border-radius: 8px;
    border-left: 4px solid #007bff;
}

.executive-summary h5[b-nwpkltikam] {
    color: #2c3e50;
    margin-bottom: 16px;
    font-weight: 600;
}

.summary-content[b-nwpkltikam] {
    line-height: 1.6;
    color: #495057;
}

.compliance-areas h5[b-nwpkltikam] {
    color: #2c3e50;
    margin-bottom: 16px;
    font-weight: 600;
}

.areas-grid[b-nwpkltikam] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 16px;
}

.area-card[b-nwpkltikam] {
    background: white;
    padding: 20px;
    border-radius: 8px;
    border: 1px solid #e9ecef;
    box-shadow: 0 2px 4px rgba(0,0,0,0.05);
}

.area-card h6[b-nwpkltikam] {
    color: #2c3e50;
    margin-bottom: 12px;
    font-weight: 600;
}

.area-score[b-nwpkltikam] {
    margin-bottom: 12px;
}

.score-value[b-nwpkltikam] {
    font-size: 1.5rem;
    font-weight: 700;
    display: block;
    margin-bottom: 8px;
}

.score-value.success[b-nwpkltikam] {
    color: #28a745;
}

.score-value.warning[b-nwpkltikam] {
    color: #ffc107;
}

.score-value.danger[b-nwpkltikam] {
    color: #dc3545;
}

.area-issues[b-nwpkltikam] {
    padding-top: 8px;
    border-top: 1px solid #e9ecef;
}

.report-actions[b-nwpkltikam] {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
    padding-top: 16px;
    border-top: 1px solid #e9ecef;
}

/* Status and Score Indicators */
.badge.bg-warning[b-nwpkltikam] {
    background-color: #ffc107 !important;
    color: #212529;
}

.badge.bg-success[b-nwpkltikam] {
    background-color: #28a745 !important;
    color: white;
}

.badge.bg-danger[b-nwpkltikam] {
    background-color: #dc3545 !important;
    color: white;
}

.badge.bg-info[b-nwpkltikam] {
    background-color: #17a2b8 !important;
    color: white;
}

.badge.bg-secondary[b-nwpkltikam] {
    background-color: #6c757d !important;
    color: white;
}

.text-success[b-nwpkltikam] {
    color: #28a745 !important;
}

.text-warning[b-nwpkltikam] {
    color: #ffc107 !important;
}

.text-danger[b-nwpkltikam] {
    color: #dc3545 !important;
}

.text-info[b-nwpkltikam] {
    color: #17a2b8 !important;
}

/* Configuration Section */
.due-diligence-config .form-check[b-nwpkltikam] {
    display: flex;
    align-items: center;
    height: 100%;
    padding-left: 0;
}

.due-diligence-config .form-check-input[b-nwpkltikam] {
    margin-right: 8px;
    margin-left: 0;
}

/* Responsive Design */
@media (max-width: 768px) {
    .due-diligence-page[b-nwpkltikam] {
        padding: 16px;
    }
    
    .page-header[b-nwpkltikam] {
        padding: 16px;
    }
    
    .page-header .d-flex[b-nwpkltikam] {
        flex-direction: column;
        gap: 16px;
        align-items: flex-start !important;
    }
    
    .areas-grid[b-nwpkltikam] {
        grid-template-columns: 1fr;
    }
    
    .report-actions[b-nwpkltikam] {
        flex-direction: column;
    }
    
    .btn-group[b-nwpkltikam] {
        flex-direction: column;
        width: 100%;
    }
    
    .btn-group .iswara-button[b-nwpkltikam] {
        width: 100%;
        margin: 2px 0;
    }
}

@media (max-width: 576px) {
    .compliance-overview .row[b-nwpkltikam] {
        flex-direction: column;
    }
    
    .metric-card[b-nwpkltikam] {
        margin-bottom: 16px;
    }
    
    .metric-card .metric-value[b-nwpkltikam] {
        font-size: 1.5rem;
    }
    
    .metric-card .metric-icon[b-nwpkltikam] {
        font-size: 2rem;
    }
}
/* /Features/Compliance/EvidencePage.razor.rz.scp.css */
.evidence-page[b-npnmnb6303] {
    padding: 2rem;
    background: linear-gradient(135deg, #BFD8B8 0%, #E2E6EA 100%);
    min-height: 100vh;
}

.page-header[b-npnmnb6303] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 2rem;
    background: white;
    padding: 2rem;
    border-radius: 12px;
    box-shadow: 0 4px 6px rgba(20, 33, 61, 0.1);
}

.header-content h1[b-npnmnb6303] {
    color: #14213D;
    font-size: 2rem;
    font-weight: 600;
    margin-bottom: 0.5rem;
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.header-content p[b-npnmnb6303] {
    color: #2E2E2E;
    font-size: 1.1rem;
    margin: 0;
}

.content-container[b-npnmnb6303] {
    background: white;
    border-radius: 12px;
    box-shadow: 0 4px 6px rgba(20, 33, 61, 0.1);
    padding: 2rem;
}

.evidence-filters[b-npnmnb6303] {
    background: #f8f9fa;
    padding: 1.5rem;
    border-radius: 8px;
    border: 1px solid #E2E6EA;
}

.evidence-grid[b-npnmnb6303] {
    margin-top: 1.5rem;
}

.loading-overlay[b-npnmnb6303] {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(255, 255, 255, 0.8);
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 1000;
}

.spinner-border[b-npnmnb6303] {
    color: #C8A951;
}
/* /Features/Compliance/ReportTemplatesPage.razor.rz.scp.css */
.templates-page[b-v7c6na2ep0] {
    padding: 2rem;
    background: linear-gradient(135deg, #BFD8B8 0%, #E2E6EA 100%);
    min-height: 100vh;
}

.page-header[b-v7c6na2ep0] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 2rem;
    background: white;
    padding: 2rem;
    border-radius: 12px;
    box-shadow: 0 4px 6px rgba(20, 33, 61, 0.1);
}

.header-content h1[b-v7c6na2ep0] {
    color: #14213D;
    font-size: 2rem;
    font-weight: 600;
    margin-bottom: 0.5rem;
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.header-content p[b-v7c6na2ep0] {
    color: #2E2E2E;
    font-size: 1.1rem;
    margin: 0;
}

.content-container[b-v7c6na2ep0] {
    background: white;
    border-radius: 12px;
    box-shadow: 0 4px 6px rgba(20, 33, 61, 0.1);
    padding: 2rem;
}

.template-card[b-v7c6na2ep0] {
    border: 1px solid #E2E6EA;
    transition: all 0.3s ease;
}

.template-card:hover[b-v7c6na2ep0] {
    transform: translateY(-2px);
    box-shadow: 0 8px 16px rgba(20, 33, 61, 0.15);
}

.template-header[b-v7c6na2ep0] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 1rem;
}

.template-title[b-v7c6na2ep0] {
    color: #14213D;
    font-weight: 600;
    margin: 0;
    flex: 1;
}

.template-actions[b-v7c6na2ep0] {
    display: flex;
    gap: 0.5rem;
}

.template-description[b-v7c6na2ep0] {
    color: #2E2E2E;
    font-size: 0.9rem;
    margin-bottom: 1rem;
    line-height: 1.5;
}

.template-meta[b-v7c6na2ep0] {
    padding-top: 1rem;
    border-top: 1px solid #E2E6EA;
}

.empty-state[b-v7c6na2ep0] {
    background: #f8f9fa;
    border-radius: 8px;
    padding: 3rem;
}

.empty-state .fa-file-alt[b-v7c6na2ep0] {
    color: #C8A951;
}

.upgrade-prompt[b-v7c6na2ep0] {
    padding: 3rem;
}

.upgrade-prompt .fa-lock[b-v7c6na2ep0] {
    color: #C8A951;
}

.loading-overlay[b-v7c6na2ep0] {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(255, 255, 255, 0.8);
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 1000;
}

.spinner-border[b-v7c6na2ep0] {
    color: #C8A951;
}
/* /Features/Compliance/TraceabilityPage.razor.rz.scp.css */
.traceability-page[b-xpsjzv7s84] {
    padding: 24px;
    background: #f8f9fa;
    min-height: 100vh;
}

.page-header[b-xpsjzv7s84] {
    background: white;
    padding: 24px;
    border-radius: 8px;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
    margin-bottom: 24px;
}

.page-header h2[b-xpsjzv7s84] {
    color: #2c3e50;
    margin-bottom: 8px;
    font-weight: 600;
}

.page-header .text-muted[b-xpsjzv7s84] {
    margin-bottom: 12px;
    font-size: 0.95rem;
}

.traceability-filters[b-xpsjzv7s84],
.traceability-viewer[b-xpsjzv7s84],
.evidence-chain-details[b-xpsjzv7s84],
.traceability-stats[b-xpsjzv7s84],
.traceability-actions[b-xpsjzv7s84] {
    margin-bottom: 24px;
}

.chain-analysis[b-xpsjzv7s84] {
    padding: 16px 0;
}

.stat-card[b-xpsjzv7s84] {
    background: #f8f9fa;
    padding: 20px;
    border-radius: 8px;
    border: 1px solid #e9ecef;
    text-align: center;
    transition: all 0.3s ease;
    height: 100%;
}

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

.stat-card .stat-icon[b-xpsjzv7s84] {
    font-size: 2.5rem;
    margin-bottom: 12px;
    color: #007bff;
}

.stat-card .stat-value[b-xpsjzv7s84] {
    font-size: 2rem;
    font-weight: 700;
    margin-bottom: 4px;
    color: #2c3e50;
}

.stat-card .stat-label[b-xpsjzv7s84] {
    color: #6c757d;
    font-size: 0.9rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.chain-types[b-xpsjzv7s84] {
    padding: 16px 0;
}

.type-item[b-xpsjzv7s84] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 16px;
    padding-bottom: 16px;
    border-bottom: 1px solid #e9ecef;
}

.type-item:last-child[b-xpsjzv7s84] {
    border-bottom: none;
    margin-bottom: 0;
    padding-bottom: 0;
}

.type-info .type-name[b-xpsjzv7s84] {
    font-weight: 600;
    color: #495057;
    margin-bottom: 4px;
}

.type-info .type-count[b-xpsjzv7s84] {
    font-size: 0.85rem;
    color: #6c757d;
}

.type-progress[b-xpsjzv7s84] {
    display: flex;
    align-items: center;
    gap: 8px;
    min-width: 120px;
}

.type-progress .progress[b-xpsjzv7s84] {
    flex: 1;
    height: 6px;
}

.type-progress .percentage[b-xpsjzv7s84] {
    font-size: 0.8rem;
    font-weight: 600;
    color: #495057;
    min-width: 35px;
    text-align: right;
}

.action-buttons[b-xpsjzv7s84] {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
}

.loading-container[b-xpsjzv7s84] {
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 200px;
    background: white;
    border-radius: 8px;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}

.no-data-container[b-xpsjzv7s84] {
    background: white;
    border-radius: 8px;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
    margin: 24px 0;
}

.no-data-container i[b-xpsjzv7s84] {
    color: #6c757d;
}

/* Chain Details Modal Styles */
.chain-details[b-xpsjzv7s84] {
    padding: 16px;
}

.chain-header[b-xpsjzv7s84] {
    border-bottom: 1px solid #e9ecef;
    padding-bottom: 16px;
}

.chain-header h5[b-xpsjzv7s84] {
    color: #2c3e50;
    margin-bottom: 12px;
    font-weight: 600;
}

.chain-header p[b-xpsjzv7s84] {
    margin-bottom: 6px;
    font-size: 0.9rem;
}

.chain-nodes h5[b-xpsjzv7s84] {
    color: #2c3e50;
    margin-bottom: 16px;
    font-weight: 600;
}

.nodes-timeline[b-xpsjzv7s84] {
    position: relative;
    padding-left: 30px;
}

.nodes-timeline[b-xpsjzv7s84]::before {
    content: '';
    position: absolute;
    left: 15px;
    top: 0;
    bottom: 0;
    width: 2px;
    background: #e9ecef;
}

.timeline-item[b-xpsjzv7s84] {
    position: relative;
    margin-bottom: 24px;
}

.timeline-item.last[b-xpsjzv7s84] {
    margin-bottom: 0;
}

.timeline-marker[b-xpsjzv7s84] {
    position: absolute;
    left: -22px;
    top: 0;
    width: 30px;
    height: 30px;
    background: #007bff;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    font-size: 0.8rem;
    z-index: 1;
}

.timeline-content[b-xpsjzv7s84] {
    background: #f8f9fa;
    padding: 16px;
    border-radius: 8px;
    border: 1px solid #e9ecef;
}

.timeline-content h6[b-xpsjzv7s84] {
    color: #2c3e50;
    margin-bottom: 8px;
    font-weight: 600;
}

.timeline-content p[b-xpsjzv7s84] {
    margin-bottom: 8px;
    font-size: 0.9rem;
}

.timeline-content p:last-child[b-xpsjzv7s84] {
    margin-bottom: 0;
}

.node-evidence[b-xpsjzv7s84] {
    margin-top: 8px;
    padding-top: 8px;
    border-top: 1px solid #e9ecef;
}

.chain-actions[b-xpsjzv7s84] {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
    padding-top: 16px;
    border-top: 1px solid #e9ecef;
}

/* Badge styles */
.badge.bg-info[b-xpsjzv7s84] {
    background-color: #17a2b8 !important;
    color: white;
}

.badge.bg-success[b-xpsjzv7s84] {
    background-color: #28a745 !important;
    color: white;
}

.badge.bg-warning[b-xpsjzv7s84] {
    background-color: #ffc107 !important;
    color: #212529;
}

.badge.bg-danger[b-xpsjzv7s84] {
    background-color: #dc3545 !important;
    color: white;
}

.badge.bg-secondary[b-xpsjzv7s84] {
    background-color: #6c757d !important;
    color: white;
}

/* Progress bar styles */
.progress[b-xpsjzv7s84] {
    height: 8px;
    background-color: #e9ecef;
    border-radius: 4px;
    overflow: hidden;
}

.progress-bar[b-xpsjzv7s84] {
    height: 100%;
    line-height: 8px;
    font-size: 0.65rem;
    text-align: center;
    transition: width 0.6s ease;
}

.bg-primary[b-xpsjzv7s84] { background-color: #007bff !important; }
.bg-warning[b-xpsjzv7s84] { background-color: #ffc107 !important; }
.bg-success[b-xpsjzv7s84] { background-color: #28a745 !important; }
.bg-danger[b-xpsjzv7s84] { background-color: #dc3545 !important; }
.bg-info[b-xpsjzv7s84] { background-color: #17a2b8 !important; }
.bg-secondary[b-xpsjzv7s84] { background-color: #6c757d !important; }
.bg-light[b-xpsjzv7s84] { background-color: #f8f9fa !important; }

/* Text color utilities */
.text-success[b-xpsjzv7s84] { color: #28a745 !important; }
.text-warning[b-xpsjzv7s84] { color: #ffc107 !important; }
.text-danger[b-xpsjzv7s84] { color: #dc3545 !important; }
.text-info[b-xpsjzv7s84] { color: #17a2b8 !important; }

/* Form check styling */
.traceability-filters .form-check[b-xpsjzv7s84] {
    display: flex;
    align-items: center;
    height: 100%;
    padding-left: 0;
}

.traceability-filters .form-check-input[b-xpsjzv7s84] {
    margin-right: 8px;
    margin-left: 0;
}

/* Responsive Design */
@media (max-width: 768px) {
    .traceability-page[b-xpsjzv7s84] {
        padding: 16px;
    }
    
    .page-header[b-xpsjzv7s84] {
        padding: 16px;
    }
    
    .page-header .d-flex[b-xpsjzv7s84] {
        flex-direction: column;
        gap: 16px;
        align-items: flex-start !important;
    }
    
    .chain-analysis .row[b-xpsjzv7s84] {
        flex-direction: column;
    }
    
    .stat-card[b-xpsjzv7s84] {
        margin-bottom: 16px;
    }
    
    .action-buttons[b-xpsjzv7s84] {
        flex-direction: column;
    }
    
    .action-buttons .iswara-button[b-xpsjzv7s84] {
        width: 100%;
    }
    
    .chain-actions[b-xpsjzv7s84] {
        flex-direction: column;
    }
    
    .chain-actions .iswara-button[b-xpsjzv7s84] {
        width: 100%;
    }
    
    .type-item[b-xpsjzv7s84] {
        flex-direction: column;
        align-items: flex-start;
        gap: 8px;
    }
    
    .type-progress[b-xpsjzv7s84] {
        width: 100%;
        min-width: unset;
    }
}

@media (max-width: 576px) {
    .timeline-content[b-xpsjzv7s84] {
        padding: 12px;
    }
    
    .timeline-marker[b-xpsjzv7s84] {
        width: 24px;
        height: 24px;
        left: -19px;
        font-size: 0.7rem;
    }
    
    .nodes-timeline[b-xpsjzv7s84] {
        padding-left: 24px;
    }
    
    .nodes-timeline[b-xpsjzv7s84]::before {
        left: 12px;
    }
    
    .stat-card .stat-value[b-xpsjzv7s84] {
        font-size: 1.5rem;
    }
    
    .stat-card .stat-icon[b-xpsjzv7s84] {
        font-size: 2rem;
    }
}
/* /Features/Dashboard/Components/AnswerChoicesTable.razor.rz.scp.css */
/* Answer Choices Table Styling */

.answer-choices-section[b-gwochzch6e] {
    background: white;
    border-radius: 20px;
    padding: 32px;
    margin-bottom: 32px;
    box-shadow: 0 4px 20px rgba(20, 33, 61, 0.08);
    border: 1px solid #E2E6EA;
}

/* Quiz Statistics Header */
.quiz-statistics-header[b-gwochzch6e] {
    background: #F8FAFC;
    border-radius: 12px;
    padding: 24px;
    margin-bottom: 24px;
    border: 1px solid #E2E6EA;
}

.quiz-statistics-header h4[b-gwochzch6e] {
    margin: 0 0 16px 0;
    font-size: 1rem;
    font-weight: 700;
    color: #14213D;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.stats-summary[b-gwochzch6e] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 20px;
}

.stat-group[b-gwochzch6e] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.stat-label[b-gwochzch6e] {
    font-size: 0.875rem;
    color: #717188;
    font-weight: 500;
}

.stat-value[b-gwochzch6e] {
    font-size: 1rem;
    color: #14213D;
    font-weight: 600;
}

/* Table Container */
.answer-choices-table-container[b-gwochzch6e] {
    overflow: hidden;
    border-radius: 12px;
    border: 1px solid #E2E6EA;
}

.table-responsive[b-gwochzch6e] {
    overflow-x: auto;
}

/* Table Styling */
.answer-choices-table[b-gwochzch6e] {
    width: 100%;
    border-collapse: collapse;
    background: white;
}

.answer-choices-table thead[b-gwochzch6e] {
    background: #F8FAFC;
}

.answer-choices-table th[b-gwochzch6e] {
    padding: 16px 20px;
    text-align: left;
    border-bottom: 1px solid #E2E6EA;
    font-weight: 600;
    color: #717188;
    font-size: 0.875rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.header-content[b-gwochzch6e] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    cursor: pointer;
    transition: color 0.3s ease;
}

.header-content:hover[b-gwochzch6e] {
    color: #14213D;
}

.header-content i[b-gwochzch6e] {
    font-size: 0.75rem;
    opacity: 0.6;
}

/* Column Widths */
.choice-column[b-gwochzch6e] {
    width: 50%;
}

.score-column[b-gwochzch6e] {
    width: 25%;
    text-align: center;
}

.responses-column[b-gwochzch6e] {
    width: 25%;
    text-align: center;
}

/* Table Body */
.answer-choices-table tbody tr[b-gwochzch6e] {
    border-bottom: 1px solid #E2E6EA;
    transition: all 0.3s ease;
    cursor: pointer;
}

.choice-row:hover[b-gwochzch6e] {
    background: linear-gradient(135deg, rgba(191, 216, 184, 0.05) 0%, rgba(226, 230, 234, 0.05) 100%);
}

.choice-row.expanded[b-gwochzch6e] {
    background: linear-gradient(135deg, rgba(200, 169, 81, 0.1) 0%, rgba(20, 33, 61, 0.05) 100%);
}

.answer-choices-table td[b-gwochzch6e] {
    padding: 16px 20px;
    vertical-align: middle;
}

/* Choice Cell */
.choice-content[b-gwochzch6e] {
    display: flex;
    align-items: center;
    gap: 12px;
}

.expand-icon[b-gwochzch6e] {
    color: #C8A951;
    font-size: 0.875rem;
    transition: transform 0.3s ease;
}

.choice-row.expanded .expand-icon[b-gwochzch6e] {
    transform: rotate(90deg);
}

.choice-text[b-gwochzch6e] {
    color: #14213D;
    font-weight: 500;
    font-size: 0.95rem;
}

/* Score Cell */
.score-cell[b-gwochzch6e] {
    text-align: center;
}

.score-value[b-gwochzch6e] {
    font-weight: 600;
    color: #14213D;
    font-size: 0.95rem;
}

/* Responses Cell */
.responses-cell[b-gwochzch6e] {
    text-align: center;
}

.response-info[b-gwochzch6e] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 2px;
}

.percentage[b-gwochzch6e] {
    font-weight: 600;
    color: #14213D;
    font-size: 0.95rem;
}

.count[b-gwochzch6e] {
    font-size: 0.875rem;
    color: #717188;
}

/* Total Row */
.total-row[b-gwochzch6e] {
    background: #F8FAFC;
    border-top: 2px solid #E2E6EA;
}

.total-row:hover[b-gwochzch6e] {
    background: #F8FAFC;
}

.total-cell[b-gwochzch6e],
.total-responses-cell[b-gwochzch6e] {
    font-weight: 700;
    color: #14213D;
}

.total-responses-cell[b-gwochzch6e] {
    text-align: center;
}

/* Responsive Design */
@media (max-width: 768px) {
    .answer-choices-section[b-gwochzch6e] {
        padding: 20px;
        margin-bottom: 24px;
    }

    .quiz-statistics-header[b-gwochzch6e] {
        padding: 20px;
    }

    .stats-summary[b-gwochzch6e] {
        grid-template-columns: 1fr;
        gap: 16px;
    }

    .answer-choices-table th[b-gwochzch6e],
    .answer-choices-table td[b-gwochzch6e] {
        padding: 12px 16px;
    }

    .choice-column[b-gwochzch6e] {
        width: 45%;
    }

    .score-column[b-gwochzch6e],
    .responses-column[b-gwochzch6e] {
        width: 27.5%;
    }

    .choice-text[b-gwochzch6e] {
        font-size: 0.875rem;
    }

    .score-value[b-gwochzch6e],
    .percentage[b-gwochzch6e] {
        font-size: 0.875rem;
    }

    .count[b-gwochzch6e] {
        font-size: 0.8rem;
    }
}

@media (max-width: 480px) {
    .answer-choices-section[b-gwochzch6e] {
        padding: 16px;
    }

    .quiz-statistics-header[b-gwochzch6e] {
        padding: 16px;
    }

    .stats-summary[b-gwochzch6e] {
        gap: 12px;
    }

    .stat-label[b-gwochzch6e] {
        font-size: 0.8rem;
    }

    .stat-value[b-gwochzch6e] {
        font-size: 0.9rem;
    }

    .answer-choices-table th[b-gwochzch6e],
    .answer-choices-table td[b-gwochzch6e] {
        padding: 10px 12px;
    }

    .header-content span[b-gwochzch6e] {
        font-size: 0.75rem;
    }

    .choice-content[b-gwochzch6e] {
        gap: 8px;
    }

    .choice-text[b-gwochzch6e] {
        font-size: 0.8rem;
    }

    .score-value[b-gwochzch6e],
    .percentage[b-gwochzch6e] {
        font-size: 0.8rem;
    }

    .count[b-gwochzch6e] {
        font-size: 0.75rem;
    }

    .response-info[b-gwochzch6e] {
        gap: 1px;
    }
}
/* /Features/Dashboard/Components/DashboardFilters.razor.rz.scp.css */
.dashboard-filters[b-apee7lxcrj] {
    background: white;
    border-radius: 12px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
    border: 1px solid #E2E6EA;
    padding: 1.5rem;
    margin-bottom: 1.5rem;
}

.filters-container[b-apee7lxcrj] {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

.filter-section[b-apee7lxcrj] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 1rem;
    align-items: end;
}

.filter-group[b-apee7lxcrj] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.filter-label[b-apee7lxcrj] {
    font-size: 0.875rem;
    font-weight: 600;
    color: #14213D;
    margin-bottom: 0.25rem;
}

.date-range-container[b-apee7lxcrj] {
    position: relative;
}

[b-apee7lxcrj] .filter-dropdown {
    width: 100%;
}

.filter-actions[b-apee7lxcrj] {
    display: flex;
    gap: 0.75rem;
    align-items: center;
    justify-content: flex-start;
    flex-wrap: wrap;
}

.save-filter-btn[b-apee7lxcrj] {
    margin-left: auto;
}

.advanced-filters[b-apee7lxcrj] {
    border-top: 1px solid #E2E6EA;
    padding-top: 1.5rem;
    margin-top: 1rem;
}

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

.advanced-header h4[b-apee7lxcrj] {
    color: #14213D;
    font-size: 1.1rem;
    font-weight: 600;
    margin: 0;
}

.advanced-filter-groups[b-apee7lxcrj] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 1rem;
}

.advanced-toggle[b-apee7lxcrj] {
    display: flex;
    justify-content: center;
    margin-top: 1rem;
    padding-top: 1rem;
    border-top: 1px solid #E2E6EA;
}

.active-filters[b-apee7lxcrj] {
    margin-top: 1.5rem;
    padding-top: 1rem;
    border-top: 1px solid #E2E6EA;
}

.active-filters-label[b-apee7lxcrj] {
    font-size: 0.875rem;
    font-weight: 600;
    color: #14213D;
    margin-right: 0.75rem;
}

.filter-tags[b-apee7lxcrj] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    margin-top: 0.5rem;
}

.filter-tag[b-apee7lxcrj] {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    background: linear-gradient(135deg, #BFD8B8 0%, #E2E6EA 100%);
    color: #14213D;
    padding: 0.375rem 0.75rem;
    border-radius: 20px;
    font-size: 0.75rem;
    font-weight: 500;
    border: 1px solid #C8A951;
    cursor: default;
    transition: all 0.2s ease;
}

.filter-tag:hover[b-apee7lxcrj] {
    background: linear-gradient(135deg, #E2E6EA 0%, #BFD8B8 100%);
    transform: translateY(-1px);
}

.filter-tag i[b-apee7lxcrj] {
    color: #14213D;
    cursor: pointer;
    padding: 0.125rem;
    border-radius: 50%;
    transition: all 0.2s ease;
}

.filter-tag i:hover[b-apee7lxcrj] {
    background: rgba(20, 33, 61, 0.1);
    color: #C8A951;
}

/* Responsive Design */
@media (max-width: 768px) {
    .dashboard-filters[b-apee7lxcrj] {
        padding: 1rem;
    }
    
    .filter-section[b-apee7lxcrj] {
        grid-template-columns: 1fr;
        gap: 1rem;
    }
    
    .advanced-filter-groups[b-apee7lxcrj] {
        grid-template-columns: 1fr;
    }
    
    .filter-actions[b-apee7lxcrj] {
        justify-content: stretch;
        flex-direction: column;
    }
    
    .save-filter-btn[b-apee7lxcrj] {
        margin-left: 0;
    }
    
    .filter-tags[b-apee7lxcrj] {
        justify-content: center;
    }
}

@media (max-width: 480px) {
    .dashboard-filters[b-apee7lxcrj] {
        padding: 0.75rem;
        margin-bottom: 1rem;
    }
    
    .filters-container[b-apee7lxcrj] {
        gap: 1rem;
    }
    
    .advanced-header[b-apee7lxcrj] {
        flex-direction: column;
        gap: 0.5rem;
        align-items: flex-start;
    }
    
    .active-filters-label[b-apee7lxcrj] {
        display: block;
        margin-bottom: 0.5rem;
    }
}

/* Loading States */
.filter-group.loading[b-apee7lxcrj]  .filter-dropdown {
    opacity: 0.7;
    pointer-events: none;
}

.filter-group.loading[b-apee7lxcrj]::after {
    content: '';
    position: absolute;
    top: 50%;
    right: 1rem;
    transform: translateY(-50%);
    width: 16px;
    height: 16px;
    border: 2px solid #E2E6EA;
    border-top: 2px solid #C8A951;
    border-radius: 50%;
    animation: spin-b-apee7lxcrj 1s linear infinite;
}

@keyframes spin-b-apee7lxcrj {
    0% { transform: translateY(-50%) rotate(0deg); }
    100% { transform: translateY(-50%) rotate(360deg); }
}

/* Focus States */
[b-apee7lxcrj] .filter-dropdown:focus-within {
    outline: 2px solid #C8A951;
    outline-offset: 2px;
}

/* Hover Effects */
.filter-actions .iswara-button:hover[b-apee7lxcrj] {
    transform: translateY(-1px);
}

.advanced-toggle .iswara-button:hover[b-apee7lxcrj] {
    transform: translateY(-1px);
}
/* /Features/Dashboard/Components/DashboardOverview.razor.rz.scp.css */
/* Dashboard Overview Component Styling */
.dashboard-overview[b-w98m8bxe2q] {
    padding: 0;
}

/* Charts View Styling */
.charts-view[b-w98m8bxe2q] {
    padding: 20px;
}

.charts-container[b-w98m8bxe2q] {
    display: flex;
    flex-direction: column;
    gap: 24px;
    max-width: 1200px;
    margin: 0 auto;
}

.chart-row[b-w98m8bxe2q] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 24px;
    align-items: start;
}

/* Individual Chart Cards */
.chart-card[b-w98m8bxe2q] {
    background: white;
    border-radius: 16px;
    box-shadow: 0 4px 16px rgba(20, 33, 61, 0.08);
    border: 1px solid rgba(226, 230, 234, 0.3);
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    overflow: hidden;
}

.chart-card:hover[b-w98m8bxe2q] {
    transform: translateY(-2px);
    box-shadow: 0 8px 24px rgba(20, 33, 61, 0.12);
    border-color: rgba(200, 169, 81, 0.2);
}

/* First Row: Heat Map - Full Width */
.chart-row:first-child[b-w98m8bxe2q] {
    grid-template-columns: 1fr;
}

.chart-row:first-child .heatmap-card[b-w98m8bxe2q] {
    grid-column: 1;
}

/* Second Row: Gauge and Trend Chart - Side by Side */
.chart-row:nth-child(2)[b-w98m8bxe2q] {
    grid-template-columns: 1fr 1fr;
}

/* Mental Fitness Gauge Card */
.gauge-card[b-w98m8bxe2q] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 320px;
}

/* Trend Chart Card */
.trend-card[b-w98m8bxe2q] {
    min-height: 320px;
}

/* Loading and Error States */
.dashboard-loading[b-w98m8bxe2q],
.dashboard-error[b-w98m8bxe2q] {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 60px 20px;
    color: #717188;
    font-size: 1.1rem;
    font-weight: 500;
}

.dashboard-loading i[b-w98m8bxe2q],
.dashboard-error i[b-w98m8bxe2q] {
    margin-right: 12px;
    font-size: 1.3rem;
}

.dashboard-error[b-w98m8bxe2q] {
    color: #ef4444;
}

/* List View Styling */
.list-view-container[b-w98m8bxe2q] {
    background: white;
    border-radius: 16px;
    box-shadow: 0 4px 16px rgba(20, 33, 61, 0.08);
    border: 1px solid rgba(226, 230, 234, 0.3);
    margin: 20px;
    overflow: hidden;
}

.hazard-list[b-w98m8bxe2q] {
    width: 100%;
}

/* List Header */
.list-header[b-w98m8bxe2q] {
    display: grid;
    grid-template-columns: 3fr 1fr 1.5fr 1.5fr 1fr;
    background: #f8fafc;
    border-bottom: 1px solid #e2e8f0;
    padding: 16px 20px;
    font-weight: 600;
    color: #475569;
    font-size: 0.875rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.header-cell[b-w98m8bxe2q] {
    display: flex;
    align-items: center;
}

/* List Body */
.list-body[b-w98m8bxe2q] {
    display: flex;
    flex-direction: column;
}

.list-item[b-w98m8bxe2q] {
    display: grid;
    grid-template-columns: 3fr 1fr 1.5fr 1.5fr 1fr;
    padding: 20px;
    border-bottom: 1px solid #f1f5f9;
    transition: all 0.2s ease;
    align-items: center;
}

.list-item:hover[b-w98m8bxe2q] {
    background: #f8fafc;
}

.list-item:last-child[b-w98m8bxe2q] {
    border-bottom: none;
}

.list-cell[b-w98m8bxe2q] {
    display: flex;
    align-items: center;
    padding-right: 16px;
}

/* Hazard Cell */
.hazard-cell[b-w98m8bxe2q] {
    flex-direction: column;
    align-items: flex-start;
}

.hazard-info[b-w98m8bxe2q] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.hazard-name[b-w98m8bxe2q] {
    color: #1e40af;
    font-size: 1rem;
    font-weight: 600;
    line-height: 1.4;
}

.hazard-update[b-w98m8bxe2q] {
    color: #64748b;
    font-size: 0.875rem;
    font-weight: 400;
}

/* Risk Level Badges */
.risk-badge[b-w98m8bxe2q] {
    display: inline-flex;
    align-items: center;
    padding: 6px 12px;
    border-radius: 16px;
    font-size: 0.875rem;
    font-weight: 500;
    text-transform: capitalize;
}

.risk-badge.high[b-w98m8bxe2q] {
    background: rgba(239, 68, 68, 0.1);
    color: #dc2626;
}

.risk-badge.medium[b-w98m8bxe2q] {
    background: rgba(245, 158, 11, 0.1);
    color: #d97706;
}

.risk-badge.low[b-w98m8bxe2q],
.risk-badge.very-low[b-w98m8bxe2q] {
    background: rgba(34, 197, 94, 0.1);
    color: #16a34a;
}

/* Owner Cell */
.owner-name[b-w98m8bxe2q] {
    color: #1e40af;
    font-weight: 600;
    font-size: 0.875rem;
}

/* Status Badges */
.status-badge[b-w98m8bxe2q] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 12px;
    border-radius: 16px;
    font-size: 0.875rem;
    font-weight: 500;
}

.status-badge i[b-w98m8bxe2q] {
    font-size: 0.75rem;
}

.status-badge.open[b-w98m8bxe2q] {
    background: rgba(6, 182, 212, 0.1);
    color: #0891b2;
}

.status-badge.reviewing[b-w98m8bxe2q] {
    background: rgba(99, 102, 241, 0.1);
    color: #6366f1;
}

.status-badge.active[b-w98m8bxe2q] {
    background: rgba(34, 197, 94, 0.1);
    color: #16a34a;
}

.status-badge.required[b-w98m8bxe2q] {
    background: rgba(239, 68, 68, 0.1);
    color: #dc2626;
}

/* Actions Cell */
.actions-cell[b-w98m8bxe2q] {
    justify-content: flex-end;
    gap: 8px;
}

.action-btn[b-w98m8bxe2q] {
    width: 32px;
    height: 32px;
    border-radius: 8px;
    border: 1px solid #e2e8f0;
    background: white;
    color: #64748b;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: all 0.2s ease;
}

.action-btn:hover[b-w98m8bxe2q] {
    background: #f8fafc;
    border-color: #cbd5e1;
    color: #475569;
}

.view-action-btn[b-w98m8bxe2q] {
    padding: 6px 12px !important;
    font-size: 0.875rem !important;
    border-radius: 6px !important;
}

/* Pagination */
.list-pagination[b-w98m8bxe2q] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 16px 20px;
    background: #f8fafc;
    border-top: 1px solid #e2e8f0;
}

.pagination-info[b-w98m8bxe2q] {
    color: #64748b;
    font-size: 0.875rem;
    font-weight: 500;
}

.pagination-controls[b-w98m8bxe2q] {
    display: flex;
    align-items: center;
    gap: 4px;
}

.page-btn[b-w98m8bxe2q] {
    width: 32px;
    height: 32px;
    border-radius: 6px;
    border: 1px solid #e2e8f0;
    background: white;
    color: #64748b;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: all 0.2s ease;
    font-size: 0.875rem;
    font-weight: 500;
}

.page-btn:hover:not(:disabled)[b-w98m8bxe2q] {
    background: #f8fafc;
    border-color: #cbd5e1;
}

.page-btn.active[b-w98m8bxe2q] {
    background: #1e40af;
    color: white;
    border-color: #1e40af;
}

.page-btn:disabled[b-w98m8bxe2q] {
    opacity: 0.5;
    cursor: not-allowed;
}

.create-action-btn[b-w98m8bxe2q] {
    padding: 8px 16px !important;
    font-size: 0.875rem !important;
    border-radius: 8px !important;
}

/* Responsive Design */
@media (max-width: 1024px) {
    .list-header[b-w98m8bxe2q],
    .list-item[b-w98m8bxe2q] {
        grid-template-columns: 2fr 1fr 1fr 1fr;
    }
    
    .owner-cell[b-w98m8bxe2q] {
        display: none;
    }
}

@media (max-width: 768px) {
    .list-header[b-w98m8bxe2q],
    .list-item[b-w98m8bxe2q] {
        grid-template-columns: 2fr 1fr 1fr;
    }
    
    .status-cell[b-w98m8bxe2q] {
        display: none;
    }
    
    .list-pagination[b-w98m8bxe2q] {
        flex-direction: column;
        gap: 16px;
        align-items: stretch;
    }
    
    .pagination-controls[b-w98m8bxe2q] {
        justify-content: center;
    }
}

@media (max-width: 640px) {
    .list-header[b-w98m8bxe2q],
    .list-item[b-w98m8bxe2q] {
        grid-template-columns: 1fr;
        gap: 8px;
    }
    
    .list-item[b-w98m8bxe2q] {
        padding: 16px;
    }
    
    .list-cell[b-w98m8bxe2q] {
        padding-right: 0;
    }
    
    .hazard-cell[b-w98m8bxe2q],
    .risk-cell[b-w98m8bxe2q],
    .actions-cell[b-w98m8bxe2q] {
        display: flex;
    }
    
    .owner-cell[b-w98m8bxe2q],
    .status-cell[b-w98m8bxe2q] {
        display: none;
    }
    
    .actions-cell[b-w98m8bxe2q] {
        justify-content: flex-start;
        margin-top: 8px;
    }
}

/* Dashboard Footer */
.dashboard-footer[b-w98m8bxe2q] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 24px;
    margin: 20px;
    background: white;
    border-radius: 16px;
    box-shadow: 0 4px 16px rgba(20, 33, 61, 0.08);
    border: 1px solid rgba(226, 230, 234, 0.3);
}

.total-count[b-w98m8bxe2q] {
    color: #14213D;
    font-weight: 600;
    font-size: 1rem;
}

/* Responsive Design */
@media (max-width: 1024px) {
    .chart-row[b-w98m8bxe2q],
    .chart-row:first-child[b-w98m8bxe2q],
    .chart-row:nth-child(2)[b-w98m8bxe2q] {
        grid-template-columns: 1fr;
        gap: 20px;
    }
    
    .chart-row:first-child .heatmap-card[b-w98m8bxe2q] {
        grid-column: 1;
    }
    
    .charts-container[b-w98m8bxe2q] {
        padding: 16px;
    }
}

@media (max-width: 768px) {
    .charts-view[b-w98m8bxe2q] {
        padding: 16px;
    }
    
    .charts-container[b-w98m8bxe2q] {
        gap: 16px;
    }
    
    .dashboard-footer[b-w98m8bxe2q] {
        flex-direction: column;
        gap: 16px;
        text-align: center;
    }
    
    .dashboard-footer .create-hazard[b-w98m8bxe2q] {
        width: 100%;
    }
}

@media (max-width: 480px) {
    .charts-view[b-w98m8bxe2q] {
        padding: 12px;
    }
    
    .dashboard-footer[b-w98m8bxe2q] {
        margin: 12px;
        padding: 20px;
    }
}

/* Upgrade Prompt Styling */
.upgrade-card[b-w98m8bxe2q] {
    background: linear-gradient(135deg, #f8fafc 0%, #e2e8f0 100%);
    border: 2px dashed #cbd5e1;
    min-height: 320px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.upgrade-prompt[b-w98m8bxe2q] {
    text-align: center;
    padding: 40px;
    max-width: 400px;
    background: white;
    border-radius: 12px;
    box-shadow: 0 4px 16px rgba(20, 33, 61, 0.08);
    border: 1px solid #e2e8f0;
}

.upgrade-icon[b-w98m8bxe2q] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 80px;
    height: 80px;
    border-radius: 50%;
    background: linear-gradient(135deg, #14213D 0%, #2563eb 100%);
    color: white;
    font-size: 2rem;
    margin: 0 auto 24px;
    box-shadow: 0 8px 24px rgba(20, 33, 61, 0.15);
}

.upgrade-prompt h4[b-w98m8bxe2q] {
    color: #14213D;
    font-size: 1.5rem;
    font-weight: 700;
    margin-bottom: 12px;
    line-height: 1.3;
}

.upgrade-prompt p[b-w98m8bxe2q] {
    color: #64748b;
    font-size: 1rem;
    line-height: 1.6;
    margin-bottom: 24px;
}

.upgrade-features[b-w98m8bxe2q] {
    margin-bottom: 32px;
}

.upgrade-features ul[b-w98m8bxe2q] {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.upgrade-features li[b-w98m8bxe2q] {
    display: flex;
    align-items: center;
    gap: 12px;
    color: #475569;
    font-size: 0.95rem;
    font-weight: 500;
}

.upgrade-features li i[b-w98m8bxe2q] {
    color: #C8A951;
    font-size: 1rem;
    width: 16px;
    flex-shrink: 0;
}

.upgrade-btn[b-w98m8bxe2q] {
    background: linear-gradient(135deg, #C8A951 0%, #d4af37 100%) !important;
    border: none !important;
    color: white !important;
    padding: 12px 24px !important;
    font-size: 1rem !important;
    font-weight: 600 !important;
    border-radius: 8px !important;
    box-shadow: 0 4px 16px rgba(200, 169, 81, 0.25) !important;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
}

.upgrade-btn:hover[b-w98m8bxe2q] {
    transform: translateY(-2px) !important;
    box-shadow: 0 8px 24px rgba(200, 169, 81, 0.35) !important;
    background: linear-gradient(135deg, #d4af37 0%, #C8A951 100%) !important;
}

.upgrade-btn:active[b-w98m8bxe2q] {
    transform: translateY(0) !important;
    box-shadow: 0 4px 16px rgba(200, 169, 81, 0.25) !important;
}

/* Responsive Design for Upgrade Prompt */
@media (max-width: 768px) {
    .upgrade-prompt[b-w98m8bxe2q] {
        padding: 30px 20px;
    }
    
    .upgrade-icon[b-w98m8bxe2q] {
        width: 60px;
        height: 60px;
        font-size: 1.5rem;
        margin-bottom: 20px;
    }
    
    .upgrade-prompt h4[b-w98m8bxe2q] {
        font-size: 1.25rem;
    }
    
    .upgrade-prompt p[b-w98m8bxe2q] {
        font-size: 0.9rem;
    }
}
/* /Features/Dashboard/Components/DashboardSummaryCard.razor.rz.scp.css */
.dashboard-summary-card[b-muce73fyzn] {
    background: white;
    border-radius: 12px;
    padding: 24px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
    border: 1px solid #E2E6EA;
    cursor: pointer;
    transition: all 0.3s ease;
    position: relative;
    min-height: 180px;
    display: flex;
    flex-direction: column;
}

.dashboard-summary-card:hover[b-muce73fyzn] {
    transform: translateY(-2px);
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12);
}

.dashboard-summary-card[b-muce73fyzn]::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 4px;
    border-radius: 12px 12px 0 0;
    background: linear-gradient(135deg, #C8A951 0%, #14213D 100%);
}

.dashboard-summary-card.psychosocial[b-muce73fyzn]::before {
    background: linear-gradient(135deg, #DC143C 0%, #FF4500 100%);
}

.dashboard-summary-card.stress[b-muce73fyzn]::before {
    background: linear-gradient(135deg, #FF8C00 0%, #FFD700 100%);
}

.dashboard-summary-card.high-risk[b-muce73fyzn]::before {
    background: linear-gradient(135deg, #8B0000 0%, #DC143C 100%);
}

.dashboard-summary-card.pending-actions[b-muce73fyzn]::before {
    background: linear-gradient(135deg, #C8A951 0%, #DAA520 100%);
}

.card-header[b-muce73fyzn] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 16px;
}

.card-title[b-muce73fyzn] {
    font-size: 14px;
    font-weight: 600;
    color: #14213D;
    line-height: 1.4;
    flex: 1;
    margin-right: 12px;
}

.card-icon[b-muce73fyzn] {
    width: 40px;
    height: 40px;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(200, 169, 81, 0.1);
    flex-shrink: 0;
}

.card-icon i[b-muce73fyzn] {
    font-size: 18px;
    color: #C8A951;
}

.dashboard-summary-card.psychosocial .card-icon[b-muce73fyzn] {
    background: rgba(220, 20, 60, 0.1);
}

.dashboard-summary-card.psychosocial .card-icon i[b-muce73fyzn] {
    color: #DC143C;
}

.dashboard-summary-card.stress .card-icon[b-muce73fyzn] {
    background: rgba(255, 140, 0, 0.1);
}

.dashboard-summary-card.stress .card-icon i[b-muce73fyzn] {
    color: #FF8C00;
}

.dashboard-summary-card.high-risk .card-icon[b-muce73fyzn] {
    background: rgba(220, 20, 60, 0.1);
}

.dashboard-summary-card.high-risk .card-icon i[b-muce73fyzn] {
    color: #DC143C;
}

.card-value-container[b-muce73fyzn] {
    flex: 1;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    margin: 16px 0;
}

.card-value[b-muce73fyzn] {
    font-size: 36px;
    font-weight: 700;
    line-height: 1;
    margin-bottom: 8px;
}

.card-trend[b-muce73fyzn] {
    font-size: 12px;
    font-weight: 500;
    display: flex;
    align-items: center;
    gap: 4px;
}

.card-trend.trend-up[b-muce73fyzn] {
    color: #DC143C;
}

.card-trend.trend-down[b-muce73fyzn] {
    color: #228B22;
}

.card-trend.trend-neutral[b-muce73fyzn] {
    color: #6c757d;
}

.card-gauge-container[b-muce73fyzn] {
    flex: 1;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 16px 0;
}

.card-subtitle[b-muce73fyzn] {
    font-size: 12px;
    color: #6c757d;
    text-align: center;
    margin-top: 8px;
}

.card-breakdown[b-muce73fyzn] {
    margin-top: 12px;
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.breakdown-item[b-muce73fyzn] {
    display: flex;
    align-items: center;
    gap: 8px;
}

.breakdown-dot[b-muce73fyzn] {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    flex-shrink: 0;
}

.breakdown-dot.overdue[b-muce73fyzn] {
    background-color: #DC143C;
}

.breakdown-dot.in-progress[b-muce73fyzn] {
    background-color: #007bff;
}

.breakdown-dot.completed[b-muce73fyzn] {
    background-color: #228B22;
}

.breakdown-text[b-muce73fyzn] {
    font-size: 11px;
    color: #6c757d;
}

@media (max-width: 768px) {
    .dashboard-summary-card[b-muce73fyzn] {
        padding: 16px;
        min-height: 160px;
    }
    
    .card-value[b-muce73fyzn] {
        font-size: 28px;
    }
    
    .card-title[b-muce73fyzn] {
        font-size: 13px;
    }
}
/* /Features/Dashboard/Components/DomainCard.razor.rz.scp.css */
.domain-card-wrapper[b-6vwze15ez6] {
    margin-bottom: 1.5rem;
}

[b-6vwze15ez6] .domain-card {
    border-radius: 16px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
    border: 1px solid #E2E6EA;
    transition: all 0.3s ease;
    overflow: hidden;
}

[b-6vwze15ez6] .domain-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.15);
}

[b-6vwze15ez6] .domain-card.locked {
    opacity: 0.8;
    border: 2px dashed #C8A951;
    background: linear-gradient(135deg, #fff 0%, #BFD8B8 100%);
}

/* Risk Level Styling */
[b-6vwze15ez6] .domain-card.critical-risk {
    border-left: 6px solid #dc3545;
}

[b-6vwze15ez6] .domain-card.high-risk {
    border-left: 6px solid #fd7e14;
}

[b-6vwze15ez6] .domain-card.medium-risk {
    border-left: 6px solid #ffc107;
}

[b-6vwze15ez6] .domain-card.low-risk {
    border-left: 6px solid #198754;
}

/* Domain Header */
.domain-header[b-6vwze15ez6] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    width: 100%;
}

.domain-title-section[b-6vwze15ez6] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.domain-name[b-6vwze15ez6] {
    color: #14213D;
    font-size: 1.25rem;
    font-weight: 700;
    margin: 0;
}

.domain-tier-badge[b-6vwze15ez6] {
    display: inline-block;
    padding: 0.25rem 0.75rem;
    border-radius: 12px;
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.tier-free[b-6vwze15ez6] {
    background: #6c757d;
    color: white;
}

.tier-bronze[b-6vwze15ez6] {
    background: #cd7f32;
    color: white;
}

.tier-silver[b-6vwze15ez6] {
    background: #c0c0c0;
    color: #14213D;
}

.tier-gold[b-6vwze15ez6] {
    background: #C8A951;
    color: #14213D;
}

.domain-status[b-6vwze15ez6] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.status-indicator[b-6vwze15ez6] {
    width: 12px;
    height: 12px;
    border-radius: 50%;
    flex-shrink: 0;
}

.status-active[b-6vwze15ez6] {
    background: #198754;
    box-shadow: 0 0 0 2px rgba(25, 135, 84, 0.3);
}

.status-inactive[b-6vwze15ez6] {
    background: #6c757d;
}

.status-pending[b-6vwze15ez6] {
    background: #ffc107;
    animation: pulse-b-6vwze15ez6 2s infinite;
}

.status-error[b-6vwze15ez6] {
    background: #dc3545;
    animation: pulse-b-6vwze15ez6 2s infinite;
}

.status-text[b-6vwze15ez6] {
    font-size: 0.875rem;
    color: #2E2E2E;
    font-weight: 500;
}

@keyframes pulse-b-6vwze15ez6 {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.5; }
}

/* Domain Content */
.domain-content[b-6vwze15ez6] {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

.domain-description[b-6vwze15ez6] {
    color: #2E2E2E;
    font-size: 0.95rem;
    line-height: 1.5;
    margin: 0;
}

.domain-metrics[b-6vwze15ez6] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.metric-row[b-6vwze15ez6] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1rem;
}

.metric-item[b-6vwze15ez6] {
    text-align: center;
    padding: 0.75rem;
    background: rgba(191, 216, 184, 0.1);
    border-radius: 8px;
    border: 1px solid rgba(200, 169, 81, 0.2);
}

.metric-value[b-6vwze15ez6] {
    font-size: 1.25rem;
    font-weight: 700;
    color: #14213D;
    margin-bottom: 0.25rem;
}

.metric-value.risk-critical[b-6vwze15ez6] {
    color: #dc3545;
}

.metric-value.risk-high[b-6vwze15ez6] {
    color: #fd7e14;
}

.metric-value.risk-medium[b-6vwze15ez6] {
    color: #ffc107;
}

.metric-value.risk-low[b-6vwze15ez6] {
    color: #198754;
}

.metric-label[b-6vwze15ez6] {
    font-size: 0.75rem;
    color: #2E2E2E;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

/* Detailed Metrics */
.detailed-metrics[b-6vwze15ez6] {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 1.5rem;
    align-items: center;
    margin-top: 1rem;
    padding-top: 1rem;
    border-top: 1px solid #E2E6EA;
}

.progress-section[b-6vwze15ez6] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.5rem;
}

.progress-label[b-6vwze15ez6] {
    font-size: 0.75rem;
    font-weight: 600;
    color: #14213D;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.progress-text[b-6vwze15ez6] {
    font-size: 0.875rem;
    color: #2E2E2E;
    font-weight: 500;
}

.hazard-summary[b-6vwze15ez6] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.hazard-counts[b-6vwze15ez6] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0.5rem;
}

.hazard-count[b-6vwze15ez6] {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 0.5rem;
    border-radius: 8px;
    border: 1px solid;
}

.hazard-count.critical[b-6vwze15ez6] {
    background: rgba(220, 53, 69, 0.1);
    border-color: #dc3545;
}

.hazard-count.high[b-6vwze15ez6] {
    background: rgba(253, 126, 20, 0.1);
    border-color: #fd7e14;
}

.hazard-count.medium[b-6vwze15ez6] {
    background: rgba(255, 193, 7, 0.1);
    border-color: #ffc107;
}

.hazard-count.low[b-6vwze15ez6] {
    background: rgba(25, 135, 84, 0.1);
    border-color: #198754;
}

.hazard-count .count[b-6vwze15ez6] {
    font-size: 1.5rem;
    font-weight: 700;
    color: #14213D;
}

.hazard-count .label[b-6vwze15ez6] {
    font-size: 0.625rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: #2E2E2E;
}

/* Domain Insights */
.domain-insights h4[b-6vwze15ez6] {
    color: #14213D;
    font-size: 1rem;
    font-weight: 600;
    margin: 0 0 0.75rem 0;
}

.insights-list[b-6vwze15ez6] {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.insight-item[b-6vwze15ez6] {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
    padding: 0.75rem;
    background: rgba(191, 216, 184, 0.1);
    border-radius: 8px;
    border-left: 3px solid #C8A951;
}

.insight-icon[b-6vwze15ez6] {
    color: #C8A951;
    margin-top: 0.125rem;
    flex-shrink: 0;
}

.insight-item span[b-6vwze15ez6] {
    color: #2E2E2E;
    font-size: 0.875rem;
    line-height: 1.4;
}

/* Upgrade Section */
.upgrade-section[b-6vwze15ez6] {
    padding: 1.5rem;
    background: linear-gradient(135deg, #BFD8B8 0%, #E2E6EA 100%);
    border-radius: 12px;
    border: 2px solid #C8A951;
    text-align: center;
}

.upgrade-content[b-6vwze15ez6] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.75rem;
}

.upgrade-icon[b-6vwze15ez6] {
    font-size: 2rem;
    color: #C8A951;
}

.upgrade-content h4[b-6vwze15ez6] {
    color: #14213D;
    font-size: 1.1rem;
    font-weight: 600;
    margin: 0;
}

.upgrade-content p[b-6vwze15ez6] {
    color: #2E2E2E;
    font-size: 0.95rem;
    margin: 0;
    line-height: 1.4;
}

/* Domain Actions */
.domain-actions[b-6vwze15ez6] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 0.75rem;
    flex-wrap: wrap;
}

.card-toggle[b-6vwze15ez6] {
    margin-left: auto;
}

.toggle-btn[b-6vwze15ez6] {
    min-width: 40px;
}

/* Responsive Design */
@media (max-width: 768px) {
    .domain-header[b-6vwze15ez6] {
        flex-direction: column;
        gap: 1rem;
        align-items: flex-start;
    }
    
    .metric-row[b-6vwze15ez6] {
        grid-template-columns: 1fr;
        gap: 0.75rem;
    }
    
    .detailed-metrics[b-6vwze15ez6] {
        grid-template-columns: 1fr;
        gap: 1rem;
    }
    
    .hazard-counts[b-6vwze15ez6] {
        grid-template-columns: repeat(2, 1fr);
    }
    
    .domain-actions[b-6vwze15ez6] {
        flex-direction: column;
        align-items: stretch;
    }
    
    .card-toggle[b-6vwze15ez6] {
        margin-left: 0;
        align-self: center;
    }
}

@media (max-width: 480px) {
    .domain-tier-badge[b-6vwze15ez6] {
        align-self: flex-start;
    }
    
    .metric-item[b-6vwze15ez6] {
        padding: 0.5rem;
    }
    
    .hazard-counts[b-6vwze15ez6] {
        grid-template-columns: 1fr;
    }
    
    .insight-item[b-6vwze15ez6] {
        flex-direction: column;
        text-align: center;
    }
    
    .upgrade-section[b-6vwze15ez6] {
        padding: 1rem;
    }
}

/* Animation Effects */
.domain-card-wrapper[b-6vwze15ez6] {
    animation: fadeInUp-b-6vwze15ez6 0.6s ease-out;
}

@keyframes fadeInUp-b-6vwze15ez6 {
    from {
        opacity: 0;
        transform: translateY(20px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Accessibility */
.domain-actions .iswara-button:focus[b-6vwze15ez6] {
    outline: 2px solid #C8A951;
    outline-offset: 2px;
}

.insight-item:focus-within[b-6vwze15ez6] {
    outline: 2px solid #C8A951;
    outline-offset: 2px;
}
/* /Features/Dashboard/Components/HazardCard.razor.rz.scp.css */
/* Individual Hazard Card Styling */
.hazard-card[b-i0uxr2trby] {
    background: white !important;
    border-radius: 12px !important;
    box-shadow: 0 2px 8px rgba(20, 33, 61, 0.06) !important;
    border: 1px solid rgba(226, 230, 234, 0.3) !important;
    transition: all 0.3s ease !important;
    overflow: hidden !important;
    height: 100% !important;
    display: flex !important;
    flex-direction: column !important;
}

.hazard-card:hover[b-i0uxr2trby] {
    transform: translateY(-2px);
    box-shadow: 0 8px 24px rgba(20, 33, 61, 0.12) !important;
    border-color: rgba(200, 169, 81, 0.3) !important;
}

/* Risk Level Styling */
.hazard-card.high[b-i0uxr2trby] {
    border-left: 4px solid #ef4444 !important;
}

.hazard-card.medium[b-i0uxr2trby] {
    border-left: 4px solid #f59e0b !important;
}

.hazard-card.low[b-i0uxr2trby],
.hazard-card.very-low[b-i0uxr2trby] {
    border-left: 4px solid #10b981 !important;
}

/* Card Header */
.hazard-card-header[b-i0uxr2trby] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 12px;
    padding: 0;
    margin: 0;
}

.hazard-name[b-i0uxr2trby] {
    color: #14213D;
    font-size: 1.125rem;
    font-weight: 600;
    line-height: 1.4;
    flex: 1;
    margin: 0;
}

.risk-level[b-i0uxr2trby] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 12px;
    border-radius: 20px;
    font-size: 0.875rem;
    font-weight: 500;
    white-space: nowrap;
    flex-shrink: 0;
}

.risk-level .dot[b-i0uxr2trby] {
    width: 8px;
    height: 8px;
    border-radius: 50%;
}

.risk-level.high[b-i0uxr2trby] {
    background: rgba(239, 68, 68, 0.1);
    color: #dc2626;
}

.risk-level.high .dot[b-i0uxr2trby] {
    background: #ef4444;
}

.risk-level.medium[b-i0uxr2trby] {
    background: rgba(245, 158, 11, 0.1);
    color: #d97706;
}

.risk-level.medium .dot[b-i0uxr2trby] {
    background: #f59e0b;
}

.risk-level.low[b-i0uxr2trby],
.risk-level.very-low[b-i0uxr2trby] {
    background: rgba(16, 185, 129, 0.1);
    color: #059669;
}

.risk-level.low .dot[b-i0uxr2trby],
.risk-level.very-low .dot[b-i0uxr2trby] {
    background: #10b981;
}

/* Card Body */
.hazard-card-body[b-i0uxr2trby] {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: 0;
}

.hazard-info-item[b-i0uxr2trby] {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    min-height: 24px;
}

.hazard-info-label[b-i0uxr2trby] {
    color: #717188;
    font-size: 0.875rem;
    font-weight: 500;
    flex: 0 0 80px;
    text-align: right;
}

.hazard-info-value[b-i0uxr2trby] {
    color: #14213D;
    font-size: 0.875rem;
    font-weight: 500;
    flex: 1;
    line-height: 1.4;
}

.hazard-info-value.owner-name[b-i0uxr2trby] {
    color: #3b82f6;
    font-weight: 600;
}

.hazard-info-value.description[b-i0uxr2trby] {
    color: #64748b;
    font-style: italic;
    line-height: 1.5;
}

/* Status Tags */
.status-tag[b-i0uxr2trby] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 12px;
    border-radius: 20px;
    font-size: 0.875rem;
    font-weight: 500;
    white-space: nowrap;
}

.status-tag i[b-i0uxr2trby] {
    font-size: 0.75rem;
}

.status-tag.active[b-i0uxr2trby] {
    background: rgba(16, 185, 129, 0.1);
    color: #059669;
}

.status-tag.reviewing[b-i0uxr2trby] {
    background: rgba(59, 130, 246, 0.1);
    color: #2563eb;
}

.status-tag.required[b-i0uxr2trby] {
    background: rgba(239, 68, 68, 0.1);
    color: #dc2626;
}

.status-tag.open[b-i0uxr2trby] {
    background: rgba(245, 158, 11, 0.1);
    color: #d97706;
}

/* Card Footer */
.hazard-card-footer[b-i0uxr2trby] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    padding: 0;
    margin-top: auto;
}

.next-review[b-i0uxr2trby] {
    color: #717188;
    font-size: 0.875rem;
    font-weight: 500;
}

.view-btn[b-i0uxr2trby] {
    padding: 8px 16px !important;
    font-size: 0.875rem !important;
    border-radius: 8px !important;
    border: 1px solid #e2e8f0 !important;
    background: white !important;
    color: #14213D !important;
    transition: all 0.2s ease !important;
    flex-shrink: 0;
}

.view-btn:hover[b-i0uxr2trby] {
    background: #f8fafc !important;
    border-color: #C8A951 !important;
    color: #14213D !important;
}

/* Responsive Design */
@media (max-width: 768px) {
    .hazard-card-header[b-i0uxr2trby] {
        flex-direction: column;
        align-items: flex-start;
        gap: 8px;
    }
    
    .hazard-info-item[b-i0uxr2trby] {
        flex-direction: column;
        gap: 4px;
    }
    
    .hazard-info-label[b-i0uxr2trby] {
        flex: none;
        text-align: left;
        font-weight: 600;
    }
    
    .hazard-card-footer[b-i0uxr2trby] {
        flex-direction: column;
        gap: 12px;
        align-items: stretch;
    }
    
    .view-btn[b-i0uxr2trby] {
        width: 100% !important;
        justify-content: center !important;
    }
}
/* /Features/Dashboard/Components/HazardCardsGrid.razor.rz.scp.css */
/* Hazard Cards Grid Layout */
.card-view-container[b-w3mlv7afwj] {
    padding: 20px;
}

.hazard-cards-container[b-w3mlv7afwj] {
    display: flex;
    flex-direction: column;
    gap: 32px;
}

.domain-section[b-w3mlv7afwj] {
    background: white;
    border-radius: 16px;
    box-shadow: 0 4px 16px rgba(20, 33, 61, 0.08);
    border: 1px solid rgba(226, 230, 234, 0.3);
    overflow: hidden;
}

.domain-title[b-w3mlv7afwj] {
    background: linear-gradient(135deg, #14213D 0%, #2E2E2E 100%);
    color: white;
    font-size: 1.25rem;
    font-weight: 600;
    padding: 20px 24px;
    margin: 0;
    border-bottom: 1px solid rgba(226, 230, 234, 0.2);
    letter-spacing: 0.5px;
}

.domain-cards[b-w3mlv7afwj] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(350px, 1fr));
    gap: 24px;
    padding: 24px;
}

/* Empty State */
.no-hazards-message[b-w3mlv7afwj] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 60px 20px;
    text-align: center;
    background: white;
    border-radius: 16px;
    box-shadow: 0 4px 16px rgba(20, 33, 61, 0.08);
    border: 1px solid rgba(226, 230, 234, 0.3);
    margin: 20px;
}

.no-hazards-message i[b-w3mlv7afwj] {
    font-size: 3rem;
    color: #717188;
    margin-bottom: 16px;
}

.no-hazards-message p[b-w3mlv7afwj] {
    color: #717188;
    font-size: 1.1rem;
    font-weight: 500;
    max-width: 400px;
    line-height: 1.5;
    margin: 0;
}

/* Responsive Design */
@media (max-width: 1024px) {
    .domain-cards[b-w3mlv7afwj] {
        grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
        gap: 20px;
        padding: 20px;
    }
}

@media (max-width: 768px) {
    .card-view-container[b-w3mlv7afwj] {
        padding: 16px;
    }
    
    .hazard-cards-container[b-w3mlv7afwj] {
        gap: 24px;
    }
    
    .domain-cards[b-w3mlv7afwj] {
        grid-template-columns: 1fr;
        gap: 16px;
        padding: 16px;
    }
    
    .domain-title[b-w3mlv7afwj] {
        font-size: 1.125rem;
        padding: 16px 20px;
    }
}

@media (max-width: 480px) {
    .card-view-container[b-w3mlv7afwj] {
        padding: 12px;
    }
    
    .no-hazards-message[b-w3mlv7afwj] {
        margin: 12px;
        padding: 40px 16px;
    }
}
/* /Features/Dashboard/Components/HazardRiskDistribution.razor.rz.scp.css */
.hazard-risk-distribution-container[b-6v0gowp46z] {
    margin-bottom: 32px;
}

.loading-state[b-6v0gowp46z] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 60px 20px;
    text-align: center;
    color: #2E2E2E;
}

.loading-spinner[b-6v0gowp46z] {
    width: 40px;
    height: 40px;
    border: 4px solid #E2E6EA;
    border-top: 4px solid #C8A951;
    border-radius: 50%;
    animation: spin-b-6v0gowp46z 1s linear infinite;
    margin-bottom: 16px;
}

@keyframes spin-b-6v0gowp46z {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

.error-state[b-6v0gowp46z] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 60px 20px;
    text-align: center;
    color: #dc3545;
    background: #fff5f5;
    border: 1px solid #fed7d7;
    border-radius: 8px;
}

.error-state i[b-6v0gowp46z] {
    font-size: 48px;
    margin-bottom: 16px;
    opacity: 0.7;
}

.retry-btn[b-6v0gowp46z] {
    margin-top: 16px;
    padding: 8px 16px;
    background: #dc3545;
    color: white;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    font-size: 14px;
    transition: background-color 0.2s;
}

.retry-btn:hover[b-6v0gowp46z] {
    background: #c82333;
}

.no-data-state[b-6v0gowp46z] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 80px 20px;
    text-align: center;
    color: #2E2E2E;
    background: #f8f9fa;
    border: 1px solid #E2E6EA;
    border-radius: 8px;
}

.no-data-state i[b-6v0gowp46z] {
    font-size: 64px;
    color: #C8A951;
    margin-bottom: 24px;
    opacity: 0.7;
}

.no-data-state h3[b-6v0gowp46z] {
    margin: 0 0 16px 0;
    color: #14213D;
    font-size: 24px;
    font-weight: 600;
}

.no-data-state p[b-6v0gowp46z] {
    margin: 0;
    font-size: 16px;
    opacity: 0.8;
}

.chart-insights[b-6v0gowp46z] {
    margin-top: 32px;
    padding: 24px;
    background: #f8f9fa;
    border-radius: 8px;
    border: 1px solid #E2E6EA;
}

.insights-grid[b-6v0gowp46z] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 20px;
}

.insight-card[b-6v0gowp46z] {
    display: flex;
    align-items: flex-start;
    padding: 20px;
    background: white;
    border-radius: 8px;
    border: 1px solid #E2E6EA;
    box-shadow: 0 2px 4px rgba(20, 33, 61, 0.05);
    transition: transform 0.2s, box-shadow 0.2s;
}

.insight-card:hover[b-6v0gowp46z] {
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(20, 33, 61, 0.1);
}

.insight-icon[b-6v0gowp46z] {
    margin-right: 16px;
    flex-shrink: 0;
}

.insight-icon i[b-6v0gowp46z] {
    font-size: 24px;
    color: #C8A951;
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(200, 169, 81, 0.1);
    border-radius: 8px;
}

.insight-content h4[b-6v0gowp46z] {
    margin: 0 0 8px 0;
    color: #14213D;
    font-size: 16px;
    font-weight: 600;
}

.insight-content p[b-6v0gowp46z] {
    margin: 0;
    color: #2E2E2E;
    font-size: 14px;
    line-height: 1.5;
}

/* Responsive design */
@media (max-width: 768px) {
    .insights-grid[b-6v0gowp46z] {
        grid-template-columns: 1fr;
        gap: 16px;
    }
    
    .insight-card[b-6v0gowp46z] {
        padding: 16px;
    }
    
    .chart-insights[b-6v0gowp46z] {
        padding: 20px;
        margin-top: 24px;
    }
    
    .no-data-state[b-6v0gowp46z] {
        padding: 60px 20px;
    }
    
    .no-data-state i[b-6v0gowp46z] {
        font-size: 48px;
    }
    
    .no-data-state h3[b-6v0gowp46z] {
        font-size: 20px;
    }
}
/* /Features/Dashboard/Components/QuestionRankingTable.razor.rz.scp.css */
/* Question Ranking Table Styling */

.question-ranking-section[b-rvybxz7kvn] {
    background: white;
    border-radius: 20px;
    padding: 32px;
    margin-bottom: 32px;
    box-shadow: 0 4px 20px rgba(20, 33, 61, 0.08);
    border: 1px solid #E2E6EA;
}

.section-header[b-rvybxz7kvn] {
    margin-bottom: 24px;
}

.section-header h4[b-rvybxz7kvn] {
    margin: 0;
    font-size: 1.5rem;
    font-weight: 600;
    color: #14213D;
}

/* Table Container */
.ranking-table-container[b-rvybxz7kvn] {
    overflow: hidden;
    border-radius: 12px;
    border: 1px solid #E2E6EA;
}

.table-responsive[b-rvybxz7kvn] {
    overflow-x: auto;
}

/* Table Styling */
.ranking-table[b-rvybxz7kvn] {
    width: 100%;
    border-collapse: collapse;
    background: white;
}

.ranking-table thead[b-rvybxz7kvn] {
    background: #F8FAFC;
}

.ranking-table th[b-rvybxz7kvn] {
    padding: 16px 20px;
    text-align: left;
    border-bottom: 1px solid #E2E6EA;
    font-weight: 600;
    color: #717188;
    font-size: 0.875rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.header-content[b-rvybxz7kvn] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    cursor: pointer;
    transition: color 0.3s ease;
}

.header-content:hover[b-rvybxz7kvn] {
    color: #14213D;
}

.header-content i[b-rvybxz7kvn] {
    font-size: 0.75rem;
    opacity: 0.6;
}

/* Column Widths */
.question-column[b-rvybxz7kvn] {
    width: 60%;
}

.difficulty-column[b-rvybxz7kvn] {
    width: 20%;
    text-align: center;
}

.score-column[b-rvybxz7kvn] {
    width: 20%;
    text-align: center;
}

/* Table Body */
.ranking-table tbody tr[b-rvybxz7kvn] {
    border-bottom: 1px solid #E2E6EA;
    transition: all 0.3s ease;
    cursor: pointer;
}

.ranking-table tbody tr:hover[b-rvybxz7kvn] {
    background: linear-gradient(135deg, rgba(191, 216, 184, 0.05) 0%, rgba(226, 230, 234, 0.05) 100%);
    transform: translateX(4px);
}

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

.ranking-table td[b-rvybxz7kvn] {
    padding: 20px;
    vertical-align: top;
}

/* Question Cell */
.question-content[b-rvybxz7kvn] {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.question-id[b-rvybxz7kvn] {
    font-weight: 700;
    color: #14213D;
    font-size: 0.875rem;
}

.question-text[b-rvybxz7kvn] {
    color: #2E2E2E;
    line-height: 1.5;
    font-size: 0.95rem;
}

/* Difficulty Cell */
.difficulty-cell[b-rvybxz7kvn] {
    text-align: center;
}

.difficulty-rank[b-rvybxz7kvn] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    background: #C8A951;
    color: white;
    border-radius: 8px;
    font-weight: 700;
    font-size: 1rem;
}

/* Score Cell */
.score-cell[b-rvybxz7kvn] {
    text-align: center;
}

.average-score[b-rvybxz7kvn] {
    font-weight: 700;
    font-size: 1.1rem;
    color: #14213D;
}

/* Show More Section */
.show-more-section[b-rvybxz7kvn] {
    padding: 16px 20px;
    border-top: 1px solid #E2E6EA;
    background: #F8FAFC;
    text-align: center;
}

.show-more-btn[b-rvybxz7kvn] {
    background: none;
    border: none;
    color: #4472C4;
    font-weight: 500;
    cursor: pointer;
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 0 auto;
    padding: 8px 16px;
    border-radius: 8px;
    transition: all 0.3s ease;
}

.show-more-btn:hover[b-rvybxz7kvn] {
    background: rgba(68, 114, 196, 0.1);
    color: #14213D;
}

.show-more-btn i[b-rvybxz7kvn] {
    font-size: 0.875rem;
}

/* Responsive Design */
@media (max-width: 768px) {
    .question-ranking-section[b-rvybxz7kvn] {
        padding: 20px;
        margin-bottom: 24px;
    }

    .ranking-table th[b-rvybxz7kvn],
    .ranking-table td[b-rvybxz7kvn] {
        padding: 12px 16px;
    }

    .question-column[b-rvybxz7kvn] {
        width: 50%;
    }

    .difficulty-column[b-rvybxz7kvn],
    .score-column[b-rvybxz7kvn] {
        width: 25%;
    }

    .question-text[b-rvybxz7kvn] {
        font-size: 0.875rem;
    }

    .difficulty-rank[b-rvybxz7kvn] {
        width: 28px;
        height: 28px;
        font-size: 0.9rem;
    }

    .average-score[b-rvybxz7kvn] {
        font-size: 1rem;
    }
}

@media (max-width: 480px) {
    .question-ranking-section[b-rvybxz7kvn] {
        padding: 16px;
    }

    .ranking-table th[b-rvybxz7kvn],
    .ranking-table td[b-rvybxz7kvn] {
        padding: 10px 12px;
    }

    .header-content span[b-rvybxz7kvn] {
        font-size: 0.75rem;
    }

    .question-id[b-rvybxz7kvn] {
        font-size: 0.75rem;
    }

    .question-text[b-rvybxz7kvn] {
        font-size: 0.8rem;
    }

    .difficulty-rank[b-rvybxz7kvn] {
        width: 24px;
        height: 24px;
        font-size: 0.8rem;
    }

    .average-score[b-rvybxz7kvn] {
        font-size: 0.9rem;
    }

    .show-more-btn[b-rvybxz7kvn] {
        font-size: 0.875rem;
        padding: 6px 12px;
    }
}
/* /Features/Dashboard/Components/ResponseDistributionChart.razor.rz.scp.css */
/* Response Distribution Chart Styling */

.response-distribution-card[b-5x6gr4p54o] {
    background: white;
    border-radius: 20px;
    padding: 32px;
    margin-bottom: 32px;
    box-shadow: 0 4px 20px rgba(20, 33, 61, 0.08);
    border: 1px solid #E2E6EA;
}

.card-header[b-5x6gr4p54o] {
    margin-bottom: 32px;
}

.question-info h4[b-5x6gr4p54o] {
    margin: 0 0 12px 0;
    font-size: 1.25rem;
    font-weight: 600;
    color: #14213D;
    line-height: 1.4;
}

.response-summary[b-5x6gr4p54o] {
    display: flex;
    gap: 16px;
    font-size: 0.875rem;
    color: #717188;
    font-weight: 500;
}

/* Chart Container */
.chart-container[b-5x6gr4p54o] {
    position: relative;
}

.horizontal-bar-chart[b-5x6gr4p54o] {
    display: flex;
    flex-direction: column;
    gap: 16px;
    margin-bottom: 24px;
}

/* Bar Row */
.bar-row[b-5x6gr4p54o] {
    display: grid;
    grid-template-columns: 120px 1fr;
    gap: 16px;
    align-items: center;
}

.bar-label[b-5x6gr4p54o] {
    text-align: right;
    padding-right: 8px;
}

.option-text[b-5x6gr4p54o] {
    font-size: 0.9rem;
    color: #14213D;
    font-weight: 500;
    line-height: 1.2;
}

/* Bar Container */
.bar-container[b-5x6gr4p54o] {
    position: relative;
}

.bar-background[b-5x6gr4p54o] {
    width: 100%;
    height: 32px;
    background: #F1F5F9;
    border-radius: 6px;
    overflow: hidden;
    position: relative;
}

.bar-fill[b-5x6gr4p54o] {
    height: 100%;
    border-radius: 6px;
    position: relative;
    transition: width 0.8s ease-out;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    padding-right: 8px;
    min-width: 0;
}

.bar-value[b-5x6gr4p54o] {
    color: white;
    font-size: 0.875rem;
    font-weight: 600;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
    white-space: nowrap;
}

/* Ensure text is visible on light bars */
.bar-fill[style*="#FFD700"] .bar-value[b-5x6gr4p54o],
.bar-fill[style*="#E2E6EA"] .bar-value[b-5x6gr4p54o] {
    color: #14213D;
    text-shadow: none;
}

/* Percentage Scale */
.percentage-scale[b-5x6gr4p54o] {
    margin-top: 16px;
    padding-left: 136px; /* Align with bars */
}

.scale-markers[b-5x6gr4p54o] {
    display: flex;
    justify-content: space-between;
    font-size: 0.75rem;
    color: #717188;
    position: relative;
}

.scale-markers[b-5x6gr4p54o]::before {
    content: '';
    position: absolute;
    top: -8px;
    left: 0;
    right: 0;
    height: 1px;
    background: linear-gradient(to right, 
        #E2E6EA 0%, #E2E6EA 10%, 
        transparent 10%, transparent 20%,
        #E2E6EA 20%, #E2E6EA 30%,
        transparent 30%, transparent 40%,
        #E2E6EA 40%, #E2E6EA 50%,
        transparent 50%, transparent 60%,
        #E2E6EA 60%, #E2E6EA 70%,
        transparent 70%, transparent 80%,
        #E2E6EA 80%, #E2E6EA 90%,
        transparent 90%, transparent 100%
    );
}

/* Responsive Design */
@media (max-width: 768px) {
    .response-distribution-card[b-5x6gr4p54o] {
        padding: 20px;
        margin-bottom: 24px;
    }

    .bar-row[b-5x6gr4p54o] {
        grid-template-columns: 100px 1fr;
        gap: 12px;
    }

    .option-text[b-5x6gr4p54o] {
        font-size: 0.85rem;
    }

    .bar-background[b-5x6gr4p54o] {
        height: 28px;
    }

    .bar-value[b-5x6gr4p54o] {
        font-size: 0.8rem;
        padding-right: 6px;
    }

    .response-summary[b-5x6gr4p54o] {
        flex-direction: column;
        gap: 8px;
    }

    .percentage-scale[b-5x6gr4p54o] {
        padding-left: 112px;
    }

    .scale-markers[b-5x6gr4p54o] {
        font-size: 0.7rem;
    }
}

@media (max-width: 480px) {
    .response-distribution-card[b-5x6gr4p54o] {
        padding: 16px;
    }

    .bar-row[b-5x6gr4p54o] {
        grid-template-columns: 1fr;
        gap: 8px;
    }

    .bar-label[b-5x6gr4p54o] {
        text-align: left;
        padding-right: 0;
        margin-bottom: 4px;
    }

    .option-text[b-5x6gr4p54o] {
        font-size: 0.8rem;
    }

    .bar-background[b-5x6gr4p54o] {
        height: 24px;
    }

    .bar-value[b-5x6gr4p54o] {
        font-size: 0.75rem;
        padding-right: 4px;
    }

    .percentage-scale[b-5x6gr4p54o] {
        padding-left: 0;
        margin-top: 12px;
    }

    .scale-markers[b-5x6gr4p54o] {
        justify-content: space-around;
    }

    .scale-markers span:nth-child(even)[b-5x6gr4p54o] {
        display: none; /* Hide every other marker on mobile */
    }

    .question-info h4[b-5x6gr4p54o] {
        font-size: 1.1rem;
    }
}
/* /Features/Dashboard/Components/SurveyAnalyticsSection.razor.rz.scp.css */
/* Survey Analytics Section Styling */

.survey-analytics-section[b-fe5glo9u6g] {
    width: 100%;
    max-width: 1400px;
    margin: 0 auto;
}

/* Loading State */
.loading-container[b-fe5glo9u6g] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    padding: 60px 20px;
    background: white;
    border-radius: 20px;
    border: 1px solid #E2E6EA;
    color: #717188;
    font-size: 1.1rem;
}

.loading-container i[b-fe5glo9u6g] {
    font-size: 1.5rem;
    color: #C8A951;
}

/* Error State */
.error-container[b-fe5glo9u6g] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    padding: 40px 20px;
    background: #FEF2F2;
    border-radius: 20px;
    border: 1px solid #FECACA;
    color: #DC2626;
    font-size: 1rem;
}

.error-container i[b-fe5glo9u6g] {
    font-size: 1.25rem;
}

/* No Data State */
.no-data-container[b-fe5glo9u6g] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 60px 20px;
    background: white;
    border-radius: 20px;
    border: 1px solid #E2E6EA;
    text-align: center;
}

.no-data-container i[b-fe5glo9u6g] {
    font-size: 3rem;
    color: #C8A951;
    margin-bottom: 20px;
}

.no-data-container h3[b-fe5glo9u6g] {
    margin: 0 0 12px 0;
    font-size: 1.5rem;
    font-weight: 600;
    color: #14213D;
}

.no-data-container p[b-fe5glo9u6g] {
    margin: 0;
    font-size: 1rem;
    color: #717188;
    line-height: 1.5;
    max-width: 400px;
}

/* Responsive Design */
@media (max-width: 768px) {
    .survey-analytics-section[b-fe5glo9u6g] {
        max-width: 100%;
        padding: 0 10px;
    }

    .loading-container[b-fe5glo9u6g],
    .error-container[b-fe5glo9u6g],
    .no-data-container[b-fe5glo9u6g] {
        padding: 40px 16px;
        margin: 0 10px;
    }

    .loading-container[b-fe5glo9u6g] {
        font-size: 1rem;
    }

    .loading-container i[b-fe5glo9u6g] {
        font-size: 1.25rem;
    }

    .no-data-container i[b-fe5glo9u6g] {
        font-size: 2.5rem;
        margin-bottom: 16px;
    }

    .no-data-container h3[b-fe5glo9u6g] {
        font-size: 1.25rem;
    }

    .no-data-container p[b-fe5glo9u6g] {
        font-size: 0.9rem;
    }
}

@media (max-width: 480px) {
    .survey-analytics-section[b-fe5glo9u6g] {
        padding: 0 5px;
    }

    .loading-container[b-fe5glo9u6g],
    .error-container[b-fe5glo9u6g],
    .no-data-container[b-fe5glo9u6g] {
        padding: 30px 12px;
        margin: 0 5px;
        border-radius: 16px;
    }

    .loading-container[b-fe5glo9u6g] {
        font-size: 0.95rem;
        gap: 8px;
    }

    .loading-container i[b-fe5glo9u6g] {
        font-size: 1.1rem;
    }

    .error-container[b-fe5glo9u6g] {
        font-size: 0.9rem;
        gap: 8px;
    }

    .error-container i[b-fe5glo9u6g] {
        font-size: 1.1rem;
    }

    .no-data-container i[b-fe5glo9u6g] {
        font-size: 2rem;
        margin-bottom: 12px;
    }

    .no-data-container h3[b-fe5glo9u6g] {
        font-size: 1.1rem;
        margin-bottom: 8px;
    }

    .no-data-container p[b-fe5glo9u6g] {
        font-size: 0.85rem;
    }
}
/* /Features/Dashboard/Components/SurveyScoreDistributionChart.razor.rz.scp.css */
/* Survey Score Distribution Chart Styling */

.score-distribution-card[b-6dw9zv0caq] {
    background: white;
    border-radius: 20px;
    padding: 32px;
    margin-bottom: 32px;
    box-shadow: 0 4px 20px rgba(20, 33, 61, 0.08);
    border: 1px solid #E2E6EA;
}

.card-header[b-6dw9zv0caq] {
    margin-bottom: 24px;
}

.card-header h3[b-6dw9zv0caq] {
    margin: 0;
    font-size: 1.5rem;
    font-weight: 600;
    color: #14213D;
}

/* Score Summary */
.score-summary[b-6dw9zv0caq] {
    text-align: center;
    margin-bottom: 40px;
    padding: 24px;
    background: linear-gradient(135deg, rgba(191, 216, 184, 0.1) 0%, rgba(226, 230, 234, 0.1) 100%);
    border-radius: 16px;
}

.score-label[b-6dw9zv0caq] {
    font-size: 0.875rem;
    font-weight: 600;
    color: #717188;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    display: block;
    margin-bottom: 8px;
}

.score-display[b-6dw9zv0caq] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
}

.percentage[b-6dw9zv0caq] {
    font-size: 2.5rem;
    font-weight: 700;
    color: #14213D;
}

.points[b-6dw9zv0caq] {
    font-size: 1.25rem;
    font-weight: 500;
    color: #717188;
}

/* Histogram */
.histogram-container[b-6dw9zv0caq] {
    position: relative;
}

.histogram[b-6dw9zv0caq] {
    display: flex;
    align-items: end;
    justify-content: space-between;
    height: 240px;
    padding: 20px 0;
    margin-bottom: 20px;
    position: relative;
}

.histogram-bar[b-6dw9zv0caq] {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    margin: 0 2px;
    position: relative;
}

.bar[b-6dw9zv0caq] {
    width: 100%;
    max-width: 60px;
    background: #E2E6EA;
    border-radius: 4px 4px 0 0;
    position: relative;
    transition: all 0.3s ease;
    cursor: pointer;
    min-height: 4px;
}

.bar.active[b-6dw9zv0caq] {
    background: linear-gradient(135deg, #4472C4 0%, #2E2E2E 100%);
}

.bar.active:hover[b-6dw9zv0caq] {
    background: linear-gradient(135deg, #C8A951 0%, #14213D 100%);
    transform: translateY(-2px);
}

.bar-value[b-6dw9zv0caq] {
    position: absolute;
    top: -24px;
    left: 50%;
    transform: translateX(-50%);
    font-size: 0.875rem;
    font-weight: 600;
    color: #14213D;
    white-space: nowrap;
}

.bar-label[b-6dw9zv0caq] {
    margin-top: 8px;
    font-size: 0.875rem;
    color: #717188;
    text-align: center;
    font-weight: 500;
}

/* Axis Labels */
.axis-labels[b-6dw9zv0caq] {
    display: flex;
    justify-content: space-between;
    align-items: end;
    margin-top: 16px;
}

.x-axis-label[b-6dw9zv0caq] {
    font-size: 0.875rem;
    color: #717188;
    font-weight: 500;
    text-align: center;
    flex: 1;
}

.y-axis-label[b-6dw9zv0caq] {
    writing-mode: vertical-lr;
    text-orientation: mixed;
    font-size: 0.875rem;
    color: #717188;
    font-weight: 500;
    position: absolute;
    left: -40px;
    top: 50%;
    transform: translateY(-50%) rotate(180deg);
}

/* Responsive Design */
@media (max-width: 768px) {
    .score-distribution-card[b-6dw9zv0caq] {
        padding: 20px;
        margin-bottom: 20px;
    }

    .score-summary[b-6dw9zv0caq] {
        padding: 16px;
        margin-bottom: 24px;
    }

    .percentage[b-6dw9zv0caq] {
        font-size: 2rem;
    }

    .points[b-6dw9zv0caq] {
        font-size: 1rem;
    }

    .histogram[b-6dw9zv0caq] {
        height: 180px;
        padding: 16px 0;
    }

    .bar[b-6dw9zv0caq] {
        max-width: 40px;
    }

    .bar-label[b-6dw9zv0caq] {
        font-size: 0.75rem;
    }

    .y-axis-label[b-6dw9zv0caq] {
        left: -30px;
        font-size: 0.75rem;
    }
}

@media (max-width: 480px) {
    .score-display[b-6dw9zv0caq] {
        flex-direction: column;
        gap: 8px;
    }

    .histogram[b-6dw9zv0caq] {
        margin: 0 -8px;
    }

    .bar[b-6dw9zv0caq] {
        max-width: 30px;
    }

    .bar-label[b-6dw9zv0caq] {
        font-size: 0.7rem;
        transform: rotate(-45deg);
        margin-top: 16px;
    }
}
/* /Features/Dashboard/Components/SurveyStatisticsCards.razor.rz.scp.css */
/* Survey Statistics Cards Styling */

.statistics-section[b-zv57peqbei] {
    background: #F8FAFC;
    border-radius: 16px;
    padding: 24px;
    margin-bottom: 32px;
    border: 1px solid #E2E6EA;
}

.statistics-section h4[b-zv57peqbei] {
    margin: 0 0 20px 0;
    font-size: 1rem;
    font-weight: 700;
    color: #14213D;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

/* Statistics Grid */
.statistics-grid[b-zv57peqbei] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
    margin-bottom: 24px;
}

.stat-item[b-zv57peqbei] {
    text-align: center;
    padding: 16px;
    background: white;
    border-radius: 12px;
    border: 1px solid #E2E6EA;
    transition: all 0.3s ease;
}

.stat-item:hover[b-zv57peqbei] {
    transform: translateY(-2px);
    box-shadow: 0 4px 16px rgba(20, 33, 61, 0.08);
}

.stat-item .stat-label[b-zv57peqbei] {
    display: block;
    font-size: 0.875rem;
    color: #717188;
    font-weight: 500;
    margin-bottom: 8px;
}

.stat-item .stat-value[b-zv57peqbei] {
    display: block;
    font-size: 1.5rem;
    font-weight: 700;
    color: #14213D;
}

/* Detailed Statistics */
.detailed-stats[b-zv57peqbei] {
    border-top: 1px solid #E2E6EA;
    padding-top: 20px;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.detailed-stat[b-zv57peqbei] {
    display: flex;
    align-items: center;
    gap: 8px;
}

.detailed-stat .stat-label[b-zv57peqbei] {
    font-size: 1rem;
    color: #14213D;
    font-weight: 500;
    min-width: 160px;
}

.detailed-stat .stat-value[b-zv57peqbei] {
    font-size: 1rem;
    font-weight: 600;
    color: #14213D;
}

.confidence-indicator[b-zv57peqbei] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 20px;
    height: 20px;
    background: #C8A951;
    color: white;
    border-radius: 50%;
    font-size: 0.75rem;
    font-weight: 700;
    margin-left: 8px;
    cursor: help;
    title: "Confidence Interval Indicator";
}

/* Responsive Design */
@media (max-width: 768px) {
    .statistics-section[b-zv57peqbei] {
        padding: 20px;
        margin-bottom: 24px;
    }

    .statistics-grid[b-zv57peqbei] {
        grid-template-columns: 1fr;
        gap: 16px;
        margin-bottom: 20px;
    }

    .stat-item[b-zv57peqbei] {
        padding: 12px;
    }

    .stat-item .stat-value[b-zv57peqbei] {
        font-size: 1.25rem;
    }

    .detailed-stat[b-zv57peqbei] {
        flex-direction: column;
        align-items: flex-start;
        gap: 4px;
    }

    .detailed-stat .stat-label[b-zv57peqbei] {
        min-width: auto;
        font-size: 0.875rem;
    }

    .detailed-stat .stat-value[b-zv57peqbei] {
        font-size: 0.875rem;
    }
}

@media (max-width: 480px) {
    .statistics-section[b-zv57peqbei] {
        padding: 16px;
    }

    .stat-item[b-zv57peqbei] {
        padding: 10px;
    }

    .stat-item .stat-label[b-zv57peqbei] {
        font-size: 0.75rem;
    }

    .stat-item .stat-value[b-zv57peqbei] {
        font-size: 1.1rem;
    }

    .detailed-stats[b-zv57peqbei] {
        padding-top: 16px;
        gap: 8px;
    }
}
/* /Features/Dashboard/Components/TopMetricCard.razor.rz.scp.css */
/* Top Metric Card Individual Styling */
.stat-card[b-1558sbjskm] {
    background: white !important;
    border-radius: 12px !important;
    box-shadow: 0 4px 16px rgba(20, 33, 61, 0.08) !important;
    border: 1px solid rgba(226, 230, 234, 0.3) !important;
    transition: all 0.3s ease !important;
    padding: 20px !important;
    height: auto !important;
    min-height: 120px !important;
}

.stat-card:hover[b-1558sbjskm] {
    transform: translateY(-2px);
    box-shadow: 0 8px 24px rgba(20, 33, 61, 0.12) !important;
    border-color: rgba(200, 169, 81, 0.3) !important;
}

.stat-content[b-1558sbjskm] {
    display: flex;
    flex-direction: column;
    height: 100%;
    padding: 0;
}

/* Reset any inherited IswaraCard padding */
.stat-card .card-content[b-1558sbjskm] {
    padding: 0 !important;
}

.stat-title[b-1558sbjskm] {
    color: #717188;
    font-size: 0.875rem;
    font-weight: 500;
    margin-bottom: 8px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    line-height: 1.2;
}

.stat-value[b-1558sbjskm] {
    color: #14213D;
    font-size: 1.75rem;
    font-weight: 700;
    margin-bottom: 4px;
    display: flex;
    align-items: center;
    gap: 8px;
    line-height: 1.1;
    flex-grow: 1;
}

.stat-value i[b-1558sbjskm] {
    font-size: 1.25rem;
    opacity: 0.8;
}

.stat-value.high[b-1558sbjskm] {
    color: #ef4444;
}

.stat-value.medium[b-1558sbjskm] {
    color: #f59e0b;
}

.stat-value.low[b-1558sbjskm] {
    color: #10b981;
}

.stat-trend[b-1558sbjskm] {
    font-size: 0.875rem;
    font-weight: 500;
    display: flex;
    align-items: center;
    gap: 4px;
    margin-top: auto;
    line-height: 1.2;
}

.stat-trend.trend-up[b-1558sbjskm] {
    color: #10b981;
}

.stat-trend.trend-down[b-1558sbjskm] {
    color: #ef4444;
}

.stat-trend.stable[b-1558sbjskm] {
    color: #717188;
}

.stat-trend.info[b-1558sbjskm] {
    color: #3b82f6;
}
/* /Features/Dashboard/Components/TopMetricsRow.razor.rz.scp.css */
/* Top Metrics Row Styling */
.dashboard-stats[b-1draba235n] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
    margin-bottom: 30px;
    padding: 20px;
}

.dashboard-stats.loading[b-1draba235n] {
    gap: 20px;
}

.stat-card-loading[b-1draba235n] {
    background: white;
    border-radius: 12px;
    padding: 24px;
    box-shadow: 0 4px 16px rgba(20, 33, 61, 0.08);
    border: 1px solid rgba(226, 230, 234, 0.3);
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 120px;
    color: #717188;
}

/* Override IswaraCard styling for stat cards */
.stat-card[b-1draba235n] {
    margin: 0 !important;
    width: 100% !important;
    flex: none !important;
}

.stat-content[b-1draba235n] {
    padding: 0;
}

.stat-title[b-1draba235n] {
    color: #717188;
    font-size: 0.875rem;
    font-weight: 500;
    margin-bottom: 8px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.stat-value[b-1draba235n] {
    color: #14213D;
    font-size: 1.75rem;
    font-weight: 700;
    margin-bottom: 4px;
    display: flex;
    align-items: center;
    gap: 8px;
}

.stat-value i[b-1draba235n] {
    font-size: 1.25rem;
    opacity: 0.8;
}

.stat-value.high[b-1draba235n] {
    color: #ef4444;
}

.stat-value.medium[b-1draba235n] {
    color: #f59e0b;
}

.stat-value.low[b-1draba235n] {
    color: #10b981;
}

.stat-trend[b-1draba235n] {
    font-size: 0.875rem;
    font-weight: 500;
    display: flex;
    align-items: center;
    gap: 4px;
}

.stat-trend.trend-up[b-1draba235n] {
    color: #10b981;
}

.stat-trend.trend-down[b-1draba235n] {
    color: #ef4444;
}

.stat-trend.stable[b-1draba235n] {
    color: #717188;
}

.stat-trend.info[b-1draba235n] {
    color: #3b82f6;
}

/* Responsive Design */
@media (max-width: 1024px) {
    .dashboard-stats[b-1draba235n] {
        grid-template-columns: repeat(2, 1fr);
        gap: 16px;
    }
}

@media (max-width: 640px) {
    .dashboard-stats[b-1draba235n] {
        grid-template-columns: 1fr;
        gap: 12px;
        padding: 16px;
    }
}
/* /Features/Dashboard/Components/ViewControlsBar.razor.rz.scp.css */
/* View Controls Bar Styling */
.analytics-section[b-onktj62c3i] {
    background: white;
    border-radius: 12px;
    box-shadow: 0 2px 8px rgba(20, 33, 61, 0.06);
    border: 1px solid rgba(226, 230, 234, 0.3);
    margin: 20px;
    overflow: hidden;
}

.view-options[b-onktj62c3i] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 16px 20px;
    background: white;
}

/* View Toggle Tabs */
.view-toggles[b-onktj62c3i] {
    display: flex;
    background: #f8fafc;
    border-radius: 8px;
    padding: 4px;
    border: 1px solid #e2e8f0;
}

.view-toggle[b-onktj62c3i] {
    padding: 10px 16px;
    cursor: pointer;
    border-radius: 6px;
    transition: all 0.2s ease;
    display: flex;
    align-items: center;
    gap: 8px;
    font-weight: 500;
    color: #64748b;
    font-size: 0.875rem;
    background: transparent;
    border: none;
    white-space: nowrap;
}

.view-toggle:hover[b-onktj62c3i] {
    background: #e2e8f0;
    color: #334155;
}

.view-toggle.active[b-onktj62c3i] {
    background: #14213D;
    color: white;
    box-shadow: 0 2px 4px rgba(20, 33, 61, 0.2);
}

.view-toggle i[b-onktj62c3i] {
    font-size: 0.875rem;
}

/* Filter Options */
.filter-options[b-onktj62c3i] {
    display: flex;
    gap: 12px;
    align-items: center;
}

.filter-btn[b-onktj62c3i] {
    padding: 8px 16px !important;
    font-size: 0.875rem !important;
    border-radius: 6px !important;
    border: 1px solid #e2e8f0 !important;
    background: white !important;
    color: #64748b !important;
    transition: all 0.2s ease !important;
}

.filter-btn:hover[b-onktj62c3i] {
    border-color: #C8A951 !important;
    color: #14213D !important;
}

.filter-btn.active[b-onktj62c3i] {
    background: #14213D !important;
    color: white !important;
    border-color: #14213D !important;
}

.filter-count[b-onktj62c3i] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 20px;
    height: 20px;
    background: #C8A951;
    color: white;
    border-radius: 50%;
    font-size: 0.75rem;
    font-weight: 600;
    margin-left: 6px;
}

/* Responsive Design */
@media (max-width: 768px) {
    .view-options[b-onktj62c3i] {
        flex-direction: column;
        gap: 16px;
        align-items: stretch;
    }
    
    .view-toggles[b-onktj62c3i] {
        width: 100%;
        justify-content: center;
    }
    
    .filter-options[b-onktj62c3i] {
        width: 100%;
        justify-content: center;
    }
}

@media (max-width: 640px) {
    .view-toggles[b-onktj62c3i] {
        flex-direction: column;
        gap: 4px;
    }
    
    .view-toggle[b-onktj62c3i] {
        width: 100%;
        justify-content: center;
        padding: 12px;
    }
    
    .filter-options[b-onktj62c3i] {
        flex-direction: column;
        gap: 8px;
    }
    
    .filter-btn[b-onktj62c3i] {
        width: 100% !important;
        justify-content: center !important;
    }
}
/* /Features/Dashboard/DashboardPage.razor.rz.scp.css */
/* Enhanced Dashboard Styling - Iswara Design System */

/* Global Responsive Foundation */
*[b-wztb0v4ggr] {
    box-sizing: border-box;
}

.dashboard-container *[b-wztb0v4ggr] {
    max-width: 100%;
    word-wrap: break-word;
}

/* Ensure all grid and flex containers are responsive */
.dashboard-container [class*="grid"][b-wztb0v4ggr],
.dashboard-container [class*="cards"][b-wztb0v4ggr],
.dashboard-container [class*="container"][b-wztb0v4ggr] {
    width: 100%;
    box-sizing: border-box;
}

/* Charts Grid Layout - 4 Rows */
.charts-grid-container[b-wztb0v4ggr] {
    display: grid;
    grid-template-columns: 1fr;
    grid-template-rows: auto auto auto auto;
    gap: 30px;
    margin-bottom: 40px;
}

.chart-item[b-wztb0v4ggr] {
    background: white;
    border-radius: 16px;
    padding: 24px;
    box-shadow: 0 4px 20px rgba(20, 33, 61, 0.08);
    border: 1px solid #E2E6EA;
    transition: all 0.3s ease;
}

.chart-item:hover[b-wztb0v4ggr] {
    transform: translateY(-2px);
    box-shadow: 0 8px 30px rgba(20, 33, 61, 0.12);
}

.chart-item.full-width[b-wztb0v4ggr] {
    grid-column: 1 / -1;
    min-height: 500px;
}

.chart-header[b-wztb0v4ggr] {
    margin-bottom: 20px;
    text-align: center;
}

.chart-header h3[b-wztb0v4ggr] {
    color: #14213D;
    font-size: 1.3rem;
    font-weight: 600;
    margin-bottom: 8px;
}

.chart-subtitle[b-wztb0v4ggr] {
    color: #6c757d;
    font-size: 0.9rem;
    font-weight: 400;
}

.chart-container[b-wztb0v4ggr] {
    height: 450px;
    position: relative;
    padding-bottom: 40px;
}

/* Chart Label and Tooltip Styling */
[b-wztb0v4ggr] .e-chart .e-axis-label {
    font-size: 10px !important;
    font-weight: 500 !important;
}

/* Chart Tooltip Styling */
[b-wztb0v4ggr] .e-tooltip-wrap {
    background: rgba(20, 33, 61, 0.95) !important;
    border: 1px solid #C8A951 !important;
    border-radius: 8px !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2) !important;
    padding: 12px 16px !important;
    font-size: 12px !important;
    font-weight: 500 !important;
    color: white !important;
    min-width: 200px !important;
    max-width: 350px !important;
    white-space: normal !important;
    word-wrap: break-word !important;
    z-index: 10000 !important;
}

/* Bar Chart specific tooltip */
[b-wztb0v4ggr] .e-chart .e-tooltip-wrap {
    background: rgba(20, 33, 61, 0.95) !important;
    border: 1px solid #C8A951 !important;
    border-radius: 8px !important;
    padding: 8px 12px !important;
    font-size: 12px !important;
    color: white !important;
    font-family: 'Segoe UI', sans-serif !important;
}

[b-wztb0v4ggr] .e-tooltip-wrap .e-tip-content {
    font-size: 12px !important;
    line-height: 1.4 !important;
    color: white !important;
    white-space: normal !important;
    word-wrap: break-word !important;
    text-overflow: unset !important;
    overflow: visible !important;
    max-width: 320px !important;
}

/* Override any text truncation in tooltips */
[b-wztb0v4ggr] .e-tooltip-wrap * {
    text-overflow: unset !important;
    overflow: visible !important;
    white-space: normal !important;
    word-wrap: break-word !important;
}

/* Accumulation Chart Tooltip */
[b-wztb0v4ggr] .e-accumulationchart .e-tooltip-wrap {
    background: rgba(20, 33, 61, 0.95) !important;
    border: 1px solid #C8A951 !important;
    border-radius: 8px !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2) !important;
    padding: 8px 12px !important;
    max-width: 250px !important;
    white-space: normal !important;
    word-wrap: break-word !important;
}

/* Chart X-Axis Labels for Rotated Text */
[b-wztb0v4ggr] .e-chart .e-axislabelcollection text {
    font-size: 10px !important;
    font-weight: 500 !important;
    text-anchor: end !important;
}

/* Increase chart area bottom margin for rotated labels */
[b-wztb0v4ggr] .e-chart .e-chartarea {
    margin-bottom: 100px !important;
}

/* Chart axis label positioning for better readability */
[b-wztb0v4ggr] .e-chart .e-axis-label {
    transform-origin: center bottom !important;
}

/* Ensure rotated labels don't overlap */
[b-wztb0v4ggr] .e-chart .e-axislabel {
    max-width: 200px !important;
    word-wrap: break-word !important;
    text-overflow: unset !important;
    overflow: visible !important;
}

/* Force chart labels to show fully */
[b-wztb0v4ggr] .e-chart .e-axislabelcollection text {
    text-overflow: unset !important;
    overflow: visible !important;
    white-space: nowrap !important;
}

/* Override Syncfusion's default label trimming */
[b-wztb0v4ggr] .e-chart .e-category-axis text {
    text-overflow: unset !important;
    overflow: visible !important;
}

/* Specific styling for rotated text */
[b-wztb0v4ggr] .e-chart .e-axislabel text {
    max-width: none !important;
    text-overflow: unset !important;
}

/* Ensure chart area has enough space */
[b-wztb0v4ggr] .e-chart {
    padding-bottom: 80px !important;
}

/* Make sure the chart SVG doesn't clip labels */
[b-wztb0v4ggr] .e-chart svg {
    overflow: visible !important;
}

/* Schedule Section */
.schedule-section[b-wztb0v4ggr] {
    background: white;
    border-radius: 16px;
    padding: 30px;
    margin-top: 40px;
    box-shadow: 0 4px 20px rgba(20, 33, 61, 0.08);
    border: 1px solid #E2E6EA;
}

.schedule-header[b-wztb0v4ggr] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 30px;
    flex-wrap: wrap;
    gap: 20px;
}

.schedule-header h2[b-wztb0v4ggr] {
    color: #14213D;
    font-size: 1.8rem;
    font-weight: 600;
    margin: 0;
}

.schedule-controls[b-wztb0v4ggr] {
    display: flex;
    align-items: center;
    gap: 30px;
    flex-wrap: wrap;
}

.scheduler-legend[b-wztb0v4ggr] {
    display: flex;
    gap: 15px;
    flex-wrap: wrap;
}

.legend-item[b-wztb0v4ggr] {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 0.85rem;
    color: #6c757d;
}

.legend-dot[b-wztb0v4ggr] {
    width: 12px;
    height: 12px;
    border-radius: 50%;
    display: inline-block;
}

.scheduler-container[b-wztb0v4ggr] {
    background: #f8f9fa;
    border-radius: 12px;
    padding: 20px;
    border: 1px solid #E2E6EA;
}

.scheduler-content[b-wztb0v4ggr] {
    background: white;
    border-radius: 8px;
    overflow: hidden;
}

/* Action Management Section */
.action-management-section[b-wztb0v4ggr] {
    background: white;
    border-radius: 16px;
    padding: 30px;
    margin-top: 40px;
    margin-bottom: 40px;
    box-shadow: 0 4px 20px rgba(20, 33, 61, 0.08);
    border: 1px solid #E2E6EA;
}

.section-header[b-wztb0v4ggr] {
    margin-bottom: 30px;
    text-align: left;
    border-bottom: 1px solid #f8f9fa;
    padding-bottom: 20px;
}

.section-header h2[b-wztb0v4ggr] {
    color: #14213D;
    font-size: 1.6rem;
    font-weight: 600;
    margin-bottom: 6px;
}

.section-subtitle[b-wztb0v4ggr] {
    color: #6c757d;
    font-size: 0.9rem;
    font-weight: 400;
}

.action-management-cards[b-wztb0v4ggr] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
    gap: 20px;
}

.action-management-card[b-wztb0v4ggr] {
    background: #f8f9fa;
    border-radius: 12px;
    padding: 20px;
    border: 1px solid #e9ecef;
    transition: all 0.3s ease;
    cursor: pointer;
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.action-management-card:hover[b-wztb0v4ggr] {
    background: white;
    border-color: #C8A951;
    box-shadow: 0 4px 12px rgba(200, 169, 81, 0.15);
}

.action-management-card .card-header[b-wztb0v4ggr] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
}

.action-management-card .hazard-info[b-wztb0v4ggr] {
    display: flex;
    align-items: flex-start;
    gap: 12px;
}

.action-management-card .hazard-icon[b-wztb0v4ggr] {
    width: 36px;
    height: 36px;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 16px;
    color: white;
    background: #14213D;
}

.action-management-card .hazard-details h3[b-wztb0v4ggr] {
    color: #14213D;
    font-size: 1rem;
    font-weight: 600;
    margin: 0 0 4px 0;
    line-height: 1.3;
}

.action-management-card .hazard-category[b-wztb0v4ggr] {
    color: #6c757d;
    font-size: 0.8rem;
    font-weight: 400;
}

.action-management-card .risk-level-badge[b-wztb0v4ggr] {
    padding: 4px 10px;
    border-radius: 16px;
    font-size: 0.75rem;
    font-weight: 500;
    color: white;
    background: #C8A951;
    text-transform: uppercase;
    letter-spacing: 0.3px;
}

.action-management-card .card-metrics[b-wztb0v4ggr] {
    display: flex;
    justify-content: space-between;
    padding: 12px 0;
    border-top: 1px solid #e9ecef;
    border-bottom: 1px solid #e9ecef;
}

.action-management-card .metric-item[b-wztb0v4ggr] {
    text-align: center;
    flex: 1;
}

.action-management-card .metric-value[b-wztb0v4ggr] {
    color: #14213D;
    font-size: 1.2rem;
    font-weight: 700;
    margin-bottom: 3px;
}

.action-management-card .metric-label[b-wztb0v4ggr] {
    color: #6c757d;
    font-size: 0.75rem;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.3px;
}

.action-management-card .card-footer[b-wztb0v4ggr] {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.action-management-card .owner-info[b-wztb0v4ggr] {
    display: flex;
    align-items: center;
    gap: 8px;
}

.action-management-card .owner-avatar[b-wztb0v4ggr] {
    width: 28px;
    height: 28px;
    border-radius: 50%;
    background: #C8A951;
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    font-size: 11px;
}

.action-management-card .owner-name[b-wztb0v4ggr] {
    color: #14213D;
    font-size: 0.85rem;
    font-weight: 500;
}

.action-management-card .last-update[b-wztb0v4ggr] {
    color: #6c757d;
    font-size: 0.75rem;
}

.action-management-card .action-button[b-wztb0v4ggr] {
    width: 28px;
    height: 28px;
    border-radius: 50%;
    background: #e9ecef;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #6c757d;
    font-size: 11px;
    transition: all 0.3s ease;
}

.action-management-card:hover .action-button[b-wztb0v4ggr] {
    background: #C8A951;
    color: white;
}

/* Base Responsive Design */
.dashboard-container[b-wztb0v4ggr] {
    margin: 0 auto;
    padding: 30px;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    min-height: 100vh;
    width: 100%;
    box-sizing: border-box;
}

.dashboard-container.hidden[b-wztb0v4ggr] {
    display: none;
}

.dashboard-container.active[b-wztb0v4ggr] {
    display: block;
}

/* Dashboard Header */
.dashboard-header[b-wztb0v4ggr] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 40px;
    padding: 0 10px;
    width: 100%;
    box-sizing: border-box;
    flex-wrap: wrap;
    gap: 20px;
}

.title-section h1[b-wztb0v4ggr] {
    color: #14213D;
    font-size: clamp(1.8rem, 4vw, 2.5rem);
    font-weight: 700;
    margin-bottom: 8px;
    letter-spacing: -0.5px;
}

.subtitle[b-wztb0v4ggr] {
    color: #6c757d;
    font-size: clamp(0.9rem, 2vw, 1.1rem);
    font-weight: 400;
    opacity: 0.8;
}

.action-buttons[b-wztb0v4ggr] {
    display: flex;
    gap: 15px;
    flex-wrap: wrap;
}

.template-btn[b-wztb0v4ggr], .create-btn[b-wztb0v4ggr] {
    padding: 12px 24px;
    border-radius: 12px;
    font-weight: 600;
    transition: all 0.3s ease;
    border: none;
    cursor: pointer;
    display: flex;
    align-items: center;
    gap: 8px;
}

.template-btn[b-wztb0v4ggr] {
    background: white;
    color: #14213D;
    border: 2px solid #E2E6EA;
}

.template-btn:hover[b-wztb0v4ggr] {
    border-color: #C8A951;
    transform: translateY(-2px);
    box-shadow: 0 8px 25px rgba(200, 169, 81, 0.2);
}

.create-btn[b-wztb0v4ggr] {
    background: linear-gradient(135deg, #14213D 0%, #1a2a47 100%);
    color: white;
}

.create-btn:hover[b-wztb0v4ggr] {
    background: linear-gradient(135deg, #C8A951 0%, #d4b563 100%);
    transform: translateY(-2px);
    box-shadow: 0 8px 25px rgba(200, 169, 81, 0.3);
}

/* Enhanced KPI Cards */
.enhanced-kpi-cards[b-wztb0v4ggr] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 24px;
    margin-bottom: 40px;
    width: 100%;
    box-sizing: border-box;
}

.kpi-card[b-wztb0v4ggr] {
    background: white;
    border-radius: 20px;
    padding: clamp(16px, 4vw, 30px);
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
    transition: all 0.3s ease;
    position: relative;
    overflow: hidden;
    width: 100%;
    box-sizing: border-box;
}

.kpi-card:hover[b-wztb0v4ggr] {
    transform: translateY(-5px);
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.15);
}

.kpi-card[b-wztb0v4ggr]::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 5px;
    background: linear-gradient(135deg, #C8A951 0%, #d4b563 100%);
}

.overall-risk[b-wztb0v4ggr]::before {
    background: linear-gradient(135deg, #e74c3c 0%, #c0392b 100%);
}

.high-risk[b-wztb0v4ggr]::before {
    background: linear-gradient(135deg, #e74c3c 0%, #c0392b 100%);
}

.pending-actions[b-wztb0v4ggr]::before {
    background: linear-gradient(135deg, #f39c12 0%, #e67e22 100%);
}

.surveys-sent[b-wztb0v4ggr]::before {
    background: linear-gradient(135deg, #3498db 0%, #2980b9 100%);
}

.kpi-header[b-wztb0v4ggr] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 20px;
}

.kpi-title[b-wztb0v4ggr] {
    font-size: 1rem;
    font-weight: 600;
    color: #14213D;
}

.kpi-icon[b-wztb0v4ggr] {
    font-size: 1.5rem;
    color: #C8A951;
    opacity: 0.8;
}

.kpi-value[b-wztb0v4ggr] {
    font-size: clamp(2rem, 6vw, 3rem);
    font-weight: 700;
    color: #14213D;
    margin-bottom: 10px;
    line-height: 1;
}

.kpi-subtitle[b-wztb0v4ggr] {
    font-size: 0.9rem;
    color: #6c757d;
    margin-bottom: 15px;
}

.kpi-trend[b-wztb0v4ggr] {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 0.9rem;
    font-weight: 500;
}

.trend-up[b-wztb0v4ggr] {
    color: #27ae60;
}

.trend-down[b-wztb0v4ggr] {
    color: #e74c3c;
}

.kpi-progress-ring[b-wztb0v4ggr] {
    position: absolute;
    top: 20px;
    right: 20px;
}

.kpi-mini-chart[b-wztb0v4ggr] {
    height: 4px;
    background: #f8f9fa;
    border-radius: 2px;
    overflow: hidden;
}

.mini-bar[b-wztb0v4ggr] {
    height: 100%;
    border-radius: 2px;
    transition: width 0.3s ease;
}

.kpi-breakdown[b-wztb0v4ggr] {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.breakdown-item[b-wztb0v4ggr] {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 0.85rem;
}

.breakdown-dot[b-wztb0v4ggr] {
    width: 8px;
    height: 8px;
    border-radius: 50%;
}

.breakdown-dot.overdue[b-wztb0v4ggr] {
    background: #e74c3c;
}

.breakdown-dot.in-progress[b-wztb0v4ggr] {
    background: #3498db;
}

.kpi-progress-bar[b-wztb0v4ggr] {
    height: 8px;
    background: #f8f9fa;
    border-radius: 4px;
    overflow: hidden;
}

.progress-fill[b-wztb0v4ggr] {
    height: 100%;
    background: linear-gradient(135deg, #27ae60 0%, #2ecc71 100%);
    border-radius: 4px;
    transition: width 0.3s ease;
}

/* Charts Section */
.charts-section[b-wztb0v4ggr] {
    margin-bottom: 40px;
}

.charts-section h2[b-wztb0v4ggr] {
    color: #14213D;
    font-size: 1.8rem;
    font-weight: 700;
    margin-bottom: 24px;
}

/* Risk Category Cards */
.risk-category-cards[b-wztb0v4ggr] {
    display: flex;
    gap: 15px;
    margin-bottom: 40px;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

.risk-category-card[b-wztb0v4ggr] {
    background: white;
    border-radius: 12px;
    padding: 16px;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.06);
    transition: all 0.3s ease;
    cursor: pointer;
    border: 2px solid transparent;
    position: relative;
    min-height: 80px;
    flex: 1;
    min-width: 0;
    white-space: nowrap;
}

.risk-category-card:hover[b-wztb0v4ggr] {
    transform: translateY(-2px);
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
}

.risk-category-card.selected[b-wztb0v4ggr] {
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.15);
    border-color: #C8A951;
}

.risk-category-card .card-body[b-wztb0v4ggr] {
    text-align: center;
}

.risk-category-card .category-name[b-wztb0v4ggr] {
    font-size: 0.85rem;
    font-weight: 600;
    color: #14213D;
    margin-bottom: 8px;
    line-height: 1.2;
    white-space: normal;
    word-wrap: break-word;
    text-align: center;
}

.risk-category-card .category-count[b-wztb0v4ggr] {
    font-size: 2rem;
    font-weight: 700;
    color: #14213D;
    line-height: 1;
}

/* Category-specific colors */
.risk-category-card.all[b-wztb0v4ggr] {
    border-left: 4px solid #14213D;
}

.risk-category-card.all .category-count[b-wztb0v4ggr] {
    color: #14213D;
}

.risk-category-card.veryhigh[b-wztb0v4ggr] {
    border-left: 4px solid #8B0000;
}

.risk-category-card.veryhigh .category-count[b-wztb0v4ggr] {
    color: #8B0000;
}

.risk-category-card.high[b-wztb0v4ggr] {
    border-left: 4px solid #DC143C;
}

.risk-category-card.high .category-count[b-wztb0v4ggr] {
    color: #DC143C;
}

.risk-category-card.medium[b-wztb0v4ggr] {
    border-left: 4px solid #FF8C00;
}

.risk-category-card.medium .category-count[b-wztb0v4ggr] {
    color: #FF8C00;
}

.risk-category-card.low[b-wztb0v4ggr] {
    border-left: 4px solid #32CD32;
}

.risk-category-card.low .category-count[b-wztb0v4ggr] {
    color: #32CD32;
}

.risk-category-card.verylow[b-wztb0v4ggr] {
    border-left: 4px solid #228B22;
}

.risk-category-card.verylow .category-count[b-wztb0v4ggr] {
    color: #228B22;
}

/* Selected state overrides */
.risk-category-card.selected .category-name[b-wztb0v4ggr] {
    color: #C8A951;
    font-weight: 700;
}

.risk-category-card.selected .category-count[b-wztb0v4ggr] {
    color: #C8A951;
}

/* Main Chart Container */
.main-chart-container[b-wztb0v4ggr] {
    background: white;
    border-radius: 16px;
    padding: 30px;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.08);
}

.main-chart-container .chart-header[b-wztb0v4ggr] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    margin-bottom: 20px;
    border-bottom: 2px solid #C8A951;
    padding-bottom: 15px;
}

.main-chart-container .chart-header h3[b-wztb0v4ggr] {
    font-size: 1.5rem;
    font-weight: 700;
    color: #14213D;
    margin: 0 0 8px 0;
}

.main-chart-container .chart-subtitle[b-wztb0v4ggr] {
    font-size: 1rem;
    color: #6c757d;
    margin: 0;
}

.main-chart-container .chart-container[b-wztb0v4ggr] {
    height: 400px;
}

/* Risk Analysis Section */
.risk-analysis-section[b-wztb0v4ggr] {
    margin-bottom: 40px;
}

.risk-analysis-section h2[b-wztb0v4ggr] {
    color: #14213D;
    font-size: 1.8rem;
    font-weight: 700;
    margin-bottom: 24px;
}

.risk-analysis-section .chart-container[b-wztb0v4ggr] {
    background: white;
    border-radius: 16px;
    padding: 30px;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.08);
}

.heatmap-tooltip[b-wztb0v4ggr] {
    background: rgba(0, 0, 0, 0.8);
    color: white;
    padding: 10px;
    border-radius: 8px;
    font-size: 0.85rem;
}

.tooltip-title[b-wztb0v4ggr] {
    font-weight: 600;
    margin-bottom: 5px;
}

/* View Controls */
.view-controls[b-wztb0v4ggr] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 30px;
    padding: 0 10px;
    width: 100%;
    box-sizing: border-box;
    flex-wrap: wrap;
    gap: 15px;
}

.view-tabs[b-wztb0v4ggr] {
    display: flex;
    background: white;
    border-radius: 12px;
    padding: 6px;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
    flex-wrap: wrap;
}

.tab-item[b-wztb0v4ggr] {
    padding: 12px 20px;
    cursor: pointer;
    border-radius: 8px;
    transition: all 0.3s ease;
    display: flex;
    align-items: center;
    gap: 8px;
    font-weight: 500;
    color: #6c757d;
    font-size: 0.9rem;
}

.tab-item.active[b-wztb0v4ggr] {
    background: linear-gradient(135deg, #14213D 0%, #1a2a47 100%);
    color: white;
    transform: translateY(-1px);
}

.tab-item:hover:not(.active)[b-wztb0v4ggr] {
    background: #f8f9fa;
    color: #14213D;
}

.view-actions[b-wztb0v4ggr] {
    display: flex;
    gap: 12px;
}

.filter-btn[b-wztb0v4ggr], .export-btn[b-wztb0v4ggr] {
    padding: 10px 20px;
    border-radius: 10px;
    font-weight: 500;
    transition: all 0.3s ease;
    border: none;
    cursor: pointer;
}

.filter-btn[b-wztb0v4ggr] {
    background: white;
    color: #14213D;
    border: 2px solid #E2E6EA;
}

.filter-btn:hover[b-wztb0v4ggr] {
    border-color: #C8A951;
    color: #C8A951;
}

.export-btn[b-wztb0v4ggr] {
    background: linear-gradient(135deg, #C8A951 0%, #d4b563 100%);
    color: white;
}

.export-btn:hover[b-wztb0v4ggr] {
    background: linear-gradient(135deg, #14213D 0%, #1a2a47 100%);
    transform: translateY(-2px);
}

/* View Containers */
.view-container[b-wztb0v4ggr] {
    display: none;
}

.view-container.active[b-wztb0v4ggr] {
    display: block;
}

.view-container.hidden[b-wztb0v4ggr] {
    display: none;
}

/* Dashboard Cards Grid */
.dashboard-cards-grid[b-wztb0v4ggr] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(min(380px, 100%), 1fr));
    gap: 24px;
    margin-bottom: 24px;
    width: 100%;
    box-sizing: border-box;
}

.dashboard-hazard-card[b-wztb0v4ggr] {
    background: white;
    border-radius: 16px;
    padding: clamp(16px, 3vw, 24px);
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
    transition: all 0.3s ease;
    cursor: pointer;
    border: 1px solid #E2E6EA;
    position: relative;
    width: 100%;
    box-sizing: border-box;
}

.dashboard-hazard-card:hover[b-wztb0v4ggr] {
    transform: translateY(-4px);
    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.15);
    border-color: #C8A951;
}

.dashboard-hazard-card.very-high[b-wztb0v4ggr] {
    border-left: 4px solid #8B0000;
}

.dashboard-hazard-card.high[b-wztb0v4ggr] {
    border-left: 4px solid #DC143C;
}

.dashboard-hazard-card.medium[b-wztb0v4ggr] {
    border-left: 4px solid #FF8C00;
}

.dashboard-hazard-card.low[b-wztb0v4ggr] {
    border-left: 4px solid #32CD32;
}

.dashboard-hazard-card.very-low[b-wztb0v4ggr] {
    border-left: 4px solid #228B22;
}

/* Card Top Section */
.card-top-section[b-wztb0v4ggr] {
    display: flex;
    align-items: center;
    gap: 16px;
    margin-bottom: 20px;
}

.card-icon-section[b-wztb0v4ggr] {
    flex-shrink: 0;
}

.hazard-icon[b-wztb0v4ggr] {
    width: 48px;
    height: 48px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.5rem;
    color: white;
}

.hazard-icon.very-high[b-wztb0v4ggr] {
    background: linear-gradient(135deg, #8B0000, #A52A2A);
}

.hazard-icon.high[b-wztb0v4ggr] {
    background: linear-gradient(135deg, #DC143C, #FF4500);
}

.hazard-icon.medium[b-wztb0v4ggr] {
    background: linear-gradient(135deg, #FF8C00, #FFA500);
}

.hazard-icon.low[b-wztb0v4ggr] {
    background: linear-gradient(135deg, #32CD32, #00FF00);
}

.hazard-icon.very-low[b-wztb0v4ggr] {
    background: linear-gradient(135deg, #228B22, #32CD32);
}

.card-info-section[b-wztb0v4ggr] {
    flex: 1;
}

.hazard-title[b-wztb0v4ggr] {
    font-size: 1.1rem;
    font-weight: 600;
    color: #14213D;
    margin-bottom: 4px;
    line-height: 1.3;
}

.hazard-category[b-wztb0v4ggr] {
    font-size: 0.9rem;
    color: #6c757d;
    font-weight: 400;
}

.card-menu-section[b-wztb0v4ggr] {
    flex-shrink: 0;
}

.card-menu-dots[b-wztb0v4ggr] {
    width: 32px;
    height: 32px;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #6c757d;
    cursor: pointer;
    transition: all 0.2s ease;
}

.card-menu-dots:hover[b-wztb0v4ggr] {
    background: #f8f9fa;
    color: #14213D;
}

/* Card Metrics Section */
.card-metrics-section[b-wztb0v4ggr] {
    display: flex;
    align-items: center;
    gap: 20px;
    margin-bottom: 20px;
    padding: 16px;
    background: #f8f9fa;
    border-radius: 12px;
}

.risk-score-display[b-wztb0v4ggr] {
    text-align: center;
}

.risk-score-value[b-wztb0v4ggr] {
    font-size: 2.2rem;
    font-weight: 700;
    color: #14213D;
    line-height: 1;
}

.risk-score-label[b-wztb0v4ggr] {
    font-size: 0.8rem;
    color: #6c757d;
    font-weight: 500;
    margin-top: 4px;
}

.risk-level-display[b-wztb0v4ggr] {
    flex: 1;
    text-align: center;
}

.risk-level-badge[b-wztb0v4ggr] {
    display: inline-block;
    padding: 8px 16px;
    border-radius: 20px;
    font-size: 0.85rem;
    font-weight: 600;
    color: white;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.risk-level-badge.very-high[b-wztb0v4ggr] {
    background: linear-gradient(135deg, #8B0000, #A52A2A);
}

.risk-level-badge.high[b-wztb0v4ggr] {
    background: linear-gradient(135deg, #DC143C, #FF4500);
}

.risk-level-badge.medium[b-wztb0v4ggr] {
    background: linear-gradient(135deg, #FF8C00, #FFA500);
}

.risk-level-badge.low[b-wztb0v4ggr] {
    background: linear-gradient(135deg, #32CD32, #00FF00);
}

.risk-level-badge.very-low[b-wztb0v4ggr] {
    background: linear-gradient(135deg, #228B22, #32CD32);
}

/* Card Stats Section */
.card-stats-section[b-wztb0v4ggr] {
    display: flex;
    justify-content: space-around;
    margin-bottom: 20px;
    padding: 16px 0;
    border-top: 1px solid #E2E6EA;
    border-bottom: 1px solid #E2E6EA;
}

.stat-item[b-wztb0v4ggr] {
    text-align: center;
}

.stat-value[b-wztb0v4ggr] {
    font-size: 1.5rem;
    font-weight: 700;
    color: #14213D;
    line-height: 1;
}

.stat-label[b-wztb0v4ggr] {
    font-size: 0.8rem;
    color: #6c757d;
    font-weight: 500;
    margin-top: 4px;
}

/* Card Footer Section */
.card-footer-section[b-wztb0v4ggr] {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.owner-info[b-wztb0v4ggr] {
    display: flex;
    align-items: center;
    gap: 12px;
    flex: 1;
}

.owner-avatar[b-wztb0v4ggr] {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background: #C8A951;
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    font-size: 0.9rem;
}

.owner-details[b-wztb0v4ggr] {
    flex: 1;
}

.owner-name[b-wztb0v4ggr] {
    font-size: 0.9rem;
    font-weight: 600;
    color: #14213D;
    margin-bottom: 2px;
}

.last-update[b-wztb0v4ggr] {
    font-size: 0.8rem;
    color: #6c757d;
}

.action-button[b-wztb0v4ggr] {
    flex-shrink: 0;
}

.view-details-btn[b-wztb0v4ggr] {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background: #C8A951;
    border: none;
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: all 0.2s ease;
    font-size: 0.9rem;
}

.view-details-btn:hover[b-wztb0v4ggr] {
    background: #14213D;
    transform: scale(1.1);
}

/* Dashboard List Container */
.dashboard-list-container[b-wztb0v4ggr] {
    background: white;
    border-radius: 16px;
    padding: 24px;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.08);
}

.list-header[b-wztb0v4ggr] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 24px;
    padding-bottom: 16px;
    border-bottom: 2px solid #E2E6EA;
}

.list-title[b-wztb0v4ggr] {
    font-size: 1.3rem;
    font-weight: 700;
    color: #14213D;
}

.list-actions[b-wztb0v4ggr] {
    display: flex;
    gap: 12px;
}

.list-filter-btn[b-wztb0v4ggr], .list-export-btn[b-wztb0v4ggr] {
    padding: 8px 16px;
    border: 1px solid #E2E6EA;
    background: white;
    border-radius: 8px;
    color: #6c757d;
    cursor: pointer;
    transition: all 0.2s ease;
    font-size: 0.9rem;
    display: flex;
    align-items: center;
    gap: 6px;
}

.list-filter-btn:hover[b-wztb0v4ggr], .list-export-btn:hover[b-wztb0v4ggr] {
    border-color: #C8A951;
    color: #C8A951;
}

.list-items-container[b-wztb0v4ggr] {
    display: flex;
    flex-direction: column;
    gap: 16px;
    margin-bottom: 24px;
}

.dashboard-list-item[b-wztb0v4ggr] {
    background: white;
    border: 1px solid #E2E6EA;
    border-radius: 12px;
    padding: 20px;
    transition: all 0.3s ease;
    cursor: pointer;
}

.dashboard-list-item:hover[b-wztb0v4ggr] {
    border-color: #C8A951;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
}

.dashboard-list-item.very-high[b-wztb0v4ggr] {
    border-left: 4px solid #8B0000;
}

.dashboard-list-item.high[b-wztb0v4ggr] {
    border-left: 4px solid #DC143C;
}

.dashboard-list-item.medium[b-wztb0v4ggr] {
    border-left: 4px solid #FF8C00;
}

.dashboard-list-item.low[b-wztb0v4ggr] {
    border-left: 4px solid #32CD32;
}

.dashboard-list-item.very-low[b-wztb0v4ggr] {
    border-left: 4px solid #228B22;
}

.list-item-main[b-wztb0v4ggr] {
    display: flex;
    align-items: center;
    gap: 16px;
    margin-bottom: 16px;
}

.list-item-icon[b-wztb0v4ggr] {
    flex-shrink: 0;
}

.hazard-icon-small[b-wztb0v4ggr] {
    width: 40px;
    height: 40px;
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.2rem;
    color: white;
}

.hazard-icon-small.very-high[b-wztb0v4ggr] {
    background: linear-gradient(135deg, #8B0000, #A52A2A);
}

.hazard-icon-small.high[b-wztb0v4ggr] {
    background: linear-gradient(135deg, #DC143C, #FF4500);
}

.hazard-icon-small.medium[b-wztb0v4ggr] {
    background: linear-gradient(135deg, #FF8C00, #FFA500);
}

.hazard-icon-small.low[b-wztb0v4ggr] {
    background: linear-gradient(135deg, #32CD32, #00FF00);
}

.hazard-icon-small.very-low[b-wztb0v4ggr] {
    background: linear-gradient(135deg, #228B22, #32CD32);
}

.list-item-content[b-wztb0v4ggr] {
    flex: 1;
}

.list-item-header[b-wztb0v4ggr] {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 8px;
}

.hazard-name-list[b-wztb0v4ggr] {
    font-size: 1.1rem;
    font-weight: 600;
    color: #14213D;
}

.risk-level-badge-list[b-wztb0v4ggr] {
    padding: 4px 8px;
    border-radius: 12px;
    font-size: 0.75rem;
    font-weight: 600;
    color: white;
    text-transform: uppercase;
}

.risk-level-badge-list.very-high[b-wztb0v4ggr] {
    background: #8B0000;
}

.risk-level-badge-list.high[b-wztb0v4ggr] {
    background: #DC143C;
}

.risk-level-badge-list.medium[b-wztb0v4ggr] {
    background: #FF8C00;
}

.risk-level-badge-list.low[b-wztb0v4ggr] {
    background: #32CD32;
}

.risk-level-badge-list.very-low[b-wztb0v4ggr] {
    background: #228B22;
}

.list-item-details[b-wztb0v4ggr] {
    display: flex;
    align-items: center;
    gap: 20px;
    font-size: 0.9rem;
    color: #6c757d;
}

.list-item-metrics[b-wztb0v4ggr] {
    display: flex;
    gap: 24px;
    margin-right: 20px;
}

.metric-item[b-wztb0v4ggr] {
    text-align: center;
}

.metric-value[b-wztb0v4ggr] {
    font-size: 1.2rem;
    font-weight: 700;
    color: #14213D;
    line-height: 1;
}

.metric-label[b-wztb0v4ggr] {
    font-size: 0.75rem;
    color: #6c757d;
    font-weight: 500;
    margin-top: 2px;
}

.list-item-actions[b-wztb0v4ggr] {
    display: flex;
    gap: 8px;
}

.list-view-btn[b-wztb0v4ggr], .list-edit-btn[b-wztb0v4ggr], .list-menu-btn[b-wztb0v4ggr] {
    width: 32px;
    height: 32px;
    border-radius: 8px;
    border: none;
    background: #f8f9fa;
    color: #6c757d;
    cursor: pointer;
    transition: all 0.2s ease;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.9rem;
}

.list-view-btn:hover[b-wztb0v4ggr] {
    background: #C8A951;
    color: white;
}

.list-edit-btn:hover[b-wztb0v4ggr] {
    background: #3498db;
    color: white;
}

.list-menu-btn:hover[b-wztb0v4ggr] {
    background: #14213D;
    color: white;
}

.list-item-progress[b-wztb0v4ggr] {
    margin-top: 12px;
}

.progress-bar-container[b-wztb0v4ggr] {
    display: flex;
    align-items: center;
    gap: 12px;
}

.progress-bar[b-wztb0v4ggr] {
    flex: 1;
    height: 6px;
    background: #E2E6EA;
    border-radius: 3px;
    overflow: hidden;
}

.progress-fill[b-wztb0v4ggr] {
    height: 100%;
    border-radius: 3px;
    transition: width 0.3s ease;
}

.progress-fill.very-high[b-wztb0v4ggr] {
    background: #8B0000;
}

.progress-fill.high[b-wztb0v4ggr] {
    background: #DC143C;
}

.progress-fill.medium[b-wztb0v4ggr] {
    background: #FF8C00;
}

.progress-fill.low[b-wztb0v4ggr] {
    background: #32CD32;
}

.progress-fill.very-low[b-wztb0v4ggr] {
    background: #228B22;
}

.progress-text[b-wztb0v4ggr] {
    font-size: 0.8rem;
    color: #6c757d;
    font-weight: 500;
    white-space: nowrap;
}

.list-pagination[b-wztb0v4ggr] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-top: 16px;
    border-top: 1px solid #E2E6EA;
}

.pagination-info[b-wztb0v4ggr] {
    font-size: 0.9rem;
    color: #6c757d;
}

.pagination-controls[b-wztb0v4ggr] {
    display: flex;
    align-items: center;
    gap: 12px;
}

.pagination-btn[b-wztb0v4ggr] {
    width: 32px;
    height: 32px;
    border-radius: 8px;
    border: 1px solid #E2E6EA;
    background: white;
    color: #6c757d;
    cursor: pointer;
    transition: all 0.2s ease;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.8rem;
}

.pagination-btn:hover[b-wztb0v4ggr] {
    border-color: #C8A951;
    color: #C8A951;
}

.pagination-page[b-wztb0v4ggr] {
    font-size: 0.9rem;
    color: #14213D;
    font-weight: 500;
}

/* Scheduler View */
.scheduler-container[b-wztb0v4ggr] {
    background: white;
    border-radius: 16px;
    padding: 30px;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.08);
}

.scheduler-header[b-wztb0v4ggr] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 24px;
}

.scheduler-header h3[b-wztb0v4ggr] {
    color: #14213D;
    font-size: 1.5rem;
    font-weight: 700;
    margin: 0;
}

.scheduler-legend[b-wztb0v4ggr] {
    display: flex;
    gap: 20px;
    flex-wrap: wrap;
}

.legend-item[b-wztb0v4ggr] {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 0.9rem;
    color: #6c757d;
}

.legend-dot[b-wztb0v4ggr] {
    width: 12px;
    height: 12px;
    border-radius: 50%;
}

.legend-dot.critical-priority[b-wztb0v4ggr] {
    background: #8e44ad;
}

.legend-dot.high-priority[b-wztb0v4ggr] {
    background: #e67e22;
}

.legend-dot.medium-priority[b-wztb0v4ggr] {
    background: #f39c12;
}

.legend-dot.low-priority[b-wztb0v4ggr] {
    background: #3498db;
}

.legend-dot.overdue-status[b-wztb0v4ggr] {
    background: #e74c3c;
}

.legend-dot.completed-status[b-wztb0v4ggr] {
    background: #27ae60;
}

.scheduler-content[b-wztb0v4ggr] {
    margin-top: 20px;
}

/* Custom Scheduler Event Styling */
.e-schedule .e-appointment[b-wztb0v4ggr] {
    border-radius: 12px !important;
    border: none !important;
    padding: 8px 12px !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15) !important;
    min-height: 60px !important;
}

.e-schedule .e-appointment .e-subject[b-wztb0v4ggr] {
    font-weight: 600 !important;
    font-size: 0.9rem !important;
    line-height: 1.3 !important;
    color: white !important;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.2) !important;
}

.e-schedule .e-appointment .e-appointment-details[b-wztb0v4ggr] {
    font-size: 0.75rem !important;
    opacity: 0.9 !important;
    color: white !important;
    margin-top: 4px !important;
}

/* Enhanced Event Styling for Better Visual Impact */
.e-schedule .e-appointment:hover[b-wztb0v4ggr] {
    transform: translateY(-1px) !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2) !important;
    transition: all 0.2s ease !important;
}

/* Risk Category-based gradient effects */
.e-schedule .e-appointment[style*="#8B0000"][b-wztb0v4ggr] {
    background: linear-gradient(135deg, #8B0000 0%, #B22222 100%) !important; /* Very High Risk - Dark Red */
}

.e-schedule .e-appointment[style*="#DC143C"][b-wztb0v4ggr] {
    background: linear-gradient(135deg, #DC143C 0%, #FF6347 100%) !important; /* High Risk - Crimson */
}

.e-schedule .e-appointment[style*="#FF8C00"][b-wztb0v4ggr] {
    background: linear-gradient(135deg, #FF8C00 0%, #FFA500 100%) !important; /* Medium Risk - Dark Orange */
}

.e-schedule .e-appointment[style*="#32CD32"][b-wztb0v4ggr] {
    background: linear-gradient(135deg, #32CD32 0%, #00FF32 100%) !important; /* Low Risk - Lime Green */
}

.e-schedule .e-appointment[style*="#228B22"][b-wztb0v4ggr] {
    background: linear-gradient(135deg, #228B22 0%, #32CD32 100%) !important; /* Very Low Risk - Forest Green */
}

.e-schedule .e-appointment[style*="#95a5a6"][b-wztb0v4ggr] {
    background: linear-gradient(135deg, #95a5a6 0%, #BDC3C7 100%) !important; /* Unknown - Gray */
}

.calendar-and-events[b-wztb0v4ggr] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 30px;
    margin-top: 20px;
}

.calendar-section[b-wztb0v4ggr] {
    background: #f8f9fa;
    border-radius: 12px;
    padding: 20px;
}

.events-section[b-wztb0v4ggr] {
    background: #f8f9fa;
    border-radius: 12px;
    padding: 20px;
}

.events-section h4[b-wztb0v4ggr] {
    color: #14213D;
    font-size: 1.2rem;
    font-weight: 600;
    margin-bottom: 16px;
}

.events-list[b-wztb0v4ggr] {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.event-item[b-wztb0v4ggr] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px;
    border-radius: 10px;
    cursor: pointer;
    transition: all 0.3s ease;
    border-left: 4px solid #E2E6EA;
    background: white;
}

.event-item:hover[b-wztb0v4ggr] {
    background: #f8f9fa;
    transform: translateX(5px);
}

.event-item.overdue[b-wztb0v4ggr] {
    border-left-color: #e74c3c;
    background: rgba(231, 76, 60, 0.05);
}

.event-item.due-today[b-wztb0v4ggr] {
    border-left-color: #f39c12;
    background: rgba(243, 156, 18, 0.05);
}

.event-item.due-week[b-wztb0v4ggr] {
    border-left-color: #f1c40f;
    background: rgba(241, 196, 15, 0.05);
}

.event-item.completed[b-wztb0v4ggr] {
    border-left-color: #27ae60;
    background: rgba(39, 174, 96, 0.05);
}

.event-item.scheduled[b-wztb0v4ggr] {
    border-left-color: #3498db;
    background: rgba(52, 152, 219, 0.05);
}

.event-time[b-wztb0v4ggr] {
    font-size: 0.85rem;
    color: #6c757d;
    font-weight: 500;
    min-width: 50px;
}

.event-details[b-wztb0v4ggr] {
    flex: 1;
}

.event-title[b-wztb0v4ggr] {
    font-size: 0.9rem;
    font-weight: 500;
    color: #14213D;
    margin-bottom: 2px;
}

.event-hazard[b-wztb0v4ggr] {
    font-size: 0.8rem;
    color: #6c757d;
    margin-bottom: 2px;
}

.event-assigned[b-wztb0v4ggr] {
    font-size: 0.75rem;
    color: #6c757d;
}

.event-priority[b-wztb0v4ggr] {
    padding: 4px 8px;
    border-radius: 10px;
    font-size: 0.75rem;
    font-weight: 500;
    text-transform: uppercase;
}

.event-priority.low[b-wztb0v4ggr] {
    background: rgba(39, 174, 96, 0.1);
    color: #27ae60;
}

.event-priority.medium[b-wztb0v4ggr] {
    background: rgba(243, 156, 18, 0.1);
    color: #e67e22;
}

.event-priority.high[b-wztb0v4ggr] {
    background: rgba(231, 76, 60, 0.1);
    color: #c0392b;
}

.event-priority.critical[b-wztb0v4ggr] {
    background: rgba(155, 89, 182, 0.1);
    color: #8e44ad;
}

/* Scheduler Event Styling - Priority Based */
[b-wztb0v4ggr] .e-schedule .e-appointment {
    border-radius: 8px !important;
    font-weight: 500 !important;
    font-size: 0.85rem !important;
    padding: 4px 8px !important;
}

/* Critical Priority Events */
[b-wztb0v4ggr] .e-schedule .e-appointment[style*="#8e44ad"] {
    background-color: #8e44ad !important;
    border-color: #8e44ad !important;
    color: white !important;
    box-shadow: 0 2px 8px rgba(142, 68, 173, 0.3) !important;
}

/* High Priority Events */
[b-wztb0v4ggr] .e-schedule .e-appointment[style*="#e67e22"] {
    background-color: #e67e22 !important;
    border-color: #e67e22 !important;
    color: white !important;
    box-shadow: 0 2px 8px rgba(230, 126, 34, 0.3) !important;
}

/* Medium Priority Events */
[b-wztb0v4ggr] .e-schedule .e-appointment[style*="#f39c12"] {
    background-color: #f39c12 !important;
    border-color: #f39c12 !important;
    color: white !important;
    box-shadow: 0 2px 8px rgba(243, 156, 18, 0.3) !important;
}

/* Low Priority Events */
[b-wztb0v4ggr] .e-schedule .e-appointment[style*="#3498db"] {
    background-color: #3498db !important;
    border-color: #3498db !important;
    color: white !important;
    box-shadow: 0 2px 8px rgba(52, 152, 219, 0.3) !important;
}

/* Completed Events */
[b-wztb0v4ggr] .e-schedule .e-appointment[style*="#27ae60"] {
    background-color: #27ae60 !important;
    border-color: #27ae60 !important;
    color: white !important;
    box-shadow: 0 2px 8px rgba(39, 174, 96, 0.3) !important;
    opacity: 0.8 !important;
}

/* Overdue Events */
[b-wztb0v4ggr] .e-schedule .e-appointment[style*="#e74c3c"] {
    background-color: #e74c3c !important;
    border-color: #e74c3c !important;
    color: white !important;
    box-shadow: 0 2px 8px rgba(231, 76, 60, 0.4) !important;
    animation: pulseOverdue-b-wztb0v4ggr 2s infinite !important;
}

@keyframes pulseOverdue-b-wztb0v4ggr {
    0% { 
        opacity: 1; 
        transform: scale(1);
    }
    50% { 
        opacity: 0.8; 
        transform: scale(1.02);
    }
    100% { 
        opacity: 1; 
        transform: scale(1);
    }
}

/* Hover effects for all events */
[b-wztb0v4ggr] .e-schedule .e-appointment:hover {
    transform: translateY(-1px) !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2) !important;
    transition: all 0.2s ease !important;
}

@keyframes pulse-b-wztb0v4ggr {
    0% { opacity: 1; }
    50% { opacity: 0.7; }
    100% { opacity: 1; }
}

/* Quick Info Template Styling */
.quick-info-header[b-wztb0v4ggr] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 15px;
    border-bottom: 1px solid #e9ecef;
}

.event-subject[b-wztb0v4ggr] {
    font-size: 1.1rem;
    font-weight: 600;
    color: #14213D;
}

.event-priority[b-wztb0v4ggr] {
    padding: 4px 8px;
    border-radius: 10px;
    font-size: 0.75rem;
    font-weight: 500;
    text-transform: uppercase;
}

.quick-info-content[b-wztb0v4ggr] {
    padding: 15px;
}

.info-item[b-wztb0v4ggr] {
    margin-bottom: 10px;
    font-size: 0.9rem;
    color: #6c757d;
}

.info-item strong[b-wztb0v4ggr] {
    color: #14213D;
    font-weight: 600;
}

.quick-info-footer[b-wztb0v4ggr] {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    padding: 10px 15px;
    border-top: 1px solid #e9ecef;
}

.quick-info-footer .btn[b-wztb0v4ggr] {
    padding: 6px 12px;
    border-radius: 6px;
    border: none;
    font-size: 0.85rem;
    cursor: pointer;
    transition: all 0.2s ease;
}

.quick-info-footer .btn-primary[b-wztb0v4ggr] {
    background: #C8A951;
    color: white;
}

.quick-info-footer .btn-primary:hover[b-wztb0v4ggr] {
    background: #14213D;
}

.quick-info-footer .btn-secondary[b-wztb0v4ggr] {
    background: #6c757d;
    color: white;
}

.quick-info-footer .btn-secondary:hover[b-wztb0v4ggr] {
    background: #495057;
}

/* Scheduler Responsive Design */
@media (max-width: 768px) {
    .scheduler-header[b-wztb0v4ggr] {
        flex-direction: column;
        align-items: flex-start;
        gap: 15px;
    }
    
    .scheduler-legend[b-wztb0v4ggr] {
        flex-direction: column;
        gap: 8px;
    }
    
    .scheduler-container[b-wztb0v4ggr] {
        padding: 20px;
    }
    
    .calendar-and-events[b-wztb0v4ggr] {
        grid-template-columns: 1fr;
        gap: 20px;
    }
}

/* Dashboard Footer */
.dashboard-footer[b-wztb0v4ggr] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 40px;
    padding: 25px 30px;
    background: white;
    border-radius: 16px;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.08);
}

.footer-stats[b-wztb0v4ggr] {
    display: flex;
    gap: 30px;
}

.stat-item[b-wztb0v4ggr] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.stat-label[b-wztb0v4ggr] {
    font-size: 0.85rem;
    color: #6c757d;
}

.stat-value[b-wztb0v4ggr] {
    font-size: 1.1rem;
    font-weight: 600;
    color: #14213D;
}

.primary-btn[b-wztb0v4ggr] {
    background: linear-gradient(135deg, #14213D 0%, #1a2a47 100%);
    color: white;
    border: none;
    padding: 12px 24px;
    border-radius: 12px;
    font-weight: 600;
    transition: all 0.3s ease;
    cursor: pointer;
    display: flex;
    align-items: center;
    gap: 8px;
}

.primary-btn:hover[b-wztb0v4ggr] {
    background: linear-gradient(135deg, #C8A951 0%, #d4b563 100%);
    transform: translateY(-2px);
    box-shadow: 0 8px 25px rgba(200, 169, 81, 0.3);
}

/* Comprehensive Responsive Design */

/* Large Tablets and Small Desktops */
@media (max-width: 1024px) {
    .dashboard-container[b-wztb0v4ggr] {
        padding: 25px;
    }
    
    .enhanced-kpi-cards[b-wztb0v4ggr] {
        grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
        gap: 20px;
    }
    
    .risk-category-cards[b-wztb0v4ggr] {
        gap: 12px;
    }
    
    .risk-category-card[b-wztb0v4ggr] {
        min-width: 100px;
        padding: 14px;
    }
    
    .dashboard-cards-grid[b-wztb0v4ggr] {
        grid-template-columns: repeat(auto-fill, minmax(min(300px, 100%), 1fr));
        gap: 20px;
    }
    
    .charts-grid-container[b-wztb0v4ggr] {
        gap: 25px;
    }
    
    .chart-item[b-wztb0v4ggr] {
        padding: 20px;
    }
    
    .scheduler-legend[b-wztb0v4ggr] {
        gap: 15px;
        flex-wrap: wrap;
    }
    
    .action-management-cards[b-wztb0v4ggr] {
        grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
        gap: 20px;
    }
}

/* Tablets and Small Screens */
@media (max-width: 768px) {
    .dashboard-container[b-wztb0v4ggr] {
        padding: 15px;
    }
    
    /* Dashboard Header */
    .dashboard-header[b-wztb0v4ggr] {
        flex-direction: column;
        align-items: flex-start;
        gap: 20px;
        margin-bottom: 30px;
    }
    
    .title-section h1[b-wztb0v4ggr] {
        font-size: clamp(1.6rem, 5vw, 2rem);
    }
    
    .action-buttons[b-wztb0v4ggr] {
        width: 100%;
        justify-content: space-between;
        flex-wrap: wrap;
    }
    
    /* Enhanced KPI Cards - 2x2 grid */
    .enhanced-kpi-cards[b-wztb0v4ggr] {
        grid-template-columns: 1fr 1fr;
        gap: 12px;
        margin-bottom: 30px;
    }
    
    .kpi-card[b-wztb0v4ggr] {
        padding: 16px;
        border-radius: 12px;
    }
    
    .kpi-value[b-wztb0v4ggr] {
        font-size: clamp(1.8rem, 5vw, 2rem);
        margin-bottom: 6px;
    }
    
    .kpi-title[b-wztb0v4ggr] {
        font-size: 0.85rem;
    }
    
    .kpi-subtitle[b-wztb0v4ggr] {
        font-size: 0.8rem;
    }
    
    /* Risk Category Cards - 3 columns grid */
    .risk-category-cards[b-wztb0v4ggr] {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 8px;
        margin-bottom: 30px;
    }
    
    .risk-category-card[b-wztb0v4ggr] {
        min-width: unset;
        padding: 10px;
        min-height: 65px;
        white-space: normal;
    }
    
    .risk-category-card .category-name[b-wztb0v4ggr] {
        font-size: 0.75rem;
        margin-bottom: 4px;
        line-height: 1.1;
    }
    
    .risk-category-card .category-count[b-wztb0v4ggr] {
        font-size: 1.5rem;
    }
    
    /* Charts and Grid Layout */
    .charts-grid-container[b-wztb0v4ggr] {
        gap: 20px;
    }
    
    .chart-item[b-wztb0v4ggr] {
        padding: 16px;
    }
    
    .chart-header h3[b-wztb0v4ggr] {
        font-size: 1.1rem;
    }
    
    .dashboard-cards-grid[b-wztb0v4ggr] {
        grid-template-columns: 1fr;
        gap: 16px;
    }
    
    /* View Controls */
    .view-controls[b-wztb0v4ggr] {
        flex-direction: column;
        gap: 15px;
        align-items: stretch;
    }
    
    .view-tabs[b-wztb0v4ggr] {
        justify-content: center;
    }
    
    .tab-item[b-wztb0v4ggr] {
        padding: 10px 16px;
        font-size: 0.85rem;
    }
    
    /* Schedule and Actions */
    .schedule-header[b-wztb0v4ggr] {
        flex-direction: column;
        align-items: flex-start;
        gap: 15px;
    }
    
    .scheduler-legend[b-wztb0v4ggr] {
        gap: 10px;
        flex-wrap: wrap;
    }
    
    .legend-item[b-wztb0v4ggr] {
        font-size: 0.8rem;
    }
    
    .action-management-cards[b-wztb0v4ggr] {
        grid-template-columns: 1fr;
        gap: 16px;
    }
    
    /* Footer */
    .dashboard-footer[b-wztb0v4ggr] {
        flex-direction: column;
        gap: 20px;
        padding: 20px;
    }
    
    .footer-stats[b-wztb0v4ggr] {
        justify-content: space-around;
        width: 100%;
        flex-wrap: wrap;
        gap: 15px;
    }
}

/* Mobile Phones */
@media (max-width: 480px) {
    .dashboard-container[b-wztb0v4ggr] {
        padding: 12px;
    }
    
    /* Dashboard Header */
    .dashboard-header[b-wztb0v4ggr] {
        margin-bottom: 25px;
    }
    
    .title-section h1[b-wztb0v4ggr] {
        font-size: clamp(1.4rem, 6vw, 1.8rem);
    }
    
    .subtitle[b-wztb0v4ggr] {
        font-size: 0.9rem;
    }
    
    .action-buttons[b-wztb0v4ggr] {
        flex-direction: column;
        gap: 10px;
        width: 100%;
    }
    
    .template-btn[b-wztb0v4ggr], .create-btn[b-wztb0v4ggr] {
        width: 100%;
        justify-content: center;
        padding: 12px 20px;
    }
    
    /* Enhanced KPI Cards - 2x2 grid, compact */
    .enhanced-kpi-cards[b-wztb0v4ggr] {
        grid-template-columns: 1fr 1fr;
        gap: 10px;
        margin-bottom: 25px;
    }
    
    .kpi-card[b-wztb0v4ggr] {
        padding: 12px;
        border-radius: 10px;
    }
    
    .kpi-value[b-wztb0v4ggr] {
        font-size: clamp(1.6rem, 5vw, 1.8rem);
        margin-bottom: 4px;
    }
    
    .kpi-title[b-wztb0v4ggr] {
        font-size: 0.8rem;
        line-height: 1.1;
    }
    
    .kpi-subtitle[b-wztb0v4ggr] {
        font-size: 0.75rem;
        margin-bottom: 10px;
    }
    
    .kpi-trend[b-wztb0v4ggr] {
        font-size: 0.8rem;
    }
    
    /* Risk Category Cards - 3 columns, compact */
    .risk-category-cards[b-wztb0v4ggr] {
        grid-template-columns: repeat(3, 1fr);
        gap: 6px;
        margin-bottom: 25px;
    }
    
    .risk-category-card[b-wztb0v4ggr] {
        padding: 8px;
        min-height: 55px;
    }
    
    .risk-category-card .category-name[b-wztb0v4ggr] {
        font-size: 0.7rem;
        margin-bottom: 3px;
        line-height: 1.0;
    }
    
    .risk-category-card .category-count[b-wztb0v4ggr] {
        font-size: 1.3rem;
    }
    
    /* Charts */
    .charts-section h2[b-wztb0v4ggr] {
        font-size: 1.4rem;
        margin-bottom: 16px;
    }
    
    .chart-item[b-wztb0v4ggr] {
        padding: 12px;
    }
    
    .chart-header h3[b-wztb0v4ggr] {
        font-size: 1rem;
    }
    
    .chart-container[b-wztb0v4ggr] {
        height: 400px;
    }
    
    /* View Controls */
    .view-controls[b-wztb0v4ggr] {
        margin-bottom: 20px;
    }
    
    .tab-item[b-wztb0v4ggr] {
        padding: 8px 12px;
        font-size: 0.8rem;
    }
    
    /* Dashboard Cards */
    .dashboard-hazard-card[b-wztb0v4ggr] {
        padding: 12px;
    }
    
    .card-metrics-section[b-wztb0v4ggr] {
        flex-direction: column;
        gap: 12px;
        text-align: center;
    }
    
    .card-stats-section[b-wztb0v4ggr] {
        flex-direction: row;
        justify-content: space-around;
        padding: 12px 0;
    }
    
    /* List Items */
    .dashboard-list-container[b-wztb0v4ggr] {
        padding: 12px;
    }
    
    .dashboard-list-item[b-wztb0v4ggr] {
        padding: 12px;
    }
    
    .list-item-main[b-wztb0v4ggr] {
        flex-direction: column;
        align-items: flex-start;
        gap: 10px;
    }
    
    .list-item-metrics[b-wztb0v4ggr] {
        gap: 12px;
        margin-right: 0;
        align-self: stretch;
        justify-content: space-around;
    }
    
    .list-header[b-wztb0v4ggr] {
        flex-direction: column;
        align-items: flex-start;
        gap: 12px;
    }
    
    /* Schedule */
    .schedule-section[b-wztb0v4ggr] {
        padding: 20px;
        margin-top: 30px;
    }
    
    .scheduler-container[b-wztb0v4ggr] {
        padding: 15px;
    }
    
    /* Footer */
    .dashboard-footer[b-wztb0v4ggr] {
        padding: 15px;
        margin-top: 30px;
    }
    
    .footer-stats[b-wztb0v4ggr] {
        gap: 10px;
    }
    
    .stat-item[b-wztb0v4ggr] {
        text-align: center;
        flex: 1;
    }
}

/* Extra Small Mobile Screens */
@media (max-width: 360px) {
    .dashboard-container[b-wztb0v4ggr] {
        padding: 10px;
    }
    
    /* Dashboard Header */
    .title-section h1[b-wztb0v4ggr] {
        font-size: clamp(1.2rem, 7vw, 1.6rem);
    }
    
    .subtitle[b-wztb0v4ggr] {
        font-size: 0.85rem;
    }
    
    /* KPI Cards - stack vertically on very small screens */
    .enhanced-kpi-cards[b-wztb0v4ggr] {
        grid-template-columns: 1fr;
        gap: 8px;
        margin-bottom: 20px;
    }
    
    .kpi-card[b-wztb0v4ggr] {
        padding: 10px;
        border-radius: 8px;
    }
    
    .kpi-value[b-wztb0v4ggr] {
        font-size: clamp(1.4rem, 6vw, 1.6rem);
        margin-bottom: 3px;
    }
    
    .kpi-title[b-wztb0v4ggr] {
        font-size: 0.75rem;
    }
    
    .kpi-subtitle[b-wztb0v4ggr] {
        font-size: 0.7rem;
        margin-bottom: 8px;
    }
    
    /* Risk Category Cards - 2 columns on very small screens */
    .risk-category-cards[b-wztb0v4ggr] {
        grid-template-columns: repeat(2, 1fr);
        gap: 5px;
        margin-bottom: 20px;
    }
    
    .risk-category-card[b-wztb0v4ggr] {
        padding: 6px;
        min-height: 50px;
    }
    
    .risk-category-card .category-name[b-wztb0v4ggr] {
        font-size: 0.65rem;
        margin-bottom: 2px;
    }
    
    .risk-category-card .category-count[b-wztb0v4ggr] {
        font-size: 1.2rem;
    }
    
    /* Charts */
    .charts-section h2[b-wztb0v4ggr] {
        font-size: 1.2rem;
        margin-bottom: 12px;
    }
    
    .chart-container[b-wztb0v4ggr] {
        height: 350px;
    }
    
    /* View Controls */
    .tab-item[b-wztb0v4ggr] {
        padding: 6px 10px;
        font-size: 0.75rem;
    }
    
    /* Dashboard Cards */
    .dashboard-hazard-card[b-wztb0v4ggr] {
        padding: 10px;
    }
    
    /* Footer */
    .dashboard-footer[b-wztb0v4ggr] {
        padding: 12px;
    }
    
    .stat-item[b-wztb0v4ggr] {
        font-size: 0.8rem;
    }
    
    .stat-value[b-wztb0v4ggr] {
        font-size: 1rem;
    }
}

/* Action Management Section */
.action-management-section[b-wztb0v4ggr] {
    margin-top: 40px;
}

.action-management-section h2[b-wztb0v4ggr] {
    color: #14213D;
    font-size: 1.8rem;
    font-weight: 700;
    margin-bottom: 24px;
}

.action-management-cards[b-wztb0v4ggr] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
    gap: 24px;
}

.action-management-card[b-wztb0v4ggr] {
    background: white;
    border-radius: 16px;
    padding: 24px;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.08);
    transition: all 0.3s ease;
    cursor: pointer;
    border-left: 5px solid #C8A951;
}

.action-management-card:hover[b-wztb0v4ggr] {
    transform: translateY(-5px);
    box-shadow: 0 12px 30px rgba(0, 0, 0, 0.15);
}

.action-management-card .card-header[b-wztb0v4ggr] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 16px;
}

.action-management-card .card-header h3[b-wztb0v4ggr] {
    color: #14213D;
    font-size: 1.2rem;
    font-weight: 600;
    margin: 0;
}

.action-management-card .action-count[b-wztb0v4ggr] {
    background: #C8A951;
    color: white;
    padding: 4px 12px;
    border-radius: 20px;
    font-size: 0.85rem;
    font-weight: 500;
}

.action-management-card .card-body[b-wztb0v4ggr] {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.action-management-card .risk-info[b-wztb0v4ggr] {
    font-weight: 600;
    color: #14213D;
}

.action-management-card .owner-info[b-wztb0v4ggr] {
    color: #6c757d;
    font-size: 0.9rem;
}

.action-management-card .status-info[b-wztb0v4ggr] {
    color: #C8A951;
    font-size: 0.9rem;
    font-weight: 500;
}

/* Modal Styles */
.modal-overlay[b-wztb0v4ggr] {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5);
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 1000;
    backdrop-filter: blur(5px);
}

.modal-content[b-wztb0v4ggr] {
    background: white;
    border-radius: 20px;
    width: 90%;
    max-width: 600px;
    max-height: 90vh;
    overflow-y: auto;
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.2);
    animation: modalFadeIn-b-wztb0v4ggr 0.3s ease;
}

.modal-content.large[b-wztb0v4ggr] {
    max-width: 800px;
}

.modal-content.extra-large[b-wztb0v4ggr] {
    max-width: 1200px;
}

.modal-header[b-wztb0v4ggr] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 24px;
    border-bottom: 1px solid #f8f9fa;
}

.modal-header h2[b-wztb0v4ggr] {
    color: #14213D;
    font-size: 1.5rem;
    font-weight: 700;
    margin: 0;
}

.modal-header .hazard-name[b-wztb0v4ggr] {
    color: #C8A951;
    font-size: 1.2rem;
    font-weight: 500;
}

.close-btn[b-wztb0v4ggr] {
    background: none;
    border: none;
    font-size: 2rem;
    color: #6c757d;
    cursor: pointer;
    transition: color 0.2s ease;
}

.close-btn:hover[b-wztb0v4ggr] {
    color: #14213D;
}

.modal-body[b-wztb0v4ggr] {
    padding: 24px;
}

.detail-grid[b-wztb0v4ggr] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}

.detail-item[b-wztb0v4ggr] {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.detail-item label[b-wztb0v4ggr] {
    font-weight: 600;
    color: #14213D;
    font-size: 0.9rem;
}

.detail-item span[b-wztb0v4ggr] {
    color: #6c757d;
    font-size: 0.95rem;
}

.detail-section[b-wztb0v4ggr] {
    margin-bottom: 32px;
}

.detail-section h3[b-wztb0v4ggr] {
    color: #14213D;
    font-size: 1.2rem;
    font-weight: 600;
    margin-bottom: 16px;
    border-bottom: 2px solid #C8A951;
    padding-bottom: 8px;
}

.action-buttons[b-wztb0v4ggr] {
    display: flex;
    gap: 12px;
    justify-content: flex-end;
    margin-top: 24px;
}

.action-btn[b-wztb0v4ggr] {
    background: #C8A951;
    color: white;
    border: none;
    padding: 8px 16px;
    border-radius: 8px;
    font-size: 0.85rem;
    cursor: pointer;
    transition: all 0.2s ease;
}

.action-btn:hover[b-wztb0v4ggr] {
    background: #14213D;
    transform: translateY(-1px);
}

.no-data[b-wztb0v4ggr] {
    text-align: center;
    padding: 60px 20px;
    color: #6c757d;
}

.no-data i[b-wztb0v4ggr] {
    font-size: 4rem;
    color: #C8A951;
    margin-bottom: 16px;
}

.no-data h3[b-wztb0v4ggr] {
    color: #14213D;
    font-size: 1.3rem;
    margin-bottom: 8px;
}

.no-data p[b-wztb0v4ggr] {
    font-size: 1rem;
    margin: 0;
}

/* Status and Priority Classes */
.status-overdue[b-wztb0v4ggr] {
    background: rgba(231, 76, 60, 0.1);
    color: #c0392b;
    padding: 4px 8px;
    border-radius: 10px;
    font-size: 0.8rem;
    font-weight: 500;
}

.status-inprogress[b-wztb0v4ggr] {
    background: rgba(52, 152, 219, 0.1);
    color: #2980b9;
    padding: 4px 8px;
    border-radius: 10px;
    font-size: 0.8rem;
    font-weight: 500;
}

.status-pending[b-wztb0v4ggr] {
    background: rgba(243, 156, 18, 0.1);
    color: #e67e22;
    padding: 4px 8px;
    border-radius: 10px;
    font-size: 0.8rem;
    font-weight: 500;
}

.status-completed[b-wztb0v4ggr] {
    background: rgba(39, 174, 96, 0.1);
    color: #27ae60;
    padding: 4px 8px;
    border-radius: 10px;
    font-size: 0.8rem;
    font-weight: 500;
}

.priority-critical[b-wztb0v4ggr] {
    background: rgba(155, 89, 182, 0.1);
    color: #8e44ad;
    padding: 4px 8px;
    border-radius: 10px;
    font-size: 0.8rem;
    font-weight: 500;
}

.priority-high[b-wztb0v4ggr] {
    background: rgba(231, 76, 60, 0.1);
    color: #c0392b;
    padding: 4px 8px;
    border-radius: 10px;
    font-size: 0.8rem;
    font-weight: 500;
}

.priority-medium[b-wztb0v4ggr] {
    background: rgba(243, 156, 18, 0.1);
    color: #e67e22;
    padding: 4px 8px;
    border-radius: 10px;
    font-size: 0.8rem;
    font-weight: 500;
}

.priority-low[b-wztb0v4ggr] {
    background: rgba(39, 174, 96, 0.1);
    color: #27ae60;
    padding: 4px 8px;
    border-radius: 10px;
    font-size: 0.8rem;
    font-weight: 500;
}

/* Hazard Details Section - Page Navigation System */
.hazard-details-section[b-wztb0v4ggr] {
    display: none;
    margin: 0 auto;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
}

.hazard-details-section.active[b-wztb0v4ggr] {
    display: block;
}

.hazard-details-section.hidden[b-wztb0v4ggr] {
    display: none;
}

.details-header[b-wztb0v4ggr] {
    background: white;
    border-bottom: 2px solid #C8A951;
    padding: 20px 30px;
    margin-bottom: 30px;
    border-radius: 16px;
    box-shadow: 0 4px 20px rgba(20, 33, 61, 0.08);
    border: 1px solid #E2E6EA;
}

.details-header .header-content[b-wztb0v4ggr] {
    max-width: 1400px;
    margin: 0 auto;
    display: flex;
    align-items: center;
    gap: 20px;
}

.back-btn[b-wztb0v4ggr] {
    background: #14213D;
    color: white;
    border: none;
    padding: 10px 16px;
    border-radius: 8px;
    cursor: pointer;
    transition: all 0.3s ease;
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 0.9rem;
    font-weight: 500;
}

.back-btn:hover[b-wztb0v4ggr] {
    background: #C8A951;
    transform: translateY(-2px);
}

.details-header h1[b-wztb0v4ggr] {
    color: #14213D;
    font-size: 2rem;
    font-weight: 700;
    margin: 0;
    flex: 1;
}

.hazard-meta[b-wztb0v4ggr] {
    display: flex;
    align-items: center;
    gap: 15px;
}

.hazard-meta .risk-score[b-wztb0v4ggr] {
    font-size: 1.1rem;
    font-weight: 600;
    color: #14213D;
}

.details-content[b-wztb0v4ggr] {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.details-card[b-wztb0v4ggr] {
    background: white;
    border-radius: 12px;
    padding: 16px 20px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
    border-left: 3px solid #C8A951;
    margin-bottom: 16px;
}

.details-card h3[b-wztb0v4ggr] {
    color: #14213D;
    font-size: 1.1rem;
    font-weight: 600;
    margin-bottom: 12px;
    border-bottom: 1px solid #E2E6EA;
    padding-bottom: 8px;
}

.details-card h4[b-wztb0v4ggr] {
    color: #14213D;
    font-size: 1rem;
    font-weight: 600;
    margin-bottom: 10px;
    margin-top: 16px;
}


.action-management-grid[b-wztb0v4ggr] {
    margin-top: 12px;
}

.action-management-details[b-wztb0v4ggr] {
    margin-top: 12px;
}

.detail-section[b-wztb0v4ggr] {
    margin-bottom: 16px;
}

.list-action-btn[b-wztb0v4ggr] {
    background: #C8A951;
    color: white;
    border: none;
    padding: 6px 12px;
    border-radius: 6px;
    font-size: 0.8rem;
    cursor: pointer;
    transition: all 0.2s ease;
    display: flex;
    align-items: center;
    gap: 4px;
}

.list-action-btn:hover[b-wztb0v4ggr] {
    background: #14213D;
    transform: translateY(-1px);
}

/* Responsive Design for Details Section */
@media (max-width: 768px) {
    .details-header[b-wztb0v4ggr] {
        padding: 15px 20px;
    }
    
    .details-header .header-content[b-wztb0v4ggr] {
        flex-direction: column;
        align-items: flex-start;
        gap: 15px;
    }
    
    .details-header h1[b-wztb0v4ggr] {
        font-size: 1.6rem;
    }
    
    .hazard-meta[b-wztb0v4ggr] {
        flex-direction: column;
        align-items: flex-start;
        gap: 10px;
    }
    
    .details-content[b-wztb0v4ggr] {
        padding: 20px;
    }
    
    .details-card[b-wztb0v4ggr] {
        padding: 20px;
    }
}

/* Animations */
@keyframes fadeInUp-b-wztb0v4ggr {
    from {
        opacity: 0;
        transform: translateY(20px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes modalFadeIn-b-wztb0v4ggr {
    from {
        opacity: 0;
        transform: scale(0.9);
    }
    to {
        opacity: 1;
        transform: scale(1);
    }
}

@keyframes slideInRight-b-wztb0v4ggr {
    from {
        opacity: 0;
        transform: translateX(100%);
    }
    to {
        opacity: 1;
        transform: translateX(0);
    }
}

.kpi-card[b-wztb0v4ggr], .chart-card[b-wztb0v4ggr], .enhanced-hazard-card[b-wztb0v4ggr], .action-management-card[b-wztb0v4ggr] {
    animation: fadeInUp-b-wztb0v4ggr 0.5s ease forwards;
}


.kpi-card:nth-child(1)[b-wztb0v4ggr] { animation-delay: 0.1s; }
.kpi-card:nth-child(2)[b-wztb0v4ggr] { animation-delay: 0.2s; }
.kpi-card:nth-child(3)[b-wztb0v4ggr] { animation-delay: 0.3s; }
.kpi-card:nth-child(4)[b-wztb0v4ggr] { animation-delay: 0.4s; }

/* Responsive Design for Modals */
@media (max-width: 768px) {
    .modal-content[b-wztb0v4ggr] {
        width: 95%;
        margin: 20px;
    }
    
    .modal-content.large[b-wztb0v4ggr],
    .modal-content.extra-large[b-wztb0v4ggr] {
        width: 95%;
    }
    
    .detail-grid[b-wztb0v4ggr] {
        grid-template-columns: 1fr;
    }
    
    .action-management-cards[b-wztb0v4ggr] {
        grid-template-columns: 1fr;
    }
}

/* Action Management Form Section */
.action-management-form-section[b-wztb0v4ggr] {
    display: none;
    margin: 0 auto;
    padding: 30px;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    min-height: 100vh;
}

.action-management-form-section.active[b-wztb0v4ggr] {
    display: block;
}

.action-management-form-section.hidden[b-wztb0v4ggr] {
    display: none;
}

.form-header[b-wztb0v4ggr] {
    background: white;
    border-bottom: 2px solid #C8A951;
    padding: 20px 30px;
    margin-bottom: 30px;
    border-radius: 16px;
    box-shadow: 0 4px 20px rgba(20, 33, 61, 0.08);
    border: 1px solid #E2E6EA;
}

.form-header .header-content[b-wztb0v4ggr] {
    display: flex;
    flex-direction: column;
    gap: 15px;
}

.form-header .back-btn[b-wztb0v4ggr] {
    background: #14213D;
    color: white;
    border: none;
    padding: 10px 16px;
    border-radius: 8px;
    cursor: pointer;
    transition: all 0.3s ease;
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 0.9rem;
    font-weight: 500;
    align-self: flex-start;
}

.form-header .back-btn:hover[b-wztb0v4ggr] {
    background: #C8A951;
    transform: translateY(-2px);
}

.form-header h2[b-wztb0v4ggr] {
    color: #14213D;
    font-size: 1.8rem;
    font-weight: 700;
    margin: 0;
}

.hazard-info[b-wztb0v4ggr] {
    display: flex;
    align-items: center;
    gap: 15px;
}

.hazard-info .hazard-name[b-wztb0v4ggr] {
    font-size: 1.1rem;
    font-weight: 600;
    color: #14213D;
}

.form-content[b-wztb0v4ggr] {
    padding: 0;
}

.action-form-container[b-wztb0v4ggr] {
    background: white;
    border-radius: 16px;
    padding: 30px;
    box-shadow: 0 4px 20px rgba(20, 33, 61, 0.08);
    border: 1px solid #E2E6EA;
    margin-bottom: 30px;
}

.action-management-form[b-wztb0v4ggr] {
    display: flex;
    flex-direction: column;
    gap: 30px;
}

.form-section[b-wztb0v4ggr] {
    border-left: 4px solid #C8A951;
    padding-left: 20px;
}

.form-section h3[b-wztb0v4ggr] {
    color: #14213D;
    font-size: 1.3rem;
    font-weight: 700;
    margin-bottom: 20px;
    border-bottom: 2px solid #C8A951;
    padding-bottom: 10px;
}

.form-row[b-wztb0v4ggr] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
    margin-bottom: 20px;
}

.form-group[b-wztb0v4ggr] {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.form-group label[b-wztb0v4ggr] {
    font-weight: 600;
    color: #14213D;
    font-size: 0.9rem;
}

.form-group input[b-wztb0v4ggr],
.form-group select[b-wztb0v4ggr],
.form-group textarea[b-wztb0v4ggr] {
    padding: 12px 16px;
    border: 2px solid #E2E6EA;
    border-radius: 10px;
    font-size: 0.9rem;
    transition: all 0.3s ease;
    font-family: inherit;
}

.form-group input:focus[b-wztb0v4ggr],
.form-group select:focus[b-wztb0v4ggr],
.form-group textarea:focus[b-wztb0v4ggr] {
    outline: none;
    border-color: #C8A951;
    box-shadow: 0 0 0 3px rgba(200, 169, 81, 0.1);
}

.form-group textarea[b-wztb0v4ggr] {
    resize: vertical;
    min-height: 80px;
}

.form-footer[b-wztb0v4ggr] {
    background: white;
    border-top: 2px solid #E2E6EA;
    padding: 20px 30px;
    border-radius: 16px;
    box-shadow: 0 4px 20px rgba(20, 33, 61, 0.08);
    border: 1px solid #E2E6EA;
}

.footer-actions[b-wztb0v4ggr] {
    display: flex;
    justify-content: flex-end;
    gap: 15px;
}

.cancel-btn[b-wztb0v4ggr],
.save-btn[b-wztb0v4ggr] {
    padding: 12px 24px;
    border-radius: 10px;
    font-weight: 600;
    transition: all 0.3s ease;
    border: none;
    cursor: pointer;
    font-size: 0.9rem;
    display: flex;
    align-items: center;
    gap: 8px;
}

.cancel-btn[b-wztb0v4ggr] {
    background: white;
    color: #6c757d;
    border: 2px solid #E2E6EA;
}

.cancel-btn:hover[b-wztb0v4ggr] {
    background: #f8f9fa;
    border-color: #C8A951;
    color: #C8A951;
}

.save-btn[b-wztb0v4ggr] {
    background: linear-gradient(135deg, #C8A951 0%, #d4b563 100%);
    color: white;
}

.save-btn:hover[b-wztb0v4ggr] {
    background: linear-gradient(135deg, #14213D 0%, #1a2a47 100%);
    transform: translateY(-2px);
    box-shadow: 0 8px 25px rgba(200, 169, 81, 0.3);
}

.scheduler-actions[b-wztb0v4ggr] {
    display: flex;
    gap: 12px;
    margin-bottom: 16px;
}

.add-action-btn[b-wztb0v4ggr] {
    background: linear-gradient(135deg, #C8A951 0%, #d4b563 100%);
    color: white;
    border: none;
    padding: 10px 20px;
    border-radius: 10px;
    font-weight: 600;
    transition: all 0.3s ease;
    cursor: pointer;
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 0.9rem;
}

/* Floating Add Button */
.floating-add-btn[b-wztb0v4ggr] {
    position: absolute;
    bottom: 30px;
    right: 30px;
    width: 60px;
    height: 60px;
    background: linear-gradient(135deg, #C8A951 0%, #d4b563 100%);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: all 0.3s ease;
    box-shadow: 0 8px 25px rgba(200, 169, 81, 0.3);
    z-index: 1000;
}

.floating-add-btn:hover[b-wztb0v4ggr] {
    background: linear-gradient(135deg, #14213D 0%, #1a2a47 100%);
    transform: translateY(-5px) scale(1.1);
    box-shadow: 0 15px 35px rgba(20, 33, 61, 0.4);
}

.floating-add-btn i[b-wztb0v4ggr] {
    font-size: 1.5rem;
    color: white;
}

.scheduler-container[b-wztb0v4ggr] {
    position: relative;
}

/* Responsive Design for Action Management Slide-out */
@media (max-width: 768px) {
    .action-management-slideout[b-wztb0v4ggr] {
        width: 100%;
        max-width: 100%;
    }
    
    .form-row[b-wztb0v4ggr] {
        grid-template-columns: 1fr;
        gap: 16px;
    }
    
    .slideout-header[b-wztb0v4ggr] {
        padding: 15px 20px;
    }
    
    .slideout-content[b-wztb0v4ggr] {
        padding: 20px;
    }
    
    .action-form-container[b-wztb0v4ggr] {
        padding: 20px;
    }
    
    .slideout-footer[b-wztb0v4ggr] {
        padding: 15px 20px;
    }
    
    .footer-actions[b-wztb0v4ggr] {
        flex-direction: column;
        gap: 10px;
    }
    
    .cancel-btn[b-wztb0v4ggr],
    .save-btn[b-wztb0v4ggr] {
        width: 100%;
        padding: 14px 24px;
        justify-content: center;
    }
    
    .slideout-header h2[b-wztb0v4ggr] {
        font-size: 1.5rem;
    }
    
    .form-section h3[b-wztb0v4ggr] {
        font-size: 1.1rem;
    }
}


/* Slide-Out Panel */
.slideout-overlay[b-wztb0v4ggr] {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5);
    z-index: 1000;
    opacity: 1;
    transition: opacity 0.3s ease;
}

.action-edit-slideout[b-wztb0v4ggr] {
    position: fixed;
    top: 0;
    right: -650px;
    width: 650px;
    height: 100%;
    background: white;
    box-shadow: -4px 0 20px rgba(0, 0, 0, 0.15);
    z-index: 1001;
    display: flex;
    flex-direction: column;
    transition: right 0.3s ease;
    overflow: hidden;
}

.action-edit-slideout.open[b-wztb0v4ggr] {
    right: 0;
}

.slideout-header[b-wztb0v4ggr] {
    background: linear-gradient(135deg, #14213D 0%, #1a2847 100%);
    color: white;
    padding: 20px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-shrink: 0;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}

.slideout-header h3[b-wztb0v4ggr] {
    margin: 0;
    font-size: 1.2rem;
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 10px;
}

.slideout-header h3 i[b-wztb0v4ggr] {
    color: #C8A951;
}

.close-slideout-btn[b-wztb0v4ggr] {
    background: none;
    border: none;
    color: white;
    font-size: 1.2rem;
    cursor: pointer;
    padding: 8px;
    border-radius: 4px;
    transition: background 0.3s ease;
}

.close-slideout-btn:hover[b-wztb0v4ggr] {
    background: rgba(255, 255, 255, 0.1);
}

.slideout-content[b-wztb0v4ggr] {
    flex: 1;
    padding: 24px;
    overflow-y: auto;
    background: #f8f9fa;
}

.slideout-form-grid[b-wztb0v4ggr] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
}

.slideout-form-group[b-wztb0v4ggr] {
    display: flex;
    flex-direction: column;
}

.slideout-form-group.full-width[b-wztb0v4ggr] {
    grid-column: 1 / -1;
}

.slideout-form-group label[b-wztb0v4ggr] {
    font-weight: 600;
    color: #14213D;
    margin-bottom: 8px;
    font-size: 0.9rem;
}

.slideout-form-control[b-wztb0v4ggr] {
    padding: 12px;
    border: 1px solid #E2E6EA;
    border-radius: 8px;
    font-size: 0.9rem;
    background: white;
    transition: border-color 0.3s ease, box-shadow 0.3s ease;
}

.slideout-form-control:focus[b-wztb0v4ggr] {
    outline: none;
    border-color: #C8A951;
    box-shadow: 0 0 0 3px rgba(200, 169, 81, 0.1);
}

.slideout-form-control select[b-wztb0v4ggr] {
    cursor: pointer;
}

.slideout-form-control textarea[b-wztb0v4ggr] {
    resize: vertical;
    min-height: 80px;
}

.slideout-footer[b-wztb0v4ggr] {
    background: white;
    padding: 20px;
    border-top: 1px solid #E2E6EA;
    display: flex;
    gap: 12px;
    justify-content: flex-end;
    flex-shrink: 0;
    box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.05);
}

.slideout-save-btn[b-wztb0v4ggr], .slideout-cancel-btn[b-wztb0v4ggr] {
    padding: 12px 24px;
    border-radius: 8px;
    font-weight: 600;
    font-size: 0.9rem;
    cursor: pointer;
    transition: all 0.3s ease;
    border: none;
    display: flex;
    align-items: center;
    gap: 8px;
}

.slideout-save-btn[b-wztb0v4ggr] {
    background: #C8A951;
    color: white;
}

.slideout-save-btn:hover[b-wztb0v4ggr] {
    background: #b8994a;
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(200, 169, 81, 0.3);
}

.slideout-cancel-btn[b-wztb0v4ggr] {
    background: #6c757d;
    color: white;
}

.slideout-cancel-btn:hover[b-wztb0v4ggr] {
    background: #5a6268;
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(108, 117, 125, 0.3);
}

/* Mobile Responsiveness for Slide-Out */
@media (max-width: 768px) {
    .action-edit-slideout[b-wztb0v4ggr] {
        width: 100%;
        right: -100%;
    }
    
    .slideout-form-grid[b-wztb0v4ggr] {
        grid-template-columns: 1fr;
        gap: 16px;
    }
    
    .slideout-content[b-wztb0v4ggr] {
        padding: 20px;
    }
    
    .slideout-footer[b-wztb0v4ggr] {
        flex-direction: column;
    }
    
    .slideout-save-btn[b-wztb0v4ggr], .slideout-cancel-btn[b-wztb0v4ggr] {
        width: 100%;
        justify-content: center;
    }
}

@media (max-width: 480px) {
    .action-summary-card[b-wztb0v4ggr] {
        padding: 12px 16px;
    }
    
    .action-summary-header[b-wztb0v4ggr] {
        flex-direction: column;
        align-items: flex-start;
        gap: 10px;
    }
    
    .edit-action-btn[b-wztb0v4ggr] {
        font-size: 0.8rem;
        padding: 6px 12px;
    }
    
    .action-summary-details[b-wztb0v4ggr] {
        gap: 8px;
    }
    
    .slideout-header[b-wztb0v4ggr] {
        padding: 16px;
    }
    
    .slideout-header h3[b-wztb0v4ggr] {
        font-size: 1rem;
    }
    
    .slideout-content[b-wztb0v4ggr] {
        padding: 16px;
    }
    
    .slideout-form-grid[b-wztb0v4ggr] {
        gap: 12px;
    }
    
    .slideout-form-control[b-wztb0v4ggr] {
        padding: 10px;
        font-size: 0.85rem;
    }
}
/* /Features/Dashboard/DemoDashboardPage.razor.rz.scp.css */
.demo-dashboard-container[b-aul56depak] {
    padding: 1.5rem;
    max-width: 1400px;
    margin: 0 auto;
}

.demo-banner[b-aul56depak] {
    background: linear-gradient(135deg, #C8A951, #BFD8B8);
    color: white;
    padding: 0.5rem 1rem;
    border-radius: 20px;
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    font-weight: 600;
    font-size: 0.9rem;
    margin-bottom: 1rem;
}

.demo-header[b-aul56depak] {
    text-align: center;
    margin-bottom: 3rem;
}

.demo-header .title-section h1[b-aul56depak] {
    color: #14213D;
    margin: 1rem 0;
    font-size: 2.5rem;
    font-weight: 700;
}

.demo-header .subtitle[b-aul56depak] {
    color: #717188;
    font-size: 1.1rem;
    margin-bottom: 2rem;
}

.demo-actions[b-aul56depak] {
    display: flex;
    gap: 1rem;
    justify-content: center;
    flex-wrap: wrap;
}

.dashboard-stats.demo-stats[b-aul56depak] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 1.5rem;
    margin-bottom: 3rem;
}

.stat-card.demo-card[b-aul56depak] {
    position: relative;
    overflow: hidden;
}

.stat-card.demo-card[b-aul56depak]::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 3px;
    background: linear-gradient(90deg, #C8A951, #BFD8B8);
}

.demo-charts-view .chart-row[b-aul56depak] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 2rem;
    margin-bottom: 2rem;
}

.chart-card.demo-chart[b-aul56depak] {
    position: relative;
    min-height: 350px;
}

.demo-chart-content[b-aul56depak] {
    position: relative;
}

.demo-cards-view[b-aul56depak] {
    margin-top: 1.5rem;
}

.demo-hazard-cards[b-aul56depak] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(350px, 1fr));
    gap: 1.5rem;
}

.hazard-card.demo-hazard-card[b-aul56depak] {
    position: relative;
}

.demo-footer[b-aul56depak] {
    background: rgba(200, 169, 81, 0.1);
    border-radius: 8px;
    padding: 0.75rem;
    text-align: center;
}

.demo-note[b-aul56depak] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    color: #C8A951;
    font-size: 0.9rem;
    font-weight: 500;
}

.demo-list-view[b-aul56depak] {
    margin-top: 1.5rem;
}

.demo-grid[b-aul56depak] {
    background: rgba(255, 255, 255, 0.95);
    border-radius: 8px;
    overflow: hidden;
}

.demo-cta-section[b-aul56depak] {
    margin-top: 3rem;
}

.cta-card[b-aul56depak] {
    background: linear-gradient(135deg, rgba(20, 33, 61, 0.05), rgba(191, 216, 184, 0.05));
}

.cta-content[b-aul56depak] {
    text-align: center;
    padding: 2rem;
}

.cta-content h4[b-aul56depak] {
    color: #14213D;
    margin-bottom: 1rem;
    font-size: 1.5rem;
}

.cta-content p[b-aul56depak] {
    color: #717188;
    margin-bottom: 1.5rem;
    font-size: 1.1rem;
}

.feature-list[b-aul56depak] {
    list-style: none;
    padding: 0;
    margin: 1.5rem 0;
    display: inline-block;
    text-align: left;
}

.feature-list li[b-aul56depak] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    margin-bottom: 0.75rem;
    color: #14213D;
}

.feature-list i[b-aul56depak] {
    color: #28a745;
    font-size: 1.1rem;
}

.cta-buttons[b-aul56depak] {
    display: flex;
    gap: 1rem;
    justify-content: center;
    flex-wrap: wrap;
    margin-top: 2rem;
}

.demo-error[b-aul56depak] {
    text-align: center;
    padding: 4rem 2rem;
    color: #717188;
}

.demo-error i[b-aul56depak] {
    font-size: 3rem;
    margin-bottom: 1rem;
    color: #dc3545;
}

.loading-container[b-aul56depak] {
    text-align: center;
    padding: 4rem 2rem;
    color: #717188;
}

.loading-container i[b-aul56depak] {
    margin-right: 0.5rem;
}

/* Mobile Responsive */
@media (max-width: 768px) {
    .demo-header .title-section h1[b-aul56depak] {
        font-size: 2rem;
    }
    
    .demo-actions[b-aul56depak] {
        flex-direction: column;
        align-items: center;
    }
    
    .dashboard-stats.demo-stats[b-aul56depak] {
        grid-template-columns: 1fr;
    }
    
    .demo-charts-view .chart-row[b-aul56depak] {
        grid-template-columns: 1fr;
    }
    
    .demo-hazard-cards[b-aul56depak] {
        grid-template-columns: 1fr;
    }
    
    .cta-buttons[b-aul56depak] {
        flex-direction: column;
        align-items: center;
    }
}
/* /Features/Dashboard/DomainDashboardPage.razor.rz.scp.css */
.domain-dashboard-container[b-320iyp5qbj] {
    padding: 1.5rem;
    max-width: 1400px;
    margin: 0 auto;
}

.dashboard-header[b-320iyp5qbj] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 2rem;
    gap: 2rem;
}

.title-section h1[b-320iyp5qbj] {
    color: #14213D;
    margin: 0.5rem 0;
    font-size: 2rem;
    font-weight: 600;
}

.title-section .subtitle[b-320iyp5qbj] {
    color: #717188;
    margin-bottom: 1rem;
}

.action-buttons[b-320iyp5qbj] {
    display: flex;
    gap: 1rem;
    align-items: center;
}

.domain-metrics[b-320iyp5qbj] {
    margin-bottom: 2rem;
}

.domain-overview[b-320iyp5qbj] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 1.5rem;
    padding: 1rem;
}

.metric-item[b-320iyp5qbj] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.75rem 0;
    border-bottom: 1px solid #E2E6EA;
}

.metric-item:last-child[b-320iyp5qbj] {
    border-bottom: none;
}

.metric-label[b-320iyp5qbj] {
    color: #717188;
    font-weight: 500;
}

.metric-value[b-320iyp5qbj] {
    color: #14213D;
    font-weight: 600;
}

.metric-value.high-risk[b-320iyp5qbj] {
    color: #dc3545;
}

.domain-cards-container[b-320iyp5qbj] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(350px, 1fr));
    gap: 1.5rem;
    margin-top: 1.5rem;
}

.domain-section[b-320iyp5qbj] {
    margin-bottom: 2rem;
}

.domain-title[b-320iyp5qbj] {
    color: #14213D;
    margin-bottom: 1rem;
    font-size: 1.25rem;
    font-weight: 600;
}

.domain-cards[b-320iyp5qbj] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(350px, 1fr));
    gap: 1.5rem;
}

.domain-charts-view .charts-container[b-320iyp5qbj] {
    margin-top: 1.5rem;
}

.chart-row[b-320iyp5qbj] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 2rem;
    margin-bottom: 2rem;
}

.chart-card[b-320iyp5qbj] {
    min-height: 350px;
}

.advanced-analytics[b-320iyp5qbj] {
    margin-top: 2rem;
}

.analytics-content[b-320iyp5qbj] {
    text-align: center;
    padding: 2rem;
}

.analytics-content p[b-320iyp5qbj] {
    color: #717188;
    margin-bottom: 1.5rem;
}

.no-data-message[b-320iyp5qbj] {
    text-align: center;
    padding: 4rem 2rem;
    color: #717188;
}

.no-data-message i[b-320iyp5qbj] {
    font-size: 3rem;
    margin-bottom: 1rem;
    color: #C8A951;
}

.no-data-message h3[b-320iyp5qbj] {
    color: #14213D;
    margin-bottom: 1rem;
}

.loading-container[b-320iyp5qbj] {
    text-align: center;
    padding: 4rem 2rem;
    color: #717188;
}

.loading-container i[b-320iyp5qbj] {
    margin-right: 0.5rem;
}

/* Mobile Responsive */
@media (max-width: 768px) {
    .dashboard-header[b-320iyp5qbj] {
        flex-direction: column;
        align-items: stretch;
    }
    
    .action-buttons[b-320iyp5qbj] {
        justify-content: center;
    }
    
    .chart-row[b-320iyp5qbj] {
        grid-template-columns: 1fr;
    }
    
    .domain-cards-container[b-320iyp5qbj],
    .domain-cards[b-320iyp5qbj] {
        grid-template-columns: 1fr;
    }
}
/* /Features/Dashboard/StressDashboard.razor.rz.scp.css */
/* Use the same styling as DashboardPage but with stress-specific color adjustments */

.dashboard-container[b-41ek1ldndb] {
    padding: 24px;
    background: #f8f9fa;
    min-height: 100vh;
}

.dashboard-header[b-41ek1ldndb] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 32px;
    background: white;
    padding: 24px;
    border-radius: 12px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
}

.title-section h1[b-41ek1ldndb] {
    font-size: 28px;
    font-weight: 700;
    color: #14213D;
    margin: 0 0 8px 0;
}

.subtitle[b-41ek1ldndb] {
    font-size: 14px;
    color: #6c757d;
    margin: 0;
}

.action-buttons[b-41ek1ldndb] {
    display: flex;
    gap: 12px;
}

.enhanced-kpi-cards[b-41ek1ldndb] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 24px;
    margin-bottom: 32px;
}

.kpi-card[b-41ek1ldndb] {
    background: white;
    border-radius: 12px;
    padding: 24px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
    border: 1px solid #E2E6EA;
    position: relative;
    transition: all 0.3s ease;
}

.kpi-card:hover[b-41ek1ldndb] {
    transform: translateY(-2px);
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12);
}

.kpi-card[b-41ek1ldndb]::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 4px;
    border-radius: 12px 12px 0 0;
}

.overall-stress[b-41ek1ldndb]::before {
    background: linear-gradient(135deg, #FF8C00 0%, #FFD700 100%);
}

.stress-rating[b-41ek1ldndb]::before {
    background: linear-gradient(135deg, #FF8C00 0%, #FF4500 100%);
}

.high-stress[b-41ek1ldndb]::before {
    background: linear-gradient(135deg, #DC143C 0%, #FF4500 100%);
}

.kpi-header[b-41ek1ldndb] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 16px;
}

.kpi-title[b-41ek1ldndb] {
    font-size: 14px;
    font-weight: 600;
    color: #14213D;
    line-height: 1.4;
    flex: 1;
}

.kpi-icon[b-41ek1ldndb] {
    width: 40px;
    height: 40px;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(255, 140, 0, 0.1);
    margin-left: 12px;
}

.kpi-icon i[b-41ek1ldndb] {
    font-size: 18px;
    color: #FF8C00;
}

.kpi-value[b-41ek1ldndb] {
    font-size: 36px;
    font-weight: 700;
    line-height: 1;
    margin-bottom: 8px;
    text-align: center;
}

.kpi-trend[b-41ek1ldndb] {
    font-size: 12px;
    font-weight: 500;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
}

.kpi-gauge-container[b-41ek1ldndb] {
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 16px 0;
}

.kpi-subtitle[b-41ek1ldndb] {
    font-size: 12px;
    color: #6c757d;
    text-align: center;
    margin-top: 8px;
}

.kpi-mini-chart[b-41ek1ldndb] {
    margin-top: 12px;
    height: 4px;
    background: #f8f9fa;
    border-radius: 2px;
    overflow: hidden;
}

.mini-bar[b-41ek1ldndb] {
    height: 100%;
    border-radius: 2px;
    transition: width 0.3s ease;
}

.kpi-breakdown[b-41ek1ldndb] {
    margin-top: 12px;
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.breakdown-item[b-41ek1ldndb] {
    display: flex;
    align-items: center;
    gap: 8px;
}

.breakdown-dot[b-41ek1ldndb] {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    flex-shrink: 0;
}

.breakdown-dot.overdue[b-41ek1ldndb] {
    background-color: #DC143C;
}

.breakdown-dot.in-progress[b-41ek1ldndb] {
    background-color: #FF8C00;
}

.breakdown-text[b-41ek1ldndb] {
    font-size: 11px;
    color: #6c757d;
}

.charts-section[b-41ek1ldndb] {
    background: white;
    border-radius: 12px;
    padding: 24px;
    margin-bottom: 32px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
}

.charts-section h2[b-41ek1ldndb] {
    font-size: 22px;
    font-weight: 600;
    color: #14213D;
    margin: 0 0 24px 0;
}

.risk-category-cards[b-41ek1ldndb] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 16px;
    margin-bottom: 24px;
}

.risk-category-card[b-41ek1ldndb] {
    background: #f8f9fa;
    border: 1px solid #E2E6EA;
    border-radius: 8px;
    padding: 16px;
    cursor: pointer;
    transition: all 0.3s ease;
    text-align: center;
}

.risk-category-card:hover[b-41ek1ldndb] {
    background: white;
    border-color: #FF8C00;
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(255, 140, 0, 0.15);
}

.risk-category-card.selected[b-41ek1ldndb] {
    background: rgba(255, 140, 0, 0.1);
    border-color: #FF8C00;
    box-shadow: 0 2px 8px rgba(255, 140, 0, 0.2);
}

.category-name[b-41ek1ldndb] {
    font-size: 14px;
    font-weight: 600;
    color: #14213D;
    margin-bottom: 8px;
}

.category-count[b-41ek1ldndb] {
    font-size: 24px;
    font-weight: 700;
    color: #FF8C00;
}

.view-controls[b-41ek1ldndb] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    background: white;
    padding: 16px 24px;
    border-radius: 12px;
    margin-bottom: 24px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
}

.view-tabs[b-41ek1ldndb] {
    display: flex;
    gap: 8px;
}

.tab-item[b-41ek1ldndb] {
    padding: 10px 16px;
    border-radius: 8px;
    cursor: pointer;
    font-size: 14px;
    font-weight: 500;
    color: #6c757d;
    background: #f8f9fa;
    border: 1px solid #E2E6EA;
    transition: all 0.3s ease;
    display: flex;
    align-items: center;
    gap: 8px;
}

.tab-item:hover[b-41ek1ldndb] {
    background: rgba(255, 140, 0, 0.1);
    border-color: #FF8C00;
    color: #FF8C00;
}

.tab-item.active[b-41ek1ldndb] {
    background: #FF8C00;
    border-color: #FF8C00;
    color: white;
}

.view-actions[b-41ek1ldndb] {
    display: flex;
    gap: 12px;
}

.view-container[b-41ek1ldndb] {
    background: white;
    border-radius: 12px;
    padding: 24px;
    margin-bottom: 24px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
}

.view-container.hidden[b-41ek1ldndb] {
    display: none;
}

.charts-grid-container[b-41ek1ldndb] {
    display: grid;
    grid-template-columns: 1fr;
    gap: 32px;
}

.chart-item[b-41ek1ldndb] {
    background: #f8f9fa;
    border-radius: 12px;
    padding: 24px;
    border: 1px solid #E2E6EA;
}

.chart-header[b-41ek1ldndb] {
    margin-bottom: 20px;
}

.chart-header h3[b-41ek1ldndb] {
    font-size: 18px;
    font-weight: 600;
    color: #14213D;
    margin: 0 0 8px 0;
}

.chart-subtitle[b-41ek1ldndb] {
    font-size: 13px;
    color: #6c757d;
    margin: 0;
}

.dashboard-cards-grid[b-41ek1ldndb] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
    gap: 24px;
}

.dashboard-hazard-card[b-41ek1ldndb] {
    background: white;
    border-radius: 12px;
    padding: 20px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
    border: 1px solid #E2E6EA;
    transition: all 0.3s ease;
    position: relative;
}

.dashboard-hazard-card:hover[b-41ek1ldndb] {
    transform: translateY(-2px);
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12);
}

.dashboard-hazard-card[b-41ek1ldndb]::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 4px;
    border-radius: 12px 12px 0 0;
}

.dashboard-hazard-card.high[b-41ek1ldndb]::before {
    background: linear-gradient(135deg, #DC143C 0%, #FF4500 100%);
}

.dashboard-hazard-card.medium[b-41ek1ldndb]::before {
    background: linear-gradient(135deg, #FF8C00 0%, #FFD700 100%);
}

.dashboard-hazard-card.low[b-41ek1ldndb]::before {
    background: linear-gradient(135deg, #32CD32 0%, #228B22 100%);
}

.card-top-section[b-41ek1ldndb] {
    display: flex;
    align-items: flex-start;
    gap: 16px;
    margin-bottom: 20px;
}

.card-icon-section[b-41ek1ldndb] {
    flex-shrink: 0;
}

.hazard-icon[b-41ek1ldndb] {
    width: 48px;
    height: 48px;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 20px;
}

.hazard-icon.high[b-41ek1ldndb] {
    background: rgba(220, 20, 60, 0.1);
    color: #DC143C;
}

.hazard-icon.medium[b-41ek1ldndb] {
    background: rgba(255, 140, 0, 0.1);
    color: #FF8C00;
}

.hazard-icon.low[b-41ek1ldndb] {
    background: rgba(50, 205, 50, 0.1);
    color: #32CD32;
}

.card-info-section[b-41ek1ldndb] {
    flex: 1;
    min-width: 0;
}

.hazard-title[b-41ek1ldndb] {
    font-size: 16px;
    font-weight: 600;
    color: #14213D;
    margin-bottom: 4px;
    line-height: 1.3;
}

.hazard-category[b-41ek1ldndb] {
    font-size: 12px;
    color: #6c757d;
}

.card-metrics-section[b-41ek1ldndb] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 20px;
    padding: 16px;
    background: #f8f9fa;
    border-radius: 8px;
}

.risk-score-display[b-41ek1ldndb] {
    text-align: center;
}

.risk-score-value[b-41ek1ldndb] {
    font-size: 28px;
    font-weight: 700;
    color: #FF8C00;
    line-height: 1;
}

.risk-score-label[b-41ek1ldndb] {
    font-size: 11px;
    color: #6c757d;
    margin-top: 4px;
}

.risk-level-display[b-41ek1ldndb] {
    text-align: center;
}

.risk-level-badge[b-41ek1ldndb] {
    padding: 6px 12px;
    border-radius: 20px;
    font-size: 11px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.risk-level-badge.high[b-41ek1ldndb] {
    background: rgba(220, 20, 60, 0.1);
    color: #DC143C;
}

.risk-level-badge.medium[b-41ek1ldndb] {
    background: rgba(255, 140, 0, 0.1);
    color: #FF8C00;
}

.risk-level-badge.low[b-41ek1ldndb] {
    background: rgba(50, 205, 50, 0.1);
    color: #32CD32;
}

.card-stats-section[b-41ek1ldndb] {
    display: flex;
    justify-content: space-around;
    margin-bottom: 20px;
    padding: 12px 0;
    border-top: 1px solid #E2E6EA;
    border-bottom: 1px solid #E2E6EA;
}

.stat-item[b-41ek1ldndb] {
    text-align: center;
}

.stat-value[b-41ek1ldndb] {
    font-size: 18px;
    font-weight: 700;
    color: #14213D;
    line-height: 1;
}

.stat-label[b-41ek1ldndb] {
    font-size: 10px;
    color: #6c757d;
    margin-top: 4px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.card-footer-section[b-41ek1ldndb] {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.owner-info[b-41ek1ldndb] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.owner-avatar[b-41ek1ldndb] {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: rgba(255, 140, 0, 0.1);
    display: flex;
    align-items: center;
    justify-content: center;
    color: #FF8C00;
    font-size: 14px;
}

.owner-details[b-41ek1ldndb] {
    flex: 1;
}

.owner-name[b-41ek1ldndb] {
    font-size: 12px;
    font-weight: 600;
    color: #14213D;
    line-height: 1.2;
}

.last-update[b-41ek1ldndb] {
    font-size: 10px;
    color: #6c757d;
    margin-top: 2px;
}

.view-details-btn[b-41ek1ldndb] {
    width: 36px;
    height: 36px;
    border-radius: 8px;
    border: 1px solid #E2E6EA;
    background: white;
    color: #FF8C00;
    cursor: pointer;
    transition: all 0.3s ease;
    display: flex;
    align-items: center;
    justify-content: center;
}

.view-details-btn:hover[b-41ek1ldndb] {
    background: #FF8C00;
    color: white;
    border-color: #FF8C00;
}

.dashboard-list-container[b-41ek1ldndb] {
    background: white;
}

.list-header[b-41ek1ldndb] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 20px;
    padding-bottom: 16px;
    border-bottom: 1px solid #E2E6EA;
}

.list-title[b-41ek1ldndb] {
    font-size: 18px;
    font-weight: 600;
    color: #14213D;
}

.list-actions[b-41ek1ldndb] {
    display: flex;
    gap: 12px;
}

.list-filter-btn[b-41ek1ldndb], .list-export-btn[b-41ek1ldndb] {
    padding: 8px 16px;
    border: 1px solid #E2E6EA;
    background: white;
    color: #6c757d;
    border-radius: 6px;
    cursor: pointer;
    font-size: 12px;
    transition: all 0.3s ease;
    display: flex;
    align-items: center;
    gap: 6px;
}

.list-filter-btn:hover[b-41ek1ldndb], .list-export-btn:hover[b-41ek1ldndb] {
    border-color: #FF8C00;
    color: #FF8C00;
}

.list-items-container[b-41ek1ldndb] {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.dashboard-list-item[b-41ek1ldndb] {
    border: 1px solid #E2E6EA;
    border-radius: 8px;
    background: white;
    transition: all 0.3s ease;
    position: relative;
}

.dashboard-list-item:hover[b-41ek1ldndb] {
    border-color: #FF8C00;
    box-shadow: 0 2px 8px rgba(255, 140, 0, 0.1);
}

.dashboard-list-item[b-41ek1ldndb]::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    width: 4px;
    border-radius: 8px 0 0 8px;
}

.dashboard-list-item.high[b-41ek1ldndb]::before {
    background: #DC143C;
}

.dashboard-list-item.medium[b-41ek1ldndb]::before {
    background: #FF8C00;
}

.dashboard-list-item.low[b-41ek1ldndb]::before {
    background: #32CD32;
}

.list-item-main[b-41ek1ldndb] {
    display: flex;
    align-items: center;
    padding: 16px;
    gap: 16px;
}

.list-item-icon[b-41ek1ldndb] {
    flex-shrink: 0;
}

.hazard-icon-small[b-41ek1ldndb] {
    width: 40px;
    height: 40px;
    border-radius: 6px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 16px;
}

.hazard-icon-small.high[b-41ek1ldndb] {
    background: rgba(220, 20, 60, 0.1);
    color: #DC143C;
}

.hazard-icon-small.medium[b-41ek1ldndb] {
    background: rgba(255, 140, 0, 0.1);
    color: #FF8C00;
}

.hazard-icon-small.low[b-41ek1ldndb] {
    background: rgba(50, 205, 50, 0.1);
    color: #32CD32;
}

.list-item-content[b-41ek1ldndb] {
    flex: 1;
    min-width: 0;
}

.list-item-header[b-41ek1ldndb] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 6px;
}

.hazard-name-list[b-41ek1ldndb] {
    font-size: 15px;
    font-weight: 600;
    color: #14213D;
    line-height: 1.3;
}

.risk-level-badge-list[b-41ek1ldndb] {
    padding: 4px 8px;
    border-radius: 12px;
    font-size: 10px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.risk-level-badge-list.high[b-41ek1ldndb] {
    background: rgba(220, 20, 60, 0.1);
    color: #DC143C;
}

.risk-level-badge-list.medium[b-41ek1ldndb] {
    background: rgba(255, 140, 0, 0.1);
    color: #FF8C00;
}

.risk-level-badge-list.low[b-41ek1ldndb] {
    background: rgba(50, 205, 50, 0.1);
    color: #32CD32;
}

.list-item-details[b-41ek1ldndb] {
    display: flex;
    gap: 16px;
    font-size: 12px;
    color: #6c757d;
}

.list-item-metrics[b-41ek1ldndb] {
    display: flex;
    gap: 24px;
}

.metric-item[b-41ek1ldndb] {
    text-align: center;
    min-width: 60px;
}

.metric-value[b-41ek1ldndb] {
    font-size: 16px;
    font-weight: 700;
    color: #14213D;
    line-height: 1;
}

.metric-label[b-41ek1ldndb] {
    font-size: 10px;
    color: #6c757d;
    margin-top: 4px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.list-item-actions[b-41ek1ldndb] {
    flex-shrink: 0;
}

.list-view-btn[b-41ek1ldndb] {
    width: 36px;
    height: 36px;
    border-radius: 6px;
    border: 1px solid #E2E6EA;
    background: white;
    color: #FF8C00;
    cursor: pointer;
    transition: all 0.3s ease;
    display: flex;
    align-items: center;
    justify-content: center;
}

.list-view-btn:hover[b-41ek1ldndb] {
    background: #FF8C00;
    color: white;
    border-color: #FF8C00;
}

.list-item-progress[b-41ek1ldndb] {
    padding: 16px;
    padding-top: 0;
}

.progress-bar-container[b-41ek1ldndb] {
    display: flex;
    align-items: center;
    gap: 12px;
}

.progress-bar[b-41ek1ldndb] {
    flex: 1;
    height: 6px;
    background: #f8f9fa;
    border-radius: 3px;
    overflow: hidden;
}

.progress-fill[b-41ek1ldndb] {
    height: 100%;
    border-radius: 3px;
    transition: width 0.3s ease;
}

.progress-fill.high[b-41ek1ldndb] {
    background: #DC143C;
}

.progress-fill.medium[b-41ek1ldndb] {
    background: #FF8C00;
}

.progress-fill.low[b-41ek1ldndb] {
    background: #32CD32;
}

.progress-text[b-41ek1ldndb] {
    font-size: 11px;
    color: #6c757d;
    min-width: 80px;
    text-align: right;
}

.list-pagination[b-41ek1ldndb] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 20px;
    padding-top: 16px;
    border-top: 1px solid #E2E6EA;
}

.pagination-info[b-41ek1ldndb] {
    font-size: 12px;
    color: #6c757d;
}

.pagination-controls[b-41ek1ldndb] {
    display: flex;
    align-items: center;
    gap: 12px;
}

.pagination-btn[b-41ek1ldndb] {
    width: 32px;
    height: 32px;
    border: 1px solid #E2E6EA;
    background: white;
    color: #6c757d;
    border-radius: 6px;
    cursor: pointer;
    transition: all 0.3s ease;
    display: flex;
    align-items: center;
    justify-content: center;
}

.pagination-btn:hover[b-41ek1ldndb] {
    border-color: #FF8C00;
    color: #FF8C00;
}

.pagination-page[b-41ek1ldndb] {
    font-size: 12px;
    color: #14213D;
    font-weight: 500;
}

.dashboard-footer[b-41ek1ldndb] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    background: white;
    padding: 20px 24px;
    border-radius: 12px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
    margin-top: 24px;
}

.footer-stats[b-41ek1ldndb] {
    display: flex;
    gap: 32px;
}

.footer-stats .stat-item[b-41ek1ldndb] {
    display: flex;
    align-items: center;
    gap: 8px;
}

.footer-stats .stat-label[b-41ek1ldndb] {
    font-size: 13px;
    color: #6c757d;
}

.footer-stats .stat-value[b-41ek1ldndb] {
    font-size: 13px;
    font-weight: 600;
    color: #14213D;
}

.footer-actions[b-41ek1ldndb] {
    display: flex;
    gap: 12px;
}

@media (max-width: 768px) {
    .dashboard-container[b-41ek1ldndb] {
        padding: 16px;
    }
    
    .dashboard-header[b-41ek1ldndb] {
        flex-direction: column;
        gap: 16px;
        align-items: stretch;
    }
    
    .enhanced-kpi-cards[b-41ek1ldndb] {
        grid-template-columns: 1fr;
    }
    
    .risk-category-cards[b-41ek1ldndb] {
        grid-template-columns: repeat(2, 1fr);
    }
    
    .view-controls[b-41ek1ldndb] {
        flex-direction: column;
        gap: 16px;
        align-items: stretch;
    }
    
    .view-tabs[b-41ek1ldndb] {
        justify-content: center;
    }
    
    .view-actions[b-41ek1ldndb] {
        justify-content: center;
    }
    
    .dashboard-cards-grid[b-41ek1ldndb] {
        grid-template-columns: 1fr;
    }
    
    .list-item-main[b-41ek1ldndb] {
        flex-direction: column;
        align-items: stretch;
        gap: 12px;
    }
    
    .list-item-metrics[b-41ek1ldndb] {
        justify-content: space-around;
    }
    
    .dashboard-footer[b-41ek1ldndb] {
        flex-direction: column;
        gap: 16px;
        align-items: stretch;
    }
    
    .footer-stats[b-41ek1ldndb] {
        justify-content: center;
        flex-wrap: wrap;
        gap: 16px;
    }
    
    .footer-actions[b-41ek1ldndb] {
        justify-content: center;
    }
}
/* /Features/Dashboard/TierDashboard.razor.rz.scp.css */
/* Enhanced Tier Dashboard Styling - Matching DashboardPage */

.tier-dashboard-container[b-onymepn8pg] {
    padding: clamp(16px, 4vw, 40px);
    background: #f8f9fa;
    min-height: 100vh;
    width: 100%;
    box-sizing: border-box;
}

.dashboard-header[b-onymepn8pg] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 40px;
    background: white;
    padding: clamp(20px, 4vw, 40px);
    border-radius: 20px;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
    transition: all 0.3s ease;
}

.dashboard-header:hover[b-onymepn8pg] {
    transform: translateY(-2px);
    box-shadow: 0 15px 40px rgba(0, 0, 0, 0.15);
}

.title-section h1[b-onymepn8pg] {
    font-size: clamp(1.8rem, 4vw, 2.5rem);
    font-weight: 700;
    color: #14213D;
    margin: 0 0 8px 0;
    line-height: 1.2;
}

.subtitle[b-onymepn8pg] {
    font-size: clamp(0.9rem, 2vw, 1.1rem);
    color: #6c757d;
    margin: 0;
    font-weight: 400;
}

.action-buttons[b-onymepn8pg] {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
}

.action-buttons .btn[b-onymepn8pg] {
    padding: 12px 24px;
    border-radius: 12px;
    font-weight: 600;
    font-size: 14px;
    border: none;
    cursor: pointer;
    transition: all 0.3s ease;
    display: flex;
    align-items: center;
    gap: 8px;
    white-space: nowrap;
}

.btn-outline-primary[b-onymepn8pg] {
    background: white;
    color: #14213D;
    border: 2px solid #E2E6EA;
}

.btn-outline-primary:hover[b-onymepn8pg] {
    background: #f8f9fa;
    border-color: #C8A951;
    color: #C8A951;
    transform: translateY(-2px);
    box-shadow: 0 8px 20px rgba(200, 169, 81, 0.2);
}

.btn-primary[b-onymepn8pg] {
    background: linear-gradient(135deg, #C8A951 0%, #14213D 100%);
    color: white;
    border: 2px solid transparent;
}

.btn-primary:hover[b-onymepn8pg] {
    transform: translateY(-2px);
    box-shadow: 0 8px 25px rgba(200, 169, 81, 0.4);
}

/* Enhanced KPI Cards - Matching DashboardPage */
.enhanced-kpi-cards[b-onymepn8pg] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 24px;
    margin-bottom: 40px;
    width: 100%;
    box-sizing: border-box;
}

.kpi-card[b-onymepn8pg] {
    background: white;
    border-radius: 20px;
    padding: clamp(16px, 4vw, 30px);
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
    transition: all 0.3s ease;
    position: relative;
    overflow: hidden;
    width: 100%;
    box-sizing: border-box;
    cursor: pointer;
}

.kpi-card:hover[b-onymepn8pg] {
    transform: translateY(-5px);
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.15);
}

.kpi-card[b-onymepn8pg]::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 5px;
    background: linear-gradient(135deg, #C8A951 0%, #d4b563 100%);
}

.overall-risk[b-onymepn8pg]::before {
    background: linear-gradient(135deg, #e74c3c 0%, #c0392b 100%);
}

.overall-stress[b-onymepn8pg]::before {
    background: linear-gradient(135deg, #FF8C00 0%, #e67e22 100%);
}

.high-risk[b-onymepn8pg]::before,
.high-stress[b-onymepn8pg]::before {
    background: linear-gradient(135deg, #e74c3c 0%, #c0392b 100%);
}

.pending-actions[b-onymepn8pg]::before,
.stress-actions[b-onymepn8pg]::before {
    background: linear-gradient(135deg, #f39c12 0%, #e67e22 100%);
}

.psychosocial-rating[b-onymepn8pg]::before {
    background: linear-gradient(135deg, #3498db 0%, #2980b9 100%);
}

.stress-rating[b-onymepn8pg]::before {
    background: linear-gradient(135deg, #FF8C00 0%, #e67e22 100%);
}

.kpi-header[b-onymepn8pg] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 20px;
}

.kpi-title[b-onymepn8pg] {
    font-size: 1rem;
    font-weight: 600;
    color: #14213D;
    line-height: 1.3;
}

.kpi-icon[b-onymepn8pg] {
    font-size: 1.5rem;
    color: #C8A951;
    opacity: 0.8;
}

.kpi-value[b-onymepn8pg] {
    font-size: clamp(2rem, 6vw, 3rem);
    font-weight: 700;
    color: #14213D;
    margin-bottom: 10px;
    line-height: 1;
}

.kpi-subtitle[b-onymepn8pg] {
    font-size: 0.9rem;
    color: #6c757d;
    margin-bottom: 15px;
}

.kpi-trend[b-onymepn8pg] {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 0.9rem;
    font-weight: 500;
}

.trend-up[b-onymepn8pg] {
    color: #e74c3c;
}

.trend-down[b-onymepn8pg] {
    color: #27ae60;
}

.kpi-gauge-container[b-onymepn8pg] {
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 20px 0;
    min-height: 120px;
}

.kpi-mini-chart[b-onymepn8pg] {
    margin-top: 15px;
    height: 6px;
    background: #f1f2f6;
    border-radius: 3px;
    overflow: hidden;
}

.mini-bar[b-onymepn8pg] {
    height: 100%;
    border-radius: 3px;
    transition: width 0.3s ease;
}

.kpi-breakdown[b-onymepn8pg] {
    margin-top: 15px;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.breakdown-item[b-onymepn8pg] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.breakdown-dot[b-onymepn8pg] {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    flex-shrink: 0;
}

.breakdown-dot.overdue[b-onymepn8pg] {
    background-color: #e74c3c;
}

.breakdown-dot.in-progress[b-onymepn8pg] {
    background-color: #3498db;
}

.breakdown-text[b-onymepn8pg] {
    font-size: 0.85rem;
    color: #6c757d;
    font-weight: 500;
}

/* Quick Actions Section - Modern Clean Style */
.quick-actions-section[b-onymepn8pg] {
    background: white;
    border-radius: 20px;
    padding: clamp(20px, 4vw, 40px);
    margin-bottom: 40px;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
    transition: all 0.3s ease;
}

.quick-actions-section:hover[b-onymepn8pg] {
    transform: translateY(-2px);
    box-shadow: 0 15px 40px rgba(0, 0, 0, 0.15);
}

.quick-actions-header[b-onymepn8pg] {
    margin-bottom: 30px;
}

.quick-actions-header h3[b-onymepn8pg] {
    font-size: clamp(1.3rem, 3vw, 1.6rem);
    font-weight: 700;
    color: #14213D;
    margin: 0;
}

.quick-actions-grid[b-onymepn8pg] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 20px;
}

.quick-action-card[b-onymepn8pg] {
    display: flex;
    align-items: center;
    padding: 24px;
    background: #f8f9fa;
    border-radius: 16px;
    cursor: pointer;
    transition: all 0.3s ease;
    border: 2px solid transparent;
}

.quick-action-card:hover[b-onymepn8pg] {
    background: white;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.15);
    transform: translateY(-3px);
    border-color: #C8A951;
}

.action-icon[b-onymepn8pg] {
    width: 56px;
    height: 56px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-right: 20px;
    flex-shrink: 0;
}

.action-icon.psychosocial[b-onymepn8pg] {
    background: linear-gradient(135deg, rgba(220, 20, 60, 0.1) 0%, rgba(220, 20, 60, 0.05) 100%);
    color: #DC143C;
}

.action-icon.stress[b-onymepn8pg] {
    background: linear-gradient(135deg, rgba(255, 140, 0, 0.1) 0%, rgba(255, 140, 0, 0.05) 100%);
    color: #FF8C00;
}

.action-icon.mental-fitness[b-onymepn8pg] {
    background: linear-gradient(135deg, rgba(200, 169, 81, 0.1) 0%, rgba(200, 169, 81, 0.05) 100%);
    color: #C8A951;
}

.action-icon i[b-onymepn8pg] {
    font-size: 24px;
}

.action-content[b-onymepn8pg] {
    flex: 1;
    min-width: 0;
}

.action-content h4[b-onymepn8pg] {
    font-size: 1.1rem;
    font-weight: 600;
    color: #14213D;
    margin: 0 0 6px 0;
    line-height: 1.3;
}

.action-content p[b-onymepn8pg] {
    font-size: 0.9rem;
    color: #6c757d;
    margin: 0;
    line-height: 1.4;
}

.action-arrow[b-onymepn8pg] {
    color: #C8A951;
    font-size: 18px;
    opacity: 0.7;
    transition: all 0.3s ease;
    margin-left: 12px;
}

.quick-action-card:hover .action-arrow[b-onymepn8pg] {
    opacity: 1;
    transform: translateX(3px);
}

/* Recent Activity Section - Modern Clean Style */
.recent-activity-section[b-onymepn8pg] {
    background: white;
    border-radius: 20px;
    padding: clamp(20px, 4vw, 40px);
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
    transition: all 0.3s ease;
}

.recent-activity-section:hover[b-onymepn8pg] {
    transform: translateY(-2px);
    box-shadow: 0 15px 40px rgba(0, 0, 0, 0.15);
}

.activity-header[b-onymepn8pg] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 30px;
}

.activity-header h3[b-onymepn8pg] {
    font-size: clamp(1.3rem, 3vw, 1.6rem);
    font-weight: 700;
    color: #14213D;
    margin: 0;
}

.btn-sm[b-onymepn8pg] {
    padding: 8px 16px;
    font-size: 12px;
    border-radius: 8px;
    font-weight: 500;
    transition: all 0.3s ease;
}

.activity-timeline[b-onymepn8pg] {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.activity-item[b-onymepn8pg] {
    display: flex;
    align-items: flex-start;
    gap: 16px;
    padding: 20px;
    background: #f8f9fa;
    border-radius: 12px;
    transition: all 0.3s ease;
    border: 1px solid transparent;
}

.activity-item:hover[b-onymepn8pg] {
    background: white;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
    transform: translateY(-1px);
    border-color: #E2E6EA;
}

.activity-icon[b-onymepn8pg] {
    width: 44px;
    height: 44px;
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.activity-icon.assessment[b-onymepn8pg] {
    background: linear-gradient(135deg, rgba(0, 123, 255, 0.1) 0%, rgba(0, 123, 255, 0.05) 100%);
    color: #007bff;
}

.activity-icon.action[b-onymepn8pg] {
    background: linear-gradient(135deg, rgba(200, 169, 81, 0.1) 0%, rgba(200, 169, 81, 0.05) 100%);
    color: #C8A951;
}

.activity-icon.risk[b-onymepn8pg] {
    background: linear-gradient(135deg, rgba(220, 20, 60, 0.1) 0%, rgba(220, 20, 60, 0.05) 100%);
    color: #DC143C;
}

.activity-icon.completion[b-onymepn8pg] {
    background: linear-gradient(135deg, rgba(34, 139, 34, 0.1) 0%, rgba(34, 139, 34, 0.05) 100%);
    color: #228B22;
}

.activity-content[b-onymepn8pg] {
    flex: 1;
    min-width: 0;
}

.activity-title[b-onymepn8pg] {
    font-size: 0.95rem;
    font-weight: 600;
    color: #14213D;
    margin-bottom: 6px;
    line-height: 1.3;
}

.activity-description[b-onymepn8pg] {
    font-size: 0.85rem;
    color: #6c757d;
    margin-bottom: 6px;
    line-height: 1.4;
}

.activity-time[b-onymepn8pg] {
    font-size: 0.75rem;
    color: #adb5bd;
    font-weight: 500;
}

@media (max-width: 768px) {
    .tier-dashboard-container[b-onymepn8pg] {
        padding: 16px;
    }
    
    .dashboard-header[b-onymepn8pg] {
        flex-direction: column;
        gap: 16px;
        align-items: stretch;
    }
    
    .action-buttons[b-onymepn8pg] {
        justify-content: center;
    }
    
    .summary-cards-grid[b-onymepn8pg] {
        grid-template-columns: 1fr;
    }
    
    .quick-actions-grid[b-onymepn8pg] {
        grid-template-columns: 1fr;
    }
    
    .quick-action-card[b-onymepn8pg] {
        padding: 16px;
    }
    
    .action-content h4[b-onymepn8pg] {
        font-size: 15px;
    }
    
    .action-content p[b-onymepn8pg] {
        font-size: 12px;
    }
}
/* /Features/Email/EmailAnalyticsPage.razor.rz.scp.css */
.email-analytics-page[b-2o8v7mwj4b] {
    max-width: 1400px;
    margin: 0 auto;
    padding: 20px;
}

.page-header[b-2o8v7mwj4b] {
    margin-bottom: 30px;
}

.page-title[b-2o8v7mwj4b] {
    color: #14213D;
    font-size: 2rem;
    font-weight: 600;
    margin-bottom: 8px;
    display: flex;
    align-items: center;
    gap: 12px;
}

.page-title i[b-2o8v7mwj4b] {
    color: #C8A951;
    font-size: 1.8rem;
}

.page-description[b-2o8v7mwj4b] {
    color: #2E2E2E;
    font-size: 1.1rem;
    margin: 0;
}

.analytics-dashboard[b-2o8v7mwj4b] {
    display: flex;
    flex-direction: column;
    gap: 25px;
}

.date-range-section[b-2o8v7mwj4b] {
    margin-bottom: 15px;
}

.date-range-card[b-2o8v7mwj4b] {
    background: linear-gradient(135deg, #FFFFFF 0%, #F8F9FA 100%);
    border: 1px solid #E2E6EA;
}

.date-controls[b-2o8v7mwj4b] {
    display: flex;
    align-items: end;
    gap: 20px;
    padding: 10px 0;
}

.date-input-group[b-2o8v7mwj4b] {
    display: flex;
    flex-direction: column;
    gap: 5px;
}

.date-input-group label[b-2o8v7mwj4b] {
    font-size: 0.9rem;
    font-weight: 600;
    color: #14213D;
}

.date-input[b-2o8v7mwj4b] {
    padding: 8px 12px;
    border: 1px solid #E2E6EA;
    border-radius: 8px;
    background: #FFFFFF;
    color: #14213D;
    font-size: 0.9rem;
    min-width: 150px;
}

.date-input:focus[b-2o8v7mwj4b] {
    outline: none;
    border-color: #C8A951;
    box-shadow: 0 0 0 2px rgba(200, 169, 81, 0.2);
}

.metrics-grid[b-2o8v7mwj4b] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(350px, 1fr));
    gap: 25px;
    margin-bottom: 15px;
}

.metrics-card[b-2o8v7mwj4b] {
    background: linear-gradient(135deg, #FFFFFF 0%, #F8F9FA 100%);
    border: 1px solid #E2E6EA;
    transition: all 0.3s ease;
    min-height: 320px;
}

.metrics-card:hover[b-2o8v7mwj4b] {
    transform: translateY(-2px);
    box-shadow: 0 8px 25px rgba(20, 33, 61, 0.1);
}

.gauge-container[b-2o8v7mwj4b] {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 20px 0;
    margin-bottom: 20px;
}

.metric-details[b-2o8v7mwj4b] {
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: 0 20px;
}

.metric-item[b-2o8v7mwj4b] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 8px 0;
    border-bottom: 1px solid #E2E6EA;
}

.metric-item:last-child[b-2o8v7mwj4b] {
    border-bottom: none;
}

.metric-label[b-2o8v7mwj4b] {
    font-size: 0.95rem;
    color: #2E2E2E;
    font-weight: 500;
}

.metric-value[b-2o8v7mwj4b] {
    font-size: 1.1rem;
    font-weight: 700;
    color: #14213D;
}

.metric-value.success[b-2o8v7mwj4b] {
    color: #28a745;
}

.metric-value.error[b-2o8v7mwj4b] {
    color: #dc3545;
}

.charts-section[b-2o8v7mwj4b] {
    margin-bottom: 25px;
}

.chart-row[b-2o8v7mwj4b] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 25px;
}

.chart-card[b-2o8v7mwj4b] {
    background: linear-gradient(135deg, #FFFFFF 0%, #F8F9FA 100%);
    border: 1px solid #E2E6EA;
    min-height: 400px;
}

.no-data[b-2o8v7mwj4b] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 60px 20px;
    color: #6c757d;
    gap: 15px;
    text-align: center;
}

.no-data i[b-2o8v7mwj4b] {
    font-size: 3rem;
    color: #C8A951;
    opacity: 0.5;
}

.detailed-analytics[b-2o8v7mwj4b] {
    margin-top: 10px;
}

.analytics-component-card[b-2o8v7mwj4b] {
    background: linear-gradient(135deg, #FFFFFF 0%, #F8F9FA 100%);
    border: 1px solid #E2E6EA;
    min-height: 500px;
}

.upgrade-prompt[b-2o8v7mwj4b] {
    max-width: 600px;
    margin: 50px auto;
    text-align: center;
}

.upgrade-card[b-2o8v7mwj4b] {
    background: linear-gradient(135deg, #F8F9FA 0%, #E2E6EA 100%);
    border: 2px solid #C8A951;
}

.upgrade-card ul[b-2o8v7mwj4b] {
    text-align: left;
    margin: 20px 0;
}

.upgrade-card li[b-2o8v7mwj4b] {
    margin-bottom: 8px;
    color: #2E2E2E;
}

/* Mobile Responsiveness */
@media (max-width: 768px) {
    .email-analytics-page[b-2o8v7mwj4b] {
        padding: 15px;
    }
    
    .page-title[b-2o8v7mwj4b] {
        font-size: 1.6rem;
    }
    
    .date-controls[b-2o8v7mwj4b] {
        flex-direction: column;
        align-items: stretch;
        gap: 15px;
    }
    
    .date-input[b-2o8v7mwj4b] {
        min-width: unset;
        width: 100%;
    }
    
    .metrics-grid[b-2o8v7mwj4b] {
        grid-template-columns: 1fr;
        gap: 20px;
    }
    
    .chart-row[b-2o8v7mwj4b] {
        grid-template-columns: 1fr;
        gap: 20px;
    }
}

@media (max-width: 480px) {
    .page-title[b-2o8v7mwj4b] {
        font-size: 1.4rem;
        flex-direction: column;
        align-items: flex-start;
        gap: 8px;
    }
    
    .page-description[b-2o8v7mwj4b] {
        font-size: 1rem;
    }
    
    .metrics-card[b-2o8v7mwj4b] {
        min-height: 280px;
    }
    
    .gauge-container[b-2o8v7mwj4b] {
        padding: 15px 0;
        margin-bottom: 15px;
    }
    
    .metric-details[b-2o8v7mwj4b] {
        padding: 0 15px;
        gap: 10px;
    }
}
/* /Features/Email/EmailLogsPage.razor.rz.scp.css */
.email-logs-page[b-qn72lviocv] {
    max-width: 1400px;
    margin: 0 auto;
    padding: 20px;
}

.page-header[b-qn72lviocv] {
    margin-bottom: 30px;
}

.page-title[b-qn72lviocv] {
    color: #14213D;
    font-size: 2rem;
    font-weight: 600;
    margin-bottom: 8px;
    display: flex;
    align-items: center;
    gap: 12px;
}

.page-title i[b-qn72lviocv] {
    color: #C8A951;
    font-size: 1.8rem;
}

.page-description[b-qn72lviocv] {
    color: #2E2E2E;
    font-size: 1.1rem;
    margin: 0;
}

.logs-dashboard[b-qn72lviocv] {
    display: flex;
    flex-direction: column;
    gap: 25px;
}

.filter-section[b-qn72lviocv] {
    margin-bottom: 15px;
}

.filter-card[b-qn72lviocv] {
    background: linear-gradient(135deg, #FFFFFF 0%, #F8F9FA 100%);
    border: 1px solid #E2E6EA;
}

.filter-controls[b-qn72lviocv] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 20px;
    padding: 10px 0;
    align-items: end;
}

.filter-group[b-qn72lviocv] {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.filter-group label[b-qn72lviocv] {
    font-size: 0.9rem;
    font-weight: 600;
    color: #14213D;
}

.status-filter[b-qn72lviocv],
.date-filter[b-qn72lviocv],
.email-search[b-qn72lviocv] {
    padding: 8px 12px;
    border: 1px solid #E2E6EA;
    border-radius: 8px;
    background: #FFFFFF;
    color: #14213D;
    font-size: 0.9rem;
}

.status-filter:focus[b-qn72lviocv],
.date-filter:focus[b-qn72lviocv],
.email-search:focus[b-qn72lviocv] {
    outline: none;
    border-color: #C8A951;
    box-shadow: 0 0 0 2px rgba(200, 169, 81, 0.2);
}

.email-search[b-qn72lviocv] {
    min-width: 250px;
}

.filter-actions[b-qn72lviocv] {
    display: flex;
    gap: 10px;
}

.status-summary[b-qn72lviocv] {
    margin-bottom: 15px;
}

.summary-grid[b-qn72lviocv] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 20px;
}

.summary-card[b-qn72lviocv] {
    background: linear-gradient(135deg, #FFFFFF 0%, #F8F9FA 100%);
    border: 1px solid #E2E6EA;
    transition: all 0.3s ease;
}

.summary-card:hover[b-qn72lviocv] {
    transform: translateY(-2px);
    box-shadow: 0 8px 25px rgba(20, 33, 61, 0.1);
}

.summary-card.delivered[b-qn72lviocv] {
    border-left: 4px solid #28a745;
}

.summary-card.opened[b-qn72lviocv] {
    border-left: 4px solid #17a2b8;
}

.summary-card.bounced[b-qn72lviocv] {
    border-left: 4px solid #dc3545;
}

.summary-value[b-qn72lviocv] {
    font-size: 2rem;
    font-weight: 700;
    color: #14213D;
    margin-bottom: 5px;
}

.summary-info[b-qn72lviocv] {
    font-size: 0.9rem;
    color: #6c757d;
}

.summary-percentage[b-qn72lviocv] {
    font-size: 0.9rem;
    font-weight: 600;
    color: #C8A951;
}

.logs-grid[b-qn72lviocv] {
    margin-bottom: 25px;
}

.logs-card[b-qn72lviocv] {
    background: linear-gradient(135deg, #FFFFFF 0%, #F8F9FA 100%);
    border: 1px solid #E2E6EA;
    min-height: 600px;
}

.grid-actions[b-qn72lviocv] {
    display: flex;
    gap: 10px;
}

.loading-spinner[b-qn72lviocv] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 60px 20px;
    color: #6c757d;
    gap: 15px;
}

.loading-spinner i[b-qn72lviocv] {
    font-size: 2rem;
    color: #C8A951;
}

.error-message[b-qn72lviocv] {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 40px 20px;
    color: #dc3545;
    gap: 10px;
    font-size: 1.1rem;
}

.error-message i[b-qn72lviocv] {
    font-size: 1.3rem;
}

.upgrade-prompt[b-qn72lviocv] {
    max-width: 600px;
    margin: 50px auto;
    text-align: center;
}

.upgrade-card[b-qn72lviocv] {
    background: linear-gradient(135deg, #F8F9FA 0%, #E2E6EA 100%);
    border: 2px solid #C8A951;
}

.upgrade-card ul[b-qn72lviocv] {
    text-align: left;
    margin: 20px 0;
}

.upgrade-card li[b-qn72lviocv] {
    margin-bottom: 8px;
    color: #2E2E2E;
}

/* Log Details Modal */
.log-details-modal[b-qn72lviocv] {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1000;
    display: flex;
    align-items: center;
    justify-content: center;
}

.modal-overlay[b-qn72lviocv] {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5);
}

.modal-content[b-qn72lviocv] {
    position: relative;
    background: #FFFFFF;
    border-radius: 12px;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);
    max-width: 600px;
    width: 90%;
    max-height: 80vh;
    overflow-y: auto;
}

.modal-header[b-qn72lviocv] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 20px 25px;
    border-bottom: 1px solid #E2E6EA;
}

.modal-header h3[b-qn72lviocv] {
    color: #14213D;
    font-size: 1.3rem;
    font-weight: 600;
    margin: 0;
}

.modal-close[b-qn72lviocv] {
    background: none;
    border: none;
    font-size: 1.2rem;
    color: #6c757d;
    cursor: pointer;
    padding: 5px;
    border-radius: 4px;
    transition: color 0.3s ease;
}

.modal-close:hover[b-qn72lviocv] {
    color: #dc3545;
}

.modal-body[b-qn72lviocv] {
    padding: 25px;
}

.log-detail-grid[b-qn72lviocv] {
    display: grid;
    gap: 15px;
}

.detail-item[b-qn72lviocv] {
    display: grid;
    grid-template-columns: 140px 1fr;
    gap: 15px;
    align-items: start;
    padding: 12px 0;
    border-bottom: 1px solid #F8F9FA;
}

.detail-item:last-child[b-qn72lviocv] {
    border-bottom: none;
}

.detail-item label[b-qn72lviocv] {
    font-weight: 600;
    color: #14213D;
    font-size: 0.95rem;
}

.detail-item span[b-qn72lviocv] {
    color: #2E2E2E;
    word-break: break-word;
}

.status-badge[b-qn72lviocv] {
    padding: 4px 8px;
    border-radius: 6px;
    font-size: 0.8rem;
    font-weight: 600;
    text-transform: uppercase;
}

.status-badge.delivered[b-qn72lviocv] {
    background: #d4edda;
    color: #155724;
}

.status-badge.opened[b-qn72lviocv] {
    background: #d1ecf1;
    color: #0c5460;
}

.status-badge.clicked[b-qn72lviocv] {
    background: #d4edda;
    color: #155724;
}

.status-badge.bounced[b-qn72lviocv] {
    background: #f8d7da;
    color: #721c24;
}

.status-badge.failed[b-qn72lviocv] {
    background: #f8d7da;
    color: #721c24;
}

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

.status-badge.sent[b-qn72lviocv] {
    background: #cce7ff;
    color: #004085;
}

.status-badge.default[b-qn72lviocv] {
    background: #e2e6ea;
    color: #6c757d;
}

/* Mobile Responsiveness */
@media (max-width: 768px) {
    .email-logs-page[b-qn72lviocv] {
        padding: 15px;
    }
    
    .page-title[b-qn72lviocv] {
        font-size: 1.6rem;
    }
    
    .filter-controls[b-qn72lviocv] {
        grid-template-columns: 1fr;
        gap: 15px;
    }
    
    .email-search[b-qn72lviocv] {
        min-width: unset;
        width: 100%;
    }
    
    .filter-actions[b-qn72lviocv] {
        justify-content: center;
    }
    
    .summary-grid[b-qn72lviocv] {
        grid-template-columns: repeat(2, 1fr);
        gap: 15px;
    }
    
    .grid-actions[b-qn72lviocv] {
        flex-direction: column;
    }
    
    .modal-content[b-qn72lviocv] {
        width: 95%;
        margin: 20px;
    }
    
    .detail-item[b-qn72lviocv] {
        grid-template-columns: 1fr;
        gap: 8px;
    }
}

@media (max-width: 480px) {
    .page-title[b-qn72lviocv] {
        font-size: 1.4rem;
        flex-direction: column;
        align-items: flex-start;
        gap: 8px;
    }
    
    .page-description[b-qn72lviocv] {
        font-size: 1rem;
    }
    
    .summary-grid[b-qn72lviocv] {
        grid-template-columns: 1fr;
    }
    
    .summary-value[b-qn72lviocv] {
        font-size: 1.6rem;
    }
    
    .modal-header[b-qn72lviocv] {
        padding: 15px 20px;
    }
    
    .modal-body[b-qn72lviocv] {
        padding: 20px;
    }
}
/* /Features/Email/EmailPage.razor.rz.scp.css */
.email-page[b-xccgci5mto] {
    max-width: 1400px;
    margin: 0 auto;
    padding: 20px;
}

.page-header[b-xccgci5mto] {
    margin-bottom: 30px;
}

.page-title[b-xccgci5mto] {
    color: #14213D;
    font-size: 2rem;
    font-weight: 600;
    margin-bottom: 8px;
    display: flex;
    align-items: center;
    gap: 12px;
}

.page-title i[b-xccgci5mto] {
    color: #C8A951;
    font-size: 1.8rem;
}

.page-description[b-xccgci5mto] {
    color: #2E2E2E;
    font-size: 1.1rem;
    margin: 0;
}

.email-dashboard[b-xccgci5mto] {
    display: flex;
    flex-direction: column;
    gap: 25px;
}

.stats-grid[b-xccgci5mto] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 20px;
    margin-bottom: 10px;
}

.stat-card[b-xccgci5mto] {
    background: linear-gradient(135deg, #FFFFFF 0%, #F8F9FA 100%);
    border: 1px solid #E2E6EA;
    transition: all 0.3s ease;
}

.stat-card:hover[b-xccgci5mto] {
    transform: translateY(-2px);
    box-shadow: 0 8px 25px rgba(20, 33, 61, 0.1);
}

.stat-value[b-xccgci5mto] {
    font-size: 2.5rem;
    font-weight: 700;
    color: #14213D;
    margin-bottom: 5px;
}

.stat-change[b-xccgci5mto] {
    font-size: 0.9rem;
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 4px;
}

.stat-change.positive[b-xccgci5mto] {
    color: #28a745;
}

.stat-change.negative[b-xccgci5mto] {
    color: #dc3545;
}

.stat-info[b-xccgci5mto] {
    font-size: 0.9rem;
    color: #6c757d;
    margin-top: 5px;
}

.content-grid[b-xccgci5mto] {
    display: grid;
    grid-template-columns: 2fr 1fr;
    gap: 25px;
    margin-bottom: 25px;
}

.email-manager-section[b-xccgci5mto],
.recent-activity-section[b-xccgci5mto] {
    min-height: 400px;
}

.full-height[b-xccgci5mto] {
    height: 100%;
}

.quick-actions[b-xccgci5mto] {
    margin-top: 10px;
}

.actions-card[b-xccgci5mto] {
    background: linear-gradient(135deg, #BFD8B8 0%, #E8F5E1 100%);
    border: 1px solid #BFD8B8;
}

.action-buttons[b-xccgci5mto] {
    display: flex;
    flex-wrap: wrap;
    gap: 15px;
    padding: 10px 0;
}

.upgrade-prompt[b-xccgci5mto] {
    max-width: 600px;
    margin: 50px auto;
    text-align: center;
}

.upgrade-card[b-xccgci5mto] {
    background: linear-gradient(135deg, #F8F9FA 0%, #E2E6EA 100%);
    border: 2px solid #C8A951;
}

.upgrade-card ul[b-xccgci5mto] {
    text-align: left;
    margin: 20px 0;
}

.upgrade-card li[b-xccgci5mto] {
    margin-bottom: 8px;
    color: #2E2E2E;
}

/* Mobile Responsiveness */
@media (max-width: 768px) {
    .email-page[b-xccgci5mto] {
        padding: 15px;
    }
    
    .page-title[b-xccgci5mto] {
        font-size: 1.6rem;
    }
    
    .stats-grid[b-xccgci5mto] {
        grid-template-columns: 1fr;
        gap: 15px;
    }
    
    .content-grid[b-xccgci5mto] {
        grid-template-columns: 1fr;
        gap: 20px;
    }
    
    .action-buttons[b-xccgci5mto] {
        flex-direction: column;
    }
    
    .stat-value[b-xccgci5mto] {
        font-size: 2rem;
    }
}

@media (max-width: 480px) {
    .page-title[b-xccgci5mto] {
        font-size: 1.4rem;
        flex-direction: column;
        align-items: flex-start;
        gap: 8px;
    }
    
    .page-description[b-xccgci5mto] {
        font-size: 1rem;
    }
    
    .stat-value[b-xccgci5mto] {
        font-size: 1.8rem;
    }
}
/* /Features/Email/EmailTemplatesPage.razor.rz.scp.css */
.email-templates-page[b-f2urq5w6s9] {
    max-width: 1400px;
    margin: 0 auto;
    padding: 20px;
}

.page-header[b-f2urq5w6s9] {
    margin-bottom: 30px;
}

.page-title[b-f2urq5w6s9] {
    color: #14213D;
    font-size: 2rem;
    font-weight: 600;
    margin-bottom: 8px;
    display: flex;
    align-items: center;
    gap: 12px;
}

.page-title i[b-f2urq5w6s9] {
    color: #C8A951;
    font-size: 1.8rem;
}

.page-description[b-f2urq5w6s9] {
    color: #2E2E2E;
    font-size: 1.1rem;
    margin: 0;
}

.templates-dashboard[b-f2urq5w6s9] {
    display: flex;
    flex-direction: column;
    gap: 25px;
}

.header-actions[b-f2urq5w6s9] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 20px;
    background: linear-gradient(135deg, #FFFFFF 0%, #F8F9FA 100%);
    border: 1px solid #E2E6EA;
    border-radius: 12px;
    margin-bottom: 10px;
}

.search-filter-section[b-f2urq5w6s9] {
    display: flex;
    align-items: center;
    gap: 15px;
}

.filter-controls[b-f2urq5w6s9] {
    display: flex;
    gap: 15px;
}

.template-type-filter[b-f2urq5w6s9] {
    padding: 8px 12px;
    border: 1px solid #E2E6EA;
    border-radius: 8px;
    background: #FFFFFF;
    color: #14213D;
    font-size: 0.9rem;
    min-width: 180px;
}

.template-type-filter:focus[b-f2urq5w6s9] {
    outline: none;
    border-color: #C8A951;
    box-shadow: 0 0 0 2px rgba(200, 169, 81, 0.2);
}

.action-buttons[b-f2urq5w6s9] {
    display: flex;
    gap: 12px;
}

.templates-grid[b-f2urq5w6s9] {
    margin-bottom: 25px;
}

.templates-card[b-f2urq5w6s9] {
    min-height: 500px;
}

.loading-spinner[b-f2urq5w6s9] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 60px 20px;
    color: #6c757d;
    gap: 15px;
}

.loading-spinner i[b-f2urq5w6s9] {
    font-size: 2rem;
    color: #C8A951;
}

.error-message[b-f2urq5w6s9] {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 40px 20px;
    color: #dc3545;
    gap: 10px;
    font-size: 1.1rem;
}

.error-message i[b-f2urq5w6s9] {
    font-size: 1.3rem;
}

.template-stats[b-f2urq5w6s9] {
    margin-top: 10px;
}

.stats-grid[b-f2urq5w6s9] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 20px;
}

.stat-card[b-f2urq5w6s9] {
    background: linear-gradient(135deg, #FFFFFF 0%, #F8F9FA 100%);
    border: 1px solid #E2E6EA;
    transition: all 0.3s ease;
}

.stat-card:hover[b-f2urq5w6s9] {
    transform: translateY(-2px);
    box-shadow: 0 8px 25px rgba(20, 33, 61, 0.1);
}

.stat-value[b-f2urq5w6s9] {
    font-size: 2.2rem;
    font-weight: 700;
    color: #14213D;
    margin-bottom: 5px;
}

.stat-info[b-f2urq5w6s9] {
    font-size: 0.9rem;
    color: #6c757d;
    margin-top: 5px;
}

.upgrade-prompt[b-f2urq5w6s9] {
    max-width: 600px;
    margin: 50px auto;
    text-align: center;
}

.upgrade-card[b-f2urq5w6s9] {
    background: linear-gradient(135deg, #F8F9FA 0%, #E2E6EA 100%);
    border: 2px solid #C8A951;
}

.upgrade-card ul[b-f2urq5w6s9] {
    text-align: left;
    margin: 20px 0;
}

.upgrade-card li[b-f2urq5w6s9] {
    margin-bottom: 8px;
    color: #2E2E2E;
}

/* Mobile Responsiveness */
@media (max-width: 768px) {
    .email-templates-page[b-f2urq5w6s9] {
        padding: 15px;
    }
    
    .page-title[b-f2urq5w6s9] {
        font-size: 1.6rem;
    }
    
    .header-actions[b-f2urq5w6s9] {
        flex-direction: column;
        gap: 15px;
        align-items: stretch;
    }
    
    .search-filter-section[b-f2urq5w6s9] {
        justify-content: center;
    }
    
    .action-buttons[b-f2urq5w6s9] {
        justify-content: center;
    }
    
    .stats-grid[b-f2urq5w6s9] {
        grid-template-columns: 1fr;
        gap: 15px;
    }
    
    .stat-value[b-f2urq5w6s9] {
        font-size: 1.8rem;
    }
}

@media (max-width: 480px) {
    .page-title[b-f2urq5w6s9] {
        font-size: 1.4rem;
        flex-direction: column;
        align-items: flex-start;
        gap: 8px;
    }
    
    .page-description[b-f2urq5w6s9] {
        font-size: 1rem;
    }
    
    .filter-controls[b-f2urq5w6s9] {
        flex-direction: column;
        width: 100%;
    }
    
    .template-type-filter[b-f2urq5w6s9] {
        min-width: unset;
        width: 100%;
    }
    
    .action-buttons[b-f2urq5w6s9] {
        flex-direction: column;
        width: 100%;
    }
    
    .stat-value[b-f2urq5w6s9] {
        font-size: 1.6rem;
    }
}
/* /Features/Employer/BusinessUnits/BusinessUnitsPage.razor.rz.scp.css */
/* Business Units Page Styles */

.business-units-container[b-c7xkk9l7lr] {
    padding: 2rem;
    margin: 0 auto;
    max-width: 1400px;
    background: linear-gradient(135deg, #f8fafc 0%, #e2e8f0 100%);
    min-height: 100vh;
}

/* Header Section */
.page-header[b-c7xkk9l7lr] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 2rem;
    gap: 2rem;
}

.header-content[b-c7xkk9l7lr] {
    flex: 1;
}

.page-title[b-c7xkk9l7lr] {
    color: #14213D;
    margin: 0;
    font-size: 1.75rem;
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.page-title i[b-c7xkk9l7lr] {
    color: #C8A951;
    font-size: 1.5rem;
}

.page-description[b-c7xkk9l7lr] {
    color: #6b7280;
    margin: 0.5rem 0 0 0;
    font-size: 0.95rem;
    line-height: 1.5;
}

.header-actions[b-c7xkk9l7lr] {
    display: flex;
    gap: 1rem;
    align-items: center;
}

.header-actions .btn[b-c7xkk9l7lr] {
    border-radius: 16px;
    padding: 14px 28px;
    font-weight: 600;
    font-size: 1rem;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.header-actions .btn-primary[b-c7xkk9l7lr] {
    background: linear-gradient(135deg, #C8A951 0%, #14213D 100%);
    color: white;
    border: none;
    box-shadow: 0 4px 15px rgba(200, 169, 81, 0.3);
    transition: all 0.3s ease;
}

.header-actions .btn-primary:hover[b-c7xkk9l7lr] {
    background: linear-gradient(135deg, #14213D 0%, #C8A951 100%);
    transform: translateY(-2px);
    box-shadow: 0 8px 25px rgba(20, 33, 61, 0.4);
}

/* Statistics Grid */
.stats-grid[b-c7xkk9l7lr] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
    margin-bottom: 30px;
}

.stat-card[b-c7xkk9l7lr] {
    background: linear-gradient(135deg, #ffffff 0%, #f8fafc 100%);
    border-radius: 16px;
    padding: 2rem;
    box-shadow: 0 4px 20px rgba(20, 33, 61, 0.08);
    border: 1px solid rgba(200, 169, 81, 0.1);
    display: flex;
    align-items: center;
    gap: 1.25rem;
    transition: all 0.3s ease;
    position: relative;
    overflow: hidden;
}

.stat-card[b-c7xkk9l7lr]::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 4px;
    background: linear-gradient(90deg, #C8A951 0%, #14213D 100%);
}

.stat-card:hover[b-c7xkk9l7lr] {
    transform: translateY(-4px);
    box-shadow: 0 12px 35px rgba(20, 33, 61, 0.15);
    border-color: rgba(200, 169, 81, 0.3);
}

.stat-icon[b-c7xkk9l7lr] {
    width: 60px;
    height: 60px;
    border-radius: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, #C8A951 0%, #14213D 100%);
    color: white;
    font-size: 1.5rem;
    flex-shrink: 0;
    box-shadow: 0 4px 15px rgba(200, 169, 81, 0.25);
    position: relative;
}

.stat-icon[b-c7xkk9l7lr]::after {
    content: '';
    position: absolute;
    inset: 2px;
    border-radius: 14px;
    background: linear-gradient(135deg, rgba(255,255,255,0.2) 0%, transparent 100%);
    pointer-events: none;
}

.stat-content[b-c7xkk9l7lr] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.stat-number[b-c7xkk9l7lr] {
    color: #14213D;
    font-size: 2rem;
    font-weight: 700;
    line-height: 1;
}

.stat-label[b-c7xkk9l7lr] {
    color: #717188;
    font-size: 0.9rem;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

/* Content Card */
.content-card[b-c7xkk9l7lr] {
    background: white;
    border-radius: 16px;
    box-shadow: 0 4px 20px rgba(20, 33, 61, 0.08);
    border: 1px solid rgba(200, 169, 81, 0.1);
    overflow: hidden;
    transition: all 0.3s ease;
}

.content-card:hover[b-c7xkk9l7lr] {
    box-shadow: 0 8px 30px rgba(20, 33, 61, 0.12);
}

.card-header[b-c7xkk9l7lr] {
    background: linear-gradient(135deg, #14213D 0%, #1e3a8a 100%);
    color: white;
    padding: 1.5rem 2rem;
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: none;
    position: relative;
}

.card-header[b-c7xkk9l7lr]::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 1px;
    background: linear-gradient(90deg, transparent 0%, #C8A951 50%, transparent 100%);
}

.card-header h3[b-c7xkk9l7lr] {
    font-size: 1.5rem;
    font-weight: 600;
    margin: 0;
}

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

.search-box[b-c7xkk9l7lr] {
    position: relative;
    width: 300px;
}

.search-box i[b-c7xkk9l7lr] {
    position: absolute;
    left: 12px;
    top: 50%;
    transform: translateY(-50%);
    color: rgba(255, 255, 255, 0.7);
}

.search-box input[b-c7xkk9l7lr] {
    width: 100%;
    padding: 0.75rem 1rem 0.75rem 2.5rem;
    border: 1px solid rgba(255, 255, 255, 0.3);
    border-radius: 12px;
    font-size: 0.9rem;
    background-color: rgba(255, 255, 255, 0.1);
    color: white;
    backdrop-filter: blur(10px);
}

.search-box input[b-c7xkk9l7lr]::placeholder {
    color: rgba(255, 255, 255, 0.7);
}

.search-box input:focus[b-c7xkk9l7lr] {
    outline: none;
    border-color: #C8A951;
    box-shadow: 0 0 0 3px rgba(200, 169, 81, 0.3);
    background-color: rgba(255, 255, 255, 0.2);
}

.card-content[b-c7xkk9l7lr] {
    padding: 0;
}

/* Grid Styles */
.business-units-grid .e-grid[b-c7xkk9l7lr] {
    border: none;
    border-radius: 0;
    background: transparent;
}

.business-units-grid .e-grid .e-headercell[b-c7xkk9l7lr] {
    background: linear-gradient(135deg, #f8fafc 0%, #e2e8f0 100%);
    color: #14213D;
    font-weight: 600;
    border-color: #e5e7eb;
    padding: 1.25rem 1rem;
    font-size: 0.9rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.business-units-grid .e-grid .e-rowcell[b-c7xkk9l7lr] {
    padding: 1.25rem 1rem;
    border-color: #f1f5f9;
    color: #374151;
    background: white;
    transition: all 0.2s ease;
}

.business-units-grid .e-grid .e-row:hover .e-rowcell[b-c7xkk9l7lr] {
    background: linear-gradient(135deg, #f8fafc 0%, #f1f5f9 100%);
    transform: scale(1.01);
    box-shadow: 0 2px 8px rgba(20, 33, 61, 0.08);
}

.business-units-grid .e-grid .e-altrow .e-rowcell[b-c7xkk9l7lr] {
    background: linear-gradient(135deg, #fefefe 0%, #f9fafb 100%);
}

.business-unit-name[b-c7xkk9l7lr] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    font-weight: 600;
    color: #14213D;
    font-size: 1rem;
}

.business-unit-name i[b-c7xkk9l7lr] {
    width: 32px;
    height: 32px;
    background: linear-gradient(135deg, #C8A951 0%, #14213D 100%);
    color: white;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.8rem;
    box-shadow: 0 2px 8px rgba(200, 169, 81, 0.3);
}

.description[b-c7xkk9l7lr] {
    color: #6b7280;
    max-width: 300px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    line-height: 1.5;
}

/* Row States */
.normal-row[b-c7xkk9l7lr] {
    background: white;
}

.warning-row[b-c7xkk9l7lr] {
    background: #fffbeb;
    border-left: 4px solid #f59e0b;
}

.inactive-row[b-c7xkk9l7lr] {
    background: #f9fafb;
    opacity: 0.7;
}

.inactive-row td[b-c7xkk9l7lr] {
    color: #6b7280;
}

/* Action Buttons */
.action-buttons[b-c7xkk9l7lr] {
    display: flex;
    gap: 0.5rem;
}

.action-buttons .btn[b-c7xkk9l7lr] {
    width: 36px;
    height: 36px;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.9rem;
    transition: all 0.2s ease;
    border: none;
    position: relative;
    overflow: hidden;
}

.action-buttons .btn[b-c7xkk9l7lr]::before {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(135deg, rgba(255,255,255,0.2) 0%, transparent 100%);
    opacity: 0;
    transition: opacity 0.2s ease;
}

.action-buttons .btn:hover[b-c7xkk9l7lr]::before {
    opacity: 1;
}

.action-buttons .btn-outline-primary[b-c7xkk9l7lr] {
    background: linear-gradient(135deg, #3b82f6 0%, #1d4ed8 100%);
    color: white;
    box-shadow: 0 2px 8px rgba(59, 130, 246, 0.3);
}

.action-buttons .btn-outline-info[b-c7xkk9l7lr] {
    background: linear-gradient(135deg, #10b981 0%, #059669 100%);
    color: white;
    box-shadow: 0 2px 8px rgba(16, 185, 129, 0.3);
}

.action-buttons .btn-outline-danger[b-c7xkk9l7lr] {
    background: linear-gradient(135deg, #ef4444 0%, #dc2626 100%);
    color: white;
    box-shadow: 0 2px 8px rgba(239, 68, 68, 0.3);
}

.action-buttons .btn:hover[b-c7xkk9l7lr] {
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
}

/* User Count Component */
.user-count-display[b-c7xkk9l7lr] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.business-units-grid .count-number[b-c7xkk9l7lr],
.business-units-grid .e-grid .e-rowcell .count-number[b-c7xkk9l7lr],
.count-number[b-c7xkk9l7lr] {
    font-weight: 700 !important;
    font-size: 1rem !important;
    padding: 0.5rem 1rem !important;
    border-radius: 20px !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 0.5rem !important;
}

.business-units-grid .count-success[b-c7xkk9l7lr],
.business-units-grid .e-grid .e-rowcell .count-success[b-c7xkk9l7lr],
.count-success[b-c7xkk9l7lr] {
    background: linear-gradient(135deg, #d1fae5 0%, #a7f3d0 100%) !important;
    color: #065f46 !important;
    border: 1px solid #6ee7b7 !important;
}

.business-units-grid .count-warning[b-c7xkk9l7lr],
.business-units-grid .e-grid .e-rowcell .count-warning[b-c7xkk9l7lr],
.count-warning[b-c7xkk9l7lr] {
    background: linear-gradient(135deg, #fef3c7 0%, #fde68a 100%) !important;
    color: #92400e !important;
    border: 1px solid #f59e0b !important;
}

.count-label[b-c7xkk9l7lr] {
    color: #6b7280;
    font-size: 0.9rem;
}

.warning-indicator[b-c7xkk9l7lr] {
    color: #f59e0b;
    font-size: 0.8rem;
}

.success-indicator[b-c7xkk9l7lr] {
    color: #059669;
    font-size: 0.8rem;
}

/* Badge Styles - High Specificity for Syncfusion Grid */
.business-units-grid .badge[b-c7xkk9l7lr],
.business-units-grid .e-grid .e-rowcell .badge[b-c7xkk9l7lr],
.badge[b-c7xkk9l7lr] {
    padding: 0.5rem 1rem !important;
    border-radius: 20px !important;
    font-weight: 600 !important;
    font-size: 0.8rem !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 0.5rem !important;
    transition: all 0.2s ease !important;
    border: none !important;
    text-decoration: none !important;
}

.business-units-grid .badge-success[b-c7xkk9l7lr],
.business-units-grid .e-grid .e-rowcell .badge-success[b-c7xkk9l7lr],
.badge-success[b-c7xkk9l7lr] {
    background: linear-gradient(135deg, #10b981 0%, #059669 100%) !important;
    color: white !important;
    box-shadow: 0 2px 8px rgba(16, 185, 129, 0.3) !important;
}

.business-units-grid .badge-warning[b-c7xkk9l7lr],
.business-units-grid .e-grid .e-rowcell .badge-warning[b-c7xkk9l7lr],
.badge-warning[b-c7xkk9l7lr] {
    background: linear-gradient(135deg, #f59e0b 0%, #d97706 100%) !important;
    color: white !important;
    box-shadow: 0 2px 8px rgba(245, 158, 11, 0.3) !important;
}

.business-units-grid .badge-secondary[b-c7xkk9l7lr],
.business-units-grid .e-grid .e-rowcell .badge-secondary[b-c7xkk9l7lr],
.badge-secondary[b-c7xkk9l7lr] {
    background: linear-gradient(135deg, #6b7280 0%, #4b5563 100%) !important;
    color: white !important;
    box-shadow: 0 2px 8px rgba(107, 114, 128, 0.3) !important;
}

/* Loading State */
.loading-container[b-c7xkk9l7lr] {
    text-align: center;
    padding: 3rem;
}

.spinner[b-c7xkk9l7lr] {
    width: 2rem;
    height: 2rem;
    border: 3px solid #f3f4f6;
    border-top: 3px solid #0066cc;
    border-radius: 50%;
    animation: spin-b-c7xkk9l7lr 1s linear infinite;
    margin: 0 auto 1rem;
}

@keyframes spin-b-c7xkk9l7lr {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

/* Empty State */
.empty-state[b-c7xkk9l7lr] {
    text-align: center;
    padding: 3rem;
    color: #6b7280;
}

.empty-state i[b-c7xkk9l7lr] {
    color: #d1d5db;
    margin-bottom: 1rem;
}

.empty-state h3[b-c7xkk9l7lr] {
    color: #374151;
    margin-bottom: 0.5rem;
}

.empty-state p[b-c7xkk9l7lr] {
    margin-bottom: 1.5rem;
    max-width: 400px;
    margin-left: auto;
    margin-right: auto;
}

/* Modal Styles */
.modal-backdrop[b-c7xkk9l7lr] {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1050;
}

.modal-dialog[b-c7xkk9l7lr] {
    background: white;
    border-radius: 12px;
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.2);
    max-width: 600px;
    width: 90%;
    max-height: 90vh;
    overflow-y: auto;
}

.modal-confirm[b-c7xkk9l7lr] {
    max-width: 500px;
}

.modal-content[b-c7xkk9l7lr] {
    padding: 0;
}

.modal-header[b-c7xkk9l7lr] {
    padding: 1.5rem;
    border-bottom: 1px solid #e5e7eb;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.modal-title[b-c7xkk9l7lr] {
    margin: 0;
    font-size: 1.25rem;
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.btn-close[b-c7xkk9l7lr] {
    background: none;
    border: none;
    font-size: 1.5rem;
    cursor: pointer;
    color: #6b7280;
}

.modal-body[b-c7xkk9l7lr] {
    padding: 1.5rem;
}

.modal-footer[b-c7xkk9l7lr] {
    padding: 1.5rem;
    border-top: 1px solid #e5e7eb;
    display: flex;
    justify-content: flex-end;
    gap: 1rem;
}

/* Form Styles */
.form-group[b-c7xkk9l7lr] {
    margin-bottom: 1.5rem;
}

.form-label[b-c7xkk9l7lr] {
    display: block;
    margin-bottom: 0.5rem;
    font-weight: 500;
    color: #374151;
}

.form-control[b-c7xkk9l7lr] {
    width: 100%;
    padding: 0.75rem;
    border: 1px solid #d1d5db;
    border-radius: 6px;
    font-size: 1rem;
}

.form-control:focus[b-c7xkk9l7lr] {
    outline: none;
    border-color: #0066cc;
    box-shadow: 0 0 0 3px rgba(0, 102, 204, 0.1);
}

.form-text[b-c7xkk9l7lr] {
    font-size: 0.875rem;
    color: #6b7280;
    margin-top: 0.25rem;
}

.form-check[b-c7xkk9l7lr] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.form-check-input[b-c7xkk9l7lr] {
    width: auto;
}

/* Info Sections */
.info-section[b-c7xkk9l7lr] {
    margin-top: 1.5rem;
    padding-top: 1.5rem;
    border-top: 1px solid #e5e7eb;
}

.info-section h6[b-c7xkk9l7lr] {
    margin-bottom: 1rem;
    color: #374151;
    font-weight: 600;
}

.stats-row[b-c7xkk9l7lr] {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
}

.stat-item[b-c7xkk9l7lr] {
    display: flex;
    flex-direction: column;
    min-width: 120px;
}

.stat-label[b-c7xkk9l7lr] {
    font-size: 0.875rem;
    color: #6b7280;
}

.stat-value[b-c7xkk9l7lr] {
    font-weight: 500;
    color: #374151;
}

/* Anonymity Info */
.anonymity-info[b-c7xkk9l7lr] {
    margin-top: 1.5rem;
}

.info-card[b-c7xkk9l7lr] {
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    overflow: hidden;
}

.info-card.border-warning[b-c7xkk9l7lr] {
    border-color: #fbbf24;
}

.info-header[b-c7xkk9l7lr] {
    background: #f8fafc;
    padding: 1rem;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-weight: 500;
}

.info-content[b-c7xkk9l7lr] {
    padding: 1rem;
}

.requirements-list[b-c7xkk9l7lr] {
    margin: 0.5rem 0 0 1rem;
    color: #6b7280;
}

/* Alert Styles */
.alert[b-c7xkk9l7lr] {
    padding: 0.75rem 1rem;
    border-radius: 6px;
    margin-bottom: 1rem;
    position: relative;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.alert-success[b-c7xkk9l7lr] {
    background-color: #d1fae5;
    color: #065f46;
    border: 1px solid #a7f3d0;
}

.alert-warning[b-c7xkk9l7lr] {
    background-color: #fef3c7;
    color: #92400e;
    border: 1px solid #fde68a;
}

.alert-danger[b-c7xkk9l7lr] {
    background-color: #fee2e2;
    color: #991b1b;
    border: 1px solid #fecaca;
}

/* Warning Box */
.warning-box[b-c7xkk9l7lr] {
    background: #fef3c7;
    border: 1px solid #fde68a;
    color: #92400e;
    padding: 0.75rem;
    border-radius: 6px;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-top: 1rem;
}

/* Minimum Users Info */
.minimum-users-info[b-c7xkk9l7lr] {
    margin-top: 2rem;
    margin-bottom: 2rem;
}

/* Responsive Design */
@media (max-width: 768px) {
    .business-units-container[b-c7xkk9l7lr] {
        padding: 1rem;
    }
    
    .page-header[b-c7xkk9l7lr] {
        flex-direction: column;
        gap: 1rem;
    }
    
    .stats-grid[b-c7xkk9l7lr] {
        grid-template-columns: 1fr;
        gap: 1rem;
    }
    
    .search-box[b-c7xkk9l7lr] {
        width: 100%;
    }
    
    .card-header[b-c7xkk9l7lr] {
        flex-direction: column;
        gap: 1rem;
        align-items: stretch;
    }
    
    .search-controls[b-c7xkk9l7lr] {
        justify-content: stretch;
    }
    
    .modal-dialog[b-c7xkk9l7lr] {
        margin: 1rem;
        width: calc(100% - 2rem);
    }
    
    .action-buttons[b-c7xkk9l7lr] {
        flex-direction: column;
    }
    
    .stats-row[b-c7xkk9l7lr] {
        flex-direction: column;
    }
}
/* /Features/Employer/BusinessUnits/Components/BusinessUnitForm.razor.rz.scp.css */
/* Business Unit Form Modal Styling */

/* Modal Backdrop */
.modal-backdrop[b-9jinvjemu8] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.5);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1000;
    backdrop-filter: blur(4px);
}

/* Modal Dialog */
.modal-dialog[b-9jinvjemu8] {
    background: white;
    border-radius: 20px;
    box-shadow: 0 24px 48px rgba(0, 0, 0, 0.2);
    max-width: 600px;
    width: 90%;
    max-height: 90vh;
    overflow-y: auto;
}

.modal-lg[b-9jinvjemu8] {
    max-width: 700px;
}

/* Modal Content */
.modal-content[b-9jinvjemu8] {
    padding: 0;
    border-radius: 20px;
    overflow: hidden;
}

/* Modal Header */
.modal-header[b-9jinvjemu8] {
    background: linear-gradient(135deg, #14213D 0%, #2E2E2E 100%);
    color: white;
    padding: 24px 32px;
    border-bottom: none;
    border-radius: 20px 20px 0 0;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.modal-title[b-9jinvjemu8] {
    margin: 0;
    font-size: 1.5rem;
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 12px;
}

.modal-title i[b-9jinvjemu8] {
    color: #C8A951;
    font-size: 1.25rem;
}

.btn-close[b-9jinvjemu8] {
    background: none;
    border: none;
    color: white;
    font-size: 1.5rem;
    cursor: pointer;
    opacity: 0.7;
    transition: opacity 0.2s;
    padding: 0;
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.btn-close:hover[b-9jinvjemu8] {
    opacity: 1;
}

.btn-close[b-9jinvjemu8]::before {
    content: "×";
    font-size: 24px;
    line-height: 1;
}

/* Modal Body */
.modal-body[b-9jinvjemu8] {
    padding: 32px;
    background: white;
}

/* Form Groups */
.form-group[b-9jinvjemu8] {
    margin-bottom: 24px;
}

.form-label[b-9jinvjemu8] {
    display: block;
    margin-bottom: 8px;
    font-weight: 600;
    color: #14213D;
    font-size: 1rem;
}

.form-control[b-9jinvjemu8] {
    width: 100%;
    padding: 12px 16px;
    border: 2px solid #E2E6EA;
    border-radius: 12px;
    font-size: 1rem;
    transition: all 0.3s ease;
    background: white;
}

.form-control:focus[b-9jinvjemu8] {
    outline: none;
    border-color: #C8A951;
    box-shadow: 0 0 0 4px rgba(200, 169, 81, 0.1);
}

.form-control[b-9jinvjemu8]::placeholder {
    color: #717188;
}

/* Text Area */
textarea.form-control[b-9jinvjemu8] {
    resize: vertical;
    min-height: 80px;
}

/* Form Text */
.form-text[b-9jinvjemu8] {
    font-size: 0.875rem;
    color: #717188;
    margin-top: 6px;
}

/* Checkbox */
.form-check[b-9jinvjemu8] {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 8px;
}

.form-check-input[b-9jinvjemu8] {
    width: 20px;
    height: 20px;
    border: 2px solid #E2E6EA;
    border-radius: 4px;
    cursor: pointer;
    transition: all 0.3s ease;
}

.form-check-input:checked[b-9jinvjemu8] {
    background-color: #C8A951;
    border-color: #C8A951;
}

.form-check-label[b-9jinvjemu8] {
    font-weight: 500;
    color: #14213D;
    cursor: pointer;
    margin: 0;
}

/* Info Sections */
.info-section[b-9jinvjemu8] {
    margin-top: 32px;
    padding-top: 24px;
    border-top: 1px solid #E2E6EA;
}

.info-section h6[b-9jinvjemu8] {
    margin-bottom: 16px;
    color: #14213D;
    font-weight: 600;
    font-size: 1.1rem;
}

.stats-row[b-9jinvjemu8] {
    display: flex;
    flex-wrap: wrap;
    gap: 24px;
}

.stat-item[b-9jinvjemu8] {
    display: flex;
    flex-direction: column;
    min-width: 140px;
}

.stat-label[b-9jinvjemu8] {
    font-size: 0.875rem;
    color: #717188;
    margin-bottom: 4px;
}

.stat-value[b-9jinvjemu8] {
    font-weight: 600;
    color: #14213D;
    font-size: 1rem;
}

/* Anonymity Info */
.anonymity-info[b-9jinvjemu8] {
    margin-top: 24px;
}

.info-card[b-9jinvjemu8] {
    border: 1px solid #E2E6EA;
    border-radius: 12px;
    overflow: hidden;
    background: white;
}

.info-header[b-9jinvjemu8] {
    background: #F8FAFC;
    padding: 16px 20px;
    display: flex;
    align-items: center;
    gap: 12px;
    font-weight: 600;
    color: #14213D;
    border-bottom: 1px solid #E2E6EA;
}

.info-header i[b-9jinvjemu8] {
    color: #C8A951;
    font-size: 1.1rem;
}

.info-content[b-9jinvjemu8] {
    padding: 20px;
}

.info-content p[b-9jinvjemu8] {
    margin-bottom: 16px;
    color: #2E2E2E;
    line-height: 1.5;
}

/* Alert Styles */
.alert[b-9jinvjemu8] {
    padding: 12px 16px;
    border-radius: 8px;
    margin-bottom: 0;
    display: flex;
    align-items: center;
    gap: 8px;
    font-weight: 500;
}

.alert-success[b-9jinvjemu8] {
    background-color: #f0f9f0;
    color: #16a34a;
    border: 1px solid #bbf7d0;
}

.alert-warning[b-9jinvjemu8] {
    background-color: #fef3cd;
    color: #92400e;
    border: 1px solid #fde68a;
}

.alert i[b-9jinvjemu8] {
    font-size: 1rem;
}

/* Modal Footer */
.modal-footer[b-9jinvjemu8] {
    padding: 24px 32px;
    border-top: 1px solid #E2E6EA;
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    background: #F8FAFC;
}

.modal-footer .btn[b-9jinvjemu8] {
    border-radius: 12px;
    padding: 12px 24px;
    font-weight: 600;
    font-size: 1rem;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    display: flex;
    align-items: center;
    gap: 8px;
    border: none;
    cursor: pointer;
}

.modal-footer .btn-secondary[b-9jinvjemu8] {
    background: #F1F5F9;
    color: #475569;
    border: 2px solid #E2E8F0;
}

.modal-footer .btn-secondary:hover[b-9jinvjemu8] {
    background: #E2E8F0;
    color: #334155;
    transform: translateY(-1px);
}

.modal-footer .btn-primary[b-9jinvjemu8] {
    background: linear-gradient(135deg, #C8A951 0%, #14213D 100%);
    color: white;
    box-shadow: 0 4px 12px rgba(20, 33, 61, 0.2);
}

.modal-footer .btn-primary:hover[b-9jinvjemu8] {
    background: linear-gradient(135deg, #14213D 0%, #C8A951 100%);
    transform: translateY(-2px);
    box-shadow: 0 8px 20px rgba(20, 33, 61, 0.3);
}

.modal-footer .btn-primary:disabled[b-9jinvjemu8] {
    background: #9CA3AF;
    cursor: not-allowed;
    transform: none;
    box-shadow: none;
}

.modal-footer .btn i[b-9jinvjemu8] {
    font-size: 0.9rem;
}

/* Validation Messages */
.validation-message[b-9jinvjemu8] {
    color: #dc2626;
    font-size: 0.875rem;
    margin-top: 6px;
    display: block;
}

/* Responsive Design */
@media (max-width: 768px) {
    .modal-dialog[b-9jinvjemu8] {
        width: 95%;
        margin: 1rem;
        max-height: calc(100vh - 2rem);
    }

    .modal-header[b-9jinvjemu8],
    .modal-body[b-9jinvjemu8],
    .modal-footer[b-9jinvjemu8] {
        padding: 20px;
    }

    .modal-title[b-9jinvjemu8] {
        font-size: 1.25rem;
    }

    .stats-row[b-9jinvjemu8] {
        flex-direction: column;
        gap: 16px;
    }

    .modal-footer[b-9jinvjemu8] {
        flex-direction: column;
    }

    .modal-footer .btn[b-9jinvjemu8] {
        width: 100%;
        justify-content: center;
    }
}

@media (max-width: 480px) {
    .modal-dialog[b-9jinvjemu8] {
        width: 100%;
        height: 100%;
        max-height: 100vh;
        border-radius: 0;
        margin: 0;
    }

    .modal-content[b-9jinvjemu8] {
        border-radius: 0;
        height: 100%;
        display: flex;
        flex-direction: column;
    }

    .modal-body[b-9jinvjemu8] {
        flex: 1;
        overflow-y: auto;
    }
}
/* /Features/Employer/SurveyDistribution/Components/DistributionAnalyticsModal.razor.rz.scp.css */
/* Distribution Analytics Modal Styles */
.modal-backdrop[b-u4vz2kufoj] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.5);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1000;
    backdrop-filter: blur(4px);
}

.modal-dialog[b-u4vz2kufoj] {
    background: white;
    border-radius: 20px;
    box-shadow: 0 24px 48px rgba(0, 0, 0, 0.2);
    max-width: 1200px;
    width: 95%;
    max-height: 90vh;
    overflow-y: auto;
}

.modal-xl[b-u4vz2kufoj] {
    max-width: 1200px;
}

.modal-content[b-u4vz2kufoj] {
    padding: 0;
    border-radius: 20px;
    overflow: hidden;
}

.modal-header[b-u4vz2kufoj] {
    background: linear-gradient(135deg, #14213D 0%, #2E2E2E 100%);
    color: white;
    padding: 24px 32px;
    border-bottom: 1px solid #E2E6EA;
    border-radius: 20px 20px 0 0;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.modal-title[b-u4vz2kufoj] {
    margin: 0;
    font-size: 1.5rem;
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 12px;
}

.modal-title i[b-u4vz2kufoj] {
    color: #C8A951;
    font-size: 1.25rem;
}

.btn-close[b-u4vz2kufoj] {
    background: none;
    border: none;
    color: white;
    font-size: 1.5rem;
    cursor: pointer;
    opacity: 0.7;
    transition: opacity 0.2s;
    padding: 0;
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.btn-close:hover[b-u4vz2kufoj] {
    opacity: 1;
}

.btn-close[b-u4vz2kufoj]::before {
    content: "×";
    font-size: 24px;
    line-height: 1;
}

.modal-body[b-u4vz2kufoj] {
    padding: 32px;
    background: white;
}

.modal-footer[b-u4vz2kufoj] {
    padding: 24px 32px;
    border-top: 1px solid #E2E6EA;
    display: flex;
    justify-content: flex-end;
    gap: 12px;
    background: white;
}

/* Analytics Specific Styles */
.analytics-container[b-u4vz2kufoj] {
    display: flex;
    flex-direction: column;
    gap: 32px;
}

.analytics-section[b-u4vz2kufoj] {
    background: #F8FAFC;
    border-radius: 12px;
    padding: 24px;
    border: 1px solid #E2E6EA;
}

.analytics-section h5[b-u4vz2kufoj] {
    color: #14213D;
    font-weight: 600;
    font-size: 1.25rem;
    margin-bottom: 20px;
    border-bottom: 2px solid #C8A951;
    padding-bottom: 8px;
}

.stats-grid[b-u4vz2kufoj] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 20px;
    margin-bottom: 20px;
}

.stat-card[b-u4vz2kufoj] {
    background: white;
    border-radius: 12px;
    padding: 20px;
    text-align: center;
    border: 1px solid #E2E6EA;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
}

.stat-value[b-u4vz2kufoj] {
    font-size: 2rem;
    font-weight: 700;
    color: #14213D;
    margin-bottom: 8px;
}

.stat-label[b-u4vz2kufoj] {
    color: #717188;
    font-size: 0.875rem;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.chart-placeholder[b-u4vz2kufoj] {
    background: white;
    border-radius: 12px;
    padding: 60px 20px;
    text-align: center;
    border: 2px dashed #E2E6EA;
    color: #717188;
}

.chart-placeholder i[b-u4vz2kufoj] {
    color: #C8A951;
    margin-bottom: 16px;
}

.chart-placeholder p[b-u4vz2kufoj] {
    font-size: 1.1rem;
    font-weight: 500;
    margin-bottom: 8px;
}

.chart-placeholder small[b-u4vz2kufoj] {
    font-size: 0.875rem;
}

/* Business Unit Breakdown */
.unit-breakdown[b-u4vz2kufoj] {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.unit-stat[b-u4vz2kufoj] {
    background: white;
    border-radius: 8px;
    padding: 16px 20px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    border: 1px solid #E2E6EA;
}

.unit-name[b-u4vz2kufoj] {
    font-weight: 600;
    color: #14213D;
}

.unit-response-rate[b-u4vz2kufoj] {
    font-weight: 500;
    color: #C8A951;
}

/* Responsive Design */
@media (max-width: 768px) {
    .modal-dialog[b-u4vz2kufoj] {
        width: 95%;
        margin: 1rem;
        max-height: calc(100vh - 2rem);
    }

    .modal-header[b-u4vz2kufoj],
    .modal-body[b-u4vz2kufoj],
    .modal-footer[b-u4vz2kufoj] {
        padding: 20px;
    }

    .modal-title[b-u4vz2kufoj] {
        font-size: 1.25rem;
    }

    .analytics-section[b-u4vz2kufoj] {
        padding: 20px;
    }

    .stats-grid[b-u4vz2kufoj] {
        grid-template-columns: repeat(2, 1fr);
        gap: 16px;
    }

    .stat-card[b-u4vz2kufoj] {
        padding: 16px;
    }

    .stat-value[b-u4vz2kufoj] {
        font-size: 1.5rem;
    }
}

@media (max-width: 480px) {
    .stats-grid[b-u4vz2kufoj] {
        grid-template-columns: 1fr;
    }
}
/* /Features/Employer/SurveyDistribution/Components/DistributionDetailsModal.razor.rz.scp.css */
/* Distribution Details Modal Styles */
.modal-backdrop[b-fiyx0p852n] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.5);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1000;
    backdrop-filter: blur(4px);
}

.modal-dialog[b-fiyx0p852n] {
    background: white;
    border-radius: 20px;
    box-shadow: 0 24px 48px rgba(0, 0, 0, 0.2);
    max-width: 800px;
    width: 90%;
    max-height: 90vh;
    overflow-y: auto;
}

.modal-lg[b-fiyx0p852n] {
    max-width: 900px;
}

.modal-content[b-fiyx0p852n] {
    padding: 0;
    border-radius: 20px;
    overflow: hidden;
}

.modal-header[b-fiyx0p852n] {
    background: linear-gradient(135deg, #14213D 0%, #2E2E2E 100%);
    color: white;
    padding: 24px 32px;
    border-bottom: 1px solid #E2E6EA;
    border-radius: 20px 20px 0 0;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.modal-title[b-fiyx0p852n] {
    margin: 0;
    font-size: 1.5rem;
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 12px;
}

.modal-title i[b-fiyx0p852n] {
    color: #C8A951;
    font-size: 1.25rem;
}

.btn-close[b-fiyx0p852n] {
    background: none;
    border: none;
    color: white;
    font-size: 1.5rem;
    cursor: pointer;
    opacity: 0.7;
    transition: opacity 0.2s;
    padding: 0;
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.btn-close:hover[b-fiyx0p852n] {
    opacity: 1;
}

.btn-close[b-fiyx0p852n]::before {
    content: "×";
    font-size: 24px;
    line-height: 1;
}

.modal-body[b-fiyx0p852n] {
    padding: 32px;
    background: white;
}

.modal-footer[b-fiyx0p852n] {
    padding: 24px 32px;
    border-top: 1px solid #E2E6EA;
    display: flex;
    justify-content: flex-end;
    gap: 12px;
    background: white;
}

/* Detail Sections */
.distribution-details[b-fiyx0p852n] {
    display: flex;
    flex-direction: column;
    gap: 28px;
}

.detail-section[b-fiyx0p852n] {
    background: #F8FAFC;
    border-radius: 12px;
    padding: 24px;
    border: 1px solid #E2E6EA;
}

.detail-section h5[b-fiyx0p852n] {
    color: #14213D;
    font-weight: 600;
    font-size: 1.25rem;
    margin-bottom: 20px;
    border-bottom: 2px solid #C8A951;
    padding-bottom: 8px;
}

.detail-item[b-fiyx0p852n] {
    margin-bottom: 16px;
}

.detail-item label[b-fiyx0p852n] {
    font-weight: 600;
    color: #717188;
    display: block;
    margin-bottom: 4px;
    font-size: 0.9rem;
}

.detail-item div[b-fiyx0p852n] {
    color: #14213D;
    font-weight: 500;
}

.status-badge[b-fiyx0p852n] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 12px;
    border-radius: 6px;
    font-size: 0.875rem;
    font-weight: 500;
}

.status-badge.active[b-fiyx0p852n] {
    background-color: #f0f9f0;
    color: #16a34a;
    border: 1px solid #bbf7d0;
}

.status-badge.completed[b-fiyx0p852n] {
    background-color: #eff6ff;
    color: #2563eb;
    border: 1px solid #bfdbfe;
}

.status-badge.pending[b-fiyx0p852n] {
    background-color: #fef3cd;
    color: #92400e;
    border: 1px solid #fde68a;
}

/* Responsive Design */
@media (max-width: 768px) {
    .modal-dialog[b-fiyx0p852n] {
        width: 95%;
        margin: 1rem;
        max-height: calc(100vh - 2rem);
    }

    .modal-header[b-fiyx0p852n],
    .modal-body[b-fiyx0p852n],
    .modal-footer[b-fiyx0p852n] {
        padding: 20px;
    }

    .modal-title[b-fiyx0p852n] {
        font-size: 1.25rem;
    }

    .detail-section[b-fiyx0p852n] {
        padding: 20px;
    }
}
/* /Features/Employer/SurveyDistribution/Components/DistributionModal.razor.rz.scp.css */
/* Distribution Modal Styles */
.modal-backdrop[b-uf8c0e7ltx] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(20, 33, 61, 0.8);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1050;
    backdrop-filter: blur(8px);
    animation: fadeIn-b-uf8c0e7ltx 0.3s ease-in-out;
}

@keyframes fadeIn-b-uf8c0e7ltx {
    from { opacity: 0; }
    to { opacity: 1; }
}

.modal-dialog[b-uf8c0e7ltx] {
    background: white;
    border-radius: 24px;
    box-shadow: 0 32px 64px rgba(20, 33, 61, 0.25);
    max-height: 90vh;
    overflow-y: auto;
    margin: 1rem;
    animation: slideUp-b-uf8c0e7ltx 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    border: 1px solid rgba(226, 230, 234, 0.3);
}

@keyframes slideUp-b-uf8c0e7ltx {
    from { 
        opacity: 0;
        transform: translateY(40px) scale(0.95);
    }
    to { 
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

.modal-xl[b-uf8c0e7ltx] {
    max-width: 900px;
    width: 95%;
}

.modal-content[b-uf8c0e7ltx] {
    border: none;
    border-radius: 24px;
    padding: 0;
    background: white;
    overflow: hidden;
}

.modal-header[b-uf8c0e7ltx] {
    background: linear-gradient(135deg, #14213D 0%, #2E2E2E 100%);
    color: white;
    padding: 24px 32px;
    border-bottom: 1px solid #E2E6EA;
    border-radius: 20px 20px 0 0;
    display: flex;
    justify-content: space-between;
    align-items: center;
}


.modal-title[b-uf8c0e7ltx] {
    margin: 0;
    font-size: 1.5rem;
    font-weight: 600;
    color: #14213D;
    display: flex;
    align-items: center;
    gap: 12px;
}

.modal-title i[b-uf8c0e7ltx] {
    color: #C8A951;
    font-size: 1.25rem;
}

.btn-close[b-uf8c0e7ltx] {
    background: none;
    border: none;
    color: white;
    font-size: 1.5rem;
    cursor: pointer;
    opacity: 0.7;
    transition: opacity 0.2s;
    padding: 0;
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.btn-close:hover[b-uf8c0e7ltx] {
    opacity: 1;
}

.btn-close[b-uf8c0e7ltx]::before {
    content: "×";
    font-size: 24px;
    line-height: 1;
}

.modal-body[b-uf8c0e7ltx] {
    padding: 32px;
    background: white;
}

.form-group[b-uf8c0e7ltx] {
    margin-bottom: 28px;
}

.form-label[b-uf8c0e7ltx] {
    color: #14213D;
    font-weight: 600;
    margin-bottom: 12px;
    display: block;
    font-size: 1rem;
    letter-spacing: -0.01em;
    text-transform: none;
}


.form-control[b-uf8c0e7ltx] {
    width: 100%;
    padding: 10px 14px;
    border: 1px solid #d1d5db;
    border-radius: 6px;
    font-size: 0.95rem;
    transition: all 0.2s ease;
    background: white;
    color: #374151;
}

.form-control:focus[b-uf8c0e7ltx] {
    outline: none;
    border-color: #C8A951;
    box-shadow: 0 0 0 3px rgba(200, 169, 81, 0.1);
}

.form-control[b-uf8c0e7ltx]::placeholder {
    color: #717188;
}

.form-check[b-uf8c0e7ltx] {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 8px;
}

.form-check-label[b-uf8c0e7ltx] {
    font-weight: 500;
    color: #14213D;
    cursor: pointer;
    margin: 0;
}

.form-check-input[b-uf8c0e7ltx] {
    width: 20px;
    height: 20px;
    border: 2px solid #E2E6EA;
    border-radius: 4px;
    cursor: pointer;
    transition: all 0.3s ease;
}

.form-check-input:checked[b-uf8c0e7ltx] {
    background-color: #C8A951;
    border-color: #C8A951;
}

/* Business Units Selection Styling */
.form-group:has(.form-check) .form-label[b-uf8c0e7ltx] {
    margin-bottom: 20px;
}

.business-units-grid[b-uf8c0e7ltx] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 12px;
    margin-top: 8px;
}

.form-check-label .unit-name[b-uf8c0e7ltx] {
    font-weight: 600;
    color: #14213D;
    display: block;
    line-height: 1.3;
}

.form-check-label .unit-count[b-uf8c0e7ltx] {
    color: #717188;
    font-size: 0.875rem;
    font-weight: 400;
    margin-top: 2px;
}

.modal-footer[b-uf8c0e7ltx] {
    padding: 20px 32px 24px 32px;
    border-top: 1px solid #e5e7eb;
    display: flex;
    justify-content: flex-end;
    gap: 12px;
    background: white;
}

.modal-footer .btn[b-uf8c0e7ltx] {
    border-radius: 8px;
    padding: 10px 20px;
    font-weight: 500;
    font-size: 0.95rem;
    transition: all 0.2s ease;
    display: flex;
    align-items: center;
    gap: 8px;
    border: 1px solid transparent;
    cursor: pointer;
    min-width: 100px;
    justify-content: center;
}

.modal-footer .btn-primary[b-uf8c0e7ltx] {
    background: #C8A951;
    color: white;
    border: 1px solid #C8A951;
}

.modal-footer .btn-primary:hover:not(:disabled)[b-uf8c0e7ltx] {
    background: #b8973f;
    border-color: #b8973f;
}

.modal-footer .btn-primary:disabled[b-uf8c0e7ltx] {
    background: #d1d5db;
    color: #9ca3af;
    border-color: #d1d5db;
    cursor: not-allowed;
}

.modal-footer .btn-secondary[b-uf8c0e7ltx] {
    background: white;
    color: #6b7280;
    border: 1px solid #d1d5db;
}

.modal-footer .btn-secondary:hover[b-uf8c0e7ltx] {
    background: #f9fafb;
    color: #374151;
    border-color: #9ca3af;
}

/* Loading States */
.fa-spinner[b-uf8c0e7ltx] {
    animation: spin-b-uf8c0e7ltx 1s linear infinite;
}

@keyframes spin-b-uf8c0e7ltx {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

/* Validation Messages */
.validation-message[b-uf8c0e7ltx] {
    color: #dc3545;
    font-size: 0.875rem;
    margin-top: 8px;
    display: flex;
    align-items: center;
    gap: 6px;
    font-weight: 500;
}

.validation-message[b-uf8c0e7ltx]::before {
    content: '⚠';
    font-size: 1rem;
}

/* Responsive Design */
@media (max-width: 768px) {
    .modal-dialog[b-uf8c0e7ltx] {
        width: 95%;
        margin: 0.5rem;
        max-height: 95vh;
    }

    .modal-header[b-uf8c0e7ltx] {
        padding: 24px;
    }

    .modal-title[b-uf8c0e7ltx] {
        font-size: 1.25rem;
    }

    .modal-title i[b-uf8c0e7ltx] {
        font-size: 1.5rem;
    }

    .modal-body[b-uf8c0e7ltx] {
        padding: 24px;
    }

    .modal-footer[b-uf8c0e7ltx] {
        padding: 20px 24px;
        flex-direction: column;
        gap: 12px;
    }

    .modal-footer .btn[b-uf8c0e7ltx] {
        width: 100%;
        justify-content: center;
    }

    .business-units-grid[b-uf8c0e7ltx] {
        grid-template-columns: 1fr;
    }

    .form-control[b-uf8c0e7ltx] {
        padding: 14px 16px;
    }
}

@media (max-width: 480px) {
    .modal-dialog[b-uf8c0e7ltx] {
        width: 98%;
        margin: 0.25rem;
    }

    .modal-header[b-uf8c0e7ltx] {
        padding: 20px;
    }

    .modal-body[b-uf8c0e7ltx] {
        padding: 20px;
    }

    .modal-footer[b-uf8c0e7ltx] {
        padding: 16px 20px;
    }

    .form-group[b-uf8c0e7ltx] {
        margin-bottom: 20px;
    }

    .form-check[b-uf8c0e7ltx] {
        padding: 12px 16px;
    }
}

/* /Features/Employer/SurveyDistribution/SurveyDistributionPage.razor.rz.scp.css */
.survey-distribution-container[b-2l51ylrhb3] {
    padding: 2rem;
    margin: 0 auto;
}

.page-header[b-2l51ylrhb3] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 2rem;
    padding-bottom: 1rem;
    border-bottom: 1px solid #e0e0e0;
}

.header-content[b-2l51ylrhb3] {
    flex: 1;
}

.page-title[b-2l51ylrhb3] {
    color: #14213D;
    margin: 0.5rem 0;
    font-size: 2rem;
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 1rem;
}

.page-title i[b-2l51ylrhb3] {
    color: #C8A951;
    font-size: 1.75rem;
}

.page-description[b-2l51ylrhb3] {
    color: #717188;
    margin-bottom: 1rem;
    font-size: 1rem;
}

.header-actions[b-2l51ylrhb3] {
    display: flex;
    gap: 1rem;
    align-items: center;
}

.header-actions .btn[b-2l51ylrhb3] {
    border-radius: 16px;
    padding: 14px 28px;
    font-weight: 600;
    font-size: 1rem;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.header-actions .btn-primary[b-2l51ylrhb3] {
    background: linear-gradient(135deg, #C8A951 0%, #14213D 100%);
    color: white;
    border: none;
    box-shadow: 0 6px 20px rgba(20, 33, 61, 0.25);
}

.header-actions .btn-primary:hover[b-2l51ylrhb3] {
    background: linear-gradient(135deg, #14213D 0%, #C8A951 100%);
    transform: translateY(-3px);
    box-shadow: 0 12px 32px rgba(20, 33, 61, 0.35);
}

.header-actions .btn-outline-secondary[b-2l51ylrhb3] {
    background-color: #FFFFFF;
    color: #14213D;
    border: 2px solid #E2E6EA;
    box-shadow: 0 4px 16px rgba(20, 33, 61, 0.08);
}

.header-actions .btn-outline-secondary:hover[b-2l51ylrhb3] {
    border-color: #C8A951;
    color: #14213D;
    background-color: #FFFFFF;
    box-shadow: 0 8px 24px rgba(200, 169, 81, 0.2);
    transform: translateY(-2px);
}

.stats-grid[b-2l51ylrhb3] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 1.5rem;
    margin-bottom: 2rem;
}

.stat-card[b-2l51ylrhb3] {
    background: rgba(255, 255, 255, 0.95);
    border-radius: 20px;
    padding: 32px;
    box-shadow: 0 8px 32px rgba(20, 33, 61, 0.1);
    backdrop-filter: blur(10px);
    border: 1px solid rgba(226, 230, 234, 0.5);
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    display: flex;
    align-items: center;
    gap: 20px;
}

.stat-card:hover[b-2l51ylrhb3] {
    transform: translateY(-4px);
    box-shadow: 0 16px 48px rgba(20, 33, 61, 0.15);
    border-color: rgba(200, 169, 81, 0.3);
}

.stat-icon[b-2l51ylrhb3] {
    width: 56px;
    height: 56px;
    border-radius: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, #C8A951 0%, #14213D 100%);
    color: white;
    font-size: 1.5rem;
    flex-shrink: 0;
}

.stat-content[b-2l51ylrhb3] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.stat-value[b-2l51ylrhb3] {
    color: #14213D;
    font-size: 2rem;
    font-weight: 700;
    line-height: 1;
}

.stat-label[b-2l51ylrhb3] {
    color: #717188;
    font-size: 0.9rem;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.filters-section[b-2l51ylrhb3] {
    background: rgba(255, 255, 255, 0.95);
    border-radius: 20px;
    box-shadow: 0 8px 32px rgba(20, 33, 61, 0.1);
    backdrop-filter: blur(10px);
    border: 1px solid rgba(226, 230, 234, 0.5);
    padding: 1.5rem;
    margin-bottom: 1.5rem;
}

.main-content-card[b-2l51ylrhb3] {
    background: rgba(255, 255, 255, 0.95);
    border-radius: 20px;
    box-shadow: 0 8px 32px rgba(20, 33, 61, 0.1);
    backdrop-filter: blur(10px);
    border: 1px solid rgba(226, 230, 234, 0.5);
    overflow: hidden;
}

.card-header[b-2l51ylrhb3] {
    background: linear-gradient(135deg, #14213D 0%, #2E2E2E 100%);
    color: white;
    padding: 24px 32px;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.card-title[b-2l51ylrhb3] {
    font-size: 1.5rem;
    font-weight: 600;
    margin: 0;
    color: white;
}

.card-actions[b-2l51ylrhb3] {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.result-count[b-2l51ylrhb3] {
    color: rgba(255, 255, 255, 0.8);
    font-size: 0.9rem;
}

.card-content[b-2l51ylrhb3] {
    padding: 1.5rem;
}

.loading-container[b-2l51ylrhb3] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 60px 20px;
    text-align: center;
}

.loading-container p[b-2l51ylrhb3] {
    color: #717188;
    font-size: 1rem;
    margin: 0;
}

.spinner[b-2l51ylrhb3] {
    border: 4px solid #f3f3f3;
    border-top: 4px solid #C8A951;
    border-radius: 50%;
    width: 40px;
    height: 40px;
    animation: spin-b-2l51ylrhb3 1s linear infinite;
    margin-bottom: 20px;
}

@keyframes spin-b-2l51ylrhb3 {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

.empty-state[b-2l51ylrhb3] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 80px 20px;
    text-align: center;
}

.empty-state i[b-2l51ylrhb3] {
    color: #E2E6EA;
    margin-bottom: 20px;
}

.empty-state h3[b-2l51ylrhb3] {
    color: #14213D;
    font-size: 1.5rem;
    font-weight: 600;
    margin-bottom: 10px;
}

.empty-state p[b-2l51ylrhb3] {
    color: #717188;
    max-width: 400px;
    margin-bottom: 30px;
    font-size: 1rem;
}

.empty-actions[b-2l51ylrhb3] {
    display: flex;
    gap: 1rem;
    flex-wrap: wrap;
    justify-content: center;
}

.empty-actions .btn[b-2l51ylrhb3] {
    border-radius: 16px;
    padding: 14px 28px;
    font-weight: 600;
    font-size: 1rem;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.empty-actions .btn-primary[b-2l51ylrhb3] {
    background: linear-gradient(135deg, #C8A951 0%, #14213D 100%);
    color: white;
    border: none;
    box-shadow: 0 6px 20px rgba(20, 33, 61, 0.25);
}

.empty-actions .btn-primary:hover[b-2l51ylrhb3] {
    background: linear-gradient(135deg, #14213D 0%, #C8A951 100%);
    transform: translateY(-3px);
    box-shadow: 0 12px 32px rgba(20, 33, 61, 0.35);
}

/* Distribution Grid Styles */
.distributions-grid[b-2l51ylrhb3] {
    margin-top: 1rem;
}

.distributions-grid .survey-distribution-grid[b-2l51ylrhb3] {
    border-radius: 16px;
    overflow: hidden;
    box-shadow: 0 8px 32px rgba(20, 33, 61, 0.1);
}

/* Custom page-specific styles can be added here if needed */

/* Modal Styles */
.modal-backdrop[b-2l51ylrhb3] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.5);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1050;
    backdrop-filter: blur(4px);
}

.modal-dialog[b-2l51ylrhb3] {
    background: white;
    border-radius: 20px;
    box-shadow: 0 24px 48px rgba(0, 0, 0, 0.2);
    max-height: 90vh;
    overflow-y: auto;
    margin: 1rem;
}

.modal-xl[b-2l51ylrhb3] {
    max-width: 1200px;
    width: 90%;
}

.modal-lg[b-2l51ylrhb3] {
    max-width: 800px;
    width: 90%;
}

.modal-content[b-2l51ylrhb3] {
    border: none;
    border-radius: 20px;
    padding: 0;
    background-color: #FFFFFF;
    overflow: hidden;
}

.modal-header[b-2l51ylrhb3] {
    padding: 24px 32px;
    border-bottom: 1px solid #E2E6EA;
    background: linear-gradient(135deg, #FFFFFF 0%, #F8F9FA 100%);
    color: #14213D;
    border-radius: 20px 20px 0 0;
    display: flex;
    justify-content: space-between;
    align-items: center;
    box-shadow: 0 2px 8px rgba(20, 33, 61, 0.08);
}

.modal-title[b-2l51ylrhb3] {
    margin: 0;
    font-size: 1.25rem;
    font-weight: 600;
    color: #14213D;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.modal-title i[b-2l51ylrhb3] {
    color: #C8A951;
}

.btn-close[b-2l51ylrhb3] {
    background: none;
    border: none;
    font-size: 1.5rem;
    cursor: pointer;
    color: rgba(20, 33, 61, 0.7);
    padding: 0.25rem;
    transition: color 0.2s ease;
}

.btn-close:hover[b-2l51ylrhb3] {
    color: #14213D;
}

.modal-body[b-2l51ylrhb3] {
    padding: 32px;
    background-color: #FFFFFF;
}

.modal-body .form-group[b-2l51ylrhb3] {
    margin-bottom: 24px;
}

.modal-body .form-label[b-2l51ylrhb3] {
    color: #14213D;
    font-weight: 600;
    margin-bottom: 8px;
    display: block;
}

.modal-body .form-control[b-2l51ylrhb3] {
    border-radius: 12px;
    border: 2px solid #E2E6EA;
    padding: 12px 16px;
    font-size: 1rem;
    transition: all 0.3s ease;
}

.modal-body .form-control:focus[b-2l51ylrhb3] {
    border-color: #C8A951;
    box-shadow: 0 0 0 0.2rem rgba(200, 169, 81, 0.25);
    outline: none;
}

.modal-body .form-check[b-2l51ylrhb3] {
    margin-bottom: 12px;
}

.modal-body .form-check-label[b-2l51ylrhb3] {
    color: #2E2E2E;
    font-weight: 500;
    margin-left: 8px;
}

.modal-body .form-check-input[b-2l51ylrhb3] {
    border-radius: 4px;
    border: 2px solid #E2E6EA;
}

.modal-body .form-check-input:checked[b-2l51ylrhb3] {
    background-color: #C8A951;
    border-color: #C8A951;
}

/* Syncfusion Dropdown Styling */
.modal-body .iswara-dropdown[b-2l51ylrhb3] {
    border-radius: 12px;
    border: 2px solid #E2E6EA;
    font-size: 1rem;
    transition: all 0.3s ease;
}

.modal-body .iswara-dropdown:focus[b-2l51ylrhb3],
.modal-body .iswara-dropdown.e-input-focus[b-2l51ylrhb3] {
    border-color: #C8A951;
    box-shadow: 0 0 0 0.2rem rgba(200, 169, 81, 0.25);
}

.modal-body .iswara-dropdown .e-input[b-2l51ylrhb3] {
    padding: 12px 16px;
    border: none;
    background: transparent;
    color: #14213D;
}

.modal-body .iswara-dropdown .e-input[b-2l51ylrhb3]::placeholder {
    color: #717188;
}

.modal-body .iswara-dropdown .e-ddl-icon[b-2l51ylrhb3] {
    color: #C8A951;
}

.modal-body .iswara-dropdown .e-clear-icon[b-2l51ylrhb3] {
    color: #717188;
}

.modal-body .iswara-dropdown .e-clear-icon:hover[b-2l51ylrhb3] {
    color: #14213D;
}

.modal-footer[b-2l51ylrhb3] {
    padding: 24px 32px;
    border-top: 1px solid #E2E6EA;
    background-color: #FFFFFF;
    border-radius: 0 0 20px 20px;
    display: flex;
    justify-content: flex-end;
    gap: 12px;
}

.modal-footer .btn[b-2l51ylrhb3] {
    border-radius: 12px;
    padding: 12px 24px;
    font-weight: 600;
    font-size: 1rem;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    display: flex;
    align-items: center;
    gap: 8px;
}

.modal-footer .btn-primary[b-2l51ylrhb3] {
    background: linear-gradient(135deg, #C8A951 0%, #14213D 100%);
    color: white;
    border: none;
    box-shadow: 0 6px 20px rgba(20, 33, 61, 0.25);
}

.modal-footer .btn-primary:hover[b-2l51ylrhb3] {
    background: linear-gradient(135deg, #14213D 0%, #C8A951 100%);
    transform: translateY(-2px);
    box-shadow: 0 12px 32px rgba(20, 33, 61, 0.35);
}

.modal-footer .btn-primary:disabled[b-2l51ylrhb3] {
    background: #6c757d;
    cursor: not-allowed;
    transform: none;
    box-shadow: none;
}

.modal-footer .btn-secondary[b-2l51ylrhb3] {
    background: #f8f9fa;
    color: #14213D;
    border: 2px solid #E2E6EA;
    box-shadow: 0 4px 16px rgba(20, 33, 61, 0.08);
}

.modal-footer .btn-secondary:hover[b-2l51ylrhb3] {
    background: #e9ecef;
    border-color: #C8A951;
    color: #14213D;
    transform: translateY(-2px);
    box-shadow: 0 8px 24px rgba(200, 169, 81, 0.2);
}

.modal-footer .btn-danger[b-2l51ylrhb3] {
    background: #dc3545;
    color: white;
    border: none;
    box-shadow: 0 6px 20px rgba(220, 53, 69, 0.25);
}

.modal-footer .btn-danger:hover[b-2l51ylrhb3] {
    background: #c82333;
    transform: translateY(-2px);
    box-shadow: 0 12px 32px rgba(220, 53, 69, 0.35);
}

.modal-footer .btn-danger:disabled[b-2l51ylrhb3] {
    background: #6c757d;
    cursor: not-allowed;
    transform: none;
    box-shadow: none;
}

/* Responsive Design */
@media (max-width: 1024px) {
    .stats-grid[b-2l51ylrhb3] {
        grid-template-columns: repeat(2, 1fr);
        gap: 16px;
    }
}

@media (max-width: 768px) {
    .survey-distribution-container[b-2l51ylrhb3] {
        padding: 1rem;
    }
    
    .page-header[b-2l51ylrhb3] {
        flex-direction: column;
        align-items: flex-start;
        gap: 1rem;
    }

    .header-actions[b-2l51ylrhb3] {
        width: 100%;
        justify-content: stretch;
    }

    .header-actions .btn[b-2l51ylrhb3] {
        flex: 1;
        justify-content: center;
    }
    
    .stats-grid[b-2l51ylrhb3] {
        grid-template-columns: 1fr;
        gap: 12px;
    }

    .stat-card[b-2l51ylrhb3] {
        padding: 24px;
    }
    
    .distributions-table[b-2l51ylrhb3] {
        font-size: 0.9rem;
    }

    .card-header[b-2l51ylrhb3] {
        padding: 20px;
        flex-direction: column;
        align-items: flex-start;
        gap: 1rem;
    }
    
    .modal-dialog[b-2l51ylrhb3] {
        width: 95%;
        margin: 1rem;
    }

    .modal-header[b-2l51ylrhb3], .modal-body[b-2l51ylrhb3], .modal-footer[b-2l51ylrhb3] {
        padding: 20px;
    }

    .empty-actions[b-2l51ylrhb3] {
        flex-direction: column;
        width: 100%;
        max-width: 300px;
    }

    .empty-actions .btn[b-2l51ylrhb3] {
        width: 100%;
        justify-content: center;
    }
}

@media (max-width: 480px) {
    .survey-distribution-container[b-2l51ylrhb3] {
        padding: 0.5rem;
    }

    .page-title[b-2l51ylrhb3] {
        font-size: 1.5rem;
    }

    .page-title i[b-2l51ylrhb3] {
        font-size: 1.25rem;
    }

    .stat-card[b-2l51ylrhb3] {
        padding: 20px;
        gap: 16px;
    }

    .stat-icon[b-2l51ylrhb3] {
        width: 48px;
        height: 48px;
        font-size: 1.25rem;
    }

    .stat-value[b-2l51ylrhb3] {
        font-size: 1.5rem;
    }

    .card-header[b-2l51ylrhb3] {
        padding: 16px;
    }

    .card-header h3[b-2l51ylrhb3] {
        font-size: 1.25rem;
    }
}

/* Subscription Tier Styling */
.subscription-info[b-2l51ylrhb3] {
    float: right;
    font-size: 0.85rem;
    color: #717188;
    font-weight: 500;
}

.subscription-free[b-2l51ylrhb3],
.tier-badge-free[b-2l51ylrhb3] {
    background: linear-gradient(135deg, #6c757d 0%, #5a6268 100%);
    color: white;
    padding: 4px 12px;
    border-radius: 12px;
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    box-shadow: 0 2px 8px rgba(108, 117, 125, 0.25);
}

.subscription-bronze[b-2l51ylrhb3],
.tier-badge-bronze[b-2l51ylrhb3] {
    background: linear-gradient(135deg, #CD7F32 0%, #A0522D 100%);
    color: white;
    padding: 4px 12px;
    border-radius: 12px;
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    box-shadow: 0 2px 8px rgba(205, 127, 50, 0.25);
}

.subscription-silver[b-2l51ylrhb3],
.tier-badge-silver[b-2l51ylrhb3] {
    background: linear-gradient(135deg, #C0C0C0 0%, #808080 100%);
    color: white;
    padding: 4px 12px;
    border-radius: 12px;
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    box-shadow: 0 2px 8px rgba(192, 192, 192, 0.25);
}

.subscription-gold[b-2l51ylrhb3],
.tier-badge-gold[b-2l51ylrhb3] {
    background: linear-gradient(135deg, #C8A951 0%, #B8860B 100%);
    color: white;
    padding: 4px 12px;
    border-radius: 12px;
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    box-shadow: 0 2px 8px rgba(200, 169, 81, 0.25);
}

.subscription-platinum[b-2l51ylrhb3],
.tier-badge-platinum[b-2l51ylrhb3] {
    background: linear-gradient(135deg, #E5E4E2 0%, #B0C4DE 100%);
    color: #14213D;
    padding: 4px 12px;
    border-radius: 12px;
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    box-shadow: 0 2px 8px rgba(229, 228, 226, 0.25);
}

.tier-badge-all[b-2l51ylrhb3] {
    background: linear-gradient(135deg, #BFD8B8 0%, #8FBC8F 100%);
    color: #14213D;
    padding: 4px 12px;
    border-radius: 12px;
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    box-shadow: 0 2px 8px rgba(191, 216, 184, 0.25);
}

.tier-badge-unknown[b-2l51ylrhb3] {
    background: #6c757d;
    color: white;
    padding: 4px 12px;
    border-radius: 12px;
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    box-shadow: 0 2px 8px rgba(108, 117, 125, 0.25);
}

/* Template Dropdown Styling */
.template-dropdown-item[b-2l51ylrhb3] {
    padding: 8px 0;
}

.template-info[b-2l51ylrhb3] {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 4px;
}

.template-title[b-2l51ylrhb3] {
    color: #14213D;
    font-weight: 600;
    flex: 1;
}

.restriction-badge[b-2l51ylrhb3] {
    background: linear-gradient(135deg, #dc3545 0%, #c82333 100%);
    color: white;
    padding: 3px 8px;
    border-radius: 8px;
    font-size: 0.7rem;
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 4px;
    white-space: nowrap;
}

.template-meta[b-2l51ylrhb3] {
    color: #717188;
    font-size: 0.85rem;
}

.upgrade-link[b-2l51ylrhb3] {
    color: #C8A951;
    text-decoration: none;
    font-weight: 600;
}

.upgrade-link:hover[b-2l51ylrhb3] {
    color: #14213D;
    text-decoration: underline;
}

/* Form Text Enhancements */
.form-text[b-2l51ylrhb3] {
    margin-top: 8px;
    display: flex;
    align-items: flex-start;
    gap: 6px;
}

.form-text i[b-2l51ylrhb3] {
    margin-top: 2px;
    flex-shrink: 0;
}

.form-text.text-info[b-2l51ylrhb3] {
    color: #0d6efd !important;
}

.form-text.text-info i[b-2l51ylrhb3] {
    color: #0d6efd !important;
}
/* /Features/Employer/SurveyUsers/Components/AddExistingUserDropdown.razor.rz.scp.css */
/* Add Existing User Dropdown Styling */
.add-user-dropdown[b-31tf3gpt6c] {
    position: relative;
    width: 100%;
}

.user-dropdown-item[b-31tf3gpt6c] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 8px;
    transition: background-color 0.2s ease;
}

.user-dropdown-item:hover[b-31tf3gpt6c] {
    background-color: rgba(200, 169, 81, 0.1);
}

.user-avatar-small[b-31tf3gpt6c] {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: linear-gradient(135deg, #C8A951 0%, #14213D 100%);
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    font-weight: 600;
    font-size: 0.8rem;
    flex-shrink: 0;
}

.user-info[b-31tf3gpt6c] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    flex: 1;
    min-width: 0;
}

.user-name[b-31tf3gpt6c] {
    font-weight: 600;
    color: #14213D;
    font-size: 0.9rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.user-email[b-31tf3gpt6c] {
    font-size: 0.8rem;
    color: #717188;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.loading-spinner[b-31tf3gpt6c] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 12px;
    color: #717188;
    font-size: 0.9rem;
}

.loading-spinner i[b-31tf3gpt6c] {
    color: #C8A951;
}

.error-message[b-31tf3gpt6c] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 12px;
    color: #dc3545;
    font-size: 0.9rem;
    background: rgba(220, 53, 69, 0.1);
    border-radius: 6px;
    margin-top: 8px;
}

/* Syncfusion Dropdown Styling */
.add-user-dropdown .user-dropdown .e-input-group[b-31tf3gpt6c] {
    border-radius: 16px;
    border: 2px solid #E2E6EA;
    background: #FFFFFF;
    box-shadow: 0 4px 16px rgba(20, 33, 61, 0.08);
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.add-user-dropdown .user-dropdown .e-input-group:hover[b-31tf3gpt6c] {
    border-color: #C8A951;
    box-shadow: 0 8px 24px rgba(200, 169, 81, 0.15);
}

.add-user-dropdown .user-dropdown .e-input-group.e-input-focus[b-31tf3gpt6c] {
    border-color: #C8A951;
    box-shadow: 0 0 0 3px rgba(200, 169, 81, 0.1);
}

.add-user-dropdown .user-dropdown .e-ddl-input[b-31tf3gpt6c] {
    padding: 14px 16px;
    font-size: 1rem;
    color: #14213D;
    background: transparent;
    border: none;
    outline: none;
}

.add-user-dropdown .user-dropdown .e-ddl-input[b-31tf3gpt6c]::placeholder {
    color: #717188;
    font-style: italic;
}

/* Clear Button Styling */
.add-user-dropdown .user-dropdown .e-clear-icon[b-31tf3gpt6c] {
    color: #717188;
    font-size: 1rem;
    right: 12px;
    transition: color 0.2s ease;
}

.add-user-dropdown .user-dropdown .e-clear-icon:hover[b-31tf3gpt6c] {
    color: #14213D;
}

/* Dropdown Icon */
.add-user-dropdown .user-dropdown .e-input-group .e-ddl-icon[b-31tf3gpt6c] {
    color: #C8A951;
    font-size: 1rem;
    right: 12px;
    transition: transform 0.3s ease;
}

.add-user-dropdown .user-dropdown .e-input-group.e-input-focus .e-ddl-icon[b-31tf3gpt6c] {
    transform: rotate(180deg);
}

/* Dropdown List Styling */
.add-user-dropdown .user-dropdown .e-popup[b-31tf3gpt6c] {
    border-radius: 16px;
    border: 2px solid #E2E6EA;
    box-shadow: 0 16px 48px rgba(20, 33, 61, 0.15);
    backdrop-filter: blur(10px);
    margin-top: 4px;
}

.add-user-dropdown .user-dropdown .e-popup .e-list-parent[b-31tf3gpt6c] {
    background: rgba(255, 255, 255, 0.95);
    border-radius: 14px;
    overflow: hidden;
}

/* Selected Item Styling */
.add-user-dropdown .user-dropdown .e-popup .e-list-item.e-item-focus[b-31tf3gpt6c],
.add-user-dropdown .user-dropdown .e-popup .e-list-item.e-active[b-31tf3gpt6c] {
    background: linear-gradient(135deg, rgba(200, 169, 81, 0.15) 0%, rgba(191, 216, 184, 0.15) 100%);
    color: #14213D;
}

/* Filter Input Styling */
.add-user-dropdown .user-dropdown .e-popup .e-filter-parent[b-31tf3gpt6c] {
    padding: 12px;
    border-bottom: 1px solid #E2E6EA;
    background: #F8F9FA;
}

.add-user-dropdown .user-dropdown .e-popup .e-filter-parent .e-input-group[b-31tf3gpt6c] {
    border-radius: 8px;
    border: 1px solid #E2E6EA;
    box-shadow: none;
}

.add-user-dropdown .user-dropdown .e-popup .e-filter-parent .e-input-group:focus-within[b-31tf3gpt6c] {
    border-color: #C8A951;
    box-shadow: 0 0 0 2px rgba(200, 169, 81, 0.1);
}

/* No Data Styling */
.add-user-dropdown .user-dropdown .e-popup .e-list-parent .e-list-item.e-list-ndata[b-31tf3gpt6c] {
    padding: 20px;
    text-align: center;
    color: #717188;
    font-style: italic;
    background: rgba(255, 255, 255, 0.8);
}

/* Responsive design */
@media (max-width: 768px) {
    .user-dropdown[b-31tf3gpt6c] {
        width: 100% !important;
    }
    
    .user-dropdown-item[b-31tf3gpt6c] {
        padding: 12px 8px;
    }
    
    .user-avatar-small[b-31tf3gpt6c] {
        width: 28px;
        height: 28px;
        font-size: 0.7rem;
    }
    
    .user-name[b-31tf3gpt6c] {
        font-size: 0.85rem;
    }
    
    .user-email[b-31tf3gpt6c] {
        font-size: 0.75rem;
    }
}
/* /Features/Employer/SurveyUsers/Components/BusinessUnitAssignmentModal.razor.rz.scp.css */
/* Business Unit Assignment Modal Styling */

/* Modal Backdrop */
.modal-backdrop[b-5npv2i8kcw] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.5);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1000;
    backdrop-filter: blur(4px);
}

/* Modal Dialog */
.modal-dialog[b-5npv2i8kcw] {
    background: white;
    border-radius: 20px;
    box-shadow: 0 24px 48px rgba(0, 0, 0, 0.2);
    max-width: 600px;
    width: 90%;
    max-height: 90vh;
    overflow-y: auto;
}

.modal-md[b-5npv2i8kcw] {
    max-width: 650px;
}

/* Modal Content */
.modal-content[b-5npv2i8kcw] {
    padding: 0;
    border-radius: 20px;
    overflow: hidden;
}

/* Modal Header */
.modal-header[b-5npv2i8kcw] {
    background: linear-gradient(135deg, #14213D 0%, #2E2E2E 100%);
    color: white;
    padding: 24px 32px;
    border-bottom: none;
    border-radius: 20px 20px 0 0;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.modal-title[b-5npv2i8kcw] {
    margin: 0;
    font-size: 1.5rem;
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 12px;
}

.modal-title i[b-5npv2i8kcw] {
    color: #C8A951;
    font-size: 1.25rem;
}

.btn-close[b-5npv2i8kcw] {
    background: none;
    border: none;
    color: white;
    font-size: 1.5rem;
    cursor: pointer;
    opacity: 0.7;
    transition: opacity 0.2s;
    padding: 0;
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.btn-close:hover[b-5npv2i8kcw] {
    opacity: 1;
}

.btn-close[b-5npv2i8kcw]::before {
    content: "×";
    font-size: 24px;
    line-height: 1;
}

/* Modal Body */
.modal-body[b-5npv2i8kcw] {
    padding: 32px;
    background: white;
}

/* User Info Section */
.user-info[b-5npv2i8kcw] {
    margin-bottom: 32px;
    padding-bottom: 24px;
    border-bottom: 1px solid #E2E6EA;
}

.user-info h6[b-5npv2i8kcw] {
    color: #14213D;
    font-weight: 600;
    font-size: 1.1rem;
    margin-bottom: 16px;
}

.user-details[b-5npv2i8kcw] {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.detail-item[b-5npv2i8kcw] {
    display: flex;
    align-items: center;
    gap: 12px;
}

.detail-label[b-5npv2i8kcw] {
    font-weight: 600;
    color: #717188;
    min-width: 100px;
}

.detail-value[b-5npv2i8kcw] {
    color: #14213D;
    font-weight: 500;
}

/* Assignment Section */
.assignment-section h6[b-5npv2i8kcw] {
    color: #14213D;
    font-weight: 600;
    font-size: 1.1rem;
    margin-bottom: 20px;
}

/* Business Unit Options */
.business-unit-options[b-5npv2i8kcw] {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.unit-option[b-5npv2i8kcw] {
    display: flex;
    align-items: flex-start;
    gap: 12px;
}

.unit-option input[type="radio"][b-5npv2i8kcw] {
    margin-top: 4px;
    width: 20px;
    height: 20px;
    cursor: pointer;
    accent-color: #C8A951;
}

.unit-label[b-5npv2i8kcw] {
    flex: 1;
    cursor: pointer;
    padding: 16px 20px;
    border: 2px solid #E2E6EA;
    border-radius: 12px;
    transition: all 0.3s ease;
    background: white;
}

.unit-label:hover[b-5npv2i8kcw] {
    border-color: #C8A951;
    background: #FEFDF8;
}

.unit-option input[type="radio"]:checked + .unit-label[b-5npv2i8kcw] {
    border-color: #C8A951;
    background: linear-gradient(135deg, #FEFDF8 0%, #F9F7F0 100%);
    box-shadow: 0 4px 12px rgba(200, 169, 81, 0.15);
}

.unit-content[b-5npv2i8kcw] {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.unit-name[b-5npv2i8kcw] {
    display: flex;
    align-items: center;
    gap: 8px;
    font-weight: 600;
    color: #14213D;
    font-size: 1rem;
}

.unit-name i[b-5npv2i8kcw] {
    color: #C8A951;
    font-size: 1rem;
}

.user-count[b-5npv2i8kcw] {
    font-weight: 400;
    color: #717188;
    font-size: 0.9rem;
}

.unit-description[b-5npv2i8kcw] {
    color: #717188;
    font-size: 0.9rem;
    margin-left: 24px;
}

.anonymity-status[b-5npv2i8kcw] {
    margin-left: 24px;
    margin-top: 4px;
}

.status-badge[b-5npv2i8kcw] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 4px 12px;
    border-radius: 6px;
    font-size: 0.8rem;
    font-weight: 500;
}

.status-badge.success[b-5npv2i8kcw] {
    background-color: #f0f9f0;
    color: #16a34a;
    border: 1px solid #bbf7d0;
}

.status-badge.warning[b-5npv2i8kcw] {
    background-color: #fef3cd;
    color: #92400e;
    border: 1px solid #fde68a;
}

.status-badge i[b-5npv2i8kcw] {
    font-size: 0.75rem;
}

/* No Units Message */
.no-units-message[b-5npv2i8kcw] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 16px 20px;
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    color: #64748b;
    font-style: italic;
}

.no-units-message i[b-5npv2i8kcw] {
    color: #94a3b8;
    font-size: 1.1rem;
}

/* Modal Footer */
.modal-footer[b-5npv2i8kcw] {
    padding: 24px 32px;
    border-top: 1px solid #E2E6EA;
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    background: #F8FAFC;
}

.modal-footer .btn[b-5npv2i8kcw] {
    border-radius: 12px;
    padding: 12px 24px;
    font-weight: 600;
    font-size: 1rem;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    display: flex;
    align-items: center;
    gap: 8px;
    border: none;
    cursor: pointer;
}

.modal-footer .btn-secondary[b-5npv2i8kcw] {
    background: #F1F5F9;
    color: #475569;
    border: 2px solid #E2E8F0;
}

.modal-footer .btn-secondary:hover[b-5npv2i8kcw] {
    background: #E2E8F0;
    color: #334155;
    transform: translateY(-1px);
}

.modal-footer .btn-primary[b-5npv2i8kcw] {
    background: linear-gradient(135deg, #C8A951 0%, #14213D 100%);
    color: white;
    box-shadow: 0 4px 12px rgba(20, 33, 61, 0.2);
}

.modal-footer .btn-primary:hover[b-5npv2i8kcw] {
    background: linear-gradient(135deg, #14213D 0%, #C8A951 100%);
    transform: translateY(-2px);
    box-shadow: 0 8px 20px rgba(20, 33, 61, 0.3);
}

.modal-footer .btn-primary:disabled[b-5npv2i8kcw] {
    background: #9CA3AF;
    cursor: not-allowed;
    transform: none;
    box-shadow: none;
}

.modal-footer .btn i[b-5npv2i8kcw] {
    font-size: 0.9rem;
}

/* Responsive Design */
@media (max-width: 768px) {
    .modal-dialog[b-5npv2i8kcw] {
        width: 95%;
        margin: 1rem;
        max-height: calc(100vh - 2rem);
    }

    .modal-header[b-5npv2i8kcw],
    .modal-body[b-5npv2i8kcw],
    .modal-footer[b-5npv2i8kcw] {
        padding: 20px;
    }

    .modal-title[b-5npv2i8kcw] {
        font-size: 1.25rem;
    }

    .user-details[b-5npv2i8kcw] {
        gap: 8px;
    }

    .detail-item[b-5npv2i8kcw] {
        flex-direction: column;
        align-items: flex-start;
        gap: 4px;
    }

    .detail-label[b-5npv2i8kcw] {
        min-width: auto;
        font-size: 0.9rem;
    }

    .modal-footer[b-5npv2i8kcw] {
        flex-direction: column;
    }

    .modal-footer .btn[b-5npv2i8kcw] {
        width: 100%;
        justify-content: center;
    }
}

@media (max-width: 480px) {
    .modal-dialog[b-5npv2i8kcw] {
        width: 100%;
        height: 100%;
        max-height: 100vh;
        border-radius: 0;
        margin: 0;
    }

    .modal-content[b-5npv2i8kcw] {
        border-radius: 0;
        height: 100%;
        display: flex;
        flex-direction: column;
    }

    .modal-body[b-5npv2i8kcw] {
        flex: 1;
        overflow-y: auto;
    }

    .unit-description[b-5npv2i8kcw],
    .anonymity-status[b-5npv2i8kcw] {
        margin-left: 0;
    }
}
/* /Features/Employer/SurveyUsers/Components/SurveyUserForm.razor.rz.scp.css */
/* Survey User Form Modal Styling */

/* Modal Backdrop */
.modal-backdrop[b-bb6q4ul938] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.4);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1000;
    backdrop-filter: blur(2px);
}

/* Modal Dialog */
.modal-dialog[b-bb6q4ul938] {
    background: white;
    border-radius: 20px;
    box-shadow: 0 24px 48px rgba(0, 0, 0, 0.2);
    max-width: 700px;
    width: 90%;
    max-height: 90vh;
    overflow-y: auto;
}

.modal-lg[b-bb6q4ul938] {
    max-width: 800px;
}

/* Modal Content */
.modal-content[b-bb6q4ul938] {
    padding: 0;
    border-radius: 20px;
    overflow: hidden;
    background: white;
}

/* Modal Header */
.modal-header[b-bb6q4ul938] {
    background: linear-gradient(135deg, #14213D 0%, #2E2E2E 100%);
    color: white;
    padding: 24px 32px;
    border-bottom: 1px solid #E2E6EA;
    border-radius: 20px 20px 0 0;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.modal-title[b-bb6q4ul938] {
    margin: 0;
    font-size: 1.5rem;
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 12px;
}

.modal-title i[b-bb6q4ul938] {
    color: #C8A951;
    font-size: 1.25rem;
}

.btn-close[b-bb6q4ul938] {
    background: none;
    border: none;
    color: white;
    font-size: 1.5rem;
    cursor: pointer;
    opacity: 0.7;
    transition: opacity 0.2s;
    padding: 0;
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 6px;
}

.btn-close:hover[b-bb6q4ul938] {
    opacity: 1;
}

.btn-close[b-bb6q4ul938]::before {
    content: "×";
    font-size: 24px;
    line-height: 1;
}

/* Modal Body */
.modal-body[b-bb6q4ul938] {
    padding: 32px;
    background: white;
}

/* User Mode Toggle */
.user-mode-toggle[b-bb6q4ul938] {
    margin-bottom: 25px;
}

.user-mode-toggle .btn-group[b-bb6q4ul938] {
    border-radius: 8px;
    overflow: hidden;
    width: 100%;
    border: 1px solid #e5e7eb;
}

.user-mode-toggle .btn[b-bb6q4ul938] {
    flex: 1;
    padding: 12px 20px;
    font-weight: 500;
    border: none;
    background: white;
    color: #6b7280;
    transition: all 0.2s ease;
    border-radius: 0;
    font-size: 0.95rem;
    border-right: 1px solid #e5e7eb;
}

.user-mode-toggle .btn:last-child[b-bb6q4ul938] {
    border-right: none;
}

.user-mode-toggle .btn-check:checked + .btn[b-bb6q4ul938] {
    background: #C8A951;
    color: white;
    font-weight: 600;
}

.user-mode-toggle .btn:hover:not(.btn-check:checked + .btn)[b-bb6q4ul938] {
    background: #f9fafb;
    color: #374151;
}

.user-mode-toggle .btn i[b-bb6q4ul938] {
    margin-right: 8px;
    font-size: 1rem;
}

/* Existing User Dropdown */
.loading-users[b-bb6q4ul938] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 16px;
    background: linear-gradient(135deg, #f8f9fa, #BFD8B8);
    border-radius: 12px;
    color: #14213D;
    border: 2px solid #E2E6EA;
}

.loading-users i[b-bb6q4ul938] {
    color: #C8A951;
    animation: spin-b-bb6q4ul938 1s linear infinite;
}

.no-users-available[b-bb6q4ul938] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 16px;
    background: #f8f9fa;
    border-radius: 12px;
    color: #666;
    border: 2px dashed #ddd;
}

.no-users-available i[b-bb6q4ul938] {
    color: #999;
    font-size: 1.1rem;
}

/* User Dropdown Styling */
[b-bb6q4ul938] .user-dropdown .e-input-group {
    border-radius: 12px;
    border: 2px solid #E2E6EA;
    transition: all 0.3s ease;
    overflow: hidden;
}

[b-bb6q4ul938] .user-dropdown .e-input-group:hover {
    border-color: #C8A951;
    box-shadow: 0 4px 12px rgba(200, 169, 81, 0.15);
}

[b-bb6q4ul938] .user-dropdown .e-input-group.e-input-focus {
    border-color: #C8A951;
    box-shadow: 0 0 0 4px rgba(200, 169, 81, 0.1);
}

[b-bb6q4ul938] .user-dropdown .e-input {
    padding: 14px 16px;
    font-size: 1rem;
    background: white;
}

.user-dropdown-item[b-bb6q4ul938] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px 0;
    transition: all 0.2s ease;
}

.user-dropdown-item:hover[b-bb6q4ul938] {
    background: rgba(200, 169, 81, 0.05);
}

.user-avatar-small[b-bb6q4ul938] {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: linear-gradient(135deg, #14213D, #C8A951);
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    font-weight: 600;
    font-size: 14px;
    flex-shrink: 0;
    box-shadow: 0 2px 6px rgba(20, 33, 61, 0.2);
}

.user-info[b-bb6q4ul938] {
    flex: 1;
}

.user-name[b-bb6q4ul938] {
    font-weight: 600;
    color: #14213D;
    font-size: 0.95rem;
    margin-bottom: 2px;
}

.user-email[b-bb6q4ul938] {
    color: #666;
    font-size: 0.85rem;
}

@keyframes spin-b-bb6q4ul938 {
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); }
}

/* Form Groups */
.form-group[b-bb6q4ul938] {
    margin-bottom: 24px;
}

.form-label[b-bb6q4ul938] {
    display: block;
    margin-bottom: 8px;
    font-weight: 600;
    color: #14213D;
    font-size: 1rem;
}

.form-control[b-bb6q4ul938] {
    width: 100%;
    padding: 10px 14px;
    border: 1px solid #d1d5db;
    border-radius: 6px;
    font-size: 0.95rem;
    transition: all 0.2s ease;
    background: white;
    color: #374151;
}

.form-control:focus[b-bb6q4ul938] {
    outline: none;
    border-color: #C8A951;
    box-shadow: 0 0 0 3px rgba(200, 169, 81, 0.1);
}

.form-control[b-bb6q4ul938]::placeholder {
    color: #717188;
}

/* Form Select */
.form-select[b-bb6q4ul938] {
    width: 100%;
    padding: 10px 14px;
    border: 1px solid #d1d5db;
    border-radius: 6px;
    font-size: 0.95rem;
    transition: all 0.2s ease;
    background: white;
    cursor: pointer;
    color: #374151;
}

.form-select:focus[b-bb6q4ul938] {
    outline: none;
    border-color: #C8A951;
    box-shadow: 0 0 0 3px rgba(200, 169, 81, 0.1);
}

/* Email Input Group */
.email-input-group[b-bb6q4ul938] {
    position: relative;
}

.email-validation-spinner[b-bb6q4ul938],
.email-validation-icon[b-bb6q4ul938] {
    position: absolute;
    right: 12px;
    top: 50%;
    transform: translateY(-50%);
    display: flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
}

.email-validation-icon.valid[b-bb6q4ul938] {
    color: #16a34a;
}

.email-validation-icon.invalid[b-bb6q4ul938] {
    color: #dc2626;
}

.email-validation-spinner i[b-bb6q4ul938] {
    color: #C8A951;
}

/* Form Text */
.form-text[b-bb6q4ul938] {
    font-size: 0.875rem;
    color: #717188;
    margin-top: 6px;
}

/* Row Layout */
.row[b-bb6q4ul938] {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    margin: -10px;
}

.col-md-6[b-bb6q4ul938] {
    flex: 1;
    min-width: 250px;
    padding: 10px;
}

/* Checkbox */
.form-check[b-bb6q4ul938] {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 8px;
}

.form-check-input[b-bb6q4ul938] {
    width: 20px;
    height: 20px;
    border: 2px solid #E2E6EA;
    border-radius: 4px;
    cursor: pointer;
    transition: all 0.3s ease;
}

.form-check-input:checked[b-bb6q4ul938] {
    background-color: #C8A951;
    border-color: #C8A951;
}

.form-check-label[b-bb6q4ul938] {
    font-weight: 500;
    color: #14213D;
    cursor: pointer;
    margin: 0;
}

/* Info Sections */
.info-section[b-bb6q4ul938] {
    margin-top: 24px;
    padding: 20px;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    background: #f9fafb;
}

.info-section h6[b-bb6q4ul938] {
    margin-bottom: 16px;
    color: #374151;
    font-weight: 600;
    font-size: 1rem;
}

.stats-row[b-bb6q4ul938] {
    display: flex;
    flex-wrap: wrap;
    gap: 24px;
}

.stat-item[b-bb6q4ul938] {
    display: flex;
    flex-direction: column;
    min-width: 140px;
}

.stat-label[b-bb6q4ul938] {
    font-size: 0.875rem;
    color: #717188;
    margin-bottom: 4px;
}

.stat-value[b-bb6q4ul938] {
    font-weight: 600;
    color: #14213D;
    font-size: 1rem;
}

/* Business Unit Info */
.business-unit-info[b-bb6q4ul938] {
    margin-top: 20px;
}

.info-card[b-bb6q4ul938] {
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    overflow: hidden;
    background: white;
}

.info-header[b-bb6q4ul938] {
    background: #f9fafb;
    padding: 14px 18px;
    display: flex;
    align-items: center;
    gap: 10px;
    font-weight: 600;
    color: #374151;
    border-bottom: 1px solid #e5e7eb;
}

.info-header i[b-bb6q4ul938] {
    color: #C8A951;
    font-size: 1rem;
}

.info-content[b-bb6q4ul938] {
    padding: 18px;
}

.unit-stats[b-bb6q4ul938] {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    margin-bottom: 16px;
}

.unit-stat[b-bb6q4ul938] {
    display: flex;
    flex-direction: column;
    min-width: 120px;
}

.unit-stat .stat-label[b-bb6q4ul938] {
    font-size: 0.875rem;
    color: #717188;
    margin-bottom: 4px;
}

.unit-stat .stat-value[b-bb6q4ul938] {
    font-weight: 600;
    color: #14213D;
    display: flex;
    align-items: center;
    gap: 6px;
}

.unit-stat .stat-value i[b-bb6q4ul938] {
    font-size: 0.9rem;
}

.unit-description[b-bb6q4ul938] {
    color: #2E2E2E;
    line-height: 1.5;
    margin: 0;
}

/* Validation Messages */
.validation-message[b-bb6q4ul938] {
    color: #dc2626;
    font-size: 0.875rem;
    margin-top: 6px;
    display: block;
}

.text-success[b-bb6q4ul938] {
    color: #16a34a !important;
}

.text-danger[b-bb6q4ul938] {
    color: #dc2626 !important;
}

/* Modal Footer */
.modal-footer[b-bb6q4ul938] {
    padding: 20px 32px 24px 32px;
    border-top: 1px solid #e5e7eb;
    display: flex;
    justify-content: flex-end;
    gap: 12px;
    background: white;
}

.modal-footer .btn[b-bb6q4ul938] {
    border-radius: 8px;
    padding: 10px 20px;
    font-weight: 500;
    font-size: 0.95rem;
    transition: all 0.2s ease;
    display: flex;
    align-items: center;
    gap: 8px;
    border: 1px solid transparent;
    cursor: pointer;
    min-width: 100px;
    justify-content: center;
}

.modal-footer .btn-secondary[b-bb6q4ul938] {
    background: white;
    color: #6b7280;
    border: 1px solid #d1d5db;
}

.modal-footer .btn-secondary:hover[b-bb6q4ul938] {
    background: #f9fafb;
    color: #374151;
    border-color: #9ca3af;
}

.modal-footer .btn-primary[b-bb6q4ul938] {
    background: #C8A951;
    color: white;
    border: 1px solid #C8A951;
}

.modal-footer .btn-primary:hover:not(:disabled)[b-bb6q4ul938] {
    background: #b8973f;
    border-color: #b8973f;
}

.modal-footer .btn-primary:disabled[b-bb6q4ul938] {
    background: #d1d5db;
    color: #9ca3af;
    border-color: #d1d5db;
    cursor: not-allowed;
}

.modal-footer .btn i[b-bb6q4ul938] {
    font-size: 0.9rem;
}

/* Form Control States */
.form-control.is-valid[b-bb6q4ul938] {
    border-color: #16a34a;
    box-shadow: 0 0 0 4px rgba(22, 163, 74, 0.1);
}

.form-control.is-invalid[b-bb6q4ul938] {
    border-color: #dc2626;
    box-shadow: 0 0 0 4px rgba(220, 38, 38, 0.1);
}

/* Responsive Design */
@media (max-width: 768px) {
    .modal-dialog[b-bb6q4ul938] {
        width: 95%;
        margin: 1rem;
        max-height: calc(100vh - 2rem);
    }

    .modal-header[b-bb6q4ul938],
    .modal-body[b-bb6q4ul938],
    .modal-footer[b-bb6q4ul938] {
        padding: 20px;
    }

    .modal-title[b-bb6q4ul938] {
        font-size: 1.25rem;
    }

    .row[b-bb6q4ul938] {
        flex-direction: column;
        gap: 0;
    }

    .col-md-6[b-bb6q4ul938] {
        min-width: auto;
        padding: 5px;
    }

    .stats-row[b-bb6q4ul938],
    .unit-stats[b-bb6q4ul938] {
        flex-direction: column;
        gap: 16px;
    }

    .modal-footer[b-bb6q4ul938] {
        flex-direction: column;
    }

    .modal-footer .btn[b-bb6q4ul938] {
        width: 100%;
        justify-content: center;
    }
}

@media (max-width: 480px) {
    .modal-dialog[b-bb6q4ul938] {
        width: 100%;
        height: 100%;
        max-height: 100vh;
        border-radius: 0;
        margin: 0;
    }

    .modal-content[b-bb6q4ul938] {
        border-radius: 0;
        height: 100%;
        display: flex;
        flex-direction: column;
    }

    .modal-body[b-bb6q4ul938] {
        flex: 1;
        overflow-y: auto;
    }
}
/* /Features/Employer/SurveyUsers/Components/SurveyUserList.razor.rz.scp.css */
/* Survey User List Table Styling */

.survey-users-table[b-zkvs5x0mxp] {
    background: white;
    border-radius: 0 0 20px 20px;
    overflow: hidden;
}

.table-responsive[b-zkvs5x0mxp] {
    overflow-x: auto;
}

.table[b-zkvs5x0mxp] {
    margin: 0;
    width: 100%;
    border-collapse: collapse;
}

.table thead th[b-zkvs5x0mxp] {
    background: linear-gradient(135deg, #14213D 0%, #2E2E2E 100%);
    color: white;
    font-weight: 600;
    font-size: 1rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    padding: 20px 24px;
    border: none;
    text-align: left;
    position: sticky;
    top: 0;
    z-index: 10;
}

.table thead th:first-child[b-zkvs5x0mxp] {
    border-radius: 0;
}

.table thead th:last-child[b-zkvs5x0mxp] {
    border-radius: 0;
}

.table tbody td[b-zkvs5x0mxp] {
    padding: 20px 24px;
    border-bottom: 1px solid rgba(226, 230, 234, 0.6);
    vertical-align: middle;
    background: white;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.table tbody tr[b-zkvs5x0mxp] {
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.table tbody tr:hover[b-zkvs5x0mxp] {
    background: linear-gradient(135deg, rgba(191, 216, 184, 0.1) 0%, rgba(226, 230, 234, 0.1) 100%);
    transform: translateY(-1px);
    box-shadow: 0 4px 16px rgba(20, 33, 61, 0.08);
}

.table tbody tr:hover td[b-zkvs5x0mxp] {
    background: transparent;
}

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

/* User Info Section */
.user-info[b-zkvs5x0mxp] {
    display: flex;
    align-items: center;
    gap: 16px;
}

.user-avatar[b-zkvs5x0mxp] {
    width: 44px;
    height: 44px;
    border-radius: 12px;
    background: linear-gradient(135deg, #C8A951 0%, #14213D 100%);
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    font-weight: 700;
    font-size: 1rem;
    flex-shrink: 0;
}

.user-details[b-zkvs5x0mxp] {
    flex: 1;
}

.user-name[b-zkvs5x0mxp] {
    font-weight: 600;
    color: #14213D;
    font-size: 1rem;
    margin-bottom: 4px;
}

.user-id[b-zkvs5x0mxp] {
    font-size: 0.875rem;
    color: #717188;
    font-family: monospace;
}

/* Email */
.user-email[b-zkvs5x0mxp] {
    color: #14213D;
    font-weight: 500;
}

/* Business Unit Info */
.business-unit-info[b-zkvs5x0mxp] {
    display: flex;
    align-items: center;
    gap: 8px;
    color: #14213D;
    font-weight: 500;
}

.business-unit-info i[b-zkvs5x0mxp] {
    color: #C8A951;
    font-size: 1rem;
}

.text-muted[b-zkvs5x0mxp] {
    color: #717188 !important;
    font-style: italic;
}

.btn.btn-sm[b-zkvs5x0mxp] {
    padding: 6px 12px;
    font-size: 0.875rem;
    border-radius: 8px;
    font-weight: 500;
    transition: all 0.3s ease;
    border: 2px solid transparent;
}

.btn-outline-primary[b-zkvs5x0mxp] {
    background: white;
    color: #14213D;
    border: 2px solid #E2E6EA;
}

.btn-outline-primary:hover[b-zkvs5x0mxp] {
    background: #C8A951;
    color: white;
    border-color: #C8A951;
    transform: translateY(-1px);
}

/* Survey Stats */
.survey-stats[b-zkvs5x0mxp] {
    display: flex;
    align-items: center;
    gap: 8px;
}

.surveys-completed[b-zkvs5x0mxp] {
    font-weight: 700;
    font-size: 1.1rem;
    color: #14213D;
}

.surveys-label[b-zkvs5x0mxp] {
    color: #717188;
    font-size: 0.9rem;
}

/* Last Survey Date */
.last-survey-date[b-zkvs5x0mxp] {
    color: #14213D;
    font-weight: 500;
}

/* Status Badges */
.badge[b-zkvs5x0mxp] {
    display: inline-flex;
    align-items: center;
    padding: 6px 12px;
    border-radius: 20px;
    font-size: 0.875rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.badge-success[b-zkvs5x0mxp] {
    background-color: #f0f9f0;
    color: #16a34a;
    border: 1px solid #bbf7d0;
}

.badge-secondary[b-zkvs5x0mxp] {
    background-color: #f8f9fa;
    color: #6c757d;
    border: 1px solid #dee2e6;
}

/* Action Buttons */
.action-buttons[b-zkvs5x0mxp] {
    display: flex;
    gap: 8px;
    align-items: center;
}

.action-buttons .btn[b-zkvs5x0mxp] {
    width: 36px;
    height: 36px;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    transition: all 0.3s ease;
    border: 2px solid transparent;
}

.btn-outline-primary[b-zkvs5x0mxp] {
    background: white;
    color: #14213D;
    border: 2px solid #E2E6EA;
}

.btn-outline-primary:hover[b-zkvs5x0mxp] {
    background: #C8A951;
    color: white;
    border-color: #C8A951;
    transform: translateY(-1px);
}

.btn-outline-info[b-zkvs5x0mxp] {
    background: white;
    color: #0891b2;
    border: 2px solid #e0f2fe;
}

.btn-outline-info:hover[b-zkvs5x0mxp] {
    background: #0891b2;
    color: white;
    border-color: #0891b2;
    transform: translateY(-1px);
}

.btn-outline-danger[b-zkvs5x0mxp] {
    background: white;
    color: #dc2626;
    border: 2px solid #fecaca;
}

.btn-outline-danger:hover[b-zkvs5x0mxp] {
    background: #dc2626;
    color: white;
    border-color: #dc2626;
    transform: translateY(-1px);
}

.action-buttons .btn i[b-zkvs5x0mxp] {
    font-size: 0.875rem;
}

/* Row States */
.normal-row[b-zkvs5x0mxp] {
    background: white;
}

.inactive-row[b-zkvs5x0mxp] {
    background: #f9fafb;
    opacity: 0.8;
}

.inactive-row .user-name[b-zkvs5x0mxp],
.inactive-row .user-email[b-zkvs5x0mxp] {
    color: #6b7280;
}

.unassigned-row[b-zkvs5x0mxp] {
    background: #fffbeb;
    border-left: 4px solid #f59e0b;
}

/* Empty Table */
.empty-table[b-zkvs5x0mxp] {
    padding: 60px 20px;
    text-align: center;
    color: #717188;
    font-style: italic;
}

.empty-table p[b-zkvs5x0mxp] {
    margin: 0;
    font-size: 1rem;
}

/* Responsive Design */
@media (max-width: 1024px) {
    .table thead th[b-zkvs5x0mxp],
    .table tbody td[b-zkvs5x0mxp] {
        padding: 16px 20px;
    }

    .user-info[b-zkvs5x0mxp] {
        gap: 12px;
    }

    .user-avatar[b-zkvs5x0mxp] {
        width: 36px;
        height: 36px;
        font-size: 0.9rem;
    }

    .action-buttons .btn[b-zkvs5x0mxp] {
        width: 32px;
        height: 32px;
    }
}

@media (max-width: 768px) {
    .table thead th[b-zkvs5x0mxp],
    .table tbody td[b-zkvs5x0mxp] {
        padding: 12px 16px;
    }

    .user-info[b-zkvs5x0mxp] {
        flex-direction: column;
        align-items: flex-start;
        gap: 8px;
    }

    .user-avatar[b-zkvs5x0mxp] {
        width: 32px;
        height: 32px;
        font-size: 0.8rem;
    }

    .user-name[b-zkvs5x0mxp] {
        font-size: 0.9rem;
    }

    .user-id[b-zkvs5x0mxp] {
        font-size: 0.8rem;
    }

    .action-buttons[b-zkvs5x0mxp] {
        flex-direction: column;
        gap: 4px;
    }

    .action-buttons .btn[b-zkvs5x0mxp] {
        width: 28px;
        height: 28px;
    }

    .surveys-completed[b-zkvs5x0mxp] {
        font-size: 1rem;
    }

    /* Hide some columns on mobile */
    .table thead th:nth-child(3)[b-zkvs5x0mxp],
    .table tbody td:nth-child(3)[b-zkvs5x0mxp] {
        display: none;
    }
}

@media (max-width: 480px) {
    .table thead th[b-zkvs5x0mxp],
    .table tbody td[b-zkvs5x0mxp] {
        padding: 10px 12px;
    }

    /* Hide more columns on very small screens */
    .table thead th:nth-child(4)[b-zkvs5x0mxp],
    .table tbody td:nth-child(4)[b-zkvs5x0mxp],
    .table thead th:nth-child(5)[b-zkvs5x0mxp],
    .table tbody td:nth-child(5)[b-zkvs5x0mxp] {
        display: none;
    }

    .user-info[b-zkvs5x0mxp] {
        gap: 6px;
    }

    .business-unit-info[b-zkvs5x0mxp] {
        font-size: 0.875rem;
    }

    .badge[b-zkvs5x0mxp] {
        font-size: 0.75rem;
        padding: 4px 8px;
    }
}
/* /Features/Employer/SurveyUsers/Components/UserSearchFilter.razor.rz.scp.css */
/* User Search Filter Component Styling - Modern 3D Design */
.search-filter-panel[b-y2e9s6jmkw] {
    background: linear-gradient(145deg, #ffffff 0%, #fafbfc 100%);
    border-radius: 20px;
    border: 1px solid rgba(255, 255, 255, 0.8);
    overflow: hidden;
    box-shadow: 
        0 8px 32px rgba(20, 33, 61, 0.06),
        inset 0 1px 0 rgba(255, 255, 255, 0.9);
    transition: all 0.3s ease;
}

.search-filter-panel:hover[b-y2e9s6jmkw] {
    box-shadow: 
        0 12px 40px rgba(20, 33, 61, 0.08),
        inset 0 1px 0 rgba(255, 255, 255, 0.9);
    transform: translateY(-1px);
}

.search-controls[b-y2e9s6jmkw] {
    display: flex;
    flex-wrap: wrap;
    gap: 1.5rem;
    align-items: flex-end;
    padding: 1.5rem;
    background: linear-gradient(135deg, #f8fafc 0%, #ffffff 100%);
    position: relative;
}

.search-controls[b-y2e9s6jmkw]::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 1px;
    background: linear-gradient(90deg, transparent 0%, rgba(200, 169, 81, 0.2) 50%, transparent 100%);
}

/* Search Box */
.search-box[b-y2e9s6jmkw] {
    position: relative;
    min-width: 300px;
    flex: 1;
}

.search-box i[b-y2e9s6jmkw] {
    position: absolute;
    left: 16px;
    top: 50%;
    transform: translateY(-50%);
    color: #717188;
    font-size: 1rem;
    z-index: 2;
}

.search-box input[b-y2e9s6jmkw] {
    width: 100%;
    padding: 16px 20px 16px 48px;
    border: 1px solid rgba(226, 230, 234, 0.3);
    border-radius: 16px;
    font-size: 1rem;
    color: #14213D;
    background: linear-gradient(145deg, #ffffff 0%, #fafbfc 100%);
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    box-shadow: 
        0 4px 16px rgba(20, 33, 61, 0.04),
        inset 0 1px 0 rgba(255, 255, 255, 0.9);
}

.search-box input:focus[b-y2e9s6jmkw] {
    outline: none;
    border-color: #C8A951;
    background: #ffffff;
    transform: translateY(-2px);
    box-shadow: 
        0 8px 24px rgba(200, 169, 81, 0.15),
        0 2px 8px rgba(20, 33, 61, 0.08),
        inset 0 1px 0 rgba(255, 255, 255, 0.9);
}

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

.search-clear[b-y2e9s6jmkw] {
    position: absolute;
    right: 12px;
    top: 50%;
    transform: translateY(-50%);
    background: none;
    border: none;
    color: #717188;
    cursor: pointer;
    padding: 4px;
    border-radius: 4px;
    transition: all 0.2s ease;
}

.search-clear:hover[b-y2e9s6jmkw] {
    color: #dc2626;
    background: rgba(220, 38, 38, 0.1);
}

/* Filter Groups */
.filter-group[b-y2e9s6jmkw] {
    display: flex;
    flex-direction: column;
    gap: 8px;
    min-width: 200px;
}

.filter-label[b-y2e9s6jmkw] {
    font-weight: 600;
    color: #14213D;
    font-size: 0.9rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin: 0;
}

.form-select[b-y2e9s6jmkw] {
    padding: 16px 20px;
    border: 1px solid rgba(226, 230, 234, 0.3);
    border-radius: 16px;
    background: linear-gradient(145deg, #ffffff 0%, #fafbfc 100%);
    color: #14213D;
    font-size: 1rem;
    cursor: pointer;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    box-shadow: 
        0 4px 16px rgba(20, 33, 61, 0.04),
        inset 0 1px 0 rgba(255, 255, 255, 0.9);
}

.form-select:focus[b-y2e9s6jmkw] {
    outline: none;
    border-color: #C8A951;
    background: #ffffff;
    transform: translateY(-2px);
    box-shadow: 
        0 8px 24px rgba(200, 169, 81, 0.15),
        0 2px 8px rgba(20, 33, 61, 0.08),
        inset 0 1px 0 rgba(255, 255, 255, 0.9);
}

.form-select:hover[b-y2e9s6jmkw] {
    border-color: rgba(200, 169, 81, 0.5);
}

/* Filter Actions */
.filter-actions[b-y2e9s6jmkw] {
    display: flex;
    gap: 12px;
    align-items: flex-end;
}

.filter-actions .btn[b-y2e9s6jmkw] {
    padding: 14px 20px;
    border-radius: 12px;
    font-weight: 600;
    font-size: 0.9rem;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    display: flex;
    align-items: center;
    gap: 8px;
    cursor: pointer;
}

.filter-actions .btn-outline-primary[b-y2e9s6jmkw] {
    background: linear-gradient(135deg, #C8A951 0%, #14213D 100%);
    color: white;
    border: none;
    box-shadow: 0 4px 16px rgba(20, 33, 61, 0.2);
}

.filter-actions .btn-outline-primary:hover[b-y2e9s6jmkw] {
    background: linear-gradient(135deg, #14213D 0%, #C8A951 100%);
    transform: translateY(-2px);
    box-shadow: 0 8px 24px rgba(20, 33, 61, 0.3);
}

.filter-actions .btn-outline-light[b-y2e9s6jmkw] {
    background: linear-gradient(145deg, #ffffff 0%, #f8fafc 100%);
    color: #6b7280;
    border: 1px solid rgba(226, 230, 234, 0.3);
    box-shadow: 
        0 4px 16px rgba(20, 33, 61, 0.04),
        inset 0 1px 0 rgba(255, 255, 255, 0.9);
}

.filter-actions .btn-outline-light:hover[b-y2e9s6jmkw] {
    background: linear-gradient(145deg, #f8fafc 0%, #e2e8f0 100%);
    color: #14213D;
    border-color: #C8A951;
    transform: translateY(-3px);
    box-shadow: 
        0 8px 24px rgba(200, 169, 81, 0.15),
        inset 0 1px 0 rgba(255, 255, 255, 0.9);
}

/* Active Filters */
.active-filters[b-y2e9s6jmkw] {
    padding: 1.25rem 1.5rem;
    background: linear-gradient(135deg, #f1f5f9 0%, #e2e8f0 100%);
    border-top: 1px solid rgba(226, 230, 234, 0.2);
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    align-items: center;
    position: relative;
}

.active-filters[b-y2e9s6jmkw]::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 1px;
    background: linear-gradient(90deg, transparent 0%, rgba(200, 169, 81, 0.3) 50%, transparent 100%);
}

.filters-label[b-y2e9s6jmkw] {
    font-weight: 600;
    color: #14213D;
    font-size: 0.9rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.filter-tag[b-y2e9s6jmkw] {
    background: linear-gradient(135deg, #C8A951 0%, #14213D 100%);
    color: white;
    padding: 8px 16px;
    border-radius: 24px;
    font-size: 0.85rem;
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 8px;
    box-shadow: 
        0 4px 16px rgba(200, 169, 81, 0.25),
        inset 0 1px 0 rgba(255, 255, 255, 0.2);
    transition: all 0.3s ease;
}

.filter-tag:hover[b-y2e9s6jmkw] {
    transform: translateY(-2px);
    box-shadow: 
        0 8px 24px rgba(200, 169, 81, 0.35),
        inset 0 1px 0 rgba(255, 255, 255, 0.2);
}

.filter-tag button[b-y2e9s6jmkw] {
    background: none;
    border: none;
    color: white;
    cursor: pointer;
    font-size: 1rem;
    font-weight: bold;
    padding: 0;
    width: 20px;
    height: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    transition: all 0.2s ease;
}

.filter-tag button:hover[b-y2e9s6jmkw] {
    background: rgba(255, 255, 255, 0.2);
}

/* Responsive Design */
@media (max-width: 768px) {
    .search-controls[b-y2e9s6jmkw] {
        flex-direction: column;
        gap: 16px;
        align-items: stretch;
    }
    
    .search-box[b-y2e9s6jmkw] {
        min-width: auto;
    }
    
    .filter-group[b-y2e9s6jmkw] {
        min-width: auto;
    }
    
    .filter-actions[b-y2e9s6jmkw] {
        justify-content: stretch;
    }
    
    .filter-actions .btn[b-y2e9s6jmkw] {
        flex: 1;
        justify-content: center;
    }
    
    .active-filters[b-y2e9s6jmkw] {
        padding: 12px 16px;
    }
}

@media (max-width: 480px) {
    .search-controls[b-y2e9s6jmkw] {
        padding: 16px;
    }
    
    .search-box input[b-y2e9s6jmkw] {
        padding: 12px 14px 12px 40px;
        font-size: 0.9rem;
    }
    
    .form-select[b-y2e9s6jmkw] {
        padding: 12px 14px;
        font-size: 0.9rem;
    }
    
    .filter-actions .btn[b-y2e9s6jmkw] {
        padding: 12px 16px;
        font-size: 0.85rem;
    }
    
    .active-filters[b-y2e9s6jmkw] {
        padding: 12px;
    }
    
    .filter-tag[b-y2e9s6jmkw] {
        font-size: 0.8rem;
        padding: 4px 10px;
    }
}
/* /Features/Employer/SurveyUsers/SurveyUsersPage.razor.rz.scp.css */
/* Survey Users Page Styling - Modern 3D Professional Design */
.survey-users-container[b-x1859ja55q] {
    padding: 2rem;
    margin: 0 auto;
    max-width: 1400px;
    background: linear-gradient(135deg, #f8fafc 0%, #e2e8f0 100%);
    min-height: 100vh;
    position: relative;
}

.survey-users-container[b-x1859ja55q]::before {
    content: '';
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: 
        radial-gradient(circle at 25% 25%, rgba(200, 169, 81, 0.05) 0%, transparent 50%),
        radial-gradient(circle at 75% 75%, rgba(20, 33, 61, 0.05) 0%, transparent 50%);
    pointer-events: none;
    z-index: -1;
}

/* Header Section */
.page-header[b-x1859ja55q] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 2rem;
    gap: 2rem;
}

.header-content h1.page-title[b-x1859ja55q] {
    color: #14213D;
    margin: 0.5rem 0;
    font-size: 2rem;
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 1rem;
}

.header-content h1.page-title i[b-x1859ja55q] {
    color: #C8A951;
    font-size: 1.75rem;
}

.header-content .page-description[b-x1859ja55q] {
    color: #717188;
    margin-bottom: 1rem;
    font-size: 1rem;
}

.header-actions[b-x1859ja55q] {
    display: flex;
    gap: 1.5rem;
    align-items: center;
    flex-wrap: wrap;
}

.add-user-section[b-x1859ja55q] {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.add-user-label[b-x1859ja55q] {
    font-size: 0.9rem;
    font-weight: 600;
    color: #14213D;
    margin: 0;
}

.empty-add-user-section[b-x1859ja55q] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    margin-bottom: 16px;
}

.empty-add-user-label[b-x1859ja55q] {
    font-size: 1rem;
    font-weight: 600;
    color: #14213D;
    margin: 0;
    text-align: center;
}

.empty-divider[b-x1859ja55q] {
    color: #717188;
    font-size: 1rem;
    font-weight: 500;
    margin: 8px 0;
    position: relative;
}

.empty-divider[b-x1859ja55q]::before,
.empty-divider[b-x1859ja55q]::after {
    content: '';
    position: absolute;
    top: 50%;
    width: 40px;
    height: 1px;
    background: linear-gradient(90deg, transparent, #E2E6EA, transparent);
}

.empty-divider[b-x1859ja55q]::before {
    left: -50px;
}

.empty-divider[b-x1859ja55q]::after {
    right: -50px;
}

.header-actions .btn[b-x1859ja55q] {
    border-radius: 16px;
    padding: 14px 28px;
    font-weight: 600;
    font-size: 1rem;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    display: flex;
    align-items: center;
    gap: 0.5rem;
    position: relative;
    overflow: hidden;
}

.header-actions .btn[b-x1859ja55q]::before {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    width: 0;
    height: 0;
    background: radial-gradient(circle, rgba(255,255,255,0.3) 0%, transparent 70%);
    transition: all 0.3s ease;
    transform: translate(-50%, -50%);
    border-radius: 50%;
}

.header-actions .btn:hover[b-x1859ja55q]::before {
    width: 300px;
    height: 300px;
}

.header-actions .btn-outline-secondary[b-x1859ja55q] {
    background: linear-gradient(145deg, #ffffff 0%, #f8fafc 100%);
    color: #6b7280;
    border: 1px solid #e5e7eb;
    box-shadow: 
        0 4px 16px rgba(0, 0, 0, 0.05),
        inset 0 1px 0 rgba(255, 255, 255, 0.8);
}

.header-actions .btn-outline-secondary:hover[b-x1859ja55q] {
    background: linear-gradient(145deg, #f8fafc 0%, #e2e8f0 100%);
    border-color: #14213D;
    color: #14213D;
    transform: translateY(-2px);
    box-shadow: 
        0 8px 25px rgba(20, 33, 61, 0.15),
        inset 0 1px 0 rgba(255, 255, 255, 0.8);
}

.header-actions .btn-primary[b-x1859ja55q] {
    background: linear-gradient(135deg, #C8A951 0%, #14213D 100%);
    color: white;
    border: none;
    box-shadow: 0 6px 20px rgba(20, 33, 61, 0.25);
}

.header-actions .btn-primary:hover[b-x1859ja55q] {
    background: linear-gradient(135deg, #14213D 0%, #C8A951 100%);
    transform: translateY(-3px);
    box-shadow: 0 12px 32px rgba(20, 33, 61, 0.35);
}

.header-actions .btn-outline-primary[b-x1859ja55q] {
    background-color: #FFFFFF;
    color: #14213D;
    border: 2px solid #E2E6EA;
    box-shadow: 0 4px 16px rgba(20, 33, 61, 0.08);
}

.header-actions .btn-outline-primary:hover[b-x1859ja55q] {
    border-color: #C8A951;
    color: #14213D;
    background-color: #FFFFFF;
    box-shadow: 0 8px 24px rgba(200, 169, 81, 0.2);
    transform: translateY(-2px);
}

/* Statistics Cards */
.stats-grid[b-x1859ja55q] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
    margin-bottom: 30px;
}

.stat-card[b-x1859ja55q] {
    background: linear-gradient(145deg, #ffffff 0%, #fafbfc 100%);
    border-radius: 24px;
    padding: 2rem;
    box-shadow: 
        0 10px 40px rgba(20, 33, 61, 0.08),
        0 2px 8px rgba(20, 33, 61, 0.04),
        inset 0 1px 0 rgba(255, 255, 255, 0.9);
    border: 1px solid rgba(255, 255, 255, 0.8);
    transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    display: flex;
    align-items: center;
    gap: 1.5rem;
    position: relative;
    overflow: hidden;
}

.stat-card[b-x1859ja55q]::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 3px;
    background: linear-gradient(90deg, #C8A951 0%, #14213D 100%);
    transform: scaleX(0);
    transition: transform 0.3s ease;
}

.stat-card:hover[b-x1859ja55q] {
    transform: translateY(-8px) scale(1.02);
    box-shadow: 
        0 20px 60px rgba(20, 33, 61, 0.15),
        0 8px 24px rgba(20, 33, 61, 0.08),
        inset 0 1px 0 rgba(255, 255, 255, 0.9);
    border-color: rgba(200, 169, 81, 0.3);
}

.stat-card:hover[b-x1859ja55q]::before {
    transform: scaleX(1);
}

.stat-icon[b-x1859ja55q] {
    width: 64px;
    height: 64px;
    border-radius: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, #C8A951 0%, #14213D 100%);
    color: white;
    font-size: 1.6rem;
    flex-shrink: 0;
    box-shadow: 
        0 8px 24px rgba(200, 169, 81, 0.3),
        inset 0 1px 0 rgba(255, 255, 255, 0.2);
    position: relative;
    transition: all 0.3s ease;
}

.stat-icon[b-x1859ja55q]::after {
    content: '';
    position: absolute;
    inset: 2px;
    border-radius: 18px;
    background: linear-gradient(145deg, rgba(255,255,255,0.1) 0%, transparent 100%);
    pointer-events: none;
}

.stat-card:hover .stat-icon[b-x1859ja55q] {
    transform: scale(1.1);
    box-shadow: 
        0 12px 32px rgba(200, 169, 81, 0.4),
        inset 0 1px 0 rgba(255, 255, 255, 0.2);
}

.stat-content[b-x1859ja55q] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.stat-number[b-x1859ja55q] {
    color: #14213D;
    font-size: 2rem;
    font-weight: 700;
    line-height: 1;
}

.stat-label[b-x1859ja55q] {
    color: #717188;
    font-size: 0.9rem;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

/* Content Card */
.content-card[b-x1859ja55q] {
    background: linear-gradient(145deg, #ffffff 0%, #fafbfc 100%);
    border-radius: 24px;
    box-shadow: 
        0 20px 60px rgba(20, 33, 61, 0.08),
        0 4px 16px rgba(20, 33, 61, 0.04),
        inset 0 1px 0 rgba(255, 255, 255, 0.9);
    border: 1px solid rgba(255, 255, 255, 0.8);
    overflow: hidden;
    position: relative;
    transition: all 0.3s ease;
}

.content-card:hover[b-x1859ja55q] {
    transform: translateY(-2px);
    box-shadow: 
        0 25px 80px rgba(20, 33, 61, 0.12),
        0 8px 24px rgba(20, 33, 61, 0.06),
        inset 0 1px 0 rgba(255, 255, 255, 0.9);
}

.card-header-clean[b-x1859ja55q] {
    background: linear-gradient(135deg, #14213D 0%, #1e3a8a 100%);
    color: white;
    padding: 2rem;
    border-bottom: none;
    position: relative;
    overflow: hidden;
}

.card-header-clean[b-x1859ja55q]::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: linear-gradient(135deg, rgba(200, 169, 81, 0.1) 0%, transparent 50%);
    pointer-events: none;
}

.card-header-clean[b-x1859ja55q]::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 1px;
    background: linear-gradient(90deg, transparent 0%, #C8A951 50%, transparent 100%);
}

.card-header-clean h3[b-x1859ja55q] {
    font-size: 1.5rem;
    font-weight: 600;
    margin: 0;
    color: #14213D;
}

.filters-section[b-x1859ja55q] {
    background: linear-gradient(145deg, #f8fafc 0%, #ffffff 100%);
    padding: 2rem;
    border-bottom: 1px solid rgba(226, 230, 234, 0.2);
    position: relative;
}

.filters-section[b-x1859ja55q]::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 1px;
    background: linear-gradient(90deg, transparent 0%, rgba(200, 169, 81, 0.3) 50%, transparent 100%);
}

.card-content[b-x1859ja55q] {
    padding: 0;
}

/* Loading State */
.loading-container[b-x1859ja55q] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 60px 20px;
    text-align: center;
}

.spinner[b-x1859ja55q] {
    border: 4px solid #f3f3f3;
    border-top: 4px solid #C8A951;
    border-radius: 50%;
    width: 40px;
    height: 40px;
    animation: spin-b-x1859ja55q 1s linear infinite;
    margin-bottom: 20px;
}

@keyframes spin-b-x1859ja55q {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

.loading-container p[b-x1859ja55q] {
    color: #717188;
    font-size: 1rem;
    margin: 0;
}

/* Empty State */
.empty-state[b-x1859ja55q] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 80px 20px;
    text-align: center;
}

.empty-state i[b-x1859ja55q] {
    color: #E2E6EA;
    margin-bottom: 20px;
}

.empty-state h3[b-x1859ja55q] {
    color: #14213D;
    font-size: 1.5rem;
    font-weight: 600;
    margin-bottom: 10px;
}

.empty-state p[b-x1859ja55q] {
    color: #717188;
    max-width: 400px;
    margin-bottom: 30px;
    font-size: 1rem;
}

.empty-actions[b-x1859ja55q] {
    display: flex;
    gap: 1rem;
    flex-wrap: wrap;
    justify-content: center;
}

.empty-actions .btn[b-x1859ja55q] {
    border-radius: 16px;
    padding: 14px 28px;
    font-weight: 600;
    font-size: 1rem;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.empty-actions .btn-primary[b-x1859ja55q] {
    background: linear-gradient(135deg, #C8A951 0%, #14213D 100%);
    color: white;
    border: none;
    box-shadow: 0 6px 20px rgba(20, 33, 61, 0.25);
}

.empty-actions .btn-primary:hover[b-x1859ja55q] {
    background: linear-gradient(135deg, #14213D 0%, #C8A951 100%);
    transform: translateY(-3px);
    box-shadow: 0 12px 32px rgba(20, 33, 61, 0.35);
}

.empty-actions .btn-outline-primary[b-x1859ja55q] {
    background-color: #FFFFFF;
    color: #14213D;
    border: 2px solid #E2E6EA;
    box-shadow: 0 4px 16px rgba(20, 33, 61, 0.08);
}

.empty-actions .btn-outline-primary:hover[b-x1859ja55q] {
    border-color: #C8A951;
    color: #14213D;
    background-color: #FFFFFF;
    box-shadow: 0 8px 24px rgba(200, 169, 81, 0.2);
    transform: translateY(-2px);
}

/* Alert Messages */
.alert[b-x1859ja55q] {
    display: flex;
    align-items: center;
    padding: 1rem 1.5rem;
    margin-bottom: 1.5rem;
    border-radius: 12px;
    font-weight: 500;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
}

.alert i[b-x1859ja55q] {
    margin-right: 0.75rem;
    font-size: 1.1rem;
}

.alert-danger[b-x1859ja55q] {
    background-color: #fef2f2;
    color: #dc2626;
    border: 1px solid #fecaca;
}

.alert-success[b-x1859ja55q] {
    background-color: #f0f9f0;
    color: #16a34a;
    border: 1px solid #bbf7d0;
}

.btn-close[b-x1859ja55q] {
    background: none;
    border: none;
    font-size: 1.25rem;
    margin-left: auto;
    cursor: pointer;
    opacity: 0.7;
    transition: opacity 0.2s;
}

.btn-close:hover[b-x1859ja55q] {
    opacity: 1;
}

/* Modal Styles */
.modal-backdrop[b-x1859ja55q] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.5);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1000;
    backdrop-filter: blur(4px);
}

.modal-dialog[b-x1859ja55q] {
    background: white;
    border-radius: 20px;
    box-shadow: 0 24px 48px rgba(0, 0, 0, 0.2);
    max-width: 500px;
    width: 90%;
    max-height: 90vh;
    overflow-y: auto;
}

.modal-confirm[b-x1859ja55q] {
    max-width: 400px;
}

.modal-content[b-x1859ja55q] {
    padding: 0;
}

.modal-header[b-x1859ja55q] {
    padding: 24px 32px;
    border-bottom: 1px solid #E2E6EA;
    background: linear-gradient(135deg, #14213D 0%, #2E2E2E 100%);
    color: white;
    border-radius: 20px 20px 0 0;
}

.modal-header h4[b-x1859ja55q] {
    margin: 0;
    font-size: 1.25rem;
    font-weight: 600;
}

.modal-body[b-x1859ja55q] {
    padding: 32px;
}

.modal-body p[b-x1859ja55q] {
    margin-bottom: 20px;
    color: #2E2E2E;
}

.warning-box[b-x1859ja55q] {
    background: #fef3cd;
    border: 1px solid #fecaca;
    border-radius: 12px;
    padding: 16px;
    display: flex;
    align-items: flex-start;
    gap: 12px;
    margin-top: 20px;
}

.warning-box i[b-x1859ja55q] {
    color: #f59e0b;
    font-size: 1.2rem;
    margin-top: 2px;
}

.warning-box span[b-x1859ja55q] {
    color: #92400e;
    font-size: 0.9rem;
}

.modal-footer[b-x1859ja55q] {
    padding: 24px 32px;
    border-top: 1px solid #E2E6EA;
    display: flex;
    justify-content: flex-end;
    gap: 12px;
}

.modal-footer .btn[b-x1859ja55q] {
    border-radius: 12px;
    padding: 12px 24px;
    font-weight: 600;
    transition: all 0.3s ease;
    display: flex;
    align-items: center;
    gap: 8px;
}

.modal-footer .btn-secondary[b-x1859ja55q] {
    background: #f8f9fa;
    color: #6c757d;
    border: 1px solid #dee2e6;
}

.modal-footer .btn-secondary:hover[b-x1859ja55q] {
    background: #e9ecef;
    color: #495057;
}

.modal-footer .btn-danger[b-x1859ja55q] {
    background: #dc3545;
    color: white;
    border: none;
}

.modal-footer .btn-danger:hover[b-x1859ja55q] {
    background: #c82333;
}

.modal-footer .btn-danger:disabled[b-x1859ja55q] {
    background: #6c757d;
    cursor: not-allowed;
}

/* Responsive Design */
@media (max-width: 1024px) {
    .stats-grid[b-x1859ja55q] {
        grid-template-columns: repeat(2, 1fr);
        gap: 16px;
    }
}

@media (max-width: 768px) {
    .survey-users-container[b-x1859ja55q] {
        padding: 1rem;
    }

    .page-header[b-x1859ja55q] {
        flex-direction: column;
        align-items: flex-start;
        gap: 1rem;
    }

    .header-actions[b-x1859ja55q] {
        width: 100%;
        flex-direction: column;
        align-items: stretch;
        gap: 1rem;
    }

    .add-user-section[b-x1859ja55q] {
        width: 100%;
        align-items: stretch;
    }

    .add-user-label[b-x1859ja55q] {
        text-align: center;
        margin-bottom: 8px;
    }

    .header-actions .btn[b-x1859ja55q] {
        width: 100%;
        justify-content: center;
    }

    .stats-grid[b-x1859ja55q] {
        grid-template-columns: 1fr;
        gap: 12px;
    }

    .stat-card[b-x1859ja55q] {
        padding: 24px;
    }

    .card-header-clean[b-x1859ja55q] {
        padding: 20px;
    }
    
    .filters-section[b-x1859ja55q] {
        padding: 20px;
    }

    .empty-actions[b-x1859ja55q] {
        flex-direction: column;
        align-items: center;
        gap: 16px;
        max-width: 300px;
        margin: 0 auto;
    }

    .empty-add-user-section[b-x1859ja55q] {
        width: 100%;
    }

    .empty-divider[b-x1859ja55q]::before,
    .empty-divider[b-x1859ja55q]::after {
        width: 30px;
    }

    .empty-divider[b-x1859ja55q]::before {
        left: -40px;
    }

    .empty-divider[b-x1859ja55q]::after {
        right: -40px;
    }

    .empty-actions .btn[b-x1859ja55q] {
        width: 100%;
        justify-content: center;
    }
}

@media (max-width: 480px) {
    .survey-users-container[b-x1859ja55q] {
        padding: 0.5rem;
    }

    .header-content h1.page-title[b-x1859ja55q] {
        font-size: 1.5rem;
    }

    .header-content h1.page-title i[b-x1859ja55q] {
        font-size: 1.25rem;
    }

    .stat-card[b-x1859ja55q] {
        padding: 20px;
        gap: 16px;
    }

    .stat-icon[b-x1859ja55q] {
        width: 48px;
        height: 48px;
        font-size: 1.25rem;
    }

    .stat-number[b-x1859ja55q] {
        font-size: 1.5rem;
    }

    .card-header-clean[b-x1859ja55q] {
        padding: 16px;
    }

    .card-header-clean h3[b-x1859ja55q] {
        font-size: 1.25rem;
    }
    
    .filters-section[b-x1859ja55q] {
        padding: 16px;
    }

    .modal-dialog[b-x1859ja55q] {
        width: 95%;
        margin: 1rem;
    }

    .modal-header[b-x1859ja55q], .modal-body[b-x1859ja55q], .modal-footer[b-x1859ja55q] {
        padding: 20px;
    }
}
/* /Features/Employer/Templates/Components/EmployerTemplatePreview.razor.rz.scp.css */
.employer-template-preview[b-6okjuzjpcd] {
    background: #fff;
    border-radius: 8px;
    padding: 1.5rem;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
    max-height: 70vh;
    overflow-y: auto;
}

.preview-header[b-6okjuzjpcd] {
    border-bottom: 1px solid #e2e6ea;
    padding-bottom: 1rem;
    margin-bottom: 1.5rem;
}

.preview-header h4[b-6okjuzjpcd] {
    color: #14213d;
    margin: 0 0 0.5rem 0;
    font-weight: 600;
}

.template-description[b-6okjuzjpcd] {
    color: #6c757d;
    margin: 0 0 1rem 0;
    font-size: 0.95rem;
    line-height: 1.4;
}

.template-meta[b-6okjuzjpcd] {
    display: flex;
    gap: 1rem;
    flex-wrap: wrap;
    align-items: center;
}

.meta-item[b-6okjuzjpcd] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    color: #6c757d;
    font-size: 0.9rem;
}

.meta-item i[b-6okjuzjpcd] {
    color: #c8a951;
    font-size: 0.8rem;
}

.default-badge[b-6okjuzjpcd] {
    background: linear-gradient(135deg, #c8a951, #d4b862);
    color: white;
    padding: 0.25rem 0.75rem;
    border-radius: 15px;
    font-size: 0.75rem;
    font-weight: 500;
}

.default-badge i[b-6okjuzjpcd] {
    color: white;
}

.preview-content[b-6okjuzjpcd] {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

.preview-question[b-6okjuzjpcd] {
    display: flex;
    gap: 1rem;
    background: #f8f9fa;
    border: 1px solid #e9ecef;
    border-radius: 8px;
    padding: 1rem;
    transition: all 0.3s ease;
}

.preview-question:hover[b-6okjuzjpcd] {
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

.question-number[b-6okjuzjpcd] {
    background: #14213d;
    color: white;
    width: 2rem;
    height: 2rem;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 600;
    font-size: 0.9rem;
    flex-shrink: 0;
}

.question-content[b-6okjuzjpcd] {
    flex: 1;
}

.question-header[b-6okjuzjpcd] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 1rem;
    gap: 1rem;
}

.question-text[b-6okjuzjpcd] {
    color: #14213d;
    font-size: 1rem;
    font-weight: 500;
    margin: 0;
    flex: 1;
}

.required[b-6okjuzjpcd] {
    color: #dc3545;
    font-weight: bold;
}

.question-type[b-6okjuzjpcd] {
    background: #c8a951;
    color: white;
    padding: 0.25rem 0.75rem;
    border-radius: 12px;
    font-size: 0.75rem;
    font-weight: 500;
    text-transform: uppercase;
    white-space: nowrap;
}

.question-content-area[b-6okjuzjpcd] {
    background: white;
    border: 1px solid #e9ecef;
    border-radius: 6px;
    padding: 1rem;
}

.options-preview[b-6okjuzjpcd] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.option-preview[b-6okjuzjpcd] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.option-preview input[type="radio"][b-6okjuzjpcd],
.option-preview input[type="checkbox"][b-6okjuzjpcd] {
    margin: 0;
    cursor: not-allowed;
}

.option-preview label[b-6okjuzjpcd] {
    color: #495057;
    margin: 0;
    cursor: not-allowed;
    font-size: 0.9rem;
}

.scale-preview[b-6okjuzjpcd] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.scale-options[b-6okjuzjpcd] {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
}

.scale-option[b-6okjuzjpcd] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.scale-option input[type="radio"][b-6okjuzjpcd] {
    margin: 0;
    cursor: not-allowed;
}

.scale-option label[b-6okjuzjpcd] {
    color: #495057;
    margin: 0;
    cursor: not-allowed;
    font-size: 0.9rem;
}

.yesno-preview[b-6okjuzjpcd] {
    display: flex;
    gap: 2rem;
}

.form-control[b-6okjuzjpcd] {
    border: 1px solid #ced4da;
    border-radius: 4px;
    padding: 0.5rem;
    font-size: 0.9rem;
    cursor: not-allowed;
    background-color: #f8f9fa;
}

.form-control:disabled[b-6okjuzjpcd] {
    opacity: 0.6;
}

.no-questions[b-6okjuzjpcd], .no-template[b-6okjuzjpcd] {
    text-align: center;
    padding: 2rem;
    color: #6c757d;
}

.no-questions i[b-6okjuzjpcd], .no-template i[b-6okjuzjpcd] {
    font-size: 3rem;
    color: #c8a951;
    margin-bottom: 1rem;
}

.no-questions h5[b-6okjuzjpcd] {
    color: #14213d;
    margin-bottom: 0.5rem;
}

.no-questions p[b-6okjuzjpcd], .no-template p[b-6okjuzjpcd] {
    margin: 0;
    font-size: 0.9rem;
}

/* Responsive design */
@media (max-width: 768px) {
    .employer-template-preview[b-6okjuzjpcd] {
        padding: 1rem;
    }
    
    .preview-question[b-6okjuzjpcd] {
        flex-direction: column;
        gap: 0.75rem;
    }
    
    .question-number[b-6okjuzjpcd] {
        align-self: flex-start;
    }
    
    .question-header[b-6okjuzjpcd] {
        flex-direction: column;
        gap: 0.5rem;
    }
    
    .template-meta[b-6okjuzjpcd] {
        flex-direction: column;
        gap: 0.5rem;
        align-items: flex-start;
    }
    
    .scale-options[b-6okjuzjpcd] {
        flex-direction: column;
        gap: 0.5rem;
    }
    
    .yesno-preview[b-6okjuzjpcd] {
        flex-direction: column;
        gap: 0.75rem;
    }
}
/* /Features/Employer/Templates/Components/TemplateCloneSlideOut.razor.rz.scp.css */
.clone-slideout-overlay[b-tj1gl6a76l] {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5);
    z-index: 1060;
    opacity: 0;
    visibility: hidden;
    transition: all 0.3s ease;
    backdrop-filter: blur(2px);
}

.clone-slideout-overlay.show[b-tj1gl6a76l] {
    opacity: 1;
    visibility: visible;
}

.clone-slideout[b-tj1gl6a76l] {
    position: fixed;
    top: 0;
    right: 0;
    width: 600px;
    max-width: 90vw;
    height: 100%;
    background: white;
    box-shadow: -4px 0 15px rgba(0, 0, 0, 0.2);
    transform: translateX(100%);
    transition: transform 0.3s ease;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.clone-slideout.show[b-tj1gl6a76l] {
    transform: translateX(0);
}

.slideout-header[b-tj1gl6a76l] {
    padding: 25px;
    background: linear-gradient(135deg, #14213D 0%, #1a2a4a 100%);
    color: white;
    display: flex;
    justify-content: space-between;
    align-items: center;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}

.slideout-header h4[b-tj1gl6a76l] {
    margin: 0;
    font-size: 1.25rem;
    font-weight: 600;
}

.slideout-header .btn-close[b-tj1gl6a76l] {
    background: none;
    border: none;
    color: white;
    font-size: 1.5rem;
    cursor: pointer;
    opacity: 0.8;
    transition: opacity 0.3s ease;
    padding: 0;
}

.slideout-header .btn-close:hover[b-tj1gl6a76l] {
    opacity: 1;
}

.slideout-content[b-tj1gl6a76l] {
    flex: 1;
    padding: 30px;
    overflow-y: auto;
    position: relative;
}

.processing-overlay[b-tj1gl6a76l] {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(255, 255, 255, 0.9);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    z-index: 10;
}

.processing-overlay .spinner-border[b-tj1gl6a76l] {
    width: 3rem;
    height: 3rem;
    margin-bottom: 20px;
}

.processing-overlay p[b-tj1gl6a76l] {
    color: #6c757d;
    font-size: 1.1rem;
    margin: 0;
}

.clone-steps[b-tj1gl6a76l] {
    space-y: 30px;
}

.step-section[b-tj1gl6a76l] {
    margin-bottom: 30px;
    border: 2px solid #E2E6EA;
    border-radius: 12px;
    overflow: hidden;
    transition: all 0.3s ease;
}

.step-section.active[b-tj1gl6a76l] {
    border-color: #C8A951;
    box-shadow: 0 4px 12px rgba(200, 169, 81, 0.15);
}

.step-header[b-tj1gl6a76l] {
    padding: 20px 25px;
    background: rgba(255, 255, 255, 0.8);
    display: flex;
    align-items: center;
    gap: 15px;
    border-bottom: 1px solid #E2E6EA;
}

.step-section.active .step-header[b-tj1gl6a76l] {
    background: linear-gradient(135deg, rgba(200, 169, 81, 0.1) 0%, rgba(200, 169, 81, 0.05) 100%);
    border-bottom-color: #C8A951;
}

.step-number[b-tj1gl6a76l] {
    width: 35px;
    height: 35px;
    border-radius: 50%;
    background: #6c757d;
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 600;
    font-size: 1rem;
}

.step-section.active .step-number[b-tj1gl6a76l] {
    background: #C8A951;
}

.step-header h5[b-tj1gl6a76l] {
    margin: 0;
    color: #14213D;
    font-size: 1.1rem;
    font-weight: 600;
}

.step-content[b-tj1gl6a76l] {
    padding: 25px;
}

.step-actions[b-tj1gl6a76l] {
    display: flex;
    gap: 15px;
    justify-content: flex-end;
    margin-top: 25px;
    padding-top: 20px;
    border-top: 1px solid #E2E6EA;
}

.questions-selection[b-tj1gl6a76l] {
    margin-bottom: 20px;
}

.selection-controls[b-tj1gl6a76l] {
    display: flex;
    gap: 10px;
    align-items: center;
    margin-bottom: 20px;
    padding-bottom: 15px;
    border-bottom: 1px solid #E2E6EA;
}

.selected-count[b-tj1gl6a76l] {
    margin-left: auto;
    color: #6c757d;
    font-weight: 500;
    font-size: 0.9rem;
}

.questions-list[b-tj1gl6a76l] {
    max-height: 400px;
    overflow-y: auto;
    border: 1px solid #E2E6EA;
    border-radius: 8px;
    background: #f8f9fa;
}

.question-item[b-tj1gl6a76l] {
    display: flex;
    align-items: flex-start;
    gap: 15px;
    padding: 20px;
    border-bottom: 1px solid #E2E6EA;
    transition: all 0.3s ease;
    cursor: pointer;
}

.question-item:last-child[b-tj1gl6a76l] {
    border-bottom: none;
}

.question-item:hover[b-tj1gl6a76l] {
    background: rgba(200, 169, 81, 0.05);
}

.question-item.selected[b-tj1gl6a76l] {
    background: rgba(200, 169, 81, 0.1);
    border-left: 4px solid #C8A951;
}

.question-checkbox[b-tj1gl6a76l] {
    position: relative;
    margin-top: 2px;
}

.question-checkbox input[type="checkbox"][b-tj1gl6a76l] {
    width: 18px;
    height: 18px;
    margin: 0;
    cursor: pointer;
    accent-color: #C8A951;
}

.question-checkbox label[b-tj1gl6a76l] {
    position: absolute;
    top: 0;
    left: 0;
    width: 18px;
    height: 18px;
    cursor: pointer;
    margin: 0;
}

.question-content[b-tj1gl6a76l] {
    flex: 1;
}

.question-text[b-tj1gl6a76l] {
    color: #14213D;
    font-weight: 500;
    margin-bottom: 8px;
    line-height: 1.4;
}

.question-options[b-tj1gl6a76l] {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}

.option-tag[b-tj1gl6a76l] {
    padding: 4px 8px;
    background: #E2E6EA;
    color: #2E2E2E;
    border-radius: 4px;
    font-size: 0.8rem;
}

.more-options[b-tj1gl6a76l] {
    padding: 4px 8px;
    background: #C8A951;
    color: white;
    border-radius: 4px;
    font-size: 0.8rem;
    font-weight: 500;
}

.preview-summary[b-tj1gl6a76l] {
    background: #f8f9fa;
    border-radius: 8px;
    padding: 20px;
    margin-bottom: 20px;
}

.summary-item[b-tj1gl6a76l] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    padding: 8px 0;
    border-bottom: 1px solid #E2E6EA;
}

.summary-item:last-child[b-tj1gl6a76l] {
    border-bottom: none;
}

.summary-label[b-tj1gl6a76l] {
    font-weight: 600;
    color: #14213D;
    min-width: 120px;
}

.summary-value[b-tj1gl6a76l] {
    color: #2E2E2E;
    text-align: right;
    flex: 1;
}

.alert[b-tj1gl6a76l] {
    border-radius: 8px;
    padding: 15px;
    margin-bottom: 20px;
    display: flex;
    align-items: center;
    gap: 10px;
}

.alert-danger[b-tj1gl6a76l] {
    background: linear-gradient(135deg, rgba(220, 53, 69, 0.1) 0%, rgba(200, 35, 51, 0.1) 100%);
    border: 1px solid rgba(220, 53, 69, 0.3);
    color: #dc3545;
}

.alert i[b-tj1gl6a76l] {
    font-size: 1.1rem;
}

/* Form Controls */
.form-group[b-tj1gl6a76l] {
    margin-bottom: 20px;
}

.form-label[b-tj1gl6a76l] {
    display: block;
    color: #14213D;
    font-weight: 600;
    margin-bottom: 8px;
    font-size: 0.9rem;
}

.form-select[b-tj1gl6a76l] {
    width: 100%;
    padding: 10px 15px;
    border: 2px solid #E2E6EA;
    border-radius: 8px;
    background: #ffffff;
    color: #14213D;
    font-size: 1rem;
    transition: all 0.3s ease;
}

.form-select:focus[b-tj1gl6a76l] {
    border-color: #C8A951;
    box-shadow: 0 0 0 0.2rem rgba(200, 169, 81, 0.25);
    outline: none;
}

/* Responsive Design */
@media (max-width: 768px) {
    .clone-slideout[b-tj1gl6a76l] {
        width: 100%;
        max-width: 100vw;
    }
    
    .slideout-header[b-tj1gl6a76l] {
        padding: 20px;
    }
    
    .slideout-header h4[b-tj1gl6a76l] {
        font-size: 1.1rem;
    }
    
    .slideout-content[b-tj1gl6a76l] {
        padding: 20px;
    }
    
    .step-section[b-tj1gl6a76l] {
        margin-bottom: 20px;
    }
    
    .step-header[b-tj1gl6a76l] {
        padding: 15px 20px;
    }
    
    .step-content[b-tj1gl6a76l] {
        padding: 20px;
    }
    
    .step-actions[b-tj1gl6a76l] {
        flex-direction: column;
        gap: 10px;
    }
    
    .selection-controls[b-tj1gl6a76l] {
        flex-wrap: wrap;
        gap: 8px;
    }
    
    .selected-count[b-tj1gl6a76l] {
        margin-left: 0;
        width: 100%;
        text-align: center;
        margin-top: 10px;
    }
    
    .questions-list[b-tj1gl6a76l] {
        max-height: 300px;
    }
    
    .question-item[b-tj1gl6a76l] {
        padding: 15px;
    }
    
    .summary-item[b-tj1gl6a76l] {
        flex-direction: column;
        align-items: flex-start;
        gap: 5px;
    }
    
    .summary-value[b-tj1gl6a76l] {
        text-align: left;
    }
}

@media (max-width: 480px) {
    .slideout-header[b-tj1gl6a76l] {
        padding: 15px;
    }
    
    .slideout-content[b-tj1gl6a76l] {
        padding: 15px;
    }
    
    .step-header[b-tj1gl6a76l] {
        padding: 12px 15px;
        gap: 10px;
    }
    
    .step-number[b-tj1gl6a76l] {
        width: 30px;
        height: 30px;
        font-size: 0.9rem;
    }
    
    .step-header h5[b-tj1gl6a76l] {
        font-size: 1rem;
    }
    
    .step-content[b-tj1gl6a76l] {
        padding: 15px;
    }
    
    .question-item[b-tj1gl6a76l] {
        padding: 12px;
        gap: 12px;
    }
}
/* /Features/Employer/Templates/EmployerTemplatesPage.razor.rz.scp.css */
.employer-templates-container[b-x7vpsk2sm8] {
    padding: 0;
    min-height: 100vh;
    background: transparent;
}

.page-header[b-x7vpsk2sm8] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 30px;
    padding: 30px 30px 0 30px;
}

.header-content h1[b-x7vpsk2sm8] {
    color: #14213D;
    font-size: 2.5rem;
    font-weight: 700;
    margin: 0;
    text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.1);
}

.header-content p[b-x7vpsk2sm8] {
    color: #6c757d;
    font-size: 1.1rem;
    margin: 5px 0 0 0;
}

.subscription-info[b-x7vpsk2sm8] {
    display: flex;
    align-items: center;
}

.subscription-badge[b-x7vpsk2sm8] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 16px;
    border-radius: 20px;
    font-weight: 600;
    font-size: 0.9rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}

.subscription-bronze[b-x7vpsk2sm8] {
    background: linear-gradient(135deg, #CD7F32 0%, #B8731F 100%);
    color: white;
}

.subscription-silver[b-x7vpsk2sm8] {
    background: linear-gradient(135deg, #C0C0C0 0%, #A8A8A8 100%);
    color: #2E2E2E;
}

.subscription-gold[b-x7vpsk2sm8] {
    background: linear-gradient(135deg, #FFD700 0%, #FFC107 100%);
    color: #2E2E2E;
}

.subscription-platinum[b-x7vpsk2sm8] {
    background: linear-gradient(135deg, #E5E4E2 0%, #B8B8B8 100%);
    color: #2E2E2E;
}

.subscription-free[b-x7vpsk2sm8] {
    background: linear-gradient(135deg, #6c757d 0%, #5a6268 100%);
    color: white;
}

/* Tier Badge Styles */
.tier-badge[b-x7vpsk2sm8] {
    display: inline-flex;
    align-items: center;
    padding: 4px 10px;
    border-radius: 12px;
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

.tier-badge-free[b-x7vpsk2sm8] {
    background: #6c757d !important;
    color: white;
}

.tier-badge-bronze[b-x7vpsk2sm8] {
    background: #CD7F32 !important;
    color: white;
}

.tier-badge-silver[b-x7vpsk2sm8] {
    background:  #C0C0C0 !important;
    color: white;
}

.tier-badge-gold[b-x7vpsk2sm8] {
    background: #C8A951 !important;
    color: white;
}

.tier-badge-platinum[b-x7vpsk2sm8] {
    background: linear-gradient(135deg, #E5E4E2 0%, #B0C4DE 100%);
    color: #14213D;
}

.tier-badge-all[b-x7vpsk2sm8] {
    background: linear-gradient(135deg, #BFD8B8 0%, #8FBC8F 100%);
    color: #14213D;
}

.tier-badge-unknown[b-x7vpsk2sm8] {
    background: #6c757d;
    color: white;
}

.filters-section[b-x7vpsk2sm8] {
    margin-bottom: 30px;
}

.filters-content[b-x7vpsk2sm8] {
    padding: 0 30px 20px 30px;
}

.filter-row[b-x7vpsk2sm8] {
    display: grid;
    grid-template-columns: 2fr 1fr 1fr auto;
    gap: 20px;
    align-items: end;
}

.filter-group[b-x7vpsk2sm8] {
    display: flex;
    flex-direction: column;
}

.filter-group label[b-x7vpsk2sm8] {
    color: #14213D;
    font-weight: 600;
    margin-bottom: 8px;
    font-size: 0.9rem;
}

.filter-group .form-select[b-x7vpsk2sm8] {
    padding: 10px 15px;
    border: 2px solid #E2E6EA;
    border-radius: 8px;
    background: #ffffff;
    color: #14213D;
    font-size: 1rem;
    transition: all 0.3s ease;
}

.filter-group .form-select:focus[b-x7vpsk2sm8] {
    border-color: #C8A951;
    box-shadow: 0 0 0 0.2rem rgba(200, 169, 81, 0.25);
    outline: none;
}

.filter-actions[b-x7vpsk2sm8] {
    display: flex;
    gap: 10px;
}

.templates-section[b-x7vpsk2sm8] {
    margin-bottom: 30px;
    padding: 0 30px;
}

/* DataGrid Styles */
.templates-data-grid[b-x7vpsk2sm8] {
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
    background: white;
}

.templates-data-grid .e-gridheader[b-x7vpsk2sm8] {
    background: linear-gradient(135deg, #14213D 0%, #1a2a4a 100%);
    color: white;
    font-weight: 600;
}

.templates-data-grid .e-gridheader .e-headercell[b-x7vpsk2sm8] {
    border-color: rgba(255, 255, 255, 0.1);
}

.templates-data-grid .e-gridcontent .e-row[b-x7vpsk2sm8] {
    border-color: #E2E6EA;
    transition: all 0.3s ease;
}

.templates-data-grid .e-gridcontent .e-row:hover[b-x7vpsk2sm8] {
    background: #f8f9fa;
}

.templates-data-grid .e-gridcontent .e-row.e-altrow[b-x7vpsk2sm8] {
    background: #ffffff;
}

.templates-data-grid .e-gridcontent .e-row.e-altrow:hover[b-x7vpsk2sm8] {
    background: #f8f9fa;
}

.template-name-cell[b-x7vpsk2sm8] {
    padding: 10px 0;
}

.template-title[b-x7vpsk2sm8] {
    color: #14213D;
    font-size: 1.1rem;
    font-weight: 600;
    margin: 0 0 8px 0;
}

.template-badges[b-x7vpsk2sm8] {
    display: flex;
    gap: 8px;
    align-items: center;
    margin-bottom: 8px;
}

.template-description[b-x7vpsk2sm8] {
    color: #2E2E2E;
    font-size: 0.9rem;
    margin: 0;
    line-height: 1.4;
    opacity: 0.8;
}

.complexity-badge[b-x7vpsk2sm8] {
    padding: 4px 8px;
    border-radius: 4px;
    font-size: 0.8rem;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.complexity-simple[b-x7vpsk2sm8] {
    background: #d4edda;
    color: #155724;
}

.complexity-medium[b-x7vpsk2sm8] {
    background: #fff3cd;
    color: #856404;
}

.complexity-complex[b-x7vpsk2sm8] {
    background: #f8d7da;
    color: #721c24;
}

.action-buttons[b-x7vpsk2sm8] {
    display: flex;
    gap: 8px;
    align-items: center;
}

.action-buttons .btn-icon[b-x7vpsk2sm8] {
    min-width: 32px;
    height: 32px;
    padding: 6px;
    border-radius: 6px;
    transition: all 0.3s ease;
}

.action-buttons .btn-icon:hover[b-x7vpsk2sm8] {
    transform: translateY(-2px);
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15);
}

.loading-container[b-x7vpsk2sm8] {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 60px 20px;
    color: #6c757d;
}

.loading-container .spinner-border[b-x7vpsk2sm8] {
    width: 3rem;
    height: 3rem;
    margin-bottom: 20px;
}

.template-item[b-x7vpsk2sm8] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0;
    border-radius: 8px;
    transition: all 0.3s ease;
}

.template-main[b-x7vpsk2sm8] {
    flex: 1;
    margin-right: 20px;
}

.template-header[b-x7vpsk2sm8] {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 8px;
}

.template-name[b-x7vpsk2sm8] {
    color: #14213D;
    font-size: 1.3rem;
    font-weight: 700;
    margin: 0;
}

.default-badge[b-x7vpsk2sm8] {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 4px 10px;
    background: linear-gradient(135deg, #C8A951 0%, #b8994a 100%);
    color: white;
    border-radius: 15px;
    font-size: 0.8rem;
    font-weight: 600;
    box-shadow: 0 2px 4px rgba(200, 169, 81, 0.3);
}

.premium-badge[b-x7vpsk2sm8] {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 4px 10px;
    background: linear-gradient(135deg, #6c757d 0%, #495057 100%);
    color: white;
    border-radius: 15px;
    font-size: 0.8rem;
    font-weight: 600;
    box-shadow: 0 2px 4px rgba(108, 117, 125, 0.3);
}

.template-description[b-x7vpsk2sm8] {
    color: #2E2E2E;
    font-size: 1rem;
    margin: 0 0 12px 0;
    line-height: 1.4;
}

.template-meta[b-x7vpsk2sm8] {
    display: flex;
    gap: 20px;
    flex-wrap: wrap;
}

.meta-item[b-x7vpsk2sm8] {
    display: flex;
    align-items: center;
    gap: 8px;
    color: #6c757d;
    font-size: 0.9rem;
}

.meta-item i[b-x7vpsk2sm8] {
    color: #C8A951;
    width: 16px;
    text-align: center;
}

.template-actions[b-x7vpsk2sm8] {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}

.empty-state[b-x7vpsk2sm8] {
    text-align: center;
    padding: 60px 20px;
    color: #6c757d;
}

.empty-state i[b-x7vpsk2sm8] {
    font-size: 4rem;
    color: #C8A951;
    margin-bottom: 20px;
    opacity: 0.7;
}

.empty-state h3[b-x7vpsk2sm8] {
    color: #14213D;
    font-size: 1.8rem;
    font-weight: 700;
    margin: 0 0 10px 0;
}

.empty-state p[b-x7vpsk2sm8] {
    font-size: 1.1rem;
    margin: 0 0 30px 0;
}

/* Modal Styles */
.modal-overlay[b-x7vpsk2sm8] {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1050;
    backdrop-filter: blur(2px);
    animation: fadeIn-b-x7vpsk2sm8 0.3s ease-out;
}

.modal-dialog[b-x7vpsk2sm8] {
    max-width: 700px;
    width: 90%;
    max-height: 90%;
    overflow: hidden;
}

.modal-content[b-x7vpsk2sm8] {
    background: white;
    border-radius: 12px;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3);
    overflow: hidden;
    max-width: 800px;
    width: 90vw;
    max-height: 90vh;
    animation: slideInUp-b-x7vpsk2sm8 0.3s ease-out;
}

.modal-header[b-x7vpsk2sm8] {
    padding: 20px 25px;
    border-bottom: 1px solid #E2E6EA;
    background: linear-gradient(135deg, #14213D 0%, #1a2a4a 100%);
    color: white;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.modal-header h3[b-x7vpsk2sm8] {
    margin: 0;
    font-size: 1.25rem;
    font-weight: 600;
}

.modal-close[b-x7vpsk2sm8] {
    background: none;
    border: none;
    color: white;
    font-size: 1.5rem;
    cursor: pointer;
    opacity: 0.8;
    transition: opacity 0.3s ease;
    padding: 0;
    width: 30px;
    height: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.modal-close:hover[b-x7vpsk2sm8] {
    opacity: 1;
}

.modal-title[b-x7vpsk2sm8] {
    margin: 0;
    font-size: 1.25rem;
    font-weight: 600;
}

.btn-close[b-x7vpsk2sm8] {
    background: none;
    border: none;
    color: white;
    font-size: 1.5rem;
    cursor: pointer;
    opacity: 0.8;
    transition: opacity 0.3s ease;
}

.btn-close:hover[b-x7vpsk2sm8] {
    opacity: 1;
}

.modal-body[b-x7vpsk2sm8] {
    padding: 0;
    max-height: 70vh;
    overflow-y: auto;
}

.template-preview .preview-section[b-x7vpsk2sm8] {
    margin-bottom: 25px;
}

.template-preview h6[b-x7vpsk2sm8] {
    color: #14213D;
    font-weight: 600;
    margin-bottom: 10px;
    font-size: 1rem;
}

.detail-grid[b-x7vpsk2sm8] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 15px;
}

.detail-item[b-x7vpsk2sm8] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.detail-label[b-x7vpsk2sm8] {
    font-weight: 600;
    color: #6c757d;
    font-size: 0.85rem;
}

.detail-value[b-x7vpsk2sm8] {
    color: #14213D;
    font-weight: 500;
}

.questions-preview[b-x7vpsk2sm8] {
    space-y: 15px;
}

.question-item[b-x7vpsk2sm8] {
    padding: 15px;
    border: 1px solid #E2E6EA;
    border-radius: 8px;
    background: #f8f9fa;
    margin-bottom: 12px;
}

.question-text[b-x7vpsk2sm8] {
    color: #14213D;
    font-weight: 500;
    margin-bottom: 8px;
}

.question-options[b-x7vpsk2sm8] {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}

.option-tag[b-x7vpsk2sm8] {
    padding: 4px 8px;
    background: #E2E6EA;
    color: #2E2E2E;
    border-radius: 4px;
    font-size: 0.8rem;
}

.more-options[b-x7vpsk2sm8] {
    padding: 4px 8px;
    background: #C8A951;
    color: white;
    border-radius: 4px;
    font-size: 0.8rem;
    font-weight: 500;
}

.more-questions[b-x7vpsk2sm8] {
    text-align: center;
    padding: 15px;
    color: #6c757d;
    font-style: italic;
}

.modal-footer[b-x7vpsk2sm8] {
    padding: 20px 25px;
    border-top: 1px solid #E2E6EA;
    background: #f8f9fa;
    display: flex;
    gap: 10px;
    justify-content: flex-end;
}

/* Alert Styles */
.alert[b-x7vpsk2sm8] {
    position: fixed;
    top: 20px;
    right: 20px;
    z-index: 1055;
    min-width: 350px;
    max-width: 500px;
    border: none;
    border-radius: 8px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
    animation: slideInRight-b-x7vpsk2sm8 0.3s ease-out;
}

.alert i[b-x7vpsk2sm8] {
    margin-right: 8px;
}

.alert-danger[b-x7vpsk2sm8] {
    background: linear-gradient(135deg, #dc3545 0%, #c82333 100%);
    color: white;
}

.alert-success[b-x7vpsk2sm8] {
    background: linear-gradient(135deg, #28a745 0%, #20c997 100%);
    color: white;
}

.alert .btn-close[b-x7vpsk2sm8] {
    filter: invert(1);
    opacity: 0.8;
}

.alert .btn-close:hover[b-x7vpsk2sm8] {
    opacity: 1;
}

@keyframes slideInRight-b-x7vpsk2sm8 {
    from {
        transform: translateX(100%);
        opacity: 0;
    }
    to {
        transform: translateX(0);
        opacity: 1;
    }
}

@keyframes fadeIn-b-x7vpsk2sm8 {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}

@keyframes slideInUp-b-x7vpsk2sm8 {
    from {
        transform: translateY(30px);
        opacity: 0;
    }
    to {
        transform: translateY(0);
        opacity: 1;
    }
}

/* Responsive Design */
@media (max-width: 1200px) {
    .filter-row[b-x7vpsk2sm8] {
        grid-template-columns: 1fr 1fr;
        gap: 15px;
    }
    
    .filter-actions[b-x7vpsk2sm8] {
        grid-column: 1 / -1;
        justify-content: flex-start;
        margin-top: 10px;
    }
    
    .templates-data-grid[b-x7vpsk2sm8] {
        font-size: 0.9rem;
    }
}

@media (max-width: 768px) {
    .page-header[b-x7vpsk2sm8] {
        padding: 15px 15px 0 15px;
        flex-direction: column;
        align-items: flex-start;
        gap: 20px;
    }
    
    .filters-content[b-x7vpsk2sm8] {
        padding: 0 15px 20px 15px;
    }
    
    .templates-section[b-x7vpsk2sm8] {
        padding: 0 15px;
    }
    
    .header-content h1[b-x7vpsk2sm8] {
        font-size: 2rem;
    }
    
    .filter-row[b-x7vpsk2sm8] {
        grid-template-columns: 1fr;
        gap: 15px;
    }
    
    .templates-data-grid[b-x7vpsk2sm8] {
        font-size: 0.8rem;
        height: 500px !important;
    }
    
    .template-title[b-x7vpsk2sm8] {
        font-size: 1rem;
    }
    
    .template-description[b-x7vpsk2sm8] {
        font-size: 0.85rem;
    }
    
    .action-buttons[b-x7vpsk2sm8] {
        flex-direction: column;
        gap: 4px;
    }
    
    .action-buttons .btn-icon[b-x7vpsk2sm8] {
        min-width: 28px;
        height: 28px;
        font-size: 0.8rem;
    }
    
    .modal-dialog[b-x7vpsk2sm8] {
        width: 95%;
        max-height: 95%;
    }
    
    .modal-body[b-x7vpsk2sm8] {
        padding: 20px;
    }
    
    .detail-grid[b-x7vpsk2sm8] {
        grid-template-columns: 1fr;
    }
    
    .alert[b-x7vpsk2sm8] {
        position: relative;
        top: auto;
        right: auto;
        margin: 20px 0;
        min-width: auto;
        max-width: none;
    }
}

@media (max-width: 480px) {
    .page-header[b-x7vpsk2sm8] {
        padding: 10px 10px 0 10px;
    }
    
    .filters-content[b-x7vpsk2sm8] {
        padding: 0 10px 15px 10px;
    }
    
    .templates-section[b-x7vpsk2sm8] {
        padding: 0 10px;
    }
    
    .header-content h1[b-x7vpsk2sm8] {
        font-size: 1.8rem;
    }
    
    .templates-data-grid[b-x7vpsk2sm8] {
        height: 400px !important;
    }
    
    .subscription-badge[b-x7vpsk2sm8] {
        padding: 6px 12px;
        font-size: 0.8rem;
    }
}
/* /Features/Error/UnauthorizedPage.razor.rz.scp.css */
.unauthorized-container[b-7vz1v0fx1p] {
    min-height: 80vh;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 2rem;
    background: transparent;
}

.error-card[b-7vz1v0fx1p] {
    background: #ffffff;
    border-radius: 12px;
    box-shadow: 0 8px 32px rgba(20, 33, 61, 0.1);
    padding: 3rem;
    text-align: center;
    max-width: 500px;
    width: 100%;
    border: 1px solid #e2e6ea;
}

.error-icon[b-7vz1v0fx1p] {
    margin-bottom: 1.5rem;
}

.error-icon i[b-7vz1v0fx1p] {
    font-size: 4rem;
    color: #14213d;
    opacity: 0.8;
}

.error-card h2[b-7vz1v0fx1p] {
    color: #14213d;
    margin-bottom: 1rem;
    font-weight: 600;
    font-size: 2rem;
}

.error-message[b-7vz1v0fx1p] {
    color: #2e2e2e;
    font-size: 1.1rem;
    margin-bottom: 0.75rem;
    font-weight: 500;
}

.error-description[b-7vz1v0fx1p] {
    color: #6c757d;
    margin-bottom: 2rem;
    line-height: 1.5;
}

.action-buttons[b-7vz1v0fx1p] {
    display: flex;
    gap: 1rem;
    justify-content: center;
    margin-bottom: 2rem;
    flex-wrap: wrap;
}

.action-buttons .btn[b-7vz1v0fx1p] {
    border-radius: 8px;
    padding: 0.75rem 1.5rem;
    font-weight: 500;
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    transition: all 0.3s ease;
    border: none;
    text-decoration: none;
}

.action-buttons .btn-primary[b-7vz1v0fx1p] {
    background: linear-gradient(135deg, #14213d 0%, #1a2a4a 100%);
    color: #ffffff;
}

.action-buttons .btn-primary:hover[b-7vz1v0fx1p] {
    background: linear-gradient(135deg, #1a2a4a 0%, #14213d 100%);
    transform: translateY(-2px);
    box-shadow: 0 4px 16px rgba(20, 33, 61, 0.3);
}

.action-buttons .btn-secondary[b-7vz1v0fx1p] {
    background: #e2e6ea;
    color: #14213d;
}

.action-buttons .btn-secondary:hover[b-7vz1v0fx1p] {
    background: #d1d7dd;
    transform: translateY(-2px);
    box-shadow: 0 4px 16px rgba(20, 33, 61, 0.1);
}

.contact-support[b-7vz1v0fx1p] {
    border-top: 1px solid #e2e6ea;
    padding-top: 1.5rem;
    margin-top: 1.5rem;
}

.contact-support p[b-7vz1v0fx1p] {
    color: #6c757d;
    margin: 0;
    font-size: 0.9rem;
}

.contact-support a[b-7vz1v0fx1p] {
    color: #c8a951;
    text-decoration: none;
    font-weight: 500;
}

.contact-support a:hover[b-7vz1v0fx1p] {
    text-decoration: underline;
}

@media (max-width: 768px) {
    .unauthorized-container[b-7vz1v0fx1p] {
        padding: 1rem;
        min-height: 70vh;
    }
    
    .error-card[b-7vz1v0fx1p] {
        padding: 2rem;
    }
    
    .error-card h2[b-7vz1v0fx1p] {
        font-size: 1.5rem;
    }
    
    .action-buttons[b-7vz1v0fx1p] {
        flex-direction: column;
        align-items: center;
    }
    
    .action-buttons .btn[b-7vz1v0fx1p] {
        width: 100%;
        max-width: 200px;
    }
}
/* /Features/Hazards/Components/HazardAssessmentList.razor.rz.scp.css */
.assessment-list[b-pf0sjvelik] {
    padding: 1rem;
}

.assessment-grid[b-pf0sjvelik] {
    display: grid;
    gap: 1.5rem;
}

.assessment-item[b-pf0sjvelik] {
    background: #FFFFFF;
    border: 1px solid #E2E6EA;
    border-radius: 8px;
    padding: 1.5rem;
    transition: all 0.3s ease;
}

.assessment-item:hover[b-pf0sjvelik] {
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    transform: translateY(-2px);
}

.assessment-header[b-pf0sjvelik] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 1rem;
}

.assessment-name[b-pf0sjvelik] {
    color: #14213D;
    font-size: 1.1rem;
    font-weight: 600;
    margin: 0;
}

.assessment-status[b-pf0sjvelik] {
    padding: 0.25rem 0.75rem;
    border-radius: 20px;
    font-size: 0.8rem;
    font-weight: 600;
    text-transform: uppercase;
}

.status-completed[b-pf0sjvelik] {
    background: #d4edda;
    color: #155724;
}

.status-progress[b-pf0sjvelik] {
    background: #fff3cd;
    color: #856404;
}

.status-pending[b-pf0sjvelik] {
    background: #f8d7da;
    color: #721c24;
}

.status-default[b-pf0sjvelik] {
    background: #e2e3e5;
    color: #383d41;
}

.assessment-meta[b-pf0sjvelik] {
    display: flex;
    gap: 1.5rem;
    margin-bottom: 1rem;
    flex-wrap: wrap;
}

.meta-item[b-pf0sjvelik] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    color: #2E2E2E;
    font-size: 0.9rem;
}

.meta-item i[b-pf0sjvelik] {
    color: #C8A951;
}

.assessment-description[b-pf0sjvelik] {
    color: #2E2E2E;
    margin-bottom: 1.5rem;
    line-height: 1.5;
}

.assessment-actions[b-pf0sjvelik] {
    display: flex;
    gap: 0.75rem;
    flex-wrap: wrap;
}

.empty-state[b-pf0sjvelik] {
    text-align: center;
    padding: 3rem;
    color: #2E2E2E;
}

.empty-state i[b-pf0sjvelik] {
    font-size: 3rem;
    color: #C8A951;
    margin-bottom: 1rem;
}

.empty-state h3[b-pf0sjvelik] {
    color: #14213D;
    margin-bottom: 0.5rem;
}

@media (max-width: 768px) {
    .assessment-header[b-pf0sjvelik] {
        flex-direction: column;
        gap: 0.5rem;
        align-items: flex-start;
    }
    
    .assessment-meta[b-pf0sjvelik] {
        flex-direction: column;
        gap: 0.5rem;
    }
    
    .assessment-actions[b-pf0sjvelik] {
        flex-direction: column;
    }
}
/* /Features/Hazards/HazardActionsPage.razor.rz.scp.css */
.hazard-actions-page[b-d0k9sp51zb] {
    padding: 2rem;
    max-width: 1400px;
    margin: 0 auto;
}

.page-header[b-d0k9sp51zb] {
    margin-bottom: 2rem;
    text-align: center;
}

.page-title[b-d0k9sp51zb] {
    color: #14213D;
    font-size: 2.5rem;
    font-weight: 600;
    margin-bottom: 0.5rem;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 1rem;
}

.page-title i[b-d0k9sp51zb] {
    color: #C8A951;
}

.page-description[b-d0k9sp51zb] {
    color: #2E2E2E;
    font-size: 1.1rem;
    margin: 0;
}

.actions-dashboard[b-d0k9sp51zb] {
    display: grid;
    gap: 2rem;
}

.overview-section[b-d0k9sp51zb] {
    margin-bottom: 2rem;
}

.overview-grid[b-d0k9sp51zb] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 1.5rem;
}

.overview-card[b-d0k9sp51zb] {
    background: linear-gradient(135deg, #FFFFFF 0%, #E2E6EA 100%);
    border: 1px solid #E2E6EA;
    border-radius: 12px;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.05);
    transition: all 0.3s ease;
}

.overview-card:hover[b-d0k9sp51zb] {
    transform: translateY(-2px);
    box-shadow: 0 8px 15px rgba(0, 0, 0, 0.1);
}

.overview-card.overdue[b-d0k9sp51zb] {
    border-left: 4px solid #dc3545;
}

.overview-card.due-soon[b-d0k9sp51zb] {
    border-left: 4px solid #C8A951;
}

.overview-card.completed[b-d0k9sp51zb] {
    border-left: 4px solid #28a745;
}

.metric-value[b-d0k9sp51zb] {
    font-size: 2.5rem;
    font-weight: 700;
    color: #14213D;
    line-height: 1;
}

.metric-percentage[b-d0k9sp51zb] {
    font-size: 1.1rem;
    font-weight: 600;
    color: #C8A951;
    margin-top: 0.25rem;
}

.metric-info[b-d0k9sp51zb] {
    font-size: 0.9rem;
    color: #2E2E2E;
    margin-top: 0.25rem;
}

.controls-section[b-d0k9sp51zb] {
    margin-bottom: 2rem;
}

.controls-card[b-d0k9sp51zb] {
    background: linear-gradient(135deg, #BFD8B8 0%, #E2E6EA 100%);
    border: 1px solid #BFD8B8;
}

.control-actions[b-d0k9sp51zb] {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
    align-items: center;
}

.filters-section[b-d0k9sp51zb] {
    margin-bottom: 2rem;
}

.filters-card[b-d0k9sp51zb] {
    background: #FFFFFF;
    border: 1px solid #E2E6EA;
}

.filter-controls[b-d0k9sp51zb] {
    display: flex;
    flex-wrap: wrap;
    gap: 1.5rem;
    align-items: end;
}

.filter-group[b-d0k9sp51zb] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    min-width: 150px;
}

.filter-label[b-d0k9sp51zb] {
    font-weight: 600;
    color: #14213D;
    font-size: 0.9rem;
}

.filter-select[b-d0k9sp51zb] {
    padding: 0.5rem;
    border: 1px solid #E2E6EA;
    border-radius: 6px;
    background: #FFFFFF;
    color: #14213D;
    font-size: 0.9rem;
    transition: border-color 0.3s ease;
}

.filter-select:focus[b-d0k9sp51zb] {
    outline: none;
    border-color: #C8A951;
    box-shadow: 0 0 0 3px rgba(200, 169, 81, 0.1);
}

.actions-list[b-d0k9sp51zb] {
    margin-bottom: 2rem;
}

.actions-card[b-d0k9sp51zb] {
    background: #FFFFFF;
    border: 1px solid #E2E6EA;
}

.loading-spinner[b-d0k9sp51zb] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 1rem;
    padding: 3rem;
    color: #14213D;
    font-size: 1.1rem;
}

.loading-spinner i[b-d0k9sp51zb] {
    font-size: 1.5rem;
    color: #C8A951;
}

.error-message[b-d0k9sp51zb] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 1rem;
    padding: 2rem;
    color: #dc3545;
    font-size: 1.1rem;
    background: #f8d7da;
    border: 1px solid #f5c6cb;
    border-radius: 8px;
}

.error-message i[b-d0k9sp51zb] {
    font-size: 1.3rem;
}

.quick-actions-section[b-d0k9sp51zb] {
    margin-bottom: 2rem;
}

.quick-actions-grid[b-d0k9sp51zb] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 1.5rem;
}

.quick-card[b-d0k9sp51zb] {
    background: #FFFFFF;
    border: 1px solid #E2E6EA;
    border-radius: 12px;
    transition: all 0.3s ease;
}

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

.overdue-card[b-d0k9sp51zb] {
    border-left: 4px solid #dc3545;
    background: linear-gradient(135deg, #FFFFFF 0%, #f8d7da 100%);
}

.ownership-card[b-d0k9sp51zb] {
    border-left: 4px solid #C8A951;
    background: linear-gradient(135deg, #FFFFFF 0%, #BFD8B8 100%);
}

.analytics-card[b-d0k9sp51zb] {
    border-left: 4px solid #28a745;
    background: linear-gradient(135deg, #FFFFFF 0%, #d4edda 100%);
}

.quick-content[b-d0k9sp51zb] {
    text-align: center;
    padding: 1rem;
}

.quick-metric[b-d0k9sp51zb] {
    font-size: 2rem;
    font-weight: 700;
    color: #14213D;
    margin-bottom: 0.5rem;
}

.quick-text[b-d0k9sp51zb] {
    color: #2E2E2E;
    margin-bottom: 1rem;
    font-size: 0.95rem;
}

.upgrade-prompt[b-d0k9sp51zb] {
    text-align: center;
    padding: 2rem 0;
}

.upgrade-card[b-d0k9sp51zb] {
    background: linear-gradient(135deg, #FFFFFF 0%, #E2E6EA 100%);
    border: 2px solid #C8A951;
    max-width: 600px;
    margin: 0 auto;
}

.upgrade-card ul[b-d0k9sp51zb] {
    text-align: left;
    margin: 1.5rem 0;
    padding-left: 1.5rem;
}

.upgrade-card ul li[b-d0k9sp51zb] {
    color: #14213D;
    margin-bottom: 0.5rem;
}

@media (max-width: 768px) {
    .hazard-actions-page[b-d0k9sp51zb] {
        padding: 1rem;
    }
    
    .page-title[b-d0k9sp51zb] {
        font-size: 2rem;
        flex-direction: column;
        gap: 0.5rem;
    }
    
    .overview-grid[b-d0k9sp51zb] {
        grid-template-columns: 1fr;
    }
    
    .control-actions[b-d0k9sp51zb] {
        flex-direction: column;
        align-items: stretch;
    }
    
    .filter-controls[b-d0k9sp51zb] {
        flex-direction: column;
        align-items: stretch;
    }
    
    .filter-group[b-d0k9sp51zb] {
        min-width: auto;
    }
    
    .quick-actions-grid[b-d0k9sp51zb] {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 480px) {
    .page-title[b-d0k9sp51zb] {
        font-size: 1.5rem;
    }
    
    .metric-value[b-d0k9sp51zb] {
        font-size: 2rem;
    }
    
    .quick-metric[b-d0k9sp51zb] {
        font-size: 1.5rem;
    }
}
/* /Features/Hazards/HazardAnalysisPage.razor.rz.scp.css */
.hazard-analysis-page[b-30ym0b6t0n] {
    padding: 2rem;
    max-width: 1600px;
    margin: 0 auto;
}

.page-header[b-30ym0b6t0n] {
    margin-bottom: 2rem;
}

.breadcrumb[b-30ym0b6t0n] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 1rem;
    font-size: 0.9rem;
}

.breadcrumb-link[b-30ym0b6t0n] {
    color: #C8A951;
    text-decoration: none;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    transition: color 0.3s ease;
}

.breadcrumb-link:hover[b-30ym0b6t0n] {
    color: #14213D;
}

.breadcrumb-separator[b-30ym0b6t0n] {
    color: #2E2E2E;
    font-size: 0.7rem;
}

.breadcrumb-current[b-30ym0b6t0n] {
    color: #14213D;
    font-weight: 600;
}

.page-title[b-30ym0b6t0n] {
    color: #14213D;
    font-size: 2.5rem;
    font-weight: 600;
    margin-bottom: 1rem;
    display: flex;
    align-items: center;
    gap: 1rem;
}

.page-title i[b-30ym0b6t0n] {
    color: #C8A951;
}

.hazard-meta[b-30ym0b6t0n] {
    display: flex;
    flex-wrap: wrap;
    gap: 2rem;
    align-items: center;
    padding: 1rem;
    background: linear-gradient(135deg, #BFD8B8 0%, #E2E6EA 100%);
    border-radius: 8px;
}

.meta-item[b-30ym0b6t0n] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.meta-label[b-30ym0b6t0n] {
    font-size: 0.8rem;
    color: #2E2E2E;
    font-weight: 500;
}

.meta-value[b-30ym0b6t0n] {
    font-size: 1rem;
    font-weight: 600;
    color: #14213D;
}

.meta-value.risk-high[b-30ym0b6t0n] {
    color: #dc3545;
}

.meta-value.risk-medium[b-30ym0b6t0n] {
    color: #C8A951;
}

.meta-value.risk-low[b-30ym0b6t0n] {
    color: #28a745;
}

.meta-value.status-completed[b-30ym0b6t0n] {
    color: #28a745;
}

.meta-value.status-inprogress[b-30ym0b6t0n] {
    color: #C8A951;
}

.meta-value.status-pending[b-30ym0b6t0n] {
    color: #6c757d;
}

.loading-container[b-30ym0b6t0n],
.error-container[b-30ym0b6t0n] {
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 400px;
}

.loading-spinner[b-30ym0b6t0n] {
    display: flex;
    align-items: center;
    gap: 1rem;
    color: #14213D;
    font-size: 1.2rem;
}

.loading-spinner i[b-30ym0b6t0n] {
    font-size: 2rem;
    color: #C8A951;
}

.error-card[b-30ym0b6t0n] {
    max-width: 500px;
    text-align: center;
}

.error-content p[b-30ym0b6t0n] {
    color: #dc3545;
    margin-bottom: 1.5rem;
}

.analysis-dashboard[b-30ym0b6t0n] {
    display: grid;
    gap: 2rem;
}

.overview-section[b-30ym0b6t0n] {
    margin-bottom: 2rem;
}

.overview-grid[b-30ym0b6t0n] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 1.5rem;
}

.overview-card[b-30ym0b6t0n] {
    background: linear-gradient(135deg, #FFFFFF 0%, #E2E6EA 100%);
    border: 1px solid #E2E6EA;
    border-radius: 12px;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.05);
    transition: all 0.3s ease;
}

.overview-card:hover[b-30ym0b6t0n] {
    transform: translateY(-2px);
    box-shadow: 0 8px 15px rgba(0, 0, 0, 0.1);
}

.score-card[b-30ym0b6t0n] {
    border-left: 4px solid #C8A951;
}

.score-display[b-30ym0b6t0n] {
    text-align: center;
    padding: 1rem;
}

.score-value[b-30ym0b6t0n] {
    font-size: 3rem;
    font-weight: 700;
    line-height: 1;
}

.score-value.score-high[b-30ym0b6t0n] {
    color: #dc3545;
}

.score-value.score-medium[b-30ym0b6t0n] {
    color: #C8A951;
}

.score-value.score-low[b-30ym0b6t0n] {
    color: #28a745;
}

.score-description[b-30ym0b6t0n] {
    font-size: 0.9rem;
    color: #2E2E2E;
    margin-top: 0.5rem;
}

.metric-value[b-30ym0b6t0n] {
    font-size: 2.5rem;
    font-weight: 700;
    color: #14213D;
    line-height: 1;
}

.metric-info[b-30ym0b6t0n] {
    font-size: 0.9rem;
    color: #2E2E2E;
    margin-top: 0.25rem;
}

.action-pending[b-30ym0b6t0n] {
    color: #C8A951;
    font-weight: 600;
}

.recommendation-card[b-30ym0b6t0n] {
    border-left: 4px solid #BFD8B8;
}

.recommendation-text[b-30ym0b6t0n] {
    color: #14213D;
    font-weight: 500;
    font-size: 0.95rem;
    line-height: 1.4;
}

.visualization-section[b-30ym0b6t0n] {
    margin-bottom: 2rem;
}

.visualization-grid[b-30ym0b6t0n] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(500px, 1fr));
    gap: 2rem;
}

.heatmap-card[b-30ym0b6t0n],
.trend-card[b-30ym0b6t0n] {
    background: #FFFFFF;
    border: 1px solid #E2E6EA;
}

.heatmap-container[b-30ym0b6t0n],
.trend-container[b-30ym0b6t0n] {
    padding: 1rem;
}

.details-section[b-30ym0b6t0n] {
    margin-bottom: 2rem;
}

.details-grid[b-30ym0b6t0n] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(400px, 1fr));
    gap: 2rem;
}

.details-card[b-30ym0b6t0n] {
    background: #FFFFFF;
    border: 1px solid #E2E6EA;
}

.actions-section[b-30ym0b6t0n] {
    margin-bottom: 2rem;
}

.actions-card[b-30ym0b6t0n] {
    background: linear-gradient(135deg, #FFFFFF 0%, #BFD8B8 100%);
    border: 1px solid #BFD8B8;
}

.actions-header[b-30ym0b6t0n] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1.5rem;
    flex-wrap: wrap;
    gap: 1rem;
}

.actions-summary[b-30ym0b6t0n] {
    display: flex;
    gap: 2rem;
    flex-wrap: wrap;
}

.summary-item[b-30ym0b6t0n] {
    font-size: 0.9rem;
    color: #14213D;
}

.controls-section[b-30ym0b6t0n] {
    margin-bottom: 2rem;
}

.controls-grid[b-30ym0b6t0n] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(350px, 1fr));
    gap: 2rem;
}

.tools-card[b-30ym0b6t0n] {
    background: linear-gradient(135deg, #FFFFFF 0%, #E2E6EA 100%);
    border: 1px solid #E2E6EA;
}

.quick-card[b-30ym0b6t0n] {
    background: linear-gradient(135deg, #BFD8B8 0%, #E2E6EA 100%);
    border: 1px solid #BFD8B8;
}

.tool-actions[b-30ym0b6t0n] {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
}

.quick-actions[b-30ym0b6t0n] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
}

.upgrade-prompt[b-30ym0b6t0n] {
    text-align: center;
    padding: 2rem 0;
}

.upgrade-card[b-30ym0b6t0n] {
    background: linear-gradient(135deg, #FFFFFF 0%, #E2E6EA 100%);
    border: 2px solid #C8A951;
    max-width: 600px;
    margin: 0 auto;
}

.upgrade-card ul[b-30ym0b6t0n] {
    text-align: left;
    margin: 1.5rem 0;
    padding-left: 1.5rem;
}

.upgrade-card ul li[b-30ym0b6t0n] {
    color: #14213D;
    margin-bottom: 0.5rem;
}

@media (max-width: 1200px) {
    .visualization-grid[b-30ym0b6t0n] {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 768px) {
    .hazard-analysis-page[b-30ym0b6t0n] {
        padding: 1rem;
    }
    
    .page-title[b-30ym0b6t0n] {
        font-size: 2rem;
        flex-direction: column;
        gap: 0.5rem;
    }
    
    .hazard-meta[b-30ym0b6t0n] {
        flex-direction: column;
        align-items: flex-start;
        gap: 1rem;
    }
    
    .overview-grid[b-30ym0b6t0n] {
        grid-template-columns: 1fr;
    }
    
    .details-grid[b-30ym0b6t0n] {
        grid-template-columns: 1fr;
    }
    
    .controls-grid[b-30ym0b6t0n] {
        grid-template-columns: 1fr;
    }
    
    .actions-header[b-30ym0b6t0n] {
        flex-direction: column;
        align-items: flex-start;
    }
    
    .actions-summary[b-30ym0b6t0n] {
        flex-direction: column;
        gap: 0.5rem;
    }
    
    .tool-actions[b-30ym0b6t0n] {
        flex-direction: column;
    }
    
    .quick-actions[b-30ym0b6t0n] {
        flex-direction: column;
    }
}

@media (max-width: 480px) {
    .page-title[b-30ym0b6t0n] {
        font-size: 1.5rem;
    }
    
    .score-value[b-30ym0b6t0n] {
        font-size: 2.5rem;
    }
    
    .metric-value[b-30ym0b6t0n] {
        font-size: 2rem;
    }
}
/* /Features/Hazards/HazardAssessmentsPage.razor.rz.scp.css */
.hazard-assessments-page[b-ybj3jro8ey] {
    padding: 2rem;
    max-width: 1400px;
    margin: 0 auto;
}

.page-header[b-ybj3jro8ey] {
    margin-bottom: 2rem;
    text-align: center;
}

.page-title[b-ybj3jro8ey] {
    color: #14213D;
    font-size: 2.5rem;
    font-weight: 600;
    margin-bottom: 0.5rem;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 1rem;
}

.page-title i[b-ybj3jro8ey] {
    color: #C8A951;
}

.page-description[b-ybj3jro8ey] {
    color: #2E2E2E;
    font-size: 1.1rem;
    margin: 0;
}

.assessments-dashboard[b-ybj3jro8ey] {
    display: grid;
    gap: 2rem;
}

.overview-section[b-ybj3jro8ey] {
    margin-bottom: 2rem;
}

.overview-grid[b-ybj3jro8ey] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 1.5rem;
}

.overview-card[b-ybj3jro8ey] {
    background: linear-gradient(135deg, #FFFFFF 0%, #E2E6EA 100%);
    border: 1px solid #E2E6EA;
    border-radius: 12px;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.05);
    transition: all 0.3s ease;
}

.overview-card:hover[b-ybj3jro8ey] {
    transform: translateY(-2px);
    box-shadow: 0 8px 15px rgba(0, 0, 0, 0.1);
}

.overview-card.completed[b-ybj3jro8ey] {
    border-left: 4px solid #28a745;
}

.overview-card.in-progress[b-ybj3jro8ey] {
    border-left: 4px solid #C8A951;
}

.overview-card.high-risk[b-ybj3jro8ey] {
    border-left: 4px solid #dc3545;
}

.metric-value[b-ybj3jro8ey] {
    font-size: 2.5rem;
    font-weight: 700;
    color: #14213D;
    line-height: 1;
}

.metric-percentage[b-ybj3jro8ey] {
    font-size: 1.1rem;
    font-weight: 600;
    color: #C8A951;
    margin-top: 0.25rem;
}

.metric-info[b-ybj3jro8ey] {
    font-size: 0.9rem;
    color: #2E2E2E;
    margin-top: 0.25rem;
}

.controls-section[b-ybj3jro8ey] {
    margin-bottom: 2rem;
}

.controls-card[b-ybj3jro8ey] {
    background: linear-gradient(135deg, #BFD8B8 0%, #E2E6EA 100%);
    border: 1px solid #BFD8B8;
}

.control-actions[b-ybj3jro8ey] {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
    align-items: center;
}

.assessments-list[b-ybj3jro8ey] {
    margin-bottom: 2rem;
}

.assessments-card[b-ybj3jro8ey] {
    background: #FFFFFF;
    border: 1px solid #E2E6EA;
}

.loading-spinner[b-ybj3jro8ey] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 1rem;
    padding: 3rem;
    color: #14213D;
    font-size: 1.1rem;
}

.loading-spinner i[b-ybj3jro8ey] {
    font-size: 1.5rem;
    color: #C8A951;
}

.error-message[b-ybj3jro8ey] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 1rem;
    padding: 2rem;
    color: #dc3545;
    font-size: 1.1rem;
    background: #f8d7da;
    border: 1px solid #f5c6cb;
    border-radius: 8px;
}

.error-message i[b-ybj3jro8ey] {
    font-size: 1.3rem;
}

.quick-assessment[b-ybj3jro8ey] {
    margin-bottom: 2rem;
}

.quick-card[b-ybj3jro8ey] {
    background: linear-gradient(135deg, #FFFFFF 0%, #BFD8B8 50%, #E2E6EA 100%);
    border: 1px solid #BFD8B8;
}

.quick-assessment-content[b-ybj3jro8ey] {
    text-align: center;
}

.quick-assessment-content p[b-ybj3jro8ey] {
    color: #2E2E2E;
    font-size: 1.1rem;
    margin-bottom: 1.5rem;
}

.quick-actions[b-ybj3jro8ey] {
    display: flex;
    justify-content: center;
    gap: 1rem;
    flex-wrap: wrap;
}

.upgrade-prompt[b-ybj3jro8ey] {
    text-align: center;
    padding: 2rem 0;
}

.upgrade-card[b-ybj3jro8ey] {
    background: linear-gradient(135deg, #FFFFFF 0%, #E2E6EA 100%);
    border: 2px solid #C8A951;
    max-width: 600px;
    margin: 0 auto;
}

.upgrade-card ul[b-ybj3jro8ey] {
    text-align: left;
    margin: 1.5rem 0;
    padding-left: 1.5rem;
}

.upgrade-card ul li[b-ybj3jro8ey] {
    color: #14213D;
    margin-bottom: 0.5rem;
}

@media (max-width: 768px) {
    .hazard-assessments-page[b-ybj3jro8ey] {
        padding: 1rem;
    }
    
    .page-title[b-ybj3jro8ey] {
        font-size: 2rem;
        flex-direction: column;
        gap: 0.5rem;
    }
    
    .overview-grid[b-ybj3jro8ey] {
        grid-template-columns: 1fr;
    }
    
    .control-actions[b-ybj3jro8ey] {
        flex-direction: column;
        align-items: stretch;
    }
    
    .quick-actions[b-ybj3jro8ey] {
        flex-direction: column;
    }
}

@media (max-width: 480px) {
    .page-title[b-ybj3jro8ey] {
        font-size: 1.5rem;
    }
    
    .metric-value[b-ybj3jro8ey] {
        font-size: 2rem;
    }
}
/* /Features/Hazards/JobDemandPage.razor.rz.scp.css */
.content-page[b-qep3po9y2w] {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
    background-color: transparent;
    font-family: 'Titillium Web', sans-serif;
}

.content-header[b-qep3po9y2w] {
    background: linear-gradient(135deg, #f6f4e7 0%, #ffffff 100%);
    color: #282885;
    padding: 2.5rem 2rem;
    position: relative;
    border-radius: 12px;
    margin: 20px 20px 0 20px;
    box-shadow: 0 4px 12px rgba(0,0,0,0.05);
    text-align: center;
}

.content-header h1[b-qep3po9y2w] {
    margin: 0;
    font-weight: 600;
    font-size: 2.4rem;
    color: #282885;
}

.back-button[b-qep3po9y2w] {
    position: absolute;
    left: 2rem;
    top: 50%;
    transform: translateY(-50%);
    background-color: #282885;
    border: none;
    color: white;
    padding: 0.6rem 1.2rem;
    border-radius: 30px;
    display: flex;
    align-items: center;
    gap: 8px;
    cursor: pointer;
    transition: all 0.3s ease;
    font-size: 0.9rem;
    font-weight: 600;
    box-shadow: 0 4px 12px rgba(40, 40, 133, 0.2);
}

.back-button:hover[b-qep3po9y2w] {
    background-color: #1dc1c3;
    transform: translateY(-50%) translateX(-2px);
    box-shadow: 0 6px 15px rgba(29, 193, 195, 0.3);
}

.content-container[b-qep3po9y2w] {
    max-width: none;
    margin: 0;
    padding: 30px;
    width: 100%;
}

.content-section[b-qep3po9y2w] {
    margin-bottom: 3rem;
    background-color: white;
    border-radius: 12px;
    padding: 2rem;
    box-shadow: 0 6px 18px rgba(0,0,0,0.06);
}

.content-section h2[b-qep3po9y2w] {
    color: #282885;
    font-weight: 600;
    font-size: 1.8rem;
    margin-top: 0;
    margin-bottom: 1.2rem;
    padding-bottom: 10px;
    position: relative;
}

.content-section h2[b-qep3po9y2w]:after {
    content: '';
    position: absolute;
    left: 0;
    bottom: 0;
    height: 3px;
    width: 60px;
    background-color: #dac576;
    border-radius: 2px;
}

.content-section p[b-qep3po9y2w] {
    color: #555;
    line-height: 1.7;
    font-size: 1.05rem;
}

.info-card[b-qep3po9y2w] {
    display: flex;
    background-color: #f6f4e7;
    border-radius: 10px;
    padding: 1.2rem;
    margin: 1.5rem 0;
    align-items: center;
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.info-card:hover[b-qep3po9y2w] {
    transform: translateY(-3px);
    box-shadow: 0 6px 15px rgba(0,0,0,0.08);
}

.info-icon[b-qep3po9y2w] {
    background-color: #dac576;
    width: 60px;
    height: 60px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-right: 20px;
    flex-shrink: 0;
}

.info-icon span[b-qep3po9y2w] {
    color: white;
    font-size: 1.5rem;
}

.info-content p[b-qep3po9y2w] {
    margin: 0;
    color: #282885;
    font-weight: 500;
}

.examples-grid[b-qep3po9y2w] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(400px, 1fr));
    gap: 1.5rem;
    margin-top: 1.5rem;
}

.example-item[b-qep3po9y2w] {
    display: flex;
    align-items: flex-start;
    padding: 1.2rem;
    background-color: #f9f9ff;
    border-radius: 10px;
    border-left: 4px solid #1dc1c3;
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.example-item:hover[b-qep3po9y2w] {
    transform: translateY(-3px);
    box-shadow: 0 6px 15px rgba(0,0,0,0.08);
}

.example-icon[b-qep3po9y2w] {
    flex: 0 0 60px;
    height: 60px;
    border-radius: 50%;
    background-color: rgba(29, 193, 195, 0.15);
    display: flex;
    align-items: center;
    justify-content: center;
    margin-right: 20px;
    flex-shrink: 0;
}

.example-icon span[b-qep3po9y2w] {
    color: #1dc1c3;
    font-size: 1.5rem;
}

.example-content h3[b-qep3po9y2w] {
    margin: 0 0 0.5rem 0;
    color: #282885;
    font-size: 1.2rem;
    font-weight: 600;
}

.example-content p[b-qep3po9y2w] {
    margin: 0;
    font-size: 1rem;
    color: #555;
}

.strategies-container[b-qep3po9y2w] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(400px, 1fr));
    gap: 1.5rem;
    margin-top: 1.5rem;
}

.strategy-card[b-qep3po9y2w] {
    background-color: #f9f9ff;
    border-radius: 10px;
    padding: 1.5rem;
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.strategy-card:hover[b-qep3po9y2w] {
    transform: translateY(-3px);
    box-shadow: 0 6px 15px rgba(0,0,0,0.08);
}

.strategy-card h3[b-qep3po9y2w] {
    color: #282885;
    font-weight: 600;
    font-size: 1.2rem;
    margin-top: 0;
    margin-bottom: 1rem;
    border-bottom: 1px solid #f6f4e7;
    padding-bottom: 0.5rem;
}

.strategy-card ul[b-qep3po9y2w] {
    padding-left: 1.5rem;
    margin-bottom: 0;
}

.strategy-card li[b-qep3po9y2w] {
    margin-bottom: 0.7rem;
    color: #555;
    line-height: 1.5;
}

.resources-grid[b-qep3po9y2w] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
    gap: 1rem;
    margin-top: 1.5rem;
}

.resource-card[b-qep3po9y2w] {
    display: flex;
    flex-direction: column;
    align-items: center;
    background-color: white;
    border: 1px solid #f6f4e7;
    border-radius: 10px;
    padding: 1.5rem 1rem;
    text-align: center;
    text-decoration: none;
    color: #282885;
    transition: all 0.3s ease;
    gap: 0.8rem;
    box-shadow: 0 2px 8px rgba(0,0,0,0.05);
}

.resource-card:hover[b-qep3po9y2w] {
    transform: translateY(-5px);
    box-shadow: 0 8px 15px rgba(0, 0, 0, 0.1);
    border-color: #dac576;
}

.resource-card span.oi[b-qep3po9y2w] {
    font-size: 1.8rem;
    color: #1dc1c3;
}

.content-footer[b-qep3po9y2w] {
    background-color: #282885;
    color: white;
    padding: 1.5rem;
    margin-top: auto;
}

.footer-content[b-qep3po9y2w] {
    max-width: 1200px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1rem;
}

.copyright[b-qep3po9y2w] {
    font-size: 0.9rem;
    opacity: 0.9;
}

.footer-links[b-qep3po9y2w] {
    display: flex;
    gap: 1.5rem;
}

.footer-links a[b-qep3po9y2w] {
    color: white;
    text-decoration: none;
    font-size: 0.9rem;
    opacity: 0.8;
    transition: opacity 0.2s;
}

.footer-links a:hover[b-qep3po9y2w] {
    opacity: 1;
    text-decoration: underline;
}

@media (max-width: 768px) {
    .content-header[b-qep3po9y2w] {
        padding: 2rem 1rem;
        margin: 15px 15px 0 15px;
    }

    .content-header h1[b-qep3po9y2w] {
        font-size: 2rem;
        padding-top: 2rem;
    }

    .back-button[b-qep3po9y2w] {
        top: 1rem;
        transform: none;
        left: 1rem;
        padding: 0.5rem 1rem;
        font-size: 0.8rem;
    }

    .content-container[b-qep3po9y2w] {
        padding: 1.5rem 1rem;
    }

    .content-section[b-qep3po9y2w] {
        padding: 1.5rem;
    }

    .examples-grid[b-qep3po9y2w], .strategies-container[b-qep3po9y2w] {
        grid-template-columns: 1fr;
    }

    .resources-grid[b-qep3po9y2w] {
        grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
    }

    .example-item[b-qep3po9y2w] {
        padding: 1rem;
    }

    .info-icon[b-qep3po9y2w], .example-icon[b-qep3po9y2w] {
        width: 50px;
        height: 50px;
    }

    .example-content h3[b-qep3po9y2w] {
        font-size: 1.1rem;
    }

    .footer-links[b-qep3po9y2w] {
        flex-direction: column;
        gap: 0.5rem;
        text-align: center;
    }
}
/* /Features/Hazards/PsychosocialHazardsPage.razor.rz.scp.css */
.hazards-container[b-ynreehmwie] {
    max-width: none;
    margin: 0;
    padding: 30px;
    font-family: 'Titillium Web', sans-serif;
}

.hazards-header[b-ynreehmwie] {
    text-align: center;
    margin-bottom: 40px;
    background: linear-gradient(135deg, #f6f4e7 0%, #ffffff 100%);
    padding: 40px 20px;
    border-radius: 12px;
    box-shadow: 0 4px 12px rgba(0,0,0,0.05);
}

.hazards-header h1[b-ynreehmwie] {
    color: #282885;
    font-size: 2.4rem;
    font-weight: 600;
    margin-bottom: 10px;
}

.subtitle[b-ynreehmwie] {
    color: #1dc1c3;
    font-size: 1.2rem;
    font-weight: 500;
    letter-spacing: 0.5px;
}

.content-card[b-ynreehmwie] {
    background-color: #ffffff;
    padding: 30px;
    border-radius: 12px;
    box-shadow: 0 6px 18px rgba(0,0,0,0.06);
    margin-bottom: 40px;
}

.hazards-grid[b-ynreehmwie] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: 24px;
    width: 100%;
}

.hazard-card[b-ynreehmwie] {
    background-color: #f9f9ff;
    border-radius: 10px;
    padding: 1.5rem;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    transition: all 0.3s ease;
    cursor: pointer;
    height: 140px;
    box-shadow: 0 2px 8px rgba(0,0,0,0.04);
    border: 1px solid #f0f0f0;
}

.hazard-card:hover[b-ynreehmwie] {
    transform: translateY(-5px);
    box-shadow: 0 10px 20px rgba(218, 197, 118, 0.15);
    background-color: #ffffff;
    border-color: #dac576;
}

.icon-container[b-ynreehmwie] {
    width: 60px;
    height: 60px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background-color: #f6f4e7;
    margin-bottom: 15px;
    transition: all 0.3s ease;
}

.hazard-card:hover .icon-container[b-ynreehmwie] {
    background-color: #282885;
}

.icon-container span[b-ynreehmwie] {
    font-size: 24px;
    color: #1dc1c3;
}

.hazard-card:hover .icon-container span[b-ynreehmwie] {
    color: white;
}

.hazard-title[b-ynreehmwie] {
    color: #282885;
    font-weight: 600;
    font-size: 1.05rem;
    margin-top: 8px;
    line-height: 1.3;
}

@media (max-width: 768px) {
    .hazards-grid[b-ynreehmwie] {
        grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
        gap: 16px;
    }

    .hazard-card[b-ynreehmwie] {
        padding: 1rem;
        height: 120px;
    }

    .icon-container[b-ynreehmwie] {
        width: 50px;
        height: 50px;
    }

    .icon-container span[b-ynreehmwie] {
        font-size: 20px;
    }

    .hazard-title[b-ynreehmwie] {
        font-size: 0.9rem;
    }

    .hazards-header h1[b-ynreehmwie] {
        font-size: 1.8rem;
    }

    .subtitle[b-ynreehmwie] {
        font-size: 1rem;
    }
}
/* /Features/Hazards/RiskMatrixPage.razor.rz.scp.css */
.risk-matrix-page[b-wot6pptp1j] {
    padding: 2rem;
    max-width: 1600px;
    margin: 0 auto;
}

.page-header[b-wot6pptp1j] {
    margin-bottom: 2rem;
    text-align: center;
}

.page-title[b-wot6pptp1j] {
    color: #14213D;
    font-size: 2.5rem;
    font-weight: 600;
    margin-bottom: 0.5rem;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 1rem;
}

.page-title i[b-wot6pptp1j] {
    color: #C8A951;
}

.page-description[b-wot6pptp1j] {
    color: #2E2E2E;
    font-size: 1.1rem;
    margin: 0;
}

.matrix-dashboard[b-wot6pptp1j] {
    display: grid;
    gap: 2rem;
}

.controls-section[b-wot6pptp1j] {
    margin-bottom: 2rem;
}

.controls-card[b-wot6pptp1j] {
    background: linear-gradient(135deg, #BFD8B8 0%, #E2E6EA 100%);
    border: 1px solid #BFD8B8;
}

.control-group[b-wot6pptp1j] {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

.control-filters[b-wot6pptp1j] {
    display: flex;
    flex-wrap: wrap;
    gap: 1.5rem;
    align-items: end;
}

.filter-item[b-wot6pptp1j] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    min-width: 180px;
}

.filter-label[b-wot6pptp1j] {
    font-weight: 600;
    color: #14213D;
    font-size: 0.9rem;
}

.filter-select[b-wot6pptp1j] {
    padding: 0.5rem;
    border: 1px solid #E2E6EA;
    border-radius: 6px;
    background: #FFFFFF;
    color: #14213D;
    font-size: 0.9rem;
    transition: border-color 0.3s ease;
}

.filter-select:focus[b-wot6pptp1j] {
    outline: none;
    border-color: #C8A951;
    box-shadow: 0 0 0 3px rgba(200, 169, 81, 0.1);
}

.control-actions[b-wot6pptp1j] {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
}

.matrix-section[b-wot6pptp1j] {
    margin-bottom: 2rem;
}

.matrix-card[b-wot6pptp1j] {
    background: #FFFFFF;
    border: 1px solid #E2E6EA;
}

.loading-container[b-wot6pptp1j] {
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 400px;
}

.loading-spinner[b-wot6pptp1j] {
    display: flex;
    align-items: center;
    gap: 1rem;
    color: #14213D;
    font-size: 1.2rem;
}

.loading-spinner i[b-wot6pptp1j] {
    font-size: 2rem;
    color: #C8A951;
}

.error-message[b-wot6pptp1j] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 1rem;
    padding: 2rem;
    color: #dc3545;
    font-size: 1.1rem;
    background: #f8d7da;
    border: 1px solid #f5c6cb;
    border-radius: 8px;
    text-align: center;
    flex-wrap: wrap;
}

.error-message i[b-wot6pptp1j] {
    font-size: 1.3rem;
}

.matrix-container[b-wot6pptp1j] {
    padding: 1.5rem;
}

.matrix-legend[b-wot6pptp1j] {
    display: flex;
    align-items: center;
    gap: 2rem;
    margin-bottom: 2rem;
    flex-wrap: wrap;
}

.legend-title[b-wot6pptp1j] {
    font-weight: 600;
    color: #14213D;
    font-size: 1.1rem;
}

.legend-items[b-wot6pptp1j] {
    display: flex;
    gap: 1.5rem;
    flex-wrap: wrap;
}

.legend-item[b-wot6pptp1j] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.9rem;
    color: #2E2E2E;
}

.legend-color[b-wot6pptp1j] {
    width: 20px;
    height: 20px;
    border-radius: 4px;
    border: 1px solid #E2E6EA;
}

.legend-color.low-risk[b-wot6pptp1j] {
    background-color: #28a745;
}

.legend-color.medium-risk[b-wot6pptp1j] {
    background-color: #ffc107;
}

.legend-color.high-risk[b-wot6pptp1j] {
    background-color: #fd7e14;
}

.legend-color.critical-risk[b-wot6pptp1j] {
    background-color: #dc3545;
}

.matrix-grid-container[b-wot6pptp1j] {
    position: relative;
}

.matrix-labels[b-wot6pptp1j] {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    pointer-events: none;
}

.y-axis-label[b-wot6pptp1j] {
    position: absolute;
    left: -60px;
    top: 50%;
    transform: translateY(-50%) rotate(-90deg);
    font-weight: 600;
    color: #14213D;
    font-size: 1.1rem;
}

.x-axis-label[b-wot6pptp1j] {
    position: absolute;
    bottom: -40px;
    left: 50%;
    transform: translateX(-50%);
    font-weight: 600;
    color: #14213D;
    font-size: 1.1rem;
}

.risk-matrix-grid[b-wot6pptp1j] {
    display: flex;
    flex-direction: column;
    border: 2px solid #14213D;
    border-radius: 8px;
    overflow: hidden;
    max-width: 600px;
    margin: 0 auto;
}

.matrix-row[b-wot6pptp1j] {
    display: flex;
    align-items: stretch;
}

.row-label[b-wot6pptp1j] {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0.5rem;
    background: #14213D;
    color: #FFFFFF;
    font-weight: 600;
    font-size: 0.8rem;
    min-width: 80px;
    text-align: center;
}

.matrix-cell[b-wot6pptp1j] {
    flex: 1;
    height: 80px;
    border: 1px solid #FFFFFF;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: all 0.3s ease;
    position: relative;
}

.matrix-cell:hover[b-wot6pptp1j] {
    transform: scale(1.05);
    z-index: 2;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.3);
}

.matrix-cell.low-risk[b-wot6pptp1j] {
    background-color: #28a745;
    color: #FFFFFF;
}

.matrix-cell.medium-risk[b-wot6pptp1j] {
    background-color: #ffc107;
    color: #14213D;
}

.matrix-cell.high-risk[b-wot6pptp1j] {
    background-color: #fd7e14;
    color: #FFFFFF;
}

.matrix-cell.critical-risk[b-wot6pptp1j] {
    background-color: #dc3545;
    color: #FFFFFF;
}

.cell-score[b-wot6pptp1j] {
    font-size: 1.2rem;
    font-weight: 700;
}

.cell-count[b-wot6pptp1j] {
    font-size: 0.7rem;
    background: rgba(0, 0, 0, 0.3);
    padding: 2px 6px;
    border-radius: 10px;
    margin-top: 2px;
}

.column-labels[b-wot6pptp1j] {
    display: flex;
    align-items: stretch;
}

.empty-cell[b-wot6pptp1j] {
    min-width: 80px;
    background: #14213D;
}

.column-label[b-wot6pptp1j] {
    flex: 1;
    padding: 0.5rem;
    background: #14213D;
    color: #FFFFFF;
    font-weight: 600;
    font-size: 0.8rem;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
}

.summary-section[b-wot6pptp1j] {
    margin-bottom: 2rem;
}

.summary-grid[b-wot6pptp1j] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(400px, 1fr));
    gap: 2rem;
}

.summary-card[b-wot6pptp1j] {
    background: #FFFFFF;
    border: 1px solid #E2E6EA;
}

.risk-distribution[b-wot6pptp1j] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.distribution-item[b-wot6pptp1j] {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.distribution-label[b-wot6pptp1j] {
    min-width: 100px;
    font-weight: 600;
    color: #14213D;
    font-size: 0.9rem;
}

.distribution-bar[b-wot6pptp1j] {
    flex: 1;
    height: 20px;
    background: #E2E6EA;
    border-radius: 10px;
    overflow: hidden;
    position: relative;
}

.distribution-fill[b-wot6pptp1j] {
    height: 100%;
    transition: width 0.5s ease;
}

.distribution-fill.critical[b-wot6pptp1j] {
    background: #dc3545;
}

.distribution-fill.high[b-wot6pptp1j] {
    background: #fd7e14;
}

.distribution-fill.medium[b-wot6pptp1j] {
    background: #ffc107;
}

.distribution-fill.low[b-wot6pptp1j] {
    background: #28a745;
}

.distribution-count[b-wot6pptp1j] {
    min-width: 30px;
    text-align: center;
    font-weight: 600;
    color: #14213D;
}

.priority-actions[b-wot6pptp1j] {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

.priority-item[b-wot6pptp1j] {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 1rem;
    border-radius: 8px;
    transition: all 0.3s ease;
}

.priority-item.critical[b-wot6pptp1j] {
    background: linear-gradient(135deg, #f8d7da 0%, #FFFFFF 100%);
    border-left: 4px solid #dc3545;
}

.priority-item.high[b-wot6pptp1j] {
    background: linear-gradient(135deg, #fff3cd 0%, #FFFFFF 100%);
    border-left: 4px solid #fd7e14;
}

.priority-item i[b-wot6pptp1j] {
    font-size: 1.5rem;
    color: #14213D;
}

.priority-content[b-wot6pptp1j] {
    flex: 1;
}

.priority-title[b-wot6pptp1j] {
    font-weight: 600;
    color: #14213D;
    margin-bottom: 0.25rem;
}

.priority-description[b-wot6pptp1j] {
    color: #2E2E2E;
    font-size: 0.9rem;
}

.tools-section[b-wot6pptp1j] {
    margin-bottom: 2rem;
}

.tools-card[b-wot6pptp1j] {
    background: linear-gradient(135deg, #FFFFFF 0%, #E2E6EA 100%);
    border: 1px solid #E2E6EA;
}

.tool-grid[b-wot6pptp1j] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 1.5rem;
}

.tool-item[b-wot6pptp1j] {
    text-align: center;
}

.tool-description[b-wot6pptp1j] {
    font-size: 0.8rem;
    color: #2E2E2E;
    margin-top: 0.5rem;
    margin-bottom: 0;
}

.upgrade-prompt[b-wot6pptp1j] {
    text-align: center;
    padding: 2rem 0;
}

.upgrade-card[b-wot6pptp1j] {
    background: linear-gradient(135deg, #FFFFFF 0%, #E2E6EA 100%);
    border: 2px solid #C8A951;
    max-width: 600px;
    margin: 0 auto;
}

.upgrade-card ul[b-wot6pptp1j] {
    text-align: left;
    margin: 1.5rem 0;
    padding-left: 1.5rem;
}

.upgrade-card ul li[b-wot6pptp1j] {
    color: #14213D;
    margin-bottom: 0.5rem;
}

@media (max-width: 1200px) {
    .summary-grid[b-wot6pptp1j] {
        grid-template-columns: 1fr;
    }
    
    .tool-grid[b-wot6pptp1j] {
        grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
    }
}

@media (max-width: 768px) {
    .risk-matrix-page[b-wot6pptp1j] {
        padding: 1rem;
    }
    
    .page-title[b-wot6pptp1j] {
        font-size: 2rem;
        flex-direction: column;
        gap: 0.5rem;
    }
    
    .control-filters[b-wot6pptp1j] {
        flex-direction: column;
        align-items: stretch;
    }
    
    .filter-item[b-wot6pptp1j] {
        min-width: auto;
    }
    
    .control-actions[b-wot6pptp1j] {
        flex-direction: column;
    }
    
    .matrix-legend[b-wot6pptp1j] {
        flex-direction: column;
        align-items: flex-start;
        gap: 1rem;
    }
    
    .legend-items[b-wot6pptp1j] {
        gap: 1rem;
    }
    
    .y-axis-label[b-wot6pptp1j] {
        left: -40px;
        font-size: 0.9rem;
    }
    
    .x-axis-label[b-wot6pptp1j] {
        bottom: -30px;
        font-size: 0.9rem;
    }
    
    .row-label[b-wot6pptp1j],
    .column-label[b-wot6pptp1j] {
        font-size: 0.7rem;
        min-width: 60px;
    }
    
    .matrix-cell[b-wot6pptp1j] {
        height: 60px;
    }
    
    .cell-score[b-wot6pptp1j] {
        font-size: 1rem;
    }
    
    .cell-count[b-wot6pptp1j] {
        font-size: 0.6rem;
    }
    
    .tool-grid[b-wot6pptp1j] {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 480px) {
    .page-title[b-wot6pptp1j] {
        font-size: 1.5rem;
    }
    
    .legend-items[b-wot6pptp1j] {
        flex-direction: column;
        gap: 0.5rem;
    }
    
    .priority-item[b-wot6pptp1j] {
        flex-direction: column;
        text-align: center;
        gap: 0.5rem;
    }
}
/* /Features/Home/HomePage.razor.rz.scp.css */
/* Iswara Color Palette Variables */
:root[b-sc9qiuqfv1] {
    --navy-blue: #14213D;
    --gold: #C8A951;
    --dark-charcoal: #2E2E2E;
    --pure-white: #FFFFFF;
    --light-gray: #E2E6EA;
    --sage-green: #BFD8B8;
    --bronze: #CD7F32;
    --silver: #C0C0C0;
    --free-green: #28a745;
}

/* Global Home Container */
.home-container[b-sc9qiuqfv1] {
    max-width: none;
    margin: 0;
    padding: 0;
    font-family: 'Inter', 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    background: var(--pure-white);
    min-height: 100vh;
}

/* Modern Hero Section */
.welcome-section[b-sc9qiuqfv1] {
    text-align: center;
    margin-bottom: 0;
    background: linear-gradient(135deg, 
        var(--sage-green) 0%, 
        var(--light-gray) 50%, 
        var(--pure-white) 100%);
    padding: 5rem 2rem;
    position: relative;
    overflow: hidden;
}

.welcome-section[b-sc9qiuqfv1]::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: 
        radial-gradient(circle at 30% 20%, rgba(191, 216, 184, 0.2) 0%, transparent 50%),
        radial-gradient(circle at 70% 80%, rgba(200, 169, 81, 0.15) 0%, transparent 50%);
    z-index: 1;
}

.welcome-section > *[b-sc9qiuqfv1] {
    position: relative;
    z-index: 2;
}

.top-nav[b-sc9qiuqfv1] {
    position: absolute;
    top: 1.5rem;
    right: 1.5rem;
    z-index: 10;
}

.login-nav-button[b-sc9qiuqfv1],
.dashboard-nav-button[b-sc9qiuqfv1] {
    box-shadow: 0 4px 15px rgba(20, 33, 61, 0.15) !important;
    border: 1px solid rgba(255, 255, 255, 0.8);
}

.welcome-section h1[b-sc9qiuqfv1] {
    color: var(--navy-blue);
    font-size: 3.5rem;
    font-weight: 800;
    margin-bottom: 1.5rem;
    line-height: 1.1;
    text-shadow: 0 2px 4px rgba(255, 255, 255, 0.8);
}

.subtitle[b-sc9qiuqfv1] {
    color: var(--dark-charcoal);
    font-size: 1.4rem;
    font-weight: 500;
    letter-spacing: 0.5px;
    text-shadow: 0 1px 2px rgba(255, 255, 255, 0.8);
}

/* Main Content Section */
.main-content[b-sc9qiuqfv1] {
    padding: 4rem 0;
    background: var(--pure-white);
}

.section-title[b-sc9qiuqfv1] {
    color: var(--navy-blue);
    font-size: 2.5rem;
    font-weight: 700;
    text-align: center;
    margin-bottom: 3rem;
    line-height: 1.2;
}

.intro-content[b-sc9qiuqfv1] {
    max-width: 1000px;
    margin: 0 auto 4rem;
    padding: 0 2rem;
}

.intro-text[b-sc9qiuqfv1] {
    color: var(--dark-charcoal);
    line-height: 1.8;
    font-size: 1.125rem;
    margin-bottom: 1.5rem;
    font-weight: 400;
    text-align: left;
}

/* Vertical Tier Cards Container */
.tier-cards-vertical[b-sc9qiuqfv1] {
    max-width: 900px;
    margin: 0 auto;
    padding: 0 2rem;
}

/* Individual Tier Cards - Vertical Layout */
.tier-card[b-sc9qiuqfv1] {
    background: var(--pure-white);
    border-radius: 1rem;
    border: 1px solid rgba(226, 230, 234, 0.8);
    box-shadow: 0 8px 25px rgba(20, 33, 61, 0.1);
    transition: all 0.3s ease;
    position: relative;
    overflow: hidden;
}

.tier-card[b-sc9qiuqfv1]::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 4px;
    z-index: 1;
}

.tier-card:hover[b-sc9qiuqfv1] {
    transform: translateY(-3px);
    box-shadow: 0 12px 30px rgba(20, 33, 61, 0.15);
}

/* Tier-Specific Colors with Enhanced Visual Appeal */
.tier-free[b-sc9qiuqfv1]::before {
    background: linear-gradient(90deg, var(--free-green), #34ce57);
    box-shadow: 0 2px 8px rgba(40, 167, 69, 0.3);
}

.tier-free:hover[b-sc9qiuqfv1] {
    box-shadow: 0 12px 30px rgba(40, 167, 69, 0.25);
}

.tier-bronze[b-sc9qiuqfv1]::before {
    background: linear-gradient(90deg, var(--bronze), #DEB887);
    box-shadow: 0 2px 8px rgba(205, 127, 50, 0.3);
}

.tier-bronze:hover[b-sc9qiuqfv1] {
    box-shadow: 0 12px 30px rgba(205, 127, 50, 0.25);
}

.tier-silver[b-sc9qiuqfv1]::before {
    background: linear-gradient(90deg, var(--silver), #E8E8E8);
    box-shadow: 0 2px 8px rgba(192, 192, 192, 0.4);
}

.tier-silver:hover[b-sc9qiuqfv1] {
    box-shadow: 0 12px 30px rgba(192, 192, 192, 0.25);
}

.tier-gold[b-sc9qiuqfv1]::before {
    background: linear-gradient(90deg, var(--gold), #F4D03F);
    box-shadow: 0 2px 8px rgba(200, 169, 81, 0.4);
}

.tier-gold:hover[b-sc9qiuqfv1] {
    box-shadow: 0 12px 30px rgba(200, 169, 81, 0.3);
}

/* Tier Card Header - Horizontal Layout */
.tier-header[b-sc9qiuqfv1] {
    padding: 2rem;
    display: flex;
    align-items: center;
    gap: 1.5rem;
    position: relative;
    overflow: visible;
}

.tier-title-section[b-sc9qiuqfv1] {
    flex: 1;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 1rem;
}

.tier-icon[b-sc9qiuqfv1] {
    width: 60px;
    height: 60px;
    border-radius: 0.75rem;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 4px 15px rgba(20, 33, 61, 0.1);
    flex-shrink: 0;
}

.tier-icon-free[b-sc9qiuqfv1] {
    background: #BFD8B8;
    box-shadow: 0 8px 25px rgba(40, 167, 69, 0.3);
    transition: all 0.3s ease;
    color: white;
}

.tier-icon-free:hover[b-sc9qiuqfv1] {
    transform: scale(1.05);
    box-shadow: 0 12px 30px rgba(40, 167, 69, 0.4);
}

.tier-icon-bronze[b-sc9qiuqfv1] {
    background: #BFD8B8;
    color: white;
    box-shadow: 0 8px 25px rgba(205, 127, 50, 0.3);
    transition: all 0.3s ease;
}

.tier-icon-bronze:hover[b-sc9qiuqfv1] {
    transform: scale(1.05);
    box-shadow: 0 12px 30px rgba(205, 127, 50, 0.4);
}

.tier-icon-silver[b-sc9qiuqfv1] {
    background: #BFD8B8;
    color: white;
    box-shadow: 0 8px 25px rgba(192, 192, 192, 0.3);
    transition: all 0.3s ease;
}

.tier-icon-silver:hover[b-sc9qiuqfv1] {
    transform: scale(1.05);
    box-shadow: 0 12px 30px rgba(192, 192, 192, 0.4);
}

.tier-icon-gold[b-sc9qiuqfv1] {
    background: #BFD8B8;
    color: white;
    box-shadow: 0 8px 25px rgba(200, 169, 81, 0.3);
    transition: all 0.3s ease;
}

.tier-icon-gold:hover[b-sc9qiuqfv1] {
    transform: scale(1.05);
    box-shadow: 0 12px 30px rgba(200, 169, 81, 0.4);
}

.tier-icon i[b-sc9qiuqfv1] {
    font-size: 1.5rem;
    color: var(--pure-white) !important;
    position: relative;
    z-index: 2;
    text-shadow: 0 2px 4px rgba(0, 0, 0, 0.3);
    transition: all 0.3s ease;
}

.tier-icon-free i[b-sc9qiuqfv1],
.tier-icon-bronze i[b-sc9qiuqfv1],
.tier-icon-silver i[b-sc9qiuqfv1],
.tier-icon-gold i[b-sc9qiuqfv1] {
    color: var(--pure-white) !important;
    text-shadow: 0 2px 4px rgba(0, 0, 0, 0.3);
}

.tier-icon:hover i[b-sc9qiuqfv1] {
    transform: scale(1.05);
}

.tier-title[b-sc9qiuqfv1] {
    color: var(--navy-blue);
    font-size: 1.5rem;
    font-weight: 700;
    margin: 0;
    line-height: 1.3;
    flex: 1;
}

.tier-badge[b-sc9qiuqfv1] {
    padding: 0.4rem 1rem;
    border-radius: 2rem;
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 0.5px;
    text-transform: uppercase;
    flex-shrink: 0;
    position: relative;
    z-index: 5;
}

/* Beautiful Unified Tier Badge Style - Like Icon */
.tier-card .tier-badge-free[b-sc9qiuqfv1],
.tier-card .tier-badge-bronze[b-sc9qiuqfv1],
.tier-card .tier-badge-silver[b-sc9qiuqfv1],
.tier-card .tier-badge-gold[b-sc9qiuqfv1] {
    background: linear-gradient(135deg, #E6D5A8, #D4B896, var(--gold)) !important;
    background-image: linear-gradient(135deg, #E6D5A8, #D4B896, var(--gold)) !important;
    color: var(--navy-blue) !important;
    box-shadow: 
        0 4px 15px rgba(200, 169, 81, 0.4),
        inset 0 1px 0 rgba(255, 255, 255, 0.3),
        inset 0 -1px 0 rgba(0, 0, 0, 0.1) !important;
    border: 1px solid rgba(200, 169, 81, 0.3) !important;
    text-shadow: 
        0 1px 2px rgba(255, 255, 255, 0.8),
        0 0 4px rgba(255, 255, 255, 0.4) !important;
    font-weight: 700 !important;
    border-radius: 2rem !important;
    padding: 0.4rem 1rem !important;
    font-size: 0.75rem !important;
    letter-spacing: 0.5px !important;
    text-transform: uppercase !important;
    transition: all 0.3s ease !important;
}

.tier-card .tier-badge-free:hover[b-sc9qiuqfv1],
.tier-card .tier-badge-bronze:hover[b-sc9qiuqfv1],
.tier-card .tier-badge-silver:hover[b-sc9qiuqfv1],
.tier-card .tier-badge-gold:hover[b-sc9qiuqfv1] {
    transform: scale(1.05) !important;
    box-shadow: 
        0 6px 20px rgba(200, 169, 81, 0.5),
        inset 0 1px 0 rgba(255, 255, 255, 0.4),
        inset 0 -1px 0 rgba(0, 0, 0, 0.15) !important;
}

/* Coming Soon Starburst Badge */
.coming-soon-banner[b-sc9qiuqfv1] {
    position: relative;
    width: 8.5rem;
    height: 8.5rem;
    background: linear-gradient(135deg, #FFD700, #FFA500, var(--gold));
    color: var(--navy-blue) !important;
    z-index: 15;
    display: flex;
    align-items: center;
    justify-content: center;
    clip-path: polygon(
        50% 0%, 61% 35%, 98% 35%, 68% 57%, 79% 91%, 50% 70%, 21% 91%, 32% 57%, 2% 35%, 39% 35%
    );
    box-shadow: 
        0 12px 30px rgba(255, 215, 0, 0.6),
        0 0 45px rgba(255, 215, 0, 0.4),
        inset 0 4px 0 rgba(255, 255, 255, 0.5),
        inset 0 -4px 0 rgba(0, 0, 0, 0.1);
    animation: yellow-star-pulse-b-sc9qiuqfv1 2.5s ease-in-out infinite alternate;
    transform: rotate(-12deg);
    margin-left: 1rem;
    flex-shrink: 0;
    filter: drop-shadow(0 8px 16px rgba(255, 215, 0, 0.3));
}

.coming-soon-banner[b-sc9qiuqfv1]::before {
    content: '';
    position: absolute;
    top: -15px;
    left: -15px;
    right: -15px;
    bottom: -15px;
    background: radial-gradient(circle, rgba(255, 215, 0, 0.5) 0%, transparent 70%);
    clip-path: polygon(
        50% 0%, 61% 35%, 98% 35%, 68% 57%, 79% 91%, 50% 70%, 21% 91%, 32% 57%, 2% 35%, 39% 35%
    );
    z-index: -1;
    animation: star-glow-b-sc9qiuqfv1 3s ease-in-out infinite;
}

.coming-soon-text[b-sc9qiuqfv1] {
    font-size: 0.95rem;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: 1.2px;
    line-height: 1.1;
    text-align: center;
    color: var(--navy-blue) !important;
    text-shadow: 
        0 2px 4px rgba(255, 255, 255, 0.9),
        0 0 12px rgba(255, 255, 255, 0.6);
    transform: rotate(12deg);
    padding: 0.4rem;
}

@keyframes yellow-star-pulse-b-sc9qiuqfv1 {
    0% {
        transform: rotate(-12deg) scale(1);
        box-shadow: 
            0 12px 30px rgba(255, 215, 0, 0.6),
            0 0 45px rgba(255, 215, 0, 0.4),
            inset 0 4px 0 rgba(255, 255, 255, 0.5),
            inset 0 -4px 0 rgba(0, 0, 0, 0.1);
    }
    100% {
        transform: rotate(-12deg) scale(1.08);
        box-shadow: 
            0 16px 40px rgba(255, 215, 0, 0.8),
            0 0 60px rgba(255, 215, 0, 0.6),
            inset 0 4px 0 rgba(255, 255, 255, 0.7),
            inset 0 -4px 0 rgba(0, 0, 0, 0.15);
    }
}

@keyframes star-glow-b-sc9qiuqfv1 {
    0%, 100% {
        opacity: 0.5;
        transform: scale(1);
    }
    50% {
        opacity: 0.8;
        transform: scale(1.1);
    }
}

/* Tier Card Content */
.tier-content[b-sc9qiuqfv1] {
    padding: 0 2rem 2rem;
}

/* Tier Includes Badge */
.tier-includes[b-sc9qiuqfv1] {
    margin: 1rem 0;
}

.includes-badge[b-sc9qiuqfv1] {
    display: inline-block;
    background: linear-gradient(135deg, var(--sage-green), #9fd49a);
    color: var(--navy-blue);
    padding: 0.5rem 1rem;
    border-radius: 1.5rem;
    font-size: 0.85rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    box-shadow: 0 2px 8px rgba(191, 216, 184, 0.4);
    border: 1px solid rgba(191, 216, 184, 0.3);
}

.tier-description[b-sc9qiuqfv1] {
    color: var(--dark-charcoal);
    line-height: 1.6;
    font-size: 1rem;
    margin-bottom: 1.25rem;
    font-weight: 400;
}

.tier-features[b-sc9qiuqfv1] {
    margin: 1.25rem 0;
    padding-left: 0;
    list-style: none;
}

.tier-features li[b-sc9qiuqfv1] {
    color: var(--dark-charcoal);
    line-height: 1.5;
    font-size: 0.95rem;
    margin-bottom: 0.75rem;
    padding-left: 1.5rem;
    position: relative;
}

.tier-features li[b-sc9qiuqfv1]::before {
    content: '✓';
    position: absolute;
    left: 0;
    color: var(--gold);
    font-weight: bold;
    font-size: 1rem;
}

.tier-note[b-sc9qiuqfv1],
.tier-disclaimer[b-sc9qiuqfv1] {
    color: var(--dark-charcoal);
    line-height: 1.5;
    font-size: 0.9rem;
    margin-top: 1rem;
    font-style: italic;
}

.tier-disclaimer[b-sc9qiuqfv1] {
    font-size: 0.85rem;
    color: #6c757d;
}

/* CTA Section */
.cta-section[b-sc9qiuqfv1] {
    text-align: center;
    margin: 4rem auto 2rem;
    padding: 3rem 2rem;
    background: linear-gradient(135deg, 
        rgba(191, 216, 184, 0.1) 0%, 
        rgba(226, 230, 234, 0.1) 100%);
    border-radius: 1rem;
    box-shadow: 0 4px 20px rgba(20, 33, 61, 0.05);
    border: 1px solid rgba(226, 230, 234, 0.3);
    max-width: 800px;
}

.cta-text[b-sc9qiuqfv1] {
    font-size: 1.25rem;
    font-weight: 600;
    color: var(--navy-blue);
    margin-bottom: 2rem;
    line-height: 1.4;
}

.get-started-button[b-sc9qiuqfv1] {
    box-shadow: 0 8px 20px rgba(200, 169, 81, 0.25) !important;
    transform: translateY(0);
    transition: all 0.3s ease;
}

.get-started-button:hover[b-sc9qiuqfv1] {
    transform: translateY(-2px);
    box-shadow: 0 12px 25px rgba(200, 169, 81, 0.35) !important;
}

.home-action-buttons[b-sc9qiuqfv1] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    align-items: center;
}

.register-interest-button[b-sc9qiuqfv1] {
    box-shadow: 0 8px 20px rgba(20, 33, 61, 0.15) !important;
    transform: translateY(0);
    transition: all 0.3s ease;
}

.register-interest-button:hover[b-sc9qiuqfv1] {
    transform: translateY(-2px);
    box-shadow: 0 12px 25px rgba(20, 33, 61, 0.25) !important;
}

/* Responsive Design */

/* Large screens */
@media (max-width: 1200px) {
    .tier-cards-vertical[b-sc9qiuqfv1] {
        max-width: 800px;
        padding: 0 1.5rem;
    }
}

/* Medium screens */
@media (max-width: 991px) {
    .section-title[b-sc9qiuqfv1] {
        font-size: 2.25rem;
    }
    
    .welcome-section h1[b-sc9qiuqfv1] {
        font-size: 3rem;
    }
    
    .tier-cards-vertical[b-sc9qiuqfv1] {
        padding: 0 1rem;
    }
}

/* Tablet and below */
@media (max-width: 768px) {
    .welcome-section[b-sc9qiuqfv1] {
        padding: 3rem 1.5rem;
    }
    
    .welcome-section h1[b-sc9qiuqfv1] {
        font-size: 2.5rem;
    }

    .subtitle[b-sc9qiuqfv1] {
        font-size: 1.2rem;
    }
    
    .main-content[b-sc9qiuqfv1] {
        padding: 3rem 0;
    }
    
    .section-title[b-sc9qiuqfv1] {
        font-size: 2rem;
        margin-bottom: 2rem;
    }
    
    .intro-content[b-sc9qiuqfv1] {
        padding: 0 1rem;
        margin-bottom: 3rem;
    }
    
    .intro-text[b-sc9qiuqfv1] {
        font-size: 1rem;
    }
    
    .tier-cards-vertical[b-sc9qiuqfv1] {
        padding: 0 1rem;
    }
    
    .tier-header[b-sc9qiuqfv1] {
        padding: 1.5rem;
        flex-direction: column;
        align-items: flex-start;
        gap: 1rem;
    }
    
    .tier-title-section[b-sc9qiuqfv1] {
        width: 100%;
        flex-direction: column;
        align-items: flex-start;
        gap: 0.75rem;
    }
    
    .tier-title[b-sc9qiuqfv1] {
        font-size: 1.25rem;
    }
    
    .tier-badge[b-sc9qiuqfv1] {
        align-self: flex-start;
    }
    
    .tier-content[b-sc9qiuqfv1] {
        padding: 0 1.5rem 1.5rem;
    }
    
    .cta-section[b-sc9qiuqfv1] {
        margin: 3rem auto 2rem;
        padding: 2.5rem 1.5rem;
    }
    
    .cta-text[b-sc9qiuqfv1] {
        font-size: 1.125rem;
    }
    
    .home-action-buttons[b-sc9qiuqfv1] {
        gap: 0.75rem;
    }
}

/* Mobile screens */
@media (max-width: 576px) {
    .welcome-section[b-sc9qiuqfv1] {
        padding: 2.5rem 1rem;
    }
    
    .welcome-section h1[b-sc9qiuqfv1] {
        font-size: 2rem;
    }
    
    .subtitle[b-sc9qiuqfv1] {
        font-size: 1.1rem;
    }
    
    .section-title[b-sc9qiuqfv1] {
        font-size: 1.75rem;
    }
    
    .intro-content[b-sc9qiuqfv1] {
        padding: 0 0.5rem;
    }
    
    .tier-cards-vertical[b-sc9qiuqfv1] {
        padding: 0 0.5rem;
    }
    
    .tier-header[b-sc9qiuqfv1] {
        padding: 1.25rem;
    }
    
    .tier-content[b-sc9qiuqfv1] {
        padding: 0 1.25rem 1.25rem;
    }
    
    .tier-icon[b-sc9qiuqfv1] {
        width: 50px;
        height: 50px;
    }
    
    .tier-icon i[b-sc9qiuqfv1] {
        font-size: 1.25rem;
    }
    
    .tier-title[b-sc9qiuqfv1] {
        font-size: 1.125rem;
    }
    
    .tier-badge[b-sc9qiuqfv1] {
        font-size: 0.7rem;
        padding: 0.3rem 0.8rem;
    }
    
    .cta-section[b-sc9qiuqfv1] {
        margin: 2.5rem auto 1.5rem;
        padding: 2rem 1rem;
    }
    
    .home-action-buttons[b-sc9qiuqfv1] {
        gap: 0.5rem;
    }
}

/* Extra small mobile screens */
@media (max-width: 400px) {
    .welcome-section h1[b-sc9qiuqfv1] {
        font-size: 1.75rem;
    }
    
    .section-title[b-sc9qiuqfv1] {
        font-size: 1.5rem;
    }
    
    .tier-header[b-sc9qiuqfv1] {
        padding: 1rem;
    }
    
    .tier-content[b-sc9qiuqfv1] {
        padding: 0 1rem 1rem;
    }
}

/* Accessibility Enhancements */
@media (prefers-reduced-motion: reduce) {
    .tier-card[b-sc9qiuqfv1],
    .get-started-button[b-sc9qiuqfv1] {
        transition: none;
    }
    
    .tier-card:hover[b-sc9qiuqfv1],
    .get-started-button:hover[b-sc9qiuqfv1] {
        transform: none;
    }
}

/* High contrast mode support */
@media (prefers-contrast: high) {
    .welcome-section[b-sc9qiuqfv1],
    .cta-section[b-sc9qiuqfv1] {
        border: 2px solid var(--navy-blue);
    }
    
    .tier-card[b-sc9qiuqfv1] {
        border: 2px solid var(--dark-charcoal);
    }
}
/* /Features/MentalFitness/FitnessRecommendationsPage.razor.rz.scp.css */
.fitness-recommendations-page[b-2zk3se7z6h] {
    padding: 24px;
    background: var(--bs-light);
    min-height: 100vh;
}

.page-header[b-2zk3se7z6h] {
    margin-bottom: 32px;
    padding: 24px 0;
    border-bottom: 2px solid var(--bs-border-color);
}

.header-content h1[b-2zk3se7z6h] {
    color: #14213D;
    font-size: 2.5rem;
    font-weight: 700;
    margin-bottom: 8px;
}

.header-content h1 i[b-2zk3se7z6h] {
    color: #C8A951;
    margin-right: 12px;
}

.page-description[b-2zk3se7z6h] {
    color: #2E2E2E;
    font-size: 1.1rem;
    margin: 0;
}
/* /Features/MentalFitness/MentalFitnessPage.razor.rz.scp.css */
.mental-fitness-page[b-zf4f4zc6v6] {
    padding: 24px;
    background: var(--bs-light);
    min-height: 100vh;
}

.page-header[b-zf4f4zc6v6] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 32px;
    padding: 24px 0;
    border-bottom: 2px solid var(--bs-border-color);
}

.header-content h1[b-zf4f4zc6v6] {
    color: #14213D;
    font-size: 2.5rem;
    font-weight: 700;
    margin-bottom: 8px;
}

.header-content h1 i[b-zf4f4zc6v6] {
    color: #C8A951;
    margin-right: 12px;
}

.page-description[b-zf4f4zc6v6] {
    color: #2E2E2E;
    font-size: 1.1rem;
    margin: 0;
}

.content-container[b-zf4f4zc6v6] {
    max-width: 1400px;
}

.fitness-level[b-zf4f4zc6v6] {
    margin-top: 16px;
}

.fitness-level .badge[b-zf4f4zc6v6] {
    padding: 8px 16px;
    font-size: 0.9rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.upgrade-prompt[b-zf4f4zc6v6] {
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 60vh;
    padding: 24px;
}

.upgrade-prompt .card[b-zf4f4zc6v6] {
    max-width: 600px;
    border: 2px solid #C8A951;
    border-radius: 12px;
    box-shadow: 0 8px 24px rgba(20, 33, 61, 0.1);
}

.upgrade-prompt h2[b-zf4f4zc6v6] {
    color: #14213D;
    font-weight: 700;
}

.upgrade-prompt .text-warning[b-zf4f4zc6v6] {
    color: #C8A951 !important;
}

.loading-overlay[b-zf4f4zc6v6] {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(255, 255, 255, 0.9);
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 9999;
}

.loading-overlay .spinner-border[b-zf4f4zc6v6] {
    color: #C8A951;
    width: 3rem;
    height: 3rem;
}

@media (max-width: 768px) {
    .mental-fitness-page[b-zf4f4zc6v6] {
        padding: 16px;
    }
    
    .page-header[b-zf4f4zc6v6] {
        flex-direction: column;
        align-items: flex-start;
        gap: 16px;
    }
    
    .header-content h1[b-zf4f4zc6v6] {
        font-size: 2rem;
    }
}
/* /Features/Overview/HazardPages/BullyingPage.razor.rz.scp.css */
/* Bullying Page uses shared hazard styles */
/* /Features/Overview/HazardPages/FatiguePage.razor.rz.scp.css */
/* Fatigue Page uses shared hazard styles from app.css */
/* /Features/Overview/HazardPages/HarassmentPage.razor.rz.scp.css */
/* Harassment Page uses shared hazard styles */
/* /Features/Overview/HazardPages/JobControlPage.razor.rz.scp.css */
/* Job Control Page uses shared hazard styles from app.css */
/* /Features/Overview/HazardPages/JobDemandPage.razor.rz.scp.css */
/* Job Demand Page uses shared hazard styles from app.css */
/* /Features/Overview/HazardPages/JobSecurityPage.razor.rz.scp.css */
/* Job Security Page uses shared hazard styles from app.css */
/* /Features/Overview/HazardPages/OrganizationalChangePage.razor.rz.scp.css */
/* Organizational Change Page uses shared hazard styles from app.css */
/* /Features/Overview/HazardPages/OrganizationalJusticePage.razor.rz.scp.css */
/* Organizational Justice Page uses shared hazard styles from app.css */
/* /Features/Overview/HazardPages/PhysicalEnvironmentPage.razor.rz.scp.css */
/* Physical Environment Page uses shared hazard styles */
/* /Features/Overview/HazardPages/RemoteWorkPage.razor.rz.scp.css */
/* Remote Work Page uses shared hazard styles from app.css */
/* /Features/Overview/HazardPages/RewardRecognitionPage.razor.rz.scp.css */
/* Reward Recognition Page uses shared hazard styles from app.css */
/* /Features/Overview/HazardPages/RoleClarityPage.razor.rz.scp.css */
/* Role Clarity Page uses shared hazard styles from app.css */
/* /Features/Overview/HazardPages/SupportPage.razor.rz.scp.css */
/* Support Page uses shared hazard styles from app.css */
/* /Features/Overview/HazardPages/SurveillancePage.razor.rz.scp.css */
/* Surveillance Page uses shared hazard styles from app.css */
/* /Features/Overview/HazardPages/TraumaticEventsPage.razor.rz.scp.css */
/* Traumatic Events Page uses shared hazard styles from app.css */
/* /Features/Overview/HazardPages/ViolenceAggressionPage.razor.rz.scp.css */
/* Violence and Aggression Page uses shared hazard styles */
/* /Features/Overview/HazardPages/WorkplaceRelationshipsPage.razor.rz.scp.css */
/* Workplace Relationships Page uses shared hazard styles */
/* /Features/Overview/OverviewPage.razor.rz.scp.css */
.overview-container[b-i7d958gljp] {
    margin: 0 auto;
    padding: 30px;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    min-height: 100vh;
}

.header-section[b-i7d958gljp] {
    text-align: center;
    margin-bottom: 4rem;
    background: linear-gradient(135deg, #BFD8B8 0%, #E2E6EA 50%, #FFFFFF 100%);
    padding: 3rem 2rem;
    border-radius: 1rem;
    box-shadow: 0 8px 32px rgba(20, 33, 61, 0.1);
}

.header-section h1[b-i7d958gljp] {
    color: #14213D;
    font-size: 2.75rem;
    font-weight: 700;
    margin-bottom: 1rem;
    line-height: 1.2;
}

.subtitle[b-i7d958gljp] {
    color: #2E2E2E;
    font-size: 1.25rem;
    font-weight: 500;
    letter-spacing: 0.5px;
}

/* Content card styling - Override IswaraCard defaults */
[b-i7d958gljp] .content-card,
[b-i7d958gljp] .content-card .e-card {
    margin-bottom: 2rem !important;
    margin-top: 1rem !important;
    padding: 2rem !important;
    transform: translateY(0) !important;
    transition: all 0.4s ease !important;
    box-shadow: 0 10px 30px rgba(20, 33, 61, 0.1) !important;
    border-radius: 1.25rem !important;
    overflow: hidden !important;
    position: relative !important;
    background: linear-gradient(135deg, #FFFFFF 0%, #E2E6EA 100%) !important;
}

[b-i7d958gljp] .content-card::before,
[b-i7d958gljp] .content-card .e-card::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 4px;
    background: linear-gradient(90deg, #C8A951 0%, #BFD8B8 50%, #C8A951 100%);
    z-index: 1;
}

[b-i7d958gljp] .content-card:hover,
[b-i7d958gljp] .content-card:hover .e-card {
    transform: translateY(-8px) !important;
    box-shadow: 0 20px 50px rgba(20, 33, 61, 0.15) !important;
}

/* Specific spacing for overview page cards */
.overview-container[b-i7d958gljp]  .content-card {
    margin-bottom: 2rem !important;
    margin-top: 1rem !important;
}

/* First card should not have top margin */
.overview-container[b-i7d958gljp]  .content-card:first-of-type {
    margin-top: 0 !important;
}

/* Add visible spacing between all cards */
.overview-container > * + *[b-i7d958gljp] {
    margin-top: 1.5rem !important;
}

/* Card spacer for explicit spacing */
.card-spacer[b-i7d958gljp] {
    height: 1.5rem;
    width: 100%;
    clear: both;
}

/* Enhanced card title styling - Simple typography approach */
[b-i7d958gljp] .content-card .card-title-container span {
    color: #14213D !important;
    font-size: 1.5rem !important;
    font-weight: 700 !important;
    letter-spacing: 0.5px !important;
    margin-bottom: 0.5rem !important;
    display: block !important;
}

[b-i7d958gljp] .content-card .card-title-icon {
    color: #C8A951 !important;
    font-size: 1.3rem !important;
    margin-right: 0.5rem !important;
}

[b-i7d958gljp] .content-card .e-card-header {
    padding: 1.5rem 2rem 1rem 2rem !important;
    border-bottom: 2px solid #E2E6EA !important;
    margin-bottom: 1.5rem !important;
}

/* Special styling for takeaway card */
[b-i7d958gljp] .takeaway-card .card-title-container span {
    color: #14213D !important;
    font-weight: 800 !important;
}

/* Special styling for sources card */
[b-i7d958gljp] .sources-card .card-title-container span {
    color: #2E2E2E !important;
}

.intro-text[b-i7d958gljp] {
    color: #2E2E2E;
    line-height: 1.7;
    font-size: 1.125rem;
    margin-bottom: 1.5rem;
}

.description-text[b-i7d958gljp] {
    color: #2E2E2E;
    line-height: 1.7;
    font-size: 1rem;
    margin-bottom: 1.5rem;
}

/* Hazard sources styling */
.hazard-sources[b-i7d958gljp] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 2rem;
    margin: 3rem 0;
    padding: 2rem;
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.8) 0%, rgba(226, 230, 234, 0.6) 100%);
    border-radius: 1.5rem;
    backdrop-filter: blur(10px);
}

.source-item[b-i7d958gljp] {
    display: flex;
    align-items: center;
    gap: 1.5rem;
    padding: 2rem;
    background: linear-gradient(135deg, #FFFFFF 0%, #E2E6EA 100%);
    border-radius: 1rem;
    border: 2px solid rgba(200, 169, 81, 0.1);
    transition: all 0.4s ease;
    position: relative;
    overflow: hidden;
}

.source-item[b-i7d958gljp]::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 3px;
    background: linear-gradient(90deg, #C8A951 0%, #BFD8B8 100%);
    transform: translateX(-100%);
    transition: transform 0.4s ease;
}

.source-item:hover[b-i7d958gljp]::before {
    transform: translateX(0);
}

.source-item:hover[b-i7d958gljp] {
    transform: translateY(-5px) scale(1.02);
    box-shadow: 0 15px 40px rgba(20, 33, 61, 0.15);
    border-color: rgba(200, 169, 81, 0.3);
}

.source-icon[b-i7d958gljp] {
    width: 60px;
    height: 60px;
    background: linear-gradient(135deg, #C8A951, #BFD8B8);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 8px 25px rgba(200, 169, 81, 0.3);
    flex-shrink: 0;
    transition: all 0.3s ease;
}

.source-item:hover .source-icon[b-i7d958gljp] {
    transform: rotate(360deg) scale(1.1);
    box-shadow: 0 12px 35px rgba(200, 169, 81, 0.4);
}

.source-icon i[b-i7d958gljp] {
    font-size: 1.5rem;
    color: #FFFFFF;
}

.source-item span[b-i7d958gljp] {
    color: #14213D;
    font-weight: 600;
    font-size: 1.1rem;
    line-height: 1.4;
}

/* Workflow diagram styling */
.workflow-diagram[b-i7d958gljp] {
    text-align: center;
    margin: 3rem 0;
    padding: 3rem;
    background: linear-gradient(135deg, #FFFFFF 0%, #E2E6EA 100%);
    border-radius: 1.5rem;
    border: 2px solid rgba(200, 169, 81, 0.2);
    box-shadow: 0 10px 30px rgba(20, 33, 61, 0.1);
    position: relative;
}

.workflow-diagram[b-i7d958gljp]::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 4px;
    background: linear-gradient(90deg, #C8A951 0%, #BFD8B8 50%, #C8A951 100%);
    border-radius: 1.5rem 1.5rem 0 0;
}

.diagram-image[b-i7d958gljp] {
    width: 100%;
    max-width: 800px;
    height: auto;
    border-radius: 1rem;
    box-shadow: 0 10px 30px rgba(20, 33, 61, 0.15);
    transition: transform 0.3s ease;
    display: block;
    margin: 0 auto;
}

.diagram-image:hover[b-i7d958gljp] {
    transform: scale(1.02);
}

.diagram-caption[b-i7d958gljp] {
    color: #2E2E2E;
    font-size: 1rem;
    margin-top: 1.5rem;
    font-style: italic;
    font-weight: 500;
}

/* Hazards grid styling */
.hazards-grid[b-i7d958gljp] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 1.5rem;
    margin: 3rem 0;
    padding: 2rem;
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.9) 0%, rgba(226, 230, 234, 0.7) 100%);
    border-radius: 1.5rem;
    backdrop-filter: blur(10px);
}

.hazard-item[b-i7d958gljp] {
    background: linear-gradient(135deg, #BFD8B8 0%, #E2E6EA 100%);
    padding: 1.5rem;
    border-radius: 1rem;
    text-align: center;
    color: #14213D;
    font-weight: 600;
    font-size: 1rem;
    border: 2px solid rgba(200, 169, 81, 0.2);
    transition: all 0.4s ease;
    cursor: pointer;
    position: relative;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1rem;
    min-height: 120px;
    justify-content: center;
}

.hazard-item[b-i7d958gljp]::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 3px;
    background: linear-gradient(90deg, #C8A951 0%, #BFD8B8 100%);
    transform: translateX(-100%);
    transition: transform 0.4s ease;
}

.hazard-item:hover[b-i7d958gljp]::before {
    transform: translateX(0);
}

.hazard-icon[b-i7d958gljp] {
    width: 50px;
    height: 50px;
    background: linear-gradient(135deg, #C8A951, #BFD8B8);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 4px 16px rgba(200, 169, 81, 0.3);
    transition: all 0.4s ease;
}

.hazard-icon i[b-i7d958gljp] {
    font-size: 1.5rem;
    color: #FFFFFF;
}

.hazard-text[b-i7d958gljp] {
    font-weight: 600;
    line-height: 1.3;
    text-align: center;
}

.hazard-item:hover[b-i7d958gljp] {
    transform: translateY(-8px) scale(1.03);
    box-shadow: 0 15px 40px rgba(20, 33, 61, 0.2);
    background: linear-gradient(135deg, #C8A951, #BFD8B8);
    border-color: rgba(200, 169, 81, 0.4);
}

.hazard-item:hover .hazard-text[b-i7d958gljp] {
    color: #FFFFFF;
}

.hazard-item:hover .hazard-icon[b-i7d958gljp] {
    background: linear-gradient(135deg, #14213D, #2E2E2E);
    transform: scale(1.1);
    box-shadow: 0 6px 25px rgba(20, 33, 61, 0.4);
}

/* Takeaway card styling */
.takeaway-card[b-i7d958gljp] {
    background: linear-gradient(135deg, #C8A951 0%, #BFD8B8 50%, #E2E6EA 100%);
    border: 3px solid #14213D;
    position: relative;
    overflow: hidden;
}

.takeaway-card[b-i7d958gljp]::before {
    background: linear-gradient(90deg, #14213D 0%, #C8A951 50%, #14213D 100%) !important;
    height: 6px !important;
}

.takeaway-card .description-text[b-i7d958gljp] {
    color: #14213D;
    font-weight: 600;
    font-size: 1.1rem;
    text-shadow: 0 1px 2px rgba(255, 255, 255, 0.5);
}

/* Sources card styling */
.sources-card[b-i7d958gljp] {
    background: linear-gradient(135deg, #FFFFFF 0%, #E2E6EA 100%);
    border: 2px solid rgba(200, 169, 81, 0.3);
}

.sources-list[b-i7d958gljp] {
    margin: 0;
    padding-left: 1.5rem;
}

.sources-list li[b-i7d958gljp] {
    color: #2E2E2E;
    line-height: 1.6;
    margin-bottom: 1rem;
    font-size: 0.95rem;
}

.sources-list a[b-i7d958gljp] {
    color: #C8A951;
    text-decoration: none;
    transition: color 0.3s ease;
}

.sources-list a:hover[b-i7d958gljp] {
    color: #14213D;
    text-decoration: underline;
}

/* Responsive design */
@media (max-width: 768px) {
    .overview-container[b-i7d958gljp] {
        padding: 15px;
        background: linear-gradient(135deg, #FFFFFF 0%, #E2E6EA 100%);
    }
    
    .header-section[b-i7d958gljp] {
        padding: 3rem 1.5rem;
        margin-bottom: 3rem;
    }
    
    .header-section h1[b-i7d958gljp] {
        font-size: 2.75rem;
    }

    .subtitle[b-i7d958gljp] {
        font-size: 1.25rem;
    }
    
    .content-card[b-i7d958gljp] {
        margin-bottom: 2rem;
        padding: 1.5rem;
    }
    
    .hazard-sources[b-i7d958gljp] {
        grid-template-columns: 1fr;
        gap: 1.5rem;
        padding: 1.5rem;
    }
    
    .source-item[b-i7d958gljp] {
        padding: 1.5rem;
        gap: 1rem;
    }
    
    .source-icon[b-i7d958gljp] {
        width: 50px;
        height: 50px;
    }
    
    .source-icon i[b-i7d958gljp] {
        font-size: 1.25rem;
    }
    
    .hazards-grid[b-i7d958gljp] {
        grid-template-columns: 1fr;
        gap: 1.25rem;
        padding: 1.5rem;
    }
    
    .hazard-item[b-i7d958gljp] {
        padding: 1.25rem;
        min-height: 100px;
        gap: 0.75rem;
    }
    
    .hazard-icon[b-i7d958gljp] {
        width: 40px;
        height: 40px;
    }
    
    .hazard-icon i[b-i7d958gljp] {
        font-size: 1.25rem;
    }
    
    .hazard-text[b-i7d958gljp] {
        font-size: 0.9rem;
    }
    
    .workflow-diagram[b-i7d958gljp] {
        padding: 2rem;
    }
    
    .diagram-image[b-i7d958gljp] {
        max-width: 100%;
    }
    
    /* Mobile responsive card titles */
    [b-i7d958gljp] .content-card .e-card-header {
        padding: 1.25rem 1.5rem 0.75rem 1.5rem !important;
        margin-bottom: 1rem !important;
    }
    
    [b-i7d958gljp] .content-card .card-title-container span {
        font-size: 1.25rem !important;
    }
    
    [b-i7d958gljp] .content-card .card-title-icon {
        font-size: 1.1rem !important;
    }
}

@media (max-width: 480px) {
    .overview-container[b-i7d958gljp] {
        padding: 10px;
    }
    
    .header-section h1[b-i7d958gljp] {
        font-size: 1.875rem;
    }
    
    .hazard-sources[b-i7d958gljp] {
        gap: 0.75rem;
    }
    
    .source-item[b-i7d958gljp] {
        padding: 0.75rem;
        gap: 0.75rem;
    }
    
    .source-item span[b-i7d958gljp] {
        font-size: 0.9rem;
    }
}
/* /Features/PrivacyPolicy/PrivacyPolicyPage.razor.rz.scp.css */
.privacy-policy-container[b-x5jutl5g58] {
    max-width: none;
    margin: 0;
    padding: 30px;
    background-color: transparent;
    border-radius: 0;
    box-shadow: none;
    font-family: 'Titillium Web', sans-serif;
    color: #333333;
}

.policy-header[b-x5jutl5g58] {
    margin-bottom: 2rem;
    text-align: center;
    border-bottom: 1px solid #f6f4e7;
    padding-bottom: 1.5rem;
}

.policy-header h1[b-x5jutl5g58] {
    color: #282885;
    font-size: 2.2rem;
    font-weight: 600;
    margin-bottom: 0.5rem;
}

.policy-updated[b-x5jutl5g58] {
    color: #8b8baa;
    font-size: 0.9rem;
}

.policy-intro[b-x5jutl5g58] {
    margin-bottom: 2rem;
    line-height: 1.6;
    color: #555555;
}

.policy-intro p[b-x5jutl5g58] {
    margin-bottom: 1rem;
}

.policy-sections[b-x5jutl5g58] {
    margin-bottom: 3rem;
}

/* Styling the Syncfusion Accordion */
[b-x5jutl5g58] .e-acrdn-header {
    background-color: #f6f4e7 !important;
    color: #282885 !important;
    font-weight: 600 !important;
    border-radius: 8px !important;
    margin-bottom: 8px !important;
    border: none !important;
}

[b-x5jutl5g58] .e-acrdn-header:hover {
    background-color: #efebd0 !important;
}

[b-x5jutl5g58] .e-acrdn-item {
    margin-bottom: 1rem !important;
    border: none !important;
}

[b-x5jutl5g58] .e-acrdn-content {
    background-color: #ffffff !important;
    border: 1px solid #f0f0f0 !important;
    border-radius: 0 0 8px 8px !important;
    padding: 1.5rem !important;
}

.policy-content[b-x5jutl5g58] {
    line-height: 1.6;
}

.policy-content h3[b-x5jutl5g58] {
    color: #282885;
    font-size: 1.2rem;
    margin: 1.5rem 0 0.8rem 0;
}

.policy-content p[b-x5jutl5g58] {
    margin-bottom: 1rem;
    color: #555555;
}

.policy-content ul[b-x5jutl5g58] {
    margin-left: 1.5rem;
    margin-bottom: 1.5rem;
    color: #555555;
}

.policy-content li[b-x5jutl5g58] {
    margin-bottom: 0.5rem;
}

.policy-contact[b-x5jutl5g58] {
    margin-bottom: 3rem;
}

/* Card styling */
[b-x5jutl5g58] .contact-card {
    border: none !important;
    box-shadow: 0 4px 12px rgba(218, 197, 118, 0.15) !important;
    border-radius: 12px !important;
    overflow: hidden !important;
}

[b-x5jutl5g58] .e-card-header {
    background-color: #f6f4e7 !important;
    color: #282885 !important;
    padding: 1rem 1.5rem !important;
    font-weight: 600 !important;
}

[b-x5jutl5g58] .e-card-content {
    padding: 1.5rem !important;
}

.contact-details[b-x5jutl5g58] {
    margin-top: 1rem;
}

.contact-item[b-x5jutl5g58] {
    margin-bottom: 0.8rem;
    display: flex;
    flex-wrap: wrap;
}

.contact-label[b-x5jutl5g58] {
    font-weight: 600;
    color: #282885;
    margin-right: 0.5rem;
    min-width: 80px;
}

.contact-item a[b-x5jutl5g58] {
    color: #1dc1c3;
    text-decoration: none;
    transition: color 0.2s;
}

.contact-item a:hover[b-x5jutl5g58] {
    color: #00a6a8;
    text-decoration: underline;
}

.policy-acknowledgment[b-x5jutl5g58] {
    text-align: center;
    padding: 2rem 0;
    border-top: 1px solid #f6f4e7;
}

.policy-acknowledgment h3[b-x5jutl5g58] {
    color: #282885;
    margin-bottom: 1rem;
    font-size: 1.3rem;
}

.acknowledgment-action[b-x5jutl5g58] {
    margin-top: 2rem;
}

/* Button styling */
[b-x5jutl5g58] .accept-button {
    background-color: #282885 !important;
    color: white !important;
    border: none !important;
    border-radius: 8px !important;
    padding: 0.7rem 2rem !important;
    font-weight: 600 !important;
    transition: all 0.2s !important;
    font-size: 1rem !important;
}

[b-x5jutl5g58] .accept-button:hover {
    background-color: #1e1e60 !important;
    box-shadow: 0 4px 12px rgba(40, 40, 133, 0.25) !important;
    transform: translateY(-2px) !important;
}

[b-x5jutl5g58] .accept-button:focus {
    outline: none !important;
    box-shadow: 0 0 0 3px rgba(40, 40, 133, 0.3) !important;
}

/* Responsive adjustments */
@media (max-width: 900px) {
    .privacy-policy-container[b-x5jutl5g58] {
        padding: 1.5rem;
        margin: 1rem;
    }

    .policy-header h1[b-x5jutl5g58] {
        font-size: 1.8rem;
    }

    .contact-item[b-x5jutl5g58] {
        flex-direction: column;
    }

    .contact-label[b-x5jutl5g58] {
        margin-bottom: 0.3rem;
    }
}
/* /Features/Registration/RegistrationPage.razor.rz.scp.css */
/* Clean Registration Page Styles */
.registration-container[b-f93otrej6s] {
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, #BFD8B8 0%, #E2E6EA 100%);
    padding: 3rem 2rem;
}

.registration-wrapper[b-f93otrej6s] {
    width: 100%;
    max-width: 550px;
    background: white;
    border-radius: 20px;
    box-shadow: 0 15px 40px rgba(20, 33, 61, 0.15);
    overflow: hidden;
}

.registration-header[b-f93otrej6s] {
    text-align: center;
    padding: 2.5rem 3rem 2rem 3rem;
    background: linear-gradient(135deg, rgba(200, 169, 81, 0.1) 0%, rgba(255, 255, 255, 0.9) 100%);
    border-bottom: 1px solid #E2E6EA;
}

.page-title[b-f93otrej6s] {
    font-size: 2.2rem;
    font-weight: 700;
    color: #14213D;
    margin-bottom: 0.75rem;
}

.page-subtitle[b-f93otrej6s] {
    font-size: 1.15rem;
    color: #2E2E2E;
    margin-bottom: 1.25rem;
    font-weight: 500;
}

.registration-description[b-f93otrej6s] {
    font-size: 0.95rem;
    color: #6c757d;
    line-height: 1.6;
    margin-bottom: 1.5rem;
}

.qr-code-section[b-f93otrej6s] {
    display: flex;
    justify-content: center;
    margin: 1.5rem 0 0.5rem 0;
}

.qr-code-container[b-f93otrej6s] {
    text-align: center;
    padding: 1.5rem 2rem;
    border: 2px dashed #C8A951;
    border-radius: 12px;
    background: rgba(200, 169, 81, 0.05);
    display: inline-block;
}

#qrcode[b-f93otrej6s] {
    margin-bottom: 0.5rem;
}

.qr-help-text[b-f93otrej6s] {
    font-size: 0.75rem;
    color: #6c757d;
    margin-bottom: 0.5rem;
}

.registration-form-container[b-f93otrej6s] {
    max-width: 100%;
    padding: 20px;
    margin: 0;
    position: relative;
}

.registration-form[b-f93otrej6s] {
    padding: 3rem;
    background: white;
}

.form-group[b-f93otrej6s] {
    margin-bottom: 2rem;
}

.form-label[b-f93otrej6s] {
    font-weight: 600;
    color: #14213D;
    margin-bottom: 0.75rem;
    font-size: 0.95rem;
    display: block;
}

.form-label.required[b-f93otrej6s]::after {
    content: " *";
    color: #e74c3c;
}

.form-control[b-f93otrej6s], .form-select[b-f93otrej6s] {
    border: 2px solid #E2E6EA;
    border-radius: 10px;
    padding: 1rem 1.25rem;
    font-size: 0.95rem;
    transition: all 0.3s ease;
    background: white;
    width: 100%;
    line-height: 1.5;
}

.form-control:focus[b-f93otrej6s], .form-select:focus[b-f93otrej6s] {
    border-color: #C8A951;
    box-shadow: 0 0 0 0.25rem rgba(200, 169, 81, 0.15);
    outline: none;
    transform: translateY(-1px);
}

.input-group-text[b-f93otrej6s] {
    background: #f8f9fa;
    border: 2px solid #E2E6EA;
    border-right: none;
    font-weight: 600;
    font-size: 0.95rem;
    color: #14213D;
    border-radius: 10px 0 0 10px;
    padding: 1rem 1.25rem;
}

.captcha-container[b-f93otrej6s] {
    margin: 2rem 0;
}

.captcha-placeholder[b-f93otrej6s] {
    border: 2px solid #E2E6EA;
    border-radius: 10px;
    padding: 1.25rem 1.5rem;
    background: #f8f9fa;
}

.captcha-box[b-f93otrej6s] {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.captcha-label[b-f93otrej6s] {
    font-size: 0.95rem;
    color: #2E2E2E;
    margin: 0;
    flex-grow: 1;
    font-weight: 500;
}

.captcha-icon[b-f93otrej6s] {
    color: #C8A951;
    font-size: 1.2rem;
}

.loading-overlay[b-f93otrej6s] {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(255, 255, 255, 0.9);
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    border-radius: 15px;
    z-index: 1000;
}

.btn-primary[b-f93otrej6s] {
    background: linear-gradient(135deg, #C8A951 0%, #b8973d 100%);
    border: none;
    padding: 1.25rem 2.5rem;
    font-weight: 600;
    font-size: 1.05rem;
    border-radius: 12px;
    transition: all 0.3s ease;
    color: white;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin-top: 1rem;
}

.btn-primary:hover[b-f93otrej6s] {
    background: linear-gradient(135deg, #b8973d 0%, #a0852f 100%);
    color: white;
}

.btn-primary:active[b-f93otrej6s] {
    transform: translateY(1px);
}

.btn-outline-primary[b-f93otrej6s] {
    border: 2px solid #C8A951;
    color: #C8A951;
    background: white;
    border-radius: 6px;
    transition: all 0.3s ease;
    font-weight: 500;
}

.btn-outline-primary:hover[b-f93otrej6s] {
    background: #C8A951;
    border-color: #C8A951;
    color: white;
}

.btn-sm[b-f93otrej6s] {
    padding: 0.75rem 1.25rem;
    font-size: 0.85rem;
    border-radius: 8px;
}

.alert[b-f93otrej6s] {
    border-radius: 10px;
    margin-bottom: 2rem;
    padding: 1.25rem 1.5rem;
}

.alert-danger[b-f93otrej6s] {
    background: #f8d7da;
    border: 1px solid #f5c6cb;
    color: #721c24;
}

.alert-success[b-f93otrej6s] {
    background: #d1edff;
    border: 1px solid #b3d7ff;
    color: #0c5460;
}

.modal-content[b-f93otrej6s] {
    border-radius: 15px;
    border: none;
    box-shadow: 0 20px 60px rgba(20, 33, 61, 0.2);
    background: white;
}

.modal-header[b-f93otrej6s] {
    border-bottom: 1px solid #E2E6EA;
    padding: 2rem 2rem 1rem 2rem;
}

.modal-body[b-f93otrej6s] {
    padding: 1rem 2rem;
}

.modal-footer[b-f93otrej6s] {
    border-top: 1px solid #E2E6EA;
    padding: 1rem 2rem 2rem 2rem;
}

.modal-title[b-f93otrej6s] {
    color: #14213D;
    font-weight: 700;
    font-size: 1.3rem;
}

.form-check[b-f93otrej6s] {
    margin-bottom: 1.5rem;
    padding-left: 0;
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
}

.form-check-input[b-f93otrej6s] {
    width: 18px;
    height: 18px;
    margin-top: 0.125rem;
    flex-shrink: 0;
    cursor: pointer;
}

.form-check-input:checked[b-f93otrej6s] {
    background-color: #C8A951;
    border-color: #C8A951;
}

.form-check-label[b-f93otrej6s] {
    font-size: 0.95rem;
    line-height: 1.5;
    color: #2E2E2E;
    font-weight: 500;
    padding-left: 0;
    margin-bottom: 0;
    cursor: pointer;
}

.form-check-label a[b-f93otrej6s] {
    color: #C8A951;
    text-decoration: none;
    font-weight: 600;
}

.form-check-label a:hover[b-f93otrej6s] {
    color: #14213D;
    text-decoration: underline;
}

.form-text[b-f93otrej6s] {
    font-size: 0.85rem;
    margin-top: 0.5rem;
    color: #6c757d;
    line-height: 1.4;
    padding-left: 0.25rem;
}

/* Row and column adjustments */
.row[b-f93otrej6s] {
    margin-left: -0.75rem;
    margin-right: -0.75rem;
}

.row > .col-md-6[b-f93otrej6s] {
    padding-left: 0.75rem;
    padding-right: 0.75rem;
}

/* Mobile Responsive */
@media (max-width: 768px) {
    .registration-container[b-f93otrej6s] {
        padding: 2rem 1rem;
        align-items: flex-start;
        padding-top: 2.5rem;
    }
    
    .registration-wrapper[b-f93otrej6s] {
        max-width: 100%;
    }
    
    .registration-header[b-f93otrej6s] {
        padding: 2rem 2rem 1.5rem 2rem;
    }
    
    .page-title[b-f93otrej6s] {
        font-size: 1.8rem;
    }
    
    .page-subtitle[b-f93otrej6s] {
        font-size: 1.05rem;
    }
    
    .registration-form[b-f93otrej6s] {
        padding: 2rem;
    }
    
    .qr-code-container[b-f93otrej6s] {
        padding: 1rem 1.5rem;
        margin: 1rem 0;
    }
    
    .form-group[b-f93otrej6s] {
        margin-bottom: 1.5rem;
    }
    
    .form-control[b-f93otrej6s], .form-select[b-f93otrej6s] {
        padding: 0.875rem 1rem;
    }
    
    .row > .col-md-6[b-f93otrej6s] {
        padding-left: 0.5rem;
        padding-right: 0.5rem;
        margin-bottom: 0.75rem;
    }
}

@media (max-width: 480px) {
    .registration-container[b-f93otrej6s] {
        padding: 1rem 0.75rem;
        padding-top: 1.5rem;
    }
    
    .registration-header[b-f93otrej6s] {
        padding: 1.5rem 1.5rem 1rem 1.5rem;
    }
    
    .page-title[b-f93otrej6s] {
        font-size: 1.6rem;
    }
    
    .page-subtitle[b-f93otrej6s] {
        font-size: 1rem;
    }
    
    .registration-form[b-f93otrej6s] {
        padding: 1.5rem;
    }
    
    .form-control[b-f93otrej6s], .form-select[b-f93otrej6s] {
        padding: 0.75rem 1rem;
        font-size: 0.9rem;
    }
    
    .form-group[b-f93otrej6s] {
        margin-bottom: 1.25rem;
    }
    
    .btn-primary[b-f93otrej6s] {
        padding: 1rem 2rem;
        font-size: 0.95rem;
    }
    
    .captcha-placeholder[b-f93otrej6s] {
        padding: 1rem 1.25rem;
    }
    
    .registration-description[b-f93otrej6s] {
        font-size: 0.9rem;
        padding: 0 0.5rem;
    }
    
    .row > .col-md-6[b-f93otrej6s] {
        padding-left: 0.375rem;
        padding-right: 0.375rem;
    }
    
    .form-check[b-f93otrej6s] {
        gap: 0.5rem;
    }
    
    .form-check-input[b-f93otrej6s] {
        width: 16px;
        height: 16px;
    }
    
    .form-check-label[b-f93otrej6s] {
        font-size: 0.9rem;
    }
}

/* Accessibility improvements */
@media (prefers-reduced-motion: reduce) {
    .form-control[b-f93otrej6s], 
    .form-select[b-f93otrej6s],
    .btn-primary[b-f93otrej6s],
    .btn-outline-primary[b-f93otrej6s] {
        transition: none;
    }
}

/* Success Modal Styles */
.success-modal[b-f93otrej6s] {
    border-radius: 25px;
    border: none;
    box-shadow: 0 25px 80px rgba(20, 33, 61, 0.25);
    background: linear-gradient(135deg, #ffffff 0%, rgba(191, 216, 184, 0.05) 100%);
    overflow: hidden;
}

.success-icon-container[b-f93otrej6s] {
    display: flex;
    justify-content: center;
    align-items: center;
}

.success-icon[b-f93otrej6s] {
    width: 80px;
    height: 80px;
    background: linear-gradient(135deg, #28a745 0%, #20c997 100%);
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    box-shadow: 0 10px 30px rgba(40, 167, 69, 0.3);
    animation: successPulse-b-f93otrej6s 2s ease-in-out infinite;
}

.success-icon i[b-f93otrej6s] {
    font-size: 2.5rem;
    color: white;
    font-weight: bold;
}

@keyframes successPulse-b-f93otrej6s {
    0%, 100% {
        transform: scale(1);
        box-shadow: 0 10px 30px rgba(40, 167, 69, 0.3);
    }
    50% {
        transform: scale(1.05);
        box-shadow: 0 15px 40px rgba(40, 167, 69, 0.4);
    }
}

.success-title[b-f93otrej6s] {
    font-size: 2.5rem;
    font-weight: 700;
    color: #14213D;
    margin-bottom: 1rem;
    text-shadow: 0 2px 4px rgba(20, 33, 61, 0.1);
}

.success-message[b-f93otrej6s] {
    font-size: 1.2rem;
    color: #2E2E2E;
    line-height: 1.6;
    max-width: 500px;
    margin: 0 auto 2rem auto;
}

.email-confirmation[b-f93otrej6s] {
    background: linear-gradient(135deg, rgba(200, 169, 81, 0.1) 0%, rgba(200, 169, 81, 0.05) 100%);
    border-radius: 15px;
    padding: 1.5rem;
    margin: 2rem auto;
    max-width: 400px;
    border: 1px solid rgba(200, 169, 81, 0.2);
}

.confirmation-box[b-f93otrej6s] {
    color: #14213D;
    font-size: 1rem;
    line-height: 1.6;
}

.confirmation-box i[b-f93otrej6s] {
    color: #C8A951;
    font-size: 1.2rem;
}

.email-address[b-f93otrej6s] {
    color: #C8A951;
    font-size: 1.1rem;
    word-break: break-word;
}

.contact-promise[b-f93otrej6s] {
    background: linear-gradient(135deg, rgba(191, 216, 184, 0.15) 0%, rgba(191, 216, 184, 0.05) 100%);
    border-radius: 20px;
    padding: 2rem;
    margin: 2rem auto;
    max-width: 500px;
    border: 1px solid rgba(191, 216, 184, 0.3);
    position: relative;
}

.promise-icon[b-f93otrej6s] {
    width: 60px;
    height: 60px;
    background: linear-gradient(135deg, #BFD8B8 0%, #a5c49a 100%);
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 0 auto 1.5rem auto;
    box-shadow: 0 8px 25px rgba(191, 216, 184, 0.4);
}

.promise-icon i[b-f93otrej6s] {
    font-size: 1.8rem;
    color: #14213D;
}

.promise-title[b-f93otrej6s] {
    font-size: 1.4rem;
    font-weight: 600;
    color: #14213D;
    margin-bottom: 1rem;
    text-align: center;
}

.promise-text[b-f93otrej6s] {
    font-size: 1rem;
    color: #2E2E2E;
    line-height: 1.6;
    text-align: center;
    margin-bottom: 0;
}

.success-btn[b-f93otrej6s] {
    background: linear-gradient(135deg, #C8A951 0%, #b8973d 100%);
    border: none;
    padding: 1rem 3rem;
    font-weight: 600;
    font-size: 1.1rem;
    border-radius: 15px;
    transition: all 0.3s ease;
    color: white;
    text-transform: uppercase;
    letter-spacing: 1px;
    box-shadow: 0 8px 25px rgba(200, 169, 81, 0.3);
    margin-top: 1rem;
}

.success-btn:hover[b-f93otrej6s] {
    background: linear-gradient(135deg, #b8973d 0%, #a0852f 100%);
    transform: translateY(-2px);
    box-shadow: 0 12px 35px rgba(200, 169, 81, 0.4);
    color: white;
}

.success-btn:active[b-f93otrej6s] {
    transform: translateY(0);
}

.success-btn i[b-f93otrej6s] {
    transition: transform 0.3s ease;
}

.success-btn:hover i[b-f93otrej6s] {
    transform: translateX(3px);
}

/* Modal backdrop enhancement */
.modal-backdrop.show[b-f93otrej6s] {
    background: rgba(20, 33, 61, 0.6);
    backdrop-filter: blur(5px);
}

/* Mobile responsive for success modal */
@media (max-width: 768px) {
    .success-modal[b-f93otrej6s] {
        margin: 1rem;
        border-radius: 20px;
    }
    
    .success-title[b-f93otrej6s] {
        font-size: 2rem;
    }
    
    .success-message[b-f93otrej6s] {
        font-size: 1.1rem;
    }
    
    .success-icon[b-f93otrej6s] {
        width: 70px;
        height: 70px;
    }
    
    .success-icon i[b-f93otrej6s] {
        font-size: 2rem;
    }
    
    .promise-icon[b-f93otrej6s] {
        width: 50px;
        height: 50px;
    }
    
    .promise-icon i[b-f93otrej6s] {
        font-size: 1.5rem;
    }
    
    .contact-promise[b-f93otrej6s],
    .email-confirmation[b-f93otrej6s] {
        padding: 1.5rem;
        margin: 1.5rem auto;
    }
    
    .promise-title[b-f93otrej6s] {
        font-size: 1.2rem;
    }
    
    .success-btn[b-f93otrej6s] {
        padding: 0.875rem 2.5rem;
        font-size: 1rem;
        border-radius: 12px;
    }
}

@media (max-width: 480px) {
    .success-title[b-f93otrej6s] {
        font-size: 1.8rem;
    }
    
    .success-message[b-f93otrej6s] {
        font-size: 1rem;
    }
    
    .contact-promise[b-f93otrej6s],
    .email-confirmation[b-f93otrej6s] {
        padding: 1.25rem;
        margin: 1.25rem auto;
    }
    
    .success-btn[b-f93otrej6s] {
        padding: 0.75rem 2rem;
        font-size: 0.95rem;
        width: 100%;
        max-width: 280px;
    }
}

/* High contrast mode support */
@media (prefers-contrast: high) {
    .registration-container[b-f93otrej6s] {
        background: #ffffff;
    }
    
    .registration-wrapper[b-f93otrej6s] {
        border: 2px solid #000000;
    }
    
    .page-title[b-f93otrej6s] {
        color: #000000;
    }
    
    .form-control[b-f93otrej6s], .form-select[b-f93otrej6s] {
        border: 2px solid #000000;
        background: #ffffff;
    }
    
    .success-modal[b-f93otrej6s] {
        border: 2px solid #000000;
        background: #ffffff;
    }
    
    .success-icon[b-f93otrej6s] {
        background: #28a745;
        border: 2px solid #000000;
    }
    
    .promise-icon[b-f93otrej6s] {
        background: #BFD8B8;
        border: 2px solid #000000;
    }
}
/* /Features/Resources/Components/ResourceGrid.razor.rz.scp.css */
.resource-grid[b-t7navhmvi5] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(350px, 1fr));
    gap: 1.5rem;
    padding: 1rem 0;
}

.grid-header[b-t7navhmvi5] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1.5rem;
    flex-wrap: wrap;
    gap: 1rem;
}

.grid-title[b-t7navhmvi5] {
    color: #14213D;
    font-size: 1.25rem;
    font-weight: 600;
    margin: 0;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.resource-count[b-t7navhmvi5] {
    color: #2E2E2E;
    font-size: 0.9rem;
    background: rgba(191, 216, 184, 0.1);
    padding: 0.25rem 0.75rem;
    border-radius: 12px;
    border: 1px solid rgba(200, 169, 81, 0.2);
}

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

.view-toggle[b-t7navhmvi5] {
    display: flex;
    gap: 0.25rem;
    border: 1px solid #E2E6EA;
    border-radius: 6px;
    overflow: hidden;
}

.view-toggle button[b-t7navhmvi5] {
    padding: 0.5rem 0.75rem;
    background: white;
    border: none;
    color: #2E2E2E;
    font-size: 0.9rem;
    cursor: pointer;
    transition: all 0.3s ease;
    display: flex;
    align-items: center;
    gap: 0.25rem;
}

.view-toggle button:hover[b-t7navhmvi5] {
    background: #F8F9FA;
}

.view-toggle button.active[b-t7navhmvi5] {
    background: #C8A951;
    color: white;
}

.sort-dropdown[b-t7navhmvi5] {
    min-width: 150px;
}

/* Resource Card Styles */
[b-t7navhmvi5] .resource-item-card {
    border-radius: 12px;
    border: 1px solid #E2E6EA;
    transition: all 0.3s ease;
    height: 100%;
    display: flex;
    flex-direction: column;
}

[b-t7navhmvi5] .resource-item-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.1);
    border-color: #C8A951;
}

[b-t7navhmvi5] .resource-item-card.featured {
    border-left: 4px solid #C8A951;
    background: linear-gradient(135deg, rgba(200, 169, 81, 0.05) 0%, rgba(255, 255, 255, 1) 100%);
}

[b-t7navhmvi5] .resource-item-card.premium {
    border-top: 2px solid #ffc107;
    position: relative;
}

[b-t7navhmvi5] .resource-item-card.premium::before {
    content: '';
    position: absolute;
    top: -2px;
    left: -1px;
    right: -1px;
    height: 2px;
    background: linear-gradient(90deg, #ffc107 0%, #C8A951 100%);
    border-radius: 12px 12px 0 0;
}

.resource-thumbnail[b-t7navhmvi5] {
    position: relative;
    width: 100%;
    height: 200px;
    background: #F8F9FA;
    border-radius: 8px;
    margin-bottom: 1rem;
    overflow: hidden;
}

.resource-thumbnail img[b-t7navhmvi5] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.resource-thumbnail .placeholder-icon[b-t7navhmvi5] {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
    font-size: 3rem;
    color: #BFD8B8;
}

.duration-overlay[b-t7navhmvi5] {
    position: absolute;
    bottom: 0.5rem;
    right: 0.5rem;
    background: rgba(20, 33, 61, 0.8);
    color: white;
    padding: 0.25rem 0.5rem;
    border-radius: 6px;
    font-size: 0.75rem;
    display: flex;
    align-items: center;
    gap: 0.25rem;
}

.resource-content[b-t7navhmvi5] {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.resource-header[b-t7navhmvi5] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 1rem;
}

.resource-title[b-t7navhmvi5] {
    color: #14213D;
    font-size: 1.1rem;
    font-weight: 600;
    margin: 0;
    line-height: 1.3;
    flex: 1;
}

.resource-badges[b-t7navhmvi5] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.25rem;
    align-items: flex-start;
}

.resource-description[b-t7navhmvi5] {
    color: #2E2E2E;
    font-size: 0.9rem;
    line-height: 1.5;
    margin: 0;
    flex: 1;
}

.resource-metadata[b-t7navhmvi5] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    margin-top: auto;
}

.metadata-row[b-t7navhmvi5] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 0.5rem;
    flex-wrap: wrap;
}

.metadata-item[b-t7navhmvi5] {
    display: flex;
    align-items: center;
    gap: 0.25rem;
    color: #6c757d;
    font-size: 0.8rem;
}

.metadata-item i[b-t7navhmvi5] {
    font-size: 0.75rem;
}

.stats-row[b-t7navhmvi5] {
    border-top: 1px solid #E2E6EA;
    padding-top: 0.5rem;
    margin-top: 0.5rem;
}

.rating-display[b-t7navhmvi5] {
    display: flex;
    align-items: center;
    gap: 0.25rem;
}

.stars[b-t7navhmvi5] {
    display: flex;
    gap: 0.1rem;
}

.stars i[b-t7navhmvi5] {
    color: #ffc107;
    font-size: 0.75rem;
}

.resource-tags[b-t7navhmvi5] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.25rem;
    margin-top: 0.5rem;
}

.resource-tag[b-t7navhmvi5] {
    padding: 0.15rem 0.5rem;
    background: rgba(191, 216, 184, 0.1);
    color: #14213D;
    border: 1px solid rgba(191, 216, 184, 0.3);
    border-radius: 8px;
    font-size: 0.7rem;
    font-weight: 500;
}

.more-tags[b-t7navhmvi5] {
    padding: 0.15rem 0.5rem;
    background: rgba(46, 46, 46, 0.1);
    color: #6c757d;
    border: 1px solid rgba(46, 46, 46, 0.2);
    border-radius: 8px;
    font-size: 0.7rem;
    font-style: italic;
}

/* Badge Styles */
.category-badge[b-t7navhmvi5] {
    padding: 0.15rem 0.5rem;
    background: rgba(200, 169, 81, 0.1);
    color: #C8A951;
    border: 1px solid rgba(200, 169, 81, 0.3);
    border-radius: 8px;
    font-size: 0.7rem;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.type-badge[b-t7navhmvi5] {
    padding: 0.15rem 0.5rem;
    background: rgba(191, 216, 184, 0.1);
    color: #14213D;
    border: 1px solid rgba(191, 216, 184, 0.3);
    border-radius: 8px;
    font-size: 0.7rem;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.premium-badge[b-t7navhmvi5] {
    padding: 0.15rem 0.5rem;
    background: rgba(255, 193, 7, 0.1);
    color: #ffc107;
    border: 1px solid rgba(255, 193, 7, 0.3);
    border-radius: 8px;
    font-size: 0.7rem;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    display: flex;
    align-items: center;
    gap: 0.25rem;
}

.featured-badge[b-t7navhmvi5] {
    padding: 0.15rem 0.5rem;
    background: rgba(25, 135, 84, 0.1);
    color: #198754;
    border: 1px solid rgba(25, 135, 84, 0.3);
    border-radius: 8px;
    font-size: 0.7rem;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    display: flex;
    align-items: center;
    gap: 0.25rem;
}

/* Action Styles */
.resource-actions[b-t7navhmvi5] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 0.5rem;
    margin-top: 1rem;
    padding-top: 1rem;
    border-top: 1px solid #E2E6EA;
}

.primary-actions[b-t7navhmvi5] {
    display: flex;
    gap: 0.5rem;
    flex: 1;
}

.secondary-actions[b-t7navhmvi5] {
    display: flex;
    gap: 0.25rem;
    position: relative;
}

.action-menu-btn[b-t7navhmvi5] {
    padding: 0.25rem 0.5rem;
    background: white;
    border: 1px solid #E2E6EA;
    border-radius: 6px;
    color: #6c757d;
    cursor: pointer;
    transition: all 0.3s ease;
}

.action-menu-btn:hover[b-t7navhmvi5] {
    background: #F8F9FA;
    border-color: #C8A951;
    color: #C8A951;
}

.action-menu[b-t7navhmvi5] {
    position: absolute;
    top: 100%;
    right: 0;
    background: white;
    border: 1px solid #E2E6EA;
    border-radius: 8px;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.1);
    z-index: 1000;
    min-width: 150px;
}

.action-menu button[b-t7navhmvi5] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    width: 100%;
    padding: 0.75rem 1rem;
    background: none;
    border: none;
    color: #2E2E2E;
    font-size: 0.9rem;
    cursor: pointer;
    transition: background-color 0.3s ease;
    text-align: left;
}

.action-menu button:hover[b-t7navhmvi5] {
    background: #F8F9FA;
}

.action-menu button:first-child[b-t7navhmvi5] {
    border-radius: 8px 8px 0 0;
}

.action-menu button:last-child[b-t7navhmvi5] {
    border-radius: 0 0 8px 8px;
}

/* Quick Actions */
.quick-actions[b-t7navhmvi5] {
    display: flex;
    gap: 0.25rem;
}

.quick-action-btn[b-t7navhmvi5] {
    padding: 0.25rem;
    background: white;
    border: 1px solid #E2E6EA;
    border-radius: 6px;
    color: #6c757d;
    cursor: pointer;
    transition: all 0.3s ease;
    width: 28px;
    height: 28px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.quick-action-btn:hover[b-t7navhmvi5] {
    background: #F8F9FA;
    border-color: #C8A951;
    color: #C8A951;
}

.quick-action-btn.active[b-t7navhmvi5] {
    background: #C8A951;
    border-color: #C8A951;
    color: white;
}

/* Loading States */
.loading-grid[b-t7navhmvi5] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(350px, 1fr));
    gap: 1.5rem;
    padding: 1rem 0;
}

.loading-card[b-t7navhmvi5] {
    height: 300px;
    background: linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 50%, #f0f0f0 75%);
    background-size: 200% 100%;
    animation: loading-b-t7navhmvi5 1.5s infinite;
    border-radius: 12px;
}

@keyframes loading-b-t7navhmvi5 {
    0% { background-position: 200% 0; }
    100% { background-position: -200% 0; }
}

/* Empty State */
.empty-grid-state[b-t7navhmvi5] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 4rem 2rem;
    text-align: center;
    background: white;
    border-radius: 12px;
    border: 2px dashed #E2E6EA;
    grid-column: 1 / -1;
}

.empty-grid-icon[b-t7navhmvi5] {
    font-size: 4rem;
    color: #BFD8B8;
    margin-bottom: 1.5rem;
}

.empty-grid-state h3[b-t7navhmvi5] {
    color: #14213D;
    font-size: 1.5rem;
    margin-bottom: 0.5rem;
}

.empty-grid-state p[b-t7navhmvi5] {
    color: #2E2E2E;
    font-size: 1rem;
    margin-bottom: 2rem;
    max-width: 400px;
}

/* Responsive Design */
@media (max-width: 768px) {
    .resource-grid[b-t7navhmvi5] {
        grid-template-columns: 1fr;
        gap: 1rem;
    }
    
    .grid-header[b-t7navhmvi5] {
        flex-direction: column;
        align-items: flex-start;
        gap: 1rem;
    }
    
    .grid-controls[b-t7navhmvi5] {
        width: 100%;
        justify-content: space-between;
    }
    
    .resource-actions[b-t7navhmvi5] {
        flex-direction: column;
        gap: 0.75rem;
    }
    
    .primary-actions[b-t7navhmvi5] {
        order: 1;
        width: 100%;
        justify-content: stretch;
    }
    
    .secondary-actions[b-t7navhmvi5] {
        order: 2;
        justify-content: center;
    }
}

@media (max-width: 480px) {
    .resource-grid[b-t7navhmvi5] {
        gap: 0.75rem;
    }
    
    .resource-thumbnail[b-t7navhmvi5] {
        height: 150px;
    }
    
    .resource-badges[b-t7navhmvi5] {
        flex-direction: column;
        align-items: flex-end;
        gap: 0.25rem;
    }
    
    .metadata-row[b-t7navhmvi5] {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.25rem;
    }
    
    .primary-actions[b-t7navhmvi5] {
        flex-direction: column;
    }
}
/* /Features/Resources/EAPResourcesPage.razor.rz.scp.css */
.eap-resources-page[b-b6kg35407n] {
    padding: 2rem;
    max-width: 1400px;
    margin: 0 auto;
}

.page-header[b-b6kg35407n] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 2.5rem;
    flex-wrap: wrap;
    gap: 1rem;
}

.header-content[b-b6kg35407n] {
    flex: 1;
}

.page-title[b-b6kg35407n] {
    color: #14213D;
    font-size: 2.5rem;
    font-weight: 600;
    margin-bottom: 0.5rem;
    display: flex;
    align-items: center;
    gap: 1rem;
}

.page-title i[b-b6kg35407n] {
    color: #C8A951;
    font-size: 2rem;
}

.page-description[b-b6kg35407n] {
    color: #2E2E2E;
    font-size: 1.1rem;
    margin: 0;
    max-width: 600px;
}

.header-actions[b-b6kg35407n] {
    display: flex;
    gap: 0.75rem;
    align-items: center;
}

.eap-content[b-b6kg35407n] {
    display: flex;
    flex-direction: column;
    gap: 2.5rem;
}

.loading-state[b-b6kg35407n] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 4rem 2rem;
    text-align: center;
}

.spinner[b-b6kg35407n] {
    width: 40px;
    height: 40px;
    border: 4px solid #E2E6EA;
    border-top: 4px solid #C8A951;
    border-radius: 50%;
    animation: spin-b-b6kg35407n 1s linear infinite;
    margin-bottom: 1rem;
}

@keyframes spin-b-b6kg35407n {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

/* EAP Overview Section */
.eap-overview[b-b6kg35407n] {
    margin-bottom: 2rem;
}

[b-b6kg35407n] .eap-benefits-card {
    border: 2px solid #C8A951;
    border-radius: 12px;
    background: linear-gradient(135deg, rgba(200, 169, 81, 0.05) 0%, rgba(191, 216, 184, 0.05) 100%);
}

.benefits-grid[b-b6kg35407n] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 1.5rem;
    margin-top: 1rem;
}

.benefit-item[b-b6kg35407n] {
    text-align: center;
    padding: 1.5rem;
    background: white;
    border-radius: 8px;
    border: 1px solid rgba(200, 169, 81, 0.2);
    transition: transform 0.3s ease;
}

.benefit-item:hover[b-b6kg35407n] {
    transform: translateY(-2px);
}

.benefit-item i[b-b6kg35407n] {
    font-size: 2rem;
    color: #C8A951;
    margin-bottom: 1rem;
}

.benefit-item h4[b-b6kg35407n] {
    color: #14213D;
    font-size: 1.1rem;
    font-weight: 600;
    margin-bottom: 0.5rem;
}

.benefit-item p[b-b6kg35407n] {
    color: #2E2E2E;
    font-size: 0.9rem;
    margin: 0;
    line-height: 1.4;
}

/* Quick Access Section */
.quick-access[b-b6kg35407n] {
    margin-bottom: 2rem;
}

.section-title[b-b6kg35407n] {
    color: #14213D;
    font-size: 1.5rem;
    font-weight: 600;
    margin-bottom: 1rem;
    padding-bottom: 0.5rem;
    border-bottom: 2px solid #BFD8B8;
}

.quick-access-grid[b-b6kg35407n] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 1.5rem;
}

[b-b6kg35407n] .quick-access-card {
    border-radius: 12px;
    transition: all 0.3s ease;
}

[b-b6kg35407n] .quick-access-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.15);
}

[b-b6kg35407n] .quick-access-card.crisis {
    border-left: 4px solid #dc3545;
    background: linear-gradient(135deg, rgba(220, 53, 69, 0.05) 0%, rgba(255, 255, 255, 1) 100%);
}

.contact-info[b-b6kg35407n] {
    margin-top: 1rem;
    padding: 1rem;
    background: rgba(220, 53, 69, 0.1);
    border-radius: 6px;
    text-align: center;
}

.contact-info strong[b-b6kg35407n] {
    color: #dc3545;
    font-size: 1.1rem;
}

.availability[b-b6kg35407n] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-top: 1rem;
}

.status-indicator[b-b6kg35407n] {
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: #6c757d;
}

.status-indicator.online[b-b6kg35407n] {
    background: #198754;
    animation: pulse-b-b6kg35407n 2s infinite;
}

@keyframes pulse-b-b6kg35407n {
    0% { opacity: 1; }
    50% { opacity: 0.5; }
    100% { opacity: 1; }
}

.resource-count[b-b6kg35407n] {
    margin-top: 1rem;
    padding: 0.5rem;
    background: rgba(191, 216, 184, 0.1);
    border-radius: 6px;
    text-align: center;
    font-weight: 500;
    color: #14213D;
}

/* EAP Resources Section */
.eap-resources-section[b-b6kg35407n] {
    margin-top: 2rem;
}

.filter-controls[b-b6kg35407n] {
    display: flex;
    gap: 1.5rem;
    margin-bottom: 2rem;
    padding: 1.5rem;
    background: rgba(191, 216, 184, 0.1);
    border-radius: 8px;
    border: 1px solid rgba(200, 169, 81, 0.2);
}

.filter-group[b-b6kg35407n] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.filter-group label[b-b6kg35407n] {
    font-weight: 600;
    color: #14213D;
    font-size: 0.9rem;
}

.category-filter[b-b6kg35407n],
.type-filter[b-b6kg35407n] {
    padding: 0.5rem;
    border: 1px solid #E2E6EA;
    border-radius: 6px;
    background: white;
    color: #2E2E2E;
    font-size: 0.9rem;
    min-width: 150px;
}

.category-filter:focus[b-b6kg35407n],
.type-filter:focus[b-b6kg35407n] {
    outline: none;
    border-color: #C8A951;
    box-shadow: 0 0 0 2px rgba(200, 169, 81, 0.2);
}

.resources-grid[b-b6kg35407n] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(350px, 1fr));
    gap: 1.5rem;
}

[b-b6kg35407n] .eap-resource-card {
    border-radius: 12px;
    border: 1px solid #E2E6EA;
    transition: all 0.3s ease;
}

[b-b6kg35407n] .eap-resource-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.15);
    border-color: #C8A951;
}

.resource-info[b-b6kg35407n] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.resource-description[b-b6kg35407n] {
    color: #2E2E2E;
    font-size: 0.95rem;
    line-height: 1.5;
    margin: 0;
}

.resource-meta[b-b6kg35407n] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.category-tag[b-b6kg35407n],
.type-tag[b-b6kg35407n],
.duration-tag[b-b6kg35407n] {
    display: inline-block;
    padding: 0.25rem 0.75rem;
    border-radius: 12px;
    font-size: 0.75rem;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.category-tag[b-b6kg35407n] {
    background: rgba(200, 169, 81, 0.1);
    color: #C8A951;
    border: 1px solid rgba(200, 169, 81, 0.3);
}

.type-tag[b-b6kg35407n] {
    background: rgba(191, 216, 184, 0.1);
    color: #14213D;
    border: 1px solid rgba(191, 216, 184, 0.3);
}

.duration-tag[b-b6kg35407n] {
    background: rgba(46, 46, 46, 0.1);
    color: #2E2E2E;
    border: 1px solid rgba(46, 46, 46, 0.2);
    display: flex;
    align-items: center;
    gap: 0.25rem;
}

.resource-actions[b-b6kg35407n] {
    display: flex;
    gap: 0.75rem;
    justify-content: flex-start;
    flex-wrap: wrap;
}

.empty-state[b-b6kg35407n] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 4rem 2rem;
    text-align: center;
    background: white;
    border-radius: 12px;
    border: 2px dashed #E2E6EA;
}

.empty-icon[b-b6kg35407n] {
    font-size: 4rem;
    color: #BFD8B8;
    margin-bottom: 1.5rem;
}

.empty-state h3[b-b6kg35407n] {
    color: #14213D;
    font-size: 1.5rem;
    margin-bottom: 0.5rem;
}

.empty-state p[b-b6kg35407n] {
    color: #2E2E2E;
    font-size: 1rem;
    margin-bottom: 2rem;
    max-width: 400px;
}

.upgrade-prompt[b-b6kg35407n] {
    text-align: center;
    padding: 3rem 2rem;
    background: linear-gradient(135deg, rgba(200, 169, 81, 0.1) 0%, rgba(191, 216, 184, 0.1) 100%);
    border-radius: 12px;
    border: 2px solid #C8A951;
}

.upgrade-prompt h3[b-b6kg35407n] {
    color: #14213D;
    font-size: 1.5rem;
    margin-bottom: 1rem;
}

.upgrade-prompt p[b-b6kg35407n] {
    color: #2E2E2E;
    font-size: 1rem;
    margin-bottom: 2rem;
    max-width: 400px;
    margin-left: auto;
    margin-right: auto;
}

/* Responsive Design */
@media (max-width: 768px) {
    .eap-resources-page[b-b6kg35407n] {
        padding: 1rem;
    }
    
    .page-header[b-b6kg35407n] {
        flex-direction: column;
        align-items: flex-start;
    }
    
    .page-title[b-b6kg35407n] {
        font-size: 2rem;
    }
    
    .benefits-grid[b-b6kg35407n] {
        grid-template-columns: 1fr;
        gap: 1rem;
    }
    
    .quick-access-grid[b-b6kg35407n] {
        grid-template-columns: 1fr;
        gap: 1rem;
    }
    
    .filter-controls[b-b6kg35407n] {
        flex-direction: column;
        gap: 1rem;
    }
    
    .resources-grid[b-b6kg35407n] {
        grid-template-columns: 1fr;
        gap: 1rem;
    }
    
    .resource-actions[b-b6kg35407n] {
        justify-content: stretch;
        flex-direction: column;
    }
}

@media (max-width: 480px) {
    .eap-resources-page[b-b6kg35407n] {
        padding: 0.5rem;
    }
    
    .page-title[b-b6kg35407n] {
        font-size: 1.75rem;
        flex-direction: column;
        align-items: flex-start;
        gap: 0.5rem;
    }
    
    .benefit-item[b-b6kg35407n] {
        padding: 1rem;
    }
    
    .filter-group[b-b6kg35407n] {
        gap: 0.25rem;
    }
    
    .category-filter[b-b6kg35407n],
    .type-filter[b-b6kg35407n] {
        min-width: 120px;
    }
}
/* /Features/Resources/ResourceCategoriesPage.razor.rz.scp.css */
.resource-categories-page[b-19psdav5tu] {
    padding: 2rem;
    max-width: 1400px;
    margin: 0 auto;
}

.page-header[b-19psdav5tu] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 2.5rem;
    flex-wrap: wrap;
    gap: 1rem;
}

.page-title[b-19psdav5tu] {
    color: #14213D;
    font-size: 2.5rem;
    font-weight: 600;
    margin-bottom: 0.5rem;
}

.page-description[b-19psdav5tu] {
    color: #2E2E2E;
    font-size: 1.1rem;
    margin: 0;
}

.header-actions[b-19psdav5tu] {
    display: flex;
    gap: 0.75rem;
    align-items: center;
}

.categories-content[b-19psdav5tu] {
    display: flex;
    flex-direction: column;
    gap: 2rem;
}

.loading-state[b-19psdav5tu] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 4rem 2rem;
    text-align: center;
}

.spinner[b-19psdav5tu] {
    width: 40px;
    height: 40px;
    border: 4px solid #E2E6EA;
    border-top: 4px solid #C8A951;
    border-radius: 50%;
    animation: spin-b-19psdav5tu 1s linear infinite;
    margin-bottom: 1rem;
}

@keyframes spin-b-19psdav5tu {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

.categories-grid[b-19psdav5tu] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(350px, 1fr));
    gap: 1.5rem;
}

[b-19psdav5tu] .category-card {
    border-radius: 12px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
    border: 1px solid #E2E6EA;
    transition: all 0.3s ease;
}

[b-19psdav5tu] .category-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.15);
}

.category-info[b-19psdav5tu] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.category-description[b-19psdav5tu] {
    color: #2E2E2E;
    font-size: 0.95rem;
    line-height: 1.5;
    margin: 0;
}

.category-stats[b-19psdav5tu] {
    display: flex;
    gap: 1.5rem;
}

.stat-item[b-19psdav5tu] {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 0.75rem;
    background: rgba(191, 216, 184, 0.1);
    border-radius: 8px;
    border: 1px solid rgba(200, 169, 81, 0.2);
    min-width: 80px;
}

.stat-value[b-19psdav5tu] {
    font-size: 1.25rem;
    font-weight: 700;
    color: #14213D;
    margin-bottom: 0.25rem;
}

.stat-label[b-19psdav5tu] {
    font-size: 0.75rem;
    color: #2E2E2E;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.status-badge[b-19psdav5tu] {
    display: inline-block;
    padding: 0.25rem 0.75rem;
    border-radius: 12px;
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    align-self: flex-start;
}

.status-badge.active[b-19psdav5tu] {
    background: rgba(25, 135, 84, 0.1);
    color: #198754;
    border: 1px solid #198754;
}

.status-badge.inactive[b-19psdav5tu] {
    background: rgba(108, 117, 125, 0.1);
    color: #6c757d;
    border: 1px solid #6c757d;
}

.category-actions[b-19psdav5tu] {
    display: flex;
    gap: 0.75rem;
    justify-content: flex-start;
    flex-wrap: wrap;
}

.empty-state[b-19psdav5tu] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 4rem 2rem;
    text-align: center;
    background: white;
    border-radius: 12px;
    border: 2px dashed #E2E6EA;
}

.empty-icon[b-19psdav5tu] {
    font-size: 4rem;
    color: #BFD8B8;
    margin-bottom: 1.5rem;
}

.empty-state h3[b-19psdav5tu] {
    color: #14213D;
    font-size: 1.5rem;
    margin-bottom: 0.5rem;
}

.empty-state p[b-19psdav5tu] {
    color: #2E2E2E;
    font-size: 1rem;
    margin-bottom: 2rem;
    max-width: 400px;
}

/* Responsive Design */
@media (max-width: 768px) {
    .resource-categories-page[b-19psdav5tu] {
        padding: 1rem;
    }
    
    .page-header[b-19psdav5tu] {
        flex-direction: column;
        align-items: flex-start;
    }
    
    .page-title[b-19psdav5tu] {
        font-size: 2rem;
    }
    
    .categories-grid[b-19psdav5tu] {
        grid-template-columns: 1fr;
        gap: 1rem;
    }
    
    .category-stats[b-19psdav5tu] {
        justify-content: space-between;
    }
    
    .category-actions[b-19psdav5tu] {
        justify-content: stretch;
        flex-direction: column;
    }
}

@media (max-width: 480px) {
    .resource-categories-page[b-19psdav5tu] {
        padding: 0.5rem;
    }
    
    .page-title[b-19psdav5tu] {
        font-size: 1.75rem;
    }
    
    .stat-item[b-19psdav5tu] {
        min-width: 60px;
        padding: 0.5rem;
    }
    
    .category-actions[b-19psdav5tu] {
        gap: 0.5rem;
    }
}
/* /Features/Resources/ResourceSearchPage.razor.rz.scp.css */
.resource-search-page[b-vlubrz968g] {
    padding: 2rem;
    max-width: 1400px;
    margin: 0 auto;
}

.page-header[b-vlubrz968g] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 2.5rem;
    flex-wrap: wrap;
    gap: 1rem;
}

.header-content[b-vlubrz968g] {
    flex: 1;
}

.page-title[b-vlubrz968g] {
    color: #14213D;
    font-size: 2.5rem;
    font-weight: 600;
    margin-bottom: 0.5rem;
    display: flex;
    align-items: center;
    gap: 1rem;
}

.page-title i[b-vlubrz968g] {
    color: #C8A951;
    font-size: 2rem;
}

.page-description[b-vlubrz968g] {
    color: #2E2E2E;
    font-size: 1.1rem;
    margin: 0;
    max-width: 600px;
}

.header-actions[b-vlubrz968g] {
    display: flex;
    gap: 0.75rem;
    align-items: center;
}

.search-content[b-vlubrz968g] {
    display: flex;
    flex-direction: column;
    gap: 2rem;
}

/* Search Controls */
.search-controls[b-vlubrz968g] {
    margin-bottom: 2rem;
}

[b-vlubrz968g] .search-card {
    border: 2px solid #C8A951;
    border-radius: 12px;
    background: linear-gradient(135deg, rgba(200, 169, 81, 0.05) 0%, rgba(191, 216, 184, 0.05) 100%);
}

.search-form[b-vlubrz968g] {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

.search-row[b-vlubrz968g] {
    display: flex;
    gap: 1rem;
    align-items: flex-end;
}

.search-row.primary[b-vlubrz968g] {
    flex-wrap: wrap;
}

.search-field.main-search[b-vlubrz968g] {
    flex: 1;
    min-width: 300px;
}

.search-actions[b-vlubrz968g] {
    display: flex;
    gap: 0.5rem;
}

.search-row.filters[b-vlubrz968g] {
    flex-wrap: wrap;
    gap: 1rem;
}

.filter-group[b-vlubrz968g] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    min-width: 150px;
}

.filter-group label[b-vlubrz968g] {
    font-weight: 600;
    color: #14213D;
    font-size: 0.9rem;
}

.active-filters[b-vlubrz968g] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    align-items: center;
    padding: 1rem;
    background: rgba(191, 216, 184, 0.1);
    border-radius: 8px;
    border: 1px solid rgba(200, 169, 81, 0.2);
}

.filters-label[b-vlubrz968g] {
    font-weight: 600;
    color: #14213D;
    font-size: 0.9rem;
}

.filter-tag[b-vlubrz968g] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.25rem 0.75rem;
    background: #C8A951;
    color: white;
    border-radius: 12px;
    font-size: 0.8rem;
    font-weight: 500;
}

.filter-tag button[b-vlubrz968g] {
    background: none;
    border: none;
    color: white;
    padding: 0;
    margin: 0;
    cursor: pointer;
    font-size: 0.7rem;
}

.filter-tag button:hover[b-vlubrz968g] {
    opacity: 0.8;
}

/* Search Results */
.search-results[b-vlubrz968g] {
    flex: 1;
}

.loading-state[b-vlubrz968g] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 4rem 2rem;
    text-align: center;
}

.spinner[b-vlubrz968g] {
    width: 40px;
    height: 40px;
    border: 4px solid #E2E6EA;
    border-top: 4px solid #C8A951;
    border-radius: 50%;
    animation: spin-b-vlubrz968g 1s linear infinite;
    margin-bottom: 1rem;
}

@keyframes spin-b-vlubrz968g {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

.results-header[b-vlubrz968g] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 2rem;
    flex-wrap: wrap;
    gap: 1rem;
}

.results-title[b-vlubrz968g] {
    color: #14213D;
    font-size: 1.5rem;
    font-weight: 600;
    margin: 0;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.results-count[b-vlubrz968g] {
    color: #2E2E2E;
    font-size: 1rem;
    font-weight: 400;
}

.view-controls[b-vlubrz968g] {
    display: flex;
    gap: 0.25rem;
    border: 1px solid #E2E6EA;
    border-radius: 6px;
    overflow: hidden;
}

.view-toggle[b-vlubrz968g] {
    padding: 0.5rem 1rem;
    background: white;
    border: none;
    color: #2E2E2E;
    font-size: 0.9rem;
    cursor: pointer;
    transition: all 0.3s ease;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.view-toggle:hover[b-vlubrz968g] {
    background: #F8F9FA;
}

.view-toggle.active[b-vlubrz968g] {
    background: #C8A951;
    color: white;
}

/* Results Grid */
.results-grid[b-vlubrz968g] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(350px, 1fr));
    gap: 1.5rem;
}

/* Results List */
.results-list[b-vlubrz968g] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.result-item[b-vlubrz968g] {
    display: flex;
    padding: 1.5rem;
    background: white;
    border: 1px solid #E2E6EA;
    border-radius: 12px;
    transition: all 0.3s ease;
    gap: 1.5rem;
}

.result-item:hover[b-vlubrz968g] {
    transform: translateY(-2px);
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.1);
    border-color: #C8A951;
}

.result-content[b-vlubrz968g] {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.result-header[b-vlubrz968g] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 1rem;
}

.result-title[b-vlubrz968g] {
    color: #14213D;
    font-size: 1.25rem;
    font-weight: 600;
    margin: 0;
    line-height: 1.3;
}

.result-meta[b-vlubrz968g] {
    display: flex;
    gap: 0.5rem;
    flex-wrap: wrap;
}

.category-badge[b-vlubrz968g],
.type-badge[b-vlubrz968g],
.subscription-badge[b-vlubrz968g] {
    padding: 0.25rem 0.5rem;
    border-radius: 8px;
    font-size: 0.75rem;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.category-badge[b-vlubrz968g] {
    background: rgba(200, 169, 81, 0.1);
    color: #C8A951;
    border: 1px solid rgba(200, 169, 81, 0.3);
}

.type-badge[b-vlubrz968g] {
    background: rgba(191, 216, 184, 0.1);
    color: #14213D;
    border: 1px solid rgba(191, 216, 184, 0.3);
}

.subscription-badge[b-vlubrz968g] {
    background: rgba(255, 193, 7, 0.1);
    color: #ffc107;
    border: 1px solid rgba(255, 193, 7, 0.3);
}

.result-description[b-vlubrz968g] {
    color: #2E2E2E;
    font-size: 1rem;
    line-height: 1.5;
    margin: 0;
}

.result-details[b-vlubrz968g] {
    display: flex;
    gap: 1rem;
    flex-wrap: wrap;
}

.detail-item[b-vlubrz968g] {
    display: flex;
    align-items: center;
    gap: 0.25rem;
    color: #6c757d;
    font-size: 0.9rem;
}

.detail-item i[b-vlubrz968g] {
    font-size: 0.8rem;
}

.result-actions[b-vlubrz968g] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    min-width: 120px;
}

/* Pagination */
.pagination[b-vlubrz968g] {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 1rem;
    margin-top: 3rem;
    padding: 2rem 0;
}

.page-info[b-vlubrz968g] {
    color: #2E2E2E;
    font-weight: 500;
}

/* No Results */
.no-results[b-vlubrz968g] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 4rem 2rem;
    text-align: center;
    background: white;
    border-radius: 12px;
    border: 2px dashed #E2E6EA;
}

.no-results-icon[b-vlubrz968g] {
    font-size: 4rem;
    color: #BFD8B8;
    margin-bottom: 1.5rem;
}

.no-results h3[b-vlubrz968g] {
    color: #14213D;
    font-size: 1.5rem;
    margin-bottom: 0.5rem;
}

.no-results p[b-vlubrz968g] {
    color: #2E2E2E;
    font-size: 1rem;
    margin-bottom: 2rem;
    max-width: 400px;
}

.search-suggestions[b-vlubrz968g] {
    margin-bottom: 2rem;
    text-align: left;
    max-width: 300px;
}

.search-suggestions h4[b-vlubrz968g] {
    color: #14213D;
    font-size: 1rem;
    margin-bottom: 0.5rem;
}

.search-suggestions ul[b-vlubrz968g] {
    color: #2E2E2E;
    font-size: 0.9rem;
    margin: 0;
    padding-left: 1.5rem;
}

.search-suggestions li[b-vlubrz968g] {
    margin-bottom: 0.25rem;
}

/* Search Welcome */
.search-welcome[b-vlubrz968g] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 4rem 2rem;
    text-align: center;
    background: white;
    border-radius: 12px;
    border: 2px dashed #E2E6EA;
}

.welcome-icon[b-vlubrz968g] {
    font-size: 4rem;
    color: #BFD8B8;
    margin-bottom: 1.5rem;
}

.search-welcome h3[b-vlubrz968g] {
    color: #14213D;
    font-size: 1.5rem;
    margin-bottom: 0.5rem;
}

.search-welcome p[b-vlubrz968g] {
    color: #2E2E2E;
    font-size: 1rem;
    margin-bottom: 2rem;
    max-width: 500px;
}

.quick-searches[b-vlubrz968g] {
    text-align: center;
}

.quick-searches h4[b-vlubrz968g] {
    color: #14213D;
    font-size: 1rem;
    margin-bottom: 1rem;
}

.quick-search-tags[b-vlubrz968g] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    justify-content: center;
}

.quick-search-tag[b-vlubrz968g] {
    padding: 0.5rem 1rem;
    background: rgba(200, 169, 81, 0.1);
    color: #C8A951;
    border: 1px solid rgba(200, 169, 81, 0.3);
    border-radius: 20px;
    font-size: 0.9rem;
    cursor: pointer;
    transition: all 0.3s ease;
}

.quick-search-tag:hover[b-vlubrz968g] {
    background: #C8A951;
    color: white;
    transform: translateY(-1px);
}

/* Responsive Design */
@media (max-width: 768px) {
    .resource-search-page[b-vlubrz968g] {
        padding: 1rem;
    }
    
    .page-header[b-vlubrz968g] {
        flex-direction: column;
        align-items: flex-start;
    }
    
    .page-title[b-vlubrz968g] {
        font-size: 2rem;
    }
    
    .search-row[b-vlubrz968g] {
        flex-direction: column;
        align-items: stretch;
    }
    
    .search-row.primary[b-vlubrz968g] {
        gap: 1rem;
    }
    
    .search-field.main-search[b-vlubrz968g] {
        min-width: auto;
    }
    
    .search-actions[b-vlubrz968g] {
        justify-content: stretch;
    }
    
    .search-row.filters[b-vlubrz968g] {
        gap: 1rem;
    }
    
    .filter-group[b-vlubrz968g] {
        min-width: auto;
        flex: 1;
    }
    
    .results-header[b-vlubrz968g] {
        flex-direction: column;
        align-items: flex-start;
        gap: 1rem;
    }
    
    .results-grid[b-vlubrz968g] {
        grid-template-columns: 1fr;
        gap: 1rem;
    }
    
    .result-item[b-vlubrz968g] {
        flex-direction: column;
        gap: 1rem;
    }
    
    .result-actions[b-vlubrz968g] {
        flex-direction: row;
        justify-content: stretch;
        min-width: auto;
    }
    
    .quick-search-tags[b-vlubrz968g] {
        justify-content: center;
    }
}

@media (max-width: 480px) {
    .resource-search-page[b-vlubrz968g] {
        padding: 0.5rem;
    }
    
    .page-title[b-vlubrz968g] {
        font-size: 1.75rem;
        flex-direction: column;
        align-items: flex-start;
        gap: 0.5rem;
    }
    
    .active-filters[b-vlubrz968g] {
        flex-direction: column;
        align-items: flex-start;
    }
    
    .quick-search-tags[b-vlubrz968g] {
        flex-direction: column;
        align-items: stretch;
    }
    
    .quick-search-tag[b-vlubrz968g] {
        text-align: center;
    }
}
/* /Features/Resources/ResourcesPage.razor.rz.scp.css */
.resources-page[b-nzhljsc7vn] {
    padding: 2rem;
    max-width: 1400px;
    margin: 0 auto;
}

.page-header[b-nzhljsc7vn] {
    margin-bottom: 2.5rem;
}

.page-title[b-nzhljsc7vn] {
    color: #14213D;
    font-size: 2.5rem;
    font-weight: 600;
    margin-bottom: 0.5rem;
}

.page-description[b-nzhljsc7vn] {
    color: #2E2E2E;
    font-size: 1.1rem;
    margin: 0;
}

.resource-content[b-nzhljsc7vn] {
    display: flex;
    flex-direction: column;
    gap: 2rem;
}

.resource-filters[b-nzhljsc7vn] {
    background: white;
    padding: 1.5rem;
    border-radius: 12px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
    border: 1px solid #E2E6EA;
}

.filter-row[b-nzhljsc7vn] {
    display: grid;
    grid-template-columns: 1fr auto auto;
    gap: 1rem;
    align-items: center;
}

.search-container[b-nzhljsc7vn] {
    min-width: 300px;
}

.category-filter[b-nzhljsc7vn] {
    min-width: 200px;
}

.admin-actions[b-nzhljsc7vn] {
    display: flex;
    gap: 0.75rem;
}

.resource-grid-container[b-nzhljsc7vn] {
    min-height: 400px;
}

.loading-state[b-nzhljsc7vn] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 4rem 2rem;
    text-align: center;
}

.spinner[b-nzhljsc7vn] {
    width: 40px;
    height: 40px;
    border: 4px solid #E2E6EA;
    border-top: 4px solid #C8A951;
    border-radius: 50%;
    animation: spin-b-nzhljsc7vn 1s linear infinite;
    margin-bottom: 1rem;
}

@keyframes spin-b-nzhljsc7vn {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

.empty-state[b-nzhljsc7vn] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 4rem 2rem;
    text-align: center;
    background: white;
    border-radius: 12px;
    border: 2px dashed #E2E6EA;
}

.empty-icon[b-nzhljsc7vn] {
    font-size: 4rem;
    color: #BFD8B8;
    margin-bottom: 1.5rem;
}

.empty-state h3[b-nzhljsc7vn] {
    color: #14213D;
    font-size: 1.5rem;
    margin-bottom: 0.5rem;
}

.empty-state p[b-nzhljsc7vn] {
    color: #2E2E2E;
    font-size: 1rem;
    margin-bottom: 2rem;
    max-width: 400px;
}

.eap-section[b-nzhljsc7vn] {
    margin-top: 2rem;
}

[b-nzhljsc7vn] .eap-card {
    border-left: 4px solid #C8A951;
    background: linear-gradient(135deg, #fff 0%, #BFD8B8 100%);
}

.upgrade-prompt[b-nzhljsc7vn] {
    display: flex;
    justify-content: center;
    padding: 4rem 2rem;
}

[b-nzhljsc7vn] .upgrade-card {
    max-width: 500px;
    text-align: center;
    border: 2px solid #C8A951;
    background: linear-gradient(135deg, #fff 0%, #BFD8B8 100%);
}

[b-nzhljsc7vn] .upgrade-card .card-title {
    color: #14213D;
    font-size: 1.5rem;
}

[b-nzhljsc7vn] .upgrade-card .card-body p {
    color: #2E2E2E;
    margin-bottom: 2rem;
    font-size: 1.1rem;
}

/* Responsive Design */
@media (max-width: 768px) {
    .resources-page[b-nzhljsc7vn] {
        padding: 1rem;
    }
    
    .page-title[b-nzhljsc7vn] {
        font-size: 2rem;
    }
    
    .filter-row[b-nzhljsc7vn] {
        grid-template-columns: 1fr;
        gap: 1rem;
    }
    
    .search-container[b-nzhljsc7vn],
    .category-filter[b-nzhljsc7vn] {
        min-width: unset;
    }
    
    .admin-actions[b-nzhljsc7vn] {
        justify-content: stretch;
    }
    
    .admin-actions .iswara-button[b-nzhljsc7vn] {
        flex: 1;
    }
}

@media (max-width: 480px) {
    .resources-page[b-nzhljsc7vn] {
        padding: 0.5rem;
    }
    
    .page-title[b-nzhljsc7vn] {
        font-size: 1.75rem;
    }
    
    .resource-filters[b-nzhljsc7vn] {
        padding: 1rem;
    }
}
/* /Features/RiskDashboard/Components/InteractiveHeatMap.razor.rz.scp.css */
.interactive-heatmap[b-6lo9qnloz5] {
    width: 100%;
    height: 100%;
    min-height: 400px;
}

.heatmap-container[b-6lo9qnloz5] {
    position: relative;
    width: 100%;
    height: 400px;
    overflow: auto;
    border: 1px solid #dee2e6;
    border-radius: 8px;
    background: #f8f9fa;
}

.heatmap-grid[b-6lo9qnloz5] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
    gap: 2px;
    padding: 10px;
    min-height: 100%;
}

.heatmap-cell[b-6lo9qnloz5] {
    position: relative;
    min-height: 80px;
    border-radius: 6px;
    cursor: pointer;
    transition: all 0.3s ease;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
    padding: 8px;
    color: white;
    font-weight: 500;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}

.heatmap-cell:hover[b-6lo9qnloz5] {
    transform: scale(1.05);
    box-shadow: 0 4px 12px rgba(0,0,0,0.2);
    z-index: 10;
}

.cell-label[b-6lo9qnloz5] {
    font-size: 0.75rem;
    margin-bottom: 4px;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
    width: 100%;
}

.cell-score[b-6lo9qnloz5] {
    font-size: 1.25rem;
    font-weight: 600;
    margin-bottom: 2px;
}

.cell-participants[b-6lo9qnloz5] {
    font-size: 0.65rem;
    opacity: 0.9;
}

.risk-very-high[b-6lo9qnloz5] { 
    background: linear-gradient(135deg, #dc3545, #c82333); 
}

.risk-high[b-6lo9qnloz5] { 
    background: linear-gradient(135deg, #fd7e14, #e55a00); 
}

.risk-medium[b-6lo9qnloz5] { 
    background: linear-gradient(135deg, #ffc107, #e0a800); 
    color: #333; 
}

.risk-low[b-6lo9qnloz5] { 
    background: linear-gradient(135deg, #20c997, #1ea97c); 
}

.risk-very-low[b-6lo9qnloz5] { 
    background: linear-gradient(135deg, #28a745, #218838); 
}

.heatmap-legend[b-6lo9qnloz5] {
    margin-top: 16px;
    padding: 16px;
    background: white;
    border-radius: 8px;
    border: 1px solid #dee2e6;
}

.legend-title[b-6lo9qnloz5] {
    font-weight: 600;
    margin-bottom: 12px;
    color: #333;
}

.legend-scale[b-6lo9qnloz5] {
    display: flex;
    gap: 16px;
    flex-wrap: wrap;
}

.scale-item[b-6lo9qnloz5] {
    display: flex;
    align-items: center;
    gap: 6px;
}

.scale-color[b-6lo9qnloz5] {
    width: 16px;
    height: 16px;
    border-radius: 3px;
}

.scale-very-low .scale-color[b-6lo9qnloz5] { background: #28a745; }
.scale-low .scale-color[b-6lo9qnloz5] { background: #20c997; }
.scale-medium .scale-color[b-6lo9qnloz5] { background: #ffc107; }
.scale-high .scale-color[b-6lo9qnloz5] { background: #fd7e14; }
.scale-very-high .scale-color[b-6lo9qnloz5] { background: #dc3545; }

.scale-label[b-6lo9qnloz5] {
    font-size: 0.875rem;
    color: #666;
}

.no-heatmap-data[b-6lo9qnloz5] {
    background: white;
    border: 1px solid #dee2e6;
    border-radius: 8px;
    min-height: 300px;
    display: flex;
    align-items: center;
    justify-content: center;
}
/* /Features/RiskDashboard/Components/RiskMetricsWidget.razor.rz.scp.css */
.risk-metrics-widget[b-1ftdkml99c] {
    height: 100%;
}

.metrics-container[b-1ftdkml99c] {
    padding: 20px;
}

.primary-metric[b-1ftdkml99c] {
    text-align: center;
    margin-bottom: 24px;
}

.metric-circle[b-1ftdkml99c] {
    width: 120px;
    height: 120px;
    border-radius: 50%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    margin: 0 auto 12px;
    color: white;
    font-weight: 600;
    box-shadow: 0 4px 12px rgba(0,0,0,0.2);
}

.metric-circle.risk-very-high[b-1ftdkml99c] { 
    background: linear-gradient(135deg, #dc3545, #c82333); 
}

.metric-circle.risk-high[b-1ftdkml99c] { 
    background: linear-gradient(135deg, #fd7e14, #e55a00); 
}

.metric-circle.risk-medium[b-1ftdkml99c] { 
    background: linear-gradient(135deg, #ffc107, #e0a800); 
    color: #333; 
}

.metric-circle.risk-low[b-1ftdkml99c] { 
    background: linear-gradient(135deg, #20c997, #1ea97c); 
}

.metric-circle.risk-very-low[b-1ftdkml99c] { 
    background: linear-gradient(135deg, #28a745, #218838); 
}

.metric-circle .metric-value[b-1ftdkml99c] {
    font-size: 2rem;
    line-height: 1;
}

.metric-circle .metric-label[b-1ftdkml99c] {
    font-size: 0.75rem;
    margin-top: 4px;
    opacity: 0.9;
}

.metric-description[b-1ftdkml99c] {
    text-align: center;
}

.risk-level[b-1ftdkml99c] {
    font-size: 1.1rem;
    font-weight: 600;
    color: #333;
}

.distribution-metrics[b-1ftdkml99c] {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 8px;
    margin-bottom: 20px;
}

.metric-item[b-1ftdkml99c] {
    text-align: center;
    padding: 12px 4px;
    border-radius: 6px;
    background: #f8f9fa;
    border: 2px solid transparent;
    transition: all 0.3s ease;
}

.metric-item:hover[b-1ftdkml99c] {
    transform: translateY(-2px);
    box-shadow: 0 4px 8px rgba(0,0,0,0.1);
}

.metric-item.very-high[b-1ftdkml99c] { border-color: #dc3545; }
.metric-item.high[b-1ftdkml99c] { border-color: #fd7e14; }
.metric-item.medium[b-1ftdkml99c] { border-color: #ffc107; }
.metric-item.low[b-1ftdkml99c] { border-color: #20c997; }
.metric-item.very-low[b-1ftdkml99c] { border-color: #28a745; }

.metric-count[b-1ftdkml99c] {
    font-size: 1.5rem;
    font-weight: 600;
    color: #333;
    margin-bottom: 4px;
}

.metric-name[b-1ftdkml99c] {
    font-size: 0.75rem;
    color: #666;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.additional-metrics[b-1ftdkml99c] {
    border-top: 1px solid #eee;
    padding-top: 16px;
}

.metric-row[b-1ftdkml99c] {
    display: flex;
    justify-content: space-between;
    margin-bottom: 8px;
}

.metric-row .metric-label[b-1ftdkml99c] {
    color: #666;
    font-size: 0.9rem;
}

.metric-row .metric-value[b-1ftdkml99c] {
    font-weight: 600;
    color: #333;
}

.metric-row .metric-value.improvement[b-1ftdkml99c] {
    color: #28a745;
}

.trend-indicators[b-1ftdkml99c] {
    padding: 16px;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.trend-item[b-1ftdkml99c] {
    display: grid;
    grid-template-columns: 1fr auto auto;
    gap: 12px;
    align-items: center;
    padding: 8px;
    background: #f8f9fa;
    border-radius: 4px;
}

.trend-date[b-1ftdkml99c] {
    font-size: 0.85rem;
    color: #666;
}

.trend-score[b-1ftdkml99c] {
    font-weight: 600;
    padding: 4px 8px;
    border-radius: 4px;
    font-size: 0.85rem;
    text-align: center;
    min-width: 40px;
}

.trend-score.risk-very-high[b-1ftdkml99c] { background: #dc3545; color: white; }
.trend-score.risk-high[b-1ftdkml99c] { background: #fd7e14; color: white; }
.trend-score.risk-medium[b-1ftdkml99c] { background: #ffc107; color: #333; }
.trend-score.risk-low[b-1ftdkml99c] { background: #20c997; color: white; }
.trend-score.risk-very-low[b-1ftdkml99c] { background: #28a745; color: white; }

.trend-change[b-1ftdkml99c] {
    font-size: 0.8rem;
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 4px;
}

.trend-change.positive[b-1ftdkml99c] { color: #dc3545; }
.trend-change.negative[b-1ftdkml99c] { color: #28a745; }
.trend-change.neutral[b-1ftdkml99c] { color: #6c757d; }
/* /Features/RiskDashboard/DrillThroughPage.razor.rz.scp.css */
.drill-through-page[b-cvy6g7ljrs] {
    padding: 20px;
    background-color: #f8f9fa;
    min-height: calc(100vh - 60px);
}

.page-header[b-cvy6g7ljrs] {
    background: white;
    border-radius: 8px;
    padding: 24px;
    margin-bottom: 24px;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}

.page-header h2[b-cvy6g7ljrs] {
    margin: 0;
    color: #333;
    font-weight: 600;
}

.breadcrumb-container[b-cvy6g7ljrs] {
    margin-top: 12px;
}

.breadcrumb[b-cvy6g7ljrs] {
    background: #f8f9fa;
    border-radius: 6px;
    padding: 8px 16px;
}

.breadcrumb-item a[b-cvy6g7ljrs] {
    color: #007bff;
    text-decoration: none;
}

.breadcrumb-item a:hover[b-cvy6g7ljrs] {
    text-decoration: underline;
}

.loading-container[b-cvy6g7ljrs] {
    background: white;
    border-radius: 8px;
    margin: 20px 0;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}

.context-header[b-cvy6g7ljrs] {
    background: white;
    border-radius: 8px;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}

.context-info[b-cvy6g7ljrs] {
    padding: 16px;
}

.context-description[b-cvy6g7ljrs] {
    margin-bottom: 16px;
    color: #666;
    font-size: 1rem;
}

.context-meta[b-cvy6g7ljrs] {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}

.drill-through-content[b-cvy6g7ljrs] {
    margin-bottom: 24px;
}

.subdomain-analysis[b-cvy6g7ljrs],
.question-analysis[b-cvy6g7ljrs],
.generic-analysis[b-cvy6g7ljrs] {
    padding: 20px;
}

.current-data-display[b-cvy6g7ljrs] {
    background: #f8f9fa;
    border-radius: 6px;
    padding: 16px;
    margin-top: 16px;
    border: 1px solid #dee2e6;
}

.current-data-display pre[b-cvy6g7ljrs] {
    margin: 0;
    font-size: 0.875rem;
    color: #495057;
    white-space: pre-wrap;
    word-wrap: break-word;
    max-height: 300px;
    overflow-y: auto;
}

.drill-down-options[b-cvy6g7ljrs] {
    padding: 16px;
}

.drill-option[b-cvy6g7ljrs] {
    margin-bottom: 8px;
}

.related-options[b-cvy6g7ljrs] {
    padding: 16px;
}

.quick-stats[b-cvy6g7ljrs] {
    padding: 16px;
}

.stat-item[b-cvy6g7ljrs] {
    text-align: center;
    margin-bottom: 16px;
    padding: 12px;
    background: #f8f9fa;
    border-radius: 6px;
}

.stat-value[b-cvy6g7ljrs] {
    font-size: 1.5rem;
    font-weight: 600;
    color: #333;
    margin-bottom: 4px;
}

.stat-label[b-cvy6g7ljrs] {
    font-size: 0.75rem;
    color: #666;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.drill-navigation[b-cvy6g7ljrs] {
    background: white;
    border-radius: 8px;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}

.no-data-container[b-cvy6g7ljrs] {
    background: white;
    border-radius: 8px;
    margin: 20px 0;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}

.no-data-container i[b-cvy6g7ljrs] {
    opacity: 0.5;
}

.no-data-container h5[b-cvy6g7ljrs] {
    color: #666;
    margin-bottom: 12px;
}

.no-data-container p[b-cvy6g7ljrs] {
    color: #999;
    margin-bottom: 24px;
}

/* Button Styles */
.drill-option .btn[b-cvy6g7ljrs],
.related-options .btn[b-cvy6g7ljrs] {
    border-radius: 6px;
    font-size: 0.875rem;
    padding: 8px 16px;
}

.drill-option .btn:hover[b-cvy6g7ljrs],
.related-options .btn:hover[b-cvy6g7ljrs] {
    transform: translateY(-1px);
    transition: transform 0.2s ease-in-out;
    box-shadow: 0 4px 8px rgba(0,0,0,0.15);
}

/* Animation Effects */
.context-header[b-cvy6g7ljrs],
.drill-through-content[b-cvy6g7ljrs] {
    animation: fadeIn-b-cvy6g7ljrs 0.3s ease-in-out;
}

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

/* Card Hover Effects */
.drill-through-content .card:hover[b-cvy6g7ljrs] {
    box-shadow: 0 4px 12px rgba(0,0,0,0.15);
    transition: box-shadow 0.3s ease-in-out;
}

/* Badge Styling */
.context-meta .badge[b-cvy6g7ljrs] {
    font-size: 0.75rem;
    padding: 6px 12px;
}

/* Responsive Design */
@media (max-width: 768px) {
    .drill-through-page[b-cvy6g7ljrs] {
        padding: 12px;
    }
    
    .page-header[b-cvy6g7ljrs] {
        padding: 16px;
    }
    
    .page-header .d-flex[b-cvy6g7ljrs] {
        flex-direction: column;
        gap: 16px;
    }
    
    .context-meta[b-cvy6g7ljrs] {
        flex-direction: column;
        gap: 4px;
    }
    
    .current-data-display pre[b-cvy6g7ljrs] {
        font-size: 0.75rem;
        max-height: 200px;
    }
    
    .stat-value[b-cvy6g7ljrs] {
        font-size: 1.25rem;
    }
    
    .breadcrumb[b-cvy6g7ljrs] {
        padding: 6px 12px;
        font-size: 0.875rem;
    }
}

@media (max-width: 480px) {
    .stat-item[b-cvy6g7ljrs] {
        padding: 8px;
    }
    
    .context-description[b-cvy6g7ljrs] {
        font-size: 0.875rem;
    }
    
    .current-data-display pre[b-cvy6g7ljrs] {
        font-size: 0.7rem;
    }
}

/* Scroll styling for data display */
.current-data-display pre[b-cvy6g7ljrs]::-webkit-scrollbar {
    width: 8px;
}

.current-data-display pre[b-cvy6g7ljrs]::-webkit-scrollbar-track {
    background: #f1f1f1;
    border-radius: 4px;
}

.current-data-display pre[b-cvy6g7ljrs]::-webkit-scrollbar-thumb {
    background: #c1c1c1;
    border-radius: 4px;
}

.current-data-display pre[b-cvy6g7ljrs]::-webkit-scrollbar-thumb:hover {
    background: #a8a8a8;
}
/* /Features/RiskDashboard/RiskDashboardPage.razor.rz.scp.css */
.risk-dashboard-page[b-6ny8l3rcaf] {
    padding: 20px;
    background-color: #f8f9fa;
    min-height: calc(100vh - 60px);
}

.page-header[b-6ny8l3rcaf] {
    background: white;
    border-radius: 8px;
    padding: 24px;
    margin-bottom: 24px;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}

.page-header h2[b-6ny8l3rcaf] {
    margin: 0;
    color: #333;
    font-weight: 600;
}

.loading-container[b-6ny8l3rcaf] {
    background: white;
    border-radius: 8px;
    margin: 20px 0;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}

.risk-summary-section[b-6ny8l3rcaf] {
    background: white;
    border-radius: 8px;
    padding: 24px;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}

.dashboard-content[b-6ny8l3rcaf] {
    padding: 20px 0;
}

.heat-map-container[b-6ny8l3rcaf] {
    min-height: 400px;
    padding: 20px;
    background: #f8f9fa;
    border-radius: 8px;
    margin: 16px 0;
}

.no-data-container[b-6ny8l3rcaf] {
    background: white;
    border-radius: 8px;
    margin: 20px 0;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}

.no-data-container i[b-6ny8l3rcaf] {
    opacity: 0.5;
}

.no-data-container h5[b-6ny8l3rcaf] {
    color: #666;
    margin-bottom: 12px;
}

.no-data-container p[b-6ny8l3rcaf] {
    color: #999;
    margin-bottom: 24px;
}

/* Responsive Design */
@media (max-width: 768px) {
    .risk-dashboard-page[b-6ny8l3rcaf] {
        padding: 12px;
    }
    
    .page-header[b-6ny8l3rcaf] {
        padding: 16px;
    }
    
    .page-header .d-flex[b-6ny8l3rcaf] {
        flex-direction: column;
        gap: 16px;
    }
    
    .heat-map-container[b-6ny8l3rcaf] {
        min-height: 300px;
        padding: 12px;
    }
}

/* Heat Map Styling */
.heat-map-container[b-6ny8l3rcaf] {
    position: relative;
    overflow: hidden;
}

.heat-map-container[b-6ny8l3rcaf]::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: linear-gradient(45deg, #f8f9fa 25%, transparent 25%), 
                linear-gradient(-45deg, #f8f9fa 25%, transparent 25%), 
                linear-gradient(45deg, transparent 75%, #f8f9fa 75%), 
                linear-gradient(-45deg, transparent 75%, #f8f9fa 75%);
    background-size: 20px 20px;
    background-position: 0 0, 0 10px, 10px -10px, -10px 0px;
    opacity: 0.1;
    pointer-events: none;
}

/* Risk Level Colors */
.risk-very-high[b-6ny8l3rcaf] { background-color: #dc3545; color: white; }
.risk-high[b-6ny8l3rcaf] { background-color: #fd7e14; color: white; }
.risk-medium[b-6ny8l3rcaf] { background-color: #ffc107; color: #212529; }
.risk-low[b-6ny8l3rcaf] { background-color: #20c997; color: white; }
.risk-very-low[b-6ny8l3rcaf] { background-color: #28a745; color: white; }
/* /Features/RiskDashboard/RiskHeatMapPage.razor.rz.scp.css */
.risk-heatmap-page[b-l7oswbd9r3] {
    padding: 20px;
    background-color: #f8f9fa;
    min-height: calc(100vh - 60px);
}

.page-header[b-l7oswbd9r3] {
    background: white;
    border-radius: 8px;
    padding: 24px;
    margin-bottom: 24px;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}

.page-header h2[b-l7oswbd9r3] {
    margin: 0;
    color: #333;
    font-weight: 600;
}

.heat-map-controls[b-l7oswbd9r3] {
    background: white;
    border-radius: 8px;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}

.loading-container[b-l7oswbd9r3] {
    background: white;
    border-radius: 8px;
    margin: 20px 0;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}

.interactive-heatmap-container[b-l7oswbd9r3] {
    background: white;
    border-radius: 8px;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}

.heatmap-wrapper[b-l7oswbd9r3] {
    min-height: 500px;
    padding: 20px;
    background: #f8f9fa;
    border-radius: 8px;
    margin: 16px 0;
    position: relative;
    overflow: hidden;
}

.heat-map-legend[b-l7oswbd9r3] {
    background: white;
    border-radius: 8px;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}

.legend-container[b-l7oswbd9r3] {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    padding: 20px;
}

.legend-item[b-l7oswbd9r3] {
    display: flex;
    align-items: center;
    gap: 8px;
}

.legend-color[b-l7oswbd9r3] {
    width: 20px;
    height: 20px;
    border-radius: 4px;
    display: inline-block;
}

.legend-label[b-l7oswbd9r3] {
    font-size: 14px;
    color: #666;
}

.heat-map-stats[b-l7oswbd9r3] {
    background: white;
    border-radius: 8px;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}

.stats-grid[b-l7oswbd9r3] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
    gap: 20px;
    padding: 20px;
}

.stat-item[b-l7oswbd9r3] {
    text-align: center;
    padding: 16px;
    background: #f8f9fa;
    border-radius: 8px;
}

.stat-value[b-l7oswbd9r3] {
    font-size: 2rem;
    font-weight: 600;
    color: #333;
    margin-bottom: 4px;
}

.stat-label[b-l7oswbd9r3] {
    font-size: 0.875rem;
    color: #666;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.selected-area-details[b-l7oswbd9r3] {
    padding: 16px;
}

.selected-area-details h6[b-l7oswbd9r3] {
    margin-bottom: 16px;
    color: #333;
    font-weight: 600;
}

.detail-item[b-l7oswbd9r3] {
    display: flex;
    justify-content: space-between;
    margin-bottom: 12px;
    padding-bottom: 8px;
    border-bottom: 1px solid #eee;
}

.detail-label[b-l7oswbd9r3] {
    font-weight: 500;
    color: #666;
}

.detail-value[b-l7oswbd9r3] {
    font-weight: 600;
    color: #333;
}

.no-data-container[b-l7oswbd9r3] {
    background: white;
    border-radius: 8px;
    margin: 20px 0;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}

.no-data-container i[b-l7oswbd9r3] {
    opacity: 0.5;
}

.no-data-container h5[b-l7oswbd9r3] {
    color: #666;
    margin-bottom: 12px;
}

.no-data-container p[b-l7oswbd9r3] {
    color: #999;
    margin-bottom: 24px;
}

/* Risk Level Colors */
.risk-very-high[b-l7oswbd9r3] { background-color: #dc3545 !important; color: white !important; }
.risk-high[b-l7oswbd9r3] { background-color: #fd7e14 !important; color: white !important; }
.risk-medium[b-l7oswbd9r3] { background-color: #ffc107 !important; color: #212529 !important; }
.risk-low[b-l7oswbd9r3] { background-color: #20c997 !important; color: white !important; }
.risk-very-low[b-l7oswbd9r3] { background-color: #28a745 !important; color: white !important; }

/* Heat Map Animation */
.heatmap-wrapper[b-l7oswbd9r3] {
    animation: fadeIn-b-l7oswbd9r3 0.3s ease-in-out;
}

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

/* Responsive Design */
@media (max-width: 768px) {
    .risk-heatmap-page[b-l7oswbd9r3] {
        padding: 12px;
    }
    
    .page-header[b-l7oswbd9r3] {
        padding: 16px;
    }
    
    .page-header .d-flex[b-l7oswbd9r3] {
        flex-direction: column;
        gap: 16px;
    }
    
    .legend-container[b-l7oswbd9r3] {
        flex-direction: column;
        gap: 12px;
    }
    
    .stats-grid[b-l7oswbd9r3] {
        grid-template-columns: repeat(2, 1fr);
        gap: 12px;
    }
    
    .heatmap-wrapper[b-l7oswbd9r3] {
        min-height: 300px;
        padding: 12px;
    }
}

@media (max-width: 480px) {
    .stats-grid[b-l7oswbd9r3] {
        grid-template-columns: 1fr;
    }
}
/* /Features/RiskDashboard/RiskTrendsPage.razor.rz.scp.css */
.risk-trends-page[b-c1cab94jmq] {
    padding: 20px;
    background-color: #f8f9fa;
    min-height: calc(100vh - 60px);
}

.page-header[b-c1cab94jmq] {
    background: white;
    border-radius: 8px;
    padding: 24px;
    margin-bottom: 24px;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}

.page-header h2[b-c1cab94jmq] {
    margin: 0;
    color: #333;
    font-weight: 600;
}

.trend-controls[b-c1cab94jmq] {
    background: white;
    border-radius: 8px;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}

.loading-container[b-c1cab94jmq] {
    background: white;
    border-radius: 8px;
    margin: 20px 0;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}

.main-trend-chart[b-c1cab94jmq] {
    background: white;
    border-radius: 8px;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}

.trend-chart-container[b-c1cab94jmq] {
    min-height: 400px;
    padding: 20px;
    background: #f8f9fa;
    border-radius: 8px;
    margin: 16px 0;
}

.trend-statistics[b-c1cab94jmq] {
    margin-bottom: 24px;
}

.trend-stats[b-c1cab94jmq] {
    padding: 20px;
}

.stat-item[b-c1cab94jmq] {
    text-align: center;
    margin-bottom: 20px;
}

.stat-value[b-c1cab94jmq] {
    font-size: 2rem;
    font-weight: 600;
    color: #333;
    margin-bottom: 4px;
}

.stat-label[b-c1cab94jmq] {
    font-size: 0.875rem;
    color: #666;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.detailed-analysis[b-c1cab94jmq] {
    background: white;
    border-radius: 8px;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}

.trend-breakdown-container[b-c1cab94jmq] {
    min-height: 300px;
    padding: 20px;
    background: #f8f9fa;
    border-radius: 8px;
    margin: 16px 0;
}

.period-details[b-c1cab94jmq] {
    padding: 16px;
}

.period-details h6[b-c1cab94jmq] {
    margin-bottom: 16px;
    color: #333;
    font-weight: 600;
}

.detail-item[b-c1cab94jmq] {
    display: flex;
    justify-content: space-between;
    margin-bottom: 12px;
    padding-bottom: 8px;
    border-bottom: 1px solid #eee;
}

.detail-label[b-c1cab94jmq] {
    font-weight: 500;
    color: #666;
}

.detail-value[b-c1cab94jmq] {
    font-weight: 600;
    color: #333;
}

.trend-insights[b-c1cab94jmq] {
    padding: 16px;
}

.trend-insights h6[b-c1cab94jmq] {
    margin-bottom: 16px;
    color: #333;
    font-weight: 600;
}

.insights-list[b-c1cab94jmq] {
    list-style: none;
    padding: 0;
    margin: 0;
}

.insights-list li[b-c1cab94jmq] {
    padding: 8px 0;
    border-bottom: 1px solid #eee;
    font-size: 0.9rem;
    color: #666;
}

.insights-list li[b-c1cab94jmq]:before {
    content: "💡";
    margin-right: 8px;
}

.insights-list li:last-child[b-c1cab94jmq] {
    border-bottom: none;
}

.no-data-container[b-c1cab94jmq] {
    background: white;
    border-radius: 8px;
    margin: 20px 0;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}

.no-data-container i[b-c1cab94jmq] {
    opacity: 0.5;
}

.no-data-container h5[b-c1cab94jmq] {
    color: #666;
    margin-bottom: 12px;
}

.no-data-container p[b-c1cab94jmq] {
    color: #999;
    margin-bottom: 24px;
}

/* Trend Direction Colors */
.trend-increasing[b-c1cab94jmq] {
    color: #dc3545 !important;
}

.trend-decreasing[b-c1cab94jmq] {
    color: #28a745 !important;
}

.trend-stable[b-c1cab94jmq] {
    color: #6c757d !important;
}

.trend-unknown[b-c1cab94jmq] {
    color: #ffc107 !important;
}

/* Risk Level Colors */
.risk-very-high[b-c1cab94jmq] { background-color: #dc3545 !important; color: white !important; }
.risk-high[b-c1cab94jmq] { background-color: #fd7e14 !important; color: white !important; }
.risk-medium[b-c1cab94jmq] { background-color: #ffc107 !important; color: #212529 !important; }
.risk-low[b-c1cab94jmq] { background-color: #20c997 !important; color: white !important; }
.risk-very-low[b-c1cab94jmq] { background-color: #28a745 !important; color: white !important; }

/* Chart Animation */
.trend-chart-container[b-c1cab94jmq] {
    animation: fadeIn-b-c1cab94jmq 0.3s ease-in-out;
}

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

/* Hover Effects */
.stat-item:hover[b-c1cab94jmq] {
    transform: translateY(-2px);
    transition: transform 0.2s ease-in-out;
}

/* Responsive Design */
@media (max-width: 768px) {
    .risk-trends-page[b-c1cab94jmq] {
        padding: 12px;
    }
    
    .page-header[b-c1cab94jmq] {
        padding: 16px;
    }
    
    .page-header .d-flex[b-c1cab94jmq] {
        flex-direction: column;
        gap: 16px;
    }
    
    .trend-chart-container[b-c1cab94jmq] {
        min-height: 250px;
        padding: 12px;
    }
    
    .trend-breakdown-container[b-c1cab94jmq] {
        min-height: 200px;
        padding: 12px;
    }
    
    .stat-value[b-c1cab94jmq] {
        font-size: 1.5rem;
    }
}

@media (max-width: 480px) {
    .detail-item[b-c1cab94jmq] {
        flex-direction: column;
        gap: 4px;
    }
    
    .detail-label[b-c1cab94jmq] {
        font-size: 0.8rem;
    }
    
    .insights-list li[b-c1cab94jmq] {
        font-size: 0.8rem;
    }
}
/* /Features/Scoring/ScoreCalculationPage.razor.rz.scp.css */
.score-calculation-page[b-0wtmrrjz1h] {
    padding: 2rem;
    background: linear-gradient(135deg, #BFD8B8 0%, #E2E6EA 100%);
    min-height: 100vh;
}

.page-header[b-0wtmrrjz1h] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 2rem;
    background: white;
    padding: 2rem;
    border-radius: 12px;
    box-shadow: 0 4px 6px rgba(20, 33, 61, 0.1);
}

.header-content h1[b-0wtmrrjz1h] {
    color: #14213D;
    font-size: 2rem;
    font-weight: 600;
    margin-bottom: 0.5rem;
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.header-content p[b-0wtmrrjz1h] {
    color: #2E2E2E;
    font-size: 1.1rem;
    margin: 0;
}

.content-container[b-0wtmrrjz1h] {
    background: white;
    border-radius: 12px;
    box-shadow: 0 4px 6px rgba(20, 33, 61, 0.1);
    padding: 2rem;
}

.calculation-panel[b-0wtmrrjz1h] {
    background: #f8f9fa;
    border-radius: 8px;
    padding: 2rem;
    margin-bottom: 2rem;
    border: 1px solid #E2E6EA;
}

.calculation-controls[b-0wtmrrjz1h] {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
    margin-bottom: 2rem;
}

.calculation-progress[b-0wtmrrjz1h] {
    margin: 2rem 0;
}

.progress-details[b-0wtmrrjz1h] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1rem;
}

.calculation-log[b-0wtmrrjz1h] {
    background: #2E2E2E;
    color: #ffffff;
    border-radius: 8px;
    padding: 1rem;
    max-height: 400px;
    overflow-y: auto;
    font-family: 'Courier New', monospace;
    font-size: 0.875rem;
    line-height: 1.4;
}

.log-entry[b-0wtmrrjz1h] {
    margin-bottom: 0.5rem;
    padding: 0.25rem 0;
}

.log-timestamp[b-0wtmrrjz1h] {
    color: #C8A951;
    margin-right: 0.5rem;
}

.log-level-info[b-0wtmrrjz1h] {
    color: #17a2b8;
}

.log-level-success[b-0wtmrrjz1h] {
    color: #28a745;
}

.log-level-warning[b-0wtmrrjz1h] {
    color: #ffc107;
}

.log-level-error[b-0wtmrrjz1h] {
    color: #dc3545;
}

.calculation-results[b-0wtmrrjz1h] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 1.5rem;
    margin-top: 2rem;
}

.result-card[b-0wtmrrjz1h] {
    background: white;
    border: 1px solid #E2E6EA;
    border-radius: 8px;
    padding: 1.5rem;
    text-align: center;
}

.result-title[b-0wtmrrjz1h] {
    color: #14213D;
    font-weight: 600;
    margin-bottom: 1rem;
}

.result-value[b-0wtmrrjz1h] {
    font-size: 2.5rem;
    font-weight: bold;
    color: #C8A951;
    margin-bottom: 0.5rem;
}

.result-description[b-0wtmrrjz1h] {
    color: #2E2E2E;
    font-size: 0.9rem;
}

.calculation-status[b-0wtmrrjz1h] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 1rem;
}

.status-badge[b-0wtmrrjz1h] {
    padding: 0.25rem 0.75rem;
    border-radius: 12px;
    font-size: 0.875rem;
    font-weight: 500;
}

.status-running[b-0wtmrrjz1h] {
    background-color: #e3f2fd;
    color: #1976d2;
}

.status-completed[b-0wtmrrjz1h] {
    background-color: #e8f5e8;
    color: #2e7d32;
}

.status-failed[b-0wtmrrjz1h] {
    background-color: #ffebee;
    color: #c62828;
}

.status-idle[b-0wtmrrjz1h] {
    background-color: #f5f5f5;
    color: #757575;
}

.loading-overlay[b-0wtmrrjz1h] {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(255, 255, 255, 0.8);
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 1000;
}

.spinner-border[b-0wtmrrjz1h] {
    color: #C8A951;
}
/* /Features/Scoring/ScoringPage.razor.rz.scp.css */
.scoring-page[b-tj0kylhui1] {
    padding: 2rem;
    background: linear-gradient(135deg, #BFD8B8 0%, #E2E6EA 100%);
    min-height: 100vh;
}

.page-header[b-tj0kylhui1] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 2rem;
    background: white;
    padding: 2rem;
    border-radius: 12px;
    box-shadow: 0 4px 6px rgba(20, 33, 61, 0.1);
}

.header-content h1[b-tj0kylhui1] {
    color: #14213D;
    font-size: 2rem;
    font-weight: 600;
    margin-bottom: 0.5rem;
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.header-content p[b-tj0kylhui1] {
    color: #2E2E2E;
    font-size: 1.1rem;
    margin: 0;
}

.content-container[b-tj0kylhui1] {
    background: white;
    border-radius: 12px;
    box-shadow: 0 4px 6px rgba(20, 33, 61, 0.1);
    padding: 2rem;
}

.scoring-grid[b-tj0kylhui1] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 2rem;
    margin-bottom: 2rem;
}

.score-card[b-tj0kylhui1] {
    border: 1px solid #E2E6EA;
    border-radius: 8px;
    padding: 1.5rem;
    transition: all 0.3s ease;
}

.score-card:hover[b-tj0kylhui1] {
    transform: translateY(-2px);
    box-shadow: 0 8px 16px rgba(20, 33, 61, 0.15);
}

.score-title[b-tj0kylhui1] {
    color: #14213D;
    font-weight: 600;
    margin-bottom: 1rem;
}

.score-value[b-tj0kylhui1] {
    font-size: 2rem;
    font-weight: bold;
    color: #C8A951;
    margin-bottom: 0.5rem;
}

.score-description[b-tj0kylhui1] {
    color: #2E2E2E;
    font-size: 0.9rem;
}

.admin-controls[b-tj0kylhui1] {
    background: #f8f9fa;
    border-radius: 8px;
    padding: 1.5rem;
    margin-bottom: 2rem;
    border: 1px solid #E2E6EA;
}

.admin-controls h5[b-tj0kylhui1] {
    color: #14213D;
    margin-bottom: 1rem;
}

.calculation-status[b-tj0kylhui1] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 1rem;
}

.status-indicator[b-tj0kylhui1] {
    width: 12px;
    height: 12px;
    border-radius: 50%;
    animation: pulse-b-tj0kylhui1 2s infinite;
}

.status-active[b-tj0kylhui1] {
    background-color: #28a745;
}

.status-idle[b-tj0kylhui1] {
    background-color: #6c757d;
}

.status-error[b-tj0kylhui1] {
    background-color: #dc3545;
}

@keyframes pulse-b-tj0kylhui1 {
    0% { opacity: 1; }
    50% { opacity: 0.5; }
    100% { opacity: 1; }
}

.loading-overlay[b-tj0kylhui1] {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(255, 255, 255, 0.8);
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 1000;
}

.spinner-border[b-tj0kylhui1] {
    color: #C8A951;
}
/* /Features/Subscription/Components/FeatureAccessChecker.razor.rz.scp.css */
.feature-access-checker[b-k0m2v7cikp] {
    margin-bottom: 2rem;
}

[b-k0m2v7cikp] .checker-card {
    border: 2px solid #E2E6EA;
    background: white;
}

.checker-content[b-k0m2v7cikp] {
    display: flex;
    flex-direction: column;
    gap: 2rem;
}

.checker-controls[b-k0m2v7cikp] {
    display: grid;
    grid-template-columns: 2fr 1fr;
    gap: 1.5rem;
    align-items: end;
}

.search-section[b-k0m2v7cikp],
.filter-section[b-k0m2v7cikp] {
    display: flex;
    flex-direction: column;
}

.features-list[b-k0m2v7cikp] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    max-height: 500px;
    overflow-y: auto;
    padding-right: 0.5rem;
}

.features-list[b-k0m2v7cikp]::-webkit-scrollbar {
    width: 6px;
}

.features-list[b-k0m2v7cikp]::-webkit-scrollbar-track {
    background: #E2E6EA;
    border-radius: 3px;
}

.features-list[b-k0m2v7cikp]::-webkit-scrollbar-thumb {
    background: #C8A951;
    border-radius: 3px;
}

.feature-check-item[b-k0m2v7cikp] {
    display: flex;
    align-items: center;
    gap: 1.5rem;
    padding: 1.5rem;
    border-radius: 12px;
    border: 2px solid #E2E6EA;
    background: white;
    transition: all 0.3s ease;
}

.feature-check-item:hover[b-k0m2v7cikp] {
    transform: translateY(-1px);
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.1);
}

.feature-check-item.accessible[b-k0m2v7cikp] {
    border-color: rgba(25, 135, 84, 0.3);
    background: rgba(25, 135, 84, 0.02);
}

.feature-check-item.locked[b-k0m2v7cikp] {
    border-color: rgba(108, 117, 125, 0.3);
    background: rgba(108, 117, 125, 0.02);
}

.feature-info[b-k0m2v7cikp] {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.feature-header[b-k0m2v7cikp] {
    display: flex;
    align-items: center;
    gap: 1rem;
    flex-wrap: wrap;
}

.feature-status-icon[b-k0m2v7cikp] {
    flex-shrink: 0;
}

.status-available[b-k0m2v7cikp] {
    color: #198754;
    font-size: 1.5rem;
}

.status-locked[b-k0m2v7cikp] {
    color: #6c757d;
    font-size: 1.5rem;
}

.feature-name[b-k0m2v7cikp] {
    color: #14213D;
    font-size: 1.1rem;
    font-weight: 600;
    margin: 0;
    flex: 1;
}

.feature-access-badge[b-k0m2v7cikp] {
    padding: 0.25rem 0.75rem;
    border-radius: 12px;
    font-size: 0.8rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.badge-success[b-k0m2v7cikp] {
    background: rgba(25, 135, 84, 0.1);
    color: #198754;
    border: 1px solid rgba(25, 135, 84, 0.3);
}

.badge-warning[b-k0m2v7cikp] {
    background: rgba(255, 193, 7, 0.1);
    color: #ffc107;
    border: 1px solid rgba(255, 193, 7, 0.3);
}

.feature-description[b-k0m2v7cikp] {
    color: #2E2E2E;
    font-size: 0.95rem;
    line-height: 1.4;
    margin: 0;
}

.required-tier-info[b-k0m2v7cikp] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.required-tier-label[b-k0m2v7cikp] {
    color: #6c757d;
    font-size: 0.9rem;
    font-weight: 500;
}

.required-tier-value[b-k0m2v7cikp] {
    color: #C8A951;
    font-size: 0.9rem;
    font-weight: 600;
    padding: 0.25rem 0.5rem;
    background: rgba(200, 169, 81, 0.1);
    border-radius: 6px;
}

.feature-actions[b-k0m2v7cikp] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    flex-shrink: 0;
}

/* Check Result */
.check-result[b-k0m2v7cikp] {
    padding: 2rem;
    border-radius: 12px;
    border: 2px solid;
    margin-top: 1rem;
    animation: slideIn-b-k0m2v7cikp 0.3s ease-out;
}

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

.check-result.result-success[b-k0m2v7cikp] {
    border-color: rgba(25, 135, 84, 0.3);
    background: rgba(25, 135, 84, 0.05);
}

.check-result.result-error[b-k0m2v7cikp] {
    border-color: rgba(220, 53, 69, 0.3);
    background: rgba(220, 53, 69, 0.05);
}

.result-header[b-k0m2v7cikp] {
    display: flex;
    align-items: center;
    gap: 1rem;
    margin-bottom: 1rem;
}

.result-icon[b-k0m2v7cikp] {
    flex-shrink: 0;
}

.result-success[b-k0m2v7cikp] {
    color: #198754;
    font-size: 1.5rem;
}

.result-error[b-k0m2v7cikp] {
    color: #dc3545;
    font-size: 1.5rem;
}

.result-header h4[b-k0m2v7cikp] {
    color: #14213D;
    font-size: 1.2rem;
    font-weight: 600;
    margin: 0;
}

.result-content[b-k0m2v7cikp] {
    margin-bottom: 1.5rem;
}

.result-message[b-k0m2v7cikp] {
    color: #2E2E2E;
    font-size: 1rem;
    line-height: 1.5;
    margin-bottom: 1rem;
}

.upgrade-suggestion[b-k0m2v7cikp] {
    background: rgba(200, 169, 81, 0.1);
    border: 1px solid rgba(200, 169, 81, 0.3);
    border-radius: 8px;
    padding: 1rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
}

.upgrade-suggestion p[b-k0m2v7cikp] {
    color: #14213D;
    font-weight: 500;
    margin: 0;
    flex: 1;
}

.result-actions[b-k0m2v7cikp] {
    display: flex;
    justify-content: flex-end;
}

/* Empty States */
.no-results[b-k0m2v7cikp],
.empty-state[b-k0m2v7cikp] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 3rem 2rem;
    text-align: center;
    background: rgba(108, 117, 125, 0.05);
    border: 2px dashed #E2E6EA;
    border-radius: 12px;
}

.no-results-icon[b-k0m2v7cikp],
.empty-icon[b-k0m2v7cikp] {
    font-size: 3rem;
    color: #BFD8B8;
    margin-bottom: 1rem;
}

.no-results h4[b-k0m2v7cikp],
.empty-state h4[b-k0m2v7cikp] {
    color: #14213D;
    font-size: 1.3rem;
    margin-bottom: 0.5rem;
}

.no-results p[b-k0m2v7cikp],
.empty-state p[b-k0m2v7cikp] {
    color: #2E2E2E;
    font-size: 1rem;
    margin: 0;
    max-width: 300px;
}

/* Responsive Design */
@media (max-width: 768px) {
    .checker-controls[b-k0m2v7cikp] {
        grid-template-columns: 1fr;
        gap: 1rem;
    }
    
    .feature-check-item[b-k0m2v7cikp] {
        flex-direction: column;
        align-items: flex-start;
        gap: 1rem;
    }
    
    .feature-header[b-k0m2v7cikp] {
        width: 100%;
    }
    
    .feature-actions[b-k0m2v7cikp] {
        flex-direction: row;
        width: 100%;
        justify-content: flex-end;
    }
    
    .upgrade-suggestion[b-k0m2v7cikp] {
        flex-direction: column;
        align-items: stretch;
        text-align: center;
    }
    
    .result-actions[b-k0m2v7cikp] {
        justify-content: center;
    }
}

@media (max-width: 480px) {
    .feature-check-item[b-k0m2v7cikp] {
        padding: 1rem;
    }
    
    .feature-header[b-k0m2v7cikp] {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.5rem;
    }
    
    .feature-actions[b-k0m2v7cikp] {
        flex-direction: column;
        gap: 0.75rem;
    }
    
    .checker-content[b-k0m2v7cikp] {
        gap: 1.5rem;
    }
}
/* /Features/Subscription/Components/SubscriptionUpgradeForm.razor.rz.scp.css */
.subscription-upgrade-form[b-mzgtxx7c2z] {
    max-width: 800px;
    margin: 0 auto;
}

[b-mzgtxx7c2z] .upgrade-form-card {
    border: 2px solid #C8A951;
    background: white;
    box-shadow: 0 8px 32px rgba(200, 169, 81, 0.1);
}

.upgrade-form-content[b-mzgtxx7c2z] {
    display: flex;
    flex-direction: column;
    gap: 2.5rem;
}

.loading-state[b-mzgtxx7c2z] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 4rem 2rem;
    text-align: center;
}

.spinner[b-mzgtxx7c2z] {
    width: 40px;
    height: 40px;
    border: 4px solid #E2E6EA;
    border-top: 4px solid #C8A951;
    border-radius: 50%;
    animation: spin-b-mzgtxx7c2z 1s linear infinite;
    margin-bottom: 1rem;
}

@keyframes spin-b-mzgtxx7c2z {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

/* Tier Comparison */
.tier-comparison[b-mzgtxx7c2z] {
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    gap: 2rem;
    align-items: center;
    padding: 2rem;
    background: linear-gradient(135deg, rgba(200, 169, 81, 0.05) 0%, rgba(191, 216, 184, 0.05) 100%);
    border-radius: 12px;
    border: 1px solid rgba(200, 169, 81, 0.2);
}

.current-tier[b-mzgtxx7c2z],
.target-tier[b-mzgtxx7c2z] {
    text-align: center;
}

.current-tier h4[b-mzgtxx7c2z],
.target-tier h4[b-mzgtxx7c2z] {
    color: #14213D;
    font-size: 1.1rem;
    font-weight: 600;
    margin-bottom: 1rem;
}

.tier-display[b-mzgtxx7c2z] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1rem;
    padding: 1.5rem;
    background: white;
    border-radius: 12px;
    border: 2px solid #E2E6EA;
    transition: all 0.3s ease;
}

.tier-display.target[b-mzgtxx7c2z] {
    border-color: #C8A951;
    box-shadow: 0 4px 16px rgba(200, 169, 81, 0.15);
}

.tier-icon[b-mzgtxx7c2z] {
    font-size: 2.5rem;
    color: #C8A951;
}

.tier-info[b-mzgtxx7c2z] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.tier-name[b-mzgtxx7c2z] {
    color: #14213D;
    font-size: 1.3rem;
    font-weight: 700;
}

.tier-price[b-mzgtxx7c2z] {
    color: #2E2E2E;
    font-size: 1rem;
    font-weight: 500;
}

.no-tier[b-mzgtxx7c2z] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.5rem;
    padding: 1.5rem;
    background: rgba(108, 117, 125, 0.1);
    border-radius: 12px;
    color: #6c757d;
}

.upgrade-arrow[b-mzgtxx7c2z] {
    font-size: 2rem;
    color: #C8A951;
    text-align: center;
}

/* Upgrade Benefits */
.upgrade-benefits[b-mzgtxx7c2z] {
    background: rgba(25, 135, 84, 0.05);
    border: 1px solid rgba(25, 135, 84, 0.2);
    border-radius: 12px;
    padding: 2rem;
}

.upgrade-benefits h4[b-mzgtxx7c2z] {
    color: #14213D;
    font-size: 1.2rem;
    font-weight: 600;
    margin-bottom: 1.5rem;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.upgrade-benefits h4[b-mzgtxx7c2z]::before {
    content: "✨";
    font-size: 1.5rem;
}

.benefits-list[b-mzgtxx7c2z] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 1rem;
}

.benefit-item[b-mzgtxx7c2z] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.75rem;
    background: white;
    border-radius: 8px;
    border: 1px solid rgba(25, 135, 84, 0.1);
}

.benefit-icon[b-mzgtxx7c2z] {
    color: #198754;
    font-size: 1.1rem;
    flex-shrink: 0;
}

.benefit-item span[b-mzgtxx7c2z] {
    color: #14213D;
    font-weight: 500;
    font-size: 0.95rem;
}

/* Upgrade Form */
.upgrade-form[b-mzgtxx7c2z] {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

.upgrade-form h4[b-mzgtxx7c2z] {
    color: #14213D;
    font-size: 1.2rem;
    font-weight: 600;
    margin-bottom: 0.5rem;
    padding-bottom: 0.5rem;
    border-bottom: 2px solid #E2E6EA;
}

.form-row[b-mzgtxx7c2z] {
    display: flex;
    flex-direction: column;
}

/* Proration Info */
.proration-info[b-mzgtxx7c2z] {
    background: rgba(200, 169, 81, 0.05);
    border: 1px solid rgba(200, 169, 81, 0.2);
    border-radius: 12px;
    padding: 1.5rem;
}

.proration-header[b-mzgtxx7c2z] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    margin-bottom: 1rem;
}

.proration-header i[b-mzgtxx7c2z] {
    color: #C8A951;
    font-size: 1.2rem;
}

.proration-header h5[b-mzgtxx7c2z] {
    color: #14213D;
    font-size: 1.1rem;
    font-weight: 600;
    margin: 0;
}

.proration-details[b-mzgtxx7c2z] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.proration-item[b-mzgtxx7c2z] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.5rem 0;
}

.proration-item.total[b-mzgtxx7c2z] {
    border-top: 2px solid rgba(200, 169, 81, 0.3);
    margin-top: 0.5rem;
    padding-top: 1rem;
    font-weight: 600;
}

.proration-item .label[b-mzgtxx7c2z] {
    color: #2E2E2E;
    font-weight: 500;
}

.proration-item .value[b-mzgtxx7c2z] {
    color: #14213D;
    font-weight: 600;
}

.proration-item .value.credit[b-mzgtxx7c2z] {
    color: #198754;
}

.proration-item .value.charge[b-mzgtxx7c2z] {
    color: #C8A951;
}

/* Terms and Conditions */
.terms-section[b-mzgtxx7c2z] {
    padding: 1.5rem;
    background: rgba(14, 33, 61, 0.05);
    border-radius: 8px;
    border: 1px solid rgba(14, 33, 61, 0.1);
}

.terms-checkbox[b-mzgtxx7c2z] {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
}

.terms-input[b-mzgtxx7c2z] {
    margin-top: 0.25rem;
    flex-shrink: 0;
}

.terms-label[b-mzgtxx7c2z] {
    color: #2E2E2E;
    font-size: 0.95rem;
    line-height: 1.4;
    cursor: pointer;
}

.terms-label a[b-mzgtxx7c2z] {
    color: #C8A951;
    text-decoration: none;
    font-weight: 500;
}

.terms-label a:hover[b-mzgtxx7c2z] {
    text-decoration: underline;
}

.validation-message[b-mzgtxx7c2z] {
    color: #dc3545;
    font-size: 0.85rem;
    margin-top: 0.5rem;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.validation-message[b-mzgtxx7c2z]::before {
    content: "⚠️";
    font-size: 1rem;
}

/* Form Actions */
.form-actions[b-mzgtxx7c2z] {
    display: flex;
    gap: 1rem;
    justify-content: flex-end;
    padding-top: 1rem;
    border-top: 2px solid #E2E6EA;
}

/* Error Message */
.error-message[b-mzgtxx7c2z] {
    background: rgba(220, 53, 69, 0.1);
    border: 1px solid rgba(220, 53, 69, 0.3);
    border-radius: 8px;
    padding: 1rem;
    display: flex;
    align-items: center;
    gap: 0.75rem;
    color: #dc3545;
    font-weight: 500;
}

.error-message i[b-mzgtxx7c2z] {
    font-size: 1.2rem;
    flex-shrink: 0;
}

/* Responsive Design */
@media (max-width: 768px) {
    .tier-comparison[b-mzgtxx7c2z] {
        grid-template-columns: 1fr;
        gap: 1.5rem;
        text-align: center;
    }
    
    .upgrade-arrow[b-mzgtxx7c2z] {
        transform: rotate(90deg);
        font-size: 1.5rem;
    }
    
    .benefits-list[b-mzgtxx7c2z] {
        grid-template-columns: 1fr;
    }
    
    .form-actions[b-mzgtxx7c2z] {
        flex-direction: column;
    }
    
    .proration-item[b-mzgtxx7c2z] {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.25rem;
    }
    
    .terms-checkbox[b-mzgtxx7c2z] {
        align-items: flex-start;
    }
}

@media (max-width: 480px) {
    .upgrade-form-content[b-mzgtxx7c2z] {
        gap: 2rem;
    }
    
    .tier-comparison[b-mzgtxx7c2z] {
        padding: 1.5rem;
        gap: 1rem;
    }
    
    .tier-display[b-mzgtxx7c2z] {
        padding: 1rem;
    }
    
    .upgrade-benefits[b-mzgtxx7c2z],
    .proration-info[b-mzgtxx7c2z] {
        padding: 1.25rem;
    }
    
    .terms-section[b-mzgtxx7c2z] {
        padding: 1.25rem;
    }
}
/* /Features/Subscription/Components/TierAccessInfo.razor.rz.scp.css */
.tier-access-info[b-n3esuupksl] {
    margin-bottom: 2rem;
}

[b-n3esuupksl] .tier-info-card {
    border: 2px solid #E2E6EA;
    background: white;
}

.tier-info-content[b-n3esuupksl] {
    display: flex;
    flex-direction: column;
    gap: 3rem;
}

/* Current Tier Status */
.current-tier-status[b-n3esuupksl] {
    padding: 2rem;
    background: linear-gradient(135deg, rgba(200, 169, 81, 0.05) 0%, rgba(191, 216, 184, 0.05) 100%);
    border: 2px solid rgba(200, 169, 81, 0.2);
    border-radius: 12px;
}

.status-header h4[b-n3esuupksl] {
    color: #14213D;
    font-size: 1.3rem;
    font-weight: 600;
    margin-bottom: 1.5rem;
    text-align: center;
}

.current-tier-display[b-n3esuupksl] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1.5rem;
}

.tier-badge[b-n3esuupksl] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 1rem 2rem;
    border-radius: 25px;
    font-weight: 600;
    font-size: 1.2rem;
    border: 2px solid;
}

.tier-badge.tier-free[b-n3esuupksl] {
    background: rgba(108, 117, 125, 0.1);
    color: #6c757d;
    border-color: #6c757d;
}

.tier-badge.tier-bronze[b-n3esuupksl] {
    background: rgba(205, 127, 50, 0.1);
    color: #cd7f32;
    border-color: #cd7f32;
}

.tier-badge.tier-silver[b-n3esuupksl] {
    background: rgba(192, 192, 192, 0.1);
    color: #c0c0c0;
    border-color: #c0c0c0;
}

.tier-badge.tier-gold[b-n3esuupksl] {
    background: rgba(255, 215, 0, 0.1);
    color: #ffd700;
    border-color: #ffd700;
}

.tier-limits[b-n3esuupksl] {
    display: flex;
    gap: 2rem;
    flex-wrap: wrap;
    justify-content: center;
}

.limit-item[b-n3esuupksl] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.75rem 1rem;
    background: white;
    border-radius: 8px;
    border: 1px solid #E2E6EA;
    color: #14213D;
    font-weight: 500;
}

.limit-item i[b-n3esuupksl] {
    color: #C8A951;
    font-size: 1.1rem;
}

/* Tier Overview */
.tier-overview[b-n3esuupksl] {
    display: flex;
    flex-direction: column;
    gap: 2rem;
}

.overview-header[b-n3esuupksl] {
    text-align: center;
}

.overview-header h4[b-n3esuupksl] {
    color: #14213D;
    font-size: 1.5rem;
    font-weight: 600;
    margin-bottom: 0.5rem;
}

.overview-header p[b-n3esuupksl] {
    color: #2E2E2E;
    font-size: 1.1rem;
    margin: 0;
}

.tiers-grid[b-n3esuupksl] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 1.5rem;
}

.tier-info-card[b-n3esuupksl] {
    background: white;
    border-radius: 12px;
    border: 2px solid #E2E6EA;
    padding: 1.5rem;
    display: flex;
    flex-direction: column;
    gap: 1rem;
    transition: all 0.3s ease;
    position: relative;
}

.tier-info-card:hover[b-n3esuupksl] {
    transform: translateY(-2px);
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.1);
}

.tier-info-card.current[b-n3esuupksl] {
    border-color: #C8A951;
    box-shadow: 0 4px 16px rgba(200, 169, 81, 0.2);
}

.tier-info-card.featured[b-n3esuupksl] {
    border-color: #ffd700;
    box-shadow: 0 4px 16px rgba(255, 215, 0, 0.2);
}

.tier-info-card.tier-free[b-n3esuupksl] {
    border-color: #6c757d;
}

.tier-info-card.tier-bronze[b-n3esuupksl] {
    border-color: #cd7f32;
}

.tier-info-card.tier-silver[b-n3esuupksl] {
    border-color: #c0c0c0;
}

.tier-info-card.tier-gold[b-n3esuupksl] {
    border-color: #ffd700;
}

.tier-header[b-n3esuupksl] {
    text-align: center;
    padding-bottom: 1rem;
    border-bottom: 1px solid #E2E6EA;
}

.tier-icon[b-n3esuupksl] {
    font-size: 2.5rem;
    margin-bottom: 0.75rem;
}

.tier-info-card.tier-free .tier-icon[b-n3esuupksl] { color: #6c757d; }
.tier-info-card.tier-bronze .tier-icon[b-n3esuupksl] { color: #cd7f32; }
.tier-info-card.tier-silver .tier-icon[b-n3esuupksl] { color: #c0c0c0; }
.tier-info-card.tier-gold .tier-icon[b-n3esuupksl] { color: #ffd700; }

.tier-name[b-n3esuupksl] {
    color: #14213D;
    font-size: 1.3rem;
    font-weight: 700;
    margin: 0 0 0.5rem 0;
}

.tier-price[b-n3esuupksl] {
    display: flex;
    align-items: baseline;
    justify-content: center;
    gap: 0.25rem;
}

.price-free[b-n3esuupksl] {
    color: #198754;
    font-size: 1.5rem;
    font-weight: 600;
}

.price-amount[b-n3esuupksl] {
    color: #14213D;
    font-size: 1.5rem;
    font-weight: 700;
}

.price-period[b-n3esuupksl] {
    color: #6c757d;
    font-size: 0.9rem;
}

.tier-features[b-n3esuupksl] {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.features-summary[b-n3esuupksl] {
    display: flex;
    justify-content: center;
}

.feature-count[b-n3esuupksl] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.5rem 1rem;
    background: rgba(200, 169, 81, 0.1);
    border-radius: 20px;
    color: #C8A951;
    font-weight: 600;
    font-size: 0.9rem;
}

.key-highlights[b-n3esuupksl] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.highlight-item[b-n3esuupksl] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.9rem;
    color: #2E2E2E;
}

.highlight-item i[b-n3esuupksl] {
    color: #198754;
    font-size: 0.8rem;
    width: 12px;
}

.tier-actions[b-n3esuupksl] {
    margin-top: auto;
    padding-top: 1rem;
}

.current-badge[b-n3esuupksl] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    padding: 0.75rem 1rem;
    background: rgba(25, 135, 84, 0.1);
    color: #198754;
    border: 2px solid #198754;
    border-radius: 8px;
    font-weight: 600;
}

[b-n3esuupksl] .tier-select-btn {
    width: 100%;
    justify-content: center;
}

/* Feature Matrix */
.feature-matrix[b-n3esuupksl] {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

.matrix-header[b-n3esuupksl] {
    text-align: center;
}

.matrix-header h4[b-n3esuupksl] {
    color: #14213D;
    font-size: 1.3rem;
    font-weight: 600;
    margin-bottom: 0.5rem;
}

.matrix-header p[b-n3esuupksl] {
    color: #2E2E2E;
    font-size: 1rem;
    margin: 0;
}

.matrix-table[b-n3esuupksl] {
    background: white;
    border-radius: 12px;
    border: 1px solid #E2E6EA;
    overflow: hidden;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
}

.matrix-row[b-n3esuupksl] {
    display: grid;
    grid-template-columns: 2fr repeat(4, 1fr);
    border-bottom: 1px solid #F0F0F0;
}

.matrix-row:last-child[b-n3esuupksl] {
    border-bottom: none;
}

.matrix-row.header-row[b-n3esuupksl] {
    background: #F8F9FA;
    border-bottom: 2px solid #E2E6EA;
}

.feature-cell[b-n3esuupksl] {
    padding: 1rem 1.5rem;
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.tier-cell[b-n3esuupksl] {
    padding: 1rem;
    text-align: center;
    border-left: 1px solid #F0F0F0;
    display: flex;
    align-items: center;
    justify-content: center;
}

.tier-cell.current-tier[b-n3esuupksl] {
    background: rgba(200, 169, 81, 0.05);
    border-left-color: #C8A951;
}

.feature-name[b-n3esuupksl] {
    font-weight: 600;
    color: #14213D;
    font-size: 0.95rem;
}

.feature-description[b-n3esuupksl] {
    font-size: 0.85rem;
    color: #6c757d;
    line-height: 1.3;
}

.tier-cell .tier-name[b-n3esuupksl] {
    font-weight: 700;
    color: #14213D;
    font-size: 1rem;
}

.availability-yes[b-n3esuupksl] {
    color: #198754;
    font-size: 1.2rem;
}

.availability-no[b-n3esuupksl] {
    color: #dc3545;
    font-size: 1.2rem;
    opacity: 0.5;
}

/* Upgrade Recommendations */
.upgrade-recommendations[b-n3esuupksl] {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

.recommendation-header[b-n3esuupksl] {
    text-align: center;
}

.recommendation-header h4[b-n3esuupksl] {
    color: #14213D;
    font-size: 1.3rem;
    font-weight: 600;
    margin-bottom: 0.5rem;
}

.recommendation-header p[b-n3esuupksl] {
    color: #2E2E2E;
    font-size: 1rem;
    margin: 0;
}

.recommendations-list[b-n3esuupksl] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.recommendation-item[b-n3esuupksl] {
    display: flex;
    align-items: center;
    gap: 1.5rem;
    padding: 1.5rem;
    background: white;
    border: 2px solid #E2E6EA;
    border-radius: 12px;
    transition: all 0.3s ease;
}

.recommendation-item:hover[b-n3esuupksl] {
    transform: translateY(-1px);
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.1);
}

.recommendation-tier[b-n3esuupksl] {
    flex-shrink: 0;
}

.recommendation-content[b-n3esuupksl] {
    flex: 1;
}

.recommendation-content h5[b-n3esuupksl] {
    color: #14213D;
    font-size: 1.1rem;
    font-weight: 600;
    margin: 0 0 0.5rem 0;
}

.recommendation-content p[b-n3esuupksl] {
    color: #2E2E2E;
    font-size: 0.95rem;
    margin: 0 0 1rem 0;
    line-height: 1.4;
}

.recommendation-benefits[b-n3esuupksl] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.benefit-tag[b-n3esuupksl] {
    background: rgba(200, 169, 81, 0.1);
    color: #C8A951;
    border: 1px solid rgba(200, 169, 81, 0.3);
    padding: 0.25rem 0.75rem;
    border-radius: 12px;
    font-size: 0.8rem;
    font-weight: 500;
}

.recommendation-action[b-n3esuupksl] {
    flex-shrink: 0;
}

/* No Tiers State */
.no-tiers[b-n3esuupksl] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 4rem 2rem;
    text-align: center;
    background: rgba(108, 117, 125, 0.05);
    border: 2px dashed #E2E6EA;
    border-radius: 12px;
}

.no-tiers-icon[b-n3esuupksl] {
    font-size: 4rem;
    color: #BFD8B8;
    margin-bottom: 1.5rem;
}

.no-tiers h4[b-n3esuupksl] {
    color: #14213D;
    font-size: 1.5rem;
    margin-bottom: 0.5rem;
}

.no-tiers p[b-n3esuupksl] {
    color: #2E2E2E;
    font-size: 1rem;
    margin: 0;
    max-width: 400px;
}

/* Responsive Design */
@media (max-width: 768px) {
    .tier-limits[b-n3esuupksl] {
        gap: 1rem;
    }
    
    .tiers-grid[b-n3esuupksl] {
        grid-template-columns: 1fr;
    }
    
    .matrix-row[b-n3esuupksl] {
        grid-template-columns: 1fr;
    }
    
    .tier-cell[b-n3esuupksl],
    .feature-cell[b-n3esuupksl] {
        border-left: none;
        border-top: 1px solid #F0F0F0;
    }
    
    .matrix-row.header-row .feature-cell[b-n3esuupksl] {
        border-top: none;
    }
    
    .recommendation-item[b-n3esuupksl] {
        flex-direction: column;
        align-items: flex-start;
        text-align: center;
    }
    
    .recommendation-content[b-n3esuupksl] {
        text-align: center;
    }
    
    .recommendation-benefits[b-n3esuupksl] {
        justify-content: center;
    }
}

@media (max-width: 480px) {
    .tier-info-content[b-n3esuupksl] {
        gap: 2rem;
    }
    
    .current-tier-status[b-n3esuupksl] {
        padding: 1.5rem;
    }
    
    .tier-limits[b-n3esuupksl] {
        flex-direction: column;
        align-items: center;
        gap: 0.75rem;
    }
    
    .tier-info-card[b-n3esuupksl] {
        padding: 1.25rem;
    }
    
    .recommendation-item[b-n3esuupksl] {
        padding: 1.25rem;
    }
}
/* /Features/Subscription/FeatureAccessPage.razor.rz.scp.css */
.feature-access-page[b-jqzsz3b3zl] {
    padding: 2rem;
    max-width: 1400px;
    margin: 0 auto;
}

.page-header[b-jqzsz3b3zl] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 2.5rem;
    flex-wrap: wrap;
    gap: 1rem;
}

.header-content[b-jqzsz3b3zl] {
    flex: 1;
}

.page-title[b-jqzsz3b3zl] {
    color: #14213D;
    font-size: 2.5rem;
    font-weight: 600;
    margin-bottom: 0.5rem;
    display: flex;
    align-items: center;
    gap: 1rem;
}

.page-title i[b-jqzsz3b3zl] {
    color: #C8A951;
    font-size: 2rem;
}

.page-description[b-jqzsz3b3zl] {
    color: #2E2E2E;
    font-size: 1.1rem;
    margin: 0;
    max-width: 600px;
}

.header-actions[b-jqzsz3b3zl] {
    display: flex;
    gap: 0.75rem;
    align-items: center;
}

.feature-access-content[b-jqzsz3b3zl] {
    display: flex;
    flex-direction: column;
    gap: 3rem;
}

.loading-state[b-jqzsz3b3zl] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 4rem 2rem;
    text-align: center;
}

.spinner[b-jqzsz3b3zl] {
    width: 40px;
    height: 40px;
    border: 4px solid #E2E6EA;
    border-top: 4px solid #C8A951;
    border-radius: 50%;
    animation: spin-b-jqzsz3b3zl 1s linear infinite;
    margin-bottom: 1rem;
}

@keyframes spin-b-jqzsz3b3zl {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

/* Current Tier Overview */
.current-tier-overview[b-jqzsz3b3zl] {
    margin-bottom: 2rem;
}

[b-jqzsz3b3zl] .current-tier-card {
    border: 2px solid #C8A951;
    background: linear-gradient(135deg, rgba(200, 169, 81, 0.05) 0%, rgba(191, 216, 184, 0.05) 100%);
}

.tier-overview-content[b-jqzsz3b3zl] {
    display: flex;
    gap: 2rem;
    align-items: flex-start;
    flex-wrap: wrap;
}

.tier-info[b-jqzsz3b3zl] {
    flex: 1;
    min-width: 300px;
}

.tier-badge[b-jqzsz3b3zl] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.75rem 1.5rem;
    border-radius: 25px;
    font-weight: 600;
    font-size: 1.1rem;
    margin-bottom: 1rem;
    width: fit-content;
}

.tier-badge.tier-free[b-jqzsz3b3zl] {
    background: rgba(108, 117, 125, 0.1);
    color: #6c757d;
    border: 2px solid #6c757d;
}

.tier-badge.tier-bronze[b-jqzsz3b3zl] {
    background: rgba(205, 127, 50, 0.1);
    color: #cd7f32;
    border: 2px solid #cd7f32;
}

.tier-badge.tier-silver[b-jqzsz3b3zl] {
    background: rgba(192, 192, 192, 0.1);
    color: #c0c0c0;
    border: 2px solid #c0c0c0;
}

.tier-badge.tier-gold[b-jqzsz3b3zl] {
    background: rgba(255, 215, 0, 0.1);
    color: #ffd700;
    border: 2px solid #ffd700;
}

.tier-description[b-jqzsz3b3zl] {
    color: #2E2E2E;
    font-size: 1rem;
    line-height: 1.5;
    margin-bottom: 1.5rem;
}

.access-summary[b-jqzsz3b3zl] {
    display: flex;
    flex-wrap: wrap;
    gap: 2rem;
}

.summary-item[b-jqzsz3b3zl] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.summary-label[b-jqzsz3b3zl] {
    font-size: 0.9rem;
    color: #6c757d;
    font-weight: 500;
}

.summary-value[b-jqzsz3b3zl] {
    font-size: 1.1rem;
    color: #14213D;
    font-weight: 600;
}

.upgrade-prompt[b-jqzsz3b3zl] {
    background: rgba(200, 169, 81, 0.1);
    border: 1px solid rgba(200, 169, 81, 0.3);
    border-radius: 12px;
    padding: 2rem;
    text-align: center;
    flex: 1;
    min-width: 300px;
}

.upgrade-prompt h4[b-jqzsz3b3zl] {
    color: #14213D;
    font-size: 1.2rem;
    margin-bottom: 0.5rem;
}

.upgrade-prompt p[b-jqzsz3b3zl] {
    color: #2E2E2E;
    margin-bottom: 1.5rem;
}

/* Feature Categories */
.feature-categories[b-jqzsz3b3zl] {
    margin-bottom: 3rem;
}

.section-title[b-jqzsz3b3zl] {
    color: #14213D;
    font-size: 2rem;
    font-weight: 600;
    margin-bottom: 0.5rem;
    text-align: center;
}

.section-description[b-jqzsz3b3zl] {
    color: #2E2E2E;
    font-size: 1.1rem;
    text-align: center;
    margin-bottom: 2.5rem;
    max-width: 600px;
    margin-left: auto;
    margin-right: auto;
}

.categories-grid[b-jqzsz3b3zl] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(350px, 1fr));
    gap: 2rem;
}

.category-card[b-jqzsz3b3zl] {
    background: white;
    border-radius: 16px;
    border: 2px solid #E2E6EA;
    padding: 2rem;
    transition: all 0.3s ease;
}

.category-card:hover[b-jqzsz3b3zl] {
    transform: translateY(-2px);
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.1);
}

.category-header[b-jqzsz3b3zl] {
    display: flex;
    align-items: center;
    gap: 1rem;
    margin-bottom: 1.5rem;
    padding-bottom: 1rem;
    border-bottom: 1px solid #E2E6EA;
}

.category-icon[b-jqzsz3b3zl] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 50px;
    height: 50px;
    background: rgba(200, 169, 81, 0.1);
    border-radius: 12px;
    color: #C8A951;
    font-size: 1.5rem;
}

.category-name[b-jqzsz3b3zl] {
    color: #14213D;
    font-size: 1.3rem;
    font-weight: 600;
    margin: 0;
    flex: 1;
}

.access-indicator[b-jqzsz3b3zl] {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 0.5rem;
}

.access-count[b-jqzsz3b3zl] {
    color: #14213D;
    font-weight: 600;
    font-size: 0.9rem;
}

.access-progress[b-jqzsz3b3zl] {
    width: 80px;
}

.progress-bar[b-jqzsz3b3zl] {
    width: 100%;
    height: 6px;
    background: #E2E6EA;
    border-radius: 3px;
    overflow: hidden;
}

.progress-fill[b-jqzsz3b3zl] {
    height: 100%;
    background: linear-gradient(90deg, #C8A951 0%, #BFD8B8 100%);
    border-radius: 3px;
    transition: width 0.3s ease;
}

.category-features[b-jqzsz3b3zl] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.feature-item[b-jqzsz3b3zl] {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 1rem;
    border-radius: 8px;
    transition: all 0.3s ease;
}

.feature-item.accessible[b-jqzsz3b3zl] {
    background: rgba(25, 135, 84, 0.05);
    border: 1px solid rgba(25, 135, 84, 0.2);
}

.feature-item.locked[b-jqzsz3b3zl] {
    background: rgba(108, 117, 125, 0.05);
    border: 1px solid rgba(108, 117, 125, 0.2);
}

.feature-status[b-jqzsz3b3zl] {
    flex-shrink: 0;
}

.status-available[b-jqzsz3b3zl] {
    color: #198754;
    font-size: 1.2rem;
}

.status-locked[b-jqzsz3b3zl] {
    color: #6c757d;
    font-size: 1.2rem;
}

.feature-info[b-jqzsz3b3zl] {
    flex: 1;
}

.feature-name[b-jqzsz3b3zl] {
    color: #14213D;
    font-weight: 600;
    margin: 0 0 0.25rem 0;
    font-size: 1rem;
}

.feature-description[b-jqzsz3b3zl] {
    color: #2E2E2E;
    font-size: 0.9rem;
    margin: 0 0 0.5rem 0;
    line-height: 1.4;
}

.required-tier[b-jqzsz3b3zl] {
    font-size: 0.8rem;
    color: #C8A951;
    font-weight: 500;
}

.feature-actions[b-jqzsz3b3zl] {
    flex-shrink: 0;
}

/* Feature Checker Section */
.feature-checker-section[b-jqzsz3b3zl] {
    margin-bottom: 3rem;
}

/* Usage Limits */
.usage-limits-section[b-jqzsz3b3zl] {
    margin-bottom: 3rem;
}

.limits-grid[b-jqzsz3b3zl] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 2rem;
}

.limit-card[b-jqzsz3b3zl] {
    background: white;
    border-radius: 16px;
    border: 2px solid #E2E6EA;
    padding: 2rem;
    transition: all 0.3s ease;
}

.limit-card:hover[b-jqzsz3b3zl] {
    transform: translateY(-2px);
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.1);
}

.limit-header[b-jqzsz3b3zl] {
    display: flex;
    align-items: center;
    gap: 1rem;
    margin-bottom: 1.5rem;
}

.limit-icon[b-jqzsz3b3zl] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 50px;
    height: 50px;
    background: rgba(200, 169, 81, 0.1);
    border-radius: 12px;
    color: #C8A951;
    font-size: 1.5rem;
}

.limit-header h3[b-jqzsz3b3zl] {
    color: #14213D;
    font-size: 1.2rem;
    font-weight: 600;
    margin: 0;
}

.limit-content[b-jqzsz3b3zl] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.limit-display[b-jqzsz3b3zl] {
    display: flex;
    align-items: baseline;
    gap: 0.5rem;
}

.limit-current[b-jqzsz3b3zl] {
    color: #14213D;
    font-size: 2rem;
    font-weight: 700;
}

.limit-separator[b-jqzsz3b3zl] {
    color: #6c757d;
    font-size: 1.5rem;
    font-weight: 400;
}

.limit-max[b-jqzsz3b3zl] {
    color: #6c757d;
    font-size: 1.5rem;
    font-weight: 600;
}

.limit-value.unlimited[b-jqzsz3b3zl] {
    color: #C8A951;
    font-size: 1.5rem;
    font-weight: 600;
}

.limit-progress[b-jqzsz3b3zl] {
    width: 100%;
}

.limit-progress .progress-bar[b-jqzsz3b3zl] {
    height: 8px;
}

.support-info[b-jqzsz3b3zl] {
    text-align: center;
}

.support-level[b-jqzsz3b3zl] {
    color: #14213D;
    font-size: 1.5rem;
    font-weight: 600;
    display: block;
    margin-bottom: 0.5rem;
}

.support-description[b-jqzsz3b3zl] {
    color: #2E2E2E;
    font-size: 0.9rem;
    margin: 0;
    line-height: 1.4;
}

/* Tier Access Info */
.tier-access-info[b-jqzsz3b3zl] {
    margin-bottom: 2rem;
}

/* Responsive Design */
@media (max-width: 768px) {
    .feature-access-page[b-jqzsz3b3zl] {
        padding: 1rem;
    }
    
    .page-header[b-jqzsz3b3zl] {
        flex-direction: column;
        align-items: flex-start;
    }
    
    .page-title[b-jqzsz3b3zl] {
        font-size: 2rem;
    }
    
    .tier-overview-content[b-jqzsz3b3zl] {
        flex-direction: column;
        gap: 1.5rem;
    }
    
    .access-summary[b-jqzsz3b3zl] {
        gap: 1rem;
    }
    
    .categories-grid[b-jqzsz3b3zl] {
        grid-template-columns: 1fr;
        gap: 1.5rem;
    }
    
    .limits-grid[b-jqzsz3b3zl] {
        grid-template-columns: 1fr;
        gap: 1.5rem;
    }
    
    .category-header[b-jqzsz3b3zl] {
        flex-wrap: wrap;
        gap: 0.75rem;
    }
    
    .access-indicator[b-jqzsz3b3zl] {
        align-items: flex-start;
        width: 100%;
    }
    
    .access-progress[b-jqzsz3b3zl] {
        width: 100%;
    }
}

@media (max-width: 480px) {
    .feature-access-page[b-jqzsz3b3zl] {
        padding: 0.5rem;
    }
    
    .page-title[b-jqzsz3b3zl] {
        font-size: 1.75rem;
        flex-direction: column;
        align-items: flex-start;
        gap: 0.5rem;
    }
    
    .category-card[b-jqzsz3b3zl],
    .limit-card[b-jqzsz3b3zl] {
        padding: 1.5rem;
    }
    
    .feature-item[b-jqzsz3b3zl] {
        padding: 0.75rem;
    }
    
    .tier-badge[b-jqzsz3b3zl] {
        padding: 0.5rem 1rem;
        font-size: 1rem;
    }
}
/* /Features/Subscription/TierComparisonPage.razor.rz.scp.css */
.tier-comparison-page[b-7lk47sz9zd] {
    padding: 2rem;
    max-width: 1400px;
    margin: 0 auto;
}

.page-header[b-7lk47sz9zd] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 2.5rem;
    flex-wrap: wrap;
    gap: 1rem;
}

.header-content[b-7lk47sz9zd] {
    flex: 1;
}

.page-title[b-7lk47sz9zd] {
    color: #14213D;
    font-size: 2.5rem;
    font-weight: 600;
    margin-bottom: 0.5rem;
    display: flex;
    align-items: center;
    gap: 1rem;
}

.page-title i[b-7lk47sz9zd] {
    color: #C8A951;
    font-size: 2rem;
}

.page-description[b-7lk47sz9zd] {
    color: #2E2E2E;
    font-size: 1.1rem;
    margin: 0;
    max-width: 600px;
}

.header-actions[b-7lk47sz9zd] {
    display: flex;
    gap: 0.75rem;
    align-items: center;
}

.tier-comparison-content[b-7lk47sz9zd] {
    display: flex;
    flex-direction: column;
    gap: 3rem;
}

.loading-state[b-7lk47sz9zd] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 4rem 2rem;
    text-align: center;
}

.spinner[b-7lk47sz9zd] {
    width: 40px;
    height: 40px;
    border: 4px solid #E2E6EA;
    border-top: 4px solid #C8A951;
    border-radius: 50%;
    animation: spin-b-7lk47sz9zd 1s linear infinite;
    margin-bottom: 1rem;
}

@keyframes spin-b-7lk47sz9zd {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

/* Current Subscription Status */
.current-status[b-7lk47sz9zd] {
    margin-bottom: 2rem;
}

[b-7lk47sz9zd] .current-subscription-card {
    border: 2px solid #C8A951;
    background: linear-gradient(135deg, rgba(200, 169, 81, 0.05) 0%, rgba(191, 216, 184, 0.05) 100%);
}

.current-subscription-info[b-7lk47sz9zd] {
    display: flex;
    align-items: center;
    gap: 2rem;
    flex-wrap: wrap;
}

.tier-badge[b-7lk47sz9zd] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.75rem 1.5rem;
    border-radius: 25px;
    font-weight: 600;
    font-size: 1.1rem;
}

.tier-badge.tier-free[b-7lk47sz9zd] {
    background: rgba(108, 117, 125, 0.1);
    color: #6c757d;
    border: 2px solid #6c757d;
}

.tier-badge.tier-bronze[b-7lk47sz9zd] {
    background: rgba(205, 127, 50, 0.1);
    color: #cd7f32;
    border: 2px solid #cd7f32;
}

.tier-badge.tier-silver[b-7lk47sz9zd] {
    background: rgba(192, 192, 192, 0.1);
    color: #c0c0c0;
    border: 2px solid #c0c0c0;
}

.tier-badge.tier-gold[b-7lk47sz9zd] {
    background: rgba(255, 215, 0, 0.1);
    color: #ffd700;
    border: 2px solid #ffd700;
}

.subscription-details[b-7lk47sz9zd] {
    display: flex;
    gap: 2rem;
    flex-wrap: wrap;
}

.detail-item[b-7lk47sz9zd] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.detail-item .label[b-7lk47sz9zd] {
    font-size: 0.9rem;
    color: #6c757d;
    font-weight: 500;
}

.detail-item .value[b-7lk47sz9zd] {
    font-size: 1rem;
    color: #14213D;
    font-weight: 600;
}

.detail-item .value.status[b-7lk47sz9zd] {
    padding: 0.25rem 0.75rem;
    border-radius: 12px;
    font-size: 0.8rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.status.status-active[b-7lk47sz9zd] {
    background: rgba(25, 135, 84, 0.1);
    color: #198754;
    border: 1px solid #198754;
}

.status.status-inactive[b-7lk47sz9zd] {
    background: rgba(108, 117, 125, 0.1);
    color: #6c757d;
    border: 1px solid #6c757d;
}

/* Tier Comparison Grid */
.tiers-comparison[b-7lk47sz9zd] {
    margin-bottom: 3rem;
}

.section-title[b-7lk47sz9zd] {
    color: #14213D;
    font-size: 2rem;
    font-weight: 600;
    margin-bottom: 0.5rem;
    text-align: center;
}

.section-description[b-7lk47sz9zd] {
    color: #2E2E2E;
    font-size: 1.1rem;
    text-align: center;
    margin-bottom: 2.5rem;
    max-width: 600px;
    margin-left: auto;
    margin-right: auto;
}

.tiers-grid[b-7lk47sz9zd] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 2rem;
    margin-bottom: 2rem;
}

.tier-card[b-7lk47sz9zd] {
    background: white;
    border-radius: 16px;
    border: 2px solid #E2E6EA;
    padding: 2rem;
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
    transition: all 0.3s ease;
    position: relative;
    height: fit-content;
}

.tier-card:hover[b-7lk47sz9zd] {
    transform: translateY(-4px);
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.1);
}

.tier-card.current[b-7lk47sz9zd] {
    border-color: #C8A951;
    box-shadow: 0 4px 16px rgba(200, 169, 81, 0.2);
}

.tier-card.featured[b-7lk47sz9zd] {
    border-color: #ffd700;
    box-shadow: 0 4px 16px rgba(255, 215, 0, 0.2);
    transform: scale(1.02);
}

.tier-card.tier-free[b-7lk47sz9zd] {
    border-color: #6c757d;
}

.tier-card.tier-bronze[b-7lk47sz9zd] {
    border-color: #cd7f32;
}

.tier-card.tier-silver[b-7lk47sz9zd] {
    border-color: #c0c0c0;
}

.tier-card.tier-gold[b-7lk47sz9zd] {
    border-color: #ffd700;
}

.popular-badge[b-7lk47sz9zd] {
    position: absolute;
    top: -12px;
    left: 50%;
    transform: translateX(-50%);
    background: #ffd700;
    color: #14213D;
    padding: 0.5rem 1rem;
    border-radius: 20px;
    font-size: 0.8rem;
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 0.25rem;
    box-shadow: 0 2px 8px rgba(255, 215, 0, 0.3);
}

.tier-header[b-7lk47sz9zd] {
    text-align: center;
    padding-bottom: 1.5rem;
    border-bottom: 1px solid #E2E6EA;
}

.tier-icon[b-7lk47sz9zd] {
    font-size: 3rem;
    margin-bottom: 1rem;
}

.tier-card.tier-free .tier-icon[b-7lk47sz9zd] { color: #6c757d; }
.tier-card.tier-bronze .tier-icon[b-7lk47sz9zd] { color: #cd7f32; }
.tier-card.tier-silver .tier-icon[b-7lk47sz9zd] { color: #c0c0c0; }
.tier-card.tier-gold .tier-icon[b-7lk47sz9zd] { color: #ffd700; }

.tier-name[b-7lk47sz9zd] {
    color: #14213D;
    font-size: 1.5rem;
    font-weight: 700;
    margin-bottom: 1rem;
}

.tier-price[b-7lk47sz9zd] {
    margin-bottom: 1rem;
}

.price-currency[b-7lk47sz9zd] {
    font-size: 1.2rem;
    color: #2E2E2E;
    vertical-align: top;
}

.price-amount[b-7lk47sz9zd] {
    font-size: 3rem;
    font-weight: 700;
    color: #14213D;
}

.price-period[b-7lk47sz9zd] {
    font-size: 1rem;
    color: #6c757d;
    margin-left: 0.5rem;
}

.tier-description[b-7lk47sz9zd] {
    color: #2E2E2E;
    font-size: 1rem;
    line-height: 1.5;
    margin: 0;
}

.tier-limits[b-7lk47sz9zd] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    padding: 1.5rem 0;
    border-bottom: 1px solid #E2E6EA;
}

.limit-item[b-7lk47sz9zd] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.limit-item i[b-7lk47sz9zd] {
    color: #C8A951;
    width: 20px;
    text-align: center;
}

.limit-label[b-7lk47sz9zd] {
    color: #2E2E2E;
    font-weight: 500;
    flex: 1;
}

.limit-value[b-7lk47sz9zd] {
    color: #14213D;
    font-weight: 600;
}

.tier-features[b-7lk47sz9zd] {
    flex: 1;
}

.features-title[b-7lk47sz9zd] {
    color: #14213D;
    font-size: 1.1rem;
    font-weight: 600;
    margin-bottom: 1rem;
}

.features-list[b-7lk47sz9zd] {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.feature-item[b-7lk47sz9zd] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    font-size: 0.95rem;
}

.feature-item i[b-7lk47sz9zd] {
    color: #198754;
    width: 16px;
    text-align: center;
}

.tier-actions[b-7lk47sz9zd] {
    margin-top: auto;
    padding-top: 1.5rem;
}

.current-plan-badge[b-7lk47sz9zd] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    padding: 0.75rem 1.5rem;
    background: rgba(25, 135, 84, 0.1);
    color: #198754;
    border: 2px solid #198754;
    border-radius: 8px;
    font-weight: 600;
}

[b-7lk47sz9zd] .tier-action-btn {
    width: 100%;
    justify-content: center;
}

/* Detailed Comparison Table */
.detailed-comparison[b-7lk47sz9zd] {
    margin-bottom: 3rem;
}

.comparison-table[b-7lk47sz9zd] {
    background: white;
    border-radius: 12px;
    border: 1px solid #E2E6EA;
    overflow: hidden;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
}

.table-header[b-7lk47sz9zd] {
    display: grid;
    grid-template-columns: 2fr repeat(4, 1fr);
    background: #F8F9FA;
    border-bottom: 2px solid #E2E6EA;
}

.feature-column[b-7lk47sz9zd] {
    padding: 1.5rem;
    font-weight: 600;
    color: #14213D;
    font-size: 1.1rem;
}

.tier-column[b-7lk47sz9zd] {
    padding: 1.5rem;
    text-align: center;
    border-left: 1px solid #E2E6EA;
}

.tier-column.current-tier[b-7lk47sz9zd] {
    background: rgba(200, 169, 81, 0.1);
    border-left-color: #C8A951;
}

.tier-column .tier-name[b-7lk47sz9zd] {
    font-weight: 700;
    color: #14213D;
    font-size: 1.1rem;
    margin-bottom: 0.25rem;
}

.tier-column .tier-price[b-7lk47sz9zd] {
    font-size: 0.9rem;
    color: #6c757d;
}

.table-body[b-7lk47sz9zd] {
    display: flex;
    flex-direction: column;
}

.feature-group[b-7lk47sz9zd] {
    border-bottom: 1px solid #E2E6EA;
}

.group-header[b-7lk47sz9zd] {
    background: #F8F9FA;
    padding: 1rem 1.5rem;
    border-bottom: 1px solid #E2E6EA;
}

.group-header h4[b-7lk47sz9zd] {
    color: #14213D;
    font-size: 1rem;
    font-weight: 600;
    margin: 0;
}

.feature-row[b-7lk47sz9zd] {
    display: grid;
    grid-template-columns: 2fr repeat(4, 1fr);
    border-bottom: 1px solid #F0F0F0;
}

.feature-row:hover[b-7lk47sz9zd] {
    background: #F8F9FA;
}

.feature-name[b-7lk47sz9zd] {
    padding: 1rem 1.5rem;
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.feature-name[b-7lk47sz9zd] {
    font-weight: 500;
    color: #14213D;
}

.feature-description[b-7lk47sz9zd] {
    font-size: 0.85rem;
    color: #6c757d;
}

.feature-availability[b-7lk47sz9zd] {
    padding: 1rem;
    text-align: center;
    border-left: 1px solid #F0F0F0;
    display: flex;
    align-items: center;
    justify-content: center;
}

.feature-availability.current-tier[b-7lk47sz9zd] {
    background: rgba(200, 169, 81, 0.05);
}

.availability-yes[b-7lk47sz9zd] {
    color: #198754;
    font-size: 1.2rem;
}

.availability-no[b-7lk47sz9zd] {
    color: #dc3545;
    font-size: 1.2rem;
    opacity: 0.5;
}

/* Upgrade CTA */
.upgrade-cta[b-7lk47sz9zd] {
    margin-bottom: 2rem;
}

[b-7lk47sz9zd] .upgrade-cta-card {
    background: linear-gradient(135deg, rgba(200, 169, 81, 0.1) 0%, rgba(191, 216, 184, 0.1) 100%);
    border: 2px solid #C8A951;
}

.cta-content[b-7lk47sz9zd] {
    text-align: center;
    padding: 2rem;
}

.cta-content h3[b-7lk47sz9zd] {
    color: #14213D;
    font-size: 1.5rem;
    margin-bottom: 0.5rem;
}

.cta-content p[b-7lk47sz9zd] {
    color: #2E2E2E;
    font-size: 1rem;
    margin-bottom: 2rem;
}

.cta-actions[b-7lk47sz9zd] {
    display: flex;
    gap: 1rem;
    justify-content: center;
    flex-wrap: wrap;
}

/* Empty State */
.empty-state[b-7lk47sz9zd] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 4rem 2rem;
    text-align: center;
    background: white;
    border-radius: 12px;
    border: 2px dashed #E2E6EA;
}

.empty-icon[b-7lk47sz9zd] {
    font-size: 4rem;
    color: #BFD8B8;
    margin-bottom: 1.5rem;
}

.empty-state h3[b-7lk47sz9zd] {
    color: #14213D;
    font-size: 1.5rem;
    margin-bottom: 0.5rem;
}

.empty-state p[b-7lk47sz9zd] {
    color: #2E2E2E;
    font-size: 1rem;
    margin-bottom: 2rem;
    max-width: 400px;
}

/* Responsive Design */
@media (max-width: 768px) {
    .tier-comparison-page[b-7lk47sz9zd] {
        padding: 1rem;
    }
    
    .page-header[b-7lk47sz9zd] {
        flex-direction: column;
        align-items: flex-start;
    }
    
    .page-title[b-7lk47sz9zd] {
        font-size: 2rem;
    }
    
    .tiers-grid[b-7lk47sz9zd] {
        grid-template-columns: 1fr;
        gap: 1.5rem;
    }
    
    .tier-card.featured[b-7lk47sz9zd] {
        transform: none;
    }
    
    .current-subscription-info[b-7lk47sz9zd] {
        flex-direction: column;
        align-items: flex-start;
        gap: 1rem;
    }
    
    .subscription-details[b-7lk47sz9zd] {
        gap: 1rem;
    }
    
    .table-header[b-7lk47sz9zd],
    .feature-row[b-7lk47sz9zd] {
        grid-template-columns: 1fr;
    }
    
    .tier-column[b-7lk47sz9zd],
    .feature-availability[b-7lk47sz9zd] {
        border-left: none;
        border-top: 1px solid #E2E6EA;
    }
    
    .cta-actions[b-7lk47sz9zd] {
        flex-direction: column;
        align-items: stretch;
    }
}

@media (max-width: 480px) {
    .tier-comparison-page[b-7lk47sz9zd] {
        padding: 0.5rem;
    }
    
    .page-title[b-7lk47sz9zd] {
        font-size: 1.75rem;
        flex-direction: column;
        align-items: flex-start;
        gap: 0.5rem;
    }
    
    .tier-card[b-7lk47sz9zd] {
        padding: 1.5rem;
    }
    
    .price-amount[b-7lk47sz9zd] {
        font-size: 2.5rem;
    }
}
/* /Features/UserSurvey/Components/CompletionScreen.razor.rz.scp.css */
/* Modern Completion Screen Styles - Iswara Design System */
.completion-screen[b-6tjyv0owua] {
    min-height: 100vh;
    background: linear-gradient(135deg, #BFD8B8 0%, rgba(191, 216, 184, 0.3) 50%, #FFFFFF 100%);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 40px 20px;
    font-family: 'Inter', 'Segoe UI', -apple-system, BlinkMacSystemFont, sans-serif;
}

/* Enhanced Completion Card */
.completion-card[b-6tjyv0owua] {
    max-width: 800px;
    width: 100%;
    padding: 3rem;
    background: rgba(255, 255, 255, 0.95);
    backdrop-filter: blur(20px);
    border: 1px solid rgba(226, 230, 234, 0.4);
    border-radius: 24px;
    box-shadow: 
        0 12px 40px rgba(20, 33, 61, 0.08),
        0 6px 20px rgba(20, 33, 61, 0.04),
        inset 0 1px 0 rgba(255, 255, 255, 0.8);
    text-align: center;
    position: relative;
    overflow: hidden;
    animation: cardAppear-b-6tjyv0owua 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.completion-card[b-6tjyv0owua]::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 6px;
    background: linear-gradient(90deg, #C8A951 0%, #b8994a 50%, #C8A951 100%);
    opacity: 0.8;
}

@keyframes cardAppear-b-6tjyv0owua {
    0% {
        opacity: 0;
        transform: translateY(30px) scale(0.95);
    }
    60% {
        opacity: 0.8;
        transform: translateY(-5px) scale(1.01);
    }
    100% {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

/* Success Animation Header */
.completion-header[b-6tjyv0owua] {
    margin-bottom: 3rem;
    position: relative;
}

.success-animation[b-6tjyv0owua] {
    position: relative;
    margin-bottom: 2rem;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1rem;
}

.checkmark-circle[b-6tjyv0owua] {
    width: 100px;
    height: 100px;
    background: linear-gradient(135deg, #28a745 0%, #20c997 100%);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 
        0 8px 24px rgba(40, 167, 69, 0.3),
        inset 0 2px 0 rgba(255, 255, 255, 0.2);
    animation: checkmarkAppear-b-6tjyv0owua 0.8s cubic-bezier(0.34, 1.56, 0.64, 1);
    position: relative;
    overflow: hidden;
}

.checkmark-circle[b-6tjyv0owua]::before {
    content: '';
    position: absolute;
    top: -50%;
    left: -50%;
    width: 200%;
    height: 200%;
    background: linear-gradient(45deg, transparent, rgba(255, 255, 255, 0.2), transparent);
    transform: rotate(45deg);
    animation: shimmer-b-6tjyv0owua 2s ease-in-out infinite;
}

.checkmark-circle i[b-6tjyv0owua] {
    font-size: 3rem;
    color: white;
    text-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
    z-index: 1;
    position: relative;
}

@keyframes checkmarkAppear-b-6tjyv0owua {
    0% {
        opacity: 0;
        transform: scale(0.3) rotate(-45deg);
    }
    60% {
        opacity: 1;
        transform: scale(1.1) rotate(5deg);
    }
    100% {
        opacity: 1;
        transform: scale(1) rotate(0deg);
    }
}

@keyframes shimmer-b-6tjyv0owua {
    0% { 
        opacity: 0;
        transform: rotate(45deg) translate(-50%, -50%);
    }
    50% { 
        opacity: 1;
        transform: rotate(45deg) translate(0%, 0%);
    }
    100% { 
        opacity: 0;
        transform: rotate(45deg) translate(50%, 50%);
    }
}

.celebration-emoji[b-6tjyv0owua] {
    font-size: 3rem;
    animation: celebrate-b-6tjyv0owua 2s ease-in-out infinite;
    filter: drop-shadow(0 4px 8px rgba(0, 0, 0, 0.1));
}

@keyframes celebrate-b-6tjyv0owua {
    0%, 100% { 
        transform: scale(1) rotate(0deg);
    }
    25% { 
        transform: scale(1.1) rotate(5deg);
    }
    50% { 
        transform: scale(1.05) rotate(-5deg);
    }
    75% { 
        transform: scale(1.1) rotate(3deg);
    }
}

/* Enhanced Typography */
.completion-header h1[b-6tjyv0owua] {
    color: #14213D;
    font-size: 3rem;
    font-weight: 700;
    margin: 0 0 1rem 0;
    line-height: 1.1;
    letter-spacing: -0.02em;
    text-shadow: 0 2px 4px rgba(20, 33, 61, 0.1);
    animation: titleAppear-b-6tjyv0owua 1s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0.3s both;
}

.completion-subtitle[b-6tjyv0owua] {
    color: #2E2E2E;
    font-size: 1.3rem;
    line-height: 1.5;
    margin: 0;
    font-weight: 400;
    animation: subtitleAppear-b-6tjyv0owua 1s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0.5s both;
}

@keyframes titleAppear-b-6tjyv0owua {
    0% {
        opacity: 0;
        transform: translateY(20px);
    }
    100% {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes subtitleAppear-b-6tjyv0owua {
    0% {
        opacity: 0;
        transform: translateY(15px);
    }
    100% {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Enhanced Statistics Section */
.completion-stats[b-6tjyv0owua] {
    margin-bottom: 3rem;
    animation: statsAppear-b-6tjyv0owua 1s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0.7s both;
}

.stats-grid[b-6tjyv0owua] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 1.5rem;
    margin-bottom: 2rem;
}

.stat-item[b-6tjyv0owua] {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 1.5rem;
    background: linear-gradient(135deg, rgba(200, 169, 81, 0.08) 0%, rgba(200, 169, 81, 0.04) 100%);
    border: 1px solid rgba(200, 169, 81, 0.2);
    border-radius: 16px;
    backdrop-filter: blur(10px);
    box-shadow: 
        0 4px 16px rgba(20, 33, 61, 0.06),
        inset 0 1px 0 rgba(255, 255, 255, 0.8);
    transition: all 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    position: relative;
    overflow: hidden;
}

.stat-item[b-6tjyv0owua]::before {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, transparent, rgba(200, 169, 81, 0.1), transparent);
    transition: left 0.6s ease;
}

.stat-item:hover[b-6tjyv0owua] {
    transform: translateY(-2px);
    box-shadow: 
        0 6px 20px rgba(20, 33, 61, 0.1),
        inset 0 1px 0 rgba(255, 255, 255, 0.9);
}

.stat-item:hover[b-6tjyv0owua]::before {
    left: 100%;
}

.stat-item i[b-6tjyv0owua] {
    font-size: 2rem;
    color: #C8A951;
    flex-shrink: 0;
    filter: drop-shadow(0 2px 4px rgba(200, 169, 81, 0.3));
}

.stat-content[b-6tjyv0owua] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    text-align: left;
}

.stat-value[b-6tjyv0owua] {
    font-size: 1.8rem;
    font-weight: 700;
    color: #14213D;
    line-height: 1;
    margin-bottom: 0.25rem;
}

.stat-label[b-6tjyv0owua] {
    font-size: 0.9rem;
    color: #6c757d;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

@keyframes statsAppear-b-6tjyv0owua {
    0% {
        opacity: 0;
        transform: translateY(20px);
    }
    100% {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Enhanced Message Section */
.completion-message[b-6tjyv0owua] {
    margin-bottom: 3rem;
    animation: messageAppear-b-6tjyv0owua 1s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0.9s both;
}

.custom-message[b-6tjyv0owua],
.default-message[b-6tjyv0owua] {
    display: flex;
    align-items: flex-start;
    gap: 1rem;
    padding: 1.5rem;
    background: linear-gradient(135deg, rgba(191, 216, 184, 0.15) 0%, rgba(191, 216, 184, 0.08) 100%);
    border: 1px solid rgba(191, 216, 184, 0.3);
    border-radius: 16px;
    backdrop-filter: blur(10px);
    box-shadow: 
        0 4px 16px rgba(20, 33, 61, 0.06),
        inset 0 1px 0 rgba(255, 255, 255, 0.8);
    text-align: left;
}

.custom-message i[b-6tjyv0owua],
.default-message i[b-6tjyv0owua] {
    color: #C8A951;
    font-size: 1.5rem;
    margin-top: 0.25rem;
    flex-shrink: 0;
}

.custom-message p[b-6tjyv0owua],
.default-message p[b-6tjyv0owua] {
    color: #2E2E2E;
    font-size: 1.1rem;
    line-height: 1.6;
    margin: 0;
    font-weight: 400;
}

@keyframes messageAppear-b-6tjyv0owua {
    0% {
        opacity: 0;
        transform: translateY(20px);
    }
    100% {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Results Preview Section */
.results-preview[b-6tjyv0owua] {
    margin-bottom: 3rem;
    text-align: left;
}

.results-preview h5[b-6tjyv0owua] {
    color: #14213D;
    font-size: 1.5rem;
    font-weight: 600;
    margin-bottom: 1.5rem;
    text-align: center;
}

.risk-indicators[b-6tjyv0owua] {
    display: grid;
    gap: 1rem;
    margin-bottom: 1.5rem;
}

.risk-category[b-6tjyv0owua] {
    padding: 1rem;
    background: rgba(255, 255, 255, 0.6);
    border-radius: 12px;
    border: 1px solid rgba(226, 230, 234, 0.4);
}

.category-header[b-6tjyv0owua] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 0.5rem;
}

.category-name[b-6tjyv0owua] {
    font-weight: 600;
    color: #14213D;
}

.risk-level[b-6tjyv0owua] {
    padding: 0.25rem 0.75rem;
    border-radius: 12px;
    font-size: 0.8rem;
    font-weight: 600;
    text-transform: uppercase;
}

.risk-high[b-6tjyv0owua] {
    background: rgba(220, 53, 69, 0.1);
    color: #dc3545;
    border: 1px solid rgba(220, 53, 69, 0.3);
}

.risk-moderate[b-6tjyv0owua] {
    background: rgba(255, 193, 7, 0.1);
    color: #856404;
    border: 1px solid rgba(255, 193, 7, 0.3);
}

.risk-low[b-6tjyv0owua] {
    background: rgba(200, 169, 81, 0.1);
    color: #C8A951;
    border: 1px solid rgba(200, 169, 81, 0.3);
}

.risk-minimal[b-6tjyv0owua] {
    background: rgba(40, 167, 69, 0.1);
    color: #28a745;
    border: 1px solid rgba(40, 167, 69, 0.3);
}

.risk-bar[b-6tjyv0owua] {
    height: 8px;
    background: rgba(226, 230, 234, 0.4);
    border-radius: 4px;
    overflow: hidden;
}

.risk-fill[b-6tjyv0owua] {
    height: 100%;
    border-radius: 4px;
    transition: width 1s ease-out;
}

.risk-fill.risk-high[b-6tjyv0owua] {
    background: linear-gradient(90deg, #dc3545, #c82333);
}

.risk-fill.risk-moderate[b-6tjyv0owua] {
    background: linear-gradient(90deg, #ffc107, #e0a800);
}

.risk-fill.risk-low[b-6tjyv0owua] {
    background: linear-gradient(90deg, #C8A951, #b8994a);
}

.risk-fill.risk-minimal[b-6tjyv0owua] {
    background: linear-gradient(90deg, #28a745, #20c997);
}

.results-note[b-6tjyv0owua] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 1rem;
    background: rgba(200, 169, 81, 0.08);
    border: 1px solid rgba(200, 169, 81, 0.2);
    border-radius: 12px;
    margin-top: 1rem;
}

.results-note i[b-6tjyv0owua] {
    color: #C8A951;
    font-size: 1.2rem;
}

.results-note p[b-6tjyv0owua] {
    color: #2E2E2E;
    margin: 0;
    font-size: 0.9rem;
    font-style: italic;
}

/* Next Steps Section */
.next-steps[b-6tjyv0owua] {
    margin-bottom: 3rem;
    text-align: left;
    animation: stepsAppear-b-6tjyv0owua 1s cubic-bezier(0.25, 0.46, 0.45, 0.94) 1.1s both;
}

.next-steps h5[b-6tjyv0owua] {
    color: #14213D;
    font-size: 1.5rem;
    font-weight: 600;
    margin-bottom: 1.5rem;
    text-align: center;
}

.steps-list[b-6tjyv0owua] {
    display: grid;
    gap: 1.5rem;
}

.step-item[b-6tjyv0owua] {
    display: flex;
    gap: 1rem;
    padding: 1.5rem;
    background: rgba(255, 255, 255, 0.6);
    border: 1px solid rgba(226, 230, 234, 0.4);
    border-radius: 16px;
    backdrop-filter: blur(10px);
    box-shadow: 
        0 2px 8px rgba(20, 33, 61, 0.04),
        inset 0 1px 0 rgba(255, 255, 255, 0.8);
    transition: all 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.step-item:hover[b-6tjyv0owua] {
    transform: translateY(-2px);
    box-shadow: 
        0 4px 16px rgba(20, 33, 61, 0.08),
        inset 0 1px 0 rgba(255, 255, 255, 0.9);
}

.step-number[b-6tjyv0owua] {
    width: 40px;
    height: 40px;
    background: linear-gradient(135deg, #C8A951 0%, #b8994a 100%);
    color: white;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: 1.1rem;
    flex-shrink: 0;
    box-shadow: 
        0 4px 12px rgba(200, 169, 81, 0.3),
        inset 0 1px 0 rgba(255, 255, 255, 0.2);
}

.step-content[b-6tjyv0owua] {
    flex: 1;
}

.step-content strong[b-6tjyv0owua] {
    color: #14213D;
    font-size: 1.1rem;
    font-weight: 600;
    display: block;
    margin-bottom: 0.5rem;
}

.step-content p[b-6tjyv0owua] {
    color: #2E2E2E;
    margin: 0;
    line-height: 1.5;
    font-size: 0.95rem;
}

@keyframes stepsAppear-b-6tjyv0owua {
    0% {
        opacity: 0;
        transform: translateY(20px);
    }
    100% {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Enhanced Action Buttons */
.completion-actions[b-6tjyv0owua] {
    display: flex;
    justify-content: center;
    gap: 1rem;
    margin-bottom: 2rem;
    flex-wrap: wrap;
    animation: actionsAppear-b-6tjyv0owua 1s cubic-bezier(0.25, 0.46, 0.45, 0.94) 1.3s both;
}

.certificate-button[b-6tjyv0owua] {
    background: linear-gradient(135deg, #6c757d 0%, #5a6268 100%);
    border-color: #6c757d;
    color: white;
    font-weight: 600;
    padding: 12px 24px;
    border-radius: 50px;
    min-width: 180px;
    box-shadow: 
        0 4px 16px rgba(108, 117, 125, 0.3),
        inset 0 1px 0 rgba(255, 255, 255, 0.2);
    transition: all 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.certificate-button:hover[b-6tjyv0owua] {
    background: linear-gradient(135deg, #5a6268 0%, #6c757d 100%);
    transform: translateY(-2px) scale(1.02);
    box-shadow: 
        0 6px 20px rgba(108, 117, 125, 0.4),
        inset 0 1px 0 rgba(255, 255, 255, 0.3);
}

.feedback-button[b-6tjyv0owua] {
    background: transparent;
    border: 2px solid #C8A951;
    color: #C8A951;
    font-weight: 600;
    padding: 10px 24px;
    border-radius: 50px;
    min-width: 160px;
    backdrop-filter: blur(10px);
    transition: all 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    position: relative;
    overflow: hidden;
}

.feedback-button[b-6tjyv0owua]::before {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(135deg, #C8A951 0%, #b8994a 100%);
    transition: left 0.4s ease;
    z-index: -1;
}

.feedback-button:hover[b-6tjyv0owua] {
    color: white;
    border-color: #C8A951;
    transform: translateY(-2px) scale(1.02);
    box-shadow: 0 6px 20px rgba(200, 169, 81, 0.3);
}

.feedback-button:hover[b-6tjyv0owua]::before {
    left: 0;
}

.exit-button[b-6tjyv0owua] {
    background: linear-gradient(135deg, #C8A951 0%, #b8994a 100%);
    border-color: #C8A951;
    color: white;
    font-weight: 600;
    padding: 12px 32px;
    border-radius: 50px;
    min-width: 200px;
    box-shadow: 
        0 4px 16px rgba(200, 169, 81, 0.3),
        inset 0 1px 0 rgba(255, 255, 255, 0.2);
    transition: all 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    position: relative;
    overflow: hidden;
}

.exit-button[b-6tjyv0owua]::before {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.2), transparent);
    transition: left 0.6s ease;
}

.exit-button:hover[b-6tjyv0owua] {
    background: linear-gradient(135deg, #b8994a 0%, #C8A951 100%);
    transform: translateY(-2px) scale(1.02);
    box-shadow: 
        0 6px 20px rgba(200, 169, 81, 0.4),
        inset 0 1px 0 rgba(255, 255, 255, 0.3);
}

.exit-button:hover[b-6tjyv0owua]::before {
    left: 100%;
}

@keyframes actionsAppear-b-6tjyv0owua {
    0% {
        opacity: 0;
        transform: translateY(20px);
    }
    100% {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Confidentiality Reminder */
.confidentiality-reminder[b-6tjyv0owua] {
    animation: reminderAppear-b-6tjyv0owua 1s cubic-bezier(0.25, 0.46, 0.45, 0.94) 1.5s both;
}

.reminder-content[b-6tjyv0owua] {
    display: flex;
    align-items: flex-start;
    gap: 1rem;
    padding: 1.5rem;
    background: linear-gradient(135deg, rgba(191, 216, 184, 0.12) 0%, rgba(191, 216, 184, 0.06) 100%);
    border: 1px solid rgba(191, 216, 184, 0.3);
    border-radius: 16px;
    backdrop-filter: blur(10px);
    box-shadow: 
        0 4px 16px rgba(20, 33, 61, 0.06),
        inset 0 1px 0 rgba(255, 255, 255, 0.8);
    text-align: left;
}

.reminder-content i[b-6tjyv0owua] {
    color: #C8A951;
    font-size: 1.5rem;
    margin-top: 0.25rem;
    flex-shrink: 0;
}

.reminder-content strong[b-6tjyv0owua] {
    color: #14213D;
    font-size: 1.1rem;
    font-weight: 600;
    display: block;
    margin-bottom: 0.5rem;
}

.reminder-content p[b-6tjyv0owua] {
    color: #2E2E2E;
    margin: 0;
    line-height: 1.5;
    font-size: 0.95rem;
}

@keyframes reminderAppear-b-6tjyv0owua {
    0% {
        opacity: 0;
        transform: translateY(20px);
    }
    100% {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Feedback Modal */
.feedback-modal[b-6tjyv0owua] {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5);
    backdrop-filter: blur(5px);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 10000;
    padding: 20px;
    animation: modalAppear-b-6tjyv0owua 0.3s ease-out;
}

.feedback-form[b-6tjyv0owua] {
    max-width: 500px;
    width: 100%;
    background: rgba(255, 255, 255, 0.95);
    backdrop-filter: blur(20px);
    border: 1px solid rgba(226, 230, 234, 0.4);
    border-radius: 20px;
    box-shadow: 
        0 12px 40px rgba(20, 33, 61, 0.15),
        inset 0 1px 0 rgba(255, 255, 255, 0.8);
    animation: formSlideIn-b-6tjyv0owua 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.feedback-header[b-6tjyv0owua] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1.5rem 1.5rem 0 1.5rem;
    margin-bottom: 1rem;
}

.feedback-header h4[b-6tjyv0owua] {
    color: #14213D;
    font-size: 1.3rem;
    font-weight: 600;
    margin: 0;
}

.close-feedback[b-6tjyv0owua] {
    background: transparent;
    border: 1px solid rgba(108, 117, 125, 0.3);
    color: #6c757d;
    padding: 8px;
    border-radius: 50%;
    width: 36px;
    height: 36px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s ease;
}

.close-feedback:hover[b-6tjyv0owua] {
    background: rgba(108, 117, 125, 0.1);
    border-color: #6c757d;
    color: #495057;
}

.feedback-content[b-6tjyv0owua] {
    padding: 0 1.5rem 1.5rem 1.5rem;
}

.feedback-content p[b-6tjyv0owua] {
    color: #2E2E2E;
    margin-bottom: 1rem;
    font-size: 1rem;
}

.feedback-textarea[b-6tjyv0owua] {
    width: 100%;
    min-height: 120px;
    resize: vertical;
    border-radius: 12px;
    border: 2px solid rgba(226, 230, 234, 0.6);
    padding: 12px;
    font-size: 1rem;
    line-height: 1.5;
    background: rgba(255, 255, 255, 0.8);
    backdrop-filter: blur(10px);
    transition: all 0.3s ease;
    margin-bottom: 1rem;
}

.feedback-textarea:focus[b-6tjyv0owua] {
    border-color: #C8A951;
    box-shadow: 
        0 4px 16px rgba(200, 169, 81, 0.2),
        0 0 0 3px rgba(200, 169, 81, 0.1);
    outline: none;
}

.feedback-actions[b-6tjyv0owua] {
    display: flex;
    gap: 0.75rem;
    justify-content: flex-end;
}

@keyframes modalAppear-b-6tjyv0owua {
    0% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}

@keyframes formSlideIn-b-6tjyv0owua {
    0% {
        opacity: 0;
        transform: translateY(-30px) scale(0.95);
    }
    100% {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

/* Responsive Design */
@media (max-width: 768px) {
    .completion-screen[b-6tjyv0owua] {
        padding: 20px 15px;
    }
    
    .completion-card[b-6tjyv0owua] {
        padding: 2rem 1.5rem;
        border-radius: 20px;
    }
    
    .completion-header h1[b-6tjyv0owua] {
        font-size: 2.2rem;
    }
    
    .completion-subtitle[b-6tjyv0owua] {
        font-size: 1.1rem;
    }
    
    .checkmark-circle[b-6tjyv0owua] {
        width: 80px;
        height: 80px;
    }
    
    .checkmark-circle i[b-6tjyv0owua] {
        font-size: 2.5rem;
    }
    
    .celebration-emoji[b-6tjyv0owua] {
        font-size: 2.5rem;
    }
    
    .stats-grid[b-6tjyv0owua] {
        grid-template-columns: 1fr;
        gap: 1rem;
    }
    
    .stat-item[b-6tjyv0owua] {
        padding: 1.2rem;
        text-align: center;
        flex-direction: column;
        gap: 0.75rem;
    }
    
    .stat-content[b-6tjyv0owua] {
        align-items: center;
        text-align: center;
    }
    
    .completion-actions[b-6tjyv0owua] {
        flex-direction: column;
        align-items: center;
    }
    
    .certificate-button[b-6tjyv0owua],
    .feedback-button[b-6tjyv0owua],
    .exit-button[b-6tjyv0owua] {
        width: 100%;
        max-width: 280px;
    }
    
    .feedback-modal[b-6tjyv0owua] {
        padding: 15px;
    }
    
    .feedback-form[b-6tjyv0owua] {
        max-width: none;
    }
}

@media (max-width: 480px) {
    .completion-card[b-6tjyv0owua] {
        padding: 1.5rem 1rem;
        border-radius: 16px;
    }
    
    .completion-header h1[b-6tjyv0owua] {
        font-size: 2rem;
    }
    
    .completion-subtitle[b-6tjyv0owua] {
        font-size: 1rem;
    }
    
    .checkmark-circle[b-6tjyv0owua] {
        width: 70px;
        height: 70px;
    }
    
    .checkmark-circle i[b-6tjyv0owua] {
        font-size: 2rem;
    }
    
    .celebration-emoji[b-6tjyv0owua] {
        font-size: 2rem;
    }
    
    .stat-value[b-6tjyv0owua] {
        font-size: 1.5rem;
    }
    
    .step-item[b-6tjyv0owua] {
        padding: 1rem;
        gap: 0.75rem;
    }
    
    .step-number[b-6tjyv0owua] {
        width: 35px;
        height: 35px;
        font-size: 1rem;
    }
    
    .next-steps h5[b-6tjyv0owua],
    .results-preview h5[b-6tjyv0owua] {
        font-size: 1.3rem;
    }
}

/* Focus states for accessibility */
.certificate-button:focus[b-6tjyv0owua],
.feedback-button:focus[b-6tjyv0owua],
.exit-button:focus[b-6tjyv0owua],
.close-feedback:focus[b-6tjyv0owua] {
    outline: 2px solid #C8A951;
    outline-offset: 2px;
}

/* High contrast mode support */
@media (prefers-contrast: high) {
    .completion-card[b-6tjyv0owua] {
        border: 2px solid #000;
        background: #fff;
    }
    
    .checkmark-circle[b-6tjyv0owua] {
        background: #000;
        color: #fff;
    }
    
    .stat-item[b-6tjyv0owua],
    .step-item[b-6tjyv0owua] {
        border: 1px solid #000;
    }
}

/* Reduced motion support */
@media (prefers-reduced-motion: reduce) {
    *[b-6tjyv0owua] {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
    }
    
    .certificate-button:hover[b-6tjyv0owua],
    .feedback-button:hover[b-6tjyv0owua],
    .exit-button:hover[b-6tjyv0owua],
    .stat-item:hover[b-6tjyv0owua],
    .step-item:hover[b-6tjyv0owua] {
        transform: none;
    }
}
/* /Features/UserSurvey/Components/EmojiReaction.razor.rz.scp.css */
/* Emoji reaction overlay with dynamic emotional backgrounds */
.emoji-reaction-container[b-q2pd1uyhkt] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 2000;
    opacity: 0;
    visibility: hidden;
    transform: scale(0.8);
    transition: all 0.4s cubic-bezier(0.34, 1.56, 0.64, 1);
    pointer-events: none;
    backdrop-filter: blur(2px);
}

.emoji-reaction-container.visible[b-q2pd1uyhkt] {
    opacity: 1;
    visibility: visible;
    transform: scale(1);
}

/* Ensure only one emoji container is shown */
.emoji-reaction-container:not(.visible)[b-q2pd1uyhkt] {
    display: none !important;
}

/* Dynamic emotional backgrounds */
.emoji-reaction-container.bg-happy[b-q2pd1uyhkt] {
    background: linear-gradient(135deg, 
        rgba(255, 223, 0, 0.15) 0%, 
        rgba(255, 165, 0, 0.12) 25%,
        rgba(255, 192, 203, 0.1) 50%,
        rgba(135, 206, 235, 0.08) 75%,
        rgba(152, 251, 152, 0.1) 100%);
}

.emoji-reaction-container.bg-sad[b-q2pd1uyhkt] {
    background: linear-gradient(135deg, 
        rgba(105, 105, 105, 0.2) 0%, 
        rgba(70, 130, 180, 0.15) 25%,
        rgba(176, 196, 222, 0.12) 50%,
        rgba(169, 169, 169, 0.1) 75%,
        rgba(128, 128, 128, 0.08) 100%);
}

.emoji-reaction-container.bg-neutral[b-q2pd1uyhkt] {
    background: linear-gradient(135deg, 
        rgba(200, 169, 81, 0.1) 0%, 
        rgba(191, 216, 184, 0.08) 25%,
        rgba(226, 230, 234, 0.12) 50%,
        rgba(200, 169, 81, 0.06) 75%,
        rgba(255, 255, 255, 0.1) 100%);
}

.emoji-main[b-q2pd1uyhkt] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    position: relative;
    z-index: 10;
}

.emoji-icon[b-q2pd1uyhkt] {
    font-size: 6rem;
    line-height: 1;
    margin-bottom: 1rem;
    filter: drop-shadow(0 4px 12px rgba(0, 0, 0, 0.1));
    position: relative;
}

/* Floating emoji particles around main emoji */
.emoji-particles[b-q2pd1uyhkt] {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 200px;
    height: 200px;
    pointer-events: none;
}

.emoji-particle[b-q2pd1uyhkt] {
    position: absolute;
    font-size: 1.5rem;
    opacity: 0;
    animation: floatAround-b-q2pd1uyhkt 3s ease-in-out infinite;
}

.emoji-particle.particle-0[b-q2pd1uyhkt] {
    top: 10%;
    left: 20%;
    animation-delay: 0s;
}

.emoji-particle.particle-1[b-q2pd1uyhkt] {
    top: 20%;
    right: 15%;
    animation-delay: 0.5s;
}

.emoji-particle.particle-2[b-q2pd1uyhkt] {
    bottom: 20%;
    left: 15%;
    animation-delay: 1s;
}

.emoji-particle.particle-3[b-q2pd1uyhkt] {
    bottom: 10%;
    right: 20%;
    animation-delay: 1.5s;
}

.emoji-particle.particle-4[b-q2pd1uyhkt] {
    top: 50%;
    left: 5%;
    animation-delay: 2s;
}

.emoji-particle.particle-5[b-q2pd1uyhkt] {
    top: 50%;
    right: 5%;
    animation-delay: 2.5s;
}

@keyframes floatAround-b-q2pd1uyhkt {
    0%, 100% {
        opacity: 0;
        transform: translateY(0) scale(0.5);
    }
    20% {
        opacity: 1;
        transform: translateY(-10px) scale(1);
    }
    80% {
        opacity: 1;
        transform: translateY(-5px) scale(1);
    }
}

.reaction-text[b-q2pd1uyhkt] {
    font-size: 1.5rem;
    font-weight: 600;
    text-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
    margin-top: 0.5rem;
}

/* Dynamic text colors based on mood */
.reaction-text.text-happy[b-q2pd1uyhkt] {
    color: #FF6B35;
    background: linear-gradient(45deg, #FFD700, #FF6B35);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

.reaction-text.text-sad[b-q2pd1uyhkt] {
    color: #4682B4;
    background: linear-gradient(45deg, #4682B4, #708090);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

.reaction-text.text-neutral[b-q2pd1uyhkt] {
    color: #14213D;
    background: linear-gradient(45deg, #C8A951, #14213D);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

/* Main emoji animations */
.bounce-positive[b-q2pd1uyhkt] {
    animation: joyfulBounce-b-q2pd1uyhkt 1.5s ease-in-out infinite;
}

.pulse-neutral[b-q2pd1uyhkt] {
    animation: thoughtfulPulse-b-q2pd1uyhkt 2s ease-in-out infinite;
}

.shake-negative[b-q2pd1uyhkt] {
    animation: worriedShake-b-q2pd1uyhkt 1s ease-in-out infinite;
}

@keyframes joyfulBounce-b-q2pd1uyhkt {
    0%, 100% {
        transform: translateY(0) scale(1) rotate(0deg);
    }
    25% {
        transform: translateY(-25px) scale(1.1) rotate(3deg);
    }
    50% {
        transform: translateY(-15px) scale(1.05) rotate(-2deg);
    }
    75% {
        transform: translateY(-20px) scale(1.08) rotate(1deg);
    }
}

@keyframes thoughtfulPulse-b-q2pd1uyhkt {
    0%, 100% {
        transform: scale(1);
        filter: drop-shadow(0 4px 12px rgba(0, 0, 0, 0.1));
    }
    50% {
        transform: scale(1.05);
        filter: drop-shadow(0 6px 16px rgba(0, 0, 0, 0.15));
    }
}

@keyframes worriedShake-b-q2pd1uyhkt {
    0%, 100% {
        transform: translateX(0) scale(1);
    }
    10% {
        transform: translateX(-8px) scale(1.02);
    }
    20% {
        transform: translateX(8px) scale(0.98);
    }
    30% {
        transform: translateX(-6px) scale(1.01);
    }
    40% {
        transform: translateX(6px) scale(0.99);
    }
    50% {
        transform: translateX(-4px) scale(1.01);
    }
    60% {
        transform: translateX(4px) scale(0.99);
    }
    70% {
        transform: translateX(-2px) scale(1);
    }
    80% {
        transform: translateX(2px) scale(1);
    }
    90% {
        transform: translateX(-1px) scale(1);
    }
}

/* Background mood effects */
.mood-background[b-q2pd1uyhkt] {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    overflow: hidden;
    z-index: 1;
    pointer-events: none;
}

/* Happy sparkles floating around */
.happy-sparkles[b-q2pd1uyhkt] {
    position: absolute;
    width: 100%;
    height: 100%;
}

.sparkle[b-q2pd1uyhkt] {
    position: absolute;
    font-size: 2rem;
    opacity: 0;
    animation: sparkleFloat-b-q2pd1uyhkt 4s ease-in-out infinite;
}

.sparkle.sparkle-0[b-q2pd1uyhkt] { top: 10%; left: 10%; animation-delay: 0s; }
.sparkle.sparkle-1[b-q2pd1uyhkt] { top: 20%; right: 15%; animation-delay: 0.5s; }
.sparkle.sparkle-2[b-q2pd1uyhkt] { top: 30%; left: 80%; animation-delay: 1s; }
.sparkle.sparkle-3[b-q2pd1uyhkt] { bottom: 30%; left: 20%; animation-delay: 1.5s; }
.sparkle.sparkle-4[b-q2pd1uyhkt] { bottom: 20%; right: 25%; animation-delay: 2s; }
.sparkle.sparkle-5[b-q2pd1uyhkt] { top: 60%; left: 5%; animation-delay: 2.5s; }
.sparkle.sparkle-6[b-q2pd1uyhkt] { top: 70%; right: 10%; animation-delay: 3s; }
.sparkle.sparkle-7[b-q2pd1uyhkt] { bottom: 50%; left: 70%; animation-delay: 3.5s; }
.sparkle.sparkle-8[b-q2pd1uyhkt] { top: 15%; left: 50%; animation-delay: 0.3s; }
.sparkle.sparkle-9[b-q2pd1uyhkt] { bottom: 15%; right: 50%; animation-delay: 0.8s; }
.sparkle.sparkle-10[b-q2pd1uyhkt] { top: 80%; left: 30%; animation-delay: 1.3s; }
.sparkle.sparkle-11[b-q2pd1uyhkt] { bottom: 80%; right: 40%; animation-delay: 1.8s; }

@keyframes sparkleFloat-b-q2pd1uyhkt {
    0%, 100% {
        opacity: 0;
        transform: translateY(0) rotate(0deg) scale(0.5);
    }
    25% {
        opacity: 1;
        transform: translateY(-20px) rotate(90deg) scale(1);
    }
    75% {
        opacity: 1;
        transform: translateY(-10px) rotate(270deg) scale(1);
    }
}

/* Sad clouds drifting */
.sad-clouds[b-q2pd1uyhkt] {
    position: absolute;
    width: 100%;
    height: 100%;
}

.cloud[b-q2pd1uyhkt] {
    position: absolute;
    font-size: 3rem;
    opacity: 0;
    animation: cloudDrift-b-q2pd1uyhkt 6s ease-in-out infinite;
}

.cloud.cloud-0[b-q2pd1uyhkt] { top: 20%; left: -10%; animation-delay: 0s; }
.cloud.cloud-1[b-q2pd1uyhkt] { top: 40%; left: -15%; animation-delay: 1s; }
.cloud.cloud-2[b-q2pd1uyhkt] { top: 60%; left: -20%; animation-delay: 2s; }
.cloud.cloud-3[b-q2pd1uyhkt] { top: 30%; left: -5%; animation-delay: 3s; }
.cloud.cloud-4[b-q2pd1uyhkt] { top: 70%; left: -25%; animation-delay: 4s; }
.cloud.cloud-5[b-q2pd1uyhkt] { top: 50%; left: -12%; animation-delay: 5s; }

@keyframes cloudDrift-b-q2pd1uyhkt {
    0% {
        opacity: 0;
        transform: translateX(0);
    }
    20% {
        opacity: 0.6;
    }
    80% {
        opacity: 0.6;
    }
    100% {
        opacity: 0;
        transform: translateX(calc(100vw + 200px));
    }
}

/* Neutral dots pattern */
.neutral-dots[b-q2pd1uyhkt] {
    position: absolute;
    width: 100%;
    height: 100%;
}

.dot[b-q2pd1uyhkt] {
    position: absolute;
    font-size: 4rem;
    color: rgba(200, 169, 81, 0.3);
    opacity: 0;
    animation: dotPulse-b-q2pd1uyhkt 3s ease-in-out infinite;
}

.dot.dot-0[b-q2pd1uyhkt] { top: 20%; left: 20%; animation-delay: 0s; }
.dot.dot-1[b-q2pd1uyhkt] { top: 30%; right: 20%; animation-delay: 0.5s; }
.dot.dot-2[b-q2pd1uyhkt] { bottom: 30%; left: 30%; animation-delay: 1s; }
.dot.dot-3[b-q2pd1uyhkt] { bottom: 20%; right: 30%; animation-delay: 1.5s; }
.dot.dot-4[b-q2pd1uyhkt] { top: 60%; left: 60%; animation-delay: 2s; }
.dot.dot-5[b-q2pd1uyhkt] { top: 70%; right: 60%; animation-delay: 2.5s; }
.dot.dot-6[b-q2pd1uyhkt] { bottom: 60%; left: 70%; animation-delay: 1.2s; }
.dot.dot-7[b-q2pd1uyhkt] { bottom: 70%; right: 70%; animation-delay: 0.7s; }

@keyframes dotPulse-b-q2pd1uyhkt {
    0%, 100% {
        opacity: 0;
        transform: scale(0.5);
    }
    50% {
        opacity: 0.6;
        transform: scale(1);
    }
}

/* Mobile responsive */
@media (max-width: 768px) {
    .emoji-icon[b-q2pd1uyhkt] {
        font-size: 4rem;
    }
    
    .reaction-text[b-q2pd1uyhkt] {
        font-size: 1.2rem;
    }
    
    .emoji-particles[b-q2pd1uyhkt] {
        width: 150px;
        height: 150px;
    }
    
    .emoji-particle[b-q2pd1uyhkt] {
        font-size: 1.2rem;
    }
    
    .sparkle[b-q2pd1uyhkt] {
        font-size: 1.5rem;
    }
    
    .cloud[b-q2pd1uyhkt] {
        font-size: 2rem;
    }
    
    .dot[b-q2pd1uyhkt] {
        font-size: 3rem;
    }
}

/* Reduced motion support */
@media (prefers-reduced-motion: reduce) {
    .bounce-positive[b-q2pd1uyhkt],
    .pulse-neutral[b-q2pd1uyhkt],
    .shake-negative[b-q2pd1uyhkt],
    .emoji-particle[b-q2pd1uyhkt],
    .sparkle[b-q2pd1uyhkt],
    .cloud[b-q2pd1uyhkt],
    .dot[b-q2pd1uyhkt] {
        animation: none !important;
    }
    
    .emoji-reaction-container[b-q2pd1uyhkt] {
        transition: opacity 0.2s ease;
    }
    
    .emoji-particle[b-q2pd1uyhkt],
    .sparkle[b-q2pd1uyhkt],
    .cloud[b-q2pd1uyhkt],
    .dot[b-q2pd1uyhkt] {
        opacity: 0.3 !important;
    }
}
/* /Features/UserSurvey/Components/ProgressIndicator.razor.rz.scp.css */
/* Simple White Progress Indicator */

.progress-indicator[b-s8w5m0mxtz] {
    background: white;
    border-radius: 8px;
    margin: 0 20px 20px;
    padding: 0;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}

.progress-header[b-s8w5m0mxtz] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 16px 20px;
    color: #14213D;
    background: #14213D;
    border-radius: 8px 8px 0 0;
}

.progress-info[b-s8w5m0mxtz] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.progress-text[b-s8w5m0mxtz] {
    font-size: 1rem;
    font-weight: 600;
    color: white;
}

.time-remaining[b-s8w5m0mxtz] {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 0.8rem;
    color: rgba(255, 255, 255, 0.8);
}

.time-remaining i[b-s8w5m0mxtz] {
    color: #C8A951;
    font-size: 0.75rem;
}

.session-timer[b-s8w5m0mxtz] {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 0.8rem;
    color: rgba(255, 255, 255, 0.9);
}

.session-timer i[b-s8w5m0mxtz] {
    color: #C8A951;
}

/* Simple Progress Bar */
.progress-bar-container[b-s8w5m0mxtz] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 16px 20px;
    background: white;
}

.progress-bar[b-s8w5m0mxtz] {
    flex: 1;
    height: 8px;
    background: #e9ecef;
    border-radius: 4px;
    overflow: hidden;
}

.progress-fill[b-s8w5m0mxtz] {
    height: 100%;
    border-radius: 4px;
    transition: width 0.3s ease;
}

.progress-start[b-s8w5m0mxtz],
.progress-low[b-s8w5m0mxtz] {
    background: #fd7e14;
}

.progress-medium[b-s8w5m0mxtz] {
    background: #ffc107;
}

.progress-high[b-s8w5m0mxtz],
.progress-complete[b-s8w5m0mxtz] {
    background: #28a745;
}

.progress-percentage[b-s8w5m0mxtz] {
    font-size: 0.9rem;
    font-weight: 600;
    color: #14213D;
    min-width: 40px;
    text-align: right;
}

/* Simple Progress Dots */
.progress-dots[b-s8w5m0mxtz] {
    display: flex;
    justify-content: center;
    gap: 6px;
    padding: 16px 20px;
    background: white;
    border-radius: 0 0 8px 8px;
}

.progress-dot[b-s8w5m0mxtz] {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    transition: all 0.2s ease;
}

.progress-dot.completed[b-s8w5m0mxtz] {
    background: #28a745;
}

.progress-dot.current[b-s8w5m0mxtz] {
    background: #C8A951;
    transform: scale(1.2);
}

.progress-dot.pending[b-s8w5m0mxtz] {
    background: rgba(255, 255, 255, 0.3);
}

/* Warning and Status - Simple */
.timeout-warning[b-s8w5m0mxtz] {
    background: rgba(255, 193, 7, 0.9);
    border-radius: 8px;
    padding: 12px;
    margin: 8px 20px;
    color: #856404;
}

.warning-content[b-s8w5m0mxtz] {
    display: flex;
    align-items: center;
    gap: 12px;
    font-size: 0.9rem;
}

.warning-content i[b-s8w5m0mxtz] {
    color: #dc3545;
}

.autosave-indicator[b-s8w5m0mxtz] {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 4px 8px;
    border-radius: 12px;
    font-size: 0.75rem;
    position: absolute;
    top: 8px;
    right: 8px;
}

.autosave-saving[b-s8w5m0mxtz] {
    background: rgba(23, 162, 184, 0.8);
    color: white;
}

.autosave-saved[b-s8w5m0mxtz] {
    background: rgba(40, 167, 69, 0.8);
    color: white;
}

.autosave-error[b-s8w5m0mxtz] {
    background: rgba(220, 53, 69, 0.8);
    color: white;
}

.autosave-hidden[b-s8w5m0mxtz] {
    display: none;
}

/* Mobile Responsive */
@media (max-width: 768px) {
    .progress-header[b-s8w5m0mxtz] {
        flex-direction: column;
        gap: 8px;
        text-align: center;
        padding: 10px 16px;
    }
    
    .progress-bar-container[b-s8w5m0mxtz] {
        padding: 0 16px 10px;
    }
    
    .progress-dots[b-s8w5m0mxtz] {
        gap: 4px;
        padding: 6px 16px;
    }
    
    .progress-dot[b-s8w5m0mxtz] {
        width: 6px;
        height: 6px;
    }
}
/* /Features/UserSurvey/Components/QuestionDisplay.razor.rz.scp.css */
.question-display[b-9xdbhqoi9l] {
    max-width: 900px;
    margin: 0 auto;
    padding: 25px;
    transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    position: relative;
}

.question-display.answering[b-9xdbhqoi9l] {
    pointer-events: none;
    opacity: 0.7;
    filter: blur(1px);
    transform: scale(0.99);
}

.question-display.question-hidden[b-9xdbhqoi9l] {
    pointer-events: none;
    opacity: 0;
    transform: scale(0.95) translateY(-20px);
    transition: all 0.6s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.question-display.question-hidden .question-card[b-9xdbhqoi9l] {
    transform: translateY(-30px) scale(0.9);
    opacity: 0;
    filter: blur(2px);
}

.question-display.question-entering[b-9xdbhqoi9l] {
    animation: questionAppear-b-9xdbhqoi9l 0.8s cubic-bezier(0.34, 1.56, 0.64, 1) forwards;
}

.question-display.question-entering .question-card[b-9xdbhqoi9l] {
    animation: cardSlideIn-b-9xdbhqoi9l 0.8s cubic-bezier(0.34, 1.56, 0.64, 1) forwards;
}

@keyframes questionAppear-b-9xdbhqoi9l {
    0% {
        opacity: 0;
        transform: scale(0.9) translateY(20px);
    }
    60% {
        opacity: 0.8;
        transform: scale(1.02) translateY(-5px);
    }
    100% {
        opacity: 1;
        transform: scale(1) translateY(0);
    }
}

@keyframes cardSlideIn-b-9xdbhqoi9l {
    0% {
        opacity: 0;
        transform: translateY(40px) scale(0.95);
        filter: blur(3px);
    }
    60% {
        opacity: 0.8;
        transform: translateY(-8px) scale(1.02);
        filter: blur(1px);
    }
    100% {
        opacity: 1;
        transform: translateY(0) scale(1);
        filter: blur(0);
    }
}

.question-card[b-9xdbhqoi9l] {
    padding: 2.5rem;
    border-radius: 20px;
    background: rgba(255, 255, 255, 0.95);
    backdrop-filter: blur(20px);
    box-shadow: 
        0 8px 32px rgba(20, 33, 61, 0.08),
        0 4px 16px rgba(20, 33, 61, 0.04),
        inset 0 1px 0 rgba(255, 255, 255, 0.8);
    border: 1px solid rgba(226, 230, 234, 0.4);
    transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    position: relative;
    overflow: hidden;
}

.question-card[b-9xdbhqoi9l]::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 4px;
    background: linear-gradient(90deg, #C8A951 0%, #b8994a 50%, #C8A951 100%);
    opacity: 0.8;
}

.question-card:hover[b-9xdbhqoi9l] {
    transform: translateY(-2px);
    box-shadow: 
        0 12px 40px rgba(20, 33, 61, 0.12),
        0 6px 20px rgba(20, 33, 61, 0.06),
        inset 0 1px 0 rgba(255, 255, 255, 0.9);
}

.question-header[b-9xdbhqoi9l] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 30px;
    padding-bottom: 20px;
    border-bottom: 1px solid rgba(226, 230, 234, 0.6);
    position: relative;
}

.question-header[b-9xdbhqoi9l]::after {
    content: '';
    position: absolute;
    bottom: -1px;
    left: 0;
    width: 60px;
    height: 2px;
    background: linear-gradient(90deg, #C8A951, transparent);
}

.question-number[b-9xdbhqoi9l] {
    color: #2E2E2E;
    font-weight: 600;
    font-size: 0.95rem;
    text-transform: uppercase;
    letter-spacing: 0.8px;
    background: linear-gradient(135deg, rgba(200, 169, 81, 0.1), rgba(200, 169, 81, 0.05));
    padding: 8px 16px;
    border-radius: 20px;
    border: 1px solid rgba(200, 169, 81, 0.2);
    position: relative;
    overflow: hidden;
}

.question-number[b-9xdbhqoi9l]::before {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.4), transparent);
    transition: left 0.5s ease;
}

.question-number:hover[b-9xdbhqoi9l]::before {
    left: 100%;
}

.hazard-category[b-9xdbhqoi9l] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 18px;
    background: linear-gradient(135deg, #C8A951 0%, #b8994a 100%);
    color: white;
    border-radius: 25px;
    font-size: 0.85rem;
    font-weight: 600;
    box-shadow: 
        0 4px 12px rgba(200, 169, 81, 0.3),
        inset 0 1px 0 rgba(255, 255, 255, 0.2);
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
    transition: all 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    position: relative;
    overflow: hidden;
}

.hazard-category[b-9xdbhqoi9l]::before {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.2), transparent);
    transition: left 0.6s ease;
}

.hazard-category:hover[b-9xdbhqoi9l] {
    transform: translateY(-1px);
    box-shadow: 
        0 6px 16px rgba(200, 169, 81, 0.4),
        inset 0 1px 0 rgba(255, 255, 255, 0.3);
}

.hazard-category:hover[b-9xdbhqoi9l]::before {
    left: 100%;
}

.hazard-category i[b-9xdbhqoi9l] {
    font-size: 0.9rem;
    opacity: 0.9;
}

.question-content[b-9xdbhqoi9l] {
    margin-bottom: 30px;
}

.question-text[b-9xdbhqoi9l] {
    color: #14213D;
    font-size: 1.5rem;
    font-weight: 600;
    line-height: 1.4;
    margin: 0 0 35px 0;
    letter-spacing: -0.01em;
    position: relative;
    text-shadow: 0 1px 2px rgba(20, 33, 61, 0.05);
}

.answer-section[b-9xdbhqoi9l] {
    margin-bottom: 30px;
    position: relative;
}

/* Enhanced Multiple Choice and Scale Options */
.answer-options[b-9xdbhqoi9l] {
    display: grid;
    gap: 16px;
    transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    position: relative;
}

.answer-options.has-selection .answer-option:not(.selected)[b-9xdbhqoi9l] {
    opacity: 0.5;
    transform: scale(0.97);
    filter: blur(0.5px);
}

.answer-option[b-9xdbhqoi9l] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 22px;
    border: 2px solid rgba(226, 230, 234, 0.6);
    border-radius: 16px;
    background: rgba(255, 255, 255, 0.8);
    backdrop-filter: blur(10px);
    cursor: pointer;
    transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    font-size: 1.05rem;
    text-align: left;
    width: 100%;
    position: relative;
    overflow: hidden;
    box-shadow: 
        0 2px 8px rgba(20, 33, 61, 0.04),
        inset 0 1px 0 rgba(255, 255, 255, 0.9);
}

.answer-option[b-9xdbhqoi9l]::before {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, transparent, rgba(200, 169, 81, 0.1), transparent);
    transition: left 0.6s ease;
    z-index: 0;
}

.answer-option > *[b-9xdbhqoi9l] {
    position: relative;
    z-index: 1;
}

.answer-option:hover:not(:disabled)[b-9xdbhqoi9l] {
    border-color: rgba(200, 169, 81, 0.6);
    background: rgba(200, 169, 81, 0.08);
    transform: translateY(-3px) translateX(4px);
    box-shadow: 
        0 6px 20px rgba(200, 169, 81, 0.2),
        inset 0 1px 0 rgba(255, 255, 255, 0.95);
}

.answer-option:hover:not(:disabled)[b-9xdbhqoi9l]::before {
    left: 100%;
}

.answer-option.selected[b-9xdbhqoi9l] {
    border-color: #C8A951;
    background: linear-gradient(135deg, rgba(200, 169, 81, 0.15) 0%, rgba(200, 169, 81, 0.08) 100%);
    box-shadow: 
        0 6px 20px rgba(200, 169, 81, 0.3),
        0 0 0 1px rgba(200, 169, 81, 0.2),
        inset 0 1px 0 rgba(255, 255, 255, 0.9);
    transform: translateY(-2px);
    animation: selectedOption-b-9xdbhqoi9l 0.4s cubic-bezier(0.34, 1.56, 0.64, 1);
}

@keyframes selectedOption-b-9xdbhqoi9l {
    0% {
        transform: translateY(-2px) scale(1);
    }
    50% {
        transform: translateY(-4px) scale(1.02);
    }
    100% {
        transform: translateY(-2px) scale(1);
    }
}

.answer-option:disabled[b-9xdbhqoi9l] {
    cursor: not-allowed;
    opacity: 0.7;
}

.option-content[b-9xdbhqoi9l] {
    display: flex;
    align-items: center;
    gap: 15px;
    flex: 1;
}

.scale-value[b-9xdbhqoi9l] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    background: linear-gradient(135deg, #C8A951 0%, #b8994a 100%);
    color: white;
    border-radius: 50%;
    font-weight: 700;
    font-size: 1.15rem;
    box-shadow: 
        0 4px 12px rgba(200, 169, 81, 0.3),
        inset 0 1px 0 rgba(255, 255, 255, 0.2);
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
    transition: all 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    position: relative;
    overflow: hidden;
}

.scale-value[b-9xdbhqoi9l]::before {
    content: '';
    position: absolute;
    top: -50%;
    left: -50%;
    width: 200%;
    height: 200%;
    background: linear-gradient(45deg, transparent, rgba(255, 255, 255, 0.2), transparent);
    transform: rotate(45deg);
    transition: all 0.6s ease;
    opacity: 0;
}

.answer-option:hover .scale-value[b-9xdbhqoi9l]::before,
.answer-option.selected .scale-value[b-9xdbhqoi9l]::before {
    opacity: 1;
    transform: rotate(45deg) translate(50%, 50%);
}

.option-text[b-9xdbhqoi9l] {
    color: #14213D;
    font-weight: 500;
    line-height: 1.5;
    transition: all 0.3s ease;
}

.answer-option:hover .option-text[b-9xdbhqoi9l],
.answer-option.selected .option-text[b-9xdbhqoi9l] {
    color: #14213D;
    font-weight: 600;
}

.selection-indicator[b-9xdbhqoi9l] {
    color: #C8A951;
    font-size: 1.8rem;
    animation: checkmark-appear-b-9xdbhqoi9l 0.5s cubic-bezier(0.34, 1.56, 0.64, 1);
    filter: drop-shadow(0 2px 4px rgba(200, 169, 81, 0.3));
}

@keyframes checkmark-appear-b-9xdbhqoi9l {
    0% { 
        opacity: 0; 
        transform: scale(0.3) rotate(-45deg);
    }
    60% { 
        opacity: 0.8; 
        transform: scale(1.1) rotate(5deg);
    }
    100% { 
        opacity: 1; 
        transform: scale(1) rotate(0deg);
    }
}

/* Text Input */
.text-input-section[b-9xdbhqoi9l] {
    margin-bottom: 20px;
}

.question-textarea[b-9xdbhqoi9l] {
    width: 100%;
    resize: vertical;
}

.character-count[b-9xdbhqoi9l] {
    text-align: right;
    color: #6c757d;
    font-size: 0.85rem;
    margin-top: 8px;
}

/* Enhanced Yes/No Options */
.yes-no-options[b-9xdbhqoi9l] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 24px;
    margin: 20px 0;
}

.yes-no-option[b-9xdbhqoi9l] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 12px;
    padding: 32px 24px;
    border: 2px solid rgba(226, 230, 234, 0.6);
    border-radius: 16px;
    background: rgba(255, 255, 255, 0.8);
    backdrop-filter: blur(10px);
    cursor: pointer;
    transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    font-size: 1.15rem;
    font-weight: 600;
    position: relative;
    overflow: hidden;
    box-shadow: 
        0 2px 8px rgba(20, 33, 61, 0.04),
        inset 0 1px 0 rgba(255, 255, 255, 0.9);
}

.yes-no-option[b-9xdbhqoi9l]::before {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.3), transparent);
    transition: left 0.6s ease;
    z-index: 0;
}

.yes-no-option > *[b-9xdbhqoi9l] {
    position: relative;
    z-index: 1;
}

.yes-no-option i[b-9xdbhqoi9l] {
    font-size: 2.5rem;
    margin-bottom: 8px;
    transition: all 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    filter: drop-shadow(0 2px 4px rgba(0, 0, 0, 0.1));
}

.yes-no-option.yes[b-9xdbhqoi9l] {
    color: #28a745;
    border-color: rgba(226, 230, 234, 0.6);
}

.yes-no-option.yes:hover[b-9xdbhqoi9l],
.yes-no-option.yes.selected[b-9xdbhqoi9l] {
    border-color: #28a745;
    background: linear-gradient(135deg, rgba(40, 167, 69, 0.12) 0%, rgba(40, 167, 69, 0.06) 100%);
    box-shadow: 
        0 6px 20px rgba(40, 167, 69, 0.25),
        inset 0 1px 0 rgba(255, 255, 255, 0.95);
    transform: translateY(-3px) scale(1.02);
    color: #1e7e34;
}

.yes-no-option.yes:hover i[b-9xdbhqoi9l],
.yes-no-option.yes.selected i[b-9xdbhqoi9l] {
    transform: scale(1.1) rotate(5deg);
    filter: drop-shadow(0 4px 8px rgba(40, 167, 69, 0.3));
}

.yes-no-option.yes:hover[b-9xdbhqoi9l]::before,
.yes-no-option.yes.selected[b-9xdbhqoi9l]::before {
    left: 100%;
}

.yes-no-option.no[b-9xdbhqoi9l] {
    color: #dc3545;
    border-color: rgba(226, 230, 234, 0.6);
}

.yes-no-option.no:hover[b-9xdbhqoi9l],
.yes-no-option.no.selected[b-9xdbhqoi9l] {
    border-color: #dc3545;
    background: linear-gradient(135deg, rgba(220, 53, 69, 0.12) 0%, rgba(220, 53, 69, 0.06) 100%);
    box-shadow: 
        0 6px 20px rgba(220, 53, 69, 0.25),
        inset 0 1px 0 rgba(255, 255, 255, 0.95);
    transform: translateY(-3px) scale(1.02);
    color: #c82333;
}

.yes-no-option.no:hover i[b-9xdbhqoi9l],
.yes-no-option.no.selected i[b-9xdbhqoi9l] {
    transform: scale(1.1) rotate(-5deg);
    filter: drop-shadow(0 4px 8px rgba(220, 53, 69, 0.3));
}

.yes-no-option.no:hover[b-9xdbhqoi9l]::before,
.yes-no-option.no.selected[b-9xdbhqoi9l]::before {
    left: 100%;
}

/* Enhanced Validation and Feedback */
.validation-error[b-9xdbhqoi9l] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 18px 20px;
    background: linear-gradient(135deg, rgba(220, 53, 69, 0.12) 0%, rgba(200, 35, 51, 0.08) 100%);
    backdrop-filter: blur(10px);
    border: 1px solid rgba(220, 53, 69, 0.3);
    border-radius: 12px;
    color: #dc3545;
    margin-bottom: 24px;
    font-weight: 500;
    box-shadow: 
        0 4px 16px rgba(220, 53, 69, 0.15),
        inset 0 1px 0 rgba(255, 255, 255, 0.8);
    animation: shake-b-9xdbhqoi9l 0.6s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    position: relative;
    overflow: hidden;
}

.validation-error[b-9xdbhqoi9l]::before {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 4px;
    background: linear-gradient(180deg, #dc3545, #c82333);
}

.validation-error i[b-9xdbhqoi9l] {
    font-size: 1.2rem;
    filter: drop-shadow(0 1px 2px rgba(220, 53, 69, 0.3));
}

@keyframes shake-b-9xdbhqoi9l {
    0%, 100% { transform: translateX(0) scale(1); }
    15% { transform: translateX(-8px) scale(1.01); }
    30% { transform: translateX(6px) scale(0.99); }
    45% { transform: translateX(-4px) scale(1.01); }
    60% { transform: translateX(3px) scale(0.99); }
    75% { transform: translateX(-2px) scale(1); }
}

.feedback-message[b-9xdbhqoi9l] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 18px 20px;
    border-radius: 12px;
    margin-bottom: 24px;
    font-weight: 500;
    backdrop-filter: blur(10px);
    box-shadow: 
        0 4px 16px rgba(20, 33, 61, 0.06),
        inset 0 1px 0 rgba(255, 255, 255, 0.8);
    animation: fadeIn-b-9xdbhqoi9l 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    position: relative;
    overflow: hidden;
}

.feedback-message[b-9xdbhqoi9l]::before {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 4px;
    background: currentColor;
    opacity: 0.6;
}

.feedback-message i[b-9xdbhqoi9l] {
    font-size: 1.2rem;
    opacity: 0.8;
}

.feedback-high[b-9xdbhqoi9l] {
    background: linear-gradient(135deg, rgba(220, 53, 69, 0.12) 0%, rgba(200, 35, 51, 0.08) 100%);
    border: 1px solid rgba(220, 53, 69, 0.3);
    color: #dc3545;
}

.feedback-moderate[b-9xdbhqoi9l] {
    background: linear-gradient(135deg, rgba(255, 193, 7, 0.12) 0%, rgba(255, 179, 7, 0.08) 100%);
    border: 1px solid rgba(255, 193, 7, 0.3);
    color: #856404;
}

.feedback-low[b-9xdbhqoi9l] {
    background: linear-gradient(135deg, rgba(200, 169, 81, 0.12) 0%, rgba(200, 169, 81, 0.08) 100%);
    border: 1px solid rgba(200, 169, 81, 0.3);
    color: #C8A951;
}

.feedback-positive[b-9xdbhqoi9l] {
    background: linear-gradient(135deg, rgba(40, 167, 69, 0.12) 0%, rgba(32, 201, 151, 0.08) 100%);
    border: 1px solid rgba(40, 167, 69, 0.3);
    color: #28a745;
}

@keyframes fadeIn-b-9xdbhqoi9l {
    0% { 
        opacity: 0; 
        transform: translateY(-15px) scale(0.98);
    }
    60% {
        opacity: 0.8;
        transform: translateY(2px) scale(1.01);
    }
    100% { 
        opacity: 1; 
        transform: translateY(0) scale(1);
    }
}

/* Enhanced Question Actions */
.question-actions[b-9xdbhqoi9l] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-top: 30px;
    border-top: 1px solid rgba(226, 230, 234, 0.6);
    gap: 20px;
    position: relative;
}

.question-actions[b-9xdbhqoi9l]::before {
    content: '';
    position: absolute;
    top: -1px;
    left: 0;
    width: 80px;
    height: 2px;
    background: linear-gradient(90deg, #C8A951, transparent);
}

.next-button-container[b-9xdbhqoi9l] {
    display: flex;
    gap: 10px;
    align-items: center;
}

.next-button[b-9xdbhqoi9l] {
    min-width: 120px;
}

.complete-button[b-9xdbhqoi9l] {
    min-width: 180px;
    background: linear-gradient(135deg, #28a745 0%, #20c997 100%);
    border-color: #28a745;
    font-weight: 600;
    box-shadow: 
        0 6px 20px rgba(40, 167, 69, 0.3),
        inset 0 1px 0 rgba(255, 255, 255, 0.2);
    animation: pulse-complete-b-9xdbhqoi9l 3s ease-in-out infinite;
    position: relative;
    overflow: hidden;
}

.complete-button[b-9xdbhqoi9l]::before {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.2), transparent);
    transition: left 0.6s ease;
}

.complete-button:hover[b-9xdbhqoi9l] {
    background: linear-gradient(135deg, #218838 0%, #1ba085 100%);
    border-color: #1e7e34;
    transform: translateY(-3px) scale(1.02);
    box-shadow: 
        0 8px 24px rgba(40, 167, 69, 0.4),
        inset 0 1px 0 rgba(255, 255, 255, 0.3);
}

.complete-button:hover[b-9xdbhqoi9l]::before {
    left: 100%;
}

@keyframes pulse-complete-b-9xdbhqoi9l {
    0%, 100% { 
        box-shadow: 
            0 6px 20px rgba(40, 167, 69, 0.3),
            inset 0 1px 0 rgba(255, 255, 255, 0.2);
        transform: scale(1);
    }
    50% { 
        box-shadow: 
            0 8px 28px rgba(40, 167, 69, 0.4),
            0 0 0 2px rgba(40, 167, 69, 0.1),
            inset 0 1px 0 rgba(255, 255, 255, 0.3);
        transform: scale(1.01);
    }
}

.disabled-next-button[b-9xdbhqoi9l] {
    min-width: 180px;
    cursor: not-allowed;
}

/* Responsive Design */
@media (max-width: 768px) {
    .question-display[b-9xdbhqoi9l] {
        padding: 15px;
    }
    
    .question-card[b-9xdbhqoi9l] {
        padding: 20px;
    }
    
    .question-text[b-9xdbhqoi9l] {
        font-size: 1.2rem;
    }
    
    .question-actions[b-9xdbhqoi9l] {
        flex-direction: column;
        gap: 15px;
        align-items: stretch;
    }
    
    .next-button-container[b-9xdbhqoi9l] {
        justify-content: center;
        width: 100%;
    }
    
    .answer-option[b-9xdbhqoi9l] {
        padding: 15px;
        font-size: 0.95rem;
    }
    
    .yes-no-options[b-9xdbhqoi9l] {
        flex-direction: column;
        gap: 12px;
    }
    
    .yes-no-option[b-9xdbhqoi9l] {
        padding: 18px;
        justify-content: center;
    }
}

@media (max-width: 480px) {
    .question-header[b-9xdbhqoi9l] {
        flex-direction: column;
        align-items: flex-start;
        gap: 10px;
    }
    
    .hazard-category[b-9xdbhqoi9l] {
        align-self: flex-end;
    }
    
    .answer-option[b-9xdbhqoi9l] {
        padding: 12px;
    }
    
    .option-content[b-9xdbhqoi9l] {
        flex-direction: column;
        align-items: flex-start;
        gap: 8px;
    }
    
    .scale-value[b-9xdbhqoi9l] {
        font-size: 1.2rem;
    }
}

/* Answer Processing */
.answer-processing[b-9xdbhqoi9l] {
    position: fixed;
    bottom: 30px;
    right: 30px;
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 15px 20px;
    background: rgba(255, 255, 255, 0.95);
    border: 1px solid #E2E6EA;
    border-radius: 25px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
    color: #6c757d;
    font-weight: 500;
    z-index: 1000;
    backdrop-filter: blur(5px);
}

.processing-spinner[b-9xdbhqoi9l] {
    width: 20px;
    height: 20px;
    border: 2px solid #E2E6EA;
    border-top: 2px solid #C8A951;
    border-radius: 50%;
    animation: spin-b-9xdbhqoi9l 1s linear infinite;
}

@keyframes spin-b-9xdbhqoi9l {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

/* Auto-advance indicator styles */
.auto-advance-indicator[b-9xdbhqoi9l] {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 15px;
}

.auto-advance-text[b-9xdbhqoi9l] {
    display: flex;
    align-items: center;
    gap: 10px;
    color: #C8A951;
    font-weight: 500;
    font-size: 0.95rem;
}

.instruction-text[b-9xdbhqoi9l] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    color: #6c757d;
    font-style: italic;
    font-size: 0.9rem;
    padding: 10px;
    background: linear-gradient(135deg, rgba(200, 169, 81, 0.05) 0%, rgba(200, 169, 81, 0.02) 100%);
    border: 1px dashed #C8A951;
    border-radius: 8px;
    animation: pulse-instruction-b-9xdbhqoi9l 2s ease-in-out infinite;
}

@keyframes pulse-instruction-b-9xdbhqoi9l {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.7; }
}

/* Responsive Design */
@media (max-width: 768px) {
    .question-display[b-9xdbhqoi9l] {
        padding: 15px;
    }
    
    .question-card[b-9xdbhqoi9l] {
        padding: 20px;
    }
    
    .question-header[b-9xdbhqoi9l] {
        flex-direction: column;
        align-items: flex-start;
        gap: 10px;
    }
    
    .question-text[b-9xdbhqoi9l] {
        font-size: 1.2rem;
    }
    
    .answer-option[b-9xdbhqoi9l] {
        padding: 15px;
    }
    
    .yes-no-options[b-9xdbhqoi9l] {
        grid-template-columns: 1fr;
    }
    
    .yes-no-option[b-9xdbhqoi9l] {
        padding: 20px;
    }
    
    .question-actions[b-9xdbhqoi9l] {
        flex-direction: column;
        gap: 15px;
        align-items: stretch;
    }
    
    .next-button-container[b-9xdbhqoi9l] {
        width: 100%;
        justify-content: center;
    }
    
    .answer-processing[b-9xdbhqoi9l] {
        position: fixed;
        bottom: 15px;
        right: 15px;
        left: 15px;
        text-align: center;
        justify-content: center;
    }
}

@media (max-width: 480px) {
    .question-text[b-9xdbhqoi9l] {
        font-size: 1.1rem;
    }
    
    .option-content[b-9xdbhqoi9l] {
        gap: 10px;
    }
    
    .scale-value[b-9xdbhqoi9l] {
        width: 35px;
        height: 35px;
        font-size: 1rem;
    }
    
    .yes-no-option i[b-9xdbhqoi9l] {
        font-size: 1.5rem;
    }
}

/* Enhanced Text Input Styling */
.text-input-section[b-9xdbhqoi9l] {
    margin-bottom: 25px;
    position: relative;
}

.question-textarea[b-9xdbhqoi9l] {
    width: 100%;
    resize: vertical;
    min-height: 120px;
    border-radius: 12px;
    border: 2px solid rgba(226, 230, 234, 0.6);
    padding: 16px;
    font-size: 1rem;
    line-height: 1.5;
    background: rgba(255, 255, 255, 0.8);
    backdrop-filter: blur(10px);
    transition: all 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    box-shadow: 
        0 2px 8px rgba(20, 33, 61, 0.04),
        inset 0 1px 0 rgba(255, 255, 255, 0.9);
}

.question-textarea:focus[b-9xdbhqoi9l] {
    border-color: #C8A951;
    box-shadow: 
        0 4px 16px rgba(200, 169, 81, 0.2),
        0 0 0 3px rgba(200, 169, 81, 0.1),
        inset 0 1px 0 rgba(255, 255, 255, 0.95);
    outline: none;
}

.character-count[b-9xdbhqoi9l] {
    text-align: right;
    color: #6c757d;
    font-size: 0.85rem;
    margin-top: 8px;
    font-weight: 500;
    transition: color 0.3s ease;
}

.character-count.warning[b-9xdbhqoi9l] {
    color: #ffc107;
}

.character-count.danger[b-9xdbhqoi9l] {
    color: #dc3545;
}

/* Enhanced Next Button Container */
.next-button-container[b-9xdbhqoi9l] {
    display: flex;
    gap: 12px;
    align-items: center;
    justify-content: flex-end;
}

.next-button[b-9xdbhqoi9l] {
    min-width: 140px;
    background: linear-gradient(135deg, #C8A951 0%, #b8994a 100%);
    border-color: #C8A951;
    color: white;
    font-weight: 600;
    padding: 12px 24px;
    border-radius: 50px;
    box-shadow: 
        0 4px 16px rgba(200, 169, 81, 0.3),
        inset 0 1px 0 rgba(255, 255, 255, 0.2);
    transition: all 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    position: relative;
    overflow: hidden;
}

.next-button[b-9xdbhqoi9l]::before {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.2), transparent);
    transition: left 0.6s ease;
}

.next-button:hover[b-9xdbhqoi9l] {
    background: linear-gradient(135deg, #b8994a 0%, #C8A951 100%);
    transform: translateY(-2px) scale(1.02);
    box-shadow: 
        0 6px 20px rgba(200, 169, 81, 0.4),
        inset 0 1px 0 rgba(255, 255, 255, 0.3);
}

.next-button:hover[b-9xdbhqoi9l]::before {
    left: 100%;
}

.disabled-next-button[b-9xdbhqoi9l] {
    min-width: 200px;
    cursor: not-allowed;
    background: rgba(108, 117, 125, 0.1);
    border-color: rgba(108, 117, 125, 0.3);
    color: #6c757d;
    box-shadow: none;
}

.disabled-next-button:hover[b-9xdbhqoi9l] {
    transform: none;
    box-shadow: none;
}

/* Focus states for accessibility */
.answer-option:focus[b-9xdbhqoi9l],
.yes-no-option:focus[b-9xdbhqoi9l],
.next-button:focus[b-9xdbhqoi9l],
.complete-button:focus[b-9xdbhqoi9l] {
    outline: 2px solid #C8A951;
    outline-offset: 2px;
}

/* High contrast mode support */
@media (prefers-contrast: high) {
    .question-card[b-9xdbhqoi9l] {
        border: 2px solid #000;
        background: #fff;
    }
    
    .answer-option[b-9xdbhqoi9l] {
        border: 2px solid #000;
    }
    
    .answer-option.selected[b-9xdbhqoi9l] {
        background: #000;
        color: #fff;
    }
}

/* Reduced motion support */
@media (prefers-reduced-motion: reduce) {
    *[b-9xdbhqoi9l] {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
    }
    
    .answer-option:hover[b-9xdbhqoi9l],
    .yes-no-option:hover[b-9xdbhqoi9l],
    .complete-button:hover[b-9xdbhqoi9l],
    .next-button:hover[b-9xdbhqoi9l] {
        transform: none;
    }
}

/* Print styles */
@media print {
    .question-card[b-9xdbhqoi9l] {
        box-shadow: none;
        border: 1px solid #000;
        background: white;
    }
    
    .answer-processing[b-9xdbhqoi9l],
    .loading-overlay[b-9xdbhqoi9l] {
        display: none;
    }
    
    .question-actions[b-9xdbhqoi9l] {
        display: none;
    }
}
/* /Features/UserSurvey/Components/SurveyStartScreen.razor.rz.scp.css */
.survey-start-screen[b-69d3nrj9sv] {
    min-height: 100vh;
    background: linear-gradient(135deg, #BFD8B8 0%, rgba(191, 216, 184, 0.3) 50%, #FFFFFF 100%);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 30px 20px;
    font-family: 'Inter', 'Segoe UI', -apple-system, BlinkMacSystemFont, sans-serif;
    position: relative;
    overflow: hidden;
}

.survey-start-screen[b-69d3nrj9sv]::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100"><defs><pattern id="grain" width="100" height="100" patternUnits="userSpaceOnUse"><circle cx="20" cy="20" r="1" fill="%23C8A951" opacity="0.03"/><circle cx="80" cy="40" r="0.5" fill="%23BFD8B8" opacity="0.05"/><circle cx="40" cy="80" r="1.5" fill="%23C8A951" opacity="0.02"/></pattern></defs><rect width="100" height="100" fill="url(%23grain)"/></svg>') repeat;
    pointer-events: none;
    z-index: 1;
}

.start-screen-card[b-69d3nrj9sv] {
    max-width: 700px;
    width: 100%;
    padding: 3rem;
    text-align: center;
    background: rgba(255, 255, 255, 0.95);
    backdrop-filter: blur(20px);
    border: 1px solid rgba(226, 230, 234, 0.4);
    border-radius: 24px;
    box-shadow: 
        0 12px 40px rgba(20, 33, 61, 0.08),
        0 6px 20px rgba(20, 33, 61, 0.04),
        inset 0 1px 0 rgba(255, 255, 255, 0.8);
    position: relative;
    z-index: 2;
    animation: cardAppear-b-69d3nrj9sv 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    overflow: hidden;
}

.start-screen-card[b-69d3nrj9sv]::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 6px;
    background: linear-gradient(90deg, #C8A951 0%, #b8994a 50%, #C8A951 100%);
    opacity: 0.8;
}

@keyframes cardAppear-b-69d3nrj9sv {
    0% {
        opacity: 0;
        transform: translateY(30px) scale(0.95);
    }
    60% {
        opacity: 0.8;
        transform: translateY(-5px) scale(1.01);
    }
    100% {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

.start-screen-header[b-69d3nrj9sv] {
    margin-bottom: 3rem;
    animation: headerAppear-b-69d3nrj9sv 1s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0.3s both;
}

@keyframes headerAppear-b-69d3nrj9sv {
    0% {
        opacity: 0;
        transform: translateY(20px);
    }
    100% {
        opacity: 1;
        transform: translateY(0);
    }
}

.iswara-logo img[b-69d3nrj9sv] {
    height: 70px;
    margin-bottom: 25px;
    filter: drop-shadow(0 4px 8px rgba(0, 0, 0, 0.1));
    transition: all 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.iswara-logo img:hover[b-69d3nrj9sv] {
    transform: scale(1.05);
    filter: drop-shadow(0 6px 12px rgba(200, 169, 81, 0.2));
}

.start-screen-header h1[b-69d3nrj9sv] {
    color: #14213D;
    font-size: 2.8rem;
    font-weight: 700;
    margin: 0 0 20px 0;
    line-height: 1.1;
    letter-spacing: -0.02em;
    text-shadow: 0 2px 4px rgba(20, 33, 61, 0.1);
    background: linear-gradient(135deg, #14213D 0%, #1a2b4a 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

.start-screen-header p[b-69d3nrj9sv] {
    color: #2E2E2E;
    font-size: 1.3rem;
    margin: 0;
    line-height: 1.6;
    font-weight: 400;
    opacity: 0.9;
}

.code-entry-section[b-69d3nrj9sv] {
    margin-bottom: 3rem;
    animation: sectionAppear-b-69d3nrj9sv 1s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0.5s both;
}

@keyframes sectionAppear-b-69d3nrj9sv {
    0% {
        opacity: 0;
        transform: translateY(20px);
    }
    100% {
        opacity: 1;
        transform: translateY(0);
    }
}

.code-input[b-69d3nrj9sv] {
    margin-bottom: 25px;
    position: relative;
}

.code-input input[b-69d3nrj9sv] {
    width: 100%;
    padding: 16px 20px;
    border: 2px solid rgba(226, 230, 234, 0.6);
    border-radius: 16px;
    font-size: 1.1rem;
    background: rgba(255, 255, 255, 0.8);
    backdrop-filter: blur(10px);
    transition: all 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    box-shadow: 
        0 2px 8px rgba(20, 33, 61, 0.04),
        inset 0 1px 0 rgba(255, 255, 255, 0.9);
    text-align: center;
    letter-spacing: 2px;
    font-weight: 600;
    text-transform: uppercase;
}

.code-input input:focus[b-69d3nrj9sv] {
    border-color: #C8A951;
    box-shadow: 
        0 4px 16px rgba(200, 169, 81, 0.2),
        0 0 0 3px rgba(200, 169, 81, 0.1),
        inset 0 1px 0 rgba(255, 255, 255, 0.95);
    outline: none;
    transform: translateY(-2px);
}

.code-input input[b-69d3nrj9sv]::placeholder {
    color: #6c757d;
    letter-spacing: 1px;
    font-weight: 500;
    text-transform: none;
}

.error-message[b-69d3nrj9sv] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 18px 20px;
    background: linear-gradient(135deg, rgba(220, 53, 69, 0.12) 0%, rgba(200, 35, 51, 0.08) 100%);
    backdrop-filter: blur(10px);
    border: 1px solid rgba(220, 53, 69, 0.3);
    border-radius: 12px;
    color: #dc3545;
    margin-bottom: 24px;
    font-weight: 500;
    box-shadow: 
        0 4px 16px rgba(220, 53, 69, 0.15),
        inset 0 1px 0 rgba(255, 255, 255, 0.8);
    animation: errorAppear-b-69d3nrj9sv 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    position: relative;
    overflow: hidden;
}

.error-message[b-69d3nrj9sv]::before {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 4px;
    background: linear-gradient(180deg, #dc3545, #c82333);
}

.error-message i[b-69d3nrj9sv] {
    font-size: 1.2rem;
    filter: drop-shadow(0 1px 2px rgba(220, 53, 69, 0.3));
}

@keyframes errorAppear-b-69d3nrj9sv {
    0% {
        opacity: 0;
        transform: translateY(-10px) scale(0.95);
    }
    60% {
        opacity: 0.8;
        transform: translateY(2px) scale(1.01);
    }
    100% {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

.action-buttons[b-69d3nrj9sv] {
    display: flex;
    justify-content: center;
    gap: 20px;
    margin-bottom: 2.5rem;
    animation: buttonsAppear-b-69d3nrj9sv 1s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0.7s both;
}

@keyframes buttonsAppear-b-69d3nrj9sv {
    0% {
        opacity: 0;
        transform: translateY(20px);
    }
    100% {
        opacity: 1;
        transform: translateY(0);
    }
}

.start-button[b-69d3nrj9sv] {
    min-width: 220px;
    background: linear-gradient(135deg, #C8A951 0%, #b8994a 100%);
    border-color: #C8A951;
    color: white;
    font-weight: 600;
    padding: 14px 32px;
    border-radius: 50px;
    font-size: 1.1rem;
    box-shadow: 
        0 6px 20px rgba(200, 169, 81, 0.3),
        inset 0 1px 0 rgba(255, 255, 255, 0.2);
    transition: all 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    position: relative;
    overflow: hidden;
    letter-spacing: 0.02em;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
}

.start-button[b-69d3nrj9sv]::before {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.2), transparent);
    transition: left 0.6s ease;
}

.start-button:hover[b-69d3nrj9sv] {
    background: linear-gradient(135deg, #b8994a 0%, #C8A951 100%);
    transform: translateY(-3px) scale(1.02);
    box-shadow: 
        0 8px 24px rgba(200, 169, 81, 0.4),
        inset 0 1px 0 rgba(255, 255, 255, 0.3);
}

.start-button:hover[b-69d3nrj9sv]::before {
    left: 100%;
}

.privacy-notice[b-69d3nrj9sv] {
    padding: 24px;
    background: linear-gradient(135deg, rgba(200, 169, 81, 0.08) 0%, rgba(200, 169, 81, 0.04) 100%);
    backdrop-filter: blur(10px);
    border: 1px solid rgba(200, 169, 81, 0.2);
    border-radius: 16px;
    box-shadow: 
        0 4px 16px rgba(20, 33, 61, 0.06),
        inset 0 1px 0 rgba(255, 255, 255, 0.8);
    animation: noticeAppear-b-69d3nrj9sv 1s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0.9s both;
    position: relative;
    overflow: hidden;
}

.privacy-notice[b-69d3nrj9sv]::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 3px;
    background: linear-gradient(90deg, #C8A951 0%, #b8994a 50%, #C8A951 100%);
    opacity: 0.6;
}

@keyframes noticeAppear-b-69d3nrj9sv {
    0% {
        opacity: 0;
        transform: translateY(20px);
    }
    100% {
        opacity: 1;
        transform: translateY(0);
    }
}

.notice-content[b-69d3nrj9sv] {
    display: flex;
    align-items: flex-start;
    gap: 18px;
    text-align: left;
    position: relative;
    z-index: 1;
}

.notice-content i[b-69d3nrj9sv] {
    color: #C8A951;
    font-size: 1.8rem;
    margin-top: 3px;
    flex-shrink: 0;
    filter: drop-shadow(0 2px 4px rgba(200, 169, 81, 0.3));
    animation: iconGlow-b-69d3nrj9sv 3s ease-in-out infinite;
}

@keyframes iconGlow-b-69d3nrj9sv {
    0%, 100% {
        filter: drop-shadow(0 2px 4px rgba(200, 169, 81, 0.3));
    }
    50% {
        filter: drop-shadow(0 4px 8px rgba(200, 169, 81, 0.5));
    }
}

.notice-content h6[b-69d3nrj9sv] {
    color: #14213D;
    font-weight: 600;
    margin: 0 0 10px 0;
    font-size: 1.1rem;
    letter-spacing: -0.01em;
}

.notice-content p[b-69d3nrj9sv] {
    color: #2E2E2E;
    margin: 0;
    font-size: 0.95rem;
    line-height: 1.5;
    font-weight: 400;
}

/* Enhanced Survey Introduction Card */
.survey-intro-card[b-69d3nrj9sv] {
    max-width: 800px;
    width: 100%;
    padding: 3rem;
    background: rgba(255, 255, 255, 0.95);
    backdrop-filter: blur(20px);
    border: 1px solid rgba(226, 230, 234, 0.4);
    border-radius: 24px;
    box-shadow: 
        0 12px 40px rgba(20, 33, 61, 0.08),
        0 6px 20px rgba(20, 33, 61, 0.04),
        inset 0 1px 0 rgba(255, 255, 255, 0.8);
    position: relative;
    z-index: 2;
    animation: cardAppear-b-69d3nrj9sv 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    overflow: hidden;
}

.survey-intro-card[b-69d3nrj9sv]::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 6px;
    background: linear-gradient(90deg, #C8A951 0%, #b8994a 50%, #C8A951 100%);
    opacity: 0.8;
}

.survey-intro-header[b-69d3nrj9sv] {
    text-align: center;
    margin-bottom: 3rem;
    animation: headerAppear-b-69d3nrj9sv 1s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0.3s both;
}

.survey-emoji[b-69d3nrj9sv] {
    margin-bottom: 25px;
    position: relative;
    display: inline-block;
}

.emoji[b-69d3nrj9sv] {
    font-size: 5rem;
    display: inline-block;
    filter: drop-shadow(0 4px 8px rgba(0, 0, 0, 0.1));
    transition: all 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.pulse[b-69d3nrj9sv] {
    animation: pulse-b-69d3nrj9sv 3s ease-in-out infinite;
}

@keyframes pulse-b-69d3nrj9sv {
    0% { 
        transform: scale(1) rotate(0deg);
        filter: drop-shadow(0 4px 8px rgba(0, 0, 0, 0.1));
    }
    25% { 
        transform: scale(1.05) rotate(2deg);
        filter: drop-shadow(0 6px 12px rgba(200, 169, 81, 0.2));
    }
    50% { 
        transform: scale(1.1) rotate(0deg);
        filter: drop-shadow(0 8px 16px rgba(200, 169, 81, 0.3));
    }
    75% { 
        transform: scale(1.05) rotate(-2deg);
        filter: drop-shadow(0 6px 12px rgba(200, 169, 81, 0.2));
    }
    100% { 
        transform: scale(1) rotate(0deg);
        filter: drop-shadow(0 4px 8px rgba(0, 0, 0, 0.1));
    }
}

.survey-intro-header h2[b-69d3nrj9sv] {
    color: #14213D;
    font-size: 2.3rem;
    font-weight: 700;
    margin: 0 0 20px 0;
    line-height: 1.2;
    letter-spacing: -0.02em;
    text-shadow: 0 2px 4px rgba(20, 33, 61, 0.1);
}

.survey-description[b-69d3nrj9sv] {
    color: #2E2E2E;
    font-size: 1.2rem;
    line-height: 1.6;
    margin: 0;
    font-weight: 400;
    opacity: 0.9;
}

.survey-details[b-69d3nrj9sv] {
    margin-bottom: 3rem;
    animation: detailsAppear-b-69d3nrj9sv 1s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0.5s both;
}

@keyframes detailsAppear-b-69d3nrj9sv {
    0% {
        opacity: 0;
        transform: translateY(20px);
    }
    100% {
        opacity: 1;
        transform: translateY(0);
    }
}

.detail-grid[b-69d3nrj9sv] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 24px;
}

.detail-item[b-69d3nrj9sv] {
    display: flex;
    align-items: center;
    gap: 18px;
    padding: 24px;
    background: rgba(248, 249, 250, 0.8);
    backdrop-filter: blur(10px);
    border-radius: 16px;
    border: 1px solid rgba(226, 230, 234, 0.4);
    box-shadow: 
        0 2px 8px rgba(20, 33, 61, 0.04),
        inset 0 1px 0 rgba(255, 255, 255, 0.8);
    transition: all 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    position: relative;
    overflow: hidden;
}

.detail-item[b-69d3nrj9sv]::before {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 4px;
    background: linear-gradient(180deg, #C8A951, #b8994a);
}

.detail-item:hover[b-69d3nrj9sv] {
    transform: translateY(-2px);
    box-shadow: 
        0 4px 16px rgba(20, 33, 61, 0.08),
        inset 0 1px 0 rgba(255, 255, 255, 0.9);
}

.detail-item i[b-69d3nrj9sv] {
    color: #C8A951;
    font-size: 1.8rem;
    flex-shrink: 0;
    filter: drop-shadow(0 2px 4px rgba(200, 169, 81, 0.3));
    transition: all 0.3s ease;
}

.detail-item:hover i[b-69d3nrj9sv] {
    transform: scale(1.1);
    filter: drop-shadow(0 4px 8px rgba(200, 169, 81, 0.4));
}

.detail-item div[b-69d3nrj9sv] {
    display: flex;
    flex-direction: column;
}

.detail-label[b-69d3nrj9sv] {
    color: #6c757d;
    font-size: 0.85rem;
    font-weight: 600;
    margin-bottom: 6px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.detail-value[b-69d3nrj9sv] {
    color: #14213D;
    font-size: 1.2rem;
    font-weight: 700;
    line-height: 1.2;
}

.instructions-section[b-69d3nrj9sv] {
    margin-bottom: 3rem;
    text-align: left;
    animation: instructionsAppear-b-69d3nrj9sv 1s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0.7s both;
}

@keyframes instructionsAppear-b-69d3nrj9sv {
    0% {
        opacity: 0;
        transform: translateY(20px);
    }
    100% {
        opacity: 1;
        transform: translateY(0);
    }
}

.instructions-section h6[b-69d3nrj9sv] {
    color: #14213D;
    font-weight: 600;
    margin-bottom: 20px;
    font-size: 1.3rem;
    text-align: center;
    letter-spacing: -0.01em;
}

.instructions-list[b-69d3nrj9sv] {
    list-style: none;
    padding: 0;
    margin: 0;
    display: grid;
    gap: 16px;
}

.instructions-list li[b-69d3nrj9sv] {
    display: flex;
    align-items: flex-start;
    gap: 14px;
    color: #2E2E2E;
    line-height: 1.6;
    font-size: 1rem;
    padding: 12px 16px;
    background: rgba(255, 255, 255, 0.6);
    border-radius: 12px;
    border: 1px solid rgba(226, 230, 234, 0.3);
    backdrop-filter: blur(5px);
    transition: all 0.3s ease;
}

.instructions-list li:hover[b-69d3nrj9sv] {
    background: rgba(200, 169, 81, 0.05);
    border-color: rgba(200, 169, 81, 0.2);
    transform: translateX(4px);
}

.instructions-list li[b-69d3nrj9sv]::before {
    content: "✓";
    color: #C8A951;
    font-weight: bold;
    flex-shrink: 0;
    margin-top: 3px;
    font-size: 1.1rem;
    width: 20px;
    height: 20px;
    background: rgba(200, 169, 81, 0.1);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid rgba(200, 169, 81, 0.3);
}

.begin-button[b-69d3nrj9sv] {
    min-width: 280px;
    background: linear-gradient(135deg, #C8A951 0%, #b8994a 100%);
    border-color: #C8A951;
    color: white;
    font-weight: 600;
    padding: 16px 40px;
    border-radius: 50px;
    font-size: 1.2rem;
    box-shadow: 
        0 6px 20px rgba(200, 169, 81, 0.3),
        inset 0 1px 0 rgba(255, 255, 255, 0.2);
    transition: all 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    position: relative;
    overflow: hidden;
    letter-spacing: 0.02em;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
    animation: buttonGlow-b-69d3nrj9sv 3s ease-in-out infinite;
}

.begin-button[b-69d3nrj9sv]::before {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.2), transparent);
    transition: left 0.6s ease;
}

.begin-button:hover[b-69d3nrj9sv] {
    background: linear-gradient(135deg, #b8994a 0%, #C8A951 100%);
    transform: translateY(-3px) scale(1.02);
    box-shadow: 
        0 8px 24px rgba(200, 169, 81, 0.4),
        inset 0 1px 0 rgba(255, 255, 255, 0.3);
}

.begin-button:hover[b-69d3nrj9sv]::before {
    left: 100%;
}

@keyframes buttonGlow-b-69d3nrj9sv {
    0%, 100% {
        box-shadow: 
            0 6px 20px rgba(200, 169, 81, 0.3),
            inset 0 1px 0 rgba(255, 255, 255, 0.2);
    }
    50% {
        box-shadow: 
            0 8px 28px rgba(200, 169, 81, 0.4),
            0 0 0 2px rgba(200, 169, 81, 0.1),
            inset 0 1px 0 rgba(255, 255, 255, 0.3);
    }
}

.change-code-button[b-69d3nrj9sv] {
    min-width: 170px;
    background: transparent;
    border: 2px solid #6c757d;
    color: #6c757d;
    font-weight: 600;
    padding: 12px 24px;
    border-radius: 50px;
    font-size: 1rem;
    transition: all 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    backdrop-filter: blur(10px);
    position: relative;
    overflow: hidden;
}

.change-code-button[b-69d3nrj9sv]::before {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: #6c757d;
    transition: left 0.4s ease;
    z-index: -1;
}

.change-code-button:hover[b-69d3nrj9sv] {
    color: white;
    border-color: #6c757d;
    transform: translateY(-2px);
    box-shadow: 0 4px 16px rgba(108, 117, 125, 0.3);
}

.change-code-button:hover[b-69d3nrj9sv]::before {
    left: 0;
}

.loading-overlay[b-69d3nrj9sv] {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(255, 255, 255, 0.95);
    backdrop-filter: blur(15px);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    z-index: 10000;
    animation: overlayAppear-b-69d3nrj9sv 0.3s ease-out;
}

@keyframes overlayAppear-b-69d3nrj9sv {
    0% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}

.loading-overlay .spinner-border[b-69d3nrj9sv] {
    width: 3.5rem;
    height: 3.5rem;
    margin-bottom: 25px;
    border-width: 4px;
    border-color: #C8A951;
    border-right-color: transparent;
    animation: spin-b-69d3nrj9sv 1s linear infinite;
}

@keyframes spin-b-69d3nrj9sv {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

.loading-overlay p[b-69d3nrj9sv] {
    color: #14213D;
    font-size: 1.2rem;
    margin: 0;
    font-weight: 500;
    letter-spacing: 0.01em;
    text-align: center;
    animation: textPulse-b-69d3nrj9sv 2s ease-in-out infinite;
}

@keyframes textPulse-b-69d3nrj9sv {
    0%, 100% {
        opacity: 1;
    }
    50% {
        opacity: 0.7;
    }
}

/* Responsive Design */
@media (max-width: 768px) {
    .survey-start-screen[b-69d3nrj9sv] {
        padding: 15px;
    }
    
    .start-screen-card[b-69d3nrj9sv],
    .survey-intro-card[b-69d3nrj9sv] {
        padding: 25px;
    }
    
    .start-screen-header h1[b-69d3nrj9sv] {
        font-size: 2rem;
    }
    
    .action-buttons[b-69d3nrj9sv] {
        flex-direction: column;
        align-items: center;
    }
    
    .start-button[b-69d3nrj9sv],
    .begin-button[b-69d3nrj9sv] {
        min-width: 200px;
        width: 100%;
    }
    
    .detail-grid[b-69d3nrj9sv] {
        grid-template-columns: 1fr;
    }
    
    .notice-content[b-69d3nrj9sv] {
        flex-direction: column;
        text-align: center;
    }
}

@media (max-width: 480px) {
    .start-screen-header h1[b-69d3nrj9sv] {
        font-size: 1.8rem;
    }
    
    .start-screen-header p[b-69d3nrj9sv],
    .survey-description[b-69d3nrj9sv] {
        font-size: 1rem;
    }
    
    .emoji[b-69d3nrj9sv] {
        font-size: 3rem;
    }
    
    .detail-item[b-69d3nrj9sv] {
        padding: 15px;
    }
}
/* /Features/UserSurvey/UserSurveyPage.razor.rz.scp.css */
/* Modern Professional Survey Styles - Iswara Design System */
.survey-page[b-qzyfj0xdvb] {
    position: relative;
    min-height: 100vh;
    width: 100%;
    background: linear-gradient(135deg, #BFD8B8 0%, rgba(191, 216, 184, 0.3) 50%, #FFFFFF 100%);
    display: flex;
    flex-direction: column;
    font-family: 'Inter', 'Segoe UI', -apple-system, BlinkMacSystemFont, sans-serif;
    overflow-x: hidden;
    line-height: 1.6;
    transition: background 1s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

/* Dynamic background states based on responses */
.survey-page.response-excellent[b-qzyfj0xdvb] {
    background: linear-gradient(135deg, rgba(46, 204, 113, 0.15) 0%, rgba(39, 174, 96, 0.08) 40%, rgba(191, 216, 184, 0.1) 70%, #FFFFFF 100%);
}

.survey-page.response-good[b-qzyfj0xdvb] {
    background: linear-gradient(135deg, #BFD8B8 0%, rgba(191, 216, 184, 0.3) 50%, #FFFFFF 100%);
}

.survey-page.response-concerning[b-qzyfj0xdvb] {
    background: linear-gradient(135deg, rgba(255, 193, 7, 0.12) 0%, rgba(255, 179, 7, 0.06) 40%, rgba(200, 169, 81, 0.05) 70%, #FFFFFF 100%);
}

.survey-page.response-critical[b-qzyfj0xdvb] {
    background: linear-gradient(135deg, rgba(231, 76, 60, 0.1) 0%, rgba(192, 57, 43, 0.05) 40%, rgba(255, 107, 107, 0.03) 70%, #FFFFFF 100%);
}

.survey-container[b-qzyfj0xdvb] {
    position: relative;
    min-height: 100vh;
    width: 100%;
    max-width: 100%;
    overflow-x: hidden;
    background: transparent;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    padding: 0;
    margin: 0;
}

/* Previous Button - Bottom Left Corner, Bigger */
.simple-previous-container[b-qzyfj0xdvb] {
    position: fixed;
    bottom: 30px;
    left: 30px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    z-index: 1000;
}

.simple-previous-button[b-qzyfj0xdvb] {
    font-size: 1.1rem;
    padding: 12px 24px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

.previous-note[b-qzyfj0xdvb] {
    color: #6c757d;
    font-size: 0.75rem;
    text-align: center;
    background: white;
    padding: 4px 8px;
    border-radius: 4px;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
    white-space: nowrap;
}

/* Progress Container - Modern Design */
.progress-container[b-qzyfj0xdvb] {
    position: sticky;
    top: 0;
    z-index: 1000;
    background: rgba(255, 255, 255, 0.95);
    backdrop-filter: blur(10px);
    border-bottom: 1px solid rgba(226, 230, 234, 0.6);
    padding: 15px 0;
    margin-bottom: 0;
}

/* Enhanced Progress Bar */
.survey-progress[b-qzyfj0xdvb] {
    width: 100%;
    height: 6px;
    background: linear-gradient(90deg, rgba(226, 230, 234, 0.3) 0%, rgba(226, 230, 234, 0.6) 100%);
    border-radius: 3px;
    overflow: hidden;
    margin: 0;
    box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.1);
}

.progress-bar[b-qzyfj0xdvb] {
    height: 100%;
    background: linear-gradient(90deg, #C8A951 0%, #b8994a 50%, #C8A951 100%);
    transition: width 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    border-radius: 3px;
    position: relative;
    box-shadow: 0 2px 8px rgba(200, 169, 81, 0.3);
}

.progress-bar[b-qzyfj0xdvb]::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: linear-gradient(90deg, transparent 0%, rgba(255, 255, 255, 0.3) 50%, transparent 100%);
    animation: shimmer-b-qzyfj0xdvb 2s infinite linear;
}

@keyframes shimmer-b-qzyfj0xdvb {
    0% { transform: translateX(-100%); }
    100% { transform: translateX(100%); }
}

/* Survey Content Area */
.survey-content[b-qzyfj0xdvb] {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 40px 20px;
    min-height: calc(100vh - 80px);
    transition: all 0.6s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

/* Question Wrapper - Enhanced */
.survey-question-wrapper[b-qzyfj0xdvb] {
    position: relative;
    width: 100%;
    max-width: 900px;
    margin: 0 auto;
    padding: 0 20px;
    transition: all 0.6s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

/* Background States - Iswara Colors */
.bg-default[b-qzyfj0xdvb] {
    background: linear-gradient(135deg, #BFD8B8 0%, rgba(191, 216, 184, 0.3) 50%, #FFFFFF 100%) !important;
}
.bg-positive[b-qzyfj0xdvb] {
    background: linear-gradient(135deg, rgba(191, 216, 184, 0.4) 0%, rgba(191, 216, 184, 0.1) 50%, #FFFFFF 100%) !important;
}
.bg-concern[b-qzyfj0xdvb] {
    background: linear-gradient(135deg, rgba(200, 169, 81, 0.2) 0%, rgba(200, 169, 81, 0.05) 50%, #FFFFFF 100%) !important;
}
.bg-attention[b-qzyfj0xdvb] {
    background: linear-gradient(135deg, rgba(255, 107, 107, 0.15) 0%, rgba(255, 107, 107, 0.03) 50%, #FFFFFF 100%) !important;
}

/* Emoji Background - Much larger and more interactive */
.survey-emoji-bg[b-qzyfj0xdvb] {
    position: absolute;
    inset: 0;
    z-index: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    pointer-events: none;
    transition: opacity 0.4s ease-out;
}

.survey-emoji[b-qzyfj0xdvb] {
    font-size: 25rem;
    opacity: 0;
    transition: all 0.6s cubic-bezier(0.34, 1.56, 0.64, 1);
    filter: blur(1px);
    pointer-events: none;
    transform: scale(0.5) translateY(40px);
}

/* Active emoji state */
.animate-emoji .survey-emoji[b-qzyfj0xdvb] {
    opacity: 0.15;
    transform: scale(1) translateY(0);
}

/* Giant emoji that appears on selection */
.giant-emoji[b-qzyfj0xdvb] {
    position: fixed;
    top: 0;
    left: 0; /* Will adjust with JS */
    width: 100%;
    height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1500;
    pointer-events: none;
    opacity: 0;
    transition: opacity 0.4s ease-out;
}


.giant-emoji span[b-qzyfj0xdvb] {
    font-size: 15rem;
    transform: scale(0);
    transition: transform 0.6s cubic-bezier(0.34, 1.56, 0.64, 1);
}

.giant-emoji.show[b-qzyfj0xdvb] {
    opacity: 1;
}

.giant-emoji.show span[b-qzyfj0xdvb] {
    transform: scale(1);
    animation: floatUp-b-qzyfj0xdvb 1.5s forwards;
}

@keyframes floatUp-b-qzyfj0xdvb {
    0% { transform: scale(1); }
    70% { transform: scale(1.1) translateY(0); }
    100% { transform: scale(0.9) translateY(-200px); opacity: 0; }
}

/* Modern Question Card */
.survey-question-card[b-qzyfj0xdvb] {
    background: rgba(255, 255, 255, 0.95);
    backdrop-filter: blur(20px);
    border: 1px solid rgba(226, 230, 234, 0.4);
    border-radius: 20px;
    box-shadow: 
        0 8px 32px rgba(20, 33, 61, 0.08),
        0 4px 16px rgba(20, 33, 61, 0.04),
        inset 0 1px 0 rgba(255, 255, 255, 0.8);
    padding: 3rem 2.5rem;
    width: 100%;
    max-width: 700px;
    position: relative;
    z-index: 5;
    text-align: center;
    transition: all 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    opacity: 1;
    transform: translateY(0);
    margin: 0 auto;
}

.survey-question-card:hover[b-qzyfj0xdvb] {
    transform: translateY(-4px);
    box-shadow: 
        0 12px 40px rgba(20, 33, 61, 0.12),
        0 6px 20px rgba(20, 33, 61, 0.06),
        inset 0 1px 0 rgba(255, 255, 255, 0.9);
}

.question-exit[b-qzyfj0xdvb] {
    opacity: 0;
    transform: translateY(50px);
}

.question-enter[b-qzyfj0xdvb] {
    opacity: 0;
    transform: translateY(50px);
    animation: cardEnter-b-qzyfj0xdvb 0.8s cubic-bezier(0.34, 1.56, 0.64, 1) forwards;
    animation-delay: 0.3s;
}

@keyframes cardEnter-b-qzyfj0xdvb {
    from { opacity: 0; transform: translateY(50px); }
    to { opacity: 1; transform: translateY(0); }
}

.survey-question-card h2[b-qzyfj0xdvb] {
    font-size: 2.2rem;
    margin-bottom: 1rem;
    font-weight: 700;
    color: #14213D;
    line-height: 1.2;
    text-shadow: 0 1px 2px rgba(20, 33, 61, 0.1);
    letter-spacing: -0.02em;
}

.survey-question-description[b-qzyfj0xdvb] {
    font-size: 1.2rem;
    color: #2E2E2E;
    margin-bottom: 2.5rem;
    line-height: 1.6;
    font-weight: 400;
}

.survey-question-text[b-qzyfj0xdvb] {
    font-size: 1.5rem;
    font-weight: 600;
    margin-bottom: 2.5rem;
    color: #14213D;
    line-height: 1.4;
    letter-spacing: -0.01em;
}

/* Modern Answer Buttons */
.survey-answer-buttons[b-qzyfj0xdvb] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    margin-bottom: 3rem;
    transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.survey-answer-buttons.dimmed[b-qzyfj0xdvb] {
    opacity: 0.4;
    transform: scale(0.98);
}

.survey-answer-btn[b-qzyfj0xdvb] {
    font-size: 1.1rem;
    border-radius: 16px;
    padding: 1.2rem 1.8rem;
    background: rgba(255, 255, 255, 0.8);
    color: #14213D;
    border: 2px solid rgba(226, 230, 234, 0.6);
    box-shadow: 
        0 2px 8px rgba(20, 33, 61, 0.04),
        inset 0 1px 0 rgba(255, 255, 255, 0.9);
    transition: all 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    cursor: pointer;
    display: flex;
    align-items: center;
    text-align: left;
    position: relative;
    overflow: hidden;
    font-weight: 500;
    backdrop-filter: blur(10px);
}

.survey-answer-btn:hover:not(:disabled)[b-qzyfj0xdvb] {
    background: rgba(200, 169, 81, 0.08);
    border-color: rgba(200, 169, 81, 0.4);
    transform: translateX(8px) translateY(-2px);
    box-shadow: 
        0 6px 16px rgba(200, 169, 81, 0.15),
        inset 0 1px 0 rgba(255, 255, 255, 0.95);
}

.survey-answer-btn.selected[b-qzyfj0xdvb] {
    background: linear-gradient(135deg, #C8A951 0%, #b8994a 100%);
    border-color: #C8A951;
    color: white;
    font-weight: 600;
    transform: translateX(0);
    box-shadow: 
        0 8px 24px rgba(200, 169, 81, 0.3),
        inset 0 1px 0 rgba(255, 255, 255, 0.2);
    animation: selected-pulse-b-qzyfj0xdvb 2s ease-in-out infinite;
}

.survey-answer-btn.selected .answer-emoji[b-qzyfj0xdvb] {
    transform: scale(1.2);
}

@keyframes selected-pulse-b-qzyfj0xdvb {
    0%, 100% { 
        box-shadow: 
            0 8px 24px rgba(200, 169, 81, 0.3),
            0 0 0 0 rgba(200, 169, 81, 0.3),
            inset 0 1px 0 rgba(255, 255, 255, 0.2);
    }
    50% { 
        box-shadow: 
            0 10px 28px rgba(200, 169, 81, 0.4),
            0 0 0 8px rgba(200, 169, 81, 0.1),
            inset 0 1px 0 rgba(255, 255, 255, 0.3);
    }
}

.answer-emoji[b-qzyfj0xdvb] {
    font-size: 1.8rem;
    margin-right: 18px;
    display: inline-block;
    transition: all 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    filter: drop-shadow(0 1px 2px rgba(0, 0, 0, 0.1));
}

.answer-text[b-qzyfj0xdvb] {
    flex: 1;
}

/* Modern Feedback Message */
.survey-feedback-message[b-qzyfj0xdvb] {
    margin: 2rem auto;
    font-size: 1.2rem;
    color: #14213D;
    background: rgba(191, 216, 184, 0.15);
    backdrop-filter: blur(10px);
    border: 1px solid rgba(191, 216, 184, 0.3);
    border-radius: 16px;
    padding: 1.2rem 2rem;
    opacity: 0;
    transform: translateY(20px);
    max-width: 90%;
    font-weight: 500;
    box-shadow: 
        0 4px 16px rgba(20, 33, 61, 0.06),
        inset 0 1px 0 rgba(255, 255, 255, 0.8);
    text-align: center;
}

.message-appear[b-qzyfj0xdvb] {
    animation: messageAppear-b-qzyfj0xdvb 0.6s cubic-bezier(0.34, 1.56, 0.64, 1) forwards;
}

@keyframes messageAppear-b-qzyfj0xdvb {
    from {
        opacity: 0;
        transform: translateY(30px) scale(0.95);
    }
    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

/* Modern Next Button */
.survey-next-btn[b-qzyfj0xdvb] {
    margin-top: 2rem;
    font-size: 1.1rem;
    padding: 1.2rem 3rem;
    border-radius: 50px;
    font-weight: 600;
    background: linear-gradient(135deg, #14213D 0%, #1a2b4a 100%);
    color: #ffffff;
    border: none;
    box-shadow: 
        0 6px 20px rgba(20, 33, 61, 0.2),
        inset 0 1px 0 rgba(255, 255, 255, 0.1);
    transition: all 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    cursor: pointer;
    animation: fadeInUp-b-qzyfj0xdvb 0.8s ease-out;
    opacity: 0;
    transform: translateY(20px);
    animation-fill-mode: forwards;
    letter-spacing: 0.02em;
}

.survey-next-btn:hover[b-qzyfj0xdvb] {
    background: linear-gradient(135deg, #1a2b4a 0%, #14213D 100%);
    transform: translateY(-4px);
    box-shadow: 
        0 10px 32px rgba(20, 33, 61, 0.3),
        inset 0 1px 0 rgba(255, 255, 255, 0.15);
}

.survey-next-btn:active[b-qzyfj0xdvb] {
    transform: translateY(-1px);
}

@keyframes fadeInUp-b-qzyfj0xdvb {
    from {
        opacity: 0;
        transform: translateY(20px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Modern Start Card */
.survey-start-card[b-qzyfj0xdvb] {
    background: rgba(255, 255, 255, 0.95);
    backdrop-filter: blur(20px);
    border: 1px solid rgba(226, 230, 234, 0.4);
    border-radius: 24px;
    box-shadow: 
        0 12px 40px rgba(20, 33, 61, 0.08),
        0 6px 20px rgba(20, 33, 61, 0.04),
        inset 0 1px 0 rgba(255, 255, 255, 0.8);
    padding: 3.5rem;
    width: 100%;
    max-width: 700px;
    position: relative;
    z-index: 2;
    text-align: center;
    margin: 0 auto;
    transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    min-height: 400px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}

.survey-start-card:hover[b-qzyfj0xdvb] {
    transform: translateY(-6px);
    box-shadow: 
        0 16px 48px rgba(20, 33, 61, 0.12),
        0 8px 24px rgba(20, 33, 61, 0.06),
        inset 0 1px 0 rgba(255, 255, 255, 0.9);
}

.survey-header h2[b-qzyfj0xdvb] {
    font-size: 2.8rem;
    font-weight: 700;
    color: #14213D;
    margin-bottom: 1.5rem;
    line-height: 1.1;
    letter-spacing: -0.02em;
    text-shadow: 0 2px 4px rgba(20, 33, 61, 0.1);
}

.survey-emoji-intro[b-qzyfj0xdvb] {
    font-size: 8rem;
    margin: 2.5rem 0;
    position: relative;
    filter: drop-shadow(0 4px 8px rgba(0, 0, 0, 0.1));
}

.survey-emoji-intro[b-qzyfj0xdvb]::after {
    content: '';
    position: absolute;
    width: 240px;
    height: 240px;
    background: radial-gradient(circle, rgba(200, 169, 81, 0.1) 0%, rgba(200, 169, 81, 0.05) 50%, transparent 100%);
    border-radius: 50%;
    z-index: -1;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    animation: glow-pulse-b-qzyfj0xdvb 3s ease-in-out infinite;
}

@keyframes glow-pulse-b-qzyfj0xdvb {
    0%, 100% { opacity: 0.6; transform: translate(-50%, -50%) scale(1); }
    50% { opacity: 1; transform: translate(-50%, -50%) scale(1.1); }
}

.emoji[b-qzyfj0xdvb] {
    display: inline-block;
}

.emoji.pulse[b-qzyfj0xdvb] {
    animation: emoji-pulse-b-qzyfj0xdvb 3s infinite;
}

@keyframes emoji-pulse-b-qzyfj0xdvb {
    0% { transform: scale(1); }
    10% { transform: scale(1.1); }
    20% { transform: scale(0.95); }
    30% { transform: scale(1.05); }
    40% { transform: scale(1); }
    100% { transform: scale(1); }
}

.survey-start-btn[b-qzyfj0xdvb] {
    margin-top: 2.5rem;
    font-size: 1.3rem;
    padding: 1.3rem 3.5rem;
    border-radius: 50px;
    font-weight: 600;
    background: linear-gradient(135deg, #C8A951 0%, #b8994a 100%);
    color: #ffffff;
    border: none;
    box-shadow: 
        0 8px 24px rgba(200, 169, 81, 0.3),
        inset 0 1px 0 rgba(255, 255, 255, 0.2);
    transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    position: relative;
    overflow: hidden;
    z-index: 1;
    letter-spacing: 0.02em;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
}

.survey-start-btn[b-qzyfj0xdvb]::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 0%;
    height: 100%;
    background: linear-gradient(135deg, #b8994a 0%, #C8A951 100%);
    transition: width 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    z-index: -1;
    border-radius: 50px;
}

.survey-start-btn:hover[b-qzyfj0xdvb] {
    box-shadow: 
        0 12px 32px rgba(200, 169, 81, 0.4),
        inset 0 1px 0 rgba(255, 255, 255, 0.3);
    transform: translateY(-4px) scale(1.02);
}

.survey-start-btn:hover[b-qzyfj0xdvb]::before {
    width: 100%;
}

/* Enhanced Confetti Effects */
.confetti-container[b-qzyfj0xdvb] {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh;
    pointer-events: none;
    z-index: 9999;
    overflow: hidden;
}

.confetti[b-qzyfj0xdvb] {
    position: absolute;
    width: 8px;
    height: 8px;
    background: linear-gradient(45deg, #C8A951, #b8994a);
    opacity: 0.8;
    z-index: 9999;
    border-radius: 2px;
    box-shadow: 0 2px 4px rgba(200, 169, 81, 0.3);
}

.raindrop[b-qzyfj0xdvb] {
    position: absolute;
    background: linear-gradient(180deg, rgba(20, 33, 61, 0.6), rgba(20, 33, 61, 0.3));
    border-radius: 50px;
    opacity: 0.6;
    box-shadow: 0 2px 4px rgba(20, 33, 61, 0.2);
}

/* Modern Loading Overlay */
.loading-overlay[b-qzyfj0xdvb] {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(255, 255, 255, 0.95);
    backdrop-filter: blur(10px);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    z-index: 10000;
    transition: all 0.3s ease;
}

.loading-content[b-qzyfj0xdvb] {
    text-align: center;
    padding: 2rem;
    background: rgba(255, 255, 255, 0.9);
    border-radius: 20px;
    box-shadow: 
        0 8px 32px rgba(20, 33, 61, 0.08),
        inset 0 1px 0 rgba(255, 255, 255, 0.8);
    border: 1px solid rgba(226, 230, 234, 0.4);
}

.loading-content .spinner-border[b-qzyfj0xdvb] {
    width: 3rem;
    height: 3rem;
    border-width: 3px;
    border-color: #C8A951;
    border-right-color: transparent;
    margin-bottom: 1.5rem;
}

.loading-content p[b-qzyfj0xdvb] {
    color: #14213D;
    font-size: 1.1rem;
    font-weight: 500;
    margin: 0;
    letter-spacing: 0.01em;
}

/* Responsive Design - Tablet */
@media (max-width: 1024px) {
    .survey-content[b-qzyfj0xdvb] {
        padding: 30px 15px;
    }
    
    .survey-question-card[b-qzyfj0xdvb] {
        padding: 2.5rem 2rem;
        max-width: 600px;
    }
    
    .progress-container[b-qzyfj0xdvb] {
        padding: 12px 0;
    }
}

/* Responsive Design - Mobile */
@media (max-width: 768px) {
    .survey-page[b-qzyfj0xdvb] {
        background: linear-gradient(135deg, #BFD8B8 0%, rgba(191, 216, 184, 0.2) 30%, #FFFFFF 70%);
    }
    
    .survey-content[b-qzyfj0xdvb] {
        padding: 20px 10px;
        min-height: calc(100vh - 50px);
    }
    
    .survey-question-card[b-qzyfj0xdvb] {
        padding: 2rem 1.5rem;
        margin: 0 5px;
        border-radius: 16px;
        backdrop-filter: blur(15px);
    }

    .survey-question-card h2[b-qzyfj0xdvb] {
        font-size: 2rem;
        margin-bottom: 0.8rem;
    }
    
    .survey-question-text[b-qzyfj0xdvb] {
        font-size: 1.3rem;
        margin-bottom: 2rem;
    }

    .survey-start-card[b-qzyfj0xdvb] {
        padding: 2.5rem 1.5rem;
        margin: 0 5px;
        min-height: 300px;
        backdrop-filter: blur(15px);
    }

    .survey-emoji-intro[b-qzyfj0xdvb] {
        font-size: 6rem;
        margin: 1.5rem 0;
    }

    .giant-emoji span[b-qzyfj0xdvb] {
        font-size: 8rem;
    }

    .survey-header h2[b-qzyfj0xdvb] {
        font-size: 2.2rem;
        margin-bottom: 1rem;
    }
    
    .survey-answer-btn[b-qzyfj0xdvb] {
        padding: 1rem 1.4rem;
        font-size: 1rem;
        border-radius: 14px;
    }
    
    .answer-emoji[b-qzyfj0xdvb] {
        font-size: 1.6rem;
        margin-right: 15px;
    }
    
    .survey-next-btn[b-qzyfj0xdvb],
    .survey-start-btn[b-qzyfj0xdvb] {
        padding: 1rem 2.5rem;
        font-size: 1.1rem;
    }
    
    .progress-container[b-qzyfj0xdvb] {
        padding: 10px 0;
    }
    
    .survey-progress[b-qzyfj0xdvb] {
        height: 5px;
    }
}

@media (max-width: 480px) {
    .survey-question-card[b-qzyfj0xdvb] {
        padding: 1.5rem 1rem;
        margin: 0 3px;
    }
    
    .survey-question-card h2[b-qzyfj0xdvb] {
        font-size: 1.8rem;
    }
    
    .survey-question-text[b-qzyfj0xdvb] {
        font-size: 1.2rem;
        margin-bottom: 1.8rem;
    }
    
    .survey-start-card[b-qzyfj0xdvb] {
        padding: 2rem 1rem;
        margin: 0 3px;
    }
    
    .survey-header h2[b-qzyfj0xdvb] {
        font-size: 2rem;
    }
    
    .survey-emoji-intro[b-qzyfj0xdvb] {
        font-size: 5rem;
        margin: 1rem 0;
    }
    
    .survey-answer-btn[b-qzyfj0xdvb] {
        padding: 0.9rem 1.2rem;
        font-size: 0.95rem;
        border-radius: 12px;
    }
    
    .answer-emoji[b-qzyfj0xdvb] {
        font-size: 1.4rem;
        margin-right: 12px;
    }
    
    .survey-next-btn[b-qzyfj0xdvb],
    .survey-start-btn[b-qzyfj0xdvb] {
        padding: 0.9rem 2rem;
        font-size: 1rem;
    }
    
    .giant-emoji span[b-qzyfj0xdvb] {
        font-size: 6rem;
    }
    
    .survey-emoji[b-qzyfj0xdvb] {
        font-size: 20rem;
    }
}

/* Enhanced Wave Background Effects */
.wave-background[b-qzyfj0xdvb] {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh;
    z-index: 1;
    opacity: 0;
    overflow: hidden;
    pointer-events: none;
    transition: opacity 0.6s ease;
}

.wave[b-qzyfj0xdvb] {
    position: absolute;
    width: 200%;
    height: 100%;
    background: linear-gradient(
        90deg, 
        transparent 0%, 
        rgba(191, 216, 184, 0.1) 25%,
        rgba(200, 169, 81, 0.1) 50%,
        rgba(191, 216, 184, 0.1) 75%,
        transparent 100%
    );
    transform: translateX(-50%);
    animation: wave-b-qzyfj0xdvb 12s ease-in-out infinite;
}

@keyframes wave-b-qzyfj0xdvb {
    0% { 
        transform: translateX(-50%) skewX(0deg) scaleY(1);
        opacity: 0.3;
    }
    25% {
        transform: translateX(-25%) skewX(5deg) scaleY(1.1);
        opacity: 0.5;
    }
    50% { 
        transform: translateX(0%) skewX(10deg) scaleY(1.2);
        opacity: 0.7;
    }
    75% {
        transform: translateX(25%) skewX(5deg) scaleY(1.1);
        opacity: 0.5;
    }
    100% { 
        transform: translateX(50%) skewX(0deg) scaleY(1);
        opacity: 0.3;
    }
}

/* Enhanced Giant Emoji Animation */
.giant-emoji[b-qzyfj0xdvb] {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 9998;
    pointer-events: none;
    opacity: 0;
    transition: opacity 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    backdrop-filter: blur(1px);
}

.giant-emoji span[b-qzyfj0xdvb] {
    font-size: 12rem;
    transform: scale(0) rotate(-15deg);
    transition: all 0.8s cubic-bezier(0.34, 1.56, 0.64, 1);
    filter: drop-shadow(0 8px 32px rgba(200, 169, 81, 0.3));
    text-shadow: 0 4px 16px rgba(0, 0, 0, 0.1);
}

.giant-emoji.show[b-qzyfj0xdvb] {
    opacity: 1;
}

.giant-emoji.show span[b-qzyfj0xdvb] {
    transform: scale(1) rotate(0deg);
    animation: celebrateEmoji-b-qzyfj0xdvb 2s cubic-bezier(0.25, 0.46, 0.45, 0.94) forwards;
}

@keyframes celebrateEmoji-b-qzyfj0xdvb {
    0% { 
        transform: scale(1) rotate(0deg);
        filter: drop-shadow(0 8px 32px rgba(200, 169, 81, 0.3));
    }
    25% { 
        transform: scale(1.15) rotate(5deg);
        filter: drop-shadow(0 12px 40px rgba(200, 169, 81, 0.4));
    }
    50% { 
        transform: scale(1.1) rotate(-3deg) translateY(-20px);
        filter: drop-shadow(0 16px 48px rgba(200, 169, 81, 0.5));
    }
    75% { 
        transform: scale(0.95) rotate(2deg) translateY(-40px);
        filter: drop-shadow(0 20px 56px rgba(200, 169, 81, 0.3));
    }
    100% { 
        transform: scale(0.8) rotate(0deg) translateY(-100px);
        opacity: 0;
        filter: drop-shadow(0 24px 64px rgba(200, 169, 81, 0.1));
    }
}

/* Enhanced Background Emoji */
.survey-emoji-bg[b-qzyfj0xdvb] {
    position: absolute;
    inset: 0;
    z-index: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    pointer-events: none;
    transition: all 0.6s ease-out;
    overflow: hidden;
}

.survey-emoji[b-qzyfj0xdvb] {
    font-size: 30rem;
    opacity: 0;
    transition: all 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    filter: blur(2px) brightness(1.1);
    pointer-events: none;
    transform: scale(0.3) translateY(60px) rotate(-10deg);
    text-shadow: 0 4px 20px rgba(200, 169, 81, 0.2);
}

/* Active emoji state */
.animate-emoji .survey-emoji[b-qzyfj0xdvb] {
    opacity: 0.12;
    transform: scale(1) translateY(0) rotate(0deg);
    filter: blur(1px) brightness(1.05);
}

/* Card enter/exit animations */
.question-exit[b-qzyfj0xdvb] {
    opacity: 0;
    transform: translateY(30px) scale(0.98);
    transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.question-enter[b-qzyfj0xdvb] {
    opacity: 0;
    transform: translateY(30px) scale(0.98);
    animation: cardEnter-b-qzyfj0xdvb 0.8s cubic-bezier(0.34, 1.56, 0.64, 1) forwards;
    animation-delay: 0.2s;
}

@keyframes cardEnter-b-qzyfj0xdvb {
    0% { 
        opacity: 0; 
        transform: translateY(30px) scale(0.98);
    }
    60% {
        opacity: 0.8;
        transform: translateY(-5px) scale(1.01);
    }
    100% { 
        opacity: 1; 
        transform: translateY(0) scale(1);
    }
}

/* Enhanced message appear animation */
.message-appear[b-qzyfj0xdvb] {
    animation: messageAppear-b-qzyfj0xdvb 0.6s cubic-bezier(0.34, 1.56, 0.64, 1) forwards;
}

@keyframes messageAppear-b-qzyfj0xdvb {
    0% {
        opacity: 0;
        transform: translateY(30px) scale(0.95);
    }
    60% {
        opacity: 0.8;
        transform: translateY(-5px) scale(1.02);
    }
    100% {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

/* Enhanced fadeInUp animation */
@keyframes fadeInUp-b-qzyfj0xdvb {
    from {
        opacity: 0;
        transform: translateY(30px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}
/* /_Shared/Layout/EmptyLayout.razor.rz.scp.css */
html[b-k135fch0eq], body[b-k135fch0eq] {
    height: 100%;
    margin: 0;
    padding: 0;
}

.empty-layout-container[b-k135fch0eq] {
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    background: linear-gradient(135deg, #f8f9fa 0%, #e2e6ea 50%, #bfd8b8 100%);
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    width: 100%;
}

/* Error UI styling */
#blazor-error-ui[b-k135fch0eq] {
    background: lightyellow;
    bottom: 0;
    box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
    display: none;
    left: 0;
    padding: 0.6rem 1.25rem 0.7rem 1.25rem;
    position: fixed;
    width: 100%;
    z-index: 1000;
}

#blazor-error-ui .dismiss[b-k135fch0eq] {
    cursor: pointer;
    position: absolute;
    right: 0.75rem;
    top: 0.5rem;
}

/* Remove any default margins/padding that might interfere */
*[b-k135fch0eq] {
    box-sizing: border-box;
}

/* Ensure full viewport usage */
#app[b-k135fch0eq] {
    width: 100%;
    min-height: 100vh;
}

/* Override any bootstrap container constraints for auth pages */
.container-fluid[b-k135fch0eq] {
    padding: 0;
    max-width: none;
}

/* Responsive adjustments */
@media (max-width: 768px) {
    .empty-layout-container[b-k135fch0eq] {
        padding: 0;
    }
}
/* /_Shared/Layout/MainLayout.razor.rz.scp.css */
/* Global Responsive Foundation */
*[b-ilkpb0uqth] {
    box-sizing: border-box;
}

.page[b-ilkpb0uqth] {
    position: relative;
    display: flex;
    flex-direction: row;
    min-height: 100vh;
    background: linear-gradient(180deg, #D0E5CA 0%, rgba(185, 213, 175, 1) 40%, rgba(125, 145, 120, 1) 100%);
    margin: 0;
    padding: 0;
    width: 100%;
    overflow-x: hidden;
}

.sidebar[b-ilkpb0uqth] {
    width: 80px;
    height: 100vh;
    position: fixed;
    top: 0;
    left: 0;
    flex-shrink: 0;
    z-index: 1000;
    transition: all 0.3s ease;
}

.main-wrapper[b-ilkpb0uqth] {
    flex: 1;
    display: flex;
    flex-direction: column;
    background: transparent;
    margin-left: 62px;
    min-height: 100vh;
    padding: clamp(15px, 3vw, 20px);
    width: calc(100% - 80px);
    box-sizing: border-box;
    transition: all 0.3s ease;
}

.top-bar[b-ilkpb0uqth] {
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.4) 0%, rgba(91, 154, 158, 0.05) 100%);
    backdrop-filter: blur(5px);
    padding: 0.5rem 2rem;
    border-bottom: 1px solid rgba(91, 154, 158, 0.1);
    border-radius: 20px 20px 0 0;
}

.top-bar-content[b-ilkpb0uqth] {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.back-btn[b-ilkpb0uqth] {
    color: #14213D;
    font-weight: 600;
    cursor: pointer;
    text-shadow: 0 1px 2px rgba(255, 255, 255, 0.8);
    transition: all 0.3s ease;
}

.back-btn:hover[b-ilkpb0uqth] {
    color: #5B9A9E;
    transform: translateX(-2px);
}

.user-info[b-ilkpb0uqth] {
    display: flex;
    align-items: center;
    gap: 1rem;
    color: #14213D;
    text-shadow: 0 1px 2px rgba(255, 255, 255, 0.8);
    font-weight: 600;
}

.member-avatars[b-ilkpb0uqth] {
    display: flex;
    gap: -5px;
}

.avatar[b-ilkpb0uqth] {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: linear-gradient(45deg, #C8A951, #F0E68C);
    border: 2px solid rgba(255, 255, 255, 0.9);
    margin-left: -5px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1), 0 1px 3px rgba(200, 169, 81, 0.3);
}

.avatar:first-child[b-ilkpb0uqth] {
    margin-left: 0;
}

.floating-content[b-ilkpb0uqth] {
    flex: 1;
    background: #FFFFFF;
    backdrop-filter: blur(12px);
    border-radius: clamp(15px, 2vw, 20px);
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.15), 0 8px 25px rgba(95, 115, 92, 0.2);
    border: 1px solid rgba(255, 255, 255, 0.25);
    overflow: visible;
    display: flex;
    flex-direction: column;
    max-height: calc(100vh - clamp(30px, 6vw, 40px));
    width: 100%;
    box-sizing: border-box;
}

.content[b-ilkpb0uqth] {
    flex: 1;
    padding: clamp(1rem, 4vw, 2rem);
    background: transparent;
    overflow-y: auto;
    max-height: 100%;
    width: 100%;
    box-sizing: border-box;
}

.app-footer[b-ilkpb0uqth] {
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.2) 0%, rgba(248, 250, 252, 0.15) 100%);
    backdrop-filter: blur(10px);
    padding: clamp(0.5rem, 2vw, 0.8rem) clamp(1rem, 4vw, 2rem);
    border-top: 1px solid rgba(255, 255, 255, 0.15);
    margin-top: auto;
    border-radius: 0 0 clamp(15px, 2vw, 20px) clamp(15px, 2vw, 20px);
    width: 100%;
    box-sizing: border-box;
}

.footer-content[b-ilkpb0uqth] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-size: clamp(0.75rem, 1.5vw, 0.8rem);
    flex-wrap: wrap;
    gap: 10px;
}

.copyright[b-ilkpb0uqth] {
    color: #14213D;
    font-weight: 500;
    text-shadow: 0 1px 2px rgba(255, 255, 255, 0.5);
    opacity: 0.8;
}

.footer-links[b-ilkpb0uqth] {
    display: flex;
    gap: 1.5rem;
}

.footer-links a[b-ilkpb0uqth] {
    color: #5B9A9E;
    text-decoration: none;
    transition: all 0.3s;
    font-weight: 500;
    text-shadow: 0 1px 2px rgba(255, 255, 255, 0.5);
    opacity: 0.8;
}

.footer-links a:hover[b-ilkpb0uqth] {
    color: #C8A951;
    text-decoration: underline;
    transform: translateY(-1px);
    opacity: 1;
}

.reload-link[b-ilkpb0uqth] {
    color: #cccccc !important; /* Very faint color */
    font-style: italic;
    cursor: pointer;
}

.reload-link:hover[b-ilkpb0uqth] {
    color: #999999 !important;
}

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

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

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

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

/* Comprehensive Responsive Design */

/* Large Tablets and Small Desktops */
@media (max-width: 1024px) {
    .main-wrapper[b-ilkpb0uqth] {
        padding: clamp(12px, 2.5vw, 18px);
    }
    
    .content[b-ilkpb0uqth] {
        padding: clamp(1.2rem, 3vw, 1.8rem);
    }
    
    .footer-links[b-ilkpb0uqth] {
        gap: clamp(0.8rem, 2vw, 1.2rem);
        flex-wrap: wrap;
    }
}

/* Tablets */
@media (max-width: 768px) {
    .main-wrapper[b-ilkpb0uqth] {
        padding: clamp(10px, 2vw, 15px);
        margin-left: 80px;
        width: calc(100% - 80px);
    }
    
    .content[b-ilkpb0uqth] {
        padding: clamp(1rem, 2.5vw, 1.5rem);
    }
    
    .floating-content[b-ilkpb0uqth] {
        border-radius: clamp(12px, 2vw, 16px);
        max-height: calc(100vh - clamp(20px, 4vw, 30px));
    }
    
    .top-bar[b-ilkpb0uqth] {
        padding: clamp(0.6rem, 2vw, 0.8rem) clamp(1rem, 3vw, 1.5rem);
        border-radius: clamp(12px, 2vw, 16px) clamp(12px, 2vw, 16px) 0 0;
    }
    
    .app-footer[b-ilkpb0uqth] {
        padding: clamp(0.6rem, 2vw, 0.8rem) clamp(1rem, 3vw, 1.5rem);
        border-radius: 0 0 clamp(12px, 2vw, 16px) clamp(12px, 2vw, 16px);
    }
    
    .footer-content[b-ilkpb0uqth] {
        flex-direction: column;
        gap: clamp(0.5rem, 1vw, 0.8rem);
        text-align: center;
    }
    
    .footer-links[b-ilkpb0uqth] {
        gap: clamp(0.8rem, 2vw, 1rem);
        justify-content: center;
        flex-wrap: wrap;
    }
    
    .user-info[b-ilkpb0uqth] {
        gap: 0.5rem;
    }
    
    .member-avatars[b-ilkpb0uqth] {
        display: none; /* Hide avatars on tablets */
    }
}

/* Mobile Landscape and Small Tablets */
@media (max-width: 640px) {
    .page[b-ilkpb0uqth] {
        flex-direction: column;
        overflow-x: hidden;
    }

    .sidebar[b-ilkpb0uqth] {
        width: 100%;
        height: 80px;
        position: static;
        top: 0;
        left: 0;
        z-index: 1001;
        flex-shrink: 0;
    }

    .main-wrapper[b-ilkpb0uqth] {
        margin-left: 0;
        padding: clamp(5px, 1.5vw, 8px);
        width: 100%;
        min-height: calc(100vh - 80px);
    }

    .floating-content[b-ilkpb0uqth] {
        border-radius: clamp(10px, 2vw, 15px);
        max-height: calc(100vh - 90px);
        margin: 0;
    }
    
    .content[b-ilkpb0uqth] {
        padding: clamp(0.5rem, 2.5vw, 0.8rem);
        flex: 1;
        overflow-y: auto;
    }

    .top-bar[b-ilkpb0uqth] {
        padding: clamp(0.6rem, 2vw, 0.8rem) clamp(0.8rem, 3vw, 1rem);
        border-radius: clamp(10px, 2vw, 15px) clamp(10px, 2vw, 15px) 0 0;
    }
    
    .app-footer[b-ilkpb0uqth] {
        padding: clamp(0.4rem, 1.5vw, 0.5rem) clamp(0.8rem, 3vw, 1rem);
        border-radius: 0 0 clamp(10px, 2vw, 15px) clamp(10px, 2vw, 15px);
    }

    .footer-content[b-ilkpb0uqth] {
        flex-direction: row;
        justify-content: center;
        gap: 0;
        text-align: center;
        align-items: center;
    }

    .copyright[b-ilkpb0uqth] {
        margin: 0;
        font-size: clamp(0.65rem, 1.8vw, 0.75rem);
        opacity: 0.8;
    }

    .footer-links[b-ilkpb0uqth] {
        display: none; /* Hide footer links on mobile landscape */
    }
}

/* Small Mobile Phones */
@media (max-width: 480px) {
    .page[b-ilkpb0uqth] {
        min-height: 100vh;
    }
    
    .main-wrapper[b-ilkpb0uqth] {
        padding: clamp(6px, 1.5vw, 10px);
    }
    
    .floating-content[b-ilkpb0uqth] {
        border-radius: clamp(8px, 2vw, 12px);
        box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1), 0 4px 15px rgba(95, 115, 92, 0.15);
    }
    
    .content[b-ilkpb0uqth] {
        padding: clamp(0.6rem, 3vw, 1rem);
    }
    
    .app-footer[b-ilkpb0uqth] {
        padding: clamp(0.3rem, 1vw, 0.4rem) clamp(0.6rem, 3vw, 0.8rem);
    }
    
    .footer-content[b-ilkpb0uqth] {
        gap: 0;
        flex-direction: row;
        align-items: center;
        justify-content: center;
        min-height: auto;
    }
    
    .footer-links[b-ilkpb0uqth] {
        display: none; /* Hide all footer links on mobile */
    }
    
    .copyright[b-ilkpb0uqth] {
        font-size: clamp(0.6rem, 1.5vw, 0.65rem);
        margin: 0;
        text-align: center;
        opacity: 0.7;
    }
}

/* Extra Small Mobile */
@media (max-width: 360px) {
    .main-wrapper[b-ilkpb0uqth] {
        padding: 5px;
        min-height: calc(100vh - 80px);
    }
    
    .floating-content[b-ilkpb0uqth] {
        border-radius: 8px;
        margin: 0;
    }
    
    .content[b-ilkpb0uqth] {
        padding: clamp(0.5rem, 4vw, 0.8rem);
    }
    
    .app-footer[b-ilkpb0uqth] {
        padding: clamp(0.2rem, 1vw, 0.3rem) clamp(0.5rem, 2vw, 0.6rem);
    }
    
    .footer-content[b-ilkpb0uqth] {
        gap: 0;
        flex-direction: row;
        align-items: center;
        justify-content: center;
    }
    
    .footer-links[b-ilkpb0uqth] {
        display: none; /* Hide all footer links on extra small mobile */
    }
    
    .copyright[b-ilkpb0uqth] {
        font-size: clamp(0.55rem, 1.5vw, 0.6rem);
        margin: 0;
        text-align: center;
        opacity: 0.7;
    }
}

/* Remove the !important rules from here since they can cause issues */
@media (min-width: 641px) {
    .top-row[b-ilkpb0uqth], article[b-ilkpb0uqth] {
        padding-left: 2rem;
        padding-right: 2rem;
    }

    .top-row.auth[b-ilkpb0uqth]  a:first-child {
        flex: 1;
        text-align: right;
        width: 0;
    }
}
/* /_Shared/Layout/NavMenu.razor.rz.scp.css */
/* Global Responsive Foundation */
*[b-dvlq60t2wc] {
    box-sizing: border-box;
}

/* Modern sage green gradient sidebar - light to dark */
.nav-sidebar[b-dvlq60t2wc] {
    position: fixed;
    left: 0;
    top: 0;
    width: 80px;
    height: 100vh;
    color: #ffffff;
    display: flex;
    flex-direction: column;
    z-index: 1000;
    font-family: 'Titillium Web', sans-serif;
    border-radius: 0;
    overflow: visible;
    transition: all 0.3s ease;
}

.sidebar-header[b-dvlq60t2wc] {
    padding: clamp(0.8rem, 2vw, 1rem) clamp(0.3rem, 1vw, 0.5rem);
    display: flex;
    justify-content: center;
    align-items: center;
    margin-bottom: clamp(0.8rem, 2vw, 1rem);
    background: transparent;
    flex-shrink: 0;
    width: 100%;
    box-sizing: border-box;
}

.sidebar-logo[b-dvlq60t2wc] {
    height: clamp(25px, 4vw, 30px);
    width: auto;
    transition: all 0.3s ease;
    /* Remove white filter to show original gold/navy logo colors */
}

.sidebar-ul[b-dvlq60t2wc] {
    list-style: none;
    margin: 0;
    padding: clamp(0.4rem, 1vw, 0.5rem) 0 clamp(1.5rem, 3vw, 2rem) 0;
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: clamp(0.25rem, 0.5vw, 0.35rem);
    overflow-y: auto;
    overflow-x: visible;
    min-height: 0;
    scrollbar-width: none;
    -ms-overflow-style: none;
    width: 100%;
    box-sizing: border-box;
}

.sidebar-li[b-dvlq60t2wc] {
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    margin: clamp(0.15rem, 0.3vw, 0.2rem) 0;
    border-radius: 50%;
    transition: all 0.3s ease-in-out;
    background: #ffffff;
    color: #C8A951;
    position: relative;
    width: clamp(48px, 8vw, 52px);
    height: clamp(48px, 8vw, 52px);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2), 0 2px 6px rgba(20, 33, 61, 0.3);
    flex-shrink: 0;
}

.sidebar-li:hover[b-dvlq60t2wc] {
    background: #ffffff;
    color: #C8A951;
    transform: scale(1.03);
    box-shadow: 0 6px 16px rgba(0, 0, 0, 0.25), 0 3px 8px rgba(200, 169, 81, 0.3);
}

.sidebar-li.sidebar-active[b-dvlq60t2wc] {
    background: #C8A951;
    color: #ffffff;
    transform: scale(1.05);
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.3), 0 4px 12px rgba(200, 169, 81, 0.4), 0 2px 6px rgba(255, 255, 255, 0.2);
}

.sidebar-icon-container[b-dvlq60t2wc] {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    transition: all 0.3s;
}

.sidebar-li.sidebar-active .sidebar-icon-container[b-dvlq60t2wc] {
    background: transparent;
}

.sidebar-icon[b-dvlq60t2wc] {
    font-size: clamp(1rem, 2vw, 1.1rem);
    color: inherit;
    transition: all 0.3s;
}

.sidebar-li:hover .sidebar-icon[b-dvlq60t2wc] {
    color: inherit;
}

.sidebar-li.sidebar-active .sidebar-icon[b-dvlq60t2wc] {
    color: inherit;
}

.sidebar-text[b-dvlq60t2wc] {
    display: none; /* Hide text in compact sidebar */
}

.sidebar-footer[b-dvlq60t2wc] {
    padding: 1.2rem 1.5rem;
    font-size: 0.75rem;
    color: #b4b4cc; /* Light blue-gray */
    text-align: center;
    border-top: 1px solid #f6f4e7; /* Very light gold tint */
}

/* Comprehensive Responsive Design */

/* Large Tablets and Small Desktops */
@media (max-width: 1024px) {
    .nav-sidebar[b-dvlq60t2wc] {
        width: 80px; /* Keep consistent width */
    }

    .sidebar-li[b-dvlq60t2wc] {
        width: clamp(46px, 7vw, 50px);
        height: clamp(46px, 7vw, 50px);
        margin: clamp(0.4rem, 1vw, 0.5rem) clamp(0.3rem, 0.5vw, 0.4rem);
    }

    .sidebar-icon[b-dvlq60t2wc] {
        font-size: clamp(0.95rem, 1.8vw, 1rem);
    }
}

/* Tablets */
@media (max-width: 768px) {
    .nav-sidebar[b-dvlq60t2wc] {
        width: 80px;
    }

    .sidebar-header[b-dvlq60t2wc] {
        padding: clamp(0.6rem, 1.5vw, 0.8rem) clamp(0.3rem, 0.8vw, 0.4rem);
        margin-bottom: clamp(0.6rem, 1.5vw, 0.8rem);
    }

    .sidebar-logo[b-dvlq60t2wc] {
        height: clamp(22px, 3.5vw, 28px);
    }

    .sidebar-li[b-dvlq60t2wc] {
        width: clamp(44px, 6vw, 48px);
        height: clamp(44px, 6vw, 48px);
        margin: clamp(0.3rem, 0.8vw, 0.4rem) clamp(0.2rem, 0.4vw, 0.3rem);
    }

    .sidebar-icon[b-dvlq60t2wc] {
        font-size: clamp(0.9rem, 1.6vw, 0.95rem);
    }

    .sidebar-ul[b-dvlq60t2wc] {
        gap: clamp(0.2rem, 0.4vw, 0.3rem);
        padding: clamp(0.3rem, 0.8vw, 0.4rem) 0 clamp(1.2rem, 2.5vw, 1.5rem) 0;
    }
}

/* Mobile Landscape and Small Tablets */
@media (max-width: 640px) {
    .nav-sidebar[b-dvlq60t2wc] {
        width: 100%;
        height: 80px;
        flex-direction: row;
        border-radius: 0;
        position: static;
        top: 0;
        left: 0;
        background: linear-gradient(90deg, #D0E5CA 0%, rgba(185, 213, 175, 1) 40%, rgba(125, 145, 120, 1) 100%);
        z-index: 1000;
    }

    .sidebar-header[b-dvlq60t2wc] {
        padding: clamp(0.8rem, 2vw, 1rem);
        margin: 0;
        margin-right: auto;
        flex-shrink: 0;
    }

    .sidebar-logo[b-dvlq60t2wc] {
        height: clamp(30px, 5vw, 35px);
    }

    .sidebar-ul[b-dvlq60t2wc] {
        display: flex;
        flex-direction: row;
        padding: clamp(0.3rem, 1vw, 0.5rem) clamp(0.4rem, 1vw, 0.6rem);
        margin: 0;
        align-items: center;
        justify-content: flex-start;
        gap: clamp(0.25rem, 1vw, 0.4rem);
        flex: 1;
        overflow-x: auto;
        overflow-y: hidden;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
        -ms-overflow-style: none;
    }

    .sidebar-ul[b-dvlq60t2wc]::-webkit-scrollbar {
        display: none;
    }

    .sidebar-li[b-dvlq60t2wc] {
        width: clamp(45px, 8vw, 50px);
        height: clamp(45px, 8vw, 50px);
        margin: 0;
        background: #ffffff;
        color: #C8A951;
        flex-shrink: 0;
        min-width: 45px;
        box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15), 0 1px 4px rgba(20, 33, 61, 0.2);
    }

    .sidebar-li:hover[b-dvlq60t2wc] {
        transform: scale(1.05);
        box-shadow: 0 3px 12px rgba(0, 0, 0, 0.2), 0 2px 6px rgba(200, 169, 81, 0.3);
    }

    .sidebar-li.sidebar-active[b-dvlq60t2wc] {
        background: #C8A951;
        color: #ffffff;
        transform: scale(1.08);
        box-shadow: 0 4px 16px rgba(0, 0, 0, 0.25), 0 2px 8px rgba(200, 169, 81, 0.4);
    }

    .sidebar-icon[b-dvlq60t2wc] {
        font-size: clamp(0.9rem, 2vw, 1rem);
    }
}

/* Small Mobile Phones */
@media (max-width: 480px) {
    .nav-sidebar[b-dvlq60t2wc] {
        height: 80px;
    }

    .sidebar-header[b-dvlq60t2wc] {
        padding: clamp(0.6rem, 2vw, 0.8rem);
    }

    .sidebar-logo[b-dvlq60t2wc] {
        height: clamp(28px, 6vw, 32px);
    }

    .sidebar-ul[b-dvlq60t2wc] {
        padding: clamp(0.3rem, 1vw, 0.5rem);
        gap: clamp(0.2rem, 1vw, 0.4rem);
        justify-content: flex-start;
    }

    .sidebar-li[b-dvlq60t2wc] {
        width: clamp(42px, 9vw, 46px);
        height: clamp(42px, 9vw, 46px);
        box-shadow: 0 3px 8px rgba(0, 0, 0, 0.15), 0 1px 4px rgba(20, 33, 61, 0.2);
    }

    .sidebar-li:hover[b-dvlq60t2wc] {
        transform: scale(1.02);
        box-shadow: 0 4px 10px rgba(0, 0, 0, 0.2), 0 2px 6px rgba(200, 169, 81, 0.25);
    }

    .sidebar-li.sidebar-active[b-dvlq60t2wc] {
        transform: scale(1.03);
        box-shadow: 0 5px 15px rgba(0, 0, 0, 0.25), 0 2px 8px rgba(200, 169, 81, 0.3);
    }

    .sidebar-icon[b-dvlq60t2wc] {
        font-size: clamp(0.85rem, 2.2vw, 0.9rem);
    }
}

/* Extra Small Mobile */
@media (max-width: 360px) {
    .nav-sidebar[b-dvlq60t2wc] {
        height: 75px;
    }

    .sidebar-header[b-dvlq60t2wc] {
        padding: clamp(0.5rem, 2vw, 0.6rem);
    }

    .sidebar-logo[b-dvlq60t2wc] {
        height: clamp(25px, 7vw, 30px);
    }

    .sidebar-ul[b-dvlq60t2wc] {
        padding: clamp(0.2rem, 1vw, 0.4rem);
        gap: clamp(0.15rem, 1vw, 0.3rem);
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    .sidebar-li[b-dvlq60t2wc] {
        width: clamp(38px, 10vw, 42px);
        height: clamp(38px, 10vw, 42px);
        min-width: 38px;
    }

    .sidebar-icon[b-dvlq60t2wc] {
        font-size: clamp(0.8rem, 2.5vw, 0.85rem);
    }

    /* Ensure horizontal scrolling works on very small screens */
    .sidebar-ul[b-dvlq60t2wc]::-webkit-scrollbar {
        height: 2px;
    }

    .sidebar-ul[b-dvlq60t2wc]::-webkit-scrollbar-track {
        background: transparent;
    }

    .sidebar-ul[b-dvlq60t2wc]::-webkit-scrollbar-thumb {
        background: rgba(255, 255, 255, 0.3);
        border-radius: 2px;
    }
}

/* Hide scrollbar while keeping functionality */
.sidebar-ul[b-dvlq60t2wc]::-webkit-scrollbar {
    width: 0px;
    background: transparent;
}

.sidebar-ul[b-dvlq60t2wc] {
    scrollbar-width: none;
    -ms-overflow-style: none;
}
/* /_Shared/UI/Accordion/IswaraAccordion.razor.rz.scp.css */
/* Iswara Accordion Component Styles */
.iswara-accordion[b-saf0fy3uml] {
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    border-radius: 8px;
    overflow: hidden;
    border: 1px solid #E2E6EA;
}

.iswara-accordion .e-acrdn-item[b-saf0fy3uml] {
    border-bottom: 1px solid #E2E6EA;
}

.iswara-accordion .e-acrdn-header[b-saf0fy3uml] {
    background-color: #14213D;
    color: #FFFFFF;
    padding: 16px 20px;
    font-weight: 600;
    transition: all 0.2s ease;
}

.iswara-accordion .e-acrdn-header:hover[b-saf0fy3uml] {
    background-color: #1a2951;
}

.iswara-accordion__content[b-saf0fy3uml] {
    padding: 20px;
    color: #2E2E2E;
    line-height: 1.6;
    background-color: #FFFFFF;
}

.iswara-accordion .e-acrdn-content[b-saf0fy3uml] {
    border: none;
}
/* /_Shared/UI/BoxWhiskerChart/IswaraBoxWhiskerChart.razor.rz.scp.css */
.iswara-box-whisker-chart-container[b-7ncmqrv3xv] {
    border: 1px solid #E2E6EA;
    border-radius: 8px;
    background: #FFFFFF;
    box-shadow: 0 2px 8px rgba(20, 33, 61, 0.08);
    padding: 24px;
    margin-bottom: 24px;
    overflow: hidden;
}

.iswara-box-whisker-chart__title[b-7ncmqrv3xv] {
    font-size: 18px;
    font-weight: 600;
    color: #14213D;
    margin-bottom: 16px;
    text-align: center;
    font-family: "Segoe UI", sans-serif;
}

.iswara-box-whisker-chart__description[b-7ncmqrv3xv] {
    font-size: 14px;
    color: #2E2E2E;
    margin-top: 16px;
    text-align: center;
    font-style: italic;
    font-family: "Segoe UI", sans-serif;
}

/* Responsive design */
@media (max-width: 768px) {
    .iswara-box-whisker-chart-container[b-7ncmqrv3xv] {
        padding: 16px;
        margin-bottom: 16px;
    }
    
    .iswara-box-whisker-chart__title[b-7ncmqrv3xv] {
        font-size: 16px;
        margin-bottom: 12px;
    }
    
    .iswara-box-whisker-chart__description[b-7ncmqrv3xv] {
        font-size: 13px;
        margin-top: 12px;
    }
}

/* Dark mode support */
@media (prefers-color-scheme: dark) {
    .iswara-box-whisker-chart-container[b-7ncmqrv3xv] {
        background: #1a1a1a;
        border-color: #3a3a3a;
        color: #ffffff;
    }
    
    .iswara-box-whisker-chart__title[b-7ncmqrv3xv] {
        color: #ffffff;
    }
    
    .iswara-box-whisker-chart__description[b-7ncmqrv3xv] {
        color: #cccccc;
    }
}

/* Animation for container appearance */
.iswara-box-whisker-chart-container[b-7ncmqrv3xv] {
    animation: fadeInUp-b-7ncmqrv3xv 0.3s ease-out forwards;
}

@keyframes fadeInUp-b-7ncmqrv3xv {
    from {
        opacity: 0;
        transform: translateY(20px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}
/* /_Shared/UI/Button/IswaraButton.razor.rz.scp.css */
/* Iswara Button Component Styles */
/* Using Iswara Color Palette:
   - Navy Blue (#14213D) - Primary
   - Gold (#C8A951) - Accent
   - Dark Charcoal (#2E2E2E) - Secondary
   - Pure White (#FFFFFF) - Background
   - Light Gray (#E2E6EA) - Subtle backgrounds
   - Sage Green (#BFD8B8) - Success/secondary accent
*/

.iswara-button[b-60agv94h56] {
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    font-weight: 500;
    border-radius: 8px;
    border: none;
    transition: all 0.3s ease;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    box-shadow: 0 2px 4px rgba(20, 33, 61, 0.1);
    position: relative;
    overflow: hidden;
}

.iswara-button:hover[b-60agv94h56] {
    transform: translateY(-1px);
    box-shadow: 0 4px 8px rgba(20, 33, 61, 0.15);
}

.iswara-button:active[b-60agv94h56] {
    transform: translateY(0);
    box-shadow: 0 2px 4px rgba(20, 33, 61, 0.2);
}

.iswara-button:disabled[b-60agv94h56] {
    opacity: 0.6;
    cursor: not-allowed;
    transform: none;
    box-shadow: none;
}

/* Size Variants */
.iswara-button--small[b-60agv94h56] {
    padding: 8px 16px;
    font-size: 0.875rem;
    min-height: 32px;
}

.iswara-button--medium[b-60agv94h56] {
    padding: 12px 20px;
    font-size: 1rem;
    min-height: 40px;
}

.iswara-button--large[b-60agv94h56] {
    padding: 16px 24px;
    font-size: 1.125rem;
    min-height: 48px;
}

/* Color Variants */
.iswara-button--primary[b-60agv94h56] {
    background-color: #14213D;
    color: #FFFFFF;
}

.iswara-button--primary:hover:not(:disabled)[b-60agv94h56] {
    background-color: #1a2951;
}

.iswara-button--secondary[b-60agv94h56] {
    background-color: #2E2E2E;
    color: #FFFFFF;
}

.iswara-button--secondary:hover:not(:disabled)[b-60agv94h56] {
    background-color: #3a3a3a;
}

.iswara-button--success[b-60agv94h56] {
    background-color: #BFD8B8;
    color: #2E2E2E;
}

.iswara-button--success:hover:not(:disabled)[b-60agv94h56] {
    background-color: #a8c79a;
}

.iswara-button--warning[b-60agv94h56] {
    background-color: #C8A951;
    color: #FFFFFF;
}

.iswara-button--warning:hover:not(:disabled)[b-60agv94h56] {
    background-color: #b59943;
}

.iswara-button--danger[b-60agv94h56] {
    background-color: #dc3545;
    color: #FFFFFF;
}

.iswara-button--danger:hover:not(:disabled)[b-60agv94h56] {
    background-color: #c82333;
}

.iswara-button--info[b-60agv94h56] {
    background-color: #17a2b8;
    color: #FFFFFF;
}

.iswara-button--info:hover:not(:disabled)[b-60agv94h56] {
    background-color: #138496;
}

.iswara-button--light[b-60agv94h56] {
    background-color: #E2E6EA;
    color: #2E2E2E;
}

.iswara-button--light:hover:not(:disabled)[b-60agv94h56] {
    background-color: #d1d7db;
}

.iswara-button--dark[b-60agv94h56] {
    background-color: #343a40;
    color: #FFFFFF;
}

.iswara-button--dark:hover:not(:disabled)[b-60agv94h56] {
    background-color: #23272b;
}

.iswara-button--outline[b-60agv94h56] {
    background-color: transparent;
    color: #14213D;
    border: 2px solid #14213D;
}

.iswara-button--outline:hover:not(:disabled)[b-60agv94h56] {
    background-color: #14213D;
    color: #FFFFFF;
}

/* Icon Spacing */
.iswara-button--with-icon .button-text[b-60agv94h56] {
    margin-left: 8px;
}

.iswara-button i[b-60agv94h56] {
    font-size: 1em;
    line-height: 1;
}

/* Focus States for Accessibility */
.iswara-button:focus[b-60agv94h56] {
    outline: none;
    box-shadow: 0 0 0 3px rgba(200, 169, 81, 0.3);
}

/* Loading State */
.iswara-button--loading[b-60agv94h56] {
    position: relative;
    color: transparent;
}

.iswara-button--loading[b-60agv94h56]::after {
    content: '';
    position: absolute;
    width: 16px;
    height: 16px;
    top: 50%;
    left: 50%;
    margin-left: -8px;
    margin-top: -8px;
    border: 2px solid transparent;
    border-top-color: currentColor;
    border-radius: 50%;
    animation: spin-b-60agv94h56 1s linear infinite;
}

@keyframes spin-b-60agv94h56 {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

/* Responsive Design */
@media (max-width: 768px) {
    .iswara-button--large[b-60agv94h56] {
        padding: 14px 20px;
        font-size: 1rem;
        min-height: 44px;
    }
    
    .iswara-button--medium[b-60agv94h56] {
        padding: 10px 16px;
        font-size: 0.9rem;
        min-height: 36px;
    }
    
    .iswara-button--small[b-60agv94h56] {
        padding: 6px 12px;
        font-size: 0.8rem;
        min-height: 28px;
    }
}
/* /_Shared/UI/Card/IswaraCard.razor.rz.scp.css */
/* Using default Syncfusion card styling with Bootstrap-style variants */

/* GLOBAL override for e-card borders - this will override Bootstrap completely */
[b-afu2yz1gsm] .e-card,
[b-afu2yz1gsm] .e-card.card,
[b-afu2yz1gsm] div.e-card,
[b-afu2yz1gsm] .e-card:hover,
[b-afu2yz1gsm] .e-card:focus,
[b-afu2yz1gsm] .e-card:active {
    -webkit-tap-highlight-color: #0d6efd !important;
    background: #fff !important;
    border: 0px solid transparent !important;
    border-width: 0px !important;
    border-style: none !important;
    border-color: transparent !important;
    box-shadow: none !important;
    color: #212529 !important;
    outline: none !important;
}

/* Even more specific override */
[b-afu2yz1gsm] .e-card {
    border: 0 !important;
}

/* Override all border variants - border will always be none */
:deep(.e-card.border-primary)[b-afu2yz1gsm],
:deep(.e-card.border-secondary)[b-afu2yz1gsm],
:deep(.e-card.border-success)[b-afu2yz1gsm],
:deep(.e-card.border-warning)[b-afu2yz1gsm],
:deep(.e-card.border-danger)[b-afu2yz1gsm],
:deep(.e-card.border-info)[b-afu2yz1gsm],
:deep(.e-card.border-light)[b-afu2yz1gsm],
:deep(.e-card.border-dark)[b-afu2yz1gsm],
:deep(.e-card.border-2)[b-afu2yz1gsm] {
    border: none !important;
}

.border-primary[b-afu2yz1gsm] {
    border-color: #0d6efd !important;
}

.border-secondary[b-afu2yz1gsm] {
    border-color: #6c757d !important;
}

.border-success[b-afu2yz1gsm] {
    border-color: #198754 !important;
}

.border-warning[b-afu2yz1gsm] {
    border-color: #ffc107 !important;
}

.border-danger[b-afu2yz1gsm] {
    border-color: #dc3545 !important;
}

.border-info[b-afu2yz1gsm] {
    border-color: #0dcaf0 !important;
}

.border-light[b-afu2yz1gsm] {
    border-color: #f8f9fa !important;
}

.border-dark[b-afu2yz1gsm] {
    border-color: #212529 !important;
}

.shadow-lg[b-afu2yz1gsm] {
    box-shadow: 0 1rem 3rem rgba(0, 0, 0, 0.175) !important;
}

.border-2[b-afu2yz1gsm] {
    border-width: 2px !important;
}

/* Card title with icon styling */
.card-title-container[b-afu2yz1gsm] {
    display: flex;
    align-items: center;
    gap: 8px;
}

.card-title-icon[b-afu2yz1gsm] {
    font-size: 1.1em;
    color: #14213D; /* Iswara Navy Blue */
}

.card-title-container span[b-afu2yz1gsm] {
    flex: 1;
}
/* /_Shared/UI/CircularGauge/IswaraCircularGauge.razor.rz.scp.css */
/* Iswara Circular Gauge Component Styles */
/* Using Iswara Color Palette */

.iswara-circular-gauge-container[b-jz1riuiv8e] {
    background-color: #FFFFFF;
    border-radius: 12px;
    padding: 20px;
    box-shadow: 0 2px 8px rgba(20, 33, 61, 0.08);
    border: 1px solid #E2E6EA;
    text-align: center;
    position: relative;
    overflow: hidden;
}

.iswara-circular-gauge__title[b-jz1riuiv8e] {
    font-size: 1.25rem;
    font-weight: 600;
    color: #14213D;
    margin-bottom: 16px;
    line-height: 1.4;
}

.iswara-circular-gauge__description[b-jz1riuiv8e] {
    font-size: 0.875rem;
    color: #2E2E2E;
    margin-top: 16px;
    line-height: 1.5;
    font-style: italic;
}

/* Gauge Styling */
.iswara-circular-gauge[b-jz1riuiv8e] {
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
}

/* Center Content */
.gauge-center-content[b-jz1riuiv8e] {
    text-align: center;
    font-family: 'Segoe UI', sans-serif;
}

.gauge-value[b-jz1riuiv8e] {
    font-size: 2rem;
    font-weight: 700;
    color: #14213D;
    line-height: 1;
    margin-bottom: 4px;
}

.gauge-label[b-jz1riuiv8e] {
    font-size: 1rem;
    color: #2E2E2E;
    font-weight: 500;
}

/* Legend */
.iswara-circular-gauge__legend[b-jz1riuiv8e] {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 20px;
    margin-top: 16px;
    flex-wrap: wrap;
}

.legend-item[b-jz1riuiv8e] {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 0.875rem;
    color: #2E2E2E;
    font-weight: 500;
}

.legend-color[b-jz1riuiv8e] {
    width: 12px;
    height: 12px;
    border-radius: 50%;
    border: 1px solid rgba(46, 46, 46, 0.2);
    flex-shrink: 0;
}

.legend-text[b-jz1riuiv8e] {
    line-height: 1;
}

/* Gauge Animation */
.iswara-circular-gauge .e-pointer-animation[b-jz1riuiv8e] {
    transition-timing-function: cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

/* Responsive Design */
@media (max-width: 1024px) {
    .iswara-circular-gauge-container[b-jz1riuiv8e] {
        padding: 16px;
    }
    
    .iswara-circular-gauge__title[b-jz1riuiv8e] {
        font-size: 1.125rem;
        margin-bottom: 12px;
    }
    
    .gauge-value[b-jz1riuiv8e] {
        font-size: 1.75rem;
    }
    
    .gauge-label[b-jz1riuiv8e] {
        font-size: 0.9rem;
    }
    
    .iswara-circular-gauge__legend[b-jz1riuiv8e] {
        gap: 16px;
    }
}

@media (max-width: 768px) {
    .iswara-circular-gauge-container[b-jz1riuiv8e] {
        padding: 12px;
        margin: 0 -12px;
        border-radius: 0;
        border-left: none;
        border-right: none;
    }
    
    .iswara-circular-gauge__title[b-jz1riuiv8e] {
        font-size: 1rem;
        margin-bottom: 8px;
    }
    
    .gauge-value[b-jz1riuiv8e] {
        font-size: 1.5rem;
    }
    
    .gauge-label[b-jz1riuiv8e] {
        font-size: 0.8rem;
    }
    
    .iswara-circular-gauge__legend[b-jz1riuiv8e] {
        gap: 12px;
        margin-top: 12px;
    }
    
    .legend-item[b-jz1riuiv8e] {
        font-size: 0.8rem;
        gap: 6px;
    }
    
    .legend-color[b-jz1riuiv8e] {
        width: 10px;
        height: 10px;
    }
    
    .iswara-circular-gauge__description[b-jz1riuiv8e] {
        font-size: 0.8rem;
        margin-top: 12px;
    }
}

/* Loading State */
.iswara-circular-gauge-container.loading[b-jz1riuiv8e] {
    position: relative;
}

.iswara-circular-gauge-container.loading[b-jz1riuiv8e]::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(255, 255, 255, 0.8);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 10;
    border-radius: 12px;
}

.iswara-circular-gauge-container.loading[b-jz1riuiv8e]::after {
    content: 'Loading gauge...';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    color: #2E2E2E;
    font-weight: 500;
    z-index: 11;
}

/* Error State */
.iswara-circular-gauge-container.error[b-jz1riuiv8e] {
    border-color: #ef4444;
    background-color: rgba(239, 68, 68, 0.05);
}

.iswara-circular-gauge-container.error .iswara-circular-gauge__title[b-jz1riuiv8e] {
    color: #ef4444;
}

/* Success State */
.iswara-circular-gauge-container.success .gauge-value[b-jz1riuiv8e] {
    color: #22c55e;
}

/* Warning State */
.iswara-circular-gauge-container.warning .gauge-value[b-jz1riuiv8e] {
    color: #C8A951;
}

/* Danger State */
.iswara-circular-gauge-container.danger .gauge-value[b-jz1riuiv8e] {
    color: #ef4444;
}

/* Interactive States */
.iswara-circular-gauge-container.interactive[b-jz1riuiv8e] {
    cursor: pointer;
    transition: all 0.2s ease;
}

.iswara-circular-gauge-container.interactive:hover[b-jz1riuiv8e] {
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(20, 33, 61, 0.15);
}

.iswara-circular-gauge-container.interactive:active[b-jz1riuiv8e] {
    transform: translateY(0);
}

/* Print Styles */
@media print {
    .iswara-circular-gauge-container[b-jz1riuiv8e] {
        box-shadow: none;
        border: 1px solid #000;
        break-inside: avoid;
        background-color: #fff;
    }
    
    .iswara-circular-gauge__title[b-jz1riuiv8e],
    .gauge-value[b-jz1riuiv8e],
    .gauge-label[b-jz1riuiv8e],
    .legend-text[b-jz1riuiv8e] {
        color: #000 !important;
    }
    
    .iswara-circular-gauge__description[b-jz1riuiv8e] {
        color: #000;
    }
}

/* Accessibility */
.iswara-circular-gauge:focus[b-jz1riuiv8e] {
    outline: 2px solid #C8A951;
    outline-offset: 2px;
}

/* High Contrast Mode */
@media (prefers-contrast: high) {
    .iswara-circular-gauge-container[b-jz1riuiv8e] {
        border: 2px solid #000;
        background-color: #fff;
    }
    
    .iswara-circular-gauge__title[b-jz1riuiv8e],
    .gauge-value[b-jz1riuiv8e],
    .gauge-label[b-jz1riuiv8e],
    .legend-text[b-jz1riuiv8e] {
        color: #000;
    }
    
    .legend-color[b-jz1riuiv8e] {
        border: 2px solid #000;
    }
}

/* Dark Mode Support */
@media (prefers-color-scheme: dark) {
    .iswara-circular-gauge-container[b-jz1riuiv8e] {
        background-color: #2E2E2E;
        border-color: #3a3a3a;
        color: #FFFFFF;
    }
    
    .iswara-circular-gauge__title[b-jz1riuiv8e] {
        color: #FFFFFF;
    }
    
    .gauge-value[b-jz1riuiv8e] {
        color: #C8A951;
    }
    
    .gauge-label[b-jz1riuiv8e],
    .legend-text[b-jz1riuiv8e] {
        color: #E2E6EA;
    }
    
    .iswara-circular-gauge__description[b-jz1riuiv8e] {
        color: #E2E6EA;
    }
}
/* /_Shared/UI/DataGrid/IswaraDataGrid.razor.rz.scp.css */
/* Iswara DataGrid Component Styles */
/* Using Iswara Color Palette */

.iswara-datagrid[b-ccta7hp4j3] {
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 2px 8px rgba(20, 33, 61, 0.08);
    background-color: #FFFFFF;
}

/* Grid Header */
.iswara-datagrid .e-grid .e-gridheader[b-ccta7hp4j3] {
    background-color: #14213D;
    color: #FFFFFF;
    font-weight: 600;
    border-bottom: 2px solid #C8A951;
}

.iswara-datagrid .e-grid .e-columnheader[b-ccta7hp4j3] {
    background: linear-gradient(135deg, #14213D 0%, #2E2E2E 100%);
    color: #FFFFFF;
    border-right: 1px solid rgba(255, 255, 255, 0.1);
    padding: 20px 16px;
    font-size: 1rem;
    text-transform: uppercase;
    letter-spacing: 0.8px;
    font-weight: 700;
}

.iswara-datagrid .e-grid .e-columnheader:hover[b-ccta7hp4j3] {
    background: linear-gradient(135deg, #1a2951 0%, #3a3a3a 100%);
}

/* Sort Icons */
.iswara-datagrid .e-grid .e-icon-ascending[b-ccta7hp4j3],
.iswara-datagrid .e-grid .e-icon-descending[b-ccta7hp4j3] {
    color: #C8A951;
}

/* Grid Content */
.iswara-datagrid .e-grid .e-content[b-ccta7hp4j3] {
    background-color: #FFFFFF;
}

.iswara-datagrid .e-grid .e-row[b-ccta7hp4j3] {
    border-bottom: 1px solid #E2E6EA;
    transition: background-color 0.2s ease;
}

.iswara-datagrid .e-grid .e-row:hover[b-ccta7hp4j3] {
    background: linear-gradient(135deg, rgba(191, 216, 184, 0.15) 0%, rgba(226, 230, 234, 0.15) 100%);
    transform: translateY(-1px);
    box-shadow: 0 4px 16px rgba(20, 33, 61, 0.08);
}

.iswara-datagrid .e-grid .e-row.e-altrow[b-ccta7hp4j3] {
    background-color: rgba(226, 230, 234, 0.3);
}

.iswara-datagrid .e-grid .e-row.e-altrow:hover[b-ccta7hp4j3] {
    background-color: rgba(191, 216, 184, 0.15);
}

.iswara-datagrid .e-grid .e-rowcell[b-ccta7hp4j3] {
    padding: 20px 16px;
    color: #14213D;
    border-right: 1px solid rgba(226, 230, 234, 0.6);
    font-size: 1rem;
    line-height: 1.5;
    font-weight: 500;
}

/* Selected Row */
.iswara-datagrid .e-grid .e-row.e-active[b-ccta7hp4j3] {
    background-color: rgba(200, 169, 81, 0.1);
    border-color: #C8A951;
}

.iswara-datagrid .e-grid .e-row.e-active .e-rowcell[b-ccta7hp4j3] {
    border-color: #C8A951;
    color: #14213D;
    font-weight: 500;
}

/* Grid Themes */
.iswara-datagrid--striped .e-grid .e-row:nth-child(even)[b-ccta7hp4j3] {
    background-color: rgba(226, 230, 234, 0.2);
}

.iswara-datagrid--bordered .e-grid .e-rowcell[b-ccta7hp4j3] {
    border: 1px solid #E2E6EA;
}

.iswara-datagrid--hover .e-grid .e-row:hover[b-ccta7hp4j3] {
    background-color: rgba(200, 169, 81, 0.1);
    transform: translateY(-1px);
    box-shadow: 0 2px 4px rgba(20, 33, 61, 0.1);
}

.iswara-datagrid--compact .e-grid .e-rowcell[b-ccta7hp4j3],
.iswara-datagrid--compact .e-grid .e-columnheader[b-ccta7hp4j3] {
    padding: 8px 10px;
}

/* Pagination */
.iswara-datagrid .e-grid .e-pager[b-ccta7hp4j3] {
    background-color: #FFFFFF;
    border-top: 2px solid #E2E6EA;
    padding: 16px;
}

.iswara-datagrid .e-grid .e-pager .e-pagercontainer[b-ccta7hp4j3] {
    justify-content: center;
}

.iswara-datagrid .e-grid .e-pager .e-numericcontainer .e-link[b-ccta7hp4j3] {
    color: #2E2E2E;
    border: 1px solid #E2E6EA;
    border-radius: 4px;
    margin: 0 2px;
    padding: 8px 12px;
    transition: all 0.2s ease;
}

.iswara-datagrid .e-grid .e-pager .e-numericcontainer .e-link:hover[b-ccta7hp4j3] {
    background-color: #BFD8B8;
    border-color: #BFD8B8;
    color: #2E2E2E;
}

.iswara-datagrid .e-grid .e-pager .e-numericcontainer .e-currentitem[b-ccta7hp4j3] {
    background-color: #14213D;
    border-color: #14213D;
    color: #FFFFFF;
}

.iswara-datagrid .e-grid .e-pager .e-prevpagedisabled[b-ccta7hp4j3],
.iswara-datagrid .e-grid .e-pager .e-nextpagedisabled[b-ccta7hp4j3] {
    opacity: 0.5;
    cursor: not-allowed;
}

/* Filter Bar */
.iswara-datagrid .e-grid .e-filterbar[b-ccta7hp4j3] {
    background-color: rgba(226, 230, 234, 0.5);
    border-bottom: 1px solid #E2E6EA;
}

.iswara-datagrid .e-grid .e-filterbar .e-filterbarcell[b-ccta7hp4j3] {
    padding: 8px 12px;
}

.iswara-datagrid .e-grid .e-filterbar .e-input[b-ccta7hp4j3] {
    border: 1px solid #E2E6EA;
    border-radius: 4px;
    padding: 6px 10px;
    font-size: 0.875rem;
    transition: border-color 0.2s ease;
}

.iswara-datagrid .e-grid .e-filterbar .e-input:focus[b-ccta7hp4j3] {
    border-color: #C8A951;
    outline: none;
    box-shadow: 0 0 0 2px rgba(200, 169, 81, 0.2);
}

/* Loading State */
.iswara-datagrid .e-grid .e-spinner-pane[b-ccta7hp4j3] {
    background-color: rgba(255, 255, 255, 0.8);
}

.iswara-datagrid .e-grid .e-spinner-inner[b-ccta7hp4j3] {
    border-top-color: #14213D;
    border-left-color: #C8A951;
}

/* Empty State */
.iswara-datagrid .e-grid .e-emptyrow[b-ccta7hp4j3] {
    text-align: center;
    padding: 40px 20px;
    color: #2E2E2E;
    font-style: italic;
}

/* Toolbar */
.iswara-datagrid .e-grid .e-toolbar[b-ccta7hp4j3] {
    background-color: #E2E6EA;
    border-bottom: 1px solid #C8A951;
    padding: 12px 16px;
}

.iswara-datagrid .e-grid .e-toolbar .e-tbar-btn[b-ccta7hp4j3] {
    background-color: #14213D;
    color: #FFFFFF;
    border: none;
    border-radius: 4px;
    padding: 8px 16px;
    margin-right: 8px;
    transition: all 0.2s ease;
}

.iswara-datagrid .e-grid .e-toolbar .e-tbar-btn:hover[b-ccta7hp4j3] {
    background-color: #1a2951;
    transform: translateY(-1px);
}

/* Responsive Design */
@media (max-width: 768px) {
    .iswara-datagrid .e-grid .e-rowcell[b-ccta7hp4j3],
    .iswara-datagrid .e-grid .e-columnheader[b-ccta7hp4j3] {
        padding: 12px 8px;
        font-size: 0.8rem;
    }
    
    .iswara-datagrid .e-grid .e-pager[b-ccta7hp4j3] {
        padding: 12px 8px;
    }
    
    .iswara-datagrid .e-grid .e-pager .e-numericcontainer .e-link[b-ccta7hp4j3] {
        padding: 6px 8px;
        font-size: 0.8rem;
    }
}

/* Accessibility */
.iswara-datagrid .e-grid .e-rowcell:focus[b-ccta7hp4j3],
.iswara-datagrid .e-grid .e-columnheader:focus[b-ccta7hp4j3] {
    outline: 2px solid #C8A951;
    outline-offset: -2px;
}

/* Print Styles */
@media print {
    .iswara-datagrid .e-grid .e-pager[b-ccta7hp4j3] {
        display: none;
    }
    
    .iswara-datagrid .e-grid .e-toolbar[b-ccta7hp4j3] {
        display: none;
    }
}
/* /_Shared/UI/DropDown/IswaraDropDown.razor.rz.scp.css */
.iswara-dropdown-container[b-o8p8p67pe3] {
    display: flex;
    flex-direction: column;
    gap: 6px;
    margin-bottom: 16px;
}

.iswara-dropdown-label[b-o8p8p67pe3] {
    font-size: 14px;
    font-weight: 600;
    margin-bottom: 4px;
    display: block;
    color: rgb(20, 33, 61) !important;
}

.iswara-dropdown-label.required[b-o8p8p67pe3]::after {
    content: "*";
    color: #dc3545;
    margin-left: 4px;
}

.iswara-dropdown-validation[b-o8p8p67pe3] {
    display: flex;
    align-items: center;
    gap: 6px;
    color: #dc3545;
    font-size: 12px;
    margin-top: 4px;
}

.iswara-dropdown-validation i[b-o8p8p67pe3] {
    font-size: 12px;
}

.iswara-dropdown-help[b-o8p8p67pe3] {
    color: #6c757d;
    font-size: 12px;
    margin-top: 4px;
    line-height: 1.4;
}

/* Enhanced Syncfusion DropDown Styling */
.iswara-dropdown-control[b-o8p8p67pe3] {
    border: 1px solid #ced4da;
    border-radius: 6px;
    padding: 8px 12px;
    font-size: 14px;
    transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
    background-color: #ffffff;
}

.iswara-dropdown-control:focus[b-o8p8p67pe3] {
    border-color: #C8A951;
    outline: 0;
    box-shadow: 0 0 0 0.2rem rgba(200, 169, 81, 0.25);
}

.iswara-dropdown-control.error[b-o8p8p67pe3] {
    border-color: #dc3545;
}

.iswara-dropdown-control.error:focus[b-o8p8p67pe3] {
    border-color: #dc3545;
    box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.25);
}

/* Syncfusion specific styling overrides */
[b-o8p8p67pe3] .e-ddl {
    border: 1px solid #ced4da !important;
    border-radius: 6px !important;
    font-size: 14px !important;
}

[b-o8p8p67pe3] .e-ddl:focus {
    border-color: #C8A951 !important;
    box-shadow: 0 0 0 0.2rem rgba(200, 169, 81, 0.25) !important;
}

[b-o8p8p67pe3] .e-ddl.error {
    border-color: #dc3545 !important;
}

[b-o8p8p67pe3] .e-input-group.e-control-wrapper .e-input {
    padding: 8px 12px !important;
}
/* /_Shared/UI/FormInput/IswaraFormInput.razor.rz.scp.css */
/* Iswara Form Input Component Styles */
.iswara-form-input-container[b-dnhkxrlrg4] {
    margin-bottom: 16px;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
}

.iswara-form-input__label[b-dnhkxrlrg4] {
    display: block;
    font-size: 0.875rem;
    font-weight: 500;
    color: rgb(20, 33, 61) !important;
    margin-bottom: 6px;
}

.iswara-form-input__label.required[b-dnhkxrlrg4] {
    position: relative;
}

.required-asterisk[b-dnhkxrlrg4] {
    color: #ef4444;
    margin-left: 4px;
}

.iswara-form-input[b-dnhkxrlrg4] {
    border: 1px solid rgb(20, 33, 61) !important;
    border-radius: 6px;
    transition: all 0.2s ease;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04);
    color: rgb(20, 33, 61) !important;
}

.iswara-form-input:focus[b-dnhkxrlrg4] {
    border-color: #C8A951;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04), 0 0 0 0.2rem rgba(200, 169, 81, 0.15);
}

.iswara-form-input--error[b-dnhkxrlrg4] {
    border-color: #ef4444;
}

.iswara-form-input__validation[b-dnhkxrlrg4] {
    font-size: 0.8rem;
    color: #ef4444;
    margin-top: 4px;
}

.iswara-form-input__help[b-dnhkxrlrg4] {
    font-size: 0.8rem;
    color: #2E2E2E;
    margin-top: 4px;
    font-style: italic;
}
/* /_Shared/UI/HeatMap/IswaraHeatMap.razor.rz.scp.css */
/* Iswara HeatMap Component Styles */
/* Using Iswara Color Palette */

.iswara-heatmap-container[b-rxkkjq7j9s] {
    background-color: #FFFFFF;
    border-radius: 12px;
    padding: 20px;
    box-shadow: 0 2px 8px rgba(20, 33, 61, 0.08);
    border: 1px solid #E2E6EA;
    position: relative;
    overflow: hidden;
}

.iswara-heatmap__title[b-rxkkjq7j9s] {
    font-size: 1.25rem;
    font-weight: 600;
    color: #14213D;
    margin-bottom: 16px;
    text-align: center;
    line-height: 1.4;
}

.iswara-heatmap__description[b-rxkkjq7j9s] {
    font-size: 0.875rem;
    color: #2E2E2E;
    margin-top: 16px;
    text-align: center;
    line-height: 1.5;
    font-style: italic;
}

/* HeatMap Styling */
.iswara-heatmap[b-rxkkjq7j9s] {
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
}

/* Cell Styling */
.iswara-heatmap .e-heatmap-cell[b-rxkkjq7j9s] {
    transition: all 0.2s ease;
    cursor: pointer;
}

.iswara-heatmap .e-heatmap-cell:hover[b-rxkkjq7j9s] {
    opacity: 0.8;
    transform: scale(1.02);
}

/* Axis Labels */
.iswara-heatmap .e-heatmap-xaxis-label[b-rxkkjq7j9s],
.iswara-heatmap .e-heatmap-yaxis-label[b-rxkkjq7j9s] {
    font-family: 'Segoe UI', sans-serif;
    font-weight: 500;
    fill: #2E2E2E;
}

/* Legend Styling */
.iswara-heatmap .e-heatmap-legend[b-rxkkjq7j9s] {
    background-color: rgba(255, 255, 255, 0.95);
    border: 1px solid #E2E6EA;
    border-radius: 8px;
    padding: 12px;
    box-shadow: 0 2px 4px rgba(20, 33, 61, 0.1);
}

.iswara-heatmap .e-heatmap-legend-label[b-rxkkjq7j9s] {
    font-family: 'Segoe UI', sans-serif;
    font-weight: 500;
    fill: #2E2E2E;
}

/* Tooltip Styling */
.iswara-heatmap .e-heatmap-tooltip[b-rxkkjq7j9s] {
    background-color: #14213D !important;
    border: 2px solid #C8A951 !important;
    border-radius: 8px !important;
    box-shadow: 0 4px 12px rgba(20, 33, 61, 0.3) !important;
    padding: 12px 16px !important;
    font-family: 'Segoe UI', sans-serif !important;
}

.iswara-heatmap .e-heatmap-tooltip .e-tooltip-content[b-rxkkjq7j9s] {
    color: #FFFFFF !important;
    font-weight: 500 !important;
}

/* Risk Level Colors (Iswara Palette) */
.iswara-heatmap .risk-low[b-rxkkjq7j9s] {
    fill: #22c55e; /* Green for low risk */
}

.iswara-heatmap .risk-low-medium[b-rxkkjq7j9s] {
    fill: #BFD8B8; /* Sage Green for low-medium risk */
}

.iswara-heatmap .risk-medium[b-rxkkjq7j9s] {
    fill: #C8A951; /* Gold for medium risk */
}

.iswara-heatmap .risk-high-medium[b-rxkkjq7j9s] {
    fill: #f97316; /* Orange for high-medium risk */
}

.iswara-heatmap .risk-high[b-rxkkjq7j9s] {
    fill: #ef4444; /* Red for high risk */
}

/* Loading State */
.iswara-heatmap-container.loading[b-rxkkjq7j9s] {
    position: relative;
}

.iswara-heatmap-container.loading[b-rxkkjq7j9s]::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(255, 255, 255, 0.8);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 10;
}

.iswara-heatmap-container.loading[b-rxkkjq7j9s]::after {
    content: 'Loading heat map...';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    color: #2E2E2E;
    font-weight: 500;
    z-index: 11;
}

/* Empty State */
.iswara-heatmap-container.empty[b-rxkkjq7j9s] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 300px;
    color: #2E2E2E;
}

.iswara-heatmap-container.empty[b-rxkkjq7j9s]::before {
    content: '📊';
    font-size: 3rem;
    margin-bottom: 16px;
    opacity: 0.5;
}

.iswara-heatmap-container.empty[b-rxkkjq7j9s]::after {
    content: 'No data available for heat map';
    font-style: italic;
    color: #2E2E2E;
}

/* Responsive Design */
@media (max-width: 1024px) {
    .iswara-heatmap-container[b-rxkkjq7j9s] {
        padding: 16px;
    }
    
    .iswara-heatmap__title[b-rxkkjq7j9s] {
        font-size: 1.125rem;
        margin-bottom: 12px;
    }
    
    .iswara-heatmap .e-heatmap-xaxis-label[b-rxkkjq7j9s],
    .iswara-heatmap .e-heatmap-yaxis-label[b-rxkkjq7j9s] {
        font-size: 11px;
    }
}

@media (max-width: 768px) {
    .iswara-heatmap-container[b-rxkkjq7j9s] {
        padding: 12px;
        margin: 0 -12px;
        border-radius: 0;
        border-left: none;
        border-right: none;
    }
    
    .iswara-heatmap__title[b-rxkkjq7j9s] {
        font-size: 1rem;
        margin-bottom: 8px;
    }
    
    .iswara-heatmap__description[b-rxkkjq7j9s] {
        font-size: 0.8rem;
        margin-top: 12px;
    }
    
    .iswara-heatmap .e-heatmap-xaxis-label[b-rxkkjq7j9s],
    .iswara-heatmap .e-heatmap-yaxis-label[b-rxkkjq7j9s] {
        font-size: 10px;
    }
    
    .iswara-heatmap .e-heatmap-legend[b-rxkkjq7j9s] {
        padding: 8px;
    }
}

/* Print Styles */
@media print {
    .iswara-heatmap-container[b-rxkkjq7j9s] {
        box-shadow: none;
        border: 1px solid #000;
        break-inside: avoid;
    }
    
    .iswara-heatmap__title[b-rxkkjq7j9s] {
        color: #000;
    }
    
    .iswara-heatmap__description[b-rxkkjq7j9s] {
        color: #000;
    }
}

/* Accessibility */
.iswara-heatmap .e-heatmap-cell:focus[b-rxkkjq7j9s] {
    outline: 2px solid #C8A951;
    outline-offset: 2px;
}

/* High Contrast Mode */
@media (prefers-contrast: high) {
    .iswara-heatmap-container[b-rxkkjq7j9s] {
        border: 2px solid #000;
    }
    
    .iswara-heatmap__title[b-rxkkjq7j9s],
    .iswara-heatmap__description[b-rxkkjq7j9s] {
        color: #000;
    }
    
    .iswara-heatmap .e-heatmap-xaxis-label[b-rxkkjq7j9s],
    .iswara-heatmap .e-heatmap-yaxis-label[b-rxkkjq7j9s] {
        fill: #000;
    }
}
/* /_Shared/UI/ListView/IswaraListView.razor.rz.scp.css */
.iswara-listview-container[b-xkob1nysux] {
    border-radius: 12px;
    overflow: hidden;
    background: #ffffff;
    box-shadow: 0 4px 16px rgba(20, 33, 61, 0.08);
    border: 1px solid #E2E6EA;
}

/* Header */
.listview-header[b-xkob1nysux] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1.5rem 2rem;
    background: linear-gradient(135deg, #14213D 0%, #1a2a4a 100%);
    color: #ffffff;
    border-bottom: 1px solid #E2E6EA;
}

.listview-title[b-xkob1nysux] {
    margin: 0;
    font-size: 1.25rem;
    font-weight: 600;
    color: #ffffff;
}

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

/* Search Box */
.listview-search[b-xkob1nysux] {
    padding: 1rem 2rem;
    background: #f8f9fa;
    border-bottom: 1px solid #E2E6EA;
}

.search-input-container[b-xkob1nysux] {
    position: relative;
    max-width: 400px;
}

.search-icon[b-xkob1nysux] {
    position: absolute;
    left: 0.75rem;
    top: 50%;
    transform: translateY(-50%);
    color: #6c757d;
    font-size: 0.9rem;
}

.search-input[b-xkob1nysux] {
    padding-left: 2.5rem;
    padding-right: 2.5rem;
    border: 1px solid #E2E6EA;
    border-radius: 8px;
    background: #ffffff;
    transition: all 0.3s ease;
}

.search-input:focus[b-xkob1nysux] {
    border-color: #C8A951;
    box-shadow: 0 0 0 0.2rem rgba(200, 169, 81, 0.25);
}

.btn-clear-search[b-xkob1nysux] {
    position: absolute;
    right: 0.5rem;
    top: 50%;
    transform: translateY(-50%);
    background: none;
    border: none;
    color: #6c757d;
    cursor: pointer;
    padding: 0.25rem;
    border-radius: 4px;
    transition: color 0.3s ease;
}

.btn-clear-search:hover[b-xkob1nysux] {
    color: #14213D;
}

/* Loading State */
.listview-loading[b-xkob1nysux] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 3rem 2rem;
    gap: 1rem;
}

.loading-text[b-xkob1nysux] {
    color: #6c757d;
    font-size: 0.9rem;
}

/* List View Styles */
[b-xkob1nysux] .iswara-listview {
    border: none;
    border-radius: 0;
    background: #ffffff;
}

[b-xkob1nysux] .iswara-listview .e-list-item {
    border-bottom: 1px solid #E2E6EA;
    padding: 1rem 2rem;
    transition: all 0.3s ease;
    background: #ffffff;
}

[b-xkob1nysux] .iswara-listview .e-list-item:last-child {
    border-bottom: none;
}

[b-xkob1nysux] .iswara-listview .e-list-item:hover {
    background: linear-gradient(135deg, rgba(200, 169, 81, 0.05) 0%, rgba(200, 169, 81, 0.02) 100%);
    cursor: pointer;
    transform: translateX(4px);
}

[b-xkob1nysux] .iswara-listview .e-list-item.e-active {
    background: linear-gradient(135deg, rgba(200, 169, 81, 0.1) 0%, rgba(200, 169, 81, 0.05) 100%);
    border-left: 4px solid #C8A951;
}

[b-xkob1nysux] .iswara-listview .e-list-item .e-list-text {
    color: #14213D;
    font-weight: 500;
    font-size: 1rem;
}

[b-xkob1nysux] .iswara-listview .e-list-item .e-list-content {
    color: #2E2E2E;
    font-size: 0.9rem;
    margin-top: 0.25rem;
}

/* Default Item Template */
.default-item-template[b-xkob1nysux] {
    display: flex;
    align-items: center;
    width: 100%;
}

.item-content[b-xkob1nysux] {
    flex: 1;
}

.item-text[b-xkob1nysux] {
    color: #14213D;
    font-weight: 500;
    font-size: 1rem;
}

/* Pagination */
.listview-pagination[b-xkob1nysux] {
    padding: 1rem 2rem;
    background: #f8f9fa;
    border-top: 1px solid #E2E6EA;
}

.pagination[b-xkob1nysux] {
    margin-bottom: 0.5rem;
}

.page-link[b-xkob1nysux] {
    border: 1px solid #E2E6EA;
    color: #14213D;
    padding: 0.5rem 0.75rem;
    transition: all 0.3s ease;
}

.page-link:hover[b-xkob1nysux] {
    background: #C8A951;
    border-color: #C8A951;
    color: #ffffff;
    transform: translateY(-1px);
}

.page-item.active .page-link[b-xkob1nysux] {
    background: #14213D;
    border-color: #14213D;
    color: #ffffff;
}

.page-item.disabled .page-link[b-xkob1nysux] {
    color: #6c757d;
    background: #f8f9fa;
    border-color: #E2E6EA;
}

.pagination-info[b-xkob1nysux] {
    text-align: center;
}

/* Empty State */
.listview-empty[b-xkob1nysux] {
    padding: 3rem 2rem;
}

.empty-state[b-xkob1nysux] {
    text-align: center;
    max-width: 400px;
    margin: 0 auto;
}

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

.empty-title[b-xkob1nysux] {
    color: #14213D;
    font-size: 1.25rem;
    font-weight: 600;
    margin-bottom: 0.5rem;
}

.empty-message[b-xkob1nysux] {
    color: #6c757d;
    font-size: 0.9rem;
    margin-bottom: 1.5rem;
}

.empty-actions[b-xkob1nysux] {
    display: flex;
    gap: 0.5rem;
    justify-content: center;
    flex-wrap: wrap;
}

/* Responsive Design */
@media (max-width: 768px) {
    .listview-header[b-xkob1nysux] {
        padding: 1rem;
        flex-direction: column;
        gap: 1rem;
        align-items: flex-start;
    }
    
    .listview-title[b-xkob1nysux] {
        font-size: 1.1rem;
    }
    
    .listview-search[b-xkob1nysux] {
        padding: 1rem;
    }
    
    .search-input-container[b-xkob1nysux] {
        max-width: 100%;
    }
    
    [b-xkob1nysux] .iswara-listview .e-list-item {
        padding: 0.75rem 1rem;
    }
    
    .listview-pagination[b-xkob1nysux] {
        padding: 1rem;
    }
    
    .pagination-info[b-xkob1nysux] {
        font-size: 0.8rem;
    }
    
    .empty-state[b-xkob1nysux] {
        padding: 1rem;
    }
    
    .empty-icon[b-xkob1nysux] {
        font-size: 2rem;
    }
    
    .empty-title[b-xkob1nysux] {
        font-size: 1.1rem;
    }
}
/* /_Shared/UI/ProgressBar/IswaraProgressBar.razor.rz.scp.css */
/* Iswara Progress Bar Component Styles */
.iswara-progress-container[b-vl0dy2v8a7] {
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
}

.iswara-progress__label[b-vl0dy2v8a7] {
    font-size: 0.875rem;
    font-weight: 500;
    color: #2E2E2E;
    margin-bottom: 8px;
}

.iswara-progress-bar[b-vl0dy2v8a7] {
    border-radius: 10px;
    overflow: hidden;
    box-shadow: inset 0 1px 3px rgba(20, 33, 61, 0.1);
}

.iswara-progress__percentage[b-vl0dy2v8a7] {
    font-size: 0.8rem;
    color: #2E2E2E;
    text-align: right;
    margin-top: 4px;
    font-weight: 500;
}
/* /_Shared/UI/SlideOut/IswaraSlideOut.razor.rz.scp.css */
/* Overlay */
.iswara-slideout-overlay[b-wbv2e4d0ra] {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(20, 33, 61, 0.6);
    backdrop-filter: blur(4px);
    z-index: 1050;
    opacity: 0;
    visibility: hidden;
    transition: all 0.3s ease;
    display: flex;
    align-items: center;
    justify-content: center;
}

.iswara-slideout-overlay.show[b-wbv2e4d0ra] {
    opacity: 1;
    visibility: visible;
}

/* Panel Base */
.slideout-panel[b-wbv2e4d0ra] {
    background: #ffffff;
    box-shadow: 0 8px 32px rgba(20, 33, 61, 0.15);
    border-radius: 12px;
    display: flex;
    flex-direction: column;
    max-height: 90vh;
    transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    transform: scale(0.95);
    opacity: 0;
}

.slideout-panel.visible[b-wbv2e4d0ra] {
    transform: scale(1);
    opacity: 1;
}

/* Position Classes */
.slideout-panel.position-right[b-wbv2e4d0ra] {
    position: fixed;
    top: 0;
    right: 0;
    height: 100vh;
    max-height: 100vh;
    border-radius: 12px 0 0 12px;
    transform: translateX(100%);
}

.slideout-panel.position-right.visible[b-wbv2e4d0ra] {
    transform: translateX(0);
}

.slideout-panel.position-left[b-wbv2e4d0ra] {
    position: fixed;
    top: 0;
    left: 0;
    height: 100vh;
    max-height: 100vh;
    border-radius: 0 12px 12px 0;
    transform: translateX(-100%);
}

.slideout-panel.position-left.visible[b-wbv2e4d0ra] {
    transform: translateX(0);
}

.slideout-panel.position-bottom[b-wbv2e4d0ra] {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    width: 100%;
    border-radius: 12px 12px 0 0;
    transform: translateY(100%);
}

.slideout-panel.position-bottom.visible[b-wbv2e4d0ra] {
    transform: translateY(0);
}

.slideout-panel.position-top[b-wbv2e4d0ra] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    width: 100%;
    border-radius: 0 0 12px 12px;
    transform: translateY(-100%);
}

.slideout-panel.position-top.visible[b-wbv2e4d0ra] {
    transform: translateY(0);
}

/* Size Classes for Right/Left positions */
.slideout-panel.position-right.size-small[b-wbv2e4d0ra],
.slideout-panel.position-left.size-small[b-wbv2e4d0ra] {
    width: 300px;
}

.slideout-panel.position-right.size-medium[b-wbv2e4d0ra],
.slideout-panel.position-left.size-medium[b-wbv2e4d0ra] {
    width: 450px;
}

.slideout-panel.position-right.size-large[b-wbv2e4d0ra],
.slideout-panel.position-left.size-large[b-wbv2e4d0ra] {
    width: 600px;
}

.slideout-panel.position-right.size-xlarge[b-wbv2e4d0ra],
.slideout-panel.position-left.size-xlarge[b-wbv2e4d0ra] {
    width: 800px;
}

/* Size Classes for Top/Bottom positions */
.slideout-panel.position-top.size-small[b-wbv2e4d0ra],
.slideout-panel.position-bottom.size-small[b-wbv2e4d0ra] {
    height: 30vh;
}

.slideout-panel.position-top.size-medium[b-wbv2e4d0ra],
.slideout-panel.position-bottom.size-medium[b-wbv2e4d0ra] {
    height: 50vh;
}

.slideout-panel.position-top.size-large[b-wbv2e4d0ra],
.slideout-panel.position-bottom.size-large[b-wbv2e4d0ra] {
    height: 70vh;
}

.slideout-panel.position-top.size-xlarge[b-wbv2e4d0ra],
.slideout-panel.position-bottom.size-xlarge[b-wbv2e4d0ra] {
    height: 90vh;
}

/* Header */
.slideout-header[b-wbv2e4d0ra] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1.5rem 2rem;
    background: linear-gradient(135deg, #14213D 0%, #1a2a4a 100%);
    color: #ffffff;
    border-bottom: 1px solid #E2E6EA;
    border-radius: 12px 12px 0 0;
    flex-shrink: 0;
}

.slideout-panel.position-left .slideout-header[b-wbv2e4d0ra] {
    border-radius: 0 12px 0 0;
}

.slideout-panel.position-right .slideout-header[b-wbv2e4d0ra] {
    border-radius: 12px 0 0 0;
}

.slideout-panel.position-bottom .slideout-header[b-wbv2e4d0ra] {
    border-radius: 12px 12px 0 0;
}

.slideout-panel.position-top .slideout-header[b-wbv2e4d0ra] {
    border-radius: 0 0 0 0;
}

.header-content[b-wbv2e4d0ra] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.header-icon[b-wbv2e4d0ra] {
    font-size: 1.25rem;
    color: #C8A951;
}

.slideout-title[b-wbv2e4d0ra] {
    margin: 0;
    font-size: 1.25rem;
    font-weight: 600;
    color: #ffffff;
}

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

.btn-close-slideout[b-wbv2e4d0ra] {
    background: none;
    border: none;
    color: #ffffff;
    font-size: 1.25rem;
    padding: 0.5rem;
    border-radius: 6px;
    cursor: pointer;
    transition: all 0.3s ease;
    display: flex;
    align-items: center;
    justify-content: center;
}

.btn-close-slideout:hover[b-wbv2e4d0ra] {
    background: rgba(255, 255, 255, 0.1);
    color: #C8A951;
}

/* Body */
.slideout-body[b-wbv2e4d0ra] {
    flex: 1;
    padding: 2rem;
    overflow-y: auto;
    overflow-x: hidden;
    position: relative;
}

.slideout-body.loading[b-wbv2e4d0ra] {
    display: flex;
    align-items: center;
    justify-content: center;
}

.slideout-loading[b-wbv2e4d0ra] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1rem;
    color: #6c757d;
}

.loading-text[b-wbv2e4d0ra] {
    font-size: 0.9rem;
}

/* Footer */
.slideout-footer[b-wbv2e4d0ra] {
    padding: 1.5rem 2rem;
    background: #f8f9fa;
    border-top: 1px solid #E2E6EA;
    border-radius: 0 0 12px 12px;
    flex-shrink: 0;
}

.slideout-panel.position-left .slideout-footer[b-wbv2e4d0ra] {
    border-radius: 0 0 0 12px;
}

.slideout-panel.position-right .slideout-footer[b-wbv2e4d0ra] {
    border-radius: 0 0 12px 0;
}

.slideout-panel.position-top .slideout-footer[b-wbv2e4d0ra] {
    border-radius: 0 0 12px 12px;
}

.slideout-panel.position-bottom .slideout-footer[b-wbv2e4d0ra] {
    border-radius: 0 0 0 0;
}

/* Custom Scrollbar */
.slideout-body[b-wbv2e4d0ra]::-webkit-scrollbar {
    width: 6px;
}

.slideout-body[b-wbv2e4d0ra]::-webkit-scrollbar-track {
    background: #f1f1f1;
    border-radius: 3px;
}

.slideout-body[b-wbv2e4d0ra]::-webkit-scrollbar-thumb {
    background: #c1c1c1;
    border-radius: 3px;
}

.slideout-body[b-wbv2e4d0ra]::-webkit-scrollbar-thumb:hover {
    background: #a8a8a8;
}

/* Responsive Design */
@media (max-width: 768px) {
    /* Mobile: All slide-outs become bottom position */
    .slideout-panel.position-right[b-wbv2e4d0ra],
    .slideout-panel.position-left[b-wbv2e4d0ra] {
        position: fixed !important;
        top: auto !important;
        bottom: 0 !important;
        left: 0 !important;
        right: 0 !important;
        width: 100% !important;
        height: 85vh !important;
        max-height: 85vh !important;
        border-radius: 12px 12px 0 0 !important;
        transform: translateY(100%) !important;
    }
    
    .slideout-panel.position-right.visible[b-wbv2e4d0ra],
    .slideout-panel.position-left.visible[b-wbv2e4d0ra] {
        transform: translateY(0) !important;
    }
    
    .slideout-panel.position-top[b-wbv2e4d0ra],
    .slideout-panel.position-bottom[b-wbv2e4d0ra] {
        height: 85vh !important;
        max-height: 85vh !important;
    }
    
    .slideout-header[b-wbv2e4d0ra] {
        padding: 1rem 1.5rem;
        border-radius: 12px 12px 0 0 !important;
    }
    
    .slideout-title[b-wbv2e4d0ra] {
        font-size: 1.1rem;
    }
    
    .slideout-body[b-wbv2e4d0ra] {
        padding: 1.5rem;
    }
    
    .slideout-footer[b-wbv2e4d0ra] {
        padding: 1rem 1.5rem;
        border-radius: 0 0 0 0 !important;
    }
    
    /* Add pull indicator for mobile */
    .slideout-panel.position-right .slideout-header[b-wbv2e4d0ra]::before,
    .slideout-panel.position-left .slideout-header[b-wbv2e4d0ra]::before,
    .slideout-panel.position-bottom .slideout-header[b-wbv2e4d0ra]::before {
        content: '';
        position: absolute;
        top: 0.5rem;
        left: 50%;
        transform: translateX(-50%);
        width: 40px;
        height: 4px;
        background: rgba(255, 255, 255, 0.3);
        border-radius: 2px;
    }
}

@media (max-width: 480px) {
    .slideout-header[b-wbv2e4d0ra] {
        padding: 0.75rem 1rem;
    }
    
    .slideout-body[b-wbv2e4d0ra] {
        padding: 1rem;
    }
    
    .slideout-footer[b-wbv2e4d0ra] {
        padding: 0.75rem 1rem;
    }
    
    .slideout-title[b-wbv2e4d0ra] {
        font-size: 1rem;
    }
}

/* Animation Enhancements */
@media (prefers-reduced-motion: no-preference) {
    .slideout-panel[b-wbv2e4d0ra] {
        transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    }
    
    .iswara-slideout-overlay[b-wbv2e4d0ra] {
        transition: all 0.3s ease;
    }
}

@media (prefers-reduced-motion: reduce) {
    .slideout-panel[b-wbv2e4d0ra],
    .iswara-slideout-overlay[b-wbv2e4d0ra] {
        transition: none;
    }
}
/* /_Shared/UI/TextBox/IswaraTextBox.razor.rz.scp.css */
.iswara-textbox-container[b-o4h9aunze7] {
    margin-bottom: 1rem;
    width: 100%;
}

.iswara-textbox__label[b-o4h9aunze7] {
    display: block;
    margin-bottom: 0.5rem;
    font-weight: 600;
    color: rgb(20, 33, 61) !important;
    font-size: 0.875rem;
    line-height: 1.25rem;
}

.iswara-textbox__label.required[b-o4h9aunze7] {
    position: relative;
}

.required-indicator[b-o4h9aunze7] {
    color: #ef4444;
    margin-left: 0.25rem;
    font-weight: bold;
}

.iswara-textbox__help-text[b-o4h9aunze7] {
    margin-top: 0.375rem;
    font-size: 0.875rem;
    color: #6B7280;
    line-height: 1.25rem;
}

.iswara-textbox__validation[b-o4h9aunze7] {
    margin-top: 0.375rem;
    font-size: 0.875rem;
    color: #ef4444;
    line-height: 1.25rem;
    display: flex;
    align-items: center;
}

.iswara-textbox__validation[b-o4h9aunze7]::before {
    content: "⚠";
    margin-right: 0.375rem;
    font-size: 1rem;
}
/* /_Shared/UI/TrendChart/IswaraTrendChart.razor.rz.scp.css */
/* Iswara Trend Chart Component Styles */
/* Using Iswara Color Palette */

.iswara-trend-chart-container[b-ke2azu9fsw] {
    background-color: #FFFFFF;
    border-radius: 12px;
    padding: 20px;
    box-shadow: 0 2px 8px rgba(20, 33, 61, 0.08);
    border: 1px solid #E2E6EA;
    position: relative;
    overflow: hidden;
}

.iswara-trend-chart__title[b-ke2azu9fsw] {
    font-size: 1.25rem;
    font-weight: 600;
    color: #14213D;
    margin-bottom: 16px;
    text-align: center;
    line-height: 1.4;
}

.iswara-trend-chart__description[b-ke2azu9fsw] {
    font-size: 0.875rem;
    color: #2E2E2E;
    margin-top: 16px;
    text-align: center;
    line-height: 1.5;
    font-style: italic;
}

/* Chart Styling */
.iswara-trend-chart[b-ke2azu9fsw] {
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
}

/* Chart Background */
.iswara-trend-chart .e-chart-series-group[b-ke2azu9fsw] {
    transition: all 0.3s ease;
}

/* Chart Lines */
.iswara-trend-chart .e-chart-series path[b-ke2azu9fsw] {
    stroke-width: 3;
    fill: none;
    transition: all 0.2s ease;
}

.iswara-trend-chart .e-chart-series path:hover[b-ke2azu9fsw] {
    stroke-width: 4;
    filter: drop-shadow(0 2px 4px rgba(20, 33, 61, 0.3));
}

/* Chart Markers */
.iswara-trend-chart .e-chart-series-point[b-ke2azu9fsw] {
    transition: all 0.2s ease;
    cursor: pointer;
}

.iswara-trend-chart .e-chart-series-point:hover[b-ke2azu9fsw] {
    transform: scale(1.2);
    filter: drop-shadow(0 2px 4px rgba(20, 33, 61, 0.3));
}

/* Grid Lines */
.iswara-trend-chart .e-grid-line[b-ke2azu9fsw] {
    stroke: #E2E6EA;
    stroke-dasharray: 3,3;
    opacity: 0.7;
}

/* Axis Styling */
.iswara-trend-chart .e-axis-line[b-ke2azu9fsw] {
    stroke: #2E2E2E;
    stroke-width: 1;
}

.iswara-trend-chart .e-axis-label[b-ke2azu9fsw] {
    fill: #2E2E2E;
    font-family: 'Segoe UI', sans-serif;
    font-size: 12px;
}

.iswara-trend-chart .e-axis-title[b-ke2azu9fsw] {
    fill: #14213D;
    font-family: 'Segoe UI', sans-serif;
    font-size: 14px;
    font-weight: 600;
}

/* Tick Marks */
.iswara-trend-chart .e-tick-line[b-ke2azu9fsw] {
    stroke: #2E2E2E;
    stroke-width: 1;
}

/* Legend */
.iswara-trend-chart .e-chart-legend[b-ke2azu9fsw] {
    font-family: 'Segoe UI', sans-serif;
}

.iswara-trend-chart .e-legend-text[b-ke2azu9fsw] {
    fill: #2E2E2E;
    font-size: 12px;
    font-weight: 500;
}

.iswara-trend-chart .e-legend-shape[b-ke2azu9fsw] {
    transition: all 0.2s ease;
}

.iswara-trend-chart .e-legend-item:hover .e-legend-shape[b-ke2azu9fsw] {
    transform: scale(1.1);
}

/* Tooltip */
.iswara-trend-chart .e-tooltip[b-ke2azu9fsw] {
    background-color: #14213D !important;
    border: 2px solid #C8A951 !important;
    border-radius: 8px !important;
    box-shadow: 0 4px 12px rgba(20, 33, 61, 0.3) !important;
    font-family: 'Segoe UI', sans-serif !important;
}

.iswara-trend-chart .e-tooltip-content[b-ke2azu9fsw] {
    color: #FFFFFF !important;
    font-weight: 500 !important;
    padding: 8px 12px !important;
}

/* Data Labels */
.iswara-trend-chart .e-datalabel[b-ke2azu9fsw] {
    font-family: 'Segoe UI', sans-serif;
    font-size: 11px;
    font-weight: 500;
    fill: #2E2E2E;
}

/* Trend Line */
.iswara-trend-chart .e-trendline[b-ke2azu9fsw] {
    stroke: #C8A951;
    stroke-width: 2;
    stroke-dasharray: 5,5;
    opacity: 0.8;
}

/* Chart Variants */
.iswara-trend-chart--line .e-chart-series path[b-ke2azu9fsw] {
    stroke-linecap: round;
    stroke-linejoin: round;
}

.iswara-trend-chart--area .e-chart-series path[b-ke2azu9fsw] {
    fill-opacity: 0.3;
}

.iswara-trend-chart--spline .e-chart-series path[b-ke2azu9fsw] {
    stroke-linecap: round;
}

.iswara-trend-chart--step .e-chart-series path[b-ke2azu9fsw] {
    stroke-linecap: square;
}

/* Chart Features */
.iswara-trend-chart--with-markers .e-chart-series-point[b-ke2azu9fsw] {
    stroke-width: 2;
    stroke: #FFFFFF;
}

.iswara-trend-chart--with-labels .e-datalabel[b-ke2azu9fsw] {
    background-color: rgba(255, 255, 255, 0.9);
    padding: 2px 6px;
    border-radius: 4px;
    border: 1px solid #E2E6EA;
}

.iswara-trend-chart--with-trendline .e-trendline[b-ke2azu9fsw] {
    animation: dashOffset-b-ke2azu9fsw 2s linear infinite;
}

@keyframes dashOffset-b-ke2azu9fsw {
    0% { stroke-dashoffset: 0; }
    100% { stroke-dashoffset: 20; }
}

/* Loading State */
.iswara-trend-chart-container.loading[b-ke2azu9fsw] {
    position: relative;
}

.iswara-trend-chart-container.loading[b-ke2azu9fsw]::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(255, 255, 255, 0.8);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 10;
    border-radius: 12px;
}

.iswara-trend-chart-container.loading[b-ke2azu9fsw]::after {
    content: 'Loading chart...';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    color: #2E2E2E;
    font-weight: 500;
    z-index: 11;
}

/* Empty State */
.iswara-trend-chart-container.empty[b-ke2azu9fsw] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 300px;
    color: #2E2E2E;
}

.iswara-trend-chart-container.empty[b-ke2azu9fsw]::before {
    content: '📈';
    font-size: 3rem;
    margin-bottom: 16px;
    opacity: 0.5;
}

.iswara-trend-chart-container.empty[b-ke2azu9fsw]::after {
    content: 'No data available for chart';
    font-style: italic;
    color: #2E2E2E;
}

/* Responsive Design */
@media (max-width: 1024px) {
    .iswara-trend-chart-container[b-ke2azu9fsw] {
        padding: 16px;
    }
    
    .iswara-trend-chart__title[b-ke2azu9fsw] {
        font-size: 1.125rem;
        margin-bottom: 12px;
    }
    
    .iswara-trend-chart .e-axis-label[b-ke2azu9fsw] {
        font-size: 11px;
    }
    
    .iswara-trend-chart .e-axis-title[b-ke2azu9fsw] {
        font-size: 13px;
    }
    
    .iswara-trend-chart .e-legend-text[b-ke2azu9fsw] {
        font-size: 11px;
    }
}

@media (max-width: 768px) {
    .iswara-trend-chart-container[b-ke2azu9fsw] {
        padding: 12px;
        margin: 0 -12px;
        border-radius: 0;
        border-left: none;
        border-right: none;
    }
    
    .iswara-trend-chart__title[b-ke2azu9fsw] {
        font-size: 1rem;
        margin-bottom: 8px;
    }
    
    .iswara-trend-chart__description[b-ke2azu9fsw] {
        font-size: 0.8rem;
        margin-top: 12px;
    }
    
    .iswara-trend-chart .e-axis-label[b-ke2azu9fsw] {
        font-size: 10px;
    }
    
    .iswara-trend-chart .e-axis-title[b-ke2azu9fsw] {
        font-size: 12px;
    }
    
    .iswara-trend-chart .e-legend-text[b-ke2azu9fsw] {
        font-size: 10px;
    }
    
    .iswara-trend-chart .e-datalabel[b-ke2azu9fsw] {
        font-size: 10px;
    }
    
    /* Hide some elements on mobile for better readability */
    .iswara-trend-chart .e-grid-line[b-ke2azu9fsw] {
        opacity: 0.3;
    }
}

/* Print Styles */
@media print {
    .iswara-trend-chart-container[b-ke2azu9fsw] {
        box-shadow: none;
        border: 1px solid #000;
        break-inside: avoid;
        background-color: #fff;
    }
    
    .iswara-trend-chart__title[b-ke2azu9fsw] {
        color: #000;
    }
    
    .iswara-trend-chart__description[b-ke2azu9fsw] {
        color: #000;
    }
    
    .iswara-trend-chart .e-axis-label[b-ke2azu9fsw],
    .iswara-trend-chart .e-axis-title[b-ke2azu9fsw],
    .iswara-trend-chart .e-legend-text[b-ke2azu9fsw] {
        fill: #000;
    }
}

/* Accessibility */
.iswara-trend-chart:focus[b-ke2azu9fsw] {
    outline: 2px solid #C8A951;
    outline-offset: 2px;
}

.iswara-trend-chart .e-chart-series-point:focus[b-ke2azu9fsw] {
    outline: 2px solid #C8A951;
    outline-offset: 2px;
}

/* High Contrast Mode */
@media (prefers-contrast: high) {
    .iswara-trend-chart-container[b-ke2azu9fsw] {
        border: 2px solid #000;
        background-color: #fff;
    }
    
    .iswara-trend-chart__title[b-ke2azu9fsw],
    .iswara-trend-chart__description[b-ke2azu9fsw] {
        color: #000;
    }
    
    .iswara-trend-chart .e-chart-series path[b-ke2azu9fsw] {
        stroke-width: 3;
    }
    
    .iswara-trend-chart .e-axis-label[b-ke2azu9fsw],
    .iswara-trend-chart .e-axis-title[b-ke2azu9fsw],
    .iswara-trend-chart .e-legend-text[b-ke2azu9fsw] {
        fill: #000;
    }
}

/* Dark Mode Support */
@media (prefers-color-scheme: dark) {
    .iswara-trend-chart-container[b-ke2azu9fsw] {
        background-color: #2E2E2E;
        border-color: #3a3a3a;
        color: #FFFFFF;
    }
    
    .iswara-trend-chart__title[b-ke2azu9fsw] {
        color: #FFFFFF;
    }
    
    .iswara-trend-chart__description[b-ke2azu9fsw] {
        color: #E2E6EA;
    }
    
    .iswara-trend-chart .e-axis-label[b-ke2azu9fsw],
    .iswara-trend-chart .e-legend-text[b-ke2azu9fsw] {
        fill: #E2E6EA;
    }
    
    .iswara-trend-chart .e-axis-title[b-ke2azu9fsw] {
        fill: #C8A951;
    }
    
    .iswara-trend-chart .e-grid-line[b-ke2azu9fsw] {
        stroke: #3a3a3a;
    }
    
    .iswara-trend-chart .e-axis-line[b-ke2azu9fsw],
    .iswara-trend-chart .e-tick-line[b-ke2azu9fsw] {
        stroke: #E2E6EA;
    }
}