form {
}

.tdviewonly {
    border: none !important;
    background-color: transparent !important;
    width: 100% !important;
}

.page-logo img {
    width: auto;
}

.timeline-header {
    text-align: left;
    font: normal normal bold 14px/19px Roboto;
    letter-spacing: 0px;
    color: #333333;
    opacity: 1;
    margin: 20px 0 20px 40px;
}

.timeline-item-text {
    text-align: center;
    font: normal normal bold 12px/16px Roboto;
    letter-spacing: 0px;
    color: #333333;
    opacity: 1;
    margin-top: 20px;
}

.timelineHeader {
    font: bold 14px/19px Roboto;
    letter-spacing: 0px;
    color: #333333;
}

.timeline {
    list-style-type: none;
    display: flex;
    align-items: center;
    width: 100%;
    margin: 20px 0 20px 40px;
    padding: 0;
    /*max-width: 1000px !important;*/
}

    .timeline .li {
        transition: all 200ms ease-in;
        min-width: 150px;
        max-width: 150px;
        height: 70px;
    }

.timestamp {
    margin-bottom: 20px;
    padding: 0px 28px;
    display: flex;
    flex-direction: column;
    align-items: center;
    font-weight: 100;
}

.timeline .status {
    display: flex;
    justify-content: center;
    border-top: 2px solid #006FC6;
    position: relative;
    transition: all 200ms ease-in;
    cursor: pointer;
}

    .timeline .status h4 {
        font-weight: 600;
    }

    .timeline .status:before {
        content: "";
        width: 20px;
        height: 20px;
        background-color: white;
        border-radius: 20px;
        border: 3px solid #006FC6;
        position: absolute;
        top: -12px;
        left: 42%;
        transition: all 200ms ease-in;
    }

.timeline .li .complete .status {
    border-top: 3px solid #006FC6;
}

    .timeline .li.complete .status:before {
        background-color: #006FC6;
        border: none;
        transition: all 200ms ease-in;
    }

.timeline .li .status h4 {
    margin-top: 20px;
}

.timeline:before {
    background-color: white;
}

.timeline .event-timeline-item .item-container {
    font-weight: normal;
    text-align: left;
}

@@media (min-device-width: 320px) and (max-device-width: 700px) {
    .timeline {
        list-style-type: none;
        display: block;
    }

        .timeline .li {
            transition: all 200ms ease-in;
            display: flex;
            width: inherit;
        }

    .timestamp {
        width: 100px;
    }

    .timeline .status:before {
        left: -8%;
        top: 30%;
        transition: all 200ms ease-in;
    }
}

.validation-summary-errors ul {
    list-style: none;
    padding-left: 0px;
}

    .validation-summary-errors ul li {
        color: brown;
    }


.profile-image {
    width: 2rem !important;
    height: 2rem !important;
    object-fit: cover;
}


.visualisationTile {
    min-height: 350px !important;
}

.pop-chart {
    padding: 24px;
    /*background: #ffffff;*/
    border-radius: 16px;
}

    .pop-chart .reportContainer {
        width: 100%;
        max-width: 2000px;
        min-width: 350px;
    }

        .pop-chart .reportContainer iframe {
            border: none;
        }

/* CUSTOM STYLES FOR REDESIGN */

.panel {
    background: #FFFFFF 0% 0% no-repeat padding-box;
    box-shadow: 0px 0px 20px #00000033;
    border-radius: 7px;
    opacity: 1;
}

    .panel .panel-hdr h2 {
        text-align: left;
        font: normal normal bold 16px/21px Roboto;
        letter-spacing: 0px;
        color: #333333;
        opacity: 1;
    }

.panel-toolbar .btn-panel[data-action="panel-collapse"], .panel-toolbar .btn-panel.js-panel-collapse {
    border: 2px solid #21C152 !important;
    background: #FFFFFF !important;
}

.panel-toolbar .btn-panel[data-action="panel-fullscreen"], .panel-toolbar .btn-panel.js-panel-fullscreen {
    border: 2px solid #FF9300 !important;
    background: #FFFFFF !important;
}

.panel-toolbar .btn-panel[data-action="toggle"], .panel-toolbar .btn-panel.js-toggle {
    border: 2px solid #006FC6 !important;
    background: #FFFFFF !important;
}

.info-card .profile-image {
    width: 3rem !important;
    height: 3rem !important;
}

.nav-menu li.active {
    background: #3333334D 0% 0% no-repeat padding-box;
    opacity: 1;
    border: none;
}

    .nav-menu li.active i {
        color: #FDD300 !important;
    }

.page-logo-text {
    color: #FDD300;
    font-size: 16px;
    font-weight: normal;
}

.login .page-content-wrapper {
    opacity: 1;
    background: transparent linear-gradient(180deg, #305CA7 0%, #234176 100%) 0% 0% no-repeat padding-box;
}

.login .login-content .subtitle {
    margin-top: 20px;
    padding-top: 20px;
    text-align: left;
    font: normal normal normal 20px/30px Roboto;
    letter-spacing: 0px;
    color: #FFFFFF;
    opacity: 1;
    border-top: 1px solid #FDD300;
}

    .login .login-content .subtitle a {
        color: #FFFFFF;
    }

.login .login-content .socials .subtitle {
    margin-top: 20px;
    padding-top: 20px;
    text-align: left;
    font-size: 16px;
    letter-spacing: 0px;
    color: #FFFFFF;
    opacity: 1;
    border: none;
}

.login .login-content .socials .icons a {
    color: #FDD300;
}

.login .btn-login {
    color: #FDD300;
    font-size: 16px;
    background: #006FC6 0% 0% no-repeat padding-box;
    border-radius: 5px;
    opacity: 1;
}

    .login .btn-login:hover {
        color: #FDD300;
        opacity: 1;
    }

.default .page-inner {
    background: transparent linear-gradient(180deg, #305CA7 0%, #234176 100%) 0% 0% no-repeat padding-box;
}

.default .page-content-wrapper {
    background: transparent !important;
}

.default .page-content {
    background-color: #fcfcfc !important;
}

.default .page-inner .page-sidebar {
    background: transparent !important;
}

.default .page-header {
    background-color: #fcfcfc !important;
    margin-top: 3px;
    border-radius: 11px 0 0 0;
    box-shadow: none;
    -webkit-box-shadow: none;
}

.default .subheader.custom {
    margin-bottom: 0;
}

    .default .subheader.custom h1 {
        font-size: 30px;
        letter-spacing: 0;
        color: #006FC6;
    }

        .default .subheader.custom h1 small {
            font-size: 1rem;
            color: #0e5b96;
        }

.kpi {
    background: #FFFFFF 0% 0% no-repeat padding-box;
    box-shadow: 0px 0px 15px #00000033;
    border-radius: 7px;
    opacity: 1;
    padding-bottom: 10px;
}

    .kpi h3 {
        text-align: left;
        font-size: 20px;
        font-weight: bold;
        letter-spacing: 0px;
        color: #333333;
        opacity: 1;
        margin: 0px;
        padding: 10px 11px;
    }

        .kpi h3 span {
            font-size: 14px;
            font-weight: bold;
            margin-left: 5px;
            padding: 0;
        }

            .kpi h3 span.sparklines {
                float: right;
            }

    .kpi hr {
        border-bottom: 1px solid #E7E6E6;
        padding: 0;
        margin: 0;
    }

    .kpi .label {
        text-align: left;
        font: normal normal normal 14px/19px Roboto;
        letter-spacing: 0px;
        color: #333333;
        opacity: 1;
        margin: 10px 11px 0px 10px;
        padding-bottom: 5px;
    }



        .kpi .label.high {
            border-bottom: solid 3px #21C152;
        }

        .kpi .label.medium {
            border-bottom: solid 3px #FF9300;
        }

        .kpi .label.low {
            border-bottom: solid 3px #C41E1E;
        }

.nav-function-minify:not(.nav-function-top) .page-sidebar .primary-nav .nav-menu li.active.open > a:before {
    display: none !important;
}

ul.nav-menu li i.fal.fa-clipboard-list {
    padding-left: 3px;
}

.badge.todo-red, .badge.todo-amber, .badge.todo-green {
    color: #FFFFFF;
    padding: 5px;
}

.badge.todo-red {
    background: #C41E1E;
    padding: 8px;
    font-weight: bold;
    font-size: 14px;
}

.badge.todo-amber {
    background: #FF9300;
}

.badge.todo-green {
    background: #21C152;
}

table.table thead th,
table.table.table-striped:not(.table-bordered) th,
table.table.table-striped:not(.table-bordered) thead th {
    background: #006FC6 0% 0% no-repeat padding-box;
    border: 1px solid #FFFFFF;
    color: #FFFFFF;
}

table.table-striped tbody tr td {
    background: #E7E6E640 0% 0% no-repeat padding-box;
    border: 1px solid #FFFFFF !important;
}

table.table-striped tbody tr:nth-of-type(odd) td {
    background: #E7E6E680 0% 0% no-repeat padding-box;
    border: 1px solid #FFFFFF !important;
}

.nav-footer [data-class="nav-function-expand"].minify {
    /*display: block;*/
}

.nav-footer a.minify {
    display: block;
    width: 100%;
    height: 2.8125rem;
    line-height: 2.8125rem;
    font-size: 1.1875rem;
    vertical-align: middle;
    text-align: center;
    text-decoration: none;
    position: relative;
    -webkit-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
    background: #0e5b96;
}

.nav-function-minify .nav-footer a.minify {
    display: none;
}

a.byCustomerShortcut {
    position: fixed;
    right: 1.5rem;
    bottom: 4.3125rem;
    z-index: 931;
    background: #006FC6;
    color: #FDD300 !important;
}

.byCustomerShortcutTooltip {
    background: #006FC6;
    color: #FFF;
}

.mt-10 {
    margin-top: 10px !important
}

.scheduled-everyday-category {
    background: #8b0000 0% 0% no-repeat padding-box !important;
}

.scheduled-today {
    background: #ffbf00 0% 0% no-repeat padding-box !important;
}

.scheduled-future {
    background: #65ffab 0% 0% no-repeat padding-box !important;
}

.scheduled-done {
    background: #006fc6 0% 0% no-repeat padding-box !important;
}

.bc-white {
    background-color: white !important;
    padding-bottom: 0px !important;
}

.scheduled-everyday-category-header {
    background-color: white !important;
    color: #C41E1E !important;
    border-top: 2px solid #C41E1E !important;
    border-left: 2px solid #C41E1E !important;
    border-right: 2px solid #C41E1E !important;
    border-radius: 10px !important;
    padding: 10px 20px 10px 20px;
    text-align: center !important;
}

.scheduled-today-header {
    background-color: white !important;
    color: #FF9300 !important;
    border-top: 2px solid #FF9300 !important;
    border-left: 2px solid #FF9300 !important;
    border-right: 2px solid #FF9300 !important;
    border-radius: 10px !important;
    padding: 10px 20px 10px 20px;
    text-align: center !important;
}

.scheduled-future-header {
    background-color: white !important;
    color: #21C152 !important;
    border-top: 2px solid #21C152 !important;
    border-left: 2px solid #21C152 !important;
    border-right: 2px solid #21C152 !important;
    border-radius: 10px !important;
    padding: 10px 20px 10px 20px;
    text-align: center !important;
}

.scheduled-blue {
    background: #E7E6E680 0% 0% no-repeat padding-box;
    border: 1px solid #FFFFFF;
}

.scheduled-everyday-category-body {
    background: rgba(196, 30, 30, 0.1) !important;
    border: 1px solid #FFFFFF;
}

.scheduled-today-body {
    background: rgba(255, 147, 0, 0.1) !important;
    border: 1px solid #FFFFFF;
}

.scheduled-future-body {
    background: rgba(33, 193, 82, 0.1) !important;
    border: 1px solid #FFFFFF;
}

.ff-round.ff-sxl {
    width: 30px;
    height: 30px;
}


.events-header fieldset {
    top: unset;
    position: unset;
    width: 80%;
    margin-left: 10%;
    border: 1px solid;
    border-radius: 5px 5px 0 0;
    border-bottom: none;
}

    .events-header fieldset legend {
        color: #6B6B6B;
        font-weight: bold;
        font-size: 14px;
        padding: 0 12px;
    }

    .events-header fieldset.today {
        border-color: #FF9300;
    }

    .events-header fieldset.future {
        border-color: #21C152;
    }

    .events-header fieldset.due {
        border-color: #C41E1E;
    }

ul.segment-list, ul.segment-list li {
    list-style: none;
    margin: 0;
    padding: 0;
}

#dt-invoices {
    border-collapse: collapse !important;
}

    #dt-invoices tbody tr.dirty {
        border-left: solid 4px #FF9A13;
    }

        #dt-invoices tbody tr.dirty td.dirty i {
            color: #FF9A13;
            font-weight: bold
        }


/* END CUSTOM STYLES FOR REDESIGN */
.swal2-container {
    z-index: 100000 !important;
}


/* Adding this so forms don't interfere with Modal layouts */
form#fm-in-progress-modal, form#fm-bulk-dispute-modal, form#fm-promise-to-pay-modal {
    display: contents;
}


.modal-open {
    overflow: hidden;
}


tr.selected td {
    color: #006FC6;
    font-weight: 500;
}


.card.primary-contact {
    background: #f2f9fe; /* Old browsers */
    background: -moz-linear-gradient(top, #f2f9fe 0%, #d6f0fd 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top, #f2f9fe 0%,#d6f0fd 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom, #f2f9fe 0%,#d6f0fd 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f2f9fe', endColorstr='#d6f0fd',GradientType=0 ); /* IE6-9 */
}

a.header-icon:hover {
    cursor: pointer;
}

.nav.nav-tabs.myCustomerNotesModeHeader {
    border: none;
}

    .nav.nav-tabs.myCustomerNotesModeHeader li {
    }

        .nav.nav-tabs.myCustomerNotesModeHeader li a {
            border: none;
            color: #faf0e6;
        }

            .nav.nav-tabs.myCustomerNotesModeHeader li a.active {
                background: none;
                border-bottom: solid 2px #FFF;
            }

.nav-tabs.myCustomerNotesModeHeader .nav-item .nav-link.active:not(:hover) {
    color: #FFFFFF;
}


.chat-message.chat-message-personal {
    background: #1dc9b7 !important;
    color: #FFFFFF !important;
}

.chat-segment.chat-segment-get {
    border-bottom: dotted 1px #f1f0f0;
}

.chat-actions {
    float: right;
    display: none;
}

.chat-parent:hover .chat-actions {
    display: block;
}

/*.dataTables_scrollHeadInner {
    width: 100% !important;
}

.dataTables_scrollHeadInner table {
    width: 100% !important;
}*/


.invoice-display {
    background: #eef7fd !important;
    border: none;
    font-weight: bold;
}

.form-row.row-selected .invoice-display {
    border-left: 3px solid #1dc9b7;
}


/*.form-row.row-selected input, .form-row.row-selected select {
    border-bottom: 3px solid #1dc9b7;
}

.form-row.row-selected .input-group-prepend {
    box-shadow: inset 0 -3px 0 #1dc9b7;
}*/

.dispute-update-container .breadcrumb-arrow li a {
    line-height: 32px !important;
    height: 32px;
}

    .dispute-update-container .breadcrumb-arrow li a:hover {
        text-decoration: none;
        cursor: default;
        color: #FFF;
    }

.dispute-update-container .breadcrumb-arrow li.complete a {
    background: #a4d029;
}

    .dispute-update-container .breadcrumb-arrow li.complete a:before {
        border-color: #a4d029;
        border-left-color: transparent;
    }

    .dispute-update-container .breadcrumb-arrow li.complete a:after {
        border-color: transparent;
        border-left-color: #a4d029;
    }

.dispute-update-container .breadcrumb-arrow li.active {
    opacity: 1;
}

    .dispute-update-container .breadcrumb-arrow li.active a {
        background: #f2bb07;
    }

        .dispute-update-container .breadcrumb-arrow li.active a:before {
            border-color: #f2bb07;
            border-left-color: transparent;
        }

        .dispute-update-container .breadcrumb-arrow li.active a:after {
            border-color: transparent;
            border-left-color: #f2bb07;
        }

.dispute-update-container .breadcrumb-arrow li.white a {
    background: #FFFFFF;
}

    .dispute-update-container .breadcrumb-arrow li.white a:before {
        border-color: #FFFFFF;
        border-left-color: transparent;
    }

    .dispute-update-container .breadcrumb-arrow li.white a:after {
        border-color: transparent;
        border-left-color: #FFFFFF;
    }

.dispute-update-container tr > td {
    vertical-align: middle;
}

table.dt-disputes tr.dtrg-group td {
    background: aliceblue !important;
}


.open-invoice-marker {
    width: 10px;
    height: 10px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    display: inline-block;
    margin-right: 5px;
}

.in-dispute .open-invoice-marker, .broken-ptp .open-invoice-marker, .rejected-riba .open-invoice-marker {
    background: red;
}

.promise-to-pay .open-invoice-marker {
    background: green;
}

input.flagged {
    border: solid 2px #FF9A13 !important;
}

.flag-message {
    margin: auto;
}

table.table.dataTable {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
}

/*  Styles for table tools */

.dt-tools {
    background-color: #eef7fd;
    padding: 10px 20px;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: space-between;
    align-items: stretch;
    align-content: stretch;
    border-left: 3px solid #1dc9b7;
}

    .dt-tools .dt-tools-right {
        display: flex;
        flex-direction: row;
        flex-wrap: nowrap;
        justify-content: flex-end;
        align-items: flex-end;
    }

div.dt-tools .dt-tools-right label {
    font-weight: bold
}

div.dt-tools .dt-tools-right div.dataTables_filter, div.dt-tools .dt-tools-right div.dataTables_length {
    margin-left: 2em;
}

    div.dt-tools .dt-tools-right div.dataTables_filter input, div.dt-tools .dt-tools-right div.dataTables_length select {
        margin-left: 0.5em;
        display: inline-block;
        width: auto;
    }

div.dt-tools .dt-tools-right .dataTables_paginate.paging_simple_numbers ul.pagination {
    margin-left: 0.5em;
    margin-bottom: 5px;
}

.dt-tools .dt-tools-left .dtsb-title {
    font-weight: bold;
}

.dt-tools .dt-tools-left .dtsb-searchBuilder {
    display: flex;
    margin: 0;
}

    .dt-tools .dt-tools-left .dtsb-searchBuilder .dtsb-titleRow, .dt-tools .dt-tools-left .dtsb-searchBuilder .dtsb-group {
        margin: 0;
    }

    .dt-tools .dt-tools-left .dtsb-searchBuilder .dtsb-group {
        margin-left: 10px;
    }

    .dt-tools .dt-tools-left .dtsb-searchBuilder:has(.dtsb-vertical) {
        display: block;
        
    }

/*  Styles for table footer */
.dt-footer {
    background-color: #eaeff2;
    padding: 10px 20px;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: space-between;
    align-items: stretch;
    align-content: stretch;
}

    .dt-footer .dt-footer-right {
        display: flex;
        flex-direction: row;
        flex-wrap: nowrap;
        justify-content: flex-end;
        align-items: flex-end;
        align-self: center;
    }

div.dt-footer .dt-footer-right label {
    font-weight: bold
}

div.dt-footer .dt-footer-right div.dataTables_filter, div.dt-footer .dt-footer-right div.dataTables_length {
    margin-left: 2em;
}

    div.dt-footer .dt-footer-right div.dataTables_filter input, div.dt-footer .dt-footer-right div.dataTables_length select {
        margin-left: 0.5em;
        display: inline-block;
        width: auto;
    }

div.dt-footer .dt-footer-right .dataTables_paginate.paging_simple_numbers ul.pagination {
    margin-left: 0;
    margin-bottom: 0;
}

.dt-footer .dt-footer-left {
    align-self: center;
}

    .dt-footer .dt-footer-left .dataTables_info {
        font-weight: 500;
    }




#customer-notes .card {
    overflow-y: scroll;
    height: 154px;
    max-height: 154px;
}

#customer-notes .card-body {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}

.contact-panel-body {
    height: 127px;
    overflow: hidden;
}


th.overdue-week {
    background: #5f9fd3 !important;
}

span.forecast-value {
    font-style: italic;
    color: #234176;
}

#customer-open-invoices .dataTables_scrollBody {
    min-height: 400px !important;
}

.calls-suppressed {
    border: solid 3px red;
}

a.todo-customer-toggle {
    color: #90c6fc;
    float: right;
}

    a.todo-customer-toggle.toggle-active {
        color: #ffffff;
    }

.paymentPlanIndicator {
    text-shadow: none;
}

#dtOpportunities_wrapper {
    width: 1200px;
    margin: 0 auto;
}

    #dtOpportunities_wrapper th, #dtOpportunities_wrapper td {
        white-space: nowrap;
    }

.red-icon {
    color: #C41E1E;
}

    .red-icon i {
        font-weight: bold !important;
    }

.gray-icon {
    color: #80808050;
    font-weight: normal !important;
}

.todo-kpis .kpi {
    cursor: pointer;
}

    .todo-kpis .kpi h3 {
        color:#333333;
    }

    .todo-kpis .kpi.active h3 {
        color: #006FC6;
    }

    .todo-kpis .kpi .kpi-header {
        width: 100%;
        min-height: 50px;
        display: table;
        text-align: center;
        background: #006FC6;
        color: #ffffff;
        font-weight: bold;
        border-radius: 7px 7px 0 0px;
    }

        .todo-kpis .kpi .kpi-header span {
            display:table-cell;
            vertical-align:middle;
        }

.todo-kpis .kpi.white-kpi {
    background-color: #fff;
}

    .todo-kpis .kpi.active {
        background-color: #eef7fd;
    }

        .todo-kpis .kpi.active .kpi-header {
            background-image: radial-gradient( circle farthest-corner at 10% 20%, rgba(2,37,78,1) 0%, rgba(4,56,126,1) 19.7%, rgba(85,245,221,1) 100.2% );
            background-image: radial-gradient( circle farthest-corner at 92.3% 71.5%, rgba(83,138,214,1) 0%, rgba(134,231,214,1) 90% );
            background-image: linear-gradient( 180.7deg, rgba(0,213,255,1) 2.5%, rgba(79,255,255,1) 97.7% );
        }

.todo-customer-note {
    cursor: pointer;
}

.disabled-button {
    background-color: #ccc !important;
    color: #666 !important;
    cursor: not-allowed;
    pointer-events: none;
}