@media screen and (min-width: 1024px) {
    .new-customer-modal .modal-dialog {
        width: 1000px;
    }
}

@media screen and (max-width:1024px) {
    .new-customer-modal.modal.in .modal-dialog {
        height: 100%;
    }

        .new-customer-modal.modal.in .modal-dialog .modal-content {
            height: 95%;
        }
}

body.customers-add-page composer {
    display: none;
}

.modal-dialog .new-customer {
    padding: 0 30px;
    direction: ltr;
    text-align: right;
    max-height: 700px;
}

.modal-dialog .new-worker-content {
    min-height: 600px;
    max-height: 600px;
    margin-top: 25px;
    margin-bottom: 10px;
}

.modal-dialog .actions {
    padding: 10px 15px;
    text-align: left;
    left: 0;
    top: 30px;
    position: absolute;
    z-index: 2;
}

    .modal-dialog .actions button {
        width: auto;
        padding: 5px 35px;
    }

.modal-dialog .new-customer ul {
    margin-bottom: 15px;
}

.new-customer .fixed-header {
    position: fixed;
    top: 0;
    right: 157px;
    width: calc(100% - 105px - 25%);
    background-color: white;
    z-index: 2;
    padding: 11px 40px 11px 25px;
    overflow: hidden;
}

body.customers-edit-id-type-page .new-customer.leftMenuOpen {
    width: calc(100% - 300px);
}

.modal-dialog .new-customer h1 {
    font-size: 20px;
}

.modal-dialog .new-customer .frame-header select {
    font-size: 20px;
}

.modal-dialog .nav-tabs > li.active > a, .modal-dialog .nav-tabs > li.active > a i {
    color: #118dcf;
}

.modal-dialog .nav-tabs > li > a {
    font-size: 13px;
    color: silver;
}

    .modal-dialog .nav-tabs > li > a i {
        color: silver;
    }

.modal-dialog .nav-tabs > li a i[class*=heshev] {
    font-size: 1.3em;
    padding-left: 5px;
}

.modal-dialog .nav-tabs.nav-justified {
    direction: rtl;
}

.new-customer {
    padding: 0px 30px 0 0;
    height: 100%;
}

    .new-customer .customer-wrapper {
        direction: ltr;
    }

    .new-customer .frame-wrapper {
        height: calc(100% - 40px);
    }

        .new-customer .frame-wrapper .nav.nav-tabs {
            margin-left: 15px;
        }

        .new-customer .frame-wrapper .tab-content {
            height: calc(100% - 45px);
        }

            .new-customer .frame-wrapper .tab-content .tab-pane {
                height: 100%;
            }

.customers-add-page .new-customer .frame-header select {
    -webkit-appearance: menulist-button;
    -moz-appearance: menulist-button;
    border: 1px solid #118dcf;
    background-color: white;
}

.new-customer .frame-header select {
    -webkit-appearance: none;
    -moz-appearance: none;
    border: none;
    font-weight: normal;
    padding-right: 5px;
    width: 250px;
    margin-right: 10px;
}

body:not(.customers-add-page) .new-customer .frame-header select::-ms-expand {
    display: none;
}

.new-customer .frame-header h1.seperator::before {
    content: '';
    margin: 0 15px;
    display: inline-block;
    width: 1px;
    background-color: #DDDDDD;
    height: 23px;
    display: inline-block;
}

.new-customer .section > div.row:first-child .ui-control {
    margin-top: 15px;
}

.modal-content .new-customer .section {
    overflow: hidden;
    padding: 10px 10px 10px 0px;
}

.new-customer .customer-wrapper {
    height: calc(100% - 45px);
}

.new-customer .section-title {
    color: #393939;
}

    .new-customer .section-title .icon {
        margin-left: 10px;
    }

.new-customer input.ng-invalid::-webkit-input-placeholder {
    color: red;
}

.new-customer input.ng-invalid::-moz-placeholder {
    color: red;
}

.new-customer input.ng-invalid:-ms-input-placeholder {
    color: red;
}

.new-customer .section-title-container {
    background-image: none;
    margin-bottom: 10px;
}

.new-customer .frame-header label {
    position: relative;
}

.modal-content .new-customer .frame-header label .caret {
    top: 13px;
}

.new-customer .frame-header label .caret {
    position: absolute;
    top: 20px;
    left: 5px;
    pointer-events: none;
}

.new-customer .section-title-container {
    width: 100%;
}

.new-customer .calc-map {
    direction: rtl;
}

    .new-customer .calc-map .step-label {
        text-align: left;
        font-size: 0.8em;
    }


.new-customer .address > div {
    padding: 0;
    padding-left: 4px;
}

    .new-customer .address > div:last-of-type {
        padding: 0;
    }


.new-customer-modal .new-customer .workers-table,
.new-customer .workers-table {
    max-height: 400px;
}

.workers-table table.scrollable-table tbody {
    display: block;
    overflow: auto;
    max-height: 350px;
}

    .workers-table table.scrollable-table thead,
    .workers-table table.scrollable-table tbody tr {
        display: table;
        width: 100%;
        table-layout: fixed; /* even columns width , fix width of table too*/
    }

.new-customer-modal .new-customer .workers-table table thead {
    width: calc( 100% - 3px);
}

.new-customer .workers-table {
    margin-bottom: 40px;
    overflow-y: auto;
    direction: rtl;
}

    .new-customer .workers-table table {
        direction: rtl;
        width: 100%;
        color: #89898C;
        zoom: 1;
    }

    .new-customer .workers-table .fa {
        margin-left: 5px;
    }

    .new-customer .workers-table tr:hover:not(.no-hover) {
        background-color: #ecfdff;
        cursor: pointer;
    }

    .new-customer .workers-table tr:not(.no-border) {
        border-bottom: 1px solid silver;
    }

    .new-customer .workers-table tr td {
        padding: 7px 5px;
    }

.new-customer div.scroll {
    height: calc(100% - 30px);
    overflow-y: auto;
    margin-left: 30px;
}

.new-customer.customers {
    direction: rtl;
    padding-right: 40px;
    padding-top: 20px;
    height: 100%;
}

.new-customer.view-mode select {
    pointer-events: none;
    outline: none;
    -webkit-appearance: none;
    border: none;
}


.new-customer.view-mode input {
    border: none;
    font-size: 1.1em;
    -webkit-appearance: none;
    outline: none;
    background-color: ghostwhite;
}

.new-customer.view-mode table tr td:last-child {
    display: none;
}

.new-customer.view-mode .ui-labelify {
    font-size: 1em;
}

.new-customer.view-mode .ui-input.hover label:hover input {
    border: none;
}

.new-customer.view-mode .buttons {
    /*display: none;*/
}

.new-customer.view-mode button {
    display: none;
}

.new-customer.view-mode .workers-table tr {
    pointer-events: none;
}

.new-customer uib-tab-heading.invalid {
    color: red;
}

.new-customer .existing-worker-content {
    clear: both;
    padding-top: 50px;
}

.new-customer form[name='existingCustomerModalForm'] .frame-header {
    margin-top: 25px;
}

.new-customer .existing-worker-content table tr:active {
    background-color: rgba(232, 232, 232, 0.8);
}

.new-customer .existing-worker-content table tr.selected {
    background-color: #ecfdff;
}

.new-customer .existing-worker-content table tr {
    cursor: pointer;
}

    .new-customer .existing-worker-content table tr:not(.selected):hover {
        background-color: rgba(232, 232, 232, 0.52);
    }

    .new-customer .existing-worker-content table tr td {
        font-size: .7em;
    }

.new-customer .existing-worker-content .avatar {
    max-width: 32px;
    float: right;
}

.new-customer form[name='existingCustomerModalForm'] .filter {
    padding-top: 20px;
    font-size: .8em;
}

.new-customer form[name='existingCustomerModalForm'] .existing-worker-content {
    padding-top: 20px;
}

.new-customer .workers .buttons,
.new-customer .partners .buttons,
.new-customer .share-holders .buttons,
.new-customer .directors .buttons,
.new-customer .managers .buttons {
    height: 50px;
}

.new-customer #workers,
.new-customer #managers,
.new-customer #directors,
.new-customer #shareholders,
.new-customer #partners,
.new-customer #linked-businesses {
    position: relative;
    margin-top: 40px;
    overflow: hidden;
    padding-top: 10px;
}

    .new-customer #directors .section-title-container,
    .new-customer #managers .section-title-container,
    .new-customer #workers .section-title-container,
    .new-customer #partners .section-title-container,
    .new-customer #shareholders .section-title-container {
        position: absolute;
    }

.new-customer-modal .tab-content {
    max-height: 540px;
    overflow-y: auto;
}

.new-customer-modal .existing-worker-content {
    height: 500px !important;
    overflow-y: auto;
}

.new-customer-modal table {
    max-height: 500px;
    overflow-y: auto;
    background-color: white;
}