.dx-datagrid-rowsview {
    overflow-x: auto !important; /* Ensures scrollbar is always available */
    overflow-y: hidden !important; /* Prevents vertical scrollbar */
    height: 100% !important; /* Ensures dynamic height */
}

/* Disables DevExtreme's internal hover-based scrollbar behavior */
.dx-scrollable-container {
    overflow-x: auto !important; /* Forces a single scrollbar */
    scrollbar-gutter: stable; /* Reserves space for the scrollbar */
    transform: translateZ(0);
}

.dx-datagrid-rowsview .dx-row:nth-child(odd) {
    background-color: lightgray !important; /* White for odd rows */
    border-bottom: 1px solid #ccc;
}

.dx-datagrid-rowsview .dx-row:nth-child(even) {
    background-color: #f9f9f9 !important; /* Light gray for even rows */
    border-bottom: 1px solid #ccc;
}
/* Prevents DevExtreme from creating an additional scrollbar */
.dx-scrollbar-horizontal {
    opacity: 1 !important;
    visibility: visible !important;
    height: 16px; /* Ensures scrollbar visibility */
}

/* Ensures the grid spans full width and does not wrap */
.dx-datagrid {
    width: 100% !important;
    min-width: 100%;
    max-width: none; /* Prevents width restrictions */
    overflow: hidden;
}

/* Prevents DevExtreme from re-injecting an extra scrollbar */
.dx-scrollable-content {
    overflow-x: visible !important;
}

/* Disables the hover effect that causes a second scrollbar */
.dx-scrollbar {
    display: none !important; /* Prevents DevExtreme's secondary scrollbar */
}

/* Prevents the second scrollbar when scrolling */
.dx-scrollbar-hoverable {
    display: none !important; /* Removes hover-based scrollbar */
}

/* Ensures the header and rows align properly */
.dx-datagrid-headers,
.dx-datagrid-rowsview {
    min-width: 100%;
}