﻿/* Required border for validation */
.ng-submitted .form-select[required=required].ng-empty + .select2-container--bootstrap-5 .select2-selection--single, .ng-submitted .form-select[required=required].ng-empty + .select2-container--bootstrap-5 .select2-selection--multiple, .ng-submitted .multiselect-native-select [required=required].ng-empty + div button.multiselect.dropdown-toggle, .ng-submitted .multiselect-native-select form-select.ng-invalid + div button.multiselect.dropdown-toggle, .ng-submitted .bootstrap-select > select.selectpicker[required=required].ng-empty + .dropdown-toggle.btn-light, .ng-submitted [required="required"].form-control.ng-empty, .ng-submitted tags-input[required="required"].ng-empty.ng-invalid-required {
    border: 1px solid #dc3545 !important;
}

    .ng-submitted .form-select[required=required].ng-empty + .select2-container--bootstrap-5 .select2-selection--single:focus, .ng-submitted .form-select[required=required].ng-empty + .select2-container--bootstrap-5 .select2-selection--multiple:focus,
    .ng-submitted .multiselect-native-select [required=required].ng-empty + div button.multiselect.dropdown-toggle:focus, .ng-submitted .multiselect-native-select form-select.ng-invalid + div button.multiselect.dropdown-toggle:focus,
    .ng-submitted .bootstrap-select > select.selectpicker[required=required].ng-empty + .dropdown-toggle.btn-light:focus, .ng-submitted [required="required"].form-control.ng-empty:focus,
    .ng-submitted tags-input[required="required"].ng-empty.ng-invalid-required:focus {
        box-shadow: 0 .125rem .25rem 0 rgb(255 111 105 / 40%);
    }


.ng-submitted [required="required"].form-control.tags-input-validation {
    border: 1px solid #ced4da !important;
}
/* No Need of Shadow Now */
/*.ng-submitted .form-select[required=required].ng-empty + .select2-container--bootstrap-5 .select2-selection,
    .ng-submitted .multiselect-native-select [required=required].ng-empty + div button.multiselect.dropdown-toggle.show,
    .ng-submitted .bootstrap-select > select.selectpicker[required=required].ng-empty + .dropdown-toggle.btn-light,
    .ng-submitted [required="required"].form-control.ng-empty,.ng-submitted tags-input[required="required"].ng-empty.ng-invalid-required {
        -webkit-box-shadow: 0 0 0 0.25rem rgba(255, 0, 0,0.25) !important;
        box-shadow: 0 0 0 0.25rem rgba(255, 0, 0, 0.25) !important;
    }*/
/* /No Need of Shadow Now */

.ng-submitted [required="required"].form-control.ng-not-empty + .select2-container--bootstrap-5 .select2-selection--single, .ng-submitted [required="required"].form-select.ng-not-empty + .select2-container--bootstrap-5 .select2-selection--single,
.ng-submitted .bootstrap-select > select.selectpicker[required=required].ng-not-empty + .dropdown-toggle.btn-light,
.ng-submitted [required="required"].form-control.ng-not-empty, .ng-submitted tags-input[required="required"].ng-valid-required {
    border-color: #ced4da !important;
}

input.ng-invalid-invalid {
    border-color: #ced4da !important;
}

.ng-submitted input.ng-invalid {
    border: 1px solid #dc3545;
}

.ng-touched.ng-invalid-required {
    border: 1px solid #dc3545 !important;
}

.ng-touched.ng-empty.ng-invalid-required:focus, .ng-touched.ng-empty.ng-invalid-required, .ng-touched.ng-empty.ng-invalid-pattern:focus, .ng-touched.ng-invalid-pattern:focus {
    border: 1px solid #dc3545 !important;
}

.form-select[required=required].ng-dirty.ng-empty + .select2-container--bootstrap-5 .select2-selection--single {
    border: 1px solid #dc3545 !important;
}

.custom-file input:required > .custom-file-label {
    border: 1px solid #dc3545;
}

/* Show red border when stuff has been typed in, but its invalid */
.ng-submitted .form-control.ng-dirty.ng-invalid {
    border: 1px solid #dc3545 !important;
}

input.datepicker + label.error, input.datepicker + div.bootstrap-datetimepicker-widget + label.error {
    display: none !important;
}

.single-select button.multiselect-option .form-check-input[type=radio] {
    display: none;
}

.single-select .multiselect-container .multiselect-option .form-check {
    padding-left: 0 !important;
}

.single-select .multiselect-container .multiselect-option.active:not(.multiselect-active-item-fallback), .single-select .multiselect-container .multiselect-group.active:not(.multiselect-active-item-fallback),
.single-select .multiselect-container .multiselect-all.active:not(.multiselect-active-item-fallback), .single-select .multiselect-container .multiselect-option:not(.multiselect-active-item-fallback):active,
.single-select .multiselect-container .multiselect-group:not(.multiselect-active-item-fallback):active, .single-select .multiselect-container .multiselect-all:not(.multiselect-active-item-fallback):active {
    background-color: #6d9dfe !important;
    color: white;
}
/* If Multiselect dropdown come outside the canvas then put this class(multiselect-canvas) in your div. */
.multiselect-canvas .dropdown-menu[data-popper-placement=bottom-end] {
    transform: translate(0px,43px) !important;
}

.multiselect-canvas .dropdown-menu[data-popper-placement=top-start], .multiselect-canvas .dropdown-menu[data-popper-placement=bottom-start] {
    transform: translate(0px,43px) !important;
}
/* /If Multiselect dropdown come outside canvas then put this class in your div. */

button.select2-selection__choice__remove {
    margin-left: .35rem !important;
}

/*Select picker starts*/
.dropdown.bootstrap-select.show-tick .dropdown.bootstrap-select.show-tick .btn.dropdown-toggle {
    display: inline-flex;
}

.dropdown.bootstrap-select.show-tick .btn.dropdown-toggle {
    display: none;
}

.dropdown.bootstrap-select.dropup .dropdown-toggle::after {
    border-top: 0.3em solid !important;
    border-right: 0.3em solid transparent !important;
    border-bottom: 0;
    border-left: 0.3em solid transparent !important;
}
/*Select picker ends*/

.loader-circle-animation-kondesk {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 900;
    background: #efedf8;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.ui-menu-item .ui-menu-item-wrapper {
    display: block;
    width: 100%;
    padding: 0.5rem 0.5rem;
    clear: both;
    border: 0px;
    font-weight: 400 !important;
    color: #212529;
    text-align: inherit;
    text-decoration: none;
    white-space: normal;
    border-bottom: 1px solid #f4f0fc;
    margin: 0px;
}

.ui-widget.ui-widget-content.ui-autocomplete {
    max-height: 50vh;
    overflow: auto;
}

.ui-menu-item .ui-menu-item-wrapper.ui-state-active, .ui-widget-content .ui-state-active {
    color: #212529;
    background-color: rgba(var(--rx-primary-rgb),calc(var(--rx-bg-light-opacity) + .02));
}

/* Rating */
.active.button.star-button.text-muted {
    color: rgba(var(--rx-primary-rgb),var(--rx-text-opacity)) !important;
}

.nav-pills-round-check .nav-item:last-child .nav-link::after {
    display: none;
}

/* Calender CSS*/

.fc-event-main .fc-daygrid-event-dot, .fc-list-event-title .fc-daygrid-event-dot {
    display: none !important;
}

.popper,
.Calender-tooltip {
    position: absolute;
    z-index: 9999;
    background: #FFC107;
    color: black;
    width: 150px;
    border-radius: 3px;
    box-shadow: 0 0 2px rgba(0,0,0,0.5);
    padding: 10px;
    text-align: center;
    opacity: 1;
}

.Kondesk-tooltip {
    padding: 0 !important;
}

    .Kondesk-tooltip .tooltip-inner {
        text-align: left;
        word-break: break-all;
    }

.style5 .Kondesk-tooltip {
    background: #1E252B;
    color: #FFFFFF;
    max-width: 200px;
    width: auto;
    font-size: .8rem;
    padding: .5em 1em;
}

.popper .popper__arrow,
.Calender-tooltip .tooltip-arrow {
    width: 0;
    height: 0;
    border-style: solid;
    position: absolute;
    margin: 5px;
}

.Calender-tooltip .tooltip-arrow,
.popper .popper__arrow {
    border-color: #FFC107;
}

.style5 .Calender-tooltip .tooltip-arrow {
    border-color: #1E252B;
}

.bg-color-pink {
    background: rgba(232,62,140,0.3) !important;
}

.badge-danger {
    background: rgba(var(--rx-danger-rgb),var(--rx-bg-opacity)) !important;
}

.popper[x-placement^="top"],
.Calender-tooltip[x-placement^="top"] {
    margin-bottom: 5px;
}

    .popper[x-placement^="top"] .popper__arrow,
    .Calender-tooltip[x-placement^="top"] .tooltip-arrow {
        border-width: 5px 5px 0 5px;
        border-left-color: transparent;
        border-right-color: transparent;
        border-bottom-color: transparent;
        bottom: -5px;
        left: calc(50% - 5px);
        margin-top: 0;
        margin-bottom: 0;
    }

.popper[x-placement^="bottom"],
.Calender-tooltip[x-placement^="bottom"] {
    margin-top: 5px;
}

    .Calender-tooltip[x-placement^="bottom"] .tooltip-arrow,
    .popper[x-placement^="bottom"] .popper__arrow {
        border-width: 0 5px 5px 5px;
        border-left-color: transparent;
        border-right-color: transparent;
        border-top-color: transparent;
        top: -5px;
        left: calc(50% - 5px);
        margin-top: 0;
        margin-bottom: 0;
    }

.Calender-tooltip[x-placement^="right"],
.popper[x-placement^="right"] {
    margin-left: 5px;
}

    .popper[x-placement^="right"] .popper__arrow,
    .Calender-tooltip[x-placement^="right"] .tooltip-arrow {
        border-width: 5px 5px 5px 0;
        border-left-color: transparent;
        border-top-color: transparent;
        border-bottom-color: transparent;
        left: -5px;
        top: calc(50% - 5px);
        margin-left: 0;
        margin-right: 0;
    }

.popper[x-placement^="left"],
.Calender-tooltip[x-placement^="left"] {
    margin-right: 5px;
}

    .popper[x-placement^="left"] .popper__arrow,
    .Calender-tooltip[x-placement^="left"] .tooltip-arrow {
        border-width: 5px 0 5px 5px;
        border-top-color: transparent;
        border-right-color: transparent;
        border-bottom-color: transparent;
        right: -5px;
        top: calc(50% - 5px);
        margin-left: 0;
        margin-right: 0;
    }

.rounded-top-start-3 {
    border-top-left-radius: 0.8rem !important;
}

.rounded-top-end-3 {
    border-top-right-radius: 0.8rem !important;
}

.border-collpase-inherit {
    border-collapse: inherit;
}

    .border-collpase-inherit thead th:first-child {
        border-top-left-radius: 0.8rem !important;
    }

    .border-collpase-inherit thead th:last-child {
        border-top-right-radius: 0.8rem !important;
    }

.table-layout-fixed {
    table-layout: fixed;
}

.form-floating-outlined.select2-floating .select2-container--bootstrap-5 .select2-selection {
    height: auto !important;
}

.select2-container--bootstrap-5 .select2-dropdown .select2-results__options .select2-results__option.select2-results__option--selected {
    color: #060606 !important;
    font-weight: 700 !important;
}


ul#select2-ddlcompanybrachmulti-results li.select2-results__option {
    white-space: nowrap;
    -webkit-line-clamp: 1;
    overflow: hidden;
    text-overflow: ellipsis;
}

ul#select2-ddlcompanybrachmulti-results li.select2-results__option--selectable {
    padding-left: 25px;
}
/* Offcanvas backdrop opacity */
.offcanvas-wrap .offcanvas .offcanvas-backdrop-static {
    opacity: 0.75;
}

.single-select button.multiselect-option .form-check-input[type=radio] {
    display: none;
}

.single-select .multiselect-container .multiselect-option .form-check {
    padding-left: 0 !important;
}


.confirmEmailModal {
    z-index: 9999 !important;
}

.confirmEmailModalBackdrop {
    z-index: 9998 !important;
}

.select2-container--bootstrap-5.select2-container--disabled .select2-selection, .select2-container--bootstrap-5.select2-container--disabled.select2-container--focus .select2-selection {
    background-color: #f7f4fd !important;
    opacity: 1 !important;
}

.autocomplete-loader {
    background: url(../../images/autocomplete-loader.svg);
    background-repeat: no-repeat;
    background-position: right;
}

div[uib-modal-backdrop].modal-backdrop.fade.in {
    opacity: 0.5;
}

.external-layout .main-content .modal.modal-full.modal-right .modal-dialog {
    margin: 0px !important;
    padding: 0px !important;
    max-width: 100% !important;
    top: 0px !important;
    width: 100% !important;
}

.table-responsive .table {
    max-width: none;
    -webkit-overflow-scrolling: touch !important;
}

.table-responsive {
    overflow-x: scroll;
}
/* If Textarea does not have the Form-Control class */
/*.form-floating.form-floating-outlined textarea:not(.form-control) {
    padding: 0.8rem 0.75rem;
    background: #ffffff;
    display: block;
    outline: 0px;
    width: 100%;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid #ced4da;
    -webkit-appearance: none;
    -moz-appearance: none;
    border-radius: 0.5rem;
}
.form-floating.form-floating-outlined textarea:not(.form-control):focus {
    border-color: #baa1ed;
    outline: 0;
    -webkit-box-shadow: 0 0 0 0.25rem rgba(116, 67, 218, 0.25);
    box-shadow: 0 0 0 0.25rem rgba(116, 67, 218, 0.25);
}
.form-floating.form-floating-outlined textarea:not(.form-control) ~ label {
    -webkit-transform: scale(.85) translateY(-50%) translateX(0.15rem);
    transform: scale(.85) translateY(-50%) translateX(0.15rem);
    opacity: 1;
    height: auto;
    line-height: 1;
    padding: 2px 0.375rem;
    margin-left: 0.375rem;
    background-color: var(--rx-form-floating-outlined-label-bg);
}*/
/* /If Textarea does not have the Form-Control class */

/* For Safari Browser */
@media screen and (-webkit-min-device-pixel-ratio:0) {
    .table-responsive {
        overflow-x: scroll;
    }
}
/* /For Safari Browser */

/*.layout-full-viewport-height .modal.layout-main-content .offcanvas.layout-main-content {
    margin-top: 0px;
    height: calc(100% - var(--rx-layout-top-span) ) !important;
}*/
.form-floating-bootstrap-multiselect.transform-0 .multiselect-container.dropdown-menu {
    transform: translateX(0px) !important;
}

.modal.modal-full.modal-right .modal-body .modal.fade .modal-dialog {
    top: 0;
}

.dropdown-menu.d-w-800 {
    margin-left: -200px !important;
}

.max-w-f-33 {
    max-width: 33% !important;
}

.max-w-f-250 {
    max-width: 250px !important;
}

.max-w-f-200 {
    max-width: 200px !important;
}

.max-w-f-150 {
    max-width: 150px !important;
}

.max-w-f-100 {
    max-width: 100px !important;
}

.max-w-f-50 {
    max-width: 50px;
}

.max-w-f-150 {
    max-width: 150px;
}
/*tr:last-child td {
    border-style: none;
}*/
.note-editor.note-frame .note-editing-area .note-editable[contenteditable="false"], .note-editor.note-airframe .note-editing-area .note-editable[contenteditable=false] {
    background-color: #ffffff !important;
    border: 1px solid #dddddd;
    border-radius: 0.5rem;
}

#DeviceCompatibleMsg {
    display: none;
}

@media screen and (min-width: 320px) and (max-width: 1180px) {
    #DeviceCompatibleMsg {
        display: block;
    }
}


/* When `layout-menu-collapsed` is present, hide main logo */
.layout-menu-collapsed .app-brand-logo-main {
    display: block;
}

.layout-menu-collapsed .app-brand-logo-sub {
    display: none;
}

/* When `layout-menu-collapsed` and `layout-menu-hover` are both present, show sub logo */
.layout-menu-collapsed.layout-menu-hover .app-brand-logo-sub {
    display: block;
}

.layout-menu-collapsed.layout-menu-hover .app-brand-logo-main {
    display: none;
}

.layout-navbar-fixed:not(.layout-menu-collapsed) .app-brand-logo-main {
    display: none;
}

.layout-navbar-fixed:not(.layout-menu-collapsed) .app-brand-logo-sub {
    display: block;
}


.select2-container--open {
    z-index: 9999 !important;
}
