@import url('/common/public/vars.css?a4211f9f5d3b');

@import 'vars.css';

:root {
  --header-height: 70px;
  --z-index-header: 905;
}

@media (max-width: 767px) {
    :root {
        --header-height: 50px;
    }
}

body {
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
}

#header {
	 padding: 0 0 0 0;
}

a {
  color: #337ab7;
  text-decoration: none;
}

.text-success a{
  color: #3c763d;
}

.btn-default {
  color: #333;
  background-color: #fff;
  border-color: #ccc;
}

.btn-primary {
  color: #fff;
  background-color: #337ab7;
  border-color: #2e6da4;
}

#footer_text,
.txt-color-white {
  color: white;
}

/* AE: Having the style of TH / TD redefined here is not a good idea.
For example, it overrides  the red / italic styling of the Timesheets row where th entry if Client Billable / Billed

.table > thead > tr > th, .table > thead > tr > td, .table > tbody > tr > th, .table > tbody > tr > td, .table > tfoot > tr > th, .table > tfoot > tr > td {
  font-size: 12px;
  color: black;
  white-space: nowrap;
}
*/

.v-select .vs__dropdown-menu {
  overflow-x: hidden;
}
.v-select .vs__dropdown-menu li:hover{
  overflow: visible;
  white-space: normal;
}

.loading .fa-spin {
  font-size: 70px;
  margin-top: 20px;
  margin-bottom: 20px;
}

.loading {
  text-align: center;
}

.widget-body.loading {
  padding-top:110px;
  min-height:350px;
  text-align: center;
}

.widget-footer {
  padding: 10px 10px;
  min-height: 54px;
  margin: 0 -13px -1px;
}

.control-label-required:after {
  content: "*";
  color: red;
  margin-left: 3px;
}

button.dt-button, div.dt-button, a.dt-button {
  position: relative;
  display: inline-block;
  box-sizing: border-box;
  margin-right: 0.333em;
  padding: 0.5em 1em;
  border: 1px solid #999;
  border-radius: 2px;
  cursor: pointer;
  font-size: 0.88em;
  color: black;
  white-space: nowrap;
  overflow: hidden;
  background-color: #e9e9e9;
  background-image: -webkit-linear-gradient(top, #fff 0%, #e9e9e9 100%);
  background-image: -moz-linear-gradient(top, #fff 0%, #e9e9e9 100%);
  background-image: -ms-linear-gradient(top, #fff 0%, #e9e9e9 100%);
  background-image: -o-linear-gradient(top, #fff 0%, #e9e9e9 100%);
  background-image: linear-gradient(to bottom, #fff 0%, #e9e9e9 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,StartColorStr='white', EndColorStr='#e9e9e9');
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  text-decoration: none;
  outline: none;
}

.jarviswidget>header#client-header>h2 {
  width: auto !important;
  text-overflow: ellipsis!important;
  overflow: hidden!important;
  white-space: nowrap!important;
  max-width: 15%;
}
.jarviswidget>header.property-header>h2 {
  width: auto !important;
  text-overflow: ellipsis!important;
  overflow: hidden!important;
  white-space: nowrap!important;
  max-width: 15%;
}
.jarviswidget>header>.asp-header-buttons {
  height: 100%;
  float:left;
  padding-left: 10px;
}
.jarviswidget>header>.asp-header-buttons>a {
 margin-bottom: 10px;
}
#client-header .header-buttons {
  height: 22px;
  margin-top: -7px;
  margin-left: 8px;
}
@media (max-width: 1225px) {
  #client-header #clients-tab > li > a {
    padding: 8px 5px 6px !important;
    font-size: 10px;
  }
  #client-header #clients-tab > li > a:hover {
    padding: 8px 5px 6px !important;
  }
}
@media (max-width: 770px) {
  #client-header > h2, #client-header > span {
    display: none;
  }
}
@media (max-width: 550px) {
  #client-header .send-message-button {
    display: none !important;
  }
  #client-header #clients-tab > li > a {
    padding: 9px 3px 9px !important;
    font-size: 8px;
    height: 100%;
  }
}
@media (max-width: 405px) {
  #client-header #clients-tab > li > a {
    padding: 9px 2px 9px !important;
    font-size: 7px;
  }
}
@media (max-width: 1400px) {
  #client-header.with-freeholder-btn #clients-tab > li > a {
    padding: 7px 5px 6px !important;
    font-size: 10px;
  }
}
@media (max-width: 900px) {
  #client-header.with-freeholder-btn > h2, #client-header > span {
    display: none;
  }
}

@media (max-width: 560px) {
  #client-header.with-freeholder-btn #clients-tab > li > a {
    padding: 9px 3px 9px !important;
    font-size: 8px;
    height: 100%;
  }
}
@media (max-width: 395px) {
  #client-header.with-freeholder-btn #clients-tab > li > a {
    padding: 9px 2px 9px !important;
    font-size: 7px;
  }
}
@media (max-width: 1320px) {
  #client-header .tab-title .fa {
    display: none!important;
  }
  #client-header .tab-title .fas {
    display: none!important;
  }
}
#client-header ul.nav-tabs >li.active {
  border-top: 2px solid #2c3742;
  margin: 0!important;
  height: 34px;
  background: linear-gradient(#EEE, #FFF);
  outline: none!important;
}
#client-header ul.nav-tabs >li.tab-title >a {
  margin: 0!important;
  height: 34px;
  padding: 5px 15px 0!important;
  box-shadow: 0 6px 5px -4px rgba(0,  0,  0, 0.5) inset!important;
  transition: all 0.2s linear!important;
}
#client-header ul.nav-tabs >li.tab-title >a:hover {

  color: #000 !important;
  box-shadow: 0 6px 5px -4px rgba(0,  0,  0, 0.5) inset!important;
}
#client-header ul.nav-tabs >li.active >a {
  margin: 0!important;
  padding: 8px 15px 0!important;
  height: 34px;
  background: linear-gradient(#EEE, #FFF);
  border: none!important;
  border-right-width: 0!important;
  border-left-width: 0!important;
}
#client-header ul.nav-tabs >li.active >a:hover {
  border: none!important;
}
@media (max-width: 1351px){
  #property-tabs .tab-title {
    font-size: 10px;
  }
}
@media (max-width: 1155px){
  #property-tabs.nav-tabs>li>a {
    padding: 7px 5px 6px !important;
  }
}
@media (max-width: 580px){
  #property-tabs.nav-tabs>li>a {
    padding: 9px 2px 5px !important;
    font-size: 8px;
  }
}
div.dt-buttons {
  position: relative;
   float: left;
}

.btn-info {
  color: #fff;
  background-color: #5bc0de;
  border-color: #46b8da;
}

.width-120 {
  width: 120px;
}

.ui-dialog {
  padding: 0;
  border-radius: 0;
  z-index: 1000 !important;
}
.ui-dialog .ui-dialog-content {
    width: 100%;
    margin: 0;
    padding: 0;
    font-size:13px;
}

.ui-draggable .ui-dialog-titlebar {
  background: #2C3744;
  border-color: #2C3742;
  padding: 3px;
}

label {
  font-weight: 400;
}

.ui-dialog .footer {
  min-height: 50px;
  background-color: #F8F7F7;
  text-align: right;
  border-top: 1px solid #E4E4E4;
  font-size:14px;
}

.ui-dialog .footer .footer-buttons {
  padding: 13px 25px;
}

#testdiv {
  background-color: #fafafa!important;
}

.ui-dialog legend{
         display: block;
    padding: 8px 0;
    border-bottom: 1px dashed rgba(0,0,0,.2);
    background: #fff;
    font-size: 16px;
    font-weight: 300;
    color: #222;
    margin: 25px 0 20px;
}


.error-message, .red {
  color:red;
}

.is-error {
  border: 1px solid red!important;
}

.smart-form .checkbox input:disabled+i:after, .smart-form .radio input:disabled+i:after {
  color: gainsboro;
}


.smart-style-2 .smart-form .checkbox input:disabled+i, .smart-style-2 .smart-form .radio input:disabled+i, .smart-style-2 .smart-form .toggle input:disabled+i {
  border-color: gainsboro;
}

table.dataTable.dtr-inline.collapsed>tbody>tr>td:first-child, table.dataTable.dtr-inline.collapsed>tbody>tr>th:first-child {
  position: relative;
  padding-left: 30px;
  cursor: pointer;
}

table.dataTable.dtr-inline.collapsed>tbody>tr.parent>td:first-child:before, table.dataTable.dtr-inline.collapsed>tbody>tr.parent>th:first-child:before {
  content: '-';
  background-color: #d33333;
  font-style: normal!important;
}

table.dataTable.dtr-inline.collapsed>tbody>tr>td:first-child:before, table.dataTable.dtr-inline.collapsed>tbody>tr>th:first-child:before {
  top: 9px;
  left: 4px;
  height: 14px;
  width: 14px;
  display: block;
  position: absolute;
  color: white;
  border: 2px solid white;
  border-radius: 14px;
  box-shadow: 0 0 3px #444;
  box-sizing: content-box;
  text-align: center;
  font-family: 'Courier New', Courier, monospace;
  line-height: 14px;
  content: '+';
  background-color: #31b131;
  font-style: normal!important;
}

table.dataTable.dtr-inline.collapsed>tbody>tr>td.child:before {
  display: none;
}

.time-picker.form-control {
  padding: 0;
  margin: 0;
  border: none;
}

.time-picker.form-control .display-time {
  width: 100%;
  height: 100%;
  padding: 0;
  margin: 0;
  padding-left: 5px;
}

.v-select .form-control {
  height: 34px;
}

select.form-control.error {
  border: 1px solid red;
}

@media (max-width: 1540px){
  .tab-title .fa {
    display: none!important;
  }
  .tab-title .fas {
    display: none!important;
  }
}

div.v-select > div {
  border-radius: 0;
  padding: 5px 0;
}
div.v-select .vs__selected-options {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
div.v-select .vs__selected-options .vs__selected {
  width: 77%;
}
div.v-select.v-select-multiple .vs__selected-options .vs__selected {
  width: auto;
}

.menu-list-disabled {
  cursor: not-allowed;
}

.menu-list-disabled li {
  cursor: not-allowed;
}

.smart-style-2.menu-on-top nav ul ul ul.menu-list-disabled li a {
  color: #636f7d!important;
  cursor: not-allowed;
  pointer-events: none;
}

.smart-style-2.menu-on-top nav ul ul.menu-list-disabled li:hover>a {
  color: #636f7d!important;
  background-color: #2e3e57!important;
}

#logo div {
  height: 60px;
}

.w-100 {
  width: 100% !important;
}

.text-danger-important {
  color: red !important;
}

.text-warning-important {
  color: orange !important;
}

.text-success-important {
  color: green !important;
}

.text-info-important {
  color: deepskyblue !important;
}

.text-enhancement-color, .text-enhancement-color > a, .text-enhancement-color > span > a:first-of-type {
  color: var(--task-enhancement-color) !important;
}

.text-defect-color, .text-defect-color > a, .text-defect-color > span > a:first-of-type {
  color: var(--task-defect-color) !important;
}

.text-planned-reactive-color, .text-planned-reactive-color > a, .text-planned-reactive-color > span > a:first-of-type {
  color: var(--task-planned-reactive-color) !important;
}

.text-planned-color, .text-planned-color > a, .text-planned-color > span > a:first-of-type {
  color: var(--task-planned-color) !important;
}

.text-reactive-color, .text-reactive-color > a, .text-reactive-color > span > a:first-of-type {
  color: var(--task-reactive-color) !important;
}

/*Client calendar settings (Calendar View)*/

.bg-color-fc-br-Task_Type_Enhancement {
  background: var(--task-enhancement-color);
}

.bg-color-fc-br-Task_Type_Defect {
  background: var(--task-defect-color);
}

.bg-color-fc-br-Task_Type_Planned  {
  background: var(--task-planned-color);
}

.bg-color-fc-br-Task_Type_Planned_Reactive {
  background: var(--task-planned-reactive-color);
}

.bg-color-fc-br-Task_Type_Reactive {
  background: var(--task-reactive-color);
}

.fc-list-view .bg-color-fc-br-Task_Type_Enhancement a {
  color: #444;
}
.fc-list-view .bg-color-fc-br-Task_Type_Enhancement {
  background: none;
}
.fc-list-view .bg-color-fc-br-Task_Type_Enhancement .fc-event-dot{
  background: var(--task-enhancement-color);
}

.fc-list-view .bg-color-fc-br-Task_Type_Defect a {
  color: #444;
}
.fc-list-view .bg-color-fc-br-Task_Type_Defect {
  background: none;
}
.fc-list-view .bg-color-fc-br-Task_Type_Defect .fc-event-dot{
  background: var(--task-defect-color);
}


.fc-list-view .bg-color-fc-br-Task_Type_Planned a {
  color: #444;
}
.fc-list-view .bg-color-fc-br-Task_Type_Planned {
  background: none;
}
.fc-list-view .bg-color-fc-br-Task_Type_Planned .fc-event-dot {
  background: var(--task-planned-color); /*blue*/
}


.fc-list-view .bg-color-fc-br-Task_Type_Planned_Reactive a {
  color: #444;
}
.fc-list-view .bg-color-fc-br-Task_Type_Planned_Reactive  {
  background: none;
}
.fc-list-view .bg-color-fc-br-Task_Type_Planned_Reactive .fc-event-dot {
  background: var(--task-planned-reactive-color);
}

.fc-list-view .bg-color-fc-br-Task_Type_Reactive a {
  color: #444;
}
.fc-list-view .bg-color-fc-br-Task_Type_Reactive  {
  background: none;
}
.fc-list-view .bg-color-fc-br-Task_Type_Reactive .fc-event-dot {
  background: var(--task-reactive-color);
}

/*END:Client calendar settings*/

.padding-0 {
  padding: 0 !important;
}

.strike {
  text-decoration: line-through;
}

.no-href a {
  text-decoration: none;
  cursor: text;
  color: #000;
}

.intranet .post-title {
  font-family: "Old Standard TT",serif!important;
  font-size: 20px!important;
}

.intranet .post-content {
  font-family: "Muli", sans-serif !important;
  font-size: 15px !important;
  font-weight: 400 !important;
  line-height: 1.5 !important;
}

li.tab-title.active > a {
  font-weight: unset!important;
}

.breadcrumb > li + li:before {
  content: "/";
  margin-right: 3px;
}

.toggle-height-30 .brms-toggle-container .toggle{
  min-height: 30px!important;
  height: 30px!important;
}

.toggle-height-30 .toggle .toggle-on, .toggle-height-30 .toggle .toggle-off{
  padding-top: 3px;
}
.disabled-menu > a {
  color: #999!important;
}

.next-action-critical {
  background-color: #ffe6e6;
  }

.draggable-list-bg-selected {
  background:#53a7ea;
}

.next-action-overdue-text {
  color: red;
}

.new-prospect-property-background, header.new-prospect-property-background {
  background-color: #e2efdf;
}

.lapsed-suspended-property-background, header.lapsed-suspended-property-background {
  background-color: #f2dede;
}

.internal-avatar {
  outline: #CA4862 3px solid;
  outline-offset: -3px;
}

.internal-thread-form .ui-draggable .ui-dialog-titlebar {
  background: #CA4862!important;
  border-color: #CA4862!important;
}

.smart-style-2 .btn-toggle-internal {
    background: #CA4862!important;
    border-color: #CA4862!important;
    color:#fff;
}

.invoice-total-outstanding {
  font-weight: bold;
  font-size: 14px;
}

.fa-chart-bar-rotate {
  transform: rotate(270deg) scale(1, -1)
}

.width-60 {
  width: 60px;
}

.text-line-through {
  text-decoration: line-through;
}

.mobile-big-btn {
  width: 100%;
  font-size: 27px;
}

.mobile-legend {
  border-bottom-width: medium;
  line-height: 38px;
}

.margin-bottom-20 {
  margin-bottom:20px!important
}

.margin-right-10 {
  margin-right:10px!important
}

.photo-is-visible-icon {
  position: absolute!important;
  top: 5px!important;
  left: 5px!important;
  right: unset!important;
}

.delete-photo-icon {
    position: absolute!important;
    top: 54px!important;
    left: 5px!important;
    right: unset!important;
    visibility: hidden;
    opacity: 0;
    transition: visibility 0.5s, opacity 0.3s linear;
}

.edit-photo-icon {
    position: absolute!important;
    top: 30px!important;
    left: 5px!important;
    right: unset!important;
    visibility: hidden;
    opacity: 0;
    transition: visibility 0.5s, opacity 0.3s linear;
}

@media only screen and (hover: none) and (pointer: coarse) {
    .delete-photo-icon, .edit-photo-icon {
        visibility: visible;
        opacity: 1;
    }
}

.photo-preview-box:hover .delete-photo-icon, .photo-preview-box:hover .edit-photo-icon {
  visibility: visible;
  opacity: 1;
}

.photo-preview-box:hover {
  border:1px solid grey;
  background: #f9f9f9;
}
.photo-preview-box {
  position: relative;
  display: flex;
  border:1px solid white;
  transition: background-color 0.3s, border 0.3s linear;
}

.photo-img-container:hover {
    text-decoration: unset;
    color: black;
}

.photo-img-container {
    width:100%;
    height:175px;
    display: flex;
    justify-content: end;
    align-items: center;
    flex-direction: column;
    text-decoration: unset;
    color: black;
}

.photo-caption {
    width: calc(100% - 10px);
    text-align: center;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    margin-top: 3px;
}

.brms-photo-grid {
    width: 150px;
    height: 175px;
    display: inline-block;
    vertical-align: middle;
    margin-top: 5px;
    margin-bottom: 5px;
}

.v-select-height-fix span.vs__selected {
  position: absolute;
  z-index: 2;
}

.text-font-size-14 {
  font-size: 14px;
}

.padding-horizontal-remove {
  padding-right: 0;
  padding-left: 0;
}

.back-danger-important {
    background-color: red!important;
    color: white!important;
}

.first-quartile-important {
    background-color: blue!important;
    color: white!important;
}

.second-quartile-important {
    background-color: green!important;
    color: white!important;
}

.third-quartile-important {
    background-color: orange!important;
    color: white!important;
}

.fourth-quartile-important {
    background-color: red!important;
    color: white!important;
}

.grecaptcha-badge {
    bottom: 60px!important;
}

.v-popper--theme-brms-tooltip .v-popper__inner {
    font-family: Arial,Helvetica,sans-serif!important;
    font-style: normal;
    font-weight: 700;
    color: #000000!important;
    background-color: #f4f4f4!important;
    border: 1px solid black;
    font-size: 11px;
    border-radius: 0!important;
}

.timesheet-task-type-internal {
    background-color: var(--task-defect-color);
}

.modal-body-200 {
    overflow: auto;
    max-height:calc(100vh - 200px);
    min-height:200px;
}

.col-xl-6, .col-xl-3 , .col-xl-1{
    position: relative;
    min-height: 1px;
    padding-right: 15px;
    padding-left: 15px;
}

@media (min-width: 1800px) {
    .col-xl-6 {
        float: left;
        width: 50%;
    }
    .col-xl-3 {
        float: left;
        width: 25%;
    }
    .col-xl-1 {
        float: left;
        width: 8.33333333%;
    }
}

.uploader-edit-photo-modal .ui-dialog-titlebar-close, .edit-photo-modal .ui-dialog-titlebar-close {
    display: none;
}

.ui-dialog .footer .image-edit-footer-buttons {
    padding: 13px 15px;
}

input[type=text]+.address-copy-button.input-group-addon {
    cursor: pointer;
}

input[type=text]:focus+.address-copy-button.input-group-addon {
    border-color: #ccd0d2;
    background-color: #eeeeee;
    color: #555555;
}

input[type=text]+.address-copy-button.input-group-addon:hover {
    border-color: #0091d9;
    background-color: #72a0ce;
    color: #fff;
}

.task-report-modal-hidden-cross .ui-dialog-titlebar-close,
.wo-bulk-clone-modal .ui-dialog-titlebar-close,
.pi-bulk-tasks-clone-modal .ui-dialog-titlebar-close {
    display: none;
}

.modal-200-max-height {
    overflow: auto;
    max-height:calc(100vh - 200px);
    min-height:200px;
}

.brms-fa-franc:before {
    font-family: sans-serif;
    content: "₣";
}

.log-container {
    max-height: 200px;
    padding-top: 7px;
    overflow-wrap: break-word;
    overflow: auto;
}

.log-item {
    display: block;
}

.current-log-item {
    display: block;
    font-weight: bold;
}

.client-overview-date-toolbar {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

.hover-color-primary:hover {
    color: #337ab7 !important;
}