.metro-tooltip-wrapper{display:inline-flex;position:relative}.metro-tooltip{color:#1e3a8a;white-space:nowrap;z-index:50;pointer-events:none;background-color:#fff;border:1px solid #cbd5e1;border-radius:6px;padding:.4rem .75rem;font-size:.75rem;font-weight:500;animation:.15s ease-out tooltipFadeIn;position:absolute;box-shadow:0 4px 6px -1px #00000014,0 2px 4px -1px #0000000f}@keyframes tooltipFadeIn{0%{opacity:0}to{opacity:1}}.metro-tooltip__arrow{border-style:solid;width:0;height:0;position:absolute}.metro-tooltip--top{bottom:calc(100% + 8px);left:50%;transform:translate(-50%)}.metro-tooltip--top .metro-tooltip__arrow{background-color:#fff;border:1px solid #cbd5e1;border-top:0;border-left:0;width:10px;height:10px;top:calc(100% - 6px);left:50%;transform:translate(-50%)rotate(45deg)}.metro-tooltip--bottom{top:calc(100% + 8px);left:50%;transform:translate(-50%)}.metro-tooltip--bottom .metro-tooltip__arrow{border-width:0 6px 6px;border-color:#0000 #0000 #fff;bottom:100%;left:50%;transform:translate(-50%)}.metro-tooltip--left{top:50%;right:calc(100% + 8px);transform:translateY(-50%)}.metro-tooltip--left .metro-tooltip__arrow{border-width:6px 0 6px 6px;border-color:#0000 #0000 #0000 #fff;top:50%;left:100%;transform:translateY(-50%)}.metro-tooltip--right{top:50%;left:calc(100% + 8px);transform:translateY(-50%)}.metro-tooltip--right .metro-tooltip__arrow{border-width:6px 6px 6px 0;border-color:#0000 #fff #0000 #0000;top:50%;right:100%;transform:translateY(-50%)}