@each $theme in dark, light {

  // @include theme($theme);
  .v-application.#{$theme}-mode {

    .search-box-label {
      margin-bottom: 8px;
    }

    .datepicker-container {
      display: flex;
      align-items: center;
      justify-content: space-between;
      position: relative;
      border-radius: 6px;
      border: solid 1px;
      height: 32px;
      // border-color: #424242;
      border-color: map-deep-get($config, #{$theme}, "tui-datepicker-border-color");

      &.datepicker-large {
        height: 40px;
      }
    
      .v-input {

        // ----------------------
        &.v-input--is-readonly {
          border-color: rgba(0, 0, 0, 0);
          flex-grow: 1;

          &:not(.v-input--radio-group) {
            &:not(.v-input--checkbox) {
              ::v-deep {
                .v-input__slot {
                  background-color: rgba(0, 0, 0, 0) !important;

                  fieldset {
                    border: none;
                  }
                }
              }
            }
          }
        }

        // -------------------
        .v-input__append-outer {
          margin-top: 0;
          margin-left: 0;

          #startpicker-container,
          #endpicker-container {
            width: 100%;
            position: absolute;
            top: 36px;
            left: 0;
          }
        }
      }
    }

    .v-input__custom {
      flex: 0 0 auto;

      &.half {
        width: calc(50% - 20px);
      }

      &.large {
        height: 40px;
      }

      &.datepicker-timeselect {
        border: solid 1px map-deep-get($config, #{$theme}, "tui-datepicker-border-color") !important;
      }

    }
  }
}