@import '../../styles/define';
.hor-date-range-picker{
  .hor-cell-value{
    color: var(--hor-text-color);
    text-align: center;
    .is-placeholder{
      color: var(--hor-placeholder-text-color);
    }
  }

  &.is-disabled{
    cursor: default;
    .hor-cell-value {
    color: var(--hor-disabled-text-color);
    }
  }

  .hor-cell-picker-icon{
    margin-left: 0;
  }
  
  .is-row {
    .hor-cell-value {
    flex-grow: 0;
    white-space: nowrap;
    margin-left: auto;
    span {
      white-space: nowrap;
    }
    }
  }
  .is-column{
    .hor-cell-value{
      margin-top: j(6);
      display: flex;
      justify-content: space-between;
      
      span:nth-of-type(1) {
        text-align: center;
        flex: 1;
        border: 1PX solid var(--hor-border-color);
        border-radius: 2PX;
      }
      span:nth-of-type(2) {
        flex-grow: 0;
      }
      span:nth-of-type(3) {
        text-align: center;
        flex: 1;
        border: 1PX solid var(--hor-border-color);
        border-radius: 2PX;
      }
    }
  }
}

.hor-date-range-picker-connecter {
  color: var(--hor-cell-text-color);
  margin: 0 j(20);
  text-align: center
}

.hor-date-range-picker-clear{
  @extend %bsb;
  @extend %cc;
  padding: 0 j(8);
  font-size: j(16);
  margin-right: j(-8);
}