:root{--tooltip-black:#1e293b;--tooltip-white:#fff;--tooltip-arrow-size:5px;--tooltip-arrow-offset:22px;--tooltip-y-offset:132%;--tooltip-x-offset:-8px;--tooltip-arrow-edge-distance:100%}.enc-tooltip{position:relative;display:inline-block;& .enc-tooltip-text{visibility:hidden;position:absolute;display:flex;align-items:center;justify-content:center;max-width:220px;width:max-content;height:fit-content;padding:10px 12px;z-index:1000;border-radius:8px;box-shadow:2px 2px 16px 1px rgba(70,70,70,.2)}&:hover+.enc-tooltip-text{visibility:visible}& .enc-tooltip-text.black{background-color:var(--tooltip-black);color:var(--tooltip-white)}& .enc-tooltip-text.white{background-color:white;color:black}& .enc-tooltip-y-axis-top{bottom:var(--tooltip-y-offset)}& .enc-tooltip-y-axis-bottom{top:var(--tooltip-y-offset)}& .enc-tooltip-x-axis-left{right:var(--tooltip-x-offset)}& .enc-tooltip-x-axis-center{transform:translateX(-50%);left:50%}& .enc-tooltip-x-axis-right{left:var(--tooltip-x-offset)}& .enc-tooltip-text:after{content:"";position:absolute;border-width:var(--tooltip-arrow-size);border-style:solid}& .enc-tooltip-y-axis-top{&:after{top:var(--tooltip-arrow-edge-distance)}&.black:after{border-color:var(--tooltip-black) transparent transparent transparent}&.white:after{border-color:var(--tooltip-white) transparent transparent transparent}}& .enc-tooltip-y-axis-bottom{&:after{bottom:var(--tooltip-arrow-edge-distance)}&.black:after{border-color:transparent transparent var(--tooltip-black) transparent}&.white:after{border-color:transparent transparent var(--tooltip-white) transparent}}& .enc-tooltip-x-axis-left:after{right:var(--tooltip-arrow-offset)}& .enc-tooltip-x-axis-center:after{left:50%;margin-left:calc(var(--tooltip-arrow-size) * -1)}& .enc-tooltip-x-axis-right:after{left:var(--tooltip-arrow-offset)}& .enc-tooltip-y-axis-center{top:50%;transform:translateY(-50%)}& .enc-tooltip-x-axis-right-side{left:100%;margin-left:12px}& .enc-tooltip-x-axis-right-side:after{right:100%;top:50%;margin-top:calc(var(--tooltip-arrow-size) * -1)}& .enc-tooltip-x-axis-right-side.black:after{border-color:transparent var(--tooltip-black) transparent transparent}& .enc-tooltip-x-axis-right-side.white:after{border-color:transparent var(--tooltip-white) transparent transparent}}