@charset "UTF-8";
/* ================================
   PRINT / GENERAL
================================ */
.printbookcls {
    width: auto !important;
    margin: 10px 11px;
}

    .printbookcls .blockcls {
        flex: auto;
        width: auto;
    }

        .printbookcls .blockcls .dxbl-fl-cpt.dxbl-text {
            width: auto !important;
            flex: auto;
        }

        .printbookcls .blockcls .dxbl-fl-ctrl {
            width: auto !important;
            flex: auto;
        }

/* ================================
   TABS
================================ */
.dxbl-tabs-tablist {
    background: none !important;
}

    .dxbl-tabs-tablist ul {
        margin: 0px !important;
    }

    .dxbl-tabs-tablist .dxbl-active {
        background: #991b1e !important;
        color: #fff !important;
        border: none !important;
    }

.dxbl-tabs-content-panel {
    background: #fff !important;
    padding: 10px !important;
}

/* ================================
   GRID BASIC
================================ */
.dxbl-grid-table td {
    padding: 10px !important;
}

.dxbl-grid-empty-cell {
    display: none;
}

/* Make the top panel a flex row */
.dxbl-grid-top-panel {
    display: flex !important;
    align-items: center;
    gap: 15px;
    flex-wrap: nowrap; /* IMPORTANT: prevent wrapping */
    width: 500px;
    position: relative;
}

/* Search box first */
.dxbl-grid-search-box-container {
    position: absolute;
    order: 1;
    top: -50px;
    left: 0px;
    width: 100% !important;
}

.custom-paginationblock {
    display: flex;
    margin-top: 10px;
    justify-content: end;
    width: 103%;
    background: #e9e7e7;
    margin-left: -22px;
    margin-right: -22px;
    padding: 10px;
}

.gridinsidespace {
    margin: 20px !important;
}

.gridfilterblock {
    gap: 10px;
    display: flex;
}

/* Pager second */
.dxbl-pager-container {
    order: 0;
    justify-content: end;
    white-space: nowrap;
    background: #e9e7e7;
    width: 100% !important;
}

/* Page size dropdown last */
.dxbl-grid-page-size-selector {
    order: 3;
    margin-left: auto; /* push it to the right end */
    white-space: nowrap;
}

/* Prevent internal wrapping */
.dxbl-grid-top-panel * {
    flex-wrap: nowrap !important;
    white-space: nowrap !important;
}

.grid-container {
    position: relative;
    margin-top: 10px;
}

.searchcontainer {
    position: absolute;
    right: 11px;
    width: 332px;
    top: 12px;
}

    .searchcontainer .search-wrapper {
        position: relative;
    }

        .searchcontainer .search-wrapper input {
            padding-right: 60px;
        }

        .searchcontainer .search-wrapper .search-icons {
            position: absolute;
            top: 3px;
            right: 0px;
            cursor: pointer;
        }

            .searchcontainer .search-wrapper .search-icons .clearicon {
                margin-right: 40px;
                cursor: pointer;
            }

                .searchcontainer .search-wrapper .search-icons .clearicon:hover {
                    color: #83161a;
                }

            .searchcontainer .search-wrapper .search-icons .searchicon {
                background: #dedede;
                padding: 7px;
                position: absolute;
                right: 0px;
                top: -3px;
                border-radius: 0px 2px 2px 0px;
                height: 29px;
                cursor: pointer;
            }

                .searchcontainer .search-wrapper .search-icons .searchicon:hover {
                    background: rgb(158, 156, 150);
                }

.gridiconlist {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
}

    .gridiconlist .dxbl-btn {
        padding: 0px;
        background: none !important;
        border: none !important;
    }

        .gridiconlist .dxbl-btn:hover {
            border: none !important;
        }

        .gridiconlist .dxbl-btn .dxbl-image {
            padding: 5px;
            border: 1px solid #83161a;
            color: #83161a;
            border-radius: 2px;
            font-size: 12px;
            margin: 0px;
            background: #fff;
        }

            .gridiconlist .dxbl-btn .dxbl-image:hover {
                background: #5a0a0e;
                color: #fff;
                border: 1px solid #5a0a0e;
            }

    .gridiconlist i {
        padding: 5px;
        border: 1px solid #83161a;
        color: #83161a;
        border-radius: 2px;
        font-size: 12px;
        margin: 0px 4px;
        background: #fff;
    }

        .gridiconlist i:hover {
            background: #83161a;
            color: #fff;
        }

/* ================================
   LOGIN / FORMS
================================ */
.logingscreen {
    display: flex;
    align-items: center;
    width: 50%;
    margin: 0px auto;
    flex-direction: column;
}

.remeberblock {
    display: flex;
    align-items: center;
    width: 100%;
    justify-content: space-between;
    margin-top: 20px;
}

    .remeberblock .dxbl-fl-row-break {
        display: none;
    }

    .remeberblock .remebercls {
        margin: 0px;
    }

.loginblock {
    border: 1px solid #ccc;
    width: 30%;
    padding: 10px;
    margin: 0px auto;
    background: #fff;
    border-top: 3px solid #83161a;
}

    .loginblock .login-txt {
        text-transform: uppercase;
        margin: 0px;
    }

.text-link {
    color: #83161a;
    text-decoration: none;
    margin-right: 10px;
}

    .text-link:hover {
        text-decoration: underline;
    }

.or {
    margin-top: 20px;
}

.orblocktext {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 5px;
    margin-top: 10px;
}

.emailinput {
    position: relative;
}

    .emailinput .dxbl-text {
        padding-left: 23px;
    }

    .emailinput .fa {
        position: absolute;
        z-index: 9;
        top: 9px;
        left: 14px;
    }

    .emailinput .dxbl-text-edit-input {
        background: #fff !important;
    }

    .emailinput .inputfieldcls {
        padding-left: 20px;
        background: #fff;
    }

.dxbl-text-edit .dxbl-image {
    border-radius: 0px !important;
}

input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active {
    -webkit-box-shadow: 0 0 0 1000px white inset !important;
    box-shadow: 0 0 0 1000px white inset !important;
    background-color: white !important;
    color: #000 !important;
}

input:-webkit-autofill {
    background-color: transparent;
}

input::placeholder {
    background-color: transparent;
}

/* For older WebKit browsers */
input::-webkit-input-placeholder {
    background-color: transparent;
}

dxbl-text-mask::part(input),
dxbl-text-editor::part(input) {
    background: white !important;
}

.row-0 {
    margin: 0px !important;
    width: 100%;
}

.formblock_inside {
    background: #fff;
    margin-bottom: 30px;
    padding: 10px;
}

.inputboxcover {
    display: flex;
}

    .inputboxcover .form-check {
        display: flex;
        padding: 0px;
        margin-right: 15px;
    }

        .inputboxcover .form-check input {
            margin: 3px 2px 0 0px !important;
            width: 13px;
            padding: 4px !important;
        }

.formblock {
    width: 100%;
    margin-top: 20px;
}

.dxbl-modal-header.dxbl-popup-header {
    background: #83161a !important;
    color: #fff !important;
}

    .dxbl-modal-header.dxbl-popup-header .dxbl-modal-title {
        color: #fff !important;
        text-transform: uppercase !important;
    }

.form-group > label {
    display: flex;
    margin: 0px 0px 5px !important;
    font-size: 13px !important;
}

.formcover {
    margin: 0px 0px 9px;
}

    .formcover label {
        display: flex;
        margin: 0px 0px 5px !important;
        font-size: 13px !important;
        align-items: center;
    }

        .formcover label input[type=checkbox] {
            margin-top: 0px;
            margin-right: 5px;
        }

    .formcover .formlabel {
        display: flex;
        margin: 0px 0px 5px !important;
        font-size: 13px !important;
    }

    .formcover .forminputfield .dxbl-col {
        width: 100% !important;
        margin: 0px !important;
        padding: 0px !important;
    }

.viewform .forminputfield {
    border: 1px solid #ccc !important;
    background: #f8f7f7;
    padding: 4px;
    border-radius: 4px;
    color: #a6a3a3;
    min-height: 30px;
    cursor: no-drop;
}

.dxbl-text-edit.dxbl-memo-edit {
    display: flex;
    align-items: self-start;
}

.dxbl-tabs .dxbl-pager-container {
    width: auto !important;
}

/* ================================
   GRID ADVANCED
================================ */
svg.dxbl-image {
    height: 11px !important;
    opacity: 0.5;
}

.dxbl-grid-table .dxbl-grid-header-content {
    font-size: 11px;
    text-align: center;
}

    .dxbl-grid-table .dxbl-grid-header-content .dxbl-image {
        height: 11px !important;
        opacity: 0.5;
    }

.dxbl-grid-table tr:nth-child(even) {
    background: #f5ecec;
}

    .dxbl-grid-table tr:nth-child(even):hover {
        background: #fff6f7 !important;
    }

.dxbl-grid-table tr:hover {
    background: #fff6f7 !important;
}

.dxbl-grid-table td {
    font-size: 13px !important;
}

.dxbl-grid-header-content > span {
    overflow: inherit !important;
    text-overflow: inherit !important;
    overflow-wrap: break-word !important;
    white-space: break-spaces !important;
}

.dxbl-grid-header-content .dxbl-grid-sort-desc,
.dxbl-grid-header-content .dxbl-grid-sort-asc {
    top: 0px;
    position: absolute;
    right: 11px;
}

.dxbl-grid-header-content .dxbl-btn {
    position: absolute;
    right: 0px;
    top: 3px;
}

.midModelbox {
    width: 70% !important;
    max-width: 67% !important;
}

.largeModelbox {
    width: 87%;
    max-width: 87% !important;
}

/* ================================
   TOP NAVBAR
================================ */
.topnavbar {
    background: #fff;
    padding: 3px 0px !important;
    box-shadow: 0 0 10px #999999;
    border-bottom: 2px solid #83161a;
    justify-content: space-between;
    align-items: center;
    position: relative;
    z-index: 99;
}

    .topnavbar .top-right-links {
        display: flex;
        margin: 0px;
        padding: 0px;
        background: #fff;
    }

        .topnavbar .top-right-links li {
            border-right: 1px solid #ccc;
        }

            .topnavbar .top-right-links li a .menu-button-nav {
                background: #fff !important;
                border: none !important;
                border-radius: 0px !important;
            }

                .topnavbar .top-right-links li a .menu-button-nav:hover {
                    color: #83161a !important;
                }

                    .topnavbar .top-right-links li a .menu-button-nav:hover .dxbl-image:before {
                        color: #83161a !important;
                    }

                    .topnavbar .top-right-links li a .menu-button-nav:hover .icon-user {
                        background: #83161a !important;
                    }

            .topnavbar .top-right-links li.no-border {
                border: none !important;
            }

    .topnavbar .app_backbutton {
        position: absolute;
        bottom: -33px;
        right: 30px;
    }

        .topnavbar .app_backbutton .app_backbutton_holder {
            background: #000000;
            padding: 0px;
            box-shadow: none;
            color: #fff;
            display: flex;
            text-decoration: none;
            border-radius: 0px 0px 4px 4px;
            background: linear-gradient(0deg, rgb(0, 0, 0) 0%, rgb(0, 0, 0) 47%, rgb(158, 156, 150) 100%);
        }

            .topnavbar .app_backbutton .app_backbutton_holder:hover {
                background: #000000;
                background: linear-gradient(-180deg, rgb(0, 0, 0) 0%, rgb(0, 0, 0) 47%, rgb(158, 156, 150) 100%);
            }

            .topnavbar .app_backbutton .app_backbutton_holder .dxbl-btn-standalone.dxbl-btn-text-primary {
                color: #fff;
                padding: 5px;
                box-shadow: none;
                min-width: 154px;
                text-transform: uppercase;
                text-decoration: none;
            }

                .topnavbar .app_backbutton .app_backbutton_holder .dxbl-btn-standalone.dxbl-btn-text-primary:hover {
                    background: none;
                    border: none;
                    padding: 5px;
                    box-shadow: none;
                    line-height: inherit;
                }

                .topnavbar .app_backbutton .app_backbutton_holder .dxbl-btn-standalone.dxbl-btn-text-primary .dxbl-image.icon {
                    color: #fff;
                    filter: invert(50%);
                }

.topmenudropdown {
    padding: 0px !important;
}

    .topmenudropdown li {
        border-right: none !important;
        border-bottom: 1px solid #ccc;
    }

.logoutbtn {
    background: none !important;
    width: 100%;
    border: none;
    color: #000 !important;
    text-align: left !important;
    display: flex;
    justify-content: left;
    border-top: 1px solid #ccc;
    border-radius: 0px;
    padding: 5px 13px;
}

    .logoutbtn .dxbl-image {
        background: #000 !important;
    }

    .logoutbtn:hover {
        background: #83161a !important;
        width: 100%;
        border: none !important;
        color: #fff !important;
        text-align: left !important;
        display: flex;
        justify-content: left;
        border-bottom: 1px solid #ccc;
        border-radius: 0px;
        padding-bottom: 10px;
    }

        .logoutbtn:hover .dxbl-image {
            background: #fff !important;
        }

    .logoutbtn .dxbl-btn-caption {
        padding-left: 3px;
    }

.logoutdropdown .dropdown-toggle {
    display: flex;
    padding: 6px 10px;
    margin-right: 12px;
    margin-left: -11px;
    cursor: pointer;
}

    .logoutdropdown .dropdown-toggle:hover {
        background: #83161a;
        color: #fff;
    }

    .logoutdropdown .dropdown-toggle i {
        font-size: 19px;
    }

    .logoutdropdown .dropdown-toggle:after {
        display: none;
    }

.logoutdropdown a {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 14px !important;
    margin: 0px !important;
}

    .logoutdropdown a:hover {
        background: #83161a !important;
        width: 100%;
        border: none;
        color: #fff !important;
        text-align: left !important;
        display: flex;
        justify-content: left;
        border-radius: 0px;
    }

/* ================================
   MISC
================================ */
.module_title {
    text-transform: uppercase;
    color: #83161a;
    font-size: 18px !important;
}

.addnewadress_popup .dxbl-fl-cpt {
    width: 110px !important;
}

.leftnavigationblock {
    border: 2px solid green;
}

.amcalogo {
    margin-left: 20px;
}
/* ================================
   NAVIGATION DRAWER / SIDEBAR
================================ */
.navigation-drawer .dxbl-drawer-header {
    position: absolute;
    right: -28px !important;
    z-index: 999;
    overflow: visible !important;
    background: #83161a !important;
    padding: 0px !important;
    margin: 0px !important;
    border-radius: 0px 3px 3px 0px;
    height: auto !important;
}

    .navigation-drawer .dxbl-drawer-header:hover {
        border: #83161a !important;
        color: #fff !important;
        background: #000 !important;
    }

        .navigation-drawer .dxbl-drawer-header:hover .dxbl-btn {
            border: none !important;
            background: none !important;
        }

            .navigation-drawer .dxbl-drawer-header:hover .dxbl-btn:hover .icon {
                background-color: #fff;
            }

        .navigation-drawer .dxbl-drawer-header:hover .icon {
            background-color: #fff;
        }

.navigation-drawer .dxbl-drawer-body {
    overflow: visible !important;
}

.navigation-drawer #sidebar {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 100% !important;
    overflow: visible !important;
}

    .navigation-drawer #sidebar .nav-item > .nav-link {
        display: flex !important;
        flex-direction: row;
        align-items: center;
        gap: 10px;
        padding: 15px 10px;
        cursor: pointer;
    }

        .navigation-drawer #sidebar .nav-item > .nav-link:hover {
            background-color: #5a0a0e !important;
        }

        .navigation-drawer #sidebar .nav-item > .nav-link i {
            margin: 0 !important;
            width: 20px;
            font-size: 17px;
        }

    .navigation-drawer #sidebar .nav-link:hover {
        background-color: #5a0a0e !important;
    }

    .navigation-drawer #sidebar .dxbl-drawer-body {
        overflow: visible !important;
    }

    .navigation-drawer #sidebar .dxbl-drawer-header {
        position: absolute;
        right: -28px;
        background: #83161a !important;
        border-radius: 0 3px 3px 0;
        z-index: 999;
    }

        .navigation-drawer #sidebar .dxbl-drawer-header:hover {
            background: #000 !important;
        }

.navigation-drawer.mobile > .dxbl-drawer-panel {
    width: 0 !important;
}

.dxbl-drawer-closed .dxbl-drawer-panel {
    visibility: visible !important;
}

.dxbl-drawer-panel {
    overflow: visible !important;
}

.popupfooterbtn .dxbl-fl-ctrl {
    display: flex;
    align-items: center;
    justify-content: end;
    gap: 10px;
}

.primary-btn, .dxbl-btn-primary {
    border: 1px solid #83161a !important;
    background: #83161a !important;
    color: #fff !important;
}

    .primary-btn:hover, .dxbl-btn-primary:hover {
        border: 1px solid #5a0a0e !important;
        background: #5a0a0e !important;
        color: #fff !important;
    }

.secondary-btn, .dxbl-btn-secondary {
    border: 1px solid #83161a !important;
    background: #fff !important;
    color: #83161a !important;
}

    .secondary-btn:hover, .dxbl-btn-secondary:hover {
        border: 1px solid #5a0a0e !important;
        background: #5a0a0e !important;
        color: #fff !important;
    }

    .secondary-btn:hover {
        border: 1px solid #5a0a0e !important;
        background: #5a0a0e !important;
        color: #fff !important;
    }

.dxbl-grid-confirm-dialog-buttons {
    display: flex;
    align-items: center;
    justify-content: end;
}

    .dxbl-grid-confirm-dialog-buttons .dxbl-btn.dxbl-btn-danger {
        border: 1px solid #83161a;
        background: #83161a;
        color: #fff;
    }

        .dxbl-grid-confirm-dialog-buttons .dxbl-btn.dxbl-btn-danger:hover {
            border: 1px solid #5a0a0e !important;
            background: #5a0a0e !important;
            color: #fff;
        }

    .dxbl-grid-confirm-dialog-buttons .dxbl-btn.dxbl-btn-secondary {
        border: 1px solid #83161a;
        background: #fff;
        color: #83161a;
    }

        .dxbl-grid-confirm-dialog-buttons .dxbl-btn.dxbl-btn-secondary:hover {
            border: 1px solid #5a0a0e !important;
            background: #5a0a0e !important;
            color: #fff !important;
        }

.breadcrumb-block {
    padding: 10px 0;
    display: flex;
    align-items: center;
    font-weight: 500;
    text-transform: uppercase;
}

    .breadcrumb-block span {
        color: #83161a;
    }

    .breadcrumb-block .lastbread {
        color: #11578b;
    }

/* Hide submenus by default */
.nav-submenu,
.third-nav-submenu {
    display: none;
    list-style: none;
    padding-left: 0;
    margin: 0;
}

/* Show Lab submenu when .open is added to .lab-menu */
.nav-item.lab-menu.open > .nav-submenu {
    display: block;
}

/* Show third-level submenu when .open is added to .has-children */
.nav-item.has-children.open > .third-nav-submenu {
    display: block;
}

/* Make title rows clickable with arrow right-aligned */
.nav-link.submenutitle {
    display: flex;
    justify-content: space-between;
    align-items: center;
    cursor: pointer;
}

    .nav-link.submenutitle > span {
        display: flex;
        align-items: center;
        gap: 10px;
    }

.PriceListViewModelbox {
    max-width: 60% !important;
}

/* Indent inner menu items */
.nav-link.spaceleft {
    padding-left: 30px !important;
}

/* Arrow icons */
.arrow-icon::after,
.sub-arrow::after {
    content: "+";
    font-weight: bold;
    margin-left: 5px;
}

/* Change + to - when open */
.nav-item.lab-menu.open > .nav-link .arrow-icon::after {
    content: "-";
}

.nav-item.has-children.open > .nav-link .sub-arrow::after {
    content: "-";
}

.testcheckbox {
    display: flex;
    margin: 0px;
    padding: 0px;
}

    .testcheckbox li {
        display: flex;
        align-items: center;
        margin-right: 15px;
        gap: 3px;
    }

        .testcheckbox li label {
            margin-bottom: 0px !important;
        }

.dxbl-text-edit > .dxbl-text-edit-input[readonly], .dxbl-text-edit > textarea[readonly] {
    background: #fff !important;
}

.sticky-footer {
    text-align: center;
    padding: 10px 0px 20px !important;
    border-top: 3px double #E5E5E5 !important;
}

.displyflx {
    display: flex;
    align-items: center;
    gap: 10px;
}

.dxbl-group-header .dxbl-text {
    color: #83161a !important;
    font-size: 14px !important;
    font-weight: 500;
    text-transform: uppercase;
}

.link {
    color: #83161a !important;
    padding: 5px;
    border: 1px solid #83161a;
    border-radius: 3px;
    text-decoration: none;
    cursor: pointer;
}

    .link:hover {
        background: #83161a;
        color: #fff !important;
    }

.linkurl {
    color: #83161a !important;
    border-radius: 3px;
    text-decoration: none;
    cursor: pointer;
}

    .linkurl:hover {
        text-decoration: underline;
    }

.pdficonfiletype {
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 17px;
    color: #83161a;
}

.crp-checkbox-list {
    margin: 0px;
    display: flex;
    align-items: center;
    gap: 30px;
}

.inlet-sound-list,
.outlet-sound-grid,
.total-sound-grid {
    margin: 10px 0;
    display: flex;
    align-items: center;
    gap: 30px;
}

    .inlet-sound-list li,
    .outlet-sound-grid li,
    .total-sound-grid li {
        width: 230px;
    }

        .inlet-sound-list li:first-child,
        .outlet-sound-grid li:first-child,
        .total-sound-grid li:first-child {
            width: 110px;
            font-weight: 500;
        }

        .inlet-sound-list li:nth-child(5),
        .outlet-sound-grid li:nth-child(5),
        .total-sound-grid li:nth-child(5) {
            width: 200px;
            font-weight: 500;
        }

        .inlet-sound-list li:nth-child(4),
        .outlet-sound-grid li:nth-child(4),
        .total-sound-grid li:nth-child(4) {
            width: 60px;
            font-weight: 500;
        }

.dxbl-checkbox label {
    font-weight: normal !important;
}

.apptestingtabblock-center {
    width: 98%;
    margin: 10px auto 10px;
}

    .apptestingtabblock-center .module_title {
        font-size: 16px !important;
    }

.pagesubheader {
    text-transform: uppercase;
    color: #83161a;
    font-size: 14px;
    font-weight: 500;
    margin-top: 16px;
}

.margin-b10 {
    margin-bottom: 10px;
}

.top-btn-wrapper {
    margin: 10px 0;
}

.TestPressureinput {
    border: 1px solid #000;
    width: 130px !important;
}

.dxbl-text-edit .dxbl-text-edit-input {
    background: #fff !important;
}

.app_backbutton_common {
    background: #000000;
    padding: 0px;
    box-shadow: none;
    color: #fff;
    display: flex;
    position: absolute;
    right: 20px;
    top: 0px;
    z-index: 9;
    text-decoration: none;
    border-radius: 0px 0px 4px 4px;
    background: linear-gradient(0deg, rgb(0, 0, 0) 0%, rgb(0, 0, 0) 47%, rgb(158, 156, 150) 100%);
    padding: 5px;
}

    .app_backbutton_common:hover {
        background: linear-gradient(0deg, rgb(158, 156, 150) 0%, rgb(0, 0, 0) 53%, rgb(0, 0, 0) 100%);
    }

    .app_backbutton_common button {
        background: none !important;
        color: #fff !important;
        border: none !important;
        padding: 0px !important;
    }

        .app_backbutton_common button .icon-back {
            background-color: #fff;
            margin: 2px 0 0;
        }

.staticfooterbtn {
    position: fixed;
    bottom: 0px;
    left: 0px;
    right: 0px;
    text-align: center;
    background: #fff;
    padding: 10px;
}

.pager {
    display: flex;
    align-items: center;
    gap: 0.5px;
}

    .pager button {
        cursor: pointer;
        border-radius: 0px;
        background: #fff !important;
        padding: 10px;
        opacity: 1 !important;
        min-width: 35px;
        border: none !important;
    }

        .pager button:hover {
            background: #dee2e6 !important;
        }

    .pager .pagetotl {
        margin: 0 5px;
    }

        .pager .pagetotl .currentpage {
            background: #fff !important;
            padding: 7px 10px;
            min-width: 55px;
            display: inline-block;
            text-align: center;
        }

.pagesizeblock {
    display: flex;
    align-items: center;
    gap: 5px;
    margin-left: 20px;
}

    .pagesizeblock .dxbl-text-edit {
        width: 70px !important;
    }

.over-grid-class {
    width: 160% !important;
}

.companytabs {
    width: 100% !important;
}

.dxbl-popup {
    max-height: auto !important;
    min-height: auto !important;
}

.loaderblock {
    display: flex;
    flex-direction: column;
    margin: 0px auto;
    position: absolute;
    top: 0px;
    bottom: 0px;
    right: 0px;
    left: 0px;
    background: rgba(0, 0, 0, 0.61);
    z-index: 99;
    align-items: center;
    justify-content: center;
    color: #fff;
}

.apploader {
    width: 48px;
    height: 48px;
    margin: 0px auto;
    border: 4px solid #e5e5e5;
    border-top: 4px solid #83161a;
    border-radius: 50%;
    animation: spin 1s linear infinite;
}

@keyframes spin {
    100% {
        transform: rotate(360deg);
    }
}

.flexboxcls {
    display: flex;
    align-items: center;
    gap: 10px;
}

/* ================================
   Custom dx-stepper
================================ */
.tabinsideblock {
    margin-top: 10px;
}

.dx-stepper-container {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin: 0px auto 30px;
    position: relative;
    width: 95%;
}

.dx-step {
    display: flex;
    flex-direction: column;
    align-items: center;
    flex: 1;
    position: relative;
    z-index: 2;
    max-width: 80px;
    min-width: 80px;
}

.dx-step-circle {
    width: 30px;
    height: 30px;
    border-radius: 50%;
    background-color: #6c757d;
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
    font-weight: bold;
    border: 4px double #fff !important;
    margin-top: 0;
}

.dx-step.completed .dx-step-circle {
    background-color: #3BB270; /* green for completed */
    border: 4px double #fff !important;
}

.dx-step-label {
    text-align: center;
    font-weight: 500;
    font-size: 14px;
    color: #495057;
    position: absolute;
    top: 32px;
    min-height: 60px;
    display: flex;
    align-items: center;
}

.dx-step-line {
    position: absolute;
    top: 20px;
    left: 50%;
    width: 100%;
    height: 4px;
    background-color: #6c757d;
    z-index: 1;
    display: none;
}

.dx-step .oi-x {
    margin-top: -4px;
}

.dx-step-line.completed {
    background-color: #28a745;
}

.dx-step.current .dx-step-circle {
    background-color: #3BB270; /* Bootstrap primary blue */
    border: 4px double #fff !important;
}

.dxline {
    border-top: 1px solid #4f4a4a;
    display: flex;
    width: 93%;
    position: absolute;
    align-items: center;
    left: 3.5%;
    right: 3.5%;
}

.dx-step:first-child .dxline,
.dx-step:last-child .dxline {
    display: none;
}

.legendblock {
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 29px -20px 0;
    justify-content: end;
}

    .legendblock li {
        border: 1px solid #ccc;
        display: flex;
        gap: 5px;
        padding-right: 5px;
    }

        .legendblock li span {
            display: flex;
        }

    .legendblock .legend {
        display: flex;
        padding: 10px;
    }

    .legendblock .legend-green, .legendblock .text-green {
        background: #28a745;
        color: #28a745;
    }

    .legendblock .legend-purple, .legendblock .text-purple {
        background: #6f42c1;
        color: #6f42c1;
    }

    .legendblock .legend-gray, .legendblock .text-gray {
        background: #6c757d;
        color: #6c757d;
    }

    .legendblock .legend-red, .legendblock .text-red {
        background: #dc3545;
        color: #dc3545;
    }

.text-green {
    color: #28a745;
}

.text-purple {
    color: #6f42c1;
}

.text-gray {
    color: #6c757d;
}

.text-red {
    color: #dc3545;
}

.with100 {
    width: 100%;
}

.gridblock {
    margin: 60px 0px 20px;
}

.sub-title {
    font-size: 18px !important;
    color: #83161a;
    font-weight: 500;
}

.sub-title-2 {
    font-size: 14px !important;
    color: #83161a;
    font-weight: 500;
}

.dxbl-popup {
    overflow: inherit !important;
}

.dxbl-modal > .dxbl-modal-root > .dxbl-popup:not(.dxbl-popup-resized):not(.dxbl-popup-fixed-width) {
    --overflow: inherit !important;
}

.nocursor {
    cursor: auto !important;
}

.shipgrid .dxbl-grid-table th:nth-child(6),
.shipgrid .dxbl-grid-table th:nth-child(7),
.shipgrid .dxbl-grid-table th:nth-child(8),
.shipgrid .dxbl-grid-table th:nth-child(10) {
    cursor: auto;
}

.custom-drop-zone {
    padding: 5px;
    border: 1px solid #ccc;
    border-radius: 4px;
}

.dxbl-upload-file-list-view {
    overflow: auto;
    max-height: 130px;
    border: 1px solid #ccc;
    border-radius: 3px;
    margin: 5px 0px;
    padding: 0px;
}

    .dxbl-upload-file-list-view .dxbl-upload-file-view {
        background: #f9f9f9;
        padding: 5px;
        height: auto !important;
        margin: 1px 0px !important;
        font-size: 13px !important;
    }

.btn.btn-primary:hover, .btn.btn-primary.focus {
    background-color: #5a0a0e !important;
    border-color: #5a0a0e !important;
    vertical-align: bottom !important;
    color: #fff !important;
}

.btn.secondary-btn:hover, .btn.secondary-btn.focus {
    background-color: #5a0a0e !important;
    border-color: #5a0a0e !important;
    vertical-align: bottom !important;
    color: #fff !important;
}

.custom-drop-zone {
    padding: 5px;
    border: 1px solid #ccc;
    border-radius: 4px;
    text-align: center;
}

.dxbl-upload-file-list-view {
    overflow: auto;
    max-height: 130px;
    border: 1px solid #ccc;
    border-radius: 3px;
    margin: 5px 0px;
    padding: 0px;
}

    .dxbl-upload-file-list-view .dxbl-upload-file-view {
        background: #f9f9f9;
        padding: 5px;
        height: auto !important;
        margin: 1px 0px !important;
        font-size: 13px !important;
    }

.btn-primary {
    background: #83161a;
    color: #fff !important;
    border: 1px solid #83161a !important;
}

.btn-secondary {
    border: 1px solid #83161a !important;
    color: #83161a !important;
    background: #fff !important;
}

.btn-primary:hover, .btn-primary.focus {
    background: #fff !important;
    border-color: #83161a !important;
    vertical-align: bottom !important;
    color: #83161a !important;
}

.secondary-btn:hover, .secondary-btn.focus {
    background: #83161a !important;
    border: 1px solid #83161a !important;
    vertical-align: bottom !important;
    color: #fff !important;
}

.btn.btn-primary:hover, .btn.btn-primary.focus {
    background-color: #5a0a0e !important;
    border-color: #5a0a0e !important;
    vertical-align: bottom !important;
    color: #fff !important;
}

.btn.secondary-btn:hover, .btn.secondary-btn.focus {
    background-color: #5a0a0e !important;
    border-color: #5a0a0e !important;
    vertical-align: bottom !important;
    color: #fff !important;
}

.fileerror {
    position: relative;
}

.file-input-error .fileerror::before {
    content: "!";
    font-weight: 700;
    font-size: 12px;
    color: #fff;
    background: #e53935;
    border-radius: 50%;
    width: 16px;
    height: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    left: 8px;
    top: 7px;
}

.file-input-error .fileerror {
    border: 1px solid #e53935 !important;
    border-radius: 4px;
}

.file-input-error .dxbl-upload-container {
    display: block !important;
    opacity: 1;
    pointer-events: auto;
}

/* ----- FILE TRAY CONTAINER ----- */
.custom-file-tray {
    margin-top: 6px;
}

.file-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 4px 6px;
}

.file-name {
    color: #333;
    font-weight: 500;
    font-weight: 500;
    width: 260px;
    /*border: 1px solid;*/
    white-space: break-spaces;
    word-wrap: break-word;
}

.valid-file .file-status {
    font-size: 10px;
    color: #4a4a4a;
}

.invalid-file {
    color: inherit;
}

.file-error {
    color: #c62828;
    font-size: 12px;
    margin-left: 8px;
}

.link-btn {
    background: none;
    border: none;
    text-decoration: underline;
    cursor: pointer;
}

.file-remove-btn {
    padding: 0;
    margin-left: 6px;
    min-width: 22px;
    height: 22px;
    opacity: 0.75;
}

    .file-remove-btn:hover {
        opacity: 1;
    }

    .file-remove-btn .dx-icon {
        color: #444;
    }

.file-x-btn {
    background: none;
    border: none;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    color: #444;
    margin-left: 6px;
}

    .file-x-btn:hover {
        color: #000;
    }

.file-tray-footer {
    margin-top: 6px;
    padding: 4px 6px;
    display: flex;
    justify-content: flex-end;
    font-size: 12px;
}

.total-size-label {
    color: #555;
    margin-right: 4px;
}

.total-size-value {
    font-weight: 600;
    color: #333;
}

.flexcls {
    display: flex;
    align-items: center;
    gap: 10px;
}

    .flexcls input {
        margin: 0px;
    }

.mtop10 {
    margin-top: 30px;
}

.loginbg {
    background: url(../images/body-bg-map.png);
    width: 100%;
    background-size: 72%;
    background-position: center 30px;
    background-repeat: no-repeat;
}

.gernalinfo {
    border: 1px solid #ccc;
    padding: 10px;
    background: #e9e9e9;
}

    .gernalinfo h4 {
        text-align: center;
        font-weight: 500;
    }

    .gernalinfo .middleinput {
        justify-content: center;
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 10px;
    }

    .gernalinfo .middleinputbtn {
        display: flex;
        gap: 10px;
    }

.margin-l-r {
    margin: 0px 10px;
}

.Shippingcontrols {
    display: flex;
    margin: 0px;
    padding: 0px;
    gap: 20px;
}

    .Shippingcontrols li {
        display: flex;
        align-items: center;
        gap: 5px;
    }

.spaceclsradio {
    display: flex;
    margin: 10px 0px;
    align-items: baseline;
    gap: 5px;
}

.removallbox .dxbl-upload.dxbl-upload-full-width {
    padding-top: 0px !important;
}

.spacetop {
    margin-top: 10px !important;
}

.gridreponsive {
    width: 100%;
    overflow: auto;
}

    .gridreponsive .dxbl-grid {
        width: 150% !important;
    }

.biggridreponsive {
    width: 100%;
    overflow: auto;
}

    .biggridreponsive .dxbl-grid {
        width: 510% !important;
    }

.margin20 {
    margin: 20px !important;
}

.testbuttonslink {
    justify-content: left;
    margin-top: 20px;
}

.dxbl-toast-portal {
    z-index: 9999999 !important;
}

.uombsiscls {
    margin-top: 11px;
    display: flex;
    gap: 10px;
    align-items: center;
}

    .uombsiscls label {
        align-items: center;
        display: flex;
        gap: 4px;
    }

        .uombsiscls label input {
            margin: 0px !important;
        }

.dxbl-group.expanded .dxbl-group-header {
    background: #83161a !important;
    color: #fff !important;
}

    .dxbl-group.expanded .dxbl-group-header .dxbl-text {
        color: #fff !important;
    }

.crpbtn {
    display: flex;
    align-items: center;
    gap: 10px;
    width: 100%;
}

.dxbl-group-header .dxbl-group-expand-btn {
    border: 1px solid #83161a;
    border-radius: 5px;
    padding: 6px;
    background-color: #83161a;
}

    .dxbl-group-header .dxbl-group-expand-btn .dxbl-image {
        height: 12px !important;
        color: #fff !important;
        opacity: 1 !important;
    }

.spacingtop {
    margin-top: 10px;
}

.productbtns {
    display: flex;
    gap: 10px;
    margin-top: 26px;
}

/* Disable typing inside DxDateEdit but allow calendar picking */
.no-typing-date .dxbl-text-edit-input {
    pointer-events: none !important;
}

.no-typing-date .dxbl-date-edit-button {
    pointer-events: auto !important;
}

.validation-error {
    border: 1px solid #e53935 !important;
    border-radius: 4px;
    position: relative;
    padding-left: 22px;
}

    .validation-error::after {
        content: "!";
        position: absolute;
        top: 6px;
        left: 6px;
        width: 14px;
        height: 14px;
        background: #e53935;
        color: #fff;
        font-size: 10px;
        font-weight: bold;
        border-radius: 50%;
        display: flex;
        align-items: center;
        justify-content: center;
    }

.field-error {
    position: relative;
    border: 1px solid #e53935 !important;
    border-radius: 4px;
    padding-left: 24px;
}

    .field-error::before {
        content: "!";
        font-weight: 700;
        font-size: 12px;
        color: #fff;
        background: #e53935;
        border-radius: 50%;
        width: 16px;
        height: 16px;
        display: flex;
        align-items: center;
        justify-content: center;
        position: absolute;
        left: 6px;
        top: 6px;
        z-index: 5;
    }

.text-left {
    text-align: left !important;
}

.text-center {
    text-align: center !important;
}

.displayflexblock {
    display: flex;
    align-items: center;
    gap: 10px;
    justify-content: end;
    font-weight: 500;
}

/* Make grid header sticky */
/* Optional: keep header borders visible */
.remarks-grid-wrapper .dxbl-grid {
    height: 150px;
}

.dxbl-btn.dxbl-tabs-scroll-btn-prev, .dxbl-btn.dxbl-tabs-scroll-btn-next {
    border: 1px solid #000 !important;
}

    .dxbl-btn.dxbl-tabs-scroll-btn-prev:hover, .dxbl-btn.dxbl-tabs-scroll-btn-next:hover {
        background: #83161a !important;
        color: #fff !important;
    }

.dxbl-list-box-item-selected {
    background: #e8e9e9 !important;
    color: #000 !important;
    border: 1px solid #e8e9e9 !important;
}

::deep .dxbl-btn.dxbl-tabs-scroll-btn-prev,
::deep .dxbl-btn.dxbl-tabs-scroll-btn-next {
    border: 1px solid #000 !important;
}

/* Default: no underline */
.product-link {
    text-decoration: none;
    cursor: pointer;
    color: #0d6efd; /* Bootstrap primary (optional) */
}

    /* Show underline only on hover */
    .product-link:hover {
        text-decoration: underline;
    }

.hoverblock {
    display: none;
}

.tooltiphovercls:hover .hoverblock {
    display: block !important;
}

/* ==========================================================
           Tooltip wrapper
           ========================================================== */
/* ==========================================================
           Info icon
           ========================================================== */
.status-info-icon {
    color: #0d6efd;
    cursor: pointer;
    font-size: 16px;
}

/* ==========================================================
           FLOATING TOOLTIP (KEY FIX)
           ========================================================== */
.status-tooltip {
    position: fixed; /* 🔥 breaks out of grid */
    display: none;
    background: #fff;
    border-radius: 6px;
    padding: 8px;
    min-width: 167px;
    max-width: 167px;
    z-index: 2147483647; /* max safe */
    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.2);
}

/* ==========================================================
           Position BELOW + RIGHT of icon
           ========================================================== */
.status-tooltip-container:hover .status-tooltip {
    display: block;
}

/* ==========================================================
           Remove scrollbars
           ========================================================== */
.status-tooltip * {
    overflow: visible !important;
    scrollbar-width: none;
}

    .status-tooltip *::-webkit-scrollbar {
        display: none;
    }

.insidetable {
    width: 150px !important;
    min-width: 150px;
}

.tbleheight {
    min-height: 250px !important;
}

.butndisplay {
    display: flex;
    gap: 10px;
}

.padding10 {
    padding: 10px !important;
}

::deep .dxbl-grid-table .dx-row.dx-data-row:empty {
    display: none !important;
}

::deep .dx-row-inserted {
    background: transparent !important;
}

.username {
    max-width: 250px;
    min-width: 250px;
    display: inline-block;
    text-overflow: ellipsis;
    border: 1px solid #000;
    align-items: center;
    overflow: hidden;
    white-space: nowrap;
}

.checkbox-inline {
    display: flex;
    align-items: center;
}

    .checkbox-inline input {
        margin-top: 0px;
        margin-right: 5px;
    }

.todabtn {
    background: #fff !important;
    color: #83161a !important;
}

.mainblockcolor {
    display: flex;
    justify-content: end;
    align-items: center;
    padding: 0px;
}

    .mainblockcolor .calendarprev {
        display: flex;
        align-items: center;
        gap: 10px;
    }

        .mainblockcolor .calendarprev .flexboxclss {
            display: flex;
            align-items: center;
            gap: 5px;
        }

.schedule-card {
    padding: 5px;
    border-radius: 5px;
    width: 200px;
    margin: 0px auto 5px;
}

.minwidthcls {
    display: flex;
    width: 180px;
}

.amacadisc {
    display: flex !important;
    align-items: start;
    min-width: 300px;
    max-width: 300px;
    word-wrap: break-word;
    white-space: break-spaces;
}

.dxbl-dropdown li {
    white-space: break-spaces;
    word-break: break-all;
    width: 100%;
}

.me-2 {
    margin-right: 0px !important;
}