.modal-dialog {
    direction: rtl;
    background-color: #ffffff;
    box-shadow: 0 1px 20px 0 rgba(0, 0, 0, 0.1);
    border: solid 1px #225980;
    width: auto;
}

.modal-content {
    border-radius: calc(0.3rem - 1px);
    border: none;
}

.modal-header {
    height: 69px;
    padding: 21px;
    padding-right: 48px;
    padding-left: 28px;
    background-color: #385370;
    border: none;
}

    .modal-header span {
        font-size: 20px;
        font-weight: 500;
        color: #ffffff;
        text-align: right;
    }

    .modal-header .Close-Icon {
        width: 18px;
        height: 18px;
        margin-top: 6px;
        object-fit: contain;
        opacity: 1;
    }

    .modal-header .close {
        opacity: 1 !important;
        padding: 5px;
    }

.modal-body {
    padding: 0px;
}

    .modal-body > table {
        /* width:100%; */
    }

        .modal-body > table > tbody > tr > td {
            vertical-align: top;
            text-align: right;
        }

            .modal-body > table > tbody > tr > td:first-child {
                vertical-align: top;
                text-align: right;
                width: 200px;
                height: 100%;
            }

    .modal-body .vertical-tabs-place-holder {
        float: right !important;
        width: 200px;
        height: 100%;
    }

    .modal-body .left-side {
        /*display:inline-block;*/
        position: relative;
        float: right;
        max-width: calc(100% - 205px);
    }

        .modal-body .left-side .top-part {
            /* height: 549px; */
            /*overflow-y: auto;*/
            overflow: visible;
            padding: 20px 10px 20px 10px;
        }
/*.top-part::-webkit-scrollbar {
    width: 6px;
}
.top-part::-webkit-scrollbar-track {
    border-radius: 5px;
  	background-color: #f7f9fa;
}

.top-part::-webkit-scrollbar-thumb {
    border-radius: 10px;
    background-color: #798fa0;
}*/
.top-part > div {
    direction: rtl;
}

.modal-body .modal-close-text-container,
.modal-footer .modal-close-text-container {
    text-align: center;
    color: #9a9a9a;
}

.modal-body .modal-close-text,
.modal-footer .modal-close-text {
    border-bottom: solid 1px #9a9a9a;
    font-size: 16px;
    text-align: center;
    color: #9a9a9a;
    margin: auto;
    width: 40px;
    padding-bottom: 2px;
    text-decoration: none;
}

.modal-body-inner {
    padding: 20px 20px 10px 20px;
}

.modal-inner-content {
    display: flex;
    padding: 5px;
    justify-content: center;
    align-items: center;
}

.clearFilterBtn {
    float: right
}

.loadDataBtn {
    float: right;
    margin-right: 10px
}

.filter-input-dialogbox-input-footer {
    float: left;
}

.modal { /*Makes HtmlEditor overlays appear infront of out dialogs*/
    z-index: 10009 !important;
}

.dialog-form {
    width: 700px;
}

.fullpageformcontainer .dialog-form {
    width: 1150px;
}

.dialog-form-narrow {
    width: 360px;
}

.ui-special-tabs-vertical {
    padding: 0px !important;
    float: right;
    height: 100%;
}

    .ui-special-tabs-vertical > ul {
        background-color: #f7f9fa;
        width: 199px;
        height: 100%;
        padding: 0px;
        margin: 0px;
        border: none;
    }

        .ui-special-tabs-vertical > ul > li {
            width: 100%;
            height: 50px;
            display: flex;
            align-items: center;
            list-style-type: none;
            padding-right: 48px;
            margin: 0px;
            background-color: #f7f9fa;
            cursor: pointer;
            border: none;
        }

        .ui-special-tabs-vertical > ul > span {
            display: flex;
            height: 80px;
            align-items: center;
            list-style-type: none;
            padding-right: 48px;
            font-family: Heebo;
            font-size: 16px;
            font-weight: 300;
            line-height: 1.44;
            text-align: right;
            color: #555555;
            cursor: pointer;
        }

    .ui-special-tabs-vertical ul li a {
        padding: 0px !important;
        display: block;
        font-family: Heebo;
        font-size: 16px !important;
        font-weight: 500;
        line-height: 1.44;
        text-align: right;
        color: #555555;
        text-decoration: none;
    }

    .ui-special-tabs-vertical ul li.tab-active {
        background-color: #e8f1f3;
    }

        .ui-special-tabs-vertical ul li.tab-active::before {
            position: absolute;
            content: '';
            right: 199px;
            border: 9px solid transparent;
            border-right: 12px solid #e8f1f3;
        }


/* Fix to hide all other special tabs*/
.special-accordion {
    display: none;
}


.special-accordion-active {
    display: block;
}

/* End Fix to hide all other special tabs*/

.special-accordion .special-accordion-header {
    font-family: Heebo;
    font-size: 18px !important;
    line-height: 1.28;
    border: none !important;
    color: #225980;
    margin: 10px 0px 5px 0px;
}

.special-accordion > div {
    display: none;
}

.special-accordion .special-accordion-header {
    font-family: Heebo;
    font-size: 18px !important;
    line-height: 1.28;
    border: none !important;
    color: #225980;
    margin: 10px 0px 5px 0px;
    cursor: pointer;
}

.special-accordion-active .special-accordion-header {
    font-weight: 500;
    border-bottom: 1px solid #385370 !important;
}

.special-accordion-header .special-accordion-header-icon {
    display: inline-block;
    background-image: url(/Design/New2/assets/img/dropdown-close.png) !important;
    margin-left: 20px;
    width: 18px;
    height: 18px;
}

.special-accordion-active > .special-accordion-header > .special-accordion-header-icon {
    background-image: url(/Design/New2/assets/img/dropdown-open.png) !important;
}

.special-accordion-active > div {
    display: block;
}

/*Form style*/
.tableinputsupdatedate {
    font-family: Heebo;
    font-size: 16px;
    font-weight: 300;
    line-height: 1.44;
    text-align: right;
    color: #555555;
}

.tableinputsupdatedateFloat {
    font-family: Heebo;
    font-size: 16px;
    font-weight: 300;
    line-height: 1.44;
    text-align: right;
    color: #555555;
    float: right;
}

table.inputstable {
    border-collapse: collapse;
}

    table.inputstable > tbody > tr > td {
        padding-left: 30px;
        padding-right: 30px;
        padding-top: 10px;
        padding-bottom: 10px;
    }

table.inputstablenopadding > tbody > tr > td {
    padding-left: 0px;
    padding-right: 0px;
}
/*table.inputstable>tbody>tr>td:first-child*/
table.inputstable > tbody > tr > td:nth-child(2) {
    border-right: solid 1px #e8f1f3;
}

.inputstable label {
    margin-bottom: 3px;
    font-family: Heebo;
    font-size: 14px;
    font-weight: 400;
    line-height: 1.64;
    text-align: right;
    color: #555555;
    display: block;
}

    .inputstable label.error {
        color: black;
    }

.inputstable select,
.inputstable input[type=text],
.inputstable input[type=password],
.inputstable area {
    width: 300px;
    height: 30px;
    font-weight: 400;
    background-color: #fff;
    font-family: Heebo !important;
    font-size: 16px !important;
    line-height: 1.25 !important;
    text-align: right;
    color: #225980 !important;
    border-radius: 3px;
    border: solid 1px #cccccc;
    padding-right: 5px;
}

.inputstable input::placeholder,
.inputstable input::-webkit-input-placeholder,
.inputstable input::-moz-placeholder,
.inputstable input:-ms-input-placeholder,
.inputstable input:-moz-placeholder {
    font-family: Heebo;
    font-size: 16px;
    line-height: 1.25;
    text-align: right;
    color: #225980 !important;
}

.inputstable option {
    background-color: #798fa0;
    color: #fff;
    border: none;
    padding: 5px;
}

.inputstable .message {
    color: red;
    display: block;
    /*float: left;*/
    margin-top: -22px;
}

.inputstable .field-validation-error {
    color: red;
}

    .inputstable .field-validation-error span {
        color: red;
        font-size: 14px;
    }

    .inputstable .message div:before,
    .inputstable .field-validation-error:before {
        width: 12px;
        height: 12px;
        margin-left: 5px;
        content: url('/Design/New2/popup/src/img/error.png');
    }

.customformheader {
    color: #385370;
    font-weight: normal;
    font-size: 18px;
    font-weight: bold;
}

.editcustomerproductsection {
    margin-top: 10px;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
}

    .editcustomerproductsection .inputstableinnerframe1 {
        padding-top: 10px;
        float: right;
        padding-left: 20px;
        padding-right: 20px;
        border-left: 1px solid #e8f1f3;
        width: 340px;
    }

    .editcustomerproductsection .inputstableinnerframe2 {
        padding-top: 10px;
        float: right;
        padding-left: 20px;
        padding-right: 20px;
        width: 340px;
    }

    .editcustomerproductsection .inputstableinnerframe3 {
        padding-top: 10px;
        float: right;
        padding-left: 20px;
        padding-right: 20px;
    }

    .editcustomerproductsection .inputstableinnerframefirst,
    .editcustomerproductsection .inputstableinnerframemiddle {
        padding-top: 10px;
        float: right;
        padding-left: 20px;
        padding-right: 20px;
        border-left: 1px solid #e8f1f3;
        width: 340px;
        /*text-align:right;*/
    }

    .editcustomerproductsection .inputstableinnerframelast {
        padding-top: 10px;
        float: right;
        padding-left: 20px;
        padding-right: 20px;
        width: 340px;
        /*text-align: right;*/
    }

    .editcustomerproductsection .inputstableinnerframefirst,
    .editcustomerproductsection .inputstableinnerframemiddle {
        padding-top: 10px;
        float: right;
        padding-left: 20px;
        padding-right: 20px;
        border-left: 1px solid #e8f1f3;
        width: 340px;
        /*text-align: right;*/
    }

    .editcustomerproductsection .inputstableinnerframelast {
        padding-top: 10px;
        float: right;
        padding-left: 20px;
        padding-right: 20px;
        width: 340px;
        /*text-align: right;*/
    }


.span-display-forreadonly {
    /*    color: #555555 !important;*/
    /* font-weight: bold; */
    font-family: Heebo !important;
    font-size: 16px !important;
    border: 1px solid #dddddd;
    padding: 2px;
    color: #225980 !important;
    background-color: #ddd;
}

.custom-accordion-style-type-7 .inputstableinnerframefirst,
.custom-accordion-style-type-7 .inputstableinnerframefirst {
    border-left: 0px solid #e8f1f3;
}

.dialogtabletype1 .inputstableinnerframefirst {
    padding-top: 10px;
    float: right;
    padding-left: 10px;
    padding-right: 0px;
    border-left: 1px solid #e8f1f3;
    width: 300px;
}

.dialogtabletype1 .inputstableinnerframemiddle {
    padding-top: 10px;
    float: right;
    padding-left: 10px;
    padding-right: 10px;
    border-left: 1px solid #e8f1f3;
    width: 300px;
}

.dialogtabletype1 .inputstableinnerframelast {
    padding-top: 10px;
    float: right;
    padding-left: 10px;
    padding-right: 10px;
    width: 300px;
}

.dialogtabletype1 select,
.dialogtabletype1 input[type=text],
.dialogtabletype1 input[type=password],
.dialogtabletype1 textarea {
    width: 270px;
}


.dialogtabletype1-countrowinputs-4 .inputstableinnerframefirst,
.dialogtabletype1-countrowinputs-4 .inputstableinnerframemiddle,
.dialogtabletype1-countrowinputs-4 .inputstableinnerframelast {
    width: 220px;
}

.dialogtabletype1-countrowinputs-4 select,
.dialogtabletype1-countrowinputs-4 input[type=text],
.dialogtabletype1-countrowinputs-4 input[type=password],
.dialogtabletype1-countrowinputs-4 textarea {
    width: 210px;
}

.dialogtabletype1-countrowinputs-3 .inputstableinnerframefirst,
.dialogtabletype1-countrowinputs-3 .inputstableinnerframemiddle,
.dialogtabletype1-countrowinputs-3 .inputstableinnerframelast {
    width: 270px;
}

.dialogtabletype1-countrowinputs-3 select,
.dialogtabletype1-countrowinputs-3 input[type=text],
.dialogtabletype1-countrowinputs-3 input[type=password],
.dialogtabletype1-countrowinputs-3 textarea {
    width: 260px;
}

.editsection2 .inputstableinnerframefirst,
.editsection2 .inputstableinnerframemiddle {
    /*padding-top:10px;*/
    float: right;
    padding-left: 20px;
    /*padding-right:20px;
    border-left:1px solid #e8f1f3;
    width:340px;*/
}

.editsection2 .inputstableinnerframelast {
    /*padding-top:10px;*/
    float: right;
    /*padding-left:20px;
    padding-right:20px;    
    width:340px;*/
}

.inputstable2 label {
    margin-bottom: 3px;
    font-family: Heebo;
    font-size: 14px;
    font-weight: 400;
    line-height: 1.64;
    text-align: right;
    color: #555555;
    display: block;
}

    .inputstable2 label.error {
        color: black;
    }

.inputstable2 select,
.inputstable2 input[type=text],
.inputstable2 area {
    width: 260px;
    height: 30px;
    font-weight: 400;
    background-color: #fff;
    font-family: Heebo !important;
    font-size: 16px !important;
    line-height: 1.25 !important;
    text-align: right;
    color: #225980 !important;
    border-radius: 3px;
    border: solid 1px #cccccc;
    padding-right: 5px;
}

.inputstable2 input::placeholder,
.inputstable2 input::-webkit-input-placeholder,
.inputstable2 input::-moz-placeholder,
.inputstable2 input:-ms-input-placeholder,
.inputstable2 input:-moz-placeholder {
    font-family: Heebo;
    font-size: 16px;
    line-height: 1.25;
    text-align: right;
    color: #225980 !important;
}

.inputstable2 option {
    background-color: #798fa0;
    color: #fff;
    border: none;
    padding: 5px;
}

.inputstable2 .message {
    color: red;
    display: block;
    /*float: left;*/
    margin-top: -22px;
}

.inputstable2 .field-validation-error {
    color: red;
}

    .inputstable2 .field-validation-error span {
        color: red;
        font-size: 14px;
    }

    .inputstable2 .message div:before,
    .inputstable2 .field-validation-error:before {
        width: 12px;
        height: 12px;
        margin-left: 5px;
        content: url('/Design/New2/popup/src/img/error.png');
    }

.edit-table-rows-accordion {
    border-bottom: solid 1px #b9d1d6;
    padding-top: 10px;
    padding-bottom: 10px;
    margin-left: 50px;
}

    .edit-table-rows-accordion .edit-table-rows-accordion-content {
        display: none;
    }

    .edit-table-rows-accordion .edit-table-rows-accordion-header-container {
        margin-right: 10px;
        cursor: pointer
    }

    .edit-table-rows-accordion .edit-table-rows-accordion-header-text {
        font-size: 16px;
        font-weight: 500;
        line-height: 1.25;
        text-align: right;
        color: #225980;
        margin: 5px 0px 5px 0px;
        cursor: pointer;
        float: right;
    }

.modal .edit-table-rows-accordion-header-delete-text {
    color: #225980;
    margin: 5px 0px 5px 0px;
    cursor: pointer;
    float: left;
}

    .modal.edit-table-rows-accordion-header-delete-text a {
        font-size: 16px;
        font-weight: 500;
        line-height: 1.25;
        color: #225980;
        white-space: nowrap;
    }

    .modal .edit-table-rows-accordion-header-delete-text .edit-table-rows-accordion-header-delete-image {
        float: right;
        margin-left: 10px;
        background-image: url(/Design/New2/assets/img/delete-blue.png) !important;
        width: 11px;
        height: 12px;
        margin-top: 5px;
    }

.modal .edit-table-rows-new-row {
    margin-right: 10px;
    margin-bottom: 20px;
}

    .modal .edit-table-rows-new-row a {
        font-size: 17px;
        font-weight: bold;
        line-height: 1.35;
        color: #BCCDDA;
    }

.modal .edit-table-rows-accordion .edit-table-rows-accordion-header-icon {
    display: inline-block;
    background-image: url(/Design/New2/assets/img/dropdown-arrow-small2.png) !important;
    background-repeat: no-repeat;
    margin-left: 20px;
    margin-top: 14px;
    width: 10px;
    height: 6px;
    float: right;
}

.modal .edit-table-rows-accordion-active .edit-table-rows-accordion-header-icon {
    background-image: url(/Design/New2/assets/img/dropdown-arrow-small2-open.png) !important;
}

.modal .edit-table-rows-accordion-active .edit-table-rows-accordion-content {
    display: block;
}

/*  ==========  GRID HEADER  ===============*/
.modal .special-grid-header .title {
    font-family: Heebo;
    font-size: 26px;
    font-weight: bold;
    text-align: right;
    color: #225980;
    margin-right: 20px;
}

/*.special-grid-header .just_gamburger:hover ul{
    display: block;
}*/
.modal .special-grid-header .tab_head {
    position: relative;
}

.modal .special-grid-header #search {
    width: 500px;
    height: 50px;
    border: solid 1px #e8f1f3;
    float: left;
    font-family: Heebo;
    font-size: 16px;
    text-align: right;
    color: #555555;
    padding-right: 52px;
    background-image: url('/Design/New2/assets/img//search-icon-blue-ui.png');
    background-repeat: no-repeat;
    background-position-x: 460px;
    background-position-y: center;
}

    .modal .special-grid-header #search::placeholder {
        font-family: Heebo;
        font-size: 16px;
        text-align: right;
        color: #555555;
    }

.modal .special-grid-header p {
    font-family: Heebo;
    font-size: 16px;
    text-align: right;
    color: #555555;
    margin: 0px;
    padding: 0px;
    margin-top: 10px;
    margin-bottom: 10px;
}

.modal .page-title {
    font-family: Heebo;
    font-size: 26px;
    font-weight: bold;
    color: #225980;
}

.modal .tblData .trHeader {
    /* background-color: #337ab7 !important; */
    background-color: #ffffff !important;
}

.modal .tblData .trAlternate {
    /* background-color: #f1f1f1 !important; */
    background-color: #ffffff;
}

.modal .tblData > tbody > tr > td,
.modal .tblData > tr > td {
    font-size: 14px !important;
    border: none !important;
    color: #555555 !important;
    /*border-bottom:1px solid #e8f1f3 !important;*/
    border: 1px solid #e8f1f3 !important;
    padding-right: 6px;
    padding-left: 6px;
    padding-top: 6px;
    padding-bottom: 6px;
    text-align: right;
    white-space: nowrap;
    vertical-align: top;
}

    .modal .tblData > tbody > tr > td > label,
    .modal .tblData > tr > td > label {
        font-weight: normal;
        font-size: 14px !important;
    }

    .modal.tblData > tbody > tr > td > a,
    .modal .tblData > tr > td > a {
        color: #555555 !important;
        font-size: 14px !important;
    }

.modal .tblData > tbody > tr > th,
.modal .tblData > thead > tr > th,
.modal .tblData > tr > th {
    font-size: 14px !important;
    /*border:none !important;*/
    border: 1px solid #e8f1f3 !important;
    color: #385370 !important;
    padding-right: 6px;
    padding-left: 6px;
    padding-top: 6px;
    padding-bottom: 6px;
    text-align: center;
    white-space: nowrap;
    vertical-align: top;
}

.modal .tblData.tablefullgrid > tbody > tr > td,
.modal .tblData.tablefullgrid > tr > td {
    border: 1px solid #e8f1f3 !important;
}

.modal .tblData.tablefullgridincludeheader > tbody > tr > td,
.modal .tblData.tablefullgridincludeheader > tr > td,
.modal .tblData.tablefullgridincludeheader > tbody > tr > th,
.modal .tblData.tablefullgridincludeheader > tr > th {
    border: 1px solid #e8f1f3 !important;
}

.modal .tblData.tablewithwrap > tbody > tr > td,
.modal .tblData.tablewithwrap > tr > td {
    white-space: normal;
}

/*Fixes for Old design*/
.modal .linkbutton {
    color: #555555 !important;
}

.modal fieldset legend {
    color: #385370;
}

.modal fieldset td {
    padding: 4px;
    vertical-align: top;
}

    .modal fieldset td label {
        font-weight: normal;
    }

.modal div.modal-body div[iscontainer=true] {
    margin: 10px;
}

/*Approve button*/
.modal fieldset p input[type=submit]:nth-child(1) {
    min-width: 80px;
    padding-right: 10px !important;
    padding-left: 10px !important;
    height: 30px !important;
    border-radius: 3px !important;
    background-color: #449fe3 !important;
    box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.1) !important;
    border: solid 0px #70e195 !important;
    font-size: 14px !important;
    font-weight: normal !important;
    line-height: 1.64 !important;
    text-align: center !important;
    color: #ffffff !important;
    text-decoration: none;
    cursor: pointer;
}

/*Cancel button*/
.modal fieldset p input[type=submit]:nth-child(2) {
    min-width: 80px;
    padding-right: 10px !important;
    padding-left: 10px !important;
    height: 30px !important;
    border-radius: 3px !important;
    background-color: #d6ecf1 !important;
    box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.1) !important;
    border: solid 0px #70e195 !important;
    font-size: 14px !important;
    font-weight: normal !important;
    line-height: 1.64 !important;
    text-align: center !important;
    color: #385370 !important;
    text-decoration: none;
    cursor: pointer;
}


/*FIX FOR ND2*/
.modal-header {
    background-color: var(--color-pallete-1);
}

.modal-dialog {
    min-width: 53vw;
    border: none;
    border-radius: 20px;
}


.modal button.close {
    background: none;
    width: 30px;
    height: 30px;
    border: 2px solid #fff;
    display: flex;
    padding: 0;
    margin: 0;
    align-content: center;
    align-items: center;
    flex-direction: column;
    justify-content: center;
    border-radius: 100%;
    color: var(--color-pallete-5);
}

.modal img.Close-Icon {
    margin: 0 !important;
}

.modal .special-button, .modal input.speclai-link-button, .special-button, .footer-special-button-1, .special-button-5, .special-button-4, .special-button-3, .special-button-2 {
    display: inline-block;
    font-weight: 400;
    line-height: 1.5 !important;
    color: #212529;
    text-align: center;
    text-decoration: none;
    vertical-align: middle;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
    background-color: transparent;
    border: 1px solid transparent;
    padding: 0.375rem 0.75rem !important;
    font-size: 1rem !important;
    border-radius: 0.25rem !important;
    transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
    font-size: 1rem !important;
    color: #fff !important;
    background-color: var(--color-pallete-1) !important;
    border-color: var(--color-pallete-1) !important;
    border: navajowhite;
    text-align: center;
    min-width: 5rem !important;
    min-height: 36px;
}

.footer-special-button-1 {
    background-color: var(--color-pallete-1) !important;
}

.modal input.speclai-link-button {
    background-color: var(--color-pallete-4) !important;
}

.modal .footer-special-button-1.dropdown-toggle::after {
    content: "";
    display: none !important;
}

.special-accordion-header-icon {
    display: none !important;
}

.ui-special-tabs-vertical li {
    padding: 10px !important;
}

[data-is-for-modal-footer="true"] {
    width: 100%;
}

    [data-is-for-modal-footer="true"] > * {
        margin: 0 !important;
    }

.modal .jdivIcon {
    display: block;
    margin: auto;
    background-color: var(--color-pallete-5);
    padding: 6px;
    box-sizing: content-box;
    border-radius: 7px;
}

    .modal .jdivIcon img {
        filter: invert(1) grayscale(1) brightness(2);
    }

[data-is-attached-files="true"] > div {
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    align-content: flex-end;
    align-items: flex-end;
}

.footer-special-button-container, .special-button-4, .special-button-5 {
    display: inline-block;
    /*margin-top: 5px;*/
}

.special-button-disabled {
    cursor: not-allowed;
    background-color: #edf2f9 !important;
    color: #a8a8a8;
    border: 1px solid #ffffff !important;
    border-bottom: 0 !important;
}

.nd-css-step-action-con {
    display: none;
}

[aria-expanded='true'] .nd-css-step-action-con {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-evenly;
}

.nd-css-step-action-con div {
    margin-top: 5px;
}
/*steps*/

#remindersteps tr {
    border-left: 1px solid var(--light-blue);
    background-color: var( --light-gray);
}

    #remindersteps tr[aria-expanded="true"] {
        background-color: var( --light-blue-green);
        border-top: 1px solid var(--light-blue);
        border-bottom: 1px solid var(--light-blue);
        border-left: none !important;
    }

#remindersteps td, #remindersteps th a, #remindersteps td span {
    font-size: 0.9rem !important;
}

#remindersteps tr {
    cursor: pointer;
}

div#remindersteps {
    background-color: #f7f9fa;
    border: 1px solid var(--light-blue);
    border-radius: 7px;
}

#remindersteps .footer-special-button-1 {
    /*    font-size: 1.1rem !important;*/
    background-color: var(--light-blue) !important;
    border-radius: 4px !important;
    padding: 3px 13px !important;
    border: solid var(--cyan) 1px !important;
}

    #remindersteps .footer-special-button-1:hover {
        background-color: var(--cyan) !important;
        color: #fff !important;
        border: solid var(--light-blue) 1px !important;
    }

#remindersteps .tippy-tooltip.custompopoverlight-theme {
    background-color: unset;
    max-width: unset !important;
}

#remindersteps .tippy-arrow {
    display: none !important;
}

/* fix bug in multiple selection in modal */
/*.select2-container{
    z-index: 99999;
}*/

.select2-dropdown {
    z-index: 99999;
}

.select2-container {
    width: 100%;
}

.select2-highlighted .select2-result-label {
    color: #ffffff !important;
}

.modal span.select2 {
    margin: 0 !important;
}
/*pdf forms*/
.pdfform-page-container {
    position: relative;
    background-color: #ffffff
}

.pdfform-field-container input,
.pdfform-field-container textarea {
    border: 0px solid #999999 !important;
    background-color: #f1f1f1 !important;
    z-index: 20 !important;
    filter: alpha(opacity=90) !important;
    opacity: 0.9 !important;
    color: #000000 !important;
    font-family: Arial !important;
}

.pdfform-field-container div {
    border: 0px solid #999999 !important;
    color: #000000; /*!important;*/
    font-family: Arial /*!important;*/
    z-index:20;
}

.pdfform-field-container textarea {
    white-space: pre-wrap;
}

.pdfform-field-container .signature-field-container {
    background-color: rgb(221, 239, 255);
}


.create-product-container {
    padding: 30px;
    white-space: nowrap;
    vertical-align: top;
}

.create-product-instructions {
    margin-bottom: 10px;
    font-size: 16px;
}

.create-product-category-container {
    vertical-align: top;
    display: inline-block;
    /*float:right;*/
    margin-right: 30px;
}

.create-product-category-header {
    color: #3397e2 !important;
    font-weight: bold;
    font-size: 16px;
    margin-bottom: 10px;
    text-align: center;
}


.create-product-type-container {
    margin-bottom: 5px;
    text-align: center;
}

    .create-product-type-container a {
        font-size: 16px;
        text-decoration: none;
    }

.simple-dialog-modal-dialog .modal-content, .simple-dialog-modal-content {
    border: 2px solid #d6ecf1;
    background-color: #f7f9fa;
    color: #616161;
    text-align: center;
    min-width: 300px;
    min-height: 150px;
    -webkit-box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
}

.modal-footer [data-is-for-modal-footer="true"] > div {
    float: none !important;
    margin: 0px !important;
}

div.modal div.nd2-css-btn-lv-2 {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    /* padding: 5px 5px; */
    /*margin: 5px 20px !important;*/
    justify-content: flex-end;
    width: 100%;
    padding-bottom: 0;
    /* background-color: var(--bg-light); */
    overflow-x: clip;
    align-items: flex-start;
}

div.modal .modal-footer[data-uniqe-dialog-data-name="Reminder_SalesOpportunities"] div.nd2-css-btn-lv-2 {
    width: unset;
}

.nd2-css-btn-lv-2 div a:not(.dropdown-item), .nd2-css-btn-lv-2 div button {
    min-width: unset !important;
    /* font-size: 12px !important; */
    min-height: unset;
    /* padding: 2px 6px !important; */
    margin-bottom: 5px !important;
    background-color: var(--color-pallete-1);
}

.special-button-approve {
    background-color: var(--color-pallete-2) !important;
}

.nd-css-red-btn {
    background-color: var(--bs-danger) !important;
    color: #fff !important;
}

.modal .clearfix {
    display: none !important;
}

div.modal div a:hover, div.modal div button:hover, div.modal div input[class^='spe']:hover {
    color: #000 !important;
    background-color: var(--bg-light) !important;
}

#btnCancelForm {
    /* background-color: var(--bs-warning) !important;*/
    width: 50px;
}

.modal [iscontainer="true"] {
    width: 100%;
}


/*  SIMPLE DIALOG */
.simple-dialog-modal-dialog .modal-content,
.simple-dialog-modal-content {
    border: 2px solid #d6ecf1;
    background-color: #f7f9fa;
    color: #616161;
    text-align: center;
    min-width: 300px;
    min-height: 150px;
    -webkit-box-shadow: 0 5px 15px rgba(0,0,0,0.1);
    box-shadow: 0 5px 15px rgba(0,0,0,0.1);
}

.simple-dialog-modal-dialog {
    border-width: 0px !important;
}

    .simple-dialog-modal-dialog .modal-footer {
        border-top-width: 0px;
    }

    .simple-dialog-modal-dialog .modal-header {
        display: none;
    }

.simple-dialog-modal-backdrop {
    background-color: #ffffff;
}

    .simple-dialog-modal-backdrop.in {
        opacity: 0.8 !important;
    }

/*  SIMPLE DIALOG WITH BACKGROUND */
.simple-dialog-modal-dialog2 {
    background-color: #406690;
    border-radius: 10px;
}

    .simple-dialog-modal-dialog2 .modal-content {
        border-radius: 10px;
        border-width: 0px;
        background-color: #406690;
        color: #dfebf1;
        text-align: center;
        min-width: 460px;
        min-height: 150px;
        -webkit-box-shadow: 0 5px 15px rgba(0,0,0,0.1);
        box-shadow: 0 5px 15px rgba(0,0,0,0.1);
    }

    .simple-dialog-modal-dialog2 .modal-body {
        padding-top: 20px;
    }

    .simple-dialog-modal-dialog2 .modal-footer {
        background-color: #385370;
        height: 160px;
        border-bottom-left-radius: 10px;
        border-bottom-right-radius: 10px;
    }

    .simple-dialog-modal-dialog2 .modal-header {
        height: 100px;
        background-color: #406690;
        display: block;
        border-top-left-radius: 10px;
        border-top-right-radius: 10px;
        padding-top: 70px;
    }

        .simple-dialog-modal-dialog2 .modal-header .close {
            display: none;
        }

        .simple-dialog-modal-dialog2 .modal-header span {
            font-size: 26px;
            font-weight: bold;
            text-align: center;
            color: #3db6e2;
        }

.simple-dialog-inner-title {
    font-size: 20px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.5;
    letter-spacing: normal;
    text-align: center;
    color: #385370;
}
.simple-dialog-modal-dialog.modal-content, .simple-dialog-modal-content,
.modal-dialog.simple-dialog-modal-dialog {
    min-width: 838px;
}
.simple-dialog-modal-dialog .modal-inner-content {
    margin-top: 29px;
}
.simple-dialog-modal-dialog .customalertmessage-inner-title {
    font-weight: bold;
}
.modal-dialog .inputstableinnerframelast [data-is-table-row-input="true"] {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
}

    .modal-dialog .inputstableinnerframelast [data-is-table-row-input="true"] .edit-table-rows-accordion {
        display: flex;
        flex-direction: column;
    }

    .modal-dialog .inputstableinnerframelast [data-is-table-row-input="true"] .inputstableinnerframelast {
        padding-right: 0;
    }
.modal-dialog .edit-table-rows-new-row {
    cursor: pointer;
}
/*HERE ALL*/
@media(min-width: 992px) {
    [data-is-for-modal-footer="true"] {
        display: flex;
        flex-direction: row;
        justify-content: space-between;
        align-items: flex-start;
    }

    .modal-footer [data-is-for-modal-footer="true"] > div {
        float: none !important;
        margin: 0px !important;
        display: flex;
        /* display: inline-block; */
        margin-left: 10px;
        justify-content: flex-start;
        align-items: center;
        margin-top: 5px !important;
        flex-wrap: wrap;
    }
}

.modal input.speclai-link-button, .special-button, .footer-special-button-1, .special-button-4, .special-button-5 {
    margin-left: 5px;
}
/*HERE ONLY DESKTOP*/
}

@media (max-width: 992px) {
    .modal-dialog {
        width: 90vw !important;
    }

    .modal-content {
        width: 100%;
    }

    .modal {
        display: flex !important;
        width: 100%;
        justify-content: center;
    }

    .modal-inner-con {
        display: flex;
        flex-direction: column;
        width: 100%;
    }

    .modal-inner-content {
        width: 100%;
    }

    .modal .ui-special-tabs-vertical ul {
        width: 100%;
    }

    .nd2-css-empty-tab {
        display: none !important;
    }

    .dialog-form {
        width: 100%;
    }

    .left-side {
        width: 100%;
        max-width: unset !important;
    }

    .editcustomerproductsection .inputstableinnerframefirst, .editcustomerproductsection .inputstableinnerframemiddle, .inputstableinnerframelast, .inputstable select, .inputstable input {
        width: 100% !important;
        padding: 0 !important;
        border: none;
    }

    .inputstable select {
        border-radius: 3px;
        border: solid 1px #cccccc;
    }

    [data-is-for-modal-footer="true"] {
        display: flex;
        flex-direction: column;
        align-items: stretch;
        width: 100%;
    }

        [data-is-for-modal-footer="true"] > * {
            margin: 0px !important
        }

    input.speclai-link-button, .special-button, .footer-special-button-1 {
        width: 100% !important;
        margin-top: 10px;
        display: block;
    }

    .footer-special-button-container {
        display: block;
    }

    .panel.combo-p.panel-htop {
        width: 100vw !important;
        position: fixed !important;
        bottom: 0 !important;
        top: unset !important;
        left: 0 !important;
        z-index: 110000 !important;
    }

    .modal .txtsupdatedateFloat {
        display: flex;
        justify-content: flex-start;
        flex-direction: column;
        margin-top: 10px;
        align-content: center;
        align-items: center;
    }

    .special-button-approve {
        background-color: #3fe36f !important;
    }

    special-button-5 special-button-approve {
        background-color: #3fe36f !important;
    }

    .special-button-disabled {
        background-color: #aaaaaa
    }

    .special-button-reject {
        background-color: #f27474
    }

    .modal .tableinputsupdatedateFloat {
        float: none;
    }
    /*HERE MOBILE*/
}