@import '_content/BlazorInputTags/BlazorInputTags.z0l08yt8g8.bundle.scp.css';

/* _content/AspnetBlazor/Components/Layout/MainLayout.razor.rz.scp.css */
/* Styles are now loaded from the vendor CSS files */

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

    #blazor-error-ui .dismiss[b-7wzttxt9vn] {
        cursor: pointer;
        position: absolute;
        right: 0.75rem;
        top: 0.5rem;
    }
/* _content/AspnetBlazor/Components/Pages/Customers/CustomerDetail.razor.rz.scp.css */
/* ============================================
   CUSTOMER DETAIL PAGE - Enhanced UI Design
   ============================================ */
.customer-detail-page[b-6q1x8x35gk] {
    min-height: 100vh;
    background: var(--bs-gray-50);
    padding: 1.5rem;
}

/* ===== AVATAR STYLES ===== */
.avatar[b-6q1x8x35gk] {
    width: 3.5rem;
    height: 3.5rem;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background-color: var(--bs-light);
    overflow: hidden;
    position: relative;
}

.avatar.avatar-lg[b-6q1x8x35gk] {
    width: 4.5rem;
    height: 4.5rem;
}

.avatar.avatar-sm[b-6q1x8x35gk] {
    width: 2.375rem;
    height: 2.375rem;
}

.avatar-img[b-6q1x8x35gk] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.avatar-initial[b-6q1x8x35gk] {
    color: white;
    font-weight: 600;
    font-size: 1.25rem;
    text-transform: uppercase;
}

.bg-primary[b-6q1x8x35gk] {
    background-color: var(--bs-primary) !important;
}

.bg-warning[b-6q1x8x35gk] {
    background-color: var(--bs-warning) !important;
    color: var(--bs-dark) !important;
}

/* ===== CUSTOMER CONTACT INFO ===== */
.customer-contact-info[b-6q1x8x35gk] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.customer-contact-info .text-muted[b-6q1x8x35gk] {
    font-size: 0.875rem;
    display: flex;
    align-items: center;
}

/* ===== SKELETON TABS ===== */
.skeleton-tabs[b-6q1x8x35gk] {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 1rem 0;
    overflow: hidden;
}

.skeleton-tabs > div[b-6q1x8x35gk] {
    height: 40px;
    border-radius: 6px;
    background: linear-gradient(90deg, var(--bs-secondary-bg) 25%, var(--bs-tertiary-bg) 50%, var(--bs-secondary-bg) 75%);
    background-size: 200% 100%;
    animation: shimmer-b-6q1x8x35gk 1.5s infinite;
}

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

/* ===== CARD ENHANCEMENTS ===== */
.card[b-6q1x8x35gk] {
    border: 1px solid var(--bs-border-color);
    border-radius: 0.5rem;
    box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075);
    transition: box-shadow 0.15s ease-in-out;
}

.card:hover[b-6q1x8x35gk] {
    box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
}

.card-header[b-6q1x8x35gk] {
    background-color: var(--bs-white);
    border-bottom: 1px solid var(--bs-border-color);
    font-weight: 600;
}

.card-body .p-0[b-6q1x8x35gk] {
    padding: 0 !important;
}

/* ===== TAB CONTAINER ===== */
.customer-detail-page .tabs-container[b-6q1x8x35gk] {
    background: var(--bs-white);
    border-radius: 0.5rem 0.5rem 0 0;
    overflow: hidden;
}

/* ===== RESPONSIVE DESIGN ===== */
@media (max-width: 768px) {
    .customer-detail-page[b-6q1x8x35gk] {
        padding: 0.75rem;
    }
    
    .avatar.avatar-lg[b-6q1x8x35gk] {
        width: 3.5rem;
        height: 3.5rem;
    }
    
    h4[b-6q1x8x35gk] {
        font-size: 1.25rem;
    }
    
    .customer-detail-page .btn[b-6q1x8x35gk] {
        font-size: 0.875rem;
    }
}

@media (max-width: 576px) {
    .customer-detail-page[b-6q1x8x35gk] {
        padding: 0.5rem;
    }
    
    .d-flex.justify-content-between[b-6q1x8x35gk] {
        flex-direction: column;
        align-items: flex-start !important;
        gap: 1rem;
    }
    
    .d-flex.gap-2[b-6q1x8x35gk] {
        flex-wrap: wrap;
    }
}

/* ===== DARK MODE ENHANCEMENTS ===== */
[data-theme="theme-dark"] .customer-detail-page[b-6q1x8x35gk] {
    background: var(--bs-gray-900);
}

[data-theme="theme-dark"] .card[b-6q1x8x35gk] {
    background: var(--bs-gray-800);
    border-color: var(--bs-gray-700);
}

[data-theme="theme-dark"] .card-header[b-6q1x8x35gk] {
    background: var(--bs-gray-800);
    border-color: var(--bs-gray-700);
}

[data-theme="theme-dark"] .skeleton-tabs > div[b-6q1x8x35gk] {
    background: linear-gradient(90deg, var(--bs-gray-700) 25%, var(--bs-gray-600) 50%, var(--bs-gray-700) 75%);
}

/* ===== LOADING ANIMATION ===== */
@keyframes fadeIn-b-6q1x8x35gk {
    from {
        opacity: 0;
        transform: translateY(10px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.customer-detail-page .card[b-6q1x8x35gk] {
    animation: fadeIn-b-6q1x8x35gk 0.3s ease;
}

/* ===== BUTTON CONSISTENCY ===== */
.customer-detail-page .btn[b-6q1x8x35gk] {
    border-radius: 0.375rem;
    font-weight: 500;
    transition: all 0.2s ease;
}

.customer-detail-page .btn:hover[b-6q1x8x35gk] {
    transform: translateY(-1px);
}

.customer-detail-page .btn:active[b-6q1x8x35gk] {
    transform: translateY(0);
}

/* ===== ALERT ENHANCEMENTS ===== */
.customer-detail-page .alert[b-6q1x8x35gk] {
    border-radius: 0.5rem;
    border-left-width: 4px;
}

.customer-detail-page .alert-danger[b-6q1x8x35gk] {
    border-left-color: var(--bs-danger);
    background: rgba(var(--bs-danger-rgb), 0.1);
}

/* ===== ACCESSIBILITY ===== */
@media (prefers-reduced-motion: reduce) {
    .customer-detail-page .card[b-6q1x8x35gk] {
        animation: none;
    }
    
    .skeleton-tabs > div[b-6q1x8x35gk] {
        animation: none;
    }
    
    .customer-detail-page .btn[b-6q1x8x35gk] {
        transition: none;
    }
}

@media (prefers-contrast: high) {
    .card[b-6q1x8x35gk] {
        border-width: 2px;
    }
    
    .btn[b-6q1x8x35gk] {
        border-width: 2px;
    }
}
/* _content/AspnetBlazor/Components/Pages/Reports/Dashboard/OperationalOverview.razor.rz.scp.css */
.dashboard-header[b-turtzd3jqr] {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    color: white;
    padding: 2rem;
    border-radius: 8px;
    margin-bottom: 1.5rem;
}

.dashboard-header h4[b-turtzd3jqr] {
    margin-bottom: 0.5rem;
    font-size: 1.5rem;
}

.dashboard-header p[b-turtzd3jqr] {
    margin-bottom: 1rem;
    opacity: 0.9;
}

.dashboard-header .d-flex[b-turtzd3jqr] {
    flex-wrap: wrap;
    gap: 1rem;
    align-items: center;
}

.loading-overlay[b-turtzd3jqr] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 400px;
}

.loading-overlay p[b-turtzd3jqr] {
    margin-top: 1rem;
    color: #6c757d;
}

/* Custom widget grid layout */
.dashboard-widgets[b-turtzd3jqr] {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

.widget-row[b-turtzd3jqr] {
    display: flex;
    gap: 1.5rem;
    flex-wrap: wrap;
}

.widget-col[b-turtzd3jqr] {
    flex: 1;
    min-width: 300px;
}

.widget-col-full[b-turtzd3jqr] {
    width: 100%;
}

/* Responsive adjustments */
@media (max-width: 768px) {
    .dashboard-header[b-turtzd3jqr] {
        padding: 1.5rem;
    }
    
    .dashboard-header h4[b-turtzd3jqr] {
        font-size: 1.25rem;
    }
    
    .widget-row[b-turtzd3jqr] {
        flex-direction: column;
        gap: 1rem;
    }
    
    .widget-col[b-turtzd3jqr] {
        min-width: 100%;
    }
}

@media (max-width: 1200px) {
    .widget-row[b-turtzd3jqr] {
        flex-direction: column;
    }
    
    .widget-col[b-turtzd3jqr] {
        min-width: 100%;
    }
}
/* _content/AspnetBlazor/Components/Pages/Reports/Dashboard/Widgets/DailyActionsWidget.razor.rz.scp.css */
.action-card[b-kl2cpj0enq] {
    text-align: center;
    padding: 1.5rem;
    border: 1px solid #e9ecef;
    border-radius: 8px;
    background: #f8f9fa;
    margin-bottom: 1rem;
    transition: all 0.2s ease-in-out;
}

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

.action-icon[b-kl2cpj0enq] {
    font-size: 2rem;
    color: #6c757d;
    margin-bottom: 0.5rem;
}

.action-card h6[b-kl2cpj0enq] {
    color: #495057;
    margin-bottom: 0.5rem;
    font-weight: 600;
}

.action-badge[b-kl2cpj0enq] {
    font-size: 1.5rem;
    padding: 0.5rem 1rem;
}

/* Color variations for different count ranges */
.action-badge.badge-warning.badge-orange[b-kl2cpj0enq] {
    background-color: #fd7e14;
    color: white;
}

.text-muted[b-kl2cpj0enq] {
    color: #6c757d !important;
}

/* Responsive adjustments */
@media (max-width: 768px) {
    .action-card[b-kl2cpj0enq] {
        margin-bottom: 0.5rem;
    }
    
    .action-icon[b-kl2cpj0enq] {
        font-size: 1.5rem;
    }
    
    .action-badge[b-kl2cpj0enq] {
        font-size: 1.25rem;
    }
}
/* _content/AspnetBlazor/Components/Pages/Reports/Dashboard/Widgets/OperationalTrendsWidget.razor.rz.scp.css */
.chart-container[b-hkzs8yvz4d] {
    height: 250px;
    padding: 1rem;
    border-radius: 0.5rem;
}

.chart-container h6[b-hkzs8yvz4d] {
    font-weight: 600;
}

@media (max-width: 991.98px) {
    .chart-container[b-hkzs8yvz4d] {
        height: 200px;
        margin-bottom: 1rem;
    }
}
/* _content/AspnetBlazor/Components/Pages/Reports/Dashboard/Widgets/TeamPerformanceWidget.razor.rz.scp.css */
/* TeamPerformanceWidget specific styles */
.team-performance-widget[b-z86j2zff7e] {
    min-height: 400px;
}

.team-performance-widget .card-header h5[b-z86j2zff7e] {
    margin: 0;
    color: var(--bs-primary);
}

.team-performance-widget .tab-content[b-z86j2zff7e] {
    padding: 1rem;
    min-height: 300px;
}

.team-performance-widget .chart-container[b-z86j2zff7e] {
    position: relative;
    height: 300px;
}

.team-performance-widget .no-data[b-z86j2zff7e] {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 200px;
    color: var(--bs-secondary);
    font-style: italic;
}
/* _content/AspnetBlazor/Components/Shared/CustomerDetail/CustomerBasicInfo.razor.rz.scp.css */
.customer-basic-info[b-tkieg39p16] {
    border: none;
    box-shadow: 0 2px 6px 0 rgba(67, 89, 113, 0.12);
}

.avatar-wrapper[b-tkieg39p16] {
    width: 64px;
    height: 64px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.avatar-initial[b-tkieg39p16] {
    width: 64px;
    height: 64px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 500;
}

.bg-label-primary[b-tkieg39p16] {
    background-color: rgba(105, 108, 255, 0.16) !important;
    color: #696cff !important;
}

/* Responsive text sizing */
@media (max-width: 768px) {
    .customer-basic-info h4[b-tkieg39p16] {
        font-size: 1.25rem;
    }

    .avatar-wrapper[b-tkieg39p16],
    .avatar-initial[b-tkieg39p16] {
        width: 48px;
        height: 48px;
    }

    .avatar-initial i[b-tkieg39p16] {
        font-size: 1.5rem !important;
    }
}
/* _content/AspnetBlazor/Components/Shared/CustomerDetail/CustomerDetailHeader.razor.rz.scp.css */
/* ===== CUSTOMER DETAIL HEADER ===== */
.customer-detail-header[b-w4ok101bv6] {
    position: sticky;
    top: 0;
    z-index: 100;
    background: #ffffff;
    border-bottom: 1px solid #e9ecef;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.04);
    transition: box-shadow 0.2s ease;
}

.customer-detail-header.scrolled[b-w4ok101bv6] {
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
}

/* ===== HEADER LAYOUT ===== */
.customer-header-layout[b-w4ok101bv6] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 1rem;
    min-height: 120px;
    padding: 1rem 1.5rem;
}

.customer-info-section[b-w4ok101bv6] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    flex: 1;
    min-width: 0;
}

.customer-actions-section[b-w4ok101bv6] {
    display: flex;
    align-items: center;
    gap: 1rem;
    flex-shrink: 0;
}

/* ===== AVATAR STYLES ===== */
.customer-avatar-container[b-w4ok101bv6] {
    position: relative;
    width: 56px;
    height: 56px;
    flex-shrink: 0;
}

.customer-avatar[b-w4ok101bv6] {
    width: 100%;
    height: 100%;
    border-radius: 8px;
    border: 2px solid #e9ecef;
    transition: all 0.2s ease;
}

/* VIP Indicator */
.vip-indicator[b-w4ok101bv6] {
    position: absolute;
    top: -4px;
    right: -4px;
    width: 20px;
    height: 20px;
    background: #ffc107;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 2px solid white;
    z-index: 2;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.15);
}

.vip-indicator .icon[b-w4ok101bv6] {
    color: #856404;
    font-size: 10px;
}

/* ===== CUSTOMER DETAILS ===== */
.customer-details[b-w4ok101bv6] {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.customer-name-row[b-w4ok101bv6] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-wrap: nowrap;
    min-width: 0;
}

.customer-name[b-w4ok101bv6] {
    margin: 0;
    font-size: 1.25rem;
    font-weight: 600;
    color: var(--bs-primary);
    line-height: 1.3;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    flex: 1;
    min-width: 80px;
}

.customer-contact-row[b-w4ok101bv6] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.875rem;
    color: #6c757d;
}

/* ===== FINANCIAL SUMMARY (QUICK METRICS) ===== */
.financial-summary[b-w4ok101bv6] {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-around;
    gap: 1rem;
    padding: 0.5rem 1rem;
    background: #f8f9fa;
    border-radius: 8px;
    min-width: 160px;
}

.financial-item-compact[b-w4ok101bv6] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.15rem;
    flex: 1;
    cursor: pointer;
    transition: transform 0.2s ease;
}

.financial-item-compact:hover[b-w4ok101bv6] {
    transform: scale(1.05);
}

.financial-icon[b-w4ok101bv6] {
    font-size: 1rem;
    line-height: 1;
}

.financial-item-compact .financial-amount[b-w4ok101bv6] {
    font-size: 0.875rem;
    font-weight: 600;
    line-height: 1;
    white-space: nowrap;
    color: #495057;
}

/* ===== ACTION BUTTONS ===== */
.action-buttons[b-w4ok101bv6] {
    display: flex;
    gap: 0.5rem;
    flex-shrink: 0;
}

.action-buttons .button-text[b-w4ok101bv6] {
    white-space: nowrap;
}

/* ===== RESPONSIVE DESIGN ===== */

/* Tablets (≥ 768px) */
@media (min-width: 768px) {
    .customer-header-layout[b-w4ok101bv6] {
        flex-direction: row;
        padding: 1rem 1.5rem;
    }

    .customer-avatar-container[b-w4ok101bv6] {
        width: 56px;
        height: 56px;
    }

    .financial-summary[b-w4ok101bv6] {
        flex-direction: row;
        gap: 1rem;
    }
}

/* Mobile (< 768px) */
@media (max-width: 767px) {
    .customer-header-layout[b-w4ok101bv6] {
        flex-direction: column;
        align-items: flex-start;
        padding: 0.75rem;
        min-height: auto;
        gap: 0.75rem;
    }

    .customer-info-section[b-w4ok101bv6] {
        width: 100%;
    }

    .customer-actions-section[b-w4ok101bv6] {
        width: 100%;
        flex-direction: column;
        align-items: stretch;
        gap: 0.5rem;
    }

    .customer-avatar-container[b-w4ok101bv6] {
        width: 48px;
        height: 48px;
    }

    .customer-name[b-w4ok101bv6] {
        font-size: 1.1rem;
    }

    .financial-summary[b-w4ok101bv6] {
        width: 100%;
        justify-content: space-between;
        padding: 0.5rem;
        gap: 0.5rem;
    }

    .financial-item-compact .financial-amount[b-w4ok101bv6] {
        font-size: 0.75rem;
    }

    .action-buttons[b-w4ok101bv6] {
        width: 100%;
        gap: 0.5rem;
    }

    .action-buttons .button-text[b-w4ok101bv6] {
        display: none; /* Hide text on mobile, show icons only */
    }

    /* Show button text only for primary actions on mobile */
    .action-buttons > :first-child .button-text[b-w4ok101bv6],
    .action-buttons > :nth-child(2) .button-text[b-w4ok101bv6] {
        display: inline;
    }
}

/* Large Desktop (≥ 1200px) */
@media (min-width: 1200px) {
    .customer-header-layout[b-w4ok101bv6] {
        gap: 2rem;
    }

    .financial-summary[b-w4ok101bv6] {
        min-width: 200px;
        gap: 1.5rem;
    }

    .button-text[b-w4ok101bv6] {
        display: inline !important;
    }
}

/* ===== DARK MODE SUPPORT ===== */
.dark-style .customer-detail-header[b-w4ok101bv6],
html.dark-style .customer-detail-header[b-w4ok101bv6],
body.dark-style .customer-detail-header[b-w4ok101bv6],
[data-theme="theme-dark"] .customer-detail-header[b-w4ok101bv6] {
    background: #1e1e1e;
    border-bottom-color: #333;
}

.dark-style .financial-summary[b-w4ok101bv6],
html.dark-style .financial-summary[b-w4ok101bv6],
body.dark-style .financial-summary[b-w4ok101bv6],
[data-theme="theme-dark"] .financial-summary[b-w4ok101bv6] {
    background: #2a2a2a;
}

.dark-style .customer-name[b-w4ok101bv6],
html.dark-style .customer-name[b-w4ok101bv6],
body.dark-style .customer-name[b-w4ok101bv6],
[data-theme="theme-dark"] .customer-name[b-w4ok101bv6] {
    color: #4a9eff;
}

.dark-style .financial-item-compact .financial-amount[b-w4ok101bv6],
html.dark-style .financial-item-compact .financial-amount[b-w4ok101bv6],
body.dark-style .financial-item-compact .financial-amount[b-w4ok101bv6],
[data-theme="theme-dark"] .financial-item-compact .financial-amount[b-w4ok101bv6] {
    color: #d4d4d4;
}

/* ===== ACCESSIBILITY ===== */
.customer-detail-header:focus-visible[b-w4ok101bv6],
.financial-item-compact:focus-visible[b-w4ok101bv6],
.action-buttons button:focus-visible[b-w4ok101bv6] {
    outline: 2px solid #0d6efd;
    outline-offset: 2px;
    border-radius: 4px;
}

/* High contrast for better readability */
@media (prefers-contrast: high) {
    .customer-detail-header[b-w4ok101bv6] {
        border-bottom-width: 2px;
    }

    .customer-name[b-w4ok101bv6] {
        font-weight: 700;
    }
}
/* _content/AspnetBlazor/Components/Shared/InvoiceCard.razor.rz.scp.css */
.invoice-card[b-dq31eev9lf] {
    border: 1px solid var(--bs-border-color);
    transition: all 0.3s ease;
    margin-bottom: 0.75rem;
}

.invoice-card:hover[b-dq31eev9lf] {
    box-shadow: 0 4px 12px var(--bs-shadow-sm);
    transform: translateY(-2px);
    border-color: var(--bs-border-color-translucent);
}

.invoice-card-selected[b-dq31eev9lf] {
    border-color: var(--bs-primary);
    background-color: var(--bs-primary-bg-subtle);
}

.bg-label-primary[b-dq31eev9lf] {
    background-color: var(--bs-primary-bg-subtle) !important;
    color: var(--bs-primary) !important;
}

.orders-toggle[b-dq31eev9lf] {
    cursor: pointer;
    color: var(--bs-body-color);
}

.orders-toggle:hover[b-dq31eev9lf] {
    color: var(--bs-primary);
}

.cursor-pointer[b-dq31eev9lf] {
    cursor: pointer;
}

.form-check-input:checked[b-dq31eev9lf] {
    background-color: var(--bs-primary);
    border-color: var(--bs-primary);
}

/* Invoice Basic Info */
.invoice-basic-info[b-dq31eev9lf] {
    display: flex;
    flex-direction: column;
}

/* Bulk Actions Bar */
.bulk-actions-bar[b-dq31eev9lf] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.625rem 1rem;
    background: linear-gradient(135deg, rgba(13, 110, 253, 0.04) 0%, rgba(13, 202, 240, 0.04) 100%);
    border-bottom: 1px solid rgba(13, 110, 253, 0.12);
    border-left: 2px solid rgba(13, 110, 253, 0.35);
    gap: 1rem;
    flex-wrap: wrap;
}

@media (prefers-color-scheme: dark) {
    .bulk-actions-bar[b-dq31eev9lf] {
        background: linear-gradient(135deg, rgba(var(--bs-primary-rgb), 0.06) 0%, rgba(var(--bs-info-rgb), 0.06) 100%);
        border-bottom: 1px solid rgba(var(--bs-primary-rgb), 0.15);
        border-left: 2px solid rgba(var(--bs-primary-rgb), 0.4);
    }
}

.bulk-actions-left[b-dq31eev9lf] {
    display: flex;
    align-items: center;
    gap: 1rem;
    flex: 1;
}

.bulk-actions-right[b-dq31eev9lf] {
    display: flex;
    gap: 0.5rem;
    flex-wrap: wrap;
}

.selected-count[b-dq31eev9lf] {
    font-size: 0.875rem;
    color: var(--bs-primary);
    font-weight: 600;
    display: flex;
    align-items: center;
}

/* Product Link */
.product-link[b-dq31eev9lf] {
    color: var(--bs-primary);
    text-decoration: none;
    font-weight: 500;
    transition: all 0.2s ease;
    display: inline-flex;
    align-items: center;
}

.product-link:hover[b-dq31eev9lf] {
    color: var(--bs-primary-text-emphasis);
    text-decoration: underline;
}

/* Item Meta - Status and Action */
.item-meta[b-dq31eev9lf] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-wrap: wrap;
}

/* Status Change Button */
.btn-status-change[b-dq31eev9lf] {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    padding: 0.25rem 0.5rem;
    font-size: 0.75rem;
    border: 1px solid var(--bs-primary);
    background-color: transparent;
    color: var(--bs-primary);
    border-radius: 0.25rem;
    cursor: pointer;
    transition: all 0.2s ease;
    white-space: nowrap;
}

.btn-status-change:hover[b-dq31eev9lf] {
    background-color: var(--bs-primary);
    color: white;
}

.btn-status-change:active[b-dq31eev9lf] {
    transform: scale(0.95);
}

/* Item Checkbox */
.item-checkbox[b-dq31eev9lf] {
    display: flex;
    align-items: center;
    padding-right: 0.75rem;
}

.item-selected[b-dq31eev9lf] {
    background: linear-gradient(to right, rgba(13, 110, 253, 0.1) 0%, rgba(13, 110, 253, 0.04) 100%) !important;
    border-left-color: var(--bs-primary) !important;
    box-shadow: inset 0 0 0 1px rgba(13, 110, 253, 0.18);
}

@media (prefers-color-scheme: dark) {
    .item-selected[b-dq31eev9lf] {
        background: linear-gradient(to right, rgba(var(--bs-primary-rgb), 0.12) 0%, rgba(var(--bs-primary-rgb), 0.05) 100%) !important;
        box-shadow: inset 0 0 0 1px rgba(var(--bs-primary-rgb), 0.2);
    }
}

/* Order Items Custom Layout - Same as Invoice.razor */
.order-items-container[b-dq31eev9lf] {
    display: flex;
    flex-direction: column;
    gap: 0;
}

.order-item-block[b-dq31eev9lf] {
    border-bottom: 1px solid var(--bs-border-color);
    transition: background-color 0.2s ease;
}

.order-item-block:last-child[b-dq31eev9lf] {
    border-bottom: none;
}

.order-item-block:hover[b-dq31eev9lf] {
    background: linear-gradient(to right, rgba(13, 110, 253, 0.02) 0%, rgba(248, 249, 250, 0.5) 100%);
}

@media (prefers-color-scheme: dark) {
    .order-item-block:hover[b-dq31eev9lf] {
        background: linear-gradient(to right, rgba(var(--bs-primary-rgb), 0.03) 0%, transparent 100%);
    }
}

/* Order Header */
.order-header[b-dq31eev9lf] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.75rem 1rem;
    background: linear-gradient(135deg, rgba(13, 110, 253, 0.06) 0%, rgba(255, 255, 255, 0.3) 100%);
    border-left: 3px solid var(--bs-primary);
    border-bottom: 1px solid rgba(13, 110, 253, 0.1);
    gap: 1rem;
    transition: all 0.2s ease;
}

.order-item-block:hover .order-header[b-dq31eev9lf] {
    background: linear-gradient(135deg, rgba(13, 110, 253, 0.09) 0%, rgba(255, 255, 255, 0.4) 100%);
    border-left-color: rgba(13, 110, 253, 0.85);
}

@media (prefers-color-scheme: dark) {
    .order-header[b-dq31eev9lf] {
        background: linear-gradient(135deg, rgba(var(--bs-primary-rgb), 0.08) 0%, transparent 100%);
        border-bottom: 1px solid rgba(var(--bs-primary-rgb), 0.12);
    }

    .order-item-block:hover .order-header[b-dq31eev9lf] {
        background: linear-gradient(135deg, rgba(var(--bs-primary-rgb), 0.12) 0%, transparent 100%);
        border-left-color: rgba(var(--bs-primary-rgb), 0.9);
    }
}

.order-info[b-dq31eev9lf] {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
}

.order-number[b-dq31eev9lf] {
    font-size: 0.95rem;
    font-weight: 600;
    color: var(--bs-body-color);
    display: flex;
    align-items: center;
}

.order-meta[b-dq31eev9lf] {
    display: flex;
    gap: 1rem;
    font-size: 0.8125rem;
    color: var(--bs-secondary-color);
}

.order-meta span[b-dq31eev9lf] {
    display: flex;
    align-items: center;
}

.order-total[b-dq31eev9lf] {
    font-size: 1rem;
    font-weight: 700;
    color: var(--bs-primary);
    white-space: nowrap;
}

/* Items List */
.items-list[b-dq31eev9lf] {
    padding: 0;
    background-color: #ffffff;
}

.item-row[b-dq31eev9lf] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    padding: 0.75rem 1rem;
    border-top: 1px solid rgba(0, 0, 0, 0.05);
    gap: 0.75rem;
    transition: all 0.2s ease;
    border-left: 3px solid transparent;
    background-color: #ffffff;
}

.item-row:first-child[b-dq31eev9lf] {
    border-top: none;
}

.item-row:hover[b-dq31eev9lf] {
    background: linear-gradient(to right, rgba(13, 110, 253, 0.05) 0%, #ffffff 100%);
    border-left-color: rgba(13, 110, 253, 0.3);
}

/* Dark Mode */
@media (prefers-color-scheme: dark) {
    .items-list[b-dq31eev9lf] {
        background-color: var(--bs-body-bg);
    }

    .item-row[b-dq31eev9lf] {
        border-top: 1px solid var(--bs-border-color-translucent);
        background-color: var(--bs-body-bg);
    }

    .item-row:hover[b-dq31eev9lf] {
        background: linear-gradient(to right, rgba(var(--bs-primary-rgb), 0.05) 0%, var(--bs-body-bg) 100%);
        border-left-color: rgba(var(--bs-primary-rgb), 0.3);
    }
}

.item-info[b-dq31eev9lf] {
    flex: 1;
    min-width: 0;
}

.item-name[b-dq31eev9lf] {
    font-weight: 500;
    color: var(--bs-body-color);
    margin-bottom: 0.25rem;
    line-height: 1.4;
}

.item-description[b-dq31eev9lf] {
    font-size: 0.8125rem;
    color: var(--bs-secondary-color);
    line-height: 1.4;
}

.item-details[b-dq31eev9lf] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    white-space: nowrap;
    font-size: 0.875rem;
}

.item-quantity[b-dq31eev9lf] {
    background: linear-gradient(135deg, rgba(13, 110, 253, 0.12) 0%, rgba(13, 110, 253, 0.18) 100%);
    color: #0d6efd;
    padding: 0.25rem 0.5rem;
    border-radius: 0.375rem;
    font-weight: 600;
    font-size: 0.8125rem;
    border: 1px solid rgba(13, 110, 253, 0.25);
}

@media (prefers-color-scheme: dark) {
    .item-quantity[b-dq31eev9lf] {
        background: linear-gradient(135deg, rgba(var(--bs-primary-rgb), 0.15) 0%, rgba(var(--bs-primary-rgb), 0.2) 100%);
        color: var(--bs-primary);
        border: 1px solid rgba(var(--bs-primary-rgb), 0.3);
    }
}

.item-subtotal[b-dq31eev9lf] {
    font-weight: 600;
    color: var(--bs-body-color);
    min-width: 100px;
    text-align: right;
}

/* Order Footer */
.order-footer[b-dq31eev9lf] {
    padding: 0.625rem 1rem;
    background: linear-gradient(to bottom, rgba(13, 110, 253, 0.025) 0%, rgba(13, 110, 253, 0.05) 100%);
    border-top: 1px solid rgba(13, 110, 253, 0.12);
}

@media (prefers-color-scheme: dark) {
    .order-footer[b-dq31eev9lf] {
        background: linear-gradient(to bottom, rgba(var(--bs-primary-rgb), 0.04) 0%, rgba(var(--bs-primary-rgb), 0.06) 100%);
        border-top: 1px solid rgba(var(--bs-primary-rgb), 0.15);
    }
}

.order-summary-row[b-dq31eev9lf] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 0.8125rem;
}

.order-summary-row .label[b-dq31eev9lf] {
    color: var(--bs-secondary-color);
}

.order-summary-row .value[b-dq31eev9lf] {
    font-weight: 600;
}

/* Responsive */
@media (max-width: 768px) {
    .invoice-actions[b-dq31eev9lf] {
        justify-content: center;
    }

    .invoice-basic-info[b-dq31eev9lf] {
        flex-direction: column;
        align-items: flex-start;
    }

    .bulk-actions-bar[b-dq31eev9lf] {
        padding: 0.5rem 0.75rem;
    }

    .bulk-actions-left[b-dq31eev9lf],
    .bulk-actions-right[b-dq31eev9lf] {
        width: 100%;
        justify-content: space-between;
    }

    .selected-count[b-dq31eev9lf] {
        font-size: 0.8125rem;
    }

    .order-header[b-dq31eev9lf] {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.5rem;
        padding: 0.625rem 0.875rem;
    }

    .order-total[b-dq31eev9lf] {
        align-self: flex-end;
        font-size: 0.9375rem;
    }

    .order-meta[b-dq31eev9lf] {
        flex-direction: column;
        gap: 0.375rem;
    }

    .item-row[b-dq31eev9lf] {
        flex-wrap: wrap;
        gap: 0.5rem;
        padding: 0.625rem 0.875rem;
    }

    .item-checkbox[b-dq31eev9lf] {
        padding-right: 0.5rem;
    }

    .item-info[b-dq31eev9lf] {
        flex: 1;
        min-width: calc(100% - 50px);
    }

    .item-details[b-dq31eev9lf] {
        justify-content: space-between;
        width: 100%;
        margin-left: calc(24px + 0.5rem);
    }

    .item-subtotal[b-dq31eev9lf] {
        min-width: auto;
    }

    .order-number[b-dq31eev9lf] {
        font-size: 0.875rem;
    }

    .btn-status-change span[b-dq31eev9lf] {
        display: none !important;
    }
}
/* _content/AspnetBlazor/Components/Shared/Navbar.razor.rz.scp.css */
/* Navbar Fixed Styles */
.layout-navbar.navbar-detached[b-tljfuudpz4] {
    position: sticky !important; /* Use sticky instead of fixed */
    top: 0;
    z-index: 1030; /* High z-index to ensure navbar stays on top */
}

/* Add box shadow for better visual separation when scrolling */
.layout-navbar.navbar-scrolled[b-tljfuudpz4] {
    box-shadow: 0 2px 6px 0 rgba(67, 89, 113, 0.12);
}

/* Ensure the navbar has a background even when scrolling */
.bg-navbar-theme[b-tljfuudpz4] {
    backdrop-filter: saturate(180%) blur(10px);
}

/* For dark theme compatibility */
.dark-style .bg-navbar-theme[b-tljfuudpz4] {
    backdrop-filter: saturate(180%) blur(10px);
}

/* Ensure content wrapper starts right after navbar */
.content-wrapper[b-tljfuudpz4] {
    padding-top: 0.5rem; /* Add a small gap between navbar and content */
}

/* Fix for transitioning state */
.layout-transitioning .layout-navbar[b-tljfuudpz4] {
    transition: box-shadow 0.2s ease-in-out;
}
/* _content/AspnetBlazor/Components/Shared/RadzenChartContainer.razor.rz.scp.css */
.radzen-chart-container[b-f73sntetew] {
    position: relative;
    overflow: visible;
    z-index: 1;
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
}

/* Sử dụng ::deep để áp dụng style cho các phần tử con */
[b-f73sntetew] .rz-chart {
    position: relative !important;
    overflow: visible !important;
    width: 100% !important;
    height: 100% !important;
    flex: 1 !important;
}

[b-f73sntetew] .rz-chart-tooltip {
    z-index: 10000 !important;
    position: absolute !important;
    pointer-events: none !important;
    opacity: 1 !important;
    visibility: visible !important;
    display: block !important;
    background-color: white !important;
    border: 1px solid #ccc !important;
    border-radius: 4px !important;
    padding: 8px !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15) !important;
}

[b-f73sntetew] .rz-chart svg, 
[b-f73sntetew] .rz-chart svg * {
    pointer-events: auto !important;
}

/* Đảm bảo các phần tử cha không ẩn tooltip */
[b-f73sntetew] .card, [b-f73sntetew] .card-body, [b-f73sntetew] .container-xxl, 
[b-f73sntetew] .content-wrapper, [b-f73sntetew] .layout-page, 
[b-f73sntetew] .layout-container, [b-f73sntetew] .layout-wrapper,
[b-f73sntetew] .rz-card, [b-f73sntetew] .rz-stack, [b-f73sntetew] .rz-row, [b-f73sntetew] .rz-column {
    overflow: visible !important;
}
/* _content/AspnetBlazor/Components/Shared/SessionResolutionCard.razor.rz.scp.css */
.session-resolution-card[b-7wl18g8ijq] {
    border: 1px solid var(--bs-border-color);
    transition: all 0.3s ease;
    margin-bottom: 0.75rem;
}

.session-resolution-card:hover[b-7wl18g8ijq] {
    box-shadow: 0 4px 12px var(--bs-shadow-sm);
    transform: translateY(-2px);
    border-color: var(--bs-success-border-subtle);
}

.session-expanded[b-7wl18g8ijq] {
    border-color: var(--bs-success);
    background-color: var(--bs-success-bg-subtle);
}

.session-icon[b-7wl18g8ijq] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    background: var(--bs-success-bg-subtle);
    border-radius: 0.375rem;
}

.resolution-meta[b-7wl18g8ijq] {
    font-size: 0.875rem;
}

.meta-item[b-7wl18g8ijq] {
    display: flex;
    align-items: center;
}

.resolution-note-preview[b-7wl18g8ijq] {
    font-size: 0.875rem;
    border-left: 3px solid var(--bs-success);
}

/* Customers Section */
.customers-section[b-7wl18g8ijq] {
    margin-top: 1rem;
}

.section-header[b-7wl18g8ijq] {
    border-bottom: 2px solid var(--bs-border-color);
    margin-bottom: 0.75rem;
}

.customer-group-card[b-7wl18g8ijq] {
    border: 1px solid var(--bs-border-color);
    border-radius: 0.5rem;
    overflow: hidden;
}

.customer-header[b-7wl18g8ijq] {
    background: linear-gradient(135deg, rgba(13, 110, 253, 0.06) 0%, rgba(255, 255, 255, 0.3) 100%);
    padding: 0.75rem 1rem;
    border-left: 3px solid var(--bs-primary);
    border-bottom: 1px solid rgba(13, 110, 253, 0.1);
}

@media (prefers-color-scheme: dark) {
    .customer-header[b-7wl18g8ijq] {
        background: linear-gradient(135deg, rgba(var(--bs-primary-rgb), 0.15) 0%, rgba(var(--bs-primary-rgb), 0.05) 100%);
        border-bottom: 1px solid rgba(var(--bs-primary-rgb), 0.2);
    }
}

[data-bs-theme="dark"] .customer-header[b-7wl18g8ijq] {
    background: linear-gradient(135deg, rgba(var(--bs-primary-rgb), 0.15) 0%, rgba(var(--bs-primary-rgb), 0.05) 100%);
    border-bottom: 1px solid rgba(var(--bs-primary-rgb), 0.2);
}

.customer-avatar[b-7wl18g8ijq] {
    width: 36px;
    height: 36px;
    background: var(--bs-primary-bg-subtle);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--bs-primary);
}

.customer-name[b-7wl18g8ijq] {
    font-weight: 600;
    color: var(--bs-body-color);
}

[data-bs-theme="dark"] .customer-name[b-7wl18g8ijq] {
    color: var(--bs-emphasis-color);
}

@media (prefers-color-scheme: dark) {
    .customer-name[b-7wl18g8ijq] {
        color: var(--bs-emphasis-color);
    }
}

/* Items List */
.items-list[b-7wl18g8ijq] {
    padding: 0;
    background-color: #ffffff;
}

@media (prefers-color-scheme: dark) {
    .items-list[b-7wl18g8ijq] {
        background-color: var(--bs-body-bg);
    }
}

.item-row[b-7wl18g8ijq] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    padding: 0.75rem 1rem;
    border-top: 1px solid rgba(0, 0, 0, 0.05);
    gap: 0.75rem;
    transition: all 0.2s ease;
    border-left: 3px solid transparent;
    background-color: #ffffff;
}

@media (prefers-color-scheme: dark) {
    .item-row[b-7wl18g8ijq] {
        border-top: 1px solid var(--bs-border-color-translucent);
        background-color: var(--bs-body-bg);
    }
}

.item-row:first-child[b-7wl18g8ijq] {
    border-top: none;
}

.item-row:hover[b-7wl18g8ijq] {
    background: linear-gradient(to right, rgba(13, 110, 253, 0.05) 0%, #ffffff 100%);
    border-left-color: rgba(13, 110, 253, 0.3);
}

@media (prefers-color-scheme: dark) {
    .item-row:hover[b-7wl18g8ijq] {
        background: linear-gradient(to right, rgba(var(--bs-primary-rgb), 0.05) 0%, var(--bs-body-bg) 100%);
        border-left-color: rgba(var(--bs-primary-rgb), 0.3);
    }
}

.item-info[b-7wl18g8ijq] {
    flex: 1;
    min-width: 0;
}

.item-name[b-7wl18g8ijq] {
    font-weight: 500;
    color: var(--bs-body-color);
    margin-bottom: 0.25rem;
    line-height: 1.4;
}

.product-link[b-7wl18g8ijq] {
    color: var(--bs-primary);
    text-decoration: none;
    font-weight: 500;
    transition: all 0.2s ease;
    display: inline-flex;
    align-items: center;
}

.product-link:hover[b-7wl18g8ijq] {
    color: var(--bs-primary-text-emphasis);
    text-decoration: underline;
}

.item-description[b-7wl18g8ijq] {
    font-size: 0.8125rem;
    color: var(--bs-secondary-color);
    line-height: 1.4;
}

.item-meta[b-7wl18g8ijq] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-wrap: wrap;
}

.item-details[b-7wl18g8ijq] {
    display: flex;
    align-items: center;
    white-space: nowrap;
}

.item-subtotal[b-7wl18g8ijq] {
    font-weight: 600;
    color: var(--bs-body-color);
}

/* Attachments Section */
.attachments-section[b-7wl18g8ijq] {
    border-top: 1px solid var(--bs-border-color);
    padding-top: 1rem;
}

.attachments-grid[b-7wl18g8ijq] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(120px, 1fr));
    gap: 0.75rem;
}

.attachment-item[b-7wl18g8ijq] {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 0.75rem;
    border: 1px solid var(--bs-border-color);
    border-radius: 0.375rem;
    cursor: pointer;
    transition: all 0.2s ease;
    background: var(--bs-body-bg);
}

.attachment-item:hover[b-7wl18g8ijq] {
    border-color: var(--bs-primary);
    box-shadow: 0 2px 8px rgba(13, 110, 253, 0.15);
    transform: translateY(-2px);
}

.attachment-thumbnail[b-7wl18g8ijq] {
    width: 80px;
    height: 80px;
    border-radius: 0.375rem;
    overflow: hidden;
    margin-bottom: 0.5rem;
    background: var(--bs-secondary-bg);
}

.attachment-thumbnail img[b-7wl18g8ijq] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.attachment-icon[b-7wl18g8ijq] {
    width: 80px;
    height: 80px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--bs-secondary-color);
    background: var(--bs-secondary-bg);
    border-radius: 0.375rem;
    margin-bottom: 0.5rem;
}

.attachment-name[b-7wl18g8ijq] {
    font-size: 0.75rem;
    text-align: center;
    word-break: break-word;
    line-height: 1.3;
    color: var(--bs-body-color);
}

.more-items[b-7wl18g8ijq] {
    background: var(--bs-primary-bg-subtle);
}

.more-items .attachment-icon[b-7wl18g8ijq] {
    background: var(--bs-primary-bg-subtle);
    color: var(--bs-primary);
}

.more-items:hover[b-7wl18g8ijq] {
    background: var(--bs-primary);
    border-color: var(--bs-primary);
}

.more-items:hover .attachment-icon[b-7wl18g8ijq] {
    background: var(--bs-primary);
    color: white;
}

.more-items:hover .attachment-name[b-7wl18g8ijq] {
    color: white;
}

/* Session Actions */
.session-actions[b-7wl18g8ijq] {
    display: flex;
    gap: 0.5rem;
    flex-wrap: wrap;
}

/* Responsive */
@media (max-width: 768px) {
    .resolution-meta[b-7wl18g8ijq] {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.5rem !important;
    }

    .item-row[b-7wl18g8ijq] {
        flex-direction: column;
        gap: 0.5rem;
    }

    .item-details[b-7wl18g8ijq] {
        width: 100%;
        justify-content: flex-end;
    }

    .attachments-grid[b-7wl18g8ijq] {
        grid-template-columns: repeat(auto-fill, minmax(100px, 1fr));
    }

    .attachment-thumbnail[b-7wl18g8ijq],
    .attachment-icon[b-7wl18g8ijq] {
        width: 60px;
        height: 60px;
    }

    .session-actions[b-7wl18g8ijq] {
        justify-content: center;
    }
}

/* Dark Mode Support */
[data-bs-theme="dark"] .session-resolution-card[b-7wl18g8ijq] {
    background-color: var(--bs-dark-bg-subtle);
    border-color: var(--bs-border-color);
}

[data-bs-theme="dark"] .session-resolution-card:hover[b-7wl18g8ijq] {
    box-shadow: 0 4px 12px rgba(255, 255, 255, 0.1);
}

[data-bs-theme="dark"] .resolution-note-preview[b-7wl18g8ijq] {
    background-color: rgba(255, 255, 255, 0.05) !important;
}

[data-bs-theme="dark"] .customer-group-card[b-7wl18g8ijq] {
    background-color: var(--bs-dark-bg-subtle);
}
/* _content/AspnetBlazor/Components/Shared/VerticalMenu.razor.rz.scp.css */
/* CSS tùy chỉnh cho menu */

/* Khi menu được mở rộng */
body.layout-menu-expanded .layout-menu[b-l5l83lbldw] {
    transform: translateX(0);
    width: 16rem;
    z-index: 9999; /* Tăng z-index để đảm bảo menu luôn ở trên overlay */
}

/* Trạng thái transitioning để tránh việc menu bị đóng ngay lập tức */
body.layout-transitioning .layout-menu[b-l5l83lbldw] {
    transition: width 0.3s ease-in-out !important;
}

/* Ngăn chặn các sự kiện click trong quá trình chuyển đổi */
body.layout-transitioning[b-l5l83lbldw] {
    pointer-events: none;
}

/* Vẫn cho phép click vào menu trong quá trình chuyển đổi */
body.layout-transitioning .layout-menu[b-l5l83lbldw] {
    pointer-events: auto;
}

/* Đảm bảo kích thước menu đúng trong quá trình chuyển đổi */
body.layout-transitioning.layout-menu-collapsed .layout-menu[b-l5l83lbldw] {
    width: 5rem !important;
}

body.layout-transitioning.layout-menu-expanded .layout-menu[b-l5l83lbldw] {
    width: 16rem !important;
}

/* Ngăn chặn hiệu ứng hover khi đang trong quá trình chuyển đổi */
body.layout-transitioning .layout-menu-hover[b-l5l83lbldw],
body.layout-transitioning.layout-menu-hover[b-l5l83lbldw] {
    display: none !important;
}

/* Đảm bảo layout-page không bị đẩy sang phải khi hover vào menu */
@media (min-width: 1200px) {
    .layout-menu-collapsed .layout-page[b-l5l83lbldw] {
        margin-left: 5rem !important;
        transition: margin-left 0.3s ease-in-out !important;
    }
    
    .layout-menu-expanded .layout-page[b-l5l83lbldw] {
        transition: margin-left 0.3s ease-in-out !important;
    }

    /* Đảm bảo layout-page không bị đẩy sang phải khi hover */
    body.layout-menu-hover.layout-menu-collapsed .layout-page[b-l5l83lbldw] {
        margin-left: 5rem !important;
    }
    
    /* Đảm bảo menu-item hiển thị đúng khi hover */
    .layout-menu-hover.layout-menu-collapsed .layout-menu .menu-inner > .menu-item[b-l5l83lbldw] {
        width: 100% !important;
    }
    
    /* Đảm bảo menu-link hiển thị đúng khi hover */
    .layout-menu-hover.layout-menu-collapsed .layout-menu .menu-inner > .menu-item > .menu-link[b-l5l83lbldw] {
        width: 100% !important;
        text-overflow: ellipsis !important;
        white-space: nowrap !important;
        overflow: hidden !important;
    }
    
    /* Đảm bảo layout-page không bị đẩy sang phải khi hover */
    body.layout-menu-hover.layout-menu-collapsed .layout-page[b-l5l83lbldw] {
        margin-left: 5rem !important;
    }
}

/* Khi menu bị thu gọn trên màn hình nhỏ */
@media (max-width: 1199.98px) {
    .layout-menu[b-l5l83lbldw] {
        transform: translateX(-100%);
        transition: transform 0.3s ease-in-out;
        position: fixed;
        top: 0;
        left: 0;
        height: 100%;
        z-index: 9999; /* Đảm bảo menu ở trên overlay (z-index: 999) */
    }
    
    /* Khi menu được mở rộng trên màn hình nhỏ */
    body.layout-menu-expanded .layout-menu[b-l5l83lbldw] {
        transform: translateX(0);
    }
    
    body.layout-menu-expanded .layout-overlay[b-l5l83lbldw] {
        display: block;
        opacity: 0.5;
    }
    
    /* Đảm bảo menu có thể nhận sự kiện click */
    body.layout-transitioning .layout-menu[b-l5l83lbldw] {
        pointer-events: auto !important;
    }
}

/* Khi menu bị thu gọn trên màn hình lớn */
@media (min-width: 1200px) {
    .layout-menu-collapsed .layout-menu[b-l5l83lbldw] {
        width: 5rem;
        z-index: 9999; /* Đảm bảo menu luôn ở trên overlay */
    }
    
    .layout-menu-collapsed .layout-menu .app-brand[b-l5l83lbldw] {
        justify-content: center;
        position: relative; /* Để có thể định vị nút toggle */
    }
    
    .layout-menu-collapsed .layout-menu .app-brand-text[b-l5l83lbldw] {
        display: none;
    }
    
    /* Ẩn nút toggle trong app-brand khi menu bị thu gọn */
    .layout-menu-collapsed .layout-menu .app-brand .layout-menu-toggle[b-l5l83lbldw] {
        display: none !important;
    }
    
    .layout-menu-collapsed .layout-menu .menu-inner > .menu-item > .menu-link > div[b-l5l83lbldw] {
        display: none;
    }
    
    .layout-menu-collapsed .layout-menu .menu-inner > .menu-item > .menu-link > .menu-icon[b-l5l83lbldw] {
        margin-right: 0;
    }
    
    .layout-menu-collapsed .layout-menu .menu-inner > .menu-item > .menu-sub[b-l5l83lbldw] {
        display: none;
    }
    
    .layout-menu-collapsed .layout-page[b-l5l83lbldw] {
        margin-left: 5rem;
    }
    
    /* Đảm bảo menu-sub hiển thị đúng khi hover */
    .layout-menu-hover.layout-menu-collapsed .layout-menu .menu-inner > .menu-item.open > .menu-sub[b-l5l83lbldw] {
        display: block !important;
    }
    
    /* Đảm bảo menu-inner hiển thị đúng khi hover */
    .layout-menu-hover.layout-menu-collapsed .layout-menu .menu-inner[b-l5l83lbldw] {
        width: 100% !important;
        padding: 0 !important;
    }
    
    /* Xử lý menu-header khi menu bị thu gọn */
    .layout-menu-collapsed .layout-menu .menu-inner > .menu-header[b-l5l83lbldw] {
        position: relative;
        margin-left: 5rem;
        padding-right: 1.5rem;
        padding-left: 0.5rem;
    }
    
    .layout-menu-collapsed .layout-menu .menu-inner > .menu-header .menu-header-text[b-l5l83lbldw] {
        overflow: hidden;
        opacity: 0;
    }
    
    .layout-menu-collapsed .layout-menu .menu-inner > .menu-header[b-l5l83lbldw]::before {
        content: '';
        position: absolute;
        left: -3.3rem;
        height: 1px;
        width: 1.375rem;
        background-color: #d9dee3;
        opacity: 0.4; /* Làm mờ đường kẻ */
        top: 50%;
    }
    
    /* Đảm bảo menu-header hiển thị đúng khi hover */
    .layout-menu-hover.layout-menu-collapsed .layout-menu .menu-inner > .menu-header[b-l5l83lbldw] {
        margin-left: 0 !important;
        padding-left: 1.25rem !important;
        padding-right: 1.25rem !important;
        width: 100% !important;
    }
}

/* Hiệu ứng khi hover vào menu thu gọn trên màn hình lớn */
@media (min-width: 1200px) {
    /* Khi hover vào menu thu gọn - làm cho nó giống hệt trạng thái Expanded */
    body.layout-menu-hover.layout-menu-collapsed .layout-menu[b-l5l83lbldw] {
        width: 16rem !important;
        overflow: visible !important;
        transform: translateX(0) !important;
        box-shadow: 0 2px 6px 0 rgba(67, 89, 113, 0.12) !important;
        z-index: 1085 !important; /* Giữ nguyên z-index cao để đảm bảo menu luôn ở trên cùng */
    }
    
    /* Đảm bảo layout-page không bị đẩy sang phải khi hover */
    body.layout-menu-hover.layout-menu-collapsed ~ .layout-page[b-l5l83lbldw] {
        margin-left: 5rem !important;
    }
    
    /* Hiển thị app-brand-text */
    body.layout-menu-hover.layout-menu-collapsed .layout-menu .app-brand-text[b-l5l83lbldw] {
        display: block !important;
        opacity: 1 !important;
        visibility: visible !important;
    }
    
    /* Hiển thị lại nút toggle khi hover vào menu thu gọn */
    body.layout-menu-hover.layout-menu-collapsed .layout-menu .app-brand .layout-menu-toggle[b-l5l83lbldw] {
        display: flex !important;
        position: absolute;
        right: 0.5rem;
        top: 50%;
        transform: translateY(-50%);
        z-index: 10;
        background-color: transparent;
    }
    
    /* Hiển thị text trong menu-link */
    body.layout-menu-hover.layout-menu-collapsed .layout-menu .menu-inner > .menu-item > .menu-link > div[b-l5l83lbldw] {
        display: block !important;
        opacity: 1 !important;
        visibility: visible !important;
    }
    
    /* Đảm bảo menu-icon có margin đúng */
    body.layout-menu-hover.layout-menu-collapsed .layout-menu .menu-inner > .menu-item > .menu-link > .menu-icon[b-l5l83lbldw] {
        margin-right: 0.5rem !important;
    }
    
    /* Hiển thị menu-header khi hover */
    body.layout-menu-hover.layout-menu-collapsed .layout-menu .menu-inner > .menu-header[b-l5l83lbldw] {
        margin-left: 0 !important;
        padding-left: 1.25rem !important;
        padding-right: 1.25rem !important;
    }
    
    body.layout-menu-hover.layout-menu-collapsed .layout-menu .menu-inner > .menu-header .menu-header-text[b-l5l83lbldw] {
        opacity: 1 !important;
        visibility: visible !important;
    }
    
    body.layout-menu-hover.layout-menu-collapsed .layout-menu .menu-inner > .menu-header[b-l5l83lbldw]::before {
        display: none !important;
    }
    
    /* Hiển thị menu-sub khi hover */
    body.layout-menu-hover.layout-menu-collapsed .layout-menu .menu-inner > .menu-item.open > .menu-sub[b-l5l83lbldw] {
        display: block !important;
        visibility: visible !important;
        opacity: 1 !important;
    }
    
    /* Đảm bảo padding và margin đúng cho menu-item */
    body.layout-menu-hover.layout-menu-collapsed .layout-menu .menu-inner > .menu-item[b-l5l83lbldw] {
        width: 100% !important;
    }
    
    body.layout-menu-hover.layout-menu-collapsed .layout-menu .menu-inner > .menu-item > .menu-link[b-l5l83lbldw] {
        padding-left: 1.25rem !important;
        padding-right: 1.25rem !important;
    }
}

/* Overlay khi menu được mở rộng trên màn hình nhỏ */
.layout-overlay[b-l5l83lbldw] {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: #000;
    opacity: 0;
    display: none;
    z-index: 9998;
    transition: opacity 0.3s ease-in-out;
    cursor: pointer;
}

/* Định dạng cho menu-header */
.menu-header[b-l5l83lbldw] {
    opacity: 1;
    transition: opacity 0.3s ease-in-out;
}

.menu-header-text[b-l5l83lbldw] {
    text-transform: uppercase;
    letter-spacing: 0.4px;
    white-space: nowrap;
    color: #a1acb8;
}

.menu-header.small[b-l5l83lbldw] {
    padding: 0.625rem 1.25rem 0.375rem;
}

/* Định dạng cho menu-toggle-icon */
.menu-toggle-icon[b-l5l83lbldw] {
    display: inline-block;
    width: 1.25rem;
    height: 1.25rem;
    position: relative;
    border-radius: 50%;
    vertical-align: middle;
    border: 2px solid currentColor;
    transition: all 0.2s ease-in-out;
}

.menu-toggle-icon[b-l5l83lbldw]::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 0.375rem;
    height: 0.375rem;
    border-radius: 50%;
    background-color: currentColor;
    transition: all 0.2s ease-in-out;
}

/* Ẩn chấm ở giữa khi menu bị thu gọn */
.layout-menu-collapsed .menu-toggle-icon[b-l5l83lbldw]::after {
    display: none;
}

/* Hiển thị lại chấm khi hover */
.layout-menu-hover.layout-menu-collapsed .menu-toggle-icon[b-l5l83lbldw]::after {
    display: block;
}

/* Đảm bảo nút toggle hiển thị đúng trong AppBrand */
.layout-menu-toggle[b-l5l83lbldw] {
    display: block;
}

/* Đảm bảo nút toggle hiển thị đúng khi menu bị thu gọn */
.layout-menu-collapsed .layout-menu .app-brand .layout-menu-toggle[b-l5l83lbldw] {
    display: none !important;
}

/* Hiển thị lại nút toggle khi hover vào menu thu gọn */
.layout-menu-hover.layout-menu-collapsed .layout-menu .app-brand .layout-menu-toggle[b-l5l83lbldw] {
    display: flex !important;
    position: absolute;
    right: 0.5rem;
    top: 50%;
    transform: translateY(-50%);
    z-index: 10;
}

/* Đảm bảo icon toggle hiển thị đúng */
.layout-menu-expanded .menu-toggle-icon[b-l5l83lbldw]::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 0.375rem;
    height: 0.375rem;
    border-radius: 50%;
    background-color: currentColor;
    display: block;
}
/* _content/AspnetBlazor/UIComponents/Callout/Callout.razor.rz.scp.css */
.callout[b-q6gxhc003p] {
    padding: 1.25rem;
    margin-top: 1.25rem;
    margin-bottom: 1.25rem;
    border: 1px solid #e9ecef;
    border-left-width: 0.25rem;
    border-radius: 0.25rem;
}

.callout h5[b-q6gxhc003p] {
    margin-top: 0;
    margin-bottom: 0.5rem;
}

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

.callout-primary[b-q6gxhc003p] {
    border-left-color: #696cff;
}

.callout-primary h5[b-q6gxhc003p] {
    color: #696cff;
}

.callout-secondary[b-q6gxhc003p] {
    border-left-color: #8592a3;
}

.callout-secondary h5[b-q6gxhc003p] {
    color: #8592a3;
}

.callout-success[b-q6gxhc003p] {
    border-left-color: #71dd37;
}

.callout-success h5[b-q6gxhc003p] {
    color: #71dd37;
}

.callout-danger[b-q6gxhc003p] {
    border-left-color: #ff3e1d;
}

.callout-danger h5[b-q6gxhc003p] {
    color: #ff3e1d;
}

.callout-warning[b-q6gxhc003p] {
    border-left-color: #ffab00;
}

.callout-warning h5[b-q6gxhc003p] {
    color: #ffab00;
}

.callout-info[b-q6gxhc003p] {
    border-left-color: #03c3ec;
}

.callout-info h5[b-q6gxhc003p] {
    color: #03c3ec;
}

.callout-light[b-q6gxhc003p] {
    border-left-color: #fcfdfd;
}

.callout-light h5[b-q6gxhc003p] {
    color: #697a8d;
}

.callout-dark[b-q6gxhc003p] {
    border-left-color: #233446;
}

.callout-dark h5[b-q6gxhc003p] {
    color: #233446;
}
/* _content/AspnetBlazor/UIComponents/Card/Card.razor.rz.scp.css */
/* Card Component CSS */

/* Card với bg- classes - Tương thích với dark/light mode */

/* Điều chỉnh text color cho card với bg- classes */
.card.bg-primary[b-uh1cir0njk],
.card.bg-secondary[b-uh1cir0njk],
.card.bg-success[b-uh1cir0njk],
.card.bg-danger[b-uh1cir0njk],
.card.bg-info[b-uh1cir0njk],
.card.bg-dark[b-uh1cir0njk] {
    color: #fff !important;
}

.card.bg-warning[b-uh1cir0njk] {
    color: #000 !important;
}

.card.bg-light[b-uh1cir0njk] {
    color: #495057 !important;
}

/* Dark mode adjustments */
.dark-style .card.bg-primary[b-uh1cir0njk],
.dark-style .card.bg-secondary[b-uh1cir0njk],
.dark-style .card.bg-success[b-uh1cir0njk],
.dark-style .card.bg-danger[b-uh1cir0njk],
.dark-style .card.bg-warning[b-uh1cir0njk],
.dark-style .card.bg-info[b-uh1cir0njk],
.dark-style .card.bg-dark[b-uh1cir0njk] {
    color: #fff !important;
}

.dark-style .card.bg-light[b-uh1cir0njk] {
    color: #b6bee3 !important;
}

/* Điều chỉnh opacity cho bg- classes trong card */
.card.bg-primary[b-uh1cir0njk] {
    background-color: rgba(var(--bs-primary-rgb), 0.9) !important;
}

.card.bg-secondary[b-uh1cir0njk] {
    background-color: rgba(var(--bs-secondary-rgb), 0.9) !important;
}

.card.bg-success[b-uh1cir0njk] {
    background-color: rgba(var(--bs-success-rgb), 0.9) !important;
}

.card.bg-danger[b-uh1cir0njk] {
    background-color: rgba(var(--bs-danger-rgb), 0.9) !important;
}

.card.bg-warning[b-uh1cir0njk] {
    background-color: rgba(var(--bs-warning-rgb), 0.9) !important;
}

.card.bg-info[b-uh1cir0njk] {
    background-color: rgba(var(--bs-info-rgb), 0.9) !important;
}

.card.bg-light[b-uh1cir0njk] {
    background-color: rgba(var(--bs-light-rgb), 0.9) !important;
}

.card.bg-dark[b-uh1cir0njk] {
    background-color: rgba(var(--bs-dark-rgb), 0.9) !important;
}

/* Card enhancements */
.card[b-uh1cir0njk] {
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
    transition: all 0.3s ease;
    border-radius: 0.25rem;
}

.card:hover[b-uh1cir0njk] {
    box-shadow: 0 6px 12px rgba(0, 0, 0, 0.15);
}

/* Card variants for different use cases */
.stat-card .card[b-uh1cir0njk] {
    border: none;
    box-shadow: 0 2px 6px 0 rgba(67, 89, 113, 0.12);
}

.stat-card .card:hover[b-uh1cir0njk] {
    transform: translateY(-5px);
    box-shadow: 0 8px 15px rgba(0, 0, 0, 0.1) !important;
}

.user-card .card[b-uh1cir0njk] {
    transition: all 0.3s ease;
}

.user-card .card:hover[b-uh1cir0njk] {
    transform: translateY(-5px);
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
}

.role-card .card[b-uh1cir0njk] {
    transition: all 0.3s ease;
}

.role-card .card:hover[b-uh1cir0njk] {
    transform: translateY(-5px);
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
}

/* Avatar styles */
.avatar[b-uh1cir0njk] {
    position: relative;
    width: 40px;
    height: 40px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.avatar-sm[b-uh1cir0njk] {
    width: 32px;
    height: 32px;
}

.avatar-lg[b-uh1cir0njk] {
    width: 48px;
    height: 48px;
}

.avatar-initial[b-uh1cir0njk] {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 0.375rem;
    font-weight: 500;
}

.avatar-initial.rounded-circle[b-uh1cir0njk] {
    border-radius: 50% !important;
}

/* Background label colors for avatars and badges */
.bg-label-primary[b-uh1cir0njk] {
    background-color: rgba(105, 108, 255, 0.16) !important;
    color: #696cff !important;
}

.bg-label-success[b-uh1cir0njk] {
    background-color: rgba(40, 167, 69, 0.16) !important;
    color: #28a745 !important;
}

.bg-label-danger[b-uh1cir0njk] {
    background-color: rgba(220, 53, 69, 0.16) !important;
    color: #dc3545 !important;
}

.bg-label-warning[b-uh1cir0njk] {
    background-color: rgba(255, 171, 0, 0.16) !important;
    color: #ffab00 !important;
}

.bg-label-info[b-uh1cir0njk] {
    background-color: rgba(23, 162, 184, 0.16) !important;
    color: #17a2b8 !important;
}

.bg-label-secondary[b-uh1cir0njk] {
    background-color: rgba(108, 117, 125, 0.16) !important;
    color: #6c757d !important;
}

/* Dark mode adjustments for bg-label colors */
.dark-style .bg-label-primary[b-uh1cir0njk] {
    background-color: rgba(105, 108, 255, 0.2) !important;
    color: #8b8fff !important;
}

.dark-style .bg-label-success[b-uh1cir0njk] {
    background-color: rgba(40, 167, 69, 0.2) !important;
    color: #5cb85c !important;
}

.dark-style .bg-label-danger[b-uh1cir0njk] {
    background-color: rgba(220, 53, 69, 0.2) !important;
    color: #e74c3c !important;
}

.dark-style .bg-label-warning[b-uh1cir0njk] {
    background-color: rgba(255, 171, 0, 0.2) !important;
    color: #ffc107 !important;
}

.dark-style .bg-label-info[b-uh1cir0njk] {
    background-color: rgba(23, 162, 184, 0.2) !important;
    color: #3498db !important;
}

.dark-style .bg-label-secondary[b-uh1cir0njk] {
    background-color: rgba(108, 117, 125, 0.2) !important;
    color: #95a5a6 !important;
}

/* Badge status styles */
.badge-status[b-uh1cir0njk] {
    font-weight: 500;
    padding: 0.35em 0.65em;
    border-radius: 0.25rem;
    letter-spacing: 0.5px;
    font-size: 0.75em;
    text-transform: uppercase;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

/* Responsive card heights */
@media (min-width: 992px) {
    .stat-card .card[b-uh1cir0njk] {
        min-height: 135px;
    }
}
/* _content/AspnetBlazor/UIComponents/Charts/Chart.razor.rz.scp.css */
/* Chart styles with maximum specificity to prevent conflicts */
.chart-container[b-fiuhxghg5j] {
    position: relative;
    margin: auto;
    width: 100%;
    height: 300px; /* Default height */
}

/* Make sure the canvas doesn't grow beyond its container */
.chart-container canvas[b-fiuhxghg5j] {
    max-width: 100%;
    max-height: 100%;
}

/* Ensure chart doesn't expand beyond its defined height but allow tooltips to be visible */
.card-body .chart-container[b-fiuhxghg5j] {
    overflow: visible; /* Changed from hidden to visible to allow tooltips */
}

/* ===== THEME VARIABLES (for reference only, Chart.js uses JavaScript options) ===== */
/* These CSS variables are NOT used by Chart.js, they're here for documentation */
html:not([data-bs-theme="dark"]):not(.dark-style):not([data-theme="theme-dark"]) .chart-container[b-fiuhxghg5j] {
    --chart-text-color: #1a1a1a;
    --chart-grid-color: rgba(0, 0, 0, 0.15);
}

html[data-bs-theme="dark"] .chart-container[b-fiuhxghg5j],
html.dark-style .chart-container[b-fiuhxghg5j],
html[data-theme="theme-dark"] .chart-container[b-fiuhxghg5j] {
    --chart-text-color: #e0e0e0;
    --chart-grid-color: rgba(255, 255, 255, 0.1);
}

/* ===== CANVAS SPECIFIC RULES ===== */
/* Light mode canvas */
html:not([data-bs-theme="dark"]):not(.dark-style):not([data-theme="theme-dark"]) .chart-container canvas[b-fiuhxghg5j] {
    color-scheme: light !important;
    background-color: transparent !important;
    filter: none !important;
}

/* Dark mode canvas */
html[data-bs-theme="dark"] .chart-container canvas[b-fiuhxghg5j],
html.dark-style .chart-container canvas[b-fiuhxghg5j],
html[data-theme="theme-dark"] .chart-container canvas[b-fiuhxghg5j] {
    color-scheme: dark !important;
    background-color: transparent !important;
    filter: none !important;
}

/* ===== TOOLTIP STYLES ===== */
/* Light mode tooltips */
html:not([data-bs-theme="dark"]):not(.dark-style):not([data-theme="theme-dark"]) .chart-chartjs-tooltip[b-fiuhxghg5j] {
    background-color: var(--bs-gray-100, #f8f9fa) !important;
    border: 1px solid var(--bs-gray-300, #dee2e6) !important;
    color: #1a1a1a !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15) !important;
}

/* Dark mode tooltips */
html[data-bs-theme="dark"] .chart-chartjs-tooltip[b-fiuhxghg5j],
html.dark-style .chart-chartjs-tooltip[b-fiuhxghg5j], 
html[data-theme="theme-dark"] .chart-chartjs-tooltip[b-fiuhxghg5j] {
    background-color: var(--bs-gray-900, #212529) !important;
    border: 1px solid var(--bs-gray-700, #495057) !important;
    color: #ffffff !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3) !important;
}

/* ===== ANTI-OVERRIDE PROTECTION ===== */
/* Prevent any global styles from overriding chart text colors */
.chart-container[b-fiuhxghg5j] {
    isolation: isolate !important;
}

/* IMPORTANT: Do NOT override color for canvas or chart text elements
   Chart.js controls text color via JavaScript options, CSS should not interfere */
/* _content/AspnetBlazor/UIComponents/ConfirmDialog/ConfirmDialog.razor.rz.scp.css */
/* Confirm Dialog styles */
.confirm-dialog-content[b-47orn901ap] {
    text-align: center;
    padding: 1rem 0;
}

.confirm-dialog-content p[b-47orn901ap] {
    margin-bottom: 0;
    font-size: 1rem;
    line-height: 1.5;
    color: var(--bs-body-color);
}

.confirm-dialog-content .icon[b-47orn901ap] {
    font-size: 3rem;
    margin-bottom: 1rem;
    display: block;
}

.confirm-dialog-content .icon.warning[b-47orn901ap] {
    color: var(--bs-warning);
}

.confirm-dialog-content .icon.danger[b-47orn901ap] {
    color: var(--bs-danger);
}

.confirm-dialog-content .icon.info[b-47orn901ap] {
    color: var(--bs-info);
}

.confirm-dialog-content .icon.success[b-47orn901ap] {
    color: var(--bs-success);
}

/* Confirm Dialog với icon */
.confirm-dialog-with-icon .modal-body[b-47orn901ap] {
    text-align: center;
    padding: 2rem 1.5rem;
}

.confirm-dialog-with-icon .confirm-dialog-content[b-47orn901ap] {
    padding: 0;
}

/* Responsive */
@media (max-width: 576px) {
    .confirm-dialog-content[b-47orn901ap] {
        padding: 0.5rem 0;
    }
    
    .confirm-dialog-content .icon[b-47orn901ap] {
        font-size: 2.5rem;
        margin-bottom: 0.75rem;
    }
}
/* _content/AspnetBlazor/UIComponents/Form/AutoComplete.razor.rz.scp.css */
/* AutoComplete Component */
.autocomplete[b-dtqekzq93z] {
    position: relative;
    width: 100%;
}

/* Input wrapper */
.autocomplete .input-wrapper[b-dtqekzq93z] {
    position: relative;
    display: flex;
    align-items: center;
}

/* Input styling */
.autocomplete .form-control[b-dtqekzq93z] {
    padding-right: 2.5rem; /* Space for clear button */
    transition: all 0.15s ease-in-out;
    border: 1px solid var(--bs-border-color, #d4d8dd);
    background-color: var(--bs-body-bg, #fff);
    color: var(--bs-body-color, #212529);
}

.autocomplete .form-control:focus[b-dtqekzq93z] {
    border-color: var(--bs-primary, #696cff);
    box-shadow: 0 0 0 0.2rem rgba(var(--bs-primary-rgb, 105, 108, 255), 0.25);
    background-color: var(--bs-body-bg, #fff);
}

.autocomplete .form-control:disabled[b-dtqekzq93z] {
    background-color: var(--bs-secondary-bg, #f8f9fa);
    opacity: 0.65;
}

/* Clear button */
.autocomplete .clear-button[b-dtqekzq93z] {
    position: absolute;
    right: 8px;
    top: 50%;
    transform: translateY(-50%);
    background: none;
    border: none;
    color: #6c757d;
    cursor: pointer;
    padding: 4px;
    width: 24px;
    height: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 10;
    border-radius: 50%;
    transition: all 0.15s ease-in-out;
}

.autocomplete .clear-button:hover[b-dtqekzq93z] {
    color: #495057;
    background-color: rgba(0, 0, 0, 0.05);
}

.autocomplete .clear-button:focus[b-dtqekzq93z] {
    outline: none;
    box-shadow: 0 0 0 2px rgba(105, 108, 255, 0.25);
}

/* Dropdown menu */
.autocomplete .dropdown-menu[b-dtqekzq93z] {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    width: 100%;
    max-height: 300px;
    overflow-y: auto;
    z-index: 1050;
    margin-top: 0.125rem;
    border: 1px solid var(--bs-border-color, #d4d8dd);
    border-radius: var(--bs-border-radius, 0.375rem);
    background-color: var(--bs-dropdown-bg, #fff);
    box-shadow: var(--bs-box-shadow-lg, 0 0.5rem 1rem rgba(0, 0, 0, 0.15));
    padding: 0.25rem 0;
}

/* Dropdown items - Simple like RadzenDropdown */
.autocomplete .dropdown-item[b-dtqekzq93z] {
    display: block;
    width: 100%;
    padding: 0.5rem 0.75rem;
    clear: both;
    font-weight: 400;
    color: #6f6b7d;
    text-align: left;
    text-decoration: none;
    white-space: nowrap;
    background-color: transparent;
    border: 0;
    cursor: pointer;
    transition: background-color 0.15s ease, color 0.15s ease;
    font-size: 0.875rem;
    line-height: 1.5;
    border-bottom: none;
}

.autocomplete .dropdown-item:hover[b-dtqekzq93z] {
    background-color: #f8f7fa;
    color: #5d596c;
}

.autocomplete .dropdown-item.active[b-dtqekzq93z] {
    background-color: #f8f7fa;
    color: #5d596c;
}

.autocomplete .dropdown-item:focus[b-dtqekzq93z] {
    background-color: #f8f7fa;
    color: #5d596c;
    outline: none;
}

/* Loading and empty states */
.autocomplete .dropdown-item.loading[b-dtqekzq93z],
.autocomplete .dropdown-item.empty[b-dtqekzq93z] {
    color: #6c757d;
    font-style: italic;
    cursor: default;
    pointer-events: none;
}

.autocomplete .dropdown-item.loading:hover[b-dtqekzq93z],
.autocomplete .dropdown-item.empty:hover[b-dtqekzq93z] {
    color: #6c757d;
    background-color: transparent;
}

/* Dark mode support */
.dark-style .autocomplete .dropdown-menu[b-dtqekzq93z],
html.dark-style .autocomplete .dropdown-menu[b-dtqekzq93z],
body.dark-style .autocomplete .dropdown-menu[b-dtqekzq93z],
[data-theme="theme-dark"] .autocomplete .dropdown-menu[b-dtqekzq93z] {
    background-color: #2f3349;
    border: 1px solid #434968;
    box-shadow: 0 0.25rem 1rem rgba(20, 21, 33, 0.6);
}

.dark-style .autocomplete .dropdown-item[b-dtqekzq93z],
html.dark-style .autocomplete .dropdown-item[b-dtqekzq93z],
body.dark-style .autocomplete .dropdown-item[b-dtqekzq93z],
[data-theme="theme-dark"] .autocomplete .dropdown-item[b-dtqekzq93z] {
    background-color: transparent;
    color: #b6bee3;
}

.dark-style .autocomplete .dropdown-item:hover[b-dtqekzq93z],
html.dark-style .autocomplete .dropdown-item:hover[b-dtqekzq93z],
body.dark-style .autocomplete .dropdown-item:hover[b-dtqekzq93z],
[data-theme="theme-dark"] .autocomplete .dropdown-item:hover[b-dtqekzq93z] {
    background-color: #343852;
    color: #d5dae7;
}

.dark-style .autocomplete .dropdown-item.active[b-dtqekzq93z],
html.dark-style .autocomplete .dropdown-item.active[b-dtqekzq93z],
body.dark-style .autocomplete .dropdown-item.active[b-dtqekzq93z],
[data-theme="theme-dark"] .autocomplete .dropdown-item.active[b-dtqekzq93z] {
    background-color: #343852;
    color: #d5dae7;
}

.dark-style .autocomplete .dropdown-item.loading[b-dtqekzq93z],
.dark-style .autocomplete .dropdown-item.empty[b-dtqekzq93z],
html.dark-style .autocomplete .dropdown-item.loading[b-dtqekzq93z],
html.dark-style .autocomplete .dropdown-item.empty[b-dtqekzq93z],
body.dark-style .autocomplete .dropdown-item.loading[b-dtqekzq93z],
body.dark-style .autocomplete .dropdown-item.empty[b-dtqekzq93z],
[data-theme="theme-dark"] .autocomplete .dropdown-item.loading[b-dtqekzq93z],
[data-theme="theme-dark"] .autocomplete .dropdown-item.empty[b-dtqekzq93z] {
    color: #8b8fa3;
}

.dark-style .autocomplete .dropdown-item.loading:hover[b-dtqekzq93z],
.dark-style .autocomplete .dropdown-item.empty:hover[b-dtqekzq93z],
html.dark-style .autocomplete .dropdown-item.loading:hover[b-dtqekzq93z],
html.dark-style .autocomplete .dropdown-item.empty:hover[b-dtqekzq93z],
body.dark-style .autocomplete .dropdown-item.loading:hover[b-dtqekzq93z],
body.dark-style .autocomplete .dropdown-item.empty:hover[b-dtqekzq93z],
[data-theme="theme-dark"] .autocomplete .dropdown-item.loading:hover[b-dtqekzq93z],
[data-theme="theme-dark"] .autocomplete .dropdown-item.empty:hover[b-dtqekzq93z] {
    background-color: transparent;
    color: #8b8fa3;
}

/* Scrollbar styling for dropdown */
.autocomplete .dropdown-menu[b-dtqekzq93z]::-webkit-scrollbar {
    width: 6px;
}

.autocomplete .dropdown-menu[b-dtqekzq93z]::-webkit-scrollbar-track {
    background: #f1f1f1;
    border-radius: 3px;
}

.autocomplete .dropdown-menu[b-dtqekzq93z]::-webkit-scrollbar-thumb {
    background: #c1c1c1;
    border-radius: 3px;
}

.autocomplete .dropdown-menu[b-dtqekzq93z]::-webkit-scrollbar-thumb:hover {
    background: #a8a8a8;
}

/* Responsive adjustments */
@media (max-width: 576px) {
    .autocomplete .dropdown-menu[b-dtqekzq93z] {
        max-height: 200px;
    }
    
    .autocomplete .dropdown-item[b-dtqekzq93z] {
        padding: 0.75rem 1rem;
        font-size: 0.9rem;
    }
}

/* Simple show animation - no complex transforms */
.autocomplete .dropdown-menu.show[b-dtqekzq93z] {
    opacity: 1;
}

/* Ensure no conflicting styles */
.autocomplete .dropdown-item *[b-dtqekzq93z] {
    color: inherit;
    pointer-events: none;
}

.autocomplete .dropdown-item i[b-dtqekzq93z] {
    pointer-events: none;
}

/* Remove any Bootstrap conflicting styles */
.autocomplete .dropdown-item:not(.loading):not(.empty):hover[b-dtqekzq93z] {
    text-decoration: none !important;
    box-shadow: none !important;
    border: none !important;
}

.autocomplete .dropdown-item:not(.loading):not(.empty):focus[b-dtqekzq93z] {
    text-decoration: none !important;
    box-shadow: none !important;
    border: none !important;
}

.autocomplete .dropdown-item:not(.loading):not(.empty):active[b-dtqekzq93z] {
    text-decoration: none !important;
    box-shadow: none !important;
    border: none !important;
}

/* Override any global dropdown styles */
.autocomplete .dropdown-item:not(.loading):not(.empty)[b-dtqekzq93z] {
    border-radius: 0 !important;
    margin: 0 !important;
    box-shadow: none !important;
}

/* Ensure smooth transitions only */
.autocomplete .dropdown-item:not(.loading):not(.empty)[b-dtqekzq93z] {
    transition: background-color 0.15s ease !important;
}
/* _content/AspnetBlazor/UIComponents/Form/CurrencyInput.razor.rz.scp.css */
/* CurrencyInput */
.currency-input:focus[b-pf9xvaieih] {
    box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.25);
    border-color: #86b7fe;
}

/* Money Input Integration */
.currency-input.money-input[b-pf9xvaieih] {
    text-align: right;
    font-family: 'Courier New', monospace;
    font-weight: 500;
}

.currency-input.money-input:focus[b-pf9xvaieih] {
    box-shadow: 0 0 0 0.2rem rgba(13, 110, 253, 0.25);
}

.currency-input.money-input.is-invalid[b-pf9xvaieih] {
    border-color: #dc3545;
    box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.25);
}

.currency-input.money-input.is-valid[b-pf9xvaieih] {
    border-color: #198754;
    box-shadow: 0 0 0 0.2rem rgba(25, 135, 84, 0.25);
}
/* _content/AspnetBlazor/UIComponents/Form/PasswordInput.razor.rz.scp.css */
/* PasswordInput */
.password-input-container[b-wqfcqg7e8j] {
    position: relative;
}

.password-toggle-btn[b-wqfcqg7e8j] {
    position: absolute;
    right: 0;
    top: 0;
    height: 100%;
    background: transparent;
    border: none;
    cursor: pointer;
}
/* _content/AspnetBlazor/UIComponents/Form/TextAreaInput.razor.rz.scp.css */
/* TextAreaInput */
.textarea-input[b-hrr2jqr2ed] {
    min-height: 100px;
    resize: vertical;
}
/* _content/AspnetBlazor/UIComponents/Form/TimeInput.razor.rz.scp.css */
/* TimeInput */
.time-input[b-x0bsl2uirs]::-webkit-calendar-picker-indicator {
    cursor: pointer;
}
/* _content/AspnetBlazor/UIComponents/Grid/Grid.razor.rz.scp.css */
.grid-container[b-mps4jq3u0c] {
    display: flex;
    flex-direction: column;
    border: 1px solid var(--bs-border-color);
    border-radius: 0.375rem;
    overflow: hidden;
}

.grid-header[b-mps4jq3u0c] {
    display: flex;
    flex-direction: column;
}

.grid-toolbar[b-mps4jq3u0c] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.75rem 1rem;
    background-color: var(--bs-body-bg);
    border-bottom: 1px solid var(--bs-border-color);
}

.grid-toolbar-title[b-mps4jq3u0c] {
    font-size: 1.1rem;
    font-weight: 500;
}

.grid-toolbar-actions[b-mps4jq3u0c] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.grid-search[b-mps4jq3u0c] {
    width: 250px;
}

.grid-table-container[b-mps4jq3u0c] {
    overflow-x: auto;
}

.grid-table-container table[b-mps4jq3u0c] {
    margin-bottom: 0;
}

.grid-column-header[b-mps4jq3u0c] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    cursor: pointer;
}

.grid-sortable[b-mps4jq3u0c] {
    cursor: pointer;
}

.grid-sort-icon[b-mps4jq3u0c], .grid-filter-icon[b-mps4jq3u0c] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.grid-sort-icon i[b-mps4jq3u0c], .grid-filter-icon i[b-mps4jq3u0c] {
    font-size: 0.875rem;
}

.grid-loading[b-mps4jq3u0c], .grid-empty[b-mps4jq3u0c] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 2rem 0;
}

.grid-loading-text[b-mps4jq3u0c], .grid-empty-text[b-mps4jq3u0c] {
    margin-top: 0.75rem;
    color: var(--bs-secondary-color);
}

.grid-empty-icon[b-mps4jq3u0c] {
    font-size: 2rem;
    color: var(--bs-secondary-color);
}

.grid-footer[b-mps4jq3u0c] {
    padding: 0.75rem 1rem;
    background-color: var(--bs-body-bg);
    border-top: 1px solid var(--bs-border-color);
}

.grid-pagination[b-mps4jq3u0c] {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

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

.grid-page-size select[b-mps4jq3u0c] {
    width: 70px;
}

.grid-page-size-label[b-mps4jq3u0c] {
    color: var(--bs-secondary-color);
    font-size: 0.875rem;
}

.grid-page-info[b-mps4jq3u0c] {
    color: var(--bs-secondary-color);
    font-size: 0.875rem;
}

.grid-page-navigation[b-mps4jq3u0c] {
    display: flex;
    gap: 0.25rem;
}

/* Responsive adjustments */
@media (max-width: 768px) {
    .grid-pagination[b-mps4jq3u0c] {
        flex-direction: column;
        gap: 0.75rem;
        align-items: flex-start;
    }
    
    .grid-page-navigation[b-mps4jq3u0c] {
        width: 100%;
        justify-content: center;
    }
}
/* _content/AspnetBlazor/UIComponents/Image/Image.razor.rz.scp.css */
/* Image component styles */
.img-fluid[b-8xdj33cxn8] {
    max-width: 100%;
    height: auto;
}

.img-thumbnail[b-8xdj33cxn8] {
    padding: 0.25rem;
    background-color: var(--bs-body-bg);
    border: 1px solid var(--bs-border-color);
    border-radius: 0.375rem;
    max-width: 100%;
    height: auto;
}

.rounded[b-8xdj33cxn8] {
    border-radius: 0.375rem !important;
}

.rounded-circle[b-8xdj33cxn8] {
    border-radius: 50% !important;
}

/* Image hover effect */
.img-hover-zoom[b-8xdj33cxn8] {
    overflow: hidden;
}

.img-hover-zoom img[b-8xdj33cxn8] {
    transition: transform 0.5s ease;
}

.img-hover-zoom:hover img[b-8xdj33cxn8] {
    transform: scale(1.05);
}

/* Image with overlay */
.img-overlay-container[b-8xdj33cxn8] {
    position: relative;
    display: inline-block;
}

.img-overlay[b-8xdj33cxn8] {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5);
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    transition: opacity 0.3s ease;
}

.img-overlay-container:hover .img-overlay[b-8xdj33cxn8] {
    opacity: 1;
}
/* _content/AspnetBlazor/UIComponents/Modal/Modal.razor.rz.scp.css */
/* Modal styles */
.modal[b-ocrlqeiaae] {
    --bs-modal-zindex: 1150;
    --bs-modal-width: 500px;
    --bs-modal-padding: 1rem;
    --bs-modal-margin: 0.5rem;
    --bs-modal-color: ;
    --bs-modal-bg: #fff;
    --bs-modal-border-color: rgba(0, 0, 0, 0.175);
    --bs-modal-border-width: 1px;
    --bs-modal-border-radius: 0.5rem;
    --bs-modal-box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075);
    --bs-modal-inner-border-radius: calc(0.5rem - 1px);
    --bs-modal-header-padding-x: 1rem;
    --bs-modal-header-padding-y: 1rem;
    --bs-modal-header-margin-y: calc(-0.5 * 1rem);
    --bs-modal-header-border-color: #dee2e6;
    --bs-modal-header-border-width: 1px;
    --bs-modal-title-line-height: 1.5;
    --bs-modal-footer-gap: 0.5rem;
    --bs-modal-footer-bg: ;
    --bs-modal-footer-border-color: #dee2e6;
    --bs-modal-footer-border-width: 1px;
    position: fixed;
    top: 0;
    left: 0;
    z-index: var(--bs-modal-zindex) !important;
    display: none;
    width: 100%;
    height: 100%;
    overflow-x: hidden;
    overflow-y: auto;
    outline: 0;
}

/* Style for body when modal is open */
body.modal-open[b-ocrlqeiaae] {
    overflow: hidden;
    padding-right: 0; /* Will be set dynamically by JS */
}

.modal.fade[b-ocrlqeiaae] {
    opacity: 0;
    transition: opacity 0.3s ease-out;
}

.modal.show[b-ocrlqeiaae] {
    opacity: 1;
    display: block !important;
}

.modal.fade .modal-dialog[b-ocrlqeiaae] {
    transition: transform 0.3s ease-out;
    transform: translateY(-50px);
}

.modal.show .modal-dialog[b-ocrlqeiaae] {
    transform: translateY(0);
}

.modal-dialog[b-ocrlqeiaae] {
    position: relative;
    width: auto;
    margin: var(--bs-modal-margin);
    pointer-events: none;
}

.modal-dialog-centered[b-ocrlqeiaae] {
    display: flex;
    align-items: center;
    min-height: calc(100% - var(--bs-modal-margin) * 2);
}

.modal-dialog-scrollable[b-ocrlqeiaae] {
    height: calc(100% - var(--bs-modal-margin) * 2);
}

.modal-dialog-scrollable .modal-content[b-ocrlqeiaae] {
    max-height: 100%;
    overflow: hidden;
}

.modal-dialog-scrollable .modal-body[b-ocrlqeiaae] {
    overflow-y: auto;
}

.modal-content[b-ocrlqeiaae] {
    position: relative;
    display: flex;
    flex-direction: column;
    width: 100%;
    color: var(--bs-modal-color);
    pointer-events: auto;
    background-color: var(--bs-modal-bg);
    background-clip: padding-box;
    border: var(--bs-modal-border-width) solid var(--bs-modal-border-color);
    border-radius: var(--bs-modal-border-radius);
    outline: 0;
    box-shadow: var(--bs-modal-box-shadow);
}

.modal-backdrop[b-ocrlqeiaae] {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 1145 !important;
    width: 100vw;
    height: 100vh;
    background-color: rgba(0, 0, 0, 0.5);
    backdrop-filter: blur(2px);
    -webkit-backdrop-filter: blur(2px);
}

.modal-backdrop.fade[b-ocrlqeiaae] {
    opacity: 0;
    transition: opacity 0.3s ease-out;
}

.modal-backdrop.show[b-ocrlqeiaae] {
    opacity: 1;
}

/* Container for modal and backdrop */
.modal-container[b-ocrlqeiaae] {
    position: relative;
}

.modal-header[b-ocrlqeiaae] {
    display: flex;
    flex-shrink: 0;
    align-items: center;
    justify-content: space-between;
    padding: var(--bs-modal-header-padding-y) var(--bs-modal-header-padding-x);
    border-bottom: var(--bs-modal-header-border-width) solid var(--bs-modal-header-border-color);
    border-top-left-radius: var(--bs-modal-inner-border-radius);
    border-top-right-radius: var(--bs-modal-inner-border-radius);
}

.modal-header .btn-close[b-ocrlqeiaae] {
    padding: calc(var(--bs-modal-header-padding-y) * 0.5) calc(var(--bs-modal-header-padding-x) * 0.5);
    margin: calc(-0.5 * var(--bs-modal-header-padding-y)) calc(-0.5 * var(--bs-modal-header-padding-x)) calc(-0.5 * var(--bs-modal-header-padding-y)) auto;
}

.modal-title[b-ocrlqeiaae] {
    margin-bottom: 0;
    line-height: var(--bs-modal-title-line-height);
}

.modal-body[b-ocrlqeiaae] {
    position: relative;
    flex: 1 1 auto;
    padding: var(--bs-modal-padding);
}

.modal-footer[b-ocrlqeiaae] {
    display: flex;
    flex-wrap: wrap;
    flex-shrink: 0;
    align-items: center;
    justify-content: flex-end;
    padding: calc(var(--bs-modal-padding) - var(--bs-modal-footer-gap) * 0.5);
    background-color: var(--bs-modal-footer-bg);
    border-top: var(--bs-modal-footer-border-width) solid var(--bs-modal-footer-border-color);
    border-bottom-right-radius: var(--bs-modal-inner-border-radius);
    border-bottom-left-radius: var(--bs-modal-inner-border-radius);
}

.modal-footer > *[b-ocrlqeiaae] {
    margin: calc(var(--bs-modal-footer-gap) * 0.5);
}

/* Modal Animation Variants */

/* Slide from Top */
.modal.modal-slide-top.fade .modal-dialog[b-ocrlqeiaae] {
    transform: translateY(-100%);
    transition: transform 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.modal.modal-slide-top.show .modal-dialog[b-ocrlqeiaae] {
    transform: translateY(0);
}

/* Slide from Bottom */
.modal.modal-slide-bottom.fade .modal-dialog[b-ocrlqeiaae] {
    transform: translateY(100%);
    transition: transform 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.modal.modal-slide-bottom.show .modal-dialog[b-ocrlqeiaae] {
    transform: translateY(0);
}

/* Slide from Left */
.modal.modal-slide-left.fade .modal-dialog[b-ocrlqeiaae] {
    transform: translateX(-100%);
    transition: transform 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    margin-left: 0;
    margin-right: auto;
}

.modal.modal-slide-left.show .modal-dialog[b-ocrlqeiaae] {
    transform: translateX(0);
}

/* Slide from Right */
.modal.modal-slide-right.fade .modal-dialog[b-ocrlqeiaae] {
    transform: translateX(100%);
    transition: transform 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    margin-left: auto;
    margin-right: 0;
}

.modal.modal-slide-right.show .modal-dialog[b-ocrlqeiaae] {
    transform: translateX(0);
}

/* Zoom In */
.modal.modal-zoom.fade .modal-dialog[b-ocrlqeiaae] {
    transform: scale(0.7);
    transition: transform 0.3s cubic-bezier(0.34, 1.56, 0.64, 1);
}

.modal.modal-zoom.show .modal-dialog[b-ocrlqeiaae] {
    transform: scale(1);
}

/* Flip Horizontal */
.modal.modal-flip-h.fade .modal-dialog[b-ocrlqeiaae] {
    transform: perspective(1300px) rotateY(-70deg);
    transition: transform 0.4s ease-in-out;
}

.modal.modal-flip-h.show .modal-dialog[b-ocrlqeiaae] {
    transform: perspective(1300px) rotateY(0deg);
}

/* Flip Vertical */
.modal.modal-flip-v.fade .modal-dialog[b-ocrlqeiaae] {
    transform: perspective(1300px) rotateX(-70deg);
    transition: transform 0.4s ease-in-out;
}

.modal.modal-flip-v.show .modal-dialog[b-ocrlqeiaae] {
    transform: perspective(1300px) rotateX(0deg);
}

/* Rotate */
.modal.modal-rotate.fade .modal-dialog[b-ocrlqeiaae] {
    transform: scale(0.7) rotate(-180deg);
    transition: transform 0.4s ease-in-out;
}

.modal.modal-rotate.show .modal-dialog[b-ocrlqeiaae] {
    transform: scale(1) rotate(0deg);
}

/* Bounce */
.modal.modal-bounce.fade .modal-dialog[b-ocrlqeiaae] {
    transform: scale(0.3);
    transition: transform 0.5s cubic-bezier(0.68, -0.55, 0.265, 1.55);
}

.modal.modal-bounce.show .modal-dialog[b-ocrlqeiaae] {
    transform: scale(1);
}

/* Fade Scale */
.modal.modal-fade-scale.fade .modal-dialog[b-ocrlqeiaae] {
    transform: scale(1.2);
    transition: transform 0.3s ease-out;
}

.modal.modal-fade-scale.show .modal-dialog[b-ocrlqeiaae] {
    transform: scale(1);
}

/* Newspaper */
.modal.modal-newspaper.fade .modal-dialog[b-ocrlqeiaae] {
    transform: scale(0) rotate(720deg);
    transition: transform 0.5s ease-in-out;
}

.modal.modal-newspaper.show .modal-dialog[b-ocrlqeiaae] {
    transform: scale(1) rotate(0deg);
}

/* Fall */
.modal.modal-fall.fade .modal-dialog[b-ocrlqeiaae] {
    transform: translateZ(600px) rotateX(20deg);
    transition: transform 0.4s ease-in-out;
}

.modal.modal-fall.show .modal-dialog[b-ocrlqeiaae] {
    transform: translateZ(0px) rotateX(0deg);
}

/* Side Fall */
.modal.modal-side-fall.fade .modal-dialog[b-ocrlqeiaae] {
    transform: translate(30%, -30%) rotateZ(15deg);
    transition: transform 0.4s ease-in-out;
}

.modal.modal-side-fall.show .modal-dialog[b-ocrlqeiaae] {
    transform: translate(0%, 0%) rotateZ(0deg);
}

/* Modal sizes */
.modal-sm[b-ocrlqeiaae] {
    --bs-modal-width: 300px;
}

.modal-lg[b-ocrlqeiaae] {
    --bs-modal-width: 800px;
}

.modal-xl[b-ocrlqeiaae] {
    --bs-modal-width: 1140px;
}

.modal-fullscreen[b-ocrlqeiaae] {
    --bs-modal-width: 100vw;
    --bs-modal-margin: 0;
    --bs-modal-border-radius: 0;
    --bs-modal-inner-border-radius: 0;
}

.modal-fullscreen .modal-content[b-ocrlqeiaae] {
    height: 100vh;
    border: 0;
    border-radius: 0;
}

.modal-fullscreen .modal-header[b-ocrlqeiaae],
.modal-fullscreen .modal-footer[b-ocrlqeiaae] {
    border-radius: 0;
}

.modal-fullscreen .modal-body[b-ocrlqeiaae] {
    overflow-y: auto;
}

/* Simple Modal */
.modal-simple[b-ocrlqeiaae] {
    --bs-modal-padding: 1.5rem;
    --bs-modal-header-padding-x: 0;
    --bs-modal-header-padding-y: 0;
}

.modal-simple .modal-content[b-ocrlqeiaae] {
    padding: var(--bs-modal-padding);
    border: none;
    box-shadow: 0 1rem 3rem rgba(0, 0, 0, 0.175);
}

.modal-simple .modal-header[b-ocrlqeiaae] {
    padding: var(--bs-modal-header-padding-y) var(--bs-modal-header-padding-x);
    border: none;
    margin-bottom: 1rem;
}

.modal-simple .modal-body[b-ocrlqeiaae] {
    padding: 0;
}

.modal-simple .modal-footer[b-ocrlqeiaae] {
    padding: 1rem 0 0;
    border: none;
    margin-top: 1rem;
}

.modal-simple .modal-header .btn-close[b-ocrlqeiaae] {
    position: absolute;
    right: var(--bs-modal-padding);
    top: var(--bs-modal-padding);
    z-index: 10;
    padding: 0.5rem;
    margin: 0;
    transition: all 0.2s ease-in-out;
}

.modal-simple .modal-header .btn-close:hover[b-ocrlqeiaae] {
    opacity: 1;
}

/* Modal enhancements */
.modal-content[b-ocrlqeiaae] {
    transition: all 0.3s ease-out;
}

.modal-header .btn-close[b-ocrlqeiaae] {
    transition: opacity 0.2s ease-in-out;
}

.modal-header .btn-close:hover[b-ocrlqeiaae] {
    opacity: 1;
}

.modal-footer .btn[b-ocrlqeiaae] {
    transition: all 0.2s ease-in-out;
}

.modal-footer .btn:hover[b-ocrlqeiaae] {
    transform: translateY(-1px);
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15);
}

/* Dark mode support */
[data-bs-theme="dark"] .modal-content[b-ocrlqeiaae],
.dark-style .modal-content[b-ocrlqeiaae],
[data-theme="theme-dark"] .modal-content[b-ocrlqeiaae] {
    background-color: var(--bs-body-bg, #2b2c40);
    border-color: var(--bs-border-color, #444564);
    color: var(--bs-body-color, #a3a4cc);
}

[data-bs-theme="dark"] .modal-header[b-ocrlqeiaae],
.dark-style .modal-header[b-ocrlqeiaae],
[data-theme="theme-dark"] .modal-header[b-ocrlqeiaae] {
    border-bottom-color: var(--bs-border-color, #444564);
    color: var(--bs-body-color, #a3a4cc);
}

[data-bs-theme="dark"] .modal-footer[b-ocrlqeiaae],
.dark-style .modal-footer[b-ocrlqeiaae],
[data-theme="theme-dark"] .modal-footer[b-ocrlqeiaae] {
    border-top-color: var(--bs-border-color, #444564);
}

[data-bs-theme="dark"] .modal-title[b-ocrlqeiaae],
.dark-style .modal-title[b-ocrlqeiaae],
[data-theme="theme-dark"] .modal-title[b-ocrlqeiaae] {
    color: var(--bs-body-color, #a3a4cc);
}

[data-bs-theme="dark"] .modal-backdrop[b-ocrlqeiaae],
.dark-style .modal-backdrop[b-ocrlqeiaae],
[data-theme="theme-dark"] .modal-backdrop[b-ocrlqeiaae] {
    background-color: rgba(0, 0, 0, 0.8);
    backdrop-filter: blur(3px);
    -webkit-backdrop-filter: blur(3px);
}

[data-bs-theme="dark"] .modal-simple .modal-content[b-ocrlqeiaae],
.dark-style .modal-simple .modal-content[b-ocrlqeiaae],
[data-theme="theme-dark"] .modal-simple .modal-content[b-ocrlqeiaae] {
    background-color: var(--bs-body-bg, #2b2c40);
    color: var(--bs-body-color, #a3a4cc);
}

[data-bs-theme="dark"] .modal .btn-close[b-ocrlqeiaae],
.dark-style .modal .btn-close[b-ocrlqeiaae],
[data-theme="theme-dark"] .modal .btn-close[b-ocrlqeiaae],
[data-bs-theme="dark"] .modal-header .btn-close[b-ocrlqeiaae],
.dark-style .modal-header .btn-close[b-ocrlqeiaae],
[data-theme="theme-dark"] .modal-header .btn-close[b-ocrlqeiaae] {
    filter: invert(1) grayscale(100%) brightness(200%) !important;
    opacity: 0.8;
}

[data-bs-theme="dark"] .modal .btn-close:hover[b-ocrlqeiaae],
.dark-style .modal .btn-close:hover[b-ocrlqeiaae],
[data-theme="theme-dark"] .modal .btn-close:hover[b-ocrlqeiaae],
[data-bs-theme="dark"] .modal-header .btn-close:hover[b-ocrlqeiaae],
.dark-style .modal-header .btn-close:hover[b-ocrlqeiaae],
[data-theme="theme-dark"] .modal-header .btn-close:hover[b-ocrlqeiaae] {
    filter: invert(1) grayscale(100%) brightness(200%) !important;
    opacity: 1;
}

@media (min-width: 576px) {
    .modal[b-ocrlqeiaae] {
        --bs-modal-margin: 1.75rem;
        --bs-modal-box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
    }
    
    .modal-dialog[b-ocrlqeiaae] {
        max-width: var(--bs-modal-width);
        margin: var(--bs-modal-margin) auto;
    }
    
    .modal-dialog-scrollable[b-ocrlqeiaae] {
        height: calc(100% - var(--bs-modal-margin) * 2);
    }
    
    .modal-dialog-centered[b-ocrlqeiaae] {
        min-height: calc(100% - var(--bs-modal-margin) * 2);
    }
    
    .modal-sm[b-ocrlqeiaae] {
        --bs-modal-width: 300px;
    }
}

@media (min-width: 992px) {
    .modal-lg[b-ocrlqeiaae],
    .modal-xl[b-ocrlqeiaae] {
        --bs-modal-width: 800px;
    }
}

@media (min-width: 1200px) {
    .modal-xl[b-ocrlqeiaae] {
        --bs-modal-width: 1140px;
    }
}

/* _content/AspnetBlazor/UIComponents/Notification/NotificationBell.razor.rz.scp.css */
.notification-bell-container[b-l1ibbjwuf5] {
    position: relative;
}

.dropdown-menu[b-l1ibbjwuf5] {
    width: 320px;
    max-width: 100%;
    box-shadow: 0 0.25rem 1rem rgba(161, 172, 184, 0.45);
}

.scrollable-container[b-l1ibbjwuf5] {
    max-height: 350px;
    overflow-y: auto;
}

.dropdown-notifications-read .badge-dot[b-l1ibbjwuf5] {
    width: 0.5rem;
    height: 0.5rem;
}

.dropdown-notifications-archive[b-l1ibbjwuf5] {
    color: #697a8d;
}

.dropdown-notifications-archive:hover[b-l1ibbjwuf5] {
    color: #5d6b7a;
}

/* Đảm bảo dropdown hiển thị đúng khi được mở */
.dropdown-menu.show[b-l1ibbjwuf5] {
    z-index: 1000;
    display: block !important;
}

/* Đảm bảo dropdown luôn được định vị tương đối với container */
.dropdown-menu[b-l1ibbjwuf5] {
    position: absolute;
    top: 100%;
    right: 0;
    left: auto;
    z-index: 1000;
    display: none;
}

/* Tùy chỉnh scrollbar */
.scrollable-container[b-l1ibbjwuf5]::-webkit-scrollbar {
    width: 0.4rem;
    height: 0.4rem;
}

.scrollable-container[b-l1ibbjwuf5]::-webkit-scrollbar-thumb {
    background-color: rgba(67, 89, 113, 0.3);
    border-radius: 0.4rem;
}

.scrollable-container[b-l1ibbjwuf5]::-webkit-scrollbar-track {
    background-color: transparent;
}

/* Hiệu ứng hover cho item */
.dropdown-notifications-item:hover[b-l1ibbjwuf5] {
    background-color: rgba(67, 89, 113, 0.04);
}

/* Đảm bảo badge hiển thị đúng */
.badge-notifications[b-l1ibbjwuf5] {
    position: absolute;
    top: 0;
    right: 0;
    transform: translate(50%, -50%);
}

/* Dark mode styles */
.dark-style .dropdown-menu[b-l1ibbjwuf5],
[data-theme="theme-dark"] .dropdown-menu[b-l1ibbjwuf5] {
    background-color: #2f3349 !important;
    border-color: #404556 !important;
    box-shadow: 0 0.25rem 1rem rgba(0, 0, 0, 0.45) !important;
}

.dark-style .dropdown-menu-header[b-l1ibbjwuf5],
[data-theme="theme-dark"] .dropdown-menu-header[b-l1ibbjwuf5] {
    background-color: #2f3349 !important;
    border-bottom-color: #404556 !important;
}

.dark-style .dropdown-menu-footer[b-l1ibbjwuf5],
[data-theme="theme-dark"] .dropdown-menu-footer[b-l1ibbjwuf5] {
    background-color: #2f3349 !important;
    border-top-color: #404556 !important;
}

.dark-style .dropdown-notifications-item[b-l1ibbjwuf5],
[data-theme="theme-dark"] .dropdown-notifications-item[b-l1ibbjwuf5] {
    background-color: #2f3349 !important;
    border-color: #404556 !important;
    color: #b4b7c1 !important;
}

.dark-style .dropdown-notifications-item:hover[b-l1ibbjwuf5],
[data-theme="theme-dark"] .dropdown-notifications-item:hover[b-l1ibbjwuf5] {
    background-color: #404556 !important;
}

.dark-style .dropdown-notifications-archive[b-l1ibbjwuf5],
[data-theme="theme-dark"] .dropdown-notifications-archive[b-l1ibbjwuf5] {
    color: #b4b7c1 !important;
}

.dark-style .dropdown-notifications-archive:hover[b-l1ibbjwuf5],
[data-theme="theme-dark"] .dropdown-notifications-archive:hover[b-l1ibbjwuf5] {
    color: #d5d6de !important;
}

.dark-style .scrollable-container[b-l1ibbjwuf5]::-webkit-scrollbar-thumb,
[data-theme="theme-dark"] .scrollable-container[b-l1ibbjwuf5]::-webkit-scrollbar-thumb {
    background-color: rgba(255, 255, 255, 0.3);
}

.dark-style .text-body[b-l1ibbjwuf5],
[data-theme="theme-dark"] .text-body[b-l1ibbjwuf5] {
    color: #b4b7c1 !important;
}

.dark-style .text-muted[b-l1ibbjwuf5],
[data-theme="theme-dark"] .text-muted[b-l1ibbjwuf5] {
    color: #8b909a !important;
}

.dark-style .small[b-l1ibbjwuf5],
[data-theme="theme-dark"] .small[b-l1ibbjwuf5] {
    color: #d5d6de !important;
}

/* Đảm bảo text trong notification items được style đúng */
.dark-style .dropdown-notifications-item .small[b-l1ibbjwuf5],
[data-theme="theme-dark"] .dropdown-notifications-item .small[b-l1ibbjwuf5] {
    color: #d5d6de !important;
}

.dark-style .dropdown-notifications-item .text-body[b-l1ibbjwuf5],
[data-theme="theme-dark"] .dropdown-notifications-item .text-body[b-l1ibbjwuf5] {
    color: #b4b7c1 !important;
}

.dark-style .dropdown-notifications-item .text-muted[b-l1ibbjwuf5],
[data-theme="theme-dark"] .dropdown-notifications-item .text-muted[b-l1ibbjwuf5] {
    color: #8b909a !important;
}

.dark-style .dropdown-notifications-item h6[b-l1ibbjwuf5],
[data-theme="theme-dark"] .dropdown-notifications-item h6[b-l1ibbjwuf5] {
    color: #d5d6de !important;
}

.dark-style .dropdown-header h6[b-l1ibbjwuf5],
[data-theme="theme-dark"] .dropdown-header h6[b-l1ibbjwuf5] {
    color: #d5d6de !important;
}

/* Dark mode cho các icon và button */
.dark-style .dropdown-notifications-all[b-l1ibbjwuf5],
[data-theme="theme-dark"] .dropdown-notifications-all[b-l1ibbjwuf5] {
    color: #b4b7c1 !important;
}

.dark-style .dropdown-notifications-all:hover[b-l1ibbjwuf5],
[data-theme="theme-dark"] .dropdown-notifications-all:hover[b-l1ibbjwuf5] {
    color: #d5d6de !important;
    background-color: rgba(255, 255, 255, 0.1) !important;
}

.dark-style .text-heading[b-l1ibbjwuf5],
[data-theme="theme-dark"] .text-heading[b-l1ibbjwuf5] {
    color: #b4b7c1 !important;
}

.dark-style .dropdown-notifications-read[b-l1ibbjwuf5],
[data-theme="theme-dark"] .dropdown-notifications-read[b-l1ibbjwuf5] {
    color: #b4b7c1 !important;
}

.dark-style .dropdown-notifications-read:hover[b-l1ibbjwuf5],
[data-theme="theme-dark"] .dropdown-notifications-read:hover[b-l1ibbjwuf5] {
    color: #d5d6de !important;
}

.dark-style .ti[b-l1ibbjwuf5],
[data-theme="theme-dark"] .ti[b-l1ibbjwuf5] {
    color: #b4b7c1 !important;
}

.dark-style .ti-x[b-l1ibbjwuf5],
[data-theme="theme-dark"] .ti-x[b-l1ibbjwuf5] {
    color: #b4b7c1 !important;
}

.dark-style .ti-x:hover[b-l1ibbjwuf5],
[data-theme="theme-dark"] .ti-x:hover[b-l1ibbjwuf5] {
    color: #d5d6de !important;
}

.dark-style .ti-mail-opened[b-l1ibbjwuf5],
[data-theme="theme-dark"] .ti-mail-opened[b-l1ibbjwuf5] {
    color: #b4b7c1 !important;
}

/* Dark mode cho footer link */
.dark-style .dropdown-item.text-primary[b-l1ibbjwuf5],
[data-theme="theme-dark"] .dropdown-item.text-primary[b-l1ibbjwuf5] {
    color: #7c3aed !important;
}

.dark-style .dropdown-item.text-primary:hover[b-l1ibbjwuf5],
[data-theme="theme-dark"] .dropdown-item.text-primary:hover[b-l1ibbjwuf5] {
    color: #8b5cf6 !important;
    background-color: rgba(124, 58, 237, 0.1) !important;
}
/* _content/AspnetBlazor/UIComponents/Pickers/ColorPicker.razor.rz.scp.css */
/* ColorPicker Component CSS - Color Picker */

/* ===== COLOR PICKER DARK MODE STYLES ===== */
.dark-layout .pickr .pcr-button[b-szooruyffs] {
    box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.2);
}

.dark-layout .pcr-app[b-szooruyffs] {
    box-shadow: 0 4px 24px 0 rgba(0, 0, 0, 0.3);
}

.dark-layout .pcr-app .pcr-interaction input[b-szooruyffs] {
    background: #161d31;
    color: #b4b7bd;
    border-color: #3b4253;
}

.dark-layout .pcr-app .pcr-interaction .pcr-save[b-szooruyffs] {
    background: #28c76f;
}

.dark-layout .pcr-app .pcr-interaction .pcr-cancel[b-szooruyffs] {
    background: #ea5455;
}

.dark-layout .pcr-app .pcr-interaction .pcr-clear[b-szooruyffs] {
    background: #82868b;
}

/* ===== COLOR PICKER LIGHT MODE STYLES ===== */
.light-style .pickr .pcr-button[b-szooruyffs] {
    box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.1);
    border-radius: 0.375rem;
}

.light-style .pcr-app[b-szooruyffs] {
    background: #fff;
    border: 1px solid #d9dee3;
    box-shadow: 0 4px 24px 0 rgba(34, 41, 47, 0.1);
    border-radius: 0.5rem;
}

.light-style .pcr-app .pcr-interaction input[b-szooruyffs] {
    background: #fff;
    color: #5d596c;
    border: 1px solid #d9dee3;
    border-radius: 0.375rem;
}

.light-style .pcr-app .pcr-interaction input:focus[b-szooruyffs] {
    border-color: #7367f0;
    box-shadow: 0 0 0 0.125rem rgba(115, 103, 240, 0.25);
}

.light-style .pcr-app .pcr-interaction .pcr-save[b-szooruyffs] {
    background: #7367f0 !important;
    color: #fff;
    border-radius: 0.375rem;
}

.light-style .pcr-app .pcr-interaction .pcr-save:hover[b-szooruyffs] {
    background: #5a52d5 !important;
}

.light-style .pcr-app .pcr-interaction .pcr-cancel[b-szooruyffs] {
    background: #8a8d93;
    color: #fff;
    border-radius: 0.375rem;
}

.light-style .pcr-app .pcr-interaction .pcr-cancel:hover[b-szooruyffs] {
    background: #757782;
}

.light-style .pcr-app .pcr-interaction .pcr-clear[b-szooruyffs] {
    background: #ff4c51;
    color: #fff;
    border-radius: 0.375rem;
}

.light-style .pcr-app .pcr-interaction .pcr-clear:hover[b-szooruyffs] {
    background: #ff3742;
}

.light-style .pcr-app .pcr-selection .pcr-color-preview[b-szooruyffs] {
    border-radius: 0.375rem;
}

.light-style .pcr-app .pcr-selection .pcr-color-palette[b-szooruyffs] {
    border-radius: 0.375rem;
}

.light-style .pcr-app .pcr-selection .pcr-color-chooser[b-szooruyffs] {
    border-radius: 0.375rem;
}

.light-style .pcr-app .pcr-selection .pcr-color-opacity[b-szooruyffs] {
    border-radius: 0.375rem;
}

/* ===== COLOR PICKER BUTTON STYLES ===== */
/* Style cho color picker button */
.pickr .pcr-button[b-szooruyffs] {
    width: 38px;
    height: 38px;
    border-radius: 0.375rem;
    border: 1px solid;
    cursor: pointer;
    transition: all 0.2s ease;
}

.light-style .pickr .pcr-button[b-szooruyffs] {
    border-color: #d9dee3;
}

.dark-layout .pickr .pcr-button[b-szooruyffs] {
    border-color: #3b4253;
}

.pickr .pcr-button:hover[b-szooruyffs] {
    transform: translateY(-1px);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
}

/* Responsive cho mobile */
@media (max-width: 768px) {
    .pcr-app[b-szooruyffs] {
        width: 280px !important;
    }
    
    .pickr .pcr-button[b-szooruyffs] {
        width: 32px;
        height: 32px;
    }
}



/* TimePicker Dark Mode Styles */
.dark-style .time-picker-dropdown[b-szooruyffs] {
    border-color: #3b4253 !important;
    color: #b4b7bd !important;
    box-shadow: 0 4px 24px 0 rgba(0, 0, 0, 0.3) !important;
}

.dark-style .time-picker-dropdown.show[b-szooruyffs] {
    display: block !important;
}

.dark-style .time-select[b-szooruyffs] {
    border-color: #3b4253 !important;
    color: #b4b7bd !important;
}

.dark-style .time-select:focus[b-szooruyffs] {
    border-color: #7367f0 !important;
    box-shadow: 0 0 0 0.125rem rgba(115, 103, 240, 0.25) !important;
}

.dark-style .time-select:hover[b-szooruyffs] {
    border-color: #7367f0 !important;
    background-color: #161d31 !important;
}

.dark-style .time-label[b-szooruyffs] {
    color: #b4b7bd !important;
}

.dark-style .quick-times[b-szooruyffs] {
    border-top-color: #3b4253 !important;
}

.dark-style .quick-times-label[b-szooruyffs] {
    color: #b4b7bd !important;
}

.dark-style .time-picker-actions[b-szooruyffs] {
    border-top-color: #3b4253 !important;
}

.dark-style .time-picker-toggle[b-szooruyffs] {
    border-color: #3b4253 !important;
    color: #b4b7bd !important;
}

.dark-style .time-picker-toggle:hover[b-szooruyffs] {
    background-color: #161d31 !important;
    border-color: #7367f0 !important;
}

.dark-style .time-picker-toggle:focus[b-szooruyffs] {
    border-color: #7367f0 !important;
    box-shadow: 0 0 0 0.125rem rgba(115, 103, 240, 0.25) !important;
}

.dark-style .time-picker-toggle:focus + .time-picker-input[b-szooruyffs] {
    border-color: #7367f0 !important;
}

.dark-style .quick-time-btn[b-szooruyffs] {
    background-color: transparent !important;
    border-color: #3b4253 !important;
    color: #b4b7bd !important;
}

.dark-style .quick-time-btn:hover[b-szooruyffs] {
    background-color: #161d31 !important;
    border-color: #7367f0 !important;
    color: #7367f0 !important;
}

.dark-style .btn-secondary[b-szooruyffs] {
    background-color: #82868b !important;
    border-color: #82868b !important;
    color: #fff !important;
}

.dark-style .btn-secondary:hover[b-szooruyffs] {
    background-color: #757782 !important;
    border-color: #757782 !important;
    color: #fff !important;
}

.dark-style .btn-primary[b-szooruyffs] {
    background-color: #7367f0 !important;
    border-color: #7367f0 !important;
    color: #fff !important;
}

.dark-style .btn-primary:hover[b-szooruyffs] {
    background-color: #5a52d5 !important;
    border-color: #5a52d5 !important;
    color: #fff !important;
}
/* _content/AspnetBlazor/UIComponents/Pickers/FlatPickr.razor.rz.scp.css */
/* FlatPickr Component CSS - Date/Time Picker */

/* ===== LIGHT MODE STYLES ===== */
.light-style .flatpickr-calendar[b-s8stn1u0ek] {
    background: #fff;
    border: 1px solid #d9dee3;
    box-shadow: 0 4px 24px 0 rgba(34, 41, 47, 0.1);
}

.light-style .flatpickr-day[b-s8stn1u0ek] {
    color: #697a8d;
}

.light-style .flatpickr-day:hover[b-s8stn1u0ek] {
    background: #f5f5f9;
}

.light-style .flatpickr-day.today[b-s8stn1u0ek] {
    border-color: #7367f0;
    color: #7367f0;
    background: #e9e7fd;
}

.light-style .flatpickr-day.selected[b-s8stn1u0ek],
.light-style .flatpickr-day.startRange[b-s8stn1u0ek],
.light-style .flatpickr-day.endRange[b-s8stn1u0ek],
.light-style .flatpickr-day.selected.inRange[b-s8stn1u0ek],
.light-style .flatpickr-day.startRange.inRange[b-s8stn1u0ek],
.light-style .flatpickr-day.endRange.inRange[b-s8stn1u0ek],
.light-style .flatpickr-day.selected:focus[b-s8stn1u0ek],
.light-style .flatpickr-day.startRange:focus[b-s8stn1u0ek],
.light-style .flatpickr-day.endRange:focus[b-s8stn1u0ek],
.light-style .flatpickr-day.selected:hover[b-s8stn1u0ek],
.light-style .flatpickr-day.startRange:hover[b-s8stn1u0ek],
.light-style .flatpickr-day.endRange:hover[b-s8stn1u0ek] {
    background: #7367f0 !important;
    border-color: #7367f0 !important;
    color: #fff !important;
    box-shadow: 0 0.125rem 0.375rem 0 rgba(115, 103, 240, 0.3);
}

.light-style .flatpickr-day.inRange[b-s8stn1u0ek] {
    background: #e9e7fd !important;
    border-color: #e9e7fd !important;
    color: #7367f0 !important;
}

.light-style .flatpickr-months .flatpickr-prev-month[b-s8stn1u0ek],
.light-style .flatpickr-months .flatpickr-next-month[b-s8stn1u0ek] {
    color: #697a8d;
}

.light-style .flatpickr-months .flatpickr-prev-month:hover svg[b-s8stn1u0ek],
.light-style .flatpickr-months .flatpickr-next-month:hover svg[b-s8stn1u0ek] {
    fill: #7367f0;
}

.light-style .flatpickr-months .flatpickr-month[b-s8stn1u0ek] {
    color: #5d596c;
}

.light-style .flatpickr-current-month .flatpickr-monthDropdown-months[b-s8stn1u0ek] {
    background: #fff;
    color: #5d596c;
}

.light-style .flatpickr-current-month .numInputWrapper input.cur-year[b-s8stn1u0ek] {
    color: #5d596c;
}

.light-style .flatpickr-time[b-s8stn1u0ek] {
    background: #fff;
    border-top: 1px solid #d9dee3;
}

.light-style .flatpickr-time .numInputWrapper input[b-s8stn1u0ek],
.light-style .flatpickr-time .flatpickr-am-pm[b-s8stn1u0ek] {
    color: #5d596c;
}

.light-style .flatpickr-weekdays[b-s8stn1u0ek] {
    background: #fff;
}

.light-style span.flatpickr-weekday[b-s8stn1u0ek] {
    color: #8a8d93;
    background: #fff;
}

/* ===== DARK MODE STYLES ===== */
.dark-layout .flatpickr-calendar[b-s8stn1u0ek] {
    background: #283046;
    border-color: #3b4253;
    box-shadow: 0 4px 24px 0 rgba(0, 0, 0, 0.3);
}

.dark-layout .flatpickr-day[b-s8stn1u0ek] {
    color: #b4b7bd;
}

.dark-layout .flatpickr-day:hover[b-s8stn1u0ek] {
    background: #161d31;
}

.dark-layout .flatpickr-day.today[b-s8stn1u0ek] {
    border-color: #7367f0;
}

.dark-layout .flatpickr-day.selected[b-s8stn1u0ek],
.dark-layout .flatpickr-day.startRange[b-s8stn1u0ek],
.dark-layout .flatpickr-day.endRange[b-s8stn1u0ek],
.dark-layout .flatpickr-day.selected.inRange[b-s8stn1u0ek],
.dark-layout .flatpickr-day.startRange.inRange[b-s8stn1u0ek],
.dark-layout .flatpickr-day.endRange.inRange[b-s8stn1u0ek],
.dark-layout .flatpickr-day.selected:focus[b-s8stn1u0ek],
.dark-layout .flatpickr-day.startRange:focus[b-s8stn1u0ek],
.dark-layout .flatpickr-day.endRange:focus[b-s8stn1u0ek],
.dark-layout .flatpickr-day.selected:hover[b-s8stn1u0ek],
.dark-layout .flatpickr-day.startRange:hover[b-s8stn1u0ek],
.dark-layout .flatpickr-day.endRange:hover[b-s8stn1u0ek],
.dark-layout .flatpickr-day.selected.prevMonthDay[b-s8stn1u0ek],
.dark-layout .flatpickr-day.startRange.prevMonthDay[b-s8stn1u0ek],
.dark-layout .flatpickr-day.endRange.prevMonthDay[b-s8stn1u0ek],
.dark-layout .flatpickr-day.selected.nextMonthDay[b-s8stn1u0ek],
.dark-layout .flatpickr-day.startRange.nextMonthDay[b-s8stn1u0ek],
.dark-layout .flatpickr-day.endRange.nextMonthDay[b-s8stn1u0ek] {
    background: #7367f0;
    border-color: #7367f0;
    color: #fff;
}

.dark-layout .flatpickr-day.inRange[b-s8stn1u0ek],
.dark-layout .flatpickr-day.prevMonthDay.inRange[b-s8stn1u0ek],
.dark-layout .flatpickr-day.nextMonthDay.inRange[b-s8stn1u0ek],
.dark-layout .flatpickr-day.today.inRange[b-s8stn1u0ek],
.dark-layout .flatpickr-day.prevMonthDay.today.inRange[b-s8stn1u0ek],
.dark-layout .flatpickr-day.nextMonthDay.today.inRange[b-s8stn1u0ek],
.dark-layout .flatpickr-day:hover[b-s8stn1u0ek],
.dark-layout .flatpickr-day.prevMonthDay:hover[b-s8stn1u0ek],
.dark-layout .flatpickr-day.nextMonthDay:hover[b-s8stn1u0ek],
.dark-layout .flatpickr-day:focus[b-s8stn1u0ek],
.dark-layout .flatpickr-day.prevMonthDay:focus[b-s8stn1u0ek],
.dark-layout .flatpickr-day.nextMonthDay:focus[b-s8stn1u0ek] {
    background: #161d31;
    border-color: #161d31;
}

.dark-layout .flatpickr-months .flatpickr-prev-month[b-s8stn1u0ek],
.dark-layout .flatpickr-months .flatpickr-next-month[b-s8stn1u0ek] {
    color: #b4b7bd;
}

.dark-layout .flatpickr-months .flatpickr-prev-month:hover svg[b-s8stn1u0ek],
.dark-layout .flatpickr-months .flatpickr-next-month:hover svg[b-s8stn1u0ek] {
    fill: #7367f0;
}

.dark-layout .flatpickr-months .flatpickr-month[b-s8stn1u0ek] {
    color: #b4b7bd;
}

.dark-layout .flatpickr-current-month .flatpickr-monthDropdown-months[b-s8stn1u0ek] {
    background: #283046;
    color: #b4b7bd;
}

.dark-layout .flatpickr-current-month .flatpickr-monthDropdown-months .flatpickr-monthDropdown-month[b-s8stn1u0ek] {
    background-color: #283046;
}

.dark-layout .flatpickr-current-month .numInputWrapper input.cur-year[b-s8stn1u0ek] {
    color: #b4b7bd;
}

.dark-layout .flatpickr-time[b-s8stn1u0ek] {
    background: #283046;
    border-top-color: #3b4253;
}

.dark-layout .flatpickr-time .numInputWrapper input[b-s8stn1u0ek],
.dark-layout .flatpickr-time .flatpickr-am-pm[b-s8stn1u0ek] {
    color: #b4b7bd;
}

.dark-layout .flatpickr-time .numInputWrapper:hover[b-s8stn1u0ek],
.dark-layout .flatpickr-time .flatpickr-am-pm:hover[b-s8stn1u0ek] {
    background: #161d31;
}

.dark-layout .flatpickr-weekdays[b-s8stn1u0ek] {
    background: #283046;
}

.dark-layout span.flatpickr-weekday[b-s8stn1u0ek] {
    color: #b4b7bd;
    background: #283046;
}

.dark-layout .flatpickr-day.flatpickr-disabled[b-s8stn1u0ek],
.dark-layout .flatpickr-day.flatpickr-disabled:hover[b-s8stn1u0ek],
.dark-layout .flatpickr-day.prevMonthDay[b-s8stn1u0ek],
.dark-layout .flatpickr-day.nextMonthDay[b-s8stn1u0ek],
.dark-layout .flatpickr-day.notAllowed[b-s8stn1u0ek],
.dark-layout .flatpickr-day.notAllowed.prevMonthDay[b-s8stn1u0ek],
.dark-layout .flatpickr-day.notAllowed.nextMonthDay[b-s8stn1u0ek] {
    color: #4e5154;
}

/* ===== FLATPICKR INPUT STYLES ===== */
/* Đảm bảo input của flatpickr có style nhất quán */
.flatpickr-input[b-s8stn1u0ek] {
    background: transparent !important;
}

.light-style .flatpickr-input[b-s8stn1u0ek] {
    color: #5d596c;
}

.dark-layout .flatpickr-input[b-s8stn1u0ek] {
    color: #b4b7bd;
}

/* Responsive cho mobile */
@media (max-width: 768px) {
    .flatpickr-calendar[b-s8stn1u0ek] {
        font-size: 14px;
    }
}
/* _content/AspnetBlazor/UIComponents/Pickers/TimePicker.razor.rz.scp.css */
/* TimePicker Component Styles */

.time-picker-container[b-0tuvpgf73d] {
    position: relative;
    display: inline-block;
    width: 100%;
}

.time-picker-input[b-0tuvpgf73d] {
    border-radius: 0.375rem 0 0 0.375rem;
    border-right: none;
}

.time-picker-toggle[b-0tuvpgf73d] {
    border-radius: 0 0.375rem 0.375rem 0;
    border-left: none;
    padding: 0.375rem 0.75rem;
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: 2.5rem;
}

.time-picker-toggle:hover[b-0tuvpgf73d] {
    background-color: var(--bs-secondary-bg);
}

/* Input group focus states đã được chuyển sang ui-components.css */

.time-picker-dropdown[b-0tuvpgf73d] {
    position: absolute;
    top: 100%;
    left: 0;
    z-index: 1050;
    margin-top: 0.125rem;
    background: #fff;
    border: 1px solid #dee2e6;
    border-radius: 0.375rem;
    box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075);
    min-width: 240px;
    max-width: 320px;
    max-height: 350px;
    overflow-y: auto;
    display: none;
}

.time-picker-dropdown.show[b-0tuvpgf73d] {
    display: block;
}

.time-picker-content[b-0tuvpgf73d] {
    padding: 0.75rem;
}

.time-selectors[b-0tuvpgf73d] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(50px, 1fr));
    gap: 0.5rem;
    margin-bottom: 0.75rem;
}

.time-selector[b-0tuvpgf73d] {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.time-label[b-0tuvpgf73d] {
    font-size: 0.6875rem;
    font-weight: 500;
    color: #6c757d;
    margin-bottom: 0.25rem;
    text-align: center;
    text-transform: uppercase;
    letter-spacing: 0.025em;
}

.time-select[b-0tuvpgf73d] {
    font-size: 0.8125rem;
    padding: 0.25rem 0.375rem;
    border-radius: 0.25rem;
    border: 1px solid #dee2e6;
    background-color: #fff;
    min-width: 50px;
    max-width: 65px;
    text-align: center;
    font-weight: 500;
    /* Bỏ mũi tên dropdown */
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background-image: none;
}

/* .time-select:focus đã được chuyển sang ui-components.css */

.quick-times[b-0tuvpgf73d] {
    margin-bottom: 0.75rem;
    padding-top: 0.5rem;
    border-top: 1px solid #dee2e6;
}

.quick-times-label[b-0tuvpgf73d] {
    font-size: 0.6875rem;
    font-weight: 500;
    color: #6c757d;
    margin-bottom: 0.375rem;
    text-transform: uppercase;
    letter-spacing: 0.025em;
}

.quick-time-buttons[b-0tuvpgf73d] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.25rem;
    justify-content: center;
}

.quick-time-btn[b-0tuvpgf73d] {
    font-size: 0.6875rem;
    padding: 0.1875rem 0.375rem;
    border-radius: 0.1875rem;
    font-weight: 500;
    min-width: auto;
}

.time-picker-actions[b-0tuvpgf73d] {
    display: flex;
    justify-content: space-between;
    gap: 0.375rem;
    padding-top: 0.5rem;
    border-top: 1px solid #dee2e6;
}

.time-picker-actions .btn[b-0tuvpgf73d] {
    flex: 1;
    font-size: 0.75rem;
    padding: 0.25rem 0.5rem;
    font-weight: 500;
}

/* Disabled state */
.time-picker-container.disabled .time-picker-input[b-0tuvpgf73d],
.time-picker-container.disabled .time-picker-toggle[b-0tuvpgf73d] {
    opacity: 0.65;
    cursor: not-allowed;
}

/* Format-specific styles */
.format-12h .time-selectors[b-0tuvpgf73d] {
    grid-template-columns: repeat(auto-fit, minmax(50px, 1fr));
}

.format-24h .time-selectors[b-0tuvpgf73d] {
    grid-template-columns: repeat(auto-fit, minmax(60px, 1fr));
}

/* Responsive design */
@media (max-width: 576px) {
    .time-picker-dropdown[b-0tuvpgf73d] {
        min-width: 260px;
    }
    
    .time-selectors[b-0tuvpgf73d] {
        gap: 0.5rem;
    }
    
    .quick-time-buttons[b-0tuvpgf73d] {
        justify-content: center;
    }
}

/* Animation */
.time-picker-dropdown[b-0tuvpgf73d] {
    animation: fadeInDown-b-0tuvpgf73d 0.2s ease-out;
}

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

/* Dark mode styles đã được chuyển sang ui-components.css */

/* Hover effects */
.time-select:hover[b-0tuvpgf73d] {
    border-color: #b0b7c3;
}

.quick-time-btn:hover[b-0tuvpgf73d] {
    transform: translateY(-1px);
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
}

/* Custom scrollbar for dropdown */
.time-picker-dropdown[b-0tuvpgf73d]::-webkit-scrollbar {
    width: 4px;
}

.time-picker-dropdown[b-0tuvpgf73d]::-webkit-scrollbar-track {
    background: #f8f9fa;
    border-radius: 2px;
}

.time-picker-dropdown[b-0tuvpgf73d]::-webkit-scrollbar-thumb {
    background: #dee2e6;
    border-radius: 2px;
}

.time-picker-dropdown[b-0tuvpgf73d]::-webkit-scrollbar-thumb:hover {
    background: #adb5bd;
}

/* Dark mode scrollbar styles đã được chuyển sang ui-components.css */

/* Improved responsive design */
@media (max-width: 480px) {
    .time-picker-dropdown[b-0tuvpgf73d] {
        min-width: 220px;
        max-width: 280px;
    }
    
    .time-selectors[b-0tuvpgf73d] {
        gap: 0.375rem;
    }
    
    .time-select[b-0tuvpgf73d] {
        min-width: 45px;
        max-width: 55px;
        font-size: 0.75rem;
        padding: 0.1875rem 0.25rem;
    }
    
    .quick-time-btn[b-0tuvpgf73d] {
        font-size: 0.625rem;
        padding: 0.125rem 0.25rem;
    }
    
    .time-picker-actions .btn[b-0tuvpgf73d] {
        font-size: 0.6875rem;
        padding: 0.1875rem 0.375rem;
    }
}
/* _content/AspnetBlazor/UIComponents/Placeholders/Placeholder.razor.rz.scp.css */
/* Placeholder styles */
.placeholder[b-3hjs9ji6t7] {
    display: inline-block;
    min-height: 1em;
    vertical-align: middle;
    cursor: wait;
    background-color: currentColor;
    opacity: 0.5;
}

.placeholder.btn[b-3hjs9ji6t7]::before {
    display: inline-block;
    content: "";
}

/* Placeholder sizes */
.placeholder-xs[b-3hjs9ji6t7] {
    min-height: 0.6em;
}

.placeholder-sm[b-3hjs9ji6t7] {
    min-height: 0.8em;
}

.placeholder-lg[b-3hjs9ji6t7] {
    min-height: 1.2em;
}

/* Placeholder animations */
.placeholder-glow .placeholder[b-3hjs9ji6t7] {
    animation: placeholder-glow-b-3hjs9ji6t7 2s ease-in-out infinite;
}

@keyframes placeholder-glow-b-3hjs9ji6t7 {
    50% {
        opacity: 0.2;
    }
}

.placeholder-wave[b-3hjs9ji6t7] {
    mask-image: linear-gradient(130deg, #000 55%, rgba(0, 0, 0, 0.8) 75%, #000 95%);
    mask-size: 200% 100%;
    animation: placeholder-wave-b-3hjs9ji6t7 2s linear infinite;
}

@keyframes placeholder-wave-b-3hjs9ji6t7 {
    100% {
        mask-position: -200% 0%;
    }
}
/* _content/AspnetBlazor/UIComponents/Preload/Preload.razor.rz.scp.css */
.preload-container[b-ppz6pf61us] {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5);
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    z-index: 9999;
    backdrop-filter: blur(2px);
}

.preload-spinner[b-ppz6pf61us] {
    margin-bottom: 1rem;
}

.preload-message[b-ppz6pf61us] {
    color: white;
    font-size: 1.2rem;
    text-align: center;
    max-width: 80%;
    margin-top: 1rem;
}

/* Animation for the preload container */
.preload-container[b-ppz6pf61us] {
    animation: fadeIn-b-ppz6pf61us 0.3s ease-in-out;
}

@keyframes fadeIn-b-ppz6pf61us {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}

/* Dark theme adjustments */
:root[data-bs-theme="dark"] .preload-container[b-ppz6pf61us] {
    background-color: rgba(0, 0, 0, 0.7);
}
/* _content/AspnetBlazor/UIComponents/Rating/Rating.razor.rz.scp.css */
.rating[b-qx3kiant9v] {
    display: inline-flex;
    align-items: center;
}

.rating-item[b-qx3kiant9v] {
    cursor: pointer;
    color: #d1d1d1;
    margin-right: 0.25rem;
}

.rating-item.active[b-qx3kiant9v] {
    color: #ffab00;
}

.rating-value[b-qx3kiant9v] {
    font-size: 0.875rem;
    color: #6c757d;
}

/* Sizes */
.rating-sm .rating-item[b-qx3kiant9v] {
    font-size: 0.875rem;
}

.rating-sm .rating-value[b-qx3kiant9v] {
    font-size: 0.75rem;
}

.rating-lg .rating-item[b-qx3kiant9v] {
    font-size: 1.5rem;
}

.rating-lg .rating-value[b-qx3kiant9v] {
    font-size: 1rem;
}
/* _content/AspnetBlazor/UIComponents/Ribbon/Ribbon.razor.rz.scp.css */
.ribbon[b-izf2a9kiw4] {
    display: flex;
    flex-direction: column;
    border: 1px solid var(--bs-border-color);
    border-radius: 0.375rem;
    overflow: hidden;
    background-color: var(--bs-body-bg);
}

.ribbon-tabs[b-izf2a9kiw4] {
    display: flex;
    background-color: var(--bs-tertiary-bg);
    border-bottom: 1px solid var(--bs-border-color);
}

.ribbon-tab[b-izf2a9kiw4] {
    padding: 0.75rem 1.25rem;
    cursor: pointer;
    font-weight: 500;
    transition: background-color 0.2s ease;
    border-right: 1px solid var(--bs-border-color);
}

.ribbon-tab:hover[b-izf2a9kiw4] {
    background-color: rgba(var(--bs-primary-rgb), 0.1);
}

.ribbon-tab.active[b-izf2a9kiw4] {
    background-color: var(--bs-body-bg);
    border-bottom: 2px solid var(--bs-primary);
    color: var(--bs-primary);
}

.ribbon-content[b-izf2a9kiw4] {
    position: relative;
    min-height: 120px;
}

.ribbon-tab-content[b-izf2a9kiw4] {
    display: none;
    padding: 0.5rem;
}

.ribbon-tab-content.active[b-izf2a9kiw4] {
    display: block;
}

.ribbon-groups[b-izf2a9kiw4] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.ribbon-group[b-izf2a9kiw4] {
    display: flex;
    flex-direction: column;
    min-width: 100px;
    border: 1px solid var(--bs-border-color);
    border-radius: 0.25rem;
    padding: 0.5rem;
    background-color: var(--bs-body-bg);
}

.ribbon-group-content[b-izf2a9kiw4] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    margin-bottom: 0.5rem;
}

.ribbon-group-title[b-izf2a9kiw4] {
    font-size: 0.75rem;
    text-align: center;
    color: var(--bs-secondary-color);
    border-top: 1px solid var(--bs-border-color);
    padding-top: 0.25rem;
}

.ribbon-item[b-izf2a9kiw4] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 0.25rem;
    border-radius: 0.25rem;
    cursor: pointer;
    min-width: 60px;
    transition: background-color 0.2s ease;
}

.ribbon-item:hover[b-izf2a9kiw4] {
    background-color: rgba(var(--bs-primary-rgb), 0.1);
}

.ribbon-item-large[b-izf2a9kiw4] {
    min-width: 80px;
    min-height: 70px;
}

.ribbon-item-icon[b-izf2a9kiw4] {
    font-size: 1.25rem;
    margin-bottom: 0.25rem;
}

.ribbon-item-large .ribbon-item-icon[b-izf2a9kiw4] {
    font-size: 1.75rem;
}

.ribbon-item-label[b-izf2a9kiw4] {
    font-size: 0.75rem;
    text-align: center;
}

/* Responsive adjustments */
@media (max-width: 768px) {
    .ribbon-groups[b-izf2a9kiw4] {
        flex-direction: column;
    }
    
    .ribbon-group[b-izf2a9kiw4] {
        width: 100%;
    }
}
/* _content/AspnetBlazor/UIComponents/Sidebar/Sidebar.razor.rz.scp.css */
.sidebar-container[b-ywo61e5mzr] {
    position: relative;
}

/* Style for body when sidebar is open */
body.sidebar-open[b-ywo61e5mzr] {
    overflow: hidden;
    padding-right: 0; /* Will be set dynamically by JS */
}

.sidebar[b-ywo61e5mzr] {
    position: fixed;
    z-index: 1070;
    background-color: #fff;
    box-shadow: 0 0.25rem 1rem rgba(0, 0, 0, 0.15);
    display: flex;
    flex-direction: column;
    transition: transform 0.3s ease-in-out;
}

.sidebar-header[b-ywo61e5mzr] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1rem;
    border-bottom: 1px solid #e9ecef;
}

.sidebar-title[b-ywo61e5mzr] {
    margin-bottom: 0;
}

.sidebar-body[b-ywo61e5mzr] {
    flex: 1;
    padding: 1rem;
    overflow-y: auto;
}

.sidebar-footer[b-ywo61e5mzr] {
    padding: 1rem;
    border-top: 1px solid #e9ecef;
}

/* Positions */
.sidebar-right[b-ywo61e5mzr] {
    top: 0;
    right: 0;
    bottom: 0;
    transform: translateX(100%);
}

.sidebar-left[b-ywo61e5mzr] {
    top: 0;
    left: 0;
    bottom: 0;
    transform: translateX(-100%);
}

.sidebar-top[b-ywo61e5mzr] {
    top: 0;
    left: 0;
    right: 0;
    transform: translateY(-100%);
}

.sidebar-bottom[b-ywo61e5mzr] {
    bottom: 0;
    left: 0;
    right: 0;
    transform: translateY(100%);
}

/* Sizes */
.sidebar-right.sidebar-small[b-ywo61e5mzr],
.sidebar-left.sidebar-small[b-ywo61e5mzr] {
    width: 250px;
}

.sidebar-right.sidebar-default[b-ywo61e5mzr],
.sidebar-left.sidebar-default[b-ywo61e5mzr] {
    width: 350px;
}

.sidebar-right.sidebar-large[b-ywo61e5mzr],
.sidebar-left.sidebar-large[b-ywo61e5mzr] {
    width: 450px;
}

.sidebar-top.sidebar-small[b-ywo61e5mzr],
.sidebar-bottom.sidebar-small[b-ywo61e5mzr] {
    height: 200px;
}

.sidebar-top.sidebar-default[b-ywo61e5mzr],
.sidebar-bottom.sidebar-default[b-ywo61e5mzr] {
    height: 300px;
}

.sidebar-top.sidebar-large[b-ywo61e5mzr],
.sidebar-bottom.sidebar-large[b-ywo61e5mzr] {
    height: 400px;
}

/* Show state */
.sidebar.show[b-ywo61e5mzr] {
    transform: translate(0, 0);
}

/* Backdrop */
.sidebar-backdrop[b-ywo61e5mzr] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 1060;
}

/* Dark theme */
.dark-style .sidebar[b-ywo61e5mzr] {
    background-color: #283144;
    color: #d6d6d6;
}

.dark-style .sidebar-header[b-ywo61e5mzr],
.dark-style .sidebar-footer[b-ywo61e5mzr] {
    border-color: #444564;
}
/* _content/AspnetBlazor/UIComponents/SortableList/SortableList.razor.rz.scp.css */
.sortable-list[b-47kc0xw7wp] {
    position: relative;
    list-style: none;
    padding: 0;
    margin: 0;
}

.sortable-list-item[b-47kc0xw7wp] {
    cursor: move;
    user-select: none;
    transition: background-color 0.2s ease;
}

.sortable-list-item:hover[b-47kc0xw7wp] {
    background-color: rgba(0, 0, 0, 0.05);
}

.sortable-list-item.sortable-ghost[b-47kc0xw7wp] {
    opacity: 0.5;
    background-color: var(--bs-primary-bg-subtle);
}

.sortable-list-item.sortable-chosen[b-47kc0xw7wp] {
    background-color: var(--bs-primary-bg-subtle);
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
}

.sortable-list-item.sortable-drag[b-47kc0xw7wp] {
    opacity: 0.8;
    z-index: 1000;
}

.sortable-handle[b-47kc0xw7wp] {
    cursor: grab;
    color: #adb5bd;
    display: inline-block;
    margin-right: 0.5rem;
}

.sortable-handle:active[b-47kc0xw7wp] {
    cursor: grabbing;
}

/* Dark theme adjustments */
:root[data-bs-theme="dark"] .sortable-list-item:hover[b-47kc0xw7wp] {
    background-color: rgba(255, 255, 255, 0.05);
}

:root[data-bs-theme="dark"] .sortable-list-item.sortable-ghost[b-47kc0xw7wp],
:root[data-bs-theme="dark"] .sortable-list-item.sortable-chosen[b-47kc0xw7wp] {
    background-color: var(--bs-primary-bg-subtle);
}
/* _content/AspnetBlazor/UIComponents/Stepper/Stepper.razor.rz.scp.css */
.stepper[b-lg52cepiji] {
    display: flex;
    flex-direction: column;
}

/* Horizontal Stepper */
.stepper-horizontal .stepper-header[b-lg52cepiji] {
    display: flex;
    justify-content: space-between;
    margin-bottom: 2rem;
}

.stepper-horizontal .stepper-item[b-lg52cepiji] {
    display: flex;
    flex-direction: column;
    align-items: center;
    flex: 1;
    position: relative;
}

.stepper-horizontal .stepper-line[b-lg52cepiji] {
    position: absolute;
    top: 1rem;
    left: 50%;
    right: -50%;
    height: 2px;
    background-color: #e9ecef;
    z-index: 0;
}

.stepper-horizontal .stepper-item.completed .stepper-line[b-lg52cepiji] {
    background-color: #696cff;
}

/* Vertical Stepper */
.stepper-vertical[b-lg52cepiji] {
    margin-left: 1.5rem;
}

.stepper-vertical .stepper-header[b-lg52cepiji] {
    display: flex;
    flex-direction: column;
}

.stepper-vertical .stepper-item[b-lg52cepiji] {
    display: flex;
    align-items: flex-start;
    margin-bottom: 1.5rem;
    position: relative;
}

.stepper-vertical .stepper-line[b-lg52cepiji] {
    position: absolute;
    top: 2rem;
    left: 1rem;
    bottom: -1.5rem;
    width: 2px;
    background-color: #e9ecef;
    z-index: 0;
}

.stepper-vertical .stepper-item.completed .stepper-line[b-lg52cepiji] {
    background-color: #696cff;
}

.stepper-vertical .stepper-label[b-lg52cepiji] {
    margin-left: 1rem;
    margin-top: 0.25rem;
}

/* Common Styles */
.stepper-circle[b-lg52cepiji] {
    width: 2rem;
    height: 2rem;
    border-radius: 50%;
    background-color: #e9ecef;
    color: #6c757d;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 500;
    z-index: 1;
    cursor: pointer;
}

.stepper-item.active .stepper-circle[b-lg52cepiji] {
    background-color: #696cff;
    color: #fff;
}

.stepper-item.completed .stepper-circle[b-lg52cepiji] {
    background-color: #696cff;
    color: #fff;
}

.stepper-label[b-lg52cepiji] {
    margin-top: 0.5rem;
    font-weight: 500;
    text-align: center;
}

.stepper-item.disabled .stepper-label[b-lg52cepiji] {
    color: #6c757d;
}

.stepper-content[b-lg52cepiji] {
    padding: 1rem 0;
}

.stepper-navigation[b-lg52cepiji] {
    display: flex;
    justify-content: space-between;
}

/* Responsive */
@media (max-width: 768px) {
    .stepper-horizontal .stepper-header[b-lg52cepiji] {
        flex-direction: column;
    }
    
    .stepper-horizontal .stepper-item[b-lg52cepiji] {
        flex-direction: row;
        align-items: center;
        margin-bottom: 1rem;
    }
    
    .stepper-horizontal .stepper-label[b-lg52cepiji] {
        margin-top: 0;
        margin-left: 1rem;
        text-align: left;
    }
    
    .stepper-horizontal .stepper-line[b-lg52cepiji] {
        top: auto;
        left: 1rem;
        right: auto;
        bottom: -1rem;
        width: 2px;
        height: 1rem;
    }
}
/* _content/AspnetBlazor/UIComponents/Tagify/Tagify.razor.rz.scp.css */
/* Tagify Component Styling */
.tagify-wrapper[b-i6uhaxifik] {
    position: relative;
    width: 100%;
}

/* Base tagify styling */
.tagify-wrapper .form-control[b-i6uhaxifik] {
    min-height: 38px;
    padding: 0.375rem 0.75rem;
    border: 1px solid #d4d8dd;
    border-radius: 0.375rem;
    transition: all 0.15s ease-in-out;
    background-color: #fff;
}

.tagify-wrapper .form-control:focus[b-i6uhaxifik] {
    border-color: #696cff;
    box-shadow: 0 0 0 0.2rem rgba(105, 108, 255, 0.25);
    outline: 0;
}

.tagify-wrapper .form-control:disabled[b-i6uhaxifik] {
    background-color: #f8f9fa;
    opacity: 1;
    cursor: not-allowed;
}

/* Tagify tags styling */
.tagify-wrapper .tagify[b-i6uhaxifik] {
    border: 1px solid #d4d8dd;
    border-radius: 0.375rem;
    padding: 0.25rem;
    min-height: 38px;
    background: #fff;
    transition: all 0.15s ease-in-out;
    cursor: text;
}

.tagify-wrapper .tagify:hover[b-i6uhaxifik] {
    border-color: #b8bcc8;
}

.tagify-wrapper .tagify.tagify--focus[b-i6uhaxifik] {
    border-color: #696cff;
    box-shadow: 0 0 0 0.2rem rgba(105, 108, 255, 0.25);
}

.tagify-wrapper .tagify.tagify--disabled[b-i6uhaxifik] {
    background-color: #f8f9fa;
    cursor: not-allowed;
    opacity: 0.65;
}

/* Individual tag styling */
.tagify-wrapper .tagify__tag[b-i6uhaxifik] {
    background: linear-gradient(135deg, #696cff 0%, #5a67d8 100%);
    color: #fff;
    border: none;
    border-radius: 0.25rem;
    padding: 0.25rem 0.5rem;
    margin: 0.125rem;
    font-size: 0.875rem;
    font-weight: 500;
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    transition: all 0.15s ease-in-out;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
}

.tagify-wrapper .tagify__tag:hover[b-i6uhaxifik] {
    background: linear-gradient(135deg, #5a67d8 0%, #4c63d2 100%);
    transform: translateY(-1px);
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.15);
}

.tagify-wrapper .tagify__tag.tagify--mark[b-i6uhaxifik] {
    background: linear-gradient(135deg, #ff6b6b 0%, #ee5a52 100%);
}

.tagify-wrapper .tagify__tag.tagify--notAllowed[b-i6uhaxifik] {
    background: linear-gradient(135deg, #ffc107 0%, #e0a800 100%);
    color: #212529;
}

/* Tag text */
.tagify-wrapper .tagify__tag-text[b-i6uhaxifik] {
    color: inherit;
    font-weight: inherit;
}

/* Remove button */
.tagify-wrapper .tagify__tag__removeBtn[b-i6uhaxifik] {
    color: rgba(255, 255, 255, 0.8);
    background: none;
    border: none;
    cursor: pointer;
    padding: 0;
    margin-left: 0.25rem;
    width: 16px;
    height: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    transition: all 0.15s ease-in-out;
    font-size: 12px;
}

.tagify-wrapper .tagify__tag__removeBtn:hover[b-i6uhaxifik] {
    background: rgba(255, 255, 255, 0.2);
    color: #fff;
}

.tagify-wrapper .tagify__tag__removeBtn[b-i6uhaxifik]::after {
    content: "×";
    font-size: 14px;
    line-height: 1;
}

/* Input field inside tagify */
.tagify-wrapper .tagify__input[b-i6uhaxifik] {
    color: #495057;
    font-size: 0.875rem;
    line-height: 1.5;
    min-width: 110px;
    margin: 0.125rem;
    padding: 0.25rem 0;
    border: none;
    outline: none;
    background: transparent;
}

.tagify-wrapper .tagify__input[b-i6uhaxifik]::before {
    color: #6c757d;
    font-style: italic;
}

/* Dropdown suggestions */
.tagify-wrapper .tagify__dropdown[b-i6uhaxifik] {
    background: #fff;
    border: 1px solid #d4d8dd;
    border-radius: 0.375rem;
    box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
    max-height: 200px;
    overflow-y: auto;
    z-index: 1050;
    margin-top: 0.125rem;
}

.tagify-wrapper .tagify__dropdown__item[b-i6uhaxifik] {
    padding: 0.5rem 0.75rem;
    cursor: pointer;
    border-bottom: 1px solid #f8f9fa;
    transition: all 0.15s ease-in-out;
    color: #495057;
    font-size: 0.875rem;
}

.tagify-wrapper .tagify__dropdown__item:last-child[b-i6uhaxifik] {
    border-bottom: none;
}

.tagify-wrapper .tagify__dropdown__item:hover[b-i6uhaxifik],
.tagify-wrapper .tagify__dropdown__item.tagify__dropdown__item--active[b-i6uhaxifik] {
    background: #696cff;
    color: #fff;
}

.tagify-wrapper .tagify__dropdown__item--hidden[b-i6uhaxifik] {
    display: none;
}

/* Loading state */
.tagify-wrapper .tagify__dropdown__item.tagify__dropdown__item--loading[b-i6uhaxifik] {
    color: #6c757d;
    font-style: italic;
    cursor: default;
    pointer-events: none;
}

/* Empty state */
.tagify-wrapper .tagify__dropdown__item.tagify__dropdown__item--empty[b-i6uhaxifik] {
    color: #6c757d;
    font-style: italic;
    cursor: default;
    pointer-events: none;
}

/* Scrollbar styling */
.tagify-wrapper .tagify__dropdown[b-i6uhaxifik]::-webkit-scrollbar {
    width: 6px;
}

.tagify-wrapper .tagify__dropdown[b-i6uhaxifik]::-webkit-scrollbar-track {
    background: #f1f1f1;
    border-radius: 3px;
}

.tagify-wrapper .tagify__dropdown[b-i6uhaxifik]::-webkit-scrollbar-thumb {
    background: #c1c1c1;
    border-radius: 3px;
}

.tagify-wrapper .tagify__dropdown[b-i6uhaxifik]::-webkit-scrollbar-thumb:hover {
    background: #a8a8a8;
}

/* Animation */
.tagify-wrapper .tagify__dropdown[b-i6uhaxifik] {
    animation: fadeInDown-b-i6uhaxifik 0.15s ease-out;
}

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

/* Responsive adjustments */
@media (max-width: 576px) {
    .tagify-wrapper .tagify__tag[b-i6uhaxifik] {
        font-size: 0.8rem;
        padding: 0.2rem 0.4rem;
    }
    
    .tagify-wrapper .tagify__dropdown[b-i6uhaxifik] {
        max-height: 150px;
    }
    
    .tagify-wrapper .tagify__dropdown__item[b-i6uhaxifik] {
        padding: 0.75rem;
        font-size: 0.9rem;
    }
}

/* Size variants */
.tagify-wrapper.tagify-sm .tagify[b-i6uhaxifik] {
    min-height: 32px;
    padding: 0.125rem;
}

.tagify-wrapper.tagify-sm .tagify__tag[b-i6uhaxifik] {
    font-size: 0.75rem;
    padding: 0.125rem 0.375rem;
}

.tagify-wrapper.tagify-sm .tagify__input[b-i6uhaxifik] {
    font-size: 0.75rem;
    min-width: 80px;
}

.tagify-wrapper.tagify-lg .tagify[b-i6uhaxifik] {
    min-height: 48px;
    padding: 0.375rem;
}

.tagify-wrapper.tagify-lg .tagify__tag[b-i6uhaxifik] {
    font-size: 1rem;
    padding: 0.375rem 0.75rem;
}

.tagify-wrapper.tagify-lg .tagify__input[b-i6uhaxifik] {
    font-size: 1rem;
    min-width: 140px;
}

/* Color variants */
.tagify-wrapper.tagify-success .tagify__tag[b-i6uhaxifik] {
    background: linear-gradient(135deg, #28a745 0%, #20c997 100%);
}

.tagify-wrapper.tagify-warning .tagify__tag[b-i6uhaxifik] {
    background: linear-gradient(135deg, #ffc107 0%, #fd7e14 100%);
    color: #212529;
}

.tagify-wrapper.tagify-danger .tagify__tag[b-i6uhaxifik] {
    background: linear-gradient(135deg, #dc3545 0%, #e83e8c 100%);
}

.tagify-wrapper.tagify-info .tagify__tag[b-i6uhaxifik] {
    background: linear-gradient(135deg, #17a2b8 0%, #6f42c1 100%);
}
/* _content/AspnetBlazor/UIComponents/Timeline/Timeline.razor.rz.scp.css */
.timeline[b-sfclyr36zi] {
    position: relative;
    height: 100%;
    width: 100%;
    padding: 0;
    list-style: none;
}

.timeline .timeline-header[b-sfclyr36zi] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-direction: row;
}

.timeline .timeline-header > *:first-child[b-sfclyr36zi] {
    margin-right: 0.5rem;
}

.timeline .timeline-end-indicator[b-sfclyr36zi] {
    position: absolute;
    bottom: -1.35rem;
    left: -0.65rem;
}

.timeline .timeline-end-indicator i[b-sfclyr36zi] {
    font-size: 1.5rem;
    color: #e6e6e8;
}

.timeline .timeline-item[b-sfclyr36zi] {
    position: relative;
    padding-left: 1.4rem;
}

.timeline .timeline-item .timeline-event[b-sfclyr36zi] {
    position: relative;
    width: 100%;
    min-height: 4rem;
    background-color: #fff;
    border-radius: 0.375rem;
    padding: 0.5rem 0 0.3375rem;
}

.timeline .timeline-item .timeline-event .timeline-event-time[b-sfclyr36zi] {
    position: absolute;
    top: 1.2rem;
    font-size: 0.85rem;
    color: #acaab1;
}

.timeline .timeline-item .timeline-point[b-sfclyr36zi] {
    position: absolute;
    left: -0.38rem;
    top: 0;
    z-index: 2;
    display: block;
    height: 0.75rem;
    width: 0.75rem;
    border-radius: 50%;
    background-color: #7367f0;
    box-shadow: 0 0 0 10px #fff;
}

.timeline .timeline-item.timeline-item-transparent .timeline-event[b-sfclyr36zi] {
    top: -0.9rem;
    background-color: transparent;
    padding-left: 0;
}

.timeline .timeline-item.timeline-item-transparent .timeline-event.timeline-event-shadow[b-sfclyr36zi] {
    padding-left: 2rem;
}

/* Additional classes for styling */
.mb-3[b-sfclyr36zi] {
    margin-bottom: 1rem !important;
}

.mb-2[b-sfclyr36zi] {
    margin-bottom: 0.5rem !important;
}

.mb-0[b-sfclyr36zi] {
    margin-bottom: 0 !important;
}

.text-muted[b-sfclyr36zi] {
    color: #acaab1 !important;
}

.bg-lighter[b-sfclyr36zi] {
    background-color: rgba(47, 43, 61, 0.05) !important;
}

.rounded[b-sfclyr36zi] {
    border-radius: 0.375rem !important;
}

.me-2[b-sfclyr36zi] {
    margin-right: 0.5rem !important;
}

.text-body[b-sfclyr36zi] {
    color: #444050 !important;
}

.d-flex[b-sfclyr36zi] {
    display: flex !important;
}

.align-items-center[b-sfclyr36zi] {
    align-items: center !important;
}

.justify-content-between[b-sfclyr36zi] {
    justify-content: space-between !important;
}

.flex-wrap[b-sfclyr36zi] {
    flex-wrap: wrap !important;
}

.gap-2[b-sfclyr36zi] {
    gap: 0.5rem !important;
}

.mb-50[b-sfclyr36zi] {
    margin-bottom: 0.5rem !important;
}

.avatar[b-sfclyr36zi] {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 2.375rem;
    width: 2.375rem;
    font-size: 1rem;
}

.avatar-sm[b-sfclyr36zi] {
    height: 1.5rem;
    width: 1.5rem;
}

.rounded-circle[b-sfclyr36zi] {
    border-radius: 50% !important;
}

.small[b-sfclyr36zi] {
    font-size: 0.85rem !important;
}

.fw-medium[b-sfclyr36zi] {
    font-weight: 500 !important;
}

.border-left-dashed[b-sfclyr36zi] {
    border-left-style: dashed !important;
}

.list-group[b-sfclyr36zi] {
    display: flex;
    flex-direction: column;
    padding-left: 0;
    margin-bottom: 0;
    border-radius: 0.375rem;
}

.list-group-flush[b-sfclyr36zi] {
    border-radius: 0;
}

.list-group-item[b-sfclyr36zi] {
    position: relative;
    display: block;
    padding: 0.75rem 1.25rem;
    background-color: #fff;
    border: 1px solid rgba(0, 0, 0, 0.125);
}

.list-group-flush .list-group-item[b-sfclyr36zi] {
    border-right: 0;
    border-left: 0;
    border-radius: 0;
}

.border-top-0[b-sfclyr36zi] {
    border-top: 0 !important;
}

.p-0[b-sfclyr36zi] {
    padding: 0 !important;
}

.list-unstyled[b-sfclyr36zi] {
    padding-left: 0;
    list-style: none;
}

.avatar-group[b-sfclyr36zi] {
    display: flex;
    flex-wrap: wrap;
}

.avatar-group .avatar[b-sfclyr36zi] {
    margin-right: -0.5rem;
    transition: all 0.25s ease;
}

.pull-up[b-sfclyr36zi] {
    transition: all 0.25s ease;
}

.pull-up:hover[b-sfclyr36zi] {
    transform: translateY(-4px);
}

.avatar-initial[b-sfclyr36zi] {
    background-color: rgba(47, 43, 61, 0.2);
    color: #444050;
}

.text-heading[b-sfclyr36zi] {
    color: #444050 !important;
}

.timeline.timeline-outline .timeline-item .timeline-point[b-sfclyr36zi] {
    outline: unset;
    background-color: #fff !important;
    border: 2px solid #7367f0;
}

.timeline.timeline-center .timeline-end-indicator[b-sfclyr36zi] {
    bottom: -1.4rem;
    left: 50%;
    margin-left: 0.55rem;
}

.timeline.timeline-center .timeline-item[b-sfclyr36zi] {
    width: 50%;
    clear: both;
}

.timeline.timeline-center .timeline-item.timeline-item-left[b-sfclyr36zi], 
.timeline.timeline-center .timeline-item:nth-of-type(odd):not(.timeline-item-left):not(.timeline-item-right)[b-sfclyr36zi] {
    float: left;
    padding-left: 0;
    padding-right: 2.25rem;
    padding-bottom: 2.5rem;
    border-left: 0;
    border-right: 1px solid #e6e6e8;
}

.timeline.timeline-center .timeline-item.timeline-item-left .timeline-event .timeline-event-time[b-sfclyr36zi], 
.timeline.timeline-center .timeline-item:nth-of-type(odd):not(.timeline-item-left):not(.timeline-item-right) .timeline-event .timeline-event-time[b-sfclyr36zi] {
    right: -10.2rem;
}

.timeline.timeline-center .timeline-item.timeline-item-left .timeline-point[b-sfclyr36zi], 
.timeline.timeline-center .timeline-item:nth-of-type(odd):not(.timeline-item-left):not(.timeline-item-right) .timeline-point[b-sfclyr36zi] {
    left: 100%;
}

.timeline.timeline-center .timeline-item.timeline-item-right[b-sfclyr36zi], 
.timeline.timeline-center .timeline-item:nth-of-type(even):not(.timeline-item-left):not(.timeline-item-right)[b-sfclyr36zi] {
    float: right;
    right: 1px;
    padding-left: 2.25rem;
    padding-bottom: 2.5rem;
    border-left: 1px solid #e6e6e8;
}

.timeline.timeline-center .timeline-item.timeline-item-right .timeline-event .timeline-event-time[b-sfclyr36zi], 
.timeline.timeline-center .timeline-item:nth-of-type(even):not(.timeline-item-left):not(.timeline-item-right) .timeline-event .timeline-event-time[b-sfclyr36zi] {
    left: -10.2rem;
}

.timeline.timeline-center .timeline-item.timeline-item-right .timeline-event .timeline-point[b-sfclyr36zi], 
.timeline.timeline-center .timeline-item:nth-of-type(even):not(.timeline-item-left):not(.timeline-item-right) .timeline-event .timeline-point[b-sfclyr36zi] {
    left: 0;
}

.timeline.timeline-center .timeline-item .timeline-point[b-sfclyr36zi] {
    left: 50%;
    margin-left: -0.6875rem;
}

.timeline:not(.timeline-center)[b-sfclyr36zi] {
    padding-left: 0.5rem;
}

.timeline-item[b-sfclyr36zi] {
    border-left: 1px solid #e6e6e8;
}

/* Color variants */
.timeline .timeline-point-primary[b-sfclyr36zi] {
    background-color: #7367f0 !important;
    outline: 3px solid rgba(115, 103, 240, 0.12);
}

.timeline.timeline-outline .timeline-point-primary[b-sfclyr36zi] {
    border: 2px solid #7367f0 !important;
}

.timeline .timeline-point-secondary[b-sfclyr36zi] {
    background-color: #808390 !important;
    outline: 3px solid rgba(128, 131, 144, 0.12);
}

.timeline.timeline-outline .timeline-point-secondary[b-sfclyr36zi] {
    border: 2px solid #808390 !important;
}

.timeline .timeline-point-success[b-sfclyr36zi] {
    background-color: #28c76f !important;
    outline: 3px solid rgba(40, 199, 111, 0.12);
}

.timeline.timeline-outline .timeline-point-success[b-sfclyr36zi] {
    border: 2px solid #28c76f !important;
}

.timeline .timeline-point-info[b-sfclyr36zi] {
    background-color: #00bad1 !important;
    outline: 3px solid rgba(0, 186, 209, 0.12);
}

.timeline.timeline-outline .timeline-point-info[b-sfclyr36zi] {
    border: 2px solid #00bad1 !important;
}

.timeline .timeline-point-warning[b-sfclyr36zi] {
    background-color: #ff9f43 !important;
    outline: 3px solid rgba(255, 159, 67, 0.12);
}

.timeline.timeline-outline .timeline-point-warning[b-sfclyr36zi] {
    border: 2px solid #ff9f43 !important;
}

.timeline .timeline-point-danger[b-sfclyr36zi] {
    background-color: #ff4c51 !important;
    outline: 3px solid rgba(255, 76, 81, 0.12);
}

.timeline.timeline-outline .timeline-point-danger[b-sfclyr36zi] {
    border: 2px solid #ff4c51 !important;
}

.timeline .timeline-point-dark[b-sfclyr36zi] {
    background-color: #4b4b4b !important;
    outline: 3px solid rgba(75, 75, 75, 0.12);
}

.timeline.timeline-outline .timeline-point-dark[b-sfclyr36zi] {
    border: 2px solid #4b4b4b !important;
}

/* Responsive */
@media (min-width: 768px) {
    .timeline.timeline-center .timeline-item.timeline-item-left .timeline-indicator[b-sfclyr36zi], 
    .timeline.timeline-center .timeline-item:nth-of-type(odd):not(.timeline-item-left):not(.timeline-item-right) .timeline-indicator[b-sfclyr36zi] {
        left: calc(100% - 2rem / 2);
    }
}

@media (max-width: 767.98px) {
    .timeline.timeline-center .timeline-end-indicator[b-sfclyr36zi] {
        left: -2px;
    }
    
    .timeline.timeline-center .timeline-item[b-sfclyr36zi] {
        border-right: 0 !important;
        left: 1rem;
        float: left !important;
        width: 100%;
        padding-left: 3rem !important;
        padding-right: 1.5rem !important;
    }
    
    .timeline.timeline-center .timeline-item:not(:last-child)[b-sfclyr36zi] {
        border-left: 1px solid #e6e6e8 !important;
    }
    
    .timeline.timeline-center .timeline-item .timeline-event .timeline-event-time[b-sfclyr36zi] {
        top: -1.7rem;
        left: 0 !important;
        right: auto !important;
    }
    
    .timeline.timeline-center .timeline-item .timeline-point[b-sfclyr36zi] {
        left: -0.7rem !important;
        margin-left: 0 !important;
    }
}

@media (max-width: 575.98px) {
    .timeline .timeline-header[b-sfclyr36zi] {
        flex-direction: column;
        align-items: flex-start;
    }
}
/* _content/AspnetBlazor/UIComponents/Toast/Toast.razor.rz.scp.css */
/* Toast Component CSS */

.toast-container[b-u4y36p3gxn] {
    z-index: 1300 !important; /* Đảm bảo hiển thị trên tất cả các phần tử khác */
    position: fixed !important;
    pointer-events: none; /* Cho phép click xuyên qua container nhưng không qua toast */
}

.toast[b-u4y36p3gxn] {
    pointer-events: auto; /* Cho phép tương tác với toast */
    box-shadow: 0 0.25rem 1rem rgba(0, 0, 0, 0.15);
    backdrop-filter: blur(10px);
    border-radius: 0.5rem;
    overflow: hidden;
    margin-bottom: 0.75rem;
    max-width: 350px;
    opacity: 0;
    transform: translateY(-15px);
    animation: toast-in-b-u4y36p3gxn 0.3s ease forwards;
}

.toast.show[b-u4y36p3gxn] {
    display: block;
    opacity: 1;
}

.toast.hide[b-u4y36p3gxn] {
    animation: toast-out-b-u4y36p3gxn 0.3s ease forwards;
}

.toast-header[b-u4y36p3gxn] {
    display: flex;
    align-items: center;
    padding: 0.5rem 0.75rem;
    background-color: rgba(255, 255, 255, 0.85);
    background-clip: padding-box;
    border-bottom: 1px solid rgba(0, 0, 0, 0.05);
}

.toast-body[b-u4y36p3gxn] {
    padding: 0.75rem;
}

/* Toast animations */
@keyframes toast-in-b-u4y36p3gxn {
    from {
        opacity: 0;
        transform: translateY(-15px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes toast-out-b-u4y36p3gxn {
    from {
        opacity: 1;
        transform: translateY(0);
    }
    to {
        opacity: 0;
        transform: translateY(-15px);
    }
}

/* Toast positions */
.toast-container.top-0.start-0[b-u4y36p3gxn] { top: 1rem; left: 1rem; }
.toast-container.top-0.end-0[b-u4y36p3gxn] { top: 1rem; right: 1rem; }
.toast-container.bottom-0.start-0[b-u4y36p3gxn] { bottom: 1rem; left: 1rem; }
.toast-container.bottom-0.end-0[b-u4y36p3gxn] { bottom: 1rem; right: 1rem; }
.toast-container.top-0.start-50.translate-middle-x[b-u4y36p3gxn] { top: 1rem; left: 50%; transform: translateX(-50%); }
.toast-container.bottom-0.start-50.translate-middle-x[b-u4y36p3gxn] { bottom: 1rem; left: 50%; transform: translateX(-50%); }

/* Dark theme support */
[data-bs-theme="dark"] .toast[b-u4y36p3gxn] {
    background-color: rgba(33, 37, 41, 0.85);
    color: #fff;
}

[data-bs-theme="dark"] .toast-header[b-u4y36p3gxn] {
    background-color: rgba(33, 37, 41, 0.85);
    color: #fff;
    border-bottom-color: rgba(255, 255, 255, 0.1);
}