.n-options-month
  .n-options-date-header
    padding-left 24px
    padding-right @padding-left
  &-main
    display flex
  &-calendar
    width 220px
    padding 0 16px 8px
    display flex
    flex-wrap wrap
  &-item
    width 30%
    flex auto
    margin 8px 0
    text-align center
.n-options-month-item
  &-value
    n-font-m()
    width 38px
    border-radius 4px
    text-align center
    transition all .2s ease
    border 1px solid transparent
    color #cccfd3
    display inline-block
  &-disabled
    cursor not-allowed
  &-available
    color $n-color-1
    cursor pointer
  &-available:hover
    background-color #E2EEFF
  &-active
    color white
    background-color $primary-color
  &-current
    border-color $primary-color



// 范围
.n-options-month-item-range
  position relative
  &:before
    content ''
    background-color #e8f7ff
    position absolute
    top 0
    right 0
    bottom 0
    left 0
  .n-options-month-item-value
    position relative
    z-index 1
  &-start:before
    left 13px
    border-radius 4px 0 0 4px
  &-end:before
    right 13px
    border-radius 0 4px 4px 0
  &-start .n-options-month-item-value
  &-end .n-options-month-item-value
    color white
    background-color $primary-color