/*  stage-mars tab3 change for responsive view */
.tab3 {
  margin: 0;
  padding: 0;

  ul {
    @include flexbox();
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap;

    li {
      width: 100%;
      padding: 0;

      &.active a {
        background: color('bermuda');
        color: color('black2');
        cursor: pointer;
      }

      @media (min-width: 567px) {
        width: 190px;
        padding: 0 4px 0 0;
      }
    }
  }
}

/*
==========================================================================
    Chimps fbforecast
==========================================================================
*/
/* we have same style in Resident Guestforecast | start */
.fb-forecast {
  font-family: $base-font;

  .commonTable {
    margin-bottom: 0;

    tr {
      th, td {
        min-width: 90px;
        vertical-align: middle; // changed
        &.fixcell:first-child {
          text-align: left;
        }

        &.totalColumn {
          min-width: 110px;
          width: 110px;
        }
      }

      th {
        height: 25px;
        padding: 0 10px !important; // changed
        &.twoCell {
          div {
            padding: 0 10px;
          }

          .btn-close {
            margin-left: 10px;
          }

          .addText {
            padding: 3px 10px;
          }
        }

        &.highlightimpacteventdate {
          background-color: #ffe3a4 !important;
        }
      }

      td {
        padding: 0 10px !important;
        height: 25px;
      }

      // changed
      &.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;
    }
  }
}

/* end */
.ember-table-wrapper-div {
  height: unset;
}

.fb-forecast {
  .gotoselectarea .dropdown-menu {
    z-index: 900 !important;
  }
  .ember-table.mars-ember-table table td.editableCell {
    padding: 0px 0px 0px 0px !important;
  }

  .content {
    padding: 10px 15px 0 15px;
    overflow: hidden;
    min-height: 200px;
  }

  /* update common component to our regular style */
  input[type="text"] {
    padding: 2px 10px;
    height: 26px;
    background: color('cumulus');
    color: color('black2');
    border: 1px solid color('manatee');
    @include placeholder();
    @include border-radius(0);

    &:disabled {
      background: color('white-smoke') !important;
    }

    &:-moz-read-only,
    &:read-only {
      background: color('white') !important;
    }

    &:focus {
      outline: 0;
      -webkit-box-shadow: none;
      box-shadow: none;
    }
  }

  .btn-consolidated,
  .btn-summary {
    float: left;
    background-image: none !important;
    margin: 0 0 0 5px;
  }

  .btn-autoadjust {
    line-height: inherit;
    width: auto;
  }

  .switch {
    margin-right: 0;
  }

  /* tab */
  .tab-pane {
    display: none;

    &.active {
      display: block;
    }
  }

  .mars-radio.active .color i {
    opacity: 1;
  }

  .top-action-area {
    .btn-autoadjust,
    .btn-saveActive {
      height: $icon-large;
      padding: 5px 10px;
      background-color: color('pattens-blue-2');
      color: color('black2');

      &:hover {
        color: color('black2');
      }

      @include border-radius(0);
      margin-left: 10px;
    }

    .banquet-display {
      margin-left: 10px;
    }

    .banquet-report-label {
      height: 30px;
      background-color: #ccecff;
      padding: 5px 10px;
      margin-right: 10px;
    }

    .btn-mealPeriod {
      padding: 0;
      width: 34px;

      i {
        position: relative;
        left: inherit !important;
        right: inherit !important;
        margin: 0 auto;
      }
    }

    .btn-minibar,
    .btn-covers,
    .btn-rev-per,
    .btn-averageChecks {
      padding-right: 10px;
      padding-left: 35px;

      i {
        right: inherit;
        left: 5px;
        top: 3px;
      }
    }

    .broken-chain-icon {
      margin-right: 5px;
      padding: 4px 5px;

      i {
        float: left;
        margin-right: 5px;
      }
    }

    .btn-reset {
      background: color('white-smoke-2');
      padding: 4px 10px 0 10px;
      cursor: pointer;
      display: none;

      &.active {
        display: block;
      }

      i {
        float: left;
        margin-right: 5px;
      }
    }

    .mealPeriodView {
      background: #DCECFF;
      padding: 5px;
      margin-right: 5px;
    }

    .switch-area {
      margin-right: 10px;
    }

    .btn-export {
      background: #F2F2F2 !important;
    }

    .mars-tab {
      margin-bottom: 0;
    }

    @media (max-width: 767px) {
      .mars-tab a {
        margin-bottom: 5px;
      }
      .fillgap {
        flex-grow: unset;
        width: 100%;
        height: 5px;

        &.bg-gray {
          background-color: color("white");
        }
      }
    }
  }

  .singleSelect {
    width: 220px;
    margin: 2px 5px 0 0;
    float: none;
  }

  .metricMealSelect {
    width: 170px;
    margin: 2px 5px 0 0;
  }

  .new-title-bar {
    height: 28px;
    padding: 0 100px 0 10px;
    position: relative;
    margin-bottom: 0;

    .action {
      height: 28px;
      min-width: 34px;
      padding-left: 10px;
      position: absolute;
      right: 10px;
      top: 0;
      z-index: 10;
      @include flexbox();

      .btn-close,
      .btn-edit,
      .btn-save {
        height: $icon-large;
        width: $icon-large;
        display: none;
        cursor: pointer;
        background: none;

        &.active {
          display: block;
        }

        i {
          height: $icon-large;
        }
      }
    }
  }

  .fiscal-range-wrap {
    display: none;
  }

  .fiscal-range {
    padding: 10px 0;

    .fiscal-range__row {
      &.is-summary {
        display: -ms-grid;
        display: grid;
        -ms-grid-template-columns: 164px auto;
        grid-template-columns: 164px auto;

        .fiscal-range__cell {
          width: 164px;

          &.fiscal-range__tilte {
            width: 164px;
          }
        }
      }
    }
  }

  #report.commonDisplayCriteria {
    width: 660px;
    @media (max-width: 767px) {
      .report-row {
        grid-template-columns: auto;
      }
    }
    @media (max-width: 660px) {
      .mars-select {
        float: none !important;
        margin-top: 5px;

        &:first-child {
          margin-top: 0;
        }
      }
    }

    .metricMealSelect {
      width: 203px;
      margin-left: 5px;
    }

    .mealperiodsSelect,
    .daysofweek-select {
      width: 240px;
    }

    .mealperiodsSelect {
      margin-right: 10px;
    }

    .mars-select.lastSubmittedSelect {
      float: left;
      width: 130px;
      display: none;

      &.active {
        display: block;
      }
    }

  }

  #report.fnb-banquet-display-criteria {
    .reportrowcontent .checkmark {
      top: 15px;
    }

    .mars-checkbox input:checked ~ .checkmark:after {
      display: block !important;
    }
  }

  #report.commonDisplayCriteria.fnb-consolidated-criteria {

    .reportrowcontent .checkbox-area > div {
      float: left;
      padding: 0 5px;

      .mars-checkbox input:checked ~ .checkmark:after {
        display: block !important;
      }
    }

    .reportrowcontent .checkmark {
      top: 15px;
    }

    .mars-checkbox {
      padding-bottom: 0px;
    }

    .mars-checkbox input {
      opacity: inherit;
      display: block;
      margin-left: -22px;
    }

    .reportrowcontent .last-submitted {
      width: 130px;
    }

    .report-row .checkmark:after {
      content: "";
      position: absolute;
      display: none;
    }

  }

  #report.commonDisplayCriteria.fnb-summary-display-criteria {
    .reportrowcontent .checkmark {
      top: 15px;
    }

    .mars-checkbox input:checked ~ .checkmark:after {
      display: block !important;
    }

    .reportrowcontent .checkbox-area > div {
      float: left;
      padding: 0 5px;
    }
  }

  &.fnb-forecast-consolidated {
    .top-action-area {
      a.btn-saveActive, a.btn-autoadjust {
        position: relative;
        padding-left: 35px;

        i {
          top: 0;
          position: absolute;
          left: 0;
          right: initial;
        }
      }

      a.btn-saveActive, a.btn-autoadjust, a.btn-export {
        background: #F2F2F2 !important;
      }
    }
  }

  .fnb-forecasting-consolidated-report {
    tr {
      height: 25px;
    }

    tr > td.is-first-column {
      border-right-color: #2b2b2b !important;
    }

    tr > th.headerColumn {
      border-right-color: #2b2b2b !important;
    }

    .Comparecolumn.Last, .Primarycolumn.Last {
      border-right: 1px solid #2b2b2b !important;
    }

    .editableCell input[type="text"] {
      width: 110px;
    }

    height: 372px;
    @media (min-width: 768px) {
      height: 715px;
    }
    @media (min-width: 1024px) {
      height: 372px;
    }
    @media (min-width: 1280px) {
      height: 715px;
    }
    @media (min-width: 1366px) {
      height: 459px;
    }
    @media (min-width: 1400px) {
      height: 741px;
    }
    @media (min-width: 1440px) {
      height: 540px;
    }
    @media (min-width: 1600px) {
      height: 591px;
    }
    @media (min-width: 1680px) {
      height: 695px;
    }
    @media (min-width: 1920px) {
      height: 786px;
    }

  }

  .outlet-links-wrap { // for outlet logic on ui UI 2 - ui 5
    position: relative;
    margin-right: 10px;

    .btn-action {
      margin-right: 0;
    }

    ul {
      display: none;
      width: 450px;
      position: absolute;
      top: 40px;
      z-index: 100;
      background-color: color('white-smoke');
      margin: 0;
      padding: 4px 5px;
      overflow: hidden;

      &.active {
        display: block;
      }

      @media (max-width: 767px) {
        width: 300px;
        li {
          width: 50%;
        }
      }
      @media (max-width: 600px) {
        right: 0;
      }
    }

    li {
      padding: 0 5px;
      float: left;

      span {
        display: block;
        padding: 0 !important;
        line-height: 24px;
        cursor: pointer;

        i {
          float: left;
          width: 30px;
          margin: 0 5px 0 0;
        }
      }
    }
  }

  /* check and change class name */
  .import-status { // for import status on ui 2 - ui 5
    margin: 0 0 0 10px;

    &.dropdown {
      position: relative;

      .dropdown-content {
        width: 280px;
        display: none;
        position: absolute;
        right: 0;
        top: 40px;
        z-index: 10000;
        background-color: color('white-smoke');
        padding: 10px;
        margin: 0;
        overflow: hidden;

        .import-title {
          text-decoration: underline;
        }

        ul {
          margin: 5px 0 0 0;
          padding: 0;

          li {
            @include flexbox();

            span {
              width: 135px;
            }

            &.overweekdata {
              color: red;
            }
          }
        }
      }

      &:hover .dropdown-content {
        display: block;
      }
    }
  }

  /* table */
  .table-responsive {
    overflow-x: unset;
    max-height: unset;

    &.summeryTableResponsive { // for ui 4
      max-width: 1402px;
    }
  }

  .commonTable {
    tr {
      th,
      td {
        &.fixcell {
          &:first-child {
            min-width: 195px !important;
            width: 195px !important;
            max-width: 195px !important;
          }

          .addBtn {
            padding: 1px 10px;
          }
        }
      }

      td.celledit {
        padding: 0 !important;

        input {
          border: 1px solid color('very-light-grey');
          font-size: 13px !important;
          text-align: center !important;
        }
      }
    }

    .btn-group {
      display: none;

      &.show {
        @include flexbox();
      }

      .btn-edit, .btn-save {
        margin-top: 1px;
      }
    }

    .btn-close {
      width: 22px;
      height: 22px;
    }

    /* new change */
    .negativeValue {
      background-color: color('sundown') !important;
    }

    .positiveValue {
      background-color: color('tea-green') !important;
    }

    tr.otbrow td.fixcell:first-child {
      padding-left: 33px !important;

      .btn-popup {
        text-decoration: underline;
        cursor: pointer;
      }

    }

    td.banquet-status:first-child {
      padding-left: 33px !important;
      text-decoration: underline;
      cursor: pointer;
    }

    td.banquet-less:first-child {
      padding-left: 33px !important;
    }

  }

  .consolidatedMaxTable { /* for ui 2 & ui 3 */
    tr {
      .icon-collapse,
      .icon-cirle {
        position: absolute;
        left: 10px;
        top: 0;
        display: block;
      }

      .icon-collapse { /* new change */
        padding: 2px 0;
      }

      .icon-cirle {
        padding: 7px 5px; /* new change */
        i {
          width: 10px;
          height: 10px;
          display: block;
          @include border-radius(50%);
          background-color: color('atlantis');
        }
      }

      th {
        .btn-save,
        .btn-edit {
          float: left;
          min-width: unset;
        }

        max-width: 100px !important;
        @include text-with-ellipsis();
      }

      th,
      td {
        &.fixcell {
          height: 23px;
          min-width: 185px !important;
          width: 185px !important;
          padding-left: 35px !important;
          border-right: 1px solid color('sapphire') !important;

          &:first-child {
            min-width: 185px !important;
            width: 185px !important;
          }

          &.totalColumn {
            min-width: 110px !important;
            width: 110px !important;
          }

          &.fixcell-add-button {
            padding: 1px 10px 0 10px !important;

            .btn-close {
              float: left;
              margin-left: 10px;
            }
          }
        }

        &.colspanset,
        &.borderd-right {
          border-right: 1px solid color('sapphire') !important;

          &.vrcell,
          &.dfcell {
            border-right: none !important;
          }
        }
      }

      &.mealperiodrow {
        td.fixcell {
          padding-left: 45px !important;
        }
      }
    }

    &.editViewTable { // for ui 3 edit view 1,2 & 3
      .resnrcell,
      .checksplitcell,
      .allrevcell,
      .vrcell,
      .revcontcell {
        display: table-cell;
      }

      td.fixcell {
        padding-left: 10px !important;
      }

      .colspanset,
      .borderd-right {
        &.vrcell,
        &.dfcell {
          border-right: 1px solid color('sapphire') !important;
        }

        &:last-child {
          border-right: none !important;
        }
      }
    }

    &.editViewDot { // for ui 3 edit view 3
      .icon-cirle {
        position: relative;
        left: inherit;
        top: inherit;
        width: 20px;
        height: 20px;
        display: block;
        float: left;
        padding: 5px 5px;
        margin-right: 5px;
      }

      .mealperiodrow {
        td.fixcell {
          padding-left: 10px !important;
        }
      }
    }
  }

  /* table row */
  .mealperiodrow, .acsplitcell, .acpercentcell, .rgsrow, .actualstlyrow, .resnrcell,
  .checksplitcell, .allrevcell, .vrcell, .revcontcell, .otbrow, .summaryrow, .outletrow, .outletmeal,
  .cateringrow, .cateringmeal, .conferenceServiceRow, .socialCateringRow, .offSiteCateringRow {
    display: none;
  }

}


/*fb-summary style*/
.fb-forecast .fnb-forecasting-summary-report {
  height: 100% !important;
}

/* utilities */
.utilities {
  margin-top: 6px;
  overflow: auto;

  .utilities__wrap {
    max-width: 100%;
    float: left;
  }

  .utilities-edit,
  .save-utilities-view, /* remove */
  .utilities-view {
    margin-top: 10px;
    display: none;

    &.active {
      display: block;
    }

    padding-bottom: 100px;
    overflow: auto;

    .gotoselectarea .dropdown-menu {
      z-index: 900 !important;
    }
  }

  .utilities__group,
  .utilities__subgroup,
  .utilities__row,
  .utilities__column__row {
    margin-top: 2px;

    &:first-child {
      margin-top: 0;
    }
  }

  .utilities__row {
    display: -ms-grid;
    display: grid;
    -ms-grid-template-columns: 170px auto;
    grid-template-columns: 170px auto;
    grid-column-gap: 2px;
  }

  .utilities__row-time {
    -ms-grid-template-columns: 170px auto;
    grid-template-columns: 170px auto;
    grid-column-gap: 2px;

    .utilitiesYearSelect {
      width: 120px;
      margin-bottom: 0;
      float: left;
    }

    .multiselect-native-select .multiselect-container {
      min-width: 0;
    }

    .utilities__cell-head {
      background: color('pattens-blue-2') !important;
    }

    // changed
  }

  .utilities__column {
    display: -ms-grid;
    display: grid;
  }

  .utilities__column__row {
    display: -ms-grid;
    display: grid;
    grid-column-gap: 2px;
  }

  .utilities__cell {
    display: block;

    &.text-right {
      text-align: right;
    }

    &.text-center {
      text-align: center;
    }

    &.utilities__cell-head {
      background-color: color('clear-day');
      padding: 3px 10px;
    }

    &.data {
      padding: 3px 10px;
      border: none;
    }

    &.data-border {
      padding: 2px 10px;
      clear: both;
      overflow: hidden;
      border: 1px solid color('manatee');
      width: 100%;
      background: color('white');
    }

    &.data-gray {
      padding: 3px 10px;
      border: none;
      background: $c-gray5;
    }

    &.is-historical {
      @include flexbox();
      justify-content: space-around;

      &:first-child {
        justify-content: flex-end;

        strong {
          margin: 0;
          padding: 3px 0 0 0;
          height: 26px;
          width: 70px;
        }

        span,
        .form-control {
          width: 50px;
          text-align: center;
        }
      }
    }

    &.datacheck {
      padding: 3px 10px;
      justify-content: center;
      background: $c-gray5;

      .mars-checkbox {
        margin: 0 auto;
        padding: 5px 0;
        display: block;
        width: 20px;
        height: 20px;
      }
    }

    .chi-tic {
      -webkit-background-size: 14px 14px !important;
      background-size: 14px 14px !important;
      margin: 0 auto;
    }
  }

  .utilities__cell__group {
    @include flexbox();
  }

  .utilities__row-title .utilities__column .utilities__cell {
    background: color('tropical-blue') !important;
    text-align: center;
    font-family: $base-font-semibold;
  }

  .utilities__row-subtitle .utilities__column .utilities__cell {
    background: color('hint-green') !important;
    font-family: $base-font-semibold;
  }

  .utilities__row-rev {
    background: color('hawkes-blue-2');
  }

  .utilities-list {
    padding: 0;
    margin: 0;

    li {
      float: left;

      &:first-child:before {
        display: none;
      }

      &:before {
        content: '';
        width: 1px;
        height: 15px;
        display: block;
        float: left;
        background: color('black');
        margin: 3px 5px 0 5px;
      }
    }
  }

  .mars-radio {
    .color {
      margin: 0;
    }

    label {
      margin-bottom: 0;
    }
  }

  .utilitiesSelect {
    width: 188px;
    margin-bottom: 0;
  }

  .weekRollingInput {
    width: 40px;
    float: left;
    margin-right: 5px;
    padding: 2px 10px;
    height: 26px;
    @include border-radius(0);
  }

  .div-week-rolling {
    margin-right: 5px;

    .input-edit-week-rolling {
      margin-right: 0;
    }
  }

  strong {
    font-weight: normal;
    font-family: $base-font;
    padding: 3px 0 0 0;
    margin-right: 5px;
  }

  .multiselect-native-select {
    margin: 0;
  }

  .btn-reset {
    display: block;
    margin-left: 10px;

    i {
      float: left;
      margin-right: 5px;
    }
  }

  // changed
  .utilities-outlet {
    .utilities__row {
      -ms-grid-template-columns: 170px auto;
      grid-template-columns: 170px auto;
    }

    .utilities-edit {
      .utilities__column__row {
        -ms-grid-template-columns: 170px 526px;
        grid-template-columns: 170px 526px;
      }
    }

    .utilities-view {
      .utilities__column__row {
        -ms-grid-template-columns: 170px 200px;
        grid-template-columns: 170px 200px;
      }
    }
  }

  .utilities-completion {
    .utilities__row {
      -ms-grid-template-columns: 170px 170px;
      grid-template-columns: 170px 170px;

      &.utilities__row-time {
        -ms-grid-template-columns: 170px 400px;
        grid-template-columns: 170px 400px;
      }
    }
  }

  .utilities-mapping {
    .utilities__row {
      -ms-grid-template-columns: 170px auto;
      grid-template-columns: 170px auto;
      grid-column-gap: 2px;
      margin-top: 2px;

      &:first-child {
        margin-top: 0;
      }

      &.new-maping-row {
        background: color('solitude2');

        .utilities__cell-head {
          background: color('solitude2');
        }
      }
    }

    .utilities__row-title .utilities__cell {
      position: relative;
    }

    .utilities__column__row {
      display: -ms-grid;
      display: grid;
      -ms-grid-template-columns: 170px 200px 150px 150px;
      grid-template-columns: 170px 200px 150px 150px;
      grid-column-gap: 2px;
      margin-top: 2px;

      &:first-child {
        margin-top: 0;
      }
    }

    .utilities__cell {
      min-height: 26px;

      &.is-checkbox {
        @include flex-center(center, center);

        .mars-checkbox {
          margin: 0;
          padding: 5px 0px 5px 24px;
        }
      }

      .utilities__cell__input {
        display: -ms-grid;
        display: grid;
        -ms-grid-template-columns: 30px 110px 30px;
        grid-template-columns: 30px 110px 30px;
        grid-column-gap: 0;
        position: relative;
      }

      .btn-deletecell {
        width: 30px;
        height: 26px;
        display: block;
        right: 0;
        top: 0;
      }

      .btn-add {
        height: 28px;
        width: 26px;
        display: block;
        position: absolute;
        top: 0;
        right: 0;
      }

      .btn-hand {
        width: 30px;
        height: 26px;
        display: block;
        background: color('solitude2');
      }
    }

    .ui-sortable-helper {
      margin-top: 0 !important;
    }

    .ui-sortable-placeholder {
      min-height: 26px !important;
      margin: 0 0 0 0 !important;
    }

    .maprowblank {
      background-color: #e4e4e4;
      height: 26px;
      margin: 2px 0 0 0;
    }
  }

  .new-title-bar {
    .action {

      .btn-close,
      .btn-save {
        height: $icon-large;
        width: $icon-large;
        display: block;
        cursor: pointer;
        background: none;

        &.active {
          display: block;
        }

        i {
          height: $icon-large;
        }
      }
    }
  }

  /* utilities-assign-event start */
  .utilities-assign-event {
    .utilitiesYearEventSelect {
      width: 120px;
      margin-bottom: 0;
      float: left;
    }

    .multiselect-native-select .multiselect-container {
      min-width: 0;
    }

    .utilities__row {
      -ms-grid-template-columns: 200px 554px;
      grid-template-columns: 200px 554px;
    }

    .utilities__cell.bg-white-smoke {
      background-color: color("white-smoke");
    }

    .utilities__cell__group {
      float: left;
      padding: 0 5px;

      .mars-checkbox {
        padding: 3px 0px 3px 24px;
        margin-bottom: 0;
      }
    }

    .custom-avg-check {
      .utilities__cell-head_one {
        background-color: color("clear-day") !important;
      }

      margin-top: 10px;

      .utilities__cell-head {
        background-color: color("tropical-blue") !important;
        text-align: center;
        font-family: $base-font;
      }

      .assign-event-check-table {
        overflow-x: hidden !important;
        overflow-y: hidden !important;
      }

      table {
        border-collapse: separate;
        border-spacing: 1px;

        tr {
          height: 26px !important;
          margin-top: 10px !important;
          line-height: 22px !important;

          th:first-child, td:first-child {
            text-align: left;
            padding-left: 10px;
          }

          th:not(:first-child) {
            text-align: center !important;
          }

          td:not(:first-child) {
            border: #8f91a2 1px solid;
            padding: 2px 10px;
            box-sizing: border-box;
            background-color: #FFFFFF !important;
            text-align: center !important;

            input[type="text"] {
              width: 100%;
              border: none;
            }

          }
        }

      }
    }
  }

  /* utilities-assign-event end */
}

/* fb forecast popup */
/*
Note:
---------------------------------------------------------------------------------------
getting style from class "guestForecastOccRatioPopup" in "resident-guest-forecast.scss"
---------------------------------------------------------------------------------------
*/
.fbForecastPopup {
  .miss-error {
    display: block;
    position: absolute;
    right: 0;
    top: 0;
  }

  .btn-go {
    display: inline-block;

    .chi-go {
      @include iconCustomSize(26px, 26px, 26px, 26px);
    }
  }

  .rev-data {
    color: color("neon-blue");
  }

  .pupup-content {
    position: relative;
    min-height: 270px;
  }

  .section-row:first-child {
    margin-top: 0;
  }

  .section-row:last-child {
    margin-bottom: 5px;
  }

  .disabled {
    //display: block;      /* commented for calendar disable dates issue*/
    cursor: not-allowed;
    pointer-events: none;
  }

  input[type="text"] {
    padding: 2px 10px;
    height: 26px;
    background: color('cumulus');
    color: color('black2');
    border: 1px solid color('manatee');
    @include placeholder();
    @include border-radius(0);

    &:disabled {
      background: color('white-smoke') !important;
    }

    &:-moz-read-only,
    &:read-only {
      background: color('white') !important;
    }

    &:focus {
      outline: 0;
      -webkit-box-shadow: none;
      box-shadow: none;
    }

    &.form-control {
      @include border-radius(0);
      border: 1px solid $c-border;
      background: $c-input;
    }
  }

  .radioDate.disabled {
    display: none;
  }

  .rangedata.disabled {
    cursor: not-allowed;
    opacity: 1 !important;
    background: $c-gray5;
  }

  .btn-reset,
  .event-dropdown span {
    display: block;
    float: left;
    height: 26px;
    padding: 3px 10px 3px 30px;
    position: relative;
    background: color('whisper2');
    cursor: pointer;

    i {
      position: absolute;
      left: 0;
      top: 0;
      width: 30px;
    }
  }

  .import-event-list {
    float: left;
    margin-right: 5px;
  }

  .event-dropdown {
    position: relative;

    .event-dropdown__content {
      width: 200px;
      display: none;
      position: absolute;
      left: 0;
      top: 26px;
      z-index: 10000;
      background-color: color('white-lilac');
      padding: 10px;
      margin: 0;
      overflow: hidden;

      .event-dropdown__title {
        text-decoration: underline;
      }

      ul {
        padding: 0;
        margin: 5px 0 0 0;

        li {
          @include flexbox();

          span {
            width: 135px;
          }

          &.overweekdata {
            color: color('red');
          }
        }
      }
    }

    &:hover .event-dropdown__content {
      display: block;
    }
  }

  .session-dropdown {
    float: left;
    position: relative;
    margin-right: 5px;

    &.dropdown.open,
    &.dropdown {
      .btn,
      .dropdown-menu {
        width: 225px;
        border: 1px solid color('manatee');
        border-radius: 0;
      }

      .btn {
        height: 26px;
        background: color('white');
        color: color('black2');
        text-align: left;
        position: relative;

        .caret {
          position: absolute;
          top: 10px;
          right: 5px;
        }
      }

      .dropdown-menu {
        min-width: inherit;
        margin-top: 0;
        max-height: 90px;
        overflow-y: auto;

        li {
          padding: 0 10px;
        }
      }
    }
  }

  .form-rangecalendar {
    .reportpopup {
      margin: auto !important;
      position: absolute;
      top: 0;
      left: 0;
      bottom: 0;
      right: 0;
      height: 290px;
    }

    .timeselect p {
      margin: 0;
    }

    .col-item.col-item-single {
      margin: 0 5px 0 0 !important;
    }
  }

  .rangecalendar-group .form-rangecalendar {
    .col-item {
      .timeselect {
        position: relative;
      }

      &:first-child {
        padding-right: 30px;

        .btn-deletecell {
          display: block;
          right: 0;
        }
      }
    }
  }

  .section-right {
    flex-wrap: wrap;
    max-width: 740px;
  }

  .historical-row {
    flex-basis: 100%;

    .col-item {
      background-color: transparent !important;
    }

    &:after {
      content: '';
      display: table;
      clear: both;
    }

    &.rangecalendar-group {
      padding-left: 27px;
      margin-top: 5px;
    }

    /* change */
    &.form-rangecalendar-group {
      padding-left: 26px;

      &.view-group {
        padding-left: 0px !important;
      }
    }

    .timeselect {
      border: 0 !important
    }

    .form-rangecalendar {
      margin: 0 10px 5px 0 !important;
    }
  }

  .historical-row:first-child .timeselect {
    width: 220px
  }
;

  .historical-row:nth-child(2) {
    padding-right: 5px;

    .form-rangecalendar {
      .timeselect {
        width: 220px;
      }

      .btn-deletecell {
        margin-left: 0px;
        right: -7px;
      }
    }
  }

  .historical-option {
    width: 256px;
    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 */
    }

    .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-right: 5px;
      float: left;
    }

    .weekRollingInput {
      width: 40px;
      float: left;
      margin-right: 5px;
    }
  }

  .item-group {
    @include flexbox();

    .item {
      float: left;
      margin-right: 10px;
      display: -ms-grid;
      display: grid;
      -ms-grid-template-columns: 122px 200px;
      grid-template-columns: 122px 200px;
      grid-column-gap: 10px;

      .popMealPeriodSelect {
        margin-bottom: 0;

        &.disable {
          cursor: not-allowed;

          .multiselect-container {
            display: none;
          }

          .multiselect {
            background: color('whisper2') !important;
            cursor: not-allowed;
          }
        }
      }

      .head-label {
        min-width: 0;
        width: 122px;
      }
    }

    .search-box {
      position: relative;

      i {
        position: absolute;
        left: 0;
        top: 0;
        @include iconCustomSize(26px, 26px, $icon-small, $icon-small);
      }

      .form-control {
        height: 26px;
        border-radius: 0;
        color: color('black2');
        border: 1px solid color('manatee');
        cursor: pointer;
        padding: 0 10px 0 40px;
      }

      &.disable {
        cursor: not-allowed;

        .form-control {
          background: color('whisper2') !important;
          cursor: not-allowed;
        }
      }
    }
  }

  .popupTotalEdit {
    display: none;

    &.active {
      display: block;
    }
  }

  .table-content {
    max-width: 1202px;
    margin-top: 11px;
  }

  .table-responsive {
    height: auto !important;
    max-height: 340px !important;
  }

  .commonTable {
    tr {
      th,
      td {
        width: 90px;
        padding: 0 10px !important;
        vertical-align: middle;
      }

      td.celledit input {
        border: 1px solid color('very-light-grey'); /* height: 23px; */
      }

      td {
        height: 25px !important;
        white-space: inherit !important;
      }
    }

    .trHead td {
      height: auto !important;

      span {
        float: left;
        margin-right: 10px;
      }
    }

    .addBtn {
      .btn-edit,
      .btn-save {
        top: 1px;
        background-color: color('white') !important;
      }
    }
  }

  &.eventBookingPopup {
    .btn-edit,
    .btn-save {
      display: none;

      &.active {
        display: block;
      }
    }

    .tableRowColor td.totalColumn {
      text-align: left;
    }

    .banquetEventSearch {
      grid-template-columns: 122px 240px;
    }

    .banquetEventPopupTable {
      height: 400px !important;

      .is-first-column div.et-cell-container, .is-first-column div.et-cell-content {
        overflow: visible !important;
      }
    }

    .table-content {
      max-width: 1220px;
    }
  }
}

/* reset data popup */
.reset-data-popup {
  padding: 0 !important;
  display: none;

  .mars-radio {
    &:hover, &.active {
      background: none !important;
    }
  }
}

/* autoadjust-popup */
/*
Note:
---------------------------------------------------------------------------------------
getting updated style from "roomforcasting.scss"
---------------------------------------------------------------------------------------
*/
.autoadjustSessionPopup.fnb-autoadjust-popup {
  // display: none;
  padding: 0 0 0 0 !important;
  overflow: hidden !important;
  .help-integration {
    width: 33px !important;
    height: 30px !important;
  }

  .ui-dialog-titlebar {
    margin-bottom: 20px;
  }

  .dialog-box-help {
    margin-left: 40px !important;
  }

  .mars-select .multiselect-container {
    max-height: 120px !important;
  }

  .form-group {
    margin-bottom: 0;
  }

  input[type="text"] {
    color: color('black2');
  }

  input[readonly].form-control {
    background: color('white') !important;
  }

  .mars-select .multiselect-container { /* For only HTML | You may remove this */
    -webkit-box-shadow: none;
    box-shadow: none;
    max-height: 120px;

    li.disabled { /* please check "input.scss", "disabled" class  "display: block !important;"  */
      display: none !important;
    }
  }

  .btn-help {
    width: $icon-large;
    height: $icon-large;
    display: block;
    position: absolute;
    top: 0;
    right: 45px;
  }

  .autoadjust {
    width: auto;
    margin-top: 10px;

    .blocktab {
      width: 950px;
      max-height: 350px !important;
      overflow: auto;
    }

    .autoadjust-top {
      width: 858px; //padding-bottom: 5px;
      .top-row {
        overflow: hidden;
        margin-top: 5px;

        &:first-child {
          margin-top: 0;
        }

        .headtext {
          margin-top: 0;
        }
      }
    }

    .autoadjust-top .headtext {
      background: color("pattens-blue-2");
      color: color("black2");
      @include border-radius(0);
      padding: 0 7px;
      margin-top: 10px;
      height: 30px;
      line-height: 30px;
      width: 154px;
      text-align: center;
      display: block;
      float: left;
    }

    .block {
      .block-title {
        width: 150px;
      }

      .block-input {
        margin-left: 160px;

        &.block-input-center {
          margin-left: 0;
          @include flexbox();
          justify-content: center;

          span {
            padding: 3px 0;
          }
        }

        .column {
          width: 48%;
          float: right;
          position: relative;

          &:first-child {
            float: left;
          }

          &.percent-column i {
            right: 15px;
            top: 3px;
            font-style: normal;
            position: absolute;
          }

          span {
            display: block;
            height: 26px;
            padding: 3px 10px;
            text-align: center;
            font-family: $base-font-semibold;
          }

          .form-control {
            padding: 0 10px 0 10px;
            margin-left: 0;
            width: 100%;
          }

          &.add-percent {
            .form-control {
              padding: 0 30px 0 10px;
            }
          }
        }

        .data {
          display: block;
          float: left;
          width: 100px;
          padding: 3px 10px;
          background: #e2f0d9;
          height: 26px;
          width: 60px;
          text-align: center;
        }

      }
    }

    .block-row--metrics-type {
      display: -ms-grid;
      display: grid;
      -ms-grid-template-columns: 150px 1fr;
      grid-template-columns: 150px 1fr;
      grid-column-gap: 10px;

      .block-title {
        height: 100% !important;
      }

      .block-input {
        margin-left: 0;

        .mars-select {
          margin-top: 4px;
          clear: both;
        }
      }
    }

    .form-control.department-input {
      width: 100%;
      margin-left: 0;
      text-align: left;
      background: color("white") !important;
    }

    .overrideDataTypeSelect {
      background-color: white !important;
      color: black !important;

      option.disabled {
        color: color('very-light-grey');
      }
    }
  }

  .left-block {
    width: 424px !important;
    float: left !important;
  }

  .right-block {
    width: 490px !important;
    margin-right: 5px;
    float: right !important;

    .before-after-change {
      border: none;
      font-weight: normal;
      overflow: hidden;
      background: $c-white;
      margin-top: 10px;

      .row {
        padding: 0;
        margin: 1px 0 0 0;

        &.head-row {
          margin: 0;
          position: relative;

          &:before {
            content: '';
            width: 100%;
            height: 1px;
            display: block;
            background: $c-blue3;
            position: absolute;
            left: 34%;
            bottom: -1px;
          }
        }

        .head-cell,
        .cell {
          padding: 5px 10px;
          width: 22%;
          float: left;
          border-left: 1px solid $c-white;
          position: relative;
          text-align: center;
          height: 24px;
        }

        .head-cell {
          height: 26px;
          background: #dcedff;

          &:first-child {
            border-left: none;
            width: 34%;
          }
        }

        .cell {
          padding: 2px 5px;
          background: $c-gray4;

          &:first-child {
            background: #b3c6e8;
            border-left: none;
            text-align: center;
            padding: 2px;
            width: 34%;

            &:before {
              content: '';
              width: 1px;
              height: 110%;
              display: block;
              background: $c-blue3;
              position: absolute;
              top: -1px;
              right: -1px;
              z-index: 100;
            }

          }

          &.cell2 {
            background: $c-white6;
          }

          &.cell3 {
            background: $c-lgreen2;
          }
        }
      }
    }
  }

  .new-title-bar {
    h2 {
      padding: 3px 0;
    }

    margin-bottom: 4px;
    text-align: center;
  }

  .block-content {
    padding: 10px;
  }

  .blocktab {
    &.show {
      display: block !important;
    }
  }

  .righttop {
    padding: 2px 0;
  }

  .mars-radio {
    float: left;

    label {
      padding: 3px 5px 3px 5px;
      margin-bottom: 0;
      cursor: pointer;
    }
  }

  .block-input .mars-radio.active,
  .block-input .mars-radio:hover {
    background: transparent !important;
  }

  .checkbox-area {
    div {
      float: left;
      padding: 0 5px 0 0;
      margin: 0;

      .mars-checkbox {
        display: block;
        margin: 0 !important;
        padding: 3px 0px 3px 23px;
      }
    }
  }

  .daterange-row {
    min-height: 218px;
  }

  .top-position .mars-select .multiselect-container {
    top: inherit;
    bottom: 0;
  }

  .left-block-auto {
    width: auto !important;
  }

  .block-bottom {
    padding-bottom: 0;
    @include flexbox();
    justify-content: center;
    clear: both;

    .btn-dialog-popup {
      margin: 0 5px;
      min-width: 74px;
      background-color: #d8dbec !important;

      &:hover {
        background-color: #80cbc4 !important;
      }
    }
  }

  .restore-row {
    display: -ms-grid;
    display: grid;
    -ms-grid-template-columns: 200px auto;
    grid-template-columns: 200px auto;

    .check-missing {
      .form-control {
        float: left;
        width: 60px;

        &:read-only {
          background-color: color('white') !important;
          text-align: center;
          color: red;
        }
      }

      .input-title {
        float: left;
        display: block;
        background: color('tropical-blue');
        padding: 3px 10px;
        margin-right: 10px;
        height: 26px;
      }
    }
  }

  .column-group {
    display: -ms-grid;
    display: grid;
    -ms-grid-template-columns: 205px 175px 175px;
    grid-template-columns: 205px 175px 175px;
    grid-column-gap: 10px;

    &:after {
      display: none;
    }

    .column-title {
      background-color: color("hint-green");
      padding: 3px 10px;
      font-family: $base-font-semibold;
      text-align: center;
    }

    .column {
      display: block;

      &:first-child {
        .form-control {
          width: 45px;
          margin-left: 10px;

          &:read-only {
            background-color: color('white') !important;
            text-align: center;
          }
        }
      }
    }
  }

  .dateRangeRow {
    display: none;

    &.active {
      display: block;
    }
  }

  .cal-width {
    width: 477px;
    margin-left: 0 !important;
  }

  .block-row {
    margin-top: 4px;

    &:first-child {
      margin-top: 0;
    }

    &.top-position {
      .commonselect .multiselect-container {
        top: inherit;
        bottom: 0;
      }
    }
  }
}

.reset-forecast-popup {
  .ui-dialog {
    width: unset;
  }

  .departmentBlock {
    display: flex;
    margin-top: 10px;

    .block-title {
      background: color("pattens-blue-2");
      color: color("black2");
      @include border-radius(0);
      padding: 0 26px 0px 4px;
      height: 30px;
      line-height: 30px;
      text-align: center;
      display: block;
      float: left;
    }

    .block-input {
      margin-left: 15px;

      .mars-select {
        width: 200px;

        &.active {
          display: block;
        }
      }
    }

  }

  .radio-wrap {
    display: flex;
    flex-direction: row-reverse;

    .mars-radio:nth-child(2) > label > span {
      background-color: color(olivine) !important;
    }

    .mars-radio:nth-child(1) > label > span {
      background-color: color(monaLisa) !important;
    }
  }
}

.top-action-area .fillgap {
  &.relink {
    margin-left: 5px !important;
    margin-right: 5px !important;
  }
}

.ui-resizable {
  @media (max-width: 960px) {
    max-width: 95%;
  }
}

/* fnb forecasting department popup */
#revPerOpHr-dialog-popup {
  .ember-table .ember-table-overflow {
    height: unset !important;
    max-height: 350px !important;
  }
  .fbForecastPopup {
    margin: 0 10px !important;
    padding-bottom: 0 !important;
  }
}

.ui-dialog.fnb-autoadjust-popup, .ui-dialog.fbforecast.dialog-outletCoverCapturePopup, .ui-dialog.banquetEventUiDialog {
  top: 50px !important;
}
#autoAdjust-dialog-popup {
  height: auto !important;
  min-height: 130px !important;
  max-height: 500px !important;
}

/* Banquet Event-Status popup */
#banquet-dialog-popup {
  overflow: hidden !important;
  .ember-table .ember-table-overflow {
    height: unset !important;
    max-height: 370px !important;
  }
  .eventBookingPopup {
    padding: 10px 0 0 0 !important;
    .pupup-content {
      min-height: 150px !important;
    }
    .banquetEventPopupTable {
      height: unset !important;
      margin: 0 !important;
    }
  }
}



.utilities {
  .mars-select .multiselect-container { min-width: unset; }
  .mars-select .multiselect-container li.disabled { /* please check "input.scss", "disabled" class  "display: block !important;"  */
    display: none !important;
  }
  /* common updates start */
  .mars-radio.active, .mars-radio:hover { background: none !important; }
  .utilities__row-title .text-center { justify-content: center; }
  .new-title-bar {
    height: 30px;
    padding: 0 100px 0 10px;
    position: relative;
    margin-bottom: 0 !important;
    .action {
      height: 30px;
      min-width: 34px;
      padding-left: 10px;
      position: absolute;
      right: 10px;
      top: 0;
      z-index: 10;
      @include flexbox();
    }
    .btn-close,
    .btn-edit,
    .btn-save {
      &.active {
        display: inline-flex !important;
        background-color: transparent !important;
      }
    }
  }
  .utilities__cell-historical  {
    display: flex !important;
    gap: 0 10px;
  }
  .utilities__cell__group {
    strong {
      padding: 3px 0 0 0;
      margin: 0 5px 0 0;
    }
    .year-select {
      width: 125px;
      .btn-group { width: 125px !important; }
    }
    .weekRollingInput { width: 50px; }
    .utilitiesSelect {
      width: 188px !important;
      .multiselect-native-select,
      .btn-group { width: 100% !important; }
    }
  }
  /* common updates end */

  /* utilities outlet change */
  .utilities-outlet {
    input[type="text"]{ &:disabled { background-color: color("white") !important; } }
    .utilities__column__row {
      -ms-grid-template-columns: 182px 300px !important;
      grid-template-columns: 182px 300px !important;
    }
    .utilities-edit .utilities__column__row {
      -ms-grid-template-columns: 182px 740px !important;
      grid-template-columns: 182px 740px !important;
    }
  }
}
