/* /Components/Dialogs/AccessoryDataFormDialog.razor.rz.scp.css */
/* AccessoryDataFormDialog - Modern V2 Architecture Styling */

.modern-accessory-dialog[b-0ojqy8zbxz] {
    border-radius: 12px;
    box-shadow: 0 8px 32px rgb(0 0 0 / 15%);
}

.modern-accessory-dialog .e-dialog .e-dlg-header[b-0ojqy8zbxz] {
    padding: 1.25rem 1.5rem;
    font-size: 1.1rem;
    font-weight: 600;
    color: white;
    background: linear-gradient(135deg, #2c5f2d 0%, #3a7a3e 100%);
    border-bottom: 3px solid #97bc62;
    border-radius: 12px 12px 0 0;
}

.modern-accessory-dialog .e-dialog .e-dlg-header .e-btn[b-0ojqy8zbxz] {
    font-size: 1.2rem;
    color: white;
    background: transparent;
    border: none;
}

.modern-accessory-dialog .e-dialog .e-dlg-header .e-btn:hover[b-0ojqy8zbxz] {
    background: rgb(255 255 255 / 10%);
    border-radius: 50%;
}

/* Dialog Content */
.modern-accessory-dialog .e-dialog .e-dlg-content[b-0ojqy8zbxz] {
    padding: 0;
    background: #fafbfc;
}

.dialog-content[b-0ojqy8zbxz] {
    max-height: 580px;
    padding: 1.5rem;
    overflow-y: auto;
}

/* Loading State */
.loading-container[b-0ojqy8zbxz] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 300px;
    text-align: center;
}

.loading-container .spinner-border[b-0ojqy8zbxz] {
    width: 3rem;
    height: 3rem;
}

/* Modern DataForm Styling */
.modern-dataform[b-0ojqy8zbxz] {
    padding: 1.5rem;
    background: white;
    border: 1px solid #e9ecef;
    border-radius: 8px;
    box-shadow: 0 2px 8px rgb(0 0 0 / 8%);
}

/* Form Groups */
.modern-dataform .e-form-group-container[b-0ojqy8zbxz] {
    margin-bottom: 2rem;
    background: white;
    border: 1px solid #e9ecef;
    border-radius: 8px;
}

.modern-dataform .e-form-group-container .e-form-group-header[b-0ojqy8zbxz] {
    padding: 0.75rem 1rem;
    margin-bottom: 0;
    font-size: 0.95rem;
    font-weight: 600;
    color: #2c5f2d;
    background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);
    border-bottom: 1px solid #e9ecef;
    border-radius: 8px 8px 0 0;
}

.modern-dataform .e-form-group-container .e-form-group-content[b-0ojqy8zbxz] {
    padding: 1.25rem;
}

/* Form Items */
.modern-dataform .e-form-item[b-0ojqy8zbxz] {
    margin-bottom: 1.5rem;
}

.modern-dataform .e-form-item:last-child[b-0ojqy8zbxz] {
    margin-bottom: 0;
}

/* Form Labels */
.modern-dataform .e-form-label[b-0ojqy8zbxz] {
    display: block;
    margin-bottom: 0.5rem;
    font-size: 0.875rem;
    font-weight: 500;
    color: #495057;
}

/* Form Fields */
.modern-dataform .e-field[b-0ojqy8zbxz] {
    padding: 0.75rem;
    font-size: 0.875rem;
    background: white;
    border: 1px solid #ced4da;
    border-radius: 6px;
    transition: all 0.2s ease;
}

.modern-dataform .e-field:focus[b-0ojqy8zbxz],
.modern-dataform .e-field.e-input-focus[b-0ojqy8zbxz] {
    border-color: #97bc62;
    outline: none;
    box-shadow: 0 0 0 0.2rem rgb(151 188 98 / 25%);
}

.modern-dataform .e-field:hover[b-0ojqy8zbxz] {
    border-color: #97bc62;
}

/* Dropdown Specific */
.modern-dataform .e-dropdownlist.e-field[b-0ojqy8zbxz] {
    padding: 0;
}

.modern-dataform .e-dropdownlist .e-input[b-0ojqy8zbxz] {
    padding: 0.75rem;
    background: transparent;
    border: none;
}

.modern-dataform .e-dropdownlist .e-input:focus[b-0ojqy8zbxz] {
    box-shadow: none;
}

/* Multiline TextBox */
.modern-dataform .e-textbox.e-multi-line-input[b-0ojqy8zbxz] {
    min-height: 100px;
    resize: vertical;
}

/* Required Field Indicator */
.required[b-0ojqy8zbxz] {
    margin-left: 2px;
    font-weight: 600;
    color: #dc3545;
}

/* Validation Errors */
.validation-errors[b-0ojqy8zbxz] {
    padding: 1rem;
    margin-top: 1rem;
    color: #721c24;
    background: #f8d7da;
    border: 1px solid #f5c6cb;
    border-radius: 6px;
}

.validation-errors ul[b-0ojqy8zbxz] {
    padding-left: 1.5rem;
    margin-bottom: 0;
    font-size: 0.875rem;
}

/* Dialog Footer */
.modern-accessory-dialog .e-dialog .e-footer-content[b-0ojqy8zbxz] {
    padding: 0;
    background: #f8f9fa;
    border-top: 1px solid #e9ecef;
    border-radius: 0 0 12px 12px;
}

.dialog-footer[b-0ojqy8zbxz] {
    display: flex;
    gap: 0.75rem;
    justify-content: flex-end;
    padding: 1rem 1.5rem;
    background: #f8f9fa;
    border-radius: 0 0 12px 12px;
}

.dialog-footer .e-btn[b-0ojqy8zbxz] {
    padding: 0.5rem 1.5rem;
    font-weight: 500;
    border-radius: 6px;
    transition: all 0.2s ease;
}

.dialog-footer .e-btn.e-primary[b-0ojqy8zbxz] {
    color: white;
    background: linear-gradient(135deg, #2c5f2d 0%, #3a7a3e 100%);
    border-color: #2c5f2d;
}

.dialog-footer .e-btn.e-primary:hover[b-0ojqy8zbxz] {
    background: linear-gradient(135deg, #1e4220 0%, #2c5f2d 100%);
    border-color: #1e4220;
    box-shadow: 0 4px 12px rgb(44 95 45 / 30%);
    transform: translateY(-1px);
}

.dialog-footer .e-btn:not(.e-primary)[b-0ojqy8zbxz] {
    color: #6c757d;
    background: transparent;
    border-color: #6c757d;
}

.dialog-footer .e-btn:not(.e-primary):hover[b-0ojqy8zbxz] {
    color: #495057;
    background: #f8f9fa;
    border-color: #495057;
}

/* Disabled State */
.dialog-footer .e-btn:disabled[b-0ojqy8zbxz] {
    cursor: not-allowed;
    box-shadow: none !important;
    opacity: 0.6;
    transform: none !important;
}

/* Form Helper Text */
.form-text[b-0ojqy8zbxz] {
    margin-top: 0.25rem;
    font-size: 0.8rem;
    font-style: italic;
    color: #6c757d;
}

/* Mobile Responsiveness */
@media (width <= 768px) {
    .modern-accessory-dialog[b-0ojqy8zbxz] {
        width: 95% !important;
        height: 85% !important;
        margin: 2.5vh auto;
    }
    
    .modern-dataform[b-0ojqy8zbxz] {
        padding: 1rem;
    }
    
    .modern-dataform .e-form-group-container .e-form-group-content[b-0ojqy8zbxz] {
        padding: 1rem;
    }
    
    .dialog-footer[b-0ojqy8zbxz] {
        flex-direction: column;
        gap: 0.75rem;
        align-items: stretch !important;
    }
    
    .dialog-footer .e-btn[b-0ojqy8zbxz] {
        width: 100%;
    }
}

/* High Contrast Support */
@media (prefers-contrast: high) {
    .modern-accessory-dialog .e-dialog .e-dlg-header[b-0ojqy8zbxz] {
        background: #000000;
        border-bottom-color: #ffffff;
    }
    
    .modern-dataform .e-field[b-0ojqy8zbxz] {
        border-width: 2px;
    }
    
    .modern-dataform .e-field:focus[b-0ojqy8zbxz] {
        border-width: 3px;
    }
}

/* Reduced Motion Support */
@media (prefers-reduced-motion: reduce) {
    .modern-dataform .e-field[b-0ojqy8zbxz],
    .dialog-footer .e-btn[b-0ojqy8zbxz] {
        transition: none;
    }
    
    .dialog-footer .e-btn.e-primary:hover[b-0ojqy8zbxz] {
        transform: none;
    }
}

/* Print Styles */
@media print {
    .modern-accessory-dialog[b-0ojqy8zbxz] {
        border: 1px solid #000000;
        box-shadow: none;
    }
    
    .dialog-footer[b-0ojqy8zbxz] {
        display: none;
    }
}
/* /Components/Dialogs/DeviceDataFormDialog.razor.rz.scp.css */
/* Modern Device Data Form Dialog Styles */

.modern-device-dialog[b-x4cwg85zm3] {
    --primary-color: #2c5f2d;
    --primary-light: #97bc62;
    --border-color: #e9ecef;
    --text-muted: #6c757d;
    --success-color: #28a745;
    --danger-color: #dc3545;
    --warning-color: #ffc107;
    --shadow-sm: 0 0.125rem 0.25rem rgb(0 0 0 / 7.5%);
    --shadow-md: 0 0.5rem 1rem rgb(0 0 0 / 15%);
    --border-radius: 0.375rem;
    border-radius: 12px;
    box-shadow: 0 8px 32px rgb(0 0 0 / 15%);
}

/* Dialog Container */
.modern-device-dialog .e-dialog[b-x4cwg85zm3] {
    border: 1px solid #e9ecef;
    border-radius: 12px;
    box-shadow: 0 8px 32px rgb(0 0 0 / 15%);
}

.modern-device-dialog .e-dialog .e-dlg-content[b-x4cwg85zm3] {
    padding: 0;
    background: #fafbfc;
}

.modern-device-dialog .e-dlg-header[b-x4cwg85zm3] {
    padding: 1.25rem 1.5rem;
    font-size: 1.1rem;
    font-weight: 600;
    color: white;
    background: linear-gradient(135deg, #2c5f2d 0%, #3a7a3e 100%);
    border-bottom: 3px solid #97bc62;
    border-radius: 12px 12px 0 0;
}

.modern-device-dialog .e-dlg-header .e-btn.e-dlg-closeicon-btn[b-x4cwg85zm3] {
    font-size: 1.2rem;
    color: white;
    background: transparent;
    border: none;
}

.modern-device-dialog .e-dlg-header .e-btn.e-dlg-closeicon-btn:hover[b-x4cwg85zm3] {
    background: rgb(255 255 255 / 10%);
    border-radius: 50%;
}

/* Dialog Content */
.dialog-content[b-x4cwg85zm3] {
    max-height: 680px;
    padding: 1.5rem;
    background: #fafbfc;
    overflow-y: auto;
}

/* Loading Container */
.loading-container[b-x4cwg85zm3] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 400px;
    color: var(--text-muted);
}

.loading-container .spinner-border[b-x4cwg85zm3] {
    width: 3rem;
    height: 3rem;
}

/* Data Form Styling */
.modern-device-dialog .e-dataform[b-x4cwg85zm3] {
    padding: 1.5rem;
    background: white;
    border: 1px solid #e9ecef;
    border-radius: 8px;
    box-shadow: 0 2px 8px rgb(0 0 0 / 8%);
}

/* Form Groups */
.modern-device-dialog .e-dataform .e-formgroup[b-x4cwg85zm3] {
    padding: 1.25rem;
    margin-bottom: 2rem;
    background: white;
    border: 1px solid #e9ecef;
    border-radius: 8px;
    box-shadow: 0 2px 8px rgb(0 0 0 / 8%);
}

.modern-device-dialog .e-dataform .e-formgroup .e-formgroup-text[b-x4cwg85zm3] {
    padding: 0.75rem 1rem;
    margin-bottom: 1rem;
    font-size: 0.95rem;
    font-weight: 600;
    color: #2c5f2d;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);
    border: 1px solid #e9ecef;
    border-radius: 8px 8px 0 0;
}

/* Form Fields */
.modern-device-dialog .indus-form__group[b-x4cwg85zm3] {
    margin-bottom: 1.25rem;
}

.modern-device-dialog .indus-form__group .e-form-label[b-x4cwg85zm3] {
    display: block;
    margin-bottom: 0.5rem;
    font-size: 0.875rem;
    font-weight: 600;
    color: var(--primary-color);
    text-transform: uppercase;
    letter-spacing: 0.3px;
}

.modern-device-dialog .e-field[b-x4cwg85zm3] {
    background: white;
    border: 2px solid var(--border-color);
    border-radius: var(--border-radius);
    transition: all 0.2s ease;
}

.modern-device-dialog .e-field:focus[b-x4cwg85zm3],
.modern-device-dialog .e-field.e-input-focus[b-x4cwg85zm3] {
    border-color: var(--primary-light);
    outline: none;
    box-shadow: 0 0 0 0.25rem rgb(151 188 98 / 25%);
}

.modern-device-dialog .e-field:hover[b-x4cwg85zm3] {
    border-color: var(--primary-light);
}

/* SfTextBox specific styling */
.modern-device-dialog .e-textbox.e-field[b-x4cwg85zm3] {
    padding: 0.75rem;
    font-size: 0.875rem;
}

.modern-device-dialog .e-textbox.e-field.e-multi-line[b-x4cwg85zm3] {
    min-height: 100px;
    resize: vertical;
}

/* SfDropDownList specific styling */
.modern-device-dialog .e-ddl.e-field[b-x4cwg85zm3] {
    background: white;
}

.modern-device-dialog .e-ddl.e-field .e-input[b-x4cwg85zm3] {
    padding: 0.75rem;
    font-size: 0.875rem;
}

/* SfNumericTextBox specific styling */
.modern-device-dialog .e-numerictextbox.e-field[b-x4cwg85zm3] {
    background: white;
}

.modern-device-dialog .e-numerictextbox.e-field .e-input[b-x4cwg85zm3] {
    padding: 0.75rem;
    font-size: 0.875rem;
}

/* SfDatePicker specific styling */
.modern-device-dialog .e-datepicker.e-field[b-x4cwg85zm3] {
    background: white;
}

.modern-device-dialog .e-datepicker.e-field .e-input[b-x4cwg85zm3] {
    padding: 0.75rem;
    font-size: 0.875rem;
}

/* Validation Summary */
.validation-summary[b-x4cwg85zm3] {
    color: #721c24;
    background: #f8d7da;
    border-color: #f5c6cb;
    border-left: 4px solid var(--danger-color);
    border-radius: var(--border-radius);
}

.validation-summary h6[b-x4cwg85zm3] {
    margin-bottom: 0.5rem;
    font-weight: 600;
    color: #721c24;
}

.validation-summary ul[b-x4cwg85zm3] {
    padding-left: 1.25rem;
    margin-bottom: 0;
}

.validation-summary li[b-x4cwg85zm3] {
    margin-bottom: 0.25rem;
    font-size: 0.875rem;
}

/* Dialog Footer */
.dialog-footer[b-x4cwg85zm3] {
    padding: 1rem 1.5rem;
    background: white;
    border-top: 1px solid var(--border-color);
    border-radius: 0 0 var(--border-radius) var(--border-radius);
}

.footer-info[b-x4cwg85zm3] {
    flex: 1;
}

.footer-info small[b-x4cwg85zm3] {
    font-size: 0.75rem;
    font-style: italic;
    color: var(--text-muted);
}

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

/* Button Styling */
.modern-device-dialog .e-btn.e-primary[b-x4cwg85zm3] {
    padding: 0.75rem 1.5rem;
    font-size: 0.875rem;
    font-weight: 600;
    color: white;
    text-transform: uppercase;
    letter-spacing: 0.3px;
    background: linear-gradient(135deg, var(--primary-color) 0%, #1e4220 100%);
    border: 2px solid var(--primary-light);
    border-radius: var(--border-radius);
    transition: all 0.2s ease;
}

.modern-device-dialog .e-btn.e-primary:hover[b-x4cwg85zm3] {
    border-color: var(--primary-light);
    box-shadow: 0 0.5rem 1rem rgb(44 95 45 / 30%);
    transform: translateY(-1px);
}

.modern-device-dialog .e-btn.e-primary:active[b-x4cwg85zm3] {
    transform: translateY(0);
}

.modern-device-dialog .e-btn.e-primary:disabled[b-x4cwg85zm3] {
    cursor: not-allowed;
    box-shadow: none;
    opacity: 0.6;
    transform: none;
}

.modern-device-dialog .e-btn.e-flat[b-x4cwg85zm3] {
    padding: 0.75rem 1.5rem;
    font-size: 0.875rem;
    font-weight: 500;
    color: var(--text-muted);
    text-transform: uppercase;
    letter-spacing: 0.3px;
    background: transparent;
    border: 2px solid var(--border-color);
    border-radius: var(--border-radius);
    transition: all 0.2s ease;
}

.modern-device-dialog .e-btn.e-flat:hover[b-x4cwg85zm3] {
    color: var(--primary-color);
    background: rgb(151 188 98 / 10%);
    border-color: var(--primary-light);
}

/* Loading spinner in button */
.modern-device-dialog .spinner-border-sm[b-x4cwg85zm3] {
    width: 0.875rem;
    height: 0.875rem;
    border-width: 0.125rem;
}

/* Responsive Design */
@media (width <= 768px) {
    .modern-device-dialog .e-dialog[b-x4cwg85zm3] {
        width: 95vw !important;
        height: 90vh !important;
        margin: 2.5vh auto;
    }
    
    .dialog-content[b-x4cwg85zm3] {
        padding: 1rem;
    }
    
    .modern-device-dialog .e-dataform[b-x4cwg85zm3] {
        padding: 1rem;
    }
    
    .modern-device-dialog .e-dataform .e-formgroup[b-x4cwg85zm3] {
        padding: 1rem;
        margin-bottom: 1.5rem;
    }
    
    .footer-actions[b-x4cwg85zm3] {
        flex-direction: column;
        width: 100%;
    }
    
    .footer-actions .e-btn[b-x4cwg85zm3] {
        width: 100%;
        margin: 0.25rem 0;
    }
}

/* Focus Management */
.modern-device-dialog .e-field:focus-visible[b-x4cwg85zm3] {
    outline: 2px solid var(--primary-light);
    outline-offset: 2px;
}

/* Animation for form groups */
.modern-device-dialog .e-dataform .e-formgroup[b-x4cwg85zm3] {
    animation: slideInUp-b-x4cwg85zm3 0.3s ease-out;
}

@keyframes slideInUp-b-x4cwg85zm3 {
    from {
        opacity: 0;
        transform: translateY(20px);
    }

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

/* Accessibility improvements */
.modern-device-dialog .indus-form__group .e-form-label[aria-required="true"][b-x4cwg85zm3]::after {
    font-weight: 700;
    color: var(--danger-color);
    content: " *";
}

/* Dark mode support disabled - always use light theme */
/*
@media (prefers-color-scheme: dark) {
    .modern-device-dialog {
        --border-color: #495057;
        --text-muted: #adb5bd;
        --shadow-sm: 0 0.125rem 0.25rem rgb(0 0 0 / 30%);
        --shadow-md: 0 0.5rem 1rem rgb(0 0 0 / 40%);
    }
    
    .dialog-content {
        color: white;
        background: #343a40;
    }
    
    .modern-device-dialog .e-dataform {
        background: #495057;
        border-color: #6c757d;
    }
    
    .modern-device-dialog .e-field {
        color: white;
        background: #6c757d;
        border-color: #495057;
    }
}
*/
/* /Components/Dialogs/RoleUserManagementDialog.razor.rz.scp.css */
/* RoleUserManagementDialog Styles */
.modern-role-user-dialog .e-dialog[b-cpryk35175] {
    border-radius: 12px;
    box-shadow: 0 8px 30px rgba(0, 0, 0, 0.12);
}

.modern-role-user-dialog .e-dlg-header[b-cpryk35175] {
    background: linear-gradient(135deg, #2c5f2d 0%, #97bc62 100%);
    color: white;
    padding: 20px 24px;
    border-radius: 12px 12px 0 0;
    font-weight: 600;
}

.modern-role-user-dialog .e-dlg-content[b-cpryk35175] {
    padding: 0;
    max-height: calc(100vh - 200px);
    overflow-y: auto;
}

.role-user-management[b-cpryk35175] {
    padding: 24px;
}

/* Role Selection Section */
.role-selection-section[b-cpryk35175] {
    margin-bottom: 32px;
    padding: 24px;
    background: #f8f9fa;
    border-radius: 8px;
    border-left: 4px solid #97bc62;
}

.section-header[b-cpryk35175] {
    margin-bottom: 16px;
}

.section-title[b-cpryk35175] {
    font-size: 1.25rem;
    font-weight: 600;
    color: #2c5f2d;
    margin: 0 0 8px 0;
}

.section-description[b-cpryk35175] {
    color: #6c757d;
    margin: 0;
    font-size: 0.9rem;
}

.role-selector[b-cpryk35175] {
    width: 100%;
}

.role-dropdown[b-cpryk35175] {
    width: 100%;
}

.role-item[b-cpryk35175] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 8px 0;
}

.role-info[b-cpryk35175] {
    display: flex;
    align-items: center;
    gap: 8px;
}

.role-name[b-cpryk35175] {
    font-weight: 500;
    color: #2c5f2d;
}

.system-badge[b-cpryk35175] {
    display: inline-flex;
    align-items: center;
    padding: 2px 8px;
    background: #e3f2fd;
    color: #1976d2;
    border-radius: 12px;
    font-size: 0.75rem;
    font-weight: 500;
}

.role-meta[b-cpryk35175] {
    font-size: 0.8rem;
    color: #6c757d;
}

.user-count[b-cpryk35175] {
    font-weight: 500;
}

/* Users Management Section */
.users-management-section[b-cpryk35175] {
    margin-top: 32px;
}

/* Statistics Section */
.stats-section[b-cpryk35175] {
    margin: 24px 0;
}

.stats-grid[b-cpryk35175] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 16px;
    margin-bottom: 24px;
}

.stat-card[b-cpryk35175] {
    background: white;
    border-radius: 12px;
    padding: 20px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
    border: 1px solid #e9ecef;
    transition: all 0.3s ease;
}

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

.stat-total[b-cpryk35175] {
    border-left: 4px solid #6c757d;
}

.stat-assigned[b-cpryk35175] {
    border-left: 4px solid #28a745;
}

.stat-available[b-cpryk35175] {
    border-left: 4px solid #17a2b8;
}

.stat-content[b-cpryk35175] {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.stat-info[b-cpryk35175] {
    flex: 1;
}

.stat-label[b-cpryk35175] {
    font-size: 0.85rem;
    color: #6c757d;
    margin: 0 0 4px 0;
    font-weight: 500;
}

.stat-value[b-cpryk35175] {
    font-size: 1.75rem;
    font-weight: 700;
    margin: 0;
    color: #2c5f2d;
}

.stat-icon[b-cpryk35175] {
    width: 48px;
    height: 48px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #f8f9fa;
    color: #6c757d;
    font-size: 1.2rem;
}

.stat-total .stat-icon[b-cpryk35175] {
    background: #6c757d20;
    color: #6c757d;
}

.stat-assigned .stat-icon[b-cpryk35175] {
    background: #28a74520;
    color: #28a745;
}

.stat-available .stat-icon[b-cpryk35175] {
    background: #17a2b820;
    color: #17a2b8;
}

/* Actions Section */
.actions-section[b-cpryk35175] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 24px;
    gap: 16px;
    flex-wrap: wrap;
}

.search-box[b-cpryk35175] {
    flex: 1;
    min-width: 250px;
}

.search-input[b-cpryk35175] {
    width: 100%;
}

.filter-buttons[b-cpryk35175] {
    display: flex;
    gap: 8px;
}

.filter-buttons .e-btn[b-cpryk35175] {
    min-width: 100px;
}

/* Users Grid Section */
.users-grid-section[b-cpryk35175] {
    background: white;
    border-radius: 8px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
    overflow: hidden;
}

.role-users-grid[b-cpryk35175] {
    border: none;
}

.role-users-grid .e-grid .e-gridheader[b-cpryk35175] {
    background: #f8f9fa;
    border-bottom: 2px solid #e9ecef;
}

.role-users-grid .e-grid .e-headercell[b-cpryk35175] {
    font-weight: 600;
    color: #2c5f2d;
    border-right: 1px solid #e9ecef;
}

.role-users-grid .e-grid .e-row[b-cpryk35175] {
    border-bottom: 1px solid #f1f3f4;
}

.role-users-grid .e-grid .e-row:hover[b-cpryk35175] {
    background: #f8f9fa;
}

.role-users-grid .e-grid .e-rowcell[b-cpryk35175] {
    border-right: 1px solid #f1f3f4;
    padding: 12px 16px;
}

/* User Name Cell */
.user-name-cell[b-cpryk35175] {
    display: flex;
    align-items: center;
    gap: 8px;
}

.user-icon[b-cpryk35175] {
    color: #6c757d;
    font-size: 1rem;
}

.user-name[b-cpryk35175] {
    font-weight: 500;
    color: #2c5f2d;
}

.locked-icon[b-cpryk35175] {
    color: #dc3545;
    font-size: 0.9rem;
}

/* Role Checkbox */
.role-checkbox[b-cpryk35175] {
    transform: scale(1.2);
}

.role-checkbox .e-check[b-cpryk35175] {
    border: 2px solid #97bc62;
}

.role-checkbox .e-check:checked[b-cpryk35175] {
    background: #97bc62;
    border-color: #97bc62;
}

/* Dialog Footer */
.dialog-footer[b-cpryk35175] {
    display: flex;
    justify-content: flex-end;
    gap: 12px;
    padding: 20px 24px;
    background: #f8f9fa;
    border-top: 1px solid #e9ecef;
}

.dialog-footer .e-btn[b-cpryk35175] {
    min-width: 120px;
    padding: 10px 20px;
    border-radius: 6px;
    font-weight: 500;
}

.dialog-footer .e-primary[b-cpryk35175] {
    background: linear-gradient(135deg, #2c5f2d 0%, #97bc62 100%);
    border: none;
    color: white;
}

.dialog-footer .e-primary:hover[b-cpryk35175] {
    background: linear-gradient(135deg, #1e4220 0%, #7ba350 100%);
}

/* Loading Container */
.loading-container[b-cpryk35175] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 60px 20px;
    text-align: center;
}

.loading-container .spinner-border[b-cpryk35175] {
    width: 3rem;
    height: 3rem;
    margin-bottom: 16px;
}

.loading-container p[b-cpryk35175] {
    color: #6c757d;
    font-size: 0.9rem;
    margin: 0;
}

/* Responsive Design */
@media (max-width: 768px) {
    .modern-role-user-dialog[b-cpryk35175] {
        width: 95vw !important;
        height: 90vh !important;
    }
    
    .role-user-management[b-cpryk35175] {
        padding: 16px;
    }
    
    .role-selection-section[b-cpryk35175] {
        padding: 16px;
    }
    
    .stats-grid[b-cpryk35175] {
        grid-template-columns: 1fr;
        gap: 12px;
    }
    
    .actions-section[b-cpryk35175] {
        flex-direction: column;
        align-items: stretch;
    }
    
    .filter-buttons[b-cpryk35175] {
        justify-content: center;
    }
    
    .filter-buttons .e-btn[b-cpryk35175] {
        flex: 1;
        min-width: auto;
    }
    
    .dialog-footer[b-cpryk35175] {
        flex-direction: column;
        gap: 8px;
    }
    
    .dialog-footer .e-btn[b-cpryk35175] {
        width: 100%;
    }
}

@media (max-width: 480px) {
    .users-grid-section[b-cpryk35175] {
        overflow-x: auto;
    }
    
    .role-users-grid[b-cpryk35175] {
        min-width: 600px;
    }
    
    .stat-content[b-cpryk35175] {
        flex-direction: column;
        align-items: flex-start;
        gap: 12px;
    }
    
    .stat-icon[b-cpryk35175] {
        align-self: flex-end;
    }
}
/* /Components/Dialogs/StockCountImportWithMappingDialog.razor.rz.scp.css */
.stock-count-import-wizard .dialog-content[b-3zedwc7d8u] {
  padding: 1.5rem;
  max-height: 75vh;
  overflow-y: auto;
}

.stock-count-import-wizard .wizard-stepper[b-3zedwc7d8u] {
  background: #f8f9fa;
  padding: 1.5rem;
  border-radius: 8px;
  margin-bottom: 1.5rem;
}

.stock-count-import-wizard .stepper-container[b-3zedwc7d8u] {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.stock-count-import-wizard .stepper-step[b-3zedwc7d8u] {
  display: flex;
  flex-direction: column;
  align-items: center;
  cursor: pointer;
  opacity: 0.6;
  transition: opacity 0.3s;
}

.stock-count-import-wizard .stepper-step.active[b-3zedwc7d8u],
.stock-count-import-wizard .stepper-step.completed[b-3zedwc7d8u] {
  opacity: 1;
}

.stock-count-import-wizard .step-icon[b-3zedwc7d8u] {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: #dee2e6;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: bold;
  color: #6c757d;
  margin-bottom: 0.5rem;
  transition: all 0.3s;
}

.stock-count-import-wizard .stepper-step.active .step-icon[b-3zedwc7d8u] {
  background: #0d6efd;
  color: #fff;
  box-shadow: 0 0 0 4px rgba(13, 110, 253, 0.2);
}

.stock-count-import-wizard .stepper-step.completed .step-icon[b-3zedwc7d8u] {
  background: #198754;
  color: #fff;
}

.stock-count-import-wizard .step-label[b-3zedwc7d8u] {
  font-size: 0.875rem;
  text-align: center;
  max-width: 120px;
}

.stock-count-import-wizard .stepper-line[b-3zedwc7d8u] {
  flex: 1;
  height: 2px;
  background: #dee2e6;
  margin: 0 1rem 1.5rem;
  transition: background 0.3s;
}

.stock-count-import-wizard .stepper-line.completed[b-3zedwc7d8u] {
  background: #198754;
}

.stock-count-import-wizard .wizard-step-content[b-3zedwc7d8u] { min-height: 400px; }

.stock-count-import-wizard .mapping-field-row[b-3zedwc7d8u] {
  display: flex;
  align-items: center;
  padding: 0.75rem;
  border: 1px solid #dee2e6;
  border-radius: 4px;
  margin-bottom: 0.5rem;
  background: #fff;
}

.stock-count-import-wizard .mapping-field-row:hover[b-3zedwc7d8u] { background: #f8f9fa; }

.stock-count-import-wizard .field-label[b-3zedwc7d8u] { flex: 0 0 200px; font-weight: 500; }
.stock-count-import-wizard .field-required[b-3zedwc7d8u] { color: #dc3545; margin-left: 0.25rem; }
.stock-count-import-wizard .mapping-mode-selector[b-3zedwc7d8u] { flex: 0 0 150px; margin-right: 1rem; }
.stock-count-import-wizard .mapping-value[b-3zedwc7d8u] { flex: 1; }

.stock-count-import-wizard .preview-summary-cards[b-3zedwc7d8u] {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 1rem;
  margin-bottom: 1.5rem;
}

.stock-count-import-wizard .summary-card[b-3zedwc7d8u] {
  border: 1px solid #dee2e6;
  border-radius: 8px;
  padding: 1rem;
  text-align: center;
  background: #fff;
  transition: transform 0.2s;
}

.stock-count-import-wizard .summary-card:hover[b-3zedwc7d8u] {
  transform: translateY(-2px);
  box-shadow: 0 4px 8px rgba(0,0,0,0.1);
}

.stock-count-import-wizard .summary-card.clickable[b-3zedwc7d8u] { cursor: pointer; }
.stock-count-import-wizard .summary-card.active[b-3zedwc7d8u] { border-color: #0d6efd; box-shadow: 0 0 0 2px rgba(13,110,253,0.2); }
.stock-count-import-wizard .summary-card-value[b-3zedwc7d8u] { font-size: 2rem; font-weight: bold; margin-bottom: 0.5rem; }
.stock-count-import-wizard .summary-card-label[b-3zedwc7d8u] { font-size: 0.875rem; color: #6c757d; }
.stock-count-import-wizard .loading-container[b-3zedwc7d8u] { padding: 3rem; }

/* /Components/Dialogs/TicketDataFormDialog.razor.rz.scp.css */
/* TicketDataFormDialog - Modern V2 Architecture Styling */

.ticket-data-form-dialog[b-x6dwuuq6wt] {
    border-radius: 12px;
    box-shadow: 0 8px 32px rgb(0 0 0 / 15%);
}

.ticket-data-form-dialog .e-dialog .e-dlg-header[b-x6dwuuq6wt] {
    padding: 1.25rem 1.5rem;
    font-size: 1.1rem;
    font-weight: 600;
    color: white;
    background: linear-gradient(135deg, #2c5f2d 0%, #3a7a3e 100%);
    border-bottom: 3px solid #97bc62;
    border-radius: 12px 12px 0 0;
}

.ticket-data-form-dialog .e-dialog .e-dlg-header .e-btn[b-x6dwuuq6wt] {
    font-size: 1.2rem;
    color: white;
    background: transparent;
    border: none;
}

.ticket-data-form-dialog .e-dialog .e-dlg-header .e-btn:hover[b-x6dwuuq6wt] {
    background: rgb(255 255 255 / 10%);
    border-radius: 50%;
}

/* Dialog Content */
.ticket-data-form-dialog .e-dialog .e-dlg-content[b-x6dwuuq6wt] {
    padding: 0;
    background: #fafbfc;
}

.dialog-content-wrapper[b-x6dwuuq6wt] {
    max-height: 580px;
    padding: 1.5rem;
    overflow-y: auto;
}

/* Loading State */
.loading-container[b-x6dwuuq6wt] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 300px;
    text-align: center;
}

.loading-text[b-x6dwuuq6wt] {
    margin-top: 1rem;
    font-size: 0.9rem;
    color: #6c757d;
}

/* Data Form Styling */
.indus-data-form[b-x6dwuuq6wt] {
    overflow: hidden;
    background: white;
    border-radius: 8px;
    box-shadow: 0 2px 8px rgb(0 0 0 / 10%);
}

/* Form Groups */
.ticket-data-form-dialog .e-form-group[b-x6dwuuq6wt] {
    padding: 1.5rem;
    margin-bottom: 0;
    background: white;
    border: none;
    border-bottom: 1px solid #e9ecef;
}

.ticket-data-form-dialog .e-form-group:last-child[b-x6dwuuq6wt] {
    border-bottom: none;
}

.ticket-data-form-dialog .e-form-group-header[b-x6dwuuq6wt] {
    padding-bottom: 0.5rem;
    margin-bottom: 1.5rem;
    font-size: 1.1rem;
    font-weight: 600;
    color: #2c5f2d;
    border-bottom: 2px solid #97bc62;
}

/* Form Items */
.ticket-data-form-dialog .e-form-item[b-x6dwuuq6wt] {
    margin-bottom: 1.5rem;
}

.ticket-data-form-dialog .e-form-item:last-child[b-x6dwuuq6wt] {
    margin-bottom: 0;
}

/* Input Controls */
.ticket-data-form-dialog .e-float-input[b-x6dwuuq6wt] {
    margin-bottom: 0;
}

.ticket-data-form-dialog .e-input-group[b-x6dwuuq6wt] {
    border: 1.5px solid #e1e5e9;
    border-radius: 6px;
    transition: all 0.2s ease;
}

.ticket-data-form-dialog .e-input-group:focus-within[b-x6dwuuq6wt] {
    border-color: #97bc62;
    box-shadow: 0 0 0 3px rgb(151 188 98 / 10%);
}

.ticket-data-form-dialog .e-input-group.e-error[b-x6dwuuq6wt] {
    border-color: #dc3545;
}

.ticket-data-form-dialog .e-input-group.e-error:focus-within[b-x6dwuuq6wt] {
    border-color: #dc3545;
    box-shadow: 0 0 0 3px rgb(220 53 69 / 10%);
}

/* Dialog Footer */
.dialog-footer[b-x6dwuuq6wt] {
    display: flex;
    gap: 1rem;
    justify-content: flex-end;
    padding: 1.5rem;
    background: #f8f9fa;
    border-top: 1px solid #e9ecef;
    border-radius: 0 0 12px 12px;
}

/* Buttons */
.save-btn[b-x6dwuuq6wt] {
    min-width: 120px;
    padding: 0.75rem 2rem;
    font-weight: 600;
    color: white;
    background: linear-gradient(135deg, #2c5f2d 0%, #97bc62 100%);
    border: none;
    border-radius: 6px;
    transition: all 0.2s ease;
}

.save-btn:hover:not(:disabled)[b-x6dwuuq6wt] {
    box-shadow: 0 4px 12px rgb(44 95 45 / 30%);
    transform: translateY(-1px);
}

.save-btn:disabled[b-x6dwuuq6wt] {
    cursor: not-allowed;
    opacity: 0.6;
    transform: none;
}

.cancel-btn[b-x6dwuuq6wt] {
    min-width: 120px;
    padding: 0.75rem 2rem;
    font-weight: 600;
    color: #6c757d;
    background: white;
    border: 1.5px solid #6c757d;
    border-radius: 6px;
    transition: all 0.2s ease;
}

.cancel-btn:hover[b-x6dwuuq6wt] {
    color: white;
    background: #6c757d;
    transform: translateY(-1px);
}

/* Responsive Design */
@media (width <= 768px) {
    .ticket-data-form-dialog[b-x6dwuuq6wt] {
        width: 95vw !important;
        height: auto !important;
    }

    .dialog-content-wrapper[b-x6dwuuq6wt] {
        padding: 1rem;
    }

    .ticket-data-form-dialog .e-form-group[b-x6dwuuq6wt] {
        padding: 1rem;
    }

    .dialog-footer[b-x6dwuuq6wt] {
        flex-direction: column-reverse;
        gap: 0.75rem;
        padding: 1rem;
    }

    .save-btn[b-x6dwuuq6wt],
    .cancel-btn[b-x6dwuuq6wt] {
        width: 100%;
        min-width: auto;
        padding: 1rem;
    }
}

/* Form Validation Messages */
.ticket-data-form-dialog .e-form-item .e-field-error-message[b-x6dwuuq6wt] {
    margin-top: 0.25rem;
    font-size: 0.875rem;
    color: #dc3545;
}

/* Enhanced Form Item Spacing */
.ticket-data-form-dialog .e-form-item .e-float-input .e-float-line[b-x6dwuuq6wt]::before,
.ticket-data-form-dialog .e-form-item .e-float-input .e-float-line[b-x6dwuuq6wt]::after {
    background: #97bc62;
}

/* Dropdown and ComboBox Enhancements */
.ticket-data-form-dialog .e-dropdownbase .e-list-item:hover[b-x6dwuuq6wt],
.ticket-data-form-dialog .e-dropdownbase .e-list-item.e-hover[b-x6dwuuq6wt] {
    color: #2c5f2d;
    background-color: rgb(151 188 98 / 10%);
}

.ticket-data-form-dialog .e-dropdownbase .e-list-item.e-active[b-x6dwuuq6wt] {
    color: white;
    background-color: #97bc62;
}

/* Success States */
.ticket-data-form-dialog .e-input-group.e-success[b-x6dwuuq6wt] {
    border-color: #28a745;
}

.ticket-data-form-dialog .e-input-group.e-success:focus-within[b-x6dwuuq6wt] {
    border-color: #28a745;
    box-shadow: 0 0 0 3px rgb(40 167 69 / 10%);
}

/* Focus Enhancement for Better Accessibility */
.ticket-data-form-dialog .e-form-item .e-input:focus[b-x6dwuuq6wt],
.ticket-data-form-dialog .e-form-item .e-ddl.e-input-focus .e-input[b-x6dwuuq6wt],
.ticket-data-form-dialog .e-form-item .e-numerictextbox.e-input-focus .e-input[b-x6dwuuq6wt] {
    outline: 2px solid #97bc62;
    outline-offset: 2px;
}
/* /Components/Dialogs/UnifiedProductSelectionDialog.razor.rz.scp.css */
.unified-product-selection-dialog[b-yjonilllj7]  .e-dlg-content {
    padding: 0.75rem;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.unified-product-selection-dialog[b-yjonilllj7]  .e-dlg-header-content {
    border-bottom: 1px solid #e2e8f0;
}

.unified-product-selection-dialog[b-yjonilllj7]  .e-footer-content {
    border-top: 1px solid #e2e8f0;
    padding: 0.75rem 1rem;
}
/* /Components/Layout/MainLayout.razor.rz.scp.css */
.page[b-xe9j7eb81o] {
    position: relative;
    display: flex;
    flex-direction: column;
}

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

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

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

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

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

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

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

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

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

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

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

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

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

/* /Components/Pages/Admin/EmailTemplates.razor.rz.scp.css */
/* EmailTemplates.razor component styles */

/* SMTP Configuration Dropdown Styling - Enhanced */
.smtp-config-dropdown[b-1iw8d31ggm] {
    display: block !important;
    width: 100% !important;
}

.smtp-config-dropdown .e-dropdownlist[b-1iw8d31ggm] {
    border: 2px solid #d1d5db !important;
    border-radius: 0.5rem !important;
    background-color: #ffffff !important;
    color: #1f2937 !important;
    min-height: 42px !important;
    font-size: 14px !important;
    font-weight: 500 !important;
}

.smtp-config-dropdown .e-input-group[b-1iw8d31ggm] {
    border: none !important;
    background-color: #ffffff !important;
}

.smtp-config-dropdown .e-input-group .e-input[b-1iw8d31ggm] {
    color: #1f2937 !important;
    background-color: #ffffff !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    padding: 10px 12px !important;
    border: none !important;
}

.smtp-config-dropdown .e-input-group .e-input[b-1iw8d31ggm]::placeholder {
    color: #6b7280 !important;
    font-weight: 400 !important;
}

/* Dropdown arrow icon */
.smtp-config-dropdown .e-ddl-icon[b-1iw8d31ggm] {
    color: #4b5563 !important;
    font-size: 16px !important;
    right: 12px !important;
}

.smtp-config-dropdown .e-ddl-icon[b-1iw8d31ggm]:before {
    content: "▼" !important;
    font-size: 12px !important;
}

/* Focus state */
.smtp-config-dropdown .e-input-group.e-input-focus[b-1iw8d31ggm],
.smtp-config-dropdown .e-dropdownlist.e-input-focus[b-1iw8d31ggm] {
    border-color: #3b82f6 !important;
    box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1) !important;
}

/* Hover state */
.smtp-config-dropdown .e-dropdownlist:hover[b-1iw8d31ggm] {
    border-color: #9ca3af !important;
}

/* Dropdown popup styling */
.smtp-config-dropdown .e-popup[b-1iw8d31ggm],
.e-popup.smtp-config-dropdown-popup[b-1iw8d31ggm] {
    border: 2px solid #e5e7eb !important;
    border-radius: 0.5rem !important;
    box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04) !important;
    background-color: #ffffff !important;
    margin-top: 4px !important;
}

/* Dropdown list items */
.smtp-config-dropdown .e-list-item[b-1iw8d31ggm],
.e-popup.smtp-config-dropdown-popup .e-list-item[b-1iw8d31ggm] {
    color: #1f2937 !important;
    background-color: #ffffff !important;
    padding: 12px 16px !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    border-bottom: 1px solid #f3f4f6 !important;
    min-height: 44px !important;
    display: flex !important;
    align-items: center !important;
}

.smtp-config-dropdown .e-list-item:last-child[b-1iw8d31ggm],
.e-popup.smtp-config-dropdown-popup .e-list-item:last-child[b-1iw8d31ggm] {
    border-bottom: none !important;
}

.smtp-config-dropdown .e-list-item:hover[b-1iw8d31ggm],
.e-popup.smtp-config-dropdown-popup .e-list-item:hover[b-1iw8d31ggm] {
    background-color: #f8fafc !important;
    color: #1e40af !important;
}

.smtp-config-dropdown .e-list-item.e-active[b-1iw8d31ggm],
.e-popup.smtp-config-dropdown-popup .e-list-item.e-active[b-1iw8d31ggm] {
    background-color: #3b82f6 !important;
    color: #ffffff !important;
    font-weight: 600 !important;
}

.smtp-config-dropdown .e-list-item.e-item-focus[b-1iw8d31ggm],
.e-popup.smtp-config-dropdown-popup .e-list-item.e-item-focus[b-1iw8d31ggm] {
    background-color: #eff6ff !important;
    color: #1d4ed8 !important;
}

/* Clear button styling */
.smtp-config-dropdown .e-clear-icon[b-1iw8d31ggm] {
    color: #6b7280 !important;
    font-size: 16px !important;
    right: 40px !important;
}

.smtp-config-dropdown .e-clear-icon:hover[b-1iw8d31ggm] {
    color: #374151 !important;
    background-color: #f3f4f6 !important;
    border-radius: 50% !important;
}

/* Disabled state */
.smtp-config-dropdown .e-input-group.e-disabled[b-1iw8d31ggm],
.smtp-config-dropdown .e-dropdownlist.e-disabled[b-1iw8d31ggm] {
    background-color: #f9fafb !important;
    border-color: #e5e7eb !important;
    color: #9ca3af !important;
    cursor: not-allowed !important;
}

/* Loading state */
.smtp-config-dropdown .e-spinner-pane[b-1iw8d31ggm] {
    background-color: rgba(255, 255, 255, 0.8) !important;
}

/* Custom styling for better visibility */
.smtp-config-dropdown-container[b-1iw8d31ggm] {
    position: relative;
    z-index: 1;
}

/* Responsive adjustments */
@media (max-width: 640px) {
    .smtp-config-dropdown .e-input-group .e-input[b-1iw8d31ggm] {
        font-size: 16px !important; /* Prevent zoom on iOS */
        padding: 12px 14px !important;
    }
    
    .smtp-config-dropdown .e-dropdownlist[b-1iw8d31ggm] {
        min-height: 48px !important;
    }
}
/* /Components/Pages/Assets/Accessories.razor.rz.scp.css */
/* 🛠️ ACCESSORIES PAGE - INHERITS FROM INDUSX-FOUNDATION
   Minimal overrides - Foundation handles 95% of styling */

/* 🔧 Badge Integration Enhancement */
:deep(.indus-grid--accessory .tw-badge)[b-5uymyrmax7] {
    display: inline-flex;
    align-items: center;
    padding: 0.25rem 0.75rem;
    border-radius: 0.375rem;
    font-size: 0.75rem;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

/* 📱 Accessory-Specific Mobile Adjustments */
@media (max-width: 768px) {
    :deep(.indus-grid--accessory .tw-badge)[b-5uymyrmax7] {
        font-size: 0.65rem;
        padding: 0.125rem 0.5rem;
    }
}
/* /Components/Pages/Assets/DeviceDetails.razor.rz.scp.css */
/* DeviceDetails.razor.css */

.device-details-page[b-f8q6fsiqok] {
    padding: 1.25rem;
    max-width: 80rem;
    margin: 0 auto;
}

/* Device Horizontal Card Styling */
.device-horizontal-card[b-f8q6fsiqok] {
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
    background: white;
    overflow: hidden;
    position: relative;
    /* Override any primary color variables */
    --indus-primary: #f8fafc !important;
    --indus-primary-dark: #e5e7eb !important;
    --indus-primary-light: #f3f4f6 !important;
}

.device-horizontal-card .e-card-stacked[b-f8q6fsiqok] {
    flex: 1;
    padding: 0;
}

/* Target CardHeader through Syncfusion classes - Force Gray Override */
.device-horizontal-card .e-card-header[b-f8q6fsiqok],
.device-horizontal-card .e-card-header-caption[b-f8q6fsiqok],
.device-horizontal-card .e-card .e-card-header[b-f8q6fsiqok],
.device-horizontal-card .e-card .e-card-header-caption[b-f8q6fsiqok] {
    background: #f8fafc !important;
    background-color: #f8fafc !important;
    background-image: none !important;
    padding: 0 !important;
    border-bottom: 1px solid #e5e7eb !important;
    border-radius: 8px 0 0 0 !important;
    /* Override any CSS variables */
    --indus-primary: #f8fafc !important;
}

/* Device Card Header Content - Enhanced for Longer Text - v2 */
.device-card-header[b-f8q6fsiqok] {
    background: transparent !important;
    background-color: transparent !important;
    padding: 1.5rem 1.5rem !important;
    border-bottom: none !important;
    display: flex !important;
    align-items: flex-start !important; /* Changed from center to flex-start */
    justify-content: space-between !important;
    min-height: 120px; /* Increased from 80px to 120px */
    width: 100%;
    gap: 1rem; /* Add gap between title and status sections */
}

.device-title-section[b-f8q6fsiqok] {
    flex: 1;
    min-width: 0; /* Allow text to wrap properly */
}

.device-status-section[b-f8q6fsiqok] {
    display: flex;
    align-items: flex-start; /* Changed from center to flex-start */
    flex-shrink: 0; /* Prevent shrinking */
}

/* Device Name Styling - Matching Screenshot */
.device-name[b-f8q6fsiqok] {
    font-size: 1.5rem;
    font-weight: 700;
    color: #2d3748;
    margin: 0 0 0.5rem 0;
    line-height: 1.2;
}

/* Device Badges Row - Enhanced for Better Text Handling */
.device-badges-row[b-f8q6fsiqok] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem; /* Increased gap */
    align-items: flex-start; /* Changed from center */
    margin-top: 0.75rem; /* Add margin for better spacing */
    min-height: 3rem; /* Ensure adequate height for badges */
}

/* IndusBadge styles will handle badge appearance - no conflicts */

/* Card Content */
.device-horizontal-card .e-card-content[b-f8q6fsiqok] {
    padding: 1rem 1.5rem;
    background: white;
}

/* Device Info Grid - Redesigned */
.device-info-grid[b-f8q6fsiqok] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 1rem;
}

.info-item[b-f8q6fsiqok] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    padding: 0.75rem;
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 6px;
    transition: all 0.2s ease;
}

.info-item:hover[b-f8q6fsiqok] {
    background: white;
    border-color: #cbd5e1;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
}

.info-label[b-f8q6fsiqok] {
    font-size: 0.75rem;
    font-weight: 600;
    color: #64748b;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.info-value[b-f8q6fsiqok] {
    font-size: 0.875rem;
    font-weight: 600;
    color: #1e293b;
}

/* QR Section - Redesigned */
.device-horizontal-card .qr-section[b-f8q6fsiqok] {
    width: 280px;
    min-width: 280px;
    background: white;
    border-left: 1px solid #e2e8f0;
    display: flex;
    flex-direction: column;
    position: relative;
}

.qr-header[b-f8q6fsiqok] {
    background: #2d3748;
    color: white;
    padding: 0.75rem 1rem;
    text-align: center;
    font-weight: 600;
    font-size: 0.875rem;
}

.qr-title[b-f8q6fsiqok] {
    color: white;
    font-weight: 600;
}

.qr-content[b-f8q6fsiqok] {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1.5rem;
}

/* Warranty Status Colors */
.warranty-valid[b-f8q6fsiqok] {
    color: #059669;
}

.warranty-expiring[b-f8q6fsiqok] {
    color: #d97706;
}

.warranty-expired[b-f8q6fsiqok] {
    color: #dc2626;
}

/* QR Section Styling */
.qr-section .e-btn[b-f8q6fsiqok] {
    margin: 0 0.0625rem;
}

/* Timeline Styling */
.timeline-container[b-f8q6fsiqok] {
    position: relative;
    max-height: 400px;
    overflow-y: auto;
    padding-right: 1rem;
}

.timeline-item[b-f8q6fsiqok] {
    position: relative;
    padding-left: 2rem;
    padding-bottom: 1.5rem;
}

.timeline-item:not(:last-child)[b-f8q6fsiqok]::before {
    content: '';
    position: absolute;
    left: 0.5rem;
    top: 1.5rem;
    bottom: -0.5rem;
    width: 2px;
    background: #e2e8f0;
}

.timeline-dot[b-f8q6fsiqok] {
    position: absolute;
    left: 0;
    top: 0.5rem;
    width: 1rem;
    height: 1rem;
    background: #3b82f6;
    border-radius: 50%;
    border: 2px solid white;
    box-shadow: 0 0 0 2px #e2e8f0;
}

.timeline-content[b-f8q6fsiqok] {
    background: white;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    padding: 1rem;
}

.timeline-date[b-f8q6fsiqok] {
    font-size: 0.875rem;
    font-weight: 600;
    color: #3b82f6;
    margin-bottom: 0.25rem;
}

.timeline-location[b-f8q6fsiqok] {
    font-size: 1rem;
    font-weight: 600;
    color: #466493;
    margin-bottom: 0.5rem;
}

.timeline-notes[b-f8q6fsiqok] {
    font-size: 0.875rem;
    color: #64748b;
    line-height: 1.5;
}

/* Tab Content Styling */
.device-content-tabs[b-f8q6fsiqok] {
    background: white;
    border-radius: 8px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
}

.device-content-tabs .e-tab-header[b-f8q6fsiqok] {
    background: #f8fafc;
    border-bottom: 1px solid #e2e8f0;
}

.device-content-tabs .e-content[b-f8q6fsiqok] {
    min-height: 400px;
}

/* Empty State */
.empty-state[b-f8q6fsiqok] {
    text-align: center;
    padding: 3rem 1rem;
    color: #64748b;
}

/* Floating Action Button */
.fab-container[b-f8q6fsiqok] {
    position: fixed;
    bottom: 2rem;
    right: 2rem;
    z-index: 1000;
}

/* Responsive Design */
@media (max-width: 768px) {
    .device-horizontal-card[b-f8q6fsiqok] {
        flex-direction: column;
    }
    
    .device-horizontal-card .qr-section[b-f8q6fsiqok] {
        width: 100%;
        min-width: auto;
        border-left: none;
        border-top: 1px solid #e2e8f0;
        padding: 1rem;
    }
    
    .info-stat[b-f8q6fsiqok] {
        margin-bottom: 1rem;
    }
    
    .timeline-container[b-f8q6fsiqok] {
        max-height: 300px;
    }
    
    .fab-container[b-f8q6fsiqok] {
        bottom: 1rem;
        right: 1rem;
    }
}

/* Grid Styling */
.modern-grid[b-f8q6fsiqok] {
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
}

.modern-grid .e-grid .e-gridheader[b-f8q6fsiqok] {
    background: #f8fafc;
    border-bottom: 1px solid #e2e8f0;
}

.modern-grid .e-grid .e-gridcontent[b-f8q6fsiqok] {
    background: white;
}

/* Syncfusion component styling */
.device-details-page .e-card[b-f8q6fsiqok] {
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
    border: 1px solid #e5e7eb;
    border-radius: 8px;
}

.device-details-page .e-card .e-card-header[b-f8q6fsiqok] {
    background-color: #f9fafb;
    border-bottom: 1px solid #e5e7eb;
}

/* Clean box model */
.device-details-page *[b-f8q6fsiqok] {
    box-sizing: border-box;
}

/* Enhanced Responsive Design for Device Card */
@media (max-width: 768px) {
    .device-horizontal-card[b-f8q6fsiqok] {
        flex-direction: column;
    }
    
    .device-horizontal-card .qr-section[b-f8q6fsiqok] {
        width: 100%;
        min-width: auto;
        border-left: none;
        border-top: 1px solid #e2e8f0;
        padding: 1rem;
    }
    
    .device-name[b-f8q6fsiqok] {
        font-size: 1rem;
    }
    
    .device-model[b-f8q6fsiqok] {
        font-size: 0.75rem;
    }
    
    /* IndusBadge component handles its own responsive sizing */
    
    .qr-action-btn[b-f8q6fsiqok] {
        width: 28px !important;
        height: 28px !important;
        min-width: 28px !important;
    }
    
    .qr-action-btn .fas[b-f8q6fsiqok] {
        font-size: 10px;
    }
    
    .info-stat[b-f8q6fsiqok] {
        margin-bottom: 0.5rem;
    }
    
    .timeline-container[b-f8q6fsiqok] {
        max-height: 300px;
    }
    
    .fab-container[b-f8q6fsiqok] {
        bottom: 1rem;
        right: 1rem;
    }
}

/* Enhanced responsive styles for device header */
@media (max-width: 768px) {
    .device-card-header[b-f8q6fsiqok] {
        min-height: 140px !important; /* Even more height on mobile */
        padding: 1rem 1rem !important;
        flex-direction: column;
        align-items: flex-start !important;
        gap: 1rem;
    }
    
    .device-status-section[b-f8q6fsiqok] {
        align-self: stretch;
        justify-content: flex-start;
    }
    
    .device-badges-row[b-f8q6fsiqok] {
        gap: 0.5rem;
        margin-top: 0.5rem;
    }
    
    .device-name[b-f8q6fsiqok] {
        font-size: 1.25rem;
        margin-bottom: 0.75rem;
    }
}

@media (max-width: 480px) {
    .device-card-header[b-f8q6fsiqok] {
        min-height: 160px !important;
        padding: 0.75rem !important;
    }
    
    .device-name[b-f8q6fsiqok] {
        font-size: 1.125rem;
        line-height: 1.3;
    }
}
/* /Components/Pages/Assets/Devices.razor.rz.scp.css */
/* 🖥️ DEVICES PAGE - INHERITS FROM INDUSX-FOUNDATION
   Minimal overrides - Foundation handles 95% of styling */

/* 🔧 Device Badge Enhancement */
:deep(.indus-grid--device .tw-badge)[b-gmbl12bx00] {
    display: inline-flex;
    align-items: center;
    padding: 0.25rem 0.75rem;
    border-radius: 0.375rem;
    font-size: 0.75rem;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

/* 🎯 Device-Specific Priority Badges */
.indus-badge--priority[b-gmbl12bx00] {
    display: inline-block;
    padding: 0.25rem 0.5rem;
    font-size: 0.75rem;
    font-weight: 500;
    text-transform: uppercase;
    border-radius: 0.25rem;
}

.indus-badge--priority-low[b-gmbl12bx00] { color: #0c5460; background: #d1ecf1; }
.indus-badge--priority-normal[b-gmbl12bx00] { color: #155724; background: #d4edda; }
.indus-badge--priority-high[b-gmbl12bx00] { color: #856404; background: #fff3cd; }
.indus-badge--priority-urgent[b-gmbl12bx00] { color: #721c24; background: #f8d7da; }

/* 🎯 Device Status Badges */
.indus-badge--status[b-gmbl12bx00] {
    display: inline-block;
    padding: 0.25rem 0.5rem;
    font-size: 0.75rem;
    font-weight: 500;
    text-transform: uppercase;
    border-radius: 0.25rem;
}

.status-active[b-gmbl12bx00] { color: #155724; background: #d4edda; }
.status-inactive[b-gmbl12bx00] { color: #721c24; background: #f8d7da; }
.status-maintenance[b-gmbl12bx00] { color: #856404; background: #fff3cd; }

/* 📱 Device-Specific Mobile Adjustments */
@media (max-width: 768px) {
    :deep(.indus-grid--device .tw-badge)[b-gmbl12bx00] {
        font-size: 0.65rem;
        padding: 0.125rem 0.5rem;
    }
    
    .indus-badge--priority[b-gmbl12bx00],
    .indus-badge--status[b-gmbl12bx00] {
        font-size: 0.65rem;
        padding: 0.125rem 0.375rem;
    }
}
/* /Components/Pages/Auth/Login.razor.rz.scp.css */
/* ========================================
   IndusX ERP - Beautiful Login Page Styles
   ======================================== */

/* Design tokens: define on the component root so CSS isolation doesn’t drop them. */
.login-section[b-04ehmzx1jz] {
    --primary-gradient: linear-gradient(135deg, #1e3a8a 0%, #1e40af 25%, #2563eb 50%, #3b82f6 75%, #60a5fa 100%);
    --primary-color: #1e3a8a;
    --primary-light: #3b82f6;
    --primary-dark: #1e40af;
    --white: #ffffff;
    --gray-50: #f9fafb;
    --gray-100: #f3f4f6;
    --gray-200: #e5e7eb;
    --gray-300: #d1d5db;
    --gray-400: #9ca3af;
    --gray-500: #6b7280;
    --gray-600: #4b5563;
    --gray-700: #374151;
    --gray-800: #1f2937;
    --gray-900: #111827;
    --red-50: #fef2f2;
    --red-500: #ef4444;
    --red-600: #dc2626;
    --shadow-soft: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
    --shadow-medium: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
    --shadow-large: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
    --border-radius: 12px;
    --border-radius-lg: 16px;
    --border-radius-xl: 20px;
    --transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    --font-family: 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Helvetica Neue', Arial, sans-serif;
}

/* Layout: stack on small screens, 7/5 split on >=1024px */
.layout-grid[b-04ehmzx1jz] {
    /* Mobile-first: flex column so we can control order */
    display: flex;
    flex-direction: column;
    min-height: 100vh;
    align-items: stretch;
}

@media (min-width: 1024px) {
    .layout-grid[b-04ehmzx1jz] {
        display: grid;
        grid-template-columns: 7fr 5fr;
    }
    .hero-section[b-04ehmzx1jz] {
        display: block;
        order: 0; /* reset any mobile order */
    }
    .form-section[b-04ehmzx1jz] { order: 0; }
}

/* Login Section Container */
.login-section[b-04ehmzx1jz] {
    font-family: var(--font-family);
    /* Layer subtle page backdrop gradients for a premium feel */
    background:
        radial-gradient(60% 50% at 110% -10%, rgba(30, 58, 138, 0.08) 0%, rgba(30, 58, 138, 0) 60%),
        radial-gradient(40% 40% at -10% 110%, rgba(59, 130, 246, 0.08) 0%, rgba(59, 130, 246, 0) 60%),
        var(--gray-50);
    min-height: 100vh;
    overflow: hidden;
    /* subtle ambient glow */
    box-shadow: inset 0 0 80px rgba(30, 58, 138, 0.06);
}

/* Grid is handled via Tailwind classes in markup; this media rule keeps heights consistent */
@media (min-width: 992px) {
    .login-section .hero-section[b-04ehmzx1jz],
    .login-section .form-section[b-04ehmzx1jz] {
        height: 100vh;
        display: flex;              /* make inner container stretch */
        flex-direction: column;
    }
}

/* ========================================
   HERO SECTION (LEFT SIDE)
   ======================================== */

.hero-section[b-04ehmzx1jz] {
    position: relative;
    min-height: 100vh;
}

.hero-background[b-04ehmzx1jz] {
    background: var(--primary-gradient);
    position: relative;
    overflow: hidden;
    flex: 1 1 auto;               /* stretch inside column */
    height: 100%;
    min-height: 100%;
}

/* soft vertical sheen across left hero */
.hero-background[b-04ehmzx1jz]::before {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(120deg, rgba(255,255,255,0.08) 0%, rgba(255,255,255,0) 40% 60%, rgba(0,0,0,0.06) 100%);
    pointer-events: none;
}

/* Animated Background Pattern */
.hero-pattern[b-04ehmzx1jz] {
    background-image: 
        radial-gradient(circle at 25% 25%, rgba(255, 255, 255, 0.1) 2px, transparent 2px),
        radial-gradient(circle at 75% 75%, rgba(255, 255, 255, 0.05) 1px, transparent 1px);
    background-size: 60px 60px, 30px 30px;
    animation: patternMove-b-04ehmzx1jz 20s linear infinite;
    opacity: 0.6;
}

@keyframes patternMove-b-04ehmzx1jz {
    0% { transform: translate(0, 0); }
    100% { transform: translate(60px, 60px); }
}

/* Floating Elements */
.floating-elements[b-04ehmzx1jz] {
    position: absolute;
    width: 100%;
    height: 100%;
    overflow: hidden;
    pointer-events: none;
}

.floating-circle[b-04ehmzx1jz] {
    position: absolute;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.1);
    backdrop-filter: blur(10px);
    border: 1px solid rgba(255, 255, 255, 0.2);
    box-shadow: 0 12px 28px rgba(0, 0, 0, 0.12), 0 0 28px rgba(255, 255, 255, 0.08);
}

.floating-circle-1[b-04ehmzx1jz] {
    width: 120px;
    height: 120px;
    top: 15%;
    left: 10%;
    animation: float1-b-04ehmzx1jz 8s ease-in-out infinite;
}

.floating-circle-2[b-04ehmzx1jz] {
    width: 80px;
    height: 80px;
    top: 60%;
    right: 15%;
    animation: float2-b-04ehmzx1jz 6s ease-in-out infinite;
}

.floating-circle-3[b-04ehmzx1jz] {
    width: 150px;
    height: 150px;
    bottom: 10%;
    left: 20%;
    animation: float3-b-04ehmzx1jz 10s ease-in-out infinite;
}

@keyframes float1-b-04ehmzx1jz {
    0%, 100% { transform: translateY(0px) translateX(0px); }
    33% { transform: translateY(-20px) translateX(10px); }
    66% { transform: translateY(10px) translateX(-5px); }
}

@keyframes float2-b-04ehmzx1jz {
    0%, 100% { transform: translateY(0px) translateX(0px); }
    50% { transform: translateY(-15px) translateX(15px); }
}

@keyframes float3-b-04ehmzx1jz {
    0%, 100% { transform: translateY(0px) translateX(0px); }
    25% { transform: translateY(10px) translateX(-10px); }
    75% { transform: translateY(-10px) translateX(5px); }
}

/* Hero Content */
.hero-content[b-04ehmzx1jz] {
    z-index: 10;
    max-width: 520px;            /* closer to form card width */
    margin: 0 auto;
}

.brand-section[b-04ehmzx1jz] {
    margin-bottom: 3rem;
}

.logo-container[b-04ehmzx1jz] {
    background: rgba(255, 255, 255, 0.15);
    border-radius: var(--border-radius);
    padding: 12px;
    backdrop-filter: blur(10px);
    border: 1px solid rgba(255, 255, 255, 0.2);
    transition: var(--transition);
}

.logo-container:hover[b-04ehmzx1jz] {
    transform: translateY(-2px);
    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.15);
}

.logo-icon[b-04ehmzx1jz] {
    display: block;
    filter: drop-shadow(0 2px 4px rgba(0, 0, 0, 0.1));
}

.brand-title[b-04ehmzx1jz] {
    color: var(--white);
    font-size: 2rem;
    font-weight: 800;
    letter-spacing: -0.025em;
    text-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

.hero-title[b-04ehmzx1jz] {
    color: var(--white);
    font-size: 2.5rem;
    font-weight: 700;
    line-height: 1.2;
    margin-bottom: 1.5rem;
    text-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

.hero-subtitle[b-04ehmzx1jz] {
    color: rgba(255, 255, 255, 0.9);
    font-size: 1.25rem;
    line-height: 1.6;
    font-weight: 400;
    max-width: 480px;
    margin: 0 auto 3rem;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
}

/* Feature Cards */
.feature-cards[b-04ehmzx1jz] {
    margin-top: 3rem;
}

.feature-card[b-04ehmzx1jz] {
    background: rgba(255, 255, 255, 0.12);
    backdrop-filter: blur(12px);
    border: 1px solid rgba(255, 255, 255, 0.15);
    border-radius: var(--border-radius);
    padding: 1.5rem 1rem;
    text-align: center;
    transition: var(--transition);
    height: 100%;
}

.feature-card:hover[b-04ehmzx1jz] {
    background: rgba(255, 255, 255, 0.18);
    transform: translateY(-4px);
    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.15);
}

.feature-icon[b-04ehmzx1jz] {
    color: var(--white);
    opacity: 0.9;
    transition: var(--transition);
}

.feature-card:hover .feature-icon[b-04ehmzx1jz] {
    opacity: 1;
    transform: scale(1.1);
}

.feature-title[b-04ehmzx1jz] {
    color: var(--white);
    font-size: 0.875rem;
    font-weight: 600;
    margin: 0;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
}

/* ========================================
   FORM SECTION (RIGHT SIDE)
   ======================================== */

.form-section[b-04ehmzx1jz] {
    background: linear-gradient(135deg, #fafbfc 0%, #f3f4f6 100%);
    position: relative;
}

.form-background[b-04ehmzx1jz] {
    background: 
        radial-gradient(circle at 20% 20%, rgba(30, 58, 138, 0.03) 0%, transparent 50%),
        radial-gradient(circle at 80% 80%, rgba(59, 130, 246, 0.03) 0%, transparent 50%);
    min-height: 100vh;
    height: 100%;
    flex: 1 1 auto;
    padding: 2rem;
}

.login-form-container[b-04ehmzx1jz] {
    /* Glassy card with gradient border */
    background:
        linear-gradient(#ffffff, #ffffff) padding-box,
        linear-gradient(135deg, rgba(30,58,138,0.25), rgba(59,130,246,0.2)) border-box;
    border: 1px solid transparent;
    border-radius: var(--border-radius-xl);
    padding: 3rem;
    box-shadow: 0 12px 24px rgba(16, 24, 40, 0.10), 0 4px 12px rgba(16, 24, 40, 0.06);
    max-width: 520px;            /* match hero content width */
    width: 100%;
    position: relative;
    overflow: hidden;
}

.login-form-container[b-04ehmzx1jz]::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 4px;
    background: var(--primary-gradient);
}

/* soft gradient glow behind the card */
.login-form-container[b-04ehmzx1jz]::after {
    content: '';
    position: absolute;
    inset: -40px -40px auto -40px;
    height: 120px;
    background: radial-gradient(60% 60% at 50% 0%, rgba(30, 58, 138, 0.15) 0%, rgba(59, 130, 246, 0.08) 35%, rgba(255,255,255,0) 70%);
    filter: blur(22px);
    z-index: 0;
}

/* Form Header */
.form-header[b-04ehmzx1jz] {
    margin-bottom: 2.5rem;
}

.form-logo-container[b-04ehmzx1jz] {
    background: rgba(30, 58, 138, 0.1);
    border-radius: 8px;
    padding: 6px;
    transition: var(--transition);
    box-shadow: inset 0 -1px 0 rgba(255,255,255,0.6);
}

.form-brand-title[b-04ehmzx1jz] {
    color: var(--primary-color);
    font-size: 1.125rem;
    font-weight: 700;
    letter-spacing: 0.025em;
}

.form-title[b-04ehmzx1jz] {
    color: var(--gray-900);
    font-size: 1.875rem;
    font-weight: 700;
    letter-spacing: -0.025em;
    margin-bottom: 0.75rem;
}

.form-subtitle[b-04ehmzx1jz] {
    color: var(--gray-600);
    font-size: 0.9375rem;
    line-height: 1.5;
    margin: 0;
}

/* Error Alert */
.error-alert[b-04ehmzx1jz] {
    background: var(--red-50);
    border: 1px solid #fecaca;
    border-radius: var(--border-radius);
    padding: 1rem;
    color: var(--red-600);
    font-size: 0.875rem;
    font-weight: 500;
}

.error-alert svg[b-04ehmzx1jz] {
    color: var(--red-500);
    flex-shrink: 0;
}

/* Form Styles */
.login-form[b-04ehmzx1jz] {
    width: 100%;
}

.form-group[b-04ehmzx1jz] {
    position: relative;
}

.form-label[b-04ehmzx1jz] {
    display: block;
    color: var(--gray-700);
    font-size: 0.875rem;
    font-weight: 600;
    margin-bottom: 0.5rem;
    letter-spacing: 0.025em;
}

/* Input Wrapper with Icon */
.input-wrapper[b-04ehmzx1jz] {
    position: relative;
}

.input-icon[b-04ehmzx1jz] {
    position: absolute;
    left: 1rem;
    top: 50%;
    transform: translateY(-50%);
    color: var(--gray-400);
    pointer-events: none;
    z-index: 5;
    transition: var(--transition);
}

.input-wrapper:focus-within .input-icon[b-04ehmzx1jz] {
    color: var(--primary-dark);
}

/* Custom Input Styles - robust for Syncfusion wrappers */
/* Wrapper (e.g., e-input-group/e-control-wrapper) */
[b-04ehmzx1jz] .custom-input,
[b-04ehmzx1jz] .custom-input.e-input-group,
[b-04ehmzx1jz] .custom-input.e-control-wrapper,
[b-04ehmzx1jz] .custom-input .e-input-group,
[b-04ehmzx1jz] .custom-input .e-control-wrapper {
    border: 2px solid var(--gray-200) !important;
    border-radius: var(--border-radius) !important;
    background: var(--white) !important;
    transition: var(--transition) !important;
    box-shadow: none !important;
}

/* Inner input element */
[b-04ehmzx1jz] .custom-input .e-input,
[b-04ehmzx1jz] .custom-input input {
    height: 52px !important;
    font-size: 0.9375rem !important;
    font-weight: 500 !important;
    padding-left: 2.75rem !important;
    padding-right: 1rem !important;
    color: var(--gray-900) !important;
}

/* Placeholder color for better legibility */
[b-04ehmzx1jz] .custom-input .e-input::placeholder,
[b-04ehmzx1jz] .custom-input input::placeholder {
    color: var(--gray-400) !important;
}

/* Hover state on wrapper */
[b-04ehmzx1jz] .custom-input:hover,
[b-04ehmzx1jz] .custom-input .e-input-group:hover,
[b-04ehmzx1jz] .custom-input .e-control-wrapper:hover {
    border-color: var(--gray-300) !important;
}

/* Focus state on wrapper */
[b-04ehmzx1jz] .custom-input:focus-within,
[b-04ehmzx1jz] .custom-input.e-input-focus,
[b-04ehmzx1jz] .custom-input .e-input-group.e-input-focus,
[b-04ehmzx1jz] .custom-input .e-control-wrapper.e-input-focus {
    border-color: var(--primary-color) !important;
    box-shadow: 0 0 0 3px rgba(30, 58, 138, 0.12), 0 6px 16px rgba(30, 58, 138, 0.12) !important;
    outline: none !important;
}

/* Field Error */
.field-error[b-04ehmzx1jz] {
    color: var(--red-600);
    font-size: 0.8125rem;
    font-weight: 500;
    margin-top: 0.375rem;
    display: flex;
    align-items: center;
}

/* Form Options */
.form-options[b-04ehmzx1jz] {
    margin-bottom: 2rem;
}

[b-04ehmzx1jz] .custom-checkbox .e-checkbox-wrapper {
    font-size: 0.875rem;
    color: var(--gray-600);
    font-weight: 500;
}

.forgot-link[b-04ehmzx1jz] {
    color: var(--primary-color);
    font-size: 0.875rem;
    font-weight: 600;
    text-decoration: none;
    transition: var(--transition);
}

.forgot-link:hover[b-04ehmzx1jz] {
    color: var(--primary-dark);
    text-decoration: underline;
}

/* Submit Button */
[b-04ehmzx1jz] .login-button.e-btn {
    background: var(--primary-gradient) !important;
    border: none !important;
    border-radius: var(--border-radius) !important;
    height: 56px !important;
    color: var(--white) !important;
    font-size: 1rem !important;
    font-weight: 600 !important;
    letter-spacing: 0.025em !important;
    box-shadow: 0 4px 14px 0 rgba(30, 58, 138, 0.25), 0 0 0 0 rgba(59, 130, 246, 0.0) !important;
    transition: var(--transition) !important;
    position: relative !important;
    overflow: hidden !important;
}

[b-04ehmzx1jz] .login-button.e-btn:hover {
    transform: translateY(-2px) !important;
    box-shadow: 0 8px 25px 0 rgba(30, 58, 138, 0.32), 0 0 22px rgba(59, 130, 246, 0.25) !important;
}

/* subtle moving shine */
[b-04ehmzx1jz] .login-button.e-btn::after {
    content: '';
    position: absolute;
    top: 0; bottom: 0; left: -40%; width: 40%;
    background: linear-gradient(90deg, rgba(255,255,255,0) 0%, rgba(255,255,255,0.25) 50%, rgba(255,255,255,0) 100%);
    transform: skewX(-20deg);
    transition: transform 0.6s ease, left 0.6s ease;
}

[b-04ehmzx1jz] .login-button.e-btn:hover::after {
    left: 120%;
}

[b-04ehmzx1jz] .login-button.e-btn:active {
    transform: translateY(0) !important;
}

[b-04ehmzx1jz] .login-button.e-btn:disabled {
    opacity: 0.7 !important;
    cursor: not-allowed !important;
    transform: none !important;
}

/* Form Footer */
.form-footer[b-04ehmzx1jz] {
    margin-top: 2rem;
    padding-top: 1.5rem;
    border-top: 1px solid var(--gray-200);
}

.signup-text[b-04ehmzx1jz] {
    color: var(--gray-600);
    font-size: 0.875rem;
    font-weight: 500;
}

.signup-link[b-04ehmzx1jz] {
    color: var(--primary-color);
    font-size: 0.875rem;
    font-weight: 600;
    text-decoration: none;
    transition: var(--transition);
}

.signup-link:hover[b-04ehmzx1jz] {
    color: var(--primary-dark);
    text-decoration: underline;
}

/* Elevate card on hover/focus within for a tactile feel */
.login-form-container:hover[b-04ehmzx1jz],
.login-form-container:focus-within[b-04ehmzx1jz] {
    box-shadow: 0 16px 32px rgba(16,24,40,0.14), 0 6px 16px rgba(16,24,40,0.10);
}

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

@media (max-width: 991.98px) {
    /* On small screens, show the form first and shrink hero */
    .form-section[b-04ehmzx1jz] { order: 1; }
    .hero-section[b-04ehmzx1jz] { order: 2; min-height: 28vh; }
    .floating-elements[b-04ehmzx1jz] { display: none; }
    .feature-cards[b-04ehmzx1jz] { display: grid; grid-template-columns: 1fr; gap: 0.75rem; }
    
    .hero-title[b-04ehmzx1jz] {
        font-size: 2rem;
    }
    
    .hero-subtitle[b-04ehmzx1jz] {
        font-size: 1.125rem;
    }
    
    .brand-title[b-04ehmzx1jz] {
        font-size: 1.75rem;
    }
    
    .login-form-container[b-04ehmzx1jz] {
        padding: 1.5rem 1.25rem;
        margin: 1rem auto;
    }
    
    .form-title[b-04ehmzx1jz] {
        font-size: 1.5rem;
    }
}

@media (max-width: 767.98px) {
    .form-background[b-04ehmzx1jz] {
    padding: 0.75rem;
    }
    
    .login-form-container[b-04ehmzx1jz] {
        padding: 1.125rem 1rem;
        margin: 0.5rem auto;
        border-radius: 14px;
    }
    
    .hero-content[b-04ehmzx1jz] {
        padding: 0.75rem;
    }
    
    .feature-cards[b-04ehmzx1jz] {
        margin-top: 1.25rem;
    }
    
    .feature-card[b-04ehmzx1jz] {
        padding: 0.75rem;
    }
    .form-options[b-04ehmzx1jz] { gap: 0.75rem; }
}

@media (max-width: 575.98px) {
    /* On very small screens, hide the hero to avoid long scrolling */
    .hero-section[b-04ehmzx1jz] { display: none; }
    .form-background[b-04ehmzx1jz] { min-height: 100dvh; }
    .hero-title[b-04ehmzx1jz] {
        font-size: 1.75rem;
    }
    
    .hero-subtitle[b-04ehmzx1jz] {
        font-size: 1rem;
    }
    
    .brand-title[b-04ehmzx1jz] {
        font-size: 1.5rem;
    }
    
    .form-title[b-04ehmzx1jz] {
        font-size: 1.375rem;
    }
    
    [b-04ehmzx1jz] .custom-input .e-input,
    [b-04ehmzx1jz] .custom-input input {
        height: 48px !important;
        font-size: 0.95rem !important; /* readable */
    }
    
    [b-04ehmzx1jz] .login-button.e-btn {
        height: 52px !important;
        font-size: 1rem !important;
    }
    .form-options[b-04ehmzx1jz] { flex-wrap: wrap; gap: 0.5rem; }
    .form-subtitle[b-04ehmzx1jz] { font-size: 0.9rem; }
}

/* ========================================
   ACCESSIBILITY ENHANCEMENTS
   ======================================== */

@media (prefers-reduced-motion: reduce) {
    .hero-pattern[b-04ehmzx1jz],
    .floating-circle-1[b-04ehmzx1jz],
    .floating-circle-2[b-04ehmzx1jz],
    .floating-circle-3[b-04ehmzx1jz] {
        animation: none;
    }
    
    *[b-04ehmzx1jz] {
        transition: none !important;
    }
}

/* Focus indicators */
.login-form-container:focus-within[b-04ehmzx1jz] {
    box-shadow: var(--shadow-large), 0 0 0 3px rgba(30, 58, 138, 0.1);
}

/* High contrast mode support */
@media (prefers-contrast: high) {
    .hero-background[b-04ehmzx1jz] {
        background: #1e3a8a;
    }
    
    .feature-card[b-04ehmzx1jz] {
        background: rgba(255, 255, 255, 0.2);
        border: 2px solid rgba(255, 255, 255, 0.3);
    }
    
    [b-04ehmzx1jz] .custom-input.e-textbox {
        border-width: 2px !important;
    }
}
/* /Components/Pages/Dashboard/TechnicianDashboard.razor.rz.scp.css */

/* Technician dashboard scoped styles */

.fail-reason-modal[b-c6h5ng86ae] {
    position: fixed;
    inset: 0;
    background: rgba(15, 23, 42, 0.35);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1100;
    backdrop-filter: blur(2px);
}

.fail-reason-content[b-c6h5ng86ae] {
    width: min(420px, 90%);
    background: #ffffff;
    border-radius: 16px;
    box-shadow: 0 24px 48px rgba(15, 23, 42, 0.18);
    padding: 24px 26px;
}

.modal-title[b-c6h5ng86ae] {
    font-size: 1.1rem;
    font-weight: 600;
    margin-bottom: 1rem;
    color: #1f2937;
}

.form-group[b-c6h5ng86ae] {
    margin-bottom: 1rem;
}

.form-label[b-c6h5ng86ae] {
    display: block;
    font-size: 0.9rem;
    font-weight: 500;
    color: #334155;
    margin-bottom: 0.35rem;
}

.modal-actions[b-c6h5ng86ae] {
    display: flex;
    justify-content: flex-end;
    gap: 0.75rem;
    margin-top: 1.5rem;
}

.signature-section[b-c6h5ng86ae] {
    margin-top: 1rem;
    padding: 1rem;
    background: #f8fafc;
    border-radius: 12px;
    border: 1px solid #e2e8f0;
}

.signature-label[b-c6h5ng86ae] {
    font-size: 0.9rem;
    font-weight: 600;
    color: #1f2937;
    margin-bottom: 0.5rem;
}
/* /Components/Pages/Financial/BankAccountDataFormDialog.razor.rz.scp.css */
.modern-bank-account-dialog .dialog-header-modern[b-p63mh0qi8w] {
    display: flex;
    align-items: center;
    gap: 12px;
    font-size: 18px;
    font-weight: 600;
    color: #1e293b;
}

.modern-bank-account-dialog .dialog-header-modern i[b-p63mh0qi8w] {
    color: #3b82f6;
    font-size: 20px;
}

.modern-bank-account-dialog .dialog-content[b-p63mh0qi8w] {
    display: flex;
    flex-direction: column;
    height: 100%;
    max-height: calc(90vh - 120px);
}

.modern-bank-account-dialog .modern-dataform[b-p63mh0qi8w] {
    flex: 1;
    overflow-y: auto;
    padding: 12px 20px 8px 20px;
}

.modern-bank-account-dialog .form-group-content[b-p63mh0qi8w] {
    margin-bottom: 12px;
}

.modern-bank-account-dialog .compact-section[b-p63mh0qi8w] {
    margin-bottom: 8px;
    margin-top: 4px;
}

.modern-bank-account-dialog .form-row[b-p63mh0qi8w] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
    margin-top: 8px;
}

.modern-bank-account-dialog .form-field[b-p63mh0qi8w] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.modern-bank-account-dialog .section-label[b-p63mh0qi8w] {
    background: linear-gradient(135deg, #1e3a8a 0%, #0f172a 100%);
    color: white !important;
    padding: 6px 12px;
    border-radius: 4px;
    font-weight: 500;
    font-size: 13px;
    box-shadow: 0 2px 4px rgba(15, 23, 42, 0.3);
    margin-bottom: 8px;
}

.modern-bank-account-dialog .section-label .required-star[b-p63mh0qi8w] {
    color: #fbbf24;
    font-weight: 700;
}

.modern-bank-account-dialog .e-indus-form__label[b-p63mh0qi8w] {
    font-weight: 500;
    font-size: 13px;
    color: #475569;
    margin-bottom: 2px;
}

.modern-bank-account-dialog .e-indus-form__label .required-star[b-p63mh0qi8w] {
    color: #dc2626;
    margin-left: 2px;
}

.modern-bank-account-dialog .form-actions-bottom[b-p63mh0qi8w] {
    flex-shrink: 0;
    background: white;
    border-top: 2px solid #e5e7eb;
    padding: 12px 20px;
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.05);
}

.modern-bank-account-dialog .w-100[b-p63mh0qi8w] {
    width: 100%;
}

.modern-bank-account-dialog .validation-error[b-p63mh0qi8w] {
    color: #dc2626;
    font-size: 12px;
    margin-top: 2px;
    font-weight: 500;
}
/* /Components/Pages/Financial/BankAccounts.razor.rz.scp.css */
.balance-amount[b-wtnv5iwlx6] {
    font-size: 15px;
    color: #059669;
    font-weight: 600;
}

.action-buttons[b-wtnv5iwlx6] {
    display: flex;
    justify-content: center;
    gap: 8px;
}

.btn-icon[b-wtnv5iwlx6] {
    background: transparent;
    border: none;
    color: #3b82f6;
    font-size: 16px;
    cursor: pointer;
    padding: 6px 10px;
    border-radius: 4px;
    transition: all 0.2s ease;
}

.btn-icon:hover[b-wtnv5iwlx6] {
    background: #dbeafe;
    color: #1e40af;
}

.btn-icon.btn-danger[b-wtnv5iwlx6] {
    color: #dc2626;
}

.btn-icon.btn-danger:hover[b-wtnv5iwlx6] {
    background: #fee2e2;
    color: #991b1b;
}
/* /Components/Pages/Financial/CashDeskDataFormDialog.razor.rz.scp.css */
.modern-cash-desk-dialog .dialog-header-modern[b-r2q8ntwaw4] {
    display: flex;
    align-items: center;
    gap: 12px;
    font-size: 18px;
    font-weight: 600;
    color: #1e293b;
}

.modern-cash-desk-dialog .dialog-header-modern i[b-r2q8ntwaw4] {
    color: #059669;
    font-size: 20px;
}

.modern-cash-desk-dialog .dialog-content[b-r2q8ntwaw4] {
    display: flex;
    flex-direction: column;
    height: 100%;
    max-height: calc(90vh - 120px);
}

.modern-cash-desk-dialog .modern-dataform[b-r2q8ntwaw4] {
    flex: 1;
    overflow-y: auto;
    padding: 12px 20px 8px 20px;
}

.modern-cash-desk-dialog .form-group-content[b-r2q8ntwaw4] {
    margin-bottom: 12px;
}

.modern-cash-desk-dialog .compact-section[b-r2q8ntwaw4] {
    margin-bottom: 8px;
    margin-top: 4px;
}

.modern-cash-desk-dialog .form-row[b-r2q8ntwaw4] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
    margin-top: 8px;
}

.modern-cash-desk-dialog .form-field[b-r2q8ntwaw4] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.modern-cash-desk-dialog .section-label[b-r2q8ntwaw4] {
    background: linear-gradient(135deg, #1e3a8a 0%, #0f172a 100%);
    color: white !important;
    padding: 6px 12px;
    border-radius: 4px;
    font-weight: 500;
    font-size: 13px;
    box-shadow: 0 2px 4px rgba(15, 23, 42, 0.3);
    margin-bottom: 8px;
}

.modern-cash-desk-dialog .section-label .required-star[b-r2q8ntwaw4] {
    color: #fbbf24;
    font-weight: 700;
}

.modern-cash-desk-dialog .e-indus-form__label[b-r2q8ntwaw4] {
    font-weight: 500;
    font-size: 13px;
    color: #475569;
    margin-bottom: 2px;
}

.modern-cash-desk-dialog .e-indus-form__label .required-star[b-r2q8ntwaw4] {
    color: #dc2626;
    margin-left: 2px;
}

.modern-cash-desk-dialog .field-hint[b-r2q8ntwaw4] {
    font-size: 11px;
    color: #64748b;
    font-style: italic;
    margin-top: 2px;
}

.modern-cash-desk-dialog .limit-warning[b-r2q8ntwaw4] {
    background: linear-gradient(135deg, #fee2e2 0%, #fef2f2 100%);
    border-left: 4px solid #dc2626;
    padding: 12px 16px;
    margin-top: 12px;
    border-radius: 4px;
    color: #991b1b;
}

.modern-cash-desk-dialog .limit-warning i[b-r2q8ntwaw4] {
    color: #dc2626;
    margin-right: 8px;
    font-size: 16px;
}

.modern-cash-desk-dialog .limit-warning strong[b-r2q8ntwaw4] {
    display: block;
    margin-bottom: 8px;
    font-size: 14px;
}

.modern-cash-desk-dialog .limit-details[b-r2q8ntwaw4] {
    font-size: 13px;
    line-height: 1.6;
    background: white;
    padding: 8px;
    border-radius: 4px;
    margin-top: 8px;
}

.modern-cash-desk-dialog .form-actions-bottom[b-r2q8ntwaw4] {
    flex-shrink: 0;
    background: white;
    border-top: 2px solid #e5e7eb;
    padding: 12px 20px;
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.05);
}

.modern-cash-desk-dialog .w-100[b-r2q8ntwaw4] {
    width: 100%;
}

.modern-cash-desk-dialog .validation-error[b-r2q8ntwaw4] {
    color: #dc2626;
    font-size: 12px;
    margin-top: 2px;
    font-weight: 500;
}
/* /Components/Pages/Financial/CashDesks.razor.rz.scp.css */
.balance-amount[b-ld0gldi7ry] {
    font-size: 15px;
    color: #059669;
    font-weight: 600;
}

.balance-over-limit[b-ld0gldi7ry] {
    font-size: 15px;
    color: #dc2626;
    font-weight: 700;
    animation: pulse-warning-b-ld0gldi7ry 2s infinite;
}

@keyframes pulse-warning-b-ld0gldi7ry {
    0%, 100% {
        opacity: 1;
    }
    50% {
        opacity: 0.7;
    }
}

.action-buttons[b-ld0gldi7ry] {
    display: flex;
    justify-content: center;
    gap: 8px;
}

.btn-icon[b-ld0gldi7ry] {
    background: transparent;
    border: none;
    color: #3b82f6;
    font-size: 16px;
    cursor: pointer;
    padding: 6px 10px;
    border-radius: 4px;
    transition: all 0.2s ease;
}

.btn-icon:hover[b-ld0gldi7ry] {
    background: #dbeafe;
    color: #1e40af;
}

.btn-icon.btn-danger[b-ld0gldi7ry] {
    color: #dc2626;
}

.btn-icon.btn-danger:hover[b-ld0gldi7ry] {
    background: #fee2e2;
    color: #991b1b;
}
/* /Components/Pages/Financial/CustomerCollection.razor.rz.scp.css */
.invoice-grid[b-69wdbebqhb] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(350px, 1fr));
    gap: 16px;
    margin-top: 12px;
}

.invoice-card[b-69wdbebqhb] {
    border: 2px solid #e5e7eb;
    border-radius: 8px;
    padding: 16px;
    background: white;
    cursor: pointer;
    transition: all 0.2s ease;
}

.invoice-card:hover[b-69wdbebqhb] {
    border-color: #6366f1;
    box-shadow: 0 4px 12px rgba(99, 102, 241, 0.1);
}

.invoice-card.selected[b-69wdbebqhb] {
    border-color: #4f46e5;
    background: linear-gradient(135deg, #eef2ff 0%, #f9fafb 100%);
    box-shadow: 0 4px 12px rgba(79, 70, 229, 0.15);
}

.invoice-header[b-69wdbebqhb] {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 12px;
    padding-bottom: 12px;
    border-bottom: 1px solid #e5e7eb;
}

.invoice-header input[type="radio"][b-69wdbebqhb] {
    width: 20px;
    height: 20px;
    cursor: pointer;
}

.invoice-header strong[b-69wdbebqhb] {
    flex: 1;
    font-size: 15px;
    color: #1e293b;
}

.invoice-details[b-69wdbebqhb] {
    display: flex;
    flex-direction: column;
    gap: 8px;
    font-size: 14px;
    color: #64748b;
}

.invoice-details div[b-69wdbebqhb] {
    display: flex;
    justify-content: space-between;
}

.remaining-balance[b-69wdbebqhb] {
    margin-top: 4px;
    padding-top: 8px;
    border-top: 1px dashed #cbd5e1;
    font-weight: 500;
    color: #0f172a !important;
}

.remaining-balance strong[b-69wdbebqhb] {
    color: #059669;
    font-size: 15px;
}

.validation-error[b-69wdbebqhb] {
    color: #dc2626;
    font-size: 13px;
    margin-top: 4px;
    font-weight: 500;
}
/* /Components/Pages/Financial/TreasuryDashboard.razor.rz.scp.css */
.section-header[b-uajh20i9uj] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 20px;
    padding-bottom: 12px;
    border-bottom: 2px solid #e5e7eb;
}

.section-title[b-uajh20i9uj] {
    font-size: 18px;
    font-weight: 600;
    color: #1e293b;
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 0;
}

.section-title i[b-uajh20i9uj] {
    color: #6366f1;
    font-size: 20px;
}

.stat-detail[b-uajh20i9uj] {
    font-size: 12px;
    color: #64748b;
    font-weight: normal;
}

.balance-amount[b-uajh20i9uj] {
    font-size: 15px;
    color: #059669;
    font-weight: 600;
}

.amount-positive[b-uajh20i9uj] {
    color: #059669;
    font-size: 15px;
}

.amount-negative[b-uajh20i9uj] {
    color: #dc2626;
    font-size: 15px;
}

.text-muted[b-uajh20i9uj] {
    color: #94a3b8;
    font-style: italic;
}

/* Override Syncfusion grid styles for better visual hierarchy */
[b-uajh20i9uj] .e-grid .e-headercelldiv {
    font-weight: 600;
    color: #475569;
    font-size: 13px;
}

[b-uajh20i9uj] .e-grid .e-rowcell {
    padding: 12px 16px;
    vertical-align: middle;
}

[b-uajh20i9uj] .e-grid tr:hover {
    background-color: #f8fafc;
}
/* /Components/Pages/Financial/VendorPayment.razor.rz.scp.css */
.invoice-grid[b-2a6pix8wqg] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(350px, 1fr));
    gap: 16px;
    margin-top: 12px;
}

.invoice-card[b-2a6pix8wqg] {
    border: 2px solid #e5e7eb;
    border-radius: 8px;
    padding: 16px;
    background: white;
    cursor: pointer;
    transition: all 0.2s ease;
}

.invoice-card:hover[b-2a6pix8wqg] {
    border-color: #6366f1;
    box-shadow: 0 4px 12px rgba(99, 102, 241, 0.1);
}

.invoice-card.selected[b-2a6pix8wqg] {
    border-color: #4f46e5;
    background: linear-gradient(135deg, #eef2ff 0%, #f9fafb 100%);
    box-shadow: 0 4px 12px rgba(79, 70, 229, 0.15);
}

.invoice-header[b-2a6pix8wqg] {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 12px;
    padding-bottom: 12px;
    border-bottom: 1px solid #e5e7eb;
}

.invoice-header input[type="radio"][b-2a6pix8wqg] {
    width: 20px;
    height: 20px;
    cursor: pointer;
}

.invoice-header strong[b-2a6pix8wqg] {
    flex: 1;
    font-size: 15px;
    color: #1e293b;
}

.invoice-details[b-2a6pix8wqg] {
    display: flex;
    flex-direction: column;
    gap: 8px;
    font-size: 14px;
    color: #64748b;
}

.invoice-details div[b-2a6pix8wqg] {
    display: flex;
    justify-content: space-between;
}

.remaining-balance[b-2a6pix8wqg] {
    margin-top: 4px;
    padding-top: 8px;
    border-top: 1px dashed #cbd5e1;
    font-weight: 500;
    color: #0f172a !important;
}

.remaining-balance strong[b-2a6pix8wqg] {
    color: #059669;
    font-size: 15px;
}

.validation-error[b-2a6pix8wqg] {
    color: #dc2626;
    font-size: 13px;
    margin-top: 4px;
    font-weight: 500;
}
/* /Components/Pages/Home.razor.rz.scp.css */
/* 🏠 DASHBOARD (HOME) - FOUNDATION-FIRST DESIGN
   Inherits from indusx-foundation.css */

.dashboard-page[b-63aemp9a7s] {
    padding: var(--indusx-spacing-lg);
}

/* Header and welcome section */
.action-row[b-63aemp9a7s] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: var(--indusx-spacing-lg);
    padding: var(--indusx-spacing-md);
    background: var(--indusx-white);
    border-radius: var(--indusx-border-radius);
    box-shadow: 0 1px 3px rgb(0 0 0 / 10%);
}

.indus-page__title[b-63aemp9a7s] {
    font-size: var(--indusx-font-size-xxl);
    font-weight: var(--indusx-font-weight-bold);
    color: var(--indusx-text-primary);
    margin: 0;
}

.welcome-text[b-63aemp9a7s] {
    color: var(--indusx-text-secondary);
    font-size: var(--indusx-font-size-sm);
    margin: var(--indusx-spacing-xs) 0 0 0;
}

/* Dashboard cards grid */
.dashboard-cards[b-63aemp9a7s] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: var(--indusx-spacing-lg);
    margin-bottom: var(--indusx-spacing-xl);
}

.dashboard-card[b-63aemp9a7s] {
    background: var(--indusx-white);
    border-radius: var(--indusx-border-radius);
    padding: var(--indusx-spacing-lg);
    border: 1px solid var(--indusx-border-light);
    box-shadow: 0 1px 3px rgb(0 0 0 / 10%);
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.dashboard-card:hover[b-63aemp9a7s] {
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgb(0 0 0 / 15%);
}

.dashboard-card-header[b-63aemp9a7s] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: var(--indusx-spacing-md);
}

.dashboard-card-title[b-63aemp9a7s] {
    font-size: var(--indusx-font-size-lg);
    font-weight: var(--indusx-font-weight-semibold);
    color: var(--indusx-text-primary);
    margin: 0;
}

.dashboard-card-icon[b-63aemp9a7s] {
    width: 40px;
    height: 40px;
    border-radius: var(--indusx-border-radius);
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--indusx-primary-50);
    color: var(--indusx-primary);
}

.dashboard-metric[b-63aemp9a7s] {
    font-size: 2rem;
    font-weight: var(--indusx-font-weight-bold);
    color: var(--indusx-primary);
    margin-bottom: var(--indusx-spacing-xs);
}

.dashboard-metric-label[b-63aemp9a7s] {
    font-size: var(--indusx-font-size-sm);
    color: var(--indusx-text-secondary);
}

/* Quick actions section */
.quick-actions[b-63aemp9a7s] {
    background: var(--indusx-white);
    border-radius: var(--indusx-border-radius);
    padding: var(--indusx-spacing-lg);
    border: 1px solid var(--indusx-border-light);
    margin-bottom: var(--indusx-spacing-lg);
}

.quick-actions-title[b-63aemp9a7s] {
    font-size: var(--indusx-font-size-lg);
    font-weight: var(--indusx-font-weight-semibold);
    color: var(--indusx-text-primary);
    margin: 0 0 var(--indusx-spacing-md) 0;
}

.quick-actions-grid[b-63aemp9a7s] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: var(--indusx-spacing-md);
}

.quick-action-btn[b-63aemp9a7s] {
    display: flex;
    align-items: center;
    gap: var(--indusx-spacing-sm);
    padding: var(--indusx-spacing-md);
    background: var(--indusx-gray-50);
    border: 1px solid var(--indusx-border-light);
    border-radius: var(--indusx-border-radius);
    text-decoration: none;
    color: var(--indusx-text-primary);
    transition: all 0.2s ease;
}

.quick-action-btn:hover[b-63aemp9a7s] {
    background: var(--indusx-primary-50);
    border-color: var(--indusx-primary);
    color: var(--indusx-primary);
    text-decoration: none;
}

/* Recent activity section */
.recent-activity[b-63aemp9a7s] {
    background: var(--indusx-white);
    border-radius: var(--indusx-border-radius);
    padding: var(--indusx-spacing-lg);
    border: 1px solid var(--indusx-border-light);
}

.recent-activity-title[b-63aemp9a7s] {
    font-size: var(--indusx-font-size-lg);
    font-weight: var(--indusx-font-weight-semibold);
    color: var(--indusx-text-primary);
    margin: 0 0 var(--indusx-spacing-md) 0;
}

.activity-item[b-63aemp9a7s] {
    display: flex;
    align-items: center;
    gap: var(--indusx-spacing-md);
    padding: var(--indusx-spacing-sm) 0;
    border-bottom: 1px solid var(--indusx-border-light);
}

.activity-item:last-child[b-63aemp9a7s] {
    border-bottom: none;
}

.activity-icon[b-63aemp9a7s] {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--indusx-gray-100);
    color: var(--indusx-text-secondary);
    flex-shrink: 0;
}

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

.activity-title[b-63aemp9a7s] {
    font-weight: var(--indusx-font-weight-medium);
    color: var(--indusx-text-primary);
    margin-bottom: var(--indusx-spacing-xs);
}

.activity-time[b-63aemp9a7s] {
    font-size: var(--indusx-font-size-xs);
    color: var(--indusx-text-secondary);
}

/* Status indicators */
.status-indicator[b-63aemp9a7s] {
    display: inline-block;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    margin-right: var(--indusx-spacing-xs);
}

.status-indicator.success[b-63aemp9a7s] {
    background-color: var(--indusx-success);
}

.status-indicator.warning[b-63aemp9a7s] {
    background-color: var(--indusx-warning);
}

.status-indicator.danger[b-63aemp9a7s] {
    background-color: var(--indusx-danger);
}

.status-indicator.info[b-63aemp9a7s] {
    background-color: var(--indusx-info);
}

/* 📱 Mobile responsive */
@media (max-width: 768px) {
    .action-row[b-63aemp9a7s] {
        flex-direction: column;
        gap: var(--indusx-spacing-md);
        text-align: center;
    }
    
    .dashboard-cards[b-63aemp9a7s] {
        grid-template-columns: 1fr;
    }
    
    .quick-actions-grid[b-63aemp9a7s] {
        grid-template-columns: 1fr;
    }
    
    .dashboard-card-header[b-63aemp9a7s] {
        flex-direction: column;
        gap: var(--indusx-spacing-sm);
        text-align: center;
    }
}
/* /Components/Pages/Inventory/ProductCenter.razor.rz.scp.css */
/* ProductCenter.razor.css */
/* Minimal - main styling uses Tailwind classes */
/* /Components/Pages/Mobile/DeviceView.razor.rz.scp.css */
/* Device View - Desktop-first responsive design */
.mobile-device-view[b-mu8r814o36] {
    padding: 24px;
    background: #f8f9fa;
    min-height: 100vh;
    max-width: 1200px;
    margin: 0 auto;
}

.mobile-header[b-mu8r814o36] {
    display: flex;
    align-items: center;
    margin-bottom: 24px;
    padding: 16px 24px;
    background: white;
    border-radius: 12px;
    box-shadow: 0 2px 4px rgba(0,0,0,0.08);
}

.back-button[b-mu8r814o36] {
    margin-right: 16px;
}

.indus-page__title[b-mu8r814o36] {
    margin: 0;
    font-size: 1.5rem;
    font-weight: 600;
    color: #333;
}

.loading-container[b-mu8r814o36], .error-container[b-mu8r814o36] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 48px 16px;
    text-align: center;
}

.error-content[b-mu8r814o36] {
    background: white;
    padding: 32px;
    border-radius: 12px;
    box-shadow: 0 4px 12px rgba(0,0,0,0.1);
    max-width: 500px;
    width: 100%;
}

.error-content i[b-mu8r814o36] {
    font-size: 3rem;
    margin-bottom: 16px;
}

.error-content h5[b-mu8r814o36] {
    margin: 0 0 12px 0;
    color: #495057;
    font-size: 1.25rem;
}

.error-content p[b-mu8r814o36] {
    margin: 0 0 20px 0;
    color: #6c757d;
    line-height: 1.5;
}

.device-info-card[b-mu8r814o36] {
    background: white;
    border-radius: 12px;
    padding: 24px;
    margin-bottom: 24px;
    box-shadow: 0 2px 8px rgba(0,0,0,0.08);
    border: 1px solid #e9ecef;
}

.device-header[b-mu8r814o36] {
    display: flex;
    align-items: center;
    margin-bottom: 24px;
    padding-bottom: 20px;
    border-bottom: 1px solid #f1f3f4;
}

.device-icon[b-mu8r814o36] {
    width: 64px;
    height: 64px;
    background: #e3f2fd;
    border-radius: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-right: 20px;
    flex-shrink: 0;
}

.device-icon i[b-mu8r814o36] {
    font-size: 28px;
}

.device-title[b-mu8r814o36] {
    flex: 1;
    min-width: 0;
}

.device-title h5[b-mu8r814o36] {
    margin: 0 0 8px 0;
    font-size: 1.375rem;
    font-weight: 600;
    color: #2c3e50;
    line-height: 1.3;
}

.device-serial[b-mu8r814o36] {
    font-size: 0.9375rem;
    color: #6c757d;
    font-family: 'Courier New', monospace;
    background: #f8f9fa;
    padding: 4px 12px;
    border-radius: 6px;
    display: inline-block;
}

.device-status[b-mu8r814o36] {
    margin-left: 16px;
}

/* Desktop: Grid layout for device details */
.device-details[b-mu8r814o36] {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 16px;
}

.detail-item[b-mu8r814o36] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 12px 16px;
    background: #f8f9fa;
    border-radius: 8px;
}

.detail-item .label[b-mu8r814o36] {
    font-weight: 500;
    color: #495057;
    font-size: 0.9375rem;
    min-width: 0;
    margin-right: 12px;
}

.detail-item .value[b-mu8r814o36] {
    color: #2c3e50;
    font-size: 0.9375rem;
    text-align: right;
    word-break: break-word;
    font-weight: 500;
}

/* Desktop: Horizontal button layout */
.action-buttons[b-mu8r814o36] {
    display: flex;
    flex-direction: row;
    gap: 16px;
    margin-bottom: 24px;
    flex-wrap: wrap;
}

.create-service-btn[b-mu8r814o36], .upload-document-btn[b-mu8r814o36], .view-details-btn[b-mu8r814o36] {
    flex: 1;
    min-width: 200px;
    height: 48px;
    font-size: 1rem;
    font-weight: 500;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
}

.create-service-btn[b-mu8r814o36] {
    background: #007bff;
    border-color: #007bff;
}

.create-service-btn:hover[b-mu8r814o36] {
    background: #0056b3;
    border-color: #0056b3;
}

.upload-document-btn[b-mu8r814o36] {
    background: #28a745;
    border-color: #28a745;
}

.upload-document-btn:hover[b-mu8r814o36] {
    background: #1e7e34;
    border-color: #1e7e34;
}

.access-info[b-mu8r814o36] {
    background: white;
    border-radius: 12px;
    padding: 20px 24px;
    border: 1px solid #e3f2fd;
    background: linear-gradient(135deg, #f8f9fa 0%, #e3f2fd 100%);
    margin-top: 24px;
}

.access-content[b-mu8r814o36] {
    display: flex;
    align-items: flex-start;
}

.access-content i[b-mu8r814o36] {
    font-size: 1.5rem;
    margin-right: 16px;
    margin-top: 2px;
    flex-shrink: 0;
}

.access-text h6[b-mu8r814o36] {
    margin: 0 0 8px 0;
    font-size: 1rem;
    font-weight: 600;
    color: #2c3e50;
}

.access-description[b-mu8r814o36] {
    margin: 0 0 8px 0;
    font-size: 0.9375rem;
    color: #6c757d;
    line-height: 1.5;
}

.access-metadata[b-mu8r814o36] {
    margin-top: 10px;
}

.access-metadata small[b-mu8r814o36] {
    font-size: 0.8125rem;
    color: #adb5bd;
}

/* Tablet and smaller screens */
@media (max-width: 992px) {
    .device-details[b-mu8r814o36] {
        grid-template-columns: 1fr;
    }
    
    .action-buttons[b-mu8r814o36] {
        flex-direction: column;
    }
    
    .create-service-btn[b-mu8r814o36], .upload-document-btn[b-mu8r814o36], .view-details-btn[b-mu8r814o36] {
        width: 100%;
        min-width: auto;
    }
}

/* Mobile screens */
@media (max-width: 768px) {
    .mobile-device-view[b-mu8r814o36] {
        padding: 16px;
    }

    .mobile-header[b-mu8r814o36] {
        padding: 16px;
        margin-bottom: 20px;
    }

    .indus-page__title[b-mu8r814o36] {
        font-size: 1.25rem;
    }

    .device-info-card[b-mu8r814o36] {
        padding: 16px;
        margin-bottom: 16px;
    }

    .device-header[b-mu8r814o36] {
        flex-direction: column;
        align-items: flex-start;
        text-align: left;
    }

    .device-icon[b-mu8r814o36] {
        width: 48px;
        height: 48px;
        margin-right: 0;
        margin-bottom: 12px;
    }

    .device-icon i[b-mu8r814o36] {
        font-size: 24px;
    }

    .device-title h5[b-mu8r814o36] {
        font-size: 1.125rem;
    }

    .device-status[b-mu8r814o36] {
        margin-left: 0;
        margin-top: 12px;
    }

    .detail-item[b-mu8r814o36] {
        flex-direction: column;
        align-items: flex-start;
        text-align: left;
        padding: 10px 12px;
    }

    .detail-item .value[b-mu8r814o36] {
        text-align: left;
        margin-top: 4px;
    }

    .access-info[b-mu8r814o36] {
        padding: 16px;
    }

    .access-content i[b-mu8r814o36] {
        font-size: 1.25rem;
    }
}
/* /Components/Pages/Service/PriorityDashboard.razor.rz.scp.css */
/* 🎯 PRIORITY DASHBOARD - FOUNDATION-FIRST DESIGN
   Inherits from indusx-foundation.css */

.priority-dashboard[b-ojkys9mp4c] {
    padding: var(--indusx-spacing-lg);
}

/* Header and action controls */
.action-row[b-ojkys9mp4c] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: var(--indusx-spacing-lg);
    padding: var(--indusx-spacing-md);
    background: var(--indusx-white);
    border-radius: var(--indusx-border-radius);
    box-shadow: 0 1px 3px rgb(0 0 0 / 10%);
}

.indus-page__title[b-ojkys9mp4c] {
    font-size: var(--indusx-font-size-xxl);
    font-weight: var(--indusx-font-weight-bold);
    color: var(--indusx-text-primary);
    margin: 0;
}

.page-subtitle[b-ojkys9mp4c] {
    color: var(--indusx-text-secondary);
    font-size: var(--indusx-font-size-sm);
    margin: var(--indusx-spacing-xs) 0 0 0;
}

.filter-controls[b-ojkys9mp4c] {
    display: flex;
    gap: var(--indusx-spacing-md);
    align-items: center;
}

/* Loading state */
.loading-container[b-ojkys9mp4c] {
    text-align: center;
    padding: var(--indusx-spacing-xl) 0;
}

/* Priority cards - foundation layout */
.priority-overview-cards[b-ojkys9mp4c] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: var(--indusx-spacing-lg);
    margin-bottom: var(--indusx-spacing-lg);
}

/* Individual wrappers inherit grid behavior */

.priority-card[b-ojkys9mp4c] {
    border-radius: var(--indusx-border-radius-lg);
    padding: var(--indusx-spacing-lg);
    border: none;
    box-shadow: 0 4px 6px rgb(0 0 0 / 10%);
    transition: transform 0.2s ease;
}

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

.priority-card.critical[b-ojkys9mp4c] {
    background: linear-gradient(135deg, #dc3545, #c82333);
    color: var(--indusx-white);
}

.priority-card.high[b-ojkys9mp4c] {
    background: linear-gradient(135deg, #fd7e14, #e55a00);
    color: var(--indusx-white);
}

.priority-card.normal[b-ojkys9mp4c] {
    background: linear-gradient(135deg, #28a745, #1e7e34);
    color: var(--indusx-white);
}

.priority-card.low[b-ojkys9mp4c] {
    background: linear-gradient(135deg, #6c757d, #5a6268);
    color: var(--indusx-white);
}

.priority-card-content[b-ojkys9mp4c] {
    display: flex;
    align-items: center;
    margin-bottom: var(--indusx-spacing-sm);
}

.priority-icon[b-ojkys9mp4c] {
    font-size: 32px;
    margin-right: var(--indusx-spacing-lg);
    opacity: 0.9;
}

.priority-count[b-ojkys9mp4c] {
    font-size: 32px;
    font-weight: var(--indusx-font-weight-bold);
    line-height: 1;
}

.priority-label[b-ojkys9mp4c] {
    font-size: var(--indusx-font-size-sm);
    opacity: 0.9;
    margin-bottom: var(--indusx-spacing-xs);
}

.priority-percentage[b-ojkys9mp4c] {
    font-size: var(--indusx-font-size-md);
    font-weight: var(--indusx-font-weight-semibold);
}

/* Charts section */
.charts-section[b-ojkys9mp4c] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(400px, 1fr));
    gap: var(--indusx-spacing-lg);
    margin-bottom: var(--indusx-spacing-lg);
}

/* Escalation recommendations */
.escalation-recommendations[b-ojkys9mp4c] {
    background: var(--indusx-white);
    border-radius: var(--indusx-border-radius);
    padding: var(--indusx-spacing-lg);
    border: 1px solid var(--indusx-border-light);
    margin-bottom: var(--indusx-spacing-lg);
}

/* Analytics summary */
.analytics-summary[b-ojkys9mp4c] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: var(--indusx-spacing-lg);
}

/* Priority badges */
.priority-badge[b-ojkys9mp4c] {
    padding: var(--indusx-spacing-xs) var(--indusx-spacing-sm);
    border-radius: var(--indusx-border-radius-sm);
    font-size: var(--indusx-font-size-xs);
    font-weight: var(--indusx-font-weight-semibold);
    text-transform: uppercase;
}

.priority-badge.priority-critical[b-ojkys9mp4c] {
    background-color: #dc3545;
    color: var(--indusx-white);
}

.priority-badge.priority-high[b-ojkys9mp4c] {
    background-color: #fd7e14;
    color: var(--indusx-white);
}

.priority-badge.priority-normal[b-ojkys9mp4c] {
    background-color: #28a745;
    color: var(--indusx-white);
}

.priority-badge.priority-low[b-ojkys9mp4c] {
    background-color: #6c757d;
    color: var(--indusx-white);
}

/* Summary items */
.summary-item[b-ojkys9mp4c] {
    margin-bottom: var(--indusx-spacing-sm);
    font-size: var(--indusx-font-size-sm);
}

.confidence-score .progress[b-ojkys9mp4c] {
    border-radius: var(--indusx-border-radius-lg);
}

.reason-text[b-ojkys9mp4c] {
    line-height: 1.3;
}

/* Work order links */
.work-order-link[b-ojkys9mp4c] {
    color: var(--indusx-primary);
    font-weight: var(--indusx-font-weight-semibold);
    text-decoration: none;
}

.work-order-link:hover[b-ojkys9mp4c] {
    text-decoration: underline;
}

/* 📱 Mobile responsive */
@media (max-width: 768px) {
    .action-row[b-ojkys9mp4c] {
        flex-direction: column;
        gap: var(--indusx-spacing-md);
        text-align: center;
    }
    
    .filter-controls[b-ojkys9mp4c] {
        flex-direction: column;
        width: 100%;
    }
    
    .priority-overview-cards[b-ojkys9mp4c] {
        grid-template-columns: 1fr;
    }
    
    .charts-section[b-ojkys9mp4c] {
        grid-template-columns: 1fr;
    }
    
    .analytics-summary[b-ojkys9mp4c] {
        grid-template-columns: 1fr;
    }
}
/* /Components/Pages/Service/ServiceForm.razor.rz.scp.css */
.service-form-container[b-83d5m90702] {
    max-width: 210mm;
    margin: 0 auto;
    font-family: Arial, sans-serif;
}

@media print {
    .service-form-container[b-83d5m90702] {
        box-shadow: none !important;
        border: none !important;
    }
    
    .row:last-child[b-83d5m90702], .hide-from-pdf[b-83d5m90702] {
        display: none !important;
    }
}

.table-borderless td[b-83d5m90702] {
    border: none;
    padding: 0.25rem 0.5rem;
}

.service-form-logo[b-83d5m90702] {
    max-width: 352px;
    max-height: 160px;
    width: auto;
    height: auto;
    object-fit: contain;
}

@media print {
    .service-form-logo[b-83d5m90702] {
        max-width: 281px;
        max-height: 128px;
    }
}

.service-form-container .processing-overlay[b-83d5m90702] {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(255, 255, 255, 0.85);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 10;
}

.service-form-container .loading-container[b-83d5m90702] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    height: 200px;
}
/* /Components/Pages/Service/ServiceScheduling.razor.rz.scp.css */
/* Service Scheduling - Dispatcher Command Center */

/* Main Layout */
.scheduler-page[b-j5w643r0mq] {
    height: calc(100vh - 4rem);
    display: flex;
    flex-direction: column;
}

/* Split Container Layout */
.scheduler-split-container[b-j5w643r0mq] {
    display: flex;
    flex: 1;
    gap: 1rem;
    min-height: 0;
    overflow: hidden;
}

/* Left Pane - Work Order Backlog */
.backlog-pane[b-j5w643r0mq] {
    width: 320px;
    min-width: 280px;
    max-width: 380px;
    display: flex;
    flex-direction: column;
    background: white;
    border-radius: 0.75rem;
    border: 1px solid #e2e8f0;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
    overflow: hidden;
}

.backlog-header[b-j5w643r0mq] {
    padding: 0.75rem 1rem;
    border-bottom: 1px solid #e2e8f0;
    background: linear-gradient(135deg, #1e3a8a 0%, #0f172a 100%);
}

.backlog-title[b-j5w643r0mq] {
    color: white;
    font-size: 0.875rem;
    font-weight: 600;
    margin: 0 0 0.5rem 0;
    display: flex;
    align-items: center;
}

.backlog-filters[b-j5w643r0mq] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.backlog-filters[b-j5w643r0mq]  .e-checkbox-wrapper .e-label {
    color: white !important;
    font-size: 0.75rem;
}

.backlog-search[b-j5w643r0mq] {
    padding: 0.75rem;
    border-bottom: 1px solid #e2e8f0;
}

.backlog-list[b-j5w643r0mq] {
    flex: 1;
    overflow-y: auto;
    padding: 0.75rem;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

/* Work Order Backlog Item */
.backlog-item[b-j5w643r0mq] {
    padding: 0.75rem;
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 0.5rem;
    cursor: grab;
    transition: all 0.2s ease;
}

.backlog-item:hover[b-j5w643r0mq] {
    background: white;
    border-color: #3b82f6;
    box-shadow: 0 2px 8px rgba(59, 130, 246, 0.15);
    transform: translateY(-1px);
}

.backlog-item:active[b-j5w643r0mq] {
    cursor: grabbing;
}

.backlog-item.sla-breach[b-j5w643r0mq] {
    border-left: 4px solid #dc2626;
    background: #fef2f2;
}

.backlog-item-header[b-j5w643r0mq] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 0.25rem;
}

.wo-number[b-j5w643r0mq] {
    font-size: 0.75rem;
    font-weight: 600;
    color: #1e40af;
}

.backlog-item-title[b-j5w643r0mq] {
    font-size: 0.8125rem;
    font-weight: 500;
    color: #1e293b;
    margin-bottom: 0.25rem;
    line-height: 1.3;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.backlog-item-customer[b-j5w643r0mq] {
    font-size: 0.75rem;
    color: #64748b;
    margin-bottom: 0.25rem;
}

.backlog-item-footer[b-j5w643r0mq] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 0.6875rem;
    color: #94a3b8;
}

.backlog-item-footer .duration[b-j5w643r0mq] {
    display: flex;
    align-items: center;
}

.backlog-item-footer .due-date[b-j5w643r0mq] {
    display: flex;
    align-items: center;
}

.backlog-item-footer .due-date.overdue[b-j5w643r0mq] {
    color: #dc2626;
    font-weight: 500;
}

/* Priority Badges */
.priority-badge[b-j5w643r0mq] {
    font-size: 0.625rem;
    font-weight: 600;
    padding: 0.125rem 0.5rem;
    border-radius: 9999px;
    text-transform: uppercase;
    letter-spacing: 0.025em;
}

.priority-critical[b-j5w643r0mq] {
    background: #fecaca;
    color: #991b1b;
}

.priority-high[b-j5w643r0mq] {
    background: #fed7aa;
    color: #9a3412;
}

.priority-normal[b-j5w643r0mq] {
    background: #dbeafe;
    color: #1e40af;
}

.priority-low[b-j5w643r0mq] {
    background: #e2e8f0;
    color: #475569;
}

/* Right Pane - Scheduler */
.scheduler-pane[b-j5w643r0mq] {
    flex: 1;
    position: relative;
    background: white;
    border-radius: 0.75rem;
    border: 1px solid #e2e8f0;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
    overflow: hidden;
}

/* Drop Zone Overlay */
.drop-zone-overlay[b-j5w643r0mq] {
    position: absolute;
    inset: 0;
    background: rgba(59, 130, 246, 0.1);
    border: 3px dashed #3b82f6;
    border-radius: 0.75rem;
    z-index: 100;
    display: flex;
    align-items: center;
    justify-content: center;
    pointer-events: all;
}

.drop-zone-message[b-j5w643r0mq] {
    text-align: center;
    color: #1e40af;
    padding: 2rem;
    background: white;
    border-radius: 0.75rem;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
}

.drop-zone-message i[b-j5w643r0mq] {
    color: #3b82f6;
}

.drop-zone-wo[b-j5w643r0mq] {
    font-weight: 600;
    font-size: 1rem;
    margin-top: 0.5rem;
}

/* Syncfusion Scheduler Customizations */
.indus-scheduler[b-j5w643r0mq] {
    height: 100% !important;
}

[b-j5w643r0mq] .e-schedule {
    border: none !important;
}

[b-j5w643r0mq] .e-schedule .e-timeline-view .e-resource-column-table,
[b-j5w643r0mq] .e-schedule .e-timeline-view .e-resource-column-wrap {
    width: 160px !important;
}

[b-j5w643r0mq] .e-schedule .e-timeline-view .e-resource-cells {
    padding: 0.5rem;
    font-weight: 500;
    background: #f8fafc;
}

[b-j5w643r0mq] .e-schedule .e-timeline-view .e-work-cells {
    height: 60px !important;
}

[b-j5w643r0mq] .e-schedule .e-header-cells {
    background: #f8fafc;
    font-weight: 500;
}

[b-j5w643r0mq] .e-schedule .e-schedule-toolbar {
    background: #f8fafc;
    border-bottom: 1px solid #e2e8f0;
}

/* Schedule Event Template */
.schedule-event-template[b-j5w643r0mq] {
    padding: 4px 8px;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    border-radius: 4px;
}

.event-subject[b-j5w643r0mq] {
    font-size: 0.75rem;
    font-weight: 600;
    line-height: 1.2;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.event-location[b-j5w643r0mq] {
    font-size: 0.6875rem;
    opacity: 0.85;
    margin-top: 2px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* Event Priority Colors */
.event-priority-critical[b-j5w643r0mq] {
    background: linear-gradient(135deg, #dc2626 0%, #b91c1c 100%);
    color: white;
}

.event-priority-high[b-j5w643r0mq] {
    background: linear-gradient(135deg, #f97316 0%, #ea580c 100%);
    color: white;
}

.event-priority-normal[b-j5w643r0mq] {
    background: linear-gradient(135deg, #3b82f6 0%, #2563eb 100%);
    color: white;
}

.event-priority-low[b-j5w643r0mq] {
    background: linear-gradient(135deg, #64748b 0%, #475569 100%);
    color: white;
}

/* SLA Breach Event */
.event-sla-breach[b-j5w643r0mq] {
    animation: sla-pulse-b-j5w643r0mq 2s infinite;
    border: 2px solid #dc2626 !important;
}

@keyframes sla-pulse-b-j5w643r0mq {
    0%, 100% {
        box-shadow: 0 0 0 0 rgba(220, 38, 38, 0.4);
    }
    50% {
        box-shadow: 0 0 0 4px rgba(220, 38, 38, 0.2);
    }
}

/* Conflict Dialog */
.conflict-dialog[b-j5w643r0mq]  .e-dlg-content {
    padding: 0 !important;
}

.conflict-content[b-j5w643r0mq] {
    text-align: center;
    padding: 1.5rem;
}

.conflict-icon[b-j5w643r0mq] {
    width: 4rem;
    height: 4rem;
    background: #fef3c7;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 1rem;
}

.conflict-icon i[b-j5w643r0mq] {
    font-size: 1.75rem;
    color: #d97706;
}

.conflict-message[b-j5w643r0mq] {
    font-size: 0.9375rem;
    color: #475569;
    margin-bottom: 1rem;
}

.suggested-slot[b-j5w643r0mq] {
    background: #f0fdf4;
    border: 1px solid #bbf7d0;
    border-radius: 0.5rem;
    padding: 1rem;
    margin-top: 1rem;
}

.suggested-slot h5[b-j5w643r0mq] {
    font-size: 0.875rem;
    color: #166534;
    margin: 0 0 0.5rem 0;
}

.suggested-slot p[b-j5w643r0mq] {
    font-size: 0.9375rem;
    font-weight: 600;
    color: #15803d;
    margin: 0;
}

/* Responsive Adjustments */
@media (max-width: 1024px) {
    .scheduler-split-container[b-j5w643r0mq] {
        flex-direction: column;
    }

    .backlog-pane[b-j5w643r0mq] {
        width: 100%;
        max-width: none;
        height: 250px;
    }

    .backlog-list[b-j5w643r0mq] {
        flex-direction: row;
        flex-wrap: wrap;
    }

    .backlog-item[b-j5w643r0mq] {
        width: calc(50% - 0.25rem);
    }
}

@media (max-width: 640px) {
    .backlog-item[b-j5w643r0mq] {
        width: 100%;
    }
}
/* /Components/Pages/Service/Tickets.razor.rz.scp.css */
/* 🎫 TICKETS PAGE - SUPER LEAN
   Inherits everything from indusx-foundation.css */

/* Only page-specific overrides */
.indus-grid--tickets[b-eng0czd9sg] {
    background: var(--indusx-white);
    border-radius: var(--indusx-border-radius);
    box-shadow: 0 1px 3px rgb(0 0 0 / 10%);
}

/* Page header styling - keep existing design */
.indus-page__header[b-eng0czd9sg] {
    padding: 1.5rem;
    margin-bottom: 1rem;
    background: white;
    border-radius: 0.375rem;
    box-shadow: 0 1px 3px rgb(0 0 0 / 10%);
}

.indus-page__title[b-eng0czd9sg] {
    margin-bottom: 0.25rem;
    font-size: 1.5rem;
    font-weight: 600;
    color: #2c5f2d;
}

.indus-page__subtitle[b-eng0czd9sg] {
    margin-bottom: 0;
    color: #6c757d;
}

/* Filters container */
.filters-container[b-eng0czd9sg] {
    padding: 1rem;
    margin-bottom: 1rem;
    background: white;
    border-radius: 0.375rem;
    box-shadow: 0 1px 3px rgb(0 0 0 / 10%);
}

/* Summary cards */
.summary-cards[b-eng0czd9sg] {
    display: flex;
    gap: 0.5rem;
}

.summary-card[b-eng0czd9sg] {
    min-width: 80px;
    padding: 0.75rem;
    text-align: center;
    background: #f8f9fa;
    border: 1px solid #e9ecef;
    border-radius: 0.375rem;
}

.summary-card.compact[b-eng0czd9sg] {
    min-width: 60px;
    padding: 0.5rem;
}

.summary-number[b-eng0czd9sg] {
    display: block;
    font-size: 1.25rem;
    font-weight: 600;
    line-height: 1;
    color: #2c5f2d;
}

.summary-label[b-eng0czd9sg] {
    display: block;
    font-size: 0.75rem;
    color: #6c757d;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

/* 📱 Mobile responsive */
@media (max-width: 768px) {
    .indus-page__header[b-eng0czd9sg] {
        padding: 1rem;
    }
    
    .filters-container[b-eng0czd9sg] {
        padding: 0.75rem;
    }
    
    .summary-cards[b-eng0czd9sg] {
        flex-direction: column;
        gap: 0.25rem;
    }
}
/* /Components/Shared/HierarchicalProductFilter.razor.rz.scp.css */
/* Hierarchical Product Filter - Scoped Styles */
/* Using IndusX Executive Navy Theme Colors */

.hierarchical-filter[b-p0giqsenra] {
    width: 100%;
    padding: 0.75rem;
    background: white;
    border-radius: 8px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
}

/* Mode Toggle Buttons */
.mode-toggle[b-p0giqsenra] {
    margin-bottom: 0.75rem;
}

.mode-toggle .btn-group[b-p0giqsenra] {
    box-shadow: 0 2px 4px rgba(11, 18, 32, 0.1);
    border-radius: 8px;
    overflow: hidden;
}

.mode-toggle .btn[b-p0giqsenra] {
    flex: 1;
    padding: 0.75rem 1.5rem;
    font-weight: 500;
    font-size: 0.9375rem;
    border: none;
    transition: all 0.3s ease;
}

/* Active mode button - IndusX Executive Navy Gradient */
.mode-toggle .btn-primary[b-p0giqsenra] {
    background: linear-gradient(135deg, #0B1220 0%, #1E3A8A 25%, #1d3b8b 75%, #1D4ED8 100%) !important;
    color: white !important;
    box-shadow: 0 4px 12px rgba(11, 18, 32, 0.25);
}

/* Inactive mode button */
.mode-toggle .btn-outline-primary[b-p0giqsenra] {
    background: white;
    color: #1d3b8b;
    border: 2px solid #e5e7eb;
}

.mode-toggle .btn-outline-primary:hover[b-p0giqsenra] {
    background: linear-gradient(135deg, rgba(11, 18, 32, 0.05) 0%, rgba(29, 59, 139, 0.08) 100%);
    border-color: #1d3b8b;
    color: #0B1220;
}

.mode-toggle .btn i[b-p0giqsenra] {
    margin-right: 0.5rem;
}

/* Loading State */
.filter-loading[b-p0giqsenra] {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 2rem;
    color: #6b7280;
    font-size: 0.875rem;
}

/* Breadcrumb Container */
.filter-breadcrumb[b-p0giqsenra] {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.5rem;
    min-height: 40px;
}

/* Filter Level Container */
.filter-level[b-p0giqsenra] {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
    flex: 1;
    min-width: 200px;
}

.filter-label[b-p0giqsenra] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
    font-size: 0.8125rem;
    font-weight: 600;
    color: #374151;
    margin-bottom: 0.125rem;
}

.filter-label-inline[b-p0giqsenra] {
    font-size: 0.875rem;
    font-weight: 500;
    color: #6b7280;
    white-space: nowrap;
}

/* Type Chips (Level 1) */
.type-chips[b-p0giqsenra] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.type-chip[b-p0giqsenra] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.375rem;
    padding: 0.625rem 0.75rem;
    border: 1.5px solid #e5e7eb;
    border-radius: 8px;
    background: white;
    cursor: pointer;
    transition: all 0.2s ease-in-out;
    width: 100px;
    height: 70px;
}

.type-chip:hover[b-p0giqsenra] {
    border-color: #1d3b8b;
    background: linear-gradient(135deg, #f9fafb 0%, #f3f4f6 100%);
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(29, 59, 139, 0.15);
}

.type-chip i[b-p0giqsenra] {
    font-size: 1.5rem;
    color: #1d3b8b;
}

.type-name[b-p0giqsenra] {
    font-weight: 600;
    font-size: 0.75rem;
    color: #374151;
    text-align: center;
    line-height: 1.2;
}

.type-desc[b-p0giqsenra] {
    font-size: 0.75rem;
    color: #6b7280;
    text-align: center;
}

/* Selected Chips (Breadcrumb Items) */
.breadcrumb-item[b-p0giqsenra] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.5rem 0.75rem;
    border-radius: 24px;
    font-size: 0.875rem;
    font-weight: 500;
    animation: chipSlideIn-b-p0giqsenra 0.3s ease-out;
}

@keyframes chipSlideIn-b-p0giqsenra {
    from {
        opacity: 0;
        transform: translateX(-10px);
    }
    to {
        opacity: 1;
        transform: translateX(0);
    }
}

.selected-chip[b-p0giqsenra] {
    background: linear-gradient(135deg, #0B1220 0%, #1E3A8A 25%, #1d3b8b 75%, #1D4ED8 100%);
    color: white;
    box-shadow: 0 2px 8px rgba(11, 18, 32, 0.25);
}

.selected-chip i[b-p0giqsenra] {
    font-size: 0.875rem;
}

.chip-close[b-p0giqsenra] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 20px;
    height: 20px;
    padding: 0;
    border: none;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.2);
    color: white;
    cursor: pointer;
    transition: all 0.2s ease;
}

.chip-close:hover[b-p0giqsenra] {
    background: rgba(255, 255, 255, 0.3);
    transform: scale(1.1);
}

.chip-close i[b-p0giqsenra] {
    font-size: 0.75rem;
}

/* Breadcrumb Arrow */
.breadcrumb-arrow[b-p0giqsenra] {
    color: #9ca3af;
    font-size: 0.75rem;
}

/* Brand Chips (Level 3) */
.brand-chips[b-p0giqsenra] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.brand-chip[b-p0giqsenra] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.5rem 1rem;
    border: 1.5px solid #e5e7eb;
    border-radius: 20px;
    background: white;
    cursor: pointer;
    font-size: 0.875rem;
    font-weight: 500;
    color: #374151;
    transition: all 0.2s ease-in-out;
}

.brand-chip:hover[b-p0giqsenra] {
    border-color: #2C5F2D;
    background: #f9fafb;
    transform: translateY(-1px);
    box-shadow: 0 2px 6px rgba(44, 95, 45, 0.1);
}

.brand-flag[b-p0giqsenra] {
    font-size: 1.25rem;
    display: inline-block;
    width: 1.5em;  /* Fixed width to prevent layout shift */
    text-align: center;
    font-family: "Apple Color Emoji", "Segoe UI Emoji", "Noto Color Emoji", sans-serif;
    flex-shrink: 0;  /* Prevent flag from shrinking */
}

.brand-name[b-p0giqsenra] {
    white-space: nowrap;
}

.more-chip[b-p0giqsenra] {
    background: #f3f4f6;
    border-color: #d1d5db;
    color: #6b7280;
}

.more-chip:hover[b-p0giqsenra] {
    background: #e5e7eb;
    border-color: #9ca3af;
}

/* Dropdown Containers */
.filter-dropdown-container[b-p0giqsenra] {
    min-width: 250px;
    max-width: 400px;
}

/* Clear All Button */
.clear-all-btn[b-p0giqsenra] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.5rem 1rem;
    margin-left: auto;
    border: 1.5px solid #ef4444;
    border-radius: 20px;
    background: white;
    color: #ef4444;
    font-size: 0.875rem;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s ease;
}

.clear-all-btn:hover[b-p0giqsenra] {
    background: #ef4444;
    color: white;
    box-shadow: 0 2px 8px rgba(239, 68, 68, 0.25);
}

.clear-all-btn i[b-p0giqsenra] {
    font-size: 1rem;
}

/* Empty State */
.filter-empty[b-p0giqsenra] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 3rem 1rem;
    color: #9ca3af;
}

/* Responsive Design */
@media (max-width: 768px) {
    .hierarchical-filter[b-p0giqsenra] {
        padding: 0.5rem;
    }

    .filter-breadcrumb[b-p0giqsenra] {
        gap: 0.375rem;
    }

    .type-chips[b-p0giqsenra] {
        width: 100%;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: thin;
    }

    .type-chip[b-p0giqsenra] {
        width: 90px;
        height: 65px;
        padding: 0.5rem;
    }

    .type-chip i[b-p0giqsenra] {
        font-size: 1.25rem;
    }

    .type-name[b-p0giqsenra] {
        font-size: 0.6875rem;
    }

    .type-desc[b-p0giqsenra] {
        display: none;
    }

    .brand-chips[b-p0giqsenra] {
        width: 100%;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: thin;
    }

    .brand-chip[b-p0giqsenra] {
        flex-shrink: 0;
    }

    .filter-dropdown-container[b-p0giqsenra] {
        min-width: 200px;
        max-width: 100%;
    }

    .clear-all-btn[b-p0giqsenra] {
        width: 100%;
        justify-content: center;
        margin-left: 0;
        margin-top: 0.5rem;
    }
}

/* Scrollbar Styling */
.type-chips[b-p0giqsenra]::-webkit-scrollbar,
.brand-chips[b-p0giqsenra]::-webkit-scrollbar {
    height: 6px;
}

.type-chips[b-p0giqsenra]::-webkit-scrollbar-track,
.brand-chips[b-p0giqsenra]::-webkit-scrollbar-track {
    background: #f3f4f6;
    border-radius: 3px;
}

.type-chips[b-p0giqsenra]::-webkit-scrollbar-thumb,
.brand-chips[b-p0giqsenra]::-webkit-scrollbar-thumb {
    background: #d1d5db;
    border-radius: 3px;
}

.type-chips[b-p0giqsenra]::-webkit-scrollbar-thumb:hover,
.brand-chips[b-p0giqsenra]::-webkit-scrollbar-thumb:hover {
    background: #9ca3af;
}

/* Animation for fade-in effect */
@keyframes fadeIn-b-p0giqsenra {
    from {
        opacity: 0;
        transform: translateY(-5px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.filter-level[b-p0giqsenra] {
    animation: fadeIn-b-p0giqsenra 0.3s ease-out;
}

/* Focus states for accessibility */
.type-chip:focus[b-p0giqsenra],
.brand-chip:focus[b-p0giqsenra],
.clear-all-btn:focus[b-p0giqsenra],
.chip-close:focus[b-p0giqsenra] {
    outline: 2px solid #2C5F2D;
    outline-offset: 2px;
}

/* Print styles */
@media print {
    .chip-close[b-p0giqsenra],
    .clear-all-btn[b-p0giqsenra] {
        display: none;
    }
}
/* /Components/Shared/IndusBadge.razor.rz.scp.css */
/* IndusX Badge Component - Vibrant & Modern */
/* Base badge styling for IndusX components */
.indus-badge[b-prjpeqabjy] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-weight: 600;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    border: 2px solid transparent;
    white-space: nowrap;
    border-radius: 9999px; /* Always rounded-full */
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
    position: relative;
    overflow: hidden;
}

/* Size variants - More generous spacing */
.indus-badge-xs[b-prjpeqabjy] {
    padding: 0.25rem 0.5rem;  /* px-2 py-1 */
    font-size: 0.625rem;  /* text-xs */
    line-height: 0.875rem;  /* leading-3 */
    min-height: 1.5rem; /* h-6 */
}

.indus-badge-sm[b-prjpeqabjy] {
    padding: 0.5rem 0.75rem;  /* px-3 py-2 */
    font-size: 0.75rem;  /* text-xs */
    line-height: 1rem;  /* leading-4 */
    min-height: 1.75rem; /* h-7 */
}

.indus-badge-md[b-prjpeqabjy] {
    padding: 0.625rem 1rem;  /* px-4 py-2.5 */
    font-size: 0.875rem;  /* text-sm */
    line-height: 1.25rem;  /* leading-5 */
    min-height: 2.25rem; /* h-9 */
}

.indus-badge-lg[b-prjpeqabjy] {
    padding: 0.75rem 1.25rem;  /* px-5 py-3 */
    font-size: 0.95rem;  /* text-sm+ */
    line-height: 1.4rem;  /* leading-6 */
    min-height: 2.75rem; /* h-11 */
    letter-spacing: 0.025em; /* tracking-wide */
}

/* Type-based color schemes - Vibrant & Modern */
.indus-badge-default[b-prjpeqabjy] {
    background: linear-gradient(135deg, #f8fafc 0%, #e2e8f0 100%) !important;
    color: #334155 !important;
    border-color: #cbd5e1 !important;
}

.indus-badge-type[b-prjpeqabjy] {
    background: linear-gradient(135deg, #64748b 0%, #475569 100%) !important;
    color: #ffffff !important;
    border-color: #94a3b8 !important;
    box-shadow: 0 2px 4px rgba(100, 116, 139, 0.2) !important;
}

.indus-badge-department[b-prjpeqabjy] {
    background: linear-gradient(135deg, #7c3aed 0%, #6d28d9 100%) !important;
    color: #ffffff !important;
    border-color: #a78bfa !important;
    box-shadow: 0 2px 4px rgba(124, 58, 237, 0.2) !important;
}

.indus-badge-location[b-prjpeqabjy] {
    background: linear-gradient(135deg, #0891b2 0%, #0e7490 100%) !important;
    color: #ffffff !important;
    border-color: #67e8f9 !important;
    box-shadow: 0 2px 4px rgba(8, 145, 178, 0.2) !important;
}

.indus-badge-status[b-prjpeqabjy] {
    background: linear-gradient(135deg, #059669 0%, #047857 100%) !important;
    color: #ffffff !important;
    border-color: #34d399 !important;
    box-shadow: 0 2px 4px rgba(5, 150, 105, 0.2) !important;
}

.indus-badge-priority[b-prjpeqabjy] {
    background: linear-gradient(135deg, #ef4444 0%, #dc2626 100%) !important;
    color: #ffffff !important;
    border-color: #f87171 !important;
    box-shadow: 0 4px 6px rgba(239, 68, 68, 0.3) !important;
}

.indus-badge-category[b-prjpeqabjy] {
    background: linear-gradient(135deg, #f59e0b 0%, #d97706 100%) !important;
    color: #ffffff !important;
    border-color: #fbbf24 !important;
    box-shadow: 0 4px 6px rgba(245, 158, 11, 0.3) !important;
}

.indus-badge-warning[b-prjpeqabjy] {
    background: linear-gradient(135deg, #eab308 0%, #ca8a04 100%) !important;
    color: #ffffff !important;
    border-color: #facc15 !important;
    box-shadow: 0 4px 6px rgba(234, 179, 8, 0.3) !important;
}

.indus-badge-success[b-prjpeqabjy] {
    background: linear-gradient(135deg, #22c55e 0%, #16a34a 100%) !important;
    color: #ffffff !important;
    border-color: #4ade80 !important;
    box-shadow: 0 4px 6px rgba(34, 197, 94, 0.3) !important;
}

.indus-badge-info[b-prjpeqabjy] {
    background: linear-gradient(135deg, #0ea5e9 0%, #0284c7 100%) !important;
    color: #ffffff !important;
    border-color: #38bdf8 !important;
    box-shadow: 0 4px 6px rgba(14, 165, 233, 0.3) !important;
}

.indus-badge-error[b-prjpeqabjy] {
    background: linear-gradient(135deg, #dc2626 0%, #b91c1c 100%) !important;
    color: #ffffff !important;
    border-color: #ef4444 !important;
    box-shadow: 0 4px 6px rgba(220, 38, 38, 0.3);
}

/* Enhanced hover and interaction effects */
.indus-badge:hover[b-prjpeqabjy] {
    transform: translateY(-1px) scale(1.02);
    box-shadow: 0 8px 16px rgba(0, 0, 0, 0.15);
    filter: brightness(110%);
}

.indus-badge:active[b-prjpeqabjy] {
    transform: translateY(0) scale(0.98);
    transition: all 0.1s ease;
}

/* Enhanced icon styling */
.indus-badge i[b-prjpeqabjy] {
    color: currentColor;
    margin-right: 0.375rem; /* mr-1.5 */
    font-size: 0.875em;
    display: inline-flex;
    align-items: center;
}

/* Enhanced focus states for accessibility */
.indus-badge:focus[b-prjpeqabjy] {
    outline: 2px solid transparent;
    outline-offset: 2px;
    box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.4);
    transform: translateY(-1px);
}

/* Shimmer effect for enhanced visual appeal */
.indus-badge[b-prjpeqabjy]::before {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.4), transparent);
    transition: left 0.5s;
}

.indus-badge:hover[b-prjpeqabjy]::before {
    left: 100%;
}

/* Responsive adjustments */
@media (max-width: 768px) {
    .indus-badge-lg[b-prjpeqabjy] {
        padding: 0.625rem 1rem;
        font-size: 0.875rem;
        min-height: 2.5rem;
    }
    
    .indus-badge-md[b-prjpeqabjy] {
        padding: 0.5rem 0.875rem;
        font-size: 0.8125rem;
        min-height: 2rem;
    }
}

/* Ultra-high specificity override to combat any conflicting CSS rules */
.device-horizontal-card .indus-badge.indus-badge[b-prjpeqabjy],
.device-horizontal-card .e-card-header .indus-badge.indus-badge[b-prjpeqabjy],
.device-horizontal-card .e-card-header-caption .indus-badge.indus-badge[b-prjpeqabjy] {
    background: var(--badge-bg) !important;
    background-color: var(--badge-bg) !important;
    background-image: var(--badge-gradient) !important;
}

/* Ensure gradients are never overridden */
.indus-badge-type.indus-badge-type[b-prjpeqabjy] {
    --badge-bg: #64748b;
    --badge-gradient: linear-gradient(135deg, #64748b 0%, #475569 100%);
    background: linear-gradient(135deg, #64748b 0%, #475569 100%) !important;
}

.indus-badge-department.indus-badge-department[b-prjpeqabjy] {
    --badge-bg: #7c3aed;
    --badge-gradient: linear-gradient(135deg, #7c3aed 0%, #6d28d9 100%);
    background: linear-gradient(135deg, #7c3aed 0%, #6d28d9 100%) !important;
}

.indus-badge-location.indus-badge-location[b-prjpeqabjy] {
    --badge-bg: #0891b2;
    --badge-gradient: linear-gradient(135deg, #0891b2 0%, #0e7490 100%);
    background: linear-gradient(135deg, #0891b2 0%, #0e7490 100%) !important;
}

.indus-badge-status.indus-badge-status[b-prjpeqabjy] {
    --badge-bg: #059669;
    --badge-gradient: linear-gradient(135deg, #059669 0%, #047857 100%);
    background: linear-gradient(135deg, #059669 0%, #047857 100%) !important;
}
/* /Components/Shared/IndusXDialog.razor.rz.scp.css */
/* IndusX Dialog Component Styles */

/* Base dialog styles */
.indus-modal[b-osv455e5es] {
    --indus-primary: #2c5f2d;
    --indus-accent: #97bc62;
    --indus-border: #e9ecef;
    --indus-shadow: 0 4px 16px rgb(0 0 0 / 15%);
}

.indus-modal .e-dialog[b-osv455e5es] {
    border: 1px solid var(--indus-border);
    border-radius: 0.5rem;
    box-shadow: var(--indus-shadow);
}

.indus-modal .e-dlg-header[b-osv455e5es] {
    padding: 1rem 1.5rem;
    font-size: 1.1rem;
    font-weight: 600;
    color: white;
    background: linear-gradient(135deg, var(--indus-primary), #1e4220);
    border-radius: 0.5rem 0.5rem 0 0;
}

.indus-modal .e-dlg-header .e-icon-dlg-close[b-osv455e5es] {
    color: white;
    opacity: 0.9;
    transition: opacity 0.2s ease;
}

.indus-modal .e-dlg-header .e-icon-dlg-close:hover[b-osv455e5es] {
    background-color: rgb(255 255 255 / 10%);
    opacity: 1;
}

.indus-modal .e-dlg-content[b-osv455e5es] {
    padding: 0;
    background: #fafafa;
}

.indus-modal .e-footer-content[b-osv455e5es] {
    padding: 1rem 1.5rem;
    background: white;
    border-top: 1px solid var(--indus-border);
    border-radius: 0 0 0.5rem 0.5rem;
}

/* Form content styling */
.indus-modal .dialog-content[b-osv455e5es],
.indus-modal .u-p-2[b-osv455e5es],
.indus-modal .p-3[b-osv455e5es] {
    min-height: 200px;
    background: white;
}

.indus-modal .indus-form__group[b-osv455e5es] {
    margin-bottom: 1.5rem;
}

.indus-modal .indus-form__label[b-osv455e5es] {
    display: block;
    margin-bottom: 0.5rem;
    font-weight: 600;
    color: #333333;
}

.indus-modal .indus-form__label.required[b-osv455e5es]::after {
    color: #dc3545;
    content: " *";
}

/* Button styling */
.indus-modal .e-btn[b-osv455e5es] {
    padding: 0.5rem 1.5rem;
    font-weight: 500;
    border-radius: 0.375rem;
    transition: all 0.2s ease;
}

.indus-modal .e-btn.e-primary[b-osv455e5es] {
    background: var(--indus-primary);
    border-color: var(--indus-primary);
}

.indus-modal .e-btn.e-primary:hover[b-osv455e5es] {
    background: #1e4220;
    border-color: #1e4220;
    box-shadow: 0 2px 8px rgb(44 95 45 / 30%);
    transform: translateY(-1px);
}

.indus-modal .e-btn.e-outline[b-osv455e5es] {
    color: #6c757d;
    border-color: var(--indus-border);
}

.indus-modal .e-btn.e-outline:hover[b-osv455e5es] {
    background: #f8f9fa;
    border-color: #adb5bd;
}

/* Mobile optimizations */
.indus-modal.mobile-optimized[b-osv455e5es] {
    --mobile-spacing: 0.75rem;
}

.indus-modal.mobile-optimized .e-dialog[b-osv455e5es] {
    max-width: calc(100vw - 2rem);
    max-height: calc(100vh - 2rem);
    margin: 1rem;
}

.indus-modal.mobile-optimized .e-dlg-header[b-osv455e5es] {
    padding: var(--mobile-spacing) 1rem;
    font-size: 1rem;
}

.indus-modal.mobile-optimized .u-p-2[b-osv455e5es],
.indus-modal.mobile-optimized .p-3[b-osv455e5es] {
    padding: var(--mobile-spacing) !important;
}

.indus-modal.mobile-optimized .e-footer-content[b-osv455e5es] {
    padding: var(--mobile-spacing) 1rem;
}

.indus-modal.mobile-optimized .indus-form__group[b-osv455e5es] {
    margin-bottom: 1rem;
}

.indus-modal.mobile-optimized .e-btn[b-osv455e5es] {
    min-width: 100px;
    padding: 0.75rem 1.25rem;
    touch-action: manipulation;
}

.indus-modal.mobile-optimized .d-flex.gap-2[b-osv455e5es] {
    flex-direction: column-reverse;
    gap: 0.5rem !important;
}

.indus-modal.mobile-optimized .d-flex.gap-2 .e-btn[b-osv455e5es] {
    width: 100%;
}

/* Syncfusion component overrides for mobile */
.indus-modal.mobile-optimized .e-input-group[b-osv455e5es],
.indus-modal.mobile-optimized .e-dropdownlist[b-osv455e5es],
.indus-modal.mobile-optimized .e-datepicker[b-osv455e5es] {
    height: 44px;
    font-size: 16px; /* Prevents zoom on iOS */
}

.indus-modal.mobile-optimized .e-input-group input[b-osv455e5es],
.indus-modal.mobile-optimized .e-dropdownlist input[b-osv455e5es] {
    height: 42px;
    padding: 0.75rem;
}

/* Validation styling */
.indus-modal .validation-errors[b-osv455e5es] {
    padding: 0.75rem;
    margin-bottom: 1rem;
    background: #f8d7da;
    border: 1px solid #f5c6cb;
    border-radius: 0.375rem;
}

.indus-modal .validation-message[b-osv455e5es] {
    margin-top: 0.25rem;
    font-size: 0.875rem;
    color: #dc3545;
}

/* Loading states */
.indus-modal .loading-overlay[b-osv455e5es] {
    position: absolute;
    inset: 0;
    z-index: 1000;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgb(255 255 255 / 90%);
}

/* Responsive breakpoints */
@media (width <= 768px) {
    .indus-modal .row[b-osv455e5es] {
        margin: 0;
    }
    
    .indus-modal .col-md-6[b-osv455e5es],
    .indus-modal .col-md-4[b-osv455e5es],
    .indus-modal .col-md-8[b-osv455e5es] {
        padding: 0.25rem;
        margin-bottom: 0.5rem;
    }
}

@media (width <= 576px) {
    .indus-modal .e-dialog[b-osv455e5es] {
        max-width: calc(100vw - 1rem);
        margin: 0.5rem;
    }
    
    .indus-modal.mobile-optimized .d-flex.justify-content-end[b-osv455e5es] {
        justify-content: stretch !important;
    }
}

/* Dark mode support (future enhancement) */
@media (prefers-color-scheme: dark) {
    .indus-modal[b-osv455e5es] {
        --indus-border: #495057;
        --indus-shadow: 0 4px 16px rgb(0 0 0 / 30%);
    }
    
    .indus-modal .e-dlg-content[b-osv455e5es] {
        background: #343a40;
    }
    
    .indus-modal .dialog-content[b-osv455e5es],
    .indus-modal .u-p-2[b-osv455e5es],
    .indus-modal .p-3[b-osv455e5es] {
        color: white;
        background: #495057;
    }
}

/* Animation enhancements */
.indus-modal .e-dialog[b-osv455e5es] {
    animation: dialogFadeIn-b-osv455e5es 0.3s ease-out;
}

@keyframes dialogFadeIn-b-osv455e5es {
    from {
        opacity: 0;
        transform: translateY(-20px) scale(0.95);
    }

    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}
/* /Components/Shared/LoadingOverlay.razor.rz.scp.css */
.overlay[b-br70x592so] {
    position: fixed; 
    inset: 0;
    z-index: 9999;
    display: flex; 
    align-items: center; 
    justify-content: center;
}

.backdrop[b-br70x592so] {
    position: absolute; 
    inset: 0;
    background: rgb(255 255 255 / 90%);
    backdrop-filter: blur(2px);
}

@media (prefers-color-scheme: dark) {
    .backdrop[b-br70x592so] { 
        background: rgb(0 0 0 / 80%); 
    }
}

.card[b-br70x592so] {
    position: relative; 
    z-index: 1;
    display: flex; 
    flex-direction: column; 
    gap: 1rem; 
    align-items: center;
    min-width: 300px;
    max-width: 400px;
    padding: 2rem; 
    color: var(--bs-body-color, #212529);
    background: var(--bs-body-bg, #ffffff); 
    border-radius: 12px; 
    box-shadow: 0 10px 30px rgb(0 0 0 / 15%);
}

.msg[b-br70x592so] { 
    margin: 0; 
    font-size: 1.1rem; 
    font-weight: 500; 
    color: var(--indus-gray-700, #616161); 
    text-align: center;
}

/* Enhanced Spinner - reuse existing animation */
.enhanced-spinner[b-br70x592so] {
    width: 50px;
    height: 50px;
    border: 4px solid #e3f2fd;
    border-top: 4px solid var(--indus-primary, #2d8b93);
    border-right: 4px solid var(--indus-primary-light, #4db6c2);
    border-radius: 50%;
    box-shadow: 0 0 20px rgb(45 139 147 / 30%);
    animation: enhanced-spin-b-br70x592so 1.2s linear infinite;
}

@keyframes enhanced-spin-b-br70x592so {
    0% { transform: rotate(0deg); }
    25% { box-shadow: 0 0 25px rgb(45 139 147 / 40%); transform: rotate(90deg); }
    50% { box-shadow: 0 0 30px rgb(45 139 147 / 50%); transform: rotate(180deg); }
    75% { box-shadow: 0 0 25px rgb(45 139 147 / 40%); transform: rotate(270deg); }
    100% { box-shadow: 0 0 20px rgb(45 139 147 / 30%); transform: rotate(360deg); }
}

/* Progress Bar Styles */
.progress-container[b-br70x592so] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    align-items: center;
    width: 100%;
}

.progress-bar[b-br70x592so] {
    width: 200px;
    height: 12px;
    overflow: hidden;
    background-color: #e0e0e0;
    border-radius: 6px;
    box-shadow: inset 0 1px 3px rgb(0 0 0 / 10%);
}

.progress-fill[b-br70x592so] {
    height: 100%;
    background: linear-gradient(90deg, var(--indus-primary, #2d8b93), var(--indus-primary-light, #4db6c2));
    border-radius: 6px;
    box-shadow: 0 1px 3px rgb(45 139 147 / 30%);
    transition: width 0.3s ease;
}

.progress-text[b-br70x592so] {
    font-size: 0.875rem;
    font-weight: 500;
    color: var(--indus-gray-600, #757575);
}
/* /Components/Shared/SmartFilterMenu.razor.rz.scp.css */
.smart-filter-container[b-ltikkp4zbs] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    position: relative;
}

/* Backdrop when filter panel is open */
[b-ltikkp4zbs] .smart-filter-backdrop {
    position: fixed;
    inset: 0;
    background-color: rgba(0, 0, 0, 0.1);
    z-index: 40;
}
/* /Components/Shared/SparePartUsageDialog.razor.rz.scp.css */
/* Scope-local design tokens to neutralize green variables inside this dialog */
.spare-part-usage-dialog[b-3pbnj4cjfh] {
  --indus-primary: #2563EB;       /* royal blue */
  --indus-primary-dark: #1E40AF;  /* indigo-800 */
  --indus-primary-light: #60A5FA; /* blue-400 */
}

/* Use ::deep to reach third-party DOM rendered by Syncfusion within isolated CSS */
.spare-part-usage-dialog :deep(.e-grid .e-gridheader)[b-3pbnj4cjfh] {
  /* Override global app.css !important rules */
  background-color: #0B1220 !important;
  background: linear-gradient(180deg, var(--indus-toolbar-from, #0B1220), var(--indus-toolbar-to, #0F1A2B)) !important;
  border-bottom: 2px solid var(--indus-toolbar-accent, #2563EB) !important;
}

.spare-part-usage-dialog :deep(.e-grid .e-gridheader .e-headercell)[b-3pbnj4cjfh],
.spare-part-usage-dialog :deep(.e-grid .e-gridheader .e-headercelldiv)[b-3pbnj4cjfh],
.spare-part-usage-dialog :deep(.e-grid .e-gridheader .e-headertext)[b-3pbnj4cjfh] {
  background-color: transparent !important;
  color: var(--indus-toolbar-text, #E5E7EB) !important;
}

.spare-part-usage-dialog :deep(.e-grid .e-rowcell)[b-3pbnj4cjfh] { font-size: 0.93rem; }
/* /Components/Shared/temp/IndusXConfirmDialog.razor.rz.scp.css */
/* IndusX Confirmation Dialog Styles */

.indus-confirm-dialog[b-0qq2myr0q2] {
    --confirm-border-radius: 0.5rem;
    --confirm-shadow: 0 8px 24px rgb(0 0 0 / 15%);
}

.indus-confirm-dialog .e-dialog[b-0qq2myr0q2] {
    overflow: hidden;
    border: none;
    border-radius: var(--confirm-border-radius);
    box-shadow: var(--confirm-shadow);
}

.indus-confirm-dialog .e-dlg-header[b-0qq2myr0q2] {
    padding: 1.25rem 1.5rem 1rem;
    font-size: 1.1rem;
    font-weight: 600;
    background: #f8f9fa;
    border-bottom: 1px solid #e9ecef;
}

.indus-confirm-dialog .e-dlg-content[b-0qq2myr0q2] {
    padding: 0;
}

.indus-confirm-dialog .e-footer-content[b-0qq2myr0q2] {
    padding: 1rem 1.5rem 1.25rem;
    background: #f8f9fa;
    border-top: 1px solid #e9ecef;
}

/* Content styling */
.indus-confirm-dialog .confirm-icon[b-0qq2myr0q2] {
    margin-bottom: 0.5rem;
    font-size: 3rem;
}

.indus-confirm-dialog .confirm-message[b-0qq2myr0q2] {
    font-size: 1rem;
    line-height: 1.5;
    color: #495057;
    text-align: center;
}

.indus-confirm-dialog .confirm-message p[b-0qq2myr0q2] {
    margin-bottom: 0;
}

.indus-confirm-dialog .confirm-details[b-0qq2myr0q2] {
    padding-top: 1rem;
    margin-top: 1rem;
    border-top: 1px solid #e9ecef;
}

.indus-confirm-dialog .confirm-details summary[b-0qq2myr0q2] {
    font-weight: 500;
    color: #6c757d;
    cursor: pointer;
    outline: none;
}

.indus-confirm-dialog .confirm-details summary:hover[b-0qq2myr0q2] {
    color: #495057;
}

/* Type-specific styling */
.indus-confirm-dialog.confirm-success .e-dlg-header[b-0qq2myr0q2] {
    color: #155724;
    background: linear-gradient(135deg, #d4edda, #c3e6cb);
}

.indus-confirm-dialog.confirm-warning .e-dlg-header[b-0qq2myr0q2] {
    color: #856404;
    background: linear-gradient(135deg, #fff3cd, #ffeaa7);
}

.indus-confirm-dialog.confirm-danger .e-dlg-header[b-0qq2myr0q2] {
    color: #721c24;
    background: linear-gradient(135deg, #f8d7da, #f5c6cb);
}

.indus-confirm-dialog.confirm-info .e-dlg-header[b-0qq2myr0q2] {
    color: #0c5460;
    background: linear-gradient(135deg, #d1ecf1, #bee5eb);
}

/* Button styling */
.indus-confirm-dialog .e-btn[b-0qq2myr0q2] {
    min-width: 100px;
    padding: 0.625rem 1.5rem;
    font-weight: 500;
    border-radius: 0.375rem;
    transition: all 0.2s ease;
}

.indus-confirm-dialog .e-btn.e-primary[b-0qq2myr0q2] {
    background: #2c5f2d;
    border-color: #2c5f2d;
}

.indus-confirm-dialog .e-btn.e-primary:hover[b-0qq2myr0q2] {
    background: #1e4220;
    border-color: #1e4220;
    box-shadow: 0 2px 8px rgb(44 95 45 / 30%);
    transform: translateY(-1px);
}

.indus-confirm-dialog .e-btn.e-outline[b-0qq2myr0q2] {
    color: #6c757d;
    border-color: #6c757d;
}

.indus-confirm-dialog .e-btn.e-outline:hover[b-0qq2myr0q2] {
    color: white;
    background: #6c757d;
    border-color: #6c757d;
}

/* Danger button for delete confirmations */
.indus-confirm-dialog.confirm-danger .e-btn.e-primary[b-0qq2myr0q2] {
    background: #dc3545;
    border-color: #dc3545;
}

.indus-confirm-dialog.confirm-danger .e-btn.e-primary:hover[b-0qq2myr0q2] {
    background: #c82333;
    border-color: #bd2130;
    box-shadow: 0 2px 8px rgb(220 53 69 / 30%);
}

/* Mobile optimizations */
.indus-confirm-dialog.mobile-optimized .e-dialog[b-0qq2myr0q2] {
    max-width: calc(100vw - 2rem);
    margin: 1rem;
}

.indus-confirm-dialog.mobile-optimized .e-dlg-header[b-0qq2myr0q2] {
    padding: 1rem;
    font-size: 1rem;
}

.indus-confirm-dialog.mobile-optimized .e-dlg-content .p-3[b-0qq2myr0q2],
.indus-confirm-dialog.mobile-optimized .e-dlg-content .p-4[b-0qq2myr0q2] {
    padding: 1rem !important;
}

.indus-confirm-dialog.mobile-optimized .e-footer-content[b-0qq2myr0q2] {
    padding: 1rem;
}

.indus-confirm-dialog.mobile-optimized .confirm-icon[b-0qq2myr0q2] {
    font-size: 2.5rem;
}

.indus-confirm-dialog.mobile-optimized .e-btn[b-0qq2myr0q2] {
    width: 100%;
    padding: 0.75rem 1rem;
    margin-bottom: 0.5rem;
}

.indus-confirm-dialog.mobile-optimized .d-flex.flex-column-reverse[b-0qq2myr0q2] {
    gap: 0.5rem !important;
}

.indus-confirm-dialog.mobile-optimized .d-flex.flex-column-reverse .e-btn:last-child[b-0qq2myr0q2] {
    margin-bottom: 0;
}

/* Animation */
.indus-confirm-dialog .e-dialog[b-0qq2myr0q2] {
    animation: confirmDialogSlideIn-b-0qq2myr0q2 0.25s ease-out;
}

@keyframes confirmDialogSlideIn-b-0qq2myr0q2 {
    from {
        opacity: 0;
        transform: translateY(-10px) scale(0.98);
    }

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

/* Accessibility improvements */
.indus-confirm-dialog .confirm-icon[b-0qq2myr0q2] {
    animation: iconPulse-b-0qq2myr0q2 2s ease-in-out infinite;
}

@keyframes iconPulse-b-0qq2myr0q2 {
    0%, 100% {
        transform: scale(1);
    }

    50% {
        transform: scale(1.05);
    }
}

.indus-confirm-dialog .e-btn:focus[b-0qq2myr0q2] {
    outline: 2px solid #97bc62;
    outline-offset: 2px;
}

/* High contrast mode support */
@media (prefers-contrast: high) {
    .indus-confirm-dialog .e-dlg-header[b-0qq2myr0q2] {
        border-bottom: 2px solid;
    }
    
    .indus-confirm-dialog .e-footer-content[b-0qq2myr0q2] {
        border-top: 2px solid;
    }
    
    .indus-confirm-dialog .confirm-details[b-0qq2myr0q2] {
        border-top: 2px solid;
    }
}

/* Reduced motion support */
@media (prefers-reduced-motion: reduce) {
    .indus-confirm-dialog .e-dialog[b-0qq2myr0q2] {
        animation: none;
    }
    
    .indus-confirm-dialog .confirm-icon[b-0qq2myr0q2] {
        animation: none;
    }
    
    .indus-confirm-dialog .e-btn[b-0qq2myr0q2] {
        transition: none;
    }
    
    .indus-confirm-dialog .e-btn:hover[b-0qq2myr0q2] {
        transform: none;
    }
}