.excel-red-color {
    background-color: red !important;
}

.excel-pink-color {
    background-color: pink !important;
}

.excel-orange-color {
    background-color: orange !important;
}

.excel-darksalmon-color {
    background-color: darksalmon !important;
}

.excel-yellow-color {
    background-color: yellow !important;
}

.excel-rosybrown-color {
    background-color: crimson !important;
}

.excel-firebrick-color {
    background-color: firebrick !important;
}

.excel-darkGray-color {
    background-color: darkGray !important;
}

.excel-lightGray-color {
    background-color: lightGray !important;
}

.excel-white-color {
    background-color: white !important;
}

.rb-invalid-tooltip {
    position: absolute;
    z-index: 5;
    max-width: 100%;
    padding: 0.25rem 0.5rem;
    font-size: 10px;
    color: #fff;
    background-color: rgba(220, 53, 69, .9);
    border-radius: 0.25rem;
}
    .rb-invalid-tooltip:after {
        content: '';
        display: block;
        position: absolute;
        left: 38%;
        bottom: 16px;
        width: 0;
        height: 0;
        border: 14px solid transparent;
        border-top-color: rgba(220, 53, 69, .9);
        -webkit-transform: rotate(-179deg);
    }

.rb-valid-tooltip {
    display: none;
}

.pointer-icon {
    cursor: pointer;
}
.showUpdateRB .updaterb {
    display: block;
}

.hideUpdateRB .updaterb {
    display: none;
}

.showUpdateCB .updatecb {
    display: block;
}

.hideUpdateCB .updatecb {
    display: none;
}

.showDeleteCB .deletecb {
    display: block;
}

.showDeleteCB .deletecb {
    display: none;
}
/* Apply opacity to td with class 'e-checkbox-disabled' */
td.e-checkbox-disabled {
    opacity: 0.3;
}

/* Apply cursor style to all child elements of td with class 'e-checkbox-disabled' */
td.e-checkbox-disabled * * {
    cursor: not-allowed !important;
}


/*.e-grid .e-altrow {
    background-color: #fafafa !important;
}*/

.mudIconButtonSizeIconClearFilter {
    font-size: 18px !important;
}

.gridCheckBox .gridCheckBox {
    height: 20px !important; /* Adjust this value to your desired height */
    width: 20px !important; /* Optional: Adjust width if needed */
    padding: 0 !important;
    margin: 0 !important;
}

.e-grid .e-rowcell .e-checkbox-wrapper,
.e-grid .e-rowcell .e-css.e-checkbox-wrapper {
    display: flex !important; /* Use flexbox to align items */
    justify-content: center !important; /* Center horizontally */
    align-items: center !important; /* Center vertically */
    height: 100% !important; /* Ensure the wrapper takes the full height of its container */
}

.e-grid .e-icon-ascending::before {
    font-family: 'icomoon' !important;
    content: '\e987' !important;
}

.e-grid .e-icon-descending::before {
    font-family: 'icomoon' !important;
    content: '\e986' !important;
}

.e-grid .e-filtered::before {
    color: #757575 !important;
}

.e-grid .e-icon-filter.e-filtered::before {
    font-family: "icomoon" !important;
    content: '\e985' !important;
    font-size: 10px !important;
}


.cbGrid {
    font-size: 5px;
}
.cbGrid {
    font-size: 11px !important;
}
.cbGridCustomFormat {
    font-size: .65rem !important;
}
.cbGrid.e-headercell {
    padding: 0px !important;
    vertical-align: middle !important;
    font-size: 12px !important;
    font-weight: 300;
    /*background-color: #ff8527;*/
    color: white
}
.cbGrid.e-rowcell {
    font-size: 11px !important;
    font-weight: 200 !important;
    
}

.rbGrid {
    font-size: 5px;
}

.rbGrid {
    font-size: 11px !important;
}

.rbGridCustomFormat {
    font-size: .65rem !important;
}

.rbGrid.e-headercell {
    padding: 0px !important;
    vertical-align: middle !important;
    font-size: 12px !important;
    font-weight: 300;
    /*background-color: #CFD8DC;*/
    color: white
}

.rbGrid.e-rowcell {
    font-size: 11px !important;
    font-weight: 200 !important;
    
}


.chargebeeSyncRBGrid {
    font-size: 5px;
}

.chargebeeSyncRBGrid {
    font-size: 11px !important;
}

.chargebeeSyncRBGridCustomFormat {
    font-size: .65rem !important;
}

.chargebeeSyncRBGrid.e-headercell {
    padding: 0px !important;
    vertical-align: middle !important;
    font-size: 12px !important;
    font-weight: 300;
    background-color: var(--mud-palette-table-striped);
    /* color: white*/
}

.chargebeeSyncRBGrid.e-rowcell {
    font-size: 11px !important;
    font-weight: 200 !important;
    /*background-color: white !important;*/
}


.chargebeeSyncCBGrid {
    font-size: 5px;
}

.chargebeeSyncCBGrid {
    font-size: 11px !important;
}

.chargebeeSyncCBGridCustomFormat {
    font-size: .65rem !important;
}

.chargebeeSyncCBGrid.e-headercell {
    padding: 0px !important;
    vertical-align: middle !important;
    font-size: 12px !important;
    font-weight: 300;
    background-color: var(--mud-palette-table-striped);
    /* color: white*/
}

.chargebeeSyncCBGrid.e-rowcell {
    font-size: 11px !important;
    font-weight: 200 !important;
    /*background-color: white !important;*/
}

.portalSideGrid {
    font-size: 5px;
}

.portalSideGrid {
    font-size: 11px !important;
}

.portalSideGridCustomFormat {
    font-size: .65rem !important;
}

.portalSideGrid.e-headercell {
    padding: 0px !important;
    vertical-align: middle !important;
    font-size: 12px !important;
    font-weight: 300;
    background-color: var(--mud-palette-table-striped);
    /* color: white*/
}

.portalSideGrid.e-rowcell {
    font-size: 11px !important;
    font-weight: 200 !important;
    /*background-color: white !important;*/
}

.e-icon-filter {
    position: absolute;
    right: 1%; /* Aligns the element to the right */
    /* Vertically centers the element */
    transform: translateY(20%); /* Vertically centers the element */
    top: 60%; /* Positions the element vertically in the middle */
}

.e-sortfilterdiv {
    position: absolute;
    right: 1%; /* Aligns the element to the right */
    transform: translateY(40%); /* Vertically centers the element */
    top: 60%; /* Positions the element vertically in the middle */
}


.routineTasksContent {
    display: flex;
    justify-content: start;
    align-items: center;
    min-height: 65px;
    width: 100%;
    padding: 5px 10px 5px 30px;
    font-size: 1rem;
    background-color: #2d4a72;
    border: 2px solid #2d4a72;
    border-radius: 0px 10px 10px 0px;
    position: relative;
    text-align: left;
    color: #fff;
}

.routineTasksIcon {
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 85px;
    min-width: 85px;
    border-radius: 50%;
    margin-right: -25px;
    border: 5px solid #2d4a72;
    z-index: 999;
    background: #fff;
}

.servicePortalTileContainer:hover .routineTasksContent,
.servicePortalTileContainer:hover .routineTasksIcon {
    background-color: #2d4a72;
    border: 2px solid #fff;
    color: #fff;
}

.errorsExceptionsContent {
    display: flex;
    justify-content: start;
    align-items: center;
    min-height: 65px;
    width: 100%;
    padding: 5px 10px 5px 30px;
    font-size: 1rem;
    background-color: #1b9ed6;
    border: 2px solid #1b9ed6;
    border-radius: 0px 10px 10px 0px;
    position: relative;
    text-align: left;
    color: #fff;
}

.errorsExceptionsIcon {
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 85px;
    min-width: 85px;
    border-radius: 50%;
    margin-right: -25px;
    border: 5px solid #1b9ed6;
    z-index: 999;
    background: #fff;
}

.servicePortalTileContainer:hover .errorsExceptionsContent,
.servicePortalTileContainer:hover .errorsExceptionsIcon {
    background-color: #1b9ed6;
    border: 2px solid #fff;
    color: #fff;
}

.orgBusinessTasksContent {
    display: flex;
    justify-content: start;
    align-items: center;
    min-height: 65px;
    width: 100%;
    padding: 5px 10px 5px 30px;
    font-size: 1rem;
    background-color: #48c3e9;
    border: 2px solid #48c3e9;
    border-radius: 0px 10px 10px 0px;
    position: relative;
    text-align: left;
    color: #fff;
}

.orgBusinessTasksIcon {
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 85px;
    min-width: 85px;
    border-radius: 50%;
    margin-right: -25px;
    border: 5px solid #48c3e9;
    z-index: 999;
    background: #fff;
}

.servicePortalTileContainer:hover .orgBusinessTasksContent,
.servicePortalTileContainer:hover .orgBusinessTasksIcon {
    background-color: #48c3e9;
    border: 2px solid #fff;
    color: #fff;
}

.systemSetupContent {
    display: flex;
    justify-content: start;
    align-items: center;
    min-height: 65px;
    width: 100%;
    padding: 5px 10px 5px 30px;
    font-size: 1rem;
    background-color: rgb(0, 200, 83);
    border: 2px solid rgb(0, 200, 83);
    border-radius: 0px 10px 10px 0px;
    position: relative;
    text-align: left;
    color: #fff;
}

.systemSetupIcon {
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 85px;
    min-width: 85px;
    border-radius: 50%;
    margin-right: -25px;
    border: 5px solid rgb(0, 200, 83);
    z-index: 999;
    background: #fff;
}

.servicePortalTileContainer:hover .systemSetupContent,
.servicePortalTileContainer:hover .systemSetupIcon {
    background-color: rgb(0, 200, 83);
    border: 2px solid #fff;
    color: #fff;
}

.lineItemGridTextRight .e-input {
    text-align: right !important;
}

.e-sheet-panel {
    height: calc(100vh - 12rem) !important;
}

.mud-overlay .mud-overlay-scrim.mud-overlay-dark {
    background-color: transparent !important;
}