@use 'sass:list'
@use '../../styles/tools'
@use './variables' as *

.v-list
  overflow: auto
  padding: $list-padding
  position: relative
  outline: none

  @include tools.border($list-border...)
  @include tools.elevation($list-elevation)
  @include tools.rounded($list-border-radius)
  @include tools.theme($list-theme...)

  &--disabled
    pointer-events: none
    user-select: none

  &--nav
    padding-inline-start: $list-nav-padding
    padding-inline-end: $list-nav-padding

  .v-navigation-drawer--rail:not(.v-navigation-drawer--is-hovering) &
    .v-avatar
      --v-avatar-height: 24px

  &--rounded
    @include tools.rounded($list-rounded-border-radius)

  &--subheader
    padding-top: $list-subheader-padding-top

.v-list-img
  border-radius: inherit
  display: flex
  height: 100%
  left: 0
  overflow: hidden
  position: absolute
  top: 0
  width: 100%
  z-index: -1

.v-list-subheader
  $root: &

  align-items: center
  background: inherit
  color: $list-subheader-color
  display: flex
  font-size: $list-subheader-font-size
  font-weight: $list-subheader-font-weight
  line-height: $list-subheader-line-height
  padding-inline-end: $list-subheader-padding-end
  min-height: $list-subheader-min-height
  transition: $list-subheader-transition

  &__text
    overflow: hidden
    text-overflow: ellipsis
    white-space: nowrap

  @at-root
    @include tools.density('v-list', $list-density) using ($modifier)
      $base-padding: list.nth($list-item-padding, 2)

      #{$root}
        min-height: $list-subheader-min-height + ($modifier * $list-subheader-min-height-multiplier)
        padding-inline-start: calc(#{$base-padding} + var(--indent-padding)) !important

  &--inset
    --indent-padding: #{$list-subheader-inset-padding-start}

  .v-list--nav &
    font-size: $list-nav-subheader-font-size

  &--sticky
    background: inherit
    left: 0
    position: sticky
    top: 0
    z-index: 1

.v-list__overlay
  background-color: currentColor
  border-radius: inherit
  bottom: 0
  left: 0
  opacity: 0
  pointer-events: none
  position: absolute
  right: 0
  top: 0
  transition: opacity 0.2s ease-in-out