.tooltip.svelte-7e98o1 {
    position: fixed;
    --arrow-color: var(--white)
}

.tooltip-content.svelte-7e98o1 {
    background: var(--white);
    color: var(--grey-700);
    font-weight: 600;
    box-shadow: var(--shadows-md);
    font-size: var(--text-size-default);
    border-radius: var(--border-radius-base);
    padding: var(--space-3) var(--space-4)
}

.tooltip-content.svelte-7e98o1:after {
    content: "";
    position: absolute;
    width: 0;
    height: 0
}

.tooltip-content.x-center.svelte-7e98o1:after {
    left: 50%;
    transform: translate(-50%)
}

.tooltip-content.x-left.svelte-7e98o1:after {
    left: var(--arrow-offset);
    transform: translate(1px)
}

.tooltip-content.x-right.svelte-7e98o1:after {
    right: var(--arrow-offset);
    transform: translate(-1px)
}

.tooltip-content.x-auto.svelte-7e98o1:after {
    left: var(--arrow-x);
    transform: translate(-50%)
}

.tooltip-content.y-top.svelte-7e98o1:after {
    top: 100%;
    border-left: var(--arrow-width) solid transparent;
    border-right: var(--arrow-width) solid transparent;
    border-top: var(--arrow-width) solid var(--arrow-color, var(--white))
}

.tooltip-content.y-bottom.svelte-7e98o1:after {
    bottom: 100%;
    border-left: var(--arrow-width) solid transparent;
    border-right: var(--arrow-width) solid transparent;
    border-bottom: var(--arrow-width) solid var(--arrow-color, var(--white))
}

.arrow.svelte-7e98o1,
.arrow.svelte-7e98o1:before {
    position: absolute;
    width: 8px;
    height: 8px;
    background: inherit;
    background: var(--arrow-color)
}

.arrow.svelte-7e98o1 {
    visibility: hidden
}

.arrow.svelte-7e98o1:before {
    visibility: visible;
    content: "";
    transform: rotate(45deg)
}

.tooltip[data-popper-placement^=top] .arrow {
    bottom: -4px
}

.tooltip[data-popper-placement^=bottom] .arrow {
    top: -4px
}

.tooltip[data-popper-placement^=left] .arrow {
    right: -4px
}

.tooltip[data-popper-placement^=right] .arrow {
    left: -4px
}