@carbon/web-components 2.58.0 → 2.59.0-rc.0

package/es/components/popover/popover.scss.js.map

@@ -1 +1 @@
-{"version":3,"file":"popover.scss.js","names":[],"sources":["../../../src/components/popover/popover.scss?lit"],"sourcesContent":["/**\n * Copyright IBM Corp. 2019, 2025\n *\n * This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n */\n$css--plex: true !default;\n\n@use '@carbon/styles/scss/config' as *;\n@use '@carbon/styles/scss/utilities' as *;\n@use '@carbon/styles/scss/utilities/convert' as *;\n@use '@carbon/styles/scss/utilities/custom-property';\n@use '@carbon/styles/scss/spacing' as *;\n@use '@carbon/styles/scss/theme';\n@use '@carbon/styles/scss/breakpoint' as *;\n@use '@carbon/styles/scss/components/popover' as *;\n\n// The distance between the popover container and the triggering element\n// Specify the distance between the popover and the trigger. This value must\n// have a unit otherwise the `calc()` expression will not work\n\n$popover-offset: custom-property.get-var('popover-offset', 0rem);\n\n// Customize the dimensions of the caret by specifying its width or height.\n// These values will be flipped in left or right directions to have the\n// correct dimensions\n$popover-caret-width: custom-property.get-var('popover-caret-width', rem(12px));\n$popover-caret-height: custom-property.get-var(\n  'popover-caret-height',\n  rem(6px)\n);\n\n// The drop shadow value used for the popover container\n$popover-drop-shadow: custom-property.get-var(\n  'popover-drop-shadow',\n  drop-shadow(0 $spacing-01 $spacing-01 rgba(0, 0, 0, 0.2))\n);\n\n// The border value used for the popover container\n$popover-border-color: custom-property.get-var(\n  'popover-border-color',\n  theme.$border-subtle\n);\n\n:host(#{$prefix}-tooltip),\n:host(#{$prefix}-popover) {\n  ::slotted(.#{$prefix}--popover--tab-tip__button) {\n    @include popover-tab-tip-button;\n  }\n}\n\n:host(#{$prefix}-tooltip[highContrast]),\n:host(#{$prefix}-popover[highContrast]) {\n  ::slotted(#{$prefix}-tooltip-content),\n  ::slotted(#{$prefix}-popover-content) {\n    @include popover-highcontrast-base;\n  }\n}\n\n:host(\n    #{$prefix}-popover-content[backgroundToken='background']:not([highContrast])\n  ) {\n  .#{$prefix}--popover-content {\n    background: theme.$background;\n  }\n}\n\n:host(\n    #{$prefix}-popover-content[open][caret][backgroundToken='background']:not(\n        [highContrast]\n      )\n  ) {\n  .#{$prefix}--popover-caret {\n    &::after {\n      background: theme.$background;\n    }\n  }\n}\n\n:host(#{$prefix}-popover[tabTip][open]) {\n  ::slotted(.#{$prefix}--popover--tab-tip__button) {\n    background: theme.$layer !important; /* stylelint-disable-line declaration-no-important */\n    box-shadow: 0 $spacing-01 $spacing-01 rgba(0, 0, 0, 0.2);\n  }\n}\n\n:host(#{$prefix}-tooltip-content),\n:host(#{$prefix}-popover-content) {\n  @include popover-base;\n}\n\n:host(#{$prefix}-tooltip-content[open]),\n:host(#{$prefix}-popover-content[open]),\n:host(#{$prefix}-toggletip[open]),\n:host(#{$prefix}-ai-label[open]),\n:host(#{$prefix}-slug[open]) {\n  .#{$prefix}--popover-content {\n    display: block;\n  }\n}\n\n:host(#{$prefix}-popover) {\n  .#{$prefix}--popover--tab-tip__button:focus-within {\n    @include focus-outline('outline');\n  }\n}\n\n:host(#{$prefix}-tooltip-content[open][tabTip]),\n:host(#{$prefix}-popover-content[open][tabTip]) {\n  .#{$prefix}--popover-content {\n    border-radius: 0;\n  }\n}\n:host(#{$prefix}-popover[tabTip][open]) {\n  ::slotted(button[class*='#{$prefix}--popover--tab-tip__button']:not(:focus)) {\n    &::after {\n      position: absolute;\n      z-index: z('floating') + 1;\n      background: theme.$layer;\n      block-size: 2px;\n      content: '';\n      inline-size: 100%;\n      inset-block-end: 0;\n    }\n  }\n}\n\n:host(#{$prefix}-tooltip-content[open][caret]),\n:host(#{$prefix}-popover-content[open][caret]),\n:host(#{$prefix}-toggletip[open]),\n:host(#{$prefix}-ai-label[open]),\n:host(#{$prefix}-slug[open]) {\n  .#{$prefix}--popover-caret {\n    display: block;\n\n    // caret background\n    &::after {\n      position: absolute;\n      display: block;\n      background: theme.$layer;\n      content: '';\n    }\n\n    // caret border\n    &::before {\n      position: absolute;\n      display: none;\n      background-color: $popover-border-color;\n      content: '';\n    }\n  }\n}\n\n:host(#{$prefix}-tooltip-content[open][caret][highContrast]),\n:host(#{$prefix}-popover-content[open][caret][highContrast]) {\n  .#{$prefix}--popover-caret {\n    &::after {\n      background: theme.$background-inverse;\n    }\n  }\n}\n\n:host(#{$prefix}-tooltip-content[border]),\n:host(#{$prefix}-popover-content[border]) {\n  .#{$prefix}--popover-content {\n    outline: 1px solid $popover-border-color;\n    outline-offset: -1px;\n  }\n}\n\n:host(#{$prefix}-tooltip-content[dropShadow]),\n:host(#{$prefix}-popover-content[dropShadow]) {\n  .#{$prefix}--popover {\n    filter: $popover-drop-shadow;\n  }\n}\n\n:host(#{$prefix}-tooltip-content[open][caret][border]),\n:host(#{$prefix}-popover-content[open][caret][border]) {\n  .#{$prefix}--popover-caret {\n    &::before {\n      display: block;\n    }\n  }\n}\n\n//-----------------------------------------------------------------------------\n// Bottom\n//-----------------------------------------------------------------------------\n\n// bottom caret\n:host(#{$prefix}-tooltip-content[align^='bottom']:not([autoalign])),\n:host(#{$prefix}-popover-content[align^='bottom']:not([autoalign])),\n:host(#{$prefix}-toggletip[alignment^='bottom']:not([autoalign])),\n:host(#{$prefix}-ai-label[alignment^='bottom']:not([autoalign])),\n:host(#{$prefix}-slug[alignment^='bottom']:not([autoalign])) {\n  .#{$prefix}--popover-caret {\n    block-size: $popover-caret-height;\n    inline-size: $popover-caret-width;\n    inset-block-end: 0;\n    inset-inline-start: 50%;\n    transform: translate(-50%, $popover-offset);\n\n    &::after {\n      block-size: $popover-caret-height;\n      clip-path: polygon(0% 100%, 50% 0%, 100% 100%);\n      inline-size: $popover-caret-width;\n    }\n  }\n}\n\n// bottom caret border\n:host(#{$prefix}-tooltip-content[align^='bottom'][border]:not([autoalign])),\n:host(#{$prefix}-popover-content[align^='bottom'][border]:not([autoalign])),\n:host(#{$prefix}-toggletip[alignment^='bottom'][border]:not([autoalign])),\n:host(#{$prefix}-ai-label[alignment^='bottom'][border]:not([autoalign])),\n:host(#{$prefix}-slug[alignment^='bottom'][border]:not([autoalign])) {\n  .#{$prefix}--popover-caret {\n    &::before {\n      block-size: $popover-caret-height;\n      clip-path: polygon(0% 100%, 50% 0%, 100% 100%);\n      inline-size: $popover-caret-width;\n    }\n\n    &::after {\n      inline-size: calc($popover-caret-width - 1px);\n      inset-block-start: 1px;\n      inset-inline-start: 0.5px;\n    }\n  }\n}\n\n// rtl\n:host(#{$prefix}-tooltip-content:dir(rtl)[align^='bottom']:not([autoalign])),\n:host(#{$prefix}-popover-content:dir(rtl)[align^='bottom']:not([autoalign])),\n:host(#{$prefix}-toggletip:dir(rtl)[alignment^='bottom']:not([autoalign])),\n:host(#{$prefix}-ai-label:dir(rtl)[alignment^='bottom']:not([autoalign])),\n:host(#{$prefix}-slug:dir(rtl)[alignment^='bottom']:not([autoalign])) {\n  .#{$prefix}--popover-caret {\n    transform: translate(50%, $popover-offset);\n  }\n}\n\n:host(#{$prefix}-ai-label[alignment^='bottom']:not([autoalign]))\n  .#{$prefix}--popover-caret,\n:host(#{$prefix}-slug[alignment^='bottom']:not([autoalign]))\n  .#{$prefix}--popover-caret {\n  clip-path: none;\n}\n\n:host(#{$prefix}-tooltip-content[align='bottom']:not([autoalign])),\n:host(#{$prefix}-popover-content[align='bottom']:not([autoalign])),\n:host(#{$prefix}-toggletip[alignment='bottom']:not([autoalign])),\n:host(#{$prefix}-ai-label[alignment='bottom']:not([autoalign])),\n:host(#{$prefix}-slug[alignment='bottom']:not([autoalign])) {\n  .#{$prefix}--popover-content {\n    inset-block-end: 0;\n    inset-inline-start: 50%;\n    transform: translate(-50%, calc(100% + $popover-offset));\n  }\n}\n\n// rtl\n:host(#{$prefix}-tooltip-content:dir(rtl)[align='bottom']:not([autoalign])),\n:host(#{$prefix}-popover-content:dir(rtl)[align='bottom']:not([autoalign])),\n:host(#{$prefix}-toggletip:dir(rtl)[alignment='bottom']:not([autoalign])),\n:host(#{$prefix}-ai-label:dir(rtl)[alignment='bottom']:not([autoalign])),\n:host(#{$prefix}-slug:dir(rtl)[alignment='bottom']:not([autoalign])) {\n  .#{$prefix}--popover-content {\n    transform: translate(50%, calc(100% + $popover-offset));\n  }\n}\n\n:host(#{$prefix}-tooltip-content[align='bottom-left']:not([autoalign])),\n:host(#{$prefix}-popover-content[align='bottom-left']:not([autoalign])),\n:host(#{$prefix}-toggletip[alignment='bottom-left']:not([autoalign])),\n:host(#{$prefix}-ai-label[alignment='bottom-left']:not([autoalign])),\n:host(#{$prefix}-slug[alignment='bottom-left']:not([autoalign])),\n:host(#{$prefix}-tooltip-content[align='bottom-start']:not([autoalign])),\n:host(#{$prefix}-popover-content[align='bottom-start']:not([autoalign])),\n:host(#{$prefix}-toggletip[alignment='bottom-start']:not([autoalign])),\n:host(#{$prefix}-ai-label[alignment='bottom-start']:not([autoalign])),\n:host(#{$prefix}-slug[alignment='bottom-start']:not([autoalign])) {\n  .#{$prefix}--popover-content {\n    inset-block-end: 0;\n    inset-inline-start: calc(50% - $popover-offset);\n    transform: translate(\n      calc(-1 * $popover-offset),\n      calc(100% + $popover-offset)\n    );\n  }\n}\n:host(#{$prefix}-popover-content[tabTip][align='bottom-left']:not([autoalign])),\n:host(\n    #{$prefix}-popover-content[tabTip][align='bottom-start']:not([autoalign])\n  ) {\n  .#{$prefix}--popover-content {\n    inset-inline-start: 0;\n  }\n}\n\n// rtl\n:host(\n    #{$prefix}-tooltip-content:dir(rtl)[align='bottom-left']:not([autoalign])\n  ),\n:host(\n    #{$prefix}-popover-content:dir(rtl)[align='bottom-left']:not([autoalign])\n  ),\n:host(#{$prefix}-toggletip:dir(rtl)[alignment='bottom-left']:not([autoalign])),\n:host(#{$prefix}-ai-label:dir(rtl)[alignment='bottom-left']:not([autoalign])),\n:host(#{$prefix}-slug:dir(rtl)[alignment='bottom-left']:not([autoalign])),\n:host(\n    #{$prefix}-tooltip-content:dir(rtl)[align='bottom-start']:not([autoalign])\n  ),\n:host(\n    #{$prefix}-popover-content:dir(rtl)[align='bottom-start']:not([autoalign])\n  ),\n:host(#{$prefix}-toggletip:dir(rtl)[alignment='bottom-start']:not([autoalign])),\n:host(#{$prefix}-ai-label:dir(rtl)[alignment='bottom-start']:not([autoalign])),\n:host(#{$prefix}-slug:dir(rtl)[alignment='bottom-start']:not([autoalign])) {\n  .#{$prefix}--popover-content {\n    inset-inline-end: calc(50% - $popover-offset);\n    inset-inline-start: initial;\n  }\n}\n\n:host(\n    #{$prefix}-popover-content:dir(rtl)[tabTip][align='bottom-left']:not(\n        [autoalign]\n      )\n  ),\n:host(\n    #{$prefix}-popover-content:dir(rtl)[tabTip][align='bottom-start']:not(\n        [autoalign]\n      )\n  ) {\n  .#{$prefix}--popover-content {\n    inset-inline-end: 0;\n  }\n}\n\n:host(#{$prefix}-tooltip-content[align='bottom-right']:not([autoalign])),\n:host(#{$prefix}-popover-content[align='bottom-right']:not([autoalign])),\n:host(#{$prefix}-toggletip[alignment='bottom-right']:not([autoalign])),\n:host(#{$prefix}-ai-label[alignment='bottom-right']:not([autoalign])),\n:host(#{$prefix}-slug[alignment='bottom-right']:not([autoalign])),\n:host(#{$prefix}-tooltip-content[align='bottom-end']:not([autoalign])),\n:host(#{$prefix}-popover-content[align='bottom-end']:not([autoalign])),\n:host(#{$prefix}-toggletip[alignment='bottom-end']:not([autoalign])),\n:host(#{$prefix}-ai-label[alignment='bottom-end']:not([autoalign])),\n:host(#{$prefix}-slug[alignment='bottom-end']:not([autoalign])) {\n  .#{$prefix}--popover-content {\n    inset-block-end: 0;\n    inset-inline-end: calc(50% - $popover-offset);\n    transform: translate($popover-offset, calc(100% + $popover-offset));\n  }\n}\n:host(\n    #{$prefix}-popover-content[tabTip][align='bottom-right']:not([autoalign])\n  ),\n:host(#{$prefix}-popover-content[tabTip][align='bottom-end']:not([autoalign])) {\n  .#{$prefix}--popover-content {\n    inset-inline-end: 0;\n  }\n}\n\n// rtl\n:host(\n    #{$prefix}-tooltip-content:dir(rtl)[align='bottom-right']:not([autoalign])\n  ),\n:host(\n    #{$prefix}-popover-content:dir(rtl)[align='bottom-right']:not([autoalign])\n  ),\n:host(#{$prefix}-toggletip:dir(rtl)[alignment='bottom-right']:not([autoalign])),\n:host(#{$prefix}-ai-label:dir(rtl)[alignment='bottom-right']:not([autoalign])),\n:host(#{$prefix}-slug:dir(rtl)[alignment='bottom-right']:not([autoalign])),\n:host(#{$prefix}-tooltip-content:dir(rtl)[align='bottom-end']:not([autoalign])),\n:host(#{$prefix}-popover-content:dir(rtl)[align='bottom-end']:not([autoalign])),\n:host(#{$prefix}-toggletip:dir(rtl)[alignment='bottom-end']:not([autoalign])),\n:host(#{$prefix}-ai-label:dir(rtl)[alignment='bottom-end']:not([autoalign])),\n:host(#{$prefix}-slug:dir(rtl)[alignment='bottom-end']:not([autoalign])) {\n  .#{$prefix}--popover-content {\n    inset-inline-start: calc(50% - $popover-offset);\n  }\n}\n\n:host(\n    #{$prefix}-popover-content:dir(rtl)[tabTip][align='bottom-right']:not(\n        [autoalign]\n      )\n  ),\n:host(\n    #{$prefix}-popover-content:dir(rtl)[tabTip][align='bottom-end']:not(\n        [autoalign]\n      )\n  ) {\n  .#{$prefix}--popover-content {\n    inset-inline-start: 0;\n  }\n}\n\n//-----------------------------------------------------------------------------\n// Bottom - No Caret Spacing (non-autoalign)\n//-----------------------------------------------------------------------------\n\n:host(\n    #{$prefix}-popover-content[align='bottom']:not([caret]):not(\n        [autoalign]\n      ):not([tabTip])\n  ),\n:host(\n    #{$prefix}-popover-content[align='bottom-start']:not([caret]):not(\n        [autoalign]\n      ):not([tabTip])\n  ),\n:host(\n    #{$prefix}-popover-content[align='bottom-end']:not([caret]):not(\n        [autoalign]\n      ):not([tabTip])\n  ) {\n  .#{$prefix}--popover-content {\n    inset-block-end: -$spacing-02;\n  }\n}\n\n:host(\n    #{$prefix}-popover-content[align='bottom-start']:not([caret]):not(\n        [autoalign]\n      ):not([tabTip])\n  ),\n:host(\n    #{$prefix}-popover-content[align='bottom-left']:not([caret]):not(\n        [autoalign]\n      ):not([tabTip])\n  ) {\n  .#{$prefix}--popover-content {\n    inset-inline-start: calc(50% - $popover-offset - 1rem);\n  }\n}\n\n:host(\n    #{$prefix}-popover-content[align='bottom-end']:not([caret]):not(\n        [autoalign]\n      ):not([tabTip])\n  ),\n:host(\n    #{$prefix}-popover-content[align='bottom-right']:not([caret]):not(\n        [autoalign]\n      ):not([tabTip])\n  ) {\n  .#{$prefix}--popover-content {\n    inset-inline-end: calc(50% - $popover-offset - 1rem);\n  }\n}\n\n//-----------------------------------------------------------------------------\n// Left\n//-----------------------------------------------------------------------------\n\n:host(#{$prefix}-tooltip-content[align^='left']:not([autoalign])),\n:host(#{$prefix}-popover-content[align^='left']:not([autoalign])),\n:host(#{$prefix}-toggletip[alignment^='left']:not([autoalign])),\n:host(#{$prefix}-ai-label[alignment^='left']:not([autoalign])),\n:host(#{$prefix}-slug[alignment^='left']:not([autoalign])) {\n  .#{$prefix}--popover-caret {\n    block-size: $popover-caret-width;\n    inline-size: $popover-caret-height;\n    inset-block-start: 50%;\n    inset-inline-end: 100%;\n    transform: translate(calc(-1 * $popover-offset + 100%), -50%);\n\n    &::after {\n      block-size: $popover-caret-width;\n      clip-path: polygon(0% 0%, 100% 50%, 0% 100%);\n      inline-size: $popover-caret-height;\n    }\n  }\n}\n\n// left caret border\n:host(#{$prefix}-tooltip-content[align^='left'][border]:not([autoalign])),\n:host(#{$prefix}-popover-content[align^='left'][border]:not([autoalign])),\n:host(#{$prefix}-toggletip[alignment^='left'][border]:not([autoalign])),\n:host(#{$prefix}-ai-label[alignment^='left'][border]:not([autoalign])),\n:host(#{$prefix}-slug[alignment^='left'][border]:not([autoalign])) {\n  .#{$prefix}--popover-caret {\n    &::before {\n      block-size: $popover-caret-width;\n      clip-path: polygon(0% 0%, 100% 50%, 0% 100%);\n      inline-size: $popover-caret-height;\n    }\n\n    &::after {\n      inset-inline-start: -1px;\n    }\n  }\n}\n\n// rtl\n:host(#{$prefix}-tooltip-content:dir(rtl)[align^='left']:not([autoalign])),\n:host(#{$prefix}-popover-content:dir(rtl)[align^='left']:not([autoalign])),\n:host(#{$prefix}-toggletip:dir(rtl)[alignment^='left']:not([autoalign])),\n:host(#{$prefix}-ai-label:dir(rtl)[alignment^='left']:not([autoalign])),\n:host(#{$prefix}-slug:dir(rtl)[alignment^='left']:not([autoalign])) {\n  .#{$prefix}--popover-caret {\n    inset-inline-end: initial;\n    inset-inline-start: 100%;\n\n    &::after {\n      inset-inline-start: 1px;\n    }\n  }\n}\n\n:host(#{$prefix}-tooltip-content[align='left']:not([autoalign])),\n:host(#{$prefix}-popover-content[align='left']:not([autoalign])),\n:host(#{$prefix}-toggletip[alignment='left']:not([autoalign])),\n:host(#{$prefix}-ai-label[alignment='left']:not([autoalign])),\n:host(#{$prefix}-slug[alignment='left']:not([autoalign])) {\n  .#{$prefix}--popover-content {\n    inset-block-start: 50%;\n    inset-inline-end: 100%;\n    // Add in 0.1px to prevent rounding errors where the content is\n    // moved farther than the caret\n    transform: translate(calc(-1 * $popover-offset + 0.1px), -50%);\n  }\n}\n\n:host(#{$prefix}-tooltip-content[align='left-bottom']:not([autoalign])),\n:host(#{$prefix}-popover-content[align='left-bottom']:not([autoalign])),\n:host(#{$prefix}-toggletip[alignment='left-bottom']:not([autoalign])),\n:host(#{$prefix}-ai-label[alignment='left-bottom']:not([autoalign])),\n:host(#{$prefix}-slug[alignment='left-bottom']:not([autoalign])),\n:host(#{$prefix}-tooltip-content[align='left-end']:not([autoalign])),\n:host(#{$prefix}-popover-content[align='left-end']:not([autoalign])),\n:host(#{$prefix}-toggletip[alignment='left-end']:not([autoalign])),\n:host(#{$prefix}-ai-label[alignment='left-end']:not([autoalign])),\n:host(#{$prefix}-slug[alignment='left-end']:not([autoalign])) {\n  .#{$prefix}--popover-content {\n    inset-block-end: 50%;\n    inset-inline-end: 100%;\n    // Add in 0.1px to prevent rounding errors where the content is\n    // moved farther than the caret\n    transform: translate(\n      calc(-1 * $popover-offset),\n      calc(0.5 * $popover-offset + $spacing-05)\n    );\n  }\n}\n\n:host(#{$prefix}-tooltip-content[align='left-top']:not([autoalign])),\n:host(#{$prefix}-popover-content[align='left-top']:not([autoalign])),\n:host(#{$prefix}-toggletip[alignment='left-top']:not([autoalign])),\n:host(#{$prefix}-ai-label[alignment='left-top']:not([autoalign])),\n:host(#{$prefix}-slug[alignment='left-top']:not([autoalign])),\n:host(#{$prefix}-tooltip-content[align='left-start']:not([autoalign])),\n:host(#{$prefix}-popover-content[align='left-start']:not([autoalign])),\n:host(#{$prefix}-toggletip[alignment='left-start']:not([autoalign])),\n:host(#{$prefix}-ai-label[alignment='left-start']:not([autoalign])),\n:host(#{$prefix}-slug[alignment='left-start']:not([autoalign])) {\n  .#{$prefix}--popover-content {\n    inset-block-start: 50%;\n    inset-inline-end: 100%;\n    // Add in 0.1px to prevent rounding errors where the content is\n    // moved farther than the caret\n    transform: translate(\n      calc(-1 * $popover-offset),\n      calc(-1 * 0.5 * $popover-offset - $spacing-05)\n    );\n  }\n}\n\n// rtl\n:host(#{$prefix}-tooltip-content:dir(rtl)[align^='left']:not([autoalign])),\n:host(#{$prefix}-popover-content:dir(rtl)[align^='left']:not([autoalign])),\n:host(#{$prefix}-toggletip:dir(rtl)[alignment^='left']:not([autoalign])),\n:host(#{$prefix}-ai-label:dir(rtl)[alignment^='left']:not([autoalign])),\n:host(#{$prefix}-slug:dir(rtl)[alignment^='left']:not([autoalign])) {\n  .#{$prefix}--popover-content {\n    inset-inline-end: initial;\n    inset-inline-start: 100%;\n  }\n}\n\n//-----------------------------------------------------------------------------\n// Left - No Caret Spacing (non-autoalign)\n//-----------------------------------------------------------------------------\n\n:host(\n    #{$prefix}-popover-content[align='left']:not([caret]):not([autoalign]):not(\n        [tabTip]\n      )\n  ),\n:host(\n    #{$prefix}-popover-content[align='left-start']:not([caret]):not(\n        [autoalign]\n      ):not([tabTip])\n  ),\n:host(\n    #{$prefix}-popover-content[align='left-end']:not([caret]):not(\n        [autoalign]\n      ):not([tabTip])\n  ) {\n  .#{$prefix}--popover-content {\n    inset-inline-end: calc(100% + $spacing-02);\n  }\n}\n\n//-----------------------------------------------------------------------------\n// Right\n//-----------------------------------------------------------------------------\n\n// right caret\n:host(#{$prefix}-tooltip-content[align^='right']:not([autoalign])),\n:host(#{$prefix}-popover-content[align^='right']:not([autoalign])),\n:host(#{$prefix}-toggletip[alignment^='right']:not([autoalign])),\n:host(#{$prefix}-ai-label[alignment^='right']:not([autoalign])),\n:host(#{$prefix}-slug[alignment^='right']:not([autoalign])) {\n  .#{$prefix}--popover-caret {\n    block-size: $popover-caret-width;\n    inline-size: $popover-caret-height;\n    inset-block-start: 50%;\n    inset-inline-start: 100%;\n    transform: translate(calc($popover-offset - 100%), -50%);\n\n    &::after {\n      block-size: $popover-caret-width;\n      clip-path: polygon(0% 50%, 100% 0%, 100% 100%);\n      inline-size: $popover-caret-height;\n    }\n  }\n}\n\n// right caret border\n:host(#{$prefix}-tooltip-content[align^='right'][border]:not([autoalign])),\n:host(#{$prefix}-popover-content[align^='right'][border]:not([autoalign])),\n:host(#{$prefix}-toggletip[alignment^='right'][border]:not([autoalign])),\n:host(#{$prefix}-ai-label[alignment^='right'][border]:not([autoalign])),\n:host(#{$prefix}-slug[alignment^='right'][border]:not([autoalign])) {\n  .#{$prefix}--popover-caret {\n    &::before {\n      block-size: $popover-caret-width;\n      clip-path: polygon(0% 50%, 100% 0%, 100% 100%);\n      inline-size: $popover-caret-height;\n    }\n\n    &::after {\n      inset-inline-start: 1px;\n    }\n  }\n}\n\n// rtl\n:host(#{$prefix}-tooltip-content:dir(rtl)[align^='right']:not([autoalign])),\n:host(#{$prefix}-popover-content:dir(rtl)[align^='right']:not([autoalign])),\n:host(#{$prefix}-toggletip:dir(rtl)[alignment^='right']:not([autoalign])),\n:host(#{$prefix}-ai-label:dir(rtl)[alignment^='right']:not([autoalign])),\n:host(#{$prefix}-slug:dir(rtl)[alignment^='right']:not([autoalign])) {\n  .#{$prefix}--popover-caret {\n    inset-inline-end: 100%;\n    inset-inline-start: initial;\n\n    &::after {\n      inset-inline-start: -1px;\n    }\n  }\n}\n\n:host(#{$prefix}-tooltip-content[align='right']:not([autoalign])),\n:host(#{$prefix}-popover-content[align='right']:not([autoalign])),\n:host(#{$prefix}-toggletip[alignment='right']:not([autoalign])),\n:host(#{$prefix}-ai-label[alignment='right']:not([autoalign])),\n:host(#{$prefix}-slug[alignment='right']:not([autoalign])) {\n  .#{$prefix}--popover-content {\n    inset-block-start: 50%;\n    inset-inline-start: 100%;\n    // Add in 0.1px to prevent rounding errors where the content is\n    // moved farther than the caret\n    transform: translate($popover-offset, -50%);\n  }\n}\n\n:host(#{$prefix}-tooltip-content[align='right-bottom']:not([autoalign])),\n:host(#{$prefix}-popover-content[align='right-bottom']:not([autoalign])),\n:host(#{$prefix}-toggletip[alignment='right-bottom']:not([autoalign])),\n:host(#{$prefix}-ai-label[alignment='right-bottom']:not([autoalign])),\n:host(#{$prefix}-slug[alignment='right-bottom']:not([autoalign])),\n:host(#{$prefix}-tooltip-content[align='right-end']:not([autoalign])),\n:host(#{$prefix}-popover-content[align='right-end']:not([autoalign])),\n:host(#{$prefix}-toggletip[alignment='right-end']:not([autoalign])),\n:host(#{$prefix}-ai-label[alignment='right-end']:not([autoalign])),\n:host(#{$prefix}-slug[alignment='right-end']:not([autoalign])) {\n  .#{$prefix}--popover-content {\n    inset-block-end: 50%;\n    inset-inline-start: 100%;\n    transform: translate($popover-offset, calc(0.5 * $popover-offset + 16px));\n  }\n}\n\n:host(#{$prefix}-tooltip-content[align='right-top']:not([autoalign])),\n:host(#{$prefix}-popover-content[align='right-top']:not([autoalign])),\n:host(#{$prefix}-toggletip[alignment='right-top']:not([autoalign])),\n:host(#{$prefix}-ai-label[alignment='right-top']:not([autoalign])),\n:host(#{$prefix}-slug[alignment='right-top']:not([autoalign])),\n:host(#{$prefix}-tooltip-content[align='right-start']:not([autoalign])),\n:host(#{$prefix}-popover-content[align='right-start']:not([autoalign])),\n:host(#{$prefix}-toggletip[alignment='right-start']:not([autoalign])),\n:host(#{$prefix}-ai-label[alignment='right-start']:not([autoalign])),\n:host(#{$prefix}-slug[alignment='right-start']:not([autoalign])) {\n  .#{$prefix}--popover-content {\n    inset-block-start: 50%;\n    inset-inline-start: 100%;\n    transform: translate(\n      $popover-offset,\n      calc(0.5 * $popover-offset * -1 - 16px)\n    );\n  }\n}\n\n// rtl\n:host(#{$prefix}-tooltip-content:dir(rtl)[align^='right']:not([autoalign])),\n:host(#{$prefix}-popover-content:dir(rtl)[align^='right']:not([autoalign])),\n:host(#{$prefix}-toggletip:dir(rtl)[alignment^='right']:not([autoalign])),\n:host(#{$prefix}-ai-label:dir(rtl)[alignment^='right']:not([autoalign])),\n:host(#{$prefix}-slug:dir(rtl)[alignment^='right']:not([autoalign])) {\n  .#{$prefix}--popover-content {\n    inset-inline-end: 100%;\n    inset-inline-start: initial;\n  }\n}\n\n//-----------------------------------------------------------------------------\n// Right - No Caret Spacing (non-autoalign)\n//-----------------------------------------------------------------------------\n\n:host(\n    #{$prefix}-popover-content[align='right']:not([caret]):not([autoalign]):not(\n        [tabTip]\n      )\n  ),\n:host(\n    #{$prefix}-popover-content[align='right-start']:not([caret]):not(\n        [autoalign]\n      ):not([tabTip])\n  ),\n:host(\n    #{$prefix}-popover-content[align='right-end']:not([caret]):not(\n        [autoalign]\n      ):not([tabTip])\n  ) {\n  .#{$prefix}--popover-content {\n    inset-inline-start: calc(100% + $spacing-02);\n  }\n}\n\n//-----------------------------------------------------------------------------\n// Top\n//-----------------------------------------------------------------------------\n\n// top caret\n:host(#{$prefix}-tooltip-content[align^='top']:not([autoalign])),\n:host(#{$prefix}-popover-content[align^='top']:not([autoalign])),\n:host(#{$prefix}-toggletip[alignment^='top']:not([autoalign])),\n:host(#{$prefix}-ai-label[alignment^='top']:not([autoalign])),\n:host(#{$prefix}-slug[alignment^='top']:not([autoalign])) {\n  .#{$prefix}--popover-caret {\n    block-size: $popover-caret-height;\n    inline-size: $popover-caret-width;\n    inset-block-start: 0;\n    inset-inline-start: 50%;\n    transform: translate(-50%, calc(-1 * $popover-offset));\n\n    &::after {\n      block-size: $popover-caret-height;\n      clip-path: polygon(0% 0%, 50% 100%, 100% 0%);\n      inline-size: $popover-caret-width;\n    }\n  }\n}\n\n// top caret border\n:host(#{$prefix}-tooltip-content[align^='top'][border]:not([autoalign])),\n:host(#{$prefix}-popover-content[align^='top'][border]:not([autoalign])),\n:host(#{$prefix}-toggletip[alignment^='top'][border]:not([autoalign])),\n:host(#{$prefix}-ai-label[alignment^='top'][border]:not([autoalign])),\n:host(#{$prefix}-slug[alignment^='top'][border]:not([autoalign])) {\n  .#{$prefix}--popover-caret {\n    &::before {\n      block-size: $popover-caret-height;\n      clip-path: polygon(0% 0%, 50% 100%, 100% 0%);\n      inline-size: $popover-caret-width;\n    }\n\n    &::after {\n      inline-size: calc($popover-caret-width - 1px);\n      inset-block-start: -1px;\n      inset-inline-start: 0.5px;\n    }\n  }\n}\n\n// rtl\n:host(#{$prefix}-tooltip-content:dir(rtl)[align^='top']:not([autoalign])),\n:host(#{$prefix}-popover-content:dir(rtl)[align^='top']:not([autoalign])),\n:host(#{$prefix}-toggletip:dir(rtl)[alignment^='top']:not([autoalign])),\n:host(#{$prefix}-ai-label:dir(rtl)[alignment^='top']:not([autoalign])),\n:host(#{$prefix}-slug:dir(rtl)[alignment^='top']:not([autoalign])) {\n  .#{$prefix}--popover-caret {\n    transform: translate(50%, calc(-1 * $popover-offset));\n  }\n}\n\n:host(#{$prefix}-tooltip-content[align='top']:not([autoalign])),\n:host(#{$prefix}-popover-content[align='top']:not([autoalign])),\n:host(#{$prefix}-toggletip[alignment='top']:not([autoalign])),\n:host(#{$prefix}-ai-label[alignment='top']:not([autoalign])),\n:host(#{$prefix}-slug[alignment='top']:not([autoalign])) {\n  .#{$prefix}--popover-content {\n    inset-block-start: 0;\n    inset-inline-start: 50%;\n    transform: translate(-50%, calc(-100% - $popover-offset));\n  }\n}\n\n// rtl\n:host(#{$prefix}-tooltip-content:dir(rtl)[align='top']:not([autoalign])),\n:host(#{$prefix}-popover-content:dir(rtl)[align='top']:not([autoalign])),\n:host(#{$prefix}-toggletip:dir(rtl)[alignment='top']:not([autoalign])),\n:host(#{$prefix}-ai-label:dir(rtl)[alignment='top']:not([autoalign])),\n:host(#{$prefix}-slug[alignment='top']:not([autoalign])) {\n  .#{$prefix}--popover-content {\n    transform: translate(50%, calc(-100% - $popover-offset));\n  }\n}\n\n:host(#{$prefix}-tooltip-content[align='top-left']:not([autoalign])),\n:host(#{$prefix}-popover-content[align='top-left']:not([autoalign])),\n:host(#{$prefix}-toggletip[alignment='top-left']:not([autoalign])),\n:host(#{$prefix}-ai-label[alignment='top-left']:not([autoalign])),\n:host(#{$prefix}-slug[alignment='top-left']:not([autoalign])),\n:host(#{$prefix}-tooltip-content[align='top-start']:not([autoalign])),\n:host(#{$prefix}-popover-content[align='top-start']:not([autoalign])),\n:host(#{$prefix}-toggletip[alignment='top-start']:not([autoalign])),\n:host(#{$prefix}-ai-label[alignment='top-start']:not([autoalign])),\n:host(#{$prefix}-slug[alignment='top-start']:not([autoalign])) {\n  .#{$prefix}--popover-content {\n    inset-block-start: 0;\n    inset-inline-start: calc(50% - $popover-offset);\n    transform: translate(\n      calc(-1 * $popover-offset),\n      calc(-100% - $popover-offset)\n    );\n  }\n}\n\n// rtl\n:host(#{$prefix}-tooltip-content:dir(rtl)[align='top-left']:not([autoalign])),\n:host(#{$prefix}-popover-content:dir(rtl)[align='top-left']:not([autoalign])),\n:host(#{$prefix}-toggletip:dir(rtl)[alignment='top-left']:not([autoalign])),\n:host(#{$prefix}-ai-label:dir(rtl)[alignment='top-left']:not([autoalign])),\n:host(#{$prefix}-slug[alignment='top-left']:not([autoalign])),\n:host(#{$prefix}-tooltip-content:dir(rtl)[align='top-start']:not([autoalign])),\n:host(#{$prefix}-popover-content:dir(rtl)[align='top-start']:not([autoalign])),\n:host(#{$prefix}-toggletip:dir(rtl)[alignment='top-start']:not([autoalign])),\n:host(#{$prefix}-ai-label:dir(rtl)[alignment='top-start']:not([autoalign])),\n:host(#{$prefix}-slug[alignment='top-start']:not([autoalign])) {\n  .#{$prefix}--popover-content {\n    inset-inline-end: calc(50% - $popover-offset);\n    inset-inline-start: initial;\n  }\n}\n\n:host(#{$prefix}-tooltip-content[align='top-right']:not([autoalign])),\n:host(#{$prefix}-popover-content[align='top-right']:not([autoalign])),\n:host(#{$prefix}-toggletip[alignment='top-right']:not([autoalign])),\n:host(#{$prefix}-ai-label[alignment='top-right']:not([autoalign])),\n:host(#{$prefix}-slug[alignment='top-right']:not([autoalign])),\n:host(#{$prefix}-tooltip-content[align='top-end']:not([autoalign])),\n:host(#{$prefix}-popover-content[align='top-end']:not([autoalign])),\n:host(#{$prefix}-toggletip[alignment='top-end']:not([autoalign])),\n:host(#{$prefix}-ai-label[alignment='top-end']:not([autoalign])),\n:host(#{$prefix}-slug[alignment='top-end']:not([autoalign])) {\n  .#{$prefix}--popover-content {\n    inset-block-start: 0;\n    inset-inline-end: calc(50% - $popover-offset);\n    transform: translate($popover-offset, calc(-100% - $popover-offset));\n  }\n}\n\n// rtl\n:host(#{$prefix}-tooltip-content:dir(rtl)[align='top-right']:not([autoalign])),\n:host(#{$prefix}-popover-content:dir(rtl)[align='top-right']:not([autoalign])),\n:host(#{$prefix}-toggletip:dir(rtl)[alignment='top-right']:not([autoalign])),\n:host(#{$prefix}-ai-label:dir(rtl)[alignment='top-right']:not([autoalign])),\n:host(#{$prefix}-slug[alignment='top-right']:not([autoalign])),\n:host(#{$prefix}-tooltip-content:dir(rtl)[align='top-end']:not([autoalign])),\n:host(#{$prefix}-popover-content:dir(rtl)[align='top-end']:not([autoalign])),\n:host(#{$prefix}-toggletip:dir(rtl)[alignment='top-end']:not([autoalign])),\n:host(#{$prefix}-ai-label:dir(rtl)[alignment='top-end']:not([autoalign])),\n:host(#{$prefix}-slug[alignment='top-end']:not([autoalign])) {\n  .#{$prefix}--popover-content {\n    inset-inline-start: calc(50% - $popover-offset);\n  }\n}\n\n//-----------------------------------------------------------------------------\n// Top - No Caret Spacing (non-autoalign)\n//-----------------------------------------------------------------------------\n\n:host(\n    #{$prefix}-popover-content[align='top']:not([caret]):not([autoalign]):not(\n        [tabTip]\n      )\n  ),\n:host(\n    #{$prefix}-popover-content[align='top-start']:not([caret]):not(\n        [autoalign]\n      ):not([tabTip])\n  ),\n:host(\n    #{$prefix}-popover-content[align='top-end']:not([caret]):not(\n        [autoalign]\n      ):not([tabTip])\n  ) {\n  .#{$prefix}--popover-content {\n    inset-block-start: -$spacing-02;\n  }\n}\n\n:host(\n    #{$prefix}-popover-content[align='top-start']:not([caret]):not(\n        [autoalign]\n      ):not([tabTip])\n  ),\n:host(\n    #{$prefix}-popover-content[align='top-left']:not([caret]):not(\n        [autoalign]\n      ):not([tabTip])\n  ) {\n  .#{$prefix}--popover-content {\n    inset-inline-start: calc(50% - $popover-offset - 1rem);\n  }\n}\n\n:host(\n    #{$prefix}-popover-content[align='top-end']:not([caret]):not(\n        [autoalign]\n      ):not([tabTip])\n  ),\n:host(\n    #{$prefix}-popover-content[align='top-right']:not([caret]):not(\n        [autoalign]\n      ):not([tabTip])\n  ) {\n  .#{$prefix}--popover-content {\n    inset-inline-end: calc(50% - $popover-offset - 1rem);\n  }\n}\n\n//-----------------------------------------------------------------------------\n// AutoAlign\n//-----------------------------------------------------------------------------\n\n:host(#{$prefix}-toggletip[autoalign]),\n:host(#{$prefix}-tooltip-content[autoalign]),\n:host(#{$prefix}-popover-content[autoalign]) {\n  .#{$prefix}--popover-caret {\n    block-size: 8px;\n    inline-size: 8px;\n    transform: rotate(45deg);\n  }\n}\n\n:host(#{$prefix}-ai-label[autoalign]),\n:host(#{$prefix}-slug[autoalign]),\n:host(#{$prefix}-tooltip[autoalign]),\n:host(#{$prefix}-toggletip[autoalign]),\n:host(#{$prefix}-popover[autoalign]) {\n  .#{$prefix}--popover-container {\n    position: static;\n  }\n}\n\n// autoalign caret\n:host(#{$prefix}-popover-content[open][caret][autoalign]),\n:host(#{$prefix}-tooltip-content[open][caret][autoalign]) {\n  .#{$prefix}--popover-caret {\n    &::before {\n      block-size: 8px;\n      inline-size: 8px;\n    }\n\n    &::after {\n      block-size: 8px;\n      inline-size: 8px;\n    }\n  }\n}\n\n// autoalign caret border\n:host(#{$prefix}-popover-content[border][open][caret][autoalign]) {\n  .#{$prefix}--popover-caret {\n    &::after {\n      inline-size: 7px;\n    }\n  }\n  .#{$prefix}--popover-content[align^='top'] > .#{$prefix}--popover-caret {\n    &::after {\n      inset-block-start: -1px;\n    }\n  }\n\n  .#{$prefix}--popover-content[align^='bottom'] > .#{$prefix}--popover-caret {\n    &::after {\n      inset-block-start: 1px;\n      inset-inline-start: 1px;\n    }\n  }\n\n  .#{$prefix}--popover-content[align^='left'] > .#{$prefix}--popover-caret {\n    &::after {\n      inset-block-start: 1px;\n    }\n  }\n\n  .#{$prefix}--popover-content[align^='right'] > .#{$prefix}--popover-caret {\n    &::after {\n      inset-block-start: -1px;\n      inset-inline-start: 1px;\n    }\n  }\n}\n"],"mappings":""}
+{"version":3,"file":"popover.scss.js","names":[],"sources":["../../../src/components/popover/popover.scss?lit"],"sourcesContent":["/**\n * Copyright IBM Corp. 2019, 2026\n *\n * This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n */\n$css--plex: true !default;\n\n@use '@carbon/styles/scss/config' as *;\n@use '@carbon/styles/scss/utilities' as *;\n@use '@carbon/styles/scss/utilities/convert' as *;\n@use '@carbon/styles/scss/utilities/custom-property';\n@use '@carbon/styles/scss/spacing' as *;\n@use '@carbon/styles/scss/theme';\n@use '@carbon/styles/scss/breakpoint' as *;\n@use '@carbon/styles/scss/components/popover' as *;\n\n// The distance between the popover container and the triggering element\n// Specify the distance between the popover and the trigger. This value must\n// have a unit otherwise the `calc()` expression will not work\n\n$popover-offset: custom-property.get-var('popover-offset', 0rem);\n\n// Customize the dimensions of the caret by specifying its width or height.\n// These values will be flipped in left or right directions to have the\n// correct dimensions\n$popover-caret-width: custom-property.get-var('popover-caret-width', rem(12px));\n$popover-caret-height: custom-property.get-var(\n  'popover-caret-height',\n  rem(6px)\n);\n\n// The drop shadow value used for the popover container\n$popover-drop-shadow: custom-property.get-var(\n  'popover-drop-shadow',\n  drop-shadow(0 $spacing-01 $spacing-01 rgba(0, 0, 0, 0.2))\n);\n\n// The border value used for the popover container\n$popover-border-color: custom-property.get-var(\n  'popover-border-color',\n  theme.$border-subtle\n);\n\n:host(#{$prefix}-tooltip),\n:host(#{$prefix}-popover) {\n  ::slotted(.#{$prefix}--popover--tab-tip__button) {\n    @include popover-tab-tip-button;\n\n    color: theme.$icon-primary;\n  }\n}\n\n:host(#{$prefix}-tooltip[highContrast]),\n:host(#{$prefix}-popover[highContrast]) {\n  ::slotted(#{$prefix}-tooltip-content),\n  ::slotted(#{$prefix}-popover-content) {\n    @include popover-highcontrast-base;\n  }\n}\n\n:host(\n    #{$prefix}-popover-content[backgroundToken='background']:not([highContrast])\n  ) {\n  .#{$prefix}--popover-content {\n    background: theme.$background;\n  }\n}\n\n:host(\n    #{$prefix}-popover-content[open][caret][backgroundToken='background']:not(\n        [highContrast]\n      )\n  ) {\n  .#{$prefix}--popover-caret {\n    &::after {\n      background: theme.$background;\n    }\n  }\n}\n\n:host(#{$prefix}-popover[tabTip][open]) {\n  ::slotted(.#{$prefix}--popover--tab-tip__button) {\n    background: theme.$layer !important; /* stylelint-disable-line declaration-no-important */\n    box-shadow: 0 $spacing-01 $spacing-01 rgba(0, 0, 0, 0.2);\n  }\n}\n\n:host(#{$prefix}-tooltip-content),\n:host(#{$prefix}-popover-content) {\n  @include popover-base;\n}\n\n:host(#{$prefix}-tooltip-content[open]),\n:host(#{$prefix}-popover-content[open]),\n:host(#{$prefix}-toggletip[open]),\n:host(#{$prefix}-ai-label[open]),\n:host(#{$prefix}-slug[open]) {\n  .#{$prefix}--popover-content {\n    display: block;\n  }\n}\n\n:host(#{$prefix}-popover) {\n  .#{$prefix}--popover--tab-tip__button:focus-within {\n    @include focus-outline('outline');\n  }\n}\n\n:host(#{$prefix}-tooltip-content[open][tabTip]),\n:host(#{$prefix}-popover-content[open][tabTip]) {\n  .#{$prefix}--popover-content {\n    border-radius: 0;\n  }\n}\n:host(#{$prefix}-popover[tabTip][open]) {\n  ::slotted(button[class*='#{$prefix}--popover--tab-tip__button']:not(:focus)) {\n    &::after {\n      position: absolute;\n      z-index: z('floating') + 1;\n      background: theme.$layer;\n      block-size: 2px;\n      content: '';\n      inline-size: 100%;\n      inset-block-end: 0;\n    }\n  }\n}\n\n:host(#{$prefix}-tooltip-content[open][caret]),\n:host(#{$prefix}-popover-content[open][caret]),\n:host(#{$prefix}-toggletip[open]),\n:host(#{$prefix}-ai-label[open]),\n:host(#{$prefix}-slug[open]) {\n  .#{$prefix}--popover-caret {\n    display: block;\n\n    // caret background\n    &::after {\n      position: absolute;\n      display: block;\n      background: theme.$layer;\n      content: '';\n    }\n\n    // caret border\n    &::before {\n      position: absolute;\n      display: none;\n      background-color: $popover-border-color;\n      content: '';\n    }\n  }\n}\n\n:host(#{$prefix}-tooltip-content[open][caret][highContrast]),\n:host(#{$prefix}-popover-content[open][caret][highContrast]) {\n  .#{$prefix}--popover-caret {\n    &::after {\n      background: theme.$background-inverse;\n    }\n  }\n}\n\n:host(#{$prefix}-tooltip-content[border]),\n:host(#{$prefix}-popover-content[border]) {\n  .#{$prefix}--popover-content {\n    outline: 1px solid $popover-border-color;\n    outline-offset: -1px;\n  }\n}\n\n:host(#{$prefix}-tooltip-content[dropShadow]),\n:host(#{$prefix}-popover-content[dropShadow]) {\n  .#{$prefix}--popover {\n    filter: $popover-drop-shadow;\n  }\n}\n\n:host(#{$prefix}-tooltip-content[open][caret][border]),\n:host(#{$prefix}-popover-content[open][caret][border]) {\n  .#{$prefix}--popover-caret {\n    &::before {\n      display: block;\n    }\n  }\n}\n\n//-----------------------------------------------------------------------------\n// Bottom\n//-----------------------------------------------------------------------------\n\n// bottom caret\n:host(#{$prefix}-tooltip-content[align^='bottom']:not([autoalign])),\n:host(#{$prefix}-popover-content[align^='bottom']:not([autoalign])),\n:host(#{$prefix}-toggletip[alignment^='bottom']:not([autoalign])),\n:host(#{$prefix}-ai-label[alignment^='bottom']:not([autoalign])),\n:host(#{$prefix}-slug[alignment^='bottom']:not([autoalign])) {\n  .#{$prefix}--popover-caret {\n    block-size: $popover-caret-height;\n    inline-size: $popover-caret-width;\n    inset-block-end: 0;\n    inset-inline-start: 50%;\n    transform: translate(-50%, $popover-offset);\n\n    &::after {\n      block-size: $popover-caret-height;\n      clip-path: polygon(0% 100%, 50% 0%, 100% 100%);\n      inline-size: $popover-caret-width;\n    }\n  }\n}\n\n// bottom caret border\n:host(#{$prefix}-tooltip-content[align^='bottom'][border]:not([autoalign])),\n:host(#{$prefix}-popover-content[align^='bottom'][border]:not([autoalign])),\n:host(#{$prefix}-toggletip[alignment^='bottom'][border]:not([autoalign])),\n:host(#{$prefix}-ai-label[alignment^='bottom'][border]:not([autoalign])),\n:host(#{$prefix}-slug[alignment^='bottom'][border]:not([autoalign])) {\n  .#{$prefix}--popover-caret {\n    &::before {\n      block-size: $popover-caret-height;\n      clip-path: polygon(0% 100%, 50% 0%, 100% 100%);\n      inline-size: $popover-caret-width;\n    }\n\n    &::after {\n      inline-size: calc($popover-caret-width - 1px);\n      inset-block-start: 1px;\n      inset-inline-start: 0.5px;\n    }\n  }\n}\n\n// rtl\n:host(#{$prefix}-tooltip-content:dir(rtl)[align^='bottom']:not([autoalign])),\n:host(#{$prefix}-popover-content:dir(rtl)[align^='bottom']:not([autoalign])),\n:host(#{$prefix}-toggletip:dir(rtl)[alignment^='bottom']:not([autoalign])),\n:host(#{$prefix}-ai-label:dir(rtl)[alignment^='bottom']:not([autoalign])),\n:host(#{$prefix}-slug:dir(rtl)[alignment^='bottom']:not([autoalign])) {\n  .#{$prefix}--popover-caret {\n    transform: translate(50%, $popover-offset);\n  }\n}\n\n:host(#{$prefix}-ai-label[alignment^='bottom']:not([autoalign]))\n  .#{$prefix}--popover-caret,\n:host(#{$prefix}-slug[alignment^='bottom']:not([autoalign]))\n  .#{$prefix}--popover-caret {\n  clip-path: none;\n}\n\n:host(#{$prefix}-tooltip-content[align='bottom']:not([autoalign])),\n:host(#{$prefix}-popover-content[align='bottom']:not([autoalign])),\n:host(#{$prefix}-toggletip[alignment='bottom']:not([autoalign])),\n:host(#{$prefix}-ai-label[alignment='bottom']:not([autoalign])),\n:host(#{$prefix}-slug[alignment='bottom']:not([autoalign])) {\n  .#{$prefix}--popover-content {\n    inset-block-end: 0;\n    inset-inline-start: 50%;\n    transform: translate(-50%, calc(100% + $popover-offset));\n  }\n}\n\n// rtl\n:host(#{$prefix}-tooltip-content:dir(rtl)[align='bottom']:not([autoalign])),\n:host(#{$prefix}-popover-content:dir(rtl)[align='bottom']:not([autoalign])),\n:host(#{$prefix}-toggletip:dir(rtl)[alignment='bottom']:not([autoalign])),\n:host(#{$prefix}-ai-label:dir(rtl)[alignment='bottom']:not([autoalign])),\n:host(#{$prefix}-slug:dir(rtl)[alignment='bottom']:not([autoalign])) {\n  .#{$prefix}--popover-content {\n    transform: translate(50%, calc(100% + $popover-offset));\n  }\n}\n\n:host(#{$prefix}-tooltip-content[align='bottom-left']:not([autoalign])),\n:host(#{$prefix}-popover-content[align='bottom-left']:not([autoalign])),\n:host(#{$prefix}-toggletip[alignment='bottom-left']:not([autoalign])),\n:host(#{$prefix}-ai-label[alignment='bottom-left']:not([autoalign])),\n:host(#{$prefix}-slug[alignment='bottom-left']:not([autoalign])),\n:host(#{$prefix}-tooltip-content[align='bottom-start']:not([autoalign])),\n:host(#{$prefix}-popover-content[align='bottom-start']:not([autoalign])),\n:host(#{$prefix}-toggletip[alignment='bottom-start']:not([autoalign])),\n:host(#{$prefix}-ai-label[alignment='bottom-start']:not([autoalign])),\n:host(#{$prefix}-slug[alignment='bottom-start']:not([autoalign])) {\n  .#{$prefix}--popover-content {\n    inset-block-end: 0;\n    inset-inline-start: calc(50% - $popover-offset);\n    transform: translate(\n      calc(-1 * $popover-offset),\n      calc(100% + $popover-offset)\n    );\n  }\n}\n:host(#{$prefix}-popover-content[tabTip][align='bottom-left']:not([autoalign])),\n:host(\n    #{$prefix}-popover-content[tabTip][align='bottom-start']:not([autoalign])\n  ) {\n  .#{$prefix}--popover-content {\n    inset-inline-start: 0;\n  }\n}\n\n// rtl\n:host(\n    #{$prefix}-tooltip-content:dir(rtl)[align='bottom-left']:not([autoalign])\n  ),\n:host(\n    #{$prefix}-popover-content:dir(rtl)[align='bottom-left']:not([autoalign])\n  ),\n:host(#{$prefix}-toggletip:dir(rtl)[alignment='bottom-left']:not([autoalign])),\n:host(#{$prefix}-ai-label:dir(rtl)[alignment='bottom-left']:not([autoalign])),\n:host(#{$prefix}-slug:dir(rtl)[alignment='bottom-left']:not([autoalign])),\n:host(\n    #{$prefix}-tooltip-content:dir(rtl)[align='bottom-start']:not([autoalign])\n  ),\n:host(\n    #{$prefix}-popover-content:dir(rtl)[align='bottom-start']:not([autoalign])\n  ),\n:host(#{$prefix}-toggletip:dir(rtl)[alignment='bottom-start']:not([autoalign])),\n:host(#{$prefix}-ai-label:dir(rtl)[alignment='bottom-start']:not([autoalign])),\n:host(#{$prefix}-slug:dir(rtl)[alignment='bottom-start']:not([autoalign])) {\n  .#{$prefix}--popover-content {\n    inset-inline-end: calc(50% - $popover-offset);\n    inset-inline-start: initial;\n  }\n}\n\n:host(\n    #{$prefix}-popover-content:dir(rtl)[tabTip][align='bottom-left']:not(\n        [autoalign]\n      )\n  ),\n:host(\n    #{$prefix}-popover-content:dir(rtl)[tabTip][align='bottom-start']:not(\n        [autoalign]\n      )\n  ) {\n  .#{$prefix}--popover-content {\n    inset-inline-end: 0;\n  }\n}\n\n:host(#{$prefix}-tooltip-content[align='bottom-right']:not([autoalign])),\n:host(#{$prefix}-popover-content[align='bottom-right']:not([autoalign])),\n:host(#{$prefix}-toggletip[alignment='bottom-right']:not([autoalign])),\n:host(#{$prefix}-ai-label[alignment='bottom-right']:not([autoalign])),\n:host(#{$prefix}-slug[alignment='bottom-right']:not([autoalign])),\n:host(#{$prefix}-tooltip-content[align='bottom-end']:not([autoalign])),\n:host(#{$prefix}-popover-content[align='bottom-end']:not([autoalign])),\n:host(#{$prefix}-toggletip[alignment='bottom-end']:not([autoalign])),\n:host(#{$prefix}-ai-label[alignment='bottom-end']:not([autoalign])),\n:host(#{$prefix}-slug[alignment='bottom-end']:not([autoalign])) {\n  .#{$prefix}--popover-content {\n    inset-block-end: 0;\n    inset-inline-end: calc(50% - $popover-offset);\n    transform: translate($popover-offset, calc(100% + $popover-offset));\n  }\n}\n:host(\n    #{$prefix}-popover-content[tabTip][align='bottom-right']:not([autoalign])\n  ),\n:host(#{$prefix}-popover-content[tabTip][align='bottom-end']:not([autoalign])) {\n  .#{$prefix}--popover-content {\n    inset-inline-end: 0;\n  }\n}\n\n// rtl\n:host(\n    #{$prefix}-tooltip-content:dir(rtl)[align='bottom-right']:not([autoalign])\n  ),\n:host(\n    #{$prefix}-popover-content:dir(rtl)[align='bottom-right']:not([autoalign])\n  ),\n:host(#{$prefix}-toggletip:dir(rtl)[alignment='bottom-right']:not([autoalign])),\n:host(#{$prefix}-ai-label:dir(rtl)[alignment='bottom-right']:not([autoalign])),\n:host(#{$prefix}-slug:dir(rtl)[alignment='bottom-right']:not([autoalign])),\n:host(#{$prefix}-tooltip-content:dir(rtl)[align='bottom-end']:not([autoalign])),\n:host(#{$prefix}-popover-content:dir(rtl)[align='bottom-end']:not([autoalign])),\n:host(#{$prefix}-toggletip:dir(rtl)[alignment='bottom-end']:not([autoalign])),\n:host(#{$prefix}-ai-label:dir(rtl)[alignment='bottom-end']:not([autoalign])),\n:host(#{$prefix}-slug:dir(rtl)[alignment='bottom-end']:not([autoalign])) {\n  .#{$prefix}--popover-content {\n    inset-inline-start: calc(50% - $popover-offset);\n  }\n}\n\n:host(\n    #{$prefix}-popover-content:dir(rtl)[tabTip][align='bottom-right']:not(\n        [autoalign]\n      )\n  ),\n:host(\n    #{$prefix}-popover-content:dir(rtl)[tabTip][align='bottom-end']:not(\n        [autoalign]\n      )\n  ) {\n  .#{$prefix}--popover-content {\n    inset-inline-start: 0;\n  }\n}\n\n//-----------------------------------------------------------------------------\n// Bottom - No Caret Spacing (non-autoalign)\n//-----------------------------------------------------------------------------\n\n:host(\n    #{$prefix}-popover-content[align='bottom']:not([caret]):not(\n        [autoalign]\n      ):not([tabTip])\n  ),\n:host(\n    #{$prefix}-popover-content[align='bottom-start']:not([caret]):not(\n        [autoalign]\n      ):not([tabTip])\n  ),\n:host(\n    #{$prefix}-popover-content[align='bottom-end']:not([caret]):not(\n        [autoalign]\n      ):not([tabTip])\n  ) {\n  .#{$prefix}--popover-content {\n    inset-block-end: -$spacing-02;\n  }\n}\n\n:host(\n    #{$prefix}-popover-content[align='bottom-start']:not([caret]):not(\n        [autoalign]\n      ):not([tabTip])\n  ),\n:host(\n    #{$prefix}-popover-content[align='bottom-left']:not([caret]):not(\n        [autoalign]\n      ):not([tabTip])\n  ) {\n  .#{$prefix}--popover-content {\n    inset-inline-start: calc(50% - $popover-offset - 1rem);\n  }\n}\n\n:host(\n    #{$prefix}-popover-content[align='bottom-end']:not([caret]):not(\n        [autoalign]\n      ):not([tabTip])\n  ),\n:host(\n    #{$prefix}-popover-content[align='bottom-right']:not([caret]):not(\n        [autoalign]\n      ):not([tabTip])\n  ) {\n  .#{$prefix}--popover-content {\n    inset-inline-end: calc(50% - $popover-offset - 1rem);\n  }\n}\n\n//-----------------------------------------------------------------------------\n// Left\n//-----------------------------------------------------------------------------\n\n:host(#{$prefix}-tooltip-content[align^='left']:not([autoalign])),\n:host(#{$prefix}-popover-content[align^='left']:not([autoalign])),\n:host(#{$prefix}-toggletip[alignment^='left']:not([autoalign])),\n:host(#{$prefix}-ai-label[alignment^='left']:not([autoalign])),\n:host(#{$prefix}-slug[alignment^='left']:not([autoalign])) {\n  .#{$prefix}--popover-caret {\n    block-size: $popover-caret-width;\n    inline-size: $popover-caret-height;\n    inset-block-start: 50%;\n    inset-inline-end: 100%;\n    transform: translate(calc(-1 * $popover-offset + 100%), -50%);\n\n    &::after {\n      block-size: $popover-caret-width;\n      clip-path: polygon(0% 0%, 100% 50%, 0% 100%);\n      inline-size: $popover-caret-height;\n    }\n  }\n}\n\n// left caret border\n:host(#{$prefix}-tooltip-content[align^='left'][border]:not([autoalign])),\n:host(#{$prefix}-popover-content[align^='left'][border]:not([autoalign])),\n:host(#{$prefix}-toggletip[alignment^='left'][border]:not([autoalign])),\n:host(#{$prefix}-ai-label[alignment^='left'][border]:not([autoalign])),\n:host(#{$prefix}-slug[alignment^='left'][border]:not([autoalign])) {\n  .#{$prefix}--popover-caret {\n    &::before {\n      block-size: $popover-caret-width;\n      clip-path: polygon(0% 0%, 100% 50%, 0% 100%);\n      inline-size: $popover-caret-height;\n    }\n\n    &::after {\n      inset-inline-start: -1px;\n    }\n  }\n}\n\n// rtl\n:host(#{$prefix}-tooltip-content:dir(rtl)[align^='left']:not([autoalign])),\n:host(#{$prefix}-popover-content:dir(rtl)[align^='left']:not([autoalign])),\n:host(#{$prefix}-toggletip:dir(rtl)[alignment^='left']:not([autoalign])),\n:host(#{$prefix}-ai-label:dir(rtl)[alignment^='left']:not([autoalign])),\n:host(#{$prefix}-slug:dir(rtl)[alignment^='left']:not([autoalign])) {\n  .#{$prefix}--popover-caret {\n    inset-inline-end: initial;\n    inset-inline-start: 100%;\n\n    &::after {\n      inset-inline-start: 1px;\n    }\n  }\n}\n\n:host(#{$prefix}-tooltip-content[align='left']:not([autoalign])),\n:host(#{$prefix}-popover-content[align='left']:not([autoalign])),\n:host(#{$prefix}-toggletip[alignment='left']:not([autoalign])),\n:host(#{$prefix}-ai-label[alignment='left']:not([autoalign])),\n:host(#{$prefix}-slug[alignment='left']:not([autoalign])) {\n  .#{$prefix}--popover-content {\n    inset-block-start: 50%;\n    inset-inline-end: 100%;\n    // Add in 0.1px to prevent rounding errors where the content is\n    // moved farther than the caret\n    transform: translate(calc(-1 * $popover-offset + 0.1px), -50%);\n  }\n}\n\n:host(#{$prefix}-tooltip-content[align='left-bottom']:not([autoalign])),\n:host(#{$prefix}-popover-content[align='left-bottom']:not([autoalign])),\n:host(#{$prefix}-toggletip[alignment='left-bottom']:not([autoalign])),\n:host(#{$prefix}-ai-label[alignment='left-bottom']:not([autoalign])),\n:host(#{$prefix}-slug[alignment='left-bottom']:not([autoalign])),\n:host(#{$prefix}-tooltip-content[align='left-end']:not([autoalign])),\n:host(#{$prefix}-popover-content[align='left-end']:not([autoalign])),\n:host(#{$prefix}-toggletip[alignment='left-end']:not([autoalign])),\n:host(#{$prefix}-ai-label[alignment='left-end']:not([autoalign])),\n:host(#{$prefix}-slug[alignment='left-end']:not([autoalign])) {\n  .#{$prefix}--popover-content {\n    inset-block-end: 50%;\n    inset-inline-end: 100%;\n    // Add in 0.1px to prevent rounding errors where the content is\n    // moved farther than the caret\n    transform: translate(\n      calc(-1 * $popover-offset),\n      calc(0.5 * $popover-offset + $spacing-05)\n    );\n  }\n}\n\n:host(#{$prefix}-tooltip-content[align='left-top']:not([autoalign])),\n:host(#{$prefix}-popover-content[align='left-top']:not([autoalign])),\n:host(#{$prefix}-toggletip[alignment='left-top']:not([autoalign])),\n:host(#{$prefix}-ai-label[alignment='left-top']:not([autoalign])),\n:host(#{$prefix}-slug[alignment='left-top']:not([autoalign])),\n:host(#{$prefix}-tooltip-content[align='left-start']:not([autoalign])),\n:host(#{$prefix}-popover-content[align='left-start']:not([autoalign])),\n:host(#{$prefix}-toggletip[alignment='left-start']:not([autoalign])),\n:host(#{$prefix}-ai-label[alignment='left-start']:not([autoalign])),\n:host(#{$prefix}-slug[alignment='left-start']:not([autoalign])) {\n  .#{$prefix}--popover-content {\n    inset-block-start: 50%;\n    inset-inline-end: 100%;\n    // Add in 0.1px to prevent rounding errors where the content is\n    // moved farther than the caret\n    transform: translate(\n      calc(-1 * $popover-offset),\n      calc(-1 * 0.5 * $popover-offset - $spacing-05)\n    );\n  }\n}\n\n// rtl\n:host(#{$prefix}-tooltip-content:dir(rtl)[align^='left']:not([autoalign])),\n:host(#{$prefix}-popover-content:dir(rtl)[align^='left']:not([autoalign])),\n:host(#{$prefix}-toggletip:dir(rtl)[alignment^='left']:not([autoalign])),\n:host(#{$prefix}-ai-label:dir(rtl)[alignment^='left']:not([autoalign])),\n:host(#{$prefix}-slug:dir(rtl)[alignment^='left']:not([autoalign])) {\n  .#{$prefix}--popover-content {\n    inset-inline-end: initial;\n    inset-inline-start: 100%;\n  }\n}\n\n//-----------------------------------------------------------------------------\n// Left - No Caret Spacing (non-autoalign)\n//-----------------------------------------------------------------------------\n\n:host(\n    #{$prefix}-popover-content[align='left']:not([caret]):not([autoalign]):not(\n        [tabTip]\n      )\n  ),\n:host(\n    #{$prefix}-popover-content[align='left-start']:not([caret]):not(\n        [autoalign]\n      ):not([tabTip])\n  ),\n:host(\n    #{$prefix}-popover-content[align='left-end']:not([caret]):not(\n        [autoalign]\n      ):not([tabTip])\n  ) {\n  .#{$prefix}--popover-content {\n    inset-inline-end: calc(100% + $spacing-02);\n  }\n}\n\n//-----------------------------------------------------------------------------\n// Right\n//-----------------------------------------------------------------------------\n\n// right caret\n:host(#{$prefix}-tooltip-content[align^='right']:not([autoalign])),\n:host(#{$prefix}-popover-content[align^='right']:not([autoalign])),\n:host(#{$prefix}-toggletip[alignment^='right']:not([autoalign])),\n:host(#{$prefix}-ai-label[alignment^='right']:not([autoalign])),\n:host(#{$prefix}-slug[alignment^='right']:not([autoalign])) {\n  .#{$prefix}--popover-caret {\n    block-size: $popover-caret-width;\n    inline-size: $popover-caret-height;\n    inset-block-start: 50%;\n    inset-inline-start: 100%;\n    transform: translate(calc($popover-offset - 100%), -50%);\n\n    &::after {\n      block-size: $popover-caret-width;\n      clip-path: polygon(0% 50%, 100% 0%, 100% 100%);\n      inline-size: $popover-caret-height;\n    }\n  }\n}\n\n// right caret border\n:host(#{$prefix}-tooltip-content[align^='right'][border]:not([autoalign])),\n:host(#{$prefix}-popover-content[align^='right'][border]:not([autoalign])),\n:host(#{$prefix}-toggletip[alignment^='right'][border]:not([autoalign])),\n:host(#{$prefix}-ai-label[alignment^='right'][border]:not([autoalign])),\n:host(#{$prefix}-slug[alignment^='right'][border]:not([autoalign])) {\n  .#{$prefix}--popover-caret {\n    &::before {\n      block-size: $popover-caret-width;\n      clip-path: polygon(0% 50%, 100% 0%, 100% 100%);\n      inline-size: $popover-caret-height;\n    }\n\n    &::after {\n      inset-inline-start: 1px;\n    }\n  }\n}\n\n// rtl\n:host(#{$prefix}-tooltip-content:dir(rtl)[align^='right']:not([autoalign])),\n:host(#{$prefix}-popover-content:dir(rtl)[align^='right']:not([autoalign])),\n:host(#{$prefix}-toggletip:dir(rtl)[alignment^='right']:not([autoalign])),\n:host(#{$prefix}-ai-label:dir(rtl)[alignment^='right']:not([autoalign])),\n:host(#{$prefix}-slug:dir(rtl)[alignment^='right']:not([autoalign])) {\n  .#{$prefix}--popover-caret {\n    inset-inline-end: 100%;\n    inset-inline-start: initial;\n\n    &::after {\n      inset-inline-start: -1px;\n    }\n  }\n}\n\n:host(#{$prefix}-tooltip-content[align='right']:not([autoalign])),\n:host(#{$prefix}-popover-content[align='right']:not([autoalign])),\n:host(#{$prefix}-toggletip[alignment='right']:not([autoalign])),\n:host(#{$prefix}-ai-label[alignment='right']:not([autoalign])),\n:host(#{$prefix}-slug[alignment='right']:not([autoalign])) {\n  .#{$prefix}--popover-content {\n    inset-block-start: 50%;\n    inset-inline-start: 100%;\n    // Add in 0.1px to prevent rounding errors where the content is\n    // moved farther than the caret\n    transform: translate($popover-offset, -50%);\n  }\n}\n\n:host(#{$prefix}-tooltip-content[align='right-bottom']:not([autoalign])),\n:host(#{$prefix}-popover-content[align='right-bottom']:not([autoalign])),\n:host(#{$prefix}-toggletip[alignment='right-bottom']:not([autoalign])),\n:host(#{$prefix}-ai-label[alignment='right-bottom']:not([autoalign])),\n:host(#{$prefix}-slug[alignment='right-bottom']:not([autoalign])),\n:host(#{$prefix}-tooltip-content[align='right-end']:not([autoalign])),\n:host(#{$prefix}-popover-content[align='right-end']:not([autoalign])),\n:host(#{$prefix}-toggletip[alignment='right-end']:not([autoalign])),\n:host(#{$prefix}-ai-label[alignment='right-end']:not([autoalign])),\n:host(#{$prefix}-slug[alignment='right-end']:not([autoalign])) {\n  .#{$prefix}--popover-content {\n    inset-block-end: 50%;\n    inset-inline-start: 100%;\n    transform: translate($popover-offset, calc(0.5 * $popover-offset + 16px));\n  }\n}\n\n:host(#{$prefix}-tooltip-content[align='right-top']:not([autoalign])),\n:host(#{$prefix}-popover-content[align='right-top']:not([autoalign])),\n:host(#{$prefix}-toggletip[alignment='right-top']:not([autoalign])),\n:host(#{$prefix}-ai-label[alignment='right-top']:not([autoalign])),\n:host(#{$prefix}-slug[alignment='right-top']:not([autoalign])),\n:host(#{$prefix}-tooltip-content[align='right-start']:not([autoalign])),\n:host(#{$prefix}-popover-content[align='right-start']:not([autoalign])),\n:host(#{$prefix}-toggletip[alignment='right-start']:not([autoalign])),\n:host(#{$prefix}-ai-label[alignment='right-start']:not([autoalign])),\n:host(#{$prefix}-slug[alignment='right-start']:not([autoalign])) {\n  .#{$prefix}--popover-content {\n    inset-block-start: 50%;\n    inset-inline-start: 100%;\n    transform: translate(\n      $popover-offset,\n      calc(0.5 * $popover-offset * -1 - 16px)\n    );\n  }\n}\n\n// rtl\n:host(#{$prefix}-tooltip-content:dir(rtl)[align^='right']:not([autoalign])),\n:host(#{$prefix}-popover-content:dir(rtl)[align^='right']:not([autoalign])),\n:host(#{$prefix}-toggletip:dir(rtl)[alignment^='right']:not([autoalign])),\n:host(#{$prefix}-ai-label:dir(rtl)[alignment^='right']:not([autoalign])),\n:host(#{$prefix}-slug:dir(rtl)[alignment^='right']:not([autoalign])) {\n  .#{$prefix}--popover-content {\n    inset-inline-end: 100%;\n    inset-inline-start: initial;\n  }\n}\n\n//-----------------------------------------------------------------------------\n// Right - No Caret Spacing (non-autoalign)\n//-----------------------------------------------------------------------------\n\n:host(\n    #{$prefix}-popover-content[align='right']:not([caret]):not([autoalign]):not(\n        [tabTip]\n      )\n  ),\n:host(\n    #{$prefix}-popover-content[align='right-start']:not([caret]):not(\n        [autoalign]\n      ):not([tabTip])\n  ),\n:host(\n    #{$prefix}-popover-content[align='right-end']:not([caret]):not(\n        [autoalign]\n      ):not([tabTip])\n  ) {\n  .#{$prefix}--popover-content {\n    inset-inline-start: calc(100% + $spacing-02);\n  }\n}\n\n//-----------------------------------------------------------------------------\n// Top\n//-----------------------------------------------------------------------------\n\n// top caret\n:host(#{$prefix}-tooltip-content[align^='top']:not([autoalign])),\n:host(#{$prefix}-popover-content[align^='top']:not([autoalign])),\n:host(#{$prefix}-toggletip[alignment^='top']:not([autoalign])),\n:host(#{$prefix}-ai-label[alignment^='top']:not([autoalign])),\n:host(#{$prefix}-slug[alignment^='top']:not([autoalign])) {\n  .#{$prefix}--popover-caret {\n    block-size: $popover-caret-height;\n    inline-size: $popover-caret-width;\n    inset-block-start: 0;\n    inset-inline-start: 50%;\n    transform: translate(-50%, calc(-1 * $popover-offset));\n\n    &::after {\n      block-size: $popover-caret-height;\n      clip-path: polygon(0% 0%, 50% 100%, 100% 0%);\n      inline-size: $popover-caret-width;\n    }\n  }\n}\n\n// top caret border\n:host(#{$prefix}-tooltip-content[align^='top'][border]:not([autoalign])),\n:host(#{$prefix}-popover-content[align^='top'][border]:not([autoalign])),\n:host(#{$prefix}-toggletip[alignment^='top'][border]:not([autoalign])),\n:host(#{$prefix}-ai-label[alignment^='top'][border]:not([autoalign])),\n:host(#{$prefix}-slug[alignment^='top'][border]:not([autoalign])) {\n  .#{$prefix}--popover-caret {\n    &::before {\n      block-size: $popover-caret-height;\n      clip-path: polygon(0% 0%, 50% 100%, 100% 0%);\n      inline-size: $popover-caret-width;\n    }\n\n    &::after {\n      inline-size: calc($popover-caret-width - 1px);\n      inset-block-start: -1px;\n      inset-inline-start: 0.5px;\n    }\n  }\n}\n\n// rtl\n:host(#{$prefix}-tooltip-content:dir(rtl)[align^='top']:not([autoalign])),\n:host(#{$prefix}-popover-content:dir(rtl)[align^='top']:not([autoalign])),\n:host(#{$prefix}-toggletip:dir(rtl)[alignment^='top']:not([autoalign])),\n:host(#{$prefix}-ai-label:dir(rtl)[alignment^='top']:not([autoalign])),\n:host(#{$prefix}-slug:dir(rtl)[alignment^='top']:not([autoalign])) {\n  .#{$prefix}--popover-caret {\n    transform: translate(50%, calc(-1 * $popover-offset));\n  }\n}\n\n:host(#{$prefix}-tooltip-content[align='top']:not([autoalign])),\n:host(#{$prefix}-popover-content[align='top']:not([autoalign])),\n:host(#{$prefix}-toggletip[alignment='top']:not([autoalign])),\n:host(#{$prefix}-ai-label[alignment='top']:not([autoalign])),\n:host(#{$prefix}-slug[alignment='top']:not([autoalign])) {\n  .#{$prefix}--popover-content {\n    inset-block-start: 0;\n    inset-inline-start: 50%;\n    transform: translate(-50%, calc(-100% - $popover-offset));\n  }\n}\n\n// rtl\n:host(#{$prefix}-tooltip-content:dir(rtl)[align='top']:not([autoalign])),\n:host(#{$prefix}-popover-content:dir(rtl)[align='top']:not([autoalign])),\n:host(#{$prefix}-toggletip:dir(rtl)[alignment='top']:not([autoalign])),\n:host(#{$prefix}-ai-label:dir(rtl)[alignment='top']:not([autoalign])),\n:host(#{$prefix}-slug[alignment='top']:not([autoalign])) {\n  .#{$prefix}--popover-content {\n    transform: translate(50%, calc(-100% - $popover-offset));\n  }\n}\n\n:host(#{$prefix}-tooltip-content[align='top-left']:not([autoalign])),\n:host(#{$prefix}-popover-content[align='top-left']:not([autoalign])),\n:host(#{$prefix}-toggletip[alignment='top-left']:not([autoalign])),\n:host(#{$prefix}-ai-label[alignment='top-left']:not([autoalign])),\n:host(#{$prefix}-slug[alignment='top-left']:not([autoalign])),\n:host(#{$prefix}-tooltip-content[align='top-start']:not([autoalign])),\n:host(#{$prefix}-popover-content[align='top-start']:not([autoalign])),\n:host(#{$prefix}-toggletip[alignment='top-start']:not([autoalign])),\n:host(#{$prefix}-ai-label[alignment='top-start']:not([autoalign])),\n:host(#{$prefix}-slug[alignment='top-start']:not([autoalign])) {\n  .#{$prefix}--popover-content {\n    inset-block-start: 0;\n    inset-inline-start: calc(50% - $popover-offset);\n    transform: translate(\n      calc(-1 * $popover-offset),\n      calc(-100% - $popover-offset)\n    );\n  }\n}\n\n// rtl\n:host(#{$prefix}-tooltip-content:dir(rtl)[align='top-left']:not([autoalign])),\n:host(#{$prefix}-popover-content:dir(rtl)[align='top-left']:not([autoalign])),\n:host(#{$prefix}-toggletip:dir(rtl)[alignment='top-left']:not([autoalign])),\n:host(#{$prefix}-ai-label:dir(rtl)[alignment='top-left']:not([autoalign])),\n:host(#{$prefix}-slug[alignment='top-left']:not([autoalign])),\n:host(#{$prefix}-tooltip-content:dir(rtl)[align='top-start']:not([autoalign])),\n:host(#{$prefix}-popover-content:dir(rtl)[align='top-start']:not([autoalign])),\n:host(#{$prefix}-toggletip:dir(rtl)[alignment='top-start']:not([autoalign])),\n:host(#{$prefix}-ai-label:dir(rtl)[alignment='top-start']:not([autoalign])),\n:host(#{$prefix}-slug[alignment='top-start']:not([autoalign])) {\n  .#{$prefix}--popover-content {\n    inset-inline-end: calc(50% - $popover-offset);\n    inset-inline-start: initial;\n  }\n}\n\n:host(#{$prefix}-tooltip-content[align='top-right']:not([autoalign])),\n:host(#{$prefix}-popover-content[align='top-right']:not([autoalign])),\n:host(#{$prefix}-toggletip[alignment='top-right']:not([autoalign])),\n:host(#{$prefix}-ai-label[alignment='top-right']:not([autoalign])),\n:host(#{$prefix}-slug[alignment='top-right']:not([autoalign])),\n:host(#{$prefix}-tooltip-content[align='top-end']:not([autoalign])),\n:host(#{$prefix}-popover-content[align='top-end']:not([autoalign])),\n:host(#{$prefix}-toggletip[alignment='top-end']:not([autoalign])),\n:host(#{$prefix}-ai-label[alignment='top-end']:not([autoalign])),\n:host(#{$prefix}-slug[alignment='top-end']:not([autoalign])) {\n  .#{$prefix}--popover-content {\n    inset-block-start: 0;\n    inset-inline-end: calc(50% - $popover-offset);\n    transform: translate($popover-offset, calc(-100% - $popover-offset));\n  }\n}\n\n// rtl\n:host(#{$prefix}-tooltip-content:dir(rtl)[align='top-right']:not([autoalign])),\n:host(#{$prefix}-popover-content:dir(rtl)[align='top-right']:not([autoalign])),\n:host(#{$prefix}-toggletip:dir(rtl)[alignment='top-right']:not([autoalign])),\n:host(#{$prefix}-ai-label:dir(rtl)[alignment='top-right']:not([autoalign])),\n:host(#{$prefix}-slug[alignment='top-right']:not([autoalign])),\n:host(#{$prefix}-tooltip-content:dir(rtl)[align='top-end']:not([autoalign])),\n:host(#{$prefix}-popover-content:dir(rtl)[align='top-end']:not([autoalign])),\n:host(#{$prefix}-toggletip:dir(rtl)[alignment='top-end']:not([autoalign])),\n:host(#{$prefix}-ai-label:dir(rtl)[alignment='top-end']:not([autoalign])),\n:host(#{$prefix}-slug[alignment='top-end']:not([autoalign])) {\n  .#{$prefix}--popover-content {\n    inset-inline-start: calc(50% - $popover-offset);\n  }\n}\n\n//-----------------------------------------------------------------------------\n// Top - No Caret Spacing (non-autoalign)\n//-----------------------------------------------------------------------------\n\n:host(\n    #{$prefix}-popover-content[align='top']:not([caret]):not([autoalign]):not(\n        [tabTip]\n      )\n  ),\n:host(\n    #{$prefix}-popover-content[align='top-start']:not([caret]):not(\n        [autoalign]\n      ):not([tabTip])\n  ),\n:host(\n    #{$prefix}-popover-content[align='top-end']:not([caret]):not(\n        [autoalign]\n      ):not([tabTip])\n  ) {\n  .#{$prefix}--popover-content {\n    inset-block-start: -$spacing-02;\n  }\n}\n\n:host(\n    #{$prefix}-popover-content[align='top-start']:not([caret]):not(\n        [autoalign]\n      ):not([tabTip])\n  ),\n:host(\n    #{$prefix}-popover-content[align='top-left']:not([caret]):not(\n        [autoalign]\n      ):not([tabTip])\n  ) {\n  .#{$prefix}--popover-content {\n    inset-inline-start: calc(50% - $popover-offset - 1rem);\n  }\n}\n\n:host(\n    #{$prefix}-popover-content[align='top-end']:not([caret]):not(\n        [autoalign]\n      ):not([tabTip])\n  ),\n:host(\n    #{$prefix}-popover-content[align='top-right']:not([caret]):not(\n        [autoalign]\n      ):not([tabTip])\n  ) {\n  .#{$prefix}--popover-content {\n    inset-inline-end: calc(50% - $popover-offset - 1rem);\n  }\n}\n\n//-----------------------------------------------------------------------------\n// AutoAlign\n//-----------------------------------------------------------------------------\n\n:host(#{$prefix}-toggletip[autoalign]),\n:host(#{$prefix}-tooltip-content[autoalign]),\n:host(#{$prefix}-popover-content[autoalign]) {\n  .#{$prefix}--popover-caret {\n    block-size: 8px;\n    inline-size: 8px;\n    transform: rotate(45deg);\n  }\n}\n\n:host(#{$prefix}-ai-label[autoalign]),\n:host(#{$prefix}-slug[autoalign]),\n:host(#{$prefix}-tooltip[autoalign]),\n:host(#{$prefix}-toggletip[autoalign]),\n:host(#{$prefix}-popover[autoalign]) {\n  .#{$prefix}--popover-container {\n    position: static;\n  }\n}\n\n// autoalign caret\n:host(#{$prefix}-popover-content[open][caret][autoalign]),\n:host(#{$prefix}-tooltip-content[open][caret][autoalign]) {\n  .#{$prefix}--popover-caret {\n    &::before {\n      block-size: 8px;\n      inline-size: 8px;\n    }\n\n    &::after {\n      block-size: 8px;\n      inline-size: 8px;\n    }\n  }\n}\n\n// autoalign caret border\n:host(#{$prefix}-popover-content[border][open][caret][autoalign]) {\n  .#{$prefix}--popover-caret {\n    &::after {\n      inline-size: 7px;\n    }\n  }\n  .#{$prefix}--popover-content[align^='top'] > .#{$prefix}--popover-caret {\n    &::after {\n      inset-block-start: -1px;\n    }\n  }\n\n  .#{$prefix}--popover-content[align^='bottom'] > .#{$prefix}--popover-caret {\n    &::after {\n      inset-block-start: 1px;\n      inset-inline-start: 1px;\n    }\n  }\n\n  .#{$prefix}--popover-content[align^='left'] > .#{$prefix}--popover-caret {\n    &::after {\n      inset-block-start: 1px;\n    }\n  }\n\n  .#{$prefix}--popover-content[align^='right'] > .#{$prefix}--popover-caret {\n    &::after {\n      inset-block-start: -1px;\n      inset-inline-start: 1px;\n    }\n  }\n}\n"],"mappings":""}

package/es/components/progress-bar/progress-bar.scss.js

@@ -7,7 +7,7 @@
 
 import { css } from "lit";
 //#region src/components/progress-bar/progress-bar.scss?lit
-var progress_bar_default = css([".cds--layer-one,:root{--cds-layer:var(--cds-layer-01,#f4f4f4);--cds-layer-active:var(--cds-layer-active-01,#c6c6c6);--cds-layer-background:var(--cds-layer-background-01,#fff);--cds-layer-hover:var(--cds-layer-hover-01,#e8e8e8);--cds-layer-selected:var(--cds-layer-selected-01,#e0e0e0);--cds-layer-selected-hover:var(--cds-layer-selected-hover-01,#d1d1d1);--cds-layer-accent:var(--cds-layer-accent-01,#e0e0e0);--cds-layer-accent-hover:var(--cds-layer-accent-hover-01,#d1d1d1);--cds-layer-accent-active:var(--cds-layer-accent-active-01,#a8a8a8);--cds-field:var(--cds-field-01,#f4f4f4);--cds-field-hover:var(--cds-field-hover-01,#e8e8e8);--cds-border-subtle:var(--cds-border-subtle-00,#e0e0e0);--cds-border-subtle-selected:var(--cds-border-subtle-selected-01,#c6c6c6);--cds-border-strong:var(--cds-border-strong-01,#8d8d8d);--cds-border-tile:var(--cds-border-tile-01,#c6c6c6)}.cds--layer-two{--cds-layer:var(--cds-layer-02,#fff);--cds-layer-active:var(--cds-layer-active-02,#c6c6c6);--cds-layer-background:var(--cds-layer-background-02,#f4f4f4);--cds-layer-hover:var(--cds-layer-hover-02,#e8e8e8);--cds-layer-selected:var(--cds-layer-selected-02,#e0e0e0);--cds-layer-selected-hover:var(--cds-layer-selected-hover-02,#d1d1d1);--cds-layer-accent:var(--cds-layer-accent-02,#e0e0e0);--cds-layer-accent-hover:var(--cds-layer-accent-hover-02,#d1d1d1);--cds-layer-accent-active:var(--cds-layer-accent-active-02,#a8a8a8);--cds-field:var(--cds-field-02,#fff);--cds-field-hover:var(--cds-field-hover-02,#e8e8e8);--cds-border-subtle:var(--cds-border-subtle-01,#c6c6c6);--cds-border-subtle-selected:var(--cds-border-subtle-selected-02,#c6c6c6);--cds-border-strong:var(--cds-border-strong-02,#8d8d8d);--cds-border-tile:var(--cds-border-tile-02,#a8a8a8)}.cds--layer-three{--cds-layer:var(--cds-layer-03,#f4f4f4);--cds-layer-active:var(--cds-layer-active-03,#c6c6c6);--cds-layer-background:var(--cds-layer-background-03,#fff);--cds-layer-hover:var(--cds-layer-hover-03,#e8e8e8);--cds-layer-selected:var(--cds-layer-selected-03,#e0e0e0);--cds-layer-selected-hover:var(--cds-layer-selected-hover-03,#d1d1d1);--cds-layer-accent:var(--cds-layer-accent-03,#e0e0e0);--cds-layer-accent-hover:var(--cds-layer-accent-hover-03,#d1d1d1);--cds-layer-accent-active:var(--cds-layer-accent-active-03,#a8a8a8);--cds-field:var(--cds-field-03,#f4f4f4);--cds-field-hover:var(--cds-field-hover-03,#e8e8e8);--cds-border-subtle:var(--cds-border-subtle-02,#e0e0e0);--cds-border-subtle-selected:var(--cds-border-subtle-selected-03,#c6c6c6);--cds-border-strong:var(--cds-border-strong-03,#8d8d8d);--cds-border-tile:var(--cds-border-tile-03,#c6c6c6)}.cds--layer-one.cds--layer__with-background,.cds--layer-three.cds--layer__with-background,.cds--layer-two.cds--layer__with-background{background-color:var(--cds-layer-background)}.cds--assistive-text,.cds--visually-hidden{position:absolute;overflow:hidden;padding:0;border:0;margin:-1px;block-size:1px;clip:rect(0,0,0,0);inline-size:1px;visibility:inherit;white-space:nowrap}.cds--layout--size-xs{--cds-layout-size-height-context:var(--cds-layout-size-height-xs,1.5rem);--cds-layout-size-height:var(--cds-layout-size-height-context)}.cds--layout-constraint--size__default-xs{--cds-layout-size-height:var(--cds-layout-size-height-context,var(--cds-layout-size-height-xs,1.5rem))}.cds--layout-constraint--size__min-xs{--cds-layout-size-height-min:var(--cds-layout-size-height-xs,1.5rem)}.cds--layout-constraint--size__max-xs{--cds-layout-size-height-max:var(--cds-layout-size-height-xs,1.5rem)}.cds--layout--size-sm{--cds-layout-size-height-context:var(--cds-layout-size-height-sm,2rem);--cds-layout-size-height:var(--cds-layout-size-height-context)}.cds--layout-constraint--size__default-sm{--cds-layout-size-height:var(--cds-layout-size-height-context,var(--cds-layout-size-height-sm,2rem))}.cds--layout-constraint--size__min-sm{--cds-layout-size-height-min:var(--cds-layout-size-height-sm,2rem)}.cds--layout-constraint--size__max-sm{--cds-layout-size-height-max:var(--cds-layout-size-height-sm,2rem)}.cds--layout--size-md{--cds-layout-size-height-context:var(--cds-layout-size-height-md,2.5rem);--cds-layout-size-height:var(--cds-layout-size-height-context)}.cds--layout-constraint--size__default-md{--cds-layout-size-height:var(--cds-layout-size-height-context,var(--cds-layout-size-height-md,2.5rem))}.cds--layout-constraint--size__min-md{--cds-layout-size-height-min:var(--cds-layout-size-height-md,2.5rem)}.cds--layout-constraint--size__max-md{--cds-layout-size-height-max:var(--cds-layout-size-height-md,2.5rem)}.cds--layout--size-lg{--cds-layout-size-height-context:var(--cds-layout-size-height-lg,3rem);--cds-layout-size-height:var(--cds-layout-size-height-context)}.cds--layout-constraint--size__default-lg{--cds-layout-size-height:var(--cds-layout-size-height-context,var(--cds-layout-size-height-lg,3rem))}.cds--layout-constraint--size__min-lg{--cds-layout-size-height-min:var(--cds-layout-size-height-lg,3rem)}.cds--layout-constraint--size__max-lg{--cds-layout-size-height-max:var(--cds-layout-size-height-lg,3rem)}.cds--layout--size-xl{--cds-layout-size-height-context:var(--cds-layout-size-height-xl,4rem);--cds-layout-size-height:var(--cds-layout-size-height-context)}.cds--layout-constraint--size__default-xl{--cds-layout-size-height:var(--cds-layout-size-height-context,var(--cds-layout-size-height-xl,4rem))}.cds--layout-constraint--size__min-xl{--cds-layout-size-height-min:var(--cds-layout-size-height-xl,4rem)}.cds--layout-constraint--size__max-xl{--cds-layout-size-height-max:var(--cds-layout-size-height-xl,4rem)}.cds--layout--size-2xl{--cds-layout-size-height-context:var(--cds-layout-size-height-2xl,5rem);--cds-layout-size-height:var(--cds-layout-size-height-context)}.cds--layout-constraint--size__default-2xl{--cds-layout-size-height:var(--cds-layout-size-height-context,var(--cds-layout-size-height-2xl,5rem))}.cds--layout-constraint--size__min-2xl{--cds-layout-size-height-min:var(--cds-layout-size-height-2xl,5rem)}.cds--layout-constraint--size__max-2xl{--cds-layout-size-height-max:var(--cds-layout-size-height-2xl,5rem)}.cds--layout--density-condensed{--cds-layout-density-padding-inline-context:var(--cds-layout-density-padding-inline-condensed,0.5rem);--cds-layout-density-padding-inline:var(--cds-layout-density-padding-inline-context)}.cds--layout-constraint--density__default-condensed{--cds-layout-density-padding-inline:var(--cds-layout-density-padding-inline-context,var(--cds-layout-density-padding-inline-condensed,0.5rem))}.cds--layout-constraint--density__min-condensed{--cds-layout-density-padding-inline-min:var(--cds-layout-density-padding-inline-condensed,0.5rem)}.cds--layout-constraint--density__max-condensed{--cds-layout-density-padding-inline-max:var(--cds-layout-density-padding-inline-condensed,0.5rem)}.cds--layout--density-normal{--cds-layout-density-padding-inline-context:var(--cds-layout-density-padding-inline-normal,1rem);--cds-layout-density-padding-inline:var(--cds-layout-density-padding-inline-context)}.cds--layout-constraint--density__default-normal{--cds-layout-density-padding-inline:var(--cds-layout-density-padding-inline-context,var(--cds-layout-density-padding-inline-normal,1rem))}.cds--layout-constraint--density__min-normal{--cds-layout-density-padding-inline-min:var(--cds-layout-density-padding-inline-normal,1rem)}.cds--layout-constraint--density__max-normal{--cds-layout-density-padding-inline-max:var(--cds-layout-density-padding-inline-normal,1rem)}:root{--cds-layout-size-height-xs:1.5rem;--cds-layout-size-height-sm:2rem;--cds-layout-size-height-md:2.5rem;--cds-layout-size-height-lg:3rem;--cds-layout-size-height-xl:4rem;--cds-layout-size-height-2xl:5rem;--cds-layout-size-height-min:0px;--cds-layout-size-height-max:999999999px;--cds-layout-density-padding-inline-condensed:0.5rem;--cds-layout-density-padding-inline-normal:1rem;--cds-layout-density-padding-inline-min:0px;--cds-layout-density-padding-inline-max:999999999px}.cds--progress-bar{--cds-layout-density-padding-inline-local:clamp(var(--cds-layout-density-padding-inline-min),var(--cds-layout-density-padding-inline,var(--cds-layout-density-padding-inline-normal)),var(--cds-layout-density-padding-inline-max))}.cds--progress-bar__label{font-size:var(--cds-body-compact-01-font-size,.875rem);font-weight:var(--cds-body-compact-01-font-weight,400);line-height:var(--cds-body-compact-01-line-height,1.28572);letter-spacing:var(--cds-body-compact-01-letter-spacing,.16px);display:flex;justify-content:space-between;color:var(--cds-text-primary,#161616);margin-block-end:.5rem;min-inline-size:3rem}.cds--progress-bar__label-text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.cds--progress-bar__track{position:relative;background-color:var(--cds-border-subtle);block-size:.5rem;inline-size:100%;min-inline-size:3rem}.cds--progress-bar--big .cds--progress-bar__track{block-size:.5rem}.cds--progress-bar--small .cds--progress-bar__track{block-size:.25rem}.cds--progress-bar__bar{display:block;background-color:currentColor;block-size:100%;color:var(--cds-interactive,#0f62fe);inline-size:100%;transform:scaleX(0);transform-origin:0 center;transition:transform .11s cubic-bezier(.2,0,.38,.9)}[dir=rtl] .cds--progress-bar__bar{transform-origin:100% center}.cds--progress-bar--indeterminate .cds--progress-bar__track:after{position:absolute;animation-duration:1.4s;animation-iteration-count:infinite;animation-name:cds--progress-bar-indeterminate;animation-timing-function:linear;background-image:linear-gradient(90deg,var(--cds-interactive,#0f62fe) 12.5%,transparent 12.5%);background-position-x:0;background-size:200% 100%;content:\"\";inset:0}[dir=rtl] .cds--progress-bar--indeterminate .cds--progress-bar__track:after{animation-name:cds--progress-bar-indeterminate-rtl}.cds--progress-bar__helper-text{font-size:var(--cds-helper-text-01-font-size,.75rem);line-height:var(--cds-helper-text-01-line-height,1.33333);letter-spacing:var(--cds-helper-text-01-letter-spacing,.32px);color:var(--cds-text-secondary,#525252);margin-block-start:.5rem}.cds--progress-bar__status-icon{flex-shrink:0;margin-inline-start:var(--cds-layout-density-padding-inline-local)}.cds--progress-bar--finished .cds--progress-bar__bar,.cds--progress-bar--finished .cds--progress-bar__status-icon{color:var(--cds-support-success,#24a148)}.cds--progress-bar--error .cds--progress-bar__bar,.cds--progress-bar--error .cds--progress-bar__status-icon{color:var(--cds-support-error,#da1e28)}.cds--progress-bar--error .cds--progress-bar__helper-text{color:var(--cds-text-error,#da1e28)}.cds--progress-bar--error .cds--progress-bar__bar,.cds--progress-bar--finished .cds--progress-bar__bar{transform:scaleX(1)}.cds--progress-bar--error.cds--progress-bar--inline .cds--progress-bar__track,.cds--progress-bar--finished.cds--progress-bar--inline .cds--progress-bar__track{position:absolute;overflow:hidden;padding:0;border:0;margin:-1px;block-size:1px;clip:rect(0,0,0,0);inline-size:1px;visibility:inherit;white-space:nowrap}.cds--progress-bar--error.cds--progress-bar--inline .cds--progress-bar__label,.cds--progress-bar--finished.cds--progress-bar--inline .cds--progress-bar__label{flex-shrink:1;justify-content:flex-start;margin-inline-end:0}@keyframes cds--progress-bar-indeterminate{0%{background-position-x:25%}80%,to{background-position-x:-105%}}@keyframes cds--progress-bar-indeterminate-rtl{0%{background-position-x:-105%}80%,to{background-position-x:25%}}.cds--progress-bar--inline{display:flex;align-items:center}.cds--progress-bar--inline .cds--progress-bar__label{flex-shrink:0;margin-block-end:0;margin-inline-end:var(--cds-layout-density-padding-inline-local)}.cds--progress-bar--inline .cds--progress-bar__track{flex-basis:0;flex-grow:1}.cds--progress-bar--inline .cds--progress-bar__helper-text{position:absolute;overflow:hidden;padding:0;border:0;margin:-1px;block-size:1px;clip:rect(0,0,0,0);inline-size:1px;visibility:inherit;white-space:nowrap}.cds--progress-bar--indented .cds--progress-bar__helper-text,.cds--progress-bar--indented .cds--progress-bar__label{padding-inline:var(--cds-layout-density-padding-inline-local)}@media (forced-colors:active),screen and (-ms-high-contrast:active){.cds--progress-bar__track{background-color:Canvas;forced-color-adjust:none;outline:2px solid transparent;outline-offset:-2px}.cds--progress-bar__bar{background-color:CanvasText}}:host(cds-progress-bar) .cds--progress-bar--inline .cds--progress-bar__label{margin-inline-end:1rem}:host(cds-progress-bar) .cds--progress-bar--indented .cds--progress-bar__helper-text,:host(cds-progress-bar) .cds--progress-bar--indented .cds--progress-bar__label{padding-inline:1rem}"]);
+var progress_bar_default = css([".cds--layer-one,:root{--cds-layer:var(--cds-layer-01,#f4f4f4);--cds-layer-active:var(--cds-layer-active-01,#c6c6c6);--cds-layer-background:var(--cds-layer-background-01,#fff);--cds-layer-hover:var(--cds-layer-hover-01,#e8e8e8);--cds-layer-selected:var(--cds-layer-selected-01,#e0e0e0);--cds-layer-selected-hover:var(--cds-layer-selected-hover-01,#d1d1d1);--cds-layer-accent:var(--cds-layer-accent-01,#e0e0e0);--cds-layer-accent-hover:var(--cds-layer-accent-hover-01,#d1d1d1);--cds-layer-accent-active:var(--cds-layer-accent-active-01,#a8a8a8);--cds-field:var(--cds-field-01,#f4f4f4);--cds-field-hover:var(--cds-field-hover-01,#e8e8e8);--cds-border-subtle:var(--cds-border-subtle-00,#e0e0e0);--cds-border-subtle-selected:var(--cds-border-subtle-selected-01,#c6c6c6);--cds-border-strong:var(--cds-border-strong-01,#8d8d8d);--cds-border-tile:var(--cds-border-tile-01,#c6c6c6)}.cds--layer-two{--cds-layer:var(--cds-layer-02,#fff);--cds-layer-active:var(--cds-layer-active-02,#c6c6c6);--cds-layer-background:var(--cds-layer-background-02,#f4f4f4);--cds-layer-hover:var(--cds-layer-hover-02,#e8e8e8);--cds-layer-selected:var(--cds-layer-selected-02,#e0e0e0);--cds-layer-selected-hover:var(--cds-layer-selected-hover-02,#d1d1d1);--cds-layer-accent:var(--cds-layer-accent-02,#e0e0e0);--cds-layer-accent-hover:var(--cds-layer-accent-hover-02,#d1d1d1);--cds-layer-accent-active:var(--cds-layer-accent-active-02,#a8a8a8);--cds-field:var(--cds-field-02,#fff);--cds-field-hover:var(--cds-field-hover-02,#e8e8e8);--cds-border-subtle:var(--cds-border-subtle-01,#c6c6c6);--cds-border-subtle-selected:var(--cds-border-subtle-selected-02,#c6c6c6);--cds-border-strong:var(--cds-border-strong-02,#8d8d8d);--cds-border-tile:var(--cds-border-tile-02,#a8a8a8)}.cds--layer-three{--cds-layer:var(--cds-layer-03,#f4f4f4);--cds-layer-active:var(--cds-layer-active-03,#c6c6c6);--cds-layer-background:var(--cds-layer-background-03,#fff);--cds-layer-hover:var(--cds-layer-hover-03,#e8e8e8);--cds-layer-selected:var(--cds-layer-selected-03,#e0e0e0);--cds-layer-selected-hover:var(--cds-layer-selected-hover-03,#d1d1d1);--cds-layer-accent:var(--cds-layer-accent-03,#e0e0e0);--cds-layer-accent-hover:var(--cds-layer-accent-hover-03,#d1d1d1);--cds-layer-accent-active:var(--cds-layer-accent-active-03,#a8a8a8);--cds-field:var(--cds-field-03,#f4f4f4);--cds-field-hover:var(--cds-field-hover-03,#e8e8e8);--cds-border-subtle:var(--cds-border-subtle-02,#e0e0e0);--cds-border-subtle-selected:var(--cds-border-subtle-selected-03,#c6c6c6);--cds-border-strong:var(--cds-border-strong-03,#8d8d8d);--cds-border-tile:var(--cds-border-tile-03,#c6c6c6)}.cds--layer-one.cds--layer__with-background,.cds--layer-three.cds--layer__with-background,.cds--layer-two.cds--layer__with-background{background-color:var(--cds-layer-background)}.cds--assistive-text,.cds--visually-hidden{position:absolute;overflow:hidden;padding:0;border:0;margin:-1px;block-size:1px;clip:rect(0,0,0,0);inline-size:1px;visibility:inherit;white-space:nowrap}.cds--progress-bar{--cds-layout-density-padding-inline-local:clamp(var(--cds-layout-density-padding-inline-min),var(--cds-layout-density-padding-inline,var(--cds-layout-density-padding-inline-normal)),var(--cds-layout-density-padding-inline-max))}.cds--progress-bar__label{font-size:var(--cds-body-compact-01-font-size,.875rem);font-weight:var(--cds-body-compact-01-font-weight,400);line-height:var(--cds-body-compact-01-line-height,1.28572);letter-spacing:var(--cds-body-compact-01-letter-spacing,.16px);display:flex;justify-content:space-between;color:var(--cds-text-primary,#161616);margin-block-end:.5rem;min-inline-size:3rem}.cds--progress-bar__label-text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.cds--progress-bar__track{position:relative;background-color:var(--cds-border-subtle);block-size:.5rem;inline-size:100%;min-inline-size:3rem}.cds--progress-bar--big .cds--progress-bar__track{block-size:.5rem}.cds--progress-bar--small .cds--progress-bar__track{block-size:.25rem}.cds--progress-bar__bar{display:block;background-color:currentColor;block-size:100%;color:var(--cds-interactive,#0f62fe);inline-size:100%;transform:scaleX(0);transform-origin:0 center;transition:transform .11s cubic-bezier(.2,0,.38,.9)}[dir=rtl] .cds--progress-bar__bar{transform-origin:100% center}.cds--progress-bar--indeterminate .cds--progress-bar__track:after{position:absolute;animation-duration:1.4s;animation-iteration-count:infinite;animation-name:cds--progress-bar-indeterminate;animation-timing-function:linear;background-image:linear-gradient(90deg,var(--cds-interactive,#0f62fe) 12.5%,transparent 12.5%);background-position-x:0;background-size:200% 100%;content:\"\";inset:0}[dir=rtl] .cds--progress-bar--indeterminate .cds--progress-bar__track:after{animation-name:cds--progress-bar-indeterminate-rtl}.cds--progress-bar__helper-text{font-size:var(--cds-helper-text-01-font-size,.75rem);line-height:var(--cds-helper-text-01-line-height,1.33333);letter-spacing:var(--cds-helper-text-01-letter-spacing,.32px);color:var(--cds-text-secondary,#525252);margin-block-start:.5rem}.cds--progress-bar__status-icon{flex-shrink:0;margin-inline-start:var(--cds-layout-density-padding-inline-local)}.cds--progress-bar--finished .cds--progress-bar__bar,.cds--progress-bar--finished .cds--progress-bar__status-icon{color:var(--cds-support-success,#24a148)}.cds--progress-bar--error .cds--progress-bar__bar,.cds--progress-bar--error .cds--progress-bar__status-icon{color:var(--cds-support-error,#da1e28)}.cds--progress-bar--error .cds--progress-bar__helper-text{color:var(--cds-text-error,#da1e28)}.cds--progress-bar--error .cds--progress-bar__bar,.cds--progress-bar--finished .cds--progress-bar__bar{transform:scaleX(1)}.cds--progress-bar--error.cds--progress-bar--inline .cds--progress-bar__track,.cds--progress-bar--finished.cds--progress-bar--inline .cds--progress-bar__track{position:absolute;overflow:hidden;padding:0;border:0;margin:-1px;block-size:1px;clip:rect(0,0,0,0);inline-size:1px;visibility:inherit;white-space:nowrap}.cds--progress-bar--error.cds--progress-bar--inline .cds--progress-bar__label,.cds--progress-bar--finished.cds--progress-bar--inline .cds--progress-bar__label{flex-shrink:1;justify-content:flex-start;margin-inline-end:0}@keyframes cds--progress-bar-indeterminate{0%{background-position-x:25%}80%,to{background-position-x:-105%}}@keyframes cds--progress-bar-indeterminate-rtl{0%{background-position-x:-105%}80%,to{background-position-x:25%}}.cds--progress-bar--inline{display:flex;align-items:center}.cds--progress-bar--inline .cds--progress-bar__label{flex-shrink:0;margin-block-end:0;margin-inline-end:var(--cds-layout-density-padding-inline-local)}.cds--progress-bar--inline .cds--progress-bar__track{flex-basis:0;flex-grow:1}.cds--progress-bar--inline .cds--progress-bar__helper-text{position:absolute;overflow:hidden;padding:0;border:0;margin:-1px;block-size:1px;clip:rect(0,0,0,0);inline-size:1px;visibility:inherit;white-space:nowrap}.cds--progress-bar--indented .cds--progress-bar__helper-text,.cds--progress-bar--indented .cds--progress-bar__label{padding-inline:var(--cds-layout-density-padding-inline-local)}@media (forced-colors:active),screen and (-ms-high-contrast:active){.cds--progress-bar__track{background-color:Canvas;forced-color-adjust:none;outline:2px solid transparent;outline-offset:-2px}.cds--progress-bar__bar{background-color:CanvasText}}:host(cds-progress-bar) .cds--progress-bar--inline .cds--progress-bar__label{margin-inline-end:1rem}:host(cds-progress-bar) .cds--progress-bar--indented .cds--progress-bar__helper-text,:host(cds-progress-bar) .cds--progress-bar--indented .cds--progress-bar__label{padding-inline:1rem}"]);
 //#endregion
 export { progress_bar_default as default };