:root,
:host, body {
    --van-popover-arrow-size: 6px;
    --van-popover-radius: var(--van-radius-lg);
    --van-popover-action-width: 128px;
    --van-popover-action-height: 44px;
    --van-popover-action-font-size: var(--van-font-size-md);
    --van-popover-action-line-height: var(--van-line-height-md);
    --van-popover-action-icon-size: 20px;
    --van-popover-horizontal-action-height: 34px;
    --van-popover-horizontal-action-icon-size: 16px;
    --van-popover-light-text-color: var(--van-text-color);
    --van-popover-light-background: var(--van-background-2);
    --van-popover-light-action-disabled-text-color: var(--van-text-color-3);
    --van-popover-dark-text-color: var(--van-white);
    --van-popover-dark-background: #4a4a4a;
    --van-popover-dark-action-disabled-text-color: var(--van-text-color-2)
}

.van-popover {
    position: absolute;
    overflow: visible;
    background-color: transparent;
    transition: opacity .15s, transform .15s
}

.van-popover__wrapper {
    display: inline-block
}

.van-popover__arrow {
    position: absolute;
    width: 0;
    height: 0;
    border-color: transparent;
    border-style: solid;
    border-width: var(--van-popover-arrow-size)
}

.van-popover__content {
    overflow: hidden;
    border-radius: var(--van-popover-radius)
}

.van-popover__content--horizontal {
    display: flex;
    width: -webkit-max-content;
    width: max-content
}

.van-popover__content--horizontal .van-popover__action {
    flex: none;
    width: auto;
    height: var(--van-popover-horizontal-action-height);
    padding: 0 var(--van-padding-sm)
}

.van-popover__content--horizontal .van-popover__action:last-child:after {
    display: none
}

.van-popover__content--horizontal .van-popover__action-icon {
    margin-right: var(--van-padding-base);
    font-size: var(--van-popover-horizontal-action-icon-size)
}

.van-popover__action {
    position: relative;
    display: flex;
    align-items: center;
    box-sizing: border-box;
    width: var(--van-popover-action-width);
    height: var(--van-popover-action-height);
    padding: 0 var(--van-padding-md);
    font-size: var(--van-popover-action-font-size);
    line-height: var(--van-line-height-md);
    cursor: pointer
}

.van-popover__action:last-child .van-popover__action-text:after {
    display: none
}

.van-popover__action-text {
    display: flex;
    flex: 1;
    align-items: center;
    justify-content: center;
    height: 100%
}

.van-popover__action-icon {
    margin-right: var(--van-padding-xs);
    font-size: var(--van-popover-action-icon-size)
}

.van-popover__action--with-icon .van-popover__action-text {
    justify-content: flex-start
}

.van-popover[data-popper-placement^=top] .van-popover__arrow {
    bottom: 0;
    border-top-color: currentColor;
    border-bottom-width: 0;
    margin-bottom: calc(var(--van-popover-arrow-size) * -1)
}

.van-popover[data-popper-placement=top] {
    transform-origin: 50% 100%
}

.van-popover[data-popper-placement=top] .van-popover__arrow {
    left: 50%;
    transform: translate(-50%)
}

.van-popover[data-popper-placement=top-start] {
    transform-origin: 0 100%
}

.van-popover[data-popper-placement=top-start] .van-popover__arrow {
    left: var(--van-padding-md)
}

.van-popover[data-popper-placement=top-end] {
    transform-origin: 100% 100%
}

.van-popover[data-popper-placement=top-end] .van-popover__arrow {
    right: var(--van-padding-md)
}

.van-popover[data-popper-placement^=left] .van-popover__arrow {
    right: 0;
    border-right-width: 0;
    border-left-color: currentColor;
    margin-right: calc(var(--van-popover-arrow-size) * -1)
}

.van-popover[data-popper-placement=left] {
    transform-origin: 100% 50%
}

.van-popover[data-popper-placement=left] .van-popover__arrow {
    top: 50%;
    transform: translateY(-50%)
}

.van-popover[data-popper-placement=left-start] {
    transform-origin: 100% 0
}

.van-popover[data-popper-placement=left-start] .van-popover__arrow {
    top: var(--van-padding-md)
}

.van-popover[data-popper-placement=left-end] {
    transform-origin: 100% 100%
}

.van-popover[data-popper-placement=left-end] .van-popover__arrow {
    bottom: var(--van-padding-md)
}

.van-popover[data-popper-placement^=right] .van-popover__arrow {
    left: 0;
    border-right-color: currentColor;
    border-left-width: 0;
    margin-left: calc(var(--van-popover-arrow-size) * -1)
}

.van-popover[data-popper-placement=right] {
    transform-origin: 0 50%
}

.van-popover[data-popper-placement=right] .van-popover__arrow {
    top: 50%;
    transform: translateY(-50%)
}

.van-popover[data-popper-placement=right-start] {
    transform-origin: 0 0
}

.van-popover[data-popper-placement=right-start] .van-popover__arrow {
    top: var(--van-padding-md)
}

.van-popover[data-popper-placement=right-end] {
    transform-origin: 0 100%
}

.van-popover[data-popper-placement=right-end] .van-popover__arrow {
    bottom: var(--van-padding-md)
}

.van-popover[data-popper-placement^=bottom] .van-popover__arrow {
    top: 0;
    border-top-width: 0;
    border-bottom-color: currentColor;
    margin-top: calc(var(--van-popover-arrow-size) * -1)
}

.van-popover[data-popper-placement=bottom] {
    transform-origin: 50% 0
}

.van-popover[data-popper-placement=bottom] .van-popover__arrow {
    left: 50%;
    transform: translate(-50%)
}

.van-popover[data-popper-placement=bottom-start] {
    transform-origin: 0 0
}

.van-popover[data-popper-placement=bottom-start] .van-popover__arrow {
    left: var(--van-padding-md)
}

.van-popover[data-popper-placement=bottom-end] {
    transform-origin: 100% 0
}

.van-popover[data-popper-placement=bottom-end] .van-popover__arrow {
    right: var(--van-padding-md)
}

.van-popover--light {
    color: var(--van-popover-light-text-color)
}

.van-popover--light .van-popover__content {
    background: var(--van-popover-light-background);
    box-shadow: 0 2px 12px #3232331f
}

.van-popover--light .van-popover__arrow {
    color: var(--van-popover-light-background)
}

.van-popover--light .van-popover__action:active {
    background-color: var(--van-active-color)
}

.van-popover--light .van-popover__action--disabled {
    color: var(--van-popover-light-action-disabled-text-color);
    cursor: not-allowed
}

.van-popover--light .van-popover__action--disabled:active {
    background-color: transparent
}

.van-popover--dark {
    color: var(--van-popover-dark-text-color)
}

.van-popover--dark .van-popover__content {
    background: var(--van-popover-dark-background)
}

.van-popover--dark .van-popover__arrow {
    color: var(--van-popover-dark-background)
}

.van-popover--dark .van-popover__action:active {
    background-color: #0003
}

.van-popover--dark .van-popover__action--disabled {
    color: var(--van-popover-dark-action-disabled-text-color)
}

.van-popover--dark .van-popover__action--disabled:active {
    background-color: transparent
}

.van-popover--dark .van-popover__action-text:after {
    border-color: var(--van-gray-7)
}

.van-popover-zoom-enter-from,
.van-popover-zoom-leave-active {
    transform: scale(.8);
    opacity: 0
}

.van-popover-zoom-enter-active {
    transition-timing-function: var(--van-ease-out)
}

.van-popover-zoom-leave-active {
    transition-timing-function: var(--van-ease-in)
}