﻿
.btn-primary {
    --bs-btn-bg: rgb(15, 172, 222);
    --bs-btn-border-color: rgb(15, 172, 222);
    --bs-btn-hover-border-color: rgb(4, 149, 196);
    --bs-btn-hover-bg: rgb(4, 149, 196);
    --bs-btn-active-bg: rgb(15, 172, 222);
    --bs-btn-disabled-bg: rgb(15, 172, 222);
}


.btn-outline-primary {
    --bs-btn-bg: #fff;
    --bs-btn-color: rgb(15, 172, 222);
    --bs-btn-border-color: rgb(15, 172, 222);
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: rgb(15, 172, 222);
    --bs-btn-hover-border-color: rgb(15, 172, 222);
    --bs-btn-focus-shadow-rgb: 13,110,253;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: rgb(15, 172, 222);
    --bs-btn-active-border-color: rgb(15, 172, 222);
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: rgb(15, 172, 222);
    --bs-btn-disabled-bg: transparent;
    --bs-btn-disabled-border-color: rgb(15, 172, 222);
    --bs-gradient: none;
}

.pagination .page-link {
    --bs-pagination-active-bg: rgb(15, 172, 222);
    --bs-pagination-active-border-color: rgb(15, 172, 222);
    --bs-pagination-color: rgb(15, 172, 222);
    --bs-pagination-hover-color: rgb(15, 172, 222);
}



html {
    font-size: 14px;
}

@media (min-width: 768px) {
    html {
        font-size: 16px;
    }
}

.btn:focus, .btn:active:focus, .btn-link.nav-link:focus, .form-control:focus, .form-check-input:focus {
    box-shadow: 0 0 0 0.1rem white, 0 0 0 0.25rem #258cfb;
}

html {
    position: relative;
    min-height: 100%;
}

body {
    margin-bottom: 60px;
}

    body a {
        color: #0facde;
        text-decoration: none !important;
        cursor: pointer;
    }


.form-floating > .form-control-plaintext::placeholder, .form-floating > .form-control::placeholder {
    color: var(--bs-secondary-color);
    text-align: end;
}

.form-floating > .form-control-plaintext:focus::placeholder, .form-floating > .form-control:focus::placeholder {
    text-align: start;
}

.loginControl {
    background-color: #ffffff;
    margin: 0 auto;
    width: 390px;
    box-shadow: 0 0 4px rgba(0,0,0,0.2);
}

.float-left {
    float: left !important;
}

.float-right {
    float: right !important;
}

/* CUSTOM */


/* fix to bootstrap item group */
.input-group-bt {
    /*max-width:135px;*/
    max-width: 130px;
}

.input-group-100 {
    /*max-width:135px;*/
    max-width: 100px;
}

.input-group-200 {
    /*max-width:135px;*/
    max-width: 200px;
}

.input-group-300 {
    /*max-width:135px;*/
    max-width: 300px;
}

.input-group-400 {
    /*max-width:135px;*/
    max-width: 400px;
}

.input-group-text-70 {
    max-width: 70px;
    padding: 3px
}
/* label align left */
.form-horizontal .control-label.text-left-bt {
    text-align: left;
}

/*input:not([type="button"]):not([type="submit"]) {
    border: none !important;
    border-bottom: 1px solid #e7e5e5 !important;
    box-shadow: none !important;
    border-radius: 0px !important;
    background-color: transparent !important;
    background: transparent !important;
}*/


#global-loader {
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    background-color: rgba(255, 255, 255, 0.7);
    z-index: 9999;
    display: flex;
    align-items: center;
    justify-content: center;
}

.notification {
    padding: 15px 20px;
    border-radius: 6px;
    margin-top: 10px;
    color: #fff;
    font-family: sans-serif;
    box-shadow: 0 2px 8px rgba(0,0,0,0.2);
    animation: fadeIn 0.3s ease;
}

    .notification.success {
        background-color: #28a745;
    }

    .notification.error {
        background-color: #dc3545;
    }

    .notification.info {
        background-color: #17a2b8;
    }

    .notification.warning {
        background-color: #ffc107;
        color: #000;
    }

@keyframes fadeIn {
    from {
        opacity: 0;
        transform: translateY(20px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}


.crm-table-framed {
}

    .crm-table-framed > table {
        width: 100%;
        margin-bottom: 0;
        background-color: #ffffff;
        color: #7f8589;
    }

        .crm-table-framed > table > thead {
            background: linear-gradient(to bottom,rgba(236,236,236,1) 0%,rgba(255,255,255,1) 100%);
            color: rgb(113, 112, 112);
            font-weight: bold;
        }

            .crm-table-framed > table > thead > tr > th {
                padding: 13px 10px;
                text-align: left;
                font-size: 16px;
                font-weight: bold;
            }

.crm-table-framed-centered > table > thead > tr > th {
    text-align: center !important;
}

.crm-table-framed-centered > table > tbody > tr > td {
    text-align: center !important;
}

.crm-table-header-centered > table > thead > tr > th {
    text-align: center !important;
}


.crm-table-framed-cellframed > table > thead > tr > th {
    border: 1px solid #ebebeb;
}

.crm-table-framed-cellframed > table > tbody > tr > td {
    border: 1px solid #ebebeb;
}



.crm-table-framed > table > thead > tr > th a {
    text-decoration: none;
    color: rgb(113, 112, 112);
    white-space: nowrap;
    font-weight: bold;
}

    .crm-table-framed > table > thead > tr > th a:after {
        cursor: pointer;
        content: "▴▾";
        width: 19px;
        word-break: break-all;
        white-space: normal;
        line-height: 8px;
        display: inline-block;
        vertical-align: middle;
        text-align: left;
    }

.crm-table-framed > table > thead > tr > th input,
.crm-table-framed > table > thead > tr > th label {
    margin: 0;
}

.crm-table-framed > table > thead > tr > th label {
    margin-left: 5px;
    font-weight: bold;
}

.crm-table-framed > table > tbody > tr:nth-child(even) {
    background-color: #f2f7f9;
}

.crm-table-framed > table > tbody > tr {
    border: solid 1px #ebebeb;
}

    .crm-table-framed > table > tbody > tr > td {
        border-color: #ebebeb;
        padding: 10px;
        font-size: 13px;
        vertical-align: middle;
    }

        .crm-table-framed > table > tbody > tr > td label {
            margin-bottom: 0;
        }

.crm-table-framed a.bi {
    cursor: pointer;
    text-decoration: none;
}


.crm-table-framed table input[type="checkbox"], .crm-table-framed table input[type="radio"] {
    margin-bottom: 0;
}

input[readonly], input[readonly]:focus {
    background-color: var(--bs-tertiary-bg);
    opacity: 1;
    cursor: not-allowed;
    box-shadow: none;
    outline: none;
    border: var(--bs-border-width) solid var(--bs-border-color);
}


.table-elem-selected td {
    /*background:rgba(147,159,243,1) !important;*/
    background-color: rgb(128, 128, 128) !important;
    color: white !important;
}

    .table-elem-selected td > a {
        color: white;
    }

.serviceAreaEdit .tab-content .tab-pane .tab-pane-lightBlue,
.serviceAreaEdit .tab-content .tab-pane .tab-pane-lightGrey {
    padding: 20px;
}

.serviceAreaEdit .tab-content .tab-pane .tab-pane-lightBlue {
    background-color: #f1FFFF;
}

.serviceAreaEdit .tab-content .tab-pane .tab-pane-lightGrey {
    background-color: #f7f7f7;
}

.tab-content .tab-pane {
    border: solid 1px #dddddd;
}

.nav-tabs {
    border-bottom: none;
}

    .nav-tabs .nav-link.active {
        background-color: rgb(248, 249, 250);
    }

    .nav-tabs .nav-link {
        color: black;
    }



.offerManagement {
    width: 1312px;
    margin: 30px auto 0;
}

    .offerManagement h1 {
        margin-top: 0;
    }

    .offerManagement .createOfferSection {
        margin-bottom: 20px;
        float: left;
        width: 100%;
    }

        .offerManagement .createOfferSection > div:first-child {
            text-align: right;
            padding-top: 20px;
            padding-right: 20px;
            /* font-weight: 400; */
            color: #cccccc;
            font-size: 30px;
        }

        .offerManagement .createOfferSection > div:last-child {
            border-left: solid 1px #dddddd;
            padding: 5px 0 5px 20px;
        }

    .offerManagement.form-horizontal .control-label {
        display: inline-block;
        width: auto;
        margin-right: 10px;
        padding-top: 0;
        text-align: left;
        font-size: 16px;
        font-family: 'Roboto-bold';
    }

    .offerManagement.form-horizontal #SpecificVehicle .control-label {
        width: 100%;
    }

    .offerManagement .bi-question-circle-fill {
        color: rgba(15, 172, 222, 0.5);
        margin-left: 5px;
    }

    .offerManagement .searchInput {
        float: left;
        background-color: #ffffff;
        border: 1px solid #e7e5e5;
    }

        .offerManagement .searchInput input {
            width: 214px;
            border: none !important;
            float: left;
        }

        .offerManagement .searchInput a {
            float: left;
            margin-top: 5px;
            margin-right: 5px;
            text-decoration: none;
        }

    .offerManagement .searchRow {
        float: left;
        width: 100%;
        margin-bottom: 15px;
        padding: 5px;
    }

        .offerManagement .searchRow > a {
            float: left;
            color: white;
            background-color: #10acde;
            width: 35px;
            font-size: 20px;
            height: 36px;
            text-align: center;
            margin-top: -1px;
            line-height: 33px;
            text-decoration: none;
        }

    .offerManagement > .sidebar {
        width: 290px !important;
        float: left;
    }

    .offerManagement > .offersList {
        border-radius: 5px;
        border: solid 1px #dddddd;
        padding: 20px;
        background-color: #ffffff;
        width: 1000px !important;
        float: right;
    }



.offersList .actionButtons > span a {
    text-decoration: none;
}

.offersList .actionButtons > span.btn-link:hover,
.offersList .actionButtons > span.btn-link a:hover,
.offersList .actionButtons > span.btn-link:hover a {
    color: #0f284c;
    text-decoration: none;
}

.offersList .offersFilterList label {
    color: #0facde;
    border: #0facde 2px solid;
    border-radius: 5px;
    min-width: 100px;
    padding: 8px 18px;
    margin-right: 15px;
    text-align: center;
    cursor: pointer;
}

.offersList .offersFilterList input[type=radio] {
    display: none;
}

    .offersList .offersFilterList input[type=radio]:checked + label {
        color: #fff;
        background-color: #0facde;
        border-radius: 5px;
        border: none;
        min-width: 100px;
        padding: 10px 20px;
        height: auto;
    }

.newFolderPopup .ui-dialog-titlebar-close:hover,
.newFolderPopup .ui-dialog-titlebar-close {
    border: none;
    background-color: transparent;
}

.offersFoldersList {
    list-style: none;
    padding: 0;
    margin: 15px 0 0 0;
}

    .offersFoldersList li {
        margin-bottom: 15px;
    }

        .offersFoldersList li table tbody {
            display: none;
        }

        .offersFoldersList li table thead tr th:nth-child(3),
        .offersFoldersList li table thead tr th:nth-child(4) {
            display: none;
        }

        .offersFoldersList li table thead th span.folderName {
            color: gray;
            font-weight: bold;
        }

        .offersFoldersList li.expanded table thead th,
        .offersFoldersList li.expanded table thead {
            background-color: #aeb5b7;
            color: #fff !important;
        }

            .offersFoldersList li.expanded table thead th span.folderName {
                background-color: #aeb5b7;
                color: #fff !important;
                font-family: 'Roboto-Medium';
            }

        .offersFoldersList li .icon:before {
            content: "\F231";
            font-family: "FontAwesome";
            font-size: 16px;
            margin-left: 5px;
            color: gray !important;
        }

        .offersFoldersList li.expanded .icon:before {
            content: "\F229";
            font-family: "FontAwesome";
            color: #fff !important;
        }

        .offersFoldersList li .glyphicon.glyphicon-triangle-right {
            font-size: 20px;
        }

        .offersFoldersList li table tbody td:nth-child(3),
        .offersFoldersList li table tbody td:nth-child(5) {
            min-width: 385px;
        }

            .offersFoldersList li table tbody td:nth-child(3) a {
                color: #7f8589;
                font-size: 13px;
            }


input.activePausedCheckbox {
    display: none;
}

    input.activePausedCheckbox:checked + label:before {
        color: #3dd03f;
        content: "\F4F4";
    }

    input.activePausedCheckbox + label:before {
        color: #ff9800;
        font-size: 18px;
        margin-top: 1px;
        content: "\F4C3";
    }

.expandOptions {
    margin-top: 20px;
}

    .expandOptions span {
        cursor: pointer;
    }

.tutorialContent ol {
    counter-reset: li;
    margin-left: 0;
    padding-left: 0;
}


.sidebarSection {
    float: left;
    width: 100%;
    border: solid 1px #BBB;
    border-top: none;
}

    .sidebarSection a:hover {
        text-decoration: none;
    }

    .sidebarSection .sidebarSectionHeading {
        background-color: #233251;
        padding: 5px 5px 5px 15px;
        font-weight: bold;
        color: #fff;
    }

        .sidebarSection .sidebarSectionHeading a {
            float: right;
            font-size: 12px;
            margin-left: 10px;
            margin-top: 3px;
            color: #10acde;
        }

            .sidebarSection .sidebarSectionHeading a:last-child {
                color: #fff;
            }

    .sidebarSection .sidebarSectionContent {
        padding: 5px;
        font-size: 12px;
    }

        .sidebarSection .sidebarSectionContent table {
            width: 100%;
        }

            .sidebarSection .sidebarSectionContent table td.name {
                padding-right: 5px;
                width: 100%;
                font-weight: bold;
                color: #333;
                max-width: 180px;
                white-space: nowrap;
                overflow: hidden;
                text-overflow: ellipsis;
            }

        .sidebarSection .sidebarSectionContent .tree li li table td.name {
            max-width: 140px;
        }

        .sidebarSection .sidebarSectionContent .folderName {
            padding-right: 5px;
            vertical-align: middle;
            font-family: 'Roboto-Medium';
            color: #233251;
            font-weight: bold;
            max-width: 170px;
            white-space: nowrap;
            overflow: hidden;
            text-overflow: ellipsis;
            display: inline-block !important;
            font-size: 12px;
        }

        .sidebarSection .sidebarSectionContent table td {
            font-size: 12px;
            color: #333;
        }

            .sidebarSection .sidebarSectionContent table td .icoEdit {
                font-size: 14px;
                padding-right: 5px;
                color: #BBB;
                display: inline !important;
            }

                .sidebarSection .sidebarSectionContent table td .icoEdit:hover {
                    color: #0f284c;
                }

            .sidebarSection .sidebarSectionContent table td:last-child {
                white-space: nowrap;
            }

            .sidebarSection .sidebarSectionContent table td .circle {
                display: inline-block;
                width: 10px;
                height: 10px;
                border-radius: 50%;
                border: solid 1px #BBB;
            }

                .sidebarSection .sidebarSectionContent table td .circle.positive {
                    background-color: #3dd03f;
                }

                .sidebarSection .sidebarSectionContent table td .circle.negative {
                    background-color: #ff9800;
                }

                .sidebarSection .sidebarSectionContent table td .circle.neutral {
                    background-color: darkorange;
                }

        .sidebarSection .sidebarSectionContent.tutorialsSection ul {
            list-style: none;
        }

            .sidebarSection .sidebarSectionContent.tutorialsSection ul li a {
                color: #333;
                font-size: 14px;
            }

        .sidebarSection .sidebarSectionContent.tutorialsSection h4 {
            color: #233251;
            font-weight: bold;
            font-size: 16px;
            margin-left: 25px;
        }

.tree, .tree ul {
    margin: 0;
    padding: 0;
    list-style: none;
}

    .tree ul {
        margin-left: 7px;
        position: relative;
    }

        .tree ul ul {
            margin-left: .5em;
        }

        .tree ul:before {
            content: "";
            display: block;
            width: 0;
            position: absolute;
            top: 0;
            bottom: 0;
            left: 0;
            border-left: 1px solid;
            border-color: grey;
        }

    .tree > li {
        border-bottom: solid 1px #ebebeb;
    }

        .tree > li:last-child {
            border-bottom: none;
        }

    .tree li {
        margin: 0;
        padding: 0;
        line-height: 26px;
        color: #369;
        font-weight: 700;
        position: relative;
    }

        .tree li .icoEdit {
            font-size: 12px;
            float: right;
            color: #BBB;
            /*margin: 6px 3px 0;*/
        }

            .tree li .icoEdit:hover {
                color: #0f284c;
            }

        .tree li .glyphicon-plus-sign {
            color: #233251;
        }

        .tree li li {
            padding: 0 0 0 12px;
        }

    .tree ul li:before {
        content: "";
        display: block;
        width: 10px;
        height: 0;
        border-top: 1px solid;
        margin-top: -1px;
        position: absolute;
        top: 13px;
        left: 0;
        border-color: grey;
    }

    .tree ul li:last-child:before {
        background: #fff;
        height: auto;
        top: 13px;
        bottom: 0;
    }

.indicator {
    margin-right: 5px;
}

.tree li a {
    text-decoration: none;
    color: #233251;
    font-weight: bold;
    font-size: 12px;
}

.tree li button, .tree li button:active, .tree li button:focus {
    text-decoration: none;
    color: #369;
    border: none;
    background: transparent;
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
    outline: 0;
}

.sidebarSection .sectionGroup {
    max-height: 300px;
    overflow: hidden;
    overflow-y: auto;
    padding-right: 5px;
}

#VehClassesSearchPanel,
#ServiceAreasPanel {
    margin-top: 10px;
    padding: 3px 10px 10px 10px;
    background-color: rgba(15, 172, 222, 0.1);
    border: solid 1px rgba(15, 172, 222, 0.2);
}

#VehClassesPanelOuter {
    margin-top: 10px;
    padding: 3px 10px 10px 10px;
    background-color: rgba(15, 172, 222, 0.1);
    border: solid 1px rgba(15, 172, 222, 0.2);
}

#VehClassesSearchPanel > div > div.checkbox,
#ServiceAreasPanel > div > div.checkbox,
#VehClassesPanel > div > div.checkbox {
    display: inline-block;
    width: 33%;
}

.vehiclesPreset {
    display: inline-block;
    width: 100%;
    font-size: 12px;
}

.offersList .actionButtons {
    float: right;
}

    .offersList .actionButtons > span {
        margin-left: 15px;
    }

        .offersList .actionButtons > span.btn-link .glyphicon {
            color: #0facde;
        }

.actionDropdown {
    float: left;
    margin: 10px 0 10px 13px;
    white-space: nowrap;
}

.offerManagement .actionDropdown #ActionToDo + .btn-group {
    width: auto;
}

.actionDropdown .choices {
    min-width: 110px;
}

.actionDropdown .actionSelectFolderSpan .choices {
    min-width: 210px !important;
}

.actionSelectFolderSpan {
    display: none;
}


.actionDropdown #ActionToDo + .btn-group ul li label {
    text-align: left;
    vertical-align: middle;
}

.actionDropdown #ActionToDo .choices__item {
    padding: 5px 0;
}

.actionDropdown #ActionToDo .choices__item {
    font-size: 12px;
    min-height: initial;
}

.actionDropdown .choices__item::before {
    display: inline-block;
    font-family: bootstrap-icons !important;
    font-style: normal;
    font-weight: normal !important;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
    vertical-align: -.125em;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    margin-right: 5px;
}





#choices--ActionToDo-item-choice-2 {
    padding-top: 5px;
    padding-bottom: 5px;
}

#choices--ActionToDo-item-choice-6 {
    padding-top: 8px;
}

#choices--ActionToDo-item-choice-7 {
    padding-bottom: 5px;
}


#choices--ActionToDo-item-choice-3 {
    padding-top: 5px;
}


#choices--ActionToDo-item-choice-3,
#choices--ActionToDo-item-choice-4 {
    border-bottom: solid 1px #cacaca;
    padding-bottom: 5px
}

#choices--ActionToDo-item-choice-4 {
    padding-top: 5px;
}

#choices--ActionToDo-item-choice-2:before {
    content: "\f4F4";
    color: #3dd03f;
}

#choices--ActionToDo-item-choice-3:before {
    content: "\f4C3";
    color: #ff9800;
}

#choices--ActionToDo-item-choice-4::before {
    content: "\f622";
    color: red;
}

#choices--ActionToDo-item-choice-5::before {
    content: "\F127";
    color: #428bca;
}

#choices--ActionToDo-item-choice-6:before {
    color: #428bca;
    content: "\F4CA";
}

#choices--ActionToDo-item-choice-7:before {
    color: #428bca;
    content: "\F1B9";
}

.btn-primary .glyphicon {
    color: #fff;
}

.btn-primary a {
    color: #fff;
}

    .btn-primary a:hover {
        text-decoration: none;
        color: #fff;
    }

.offersList .actionButtons > span a {
    text-decoration: none;
}

.offersList .actionButtons > span.btn-link:hover,
.offersList .actionButtons > span.btn-link a:hover,
.offersList .actionButtons > span.btn-link:hover a {
    color: #0f284c;
    text-decoration: none;
}

.offersList .offersFilterList label {
    color: #0facde;
    border: #0facde 2px solid;
    border-radius: 5px;
    min-width: 100px;
    padding: 8px 18px;
    margin-right: 15px;
    text-align: center;
    cursor: pointer;
}

.offersList .offersFilterList input[type=radio] {
    display: none;
}

    .offersList .offersFilterList input[type=radio]:checked + label {
        color: #fff;
        background-color: #0facde;
        border-radius: 5px;
        border: none;
        min-width: 100px;
        padding: 10px 20px;
        height: auto;
    }

.newFolderPopup .ui-dialog-titlebar-close:hover,
.newFolderPopup .ui-dialog-titlebar-close {
    border: none;
    background-color: transparent;
}

.offersFoldersList {
    list-style: none;
    padding: 0;
    margin: 15px 0 0 0;
}

    .offersFoldersList li {
        margin-bottom: 15px;
    }

        .offersFoldersList li table tbody {
            display: none;
        }

        .offersFoldersList li table thead tr th:nth-child(3),
        .offersFoldersList li table thead tr th:nth-child(4) {
            display: none;
        }

        .offersFoldersList li table thead th span.folderName {
            color: gray;
            font-family: 'Roboto-Medium';
        }

        .offersFoldersList li.expanded table thead th,
        .offersFoldersList li.expanded table thead {
            background-color: #aeb5b7;
            color: #fff !important;
        }

            .offersFoldersList li.expanded table thead th span.folderName {
                background-color: #aeb5b7;
                color: #fff !important;
                font-family: 'Roboto-Medium';
            }

        .offersFoldersList li .glyphicon.glyphicon-triangle-right {
            font-size: 20px;
        }

        .offersFoldersList li table tbody td:nth-child(3),
        .offersFoldersList li table tbody td:nth-child(5) {
            min-width: 385px;
        }

            .offersFoldersList li table tbody td:nth-child(3) a {
                color: #7f8589;
                font-size: 13px;
            }

.multiselect.dropdown-toggle.btn.btn-default {
    width: 100%;
    text-align: left;
}

.btn-lightBlue {
    border-color: #0facde;
    background-color: #0facde;
    color: white !important;
}

    .btn-lightBlue:hover {
        border-color: #0facde;
        background-color: #0facde;
        color: white !important;
    }

.btn-outline-lightBlue {
    border-color: #0facde;
    color: #0facde;
}

    .btn-outline-lightBlue:hover {
        border-color: #0facde;
        color: #0facde;
    }

.modal-large {
    --bs-modal-width: 1200px;
}

.hidden {
    display: none !important;
}

.choices {
    margin-bottom: 0px !important;
}

._serviceAreasList {
    display: none;
    position: absolute;
    z-index: 1030;
    font-size: 10px;
    left: -85px;
    line-height: 1.4;
    visibility: visible;
    width: 270px;
}

    ._serviceAreasList:before {
        content: "";
        width: 0;
        height: 0;
        border-left: 5px solid transparent;
        border-right: 5px solid transparent;
        border-bottom: 5px solid #f0f2f2;
        position: absolute;
        left: 49%;
        top: -5px;
    }

.SA-tdOuterDiv:hover ._serviceAreasList {
    display: inline-block;
}

._serviceAreasList ._serviceAreasListInner {
    max-width: 260px;
    padding: 3px 8px;
    color: #333;
    text-align: left;
    text-decoration: none;
    background-color: #f0f2f2;
    border-radius: 4px;
    font-size: 12px;
}

    ._serviceAreasList ._serviceAreasListInner ul {
        padding-left: 0;
    }

        ._serviceAreasList ._serviceAreasListInner ul li {
            margin-bottom: 8px;
            list-style: none;
        }

._serviceAreaRow {
    border-bottom: solid 1px #d2cfcf;
}

    ._serviceAreaRow:last-child {
        border-bottom: none;
    }

.SA-tdOuterDiv {
    position: relative;
}

.SA-label {
    color: #7f8589;
    font-size: 13px;
}

.newFolderPopup .ui-dialog-titlebar-close:hover,
.newFolderPopup .ui-dialog-titlebar-close {
    border: none;
    background-color: transparent;
}

.link-button {
    background: none;
    border: none;
    color: #0facde;
    text-decoration: none;
    cursor: pointer;
    font: inherit;
    padding: 0;
}


.choices__list--multiple .choices__item, .choices__input:not([placeholder]) {
    display: none !important;
}

.choices__inner[data-summary]::after {
    content: attr(data-summary);
    display: block;
    max-width: 250px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    color: #555;
}



.pe-dataBatchesPage .filters {
    width: 600px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    cursor: pointer;
}

    .pe-dataBatchesPage .filters:hover {
        width: auto;
        white-space: normal
    }

.pe-bbACVDataListPage .importExportSection {
    padding: 10px;
    width: 400px;
    border: solid 1px #ccc;
    margin-bottom: 10px;
}

    .pe-bbACVDataListPage .importExportSection label {
        font-size: 16px;
        display: inline-block;
        vertical-align: middle;
        font-weight: 400;
        color: #233251;
    }

    .pe-bbACVDataListPage .importExportSection.duplicatesForDefault {
        background-color: #dceaf0;
    }

.pe-bbACVDataListPage .acvDataList-ImportExportWrapper {
    margin-right: 15px;
    width: 900px;
    text-align: right;
}

.downloadSample {
    font-size: 0;
    display: inline-block;
    vertical-align: middle;
    width: 42px;
    height: 42px;
    background: url("/images/downloadSampleIco.png") no-repeat 0 0 transparent;
    cursor: pointer;
}

.importLink {
    font-size: 0;
    display: inline-block;
    vertical-align: middle;
    width: 40px;
    height: 40px;
    background: url("https://carbrain.com/Files/Skins/7/PriceEngine/importIco.png") no-repeat 0 0 transparent;
    cursor: pointer;
}

.exportLink {
    font-size: 0;
    display: inline-block;
    vertical-align: middle;
    width: 40px;
    height: 40px;
    background: url("https://carbrain.com/Files/Skins/7/PriceEngine/exportIco.png") no-repeat 0 0 transparent;
    cursor: pointer;
}

.pe-bbACVDataListPage .acvDataList-ImportExportWrapper > div {
    display: flex;
    justify-content: right;
    gap: 0 10px;
    float: right;
    flex-wrap: wrap;
    flex-direction: row;
}

td.warning {
    background-color: #ffcdcd;
}

.peToolTip::after {
    font-family: bootstrap-icons !important;
    content: "\F504";
    color: #428bca;
}

.peToolTip {
    display: inline-block;
    position: relative;
    width: 25px;
    height: 25px;
}

    .peToolTip span::before {
        content: "";
        left: -10px;
        top: 5px;
        position: absolute;
        width: 0;
        height: 0;
        border-style: solid;
        border-width: 10px 10px 10px 0;
        border-color: transparent #f0f2f2 transparent transparent;
    }

    .peToolTip:hover span, .peToolTip:hover .peToolTipContent {
        display: inline-block
    }

    .peToolTip span, .peToolTip .peToolTipContent {
        display: none;
        padding: 15px;
        background-color: #f0f2f2;
        color: #333;
        position: absolute;
        font-size: 12px;
        top: -5px;
        width: 205px;
        left: 30px;
        text-align: left;
        border-radius: 3px;
        z-index: 99999;
    }

.pe-bbACVAdjustmentsPage {
    margin-left: 15px;
    margin-right: 15px;
}

    .pe-bbACVAdjustmentPage .filter, .pe-bbACVAdjustmentsPage .filter {
        text-align: center;
        width: 100%;
        margin-top: 0;
        margin-bottom: 15px;
        float: left;
        position: relative;
    }

        .pe-bbACVAdjustmentPage .filter .sectionLabel, .pe-bbACVAdjustmentsPage .filter .sectionLabel {
            font-size: 18px;
            color: #687880;
            background-color: #d0e1ea;
            text-align: center;
            padding: 5px 15px;
            display: inline-block;
            cursor: pointer;
            margin: auto;
        }

        .pe-bbACVAdjustmentPage .filter .innerWrapper, .pe-bbACVAdjustmentsPage .filter .innerWrapper {
            display: flex;
            align-items: center;
            gap: 0 15px;
            justify-content: center;
            padding: 10px;
            background-color: #eff3f5;
            border: solid 1px #d9dee0;
        }

        .pe-bbACVAdjustmentsPage .filter .manualInsert {
            display: flex;
            flex-wrap: wrap;
            gap: 7px 15px;
            max-width: 970px;
        }

        .pe-bbACVAdjustmentsPage .filter .UVCInsert {
            display: flex;
        }

            .pe-bbACVAdjustmentsPage .filter .UVCInsert .oneField, .pe-bbACVAdjustmentsPage .filter .manualInsert .oneField {
                margin-bottom: 0;
                width: 230px;
            }

        .pe-bbACVAdjustmentPage .filter .adjustments, .pe-bbACVAdjustmentsPage .filter .adjustments {
            background-color: #dceaf0;
            padding: 15px;
            text-align: center;
            min-width: 330px;
        }

            .pe-bbACVAdjustmentPage .filter .adjustments .fieldsWrapper, .pe-bbACVAdjustmentsPage .filter .adjustments .fieldsWrapper {
                gap: 15px;
                display: flex;
                margin-bottom: 10px;
            }



table.table-by-column {
    display: table;
}

    table.table-by-column tr {
        display: table-cell;
        vertical-align: top;
        color: black;
    }

        table.table-by-column tr:nth-child(1) {
            line-height: 33px;
            vertical-align: top;
        }

        table.table-by-column tr td {
            display: block;
        }


.pe-conditionSegments-details .crm-table-framed > table.table-by-column > tbody > tr:nth-child(2) {
    background-color: #b6d1ff !important;
}

.pe-conditionSegments-details .crm-table-framed > table.table-by-column > tbody > tr:nth-child(3) {
    background-color: #cce5c7 !important;
}

.pe-conditionSegments-details .crm-table-framed > table.table-by-column > tbody > tr:nth-child(4) {
    background-color: #ffebab !important;
}

.pe-conditionSegments-details .crm-table-framed > table.table-by-column > tbody > tr:nth-child(5) {
    background-color: #ff8f7a !important;
}

.pe-conditionSegments-details .crm-table-framed > table.table-by-column > tbody > tr:nth-child(6) {
    background-color: #ff5c5c !important;
}



.panel-heading-blue {
    color: #fff !important;
    background-color: #75c5ec !important;
}

.panel-heading {
    padding: 10px 15px;
    border-bottom: 1px solid transparent;
    border-bottom-color: transparent;
    border-top-right-radius: 3px;
    border-top-left-radius: 3px;
    font-size: 20px;
}

.pricing-engine-test .table td {
    background-color: transparent !important;
}

.blue-table tr:nth-child(2n+1) {
    background: #f3f3f3;
}

.blue-table tr:nth-child(2n) {
    background: #b3dcff;
}

.pricing-engine-test table th {
    padding: 5px;
    font-weight: normal;
    font-size: 16px;
    background: #d7e0e3;
    text-align: center;
}

pricing-engine-test table td {
    padding: 5px;
    text-align: center;
}

.panel-heading-yellow {
    color: #fff !important;
    background-color: #c09853 !important;
}

.yellow-table tr:nth-child(2n+1) {
    background: #fff9da;
}

.price-engine-offer-results div table tr th:first-child {
    font-size: 18px;
    text-align: left;
}

.price-engine-offer-results table tr th:first-child {
    padding-left: 20px;
}


.panel-heading-green {
    color: #fff !important;
    background-color: #668e55 !important;
}

.pricing-engine-test table {
    width: 100%;
}

.pricing-engine-test .main-summary-panel {
    display: inline-block;
    vertical-align: top;
    width: 66%;
    position: relative;
    min-height: 1px;
    padding-right: 15px;
    padding-left: 15px;
}

.price-engine-offer-results .headingTable {
    border-bottom: solid 1px #ebeff0;
    margin-bottom: 5px;
    background: #ececec;
    background: -moz-linear-gradient(top,#ececec 0%,#fff 100%);
    background: -webkit-linear-gradient(top,#ececec 0%,#fff 100%);
    background: linear-gradient(to bottom,#ececec 0%,#fff 100%);
}

    .price-engine-offer-results .headingTable th,
    .orangeTable th,
    .blueTable th,
    .violetTable th,
    .greenTable th {
        background-color: transparent !important;
    }

.green-summary-panel {
    width: 33.33333333333333%;
    display: inline-block;
    vertical-align: top;
    position: relative;
    min-height: 1px;
    padding-right: 15px;
    padding-left: 15px;
}

.orangeTable table thead, .orangeTable table tfoot tr:last-child {
    background-color: #e4c373;
}

.blueTable table thead, .blueTable table tfoot tr:last-child {
    background-color: #79c8ff;
}

.blueTable table tbody tr {
    background-color: #d0eafe;
}

.orangeTable table tbody tr {
    background-color: #f9e8be;
}

    .orangeTable table tbody tr:nth-child(2n) {
        background-color: #fcf1d6;
    }

.violetTable table thead, .violetTable table tfoot tr:last-child {
    background-color: #c1a8dd;
}

.violetTable table tbody tr {
    background-color: #ece3f7;
}

.greenTable table thead, .greenTable table tfoot tr:last-child {
    background-color: #a4c975;
}

.greenTable table tbody tr {
    background-color: #cae9a4;
}

    .greenTable table tbody tr:nth-child(2n) {
        background-color: #e3efd4;
    }

.pe-globalModifiers .crm-table-unframed,
.pe-collisionAdjustment .crm-table-unframed,
.pe-collisionLevels .crm-table-unframed {
    overflow: auto
}

    .pe-missingPartsAdjustment .crm-table-unframed > table > tbody > tr > td,
    .pe-collisionLevels .crm-table-unframed > table > tbody > tr > td,
    .pe-collisionAdjustment .crm-table-unframed > table > tbody > tr > td {
        padding: 5px
    }

    .pe-collisionAdjustment .crm-table-unframed > table {
        width: 30%;
        margin: 1%;
        float: left
    }


    .pe-collisionLevels .crm-table-unframed > table > thead > tr:nth-child(2) > th {
        font-weight: 300;
        color: #444;
        background-color: #fff
    }

    .pe-mileageAdjustments .crm-table-unframed > table > tbody > tr > td:first-child,
    .pe-missingPartsAdjustment .crm-table-unframed > table > tbody > tr > td:first-child,
    .pe-collisionLevels .crm-table-unframed > table > tbody > tr > td:first-child,
    .pe-collisionAdjustment .crm-table-unframed > table > tbody > tr > td:first-child {
        white-space: nowrap;
        font-weight: bold;
        text-align: center
    }

.pe-collisionAdjustment .pe-collisionAdjustment-test {
    text-align: center
}

    .pe-collisionAdjustment .pe-collisionAdjustment-test .questionsList {
        float: left;
        width: 100%;
        margin-top: 10px
    }

        .pe-collisionAdjustment .pe-collisionAdjustment-test .questionsList > div > h2 {
            margin-bottom: 5px
        }

        .pe-collisionAdjustment .pe-collisionAdjustment-test .questionsList > div:first-child {
            padding-right: 10px
        }

        .pe-collisionAdjustment .pe-collisionAdjustment-test .questionsList > div:last-child {
            padding-left: 10px
        }

        .pe-collisionAdjustment .pe-collisionAdjustment-test .questionsList .crm-table-framed:nth-child(2) table tbody td {
            color: #ca4979
        }

        .pe-collisionAdjustment .pe-collisionAdjustment-test .questionsList .crm-table-framed:last-child table tbody td {
            color: #3b8a87
        }

    .pe-collisionAdjustment .pe-collisionAdjustment-test .crm-table-framed {
        background-color: #fff;
        margin-bottom: 15px
    }

        .pe-collisionAdjustment .pe-collisionAdjustment-test .crm-table-framed thead tr th:last-child,
        .pe-collisionAdjustment .pe-collisionAdjustment-test .crm-table-framed thead tr th:nth-child(3),
        .pe-collisionAdjustment .pe-collisionAdjustment-test .crm-table-framed thead tr th:first-child {
            text-align: center
        }

        .pe-collisionAdjustment .pe-collisionAdjustment-test .crm-table-framed tbody tr td:nth-child(2) {
            text-align: left
        }

.pe-collisionAdjustment .testResult {
    background-color: #b9f3ff;
    border: solid 1px #a6dff1;
    padding: 20px;
    display: inline-block;
    margin: 0 auto;
    width: 100%
}

.pe-collisionAdjustment .resultLaebel {
    font-weight: 500;
    color: #0f284c
}

.pe-collisionAdjustment .oneField {
    display: inline-block;
    vertical-align: top;
    margin-bottom: 5px
}

.pe-collisionAdjustment-test .pe-groupPage-filter {
    margin: 0
}

.pe-collisionAdjustment-test table + .pe-groupPage-filter {
    text-align: left
}

.pe-collisionAdjustment .pe-collisionAdjustment-test .pe-offerCalculation-test {
    text-align: left
}

.oneField.collisionAreas .fieldCont .fieldContInner ul li input + label {
    width: 79px;
    padding: 120px 0 0 0;
    background-repeat: no-repeat;
    background-position: top center;
    background-color: transparent
}

.oneField.collisionAreas ul li:nth-child(1) label {
    background-image: url("/images/affectedAreaLeftFront.jpg")
}

.oneField.collisionAreas ul li:nth-child(2) label {
    background-image: url("/images/affectedAreaRightFront.jpg")
}

.oneField.collisionAreas ul li:nth-child(3) label {
    background-image: url("/images/affectedAreaLeftSide.jpg")
}

.oneField.collisionAreas ul li:nth-child(4) label {
    background-image: url("/images/affectedAreaRightSide.jpg")
}

.oneField.collisionAreas ul li:nth-child(5) label {
    background-image: url("/images/affectedAreaLeftRear.jpg")
}

.oneField.collisionAreas ul li:nth-child(6) label {
    background-image: url("/images/affectedAreaRightRear.jpg")
}

.oneField.collisionAreas ul li:nth-child(7) label {
    background-image: url("/images/affectedAreaRoof.jpg")
}

.oneField.testCheckboxLists.airbagsDeplyed {
    height: 177px
}

.oneField.testCheckboxLists.airbagsDeplyed ul {
    margin-top: 30px
}

.oneField.testCheckboxLists input[type="checkbox"] {
    display: none !important;
}

.oneField.testCheckboxLists input[type=checkbox] {
    display: none !important
}

.oneField.testCheckboxLists input[type=checkbox]:checked + label {
    border: solid 2px #7ed439;
    box-shadow: 0 0 4px #7ed439
}

.oneField.testCheckboxLists input[type=checkbox]:disabled + label {
    opacity: .3;
    cursor: default
}

.oneField.testCheckboxLists input[type=checkbox]:disabled + label:hover {
    border-color: transparent;
    box-shadow: 0 0 0 transparent
}

.oneField.testCheckboxLists input[type=checkbox]:disabled:checked + label {
    opacity: 1
}

.oneField.testCheckboxLists input[type=checkbox]:disabled:checked + label:hover {
    border: solid 2px #0facde;
    box-shadow: 0 0 4px #0facde
}


.oneField.testCheckboxLists .fieldCont {
    background-color: transparent;
    border: none;
    padding: 0
}

.oneField.testCheckboxLists ul li {
    display: inline-block;
    margin-right: 10px;
    margin-bottom: 0;
    position: relative;
    list-style: none;
    text-align: center;
}
.oneField.testCheckboxLists ul {
    float: none;
    padding: 0px;
}

    .oneField.testCheckboxLists ul li {
        display: inline-block;
        margin-right: 10px;
        margin-bottom: 0
    }

        .oneField.testCheckboxLists ul li:last-child {
            margin-right: 0
        }

.oneField.testCheckboxLists {
    background-color: #fff;
    padding: 10px 10px 20px 10px;
    border: dashed 2px #aaa;
    margin-bottom: 15px;
    margin-left: 6px;
    margin-right: 6px;
    display: inline-block
}

    .oneField.testCheckboxLists > label {
        padding-left: 5px;
        padding-bottom: 3px;
        padding-top: 3px;
        text-align: left;
        width: 100%;
        background-color: #f0f0f0
    }

    .oneField.testCheckboxLists ul li {
        position: relative
    }

        .oneField.testCheckboxLists ul li label {
            margin-left: 0;
            padding: 3px;
            cursor: pointer;
            border: solid 2px transparent
        }

            .oneField.testCheckboxLists ul li label:hover {
                border: solid 2px #0facde;
                box-shadow: 0 0 4px #0facde
            }

    .oneField.testCheckboxLists.collisionAreas ul li label:hover {
        padding-top: 120px
    }

    .oneField.testCheckboxLists input[type=checkbox] {
        display: none !important
    }

        .oneField.testCheckboxLists input[type=checkbox]:checked + label {
            border: solid 2px #7ed439;
            box-shadow: 0 0 4px #7ed439
        }

        .oneField.testCheckboxLists input[type=checkbox]:disabled + label {
            opacity: .3;
            cursor: default
        }

            .oneField.testCheckboxLists input[type=checkbox]:disabled + label:hover {
                border-color: transparent;
                box-shadow: 0 0 0 transparent
            }

        .oneField.testCheckboxLists input[type=checkbox]:disabled:checked + label {
            opacity: 1
        }

            .oneField.testCheckboxLists input[type=checkbox]:disabled:checked + label:hover {
                border: solid 2px #0facde;
                box-shadow: 0 0 4px #0facde
            }

    .oneField.testCheckboxLists .fieldCont {
        background-color: transparent;
        border: none;
        padding: 0
    }
.oneField.collisionAreas .fieldCont .fieldContInner ul li input + label {
    width: 85px;
    padding: 120px 0 0 0;
    background-repeat: no-repeat;
    background-position: top center;
    background-color: transparent
}
.oneField {
    position: relative;
    padding-bottom: 15px;
}
.oneField > label {
    position: absolute;
    bottom: 0;
    left: 0;
}
.pe-collisionAdjustment .pe-collisionAdjustment-test {
    text-align: center;
}

.crm-popup .crm-popup-body .conditionSegmentPage h2,
.conditionSegmentPage h2 {
    background-color: #f7f7f7;
    border-bottom: solid 1px #e5e4df;
    font-size: 12px;
    color: #0b2144;
    margin-top: 0;
    font-weight: bold;
    text-transform: uppercase;
    padding: 10px 20px;
    position: relative;
    cursor: pointer
}

    .crm-popup .crm-popup-body .conditionSegmentPage h2:after,
    .conditionSegmentPage h2:after {
        content: "";
        font-family: "FontAwesome";
        font-size: 18px;
        position: absolute;
        right: 10px;
        top: 10px
    }

.conditionSegmentPage {
    border: solid 1px #e8e7e3;
    border-bottom: none
}

    .conditionSegmentPage:last-child {
        border-bottom: solid 1px #e8e7e3
    }

.conditionSegmentQuestions {
    display: none
}

.conditionSegmentPage.expand .conditionSegmentQuestions {
    display: block
}

.conditionSegmentQuestions .item .questionContainer .description {
    padding-left: 20px
}

.conditionSegmentQuestions h3 {
    font-size: 20px;
    color: #0b2144
}

.conditionSegmentQuestions .oneField {
    margin-bottom: 0;
    padding-bottom: 0;
    padding: 20px
}

    .conditionSegmentQuestions .oneField .fieldCont {
        border: 1px solid #e7e5e5;
        background-color: #fff !important
    }

        .conditionSegmentQuestions .oneField .fieldCont textarea {
            -webkit-box-shadow: 0 0 0 1000px #fff inset
        }

.conditionSegmentQuestions .item .questionContainer ul {
    padding: 0;
    margin: 0;
    list-style: none;
    display: flex;
    gap: 10px;
    float: none;
    flex-wrap: wrap
}

.conditionSegmentQuestions .item .multiAnswers {
    padding-left: 15px;
    margin-top: 10px;
    padding-bottom: 10px;
}

.conditionSegmentQuestions .item .questionContainer ul li input {
    display: none
}

.conditionSegmentQuestions .questionContainer ul li {
    margin-bottom: 0
}

.conditionSegmentQuestions .item .questionContainer ul li label {
    border: solid 1px #e2e1dc;
    border-radius: 20px;
    font-size: 12px;
    font-weight: bold;
    text-transform: uppercase;
    white-space: nowrap;
    padding: 5px 15px;
    background-color: #f7f7f7;
    cursor: pointer
}

.conditionSegmentQuestions .item .questionContainer ul li input:checked + label {
    border: solid 1px #10acde;
    background-color: #fff;
    color: #0b2144;
    box-shadow: 0 3px 3px #dbdbdb
}
.price-engine-offer-results table tr td:first-child {
    padding-left: 35px;
}
.price-engine-offer-results .negative {
    font-weight: bold;
    color: #f00;
}
.price-engine-offer-results .positive {
    font-weight: bold;
    color: #6aa84f;
}
.price-engine-offer-results table tfoot tr td:first-child {
    padding-left: 20px;
}
.price-engine-offer-results .headingTable table thead tr th:nth-child(3), .price-engine-offer-results table tbody tr td:nth-child(3) {
    width: 100px;
    text-align: center;
}
.green-table tr:nth-child(2n+1) {
    background: #ebf7e6;
}
.green-table tr:nth-child(2n) {
    background: #cbefbc;
}
.greenTable table tfoot {
    background-color: #717171;
    color: #fff;
    font-size: 16px;
}

.greenTable .peToolTipContent {
    width: 400px;
}

.greenTable .peToolTipContent .grayRow {
    background-color: #eee;
    padding: 5px;
    display: inline-block;
    width: 100%;
    vertical-align: top;
    font-size: 14px;
    text-align: left;
}
.greenTable .peToolTipContent .cloudRow {
    font-size: 14px;
    display: inline-block;
    vertical-align: top;
    padding: 0 5px;
    width: 100%;
}
.greenTable .peToolTipContent .summaryRow {
    display: inline-block;
    width: 100%;
    padding-top: 15px;
    padding-left: 5px;
    padding-right: 5px;
    border-top: solid 2px #000;
    margin-top: 15px;
    font-size: 14px;
}
td.pe-groupPage-filter {
    width: 33.33%;
    margin: 0;
    float: none;
    vertical-align: top;
    text-align: center;
}
