@spectrum-css/tooltip/dist/index-base.min.css

The Spectrum CSS tooltip component

/*!
 * Copyright 2024 Adobe. All rights reserved.
 *
 * This file is licensed to you under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License. You may obtain a copy
 * of the License at <http://www.apache.org/licenses/LICENSE-2.0>
 *
 * Unless required by applicable law or agreed to in writing, software distributed under
 * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
 * OF ANY KIND, either express or implied. See the License for the specific language
 * governing permissions and limitations under the License.
 */

.spectrum-Tooltip{pointer-events:none;visibility:hidden;opacity:0;transition:transform .13s ease-in-out,opacity .13s ease-in-out,visibility 0s linear .13s;transition:transform var(--mod-overlay-animation-duration,var(--spectrum-animation-duration-100,.13s)) ease-in-out,opacity var(--mod-overlay-animation-duration,var(--spectrum-animation-duration-100,.13s)) ease-in-out,visibility 0s linear var(--mod-overlay-animation-duration,var(--spectrum-animation-duration-100,.13s))}.spectrum-Tooltip.is-open{pointer-events:auto;visibility:visible;opacity:1;transition-delay:0s;transition-delay:var(--mod-overlay-animation-duration-opened,var(--spectrum-animation-duration-0,0s))}.spectrum-Tooltip{--spectrum-tooltip-animation-duration:var(--spectrum-animation-duration-100);--spectrum-tooltip-margin:0px;--spectrum-tooltip-height:var(--spectrum-component-height-75);--spectrum-tooltip-max-inline-size:var(--spectrum-tooltip-maximum-width);--spectrum-tooltip-border-radius:var(--spectrum-corner-radius-100);--spectrum-tooltip-icon-width:var(--spectrum-workflow-icon-size-50);--spectrum-tooltip-icon-height:var(--spectrum-workflow-icon-size-50);--spectrum-tooltip-font-size:var(--spectrum-font-size-75);--spectrum-tooltip-line-height:var(--spectrum-line-height-100);--spectrum-tooltip-cjk-line-height:var(--spectrum-cjk-line-height-100);--spectrum-tooltip-font-weight:var(--spectrum-regular-font-weight);--spectrum-tooltip-spacing-inline:var(--spectrum-component-edge-to-text-75);--spectrum-tooltip-spacing-block-start:var(--spectrum-component-top-to-text-75);--spectrum-tooltip-spacing-block-end:var(--spectrum-component-bottom-to-text-75);--spectrum-tooltip-icon-spacing-inline-start:var(--spectrum-text-to-visual-75);--spectrum-tooltip-icon-spacing-inline-end:var(--spectrum-text-to-visual-75);--spectrum-tooltip-icon-spacing-block-start:var(--spectrum-component-top-to-workflow-icon-75);--spectrum-tooltip-background-color-informative:var(--spectrum-informative-background-color-default);--spectrum-tooltip-background-color-positive:var(--spectrum-positive-background-color-default);--spectrum-tooltip-background-color-negative:var(--spectrum-negative-background-color-default);--spectrum-tooltip-content-color:var(--spectrum-white);--spectrum-tooltip-tip-inline-size:var(--spectrum-tooltip-tip-width);--spectrum-tooltip-tip-block-size:var(--spectrum-tooltip-tip-height);--spectrum-tooltip-tip-square-size:var(--spectrum-tooltip-tip-inline-size);--spectrum-tooltip-tip-height-percentage:50%;--spectrum-tooltip-tip-antialiasing-inset:0.5px;--spectrum-tooltip-pointer-corner-spacing:var(--spectrum-corner-radius-100);--spectrum-tooltip-background-color-default:var(--spectrum-tooltip-backgound-color-default-neutral)}@media (forced-colors:active){.spectrum-Tooltip{border:1px solid transparent}.spectrum-Tooltip-tip{--highcontrast-tooltip-background-color-default:CanvasText;--highcontrast-tooltip-background-color-informative:CanvasText;--highcontrast-tooltip-background-color-positive:CanvasText;--highcontrast-tooltip-background-color-negative:CanvasText;forced-color-adjust:none}}.spectrum-Tooltip{position:relative;display:inline-flex;flex-direction:row;align-items:center;box-sizing:border-box;vertical-align:top;inline-size:auto;padding-inline:var(--mod-tooltip-spacing-inline,var(--spectrum-tooltip-spacing-inline));border-radius:var(--mod-tooltip-border-radius,var(--spectrum-tooltip-border-radius));block-size:auto;min-block-size:var(--mod-tooltip-height,var(--spectrum-tooltip-height));max-inline-size:var(--mod-tooltip-max-inline-size,var(--spectrum-tooltip-max-inline-size));background-color:var(--highcontrast-tooltip-background-color-default,var(--mod-tooltip-background-color-default,var(--spectrum-tooltip-background-color-default)));color:var(--mod-tooltip-content-color,var(--spectrum-tooltip-content-color));font-size:var(--mod-tooltip-font-size,var(--spectrum-tooltip-font-size));font-weight:var(--mod-tooltip-font-weight,var(--spectrum-tooltip-font-weight));line-height:var(--mod-tooltip-line-height,var(--spectrum-tooltip-line-height));word-break:break-word;-webkit-font-smoothing:antialiased;cursor:default;-webkit-user-select:none;user-select:none}.spectrum-Tooltip:lang(ja),.spectrum-Tooltip:lang(ko),.spectrum-Tooltip:lang(zh){line-height:var(--mod-tooltip-cjk-line-height,var(--spectrum-tooltip-cjk-line-height))}.spectrum-Tooltip p{margin:0}.spectrum-Tooltip--info{background-color:var(--highcontrast-tooltip-background-color-informative,var(--mod-tooltip-background-color-informative,var(--spectrum-tooltip-background-color-informative)))}.spectrum-Tooltip--positive{background-color:var(--highcontrast-tooltip-background-color-positive,var(--mod-tooltip-background-color-positive,var(--spectrum-tooltip-background-color-positive)))}.spectrum-Tooltip--negative{background-color:var(--highcontrast-tooltip-background-color-negative,var(--mod-tooltip-background-color-negative,var(--spectrum-tooltip-background-color-negative)))}.spectrum-Tooltip-tip{position:absolute;block-size:var(--mod-tooltip-tip-square-size,var(--spectrum-tooltip-tip-square-size));inline-size:var(--mod-tooltip-tip-square-size,var(--spectrum-tooltip-tip-square-size));inset-block-start:100%;
	/* stylelint-disable-next-line csstools/use-logical -- intentional use of non-logical property */left:50%;transform:translateX(-50%);background-color:var(--highcontrast-tooltip-background-color-default,var(--mod-tooltip-background-color-default,var(--spectrum-tooltip-background-color-default)));clip-path:polygon(0 calc(0% - var(--mod-tooltip-tip-antialiasing-inset, var(--spectrum-tooltip-tip-antialiasing-inset))),50% var(--mod-tooltip-tip-height-percentage,var(--spectrum-tooltip-tip-height-percentage)),100% calc(0% - var(--mod-tooltip-tip-antialiasing-inset, var(--spectrum-tooltip-tip-antialiasing-inset))))}.spectrum-Tooltip--info .spectrum-Tooltip-tip{background-color:var(--highcontrast-tooltip-background-color-informative,var(--mod-tooltip-background-color-informative,var(--spectrum-tooltip-background-color-informative)))}.spectrum-Tooltip--positive .spectrum-Tooltip-tip{background-color:var(--highcontrast-tooltip-background-color-positive,var(--mod-tooltip-background-color-positive,var(--spectrum-tooltip-background-color-positive)))}.spectrum-Tooltip--negative .spectrum-Tooltip-tip{background-color:var(--highcontrast-tooltip-background-color-negative,var(--mod-tooltip-background-color-negative,var(--spectrum-tooltip-background-color-negative)))}.spectrum-Tooltip--top .spectrum-Tooltip-tip,.spectrum-Tooltip--top-end .spectrum-Tooltip-tip,.spectrum-Tooltip--top-left .spectrum-Tooltip-tip,.spectrum-Tooltip--top-right .spectrum-Tooltip-tip,.spectrum-Tooltip--top-start .spectrum-Tooltip-tip{inset-block-start:100%}.spectrum-Tooltip--bottom .spectrum-Tooltip-tip,.spectrum-Tooltip--bottom-end .spectrum-Tooltip-tip,.spectrum-Tooltip--bottom-left .spectrum-Tooltip-tip,.spectrum-Tooltip--bottom-right .spectrum-Tooltip-tip,.spectrum-Tooltip--bottom-start .spectrum-Tooltip-tip{clip-path:polygon(50% calc(100% - var(--mod-tooltip-tip-height-percentage, var(--spectrum-tooltip-tip-height-percentage))),0 calc(100% + var(--mod-tooltip-tip-antialiasing-inset, var(--spectrum-tooltip-tip-antialiasing-inset))),100% calc(100% + var(--mod-tooltip-tip-antialiasing-inset, var(--spectrum-tooltip-tip-antialiasing-inset))));inset-block:auto 100%}.spectrum-Tooltip--bottom-end .spectrum-Tooltip-tip,.spectrum-Tooltip--bottom-left .spectrum-Tooltip-tip,.spectrum-Tooltip--bottom-right .spectrum-Tooltip-tip,.spectrum-Tooltip--bottom-start .spectrum-Tooltip-tip,.spectrum-Tooltip--top-end .spectrum-Tooltip-tip,.spectrum-Tooltip--top-left .spectrum-Tooltip-tip,.spectrum-Tooltip--top-right .spectrum-Tooltip-tip,.spectrum-Tooltip--top-start .spectrum-Tooltip-tip{transform:none}.spectrum-Tooltip--bottom-left .spectrum-Tooltip-tip,.spectrum-Tooltip--top-left .spectrum-Tooltip-tip{inset-inline-start:var(--mod-tooltip-pointer-corner-spacing,var(--spectrum-tooltip-pointer-corner-spacing))}.spectrum-Tooltip--bottom-right .spectrum-Tooltip-tip,.spectrum-Tooltip--top-right .spectrum-Tooltip-tip{inset-inline:auto var(--mod-tooltip-pointer-corner-spacing,var(--spectrum-tooltip-pointer-corner-spacing))}.spectrum-Tooltip--bottom-start .spectrum-Tooltip-tip,.spectrum-Tooltip--top-start .spectrum-Tooltip-tip{inset-inline:var(--mod-tooltip-pointer-corner-spacing,var(--spectrum-tooltip-pointer-corner-spacing)) auto}.spectrum-Tooltip--bottom-start .spectrum-Tooltip-tip:dir(rtl),.spectrum-Tooltip--top-start .spectrum-Tooltip-tip:dir(rtl),[dir=rtl] .spectrum-Tooltip--bottom-start .spectrum-Tooltip-tip,[dir=rtl] .spectrum-Tooltip--top-start .spectrum-Tooltip-tip{right:var(--mod-tooltip-pointer-corner-spacing,var(--spectrum-tooltip-pointer-corner-spacing));left:auto}.spectrum-Tooltip--bottom-end .spectrum-Tooltip-tip,.spectrum-Tooltip--top-end .spectrum-Tooltip-tip{inset-inline:auto var(--mod-tooltip-pointer-corner-spacing,var(--spectrum-tooltip-pointer-corner-spacing))}.spectrum-Tooltip--bottom-end .spectrum-Tooltip-tip:dir(rtl),.spectrum-Tooltip--top-end .spectrum-Tooltip-tip:dir(rtl),[dir=rtl] .spectrum-Tooltip--bottom-end .spectrum-Tooltip-tip,[dir=rtl] .spectrum-Tooltip--top-end .spectrum-Tooltip-tip{left:var(--mod-tooltip-pointer-corner-spacing,var(--spectrum-tooltip-pointer-corner-spacing));right:auto}.spectrum-Tooltip--end .spectrum-Tooltip-tip,.spectrum-Tooltip--end-bottom .spectrum-Tooltip-tip,.spectrum-Tooltip--end-top .spectrum-Tooltip-tip,.spectrum-Tooltip--left .spectrum-Tooltip-tip,.spectrum-Tooltip--left-bottom .spectrum-Tooltip-tip,.spectrum-Tooltip--left-top .spectrum-Tooltip-tip,.spectrum-Tooltip--right .spectrum-Tooltip-tip,.spectrum-Tooltip--right-bottom .spectrum-Tooltip-tip,.spectrum-Tooltip--right-top .spectrum-Tooltip-tip,.spectrum-Tooltip--start .spectrum-Tooltip-tip,.spectrum-Tooltip--start-bottom .spectrum-Tooltip-tip,.spectrum-Tooltip--start-top .spectrum-Tooltip-tip{inset-block-start:50%;transform:translateY(-50%)}.spectrum-Tooltip--end-bottom .spectrum-Tooltip-tip,.spectrum-Tooltip--end-top .spectrum-Tooltip-tip,.spectrum-Tooltip--left-bottom .spectrum-Tooltip-tip,.spectrum-Tooltip--left-top .spectrum-Tooltip-tip,.spectrum-Tooltip--right-bottom .spectrum-Tooltip-tip,.spectrum-Tooltip--right-top .spectrum-Tooltip-tip,.spectrum-Tooltip--start-bottom .spectrum-Tooltip-tip,.spectrum-Tooltip--start-top .spectrum-Tooltip-tip{transform:none;inset-block-start:auto}.spectrum-Tooltip--end .spectrum-Tooltip-tip,.spectrum-Tooltip--end-bottom .spectrum-Tooltip-tip,.spectrum-Tooltip--end-top .spectrum-Tooltip-tip,.spectrum-Tooltip--right .spectrum-Tooltip-tip,.spectrum-Tooltip--right-bottom .spectrum-Tooltip-tip,.spectrum-Tooltip--right-top .spectrum-Tooltip-tip{clip-path:polygon(calc(100% - var(--mod-tooltip-tip-height-percentage, var(--spectrum-tooltip-tip-height-percentage))) 50%,calc(100% + var(--mod-tooltip-tip-antialiasing-inset, var(--spectrum-tooltip-tip-antialiasing-inset))) 100%,calc(100% + var(--mod-tooltip-tip-antialiasing-inset, var(--spectrum-tooltip-tip-antialiasing-inset))) 0);inset-inline:auto 100%}.spectrum-Tooltip--left .spectrum-Tooltip-tip,.spectrum-Tooltip--left-bottom .spectrum-Tooltip-tip,.spectrum-Tooltip--left-top .spectrum-Tooltip-tip,.spectrum-Tooltip--start .spectrum-Tooltip-tip,.spectrum-Tooltip--start-bottom .spectrum-Tooltip-tip,.spectrum-Tooltip--start-top .spectrum-Tooltip-tip{clip-path:polygon(calc(0% - var(--mod-tooltip-tip-antialiasing-inset, var(--spectrum-tooltip-tip-antialiasing-inset))) 0,calc(0% - var(--mod-tooltip-tip-antialiasing-inset, var(--spectrum-tooltip-tip-antialiasing-inset))) 100%,var(--mod-tooltip-tip-height-percentage,var(--spectrum-tooltip-tip-height-percentage)) 50%);inset-inline-start:100%}.spectrum-Tooltip--end-top .spectrum-Tooltip-tip,.spectrum-Tooltip--left-top .spectrum-Tooltip-tip,.spectrum-Tooltip--right-top .spectrum-Tooltip-tip,.spectrum-Tooltip--start-top .spectrum-Tooltip-tip{inset-block-start:var(--mod-tooltip-pointer-corner-spacing,var(--spectrum-tooltip-pointer-corner-spacing))}.spectrum-Tooltip--end-bottom .spectrum-Tooltip-tip,.spectrum-Tooltip--left-bottom .spectrum-Tooltip-tip,.spectrum-Tooltip--right-bottom .spectrum-Tooltip-tip,.spectrum-Tooltip--start-bottom .spectrum-Tooltip-tip{inset-block-end:var(--mod-tooltip-pointer-corner-spacing,var(--spectrum-tooltip-pointer-corner-spacing))}.spectrum-Tooltip--end .spectrum-Tooltip-tip:dir(rtl),.spectrum-Tooltip--end-bottom .spectrum-Tooltip-tip:dir(rtl),.spectrum-Tooltip--end-top .spectrum-Tooltip-tip:dir(rtl),.spectrum-Tooltip--left .spectrum-Tooltip-tip:dir(rtl),.spectrum-Tooltip--left-bottom .spectrum-Tooltip-tip:dir(rtl),.spectrum-Tooltip--left-top .spectrum-Tooltip-tip:dir(rtl),[dir=rtl] .spectrum-Tooltip--end .spectrum-Tooltip-tip,[dir=rtl] .spectrum-Tooltip--end-bottom .spectrum-Tooltip-tip,[dir=rtl] .spectrum-Tooltip--end-top .spectrum-Tooltip-tip,[dir=rtl] .spectrum-Tooltip--left .spectrum-Tooltip-tip,[dir=rtl] .spectrum-Tooltip--left-bottom .spectrum-Tooltip-tip,[dir=rtl] .spectrum-Tooltip--left-top .spectrum-Tooltip-tip{clip-path:polygon(calc(0% - var(--mod-tooltip-tip-antialiasing-inset, var(--spectrum-tooltip-tip-antialiasing-inset))) 0,calc(0% - var(--mod-tooltip-tip-antialiasing-inset, var(--spectrum-tooltip-tip-antialiasing-inset))) 100%,var(--mod-tooltip-tip-height-percentage,var(--spectrum-tooltip-tip-height-percentage)) 50%);right:auto;left:100%}.spectrum-Tooltip--right .spectrum-Tooltip-tip:dir(rtl),.spectrum-Tooltip--right-bottom .spectrum-Tooltip-tip:dir(rtl),.spectrum-Tooltip--right-top .spectrum-Tooltip-tip:dir(rtl),.spectrum-Tooltip--start .spectrum-Tooltip-tip:dir(rtl),.spectrum-Tooltip--start-bottom .spectrum-Tooltip-tip:dir(rtl),.spectrum-Tooltip--start-top .spectrum-Tooltip-tip:dir(rtl),[dir=rtl] .spectrum-Tooltip--right .spectrum-Tooltip-tip,[dir=rtl] .spectrum-Tooltip--right-bottom .spectrum-Tooltip-tip,[dir=rtl] .spectrum-Tooltip--right-top .spectrum-Tooltip-tip,[dir=rtl] .spectrum-Tooltip--start .spectrum-Tooltip-tip,[dir=rtl] .spectrum-Tooltip--start-bottom .spectrum-Tooltip-tip,[dir=rtl] .spectrum-Tooltip--start-top .spectrum-Tooltip-tip{clip-path:polygon(var(--mod-tooltip-tip-height-percentage,var(--spectrum-tooltip-tip-height-percentage)) 50%,calc(100% + var(--mod-tooltip-tip-antialiasing-inset, var(--spectrum-tooltip-tip-antialiasing-inset))) 100%,calc(100% + var(--mod-tooltip-tip-antialiasing-inset, var(--spectrum-tooltip-tip-antialiasing-inset))) 0);left:auto;right:100%}.spectrum-Tooltip-typeIcon{margin-inline-start:calc(var(--mod-tooltip-icon-spacing-inline-start, var(--spectrum-tooltip-icon-spacing-inline-start)) - var(--mod-tooltip-spacing-inline, var(--spectrum-tooltip-spacing-inline)));margin-inline-end:var(--mod-tooltip-icon-spacing-inline-end,var(--spectrum-tooltip-icon-spacing-inline-end));margin-block-start:var(--mod-tooltip-icon-spacing-block-start,var(--spectrum-tooltip-icon-spacing-block-start));inline-size:var(--mod-tooltip-icon-width,var(--spectrum-tooltip-icon-width));block-size:var(--mod-tooltip-icon-height,var(--spectrum-tooltip-icon-height));align-self:flex-start;flex-shrink:0}.spectrum-Tooltip-label{line-height:var(--mod-tooltip-line-height,var(--spectrum-tooltip-line-height));margin-block-start:var(--mod-tooltip-spacing-block-start,var(--spectrum-tooltip-spacing-block-start));margin-block-end:var(--mod-tooltip-spacing-block-end,var(--spectrum-tooltip-spacing-block-end))}.spectrum-Tooltip,.spectrum-Tooltip--top,.spectrum-Tooltip--top-end,.spectrum-Tooltip--top-left,.spectrum-Tooltip--top-right,.spectrum-Tooltip--top-start{margin-block-end:calc(var(--mod-tooltip-tip-block-size, var(--spectrum-tooltip-tip-block-size)) + var(--mod-tooltip-margin, var(--spectrum-tooltip-margin)))}.spectrum-Tooltip--top-end.is-open,.spectrum-Tooltip--top-left.is-open,.spectrum-Tooltip--top-right.is-open,.spectrum-Tooltip--top-start.is-open,.spectrum-Tooltip--top.is-open,.spectrum-Tooltip.is-open{transform:translateY(calc(var(--mod-tooltip-animation-distance, var(--spectrum-tooltip-animation-distance))*-1))}.spectrum-Tooltip--bottom,.spectrum-Tooltip--bottom-end,.spectrum-Tooltip--bottom-left,.spectrum-Tooltip--bottom-right,.spectrum-Tooltip--bottom-start{margin-block-start:calc(var(--mod-tooltip-tip-block-size, var(--spectrum-tooltip-tip-block-size)) + var(--mod-tooltip-margin, var(--spectrum-tooltip-margin)))}.spectrum-Tooltip--bottom-end.is-open,.spectrum-Tooltip--bottom-left.is-open,.spectrum-Tooltip--bottom-right.is-open,.spectrum-Tooltip--bottom-start.is-open,.spectrum-Tooltip--bottom.is-open{transform:translateY(var(--mod-tooltip-animation-distance,var(--spectrum-tooltip-animation-distance)))}.spectrum-Tooltip--right,.spectrum-Tooltip--right-bottom,.spectrum-Tooltip--right-top{
	/* stylelint-disable-next-line csstools/use-logical -- intentional use of non-logical property */margin-left:calc(var(--mod-tooltip-tip-block-size, var(--spectrum-tooltip-tip-block-size)) + var(--mod-tooltip-margin, var(--spectrum-tooltip-margin)))}.spectrum-Tooltip--right-bottom.is-open,.spectrum-Tooltip--right-top.is-open,.spectrum-Tooltip--right.is-open{transform:translateX(var(--mod-tooltip-animation-distance,var(--spectrum-tooltip-animation-distance)))}.spectrum-Tooltip--left,.spectrum-Tooltip--left-bottom,.spectrum-Tooltip--left-top{
	/* stylelint-disable-next-line csstools/use-logical -- intentional use of non-logical property */margin-right:calc(var(--mod-tooltip-tip-block-size, var(--spectrum-tooltip-tip-block-size)) + var(--mod-tooltip-margin, var(--spectrum-tooltip-margin)))}.spectrum-Tooltip--left-bottom.is-open,.spectrum-Tooltip--left-top.is-open,.spectrum-Tooltip--left.is-open{transform:translateX(calc(var(--mod-tooltip-animation-distance, var(--spectrum-tooltip-animation-distance))*-1))}.spectrum-Tooltip--start,.spectrum-Tooltip--start-bottom,.spectrum-Tooltip--start-top{margin-inline-end:calc(var(--mod-tooltip-tip-block-size, var(--spectrum-tooltip-tip-block-size)) + var(--mod-tooltip-margin, var(--spectrum-tooltip-margin)))}.spectrum-Tooltip--start-bottom.is-open,.spectrum-Tooltip--start-top.is-open,.spectrum-Tooltip--start.is-open{transform:translateX(calc(var(--mod-tooltip-animation-distance, var(--spectrum-tooltip-animation-distance))*-1))}.spectrum-Tooltip--start-bottom.is-open:dir(rtl),.spectrum-Tooltip--start-top.is-open:dir(rtl),.spectrum-Tooltip--start.is-open:dir(rtl),[dir=rtl] .spectrum-Tooltip--start-bottom.is-open,[dir=rtl] .spectrum-Tooltip--start-top.is-open,[dir=rtl] .spectrum-Tooltip--start.is-open{transform:translateX(var(--mod-tooltip-animation-distance,var(--spectrum-tooltip-animation-distance)))}.spectrum-Tooltip--end,.spectrum-Tooltip--end-bottom,.spectrum-Tooltip--end-top{margin-inline-start:calc(var(--mod-tooltip-tip-block-size, var(--spectrum-tooltip-tip-block-size)) + var(--mod-tooltip-margin, var(--spectrum-tooltip-margin)))}.spectrum-Tooltip--end-bottom.is-open,.spectrum-Tooltip--end-top.is-open,.spectrum-Tooltip--end.is-open{transform:translateX(var(--mod-tooltip-animation-distance,var(--spectrum-tooltip-animation-distance)))}.spectrum-Tooltip--end-bottom.is-open:dir(rtl),.spectrum-Tooltip--end-top.is-open:dir(rtl),.spectrum-Tooltip--end.is-open:dir(rtl),[dir=rtl] .spectrum-Tooltip--end-bottom.is-open,[dir=rtl] .spectrum-Tooltip--end-top.is-open,[dir=rtl] .spectrum-Tooltip--end.is-open{transform:translateX(calc(var(--mod-tooltip-animation-distance, var(--spectrum-tooltip-animation-distance))*-1))}.u-tooltip-showOnHover{display:inline-block;position:relative}.u-tooltip-showOnHover .spectrum-Tooltip{position:absolute;white-space:nowrap;visibility:visible!important;transition:transform var(--spectrum-tooltip-animation-duration) ease-in-out}.u-tooltip-showOnHover .spectrum-Tooltip-label{max-inline-size:none}.u-tooltip-showOnHover :focus .spectrum-Tooltip,.u-tooltip-showOnHover.is-focused .spectrum-Tooltip,.u-tooltip-showOnHover:focus .spectrum-Tooltip{opacity:1}.u-tooltip-showOnHover .spectrum-Tooltip--bottom,.u-tooltip-showOnHover .spectrum-Tooltip--bottom-end,.u-tooltip-showOnHover .spectrum-Tooltip--bottom-left,.u-tooltip-showOnHover .spectrum-Tooltip--bottom-right,.u-tooltip-showOnHover .spectrum-Tooltip--bottom-start,.u-tooltip-showOnHover .spectrum-Tooltip--top,.u-tooltip-showOnHover .spectrum-Tooltip--top-end,.u-tooltip-showOnHover .spectrum-Tooltip--top-left,.u-tooltip-showOnHover .spectrum-Tooltip--top-right,.u-tooltip-showOnHover .spectrum-Tooltip--top-start{
		/* stylelint-disable-next-line csstools/use-logical -- intentional use of non-logical property */left:50%;transform:translate(-50%)}.u-tooltip-showOnHover .spectrum-Tooltip--top,.u-tooltip-showOnHover .spectrum-Tooltip--top-end,.u-tooltip-showOnHover .spectrum-Tooltip--top-left,.u-tooltip-showOnHover .spectrum-Tooltip--top-right,.u-tooltip-showOnHover .spectrum-Tooltip--top-start{inset-block-end:100%}.u-tooltip-showOnHover .spectrum-Tooltip--bottom,.u-tooltip-showOnHover .spectrum-Tooltip--bottom-end,.u-tooltip-showOnHover .spectrum-Tooltip--bottom-left,.u-tooltip-showOnHover .spectrum-Tooltip--bottom-right,.u-tooltip-showOnHover .spectrum-Tooltip--bottom-start{inset-block-start:100%}.u-tooltip-showOnHover .spectrum-Tooltip--end,.u-tooltip-showOnHover .spectrum-Tooltip--end-bottom,.u-tooltip-showOnHover .spectrum-Tooltip--end-top,.u-tooltip-showOnHover .spectrum-Tooltip--left,.u-tooltip-showOnHover .spectrum-Tooltip--left-bottom,.u-tooltip-showOnHover .spectrum-Tooltip--left-top,.u-tooltip-showOnHover .spectrum-Tooltip--right,.u-tooltip-showOnHover .spectrum-Tooltip--right-bottom,.u-tooltip-showOnHover .spectrum-Tooltip--right-top,.u-tooltip-showOnHover .spectrum-Tooltip--start,.u-tooltip-showOnHover .spectrum-Tooltip--start-bottom,.u-tooltip-showOnHover .spectrum-Tooltip--start-top{inset-block-start:50%;transform:translateY(-50%)}.u-tooltip-showOnHover .spectrum-Tooltip--left,.u-tooltip-showOnHover .spectrum-Tooltip--left-bottom,.u-tooltip-showOnHover .spectrum-Tooltip--left-top,.u-tooltip-showOnHover .spectrum-Tooltip--start,.u-tooltip-showOnHover .spectrum-Tooltip--start-bottom,.u-tooltip-showOnHover .spectrum-Tooltip--start-top{
		/* stylelint-disable-next-line csstools/use-logical -- intentional use of non-logical property */right:100%}.u-tooltip-showOnHover:dir(rtl) .spectrum-Tooltip--start,.u-tooltip-showOnHover:dir(rtl) .spectrum-Tooltip--start-bottom,.u-tooltip-showOnHover:dir(rtl) .spectrum-Tooltip--start-top,[dir=rtl] .u-tooltip-showOnHover .spectrum-Tooltip--start,[dir=rtl] .u-tooltip-showOnHover .spectrum-Tooltip--start-bottom,[dir=rtl] .u-tooltip-showOnHover .spectrum-Tooltip--start-top{left:100%;right:auto}.u-tooltip-showOnHover .spectrum-Tooltip--end,.u-tooltip-showOnHover .spectrum-Tooltip--end-bottom,.u-tooltip-showOnHover .spectrum-Tooltip--end-top,.u-tooltip-showOnHover .spectrum-Tooltip--right,.u-tooltip-showOnHover .spectrum-Tooltip--right-bottom,.u-tooltip-showOnHover .spectrum-Tooltip--right-top{
		/* stylelint-disable-next-line csstools/use-logical -- intentional use of non-logical property */left:100%}.u-tooltip-showOnHover:dir(rtl) .spectrum-Tooltip--end,.u-tooltip-showOnHover:dir(rtl) .spectrum-Tooltip--end-bottom,.u-tooltip-showOnHover:dir(rtl) .spectrum-Tooltip--end-top,[dir=rtl] .u-tooltip-showOnHover .spectrum-Tooltip--end,[dir=rtl] .u-tooltip-showOnHover .spectrum-Tooltip--end-bottom,[dir=rtl] .u-tooltip-showOnHover .spectrum-Tooltip--end-top{left:auto;right:100%}.u-tooltip-showOnHover :focus .spectrum-Tooltip--top,.u-tooltip-showOnHover :focus .spectrum-Tooltip--top-end,.u-tooltip-showOnHover :focus .spectrum-Tooltip--top-left,.u-tooltip-showOnHover :focus .spectrum-Tooltip--top-right,.u-tooltip-showOnHover :focus .spectrum-Tooltip--top-start,.u-tooltip-showOnHover.is-focused .spectrum-Tooltip--top,.u-tooltip-showOnHover.is-focused .spectrum-Tooltip--top-end,.u-tooltip-showOnHover.is-focused .spectrum-Tooltip--top-left,.u-tooltip-showOnHover.is-focused .spectrum-Tooltip--top-right,.u-tooltip-showOnHover.is-focused .spectrum-Tooltip--top-start,.u-tooltip-showOnHover:focus .spectrum-Tooltip--top,.u-tooltip-showOnHover:focus .spectrum-Tooltip--top-end,.u-tooltip-showOnHover:focus .spectrum-Tooltip--top-left,.u-tooltip-showOnHover:focus .spectrum-Tooltip--top-right,.u-tooltip-showOnHover:focus .spectrum-Tooltip--top-start{transform:translate(-50%,calc(var(--mod-tooltip-animation-distance, var(--spectrum-tooltip-animation-distance))*-1))}.u-tooltip-showOnHover :focus .spectrum-Tooltip--bottom,.u-tooltip-showOnHover :focus .spectrum-Tooltip--bottom-end,.u-tooltip-showOnHover :focus .spectrum-Tooltip--bottom-left,.u-tooltip-showOnHover :focus .spectrum-Tooltip--bottom-right,.u-tooltip-showOnHover :focus .spectrum-Tooltip--bottom-start,.u-tooltip-showOnHover.is-focused .spectrum-Tooltip--bottom,.u-tooltip-showOnHover.is-focused .spectrum-Tooltip--bottom-end,.u-tooltip-showOnHover.is-focused .spectrum-Tooltip--bottom-left,.u-tooltip-showOnHover.is-focused .spectrum-Tooltip--bottom-right,.u-tooltip-showOnHover.is-focused .spectrum-Tooltip--bottom-start,.u-tooltip-showOnHover:focus .spectrum-Tooltip--bottom,.u-tooltip-showOnHover:focus .spectrum-Tooltip--bottom-end,.u-tooltip-showOnHover:focus .spectrum-Tooltip--bottom-left,.u-tooltip-showOnHover:focus .spectrum-Tooltip--bottom-right,.u-tooltip-showOnHover:focus .spectrum-Tooltip--bottom-start{transform:translate(-50%,var(--mod-tooltip-animation-distance,var(--spectrum-tooltip-animation-distance)))}.u-tooltip-showOnHover :focus .spectrum-Tooltip--left,.u-tooltip-showOnHover :focus .spectrum-Tooltip--left-bottom,.u-tooltip-showOnHover :focus .spectrum-Tooltip--left-top,.u-tooltip-showOnHover :focus .spectrum-Tooltip--start,.u-tooltip-showOnHover :focus .spectrum-Tooltip--start-bottom,.u-tooltip-showOnHover :focus .spectrum-Tooltip--start-top,.u-tooltip-showOnHover.is-focused .spectrum-Tooltip--left,.u-tooltip-showOnHover.is-focused .spectrum-Tooltip--left-bottom,.u-tooltip-showOnHover.is-focused .spectrum-Tooltip--left-top,.u-tooltip-showOnHover.is-focused .spectrum-Tooltip--start,.u-tooltip-showOnHover.is-focused .spectrum-Tooltip--start-bottom,.u-tooltip-showOnHover.is-focused .spectrum-Tooltip--start-top,.u-tooltip-showOnHover:focus .spectrum-Tooltip--left,.u-tooltip-showOnHover:focus .spectrum-Tooltip--left-bottom,.u-tooltip-showOnHover:focus .spectrum-Tooltip--left-top,.u-tooltip-showOnHover:focus .spectrum-Tooltip--start,.u-tooltip-showOnHover:focus .spectrum-Tooltip--start-bottom,.u-tooltip-showOnHover:focus .spectrum-Tooltip--start-top{transform:translate(calc(var(--mod-tooltip-animation-distance, var(--spectrum-tooltip-animation-distance))*-1),-50%)}.u-tooltip-showOnHover :focus .spectrum-Tooltip--end,.u-tooltip-showOnHover :focus .spectrum-Tooltip--end-bottom,.u-tooltip-showOnHover :focus .spectrum-Tooltip--end-top,.u-tooltip-showOnHover :focus .spectrum-Tooltip--right,.u-tooltip-showOnHover :focus .spectrum-Tooltip--right-bottom,.u-tooltip-showOnHover :focus .spectrum-Tooltip--right-top,.u-tooltip-showOnHover.is-focused .spectrum-Tooltip--end,.u-tooltip-showOnHover.is-focused .spectrum-Tooltip--end-bottom,.u-tooltip-showOnHover.is-focused .spectrum-Tooltip--end-top,.u-tooltip-showOnHover.is-focused .spectrum-Tooltip--right,.u-tooltip-showOnHover.is-focused .spectrum-Tooltip--right-bottom,.u-tooltip-showOnHover.is-focused .spectrum-Tooltip--right-top,.u-tooltip-showOnHover.is-focused:dir(rtl) .spectrum-Tooltip--start,.u-tooltip-showOnHover.is-focused:dir(rtl) .spectrum-Tooltip--start-bottom,.u-tooltip-showOnHover.is-focused:dir(rtl) .spectrum-Tooltip--start-top,.u-tooltip-showOnHover:dir(rtl) :focus .spectrum-Tooltip--start,.u-tooltip-showOnHover:dir(rtl) :focus .spectrum-Tooltip--start-bottom,.u-tooltip-showOnHover:dir(rtl) :focus .spectrum-Tooltip--start-top,.u-tooltip-showOnHover:dir(rtl):focus .spectrum-Tooltip--start,.u-tooltip-showOnHover:dir(rtl):focus .spectrum-Tooltip--start-bottom,.u-tooltip-showOnHover:dir(rtl):focus .spectrum-Tooltip--start-top,.u-tooltip-showOnHover:focus .spectrum-Tooltip--end,.u-tooltip-showOnHover:focus .spectrum-Tooltip--end-bottom,.u-tooltip-showOnHover:focus .spectrum-Tooltip--end-top,.u-tooltip-showOnHover:focus .spectrum-Tooltip--right,.u-tooltip-showOnHover:focus .spectrum-Tooltip--right-bottom,.u-tooltip-showOnHover:focus .spectrum-Tooltip--right-top,[dir=rtl] .u-tooltip-showOnHover :focus .spectrum-Tooltip--start,[dir=rtl] .u-tooltip-showOnHover :focus .spectrum-Tooltip--start-bottom,[dir=rtl] .u-tooltip-showOnHover :focus .spectrum-Tooltip--start-top,[dir=rtl] .u-tooltip-showOnHover.is-focused .spectrum-Tooltip--start,[dir=rtl] .u-tooltip-showOnHover.is-focused .spectrum-Tooltip--start-bottom,[dir=rtl] .u-tooltip-showOnHover.is-focused .spectrum-Tooltip--start-top,[dir=rtl] .u-tooltip-showOnHover:focus .spectrum-Tooltip--start,[dir=rtl] .u-tooltip-showOnHover:focus .spectrum-Tooltip--start-bottom,[dir=rtl] .u-tooltip-showOnHover:focus .spectrum-Tooltip--start-top{transform:translate(var(--mod-tooltip-animation-distance,var(--spectrum-tooltip-animation-distance)),-50%)}.u-tooltip-showOnHover.is-focused:dir(rtl) .spectrum-Tooltip--end,.u-tooltip-showOnHover.is-focused:dir(rtl) .spectrum-Tooltip--end-bottom,.u-tooltip-showOnHover.is-focused:dir(rtl) .spectrum-Tooltip--end-top,.u-tooltip-showOnHover:dir(rtl) :focus .spectrum-Tooltip--end,.u-tooltip-showOnHover:dir(rtl) :focus .spectrum-Tooltip--end-bottom,.u-tooltip-showOnHover:dir(rtl) :focus .spectrum-Tooltip--end-top,.u-tooltip-showOnHover:dir(rtl):focus .spectrum-Tooltip--end,.u-tooltip-showOnHover:dir(rtl):focus .spectrum-Tooltip--end-bottom,.u-tooltip-showOnHover:dir(rtl):focus .spectrum-Tooltip--end-top,[dir=rtl] .u-tooltip-showOnHover :focus .spectrum-Tooltip--end,[dir=rtl] .u-tooltip-showOnHover :focus .spectrum-Tooltip--end-bottom,[dir=rtl] .u-tooltip-showOnHover :focus .spectrum-Tooltip--end-top,[dir=rtl] .u-tooltip-showOnHover.is-focused .spectrum-Tooltip--end,[dir=rtl] .u-tooltip-showOnHover.is-focused .spectrum-Tooltip--end-bottom,[dir=rtl] .u-tooltip-showOnHover.is-focused .spectrum-Tooltip--end-top,[dir=rtl] .u-tooltip-showOnHover:focus .spectrum-Tooltip--end,[dir=rtl] .u-tooltip-showOnHover:focus .spectrum-Tooltip--end-bottom,[dir=rtl] .u-tooltip-showOnHover:focus .spectrum-Tooltip--end-top{transform:translate(calc(var(--mod-tooltip-animation-distance, var(--spectrum-tooltip-animation-distance))*-1),-50%)}@media (hover:hover){.u-tooltip-showOnHover:hover .spectrum-Tooltip{opacity:1}.u-tooltip-showOnHover:hover .spectrum-Tooltip--top,.u-tooltip-showOnHover:hover .spectrum-Tooltip--top-end,.u-tooltip-showOnHover:hover .spectrum-Tooltip--top-left,.u-tooltip-showOnHover:hover .spectrum-Tooltip--top-right,.u-tooltip-showOnHover:hover .spectrum-Tooltip--top-start{transform:translate(-50%,calc(var(--mod-tooltip-animation-distance, var(--spectrum-tooltip-animation-distance))*-1))}.u-tooltip-showOnHover:hover .spectrum-Tooltip--bottom,.u-tooltip-showOnHover:hover .spectrum-Tooltip--bottom-end,.u-tooltip-showOnHover:hover .spectrum-Tooltip--bottom-left,.u-tooltip-showOnHover:hover .spectrum-Tooltip--bottom-right,.u-tooltip-showOnHover:hover .spectrum-Tooltip--bottom-start{transform:translate(-50%,var(--mod-tooltip-animation-distance,var(--spectrum-tooltip-animation-distance)))}.u-tooltip-showOnHover:hover .spectrum-Tooltip--left,.u-tooltip-showOnHover:hover .spectrum-Tooltip--left-bottom,.u-tooltip-showOnHover:hover .spectrum-Tooltip--left-top,.u-tooltip-showOnHover:hover .spectrum-Tooltip--start,.u-tooltip-showOnHover:hover .spectrum-Tooltip--start-bottom,.u-tooltip-showOnHover:hover .spectrum-Tooltip--start-top{transform:translate(calc(var(--mod-tooltip-animation-distance, var(--spectrum-tooltip-animation-distance))*-1),-50%)}.u-tooltip-showOnHover:dir(rtl):hover .spectrum-Tooltip--start,.u-tooltip-showOnHover:dir(rtl):hover .spectrum-Tooltip--start-bottom,.u-tooltip-showOnHover:dir(rtl):hover .spectrum-Tooltip--start-top,.u-tooltip-showOnHover:hover .spectrum-Tooltip--end,.u-tooltip-showOnHover:hover .spectrum-Tooltip--end-bottom,.u-tooltip-showOnHover:hover .spectrum-Tooltip--end-top,.u-tooltip-showOnHover:hover .spectrum-Tooltip--right,.u-tooltip-showOnHover:hover .spectrum-Tooltip--right-bottom,.u-tooltip-showOnHover:hover .spectrum-Tooltip--right-top,[dir=rtl] .u-tooltip-showOnHover:hover .spectrum-Tooltip--start,[dir=rtl] .u-tooltip-showOnHover:hover .spectrum-Tooltip--start-bottom,[dir=rtl] .u-tooltip-showOnHover:hover .spectrum-Tooltip--start-top{transform:translate(var(--mod-tooltip-animation-distance,var(--spectrum-tooltip-animation-distance)),-50%)}.u-tooltip-showOnHover:dir(rtl):hover .spectrum-Tooltip--end,.u-tooltip-showOnHover:dir(rtl):hover .spectrum-Tooltip--end-bottom,.u-tooltip-showOnHover:dir(rtl):hover .spectrum-Tooltip--end-top,[dir=rtl] .u-tooltip-showOnHover:hover .spectrum-Tooltip--end,[dir=rtl] .u-tooltip-showOnHover:hover .spectrum-Tooltip--end-bottom,[dir=rtl] .u-tooltip-showOnHover:hover .spectrum-Tooltip--end-top{transform:translate(calc(var(--mod-tooltip-animation-distance, var(--spectrum-tooltip-animation-distance))*-1),-50%)}}