﻿html, body {
    font-family: roboto, poppins, sans-serif;
    font-weight: normal;
}

.RadInput_Bootstrap, .RadInputMgr_Bootstrap {
    font-family: roboto, poppins, sans-serif !important;
}

.RadGrid_Bootstrap {
    font-family: roboto, poppins, sans-serif !important;
}

.btn {
    font-family: roboto, poppins, sans-serif !important;
}

.RadButton .rbText {
    user-select: none;
}

.RadButtonIcon {
    font-size: inherit;
    padding-right: 8px;
    vertical-align: top;
    line-height: 1.42857143;
}

.swal2-popup .swal2-content {
    font-weight: normal;
}

.validation {
    color: red;
}

.ColorGreen {
    color: green;
}

pre {
    font-size: inherit;
}

/* Span */
.before::before {
    background-color: white !important;
}

/* RadioButtonList */
.rbl input[type="radio"] {
    margin-left: 10px;
    margin-right: 1px;
    margin-bottom: 2px;
    vertical-align: middle;
}

.rbl label {
    cursor: pointer;
}

/* MAIN CSS for all detail pages*/
.padd {
    padding: 30px 30px 30px 30px;
}

.padd-top {
    padding-top: 30px;
}

.noPadd {
    padding: 0;
}

.pnl {
    padding: 30px 30px 30px 30px;
    background-color: #ebedf2;
    /*background-color: white;*/
}

.wrapper {
    padding: 30px 30px 30px 30px;
    background-color: white;
}

.form-row:not(.noPadd) {
    padding-left: 15px;
    padding-right: 15px;
}

.wrap {
    background-color: #ebedf2;
}

input[type='checkbox'] {
    vertical-align: middle;
    margin-right: 5px;
    display: inline-block;
}

/* Ensures the <asp:checkbox aligns with the label*/
label {
    margin-bottom: 0 !important;
}

.align-center {
    align-items: center;
}


/* Company Site setting*/
.move-left {
    width: auto;
    box-shadow: none;
}

.field-tip {
    color: red;
    float: right;
    font-style: italic;
    font-size: 10px;
}

.btnPadd {
    padding: 0 30px 30px 30px;
}


.m-menu__link-icon, .m-menu__section-text, .m-menu__link-text, .m-menu__link-bullet, .m-menu__link-bullet--dot {
    color: white !important;
}

/* ASP COMBO BOX CSS BELOW*/
/** format the LI in the dropdown */
.rcbHeader ul,
.rcbFooter ul,
.rcbItem ul,
.rcbHovered ul,
.rcbDisabled ul {
    margin: 0;
    padding: 0;
    width: 100%;
    display: inline-block;
    list-style-type: none;
}


.rcbScroll {
    overflow: scroll !important;
    overflow-x: auto !important;
}

/* columns inside the dropdown*/
.col1,
.col2,
.col3 {
    margin: 0;
    padding: 0 0 0 0;
    width: 30%;
    line-height: 14px;
    float: left;
}

.rcbActionButton {
    background: transparent !important;
    padding-top: 0 !important;
    padding-right: 0 !important;
    border-style: none !important;
}

.p-icon:before {
    font-size: 14px !important;
}

.rcbExpanded .rcbActionButton {
    color: black !important;
}

.rcbFocused .rcbActionButton {
    color: black !important;
}

.RadComboBox {
    padding-right: 0 !important;
}

/*.rcbSlide {
    left: 0px !important;
}*/

.RadGrid_Bootstrap .rgFilterRow {
    background-color: white !important;
}

.QT9GridContainer .RadGrid {
    width: auto !important;
}

.QT9GridContainer .rgDataDiv {
    height: auto !important;
    max-height: 550px !important;
}

.QT9GridContainer .rgHeaderWrapper {
    height: auto !important;
}

.NextPrevAndNumeric .rgPagerLabel[id$='ChangePageSizeLabel'] {
    padding-left: 8px;
    padding-top: 5px;
}

.NextPrevAndNumeric .RadComboBox[id$='PageSizeComboBox'] {
    padding-top: 5px !important;
}

    .NextPrevAndNumeric .RadComboBox[id$='PageSizeComboBox'] .rcbInner {
        padding: 2px 0px 0px 4px !important;
    }

.btn-export {
    color: white !important;
}

.noDataInGrid {
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.RadGrid {
    display: flex;
    flex-direction: column;
}

.QT9GridContainer .rgDataDiv {
    flex-grow: 1;
}

.QT9GridContainer > [id$=rGridRecordPanel], .RadGrid, .rgMasterTable:has(.noDataInGrid), .noDataInGrid {
    height: 100% !important;
}

.pnlKey {
    z-index: 1;
    position: relative;
    float: left;
    top: 3rem;
    margin-bottom: -3rem;
}

.RadGrid_Bootstrap .rgFooter > td {
    padding: 10px 15px;
}

.RadUpload {
    width: auto !important;
}

.k-select {
    border-color: #ffffff !important;
    color: #333 !important;
    background-color: #ffffff !important;
    background-image: linear-gradient(white,#ffffff) !important;
    border-radius: 0 4px 4px 0 !important;
}

.m-menu__nav {
    padding: 0 0 30px 0 !important;
}

.modal-open.overflow-hidden {
    overflow: hidden !important;
}

/* END ASP COMBO BOX CSS */
/* MODAL STYLING */
.modal-dialog.newAddress,
.modal-content.newAddress {
    /* 80% of window height */
    height: 95%;
}

.modal-dialog.newAddress {
    max-width: 75%;
}

.modal-body.newAddress {
    /* 100% = dialog height, 120px = header + footer */
    max-height: calc(100% - 100px);
    overflow-y: scroll;
}



.rbLinkButton .rbText {
    text-align: left !important;
}



/* UC_GRID STYLING */
.RadGrid_Bootstrap .rgPagerCell .rgNumPart .rgCurrentPage {
    background-color: #047835 !important;
    border: 1px solid #2e6da4;
    color: #fff;
}

.rgFooter {
    padding: 7px 7px;
    height: 32px;
    border-bottom: 1px solid #dedede;
    font-weight: bold;
}


.rgGroupHeader > td {
    padding: 7px 0;
    height: 32px;
    border-bottom: 1px solid #dedede;
    background-color: #555 !important;
    color: #EEE !important;
    /*clear:both !important;*/
}

.rmScrollWrap, .rmGroup, .rmLevel0 {
    width: 225px !important;
}

.rgHeader, .rgResizeCol, .rgHeaderWrapper, .rgMultiHeaderRow th.rgHeader {
    border: 1px solid #dedede !important;
    background-color: #ccc !important;
    height: 44px !important;
}

.RadGrid_Bootstrap .rgGroupItem {
    padding: 0 7px;
    border: 1px solid #333;
    color: #333;
}

.rgFiltered {
    background-color: #047835 !important;
}

.rgHoveredRow > td, .rgHoveredRow {
    background: #aeaeae !important;
}

.rgSelectedCell, .rgSelectedRow > td, .rgSelectedRow {
    color: #fff;
    background: #047835 /*#575962*/ !important;
    border-color: #fff;
}

.rgSorted {
    background-color: #e4e4e4 !important;
    border: 1px dotted #047835 !important;
}

.noDataInGrid {
    margin: auto;
    font-size: 20px;
    font-weight: bolder;
    text-align: center;
    padding: 5px;
    /*border:1px solid #ff6600 ;*/
    background: #dfdfdf;
}

.GridContextMenu .rmSlide .rmItem input[type='checkbox'] {
    margin-bottom: 2px;
}

.GridContextMenu .rmSlide .rmItem label {
    cursor: pointer;
}

.RadInput {
    height: calc(2.95rem + 2px);
}

.RadDateTimePicker .RadInputError:after, .RadInputError.riContButton.riContSpinButtons:after,
.RadPicker .RadInputError:after, .RadInputError.riContButton:after, .RadInputError.riContSpinButtons:after {
    right: 35px !important;
}

.RadInputError:after {
    top: 3px !important;
}

.rgFilterRow .RadInput {
    height: auto;
}

.RadTabStrip_Bootstrap .rtsLevel1 .rtsSelected .rtsLink {
    border-color: #dadada !important;
    color: #000 !important;
    background-color: #dadada !important;
}

.RadTabGreen {
    background-color: #aaf3a7 !important;
}

.RadTabGreenHovered, .RadTabGreenHovered > .rtsLink {
    background-color: #93ef90 !important;
}

.RadTabBlue {
    background-color: #aecef3 !important;
}

.RadTabBlueHovered, .RadTabBlueHovered > .rtsLink {
    background-color: #92c2f7 !important;
}

.RadUpload .ruUploadProgress {
    width: 225px;
    display: inline-block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    vertical-align: top;
}

span.ruFileWrap {
    position: relative !important;
}

.ruBrowse {
    background-position: 0 -46px !important;
    width: 150px !important;
    margin-bottom: 10px !important;
    font-family: roboto, poppins, sans-serif !important;
    border: solid 1px #666 !important; /**/
}

.RadUpload_Bootstrap .ruButton {
    font-size: 13px !important;
    padding-bottom: 0.85rem !important;
    padding-left: 1.15rem !important;
    padding-right: 1.15rem !important;
    padding-top: 0.85rem !important;
    height: auto !important;
    width: auto !important;
    line-height: 1.25 !important;
}

.RadUpload_Bootstrap .ruFileWrap {
    height: auto !important;
    width: auto !important;
}

.ruDropZone {
    border: 1px dotted #696969 !important;
    background: transparent !important;
}

/* MODAL SHIPPER FILE UPLOAD */
.btn-file {
    position: relative;
    overflow: hidden;
}

    .btn-file input[type=file] {
        position: absolute;
        top: 0;
        right: 0;
        min-width: 100%;
        min-height: 100%;
        font-size: 100px;
        text-align: right;
        filter: alpha(opacity=0);
        opacity: 0;
        outline: none;
        background: white;
        cursor: inherit;
        display: block;
    }

#img-upload {
    width: 100%;
}


/* Overwriting the border color style on rad multi cbo box*/
.RadMultiColumnComboBox_Default .k-dropdown-wrap {
    border-color: #ebedf2 !important;
}

.k-icon {
    font: 12px/1 "WebComponentsIcons" !important;
}

.qt9-report-viewer .t-font-icon,
.qt9-report-viewer .trv-report-viewer .k-icon:not(.fa):not(.k-resize-handle),
.qt9-report-viewer .trv-report-viewer .k-tool-icon,
.qt9-report-viewer .trv-report-viewer .k-button-group .k-tool-icon,
.qt9-report-viewer .trv-report-viewer .k-colorpicker .k-tool-icon,
.qt9-report-viewer .trv-send-email .k-icon,
.qt9-report-viewer .trv-search .k-icon {
    font: 16px/1 ReportingIcons !important;
}

fieldset {
    border: 1px groove RGBA(167, 167, 167, .3) !important;
    padding: 0 1.4em 1.4em 1.4em !important;
    margin: 0 0 1.5em 0 !important;
    -webkit-box-shadow: 0px 0px 0px 0px #000;
    box-shadow: 0px 0px 0px 0px #000;
}

legend {
    font-size: 1.2em !important;
    font-weight: bolder !important;
    text-align: left !important;
    width: auto !important;
    padding: 0 10px;
    border-bottom: none;
}

/*Fix Q2 Background color for RadMultiColumnComboBox*/
.k-dropdowngrid-popup {
    background-color: #fff !important;
}

.RadMultiColumnComboBox input[type="text"]:disabled {
    background-color: #f4f5f8 !important;
    color: #000 !important;
}

.text-inverse-primary {
    color: #FFFFFF !important;
}

.font-weight-bolder {
    font-weight: 600 !important;
}

.font-weight-bold {
    font-weight: 500 !important;
}

.icon-ss {
    font-size: 0.5rem !important;
}

.icon-xs {
    font-size: 0.65rem !important;
}

.icon-sm {
    font-size: 0.75rem !important;
}

.icon-nm {
    font-size: 0.9rem !important;
}

.icon-ms {
    font-size: 1.15rem !important;
}

.icon-md {
    font-size: 1.25rem !important;
}

.icon-lg {
    font-size: 1.5rem !important;
}

.icon-xl {
    font-size: 1.75rem !important;
}

.icon-xxl {
    font-size: 2.25rem !important;
}

.icon-1x {
    font-size: 1rem !important;
}

.icon-2x {
    font-size: 2rem !important;
}

.icon-3x {
    font-size: 3rem !important;
}

.icon-4x {
    font-size: 4rem !important;
}

.icon-5x {
    font-size: 5rem !important;
}

.icon-6x {
    font-size: 6rem !important;
}

.icon-7x {
    font-size: 7rem !important;
}

.icon-8x {
    font-size: 8rem !important;
}

.icon-9x {
    font-size: 9rem !important;
}

.icon-10x {
    font-size: 10rem !important;
}

.background-yellow {
    background-color: #FFFF00 !important;
}

.DisabledListItem {
    pointer-events: none;
    opacity: 0.3;
}

.HideElement {
    display: none;
}

.loader {
    bottom: 0;
    left: 0;
    overflow: hidden;
    position: fixed;
    right: 0;
    top: 0;
    margin: auto;
    cursor: progress;
    z-index: 9999;
}

.loader-main {
    bottom: 0;
    left: 0;
    overflow: hidden;
    position: fixed;
    right: 0;
    top: 0;
    margin: auto;
}

@-webkit-keyframes load4 {

    0%, 100% {
        width: 1em;
        box-shadow: 0 -3em 0 0.2em, 2em -2em 0 0em, 3em 0 0 -1em, 2em 2em 0 -1em, 0 3em 0 -1em, -2em 2em 0 -1em, -3em 0 0 -1em, -2em -2em 0 0;
    }

    12.5% {
        box-shadow: 0 -3em 0 0, 2em -2em 0 0.2em, 3em 0 0 0, 2em 2em 0 -1em, 0 3em 0 -1em, -2em 2em 0 -1em, -3em 0 0 -1em, -2em -2em 0 -1em;
    }

    25% {
        box-shadow: 0 -3em 0 -0.5em, 2em -2em 0 0, 3em 0 0 0.2em, 2em 2em 0 0, 0 3em 0 -1em, -2em 2em 0 -1em, -3em 0 0 -1em, -2em -2em 0 -1em;
    }

    37.5% {
        box-shadow: 0 -3em 0 -1em, 2em -2em 0 -1em, 3em 0em 0 0, 2em 2em 0 0.2em, 0 3em 0 0em, -2em 2em 0 -1em, -3em 0em 0 -1em, -2em -2em 0 -1em;
    }

    50% {
        box-shadow: 0 -3em 0 -1em, 2em -2em 0 -1em, 3em 0 0 -1em, 2em 2em 0 0em, 0 3em 0 0.2em, -2em 2em 0 0, -3em 0em 0 -1em, -2em -2em 0 -1em;
    }

    62.5% {
        box-shadow: 0 -3em 0 -1em, 2em -2em 0 -1em, 3em 0 0 -1em, 2em 2em 0 -1em, 0 3em 0 0, -2em 2em 0 0.2em, -3em 0 0 0, -2em -2em 0 -1em;
    }

    75% {
        box-shadow: 0em -3em 0 -1em, 2em -2em 0 -1em, 3em 0em 0 -1em, 2em 2em 0 -1em, 0 3em 0 -1em, -2em 2em 0 0, -3em 0em 0 0.2em, -2em -2em 0 0;
    }

    87.5% {
        box-shadow: 0em -3em 0 0, 2em -2em 0 -1em, 3em 0 0 -1em, 2em 2em 0 -1em, 0 3em 0 -1em, -2em 2em 0 0, -3em 0em 0 0, -2em -2em 0 0.2em;
    }
}

@keyframes load4 {
    0%, 100% {
        box-shadow: 0 -3em 0 0.2em, 2em -2em 0 0em, 3em 0 0 -1em, 2em 2em 0 -1em, 0 3em 0 -1em, -2em 2em 0 -1em, -3em 0 0 -1em, -2em -2em 0 0;
    }

    12.5% {
        box-shadow: 0 -3em 0 0, 2em -2em 0 0.2em, 3em 0 0 0, 2em 2em 0 -1em, 0 3em 0 -1em, -2em 2em 0 -1em, -3em 0 0 -1em, -2em -2em 0 -1em;
    }

    25% {
        box-shadow: 0 -3em 0 -0.5em, 2em -2em 0 0, 3em 0 0 0.2em, 2em 2em 0 0, 0 3em 0 -1em, -2em 2em 0 -1em, -3em 0 0 -1em, -2em -2em 0 -1em;
    }

    37.5% {
        box-shadow: 0 -3em 0 -1em, 2em -2em 0 -1em, 3em 0em 0 0, 2em 2em 0 0.2em, 0 3em 0 0em, -2em 2em 0 -1em, -3em 0em 0 -1em, -2em -2em 0 -1em;
    }

    50% {
        box-shadow: 0 -3em 0 -1em, 2em -2em 0 -1em, 3em 0 0 -1em, 2em 2em 0 0em, 0 3em 0 0.2em, -2em 2em 0 0, -3em 0em 0 -1em, -2em -2em 0 -1em;
    }

    62.5% {
        box-shadow: 0 -3em 0 -1em, 2em -2em 0 -1em, 3em 0 0 -1em, 2em 2em 0 -1em, 0 3em 0 0, -2em 2em 0 0.2em, -3em 0 0 0, -2em -2em 0 -1em;
    }

    75% {
        box-shadow: 0em -3em 0 -1em, 2em -2em 0 -1em, 3em 0em 0 -1em, 2em 2em 0 -1em, 0 3em 0 -1em, -2em 2em 0 0, -3em 0em 0 0.2em, -2em -2em 0 0;
    }

    87.5% {
        box-shadow: 0em -3em 0 0, 2em -2em 0 -1em, 3em 0 0 -1em, 2em 2em 0 -1em, 0 3em 0 -1em, -2em 2em 0 0, -3em 0em 0 0, -2em -2em 0 0.2em;
    }
}

.m-nav .m-nav__item > .m-nav__link .alarmNoShake {
    display: table-cell;
    height: 100%;
    vertical-align: middle;
    text-align: center;
    width: 35px;
    font-size: 1.5rem;
    line-height: 0;
    padding-right: 10px;
    padding: 0;
    color: #ad5beb;
    font-weight: bold;
}

.alarmNoShake > i {
    font-size: 1.5rem
}

.m-topbar .m-topbar__nav.m-nav > .m-nav__item > .m-nav__link .alarmNoShake > i:before {
    background: -webkit-gradient(linear, left top, left bottom, color-stop(25%, #ad5beb), color-stop(50%, #c678db), color-stop(75%, #da6ea9), to(#e76e92));
    background: linear-gradient(180deg, #ad5beb 25%, #c678db 50%, #da6ea9 75%, #e76e92 100%);
    background-clip: text;
    text-fill-color: transparent;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent
}


.m-topbar .m-topbar__nav.m-nav > .m-nav__item > .m-nav__link .alarmNoShake i:before {
    font-weight: bold;
    padding: 1px
}

.m-scrollable {
    overflow: auto !important;
}


/* Combo Box Clear button */
.uc_ComboBoxContainer .btnClear:after {
    content: "\00d7";
}

.uc_ComboBoxContainer .btnClear {
    position: absolute;
    right: 35px;
    top: 12px;
    z-index: 98;
    cursor: pointer;
}

.aspNetDisabled .btnClear {
    display: none;
}

/* Combo Box Control to look like MultiColumnComboBox */
.DisabledComboBox, .rcbDisabled {
    background-color: #f4f5f8 !important;
    color: #000 !important;
    opacity: .5 !important;
}

.uc_ComboBox_DropDown {
    background-color: #ededed !important;
    padding: unset !important;
    box-shadow: 0px 0px 6px 1px rgba(0, 0, 0, .1);
    width: fit-content;
    font-family: sans-serif, Arial;
}

    /* HEADER */
    .uc_ComboBox_DropDown .k-header:first-child {
        border-left: 0;
    }

    .uc_ComboBox_DropDown .k-header {
        padding: 4px 6px;
        border-width: 0 0 0 1px;
        border-style: solid;
        font-weight: normal;
        text-align: left;
        white-space: nowrap;
        text-overflow: ellipsis;
        overflow: hidden;
    }

    .uc_ComboBox_DropDown .k-header {
        border-color: #dedede;
        color: #333;
        background-color: lightgray;
        cursor: pointer;
    }

        .uc_ComboBox_DropDown .k-header:hover {
            background-color: lightgray;
        }

        .uc_ComboBox_DropDown .k-header .k-header-container {
            display: flex;
        }

        .uc_ComboBox_DropDown .k-header .k-header-text {
            flex-grow: 1;
        }

        .uc_ComboBox_DropDown .k-header .k-header-arrow-container {
            flex-grow: 0;
            flex-shrink: 0;
            position: relative;
            margin-left: 10px;
            margin-top: 2px;
        }

            .uc_ComboBox_DropDown .k-header .k-header-arrow-container .fa-sort-up, .uc_ComboBox_DropDown .k-header .k-header-arrow-container .fa-sort-down {
                display: block;
                position: absolute;
                top: 0;
                right: 0;
                color: gray;
            }

        .uc_ComboBox_DropDown .k-header[sort-order="ascending"] .k-header-arrow-container .fa-sort-down {
            display: none;
        }

        .uc_ComboBox_DropDown .k-header[sort-order="ascending"] .k-header-arrow-container .fa-sort-up {
            color: black;
        }

        .uc_ComboBox_DropDown .k-header[sort-order="descending"] .k-header-arrow-container .fa-sort-up {
            display: none;
        }

        .uc_ComboBox_DropDown .k-header[sort-order="descending"] .k-header-arrow-container .fa-sort-down {
            color: black;
        }

        .uc_ComboBox_DropDown .k-header .arrow-placeholder {
            position: unset !important;
            visibility: hidden;
        }

    .uc_ComboBox_DropDown table {
        width: auto;
        max-width: none;
        border-width: 0;
        border-collapse: collapse;
        border-spacing: 0;
        empty-cells: show;
        outline: 0;
    }

    .uc_ComboBox_DropDown .rcbHeader {
        padding: unset !important;
        padding-right: 17px !important;
        overflow-x: hidden;
        width: 100%;
        background-color: lightgray;
    }

.rcbSlide.copy-input-width .rcbHeader table, .rcbSlide.copy-input-width .rcbList, .rcbSlide.copy-input-width .k-cell {
    width: 100% !important;
}

.rcbSlide:not(.fixed-width):not(.copy-input-width), .rcbSlide:not(.fixed-width):not(.copy-input-width) .RadComboBoxDropDown {
    width: fit-content !important;
}

.rcbSlide.fixed-width, .rcbSlide.fixed-width .RadComboBoxDropDown {
    width: auto;
}

    .rcbSlide.fixed-width .rcbHeader table {
        width: 100%;
        table-layout: fixed;
    }

/* Items */
.RadComboBoxDropDown.rcbAutoWidth {
    min-width: auto !important;
}

.uc_ComboBox_DropDown .rcbTemplate:nth-child(odd) {
    background-color: white;
}

.uc_ComboBox_DropDown .rcbList {
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    background: 0 !important;
    list-style: none !important;
    width: auto;
    max-width: none !important;
    border-width: 0 !important;
    border-collapse: collapse !important;
    border-spacing: 0 !important;
    table-layout: fixed !important;
    empty-cells: show !important;
    outline: 0 !important;
    display: table !important;
    text-decoration: none !important;
    font-size: 100% !important;
}

.rcbList > .rcbTemplate {
    border-bottom: 1px solid #dedede;
}

    .rcbList > .rcbTemplate > .k-cell:first-child {
        border-left: 0 !important;
    }

.rcbList > .rcbTemplate {
    box-sizing: border-box !important;
    display: table-row;
    position: relative !important;
}

    .rcbList > .rcbTemplate > .k-cell {
        display: inline-block;
        width: fit-content;
        vertical-align: middle !important;
    }

    .rcbList > .rcbTemplate > .k-cell {
        padding: 4px 6px !important;
        border-left: 1px solid #dedede !important;
        text-align: left !important;
        white-space: nowrap !important;
        text-overflow: ellipsis !important;
        overflow: hidden !important;
    }

        .rcbList > .rcbTemplate > .k-cell > em {
            background-color: yellow;
            color: black;
            font-weight: bold;
        }

.uc_ComboBox_DropDown .rcbItem:after, .uc_ComboBox_DropDown .rcbHovered:after {
    content: none !important;
}

.uc_ComboBox_DropDown .rcbTemplate:nth-child(2n) {
    background-color: whitesmoke;
}

.uc_ComboBox_DropDown .rcbHovered {
    color: black !important;
    background-color: rgba(51,122,183,0.25) !important;
}

span.m-topbar__userpic:hover {
    background-color: #ececf6;
}

i.flaticon-alarm:hover {
    background: linear-gradient(180deg, #5867dd 25%, #36a3f7 50%, #da6ea9 75%, #e76e92 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

i.fa-arrow-alt-circle-left, i.fa-arrow-alt-circle-right {
    background: rgb(88, 103, 221);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-size: 40px;
}

i.fa-arrow-alt-circle-left:hover, i.fa-arrow-alt-circle-right:hover {
    background: rgb(56, 74, 212);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.job-arrow {
    display: block;
    width: 40px;
}

.m-aside-left::-webkit-scrollbar {
    width: 16px;
}

.m-aside-left::-webkit-scrollbar-thumb {
    background-clip: content-box;
    background-color: var(--scrollbar-color);
    border: 4px solid transparent;
    border-radius: 8px;
    height: 56px;
}

.m-aside-left {
    --scrollbar-color: #ffffff20;
    --scrollbar-color-hover: #ffffff30;
}

.scrollable {
    overflow-y: auto;
}

.noselect {
    -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Safari */
    -khtml-user-select: none; /* Konqueror HTML */
    -moz-user-select: none; /* Old versions of Firefox */
    -ms-user-select: none; /* Internet Explorer/Edge */
    user-select: none; /* Non-prefixed version, currently
                          supported by Chrome, Edge, Opera and Firefox */
}

input[type='radio'], label.radio-button, input[type='checkbox'], label.checkbox, .checkbox-label {
    cursor: pointer;
}

.NumericTextBoxWrapper .riLabel {
    height: 100%;
    vertical-align: middle;
}

.form-control {
    padding: 6px 12px !important;
}

/* Copying Telerik styles to other inputs */
input[type='text'].form-control:hover:not(:focus):not(.input-error):not(.required-error):not(:disabled):not(:read-only),
textarea.form-control:hover:not(:focus):not(.input-error):not(.required-error):not(:disabled):not(:read-only),
select.form-control:hover:not(:focus):not(.input-error):not(.required-error):not(:disabled) { /* selects behave weirdly because they are technically set as read-only but do not support read-only */
    border-color: #adadad;
    color: #333;
    background-color: #fff;
}

input[type='text'].form-control:focus:not(.input-error):not(.required-error):not(:disabled):not(:read-only),
textarea.form-control:focus:not(.input-error):not(.required-error):not(:disabled):not(:read-only),
select.form-control:focus:not(.input-error):not(.required-error):not(:disabled) { /* selects behave weirdly because they are technically set as read-only but do not support read-only */
    border-color: #3c87c8;
    color: #333;
    background-color: #fff;
    box-shadow: inset 0 1px 1px rgba(0,0,0,0.075), 0 0 8px rgba(102,175,233,0.6);
}

input[type='text'].form-control:focus:disabled:not(.input-error):not(.required-error), input[type='text'].form-control:focus:read-only:not(.input-error):not(.required-error),
textarea.form-control:focus:disabled:not(.input-error):not(.required-error), textarea.form-control:focus:read-only:not(.input-error):not(.required-error),
select.form-control:focus:disabled:not(.input-error):not(.required-error) { /* selects behave weirdly because they are technically set as read-only but do not support read-only */
    border-color: #adadad;
    box-shadow: 0 0 8px #a5a5a5;
}

.m-switch:hover input:empty:not(:disabled) ~ span:before,
.m-switch:hover input:checked:not(:disabled) ~ span:before {
    background-color: #dee0e4;
}

.m-switch:hover input:empty:not(:disabled) ~ span:after {
    background-color: #c0c2c8;
}

.m-switch:hover input:checked:not(:disabled) ~ span:after {
    background-color: #5a53bd;
}

.m-switch input:empty:focus:not(:disabled) ~ span:before {
    box-shadow: 0px 0px 2px 2px rgba(102,175,233,.3), 0 0 8px rgba(102,175,233,.8);
}

label.checkbox .checkbox-text {
    margin-bottom: 3px;
}

.btn.aspNetDisabled:not(.btn-export) {
    opacity: .5;
    pointer-events: none;
    color: white;
}

.asp-checkbox label[for]:not([for=""]) {
    cursor: pointer;
}

.checkbox-container {
    display: inline-block;
}

    .checkbox-container:not(:last-child), .radiobutton-container:not(:last-child), span.radio-button:not(:last-child) {
        padding-right: 1.5rem;
    }

span.radio-button {
    display: flex;
}

    span.radio-button label {
        padding-left: .25rem;
    }

    span.checkbox label, span.form-check-inline label, span.radio-button label {
        cursor: pointer;
    }

span.checkbox label, span.form-check-inline label {
    position: relative;
    top: 1px;
}

span.checkbox input[type='checkbox'][disabled],
span.checkbox input[type='checkbox'][disabled] + label,
span.form-check-inline input[type='checkbox'][disabled],
span.form-check-inline input[type='checkbox'][disabled] + label,
span.radio-button input[type='radio'][disabled],
span.radio-button input[type='radio'][disabled] + label {
    cursor: not-allowed;
}

.main-content-container {
    position: relative;
}

.FiscalYearSelectorContainer .FiscalYear_YearRow.col-md-12:not(:last-child) {
    margin-bottom: 1rem;
}

.RadComboBox:not(.QT9ComboBox) {
    width: 100%;
    padding: 0 !important;
    border: none;
}

    .RadComboBox:not(.QT9ComboBox) .rcbInner {
        display: flex;
        height: 100%;
        padding: 6px 12px !important;
        padding-right: 8px !important;
        background-color: #fff;
        box-shadow: none;
    }

    .RadComboBox:not(.QT9ComboBox) .rcbInner.rcbExpanded {
        background-color: #fff;
        box-shadow: none;
    }

    .RadComboBox:not(.QT9ComboBox) .rcbInput {
        height: 100%;
    }

    .RadComboBox:not(.QT9ComboBox) .rcbActionButton {
        height: 100%;
        padding: 0;
        right: 6px;
        position: unset;
    }

    .RadComboBox:not(.QT9ComboBox) .rcbInner.rcbHovered:not(:focus):not(.input-error):not(.required-error):not(.rcbDisabled) {
        border-color: #adadad;
        color: #333;
        background-color: #fff;
    }

    .RadComboBox:not(.QT9ComboBox) .rcbInner.rcbFocused:not(.input-error):not(.required-error):not(.rcbDisabled) {
        border-color: #3c87c8;
        color: #333;
        background-color: #fff;
        box-shadow: inset 0 1px 1px rgba(0,0,0,0.075), 0 0 8px rgba(102,175,233,0.6);
    }

.uc_ComboBoxContainer .RadComboBox .rcbDisabled {
    opacity: 1 !important;
}

.uc_ComboBoxContainer .RadComboBox {
    height: auto;
    padding: 0 !important;
}

    .uc_ComboBoxContainer .RadComboBox:hover:not(.RadComboBox_Focused):not(.input-error):not(.required-error):not(.DisabledComboBox) {
        border-color: #adadad;
        color: #333;
        background-color: #fff;
    }

    .uc_ComboBoxContainer .RadComboBox.RadComboBox_Focused:not(.input-error):not(.required-error):not(.DisabledComboBox) {
        border-color: #3c87c8;
        color: #333;
        background-color: #fff;
        box-shadow: inset 0 1px 1px rgba(0,0,0,0.075), 0 0 8px rgba(102,175,233,0.6);
    }

    .uc_ComboBoxContainer .RadComboBox.RadComboBox_Focused.DisabledComboBox:not(.input-error):not(.required-error) {
        border-color: #adadad;
        box-shadow: 0 0 8px #a5a5a5;
    }

    .uc_ComboBoxContainer .RadComboBox .rcbInner {
        padding: .8rem 12px !important;
        height: calc(2.95rem);
        border: none;
    }

        .uc_ComboBoxContainer .RadComboBox .rcbInner > .rcbInput {
            padding-right: 30px;
        }

        .uc_ComboBoxContainer .RadComboBox .rcbInner .rcbActionButton {
            top: 11px;
            right: 8px;
        }

.item-dropdown-flex-container {
    display: flex;
}

    .item-dropdown-flex-container .item-dropdown-item-filter-fieldset {
        height: fit-content;
        margin: 0 !important;
        padding-bottom: 1em !important;
    }

.item-dropdown-container.filter-top .item-dropdown-flex-container {
    flex-flow: column-reverse;
}

.item-dropdown-container.filter-top .item-type-spacer {
    display: none;
}

.item-dropdown-container.filter-top .item-dropdown-item-filter-fieldset {
    width: 100%;
    margin-bottom: 1rem !important;
}
/* Makes the border-color consistent with Telerik. Also prevents the border from disappearing if the back drop is gray, since it was using the same shade. */
div.form-control[readonly], div.form-control[disabled], div.form-control,
input.form-control[readonly], input.form-control[disabled], input.form-control,
select.form-control[readonly], select.form-control[disabled], select.form-control,
textarea.form-control[readonly], textarea.form-control[disabled], textarea.form-control {
    border-color: #ccc;
    color: #333;
}

    input.riTextBox.riDisabled, input.riTextBox[disabled],
    div.form-control[readonly], div.form-control[disabled],
    input.form-control[readonly], input.form-control[disabled],
    select.form-control[readonly], select.form-control[disabled],
    textarea.form-control[readonly], textarea.form-control[disabled] {
        opacity: .5;
        color: black;
        background-color: #f4f5f8;
    }

.label-info-icon {
    font-size: 19px;
    color: #3c87c8;
    position: absolute;
    top: -1px;
    left: 4px;
    cursor: pointer;
}

    .label-info-icon:hover {
        color: #3472a8;
    }

.label-info-icon.shopfloor {
    top: -3px;
}

/* Prevents scrollbar from jumping whenever you get an alert */
html.swal2-shown, body.swal2-shown {
    overflow-y: hidden !important;
    height: auto !important;
}

.w-fit-content {
    width: fit-content !important;
}

.dashed-line {
    border-bottom: 1px dashed #ebedf2;
}

.dashed-line-dark {
    border-bottom: 1px dashed #cccccc;
}

.tooltip.show {
    opacity: 1 !important;
}

.tooltip .tooltip-inner {
    padding: .25rem 1rem !important;
    font-size: 13px;
    border-radius: .5rem;
    color: white;
    box-shadow: 0px 0px 4px 0px #000000ad;
}

/* tooltip info */

.tooltip-info.tooltip > .tooltip-inner {
    background-color: #3c87c8;
}

.tooltip-info.tooltip.bs-tooltip-top .arrow::before, .tooltip-info.tooltip.bs-tooltip-auto[x-placement^="top"] .arrow::before {
    border-top-color: #3c87c8;
}

.tooltip-info.tooltip.bs-tooltip-bottom .arrow::before, .tooltip-info.tooltip.bs-tooltip-auto[x-placement^="bottom"] .arrow::before {
    border-bottom-color: #3c87c8;
}

.tooltip-info.tooltip.bs-tooltip-left .arrow::before, .tooltip-info.tooltip.bs-tooltip-auto[x-placement^="left"] .arrow::before {
    border-left-color: #3c87c8;
}

.tooltip-info.tooltip.bs-tooltip-right .arrow::before, .tooltip-info.tooltip.bs-tooltip-auto[x-placement^="right"] .arrow::before {
    border-right-color: #3c87c8;
}

/* tooltip error */

.tooltip-error.tooltip > .tooltip-inner {
    background-color: #a94442;
}

.tooltip-error.tooltip.bs-tooltip-top .arrow::before, .tooltip-error.tooltip.bs-tooltip-auto[x-placement^="top"] .arrow::before {
    border-top-color: #a94442;
}

.tooltip-error.tooltip.bs-tooltip-bottom .arrow::before, .tooltip-error.tooltip.bs-tooltip-auto[x-placement^="bottom"] .arrow::before {
    border-bottom-color: #a94442;
}

.tooltip-error.tooltip.bs-tooltip-left .arrow::before, .tooltip-error.tooltip.bs-tooltip-auto[x-placement^="left"] .arrow::before {
    border-left-color: #a94442;
}

.tooltip-error.tooltip.bs-tooltip-right .arrow::before, .tooltip-error.tooltip.bs-tooltip-auto[x-placement^="right"] .arrow::before {
    border-right-color: #a94442;
}

/* tooltip warning */

.tooltip-warning.tooltip > .tooltip-inner {
    background-color: #ec971f;
}

.tooltip-warning.tooltip.bs-tooltip-top .arrow::before, .tooltip-warning.tooltip.bs-tooltip-auto[x-placement^="top"] .arrow::before {
    border-top-color: #ec971f;
}

.tooltip-warning.tooltip.bs-tooltip-bottom .arrow::before, .tooltip-warning.tooltip.bs-tooltip-auto[x-placement^="bottom"] .arrow::before {
    border-bottom-color: #ec971f;
}

.tooltip-warning.tooltip.bs-tooltip-left .arrow::before, .tooltip-warning.tooltip.bs-tooltip-auto[x-placement^="left"] .arrow::before {
    border-left-color: #ec971f;
}

.tooltip-warning.tooltip.bs-tooltip-right .arrow::before, .tooltip-warning.tooltip.bs-tooltip-auto[x-placement^="right"] .arrow::before {
    border-right-color: #ec971f;
}

/* Input Error Styles */

.input-error.RadInput_Bootstrap .riTextBox, .input-error.RadInput_Bootstrap .riSelect, .input-error.RadInput_Bootstrap .rcSelect,
.required-error.RadInput_Bootstrap .riTextBox, .required-error.RadInput_Bootstrap .riSelect, .required-error.RadInput_Bootstrap .rcSelect,
select.required-error, input.required-error {
    border-color: #a94442 !important;
    color: #a94442 !important;
    background-color: #f2dede !important;
}

.input-error.RadComboBox {
    color: #a94442 !important;
    border-color: #a94442 !important;
}

    .input-error.RadComboBox > .rcbInner {
        color: #a94442 !important;
        background-color: #f2dede !important;
    }

    .input-error.RadInput_Bootstrap.RadInputHovered .riTextBox,
    .input-error.RadInput_Bootstrap.RadInputHovered .riSelect,
    .input-error.RadInput_Bootstrap.RadInputHovered .rcSelect,
    .input-error.RadInput_Hover_Default,
    .input-error.RadComboBox:hover {
        border-color: #b00300 !important;
    }

.input-error.RadInput_Bootstrap.RadInputFocused .riTextBox,
.input-error.RadInput_Bootstrap.RadInputFocused .riSelect,
.input-error.RadInput_Bootstrap.RadInputFocused .rcSelect,
.input-error.RadInput_Focused_Bootstrap {
    border-color: #d60400 !important;
    box-shadow: inset 0 0 2px rgb(214 4 0 / 30%), 0 0 8px rgb(214 4 0);
}

.RadDateTimePicker .input-error.RadInput_Bootstrap.RadInputFocused {
    box-shadow: inset 0 0 2px rgb(214 4 0 / 30%), 0 0 8px rgb(214 4 0);
}

    .RadDateTimePicker .input-error.RadInput_Bootstrap.RadInputFocused .rcSelect {
        box-shadow: none;
    }

select.input-error:focus,
select.required-error:focus,
.input-error.RadComboBox.RadComboBox_Focused {
    border-color: #d60400 !important;
    box-shadow: inset 0 0 2px rgb(214 4 0 / 30%), 0 0 8px rgb(214 4 0);
    border-radius: 4px;
}

/* Input Warning Styles */

.input-warning.RadInput_Bootstrap .riTextBox, .input-warning.RadInput_Bootstrap .riSelect, .input-warning.RadInput_Bootstrap .rcSelect {
    border-color: #ea6c00 !important;
    color: #ea6c00 !important;
    background-color: #f9ead8 !important;
}

.input-warning.RadComboBox {
    color: #ea6c00 !important;
    border-color: #ea6c00 !important;
}

    .input-warning.RadComboBox > .rcbInner {
        color: #ea6c00 !important;
        background-color: #f9ead8 !important;
    }

.input-warning.RadInput_Bootstrap.RadInputHovered .riTextBox,
.input-warning.RadInput_Bootstrap.RadInputHovered .riSelect,
.input-warning.RadInput_Bootstrap.RadInputHovered .rcSelect,
.input-warning.RadInput_Hover_Default,
.input-warning.RadComboBox:hover {
    border-color: #ff7600 !important;
}

.input-warning.RadInput_Bootstrap.RadInputFocused .riTextBox,
.input-warning.RadInput_Bootstrap.RadInputFocused .riSelect,
.input-warning.RadInput_Bootstrap.RadInputFocused .rcSelect,
.input-warning.RadInput_Focused_Bootstrap {
    border-color: #ff7600 !important;
    box-shadow: inset 0 0 2px rgb(255 118 0 / 30%), 0 0 8px rgb(255 118 0);
}

.RadDateTimePicker .input-warning.RadInput_Bootstrap.RadInputFocused {
    box-shadow: inset 0 0 2px rgb(255 118 0 / 30%), 0 0 8px rgb(255 118 0);
}

    .RadDateTimePicker .input-warning.RadInput_Bootstrap.RadInputFocused .rcSelect {
        box-shadow: none;
    }

select.input-warning:focus,
.input-warning.RadComboBox.RadComboBox_Focused {
    border-color: #ff7600 !important;
    box-shadow: inset 0 0 2px rgb(255 118 0 / 30%), 0 0 8px rgb(255 118 0);
    border-radius: 4px;
}

/* */

.BatchEditDelete:hover {
    filter: brightness(1.05);
}

.BatchEditDelete:active {
    filter: brightness(1.1);
    opacity: .85;
}

.swal2-container {
    z-index: 3000 !important; /* To prevent Swal Modals from appearing behind Bootstrap Modals */
}

.tooltip {
    z-index: 3010 !important; /* To prevent Tooltips from appearing behind Modals */
}

.RadEditor .reRealFontSize {
    width: 60px !important;
}

.btn-primary:focus {
    background-color: #0016c4;
    border-color: #0016c4;
}

.RadDateTimePicker .riTextBox {
    padding-right: 31.56px !important;
}

.RadButton.rbButton.btn:not(.btn-sm) {
    height: 40px;
}

.btn-sm {
    font-size: .875rem !important;
    height: 30.75px;
}

.chkBoxClass input {
    width: 17px !important;
    height: 17px !important;
}

.m-list-timeline__items:before {
    display: none !important;
}

.RadSearchBox {
    display: block !important;
    width: 100% !important;
    font-family: sans-serif, Arial !important;
}

.RadSearchBox .rsbButtonSearch {
    display: none;
}

.RadSearchBox .rsbLoadingIcon {
}

.RadSearchBox .rsbInput {
    height: calc(2.95rem) !important;
    font-size: 1rem !important;
    line-height: 1.25 !important;
    color: rgb(51, 51, 51);
}

.RadSearchBox .rsbInner:not(.rsbFocused) {
    box-shadow: none !important;
}

.RadSearchBox .rsbInner .rsbFocused {
    box-shadow: inset 0 0 2px rgb(255 118 0 / 30%), 0 0 8px rgb(255 118 0) !important;
}

.RadSearchBox .rsbDisabled {
    background-color: #f4f5f8 !important;
    opacity: .5 !important;
    color: #000 !important;
}

.rsbList > .rsbListItem:nth-child(2n):not(.rsbListItemHovered) {
    background-color: whitesmoke !important;
}

.rsbList > .rsbListItem:nth-child(2n+1):not(.rsbListItemHovered) {
    background-color: white !important;
}

.rsbList > .rsbListItemHovered {
    background-color: rgba(51, 122, 183, 0.25) !important;
}

.rsbHeader {
    background-color: #d3d3d3 !important;
    border-bottom-color: rgb(204, 204, 204) !important;
    margin-bottom: 0px !important;
}

.rsbPopup {
    padding: 0px !important;
}

.m-portlet--brand {
    border-color: #047835 !important;
}

.m-portlet--brand > .m-portlet__head {
    background: #047835 !important;
    border-color: #047835 !important;
}

.m-portlet--brand > .m-portlet__body {
    padding: 1rem !important;
}

.BlueLabel {
    color: blue !important;
}

.RedLabel {
    color: red !important;
}

.AllignMiddle {
    text-align: center !important;
}

.FontLarge {
    Font-Size: Large !important;
}

.FullWidth {
    width: 100%;
}

.btn-FullWidth {
    width: 100%;
}

.btn-FullWidthXlText {
    width: 100%;
    margin-top: 2.1rem;
}

/* Unit Conversion Tooltip */

.divUnitConversionCalculationInfo .operator {
    font-size: 28px;
    text-align: center;
    padding-top: 5px;
    height: 28px;
}

.divUnitConversionCalculationInfo {
    display: flex;
    align-items: center;
    position: relative;
}

    .divUnitConversionCalculationInfo .tblUnitConversionCalculationInfo {
        table-layout: fixed;
        margin-top: 5px;
        margin-bottom: 5px;
    }

    .divUnitConversionCalculationInfo .riTextBox {
        background-color: #98bee0 !important;
        opacity: 1 !important;
        color: #162f45 !important;
        border-color: #84a9ca !important;
        font-weight: bold !important;
    }

    .divUnitConversionCalculationInfo .UnitConversionCalclulationInfoLabel {
        text-align: left;
        font-weight: bold;
    }

    .divUnitConversionCalculationInfo .NumericTextBoxWrapper {
        width: 100%;
        height: auto;
    }

/* HTML5 Report Viewer */

#reportViewer1 {
    left: 5px;
    right: 5px;
    top: 5px;
    bottom: 5px;
    overflow: hidden;
    height: 650px;
}

#reportViewer1 .k-splitter .k-scrollable {
    overflow: hidden;
}

#reportViewer1 .k-textbox {
    width: 90%;
}

#reportViewer1 .trv-parameters-area {
    overflow-y: scroll !important;
}

#reportViewer1 .preview {
    overflow-y: hidden !important;
}

#reportViewer1 .trv-page-container {
    background-color: #4f4f4f;
}

/* Loading Overlay Style */
.loader {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.7); /* Darker background with slight opacity */
    justify-content: center;
    align-items: center;
    z-index: 9999; /* High z-index to appear above all content */
    text-align: center;
    animation: fadeIn 0.5s ease-in-out; /* Smooth fade-in effect */
}

/* Modern Spinner Style with Neon Effect */
.loader-main {
    border: 8px solid rgba(255, 255, 255, 0.3);
    border-top: 8px solid #00b5e2; /* Neon blue color */
    border-radius: 50%;
    width: 80px; /* Increased size for better visibility */
    height: 80px;
    animation: spin 1.5s linear infinite, glow 1.5s ease-in-out infinite alternate;
}

/* Glow effect on spinner */
@keyframes glow {
    0% {
        box-shadow: 0 0 10px rgba(0, 181, 226, 0.8), 0 0 20px rgba(0, 181, 226, 0.6);
    }

    100% {
        box-shadow: 0 0 20px rgba(0, 181, 226, 1), 0 0 30px rgba(0, 181, 226, 0.8);
    }
}


/* Spinner Rotation */
@keyframes spin {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}

/* <h2> */
.SectionTitle
{
    font-size: 2rem;
    font-weight: 500;
}

/* <h3> */
.SubSectionTitle
{
    font-size: 1.75rem;
    font-weight: 500;
}

/* <h4> */
.TabTitle
{
    font-size: 1.5rem;
    font-weight: 500;
}

.CurrentEmployeeMobile {
    display: flex;
    flex-wrap: nowrap;
}

@media (min-width: 1025px) {
    .CurrentEmployeeMobile {
        display: none;
    }
}

.m-scroll-top {
    bottom: 55px !important;
}


