.tooltip{--arrow-size: 12px;--button-padding: 10px;--icon-width: 20px;--side-offset: 35px;display:flex}.tooltip__trigger{position:relative;display:block;padding:var(--button-padding);cursor:pointer;background-color:transparent;border:none;outline:none}.tooltip__trigger:focus-visible{color:rgb(var(--color-foreground));outline:rgb(var(--color-foreground));outline-offset:2px;box-shadow:0 0 0 2px #fff}.tooltip__trigger:hover:before,.tooltip__trigger:active:before{position:absolute;display:block;width:20px;height:20px;content:"";background-color:#0000001a;border-radius:50%;transform:translate(-2px,-2px)}.tooltip__trigger:active:before{background-color:#0000001a}.tooltip__trigger:hover:not(.tooltip__trigger--isDismissed)+.tooltip__container,.tooltip__trigger:focus-visible:not(.tooltip__trigger--isDismissed)+.tooltip__container,.tooltip__trigger--isActive:not(.tooltip__trigger--isDismissed)+.tooltip__container{visibility:visible;opacity:1}.tooltip__trigger>svg{display:block;color:rgb(var(--color-foreground))}.tooltip__trigger>svg path{fill:currentColor}.tooltip__container{position:absolute;z-index:1500;pointer-events:none;visibility:hidden;opacity:0;transition:opacity .3s,visibility .1s linear}.tooltip__container--top{top:0;left:50%}.tooltip__container--bottom{top:100%;left:50%}.tooltip__container--left{top:50%;left:0}.tooltip__container--right{top:50%;left:100%}.tooltip__relative{position:relative}.tooltip__content{position:relative;width:-moz-max-content;width:max-content;max-width:300px;padding:16px;color:rgb(var(--color-foreground));background-color:#f7f6f4;border-radius:4px;box-shadow:#0009 0 2px 8px;opacity:1;transform:none}.tooltip__content--top-start{transform:translate(calc(0% - var(--side-offset)),calc(-100% - var(--arrow-size) + var(--button-padding)))}.tooltip__content--top-center{transform:translate(-50%,calc(-100% - var(--arrow-size) + var(--button-padding)))}.tooltip__content--top-end{transform:translate(calc(-100% + var(--side-offset)),calc(-100% - var(--arrow-size) + var(--button-padding)))}.tooltip__content--bottom-start{transform:translate(calc(0% - var(--side-offset)),calc(0% + var(--arrow-size) - var(--button-padding)))}.tooltip__content--bottom-center{transform:translate(-50%,calc(var(--arrow-size) - var(--button-padding)))}.tooltip__content--bottom-end{transform:translate(calc(-100% + var(--side-offset)),calc(0% + var(--arrow-size) - var(--button-padding)))}.tooltip__content--left{transform:translate(calc(-100% - var(--arrow-size) + var(--button-padding)),-50%)}.tooltip__content--right{transform:translate(calc(var(--arrow-size) - var(--button-padding)),-50%)}.tooltip__arrow{position:absolute;left:0;width:var(--arrow-size);height:var(--arrow-size);background-color:#f7f6f4;transform:rotate(45deg)}.tooltip__arrow--top-start{top:calc(100% - 6px);left:calc(0% + var(--side-offset) - var(--arrow-size) * .5)}.tooltip__arrow--top-center{top:calc(100% - 6px);left:calc(50% - var(--arrow-size) * .5)}.tooltip__arrow--top-end{top:calc(100% - 6px);left:calc(100% - var(--side-offset) - var(--arrow-size) * .5)}.tooltip__arrow--bottom-start{bottom:calc(100% - 6px);left:calc(0% + var(--side-offset) - var(--arrow-size) * .5)}.tooltip__arrow--bottom-center{bottom:calc(100% - 6px);left:calc(50% - var(--arrow-size) * .5)}.tooltip__arrow--bottom-end{bottom:calc(100% - 6px);left:calc(100% - var(--side-offset) - var(--arrow-size) * .5)}.tooltip__arrow--left{top:calc(50% - var(--arrow-size) * .5);left:calc(100% - 6px)}.tooltip__arrow--right{top:calc(50% - var(--arrow-size) * .5);left:-6px}