/*
==========================================================================
    Resident Guest Forecast
==========================================================================
*/
.resident-guestforecast,
.guestForecastOccRatioPopup {
  font-family: $base-font;
  .commonTable {
    .negativenumber {
      color: red !important
    }
    tr {
      th, td {
        min-width: 90px;
        &.fixcell:first-child {
          text-align: left;
        }
        &.totalColumn {
          min-width: 110px;
          width: 110px;
        }
      }
      th {
        height: 25px;
        padding: 2px 10px !important;
        &.twoCell {
          div {
            padding: 0 10px;
          }
          .btn-close {
            margin-left: 10px;
          }
          .addText {
            padding: 3px 10px;
          }
        }
      }
      td {
        padding: 3px 10px !important;
      }
      &.trPattensBlue {
        .totalColumn {
          background-color: tablecolor('pattens-blue') !important;
        }
      }
    }
    tr:first-child th:first-child {
      padding: 0 0 !important;
    }
    .trHead {
      th, td {
        padding: 0 10px !important;
        height: auto;
      }
    }
    .icon-collapse {
      float: left;
    }
    thead .totalcolumn {
      background: #98bad6 !important;
    }
    .overridecolumn {
      color: blue;
    }
  }
}

/* Resident Guest Forecast */
.resident-guestforecast {
  .content {
    padding: 10px 15px 0 15px;
    overflow: hidden;
  }
  .fiscal-range .fiscal-range__cell{
    text-align: center;
    cursor:default;
  }
  .fiscal-range.fiscal-range-start .is-space{
    padding-right: 80px!important;
  }
  .fiscal-range__column{
    margin: unset !important;
    padding: 0 2px !important;
  }
  .fiscal-range__group{
    margin: 0 -4px 0 -2px!important;
  }
  .col-size {
    width: 16.66666667% !important;
  }
  .fiscaldaterange-title{
    height: 30px;
    position: relative;
    padding: 0 100px 0 10px;
    margin-bottom: 0;
    border: none;
    overflow: hidden;
    color: #002060;
    z-index: 1;
  }
  .fiscaldaterange-title .fiscal-action{
    background: #FFFFFF !important;
    height: 30px;
    padding: 0 0 0 5px;
  }
  .fiscal-range.fiscal-range-startview .fiscal-range__row .fiscal-range__cell.fiscal-range__tilte{
    text-align: center !important;
  }
  .fiscal-range .fiscal-range__row.is-group-title{
    grid-column-gap: 3px;
  }
  .fiscaldaterange-title {
    font-family: $base-font-semibold;
    font-weight: normal;
  }
  .disabledBg {
    background: #e4e4e4 !important;
  }
  .btn-summary {
    background-image: none !important;
  }
  .top-action-area {
    overflow: hidden;
    margin-bottom: 10px;
    position: relative;
    @include flexbox();
    @media (max-width: 1100px) {
      display: block;
    }
    .btn-export {
      background: color('white') !important;
      padding: 4px 10px 4px 38px;
      margin-left: 10px;
      height: $icon-large;
      text-decoration: none;
      i {
        left: 0;
        right: initial;
      }
    }
    .btn-action {
      height: $icon-large;
      background: color('white-smoke-2');
      padding: 4px 40px 0 10px;
      margin-right: 10px;
      color: $c-black2;
      position: relative;
      -webkit-box-shadow: none;
      box-shadow: none;
      line-height: unset;
      @include border-radius(0);
      i {
        position: absolute;
        right: 5px !important;
        top: 3px;
      }
    }
    .btn-occupancyRatios {
      height: $icon-large;
      padding: 4px 10px;
      background-color: color('pattens-blue-2');
      color: color('black2');
      &:hover {
        background-color: color('pattens-blue-2');
        color: #2a2b2b;
      }
      @include border-radius(0);
    }
    .options-area {
      margin-right: 10px;
      background-color: color('white-smoke');
      &.hide {
        display: none;
      }
      .mars-radio {
        float: left;
      }
    }
    .options-checkbox {
      margin-right: 10px;
      background-color: color('white-smoke');
      div {
        padding: 0 5px;
        float: left;
        .mars-checkbox {
          margin: 0;
        }
      }
    }
    .checkbox-area {
      margin-right: 10px;
      flex-grow: 1;
      background-color: color('white-smoke');
      @media (max-width: 1100px) {
        overflow: hidden;
        margin: 5px 0;
      }
      div {
        float: left;
        padding: 0 5px;
        .mars-checkbox {
          position: relative;
          margin-bottom: 0;
          input:checked ~ .checkmark:after {
            display: block !important;
          }
          .checkmark {
            position: absolute;
            top: 50% !important;
          }
        }
      }
    }
  }
  .fiscal-range-wrap {
    display: none;
    margin-bottom: 10px;
  }
  #report.newreport {
    border: none;
    max-width: 530px;
    z-index: 100;
	font-weight: 400;
    .btn-reportclose {
      margin-right: 10px;
    }
    .report-title {
      display : flex;
      h2 {
        font-family: "SourceSansProSemiBold";
      }
    }
    .report-content {
      border: none;
      .report-row {
        margin-top: 4px;
        &:last-child .reportrowcontent {
          padding: 0 0;
        }
        display: -ms-grid;
        display: grid;
        grid-template-columns: 160px auto;
        .reportrowtitle {
          width: 155px;
        }
        .reportrowcontentarea {
          .reportrowcontent {
            margin-left: 0;
            margin-top: 4px;
            &:first-child {
              margin-top: 0;
            }
          }
        }
        .reportrowcontent {
          .form-group {
            padding: 0;
            @media (max-width: 1084px) {
              float: none;
              clear: both;
              margin: 4px 0 0 0;
              &:first-child {
                margin-top: 0;
              }
              &:after {
                content: '';
                display: table;
                clear: both;
              }
            }
            & > label {
              margin: 0 10px;
              float: left;
              width: auto;
              margin: 0 10px;
              height: 26px;
              line-height: 26px;
              font-size: $medium;
              font-weight: normal;
              color: $c-black2;
              text-align: left;
            }
            &:first-child {
              margin-left: 0;
              label {
                width: 100px;
              }
            }
            small {
              display: block;
              float: left;
              padding: 0 10px;
              font-style: normal;
              font-size: 14px;
              height: 26px;
              line-height: 26px;
            }
          }
          .mars-radio {
            float: left;
            min-width: 120px;
            position: relative;
            label {
              display: block;
              cursor: pointer;
              margin-bottom: 0;
              padding: 3px 5px;
            }
          }
          .checkbox-area > div {
            float: left;
            padding: 0 5px;
            .mars-checkbox {
              position: relative;
              margin-bottom: 0;
              padding-top: 3px;
              padding-bottom: 3px;
              input:checked ~ .checkmark:after {
                display: block !important;
              }
              .checkmark {
                position: absolute;
                top: 50% !important;
              }
            }
          }
        }
        .mars-select {
          float: left;
          .multiselect-native-select {
            width: inherit !important;
            max-width: 100%;
            .multiselect {
              width: 240px !important;
              line-height: auto;
            }
          }
          .multiselect-container,
          .multiselect-container li {
            width: 100%;
          }
          .multiselect-container li label {
            height: 26px !important;
            line-height: 24px !important;
          }
          .multiselect-container li.active label {
            background: url(../images/chi-tic.svg) no-repeat 98% center !important;
            -webkit-background-size: 12px auto !important;
            background-size: 12px auto !important;
            line-height: 24px !important;
          }
        }
        .rangesliderbox {
          padding: 0 10px !important;
          width: 240px;
          position: relative;
          z-index: 0;
          .rangesliderwrap {
            width: 100%;
            float: none;
            padding: 0;
          }
          .irs-hidden-input {
            display: none !important;
          }
        }
      }
    }
  }
  .table-responsive {
    overflow: scroll !important;
    max-height: inherit;
    margin-bottom: unset;
    &.tableAutoResponsive {
      max-width: 1113px;
    }
    &.summeryTableResponsive {
      //max-width: 1368px;
      overflow:hidden !important;

      .consolidatedTable .is-first-column, .fixcell {
        border-right: 1px solid black !important;
      }
      
      th.highlightimpacteventdate {
        background-color: #ffe3a4 !important;
      }
    }
  }
  .commonTable {
    &.consolidatedMaxTable {
      tr {
        th,
        td {
          min-width: 100px;
          width: 100px;
          &.fixcell {
            min-width: 160px;
            max-width: 160px;
            border-right: 1px solid color('sapphire') !important;
          }
          &.colspanset,
          &.borderd-right {
            border-right: 1px solid color('sapphire') !important;
          }
          &:last-child {
            border-right: none !important;
          }
        }
        .acpercentcell2.active,
        .vrcellShow.borderd-right,
        .vrcell.borderd-right.active,
        .dfcellShow.borderd-right,
        .dfcell.borderd-right.active {
          border-right: none !important;
        }

      }
      tr th.colspanset.varcell,
      tr th.colspanset.dfcell {
        border-right: none !important;
      }
      tr:first-child th:first-child {
        min-width: 126px;
        max-width: 126px;
        padding: 0 0 !important;
      }
      tr td:first-child {
        min-width: 126px;
        max-width: 126px;
      }
    }
    &.summeryTable {
      tr {
        .fixcell:first-child {
          min-width: 165px;
          max-width: 165px;
        }
      }
      .is-first-column div.et-cell-content {
        width: 160px;
        overflow: hidden;
        text-overflow: ellipsis !important;
        white-space: nowrap;
      }
      td.is-first-column {
        text-align: left !important;
      }
    }
    .contributioncell,
    .acsplitcell,
    .acpercentcell,
    .actualstlyrow,
    .dfrow,
    .varrow,
    .acrow,
    .tcrow, .gcrow, .otrow, .vrcell {
      display: none;
    }

  }

  .forecasttitle-top {
    height: 40px;
    margin-top: 15px;
    margin-bottom: -10px;
    margin-left: 15px;
    .forecasttitle {
      background-color: #DCECFF;
      padding: 6px 10px 6px 10px;
    }
  }

}

.dialog-guestForecastOccRatioPopup {
  top: 160px !important;
  .ui-dialog-titlebar {
    .help-integration {
      float: right !important;
      margin-right: 25px !important;
      margin-top: -3px;
      background-size: 30px 30px !important;
    }
  }
}

/* Guest Forecast Occ Ratio Popup */
.guestForecastOccRatioPopup {
  padding: 10px 0 !important;
  display: none;
  .auto-height{  height: auto !important;} /* For popup auto adjust height */
  &.active{
    display: block;
  }
  &:after {
    content: '';
    display: table;
    clear: both;
  }
  &.popup-contents{
    margin: 10px !important;
  }
  .top-section,
  .section-row {
    &:after {
      content: '';
      display: table;
      clear: both;
    }
  }
  .btn-deletecell {
    display: block;
    width: 26px;
    height: 26px;
    position: relative;
    top: 0;
    left: inherit;
    right: -5px;
    border: none;
    float: left;
    margin-left: 5px;
  }
  .section-row {
    margin-top: 5px;
    display: grid;
    grid-template-columns: 175px auto;
  }
  .head-label {
    @include border-radius(0);
    margin: 0 !important;
    padding: 3px 35px 3px 10px;
    color: $c-black2;
    text-align-last: left;
    background: color('pattens-blue-2');
    width: 170px;
    height: 26px;
    position: relative;
    .btn-add {
      position: absolute;
      right: 5px;
      top: 1px;
    }
  }
  .section-right {
    @include flexbox;
  }
  .rangedata {
    float: left;
    background: color('whisper2');
    height: 26px;
    padding: 3px 10px;
    width: 220px;
    margin-right: 5px;
    margin-bottom: 3px;
  }
  .daterange-section {
    margin-top: 0;
    .rangedata {
      background: color('tropical-blue');
      cursor: pointer;
      &.active {
        background: color('alice-blue');
      }
    }
  }
  .alert-danger {
    text-align: center;
    vertical-align: middle;
  }
  .data-rangecalendar,
  .form-rangecalendar {
    .col-item {
      margin: 0 5px 5px 0 !important;
      float: left;
      width: 220px;
      position:unset !important;

    }
    .comparerangepopup{
      position: absolute !important;;
      left: 50% !important;;
      top: 50% !important;;
      -webkit-transform: translate(-50%, -50%) !important;
      transform: translate(-50%, -50%)!important;;
      margin:0 !important;
    }
   .compare-to-date-range{
     width:180px !important;
      }
  }
  .form-rangecalendar {
    max-width: 930px;
    float: left;
    margin: 0 !important;
    .col-item {
      background-color: color('white');
      &.col-item-first {
        margin-left: 0;
        .timeselect {
          width: 220px;
        }
      }
      .timeselect {
        width: 210px;
        border: none;
        background: color('white') url(../images/chi-calendar.svg) no-repeat 2px center;
        -webkit-background-size: 22px auto !important;
        background-size: 22px auto !important;
      }
      position: unset !important;
    }
    .form-group {
      margin-bottom: 0;
    }
    .report-row {
      z-index: 10;
    }
    .daterange-row {
      z-index: 0;
    }
    .col-item-first .reportpopup {
      left: 0;
      right: inherit;
    }
    .col-item-3 .reportpopup,
    .col-item-4 .reportpopup {
      left: inherit;
      right: 0;
    }
  }
  .action-area {
    height: 26px;
    @include flexbox();
    .btn-close,
    .btn-edit,
    .btn-save {
      width: $icon-large;
      height: 26px;
      padding: 0;
      margin-left: 5px;
      cursor: pointer;
      i {
        margin: 0 auto;
      }
      &.active {
        display: block;
      }
    }
    .btn-disabled {
      cursor: not-allowed;
    }
    .btn-reset {
      background: #eeeeee;
      cursor: pointer;
      height: 26px;
      line-height: 26px;
      padding: 0 5px 0 30px;
      i {
        margin: -24px 0px 0px -30px;
      }
    }
  }
  .popupView,
  .popupDowEdit,
  .popupSegmentEdit {
    display: none;
    &.active {
      display: block;
    }
  }
  .table-content {
    padding: 0;
    max-width: 1122px;
    .change-aware-table-wrapper {
      height: 350px !important;
      width: 1122px !important;
    }
  }
  .table-responsive.tableAutoResponsive {
    height: 340px !important;
  }
  .mars-select.yearRangeSelect {
    .multiselect {
      width: 250px !important;
    }
    .multiselect-container,
    .multiselect-container li {
      width: 250px;
    }
  }
  .popupRowColor .trLinkWater {
    background-color: #cbced7 !important;
  }
  .popupRowColor .trHawkesBlue {
    background-color: #d8dbec !important;
  }
  .popupRowColor .trWhiteLilac {
    background-color: #eae6ec !important;
  }
  .popupRowColor .totalcolumn {
    background: #d4d9e8 !important;
  }
  .popupRowColor .trSolitude {
    background: #eff1f7 !important;
  }

  /* table */
  .commonTable {
    &.occRatioTable {

      input {
        padding: 0 5px;
        border-width: 0;
        width: 100%;
      }

      tr {
        .borderd-right {
          border-right: 1px solid color('sapphire') !important;
          &:last-child {
            border-right: none !important;
          }
        }
        .fixcell {
          &:first-child {
            min-width: 175px !important;
            max-width: 175px !important;
          }
          .btn-close {
            margin-top: 1px;
            height: 22px;
            width: 30px;
            i {
              position: relative;
            }
          }
          .btn-edit,
          .btn-save {
            width: auto;
            margin: 1px 0 0 0;
            padding: 0 5px 0 5px;
            height: 22px !important;
            display: inline-block;
            @include border-radius(5px);
            i {
              position: relative;
            }
            &.active, &:hover {
              background: $c-purple;
              color: $c-white;
            }
          }
          .btn-group {
            padding: 0;
            display: none;
            @include flexbox();
            .btn-edit,
            .btn-save {
              cursor: pointer;
              i {
                position: absolute;
                top: 0;
                right: 5px;
              }
            }
            .btn-dayWeekEdit {
              position: relative;
              @include border-radius-all(0, 5px, 5px, 0);
              padding: 3px 30px 0 10px;
            }
            .btn-segmentEdit {
              position: relative;
              @include border-radius-all(5px, 0px, 0, 5px);
              padding: 3px 30px 0 10px;
            }
          }
        }
        th.celledit,
        td.celledit {
          padding: 0 !important;
          margin: 0 !important;
        }
      }
    }
  }

}

.summeryTableResponsive.tableRowColor .totalcolumn {
  background: #d4d9e8 !important;
}

.summeryTableResponsive.tableRowColor .occPerRow.totalcolumn{
  background-color: tablecolor('pattens-blue') !important;
}

.summeryTableResponsive.tableRowColor .trLinkWater {
  background-color: #cbced7 !important;
  border: 0 !important;
}

td.is-fixed-left:not(.is-first-column) {
  z-index: 2;
}

.dialog-guestForecastOccRatioPopup {
  @media (max-width: 960px) {
    max-width: 100% !important;
    width: 95% !important;
    margin: 0 auto !important;
  }
}
/* For change of btn styles */
.resident-guestforecast{
	.btn{
		color: #000000;
		padding: 0 10px;
		background-color: #f2f2f2;
		-webkit-border-radius: 5px;
		-moz-border-radius: 5px;
		-ms-border-radius: 5px;
		-o-border-radius: 5px;
		border-radius: 5px;
	}
	.btn.active {
	  background-color: #f2f2f2;
	  color: #333 !important;
	}
	.btn:hover {
		background-color: #894F76;
		color: #ffffff;
	}
}

.occupancy-help {
  float: right;
  margin-left: 1102px;
  margin-top: -50px;
  position: fixed;
}

.historical-date-range-type-option {
	width: 256px;
	height: 26px;
	display: contents;
	float: left;
	&.WeekRollingOption {
		width: 190px;
		display: none;
		&.active { display: block; }
	}
	&.historicalOption {
		width: 256px;
		&.active { width: 256px; }
		.col-item { margin: 0 5px 0 0 !important; } /* change */
	}
	&.not-edit {
		width: 220px;
		&.weeks {
			display: block;
		}
	}
	.mars-radio {
		float: left;
		height: 26px;
		label {
			padding: 5px 5px 0 5px;
			margin-bottom: 0;
			.color { margin: 0; }
		}
	}
	strong {
		font-weight: normal;
		padding: 3px 0 0 0;
		margin-left: 5px;
		float: left;
	}
	.weekRollingInput {
		width: 40px;
		height: 26px;
		float: left;
		margin-left: 5px;
	}
}