.uc-popover {
    position: relative;
    --size-popover-content-padding: 12px;
    --size-popover-content-padding_r: -12px;
    --size-popover-arrow-border: 6px;
    --size-popover-inner-padding: 8px 16px;
    --size-popover-arrow-nook: 24px;
    --color-popover-bg: #fff;
    --color-popover-text: var(--color_0);
}
.uc-popover.dark {
    --color-popover-text: #fff;
    --color-popover-bg: #1f1f1f;
}
.uc-popover.noArrow {
    --size-popover-content-padding: 8px;
    --size-popover-content-padding_r: -8px;
}
.uc-popover.click {
    cursor: pointer;
}

.uc-popover-content {
    position: absolute;
    top: 100%;
    left: 50%;
    transform: translateX(-50%);
    z-index: 1000;
    width: max-content;
    padding: var(--size-popover-content-padding);
    display: none;
    opacity: 0;
    transition: opacity 0.1s;
    cursor: default;
}
.uc-popover-content.hide {
    display: none;
}
.uc-popover-content.hidden {
    opacity: 0;
}
.uc-popover-content.show {
    display: block;
}
.uc-popover-content.visible {
    opacity: 1;
}


.uc-popover-arrow {
    position: absolute;
    top: 0;
    left: 50%;
    bottom: auto;
    right: auto;
    transform: translateX(-50%);
    border: var(--size-popover-arrow-border) solid transparent;
    border-bottom: var(--size-popover-arrow-border) solid var(--color-popover-bg);
    width: 0;
    height: 0;
    pointer-events: none;
}

.uc-popover-inner {
    font-size: 14px;
    color: var(--color-popover-text);
    padding: var(--size-popover-inner-padding);
    background-color: var(--color-popover-bg);
    background-clip: padding-box;
    border-radius: 4px;
    box-shadow: 0 0 10px 0 rgba(0, 0, 0, .1);
}
.uc-popover.noPadding > .uc-popover-content > .uc-popover-inner {
    padding: 0;
}

.uc-popover.top .uc-popover-content {
    left: 50%;
    bottom: 100%;
    top: auto;
    right: auto;
    transform: translateX(-50%);
}

.uc-popover.top .uc-popover-arrow {
    left: 50%;
    bottom: 0;
    top: auto;
    right: auto;
    transform: translateX(-50%);
    border: var(--size-popover-arrow-border) solid transparent;
    border-top: var(--size-popover-arrow-border) solid var(--color-popover-bg);
}

.uc-popover.tl .uc-popover-content {
    left: var(--size-popover-content-padding_r);
    bottom: 100%;
    top: auto;
    right: auto;
    transform: none;
}

.uc-popover.tl .uc-popover-arrow {
    left: var(--size-popover-arrow-nook);
    bottom: 0;
    top: auto;
    right: auto;
    transform: none;
    border: var(--size-popover-arrow-border) solid transparent;
    border-top: var(--size-popover-arrow-border) solid var(--color-popover-bg);
}

.uc-popover.tr .uc-popover-content {
    right: var(--size-popover-content-padding_r);
    bottom: 100%;
    left: auto;
    top: auto;
    transform: none;
}

.uc-popover.tr .uc-popover-arrow {
    right: var(--size-popover-arrow-nook);
    bottom: 0;
    left: auto;
    top: auto;
    transform: none;
    border: var(--size-popover-arrow-border) solid transparent;
    border-top: var(--size-popover-arrow-border) solid var(--color-popover-bg);
}

.uc-popover.bottom .uc-popover-content {
    top: 100%;
    left: 50%;
    bottom: auto;
    right: auto;
    transform: translateX(-50%);
}

.uc-popover.bottom .uc-popover-arrow {
    top: 0;
    left: 50%;
    bottom: auto;
    right: auto;
    transform: translateX(-50%);
    border: var(--size-popover-arrow-border) solid transparent;
    border-bottom: var(--size-popover-arrow-border) solid var(--color-popover-bg);
}

.uc-popover.bl .uc-popover-content {
    left: var(--size-popover-content-padding_r);
    top: 100%;
    bottom: auto;
    right: auto;
    transform: none;
}

.uc-popover.bl .uc-popover-arrow {
    left: var(--size-popover-arrow-nook);
    top: 0;
    bottom: auto;
    right: auto;
    transform: none;
    border: var(--size-popover-arrow-border) solid transparent;
    border-bottom: var(--size-popover-arrow-border) solid var(--color-popover-bg);
}

.uc-popover.br .uc-popover-content {
    right: var(--size-popover-content-padding_r);
    top: 100%;
    bottom: auto;
    left: auto;
    transform: none;
}

.uc-popover.br .uc-popover-arrow {
    right: var(--size-popover-arrow-nook);
    top: 0;
    bottom: auto;
    left: auto;
    transform: none;
    border: var(--size-popover-arrow-border) solid transparent;
    border-bottom: var(--size-popover-arrow-border) solid var(--color-popover-bg);
}

.uc-popover.right .uc-popover-content {
    top: 50%;
    left: 100%;
    bottom: auto;
    right: auto;
    transform: translateY(-50%);
}

.uc-popover.right .uc-popover-arrow {
    top: 50%;
    left: 0;
    bottom: auto;
    right: auto;
    transform: translateY(-50%);
    border: var(--size-popover-arrow-border) solid transparent;
    border-right: var(--size-popover-arrow-border) solid var(--color-popover-bg);
}

.uc-popover.rt .uc-popover-content {
    left: 100%;
    top: var(--size-popover-content-padding_r);
    bottom: auto;
    right: auto;
    transform: none;
}

.uc-popover.rt .uc-popover-arrow {
    left: 0;
    top: var(--size-popover-arrow-nook);
    bottom: auto;
    right: auto;
    transform: none;
    border: var(--size-popover-arrow-border) solid transparent;
    border-right: var(--size-popover-arrow-border) solid var(--color-popover-bg);
}

.uc-popover.rb .uc-popover-content {
    left: 100%;
    bottom: var(--size-popover-content-padding_r);
    top: auto;
    right: auto;
    transform: none;
}

.uc-popover.rb .uc-popover-arrow {
    left: 0;
    bottom: var(--size-popover-arrow-nook);
    top: auto;
    right: auto;
    transform: none;
    border: var(--size-popover-arrow-border) solid transparent;
    border-right: var(--size-popover-arrow-border) solid var(--color-popover-bg);
}

.uc-popover.left .uc-popover-content {
    top: 50%;
    right: 100%;
    left: auto;
    bottom: auto;
    transform: translateY(-50%);
}

.uc-popover.left .uc-popover-arrow {
    top: 50%;
    right: 0;
    left: auto;
    bottom: auto;
    transform: translateY(-50%);
    border: var(--size-popover-arrow-border) solid transparent;
    border-left: var(--size-popover-arrow-border) solid var(--color-popover-bg);
}

.uc-popover.lt .uc-popover-content {
    right: 100%;
    top: var(--size-popover-content-padding_r);
    left: auto;
    bottom: auto;
    transform: none;
}

.uc-popover.lt .uc-popover-arrow {
    right: 0;
    top: var(--size-popover-arrow-nook);
    left: auto;
    bottom: auto;
    transform: none;
    border: var(--size-popover-arrow-border) solid transparent;
    border-left: var(--size-popover-arrow-border) solid var(--color-popover-bg);
}

.uc-popover.lb .uc-popover-content {
    right: 100%;
    bottom: var(--size-popover-content-padding_r);
    top: auto;
    left: auto;
    transform: none;
}

.uc-popover.lb .uc-popover-arrow {
    right: 0;
    bottom: var(--size-popover-arrow-nook);
    top: auto;
    left: auto;
    transform: none;
    border: var(--size-popover-arrow-border) solid transparent;
    border-left: var(--size-popover-arrow-border) solid var(--color-popover-bg);
}