@use '@style/theme/index.scss' as theme;
@use 'sass:string';
$picker-prefix-cls: string.unquote('#{theme.$prefix}-picker');

@use '@components/date-picker/style/token.scss' as *;

$month-panel-prefix-cls: string.unquote('#{theme.$prefix}-panel-month');
$quarter-panel-prefix-cls: string.unquote('#{theme.$prefix}-panel-quarter');
$year-panel-prefix-cls: string.unquote('#{theme.$prefix}-panel-year');

.#{$month-panel-prefix-cls},
.#{$quarter-panel-prefix-cls},
.#{$year-panel-prefix-cls} {
  box-sizing: border-box;
  width: $picker-panel-month-width;

  .#{theme.$prefix}-picker-date {
    padding: 4px;
  }

  .#{theme.$prefix}-picker-date-value {
    width: 100%;
    border-radius: $picker-panel-cell-boundary-border-radius;
  }

  .#{theme.$prefix}-picker-cell:not(.#{theme.$prefix}-picker-cell-selected):not(
      .#{theme.$prefix}-picker-cell-range-start
    ):not(.#{theme.$prefix}-picker-cell-range-end):not(.#{theme.$prefix}-picker-cell-disabled):not(
      .#{theme.$prefix}-picker-cell-week
    )
    .#{theme.$prefix}-picker-date-value:hover {
    border-radius: $picker-panel-cell-boundary-border-radius;
  }
}