.tooltip{position:relative;display:inline-flex;align-items:center;cursor:pointer;--tooltip-bg: #F7F7F7;--tooltip-border: #CCCCCC;--tooltip-color: #333333;--tooltip-gap: .75rem;--tooltip-arrow-size: .5rem;--tooltip-max-width: min(18rem, calc(100vw - 2rem) )}.tooltip:focus{outline:none}.tooltip--dark{--tooltip-bg: #262626;--tooltip-border: #262626;--tooltip-color: #FDFDFD}.tooltip__bubble{position:absolute;z-index:20;box-sizing:border-box;max-width:var(--tooltip-max-width);padding:.5rem .75rem;border:1px solid var(--tooltip-border);background-color:var(--tooltip-bg);color:var(--tooltip-color);font-size:.875rem;line-height:1.4;text-align:center;white-space:normal;pointer-events:none;opacity:0;visibility:hidden;transition:opacity .15s ease,visibility .15s ease}.tooltip__bubble:after{content:"";position:absolute;width:0;height:0;border-style:solid}.tooltip:hover .tooltip__bubble,.tooltip:focus .tooltip__bubble,.tooltip:focus-visible .tooltip__bubble,.tooltip:focus-within .tooltip__bubble{opacity:1;visibility:visible;min-width:150px}.tooltip--auto .tooltip__bubble,.tooltip--top .tooltip__bubble{bottom:calc(100% + var(--tooltip-gap));left:50%;transform:translate(-50%)}.tooltip--auto .tooltip__bubble:after,.tooltip--top .tooltip__bubble:after{top:100%;left:50%;transform:translate(-50%);border-width:var(--tooltip-arrow-size) var(--tooltip-arrow-size) 0 var(--tooltip-arrow-size);border-color:var(--tooltip-border) transparent transparent transparent}.tooltip--bottom .tooltip__bubble{top:calc(100% + var(--tooltip-gap));left:50%;transform:translate(-50%)}.tooltip--bottom .tooltip__bubble:after{bottom:100%;left:50%;transform:translate(-50%);border-width:0 var(--tooltip-arrow-size) var(--tooltip-arrow-size) var(--tooltip-arrow-size);border-color:transparent transparent var(--tooltip-border) transparent}.tooltip--left .tooltip__bubble{right:calc(100% + var(--tooltip-gap));top:50%;transform:translateY(-50%)}.tooltip--left .tooltip__bubble:after{top:50%;left:100%;transform:translateY(-50%);border-width:var(--tooltip-arrow-size) 0 var(--tooltip-arrow-size) var(--tooltip-arrow-size);border-color:transparent transparent transparent var(--tooltip-border)}.tooltip--right .tooltip__bubble{left:calc(100% + var(--tooltip-gap));top:50%;transform:translateY(-50%)}.tooltip--right .tooltip__bubble:after{top:50%;right:100%;transform:translateY(-50%);border-width:var(--tooltip-arrow-size) var(--tooltip-arrow-size) var(--tooltip-arrow-size) 0;border-color:transparent var(--tooltip-border) transparent transparent}@media(prefers-reduced-motion:reduce){.tooltip__bubble{transition:none}}
/*# sourceMappingURL=/cdn/shop/t/8/assets/component-tooltip.css.map */
