/* dcf-popup */

.dcf-popup-content {
    -webkit-transition: opacity 125ms cubic-bezier(.25, .46, .45, .94);
    transition: opacity 125ms cubic-bezier(.25, .46, .45, .94)
}

.dcf-popup {
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content
}

.dcf-popup-content:not([aria-hidden=false]) {
    opacity: 0
}

.dcf-popup:not([data-alignment=start]):not([data-alignment=end])>.dcf-popup-content {
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%)
}

.dcf-popup:not([data-alignment=start]):not([data-alignment=end])[data-position=left]>.dcf-popup-content,
.dcf-popup:not([data-alignment=start]):not([data-alignment=end])[data-position=right]>.dcf-popup-content {
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%)
}

.dcf-popup[data-point=true]>.dcf-popup-content:before {
    background-color: inherit;
    content: "";
    left: calc(50% - .5em);
    position: absolute;
    z-index: -1
}

.dcf-popup[data-point=true]:not([data-position=right]):not([data-position=left])>.dcf-popup-content:before {
    height: .7500000002em;
    width: 1em
}

.dcf-popup[data-point=true][data-position=left]>.dcf-popup-content:before,
.dcf-popup[data-point=true][data-position=right]>.dcf-popup-content:before {
    height: 1em;
    width: .7500000002em
}

.dcf-popup[data-point=true]:not([data-position=top]):not([data-position=right]):not([data-position=left])>.dcf-popup-content,
.dcf-popup[data-point=true][data-position=bottom]>.dcf-popup-content {
    margin-top: 1em
}

.dcf-popup[data-point=true]:not([data-position=top]):not([data-position=right]):not([data-position=left])>.dcf-popup-content:before,
.dcf-popup[data-point=true][data-position=bottom]>.dcf-popup-content:before {
    -webkit-clip-path: polygon(50% 0, 0 100%, 100% 100%);
    clip-path: polygon(50% 0, 0 100%, 100% 100%);
    top: calc(-.75em + .5px)
}

.dcf-popup[data-point=true][data-position=top]>.dcf-popup-content {
    margin-bottom: 1em
}

.dcf-popup[data-point=true][data-position=top]>.dcf-popup-content:before {
    -webkit-clip-path: polygon(100% 0, 0 0, 50% 100%);
    clip-path: polygon(100% 0, 0 0, 50% 100%);
    top: calc(100% - .5px)
}

.dcf-popup[data-point=true][data-position=left]>.dcf-popup-content {
    margin-right: 1em
}

.dcf-popup[data-point=true][data-position=left]>.dcf-popup-content:before {
    -webkit-clip-path: polygon(0 0, 0 100%, 100% 50%);
    clip-path: polygon(0 0, 0 100%, 100% 50%);
    left: calc(100% - .5px)
}

.dcf-popup[data-point=true][data-position=right]>.dcf-popup-content {
    margin-left: 1em
}

.dcf-popup[data-point=true][data-position=right]>.dcf-popup-content:before {
    -webkit-clip-path: polygon(100% 100%, 100% 0, 0 50%);
    clip-path: polygon(100% 100%, 100% 0, 0 50%);
    left: calc(-.75em + .5px)
}

.dcf-popup[data-point=true][data-alignment=start]:not([data-position=left]):not([data-position=right])>.dcf-popup-content:before {
    left: .7500000002em
}

.dcf-popup[data-point=true][data-alignment=end]:not([data-position=left]):not([data-position=right])>.dcf-popup-content:before {
    left: calc(100% - 1.5em)
}

.dcf-popup[data-point=true][data-position=left]:not([data-alignment=start]):not([data-alignment=end])>.dcf-popup-content:before,
.dcf-popup[data-point=true][data-position=right]:not([data-alignment=start]):not([data-alignment=end])>.dcf-popup-content:before {
    top: calc(50% - .5em)
}

.dcf-popup[data-point=true][data-alignment=start][data-position=left]>.dcf-popup-content:before,
.dcf-popup[data-point=true][data-alignment=start][data-position=right]>.dcf-popup-content:before {
    top: .7500000002em
}

.dcf-popup[data-point=true][data-alignment=end][data-position=left]>.dcf-popup-content:before,
.dcf-popup[data-point=true][data-alignment=end][data-position=right]>.dcf-popup-content:before {
    top: calc(100% - 1.5em)
}