@use '../../styles/tools'
@use './variables' as *

@include tools.layer('components')
  .v-date-picker-months
    height: $date-picker-months-height

  .v-date-picker-months__content
    align-items: center
    display: grid
    flex: 1 1
    height: inherit
    justify-content: space-around
    grid-template-columns: repeat(var(--v-date-picker-months-columns, 2), 1fr)
    grid-gap: $date-picker-months-grid-gap
    padding-inline-start: 36px
    padding-inline-end: 36px

    .v-btn
      text-transform: none
      padding-inline-start: 8px
      padding-inline-end: 8px
