@import '../custom.less';

@time-select-prefix-cls: ~'@{css-prefix}time-select';
@picker-panel-prefix-cls: ~'@{css-prefix}picker-panel';
@time-select-scrollbar-cls: ~'@{css-prefix}scrollbar';

.@{time-select-prefix-cls} {

  &.not-match-height {
    height: 36px;
  }
  height: 252px;
  padding-top: 6px;
  border-radius: 8px;
  .@{time-select-scrollbar-cls} {
    height: 100%;
  }

  .@{scrollbar-prefix-cls}__wrap {
    @apply p-0;
    @apply !mb-0;
  }

  & &__item {
    @apply text-color-text-primary;
    @apply py-0 px-4;
    @apply text-xs;
    @apply leading-10;

    &:not(.disabled):hover {
      @apply bg-color-bg-4;
      @apply cursor-pointer;
    }

    &.selected:not(.disabled) {
      @apply text-color-brand;
      @apply bg-color-bg-1;

      &:hover {
        @apply bg-color-bg-4;
      }
    }

    &.disabled {
      @apply text-color-text-disabled;
      @apply cursor-not-allowed;

      &.selected {
        @apply text-color-brand-disabled;
      }
    }
  }

  .@{picker-panel-prefix-cls} {
    &__content {
      .no-match {
        text-align: center;
      }
    }
  }
}
